diff --git a/.changeset/.prettierrc.json b/.changeset/.prettierrc.json
new file mode 100644
index 00000000..544138be
--- /dev/null
+++ b/.changeset/.prettierrc.json
@@ -0,0 +1,3 @@
+{
+  "singleQuote": true
+}
diff --git a/.changeset/fancy-ears-walk.md b/.changeset/fancy-ears-walk.md
new file mode 100644
index 00000000..f73cb596
--- /dev/null
+++ b/.changeset/fancy-ears-walk.md
@@ -0,0 +1,7 @@
+---
+'@vben/styles': patch
+'@vben-core/form-ui': patch
+'@vben/web-naive': patch
+---
+
+feat(@core/form-ui): 新增 useVbenForm 数组编辑器 VbenFormFieldArray
diff --git a/.cursor/rules/Code-Standards.mdc b/.cursor/rules/Code-Standards.mdc
index cdd0c377..5400dfa9 100644
--- a/.cursor/rules/Code-Standards.mdc
+++ b/.cursor/rules/Code-Standards.mdc
@@ -10,6 +10,7 @@ alwaysApply: true
 3. 有封装好的方法、组件需要复用，不要重复造轮子
 4. 小程序端的抽屉全部需要用 page-container 来防止用户意外退出页面（记得使用 v-if 而不是 v-show）
 5. 数据库的（created_at、updated_at、deleted_at）统一使用时间戳，不要使用字符串，并且我在查询器中一级格式化成字符串了，无需再次格式化
+6. 卡片强调样式：**禁止**用左侧竖色条（`border-left: Npx solid 色值` / 左侧色块）做卡片强调或分类标识；统一用「1px 同色系边框 + 微光」——`border: 1px solid hsl(var(--主题色) / 30%)` 配 `box-shadow: 0 0 6px hsl(var(--主题色) / 18%)`；历史页面暂不强制回改，新增/改动的卡片必须遵守
 
 # 全局架构规范
 
diff --git a/.gitattributes b/.gitattributes
index d4e5bd3e..775caa34 100644
--- a/.gitattributes
+++ b/.gitattributes
@@ -4,8 +4,18 @@
 * text=auto eol=lf
 
 # Declare files that will always have CRLF line endings on checkout.
-*.{cmd,[cC][mM][dD]} text eol=crlf
-*.{bat,[bB][aA][tT]} text eol=crlf
+*.cmd text eol=crlf
+*.[cC][mM][dD] text eol=crlf
+*.bat text eol=crlf
+*.[bB][aA][tT] text eol=crlf
 
 # Denote all files that are truly binary and should not be modified.
-*.{ico,png,jpg,jpeg,gif,webp,svg,woff,woff2} binary
\ No newline at end of file
+*.ico binary
+*.png binary
+*.jpg binary
+*.jpeg binary
+*.gif binary
+*.webp binary
+*.svg binary
+*.woff binary
+*.woff2 binary
\ No newline at end of file
diff --git a/.github/CODEOWNERS b/.github/CODEOWNERS
index 9fd86547..b95ff946 100644
--- a/.github/CODEOWNERS
+++ b/.github/CODEOWNERS
@@ -1,14 +1,14 @@
 # default onwer
-* anncwb@126.com vince292007@gmail.com netfan@foxmail.com
+* anncwb@126.com vince292007@gmail.com netfan@foxmail.com jinmao88@qq.com
 
 # vben core onwer
-/.github/ anncwb@126.com vince292007@gmail.com netfan@foxmail.com
-/.vscode/ anncwb@126.com vince292007@gmail.com netfan@foxmail.com
-/packages/ anncwb@126.com vince292007@gmail.com netfan@foxmail.com
-/packages/@core/ anncwb@126.com vince292007@gmail.com netfan@foxmail.com
-/internal/ anncwb@126.com vince292007@gmail.com netfan@foxmail.com
-/scripts/ anncwb@126.com vince292007@gmail.com netfan@foxmail.com
+/.github/ anncwb@126.com vince292007@gmail.com netfan@foxmail.com jinmao88@qq.com
+/.vscode/ anncwb@126.com vince292007@gmail.com netfan@foxmail.com jinmao88@qq.com
+/packages/ anncwb@126.com vince292007@gmail.com netfan@foxmail.com jinmao88@qq.com
+/packages/@core/ anncwb@126.com vince292007@gmail.com netfan@foxmail.com jinmao88@qq.com
+/internal/ anncwb@126.com vince292007@gmail.com netfan@foxmail.com jinmao88@qq.com
+/scripts/ anncwb@126.com vince292007@gmail.com netfan@foxmail.com jinmao88@qq.com
 
 # vben team onwer
-apps/ anncwb@126.com vince292007@gmail.com netfan@foxmail.com @vbenjs/team-v5
-docs/ anncwb@126.com vince292007@gmail.com netfan@foxmail.com @vbenjs/team-v5
+apps/ anncwb@126.com vince292007@gmail.com netfan@foxmail.com @vbenjs/team-v5 jinmao88@qq.com
+docs/ anncwb@126.com vince292007@gmail.com netfan@foxmail.com @vbenjs/team-v5 jinmao88@qq.com
diff --git a/.github/actions/setup-node/action.yml b/.github/actions/setup-node/action.yml
index 35fa41c8..445f30be 100644
--- a/.github/actions/setup-node/action.yml
+++ b/.github/actions/setup-node/action.yml
@@ -6,10 +6,10 @@ runs:
   using: 'composite'
   steps:
     - name: Install pnpm
-      uses: pnpm/action-setup@v4
+      uses: pnpm/action-setup@v6
 
     - name: Install Node.js
-      uses: actions/setup-node@v4
+      uses: actions/setup-node@v6
       with:
         node-version-file: .node-version
         cache: 'pnpm'
diff --git a/.github/config.yml b/.github/config.yml
index 52454840..248da6a5 100644
--- a/.github/config.yml
+++ b/.github/config.yml
@@ -21,12 +21,10 @@ newPRWelcomeComment: |
 firstPRMergeComment: >
   Thanks for your contribution!  🎉🎉🎉
 
-
 # Comment to be posted to on first time issues
 newIssueWelcomeComment: >
   Thanks for opening your first issue! Be sure to follow the issue template and provide every bit of information to help the developers!
 
-
 # *OPTIONAL* default titles to check against for lack of descriptiveness
 # MUST BE ALL LOWERCASE
 requestInfoDefaultTitles:
@@ -36,4 +34,3 @@ requestInfoDefaultTitles:
 # *Required* Comment to reply with
 requestInfoReplyComment: >
   Thanks for filing this issue/PR! It would be much appreciated if you could provide us with more information so we can effectively analyze the situation in context.
-
diff --git a/.github/contributing.md b/.github/contributing.md
index f22370f3..304c5192 100644
--- a/.github/contributing.md
+++ b/.github/contributing.md
@@ -19,11 +19,9 @@ Project maintainers have the right and responsibility to remove, edit, or reject
 - Checkout a topic branch from the relevant branch, e.g. main, and merge back against that branch.
 
 - If adding a new feature:
-
   - Provide a convincing reason to add this feature. Ideally, you should open a suggestion issue first and have it approved before working on it.
 
 - If fixing bug:
-
   - Provide a detailed description of the bug in the PR. Live demo preferred.
 
 - It's OK to have multiple small commits as you work on the PR - GitHub can automatically squash them before merging.
diff --git a/.github/workflows/build.yml b/.github/workflows/build.yml
index d9f48e4a..b81bc4ad 100644
--- a/.github/workflows/build.yml
+++ b/.github/workflows/build.yml
@@ -30,7 +30,7 @@ jobs:
           - windows-latest
     steps:
       - name: Checkout code
-        uses: actions/checkout@v4
+        uses: actions/checkout@v7
         with:
           fetch-depth: 0
 
diff --git a/.github/workflows/changeset-version.yml b/.github/workflows/changeset-version.yml
index 373d9af2..32421e26 100644
--- a/.github/workflows/changeset-version.yml
+++ b/.github/workflows/changeset-version.yml
@@ -25,7 +25,7 @@ jobs:
 
     steps:
       - name: Checkout code
-        uses: actions/checkout@v4
+        uses: actions/checkout@v7
         with:
           fetch-depth: 0
 
diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml
index 00750949..254ffd8e 100644
--- a/.github/workflows/ci.yml
+++ b/.github/workflows/ci.yml
@@ -28,12 +28,12 @@ jobs:
     timeout-minutes: 20
     steps:
       - name: Checkout code
-        uses: actions/checkout@v4
+        uses: actions/checkout@v7
         with:
           fetch-depth: 0
 
       - name: Install pnpm
-        uses: pnpm/action-setup@v4
+        uses: pnpm/action-setup@v6
         with:
           run_install: false
 
@@ -67,7 +67,7 @@ jobs:
 
     steps:
       - name: Checkout code
-        uses: actions/checkout@v4
+        uses: actions/checkout@v7
         with:
           fetch-depth: 0
 
@@ -90,7 +90,7 @@ jobs:
           - windows-latest
     steps:
       - name: Checkout code
-        uses: actions/checkout@v4
+        uses: actions/checkout@v7
         with:
           fetch-depth: 0
 
diff --git a/.github/workflows/codeql.yml b/.github/workflows/codeql.yml
index 69a990f0..4824318e 100644
--- a/.github/workflows/codeql.yml
+++ b/.github/workflows/codeql.yml
@@ -57,11 +57,11 @@ jobs:
         # your codebase is analyzed, see https://docs.github.com/en/code-security/code-scanning/creating-an-advanced-setup-for-code-scanning/codeql-code-scanning-for-compiled-languages
     steps:
       - name: Checkout repository
-        uses: actions/checkout@v4
+        uses: actions/checkout@v7
 
       # Initializes the CodeQL tools for scanning.
       - name: Initialize CodeQL
-        uses: github/codeql-action/init@v3
+        uses: github/codeql-action/init@v4
         with:
           languages: ${{ matrix.language }}
           build-mode: ${{ matrix.build-mode }}
@@ -89,6 +89,6 @@ jobs:
           exit 1
 
       - name: Perform CodeQL Analysis
-        uses: github/codeql-action/analyze@v3
+        uses: github/codeql-action/analyze@v4
         with:
           category: '/language:${{matrix.language}}'
diff --git a/.github/workflows/deploy.yml b/.github/workflows/deploy.yml
index 533a87c3..8c12d408 100644
--- a/.github/workflows/deploy.yml
+++ b/.github/workflows/deploy.yml
@@ -12,7 +12,7 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - name: Checkout code
-        uses: actions/checkout@v4
+        uses: actions/checkout@v7
         with:
           fetch-depth: 0
 
@@ -30,7 +30,7 @@ jobs:
         run: pnpm build:play
 
       - name: Sync Playground files
-        uses: SamKirkland/FTP-Deploy-Action@v4.3.5
+        uses: SamKirkland/FTP-Deploy-Action@v4.4.0
         with:
           server: ${{ secrets.PRO_FTP_HOST }}
           username: ${{ secrets.WEB_PLAYGROUND_FTP_ACCOUNT }}
@@ -43,7 +43,7 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - name: Checkout code
-        uses: actions/checkout@v4
+        uses: actions/checkout@v7
         with:
           fetch-depth: 0
 
@@ -54,7 +54,7 @@ jobs:
         run: pnpm build:docs
 
       - name: Sync Docs files
-        uses: SamKirkland/FTP-Deploy-Action@v4.3.5
+        uses: SamKirkland/FTP-Deploy-Action@v4.4.0
         with:
           server: ${{ secrets.PRO_FTP_HOST }}
           username: ${{ secrets.WEBSITE_FTP_ACCOUNT }}
@@ -67,7 +67,7 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - name: Checkout code
-        uses: actions/checkout@v4
+        uses: actions/checkout@v7
         with:
           fetch-depth: 0
 
@@ -85,7 +85,7 @@ jobs:
         run: pnpm run build:antd
 
       - name: Sync files
-        uses: SamKirkland/FTP-Deploy-Action@v4.3.5
+        uses: SamKirkland/FTP-Deploy-Action@v4.4.0
         with:
           server: ${{ secrets.PRO_FTP_HOST }}
           username: ${{ secrets.WEB_ANTD_FTP_ACCOUNT }}
@@ -98,7 +98,7 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - name: Checkout code
-        uses: actions/checkout@v4
+        uses: actions/checkout@v7
         with:
           fetch-depth: 0
 
@@ -116,7 +116,7 @@ jobs:
         run: pnpm run build:ele
 
       - name: Sync files
-        uses: SamKirkland/FTP-Deploy-Action@v4.3.5
+        uses: SamKirkland/FTP-Deploy-Action@v4.4.0
         with:
           server: ${{ secrets.PRO_FTP_HOST }}
           username: ${{ secrets.WEB_ELE_FTP_ACCOUNT }}
@@ -129,7 +129,7 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - name: Checkout code
-        uses: actions/checkout@v4
+        uses: actions/checkout@v7
         with:
           fetch-depth: 0
 
@@ -147,9 +147,26 @@ jobs:
         run: pnpm run build:naive
 
       - name: Sync files
-        uses: SamKirkland/FTP-Deploy-Action@v4.3.5
+        uses: SamKirkland/FTP-Deploy-Action@v4.4.0
         with:
           server: ${{ secrets.PRO_FTP_HOST }}
           username: ${{ secrets.WEB_NAIVE_FTP_ACCOUNT }}
           password: ${{ secrets.WEB_NAIVE_FTP_PASSWORD }}
           local-dir: ./apps/web-naive/dist/
+
+  rerun-on-failure:
+    name: Rerun on failure
+    needs:
+      - deploy-playground-ftp
+      - deploy-docs-ftp
+      - deploy-antd-ftp
+      - deploy-ele-ftp
+      - deploy-naive-ftp
+    if: failure() && fromJSON(github.run_attempt) < 10
+    runs-on: ubuntu-latest
+    steps:
+      - name: Retry ${{ fromJSON(github.run_attempt) }} of 10
+        env:
+          GH_REPO: ${{ github.repository }}
+          GH_TOKEN: ${{ github.token }}
+        run: gh workflow run rerun.yml -F run_id=${{ github.run_id }}
diff --git a/.github/workflows/draft.yml b/.github/workflows/draft.yml
index 20b4148a..babca2d3 100644
--- a/.github/workflows/draft.yml
+++ b/.github/workflows/draft.yml
@@ -20,6 +20,6 @@ jobs:
     if: github.repository == 'vbenjs/vue-vben-admin'
     runs-on: ubuntu-latest
     steps:
-      - uses: release-drafter/release-drafter@v6
+      - uses: release-drafter/release-drafter@v7
         env:
           GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
diff --git a/.github/workflows/issue-close-require.yml b/.github/workflows/issue-close-require.yml
index 18c007bf..794292f4 100644
--- a/.github/workflows/issue-close-require.yml
+++ b/.github/workflows/issue-close-require.yml
@@ -19,7 +19,7 @@ jobs:
     steps:
       # 关闭未活动的 Issues
       - name: Close Inactive Issues
-        uses: actions/stale@v9
+        uses: actions/stale@v11
         with:
           days-before-stale: -1 # Issues and PR will never be flagged stale automatically.
           stale-issue-label: needs-reproduction # Label that flags an issue as stale.
diff --git a/.github/workflows/issue-labeled.yml b/.github/workflows/issue-labeled.yml
index 2feda4ef..7a461e3b 100644
--- a/.github/workflows/issue-labeled.yml
+++ b/.github/workflows/issue-labeled.yml
@@ -18,7 +18,7 @@ jobs:
     steps:
       - name: remove enhancement pending
         if: github.event.label.name == 'enhancement'
-        uses: actions-cool/issues-helper@v3
+        uses: actions-cool/issues-helper-backup@d65454423c6fbbd20026b9b499d403f79422ac69
         with:
           actions: 'remove-labels'
           token: ${{ secrets.GITHUB_TOKEN }}
@@ -27,7 +27,7 @@ jobs:
 
       - name: remove bug pending
         if: github.event.label.name == 'bug'
-        uses: actions-cool/issues-helper@v3
+        uses: actions-cool/issues-helper-backup@d65454423c6fbbd20026b9b499d403f79422ac69
         with:
           actions: 'remove-labels'
           token: ${{ secrets.GITHUB_TOKEN }}
@@ -36,7 +36,7 @@ jobs:
 
       - name: needs reproduction
         if: github.event.label.name == 'needs reproduction'
-        uses: actions-cool/issues-helper@v3
+        uses: actions-cool/issues-helper-backup@d65454423c6fbbd20026b9b499d403f79422ac69
         with:
           actions: 'create-comment, remove-labels'
           token: ${{ secrets.GITHUB_TOKEN }}
diff --git a/.github/workflows/lock.yml b/.github/workflows/lock.yml
index bd73d533..a12227ef 100644
--- a/.github/workflows/lock.yml
+++ b/.github/workflows/lock.yml
@@ -14,7 +14,7 @@ jobs:
     if: github.repository == 'vbenjs/vue-vben-admin'
     runs-on: ubuntu-latest
     steps:
-      - uses: dessant/lock-threads@v5
+      - uses: dessant/lock-threads@v6
         with:
           github-token: ${{ secrets.GITHUB_TOKEN }}
           issue-inactive-days: '14'
diff --git a/.github/workflows/release-tag.yml b/.github/workflows/release-tag.yml
index 7f524f90..d87a7011 100644
--- a/.github/workflows/release-tag.yml
+++ b/.github/workflows/release-tag.yml
@@ -3,78 +3,48 @@ name: Create Release Tag
 on:
   push:
     tags:
-      - 'v*.*.*' # Push events to matching v*, i.e. v1.0, v20.15.10
-
-env:
-  HUSKY: '0'
+      - 'v*.*.*'
+  workflow_dispatch:
+    inputs:
+      tag:
+        description: 'Tag to create (e.g. v1.2.3)'
+        required: true
+        type: string
 
 permissions:
-  pull-requests: write
   contents: write
 
 jobs:
-  build:
+  release:
     name: Create Release
     if: github.repository == 'vbenjs/vue-vben-admin'
     runs-on: ubuntu-latest
-    strategy:
-      matrix:
-        node-version: [20]
     steps:
       - name: Checkout code
-        uses: actions/checkout@v4
+        uses: actions/checkout@v7
         with:
           fetch-depth: 0
 
-      # - name: Checkout code
-      #   uses: actions/checkout@v4
-      #   with:
-      #     fetch-depth: 0
-
-      # - name: Install pnpm
-      #   uses: pnpm/action-setup@v4
-
-      # - name: Use Node.js ${{ matrix.node-version }}
-      #   uses: actions/setup-node@v4
-      #   with:
-      #     node-version: ${{ matrix.node-version }}
-      #     cache: "pnpm"
-
-      # - name: Install dependencies
-      #   run: pnpm install --frozen-lockfile
-
-      # - name: Test and Build
-      #   run: |
-      #     pnpm run test
-      #     pnpm run build
-
-      - name: version
+      - name: Extract version
         id: version
         run: |
-          tag=${GITHUB_REF/refs\/tags\//}
-          version=${tag#v}
-          major=${version%%.*}
-          echo "tag=${tag}" >> $GITHUB_OUTPUT
-          echo "version=${version}" >> $GITHUB_OUTPUT
-          echo "major=${major}" >> $GITHUB_OUTPUT
+          if [[ "${{ github.event_name }}" == "workflow_dispatch" ]]; then
+            raw_tag="${{ inputs.tag }}"
+          else
+            raw_tag="${GITHUB_REF_NAME}"
+          fi
+          # Normalize: ensure v prefix
+          tag="${raw_tag}"
+          [[ "${tag:0:1}" != "v" ]] && tag="v${tag}"
+          version="${tag#v}"
+          major="${version%%.*}"
+          echo "tag=${tag}" >> "${GITHUB_OUTPUT}"
+          echo "version=${version}" >> "${GITHUB_OUTPUT}"
+          echo "major=${major}" >> "${GITHUB_OUTPUT}"
 
-      - uses: release-drafter/release-drafter@v6
+      - uses: release-drafter/release-drafter@v7
         with:
           version: ${{ steps.version.outputs.version }}
           publish: true
         env:
           GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-
-      # - name: force update major tag
-      #   run: |
-      #     git tag v${{ steps.version.outputs.major }} ${{ steps.version.outputs.tag }} -f
-      #     git push origin refs/tags/v${{ steps.version.outputs.major }} -f
-
-      # - name: Create Release for Tag
-      #   id: release_tag
-      #   uses: ncipollo/release-action@v1
-      #   with:
-      #     token: ${{ secrets.GITHUB_TOKEN }}
-      #     generateReleaseNotes: "true"
-      #     body: |
-      #       > Please refer to [CHANGELOG.md](https://github.com/vbenjs/vue-vben-admin/blob/main/CHANGELOG.md) for details.
diff --git a/.github/workflows/rerun.yml b/.github/workflows/rerun.yml
new file mode 100644
index 00000000..2b462551
--- /dev/null
+++ b/.github/workflows/rerun.yml
@@ -0,0 +1,19 @@
+name: Rerun workflow
+
+on:
+  workflow_dispatch:
+    inputs:
+      run_id:
+        description: The workflow id to relanch
+        required: true
+jobs:
+  rerun:
+    runs-on: ubuntu-latest
+    steps:
+      - name: rerun ${{ inputs.run_id }}
+        env:
+          GH_REPO: ${{ github.repository }}
+          GH_TOKEN: ${{ github.token }}
+        run: |
+          gh run watch ${{ inputs.run_id }} > /dev/null 2>&1
+          gh run rerun ${{ inputs.run_id }} --failed
diff --git a/.github/workflows/semantic-pull-request.yml b/.github/workflows/semantic-pull-request.yml
index db8e9e09..02db08de 100644
--- a/.github/workflows/semantic-pull-request.yml
+++ b/.github/workflows/semantic-pull-request.yml
@@ -14,7 +14,7 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - name: Validate PR title
-        uses: amannn/action-semantic-pull-request@v5
+        uses: amannn/action-semantic-pull-request@v6
         with:
           wip: true
           subjectPattern: ^(?![A-Z]).+$
diff --git a/.github/workflows/stale.yml b/.github/workflows/stale.yml
index 991e1331..a6fd1c0e 100644
--- a/.github/workflows/stale.yml
+++ b/.github/workflows/stale.yml
@@ -9,7 +9,7 @@ jobs:
     if: github.repository == 'vbenjs/vue-vben-admin'
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/stale@v9
+      - uses: actions/stale@v11
         with:
           repo-token: ${{ secrets.GITHUB_TOKEN }}
           stale-issue-message: 'This issue is stale because it has been open 60 days with no activity. Remove stale label or comment or this will be closed in 7 days'
diff --git a/.gitignore b/.gitignore
index f73c2ad7..14538a4d 100644
--- a/.gitignore
+++ b/.gitignore
@@ -22,7 +22,8 @@ yarn.lock
 package-lock.json
 .VSCodeCounter
 **/backend-mock/data
-
+.omx
+.pnpm-store
 # local env files
 .env.local
 .env.*.local
@@ -51,3 +52,14 @@ vite.config.ts.*
 .history
 /.mimocode/
 /.cursor/skills/
+.cursor
+
+# AI
+.agent
+.agents
+.claude
+.codex
+skills-lock.json
+.atomcode
+datalog
+.playwright-mcp
diff --git a/.gitpod.yml b/.gitpod.yml
index fb75b433..5fda2cf7 100644
--- a/.gitpod.yml
+++ b/.gitpod.yml
@@ -2,5 +2,5 @@ ports:
   - port: 5555
     onOpen: open-preview
 tasks:
-  - init: corepack enable && pnpm install
+  - init: npm i -g corepack && pnpm install
     command: pnpm run dev:play
diff --git a/.husky/commit-msg b/.husky/commit-msg
deleted file mode 100755
index 270ebb8c..00000000
--- a/.husky/commit-msg
+++ /dev/null
@@ -1,6 +0,0 @@
-echo Start running commit-msg hook...
-
-# Check whether the git commit information is standardized
-pnpm exec commitlint --edit "$1"
-
-echo Run commit-msg hook done.
diff --git a/.husky/post-merge b/.husky/post-merge
deleted file mode 100644
index 83fa775d..00000000
--- a/.husky/post-merge
+++ /dev/null
@@ -1,3 +0,0 @@
-# 每次 git pull 之后, 安装依赖
-
-pnpm install
diff --git a/.lintstagedrc.mjs b/.lintstagedrc.mjs
deleted file mode 100644
index e68d8a3e..00000000
--- a/.lintstagedrc.mjs
+++ /dev/null
@@ -1,20 +0,0 @@
-export default {
-  '*.{js,jsx,ts,tsx}': [
-    'prettier --cache --ignore-unknown  --write',
-    'eslint --cache --fix',
-  ],
-  '*.{scss,less,styl,html,vue,css}': [
-    'prettier --cache --ignore-unknown --write',
-    'stylelint --fix --allow-empty-input',
-  ],
-  '*.md': ['prettier --cache --ignore-unknown --write'],
-  '*.vue': [
-    'prettier --write',
-    'eslint --cache --fix',
-    'stylelint --fix --allow-empty-input',
-  ],
-  '{!(package)*.json,*.code-snippets,.!(browserslist)*rc}': [
-    'prettier --cache --write--parser json',
-  ],
-  'package.json': ['prettier --cache --write'],
-};
diff --git a/.node-version b/.node-version
index 48b14e6b..b832e400 100644
--- a/.node-version
+++ b/.node-version
@@ -1 +1 @@
-20.14.0
+24.16.0
diff --git a/.npmrc b/.npmrc
index f4a1ad48..ea2d746e 100644
--- a/.npmrc
+++ b/.npmrc
@@ -1,13 +1,4 @@
-registry = "https://registry.npmmirror.com"
-public-hoist-pattern[]=husky
-public-hoist-pattern[]=eslint
-public-hoist-pattern[]=prettier
-public-hoist-pattern[]=prettier-plugin-tailwindcss
-public-hoist-pattern[]=stylelint
-public-hoist-pattern[]=*postcss*
-public-hoist-pattern[]=@commitlint/*
-public-hoist-pattern[]=czg
-
-strict-peer-dependencies=false
-auto-install-peers=true
-dedupe-peer-dependents=true
+registry=https://registry.npmmirror.com
+# Electron 二进制与 electron-builder 打包工具链的国内镜像（不配置在国内网络下大概率下载超时失败）
+electron_mirror=https://npmmirror.com/mirrors/electron/
+electron_builder_binaries_mirror=https://npmmirror.com/mirrors/electron-builder-binaries/
diff --git a/.prettierignore b/.prettierignore
deleted file mode 100644
index d0b0ca13..00000000
--- a/.prettierignore
+++ /dev/null
@@ -1,18 +0,0 @@
-dist
-dev-dist
-.local
-.output.js
-node_modules
-.nvmrc
-coverage
-CODEOWNERS
-.nitro
-.output
-
-
-**/*.svg
-**/*.sh
-
-public
-.npmrc
-*-lock.yaml
diff --git a/.prettierrc.mjs b/.prettierrc.mjs
deleted file mode 100644
index 3e25d2cf..00000000
--- a/.prettierrc.mjs
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from '@vben/prettier-config';
diff --git a/.stylelintignore b/.stylelintignore
index f4b2db2c..3adb33b2 100644
--- a/.stylelintignore
+++ b/.stylelintignore
@@ -2,3 +2,7 @@ dist
 public
 __tests__
 coverage
+.codex
+.claude
+.agent
+.agents
diff --git a/apps/backend-mock/api/demo/bigint.ts b/apps/backend-mock/api/demo/bigint.ts
new file mode 100644
index 00000000..00d6c28c
--- /dev/null
+++ b/apps/backend-mock/api/demo/bigint.ts
@@ -0,0 +1,32 @@
+import { eventHandler, setHeader } from 'h3';
+import { verifyAccessToken } from '~/utils/jwt-utils';
+import { unAuthorizedResponse } from '~/utils/response';
+
+export default eventHandler(async (event) => {
+  const userinfo = verifyAccessToken(event);
+  if (!userinfo) {
+    return unAuthorizedResponse(event);
+  }
+  const data = `
+  {
+    "code": 0,
+    "message": "success",
+    "data": [
+              {
+                "id": 123456789012345678901234567890123456789012345678901234567890,
+                "name": "John Doe",
+                "age": 30,
+                "email": "john-doe@demo.com"
+                },
+                {
+                "id": 987654321098765432109876543210987654321098765432109876543210,
+                "name": "Jane Smith",
+                "age": 25,
+                "email": "jane@demo.com"
+                }
+            ]
+  }
+  `;
+  setHeader(event, 'Content-Type', 'application/json');
+  return data;
+});
diff --git a/apps/backend-mock/api/system/dept/.post.ts b/apps/backend-mock/api/system/dept/.post.ts
new file mode 100644
index 00000000..9a4896af
--- /dev/null
+++ b/apps/backend-mock/api/system/dept/.post.ts
@@ -0,0 +1,16 @@
+import { eventHandler } from 'h3';
+import { verifyAccessToken } from '~/utils/jwt-utils';
+import {
+  sleep,
+  unAuthorizedResponse,
+  useResponseSuccess,
+} from '~/utils/response';
+
+export default eventHandler(async (event) => {
+  const userinfo = verifyAccessToken(event);
+  if (!userinfo) {
+    return unAuthorizedResponse(event);
+  }
+  await sleep(600);
+  return useResponseSuccess(null);
+});
diff --git a/apps/backend-mock/api/system/dept/[id].delete.ts b/apps/backend-mock/api/system/dept/[id].delete.ts
new file mode 100644
index 00000000..eac0f584
--- /dev/null
+++ b/apps/backend-mock/api/system/dept/[id].delete.ts
@@ -0,0 +1,16 @@
+import { eventHandler } from 'h3';
+import { verifyAccessToken } from '~/utils/jwt-utils';
+import {
+  sleep,
+  unAuthorizedResponse,
+  useResponseSuccess,
+} from '~/utils/response';
+
+export default eventHandler(async (event) => {
+  const userinfo = verifyAccessToken(event);
+  if (!userinfo) {
+    return unAuthorizedResponse(event);
+  }
+  await sleep(1000);
+  return useResponseSuccess(null);
+});
diff --git a/apps/backend-mock/api/system/dept/[id].put.ts b/apps/backend-mock/api/system/dept/[id].put.ts
new file mode 100644
index 00000000..6805e139
--- /dev/null
+++ b/apps/backend-mock/api/system/dept/[id].put.ts
@@ -0,0 +1,16 @@
+import { eventHandler } from 'h3';
+import { verifyAccessToken } from '~/utils/jwt-utils';
+import {
+  sleep,
+  unAuthorizedResponse,
+  useResponseSuccess,
+} from '~/utils/response';
+
+export default eventHandler(async (event) => {
+  const userinfo = verifyAccessToken(event);
+  if (!userinfo) {
+    return unAuthorizedResponse(event);
+  }
+  await sleep(2000);
+  return useResponseSuccess(null);
+});
diff --git a/apps/backend-mock/api/system/dept/list.ts b/apps/backend-mock/api/system/dept/list.ts
new file mode 100644
index 00000000..a649a0d2
--- /dev/null
+++ b/apps/backend-mock/api/system/dept/list.ts
@@ -0,0 +1,62 @@
+import { faker } from '@faker-js/faker';
+import { eventHandler } from 'h3';
+import { verifyAccessToken } from '~/utils/jwt-utils';
+import { unAuthorizedResponse, useResponseSuccess } from '~/utils/response';
+
+const formatterCN = new Intl.DateTimeFormat('zh-CN', {
+  timeZone: 'Asia/Shanghai',
+  year: 'numeric',
+  month: '2-digit',
+  day: '2-digit',
+  hour: '2-digit',
+  minute: '2-digit',
+  second: '2-digit',
+});
+
+function generateMockDataList(count: number) {
+  const dataList = [];
+
+  for (let i = 0; i < count; i++) {
+    const dataItem: Record<string, any> = {
+      id: faker.string.uuid(),
+      pid: 0,
+      name: faker.commerce.department(),
+      status: faker.helpers.arrayElement([0, 1]),
+      createTime: formatterCN.format(
+        faker.date.between({ from: '2021-01-01', to: '2022-12-31' }),
+      ),
+      remark: faker.lorem.sentence(),
+    };
+    if (faker.datatype.boolean()) {
+      dataItem.children = Array.from(
+        { length: faker.number.int({ min: 1, max: 5 }) },
+        () => ({
+          id: faker.string.uuid(),
+          pid: dataItem.id,
+          name: faker.commerce.department(),
+          status: faker.helpers.arrayElement([0, 1]),
+          createTime: formatterCN.format(
+            faker.date.between({ from: '2023-01-01', to: '2023-12-31' }),
+          ),
+          remark: faker.lorem.sentence(),
+        }),
+      );
+    }
+    dataList.push(dataItem);
+  }
+
+  return dataList;
+}
+
+const mockData = generateMockDataList(10);
+
+export default eventHandler(async (event) => {
+  const userinfo = verifyAccessToken(event);
+  if (!userinfo) {
+    return unAuthorizedResponse(event);
+  }
+
+  const listData = structuredClone(mockData);
+
+  return useResponseSuccess(listData);
+});
diff --git a/apps/backend-mock/api/system/menu/list.ts b/apps/backend-mock/api/system/menu/list.ts
new file mode 100644
index 00000000..ce96bb14
--- /dev/null
+++ b/apps/backend-mock/api/system/menu/list.ts
@@ -0,0 +1,13 @@
+import { eventHandler } from 'h3';
+import { verifyAccessToken } from '~/utils/jwt-utils';
+import { MOCK_MENU_LIST } from '~/utils/mock-data';
+import { unAuthorizedResponse, useResponseSuccess } from '~/utils/response';
+
+export default eventHandler(async (event) => {
+  const userinfo = verifyAccessToken(event);
+  if (!userinfo) {
+    return unAuthorizedResponse(event);
+  }
+
+  return useResponseSuccess(MOCK_MENU_LIST);
+});
diff --git a/apps/backend-mock/api/system/menu/name-exists.ts b/apps/backend-mock/api/system/menu/name-exists.ts
new file mode 100644
index 00000000..7d5551b3
--- /dev/null
+++ b/apps/backend-mock/api/system/menu/name-exists.ts
@@ -0,0 +1,29 @@
+import { eventHandler, getQuery } from 'h3';
+import { verifyAccessToken } from '~/utils/jwt-utils';
+import { MOCK_MENU_LIST } from '~/utils/mock-data';
+import { unAuthorizedResponse, useResponseSuccess } from '~/utils/response';
+
+const namesMap: Record<string, any> = {};
+
+function getNames(menus: any[]) {
+  menus.forEach((menu) => {
+    namesMap[menu.name] = String(menu.id);
+    if (menu.children) {
+      getNames(menu.children);
+    }
+  });
+}
+getNames(MOCK_MENU_LIST);
+
+export default eventHandler(async (event) => {
+  const userinfo = verifyAccessToken(event);
+  if (!userinfo) {
+    return unAuthorizedResponse(event);
+  }
+  const { id, name } = getQuery(event);
+
+  return (name as string) in namesMap &&
+    (!id || namesMap[name as string] !== String(id))
+    ? useResponseSuccess(true)
+    : useResponseSuccess(false);
+});
diff --git a/apps/backend-mock/api/system/menu/path-exists.ts b/apps/backend-mock/api/system/menu/path-exists.ts
new file mode 100644
index 00000000..f3c3be99
--- /dev/null
+++ b/apps/backend-mock/api/system/menu/path-exists.ts
@@ -0,0 +1,29 @@
+import { eventHandler, getQuery } from 'h3';
+import { verifyAccessToken } from '~/utils/jwt-utils';
+import { MOCK_MENU_LIST } from '~/utils/mock-data';
+import { unAuthorizedResponse, useResponseSuccess } from '~/utils/response';
+
+const pathMap: Record<string, any> = { '/': 0 };
+
+function getPaths(menus: any[]) {
+  menus.forEach((menu) => {
+    pathMap[menu.path] = String(menu.id);
+    if (menu.children) {
+      getPaths(menu.children);
+    }
+  });
+}
+getPaths(MOCK_MENU_LIST);
+
+export default eventHandler(async (event) => {
+  const userinfo = verifyAccessToken(event);
+  if (!userinfo) {
+    return unAuthorizedResponse(event);
+  }
+  const { id, path } = getQuery(event);
+
+  return (path as string) in pathMap &&
+    (!id || pathMap[path as string] !== String(id))
+    ? useResponseSuccess(true)
+    : useResponseSuccess(false);
+});
diff --git a/apps/backend-mock/api/system/role/list.ts b/apps/backend-mock/api/system/role/list.ts
new file mode 100644
index 00000000..bad29a51
--- /dev/null
+++ b/apps/backend-mock/api/system/role/list.ts
@@ -0,0 +1,84 @@
+import { faker } from '@faker-js/faker';
+import { eventHandler, getQuery } from 'h3';
+import { verifyAccessToken } from '~/utils/jwt-utils';
+import { getMenuIds, MOCK_MENU_LIST } from '~/utils/mock-data';
+import { unAuthorizedResponse, usePageResponseSuccess } from '~/utils/response';
+
+const formatterCN = new Intl.DateTimeFormat('zh-CN', {
+  timeZone: 'Asia/Shanghai',
+  year: 'numeric',
+  month: '2-digit',
+  day: '2-digit',
+  hour: '2-digit',
+  minute: '2-digit',
+  second: '2-digit',
+});
+
+const menuIds = getMenuIds(MOCK_MENU_LIST);
+
+function generateMockDataList(count: number) {
+  const dataList = [];
+
+  for (let i = 0; i < count; i++) {
+    const dataItem: Record<string, any> = {
+      id: faker.string.uuid(),
+      name: faker.commerce.product(),
+      status: faker.helpers.arrayElement([0, 1]),
+      createTime: formatterCN.format(
+        faker.date.between({ from: '2022-01-01', to: '2025-01-01' }),
+      ),
+      permissions: faker.helpers.arrayElements(menuIds),
+      remark: faker.lorem.sentence(),
+    };
+
+    dataList.push(dataItem);
+  }
+
+  return dataList;
+}
+
+const mockData = generateMockDataList(100);
+
+export default eventHandler(async (event) => {
+  const userinfo = verifyAccessToken(event);
+  if (!userinfo) {
+    return unAuthorizedResponse(event);
+  }
+
+  const {
+    page = 1,
+    pageSize = 20,
+    name,
+    id,
+    remark,
+    startTime,
+    endTime,
+    status,
+  } = getQuery(event);
+  let listData = structuredClone(mockData);
+  if (name) {
+    listData = listData.filter((item) =>
+      item.name.toLowerCase().includes(String(name).toLowerCase()),
+    );
+  }
+  if (id) {
+    listData = listData.filter((item) =>
+      item.id.toLowerCase().includes(String(id).toLowerCase()),
+    );
+  }
+  if (remark) {
+    listData = listData.filter((item) =>
+      item.remark?.toLowerCase()?.includes(String(remark).toLowerCase()),
+    );
+  }
+  if (startTime) {
+    listData = listData.filter((item) => item.createTime >= startTime);
+  }
+  if (endTime) {
+    listData = listData.filter((item) => item.createTime <= endTime);
+  }
+  if (['0', '1'].includes(status as string)) {
+    listData = listData.filter((item) => item.status === Number(status));
+  }
+  return usePageResponseSuccess(page as string, pageSize as string, listData);
+});
diff --git a/apps/backend-mock/api/system/user/list.ts b/apps/backend-mock/api/system/user/list.ts
new file mode 100644
index 00000000..21d44c8b
--- /dev/null
+++ b/apps/backend-mock/api/system/user/list.ts
@@ -0,0 +1,85 @@
+import { faker } from '@faker-js/faker';
+import { eventHandler, getQuery } from 'h3';
+import { verifyAccessToken } from '~/utils/jwt-utils';
+import { unAuthorizedResponse, usePageResponseSuccess } from '~/utils/response';
+
+const formatterCN = new Intl.DateTimeFormat('zh-CN', {
+  timeZone: 'Asia/Shanghai',
+  year: 'numeric',
+  month: '2-digit',
+  day: '2-digit',
+  hour: '2-digit',
+  minute: '2-digit',
+  second: '2-digit',
+});
+
+function generateMockDataList(count: number) {
+  const dataList = [];
+
+  for (let i = 0; i < count; i++) {
+    const dataItem: Record<string, any> = {
+      id: faker.string.uuid(),
+      name: faker.commerce.product(),
+      status: faker.helpers.arrayElement([0, 1]),
+      createTime: formatterCN.format(
+        faker.date.between({ from: '2022-01-01', to: '2025-01-01' }),
+      ),
+      deptId: faker.string.uuid(),
+      remark: faker.lorem.sentence(),
+    };
+
+    dataList.push(dataItem);
+  }
+
+  return dataList;
+}
+
+const mockData = generateMockDataList(100);
+
+export default eventHandler(async (event) => {
+  const userinfo = verifyAccessToken(event);
+  if (!userinfo) {
+    return unAuthorizedResponse(event);
+  }
+
+  const {
+    page = 1,
+    pageSize = 20,
+    name,
+    id,
+    remark,
+    startTime,
+    endTime,
+    deptId,
+    status,
+  } = getQuery(event);
+  let listData = structuredClone(mockData);
+  if (name) {
+    listData = listData.filter((item) =>
+      item.name.toLowerCase().includes(String(name).toLowerCase()),
+    );
+  }
+  if (id) {
+    listData = listData.filter((item) =>
+      item.id.toLowerCase().includes(String(id).toLowerCase()),
+    );
+  }
+  if (remark) {
+    listData = listData.filter((item) =>
+      item.remark?.toLowerCase()?.includes(String(remark).toLowerCase()),
+    );
+  }
+  if (startTime) {
+    listData = listData.filter((item) => item.createTime >= startTime);
+  }
+  if (endTime) {
+    listData = listData.filter((item) => item.createTime <= endTime);
+  }
+  if (['0', '1'].includes(status as string)) {
+    listData = listData.filter((item) => item.status === Number(status));
+  }
+  if (deptId) {
+    listData = listData.filter((item) => item.deptId === deptId);
+  }
+  return usePageResponseSuccess(page as string, pageSize as string, listData);
+});
diff --git a/apps/backend-mock/api/timezone/getTimezone.ts b/apps/backend-mock/api/timezone/getTimezone.ts
new file mode 100644
index 00000000..0cbcb6ec
--- /dev/null
+++ b/apps/backend-mock/api/timezone/getTimezone.ts
@@ -0,0 +1,12 @@
+import { eventHandler } from 'h3';
+import { verifyAccessToken } from '~/utils/jwt-utils';
+import { unAuthorizedResponse, useResponseSuccess } from '~/utils/response';
+import { getTimezone } from '~/utils/timezone-utils';
+
+export default eventHandler((event) => {
+  const userinfo = verifyAccessToken(event);
+  if (!userinfo) {
+    return unAuthorizedResponse(event);
+  }
+  return useResponseSuccess(getTimezone());
+});
diff --git a/apps/backend-mock/api/timezone/getTimezoneOptions.ts b/apps/backend-mock/api/timezone/getTimezoneOptions.ts
new file mode 100644
index 00000000..6c241864
--- /dev/null
+++ b/apps/backend-mock/api/timezone/getTimezoneOptions.ts
@@ -0,0 +1,11 @@
+import { eventHandler } from 'h3';
+import { TIME_ZONE_OPTIONS } from '~/utils/mock-data';
+import { useResponseSuccess } from '~/utils/response';
+
+export default eventHandler(() => {
+  const data = TIME_ZONE_OPTIONS.map((o) => ({
+    label: `${o.timezone} (GMT${o.offset >= 0 ? `+${o.offset}` : o.offset})`,
+    value: o.timezone,
+  }));
+  return useResponseSuccess(data);
+});
diff --git a/apps/backend-mock/api/timezone/setTimezone.ts b/apps/backend-mock/api/timezone/setTimezone.ts
new file mode 100644
index 00000000..851e4351
--- /dev/null
+++ b/apps/backend-mock/api/timezone/setTimezone.ts
@@ -0,0 +1,26 @@
+import { eventHandler, readBody, setResponseStatus } from 'h3';
+import { verifyAccessToken } from '~/utils/jwt-utils';
+import { TIME_ZONE_OPTIONS } from '~/utils/mock-data';
+import {
+  unAuthorizedResponse,
+  useResponseError,
+  useResponseSuccess,
+} from '~/utils/response';
+import { setTimezone } from '~/utils/timezone-utils';
+
+export default eventHandler(async (event) => {
+  const userinfo = verifyAccessToken(event);
+  if (!userinfo) {
+    return unAuthorizedResponse(event);
+  }
+  const body = await readBody<{ timezone?: unknown }>(event);
+  const timezone =
+    typeof body?.timezone === 'string' ? body.timezone : undefined;
+  const allowed = TIME_ZONE_OPTIONS.some((o) => o.timezone === timezone);
+  if (!timezone || !allowed) {
+    setResponseStatus(event, 400);
+    return useResponseError('Bad Request', 'Invalid timezone');
+  }
+  setTimezone(timezone);
+  return useResponseSuccess({});
+});
diff --git a/apps/backend-mock/api/upload.ts b/apps/backend-mock/api/upload.ts
new file mode 100644
index 00000000..436b63cb
--- /dev/null
+++ b/apps/backend-mock/api/upload.ts
@@ -0,0 +1,14 @@
+import { eventHandler } from 'h3';
+import { verifyAccessToken } from '~/utils/jwt-utils';
+import { unAuthorizedResponse, useResponseSuccess } from '~/utils/response';
+
+export default eventHandler((event) => {
+  const userinfo = verifyAccessToken(event);
+  if (!userinfo) {
+    return unAuthorizedResponse(event);
+  }
+  return useResponseSuccess({
+    url: 'https://unpkg.com/@vbenjs/static-source@0.1.7/source/logo-v1.webp',
+  });
+  // return useResponseError("test")
+});
diff --git a/apps/backend-mock/utils/timezone-utils.ts b/apps/backend-mock/utils/timezone-utils.ts
new file mode 100644
index 00000000..da35f920
--- /dev/null
+++ b/apps/backend-mock/utils/timezone-utils.ts
@@ -0,0 +1,9 @@
+let mockTimeZone: null | string = null;
+
+export const setTimezone = (timeZone: string) => {
+  mockTimeZone = timeZone;
+};
+
+export const getTimezone = () => {
+  return mockTimeZone;
+};
diff --git a/apps/desktop/.gitignore b/apps/desktop/.gitignore
new file mode 100644
index 00000000..dcfe6825
--- /dev/null
+++ b/apps/desktop/.gitignore
@@ -0,0 +1,2 @@
+out/
+release/
diff --git a/apps/desktop/README.md b/apps/desktop/README.md
new file mode 100644
index 00000000..294d9789
--- /dev/null
+++ b/apps/desktop/README.md
@@ -0,0 +1,46 @@
+# @vben/desktop — 萧康云医 PC 桌面端
+
+Electron 壳工程：打包加载 `apps/web-antd` 的生产构建产物，提供桌面通知、开机自启、系统托盘、未读角标、静默打印、全局快捷键与自动更新能力。
+
+## 常用命令（在仓库根目录执行）
+
+```bash
+# 开发：并行启动 web-antd dev server（:5666）与 Electron 壳（壳会自动等待/重试连接 dev server）
+pnpm dev:desktop
+
+# 打包：turbo 先构建 web-antd dist，再构建主进程并出安装包（产物在 apps/desktop/release/）
+pnpm build:desktop
+```
+
+- Windows 机器出 NSIS 安装包；mac 包必须在 macOS 机器上执行同一命令（electron-builder 不支持交叉编译 mac 包）。
+- 不需要打桌面包的同事 / CI，可设置环境变量 `ELECTRON_SKIP_BINARY_DOWNLOAD=1` 跳过 Electron 二进制下载，不影响 web 开发。
+
+## 环境切换（dev 走本地，打包走生产）
+
+| 模式 | 页面来源 | API 走向 |
+|---|---|---|
+| `pnpm dev:desktop` | `http://localhost:5666`（web-antd vite dev server） | vite 代理转发到**本地后端**：`/api/*` → `localhost:18001`、`/im-api/*` → `localhost:12080`（见 `apps/web-antd/vite.config.ts`） |
+| 打包后的安装包 | `app://local/`（内置 web-antd 生产 dist） | 主进程协议处理器转发到**生产上游**：`/api/admin/*` → `api.xiaokang88.com`、`/im-api/*` → `api.ws.g.xiaokang88.com/api`（见 `src/main/config.ts`，可用环境变量覆盖） |
+
+即：开发调试自动对接本地后端（与网页开发完全一致），只有 `pnpm build:desktop` 出的安装包才请求生产环境，无需手动切换。
+
+## 环境变量
+
+| 变量 | 用途 |
+|---|---|
+| `XK_DESKTOP_API_UPSTREAM` | 覆盖 `/api/admin` 转发上游（联调测试环境用） |
+| `XK_DESKTOP_IM_UPSTREAM` | 覆盖 `/im-api` 转发上游 |
+| `XK_DESKTOP_DEV_URL` | 覆盖开发模式加载的 dev server 地址（默认 `http://localhost:5666`） |
+| `CSC_LINK` / `CSC_KEY_PASSWORD` | 代码签名证书；**未配置时自动跳过签名，出未签名包，构建不报错** |
+| `APPLE_ID` / `APPLE_APP_SPECIFIC_PASSWORD` / `APPLE_TEAM_ID` | mac 公证三件套；三者齐全才启用公证 |
+
+未签名 mac 包可内部分发：首次打开需右键「打开」，且 mac 自动更新不可用（应用内会降级为提示前往下载页手动安装）。
+
+## 发布自动更新
+
+`release/` 里的以下产物上传到静态托管地址（`electron-builder.config.cjs` 的 `publish.url`）：
+
+- Windows：`latest.yml` + `xk-desktop-*.exe` + `*.blockmap`
+- mac：`latest-mac.yml` + `*.dmg` + `*.zip` + `*.blockmap`（zip 是 mac 自动更新必需格式）
+
+前端每次发版后跟着跑一次 `pnpm build:desktop` 并上传产物，桌面端即可自动更新。
diff --git a/apps/desktop/electron-builder.config.cjs b/apps/desktop/electron-builder.config.cjs
new file mode 100644
index 00000000..879364d4
--- /dev/null
+++ b/apps/desktop/electron-builder.config.cjs
@@ -0,0 +1,78 @@
+/**
+ * electron-builder 打包配置
+ * 用 JS 配置而不是 yml：mac 公证需要按「环境变量是否配齐」动态开关。
+ *
+ * 签名策略（按需求做成条件化，未配置证书时出未签名包且构建不报错）：
+ * - Windows / mac 代码签名：配置了 CSC_LINK + CSC_KEY_PASSWORD（或 mac 钥匙串里有
+ *   Developer ID 证书）时 electron-builder 自动签名；否则自动跳过，只输出告警
+ * - mac 公证：APPLE_ID + APPLE_APP_SPECIFIC_PASSWORD + APPLE_TEAM_ID 三者齐全才启用
+ * - 未签名 mac 包仍可内部分发：首次打开需右键「打开」，且自动更新会降级为提示手动下载
+ */
+const canNotarize = Boolean(
+  process.env.APPLE_ID &&
+    process.env.APPLE_APP_SPECIFIC_PASSWORD &&
+    process.env.APPLE_TEAM_ID,
+);
+
+/** @type {import('electron-builder').Configuration} */
+const config = {
+  // appId 必须与主进程 setAppUserModelId 一致，否则 Windows 系统通知不显示
+  appId: 'com.xiaokang.xkadmin',
+  productName: '萧康云医',
+  // 安装包文件名用 ASCII，避免中文名在静态托管/下载链接上出编码问题
+  artifactName: 'xk-desktop-${version}-${os}-${arch}.${ext}',
+  directories: {
+    output: 'release',
+    buildResources: 'resources',
+  },
+  files: ['out/**'],
+  extraResources: [
+    // web-antd 生产构建产物：放 resources/web（不进 asar），为后续渲染层热更新留路
+    { from: '../web-antd/dist', to: 'web' },
+    // 应用图标供运行时使用（托盘、Windows 窗口图标）
+    { from: 'resources/icon.png', to: 'icon.png' },
+  ],
+  asar: true,
+  compression: 'normal',
+  win: {
+    // TODO(待确认)：正式图标待提供，当前用 web-antd logo 预生成的 ico 占位
+    // 直接给 .ico 让 builder 跳过 png 转换（本机 builder 的 wasm 图标工具会报内存错误）
+    icon: 'resources/icon.ico',
+    target: [{ target: 'nsis', arch: ['x64'] }],
+  },
+  nsis: {
+    // 非一键安装：允许用户选择安装目录，符合企业内部软件分发习惯
+    oneClick: false,
+    perMachine: false,
+    allowToChangeInstallationDirectory: true,
+    createDesktopShortcut: true,
+    createStartMenuShortcut: true,
+    shortcutName: '萧康云医',
+  },
+  mac: {
+    icon: 'resources/icon.png',
+    category: 'public.app-category.medical',
+    // dmg 给用户安装，zip 是 electron-updater 在 mac 自动更新的必需格式，缺一不可
+    target: [
+      { target: 'dmg', arch: ['x64', 'arm64'] },
+      { target: 'zip', arch: ['x64', 'arm64'] },
+    ],
+    hardenedRuntime: true,
+    gatekeeperAssess: false,
+    entitlements: 'resources/entitlements.mac.plist',
+    entitlementsInherit: 'resources/entitlements.mac.plist',
+    // IM 音视频通话必需的隐私用途描述，缺失时 mac 上调用摄像头/麦克风直接崩溃
+    extendInfo: {
+      NSCameraUsageDescription: '视频问诊需要使用摄像头',
+      NSMicrophoneUsageDescription: '语音/视频通话需要使用麦克风',
+    },
+    notarize: canNotarize,
+  },
+  publish: {
+    provider: 'generic',
+    // TODO(待确认)：更新包静态托管地址，需与主进程 config.ts 的 DOWNLOAD_PAGE_URL 保持一致
+    url: 'https://static.xiaokang88.com/xk-desktop/',
+  },
+};
+
+module.exports = config;
diff --git a/apps/desktop/electron.vite.config.ts b/apps/desktop/electron.vite.config.ts
new file mode 100644
index 00000000..162224df
--- /dev/null
+++ b/apps/desktop/electron.vite.config.ts
@@ -0,0 +1,26 @@
+import { defineConfig, externalizeDepsPlugin } from 'electron-vite';
+
+/**
+ * electron-vite 构建配置
+ * 只构建主进程与预加载脚本，不配置 renderer：
+ * - 开发模式渲染层直接加载 web-antd 的 vite dev server（http://localhost:5666）
+ * - 打包模式渲染层加载 app://local/（web-antd 的生产 dist，由主进程自定义协议提供服务）
+ * externalizeDepsPlugin：dependencies（electron-updater / electron-log）保持外部化，
+ * 由 electron-builder 按生产依赖收集进安装包，避免打包器转译这类含运行时文件读取的库出问题
+ */
+export default defineConfig({
+  main: {
+    plugins: [externalizeDepsPlugin()],
+    build: {
+      outDir: 'out/main',
+      lib: { entry: 'src/main/index.ts' },
+    },
+  },
+  preload: {
+    plugins: [externalizeDepsPlugin()],
+    build: {
+      outDir: 'out/preload',
+      lib: { entry: 'src/preload/index.ts' },
+    },
+  },
+});
diff --git a/apps/desktop/package.json b/apps/desktop/package.json
new file mode 100644
index 00000000..6bf74c20
--- /dev/null
+++ b/apps/desktop/package.json
@@ -0,0 +1,27 @@
+{
+  "name": "@vben/desktop",
+  "version": "1.0.0",
+  "private": true,
+  "description": "萧康云医 PC 桌面端（Electron 壳，打包加载 web-antd 生产构建产物）",
+  "author": "萧康云医",
+  "main": "out/main/index.js",
+  "scripts": {
+    "dev": "electron-vite dev",
+    "build": "electron-vite build",
+    "pack": "electron-builder --config electron-builder.config.cjs",
+    "typecheck": "tsc --noEmit"
+  },
+  "dependencies": {
+    "electron-log": "catalog:",
+    "electron-updater": "^6.8.9"
+  },
+  "devDependencies": {
+    "@types/node": "catalog:",
+    "@vben/web-antd": "workspace:*",
+    "electron": "^43.4.0",
+    "electron-builder": "catalog:",
+    "electron-vite": "catalog:",
+    "typescript": "catalog:",
+    "vite": "^7.3.6"
+  }
+}
diff --git a/apps/desktop/resources/entitlements.mac.plist b/apps/desktop/resources/entitlements.mac.plist
new file mode 100644
index 00000000..f3950fd2
--- /dev/null
+++ b/apps/desktop/resources/entitlements.mac.plist
@@ -0,0 +1,18 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
+<plist version="1.0">
+  <dict>
+    <!-- hardenedRuntime 下 Electron（V8 JIT）运行必需的内存权限 -->
+    <key>com.apple.security.cs.allow-jit</key>
+    <true/>
+    <key>com.apple.security.cs.allow-unsigned-executable-memory</key>
+    <true/>
+    <key>com.apple.security.cs.allow-dyld-environment-variables</key>
+    <true/>
+    <!-- IM 音视频通话：摄像头 / 麦克风访问权限 -->
+    <key>com.apple.security.device.camera</key>
+    <true/>
+    <key>com.apple.security.device.audio-input</key>
+    <true/>
+  </dict>
+</plist>
diff --git a/apps/desktop/resources/icon.ico b/apps/desktop/resources/icon.ico
new file mode 100644
index 00000000..dddf3784
Binary files /dev/null and b/apps/desktop/resources/icon.ico differ
diff --git a/apps/desktop/resources/icon.png b/apps/desktop/resources/icon.png
new file mode 100644
index 00000000..8d7f47ae
Binary files /dev/null and b/apps/desktop/resources/icon.png differ
diff --git a/apps/desktop/src/main/auto-launch.ts b/apps/desktop/src/main/auto-launch.ts
new file mode 100644
index 00000000..ddde864c
--- /dev/null
+++ b/apps/desktop/src/main/auto-launch.ts
@@ -0,0 +1,30 @@
+import { app } from 'electron';
+import log from 'electron-log/main';
+
+/**
+ * 开机自启：基于系统登录项实现（Windows 写 HKCU\...\Run 注册表、mac 写「系统设置 → 登录项」），
+ * 无需管理员权限；系统登录项本身就是持久化存储，无需额外落盘记录状态。
+ */
+
+/** 读取当前开机自启状态（直接以系统登录项为准，避免自维护状态与系统不同步） */
+export function getAutoLaunchEnabled(): boolean {
+  // 开发模式下登录项指向 electron 开发二进制，无意义，统一视为关闭
+  if (!app.isPackaged) return false;
+  return app.getLoginItemSettings().openAtLogin;
+}
+
+/**
+ * 设置开机自启
+ * --hidden 参数让开机自启时静默进托盘（主进程入口据此不弹主窗口），避免开机打扰
+ */
+export function setAutoLaunchEnabled(enable: boolean): boolean {
+  if (!app.isPackaged) {
+    log.warn('开发模式不支持设置开机自启（登录项会错误指向开发二进制）');
+    return false;
+  }
+  app.setLoginItemSettings({
+    openAtLogin: enable,
+    args: enable ? ['--hidden'] : [],
+  });
+  return getAutoLaunchEnabled();
+}
diff --git a/apps/desktop/src/main/badge.ts b/apps/desktop/src/main/badge.ts
new file mode 100644
index 00000000..86de4d3b
--- /dev/null
+++ b/apps/desktop/src/main/badge.ts
@@ -0,0 +1,24 @@
+import { app, nativeImage } from 'electron';
+
+import { getMainWindow } from './window';
+
+/**
+ * 未读角标：按平台分支实现
+ * - mac：Dock 图标原生支持文字角标，直接 setBadge
+ * - Windows：任务栏无原生数字角标，用「覆盖图标」实现（图由 preload 侧 canvas 绘制成 dataURL 传来，
+ *   因为主进程没有 DOM/canvas，在渲染侧画图是社区标准做法）
+ */
+export function applyBadge(count: number, image?: string): void {
+  if (process.platform === 'darwin') {
+    app.dock?.setBadge(count > 0 ? String(Math.min(count, 99)) : '');
+    return;
+  }
+  const win = getMainWindow();
+  if (!win) return;
+  if (count > 0 && image) {
+    win.setOverlayIcon(nativeImage.createFromDataURL(image), `${count} 条未读消息`);
+  } else {
+    // 数量归零或没有角标图时清除覆盖图标
+    win.setOverlayIcon(null, '');
+  }
+}
diff --git a/apps/desktop/src/main/config.ts b/apps/desktop/src/main/config.ts
new file mode 100644
index 00000000..d2eef74a
--- /dev/null
+++ b/apps/desktop/src/main/config.ts
@@ -0,0 +1,54 @@
+import { app } from 'electron';
+import { join } from 'node:path';
+
+/**
+ * 桌面端全局配置
+ * 打包模式下渲染层加载的是本地 dist，所有「按环境调整」的地址都收敛在这里，
+ * 并支持环境变量覆盖，便于联调测试环境时不改代码切换上游。
+ */
+
+/** 应用标识：必须与 electron-builder 的 appId 一致，否则 Windows 系统通知不显示 */
+export const APP_ID = 'com.xiaokang.xkadmin';
+
+/** 自定义协议，注册为特权协议后 app://local/ 等价一个「本地 https 站点」（安全上下文） */
+export const APP_SCHEME = 'app';
+export const APP_HOST = 'local';
+export const APP_ORIGIN = `${APP_SCHEME}://${APP_HOST}`;
+export const APP_INDEX_URL = `${APP_ORIGIN}/`;
+
+/** 开发模式加载 web-antd 的 vite dev server（端口对齐 apps/web-antd/.env.development 的 VITE_PORT=5666） */
+export const DEV_SERVER_URL = process.env.XK_DESKTOP_DEV_URL ?? 'http://localhost:5666';
+
+/**
+ * /api/admin/* 的转发上游（仅打包后的 app:// 协议使用；dev 模式加载 vite dev server，
+ * 由 vite 代理转发到本地后端 localhost:18001，不经过这里）
+ * 地址来源：apps/web-antd/vite.config.ts 代理注释中的生产目标 https://api.xiaokang88.com/api/admin/
+ */
+export const API_UPSTREAM = process.env.XK_DESKTOP_API_UPSTREAM ?? 'https://api.xiaokang88.com';
+
+/**
+ * /im-api/* 的转发上游（转发规则对齐开发代理：/im-api/* → 上游 /api/*；同样仅打包后生效，
+ * dev 模式由 vite 代理转发到本地 IM localhost:12080）
+ * 地址来源：vite.config.ts 代理注释的生产目标 https://api.ws.g.xiaokang88.com/api/，与生产 WS 同主机
+ */
+export const IM_UPSTREAM = process.env.XK_DESKTOP_IM_UPSTREAM ?? 'https://api.ws.g.xiaokang88.com';
+
+/**
+ * 更新包下载页地址（与 electron-builder.config.cjs 的 publish.url 保持一致）
+ * 兼作 mac 未签名时「自动更新不可用 → 手动下载」的跳转页
+ * TODO(待确认)：更新包静态托管地址
+ */
+export const DOWNLOAD_PAGE_URL = 'https://static.xiaokang88.com/xk-desktop/';
+
+/** 全局快捷键：唤起/隐藏主窗口（CommandOrControl 在 Windows 映射 Ctrl、mac 映射 Cmd） */
+export const MAIN_WINDOW_SHORTCUT = 'CommandOrControl+Alt+X';
+
+/**
+ * 解析运行时资源路径（图标等）
+ * 打包后 extraResources 位于 process.resourcesPath，开发时直接读工程 resources 目录
+ */
+export function getResourcePath(name: string): string {
+  return app.isPackaged
+    ? join(process.resourcesPath, name)
+    : join(app.getAppPath(), 'resources', name);
+}
diff --git a/apps/desktop/src/main/index.ts b/apps/desktop/src/main/index.ts
new file mode 100644
index 00000000..c5cd6a46
--- /dev/null
+++ b/apps/desktop/src/main/index.ts
@@ -0,0 +1,81 @@
+import { app, Menu } from 'electron';
+import log from 'electron-log/main';
+
+import { APP_ID } from './config';
+import { registerIpcHandlers } from './ipc';
+import { registerAppProtocol, registerSchemePrivileges } from './protocol';
+import { registerGlobalShortcut, unregisterGlobalShortcut } from './shortcut';
+import { createTray } from './tray';
+import { initUpdater } from './updater';
+import { createMainWindow, getMainWindow, markQuitting, showMainWindow } from './window';
+
+/**
+ * 主进程入口：负责应用生命周期编排
+ * 启动顺序：单实例锁 → 特权协议注册（必须在 ready 前）→ ready 后依次初始化
+ * 协议服务 / IPC / 主窗口 / 托盘 / 全局快捷键 / 自动更新
+ */
+
+// 显式设置应用名：userData / 日志目录会随之落到 %APPDATA%\萧康云医，
+// 不设置的话 Electron 会取 package.json 的 name（@vben/desktop），生成嵌套目录不利于运维排查
+app.setName('萧康云医');
+
+// Windows 通知归属与任务栏分组标识，必须与 electron-builder 的 appId 一致，
+// 否则系统通知不显示或显示为「electron.app.Electron」
+app.setAppUserModelId(APP_ID);
+
+// 单实例锁：避免多开导致托盘、自动更新、本地设置互相干扰
+if (app.requestSingleInstanceLock()) {
+  // 特权协议必须在 app ready 之前注册，否则 app:// 无法成为安全上下文
+  registerSchemePrivileges();
+
+  // 重复启动（用户再次双击图标）时唤起已有窗口
+  app.on('second-instance', () => showMainWindow());
+
+  app.whenReady().then(() => {
+    // electron-log 初始化：主进程日志落 userData/logs，便于排查线上问题
+    log.initialize();
+
+    // mac 必须保留应用菜单，否则 Cmd+C/V/Q 等系统快捷键失效；Windows 隐藏菜单栏
+    if (process.platform === 'darwin') {
+      Menu.setApplicationMenu(
+        Menu.buildFromTemplate([
+          { role: 'appMenu' },
+          { role: 'editMenu' },
+          { role: 'viewMenu' },
+          { role: 'windowMenu' },
+        ]),
+      );
+    } else {
+      Menu.setApplicationMenu(null);
+    }
+
+    registerAppProtocol();
+    registerIpcHandlers();
+
+    // 开机自启带 --hidden 参数：静默启动进托盘，不弹主窗口打扰用户
+    const startHidden = process.argv.includes('--hidden');
+    createMainWindow({ startHidden });
+
+    createTray();
+    registerGlobalShortcut();
+    initUpdater();
+  });
+
+  // mac 点击 Dock 图标恢复窗口（关窗只是隐藏，符合平台惯例）
+  app.on('activate', () => {
+    if (getMainWindow()) showMainWindow();
+  });
+
+  // 常驻托盘模式：窗口全部关闭也不退出（close 已被拦截为隐藏，这里是兜底），退出走托盘菜单/Cmd+Q
+  app.on('window-all-closed', () => {
+    // 故意留空：不调用 app.quit()
+  });
+
+  // 任何退出路径（托盘退出 / Cmd+Q / 自动更新安装）都先放行窗口 close 拦截
+  app.on('before-quit', () => markQuitting());
+
+  // 退出前注销全局快捷键，避免残留占用
+  app.on('will-quit', () => unregisterGlobalShortcut());
+} else {
+  app.quit();
+}
diff --git a/apps/desktop/src/main/ipc.ts b/apps/desktop/src/main/ipc.ts
new file mode 100644
index 00000000..11cbd4af
--- /dev/null
+++ b/apps/desktop/src/main/ipc.ts
@@ -0,0 +1,117 @@
+import { app, ipcMain, Notification } from 'electron';
+
+import { getAutoLaunchEnabled, setAutoLaunchEnabled } from './auto-launch';
+import { applyBadge } from './badge';
+import { printHtml, type PrintHtmlOptions } from './printer';
+import { getSettings, updateSettings, type DesktopSettings } from './settings';
+import { refreshTrayMenu } from './tray';
+import { checkForUpdates } from './updater';
+import { getMainWindow, isTrustedPageUrl, showMainWindow } from './window';
+
+/**
+ * IPC 汇总：preload 暴露的 desktopAPI 全部经由这里进入主进程
+ * 所有 handler 先校验调用方来源（app:// 或开发服务器），
+ * 防止页面内嵌第三方 iframe 等场景越权调用桌面能力
+ */
+
+/** 校验 IPC 调用来源，不可信来源直接抛错拒绝 */
+function assertTrustedSender(event: Electron.IpcMainInvokeEvent): void {
+  const url = event.senderFrame?.url ?? '';
+  if (!isTrustedPageUrl(url)) {
+    throw new Error(`拒绝来自不可信来源的 IPC 调用: ${url}`);
+  }
+}
+
+/** 系统通知参数（route 用于点击通知后让渲染端跳转对应页面） */
+interface NotifyPayload {
+  title: string;
+  body: string;
+  route?: string;
+}
+
+export function registerIpcHandlers(): void {
+  // 应用版本号（渲染端「关于/设置」展示用）
+  ipcMain.handle('desktop:get-version', (event) => {
+    assertTrustedSender(event);
+    return app.getVersion();
+  });
+
+  // 系统通知：点击后唤起主窗口，并把目标路由回传渲染端执行 router.push
+  ipcMain.handle('desktop:notify', (event, payload: NotifyPayload) => {
+    assertTrustedSender(event);
+    if (!Notification.isSupported()) return false;
+    const notification = new Notification({
+      title: payload.title,
+      body: payload.body,
+    });
+    notification.on('click', () => {
+      showMainWindow();
+      if (payload.route) {
+        getMainWindow()?.webContents.send('desktop:navigate', payload.route);
+      }
+    });
+    notification.show();
+    return true;
+  });
+
+  // 未读角标（mac Dock 数字 / Windows 任务栏覆盖图标，图由 preload canvas 绘制）
+  ipcMain.handle('desktop:set-badge', (event, payload: { count: number; image?: string }) => {
+    assertTrustedSender(event);
+    applyBadge(payload.count, payload.image);
+  });
+
+  // 任务栏闪烁提醒：仅窗口未聚焦时触发（聚焦状态下闪烁是干扰），聚焦后由窗口 focus 事件自动清除
+  ipcMain.handle('desktop:flash-frame', (event) => {
+    assertTrustedSender(event);
+    const win = getMainWindow();
+    if (win && !win.isFocused()) win.flashFrame(true);
+  });
+
+  // 开机自启读取/设置（设置后同步刷新托盘菜单勾选态）
+  ipcMain.handle('desktop:get-auto-launch', (event) => {
+    assertTrustedSender(event);
+    return getAutoLaunchEnabled();
+  });
+  ipcMain.handle('desktop:set-auto-launch', (event, enable: boolean) => {
+    assertTrustedSender(event);
+    const result = setAutoLaunchEnabled(enable);
+    refreshTrayMenu();
+    return result;
+  });
+
+  // 打印机列表（渲染端打印设置下拉用）
+  ipcMain.handle('desktop:get-printers', async (event) => {
+    assertTrustedSender(event);
+    const win = getMainWindow();
+    if (!win) return [];
+    return await win.webContents.getPrintersAsync();
+  });
+
+  // 静默打印：渲染端拼好完整 HTML 传入，主进程隐藏窗口出纸
+  ipcMain.handle('desktop:print-html', (event, options: PrintHtmlOptions) => {
+    assertTrustedSender(event);
+    return printHtml(options);
+  });
+
+  // 桌面端设置（打印机选择、静默开关等）读取/增量更新
+  ipcMain.handle('desktop:get-settings', (event) => {
+    assertTrustedSender(event);
+    return getSettings();
+  });
+  ipcMain.handle('desktop:set-settings', (event, patch: Partial<DesktopSettings>) => {
+    assertTrustedSender(event);
+    return updateSettings(patch);
+  });
+
+  // 手动检查更新（渲染端设置页/关于入口）
+  ipcMain.handle('desktop:check-update', (event) => {
+    assertTrustedSender(event);
+    checkForUpdates(true);
+  });
+
+  // 渲染端主动唤起主窗口（如页内提醒的「查看」动作）
+  ipcMain.handle('desktop:focus-window', (event) => {
+    assertTrustedSender(event);
+    showMainWindow();
+  });
+}
diff --git a/apps/desktop/src/main/printer.ts b/apps/desktop/src/main/printer.ts
new file mode 100644
index 00000000..8dfcd29d
--- /dev/null
+++ b/apps/desktop/src/main/printer.ts
@@ -0,0 +1,75 @@
+import { unlink, writeFile } from 'node:fs/promises';
+import { join } from 'node:path';
+
+import { app, BrowserWindow } from 'electron';
+import log from 'electron-log/main';
+
+/**
+ * 静默打印：隐藏窗口加载 HTML → webContents.print 直接出纸
+ * 为什么用隐藏窗口：渲染层的处方打印本来就是拼好的完整 HTML（含内联样式），
+ * 加载到独立隐藏窗口打印可以完全复用现有模板，且不阻塞/不干扰主窗口。
+ * 为什么落临时文件而不是 data: URL：处方 HTML 可能较大，data URL 有长度上限风险，
+ * 临时文件 loadFile 对任意大小都稳定，打完即删。
+ */
+
+export interface PrintHtmlOptions {
+  /** 完整的打印 HTML（含样式），由渲染层拼好传入 */
+  html: string;
+  /** 目标打印机名称；不传时使用系统默认打印机 */
+  deviceName?: string;
+  /** 是否静默打印（true 不弹系统打印对话框） */
+  silent?: boolean;
+}
+
+export interface PrintResult {
+  ok: boolean;
+  message?: string;
+}
+
+/**
+ * 执行打印，返回是否成功与失败原因（渲染层据此提示用户）
+ */
+export async function printHtml(options: PrintHtmlOptions): Promise<PrintResult> {
+  const { html, deviceName, silent = true } = options;
+  // 临时文件带时间戳防并发打印互相覆盖
+  const tempFile = join(app.getPath('temp'), `xk-print-${Date.now()}-${Math.random().toString(36).slice(2)}.html`);
+  await writeFile(tempFile, html, 'utf8');
+
+  return new Promise<PrintResult>((resolve) => {
+    let settled = false;
+    const win = new BrowserWindow({
+      show: false,
+      webPreferences: { sandbox: true },
+    });
+
+    /** 统一收尾：销毁隐藏窗口、清理临时文件、只 resolve 一次 */
+    const finish = (ok: boolean, message?: string) => {
+      if (settled) return;
+      settled = true;
+      if (!win.isDestroyed()) win.destroy();
+      unlink(tempFile).catch(() => {});
+      if (!ok) log.warn(`静默打印失败: ${message}`);
+      resolve({ ok, message });
+    };
+
+    win.webContents.once('did-finish-load', () => {
+      win.webContents.print(
+        {
+          silent,
+          deviceName: deviceName || undefined,
+          printBackground: true,
+        },
+        (success, failureReason) => finish(success, success ? undefined : failureReason),
+      );
+    });
+
+    win.webContents.once('did-fail-load', (_event, _code, desc) => finish(false, desc));
+
+    // 兜底超时：防止打印机脱机等场景下隐藏窗口泄漏
+    setTimeout(() => finish(false, '打印超时（请检查打印机状态）'), 60_000);
+
+    win.loadFile(tempFile).catch((error: unknown) => {
+      finish(false, error instanceof Error ? error.message : String(error));
+    });
+  });
+}
diff --git a/apps/desktop/src/main/protocol.ts b/apps/desktop/src/main/protocol.ts
new file mode 100644
index 00000000..c06cb8eb
--- /dev/null
+++ b/apps/desktop/src/main/protocol.ts
@@ -0,0 +1,108 @@
+import { existsSync, statSync } from 'node:fs';
+import { join, normalize } from 'node:path';
+import { pathToFileURL } from 'node:url';
+
+import { app, net, protocol } from 'electron';
+
+import { API_UPSTREAM, APP_SCHEME, IM_UPSTREAM } from './config';
+
+/**
+ * app:// 自定义协议：桌面端的「本地 nginx」
+ * 1. 静态文件服务：把 web-antd 生产 dist 按 URL 路径映射到本地文件，带 SPA fallback
+ *    （等价 nginx 的 try_files $uri /index.html），因此无需把前端路由改成 hash 模式
+ * 2. 反向代理：/api/admin/* 与 /im-api/* 用 net.fetch 转发到线上上游 ——
+ *    渲染层看到的是同源请求，天然规避 CORS，后端与 nginx 都不需要任何改动
+ */
+
+/** Electron net.fetch 支持但标准 RequestInit 类型缺失的扩展字段 */
+type ElectronFetchInit = RequestInit & {
+  /** 转发出去的请求不再进入自定义协议处理器，防止死循环 */
+  bypassCustomProtocolHandlers?: boolean;
+  /** 携带流式 body 时 fetch 规范要求显式声明半双工 */
+  duplex?: 'half';
+};
+
+/**
+ * 注册特权协议，必须在 app ready 之前调用
+ * standard/secure 让 app:// 成为「安全上下文」，navigator.clipboard、getUserMedia、
+ * IndexedDB、crypto.subtle 等浏览器能力才可用；stream 支持流式响应（音频等大文件）
+ */
+export function registerSchemePrivileges(): void {
+  protocol.registerSchemesAsPrivileged([
+    {
+      scheme: APP_SCHEME,
+      privileges: {
+        standard: true,
+        secure: true,
+        supportFetchAPI: true,
+        stream: true,
+        corsEnabled: true,
+      },
+    },
+  ]);
+}
+
+/**
+ * 解析 web dist 根目录
+ * 打包后位于 resources/web（electron-builder extraResources 拷入，不进 asar）；
+ * 未打包（本地验证生产包行为）时兜底读仓库内 web-antd/dist
+ */
+export function getWebRoot(): string {
+  return app.isPackaged
+    ? join(process.resourcesPath, 'web')
+    : join(__dirname, '../../../web-antd/dist');
+}
+
+/**
+ * 把渲染层的同源请求转发到远端上游（等价 nginx proxy_pass）
+ * 保留原请求的方法 / 头 / 流式请求体，Bearer token 请求头原样透传
+ */
+function proxyRequest(target: string, request: Request): Promise<Response> {
+  const init: ElectronFetchInit = {
+    method: request.method,
+    headers: request.headers,
+    body: request.body,
+    bypassCustomProtocolHandlers: true,
+  };
+  if (request.body) init.duplex = 'half';
+  return net.fetch(target, init);
+}
+
+/**
+ * 静态文件解析：带路径穿越防护 + SPA fallback
+ * 命中不了真实文件的路径（前端路由地址、不存在的资源）统一回 index.html 交给前端路由
+ */
+function resolveStaticFile(webRoot: string, pathname: string): string {
+  const indexHtml = join(webRoot, 'index.html');
+  try {
+    const filePath = normalize(join(webRoot, decodeURIComponent(pathname)));
+    // 防路径穿越：解析结果必须仍在 webRoot 目录内
+    if (!filePath.startsWith(normalize(webRoot))) return indexHtml;
+    if (existsSync(filePath) && statSync(filePath).isFile()) return filePath;
+  } catch {
+    // decode 失败等异常场景直接回 index.html，不让协议处理器抛错
+  }
+  return indexHtml;
+}
+
+/**
+ * 注册 app:// 协议处理器，在 app ready 之后调用
+ */
+export function registerAppProtocol(): void {
+  const webRoot = getWebRoot();
+  protocol.handle(APP_SCHEME, (request) => {
+    const url = new URL(request.url);
+    // 反代 /api/admin/*：生产构建的 VITE_GLOB_API_URL=/api/admin，路径直接透传
+    if (url.pathname.startsWith('/api/')) {
+      return proxyRequest(`${API_UPSTREAM}${url.pathname}${url.search}`, request);
+    }
+    // 反代 /im-api/*：对齐开发代理规则，剥掉 /im-api 前缀后拼到上游 /api/*
+    if (url.pathname.startsWith('/im-api/')) {
+      const stripped = url.pathname.slice('/im-api'.length);
+      return proxyRequest(`${IM_UPSTREAM}/api${stripped}${url.search}`, request);
+    }
+    // 其余全部按静态资源处理（net.fetch file:// 会按扩展名自动带上正确的 Content-Type）
+    const fileUrl = pathToFileURL(resolveStaticFile(webRoot, url.pathname)).toString();
+    return net.fetch(fileUrl, { bypassCustomProtocolHandlers: true } as ElectronFetchInit);
+  });
+}
diff --git a/apps/desktop/src/main/settings.ts b/apps/desktop/src/main/settings.ts
new file mode 100644
index 00000000..d93a6609
--- /dev/null
+++ b/apps/desktop/src/main/settings.ts
@@ -0,0 +1,67 @@
+import { existsSync, readFileSync, writeFileSync } from 'node:fs';
+import { join } from 'node:path';
+
+import { app } from 'electron';
+import log from 'electron-log/main';
+
+/**
+ * 桌面端本地设置持久化（userData/desktop-settings.json）
+ * 为什么不用 electron-store：目前只需存打印机等少量键值，直接读写 JSON 文件即可，
+ * 避免引入额外依赖（electron-store 新版为纯 ESM，与 CJS 主进程产物不兼容，还会拖入 ajv 等重依赖）。
+ */
+
+/** 桌面端设置项定义 */
+export interface DesktopSettings {
+  /** 静默打印使用的打印机名称，空串表示未选择 */
+  printerName: string;
+  /** 是否启用静默打印（true 时打印处方不弹系统打印对话框） */
+  silentPrint: boolean;
+}
+
+const DEFAULT_SETTINGS: DesktopSettings = {
+  printerName: '',
+  silentPrint: false,
+};
+
+/** 内存缓存，避免每次 IPC 调用都读磁盘 */
+let cache: DesktopSettings | null = null;
+
+/** 设置文件落在 userData 目录，随应用卸载数据目录一起清理 */
+function getSettingsFilePath(): string {
+  return join(app.getPath('userData'), 'desktop-settings.json');
+}
+
+/**
+ * 读取设置：文件不存在或解析失败时回退默认值，保证任何情况下不影响应用启动
+ */
+export function getSettings(): DesktopSettings {
+  if (cache) return cache;
+  try {
+    const filePath = getSettingsFilePath();
+    if (existsSync(filePath)) {
+      // JSON.parse 返回 any，显式收窄成 Partial 再与默认值合并，保证字段完整
+      const parsed = JSON.parse(readFileSync(filePath, 'utf8')) as Partial<DesktopSettings>;
+      const merged: DesktopSettings = { ...DEFAULT_SETTINGS, ...parsed };
+      cache = merged;
+      return merged;
+    }
+  } catch (error) {
+    log.warn('读取桌面端设置失败，回退默认值', error);
+  }
+  cache = { ...DEFAULT_SETTINGS };
+  return cache;
+}
+
+/**
+ * 增量更新设置并写盘：写盘失败只告警（内存态仍生效），下次成功写入时自动恢复
+ */
+export function updateSettings(patch: Partial<DesktopSettings>): DesktopSettings {
+  const next = { ...getSettings(), ...patch };
+  cache = next;
+  try {
+    writeFileSync(getSettingsFilePath(), JSON.stringify(next, null, 2), 'utf8');
+  } catch (error) {
+    log.warn('写入桌面端设置失败', error);
+  }
+  return next;
+}
diff --git a/apps/desktop/src/main/shortcut.ts b/apps/desktop/src/main/shortcut.ts
new file mode 100644
index 00000000..f4d37bfe
--- /dev/null
+++ b/apps/desktop/src/main/shortcut.ts
@@ -0,0 +1,21 @@
+import { globalShortcut } from 'electron';
+import log from 'electron-log/main';
+
+import { MAIN_WINDOW_SHORTCUT } from './config';
+import { toggleMainWindow } from './window';
+
+/**
+ * 全局快捷键：任何界面下按 CommandOrControl+Alt+X 快速唤起/隐藏主窗口
+ * 注册失败（快捷键被其他应用占用）只记录警告，不影响应用启动
+ */
+export function registerGlobalShortcut(): void {
+  const ok = globalShortcut.register(MAIN_WINDOW_SHORTCUT, () => toggleMainWindow());
+  if (!ok) {
+    log.warn(`全局快捷键 ${MAIN_WINDOW_SHORTCUT} 注册失败（可能被其他应用占用）`);
+  }
+}
+
+/** 应用退出前注销全部快捷键，避免残留占用 */
+export function unregisterGlobalShortcut(): void {
+  globalShortcut.unregisterAll();
+}
diff --git a/apps/desktop/src/main/tray.ts b/apps/desktop/src/main/tray.ts
new file mode 100644
index 00000000..7fc1b0a5
--- /dev/null
+++ b/apps/desktop/src/main/tray.ts
@@ -0,0 +1,78 @@
+import { app, Menu, nativeImage, Tray } from 'electron';
+import log from 'electron-log/main';
+
+import { getAutoLaunchEnabled, setAutoLaunchEnabled } from './auto-launch';
+import { getResourcePath } from './config';
+import { checkForUpdates } from './updater';
+import { markQuitting, showMainWindow } from './window';
+
+/**
+ * 系统托盘：应用常驻入口
+ * - Windows 单击托盘图标恢复主窗口；mac 单击弹出菜单（跟随平台惯例）
+ * - 菜单：显示主窗口 / 开机自启开关 / 检查更新 / 退出
+ * 注意：托盘实例必须保持模块级引用，否则会被 GC 导致图标消失（Electron 经典坑）
+ */
+
+let tray: Tray | null = null;
+
+/** 构建托盘菜单：开机自启是动态勾选项，每次状态变化后需重建菜单 */
+function buildTrayMenu(): Menu {
+  return Menu.buildFromTemplate([
+    {
+      label: '显示主窗口',
+      click: () => showMainWindow(),
+    },
+    { type: 'separator' },
+    {
+      label: '开机自启',
+      type: 'checkbox',
+      checked: getAutoLaunchEnabled(),
+      // 开发模式登录项无意义，置灰避免误操作
+      enabled: app.isPackaged,
+      click: (menuItem) => {
+        setAutoLaunchEnabled(menuItem.checked);
+        refreshTrayMenu();
+      },
+    },
+    {
+      label: '检查更新',
+      click: () => checkForUpdates(true),
+    },
+    { type: 'separator' },
+    {
+      label: '退出',
+      click: () => {
+        // 先标记退出，放行主窗口 close 拦截，再走正常退出流程
+        markQuitting();
+        app.quit();
+      },
+    },
+  ]);
+}
+
+/** 刷新托盘菜单（开机自启状态从渲染端 IPC 修改后也要同步勾选态） */
+export function refreshTrayMenu(): void {
+  tray?.setContextMenu(buildTrayMenu());
+}
+
+/**
+ * 创建系统托盘
+ * 图标用打包的应用图标缩放（mac 菜单栏建议 18px、Windows 托盘 16px 的倍数由系统处理）
+ * TODO(待确认)：正式图标到位后，mac 建议换单色 Template 图以适配深浅菜单栏
+ */
+export function createTray(): void {
+  try {
+    const icon = nativeImage.createFromPath(getResourcePath('icon.png'));
+    const trayIcon = process.platform === 'darwin' ? icon.resize({ width: 18, height: 18 }) : icon.resize({ width: 16, height: 16 });
+    tray = new Tray(trayIcon);
+    tray.setToolTip('萧康云医');
+    tray.setContextMenu(buildTrayMenu());
+    // Windows 单击直接唤起主窗口；mac 上设置了 contextMenu 后单击默认弹菜单，不重复绑定
+    if (process.platform === 'win32') {
+      tray.on('click', () => showMainWindow());
+    }
+  } catch (error) {
+    // 托盘创建失败（图标缺失等）不阻塞应用启动，仅损失常驻入口
+    log.error('创建系统托盘失败', error);
+  }
+}
diff --git a/apps/desktop/src/main/updater.ts b/apps/desktop/src/main/updater.ts
new file mode 100644
index 00000000..dc5a3ad3
--- /dev/null
+++ b/apps/desktop/src/main/updater.ts
@@ -0,0 +1,139 @@
+import { app, dialog, shell } from 'electron';
+import log from 'electron-log/main';
+import { autoUpdater } from 'electron-updater';
+
+import { DOWNLOAD_PAGE_URL } from './config';
+import { getMainWindow, markQuitting, showMainWindow } from './window';
+
+/**
+ * 自动更新（electron-updater + generic 静态托管）
+ * - 启动 10 秒后自动检查一次 + 每 4 小时轮询 + 托盘/渲染端手动触发
+ * - autoDownload：发现新版本自动后台下载，进度事件转发渲染端展示
+ * - 下载完成弹窗询问「立即重启安装 / 退出时自动安装」
+ * - mac 未签名包 electron-updater 签名校验会报错：捕获后降级为「打开下载页手动安装」
+ */
+
+/** 手动检查标记：手动触发时才提示「已是最新版本」，自动轮询保持安静 */
+let isManualCheck = false;
+/** 检查中防重入 */
+let isChecking = false;
+
+/** 把更新事件转发给渲染端（web 侧在 basic.vue 里做轻量提示） */
+function sendToRenderer(type: string, data?: unknown): void {
+  getMainWindow()?.webContents.send('desktop:update-event', { type, data });
+}
+
+/** 判断是否 mac 未签名导致的更新失败（这类错误重试无意义，直接引导手动下载） */
+function isMacSignatureError(message: string): boolean {
+  return (
+    process.platform === 'darwin' &&
+    /code signature|not signed|codesign|could not get code signature/i.test(message)
+  );
+}
+
+/**
+ * 初始化自动更新：仅打包后生效（开发模式没有 app-update.yml，检查必然失败）
+ */
+export function initUpdater(): void {
+  if (!app.isPackaged) return;
+
+  autoUpdater.logger = log;
+  autoUpdater.autoDownload = true;
+  autoUpdater.autoInstallOnAppQuit = true;
+
+  autoUpdater.on('update-available', (info) => {
+    log.info(`发现新版本: ${info.version}`);
+    sendToRenderer('available', { version: info.version });
+  });
+
+  autoUpdater.on('update-not-available', () => {
+    sendToRenderer('not-available');
+    if (isManualCheck) {
+      dialog.showMessageBox({
+        type: 'info',
+        title: '检查更新',
+        message: `当前已是最新版本（v${app.getVersion()}）`,
+      });
+    }
+    isManualCheck = false;
+  });
+
+  autoUpdater.on('download-progress', (progress) => {
+    sendToRenderer('progress', { percent: Math.round(progress.percent) });
+  });
+
+  autoUpdater.on('update-downloaded', async (info) => {
+    sendToRenderer('downloaded', { version: info.version });
+    // 唤起窗口再弹对话框，避免用户看不到安装确认
+    showMainWindow();
+    const { response } = await dialog.showMessageBox({
+      type: 'question',
+      title: '发现新版本',
+      message: `新版本 v${info.version} 已下载完成`,
+      detail: '立即重启安装，或在退出应用时自动安装。',
+      buttons: ['立即重启安装', '退出时自动安装'],
+      defaultId: 0,
+      cancelId: 1,
+    });
+    if (response === 0) {
+      // 放行窗口 close 拦截，否则 quitAndInstall 会被「关闭进托盘」逻辑挡住
+      markQuitting();
+      autoUpdater.quitAndInstall();
+    }
+  });
+
+  autoUpdater.on('error', async (error) => {
+    const message = error?.message ?? String(error);
+    log.error('自动更新失败', message);
+    sendToRenderer('error', { message });
+    // mac 未签名：自动更新走不通，引导用户手动下载安装
+    if (isMacSignatureError(message)) {
+      const { response } = await dialog.showMessageBox({
+        type: 'info',
+        title: '检查更新',
+        message: '当前安装包不支持自动更新',
+        detail: '请前往下载页获取最新版本手动安装。',
+        buttons: ['打开下载页', '取消'],
+        defaultId: 0,
+        cancelId: 1,
+      });
+      if (response === 0) shell.openExternal(DOWNLOAD_PAGE_URL);
+    } else if (isManualCheck) {
+      dialog.showMessageBox({
+        type: 'warning',
+        title: '检查更新',
+        message: '检查更新失败，请稍后重试',
+        detail: message,
+      });
+    }
+    isManualCheck = false;
+    isChecking = false;
+  });
+
+  // 启动延时自动检查一次 + 每 4 小时轮询（内部工具常开着，轮询保证及时收到发版）
+  setTimeout(() => checkForUpdates(false), 10_000);
+  setInterval(() => checkForUpdates(false), 4 * 60 * 60 * 1000);
+}
+
+/**
+ * 触发一次更新检查
+ * @param manual 是否手动触发（手动时「已是最新/失败」都会弹窗反馈，自动轮询保持安静）
+ */
+export async function checkForUpdates(manual: boolean): Promise<void> {
+  if (!app.isPackaged) {
+    if (manual) {
+      dialog.showMessageBox({ type: 'info', title: '检查更新', message: '开发模式不支持检查更新' });
+    }
+    return;
+  }
+  if (isChecking) return;
+  isChecking = true;
+  isManualCheck = manual;
+  try {
+    await autoUpdater.checkForUpdates();
+  } catch {
+    // 错误已在 error 事件里统一处理
+  } finally {
+    isChecking = false;
+  }
+}
diff --git a/apps/desktop/src/main/window.ts b/apps/desktop/src/main/window.ts
new file mode 100644
index 00000000..6691c2c8
--- /dev/null
+++ b/apps/desktop/src/main/window.ts
@@ -0,0 +1,212 @@
+import { join } from 'node:path';
+
+import { app, BrowserWindow, Notification, session, shell, systemPreferences } from 'electron';
+import log from 'electron-log/main';
+
+import { APP_INDEX_URL, APP_ORIGIN, DEV_SERVER_URL, getResourcePath } from './config';
+
+/**
+ * 主窗口管理
+ * - 加载目标：开发模式加载 web-antd 的 vite dev server（未起服务时自动重试）；打包模式加载 app://local/
+ * - 安全基线：contextIsolation + sandbox 开启，webSecurity 不关闭；window.open 一律交给系统浏览器
+ * - 关闭行为：双平台都是「关窗隐藏、应用常驻」（Windows 走托盘、mac 走 Dock），真正退出走托盘菜单/Cmd+Q
+ * - 权限控制：只放行业务需要的媒体（IM 音视频）/ 通知 / 剪贴板 / 全屏，其余默认拒绝
+ */
+
+let mainWindow: BrowserWindow | null = null;
+/** 标记「真正退出」：常驻模式下 close 只是隐藏，只有 quit 流程才放行关闭 */
+let isQuitting = false;
+/** Windows 首次关窗提示「已最小化到托盘」，只提示一次避免打扰 */
+let hasShownHideTip = false;
+/** 加载失败重试定时器，避免叠加多个重试 */
+let retryTimer: NodeJS.Timeout | null = null;
+
+/** 主窗口要加载的页面地址：打包后走自定义协议，开发走 dev server */
+const PAGE_URL = app.isPackaged ? APP_INDEX_URL : DEV_SERVER_URL;
+
+export function markQuitting(): void {
+  isQuitting = true;
+}
+
+export function getMainWindow(): BrowserWindow | null {
+  return mainWindow;
+}
+
+/** 判断 URL 是否属于信任的页面来源（本地协议或开发服务器），IPC 与权限校验共用 */
+export function isTrustedPageUrl(url: string): boolean {
+  return url.startsWith(APP_ORIGIN) || url.startsWith(DEV_SERVER_URL);
+}
+
+/**
+ * 会话级权限控制：白名单内且来源可信才放行
+ * media 供 IM 音视频通话；notifications 供 HTML5 Notification（业务主要走主进程通知，这里兜底）
+ */
+function setupPermissionHandlers(): void {
+  const allowedPermissions = new Set([
+    'media',
+    'notifications',
+    'clipboard-read',
+    'clipboard-sanitized-write',
+    'fullscreen',
+  ]);
+
+  session.defaultSession.setPermissionRequestHandler((webContents, permission, callback) => {
+    const trusted = isTrustedPageUrl(webContents.getURL());
+    if (!trusted || !allowedPermissions.has(permission)) {
+      callback(false);
+      return;
+    }
+    // mac 首次使用摄像头/麦克风必须先过系统 TCC 授权弹窗，否则页面侧拿不到设备
+    if (permission === 'media' && process.platform === 'darwin') {
+      Promise.all([
+        systemPreferences.askForMediaAccess('microphone'),
+        systemPreferences.askForMediaAccess('camera'),
+      ])
+        .then(() => callback(true))
+        // TCC 弹窗异常时仍放行，让页面侧走自己的错误提示
+        .catch(() => callback(true));
+      return;
+    }
+    callback(true);
+  });
+
+  session.defaultSession.setPermissionCheckHandler((_webContents, permission, requestingOrigin) => {
+    return allowedPermissions.has(permission) && isTrustedPageUrl(requestingOrigin);
+  });
+}
+
+/** 加载失败时的内置错误页（数据 URL 形式，不依赖任何本地文件） */
+function buildErrorPageUrl(reason: string): string {
+  const html = `<!DOCTYPE html>
+<html lang="zh-CN">
+<head>
+  <meta charset="utf-8" />
+  <title>加载失败</title>
+  <style>
+    body { margin: 0; display: flex; align-items: center; justify-content: center; height: 100vh;
+      font-family: "Microsoft YaHei", "PingFang SC", sans-serif; background: #f5f6f8; color: #333; }
+    .box { text-align: center; }
+    .title { font-size: 18px; font-weight: 600; margin-bottom: 8px; }
+    .desc { font-size: 13px; color: #999; }
+  </style>
+</head>
+<body>
+  <div class="box">
+    <div class="title">页面加载失败，正在自动重试…</div>
+    <div class="desc">请检查网络连接（${reason}）</div>
+  </div>
+</body>
+</html>`;
+  return `data:text/html;charset=utf-8,${encodeURIComponent(html)}`;
+}
+
+/**
+ * 创建主窗口
+ * @param options.startHidden 开机自启（--hidden）场景下静默启动，不弹窗打扰用户
+ */
+export function createMainWindow(options: { startHidden: boolean }): BrowserWindow {
+  setupPermissionHandlers();
+
+  mainWindow = new BrowserWindow({
+    width: 1440,
+    height: 900,
+    minWidth: 1100,
+    minHeight: 700,
+    show: false,
+    autoHideMenuBar: true,
+    title: '萧康云医',
+    // Windows/Linux 窗口与任务栏图标；mac 使用打包进 app 的 icns，无需在此指定
+    icon: process.platform === 'darwin' ? undefined : getResourcePath('icon.png'),
+    webPreferences: {
+      preload: join(__dirname, '../preload/index.js'),
+      contextIsolation: true,
+      nodeIntegration: false,
+      sandbox: true,
+      spellcheck: false,
+    },
+  });
+
+  // 首次渲染完成再显示，避免白屏闪烁；静默启动场景保持隐藏（用户从托盘/快捷键唤起）
+  mainWindow.once('ready-to-show', () => {
+    if (!options.startHidden) mainWindow?.show();
+  });
+
+  // window.open / target=_blank：外链一律交给系统默认浏览器，不在应用内开新窗（安全 + 体验）
+  mainWindow.webContents.setWindowOpenHandler(({ url }) => {
+    if (url.startsWith('http://') || url.startsWith('https://')) {
+      shell.openExternal(url);
+    }
+    return { action: 'deny' };
+  });
+
+  // 页面内导航限制在信任来源内，跳外部地址时转交系统浏览器
+  mainWindow.webContents.on('will-navigate', (event, url) => {
+    if (isTrustedPageUrl(url)) return;
+    event.preventDefault();
+    if (url.startsWith('http://') || url.startsWith('https://')) {
+      shell.openExternal(url);
+    }
+  });
+
+  // 加载失败（dev server 未启动 / 断网等）时展示内置错误页并定时重试
+  mainWindow.webContents.on('did-fail-load', (_event, errorCode, errorDesc, _url, isMainFrame) => {
+    if (!isMainFrame) return;
+    // ERR_ABORTED（-3）是导航被主动取消（如重复 loadURL），不算失败
+    if (errorCode === -3) return;
+    log.warn(`主窗口加载失败: ${errorCode} ${errorDesc}`);
+    mainWindow?.loadURL(buildErrorPageUrl(errorDesc || String(errorCode)));
+    if (retryTimer) clearTimeout(retryTimer);
+    // 开发模式快速重试等 vite 起服务；打包模式放慢节奏等网络恢复
+    retryTimer = setTimeout(() => mainWindow?.loadURL(PAGE_URL), app.isPackaged ? 5000 : 1500);
+  });
+
+  // 窗口聚焦即清除任务栏闪烁提醒（配合新消息 flashFrame）
+  mainWindow.on('focus', () => mainWindow?.flashFrame(false));
+
+  // F12 切换 DevTools：内部管理系统保留排障入口
+  mainWindow.webContents.on('before-input-event', (_event, input) => {
+    if (input.type === 'keyDown' && input.key === 'F12') {
+      mainWindow?.webContents.toggleDevTools();
+    }
+  });
+
+  // 关闭行为：双平台都拦截为隐藏（Windows 常驻托盘 / mac 常驻 Dock），退出流程放行
+  mainWindow.on('close', (event) => {
+    if (isQuitting) return;
+    event.preventDefault();
+    mainWindow?.hide();
+    // Windows 首次隐藏时提示托盘位置，避免用户以为应用被关闭
+    if (process.platform === 'win32' && !hasShownHideTip && Notification.isSupported()) {
+      hasShownHideTip = true;
+      new Notification({
+        title: '萧康云医仍在运行',
+        body: '应用已最小化到系统托盘，点击托盘图标可重新打开窗口',
+      }).show();
+    }
+  });
+
+  mainWindow.on('closed', () => {
+    mainWindow = null;
+  });
+
+  mainWindow.loadURL(PAGE_URL);
+  return mainWindow;
+}
+
+/** 唤起主窗口：还原最小化、显示并聚焦（通知点击 / 托盘 / 第二实例 / 快捷键共用） */
+export function showMainWindow(): void {
+  if (!mainWindow) return;
+  if (mainWindow.isMinimized()) mainWindow.restore();
+  mainWindow.show();
+  mainWindow.focus();
+}
+
+/** 切换主窗口显隐（全局快捷键使用） */
+export function toggleMainWindow(): void {
+  if (!mainWindow) return;
+  if (mainWindow.isVisible() && mainWindow.isFocused()) {
+    mainWindow.hide();
+  } else {
+    showMainWindow();
+  }
+}
diff --git a/apps/desktop/src/preload/index.ts b/apps/desktop/src/preload/index.ts
new file mode 100644
index 00000000..dcfb3446
--- /dev/null
+++ b/apps/desktop/src/preload/index.ts
@@ -0,0 +1,102 @@
+import { contextBridge, ipcRenderer } from 'electron';
+
+/**
+ * 预加载脚本：通过 contextBridge 向渲染层暴露受控的 desktopAPI
+ * - 渲染层（web-antd）通过 window.desktopAPI 使用桌面能力；浏览器环境没有该对象，
+ *   前端封装层（apps/web-antd/src/util/desktop.ts）会自动 no-op 降级
+ * - sandbox 模式下本文件必须是 CJS 产物（electron-vite 已按包配置输出 CJS），
+ *   且只能使用 Electron 提供的受限 API（contextBridge / ipcRenderer 等）
+ */
+
+/**
+ * Windows 任务栏角标图：用 canvas 画「红底白字」数字返回 dataURL
+ * 为什么在 preload 画：主进程没有 DOM/canvas；preload 运行在渲染进程内有 DOM，
+ * 由主进程 setOverlayIcon 消费，这是 Windows 数字角标的社区标准做法
+ */
+function drawBadgeImage(count: number): string | undefined {
+  try {
+    const size = 32;
+    const canvas = document.createElement('canvas');
+    canvas.width = size;
+    canvas.height = size;
+    const ctx = canvas.getContext('2d');
+    if (!ctx) return undefined;
+    // 红色圆底
+    ctx.beginPath();
+    ctx.arc(size / 2, size / 2, size / 2, 0, Math.PI * 2);
+    ctx.fillStyle = '#f5222d';
+    ctx.fill();
+    // 白色数字，超过 99 显示 99+
+    const text = count > 99 ? '99+' : String(count);
+    ctx.fillStyle = '#ffffff';
+    ctx.font = `bold ${text.length > 2 ? 13 : 18}px Arial`;
+    ctx.textAlign = 'center';
+    ctx.textBaseline = 'middle';
+    ctx.fillText(text, size / 2, size / 2 + 1);
+    return canvas.toDataURL('image/png');
+  } catch {
+    // canvas 不可用时退化为无图（主进程会清除角标），不影响业务
+    return undefined;
+  }
+}
+
+/** 暴露给渲染层的桌面能力集合，字段语义与 web 侧 desktop.ts 封装一一对应 */
+const desktopAPI = {
+  /** 渲染层判断是否运行在桌面端的唯一标记 */
+  isElectron: true as const,
+  /** 当前平台：win32 / darwin / linux */
+  platform: process.platform,
+  /** 获取桌面端版本号（关于/设置展示用） */
+  getVersion: (): Promise<string> => ipcRenderer.invoke('desktop:get-version'),
+  /** 发送系统通知；route 为点击通知后要跳转的前端路由 */
+  notify: (options: { title: string; body: string; route?: string }): Promise<boolean> =>
+    ipcRenderer.invoke('desktop:notify', options),
+  /** 设置未读角标数量（0 表示清除）；Windows 角标图在此侧 canvas 生成 */
+  setBadge: (count: number): Promise<void> =>
+    ipcRenderer.invoke('desktop:set-badge', {
+      count,
+      image: count > 0 && process.platform === 'win32' ? drawBadgeImage(count) : undefined,
+    }),
+  /** 任务栏闪烁提醒（窗口未聚焦时生效，聚焦后自动清除） */
+  flashFrame: (): Promise<void> => ipcRenderer.invoke('desktop:flash-frame'),
+  /** 读取开机自启状态 */
+  getAutoLaunch: (): Promise<boolean> => ipcRenderer.invoke('desktop:get-auto-launch'),
+  /** 设置开机自启，返回设置后的实际状态 */
+  setAutoLaunch: (enable: boolean): Promise<boolean> =>
+    ipcRenderer.invoke('desktop:set-auto-launch', enable),
+  /** 获取系统打印机列表（打印设置下拉用） */
+  getPrinters: (): Promise<Array<{ name: string; displayName: string; isDefault: boolean }>> =>
+    ipcRenderer.invoke('desktop:get-printers'),
+  /** 静默打印：传入拼好的完整 HTML，主进程隐藏窗口出纸 */
+  printHTML: (options: {
+    html: string;
+    deviceName?: string;
+    silent?: boolean;
+  }): Promise<{ ok: boolean; message?: string }> =>
+    ipcRenderer.invoke('desktop:print-html', options),
+  /** 读取桌面端设置（打印机名称、静默打印开关等） */
+  getSettings: (): Promise<{ printerName: string; silentPrint: boolean }> =>
+    ipcRenderer.invoke('desktop:get-settings'),
+  /** 增量更新桌面端设置，返回更新后的完整设置 */
+  setSettings: (
+    patch: Partial<{ printerName: string; silentPrint: boolean }>,
+  ): Promise<{ printerName: string; silentPrint: boolean }> =>
+    ipcRenderer.invoke('desktop:set-settings', patch),
+  /** 手动检查更新（结果由主进程弹窗反馈） */
+  checkUpdate: (): Promise<void> => ipcRenderer.invoke('desktop:check-update'),
+  /** 唤起并聚焦主窗口 */
+  focusWindow: (): Promise<void> => ipcRenderer.invoke('desktop:focus-window'),
+  /** 监听「通知点击跳转」事件：主进程通知被点击后回传目标路由，渲染层执行 router.push */
+  onNavigate: (callback: (route: string) => void): void => {
+    ipcRenderer.on('desktop:navigate', (_event, route: string) => callback(route));
+  },
+  /** 监听更新事件（available / progress / downloaded / not-available / error），渲染层做轻量提示 */
+  onUpdateEvent: (callback: (payload: { type: string; data?: unknown }) => void): void => {
+    ipcRenderer.on('desktop:update-event', (_event, payload) => callback(payload));
+  },
+};
+
+contextBridge.exposeInMainWorld('desktopAPI', desktopAPI);
+
+/** 供 web 侧类型声明引用（apps/web-antd/src/types/desktop.d.ts 与此保持同步） */
+export type DesktopAPI = typeof desktopAPI;
diff --git a/apps/desktop/tsconfig.json b/apps/desktop/tsconfig.json
new file mode 100644
index 00000000..b49951dc
--- /dev/null
+++ b/apps/desktop/tsconfig.json
@@ -0,0 +1,18 @@
+{
+  "compilerOptions": {
+    "target": "ES2023",
+    "module": "ESNext",
+    "moduleResolution": "Bundler",
+    "lib": ["ES2023", "DOM", "DOM.Iterable"],
+    "types": ["node"],
+    "strict": true,
+    "noEmit": true,
+    "skipLibCheck": true,
+    "esModuleInterop": true,
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "forceConsistentCasingInFileNames": true,
+    "useUnknownInCatchVariables": true
+  },
+  "include": ["src", "electron.vite.config.ts"]
+}
diff --git a/apps/web-antd/index.html b/apps/web-antd/index.html
index 480eb84d..e3b9ae5c 100644
--- a/apps/web-antd/index.html
+++ b/apps/web-antd/index.html
@@ -12,7 +12,7 @@
       content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=0"
     />
     <!-- 由 vite 注入 VITE_APP_TITLE 变量，在 .env 文件内配置 -->
-    <title><%= VITE_APP_TITLE %></title>
+    <title>%VITE_APP_TITLE%</title>
     <link rel="icon" href="/favicon.ico" />
     <script>
       // 生产环境下注入百度统计
diff --git a/apps/web-antd/package.json b/apps/web-antd/package.json
index 40b4cfd5..3a5965db 100644
--- a/apps/web-antd/package.json
+++ b/apps/web-antd/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vben/web-antd",
-  "version": "5.5.1",
+  "version": "5.7.0",
   "homepage": "https://vben.pro",
   "bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
   "repository": {
@@ -27,6 +27,7 @@
   },
   "dependencies": {
     "@ant-design/icons-vue": "^7.0.1",
+    "@fortawesome/fontawesome-free": "^6.7.2",
     "@vben/access": "workspace:*",
     "@vben/common-ui": "workspace:*",
     "@vben/constants": "workspace:*",
@@ -41,15 +42,24 @@
     "@vben/styles": "workspace:*",
     "@vben/types": "workspace:*",
     "@vben/utils": "workspace:*",
+    "@vueup/vue-quill": "^1.2.0",
     "@vueuse/core": "catalog:",
     "ant-design-vue": "catalog:",
+    "axios": "^1.10.0",
     "dayjs": "catalog:",
     "exceljs": "^4.4.0",
+    "html2canvas": "^1.4.1",
+    "js-base64": "^3.7.7",
+    "lodash-es": "^4.17.21",
+    "lucide-vue-next": "^0.487.0",
+    "lunar-typescript": "^1.8.6",
     "markdown-it": "^14.1.0",
+    "md-editor-v3": "^5.4.5",
     "pinia": "catalog:",
     "sortablejs": "catalog:",
     "vue": "catalog:",
     "vue-router": "catalog:",
+    "xgplayer": "^3.0.24",
     "xlsx": "^0.18.5"
   },
   "devDependencies": {
diff --git a/apps/web-antd/postcss.config.mjs b/apps/web-antd/postcss.config.mjs
deleted file mode 100644
index 3d807045..00000000
--- a/apps/web-antd/postcss.config.mjs
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from '@vben/tailwind-config/postcss';
diff --git a/apps/web-antd/public/audio/register-notify.mp3 b/apps/web-antd/public/audio/register-notify.mp3
new file mode 100644
index 00000000..0493d6f1
Binary files /dev/null and b/apps/web-antd/public/audio/register-notify.mp3 differ
diff --git a/apps/web-antd/src/adapter/component/index.ts b/apps/web-antd/src/adapter/component/index.ts
index 74dc1ab5..e8f94298 100644
--- a/apps/web-antd/src/adapter/component/index.ts
+++ b/apps/web-antd/src/adapter/component/index.ts
@@ -3,55 +3,616 @@
  * 可用于 vben-form、vben-modal、vben-drawer 等组件使用,
  */
 
-import type { BaseFormComponentType } from '@vben/common-ui';
+/* eslint-disable vue/one-component-per-file */
 
-import type { Component, SetupContext } from 'vue';
-import { h } from 'vue';
+import type {
+  AutoCompleteProps,
+  ButtonProps,
+  CascaderProps,
+  CheckboxGroupProps,
+  CheckboxProps,
+  DatePickerProps,
+  DividerProps,
+  InputNumberProps,
+  InputProps,
+  MentionsProps,
+  RadioGroupProps,
+  RadioProps,
+  RateProps,
+  SelectProps,
+  SpaceProps,
+  SwitchProps,
+  TextAreaProps,
+  TimePickerProps,
+  TreeSelectProps,
+  UploadChangeParam,
+  UploadFile,
+  UploadProps,
+} from 'ant-design-vue';
+import type { RangePickerProps } from 'ant-design-vue/es/date-picker';
 
-import { ApiComponent, globalShareState, IconPicker } from '@vben/common-ui';
-import { $t } from '@vben/locales';
+import type { Component, Ref } from 'vue';
+
+import type {
+  ApiComponentSharedProps,
+  BaseFormComponentType,
+  IconPickerProps,
+} from '@vben/common-ui';
+import type { Sortable } from '@vben/hooks';
+import type { Recordable } from '@vben/types';
 
 import {
-  AutoComplete,
-  Button,
-  Cascader,
-  Checkbox,
-  CheckboxGroup,
-  DatePicker,
-  Divider,
-  Input,
-  InputNumber,
-  InputPassword,
-  Mentions,
-  notification,
-  Radio,
-  RadioGroup,
-  RangePicker,
-  Rate,
-  Select,
-  Space,
-  Switch,
-  Textarea,
-  TimePicker,
-  TreeSelect,
-  Upload,
-} from 'ant-design-vue';
+  computed,
+  defineAsyncComponent,
+  defineComponent,
+  h,
+  nextTick,
+  onMounted,
+  onUnmounted,
+  ref,
+  render,
+  unref,
+  watch,
+} from 'vue';
+
+import {
+  ApiComponent,
+  globalShareState,
+  IconPicker,
+  VCropper,
+} from '@vben/common-ui';
+import { useSortable } from '@vben/hooks';
+import { IconifyIcon } from '@vben/icons';
+import { $t } from '@vben/locales';
+import { isEmpty } from '@vben/utils';
+
+import { message, Modal, notification } from 'ant-design-vue';
 
 import { registerComponent } from '#/components/form/component-map';
 
+type AdapterUploadProps = UploadProps & {
+  aspectRatio?: string;
+  crop?: boolean;
+  draggable?: boolean;
+  handleChange?: (event: UploadChangeParam) => void;
+  maxSize?: number;
+  onDragSort?: (oldIndex: number, newIndex: number) => void;
+  onHandleChange?: (event: UploadChangeParam) => void;
+};
+
+// ============================================================
+// 所有 antd 组件统一用 defineAsyncComponent 异步加载
+// ⚠️ 不要再从 'ant-design-vue' 同步 import 这些组件！
+//    否则会和下面的 const 声明冲突，导致
+//    "Identifier 'Xxx' has already been declared"
+// ============================================================
+
+const AutoComplete = defineAsyncComponent(
+  () => import('ant-design-vue/es/auto-complete'),
+);
+const Button = defineAsyncComponent(() => import('ant-design-vue/es/button'));
+const Checkbox = defineAsyncComponent(
+  () => import('ant-design-vue/es/checkbox'),
+);
+const CheckboxGroup = defineAsyncComponent(() =>
+  import('ant-design-vue/es/checkbox').then((res) => res.CheckboxGroup),
+);
+const DatePicker = defineAsyncComponent(
+  () => import('ant-design-vue/es/date-picker'),
+);
+const Divider = defineAsyncComponent(() => import('ant-design-vue/es/divider'));
+const Input = defineAsyncComponent(() => import('ant-design-vue/es/input'));
+const InputNumber = defineAsyncComponent(
+  () => import('ant-design-vue/es/input-number'),
+);
+const InputPassword = defineAsyncComponent(() =>
+  import('ant-design-vue/es/input').then((res) => res.InputPassword),
+);
+const Mentions = defineAsyncComponent(
+  () => import('ant-design-vue/es/mentions'),
+);
+const Radio = defineAsyncComponent(() => import('ant-design-vue/es/radio'));
+const RadioGroup = defineAsyncComponent(() =>
+  import('ant-design-vue/es/radio').then((res) => res.RadioGroup),
+);
+const RangePicker = defineAsyncComponent(() =>
+  import('ant-design-vue/es/date-picker').then((res) => res.RangePicker),
+);
+const Rate = defineAsyncComponent(() => import('ant-design-vue/es/rate'));
+const Select = defineAsyncComponent(() => import('ant-design-vue/es/select'));
+const Space = defineAsyncComponent(() => import('ant-design-vue/es/space'));
+const Switch = defineAsyncComponent(() => import('ant-design-vue/es/switch'));
+const Textarea = defineAsyncComponent(() =>
+  import('ant-design-vue/es/input').then((res) => res.Textarea),
+);
+const TimePicker = defineAsyncComponent(
+  () => import('ant-design-vue/es/time-picker'),
+);
+const TreeSelect = defineAsyncComponent(
+  () => import('ant-design-vue/es/tree-select'),
+);
+const Cascader = defineAsyncComponent(
+  () => import('ant-design-vue/es/cascader'),
+);
+const Upload = defineAsyncComponent(() => import('ant-design-vue/es/upload'));
+const Image = defineAsyncComponent(() => import('ant-design-vue/es/image'));
+const PreviewGroup = defineAsyncComponent(() =>
+  import('ant-design-vue/es/image').then((res) => res.ImagePreviewGroup),
+);
+
+// ============================================================
+// withDefaultPlaceholder：给组件注入 i18n placeholder + ref 透传
+// ============================================================
+
 const withDefaultPlaceholder = <T extends Component>(
-  component: T,
+  component: Component,
   type: 'input' | 'select',
+  componentProps: Recordable<any> = {},
 ) => {
-  return (props: any, { attrs, slots }: Omit<SetupContext, 'expose'>) => {
-    const placeholder = props?.placeholder || $t(`ui.placeholder.${type}`);
-    return h(component, { ...props, ...attrs, placeholder }, slots);
+  return defineComponent({
+    name: (component as any).name,
+    inheritAttrs: false,
+    setup: (props: any, { attrs, expose, slots }) => {
+      const placeholder =
+        props?.placeholder ||
+        attrs?.placeholder ||
+        $t(`ui.placeholder.${type}`);
+      // 透传组件暴露的方法
+      const innerRef = ref();
+      expose(
+        new Proxy(
+          {},
+          {
+            get: (_target, key) => innerRef.value?.[key],
+            has: (_target, key) => key in (innerRef.value || {}),
+          },
+        ),
+      );
+      return () =>
+        h(
+          component,
+          { ...componentProps, placeholder, ...props, ...attrs, ref: innerRef },
+          slots,
+        );
+    },
+  });
+};
+
+const IMAGE_EXTENSIONS = new Set([
+  'bmp',
+  'gif',
+  'jpeg',
+  'jpg',
+  'png',
+  'svg',
+  'webp',
+]);
+
+/**
+ * 检查是否为图片文件
+ */
+function isImageFile(file: UploadFile): boolean {
+  if (file.url) {
+    try {
+      const pathname = new URL(file.url, 'http://localhost').pathname;
+      const ext = pathname.split('.').pop()?.toLowerCase();
+      return ext ? IMAGE_EXTENSIONS.has(ext) : false;
+    } catch {
+      const ext = file.url?.split('.').pop()?.toLowerCase();
+      return ext ? IMAGE_EXTENSIONS.has(ext) : false;
+    }
+  }
+  if (!file.type) {
+    const ext = file.name?.split('.').pop()?.toLowerCase();
+    return ext ? IMAGE_EXTENSIONS.has(ext) : false;
+  }
+  return file.type.startsWith('image/');
+}
+
+/**
+ * 创建默认的上传按钮插槽
+ */
+function createDefaultUploadSlots(listType: string, placeholder: string) {
+  if (listType === 'picture-card') {
+    return { default: () => placeholder };
+  }
+  return {
+    default: () =>
+      h(
+        Button,
+        {
+          icon: h(IconifyIcon, {
+            icon: 'ant-design:upload-outlined',
+            class: 'mb-1 size-4',
+          }),
+        },
+        () => placeholder,
+      ),
   };
+}
+
+/**
+ * 获取文件的 Base64
+ */
+function getBase64(file: File): Promise<string> {
+  return new Promise((resolve, reject) => {
+    const reader = new FileReader();
+    reader.readAsDataURL(file);
+    reader.addEventListener('load', () => resolve(reader.result as string));
+    reader.addEventListener('error', reject);
+  });
+}
+
+/**
+ * 预览图片
+ */
+async function previewImage(
+  file: UploadFile,
+  visible: Ref<boolean>,
+  fileList: Ref<UploadProps['fileList']>,
+) {
+  // 非图片文件直接打开链接
+  if (!isImageFile(file)) {
+    const url = file.url || file.preview;
+    if (url) {
+      window.open(url, '_blank');
+    } else {
+      message.error($t('ui.formRules.previewWarning'));
+    }
+    return;
+  }
+
+  const [ImageComponent, PreviewGroupComponent] = await Promise.all([
+    Image,
+    PreviewGroup,
+  ]);
+
+  // 过滤图片文件并生成预览
+  const imageFiles = (unref(fileList) || []).filter((f) => isImageFile(f));
+
+  for (const imgFile of imageFiles) {
+    if (!imgFile.url && !imgFile.preview && imgFile.originFileObj) {
+      imgFile.preview = await getBase64(imgFile.originFileObj);
+    }
+  }
+
+  const container = document.createElement('div');
+  document.body.append(container);
+  let isUnmounted = false;
+
+  const currentIndex = imageFiles.findIndex((f) => f.uid === file.uid);
+
+  const PreviewWrapper = {
+    setup() {
+      return () => {
+        if (isUnmounted) return null;
+        return h(
+          PreviewGroupComponent,
+          {
+            class: 'hidden',
+            preview: {
+              visible: visible.value,
+              current: currentIndex,
+              onVisibleChange: (value: boolean) => {
+                visible.value = value;
+                if (!value) {
+                  setTimeout(() => {
+                    if (!isUnmounted && container) {
+                      isUnmounted = true;
+                      render(null, container);
+                      container.remove();
+                    }
+                  }, 300);
+                }
+              },
+            },
+          },
+          () =>
+            imageFiles.map((imgFile) =>
+              h(ImageComponent, {
+                key: imgFile.uid,
+                src: imgFile.url || imgFile.preview,
+              }),
+            ),
+        );
+      };
+    },
+  };
+
+  render(h(PreviewWrapper), container);
+}
+
+/**
+ * 图片裁剪操作
+ */
+function cropImage(file: File, aspectRatio: string | undefined) {
+  return new Promise<Blob | string | undefined>((resolve, reject) => {
+    const container = document.createElement('div');
+    document.body.append(container);
+
+    let isUnmounted = false;
+    let objectUrl: null | string = null;
+
+    const open = ref(true);
+    const cropperRef = ref<InstanceType<typeof VCropper> | null>(null);
+
+    const closeModal = () => {
+      open.value = false;
+      setTimeout(() => {
+        if (!isUnmounted && container) {
+          if (objectUrl) {
+            URL.revokeObjectURL(objectUrl);
+          }
+          isUnmounted = true;
+          render(null, container);
+          container.remove();
+        }
+      }, 300);
+    };
+
+    const CropperWrapper = {
+      setup() {
+        return () => {
+          if (isUnmounted) return null;
+          if (!objectUrl) {
+            objectUrl = URL.createObjectURL(file);
+          }
+          return h(
+            Modal,
+            {
+              open: open.value,
+              title: h('div', {}, [
+                $t('ui.crop.title'),
+                h(
+                  'span',
+                  {
+                    class: `${aspectRatio ? '' : 'hidden'} ml-2 text-sm text-gray-400 font-normal`,
+                  },
+                  $t('ui.crop.titleTip', [aspectRatio]),
+                ),
+              ]),
+              centered: true,
+              width: 548,
+              zIndex: 9999,
+              keyboard: false,
+              maskClosable: false,
+              closable: false,
+              cancelText: $t('common.cancel'),
+              okText: $t('ui.crop.confirm'),
+              destroyOnClose: true,
+              onOk: async () => {
+                const cropper = cropperRef.value;
+                if (!cropper) {
+                  reject(new Error('Cropper not found'));
+                  closeModal();
+                  return;
+                }
+                try {
+                  const dataUrl = await cropper.getCropImage();
+                  if (dataUrl) {
+                    resolve(dataUrl);
+                  } else {
+                    reject(new Error($t('ui.crop.errorTip')));
+                  }
+                } catch {
+                  reject(new Error($t('ui.crop.errorTip')));
+                } finally {
+                  closeModal();
+                }
+              },
+              onCancel() {
+                resolve('');
+                closeModal();
+              },
+            },
+            () =>
+              h(VCropper, {
+                ref: (refValue: any) => (cropperRef.value = refValue),
+                img: objectUrl as string,
+                aspectRatio,
+              }),
+          );
+        };
+      },
+    };
+
+    render(h(CropperWrapper), container);
+  });
+}
+
+/**
+ * 带预览功能的上传组件
+ */
+const withPreviewUpload = () => {
+  return defineComponent({
+    name: 'Upload',
+    emits: ['update:modelValue'],
+    setup(
+      props: any,
+      { attrs, slots, emit }: { attrs: any; emit: any; slots: any },
+    ) {
+      const previewVisible = ref<boolean>(false);
+      const placeholder = attrs?.placeholder || $t('ui.placeholder.upload');
+      const listType = attrs?.listType || attrs?.['list-type'] || 'text';
+      const fileList = ref<UploadProps['fileList']>(
+        attrs?.fileList || attrs?.['file-list'] || [],
+      );
+
+      const maxSize = computed(() => attrs?.maxSize ?? attrs?.['max-size']);
+      const aspectRatio = computed(
+        () => attrs?.aspectRatio ?? attrs?.['aspect-ratio'],
+      );
+
+      const handleBeforeUpload = async (
+        file: UploadFile,
+        originFileList: Array<File>,
+      ) => {
+        // 文件大小限制
+        if (maxSize.value && (file.size || 0) / 1024 / 1024 > maxSize.value) {
+          message.error($t('ui.formRules.sizeLimit', [maxSize.value]));
+          file.status = 'removed';
+          return false;
+        }
+
+        // 图片裁剪处理
+        if (
+          attrs.crop &&
+          !attrs.multiple &&
+          originFileList[0] &&
+          isImageFile(file)
+        ) {
+          file.status = 'removed';
+          const blob = await cropImage(originFileList[0], aspectRatio.value);
+          if (!blob) {
+            throw new Error($t('ui.crop.errorTip'));
+          }
+          return blob;
+        }
+
+        return attrs.beforeUpload?.(file) ?? true;
+      };
+
+      const handleChange = (event: UploadChangeParam) => {
+        try {
+          attrs.handleChange?.(event);
+          attrs.onHandleChange?.(event);
+        } catch (error) {
+          console.error(error);
+        }
+        fileList.value = event.fileList.filter(
+          (file) => file.status !== 'removed',
+        );
+        emit(
+          'update:modelValue',
+          event.fileList?.length ? fileList.value : undefined,
+        );
+      };
+
+      const handlePreview = async (file: UploadFile) => {
+        previewVisible.value = true;
+        await previewImage(file, previewVisible, fileList);
+      };
+
+      const renderUploadButton = () => {
+        if (attrs.disabled) return null;
+        return isEmpty(slots)
+          ? createDefaultUploadSlots(listType, placeholder)
+          : slots;
+      };
+
+      // 拖拽排序
+      const draggable = computed(
+        () => (attrs.draggable ?? false) && !attrs.disabled,
+      );
+      const uploadId = `upload-${Date.now()}-${Math.random().toString(36).slice(2, 9)}`;
+      const sortableInstance = ref<null | Sortable>(null);
+
+      const styleId = `upload-drag-style-${uploadId}`;
+
+      function injectDragStyle() {
+        if (!document.querySelector(`[id="${styleId}"]`)) {
+          const style = document.createElement('style');
+          style.id = styleId;
+          style.textContent = `
+            [data-upload-id="${uploadId}"] .ant-upload-list-item { cursor: move; }
+            [data-upload-id="${uploadId}"] .ant-upload-list-item:hover { box-shadow: 0 2px 8px rgba(0,0,0,0.15); }
+          `;
+          document.head?.append(style);
+        }
+      }
+
+      function removeDragStyle() {
+        document.querySelector(`[id="${styleId}"]`)?.remove();
+      }
+
+      async function initSortable(retryCount = 0) {
+        if (!draggable.value) return;
+
+        injectDragStyle();
+        await nextTick();
+        await new Promise((resolve) => setTimeout(resolve, 100));
+
+        const container = document.querySelector(
+          `[data-upload-id="${uploadId}"] .ant-upload-list`,
+        ) as HTMLElement | null;
+
+        if (!container) {
+          if (retryCount < 5) {
+            setTimeout(() => initSortable(retryCount + 1), 200);
+          }
+          return;
+        }
+
+        const { initializeSortable } = useSortable(container, {
+          animation: 300,
+          delay: 400,
+          delayOnTouchOnly: true,
+          filter:
+            '.ant-upload-select, .ant-upload-list-item-error, .ant-upload-list-item-uploading',
+          onEnd: (evt: { oldIndex?: number; newIndex?: number }) => {
+            const { oldIndex, newIndex } = evt;
+            if (
+              oldIndex === undefined ||
+              newIndex === undefined ||
+              oldIndex === newIndex
+            ) {
+              return;
+            }
+
+            const list = [...(fileList.value || [])];
+            const [movedItem] = list.splice(oldIndex, 1);
+            if (movedItem) {
+              list.splice(newIndex, 0, movedItem);
+              fileList.value = list;
+            }
+
+            attrs.onDragSort?.(oldIndex, newIndex);
+            emit('update:modelValue', fileList.value);
+          },
+        });
+
+        sortableInstance.value = await initializeSortable();
+      }
+
+      // 监听表单值变化
+      watch(
+        () => attrs.modelValue,
+        (res) => {
+          fileList.value = res;
+        },
+      );
+
+      onMounted(initSortable);
+      onUnmounted(() => {
+        sortableInstance.value?.destroy();
+        removeDragStyle();
+      });
+
+      return () =>
+        h(
+          'div',
+          { 'data-upload-id': uploadId, class: 'w-full' },
+          h(
+            Upload,
+            {
+              ...props,
+              ...attrs,
+              fileList: fileList.value,
+              beforeUpload: handleBeforeUpload,
+              onChange: handleChange,
+              onPreview: handlePreview,
+            },
+            renderUploadButton() as any,
+          ),
+        );
+    },
+  });
 };
 
 // 表单组件在这里加
 // 这里需要自行根据业务组件库进行适配，需要用到的组件都需要在这里类型说明
 export type ComponentType =
+  | 'ApiCascader'
   | 'ApiSelect'
   | 'ApiTreeSelect'
   | 'AutoComplete'
@@ -61,7 +622,8 @@ export type ComponentType =
   | 'DatePicker'
   | 'DefaultButton'
   | 'Divider'
-  | 'GalleryPickLink' // OA 场景表单的图片/文件素材选择（透传 acceptTypes 过滤类型）
+  /** OA 场景表单的图片/文件素材选择（透传 acceptTypes 过滤类型） */
+  | 'GalleryPickLink'
   | 'IconPicker'
   | 'Input'
   | 'InputNumber'
@@ -85,66 +647,89 @@ export type ComponentType =
   | 'UploadDraggerPaste'
   | BaseFormComponentType;
 
+/**
+ * 与 {@link ComponentType} 中注册的组件名一一对应，便于 Schema 上 `component` + `componentProps` 联动提示
+ */
+export interface ComponentPropsMap {
+  ApiCascader: ApiComponentSharedProps & CascaderProps;
+  ApiSelect: ApiComponentSharedProps & SelectProps;
+  ApiTreeSelect: ApiComponentSharedProps & TreeSelectProps;
+  AutoComplete: AutoCompleteProps;
+  Cascader: CascaderProps;
+  Checkbox: CheckboxProps;
+  CheckboxGroup: CheckboxGroupProps;
+  DatePicker: DatePickerProps;
+  DefaultButton: ButtonProps;
+  Divider: DividerProps;
+  IconPicker: IconPickerProps;
+  Input: InputProps;
+  InputNumber: InputNumberProps;
+  InputPassword: InputProps;
+  Mentions: MentionsProps;
+  PrimaryButton: ButtonProps;
+  Radio: RadioProps;
+  RadioGroup: RadioGroupProps;
+  RangePicker: RangePickerProps;
+  Rate: RateProps;
+  Select: SelectProps;
+  Space: SpaceProps;
+  Switch: SwitchProps;
+  Textarea: TextAreaProps;
+  TimePicker: TimePickerProps;
+  TreeSelect: TreeSelectProps;
+  Upload: AdapterUploadProps;
+}
+
 async function initComponentAdapter() {
   const components: Partial<Record<ComponentType, Component>> = {
     // 如果你的组件体积比较大，可以使用异步加载
     // Button: () =>
     // import('xxx').then((res) => res.Button),
-    ApiSelect: (props, { attrs, slots }) => {
-      return h(
-        ApiComponent,
-        {
-          placeholder: $t('ui.placeholder.select'),
-          ...props,
-          ...attrs,
-          component: Select,
-          loadingSlot: 'suffixIcon',
-          visibleEvent: 'onDropdownVisibleChange',
-          modelPropName: 'value',
-        },
-        slots,
-      );
-    },
-    ApiTreeSelect: (props, { attrs, slots }) => {
-      return h(
-        ApiComponent,
-        {
-          placeholder: $t('ui.placeholder.select'),
-          ...props,
-          ...attrs,
-          component: TreeSelect,
-          fieldNames: { label: 'label', value: 'value', children: 'children' },
-          loadingSlot: 'suffixIcon',
-          modelPropName: 'value',
-          optionsPropName: 'treeData',
-          visibleEvent: 'onVisibleChange',
-        },
-        slots,
-      );
-    },
+
+    ApiCascader: withDefaultPlaceholder(ApiComponent, 'select', {
+      component: Cascader,
+      fieldNames: { label: 'label', value: 'value', children: 'children' },
+      loadingSlot: 'suffixIcon',
+      modelPropName: 'value',
+      visibleEvent: 'onVisibleChange',
+    }),
+    ApiSelect: withDefaultPlaceholder(ApiComponent, 'select', {
+      component: Select,
+      loadingSlot: 'suffixIcon',
+      modelPropName: 'value',
+      visibleEvent: 'onVisibleChange',
+    }),
+    ApiTreeSelect: withDefaultPlaceholder(ApiComponent, 'select', {
+      component: TreeSelect,
+      fieldNames: { label: 'label', value: 'value', children: 'children' },
+      loadingSlot: 'suffixIcon',
+      modelPropName: 'value',
+      optionsPropName: 'treeData',
+      visibleEvent: 'onVisibleChange',
+    }),
     AutoComplete,
     Cascader,
     Checkbox,
     CheckboxGroup,
     DatePicker,
     // 自定义默认按钮
-    DefaultButton: (props, { attrs, slots }) => {
+    DefaultButton: (props: any, { attrs, slots }: any) => {
       return h(Button, { ...props, attrs, type: 'default' }, slots);
     },
     Divider,
-    IconPicker: (props, { attrs, slots }) => {
-      return h(
-        IconPicker,
-        { iconSlot: 'addonAfter', inputComponent: Input, ...props, ...attrs },
-        slots,
-      );
-    },
+    IconPicker: withDefaultPlaceholder(IconPicker, 'select', {
+      iconSlot: 'addonAfter',
+      inputComponent: Input,
+      modelValueProp: 'value',
+    }),
     Input: withDefaultPlaceholder(Input, 'input'),
-    InputNumber: withDefaultPlaceholder(InputNumber, 'input'),
+    InputNumber: withDefaultPlaceholder(InputNumber, 'input', {
+      style: { width: '100%' },
+    }),
     InputPassword: withDefaultPlaceholder(InputPassword, 'input'),
     Mentions: withDefaultPlaceholder(Mentions, 'input'),
     // 自定义主要按钮
-    PrimaryButton: (props, { attrs, slots }) => {
+    PrimaryButton: (props: any, { attrs, slots }: any) => {
       return h(Button, { ...props, attrs, type: 'primary' }, slots);
     },
     Radio,
@@ -157,10 +742,10 @@ async function initComponentAdapter() {
     Textarea: withDefaultPlaceholder(Textarea, 'input'),
     TimePicker,
     TreeSelect: withDefaultPlaceholder(TreeSelect, 'select'),
-    Upload,
+    Upload: withPreviewUpload(),
   };
 
-  // 自动注册自定义组件
+  // 自动注册 components/form 与 views/**/components/form 下的业务表单组件（如 Editor、Avatar）
   registerComponent(components);
   // 将组件注册到全局共享状态中
   globalShareState.setComponents(components);
diff --git a/apps/web-antd/src/adapter/form.ts b/apps/web-antd/src/adapter/form.ts
index 24ccc648..0354edfd 100644
--- a/apps/web-antd/src/adapter/form.ts
+++ b/apps/web-antd/src/adapter/form.ts
@@ -1,49 +1,84 @@
 import type {
+  VbenFormProps as FormProps,
   VbenFormSchema as FormSchema,
-  VbenFormProps,
+  FormValues,
 } from '@vben/common-ui';
 
-import type { ComponentType } from './component';
+import type { ComponentPropsMap, ComponentType } from './component';
 
 import { setupVbenForm, useVbenForm as useForm, z } from '@vben/common-ui';
 import { $t } from '@vben/locales';
 
-setupVbenForm<ComponentType>({
-  config: {
-    // ant design vue组件库默认都是 v-model:value
-    baseModelPropName: 'value',
+async function initSetupVbenForm() {
+  setupVbenForm<ComponentType>({
+    config: {
+      // ant design vue组件库默认都是 v-model:value
+      baseModelPropName: 'value',
 
-    // 一些组件是 v-model:checked 或者 v-model:fileList
-    modelPropNameMap: {
-      Checkbox: 'checked',
-      Radio: 'checked',
-      Switch: 'checked',
-      Upload: 'fileList',
-      UploadImage: 'modelValue',
-      UploadOssFile: 'modelValue',
+      // 一些组件是 v-model:checked 或者 v-model:fileList
+      modelPropNameMap: {
+        Checkbox: 'checked',
+        Radio: 'checked',
+        Switch: 'checked',
+        Upload: 'fileList',
+        UploadImage: 'modelValue',
+        UploadOssFile: 'modelValue',
+      },
     },
-  },
-  defineRules: {
-    // 输入项目必填国际化适配
-    required: (value, _params, ctx) => {
-      if (value === undefined || value === null || value.length === 0) {
-        return $t('ui.formRules.required', [ctx.label]);
-      }
-      return true;
+    rules: {
+      // 输入项目必填国际化适配
+      required: (value, _params, ctx) => {
+        if (value === undefined || value === null || value.length === 0) {
+          return $t('ui.formRules.required', [ctx.label]);
+        }
+        return true;
+      },
+      // 选择项目必填国际化适配
+      selectRequired: (value, _params, ctx) => {
+        if (value === undefined || value === null) {
+          return $t('ui.formRules.selectRequired', [ctx.label]);
+        }
+        return true;
+      },
+      /**
+       * 大陆手机号：必填 + 11 位且号段 13-19（与后端 UtilsService::checkPhone 一致）
+       * 表单字段 rules: 'mobile' 即可，无需再叠 required
+       */
+      mobile: (value, _params, ctx) => {
+        const phone = typeof value === 'string' ? value.trim() : value;
+        if (phone === undefined || phone === null || phone === '') {
+          return $t('ui.formRules.required', [ctx.label]);
+        }
+        if (!/^1[3456789]\d{9}$/.test(String(phone))) {
+          return $t('ui.formRules.mobile', [ctx.label]);
+        }
+        return true;
+      },
     },
-    // 选择项目必填国际化适配
-    selectRequired: (value, _params, ctx) => {
-      if (value === undefined || value === null) {
-        return $t('ui.formRules.selectRequired', [ctx.label]);
-      }
-      return true;
-    },
-  },
-});
+  });
+}
 
-const useVbenForm = useForm<ComponentType>;
+function useVbenForm<
+  TFormValues extends FormValues = FormValues,
+  TSubmitValues extends FormValues = TFormValues,
+>(
+  options: FormProps<
+    ComponentType,
+    ComponentPropsMap,
+    TFormValues,
+    TSubmitValues
+  >,
+) {
+  return useForm<TFormValues, ComponentType, ComponentPropsMap, TSubmitValues>(
+    options,
+  );
+}
 
-export { useVbenForm, z };
+export { initSetupVbenForm, useVbenForm, z };
 
-export type VbenFormSchema = FormSchema<ComponentType>;
-export type { VbenFormProps };
+export type VbenFormSchema<TValues extends FormValues = FormValues> =
+  FormSchema<ComponentType, ComponentPropsMap, TValues>;
+export type VbenFormProps<
+  TFormValues extends FormValues = FormValues,
+  TSubmitValues extends FormValues = TFormValues,
+> = FormProps<ComponentType, ComponentPropsMap, TFormValues, TSubmitValues>;
diff --git a/apps/web-antd/src/adapter/vxe-table.ts b/apps/web-antd/src/adapter/vxe-table.ts
index d296b205..75b56375 100644
--- a/apps/web-antd/src/adapter/vxe-table.ts
+++ b/apps/web-antd/src/adapter/vxe-table.ts
@@ -1,6 +1,14 @@
+import type { FormValues } from '@vben/common-ui';
+import type { VxeTableGridOptions } from '@vben/plugins/vxe-table';
+
+import type { ComponentPropsMap, ComponentType } from './component';
+
 import { h } from 'vue';
 
-import { setupVbenVxeTable, useVbenVxeGrid } from '@vben/plugins/vxe-table';
+import {
+  setupVbenVxeTable,
+  useVbenVxeGrid as useGrid,
+} from '@vben/plugins/vxe-table';
 
 import { Button, Image } from 'ant-design-vue';
 
@@ -33,14 +41,15 @@ setupVbenVxeTable({
         round: true,
         showOverflow: true,
         size: 'small',
-      },
+      } as VxeTableGridOptions,
     });
 
     // 表格配置项可以用 cellRender: { name: 'CellImage' },
     vxeUI.renderer.add('CellImage', {
-      renderTableDefault(_renderOpts, params) {
+      renderTableDefault(renderOpts, params) {
+        const { props } = renderOpts;
         const { column, row } = params;
-        return h(Image, { src: row[column.field] });
+        return h(Image, { src: row[column.field], ...props });
       },
     });
 
@@ -62,6 +71,23 @@ setupVbenVxeTable({
   useVbenForm,
 });
 
-export { useVbenVxeGrid };
+export const useVbenVxeGrid = <
+  T extends Record<string, any>,
+  TFormValues extends FormValues = FormValues,
+  TSubmitValues extends FormValues = TFormValues,
+>(
+  ...rest: Parameters<
+    typeof useGrid<
+      T,
+      ComponentType,
+      ComponentPropsMap,
+      TFormValues,
+      TSubmitValues
+    >
+  >
+) =>
+  useGrid<T, ComponentType, ComponentPropsMap, TFormValues, TSubmitValues>(
+    ...rest,
+  );
 
 export type * from '@vben/plugins/vxe-table';
diff --git a/apps/web-antd/src/api/request.ts b/apps/web-antd/src/api/request.ts
index 1a0defc5..fbdd4b9d 100644
--- a/apps/web-antd/src/api/request.ts
+++ b/apps/web-antd/src/api/request.ts
@@ -1,12 +1,13 @@
 /**
  * 该文件可自行根据业务逻辑进行调整
  */
-import type { HttpResponse } from '@vben/request';
+import type { RequestClientOptions } from '@vben/request';
 
 import { useAppConfig } from '@vben/hooks';
 import { preferences } from '@vben/preferences';
 import {
   authenticateResponseInterceptor,
+  defaultResponseInterceptor,
   errorMessageResponseInterceptor,
   RequestClient,
 } from '@vben/request';
@@ -29,8 +30,9 @@ import {downloadByData} from "#/util/tool";
 
 const { apiURL } = useAppConfig(import.meta.env, import.meta.env.PROD);
 
-function createRequestClient(baseURL: string) {
+function createRequestClient(baseURL: string, options?: RequestClientOptions) {
   const client = new RequestClient({
+    ...options,
     baseURL,
   });
 
@@ -174,7 +176,9 @@ function createRequestClient(baseURL: string) {
   return client;
 }
 
-export const requestClient = createRequestClient(apiURL);
+export const requestClient = createRequestClient(apiURL, {
+  responseReturn: 'result',
+});
 
 export const baseRequestClient = new RequestClient({ baseURL: apiURL });
 
diff --git a/apps/web-antd/src/bootstrap.ts b/apps/web-antd/src/bootstrap.ts
index 963d1c7f..ec721125 100644
--- a/apps/web-antd/src/bootstrap.ts
+++ b/apps/web-antd/src/bootstrap.ts
@@ -1,6 +1,7 @@
 import { createApp, watchEffect } from 'vue';
 
 import { registerAccessDirective } from '@vben/access';
+import { registerLoadingDirective } from '@vben/common-ui/es/loading';
 import { preferences } from '@vben/preferences';
 import { initStores } from '@vben/stores';
 import '@vben/styles';
@@ -11,6 +12,7 @@ import { useTitle } from '@vueuse/core';
 import { $t, setupI18n } from '#/locales';
 
 import { initComponentAdapter } from './adapter/component';
+import { initSetupVbenForm } from './adapter/form';
 import App from './app.vue';
 import { router } from './router';
 
@@ -18,8 +20,26 @@ async function bootstrap(namespace: string) {
   // 初始化组件适配器
   await initComponentAdapter();
 
+  // 初始化表单组件
+  await initSetupVbenForm();
+
+  // // 设置弹窗的默认配置
+  // setDefaultModalProps({
+  //   fullscreenButton: false,
+  // });
+  // // 设置抽屉的默认配置
+  // setDefaultDrawerProps({
+  //   zIndex: 1020,
+  // });
+
   const app = createApp(App);
 
+  // 注册v-loading指令
+  registerLoadingDirective(app, {
+    loading: 'loading', // 在这里可以自定义指令名称，也可以明确提供false表示不注册这个指令
+    spinning: 'spinning',
+  });
+
   // 国际化 i18n 配置
   await setupI18n(app);
 
@@ -29,9 +49,17 @@ async function bootstrap(namespace: string) {
   // 安装权限指令
   registerAccessDirective(app);
 
+  // 初始化 tippy
+  const { initTippy } = await import('@vben/common-ui/es/tippy');
+  initTippy(app);
+
   // 配置路由及路由守卫
   app.use(router);
 
+  // 配置Motion插件
+  const { MotionPlugin } = await import('@vben/plugins/motion');
+  app.use(MotionPlugin);
+
   // 动态更新标题
   watchEffect(() => {
     if (preferences.app.dynamicTitle) {
diff --git a/apps/web-antd/src/components/canvas-spreadsheet/commands/SetCellValueCommand.ts b/apps/web-antd/src/components/canvas-spreadsheet/commands/SetCellValueCommand.ts
index c7b5c89d..7034cfb2 100644
--- a/apps/web-antd/src/components/canvas-spreadsheet/commands/SetCellValueCommand.ts
+++ b/apps/web-antd/src/components/canvas-spreadsheet/commands/SetCellValueCommand.ts
@@ -1,12 +1,12 @@
-import type { SpreadsheetCommand } from '../types';

-

-export function createSetCellValueCommand(

-  undo: () => void | Promise<void>,

-  redo: () => void | Promise<void>,

-): SpreadsheetCommand {

-  return {

-    label: 'setCellValue',

-    undo,

-    redo,

-  };

-}

+import type { SpreadsheetCommand } from '../types';
+
+export function createSetCellValueCommand(
+  undo: () => void | Promise<void>,
+  redo: () => void | Promise<void>,
+): SpreadsheetCommand {
+  return {
+    label: 'setCellValue',
+    undo,
+    redo,
+  };
+}
diff --git a/apps/web-antd/src/components/form/component-map.ts b/apps/web-antd/src/components/form/component-map.ts
index 8f7353c6..b4af6e68 100644
--- a/apps/web-antd/src/components/form/component-map.ts
+++ b/apps/web-antd/src/components/form/component-map.ts
@@ -1,7 +1,7 @@
-import type { CustomComponentType } from './types';
-
 import type { Component } from 'vue';
 
+import type { CustomComponentType } from './types';
+
 import { getFileNameWithoutExtension, toPascalCase } from '#/util/tool';
 
 const componentMap = new Map<CustomComponentType | string, Component>();
diff --git a/apps/web-antd/src/components/form/components/api-log-user-picker.vue b/apps/web-antd/src/components/form/components/api-log-user-picker.vue
index 35e2a87d..1dab28d8 100644
--- a/apps/web-antd/src/components/form/components/api-log-user-picker.vue
+++ b/apps/web-antd/src/components/form/components/api-log-user-picker.vue
@@ -1,346 +1,346 @@
-<script setup lang="ts">

-import { computed, nextTick, ref, watch } from 'vue';

-

-import { useDebounceFn, useVModel } from '@vueuse/core';

-import { Avatar, Empty, Input, Popover, Spin, Tabs, Tag } from 'ant-design-vue';

-

-import { searchApiLogUsers } from '#/views/log/api-log/api';

-

-defineOptions({

-  name: 'ApiLogUserPicker',

-  inheritAttrs: false,

-});

-

-export type ApiLogUserFilter = {

-  id: number;

-  user_type: 'admin' | 'patient' | 'doctor';

-  platform_type: 0 | 1 | 2;

-  name: string;

-  role_label: string;

-  avatar?: string;

-};

-

-type ApiLogUserOption = ApiLogUserFilter;

-

-type UserTab = 'admin' | 'patient' | 'doctor';

-

-const props = defineProps<{

-  value?: ApiLogUserFilter;

-  disabled?: boolean;

-  onPlatformTypeChange?: (platformType: 0 | 1 | 2) => void;

-}>();

-

-const emits = defineEmits<{

-  'update:value': [value: ApiLogUserFilter | undefined];

-}>();

-

-const mValue = useVModel(props, 'value', emits, { passive: true });

-

-const open = ref(false);

-const loading = ref(false);

-const searchKeyword = ref('');

-const activeTab = ref<UserTab>('admin');

-const options = ref<ApiLogUserOption[]>([]);

-const searchInputRef = ref<InstanceType<typeof Input> | null>(null);

-

-const TAB_ITEMS = [

-  { key: 'admin', label: '后台用户' },

-  { key: 'patient', label: '患者端用户' },

-  { key: 'doctor', label: '医生端用户' },

-] as const;

-

-const searchPlaceholder = computed(() => {

-  if (activeTab.value === 'admin') return '搜索手机号或昵称';

-  if (activeTab.value === 'patient') return '搜索用户名字';

-  return '搜索名字或手机号';

-});

-

-async function fetchOptions() {

-  const keyword = searchKeyword.value.trim();

-  if (!keyword) {

-    options.value = [];

-    return;

-  }

-

-  loading.value = true;

-  try {

-    const result = await searchApiLogUsers({

-      user_type: activeTab.value,

-      keyword,

-      pageSize: 24,

-    });

-    options.value = result?.items ?? [];

-  } finally {

-    loading.value = false;

-  }

-}

-

-const debouncedFetch = useDebounceFn(fetchOptions, 300);

-

-watch([searchKeyword, activeTab], () => {

-  debouncedFetch();

-});

-

-function selectOption(item: ApiLogUserOption) {

-  mValue.value = {

-    id: item.id,

-    user_type: item.user_type,

-    platform_type: item.platform_type,

-    name: item.name,

-    role_label: item.role_label,

-    avatar: item.avatar,

-  };

-  props.onPlatformTypeChange?.(item.platform_type);

-  open.value = false;

-  searchKeyword.value = '';

-  options.value = [];

-}

-

-function clearSelection(e: Event) {

-  e.stopPropagation();

-  mValue.value = undefined;

-}

-

-function onOpenChange(next: boolean) {

-  if (props.disabled) return;

-  open.value = next;

-  if (next) {

-    searchKeyword.value = '';

-    options.value = [];

-    nextTick(() => searchInputRef.value?.focus?.());

-  }

-}

-

-watch(

-  () => props.disabled,

-  (disabled) => {

-    if (disabled) open.value = false;

-  },

-);

-</script>

-

-<template>

-  <Popover

-    :open="open"

-    trigger="click"

-    placement="bottomLeft"

-    overlay-class-name="api-log-user-picker-popover"

-    @open-change="onOpenChange"

-  >

-    <template #content>

-      <div class="api-log-user-panel">

-        <Tabs v-model:active-key="activeTab" size="small" class="api-log-user-tabs">

-          <Tabs.TabPane

-            v-for="tab in TAB_ITEMS"

-            :key="tab.key"

-            :tab="tab.label"

-          />

-        </Tabs>

-        <Input

-          ref="searchInputRef"

-          v-model:value="searchKeyword"

-          allow-clear

-          :placeholder="searchPlaceholder"

-          class="api-log-user-search"

-        />

-        <Spin :spinning="loading">

-          <div v-if="options.length" class="api-log-user-grid">

-            <button

-              v-for="item in options"

-              :key="`${item.user_type}-${item.id}`"

-              type="button"

-              class="api-log-user-card"

-              :class="{

-                active:

-                  mValue?.id === item.id && mValue?.user_type === item.user_type,

-              }"

-              @click="selectOption(item)"

-            >

-              <Avatar :src="item.avatar" :size="30">

-                {{ (item.name || '?').charAt(0) }}

-              </Avatar>

-              <div class="api-log-user-card-id">#{{ item.id }}</div>

-              <div class="api-log-user-card-name" :title="item.name">

-                {{ item.name }}

-              </div>

-              <Tag class="api-log-user-card-role" :bordered="false">

-                {{ item.role_label }}

-              </Tag>

-            </button>

-          </div>

-          <Empty

-            v-else

-            :description="searchKeyword.trim() ? '无匹配用户' : '请输入关键词搜索'"

-            class="api-log-user-empty"

-          />

-        </Spin>

-      </div>

-    </template>

-    <div class="api-log-user-trigger" :class="{ disabled: disabled }">

-      <div v-if="mValue" class="api-log-selected-card">

-        <Avatar :src="mValue.avatar" :size="36">

-          {{ (mValue.name || '?').charAt(0) }}

-        </Avatar>

-        <div class="api-log-selected-meta">

-          <div class="api-log-selected-name">{{ mValue.name }}</div>

-          <div class="api-log-selected-sub">

-            #{{ mValue.id }} · {{ mValue.role_label }}

-          </div>

-        </div>

-        <span

-          v-if="!disabled"

-          class="api-log-clear-btn"

-          @click="clearSelection"

-        >

-          ×

-        </span>

-      </div>

-      <div v-else class="api-log-trigger-placeholder">请选择操作用户</div>

-    </div>

-  </Popover>

-</template>

-

-<style scoped lang="scss">

-@use './picker-card-theme.scss' as theme;

-

-.api-log-user-trigger {

-  width: 100%;

-}

-

-.api-log-user-trigger.disabled {

-  cursor: not-allowed;

-  opacity: 0.65;

-}

-

-.api-log-user-trigger:not(.disabled) {

-  cursor: pointer;

-}

-

-.api-log-selected-card {

-  @include theme.picker-selected-card;

-}

-

-.api-log-selected-meta {

-  min-width: 0;

-  flex: 1;

-}

-

-.api-log-selected-name {

-  font-size: 14px;

-  font-weight: 500;

-  color: #1d2129;

-  line-height: 1.4;

-  overflow: hidden;

-  text-overflow: ellipsis;

-  white-space: nowrap;

-}

-

-.api-log-selected-sub {

-  font-size: 12px;

-  color: #86909c;

-  line-height: 1.4;

-}

-

-.api-log-trigger-placeholder {

-  @include theme.picker-trigger-placeholder;

-}

-

-.api-log-clear-btn {

-  @include theme.picker-clear-btn;

-}

-

-.dark {

-  .api-log-selected-card {

-    @include theme.picker-selected-card-dark-props;

-  }

-

-  .api-log-selected-name {

-    @include theme.picker-text-primary-dark;

-  }

-

-  .api-log-selected-sub {

-    @include theme.picker-text-secondary-dark;

-  }

-

-  .api-log-trigger-placeholder {

-    @include theme.picker-placeholder-dark-props;

-  }

-

-  .api-log-clear-btn {

-    @include theme.picker-clear-dark-props;

-  }

-}

-</style>

-

-<style lang="scss">

-@use './picker-card-theme.scss' as theme;

-

-.api-log-user-picker-popover {

-  .ant-popover-inner {

-    padding: 12px;

-  }

-

-  .api-log-user-panel {

-    width: 540px;

-    max-width: 86vw;

-  }

-

-  .api-log-user-tabs {

-    margin-bottom: 8px;

-  }

-

-  .api-log-user-search {

-    margin-bottom: 10px;

-  }

-

-  .api-log-user-grid {

-    display: grid;

-    grid-template-columns: repeat(auto-fill, minmax(118px, 1fr));

-    gap: 8px;

-    max-height: 300px;

-    overflow-y: auto;

-    padding: 2px;

-  }

-

-  .api-log-user-card {

-    @include theme.picker-card-base;

-  }

-

-  .api-log-user-card-id {

-    @include theme.picker-card-sub;

-  }

-

-  .api-log-user-card-name {

-    @include theme.picker-card-name;

-  }

-

-  .api-log-user-card-role {

-    margin: 0;

-    font-size: 11px;

-    line-height: 18px;

-    padding: 0 6px;

-    max-width: 100%;

-    overflow: hidden;

-    text-overflow: ellipsis;

-  }

-

-  .api-log-user-empty {

-    margin: 16px 0;

-  }

-}

-

-.dark .api-log-user-picker-popover {

-  .api-log-user-card {

-    @include theme.picker-card-dark-props;

-  }

-

-  .api-log-user-card-name {

-    @include theme.picker-text-primary-dark;

-  }

-

-  .api-log-user-card-id {

-    @include theme.picker-text-secondary-dark;

-  }

-}

-</style>

-
\ No newline at end of file
+<script setup lang="ts">
+import { computed, nextTick, ref, watch } from 'vue';
+
+import { useDebounceFn, useVModel } from '@vueuse/core';
+import { Avatar, Empty, Input, Popover, Spin, Tabs, Tag } from 'ant-design-vue';
+
+import { searchApiLogUsers } from '#/views/log/api-log/api';
+
+defineOptions({
+  name: 'ApiLogUserPicker',
+  inheritAttrs: false,
+});
+
+export type ApiLogUserFilter = {
+  id: number;
+  user_type: 'admin' | 'patient' | 'doctor';
+  platform_type: 0 | 1 | 2;
+  name: string;
+  role_label: string;
+  avatar?: string;
+};
+
+type ApiLogUserOption = ApiLogUserFilter;
+
+type UserTab = 'admin' | 'patient' | 'doctor';
+
+const props = defineProps<{
+  value?: ApiLogUserFilter;
+  disabled?: boolean;
+  onPlatformTypeChange?: (platformType: 0 | 1 | 2) => void;
+}>();
+
+const emits = defineEmits<{
+  'update:value': [value: ApiLogUserFilter | undefined];
+}>();
+
+const mValue = useVModel(props, 'value', emits, { passive: true });
+
+const open = ref(false);
+const loading = ref(false);
+const searchKeyword = ref('');
+const activeTab = ref<UserTab>('admin');
+const options = ref<ApiLogUserOption[]>([]);
+const searchInputRef = ref<InstanceType<typeof Input> | null>(null);
+
+const TAB_ITEMS = [
+  { key: 'admin', label: '后台用户' },
+  { key: 'patient', label: '患者端用户' },
+  { key: 'doctor', label: '医生端用户' },
+] as const;
+
+const searchPlaceholder = computed(() => {
+  if (activeTab.value === 'admin') return '搜索手机号或昵称';
+  if (activeTab.value === 'patient') return '搜索用户名字';
+  return '搜索名字或手机号';
+});
+
+async function fetchOptions() {
+  const keyword = searchKeyword.value.trim();
+  if (!keyword) {
+    options.value = [];
+    return;
+  }
+
+  loading.value = true;
+  try {
+    const result = await searchApiLogUsers({
+      user_type: activeTab.value,
+      keyword,
+      pageSize: 24,
+    });
+    options.value = result?.items ?? [];
+  } finally {
+    loading.value = false;
+  }
+}
+
+const debouncedFetch = useDebounceFn(fetchOptions, 300);
+
+watch([searchKeyword, activeTab], () => {
+  debouncedFetch();
+});
+
+function selectOption(item: ApiLogUserOption) {
+  mValue.value = {
+    id: item.id,
+    user_type: item.user_type,
+    platform_type: item.platform_type,
+    name: item.name,
+    role_label: item.role_label,
+    avatar: item.avatar,
+  };
+  props.onPlatformTypeChange?.(item.platform_type);
+  open.value = false;
+  searchKeyword.value = '';
+  options.value = [];
+}
+
+function clearSelection(e: Event) {
+  e.stopPropagation();
+  mValue.value = undefined;
+}
+
+function onOpenChange(next: boolean) {
+  if (props.disabled) return;
+  open.value = next;
+  if (next) {
+    searchKeyword.value = '';
+    options.value = [];
+    nextTick(() => searchInputRef.value?.focus?.());
+  }
+}
+
+watch(
+  () => props.disabled,
+  (disabled) => {
+    if (disabled) open.value = false;
+  },
+);
+</script>
+
+<template>
+  <Popover
+    :open="open"
+    trigger="click"
+    placement="bottomLeft"
+    overlay-class-name="api-log-user-picker-popover"
+    @open-change="onOpenChange"
+  >
+    <template #content>
+      <div class="api-log-user-panel">
+        <Tabs v-model:active-key="activeTab" size="small" class="api-log-user-tabs">
+          <Tabs.TabPane
+            v-for="tab in TAB_ITEMS"
+            :key="tab.key"
+            :tab="tab.label"
+          />
+        </Tabs>
+        <Input
+          ref="searchInputRef"
+          v-model:value="searchKeyword"
+          allow-clear
+          :placeholder="searchPlaceholder"
+          class="api-log-user-search"
+        />
+        <Spin :spinning="loading">
+          <div v-if="options.length" class="api-log-user-grid">
+            <button
+              v-for="item in options"
+              :key="`${item.user_type}-${item.id}`"
+              type="button"
+              class="api-log-user-card"
+              :class="{
+                active:
+                  mValue?.id === item.id && mValue?.user_type === item.user_type,
+              }"
+              @click="selectOption(item)"
+            >
+              <Avatar :src="item.avatar" :size="30">
+                {{ (item.name || '?').charAt(0) }}
+              </Avatar>
+              <div class="api-log-user-card-id">#{{ item.id }}</div>
+              <div class="api-log-user-card-name" :title="item.name">
+                {{ item.name }}
+              </div>
+              <Tag class="api-log-user-card-role" :bordered="false">
+                {{ item.role_label }}
+              </Tag>
+            </button>
+          </div>
+          <Empty
+            v-else
+            :description="searchKeyword.trim() ? '无匹配用户' : '请输入关键词搜索'"
+            class="api-log-user-empty"
+          />
+        </Spin>
+      </div>
+    </template>
+    <div class="api-log-user-trigger" :class="{ disabled: disabled }">
+      <div v-if="mValue" class="api-log-selected-card">
+        <Avatar :src="mValue.avatar" :size="36">
+          {{ (mValue.name || '?').charAt(0) }}
+        </Avatar>
+        <div class="api-log-selected-meta">
+          <div class="api-log-selected-name">{{ mValue.name }}</div>
+          <div class="api-log-selected-sub">
+            #{{ mValue.id }} · {{ mValue.role_label }}
+          </div>
+        </div>
+        <span
+          v-if="!disabled"
+          class="api-log-clear-btn"
+          @click="clearSelection"
+        >
+          ×
+        </span>
+      </div>
+      <div v-else class="api-log-trigger-placeholder">请选择操作用户</div>
+    </div>
+  </Popover>
+</template>
+
+<style scoped lang="scss">
+@use './picker-card-theme.scss' as theme;
+
+.api-log-user-trigger {
+  width: 100%;
+}
+
+.api-log-user-trigger.disabled {
+  cursor: not-allowed;
+  opacity: 0.65;
+}
+
+.api-log-user-trigger:not(.disabled) {
+  cursor: pointer;
+}
+
+.api-log-selected-card {
+  @include theme.picker-selected-card;
+}
+
+.api-log-selected-meta {
+  min-width: 0;
+  flex: 1;
+}
+
+.api-log-selected-name {
+  font-size: 14px;
+  font-weight: 500;
+  color: #1d2129;
+  line-height: 1.4;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.api-log-selected-sub {
+  font-size: 12px;
+  color: #86909c;
+  line-height: 1.4;
+}
+
+.api-log-trigger-placeholder {
+  @include theme.picker-trigger-placeholder;
+}
+
+.api-log-clear-btn {
+  @include theme.picker-clear-btn;
+}
+
+.dark {
+  .api-log-selected-card {
+    @include theme.picker-selected-card-dark-props;
+  }
+
+  .api-log-selected-name {
+    @include theme.picker-text-primary-dark;
+  }
+
+  .api-log-selected-sub {
+    @include theme.picker-text-secondary-dark;
+  }
+
+  .api-log-trigger-placeholder {
+    @include theme.picker-placeholder-dark-props;
+  }
+
+  .api-log-clear-btn {
+    @include theme.picker-clear-dark-props;
+  }
+}
+</style>
+
+<style lang="scss">
+@use './picker-card-theme.scss' as theme;
+
+.api-log-user-picker-popover {
+  .ant-popover-inner {
+    padding: 12px;
+  }
+
+  .api-log-user-panel {
+    width: 540px;
+    max-width: 86vw;
+  }
+
+  .api-log-user-tabs {
+    margin-bottom: 8px;
+  }
+
+  .api-log-user-search {
+    margin-bottom: 10px;
+  }
+
+  .api-log-user-grid {
+    display: grid;
+    grid-template-columns: repeat(auto-fill, minmax(118px, 1fr));
+    gap: 8px;
+    max-height: 300px;
+    overflow-y: auto;
+    padding: 2px;
+  }
+
+  .api-log-user-card {
+    @include theme.picker-card-base;
+  }
+
+  .api-log-user-card-id {
+    @include theme.picker-card-sub;
+  }
+
+  .api-log-user-card-name {
+    @include theme.picker-card-name;
+  }
+
+  .api-log-user-card-role {
+    margin: 0;
+    font-size: 11px;
+    line-height: 18px;
+    padding: 0 6px;
+    max-width: 100%;
+    overflow: hidden;
+    text-overflow: ellipsis;
+  }
+
+  .api-log-user-empty {
+    margin: 16px 0;
+  }
+}
+
+.dark .api-log-user-picker-popover {
+  .api-log-user-card {
+    @include theme.picker-card-dark-props;
+  }
+
+  .api-log-user-card-name {
+    @include theme.picker-text-primary-dark;
+  }
+
+  .api-log-user-card-id {
+    @include theme.picker-text-secondary-dark;
+  }
+}
+</style>
+
diff --git a/apps/web-antd/src/components/form/components/editor.vue b/apps/web-antd/src/components/form/components/editor.vue
index d928227c..93debba7 100644
--- a/apps/web-antd/src/components/form/components/editor.vue
+++ b/apps/web-antd/src/components/form/components/editor.vue
@@ -1,9 +1,9 @@
 <script setup lang="ts">
 import { ref } from 'vue';
 
+import { preferences } from '@vben/preferences';
+
 import { QuillEditor } from '@vueup/vue-quill';
-// eslint-disable-next-line n/no-extraneous-import
-import '@vueup/vue-quill/dist/vue-quill.snow.css';
 import { useVModel } from '@vueuse/core';
 import { message } from 'ant-design-vue';
 
@@ -11,7 +11,9 @@ import { message } from 'ant-design-vue';
 import { uploadFile } from '#/api/core/upload';
 import { uploadToOss } from '#/utils/oss-upload';
 import { prepareImageForUpload } from '#/utils/prepare-image-upload';
-import { preferences } from '@vben/preferences';
+
+// eslint-disable-next-line n/no-extraneous-import
+import '@vueup/vue-quill/dist/vue-quill.snow.css';
 
 const props = defineProps({
   value: {
@@ -140,26 +142,26 @@ const insertImageToEditor = (quill: any, imageUrl: string): void => {
 };
 /**
  * 图片上传函数
- * 
+ *
  * 该函数根据preferences配置的上传方式，选择使用OSS直传或后端上传：
  * - 'direct': OSS直传模式，文件直接从浏览器上传到阿里云OSS
  * - 'backend': 后端上传模式，文件先上传到后端服务器，再由后端上传到OSS
- * 
+ *
  * 上传方式说明：
  * 1. OSS直传（direct）：
  *    - 调用uploadToOss函数，直接上传到OSS
  *    - 减少服务器负载，上传速度更快
  *    - 支持上传进度回调（如果需要可以添加）
- * 
+ *
  * 2. 后端上传（backend）：
  *    - 调用uploadFile API，通过后端服务器上传
  *    - 兼容现有功能，所有上传逻辑由后端统一处理
- * 
+ *
  * 兼容性处理：
  * - 两种上传方式返回的数据结构保持一致：{ url: string }
  * - 上传成功或失败都会显示相应的提示信息
  * - 上传完成后，将isUpload标记设置为false，允许下次上传
- * 
+ *
  * @param {File} file - 要上传的图片文件
  * @returns {Promise<string>} - 返回上传后的图片URL，如果上传失败返回空字符串
  */
@@ -205,22 +207,22 @@ const uploadImage = async (file: File): Promise<string> => {
       key: 'imageUpload',
       duration: 2,
     });
-    
+
     // 重置上传标记，允许下次上传
     isUpload.value = false;
-    
+
     // 返回上传后的图片URL
     return data.url;
   } catch (error) {
     // 处理上传错误
     console.error('图片上传错误:', error);
-    
+
     // 显示错误提示
     message.error({ content: '图片上传失败', key: 'imageUpload', duration: 2 });
-    
+
     // 重置上传标记，允许重试
     isUpload.value = false;
-    
+
     // 返回空字符串，表示上传失败
     return '';
   }
diff --git a/apps/web-antd/src/components/form/components/markdown-editor.vue b/apps/web-antd/src/components/form/components/markdown-editor.vue
new file mode 100644
index 00000000..a6a741df
--- /dev/null
+++ b/apps/web-antd/src/components/form/components/markdown-editor.vue
@@ -0,0 +1,87 @@
+<script setup lang="ts">
+/**
+ * Markdown 编辑器表单组件（封装 md-editor-v3）
+ * 经 component-map 自动注册，schema 中以 component: 'MarkdownEditor' 使用（vben form 默认 v-model:value 绑定）
+ * 为什么封装：统一精简工具栏（轻量备注场景不需要图片/公式等重型功能）+ 主题跟随系统亮暗切换，避免各表单重复配置
+ */
+import type { ToolbarNames } from 'md-editor-v3';
+
+import { computed, defineAsyncComponent } from 'vue';
+
+import { usePreferences } from '@vben/preferences';
+
+import { useVModel } from '@vueuse/core';
+
+import 'md-editor-v3/lib/style.css';
+
+// 本文件经 component-map 的 eager glob 全量打进主包，md-editor-v3（含 CodeMirror）体积大，
+// 必须异步加载：外壳进主包、库本体在编辑器真正渲染时才拉取，避免拖累全站首屏
+const MdEditor = defineAsyncComponent(() =>
+  import('md-editor-v3').then((m) => m.MdEditor),
+);
+
+const props = defineProps({
+  value: {
+    type: String,
+    default: '',
+  },
+  placeholder: {
+    type: String,
+    default: '请输入内容（支持 Markdown 格式）',
+  },
+  /** 编辑器整体高度（px），弹窗场景建议 200-300 */
+  height: {
+    type: Number,
+    default: 240,
+  },
+});
+const emits = defineEmits(['update:value']);
+const mValue = useVModel(props, 'value', emits, {
+  defaultValue: props.value,
+  passive: true,
+});
+/** 主题必须跟随系统亮/暗切换，不能写死（与消息详情 MdPreview 的处理一致） */
+const { isDark } = usePreferences();
+const theme = computed(() => (isDark.value ? 'dark' : 'light'));
+/** 同页面可能挂载多个编辑器实例（如弹窗嵌套），随机 id 避免内部 DOM id 冲突 */
+const editorId = `md-form-${Math.random().toString(36).slice(2, 9)}`;
+/** 精简工具栏：加粗/斜体/删除线、标题/引用/列表/任务、代码/链接/表格，右侧仅保留预览切换 */
+const toolbars: ToolbarNames[] = [
+  'bold',
+  'italic',
+  'strikeThrough',
+  '-',
+  'title',
+  'quote',
+  'unorderedList',
+  'orderedList',
+  'task',
+  '-',
+  'code',
+  'link',
+  'table',
+  '=',
+  'preview',
+];
+</script>
+<template>
+  <MdEditor
+    :id="editorId"
+    v-model="mValue"
+    :theme="theme"
+    :placeholder="placeholder"
+    :toolbars="toolbars"
+    :footers="[]"
+    :preview="false"
+    :style="{ height: `${height}px` }"
+    class="md-form-editor"
+  />
+</template>
+<style scoped>
+/* 圆角与边框贴近 antd 输入组件，融入表单视觉 */
+.md-form-editor {
+  width: 100%;
+  border: 1px solid hsl(var(--border));
+  border-radius: 6px;
+}
+</style>
diff --git a/apps/web-antd/src/components/form/components/store-multi-search.vue b/apps/web-antd/src/components/form/components/store-multi-search.vue
index 8890a9fc..3f0b1cd1 100644
--- a/apps/web-antd/src/components/form/components/store-multi-search.vue
+++ b/apps/web-antd/src/components/form/components/store-multi-search.vue
@@ -1,12 +1,20 @@
 <script setup lang="ts">
 /**
- * 门店多选搜索组件
- * - 普通输入框输入，下方气泡卡片展示匹配结果（名称 / 拼音首拼）
- * - 选中后在输入框下方用可关闭 Tag 展示「名称【id】」
- * - 搜索结果默认高亮第一项，Enter 可直接选中
- * - 样式使用主题 CSS 变量，自动适配暗色
+ * 门店多选搜索（对齐开方关键字气泡交互）
+ * - Teleport + fixed 锚定，避免搜索栏 overflow 裁切导致「气泡不见」
+ * - 多选：点选后不关闭面板，已选项从列表剔除并以 Tag 展示
+ * - Enter / ↑↓ 键盘选用，Esc 关闭
  */
-import { computed, onMounted, onUnmounted, ref, watch } from 'vue';
+import {
+  computed,
+  nextTick,
+  onMounted,
+  onUnmounted,
+  ref,
+  watch,
+} from 'vue';
+
+import { useUserStore } from '@vben/stores';
 
 import { LoadingOutlined, SearchOutlined } from '@ant-design/icons-vue';
 import { useDebounceFn, useVModel } from '@vueuse/core';
@@ -28,16 +36,11 @@ export type StoreSearchItem = {
 
 const props = withDefaults(
   defineProps<{
-    /** 已选门店 ID 列表 */
     value?: number[];
-    /** 限定类型：0诊所 1药店；不传则诊所+药店都可搜 */
+    /** 0诊所 1药店；不传则诊所+药店 */
     storeType?: 0 | 1;
     placeholder?: string;
     disabled?: boolean;
-    /**
-     * 外部已选门店详情（打开绑定弹窗时回填名称用）
-     * 仅用于 Tag 展示，不改变 value
-     */
     initialItems?: StoreSearchItem[];
   }>(),
   {
@@ -49,23 +52,64 @@ const props = withDefaults(
   },
 );
 
+/**
+ * 模块级搜索结果缓存（所有实例共享）：key = `${userId}|${storeType}|${keyword}`
+ * 门店数据变更低频，TTL 内相同关键词直接命中缓存零等待，避免每敲一个字都等接口转圈。
+ * key 必须拼登录用户 id：不同账号数据权限不同（店管只能搜到本店可见门店），
+ * 切换账号后不允许在 TTL 内命中上一账号的结果，拼 id 后 key 天然隔离
+ */
+const searchResultCache = new Map<
+  string,
+  { at: number; items: StoreSearchItem[] }
+>();
+const SEARCH_CACHE_TTL = 5 * 60 * 1000;
+const SEARCH_CACHE_MAX = 200;
+
+function readSearchCache(key: string): null | StoreSearchItem[] {
+  const hit = searchResultCache.get(key);
+  if (!hit) return null;
+  if (Date.now() - hit.at > SEARCH_CACHE_TTL) {
+    searchResultCache.delete(key);
+    return null;
+  }
+  return hit.items;
+}
+
+function writeSearchCache(key: string, items: StoreSearchItem[]) {
+  // 简单容量控制：超限整体清空（低频触发，无需 LRU）
+  if (searchResultCache.size >= SEARCH_CACHE_MAX) {
+    searchResultCache.clear();
+  }
+  searchResultCache.set(key, { at: Date.now(), items });
+}
+
 const emits = defineEmits<{
   'update:value': [value: number[]];
 }>();
 
+const userStore = useUserStore();
+
+/** 当前登录用户 id（缓存隔离维度；后端返回的 admin 行主键是 id，兜底 vben 的 userId） */
+function currentUserId(): number | string {
+  const info = userStore.userInfo as null | Record<string, any>;
+  return info?.id ?? info?.userId ?? 0;
+}
+
 const mValue = useVModel(props, 'value', emits, {
   passive: true,
   defaultValue: [],
 });
 
 const containerRef = ref<HTMLElement | null>(null);
+const panelRef = ref<HTMLElement | null>(null);
+const listRef = ref<HTMLElement | null>(null);
 const searchKeyword = ref('');
 const loading = ref(false);
 const showDropdown = ref(false);
 const highlightIndex = ref(-1);
 const options = ref<StoreSearchItem[]>([]);
-/** 已选门店详情（用于 Tag 展示名称） */
 const selectedMap = ref<Record<number, StoreSearchItem>>({});
+const panelStyle = ref<Record<string, string>>({});
 
 const selectedIds = computed(() =>
   Array.isArray(mValue.value) ? mValue.value.map(Number) : [],
@@ -78,38 +122,100 @@ const selectedItems = computed(() =>
   }),
 );
 
-/** 下拉中过滤掉已选 */
+/** 下拉中过滤掉已选，方便连续多选 */
 const visibleOptions = computed(() =>
   options.value.filter((item) => !selectedIds.value.includes(item.id)),
 );
 
-/**
- * 将初始/回填门店写入 selectedMap，便于 Tag 显示真实名称
- */
 function mergeInitialItems(items: StoreSearchItem[]) {
   if (!items?.length) return;
   const next = { ...selectedMap.value };
   for (const item of items) {
-    if (item?.id) {
-      next[item.id] = item;
-    }
+    if (item?.id) next[item.id] = item;
   }
   selectedMap.value = next;
 }
 
 /**
- * 请求后端门店搜索；有结果时默认高亮第一项
+ * 相对输入框视口坐标放置面板（与 EntryKeywordBubble 同思路）
  */
+function updatePanelPlacement() {
+  const el = containerRef.value;
+  if (!el) return;
+  const rect = el.getBoundingClientRect();
+  const vw = window.innerWidth;
+  const vh = window.innerHeight;
+  const gap = 4;
+  const pad = 8;
+  const spaceBelow = vh - rect.bottom - pad;
+  const spaceAbove = rect.top - pad;
+  const placeTop = spaceBelow < 200 && spaceAbove > spaceBelow;
+  const avail = Math.max(160, placeTop ? spaceAbove : spaceBelow);
+  const maxH = Math.min(320, avail);
+  const width = Math.min(Math.max(rect.width, 360), vw - pad * 2);
+  let left = rect.left;
+  if (left + width > vw - pad) left = vw - pad - width;
+  if (left < pad) left = pad;
+
+  const base: Record<string, string> = {
+    position: 'fixed',
+    zIndex: '4000',
+    width: `${width}px`,
+    maxHeight: `${maxH}px`,
+    left: `${left}px`,
+    right: 'auto',
+  };
+  panelStyle.value = placeTop
+    ? {
+        ...base,
+        top: 'auto',
+        bottom: `${Math.max(pad, vh - rect.top + gap)}px`,
+      }
+    : {
+        ...base,
+        top: `${rect.bottom + gap}px`,
+        bottom: 'auto',
+      };
+}
+
+async function openPanel() {
+  showDropdown.value = true;
+  await nextTick();
+  updatePanelPlacement();
+}
+
+/** 请求序号：只采纳最后一次请求的响应，避免快速输入时慢响应覆盖新结果 */
+let fetchSeq = 0;
+
 async function fetchOptions() {
   const keyword = searchKeyword.value.trim();
   if (!keyword) {
+    // 递增序号让在途请求作废，避免清空后慢响应又把旧结果写回来
+    fetchSeq += 1;
+    loading.value = false;
     options.value = [];
     showDropdown.value = false;
     highlightIndex.value = -1;
     return;
   }
+
+  const cacheKey = `${currentUserId()}|${props.storeType ?? 'all'}|${keyword}`;
+  const cachedItems = readSearchCache(cacheKey);
+  if (cachedItems) {
+    // 命中缓存：直接渲染，不发请求不转 loading（体感「秒出」）
+    fetchSeq += 1;
+    loading.value = false;
+    options.value = cachedItems;
+    await openPanel();
+    highlightIndex.value = visibleOptions.value.length > 0 ? 0 : -1;
+    await nextTick();
+    updatePanelPlacement();
+    return;
+  }
+
+  const seq = (fetchSeq += 1);
   loading.value = true;
-  showDropdown.value = true;
+  await openPanel();
   try {
     const res = await searchStoreOption({
       keyword,
@@ -118,14 +224,21 @@ async function fetchOptions() {
         : {}),
       limit: 20,
     });
-    options.value = res?.items ?? [];
-    // 默认高亮第一项，Enter 可直接选中
-    highlightIndex.value = options.value.length > 0 ? 0 : -1;
+    if (seq !== fetchSeq) return;
+    const items = res?.items ?? [];
+    writeSearchCache(cacheKey, items);
+    options.value = items;
+    highlightIndex.value = visibleOptions.value.length > 0 ? 0 : -1;
+    await nextTick();
+    updatePanelPlacement();
   } catch {
+    if (seq !== fetchSeq) return;
     options.value = [];
     highlightIndex.value = -1;
   } finally {
-    loading.value = false;
+    if (seq === fetchSeq) {
+      loading.value = false;
+    }
   }
 }
 
@@ -136,30 +249,36 @@ function handleInput() {
 }
 
 function handleFocus() {
-  if (visibleOptions.value.length > 0) {
-    showDropdown.value = true;
-    if (highlightIndex.value < 0) {
+  if (searchKeyword.value.trim() && options.value.length > 0) {
+    openPanel();
+    if (highlightIndex.value < 0 && visibleOptions.value.length > 0) {
       highlightIndex.value = 0;
     }
   }
 }
 
 /**
- * 选中一项：追加到 value，缓存名称，清空输入继续搜
+ * 多选：追加 ID，保留关键词与面板，不关闭气泡
  */
 function selectOption(item: StoreSearchItem) {
   if (selectedIds.value.includes(item.id)) return;
   selectedMap.value = { ...selectedMap.value, [item.id]: item };
   mValue.value = [...selectedIds.value, item.id];
-  searchKeyword.value = '';
-  options.value = [];
-  showDropdown.value = false;
-  highlightIndex.value = -1;
+  // 高亮下一项（列表已剔除刚选的）
+  nextTick(() => {
+    if (visibleOptions.value.length === 0) {
+      highlightIndex.value = -1;
+      return;
+    }
+    highlightIndex.value = Math.min(
+      Math.max(highlightIndex.value, 0),
+      visibleOptions.value.length - 1,
+    );
+    updatePanelPlacement();
+    scrollHighlightIntoView();
+  });
 }
 
-/**
- * 取消某个已选门店
- */
 function removeSelected(id: number) {
   mValue.value = selectedIds.value.filter((x) => x !== id);
   const next = { ...selectedMap.value };
@@ -167,19 +286,52 @@ function removeSelected(id: number) {
   selectedMap.value = next;
 }
 
+function closePanel() {
+  showDropdown.value = false;
+  highlightIndex.value = -1;
+}
+
+/** 仅改 list 的 scrollTop，表头固定不动 */
+function scrollHighlightIntoView() {
+  nextTick(() => {
+    const listEl = listRef.value;
+    if (!listEl || highlightIndex.value < 0) return;
+    const el = listEl.querySelector(
+      `[data-store-opt-index="${highlightIndex.value}"]`,
+    ) as HTMLElement | null;
+    if (!el) return;
+    const listRect = listEl.getBoundingClientRect();
+    const elRect = el.getBoundingClientRect();
+    const deltaTop = elRect.top - listRect.top;
+    const deltaBottom = elRect.bottom - listRect.bottom;
+    if (deltaTop < 0) {
+      listEl.scrollTop += deltaTop;
+    } else if (deltaBottom > 0) {
+      listEl.scrollTop += deltaBottom;
+    }
+  });
+}
+
 function handleKeydown(e: KeyboardEvent) {
-  if (!showDropdown.value || visibleOptions.value.length === 0) return;
+  if (!showDropdown.value || visibleOptions.value.length === 0) {
+    if (e.key === 'Escape') closePanel();
+    return;
+  }
+  const len = visibleOptions.value.length;
   switch (e.key) {
     case 'ArrowDown':
       e.preventDefault();
-      highlightIndex.value = Math.min(
-        Math.max(highlightIndex.value, 0) + 1,
-        visibleOptions.value.length - 1,
-      );
+      // 头尾循环：最后一项再按下 → 回到第一项
+      highlightIndex.value =
+        highlightIndex.value < 0 ? 0 : (highlightIndex.value + 1) % len;
+      scrollHighlightIntoView();
       break;
     case 'ArrowUp':
       e.preventDefault();
-      highlightIndex.value = Math.max(highlightIndex.value - 1, 0);
+      // 头尾循环：第一项再按上 → 跳到最后一项
+      highlightIndex.value =
+        highlightIndex.value <= 0 ? len - 1 : highlightIndex.value - 1;
+      scrollHighlightIntoView();
       break;
     case 'Enter':
       e.preventDefault();
@@ -190,35 +342,42 @@ function handleKeydown(e: KeyboardEvent) {
       }
       break;
     case 'Escape':
-      showDropdown.value = false;
-      highlightIndex.value = -1;
+      e.preventDefault();
+      closePanel();
       break;
   }
 }
 
 function handleClickOutside(e: MouseEvent) {
-  if (containerRef.value && !containerRef.value.contains(e.target as Node)) {
-    showDropdown.value = false;
-    highlightIndex.value = -1;
-  }
+  if (!showDropdown.value) return;
+  const t = e.target as Node;
+  if (containerRef.value?.contains(t) || panelRef.value?.contains(t)) return;
+  closePanel();
+}
+
+function onWinChange() {
+  if (showDropdown.value) updatePanelPlacement();
 }
 
 onMounted(() => {
-  document.addEventListener('click', handleClickOutside);
+  document.addEventListener('mousedown', handleClickOutside);
+  window.addEventListener('resize', onWinChange);
+  window.addEventListener('scroll', onWinChange, true);
   mergeInitialItems(props.initialItems || []);
 });
 
 onUnmounted(() => {
-  document.removeEventListener('click', handleClickOutside);
+  document.removeEventListener('mousedown', handleClickOutside);
+  window.removeEventListener('resize', onWinChange);
+  window.removeEventListener('scroll', onWinChange, true);
 });
 
 watch(
   () => props.storeType,
   () => {
     options.value = [];
-    showDropdown.value = false;
+    closePanel();
     searchKeyword.value = '';
-    highlightIndex.value = -1;
   },
 );
 
@@ -227,6 +386,17 @@ watch(
   (items) => mergeInitialItems(items || []),
   { deep: true },
 );
+
+watch(visibleOptions, (list) => {
+  if (!showDropdown.value) return;
+  if (list.length === 0) {
+    highlightIndex.value = -1;
+    return;
+  }
+  if (highlightIndex.value >= list.length) {
+    highlightIndex.value = list.length - 1;
+  }
+});
 </script>
 
 <template>
@@ -246,33 +416,50 @@ watch(
       </template>
     </Input>
 
-    <!-- 气泡建议列表 -->
-    <div v-if="showDropdown" class="store-multi-search__dropdown">
-      <Spin :spinning="loading">
-        <Empty
-          v-if="!loading && visibleOptions.length === 0"
-          :image="Empty.PRESENTED_IMAGE_SIMPLE"
-          description="暂无匹配门店"
-          class="py-3"
-        />
-        <div
-          v-for="(item, index) in visibleOptions"
-          :key="item.id"
-          class="store-multi-search__option"
-          :class="{ 'is-active': index === highlightIndex }"
-          @mousedown.prevent="selectOption(item)"
-        >
-          <div class="store-multi-search__option-name">
-            {{ item.name }}【{{ item.id }}】
-          </div>
-          <div v-if="item.shouzimu" class="store-multi-search__option-sub">
-            首拼：{{ item.shouzimu }}
-          </div>
+    <Teleport to="body">
+      <div
+        v-if="showDropdown"
+        ref="panelRef"
+        class="store-multi-search__panel"
+        :style="panelStyle"
+      >
+        <div class="store-multi-search__hint">
+          <span>↑↓ 循环切换 · Enter 选用 · Esc 关闭 · 可连续多选</span>
+          <span class="store-multi-search__count">
+            剩 {{ visibleOptions.length }} 条可选
+          </span>
         </div>
-      </Spin>
-    </div>
+        <div class="store-multi-search__body">
+          <Spin :spinning="loading">
+            <Empty
+              v-if="!loading && visibleOptions.length === 0"
+              :image="Empty.PRESENTED_IMAGE_SIMPLE"
+              description="暂无匹配门店（或已全部选中）"
+              class="py-3"
+            />
+            <div ref="listRef" class="store-multi-search__list">
+              <button
+                v-for="(item, index) in visibleOptions"
+                :key="item.id"
+                type="button"
+                class="store-multi-search__option"
+                :class="{ 'is-active': index === highlightIndex }"
+                :data-store-opt-index="index"
+                @mousedown.prevent="selectOption(item)"
+              >
+                <div class="store-multi-search__option-name">
+                  {{ item.name }}【{{ item.id }}】
+                </div>
+                <div v-if="item.shouzimu" class="store-multi-search__option-sub">
+                  首拼：{{ item.shouzimu }}
+                </div>
+              </button>
+            </div>
+          </Spin>
+        </div>
+      </div>
+    </Teleport>
 
-    <!-- 已选 Tag -->
     <div v-if="selectedItems.length > 0" class="store-multi-search__tags">
       <Tag
         v-for="item in selectedItems"
@@ -281,47 +468,126 @@ watch(
         color="blue"
         @close="() => removeSelected(item.id)"
       >
-        {{ item.name }}【{{ item.id }}】
+        <!-- 文本单独包一层才能做省略：antd Tag 的内容是裸文本节点，无法直接限宽 -->
+        <span
+          class="store-multi-search__tag-text"
+          :title="`${item.name}【${item.id}】`"
+        >
+          {{ item.name }}【{{ item.id }}】
+        </span>
       </Tag>
     </div>
   </div>
 </template>
 
 <style scoped lang="scss">
-/* 只用框架主题变量，随亮暗/主题色自动适配 */
 .store-multi-search {
   position: relative;
   width: 100%;
 }
 
-.store-multi-search__dropdown {
-  position: absolute;
-  z-index: 1050;
-  top: calc(100% + 4px);
-  left: 0;
-  right: 0;
-  max-height: 280px;
-  overflow-y: auto;
-  padding: 6px;
-  border-radius: 8px;
-  background: hsl(var(--card));
+.store-multi-search__tags {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 6px;
+  margin-top: 8px;
+
+  /* 单个超长门店名不能撑破容器：限宽 + 省略号，完整名走 title 悬停提示 */
+  :deep(.ant-tag) {
+    display: inline-flex;
+    align-items: center;
+    max-width: 100%;
+    min-width: 0;
+    /* 间距交给 gap 控制，去掉 antd 自带右外边距避免换行时右侧不齐 */
+    margin-inline-end: 0;
+  }
+
+  :deep(.ant-tag-close-icon) {
+    flex-shrink: 0;
+  }
+}
+
+.store-multi-search__tag-text {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+</style>
+
+<style lang="scss">
+/* Teleport 到 body，非 scoped，避免气泡被裁切/丢样式 */
+.store-multi-search__panel {
+  overflow: hidden;
+  display: flex;
+  flex-direction: column;
+  border-radius: 10px;
+  background: hsl(var(--card, var(--background)));
   border: 1px solid hsl(var(--border));
   box-shadow:
-    0 6px 16px 0 rgba(0, 0, 0, 0.08),
-    0 3px 6px -4px rgba(0, 0, 0, 0.12),
-    0 9px 28px 8px rgba(0, 0, 0, 0.05);
+    0 8px 24px hsl(0 0% 0% / 0.12),
+    0 2px 8px hsl(0 0% 0% / 0.06);
+}
+
+.store-multi-search__hint {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 8px;
+  flex-shrink: 0;
+  padding: 8px 12px;
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+  border-bottom: 1px solid hsl(var(--border));
+  background: hsl(var(--muted) / 0.35);
+}
+
+.store-multi-search__count {
+  flex-shrink: 0;
+  font-variant-numeric: tabular-nums;
+}
+
+/* 表头固定，仅 body/list 滚动 */
+.store-multi-search__body {
+  flex: 1;
+  min-height: 0;
+  overflow: hidden;
+  display: flex;
+  flex-direction: column;
+}
+
+.store-multi-search__body .ant-spin-nested-loading,
+.store-multi-search__body .ant-spin-container {
+  flex: 1;
+  min-height: 0;
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
+}
+
+.store-multi-search__list {
+  flex: 1;
+  min-height: 0;
+  overflow-x: hidden;
+  overflow-y: auto;
+  padding: 6px;
 }
 
 .store-multi-search__option {
+  display: block;
+  width: 100%;
+  text-align: left;
   padding: 8px 10px;
+  border: 0;
   border-radius: 6px;
   cursor: pointer;
+  background: transparent;
   transition: background 0.15s;
+}
 
-  &:hover,
-  &.is-active {
-    background: hsl(var(--accent-hover));
-  }
+.store-multi-search__option:hover,
+.store-multi-search__option.is-active {
+  background: hsl(var(--accent) / 0.85);
 }
 
 .store-multi-search__option-name {
@@ -336,11 +602,4 @@ watch(
   font-size: 12px;
   color: hsl(var(--muted-foreground));
 }
-
-.store-multi-search__tags {
-  display: flex;
-  flex-wrap: wrap;
-  gap: 6px;
-  margin-top: 8px;
-}
 </style>
diff --git a/apps/web-antd/src/components/loading/PrescriptionLoading.vue b/apps/web-antd/src/components/loading/PrescriptionLoading.vue
index 4996776f..232e3b06 100644
--- a/apps/web-antd/src/components/loading/PrescriptionLoading.vue
+++ b/apps/web-antd/src/components/loading/PrescriptionLoading.vue
@@ -666,12 +666,12 @@ onUnmounted(() => {
   width: 100%;
   height: 100%;
   min-height: 220px;
-  //background: #ffffff;
+  /* background: #ffffff; */
   border-radius: 12px;
   overflow: hidden;
 }
 .loading-wrapper--dark {
-  //background: #1e2227;
+  /* background: #1e2227; */
 }
 .loading-canvas {
   display: block;
diff --git a/apps/web-antd/src/components/stat-islands/index.ts b/apps/web-antd/src/components/stat-islands/index.ts
new file mode 100644
index 00000000..611ceb84
--- /dev/null
+++ b/apps/web-antd/src/components/stat-islands/index.ts
@@ -0,0 +1,5 @@
+/**
+ * 通用统计岛组件导出：紧凑玻璃质感统计小卡（设计对齐提现管理账户卡统计岛）
+ */
+export { default as StatIslands } from './stat-islands.vue';
+export type { StatIslandItem } from './typing';
diff --git a/apps/web-antd/src/components/stat-islands/stat-islands.vue b/apps/web-antd/src/components/stat-islands/stat-islands.vue
new file mode 100644
index 00000000..6e765707
--- /dev/null
+++ b/apps/web-antd/src/components/stat-islands/stat-islands.vue
@@ -0,0 +1,166 @@
+<script setup lang="ts">
+/**
+ * 通用统计岛组件：一行多个紧凑玻璃质感统计小卡
+ *
+ * 设计语言与提现管理账户卡的统计岛（finance/withdrawal AccountInfoCard）完全一致：
+ * 12px 圆角 + 1px 边框 + 主色渐变玻璃底 + 右上角 SVG 图标 + 角落径向荧光 +
+ * DIN 等宽大数字，hover 主色边框浮起。用于替换各页面过大的 AnalysisOverview 大卡。
+ */
+import { IconifyIcon as VbenIcon } from '@vben/icons';
+
+import type { StatIslandItem } from './typing';
+
+withDefaults(
+  defineProps<{
+    items: StatIslandItem[];
+    /** 每行列数（桌面端），默认 4；窄屏自动降为 2 列 */
+    columns?: number;
+  }>(),
+  { columns: 4 },
+);
+
+/** 金额展示为两位小数；非数字原样透出（如「—」占位） */
+function formatValue(val: number | string) {
+  const n = Number(val);
+  return Number.isFinite(n) ? n.toFixed(2) : String(val);
+}
+</script>
+
+<template>
+  <div class="stat-islands" :style="{ '--stat-cols': columns }">
+    <article
+      v-for="item in items"
+      :key="item.key"
+      class="stat-island"
+      :class="{ 'stat-island--emphasize': item.emphasize }"
+      :aria-label="item.label"
+    >
+      <div class="stat-island-glow" />
+      <VbenIcon class="stat-icon" :icon="item.icon" />
+      <div class="stat-label">{{ item.label }}</div>
+      <div class="stat-val">
+        <span v-if="item.prefix !== ''" class="stat-val-prefix">{{ item.prefix ?? '¥' }}</span>
+        {{ formatValue(item.value) }}
+      </div>
+    </article>
+  </div>
+</template>
+
+<style scoped>
+.stat-islands {
+  display: grid;
+  grid-template-columns: repeat(var(--stat-cols, 4), minmax(0, 1fr));
+  gap: 10px;
+}
+
+@media (max-width: 767px) {
+  .stat-islands {
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+  }
+}
+
+/* 统计岛：玻璃质感 + 右上角图标 + 淡荧光（与提现管理 stat-island 同规格） */
+.stat-island {
+  position: relative;
+  overflow: hidden;
+  padding: 14px;
+  cursor: default;
+  background: linear-gradient(
+    135deg,
+    hsl(var(--primary) / 4%),
+    hsl(var(--card, var(--background)))
+  );
+  backdrop-filter: blur(8px);
+  border: 1px solid hsl(var(--border));
+  border-radius: 12px;
+  transition:
+    transform 0.2s ease,
+    box-shadow 0.2s ease,
+    border-color 0.2s ease;
+}
+
+.stat-island:hover {
+  border-color: hsl(var(--primary) / 40%);
+  box-shadow:
+    0 8px 20px hsl(var(--primary) / 14%),
+    0 2px 6px rgb(0 0 0 / 6%);
+  transform: translateY(-3px);
+}
+
+/* 角落局部高光，强化荧光感 */
+.stat-island-glow {
+  position: absolute;
+  top: -40px;
+  right: -40px;
+  width: 110px;
+  height: 110px;
+  pointer-events: none;
+  background: radial-gradient(circle, hsl(var(--primary) / 18%) 0%, transparent 70%);
+  opacity: 0.5;
+  transition: opacity 0.2s ease;
+}
+
+.stat-island:hover .stat-island-glow {
+  opacity: 1;
+}
+
+/* 强调项：主色字 + 更强荧光 */
+.stat-island--emphasize {
+  background: linear-gradient(
+    135deg,
+    hsl(var(--primary) / 10%),
+    hsl(var(--card, var(--background)))
+  );
+  border-color: hsl(var(--primary) / 30%);
+}
+
+.stat-island--emphasize .stat-island-glow {
+  opacity: 0.85;
+}
+
+.stat-island--emphasize .stat-val {
+  color: hsl(var(--primary));
+}
+
+/* 右上角图标：固定 24x24，主色调 */
+.stat-icon {
+  position: absolute;
+  top: 12px;
+  right: 12px;
+  width: 24px;
+  height: 24px;
+  color: hsl(var(--primary) / 70%);
+  transition: color 0.2s ease;
+}
+
+.stat-island:hover .stat-icon {
+  color: hsl(var(--primary));
+}
+
+.stat-label {
+  position: relative;
+  z-index: 1;
+  padding-right: 32px;
+  margin-bottom: 6px;
+  font-size: 12px;
+  line-height: 1.2;
+  color: hsl(var(--muted-foreground));
+}
+
+.stat-val {
+  position: relative;
+  z-index: 1;
+  font-family: 'DIN Alternate', ui-monospace, SFMono-Regular, Menlo, monospace;
+  font-size: 18px;
+  font-weight: 700;
+  line-height: 1.2;
+  color: hsl(var(--foreground));
+}
+
+.stat-val-prefix {
+  margin-right: 2px;
+  font-size: 12px;
+  font-weight: 500;
+  color: hsl(var(--muted-foreground));
+}
+</style>
diff --git a/apps/web-antd/src/components/stat-islands/typing.ts b/apps/web-antd/src/components/stat-islands/typing.ts
new file mode 100644
index 00000000..f32cc0b7
--- /dev/null
+++ b/apps/web-antd/src/components/stat-islands/typing.ts
@@ -0,0 +1,19 @@
+/**
+ * 统计岛组件类型定义（独立文件避免 index ↔ 组件循环引用）
+ */
+
+/** 统计岛单项配置 */
+export interface StatIslandItem {
+  /** 唯一 key */
+  key: string;
+  /** 指标名（小灰字） */
+  label: string;
+  /** 指标值（数字，内部格式化两位小数） */
+  value: number | string;
+  /** iconify 图标名（右上角，规范：SVG 图标不用 emoji） */
+  icon: string;
+  /** 是否强调（主色字 + 更强荧光） */
+  emphasize?: boolean;
+  /** 值前缀，默认 ¥；传空串则不显示前缀 */
+  prefix?: string;
+}
diff --git a/apps/web-antd/src/components/table-action/card-actions.vue b/apps/web-antd/src/components/table-action/card-actions.vue
new file mode 100644
index 00000000..f7193758
--- /dev/null
+++ b/apps/web-antd/src/components/table-action/card-actions.vue
@@ -0,0 +1,88 @@
+<script setup lang="ts">
+/**
+ * 卡片视图专用操作栏（与列表交互解耦）
+ *
+ * 列表单元格里 TableAction 平铺全部按钮没问题，但卡片 footer 空间小，
+ * 按钮超过 2 个会触发 TableAction 的两列 grid 换行堆叠，显得杂乱。
+ * 这里改成 C 端惯例：只露出前 maxVisible 个主操作（默认 1 个，通常是「详情」），
+ * 其余操作全部合并进「···」下拉菜单。
+ *
+ * 权限（auth）/ 显隐（ifShow）/ 二次确认（popConfirm）逻辑不重写：
+ * - 挑主操作前先按与 TableAction 相同的规则过滤，保证露出的一定是可见按钮；
+ * - 渲染仍复用 TableAction（flex=false 关闭多列 grid），菜单项行为完全一致。
+ */
+import type { ActionItem } from './types';
+
+import { computed } from 'vue';
+
+import { useAccess } from '@vben/access';
+import { isBoolean, isFunction } from '@vben/utils';
+
+import { Button } from 'ant-design-vue';
+
+import { Icon } from '#/components/icon';
+
+import TableAction from './table-action.vue';
+
+const props = withDefaults(
+  defineProps<{
+    actions?: ActionItem[];
+    dropDownActions?: ActionItem[];
+    /** 露出的主操作数量，其余进「···」菜单 */
+    maxVisible?: number;
+  }>(),
+  {
+    actions: () => [],
+    dropDownActions: () => [],
+    maxVisible: 1,
+  },
+);
+
+const { hasAccessByCodes } = useAccess();
+
+/** 与 TableAction 同规则判断单个操作是否可见（auth + ifShow） */
+function isActionVisible(action: ActionItem): boolean {
+  const authPass =
+    (action.auth || []).length === 0 || hasAccessByCodes(action.auth || []);
+  if (!authPass) return false;
+  const ifShow = action.ifShow;
+  if (isBoolean(ifShow)) return ifShow;
+  if (isFunction(ifShow)) return ifShow(action);
+  return true;
+}
+
+/** 过滤后的可见操作：前 maxVisible 个露出，其余与原下拉操作合并进「···」 */
+const splitActions = computed(() => {
+  const visible = (props.actions || []).filter((action) =>
+    isActionVisible(action),
+  );
+  return {
+    primary: visible.slice(0, props.maxVisible),
+    // 下拉里的项 TableAction 会再过滤一遍 auth/ifShow，这里直接透传原始项即可
+    rest: [...visible.slice(props.maxVisible), ...(props.dropDownActions || [])],
+  };
+});
+</script>
+
+<template>
+  <TableAction
+    :actions="splitActions.primary"
+    :drop-down-actions="splitActions.rest"
+    :flex="false"
+  >
+    <!-- 默认的「···」图标点击区太小，换成 link 文字「更多」，与主操作按钮同视觉 -->
+    <template #more>
+      <Button size="small" type="link" class="card-actions__more">
+        更多
+        <Icon icon="ant-design:down-outlined" class="card-actions__more-icon" />
+      </Button>
+    </template>
+  </TableAction>
+</template>
+
+<style scoped lang="scss">
+/* 箭头比文字略小一号；左间距由 TableAction 全局的 span+iconify 规则统一控制 */
+.card-actions__more-icon {
+  font-size: 10px;
+}
+</style>
diff --git a/apps/web-antd/src/components/table-action/index.ts b/apps/web-antd/src/components/table-action/index.ts
index 00b7e6b6..39d9991a 100644
--- a/apps/web-antd/src/components/table-action/index.ts
+++ b/apps/web-antd/src/components/table-action/index.ts
@@ -1,2 +1,3 @@
+export { default as CardActions } from './card-actions.vue';
 export { default as TableAction } from './table-action.vue';
 export type * from './types.d.ts';
diff --git a/apps/web-antd/src/components/view-mode-switch/index.ts b/apps/web-antd/src/components/view-mode-switch/index.ts
new file mode 100644
index 00000000..fe39309b
--- /dev/null
+++ b/apps/web-antd/src/components/view-mode-switch/index.ts
@@ -0,0 +1,3 @@
+export { useViewMode } from './use-view-mode';
+export type { ViewMode } from './use-view-mode';
+export { default as ViewModeSwitch } from './view-mode-switch.vue';
diff --git a/apps/web-antd/src/components/view-mode-switch/use-view-mode.ts b/apps/web-antd/src/components/view-mode-switch/use-view-mode.ts
new file mode 100644
index 00000000..0ce529ef
--- /dev/null
+++ b/apps/web-antd/src/components/view-mode-switch/use-view-mode.ts
@@ -0,0 +1,49 @@
+import type { Ref } from 'vue';
+
+import { ref, watch } from 'vue';
+
+/**
+ * 通用「列表/卡片」视图模式类型
+ * list=表格列表视图，card=卡片看板视图
+ */
+export type ViewMode = 'card' | 'list';
+
+/**
+ * 视图模式记忆 Hook
+ *
+ * 为什么封装：商品订单/处方订单/挂号订单等多个列表页都需要「列表/卡片」切换，
+ * 且要求刷新后记住用户上次选择。统一在这里读写 localStorage，
+ * 各页面只需传入唯一 storageKey，避免每页复制一份存取逻辑。
+ *
+ * @param storageKey localStorage 键名（建议 `<模块>-view-mode`，如 `product-order-view-mode`）
+ * @param defaultMode 无记忆时的默认视图，默认列表
+ * @returns 响应式视图模式 ref，直接 v-model 给 ViewModeSwitch 组件即可
+ */
+export function useViewMode(
+  storageKey: string,
+  defaultMode: ViewMode = 'list',
+): Ref<ViewMode> {
+  // 初始化时同步读取本地记忆，避免先渲染默认视图再闪切
+  const readStored = (): ViewMode => {
+    try {
+      const raw = localStorage.getItem(storageKey);
+      if (raw === 'list' || raw === 'card') return raw;
+    } catch {
+      // localStorage 不可用（隐私模式等）时静默回退默认值
+    }
+    return defaultMode;
+  };
+
+  const viewMode = ref<ViewMode>(readStored());
+
+  // 切换后立即写回，下次进入页面直接还原
+  watch(viewMode, (mode) => {
+    try {
+      localStorage.setItem(storageKey, mode);
+    } catch {
+      // 写入失败不影响功能，忽略
+    }
+  });
+
+  return viewMode;
+}
diff --git a/apps/web-antd/src/components/view-mode-switch/view-mode-switch.vue b/apps/web-antd/src/components/view-mode-switch/view-mode-switch.vue
new file mode 100644
index 00000000..4d32e1fb
--- /dev/null
+++ b/apps/web-antd/src/components/view-mode-switch/view-mode-switch.vue
@@ -0,0 +1,112 @@
+<script setup lang="ts">
+/**
+ * 通用「列表/卡片」视图切换组件
+ *
+ * 为什么封装：多个订单列表页都需要同样的切换控件，统一外观（图标+文字的分段控件）
+ * 与交互，配合 useViewMode(storageKey) 使用自带记忆能力。
+ *
+ * 用法：
+ *   const viewMode = useViewMode('product-order-view-mode');
+ *   <ViewModeSwitch v-model="viewMode" />
+ */
+import type { ViewMode } from './use-view-mode';
+
+import { IconifyIcon } from '@vben/icons';
+
+defineOptions({ name: 'ViewModeSwitch' });
+
+withDefaults(
+  defineProps<{
+    /** 卡片视图文案，允许按页面语境自定义（如「卡片看板」） */
+    cardLabel?: string;
+    /** 列表视图文案 */
+    listLabel?: string;
+  }>(),
+  {
+    cardLabel: '卡片',
+    listLabel: '列表',
+  },
+);
+
+/** 当前视图模式，v-model 双向绑定，记忆逻辑由 useViewMode 承担 */
+const modelValue = defineModel<ViewMode>({ default: 'list' });
+
+/** 切换视图：点击已选中项不重复触发 */
+function switchTo(mode: ViewMode) {
+  if (modelValue.value !== mode) {
+    modelValue.value = mode;
+  }
+}
+</script>
+
+<template>
+  <div class="view-mode-switch" role="radiogroup" aria-label="视图切换">
+    <button
+      type="button"
+      class="vms-item"
+      :class="{ active: modelValue === 'list' }"
+      role="radio"
+      :aria-checked="modelValue === 'list'"
+      @click="switchTo('list')"
+    >
+      <IconifyIcon icon="ant-design:bars-outlined" class="vms-icon" />
+      <span>{{ listLabel }}</span>
+    </button>
+    <button
+      type="button"
+      class="vms-item"
+      :class="{ active: modelValue === 'card' }"
+      role="radio"
+      :aria-checked="modelValue === 'card'"
+      @click="switchTo('card')"
+    >
+      <IconifyIcon icon="ant-design:appstore-outlined" class="vms-icon" />
+      <span>{{ cardLabel }}</span>
+    </button>
+  </div>
+</template>
+
+<style lang="less" scoped>
+/* App 风格分段控件：胶囊容器 + 滑块式选中态，颜色全部走主题变量适配暗色 */
+.view-mode-switch {
+  display: inline-flex;
+  gap: 2px;
+  padding: 3px;
+  background: hsl(var(--muted) / 60%);
+  border: 1px solid hsl(var(--border) / 60%);
+  border-radius: 10px;
+}
+
+.vms-item {
+  display: inline-flex;
+  align-items: center;
+  gap: 5px;
+  padding: 4px 14px;
+  font-size: 13px;
+  line-height: 20px;
+  color: hsl(var(--muted-foreground));
+  cursor: pointer;
+  background: transparent;
+  border: none;
+  border-radius: 8px;
+  transition:
+    background 0.18s ease,
+    color 0.18s ease,
+    box-shadow 0.18s ease;
+
+  &:hover {
+    color: hsl(var(--foreground));
+  }
+
+  &.active {
+    font-weight: 600;
+    color: hsl(var(--primary));
+    background: hsl(var(--background));
+    box-shadow: 0 1px 4px hsl(var(--foreground) / 10%);
+  }
+}
+
+.vms-icon {
+  font-size: 15px;
+}
+</style>
diff --git a/apps/web-antd/src/components/vip/HeaderVipBadge.vue b/apps/web-antd/src/components/vip/HeaderVipBadge.vue
index 1fe6d3a9..5969be6f 100644
--- a/apps/web-antd/src/components/vip/HeaderVipBadge.vue
+++ b/apps/web-antd/src/components/vip/HeaderVipBadge.vue
@@ -145,8 +145,9 @@ function openRecords() {
     >
       <template #content>
         <div class="header-vip-bubble">
-          <!-- 诊所端风格会员卡头图 -->
+          <!-- 黑金会员卡头图：与诊所设置/小程序会员卡同一视觉语言 -->
           <div class="header-vip-hero">
+            <div class="header-vip-hero__glow"></div>
             <VipBadgeCombo
               v-if="hasVipVisual"
               size="lg"
@@ -157,8 +158,10 @@ function openRecords() {
             />
             <div v-else class="header-vip-hero__placeholder">V</div>
             <div class="header-vip-hero__info">
-              <div class="header-vip-hero__title">{{ levelName }}</div>
-              <div class="header-vip-hero__sub">{{ durationLabel }}</div>
+              <div class="header-vip-hero__title-row">
+                <span class="header-vip-hero__title">{{ levelName }}</span>
+                <span class="header-vip-hero__chip">{{ durationLabel }}</span>
+              </div>
               <div class="header-vip-hero__expire">{{ expireText }}</div>
             </div>
           </div>
@@ -244,19 +247,37 @@ function openRecords() {
   background: hsl(var(--card, var(--background)));
   box-shadow: 0 8px 24px hsl(var(--foreground) / 0.12);
 }
+/* 黑金卡头：深色卡面亮暗主题通用 */
 .header-vip-hero {
+  position: relative;
   display: flex;
   align-items: center;
   gap: 14px;
   padding: 16px 18px;
-  background: linear-gradient(135deg, #2c3e50 0%, #3d5a40 50%, #6acdbb 100%);
+  overflow: hidden;
+  background:
+    radial-gradient(120% 160% at 100% 0%, rgba(212, 175, 55, 0.22) 0%, rgba(212, 175, 55, 0) 45%),
+    linear-gradient(135deg, #23201a 0%, #12100c 55%, #1f1a12 100%);
+  border-bottom: 1px solid rgba(220, 186, 110, 0.3);
+}
+.header-vip-hero__glow {
+  position: absolute;
+  top: -50px;
+  right: -40px;
+  width: 160px;
+  height: 160px;
+  border-radius: 50%;
+  background: radial-gradient(circle, rgba(240, 217, 168, 0.26) 0%, rgba(240, 217, 168, 0) 70%);
+  pointer-events: none;
 }
 .header-vip-hero__placeholder {
   width: 72px;
   height: 72px;
   border-radius: 50%;
-  background: rgba(255, 255, 255, 0.18);
-  color: #fff;
+  background: radial-gradient(circle, rgba(212, 175, 55, 0.16) 0%, rgba(212, 175, 55, 0.04) 100%);
+  border: 1px solid rgba(220, 186, 110, 0.4);
+  color: #f0d9a8;
+  text-shadow: 0 2px 8px rgba(212, 175, 55, 0.4);
   font-size: 28px;
   font-weight: 700;
   display: flex;
@@ -265,23 +286,36 @@ function openRecords() {
   flex-shrink: 0;
 }
 .header-vip-hero__info {
+  position: relative;
   min-width: 0;
-  color: #fff;
+}
+.header-vip-hero__title-row {
+  display: flex;
+  align-items: center;
+  gap: 8px;
 }
 .header-vip-hero__title {
   font-size: 18px;
   font-weight: 700;
   line-height: 1.3;
+  color: #f5e3bd;
+  letter-spacing: 1px;
+  text-shadow: 0 2px 6px rgba(0, 0, 0, 0.35);
 }
-.header-vip-hero__sub {
-  margin-top: 4px;
-  font-size: 13px;
-  opacity: 0.9;
+.header-vip-hero__chip {
+  flex-shrink: 0;
+  padding: 0 8px;
+  font-size: 11px;
+  line-height: 18px;
+  color: #e8cf9a;
+  background: rgba(212, 175, 55, 0.1);
+  border: 1px solid rgba(232, 207, 154, 0.5);
+  border-radius: 999px;
 }
 .header-vip-hero__expire {
-  margin-top: 4px;
+  margin-top: 6px;
   font-size: 12px;
-  opacity: 0.78;
+  color: rgba(240, 224, 190, 0.75);
 }
 .header-vip-body {
   padding: 12px 14px 14px;
@@ -342,8 +376,4 @@ function openRecords() {
   font-size: 12px;
   color: hsl(var(--muted-foreground));
 }
-html.dark .header-vip-hero,
-.dark .header-vip-hero {
-  background: linear-gradient(135deg, #1a2332 0%, #243528 50%, #2d6b5f 100%);
-}
 </style>
diff --git a/apps/web-antd/src/components/vip/StoreVipCell.vue b/apps/web-antd/src/components/vip/StoreVipCell.vue
index a7ebd325..6aba069b 100644
--- a/apps/web-antd/src/components/vip/StoreVipCell.vue
+++ b/apps/web-antd/src/components/vip/StoreVipCell.vue
@@ -1,16 +1,22 @@
 <script lang="ts" setup>
 /**
- * 诊所列表 VIP 单元格：徽标+会员名，点击打开 VIP 入口弹窗
+ * 诊所列表 VIP 单元格：徽标+会员名+到期时间，点击打开 VIP 入口弹窗
  */
-import VipBadgeCombo from '#/components/vip/VipBadgeCombo.vue';
+import { computed } from 'vue';
 
-defineProps<{
+import VipBadgeCombo from '#/components/vip/VipBadgeCombo.vue';
+import { formatVipDurationExpireLine } from '#/utils/vip';
+
+const props = defineProps<{
   vip?: Record<string, any> | null;
 }>();
 
 const emit = defineEmits<{
   click: [];
 }>();
+
+/** 副行展示时长类型与到期，方便列表一眼看到过期时间 */
+const subText = computed(() => formatVipDurationExpireLine(props.vip));
 </script>
 <template>
   <div
@@ -29,9 +35,7 @@ const emit = defineEmits<{
     />
     <div class="store-vip-cell__text">
       <div class="store-vip-cell__name">{{ vip?.level_name || '普通会员' }}</div>
-      <div class="store-vip-cell__sub">
-        {{ vip?.duration_label || '点击管理' }}
-      </div>
+      <div class="store-vip-cell__sub">{{ subText }}</div>
     </div>
   </div>
 </template>
@@ -56,14 +60,14 @@ const emit = defineEmits<{
 .store-vip-cell__name {
   font-size: 13px;
   font-weight: 600;
-  color: var(--foreground, #1f1f1f);
+  color: hsl(var(--foreground));
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
 }
 .store-vip-cell__sub {
   font-size: 11px;
-  color: #8c8c8c;
+  color: hsl(var(--muted-foreground));
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
@@ -72,12 +76,4 @@ html.dark .store-vip-cell:hover,
 .dark .store-vip-cell:hover {
   background: rgba(106, 205, 187, 0.2);
 }
-html.dark .store-vip-cell__name,
-.dark .store-vip-cell__name {
-  color: #f4f4f5;
-}
-html.dark .store-vip-cell__sub,
-.dark .store-vip-cell__sub {
-  color: #a1a1aa;
-}
 </style>
diff --git a/apps/web-antd/src/components/vip/StoreVipMemberCard.vue b/apps/web-antd/src/components/vip/StoreVipMemberCard.vue
index ae6525fc..dc06703c 100644
--- a/apps/web-antd/src/components/vip/StoreVipMemberCard.vue
+++ b/apps/web-antd/src/components/vip/StoreVipMemberCard.vue
@@ -34,7 +34,10 @@ const expireText = computed(() => {
 });
 </script>
 <template>
+  <!-- 黑金会员卡：与小程序端 vip-member-card 同一套视觉语言，深色卡面亮暗主题通用 -->
   <div class="store-vip-card">
+    <div class="store-vip-card__glow"></div>
+    <div class="store-vip-card__sheen"></div>
     <VipBadgeCombo
       v-if="hasVipVisual"
       size="xl"
@@ -45,11 +48,9 @@ const expireText = computed(() => {
     />
     <div v-else class="store-vip-card__placeholder">V</div>
     <div class="store-vip-card__info">
-      <div class="store-vip-card__title">
-        {{ vip?.level_name || '普通会员' }}
-      </div>
-      <div class="store-vip-card__sub">
-        {{ vip?.duration_label || '普通会员' }}
+      <div class="store-vip-card__title-row">
+        <span class="store-vip-card__title">{{ vip?.level_name || '普通会员' }}</span>
+        <span class="store-vip-card__chip">{{ vip?.duration_label || '普通会员' }}</span>
       </div>
       <div class="store-vip-card__expire">{{ expireText }}</div>
     </div>
@@ -57,50 +58,96 @@ const expireText = computed(() => {
 </template>
 <style scoped>
 .store-vip-card {
+  position: relative;
   display: flex;
   align-items: center;
   gap: 24px;
   padding: 20px 28px;
-  border-radius: 16px;
-  background: linear-gradient(135deg, #2c3e50 0%, #3d5a40 50%, #6acdbb 100%);
-  box-shadow: 0 8px 24px rgba(44, 62, 80, 0.16);
   margin-bottom: 24px;
+  overflow: hidden;
+  border-radius: 18px;
+  /* 深色曜石底 + 右上暗金光晕，比单一渐变更有实体卡层次 */
+  background:
+    radial-gradient(120% 160% at 100% 0%, rgba(212, 175, 55, 0.22) 0%, rgba(212, 175, 55, 0) 45%),
+    linear-gradient(135deg, #23201a 0%, #12100c 55%, #1f1a12 100%);
+  border: 1px solid rgba(220, 186, 110, 0.35);
+  box-shadow:
+    0 12px 32px rgba(0, 0, 0, 0.28),
+    0 2px 8px rgba(212, 175, 55, 0.12);
+}
+/* 右上金色光晕：模拟灯光打在卡面的高光 */
+.store-vip-card__glow {
+  position: absolute;
+  top: -70px;
+  right: -50px;
+  width: 220px;
+  height: 220px;
+  border-radius: 50%;
+  background: radial-gradient(circle, rgba(240, 217, 168, 0.26) 0%, rgba(240, 217, 168, 0) 70%);
+  pointer-events: none;
+}
+/* 斜切静态流光条：金属光泽感 */
+.store-vip-card__sheen {
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 32%;
+  width: 90px;
+  transform: skewX(-24deg);
+  background: linear-gradient(
+    90deg,
+    rgba(255, 255, 255, 0) 0%,
+    rgba(255, 255, 255, 0.05) 50%,
+    rgba(255, 255, 255, 0) 100%
+  );
+  pointer-events: none;
 }
 .store-vip-card__placeholder {
-  width: 120px;
-  height: 120px;
-  border-radius: 50%;
-  background: rgba(255, 255, 255, 0.18);
-  color: #fff;
-  font-size: 48px;
-  font-weight: 700;
   display: flex;
+  flex-shrink: 0;
   align-items: center;
   justify-content: center;
-  flex-shrink: 0;
+  width: 120px;
+  height: 120px;
+  font-size: 48px;
+  font-weight: 700;
+  color: #f0d9a8;
+  text-shadow: 0 2px 8px rgba(212, 175, 55, 0.4);
+  background: radial-gradient(circle, rgba(212, 175, 55, 0.16) 0%, rgba(212, 175, 55, 0.04) 100%);
+  border: 1px solid rgba(220, 186, 110, 0.4);
+  border-radius: 50%;
+  box-shadow: inset 0 0 16px rgba(212, 175, 55, 0.15);
 }
 .store-vip-card__info {
+  position: relative;
   min-width: 0;
-  color: #fff;
+}
+.store-vip-card__title-row {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  margin-bottom: 8px;
 }
 .store-vip-card__title {
   font-size: 22px;
   font-weight: 700;
   line-height: 1.3;
-  margin-bottom: 6px;
+  color: #f5e3bd;
+  letter-spacing: 1px;
+  text-shadow: 0 2px 6px rgba(0, 0, 0, 0.35);
 }
-.store-vip-card__sub {
-  font-size: 14px;
-  opacity: 0.9;
-  margin-bottom: 6px;
+/* 期限徽章：金字描边小胶囊 */
+.store-vip-card__chip {
+  flex-shrink: 0;
+  padding: 1px 10px;
+  font-size: 12px;
+  color: #e8cf9a;
+  background: rgba(212, 175, 55, 0.1);
+  border: 1px solid rgba(232, 207, 154, 0.5);
+  border-radius: 999px;
 }
 .store-vip-card__expire {
   font-size: 13px;
-  opacity: 0.78;
-}
-html.dark .store-vip-card,
-.dark .store-vip-card {
-  background: linear-gradient(135deg, #1a2332 0%, #243528 50%, #2d6b5f 100%);
-  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
+  color: rgba(240, 224, 190, 0.75);
 }
 </style>
diff --git a/apps/web-antd/src/components/vip/VipHubModal.vue b/apps/web-antd/src/components/vip/VipHubModal.vue
index e19cb069..5c6c9098 100644
--- a/apps/web-antd/src/components/vip/VipHubModal.vue
+++ b/apps/web-antd/src/components/vip/VipHubModal.vue
@@ -10,6 +10,7 @@ import { useVbenModal } from '@vben/common-ui';
 import VipBadgeCombo from '#/components/vip/VipBadgeCombo.vue';
 import VipStoreRecordsModal from '#/components/vip/VipStoreRecordsModal.vue';
 import VipUpgradeModal from '#/components/vip/VipUpgradeModal.vue';
+import { formatVipExpireAt } from '#/utils/vip';
 
 const gridApi = ref<any>();
 const onSuccess = ref<null | (() => void)>(null);
@@ -21,6 +22,7 @@ const title = computed(
   () => `VIP管理 - ${storeName.value || storeId.value || ''}`,
 );
 
+/** 当前等级 + 时长类型 */
 const currentLevelText = computed(() => {
   const v = vip.value;
   if (!v) return '当前：普通会员';
@@ -32,6 +34,20 @@ const currentLevelText = computed(() => {
   return duration ? `当前：${level} · ${duration}` : `当前：${level}`;
 });
 
+/** 到期时间独立一行，打开弹窗时一眼可见 */
+const currentExpireText = computed(() => {
+  const v = vip.value;
+  if (!v) return '';
+  const code = String(v.level_code || 'V0').trim() || 'V0';
+  if (code === 'V0') return '';
+  const expire = formatVipExpireAt(v, {
+    lifetimeText: '终身',
+    withPrefix: false,
+  });
+  if (!expire) return '';
+  return expire === '终身' ? '到期时间：终身' : `到期时间：${expire}`;
+});
+
 const [UpgradeModalComp, upgradeModalApi] = useVbenModal({
   connectedComponent: VipUpgradeModal,
 });
@@ -107,7 +123,12 @@ function openRecords() {
         :level-name="vip?.level_name"
         :duration-label="vip?.duration_label"
       />
-      <div class="vip-hub-current__text">{{ currentLevelText }}</div>
+      <div class="vip-hub-current__meta">
+        <div class="vip-hub-current__text">{{ currentLevelText }}</div>
+        <div v-if="currentExpireText" class="vip-hub-current__expire">
+          {{ currentExpireText }}
+        </div>
+      </div>
     </div>
     <div class="vip-hub-grid">
       <button type="button" class="vip-hub-card" @click="openUpgrade">
@@ -140,11 +161,21 @@ function openRecords() {
   border-radius: 10px;
   background: hsl(var(--muted) / 0.25);
 }
+.vip-hub-current__meta {
+  min-width: 0;
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+}
 .vip-hub-current__text {
   font-size: 13px;
   font-weight: 500;
   color: hsl(var(--foreground));
 }
+.vip-hub-current__expire {
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+}
 .vip-hub-grid {
   display: grid;
   grid-template-columns: 1fr 1fr;
diff --git a/apps/web-antd/src/components/vip/VipUpgradeModal.vue b/apps/web-antd/src/components/vip/VipUpgradeModal.vue
index 8224eb73..9888f1fa 100644
--- a/apps/web-antd/src/components/vip/VipUpgradeModal.vue
+++ b/apps/web-antd/src/components/vip/VipUpgradeModal.vue
@@ -17,7 +17,7 @@ import {
   openVipStore,
 } from '#/views/system/vip/store/api';
 
-/** 时长预设 → 时效类型 code（与后端 VipDurationHelper 对齐） */
+/** 时长预设 → 时效类型 code（与后端 VipDurationHelper 对齐；keep 走当前会员 duration_type） */
 const PRESET_TO_DURATION: Record<string, string> = {
   '7d': 'trial',
   '1w': 'week',
@@ -33,6 +33,8 @@ const gridApi = ref<any>();
 const onSuccess = ref<null | (() => void)>(null);
 const storeId = ref(0);
 const storeName = ref('');
+/** 打开弹窗时带入的当前门店 VIP，用于判断能否「继承剩余时间」 */
+const currentVip = ref<Record<string, any> | null>(null);
 const levelId = ref<number | undefined>();
 const durationPreset = ref<string | undefined>();
 const customYears = ref<number | undefined>();
@@ -46,8 +48,28 @@ const selectedLevel = computed(() =>
   levels.value.find((i) => i.id === levelId.value),
 );
 
+/**
+ * 是否可继承剩余时间：非普通会员（非 V0）且未过期
+ * 普通会员没有可继承的到期时间，不展示/不默认 keep
+ */
+const canKeepDuration = computed(() => {
+  const v = currentVip.value;
+  if (!v) return false;
+  const code = String(v.level_code || 'V0').trim() || 'V0';
+  if (code === 'V0') return false;
+  const expireAt = Number(v.expire_at || 0);
+  // expire_at=0 表示终身，视为可继承；>0 须未过期
+  if (expireAt > 0 && expireAt * 1000 <= Date.now()) return false;
+  return true;
+});
+
 /** 按时长预设解析对应丝带资源 */
 function ribbonByPreset(preset?: string) {
+  if (preset === 'keep') {
+    const code = String(currentVip.value?.duration_type || '').trim();
+    if (!code) return null;
+    return durationTypes.value.find((i) => i.code === code) || null;
+  }
   const code = PRESET_TO_DURATION[preset || ''] || '';
   if (!code) return null;
   return durationTypes.value.find((i) => i.code === code) || null;
@@ -57,16 +79,18 @@ const selectedDurationType = computed(() =>
   ribbonByPreset(durationPreset.value),
 );
 
-/** 时长卡片数据：附带丝带图，避免模板重复查找 */
+/** 时长卡片：普通会员隐藏 keep；其它预设照常 */
 const durationCards = computed(() =>
-  presets.value.map((p) => {
-    const ribbon = ribbonByPreset(p.value);
-    return {
-      ...p,
-      ribbonUrl: ribbon?.badge_url || '',
-      ribbonName: ribbon?.name || '',
-    };
-  }),
+  presets.value
+    .filter((p) => p.value !== 'keep' || canKeepDuration.value)
+    .map((p) => {
+      const ribbon = ribbonByPreset(p.value);
+      return {
+        ...p,
+        ribbonUrl: ribbon?.badge_url || '',
+        ribbonName: ribbon?.name || '',
+      };
+    }),
 );
 
 const previewBadgeUrl = computed(() => selectedLevel.value?.badge_url || '');
@@ -78,10 +102,36 @@ const previewLevelName = computed(
 );
 const previewDurationLabel = computed(() => {
   if (!durationPreset.value) return '请选择时长';
+  if (durationPreset.value === 'keep') {
+    const label = String(currentVip.value?.duration_label || '').trim();
+    const expireHint = formatVipExpireHint(currentVip.value);
+    if (label && expireHint) return `继承剩余：${label}（${expireHint}）`;
+    if (label) return `继承剩余：${label}`;
+    return '继承剩余时间（不改动）';
+  }
   const preset = presets.value.find((p) => p.value === durationPreset.value);
   return preset?.label || selectedDurationType.value?.name || '请选择时长';
 });
 
+/**
+ * 格式化当前会员到期提示（终身 / 已格式化字符串 / 时间戳）
+ */
+function formatVipExpireHint(v: Record<string, any> | null | undefined): string {
+  if (!v) return '';
+  if (v.is_lifetime) return '终身';
+  const raw = v.expire_at;
+  if (raw == null || raw === '' || raw === 0) return '';
+  if (typeof raw === 'string' && Number.isNaN(Number(raw))) {
+    return `至 ${raw}`;
+  }
+  const n = Number(raw);
+  if (!(n > 0)) return '';
+  const d = new Date(n * 1000);
+  if (Number.isNaN(d.getTime())) return '';
+  const pad = (x: number) => String(x).padStart(2, '0');
+  return `至 ${d.getFullYear()}-${pad(d.getMonth() + 1)}-${pad(d.getDate())} ${pad(d.getHours())}:${pad(d.getMinutes())}:${pad(d.getSeconds())}`;
+}
+
 const title = computed(() => `升级VIP - ${storeName.value || storeId.value}`);
 
 /** 选择会员等级 */
@@ -139,6 +189,7 @@ const [Modal, modalApi] = useVbenModal({
       durationPreset.value = undefined;
       customYears.value = undefined;
       remark.value = '';
+      currentVip.value = null;
       return;
     }
     const data = modalApi.getData<Record<string, any>>() || {};
@@ -146,6 +197,7 @@ const [Modal, modalApi] = useVbenModal({
     onSuccess.value = data.onSuccess || null;
     storeId.value = Number(data.store_id || 0);
     storeName.value = data.store_name || '';
+    currentVip.value = data.vip || null;
     const [levelList, presetList, durationList] = await Promise.all([
       getVipLevelOption(),
       getVipDurationPresets(),
@@ -157,10 +209,14 @@ const [Modal, modalApi] = useVbenModal({
       value: i.value,
     }));
     durationTypes.value = durationList || [];
-    // 回填当前 VIP 等级（便于续期）
+    // 回填当前 VIP 等级（便于续期/改档）
     if (data.vip?.level_id) {
       levelId.value = Number(data.vip.level_id);
     }
+    // 非普通会员：默认选「继承剩余时间」，到期日不改动
+    if (canKeepDuration.value) {
+      durationPreset.value = 'keep';
+    }
   },
 });
 
@@ -170,8 +226,9 @@ watch(durationPreset, (v) => {
 </script>
 <template>
   <Modal :title="title" class="w-[50%]">
-    <!-- 预览：徽标卡片 + 丝带（随时长自动适配） -->
+    <!-- 预览：黑金卡面 + 徽标丝带（随时长自动适配） -->
     <div class="vip-upgrade-preview mb-5">
+      <div class="vip-upgrade-preview__glow"></div>
       <VipBadgeCombo
         size="xl"
         :badge-url="previewBadgeUrl"
@@ -273,28 +330,53 @@ watch(durationPreset, (v) => {
   </Modal>
 </template>
 <style scoped>
+/* 黑金预览卡：与会员卡组件同一视觉语言，深色卡面亮暗主题通用 */
 .vip-upgrade-preview {
+  position: relative;
   display: flex;
   align-items: center;
   gap: 20px;
   padding: 20px 24px;
-  border-radius: 14px;
-  background: linear-gradient(135deg, #2c3e50 0%, #3d5a40 50%, #6acdbb 100%);
-  color: #fff;
+  overflow: hidden;
+  border-radius: 16px;
+  background:
+    radial-gradient(120% 160% at 100% 0%, rgba(212, 175, 55, 0.22) 0%, rgba(212, 175, 55, 0) 45%),
+    linear-gradient(135deg, #23201a 0%, #12100c 55%, #1f1a12 100%);
+  border: 1px solid rgba(220, 186, 110, 0.35);
+  box-shadow:
+    0 10px 26px rgba(0, 0, 0, 0.24),
+    0 2px 8px rgba(212, 175, 55, 0.12);
+  color: #f5e3bd;
+}
+.vip-upgrade-preview__glow {
+  position: absolute;
+  top: -60px;
+  right: -40px;
+  width: 200px;
+  height: 200px;
+  border-radius: 50%;
+  background: radial-gradient(circle, rgba(240, 217, 168, 0.26) 0%, rgba(240, 217, 168, 0) 70%);
+  pointer-events: none;
+}
+.vip-upgrade-preview__text {
+  position: relative;
+  min-width: 0;
 }
 .vip-upgrade-preview__title {
   font-size: 20px;
   font-weight: 700;
   margin-bottom: 4px;
+  letter-spacing: 1px;
+  text-shadow: 0 2px 6px rgba(0, 0, 0, 0.35);
 }
 .vip-upgrade-preview__sub {
   font-size: 13px;
-  opacity: 0.9;
+  color: rgba(240, 224, 190, 0.85);
   margin-bottom: 6px;
 }
 .vip-upgrade-preview__price {
   font-size: 12px;
-  opacity: 0.8;
+  color: rgba(240, 224, 190, 0.68);
 }
 /* 两行 + 横向滑动的单选卡片轨道 */
 .vip-pick-scroll {
@@ -397,11 +479,7 @@ watch(durationPreset, (v) => {
   white-space: nowrap;
 }
 /* ========== 暗色适配（html.dark / .dark）========== */
-html.dark .vip-upgrade-preview,
-.dark .vip-upgrade-preview {
-  background: linear-gradient(135deg, #1a2332 0%, #243528 50%, #2d6b5f 100%);
-  box-shadow: inset 0 0 0 1px rgba(106, 205, 187, 0.18);
-}
+/* 黑金预览卡为深色卡面，亮暗主题通用，无需暗色分支 */
 html.dark .vip-pick-scroll::-webkit-scrollbar-thumb,
 .dark .vip-pick-scroll::-webkit-scrollbar-thumb {
   background: rgba(255, 255, 255, 0.22);
diff --git a/apps/web-antd/src/layouts/auth.vue b/apps/web-antd/src/layouts/auth.vue
index 4cefdce0..adb9af29 100644
--- a/apps/web-antd/src/layouts/auth.vue
+++ b/apps/web-antd/src/layouts/auth.vue
@@ -8,6 +8,7 @@ import { $t } from '#/locales';
 
 const appName = computed(() => preferences.app.name);
 const logo = computed(() => preferences.logo.source);
+const logoDark = computed(() => preferences.logo.sourceDark);
 // const logo = 'https://xiaokang88.oss-cn-hangzhou.aliyuncs.com/logo.png?Expires=1734595037&OSSAccessKeyId=TMP.3KhpnCAjxkdTGWSj1ZCdYe3e9c6MBfEVZwN1CiHdUKUAT2D1mPEpACYgYMkUiQDVqy9Zqb7VqgUoh21W37FC3CztogHJPN&Signature=KmymeelO2OZxaAmvm2ACDK5UfF8%3D';
 </script>
 
@@ -15,6 +16,7 @@ const logo = computed(() => preferences.logo.source);
   <AuthPageLayout
     :app-name="appName"
     :logo="logo"
+    :logo-dark="logoDark"
     :page-description="$t('authentication.pageDesc')"
     :page-title="$t('authentication.pageTitle')"
     :version="preferences.app.version"
diff --git a/apps/web-antd/src/layouts/basic.vue b/apps/web-antd/src/layouts/basic.vue
index a693881f..835d7065 100644
--- a/apps/web-antd/src/layouts/basic.vue
+++ b/apps/web-antd/src/layouts/basic.vue
@@ -1,187 +1,217 @@
 <script lang="ts" setup>
+/**
+ * 管理端基础布局：铃铛站内信轮询 + 动作宿主挂载
+ */
 import type { NotificationItem } from '@vben/layouts';
 
-import {computed, onUnmounted, ref, watch} from 'vue';
+import { computed, onUnmounted, ref, watch } from 'vue';
+import { useRouter } from 'vue-router';
 
-import { AuthenticationLoginExpiredModal } from '@vben/common-ui';
-
-// import { VBEN_DOC_URL, VBEN_GITHUB_URL } from '@vben/constants';
+import { AuthenticationLoginExpiredModal, VbenIcon } from '@vben/common-ui';
 import { useWatermark } from '@vben/hooks';
-// import { BookOpenText, CircleHelp, MdiGithub } from '@vben/icons';
-// import { CircleHelp } from '@vben/icons';
+import { $t } from '@vben/locales';
 import {
   BasicLayout,
   LockScreen,
   Notification,
   UserDropdown,
 } from '@vben/layouts';
-import { preferences } from '@vben/preferences';
+import { preferences, usePreferences } from '@vben/preferences';
 import { useAccessStore, useUserStore } from '@vben/stores';
-// import { openWindow } from '@vben/utils';
 
-import {
-  Bell,
-  CalendarClock,
-  Megaphone,
-  Users,
-} from 'lucide-vue-next';
+import { notification } from 'ant-design-vue';
+import { Bell, Users } from 'lucide-vue-next';
 
-// import { $t } from '#/locales';
 import DoctorTransferFloat from '#/components/doctor-transfer-float/DoctorTransferFloat.vue';
 import HeaderVipBadge from '#/components/vip/HeaderVipBadge.vue';
-import { useAuthStore } from '#/store';
-import LoginForm from '#/views/_core/authentication/login.vue';
 import SwitchAccountModal from '#/layouts/components/SwitchAccountModal.vue';
-import { useRouter } from 'vue-router';
-import {getNoticeListApi, readAllApi} from "#/views/notice/api";
-import {formatTimeToRelative} from "#/util/tool";
-import {notification} from "ant-design-vue";
+import { useAuthStore } from '#/store';
+import { desktop, isElectron } from '#/util/desktop';
+import { formatTimeToRelative } from '#/util/tool';
+import LoginForm from '#/views/_core/authentication/login.vue';
+import NoticeActionHost from '#/views/notice/action/NoticeActionHost.vue';
+import {
+  emitNoticeRefresh,
+  onNoticeRefresh,
+  openNoticeAction,
+} from '#/views/notice/action/bus';
+import { resolveNoticeColor } from '#/views/notice/action/types';
+import {
+  getNoticeListApi,
+  getNoticeUnreadCountApi,
+  readAllApi,
+  readApi,
+} from '#/views/notice/api';
 
 const router = useRouter();
 const switchAccountModalRef = ref<InstanceType<typeof SwitchAccountModal>>();
-
-// 样式相关
-const typeIcons = {
-  0: Megaphone,
-  1: Bell,
-  2: CalendarClock,
-};
-
-const typeColors = {
-  0: 'text-sky-500',
-  1: 'text-amber-500',
-  2: 'text-emerald-500',
-};
-
-const typeBgColors = {
-  0: 'bg-sky-50',
-  1: 'bg-amber-50',
-  2: 'bg-emerald-50',
-};
-
-const typeBorderColors = {
-  0: 'border-sky-200',
-  1: 'border-amber-200',
-  2: 'border-emerald-200',
-};
-
 const notifications = ref<NotificationItem[]>([]);
+const unreadCount = ref(0);
 
-// 获取消息列表数据
+/** 拉取未读列表 + 角标数字 */
 const getNoticeList = async () => {
   try {
-    const res = await getNoticeListApi({
-      status: 0,
-    });
-    let message = '未读消息';
-    if (res.items.length > 0) {
-      if (res.items.length > notifications.value.length) {
-        if (notifications.value.length === 0) {
-          message = '新消息';
-        }
-        notification.info({
-          message: `您有${message}`,
-          description: `您有 ${res.items.length} 条${message}请注意查收`,
-          duration: 5,
+    const [res, countRes] = await Promise.all([
+      getNoticeListApi({ status: 0, page: 1, pageSize: 20 }),
+      getNoticeUnreadCountApi().catch(() => null),
+    ]);
+    const items = res?.items || [];
+    const prevLen = notifications.value.length;
+    if (items.length > prevLen && prevLen > 0) {
+      notification.info({
+        message: '您有新消息',
+        description: `您有 ${items.length} 条未读消息请注意查收`,
+        duration: 5,
+      });
+      // 桌面端且窗口未聚焦时补发系统通知（页内 Toast 此时用户看不到），点击跳消息中心
+      if (isElectron() && !document.hasFocus()) {
+        desktop.notify({
+          title: '您有新消息',
+          body: `您有 ${items.length} 条未读消息请注意查收`,
+          route: '/notice/list',
         });
+        desktop.flashFrame();
       }
-
-      notifications.value = res.items.map(item => ({
-        id: item.id,
-        icon: typeIcons[item.type],
-        // 将API返回的数据映射到组件需要的格式
-        message: item.title,
-        title: getMessageTypeName(item.type),
-        date: formatTimeToRelative(item.created_at),
-        color: typeColors[item.type],
-        isRead: item.status
-      }));
-    } else {
-      notifications.value = [];
     }
+    notifications.value = items.map((item: any) => {
+      const color = resolveNoticeColor(item.type_color);
+      return {
+        id: item.id,
+        // Notification 默认用组件当 icon；我们走自定义 content 槽，这里占位即可
+        icon: Bell as any,
+        message: item.detail || item.type_name || '',
+        title: item.title || '通知',
+        date: formatTimeToRelative(item.created_at),
+        color: color.text,
+        colorBg: color.bg,
+        isRead: Number(item.status) === 1,
+        status: item.status,
+        type_code: item.type_code,
+        type_name: item.type_name,
+        type_icon: item.type_icon,
+        type_color: item.type_color,
+        action_type: item.action_type,
+        action_payload: item.action_payload,
+        detail: item.detail,
+        content: item.content,
+        edit_type: item.edit_type,
+        priority: item.priority,
+        raw: item,
+      };
+    });
+    unreadCount.value = Number(
+      countRes?.count ?? res?.unread_total ?? items.length,
+    );
   } catch (error) {
     console.error('获取消息列表失败:', error);
   }
 };
 getNoticeList();
-// 每隔二十秒刷新一次
 let intervalId = setInterval(getNoticeList, 20_000);
 
-// 封装定时器重启逻辑
 const restartInterval = () => {
   clearInterval(intervalId);
-  getNoticeList(); // 立即获取最新数据
+  getNoticeList();
   intervalId = setInterval(getNoticeList, 20_000);
 };
 
-// 处理跨标签页修改
-const handleStorageChange = (event) => {
+const handleStorageChange = (event: StorageEvent) => {
   if (event.key === 'readStatus') {
     restartInterval();
   }
 };
 
-// 处理当前标签页修改（核心新增部分）
-const handleLocalChange = () => {
-  restartInterval();
-};
-
-// 添加双重监听
-window.addEventListener('storage', handleStorageChange); // 跨标签页监听
 const originalSetItem = localStorage.setItem.bind(localStorage);
-
-// 拦截当前页的 localStorage.setItem 操作
 localStorage.setItem = (key, value) => {
   originalSetItem(key, value);
   if (key === 'readStatus') {
-    handleLocalChange(); // 手动触发当前页回调
+    restartInterval();
   }
 };
 
-// 组件卸载时清理
+window.addEventListener('storage', handleStorageChange);
+const stopRefreshListen = onNoticeRefresh(() => restartInterval());
+
+// 桌面端：未读数变化同步任务栏/Dock 角标（浏览器环境 no-op）
+watch(unreadCount, (count) => desktop.setBadge(count));
+
+// 桌面端：系统通知点击后主进程回传目标路由，这里执行实际跳转
+desktop.onNavigate((route) => {
+  router.push(route);
+});
+
+// 桌面端：自动更新事件轻量提示（下载完成后的安装确认由主进程弹窗负责）
+desktop.onUpdateEvent((payload) => {
+  if (payload.type === 'available') {
+    const version = (payload.data as { version?: string })?.version;
+    notification.info({
+      message: '发现新版本',
+      description: `新版本 ${version ? `v${version} ` : ''}正在后台下载，完成后将提示安装`,
+      duration: 5,
+    });
+  }
+});
+
 onUnmounted(() => {
   clearInterval(intervalId);
   window.removeEventListener('storage', handleStorageChange);
-  localStorage.setItem = originalSetItem; // 恢复原始方法
+  localStorage.setItem = originalSetItem;
+  stopRefreshListen();
+  // 布局卸载（登出）时清空桌面角标，避免残留未读数
+  desktop.setBadge(0);
+  // 解绑系统通知跳转回调，避免登出后点击残留通知仍对已登出会话执行 router.push
+  desktop.offNavigate();
 });
 
-// 消息类型定义
-const messageTypes = [
-  { id: -1, name: '全部消息' },
-  { id: 0, name: '系统公告', icon: Megaphone },
-  { id: 1, name: '系统通知', icon: Bell },
-  { id: 2, name: '周报提醒', icon: CalendarClock },
-];
-// 根据类型ID获取类型名称
-const getMessageTypeName = (typeId) => {
-  const type = messageTypes.find(t => t.id === typeId);
-  return type ? type.name : '未知类型';
-};
 const goNoticeList = () => {
-  // TODO 跳转通知列表
   router.push('/notice/list');
 };
 
-// 处理消息点击
-const handleItemClick = (item) => {
-  notifications.value.forEach((value) => {
-    if (value.id === item.id) {
-      value.status = 1;
-      value.isRead = 1;
-    }
+/** 从铃铛列表移除并扣减角标 */
+function removeFromBell(item: NotificationItem) {
+  notifications.value = notifications.value.filter((n) => n.id !== item.id);
+  unreadCount.value = Math.max(0, unreadCount.value - 1);
+}
+
+/** 行点击：立刻取消未读并打开场景 */
+const handleItemClick = async (item: NotificationItem) => {
+  const raw = (item as any).raw || item;
+  const wasUnread = !item.isRead;
+  item.isRead = true;
+  if (wasUnread) {
+    removeFromBell(item);
+  }
+  await openNoticeAction({
+    ...raw,
+    id: item.id,
+    status: wasUnread ? 0 : 1,
   });
-  router.push(`/notice/detail/${item.id}`);
 };
 
+const handleClick = async (item: NotificationItem) => {
+  await handleItemClick(item);
+};
+
+/** 勾选已读：只标已读，不打开详情 */
+async function handleMarkRead(item: NotificationItem) {
+  if (item.isRead) return;
+  item.isRead = true;
+  removeFromBell(item);
+  try {
+    await readApi(Number(item.id));
+    emitNoticeRefresh();
+  } catch {
+    /* ignore */
+  }
+}
+
 const userStore = useUserStore();
 const authStore = useAuthStore();
 const accessStore = useAccessStore();
 const { destroyWatermark, updateWatermark } = useWatermark();
-const showDot = computed(() =>
-  notifications.value.some((item) => !item.isRead),
-);
+const { isDark } = usePreferences();
+const showDot = computed(() => unreadCount.value > 0);
 
-/** 与原先悬浮窗一致：有 doctor_id 且绑定门店才显示传方入口 */
 const showDoctorTransfer = computed(() => {
   const info = userStore.userInfo as Record<string, any> | null | undefined;
   if (!info) return false;
@@ -189,6 +219,13 @@ const showDoctorTransfer = computed(() => {
 });
 
 const menus = computed(() => [
+  {
+    handler: () => {
+      router.push({ name: 'Profile' });
+    },
+    icon: 'lucide:user',
+    text: $t('page.auth.profile'),
+  },
   {
     handler: () => {
       switchAccountModalRef.value?.openModal();
@@ -210,7 +247,20 @@ async function handleLogout() {
 function handleNoticeClear() {
   readAllApi().then(() => {
     notifications.value = [];
-    // 成功后可以重新获取数据或者直接更新本地状态
+    unreadCount.value = 0;
+    notification.success({
+      message: '标记成功',
+      duration: 2,
+    });
+    emitNoticeRefresh();
+  });
+}
+
+/** 全部已读：必须走后端 API */
+function handleMakeAll() {
+  readAllApi().then(() => {
+    notifications.value = [];
+    unreadCount.value = 0;
     notification.success({
       message: '标记成功',
       duration: 2,
@@ -218,43 +268,45 @@ function handleNoticeClear() {
   });
 }
 
-function handleMakeAll() {
-  notifications.value.forEach((item) => (item.isRead = true));
-}
 watch(
-  () => preferences.app.watermark,
-  async (enable) => {
+  () => ({
+    enable: preferences.app.watermark,
+    isDark: isDark.value,
+  }),
+  async ({ enable }) => {
     if (enable) {
       await updateWatermark({
-        // 这里更改水印内容
-        // content: `${userStore.userInfo?.nick_name || import.meta.env.VITE_APP_TITLE}`,
         content: `${userStore.userInfo?.nick_name}\r\n${userStore.userInfo?.phone || import.meta.env.VITE_APP_TITLE}`,
       });
     } else {
       destroyWatermark();
     }
   },
-  {
-    immediate: true,
-  },
+  { immediate: true },
 );
 </script>
 
 <template>
-  <BasicLayout @clear-preferences-and-logout="handleLogout">
-    <!-- index=55：紧挨全局搜索(50)右侧 -->
+  <BasicLayout
+    :avatar
+    :text="userStore.userInfo?.realName"
+    @clear-preferences-and-logout="handleLogout"
+    @logout="handleLogout"
+  >
     <template #header-right-55>
       <DoctorTransferFloat v-if="showDoctorTransfer" />
     </template>
     <template #user-dropdown>
+      <!-- VIP 徽标放在头像左侧，与用户下拉并排 -->
       <div class="flex items-center">
         <HeaderVipBadge />
         <UserDropdown
           :avatar
-          :description="userStore.userInfo?.email"
           :menus
-          :tag-text="userStore.userInfo?.roles?.name"
           :text="userStore.userInfo?.nick_name"
+          :description="userStore.userInfo?.email"
+          :tag-text="userStore.userInfo?.roles?.name"
+          @clear-preferences-and-logout="handleLogout"
           @logout="handleLogout"
         />
       </div>
@@ -262,12 +314,54 @@ watch(
     <template #notification>
       <Notification
         :dot="showDot"
+        :count="unreadCount"
         :notifications="notifications"
         @clear="handleNoticeClear"
         @make-all="handleMakeAll"
-        @read="handleItemClick"
+        @read="handleMarkRead"
         @view-all="goNoticeList"
-      />
+        @on-click="handleClick"
+      >
+        <template #content="{ item }">
+          <span
+            v-if="!item.isRead"
+            class="absolute top-2 right-2 size-2 rounded-sm bg-primary"
+          ></span>
+          <span
+            class="relative flex size-10 shrink-0 items-center justify-center overflow-hidden rounded-xl"
+            :class="[(item as any).colorBg || 'bg-muted', (item as any).color]"
+          >
+            <VbenIcon
+              v-if="(item as any).type_icon"
+              :icon="(item as any).type_icon"
+              class="size-5"
+            />
+            <Bell v-else class="size-5" />
+          </span>
+          <div class="min-w-0 flex-1 pr-8 leading-none">
+            <div class="mb-1 flex items-center gap-2">
+              <span
+                v-if="(item as any).type_name"
+                class="truncate text-[11px] font-semibold"
+                :class="(item as any).color"
+              >
+                {{ (item as any).type_name }}
+              </span>
+            </div>
+            <p class="truncate text-sm font-semibold text-foreground">
+              {{ item.title }}
+            </p>
+            <p
+              v-if="item.message"
+              class="mt-1 line-clamp-2 text-xs text-muted-foreground"
+            >
+              {{ item.message }}
+            </p>
+            <p class="mt-1 text-xs text-muted-foreground">{{ item.date }}</p>
+          </div>
+        </template>
+      </Notification>
+      <NoticeActionHost />
     </template>
     <template #extra>
       <AuthenticationLoginExpiredModal
diff --git a/apps/web-antd/src/locales/index.ts b/apps/web-antd/src/locales/index.ts
index 1972e06e..7f32bd18 100644
--- a/apps/web-antd/src/locales/index.ts
+++ b/apps/web-antd/src/locales/index.ts
@@ -1,7 +1,9 @@
-import type { LocaleSetupOptions, SupportedLanguagesType } from '@vben/locales';
 import type { Locale } from 'ant-design-vue/es/locale';
 
 import type { App } from 'vue';
+
+import type { LocaleSetupOptions, SupportedLanguagesType } from '@vben/locales';
+
 import { ref } from 'vue';
 
 import {
diff --git a/apps/web-antd/src/locales/langs/en-US/demos.json b/apps/web-antd/src/locales/langs/en-US/demos.json
index 07156434..859718e1 100644
--- a/apps/web-antd/src/locales/langs/en-US/demos.json
+++ b/apps/web-antd/src/locales/langs/en-US/demos.json
@@ -6,7 +6,9 @@
     "about": "About",
     "document": "Document",
     "antdv": "Ant Design Vue Version",
+    "antdv-next": "Antdv Next Version",
     "naive-ui": "Naive UI Version",
-    "element-plus": "Element Plus Version"
+    "element-plus": "Element Plus Version",
+    "tdesign": "TDesign Vue Version"
   }
 }
diff --git a/apps/web-antd/src/locales/langs/en-US/page.json b/apps/web-antd/src/locales/langs/en-US/page.json
index 618a258c..39f1641c 100644
--- a/apps/web-antd/src/locales/langs/en-US/page.json
+++ b/apps/web-antd/src/locales/langs/en-US/page.json
@@ -4,7 +4,8 @@
     "register": "Register",
     "codeLogin": "Code Login",
     "qrcodeLogin": "Qr Code Login",
-    "forgetPassword": "Forget Password"
+    "forgetPassword": "Forget Password",
+    "profile": "Profile"
   },
   "dashboard": {
     "title": "Dashboard",
diff --git a/apps/web-antd/src/locales/langs/zh-CN/demos.json b/apps/web-antd/src/locales/langs/zh-CN/demos.json
index 93ee722f..29910cdf 100644
--- a/apps/web-antd/src/locales/langs/zh-CN/demos.json
+++ b/apps/web-antd/src/locales/langs/zh-CN/demos.json
@@ -6,7 +6,9 @@
     "about": "关于",
     "document": "文档",
     "antdv": "Ant Design Vue 版本",
+    "antdv-next": "Antdv Next 版本",
     "naive-ui": "Naive UI 版本",
-    "element-plus": "Element Plus 版本"
+    "element-plus": "Element Plus 版本",
+    "tdesign": "TDesign Vue 版本"
   }
 }
diff --git a/apps/web-antd/src/locales/langs/zh-CN/page.json b/apps/web-antd/src/locales/langs/zh-CN/page.json
index 4cb67081..2192d1d5 100644
--- a/apps/web-antd/src/locales/langs/zh-CN/page.json
+++ b/apps/web-antd/src/locales/langs/zh-CN/page.json
@@ -4,7 +4,8 @@
     "register": "注册",
     "codeLogin": "验证码登录",
     "qrcodeLogin": "二维码登录",
-    "forgetPassword": "忘记密码"
+    "forgetPassword": "忘记密码",
+    "profile": "个人中心"
   },
   "dashboard": {
     "title": "概览",
diff --git a/apps/web-antd/src/main.ts b/apps/web-antd/src/main.ts
index 21cb193b..6fd164ed 100644
--- a/apps/web-antd/src/main.ts
+++ b/apps/web-antd/src/main.ts
@@ -1,7 +1,7 @@
 import { initPreferences } from '@vben/preferences';
 import { unmountGlobalLoading } from '@vben/utils';
 
-import { overridesPreferences } from './preferences';
+import { overridesPreferences, preferencesExtension } from './preferences';
 
 // eslint-disable-next-line n/no-extraneous-import
 import '@fortawesome/fontawesome-free/css/all.min.css';
@@ -18,6 +18,7 @@ async function initApplication() {
 
   // app偏好设置初始化
   await initPreferences({
+    extension: preferencesExtension,
     namespace,
     overrides: overridesPreferences,
   });
diff --git a/apps/web-antd/src/preferences.ts b/apps/web-antd/src/preferences.ts
index 8a2c7039..1a4b5c9f 100644
--- a/apps/web-antd/src/preferences.ts
+++ b/apps/web-antd/src/preferences.ts
@@ -1,4 +1,3 @@
-import { defineOverridesPreferences } from '@vben/preferences';
 // {
 //   "app": {
 //   "layout": "sidebar-nav"
@@ -8,6 +7,19 @@ import { defineOverridesPreferences } from '@vben/preferences';
 //     "enable": false
 //   }
 // }
+import {
+  appCopyrightPreferences,
+  defineOverridesPreferences,
+  definePreferencesExtension,
+} from '@vben/preferences';
+
+interface WebAntdPreferencesExtension {
+  defaultTableSize: number;
+  enableFormFullscreen: boolean;
+  reportTitle: string;
+  tenantMode: 'multi' | 'single';
+}
+
 /**
  * @description 项目配置文件
  * 只需要覆盖项目中的一部分配置，不需要的配置不用覆盖，会自动使用默认配置
@@ -80,4 +92,54 @@ export const overridesPreferences = defineOverridesPreferences({
   tabbar: {
     enable: true,
   },
+  copyright: appCopyrightPreferences,
 });
+
+export const preferencesExtension =
+  definePreferencesExtension<WebAntdPreferencesExtension>({
+    tabLabel: 'preferences.antd.tabLabel',
+    title: 'preferences.antd.title',
+    fields: [
+      {
+        component: 'switch',
+        defaultValue: true,
+        key: 'enableFormFullscreen',
+        label: 'preferences.antd.fields.enableFormFullscreen.label',
+        tip: 'preferences.antd.fields.enableFormFullscreen.tip',
+      },
+      {
+        component: 'select',
+        defaultValue: 'single',
+        key: 'tenantMode',
+        label: 'preferences.antd.fields.tenantMode.label',
+        options: [
+          {
+            label: 'preferences.antd.fields.tenantMode.options.single.label',
+            value: 'single',
+          },
+          {
+            label: 'preferences.antd.fields.tenantMode.options.multi.label',
+            value: 'multi',
+          },
+        ],
+      },
+      {
+        component: 'number',
+        componentProps: {
+          max: 200,
+          min: 10,
+          step: 10,
+        },
+        defaultValue: 20,
+        key: 'defaultTableSize',
+        label: 'preferences.antd.fields.defaultTableSize.label',
+      },
+      {
+        component: 'input',
+        defaultValue: '',
+        key: 'reportTitle',
+        label: 'preferences.antd.fields.reportTitle.label',
+        placeholder: 'preferences.antd.fields.reportTitle.placeholder',
+      },
+    ],
+  });
diff --git a/apps/web-antd/src/router/guard.ts b/apps/web-antd/src/router/guard.ts
index 92788851..dcf945bf 100644
--- a/apps/web-antd/src/router/guard.ts
+++ b/apps/web-antd/src/router/guard.ts
@@ -18,7 +18,7 @@ function setupCommonGuard(router: Router) {
   // 记录已经加载的页面
   const loadedPaths = new Set<string>();
 
-  router.beforeEach(async (to) => {
+  router.beforeEach((to) => {
     to.meta.loaded = loadedPaths.has(to.path);
 
     // 页面加载进度条
diff --git a/apps/web-antd/src/router/routes/core.ts b/apps/web-antd/src/router/routes/core.ts
index fe030a9a..949b0b65 100644
--- a/apps/web-antd/src/router/routes/core.ts
+++ b/apps/web-antd/src/router/routes/core.ts
@@ -1,11 +1,12 @@
 import type { RouteRecordRaw } from 'vue-router';
 
-import { DEFAULT_HOME_PATH, LOGIN_PATH } from '@vben/constants';
+import { LOGIN_PATH } from '@vben/constants';
+import { preferences } from '@vben/preferences';
 
-import { AuthPageLayout } from '#/layouts';
 import { $t } from '#/locales';
-import Login from '#/views/_core/authentication/login.vue';
 
+const BasicLayout = () => import('#/layouts/basic.vue');
+const AuthPageLayout = () => import('#/layouts/auth.vue');
 /** 全局404页面 */
 const fallbackNotFoundRoute: RouteRecordRaw = {
   component: () => import('#/views/_core/fallback/not-found.vue'),
@@ -21,13 +22,21 @@ const fallbackNotFoundRoute: RouteRecordRaw = {
 
 /** 基本路由，这些路由是必须存在的 */
 const coreRoutes: RouteRecordRaw[] = [
+  /**
+   * 根路由
+   * 使用基础布局，作为所有页面的父级容器，子级就不必配置BasicLayout。
+   * 此路由必须存在，且不应修改
+   */
   {
+    component: BasicLayout,
     meta: {
+      hideInBreadcrumb: true,
       title: 'Root',
     },
     name: 'Root',
     path: '/',
-    redirect: DEFAULT_HOME_PATH,
+    redirect: preferences.app.defaultHomePath,
+    children: [],
   },
   {
     component: AuthPageLayout,
@@ -42,7 +51,7 @@ const coreRoutes: RouteRecordRaw[] = [
       {
         name: 'Login',
         path: 'login',
-        component: Login,
+        component: () => import('#/views/_core/authentication/login.vue'),
         meta: {
           title: $t('page.auth.login'),
         },
diff --git a/apps/web-antd/src/router/routes/modules/dashboard.ts b/apps/web-antd/src/router/routes/modules/dashboard.ts
index 1bddab9d..44f15ef9 100644
--- a/apps/web-antd/src/router/routes/modules/dashboard.ts
+++ b/apps/web-antd/src/router/routes/modules/dashboard.ts
@@ -1,22 +1,20 @@
 import type { RouteRecordRaw } from 'vue-router';
 
-import { BasicLayout } from '#/layouts';
 import { $t } from '#/locales';
 
 const routes: RouteRecordRaw[] = [
   {
-    component: BasicLayout,
     meta: {
       icon: 'lucide:layout-dashboard',
       order: -1,
       title: $t('page.dashboard.title'),
     },
     name: 'Dashboard',
-    path: '/',
+    path: '/dashboard',
     children: [
       {
         name: 'Analytics',
-        path: '/analytics',
+        path: 'analytics',
         component: () => import('#/views/dashboard/analytics/index.vue'),
         meta: {
           affixTab: true,
@@ -26,7 +24,7 @@ const routes: RouteRecordRaw[] = [
       },
       {
         name: 'Workspace',
-        path: '/workspace',
+        path: 'workspace',
         component: () => import('#/views/dashboard/workspace/index.vue'),
         meta: {
           icon: 'carbon:workspace',
diff --git a/apps/web-antd/src/router/routes/modules/vben.ts b/apps/web-antd/src/router/routes/modules/vben.ts
index 210e8610..abcbee3e 100644
--- a/apps/web-antd/src/router/routes/modules/vben.ts
+++ b/apps/web-antd/src/router/routes/modules/vben.ts
@@ -1,40 +1,33 @@
 import type { RouteRecordRaw } from 'vue-router';
 
 import {
+  VBEN_ANTDV_NEXT_PREVIEW_URL,
   VBEN_DOC_URL,
   VBEN_ELE_PREVIEW_URL,
   VBEN_GITHUB_URL,
   VBEN_LOGO_URL,
   VBEN_NAIVE_PREVIEW_URL,
+  VBEN_TD_PREVIEW_URL,
 } from '@vben/constants';
+import { SvgAntdvNextLogoIcon, SvgTDesignIcon } from '@vben/icons';
 
-import { BasicLayout, IFrameView } from '#/layouts';
+import { IFrameView } from '#/layouts';
 import { $t } from '#/locales';
 
 const routes: RouteRecordRaw[] = [
   {
-    component: BasicLayout,
     meta: {
       badgeType: 'dot',
       icon: VBEN_LOGO_URL,
-      order: 9999,
+      order: 9998,
       title: $t('demos.vben.title'),
     },
     name: 'VbenProject',
     path: '/vben-admin',
     children: [
-      {
-        name: 'VbenAbout',
-        path: '/vben-admin/about',
-        component: () => import('#/views/_core/about/index.vue'),
-        meta: {
-          icon: 'lucide:copyright',
-          title: $t('demos.vben.about'),
-        },
-      },
       {
         name: 'VbenDocument',
-        path: '/vben-admin/document',
+        path: 'document',
         component: IFrameView,
         meta: {
           icon: 'lucide:book-open-text',
@@ -44,7 +37,7 @@ const routes: RouteRecordRaw[] = [
       },
       {
         name: 'VbenGithub',
-        path: '/vben-admin/github',
+        path: 'github',
         component: IFrameView,
         meta: {
           icon: 'mdi:github',
@@ -52,9 +45,20 @@ const routes: RouteRecordRaw[] = [
           title: 'Github',
         },
       },
+      {
+        name: 'VbenAntdVNext',
+        path: 'antdv-next',
+        component: IFrameView,
+        meta: {
+          badgeType: 'dot',
+          icon: SvgAntdvNextLogoIcon,
+          link: VBEN_ANTDV_NEXT_PREVIEW_URL,
+          title: $t('demos.vben.antdv-next'),
+        },
+      },
       {
         name: 'VbenNaive',
-        path: '/vben-admin/naive',
+        path: 'naive',
         component: IFrameView,
         meta: {
           badgeType: 'dot',
@@ -63,9 +67,20 @@ const routes: RouteRecordRaw[] = [
           title: $t('demos.vben.naive-ui'),
         },
       },
+      {
+        name: 'VbenTDesign',
+        path: 'tdesign',
+        component: IFrameView,
+        meta: {
+          badgeType: 'dot',
+          icon: SvgTDesignIcon,
+          link: VBEN_TD_PREVIEW_URL,
+          title: $t('demos.vben.tdesign'),
+        },
+      },
       {
         name: 'VbenElementPlus',
-        path: '/vben-admin/ele',
+        path: 'ele',
         component: IFrameView,
         meta: {
           badgeType: 'dot',
@@ -76,6 +91,26 @@ const routes: RouteRecordRaw[] = [
       },
     ],
   },
+  {
+    name: 'VbenAbout',
+    path: '/vben-admin/about',
+    component: () => import('#/views/_core/about/index.vue'),
+    meta: {
+      icon: 'lucide:copyright',
+      title: $t('demos.vben.about'),
+      order: 9999,
+    },
+  },
+  {
+    name: 'Profile',
+    path: '/profile',
+    component: () => import('#/views/_core/profile/index.vue'),
+    meta: {
+      icon: 'lucide:user',
+      hideInMenu: true,
+      title: $t('page.auth.profile'),
+    },
+  },
 ];
 
 export default routes;
diff --git a/apps/web-antd/src/store/auth.ts b/apps/web-antd/src/store/auth.ts
index b8b5b30f..01822513 100644
--- a/apps/web-antd/src/store/auth.ts
+++ b/apps/web-antd/src/store/auth.ts
@@ -3,6 +3,7 @@ import type { Recordable, UserInfo } from '@vben/types';
 import { ref } from 'vue';
 import { useRouter } from 'vue-router';
 
+import { preferences } from '@vben/preferences';
 import { DEFAULT_HOME_PATH, LOGIN_PATH } from '@vben/constants';
 import { useWatermark } from '@vben/hooks';
 import { resetAllStores, useAccessStore, useUserStore } from '@vben/stores';
@@ -32,6 +33,7 @@ export const useAuthStore = defineStore('auth', () => {
     params: Recordable<any>,
     onSuccess?: () => Promise<void> | void,
   ) {
+    // 异步处理用户登录操作并获取 accessToken
     let userInfo: null | UserInfo = null;
     try {
       loginLoading.value = true;
diff --git a/apps/web-antd/src/types/desktop.d.ts b/apps/web-antd/src/types/desktop.d.ts
new file mode 100644
index 00000000..351e422f
--- /dev/null
+++ b/apps/web-antd/src/types/desktop.d.ts
@@ -0,0 +1,37 @@
+/**
+ * 桌面端（Electron）preload 注入的全局 API 类型声明
+ * 形状与 apps/desktop/src/preload/index.ts 暴露的 desktopAPI 保持同步；
+ * 浏览器环境该对象不存在（可选属性），业务代码统一走 #/util/desktop 封装访问。
+ */
+interface Window {
+  desktopAPI?: {
+    /** 桌面端标记，恒为 true */
+    isElectron: true;
+    /** 当前平台：win32 / darwin / linux */
+    platform: string;
+    getVersion: () => Promise<string>;
+    notify: (options: { body: string; route?: string; title: string }) => Promise<boolean>;
+    setBadge: (count: number) => Promise<void>;
+    flashFrame: () => Promise<void>;
+    getAutoLaunch: () => Promise<boolean>;
+    setAutoLaunch: (enable: boolean) => Promise<boolean>;
+    getPrinters: () => Promise<
+      Array<{ displayName: string; isDefault: boolean; name: string }>
+    >;
+    printHTML: (options: {
+      deviceName?: string;
+      html: string;
+      silent?: boolean;
+    }) => Promise<{ message?: string; ok: boolean }>;
+    getSettings: () => Promise<{ printerName: string; silentPrint: boolean }>;
+    setSettings: (
+      patch: Partial<{ printerName: string; silentPrint: boolean }>,
+    ) => Promise<{ printerName: string; silentPrint: boolean }>;
+    checkUpdate: () => Promise<void>;
+    focusWindow: () => Promise<void>;
+    onNavigate: (callback: (route: string) => void) => void;
+    onUpdateEvent: (
+      callback: (payload: { data?: unknown; type: string }) => void,
+    ) => void;
+  };
+}
diff --git a/apps/web-antd/src/util/desktop.ts b/apps/web-antd/src/util/desktop.ts
new file mode 100644
index 00000000..3d1de68f
--- /dev/null
+++ b/apps/web-antd/src/util/desktop.ts
@@ -0,0 +1,122 @@
+/**
+ * 桌面端（Electron）能力封装
+ * 桌面端由 apps/desktop 的 preload 脚本注入 window.desktopAPI；
+ * 浏览器环境没有该对象，本封装的所有方法自动 no-op 降级，保证网页端行为完全不变。
+ * 业务代码禁止直接访问 window.desktopAPI，统一走本文件，便于类型收敛与降级兜底。
+ */
+
+/** 系统打印机信息（Electron getPrintersAsync 的子集） */
+export interface DesktopPrinter {
+  name: string;
+  displayName: string;
+  isDefault: boolean;
+}
+
+/** 桌面端本地设置（与 apps/desktop 主进程 settings.ts 保持同步） */
+export interface DesktopSettings {
+  /** 静默打印使用的打印机名称，空串表示系统默认打印机 */
+  printerName: string;
+  /** 是否启用静默打印 */
+  silentPrint: boolean;
+}
+
+/** 自动更新事件（主进程 updater 转发，渲染层做轻量提示） */
+export interface DesktopUpdateEvent {
+  type: 'available' | 'downloaded' | 'error' | 'not-available' | 'progress';
+  data?: unknown;
+}
+
+/** 判断当前是否运行在 Electron 桌面端 */
+export function isElectron(): boolean {
+  return typeof window !== 'undefined' && !!window.desktopAPI?.isElectron;
+}
+
+/** 取桥接 API：浏览器环境返回 undefined，调用方全部可选链降级 */
+function api() {
+  return typeof window === 'undefined' ? undefined : window.desktopAPI;
+}
+
+// onNavigate / onUpdateEvent 的桥接层每调用一次就会新增一个 ipc 监听，
+// 而布局组件会随登录/登出反复挂载。这里用「模块级单次桥接 + 可替换回调」避免监听器堆积
+let navigateCallback: ((route: string) => void) | null = null;
+let navigateBridged = false;
+let updateCallback: ((payload: DesktopUpdateEvent) => void) | null = null;
+let updateBridged = false;
+
+export const desktop = {
+  /** 发送系统通知；route 为点击通知后要跳转的前端路由（不传则仅唤起窗口） */
+  notify(options: { body: string; route?: string; title: string }): void {
+    api()?.notify(options);
+  },
+  /** 设置未读角标数量，0 表示清除（mac Dock 数字 / Windows 任务栏覆盖图标） */
+  setBadge(count: number): void {
+    api()?.setBadge(count);
+  },
+  /** 任务栏闪烁提醒（窗口未聚焦时生效，聚焦后自动清除） */
+  flashFrame(): void {
+    api()?.flashFrame();
+  },
+  /** 读取开机自启状态（浏览器环境恒为 false） */
+  async getAutoLaunch(): Promise<boolean> {
+    return (await api()?.getAutoLaunch()) ?? false;
+  },
+  /** 设置开机自启，返回设置后的实际状态 */
+  async setAutoLaunch(enable: boolean): Promise<boolean> {
+    return (await api()?.setAutoLaunch(enable)) ?? false;
+  },
+  /** 获取系统打印机列表（浏览器环境返回空数组） */
+  async getPrinters(): Promise<DesktopPrinter[]> {
+    return (await api()?.getPrinters()) ?? [];
+  },
+  /** 静默打印：传入拼好的完整 HTML，由主进程隐藏窗口出纸 */
+  async printHTML(options: {
+    deviceName?: string;
+    html: string;
+    silent?: boolean;
+  }): Promise<{ message?: string; ok: boolean }> {
+    return (
+      (await api()?.printHTML(options)) ?? {
+        ok: false,
+        message: '当前环境不支持桌面打印',
+      }
+    );
+  },
+  /** 读取桌面端设置 */
+  async getSettings(): Promise<DesktopSettings> {
+    return (await api()?.getSettings()) ?? { printerName: '', silentPrint: false };
+  },
+  /** 增量更新桌面端设置，返回更新后的完整设置 */
+  async setSettings(patch: Partial<DesktopSettings>): Promise<DesktopSettings> {
+    return (
+      (await api()?.setSettings(patch)) ?? { printerName: '', silentPrint: false }
+    );
+  },
+  /** 手动检查更新（结果由主进程弹窗反馈） */
+  checkUpdate(): void {
+    api()?.checkUpdate();
+  },
+  /** 唤起并聚焦主窗口 */
+  focusWindow(): void {
+    api()?.focusWindow();
+  },
+  /** 监听系统通知点击后的路由跳转请求（重复调用只替换回调，不会堆积监听器） */
+  onNavigate(callback: (route: string) => void): void {
+    navigateCallback = callback;
+    if (!navigateBridged && api()) {
+      navigateBridged = true;
+      api()!.onNavigate((route) => navigateCallback?.(route));
+    }
+  },
+  /** 解绑路由跳转回调：布局卸载（登出）时调用，避免残留系统通知被点击后对已登出会话执行跳转 */
+  offNavigate(): void {
+    navigateCallback = null;
+  },
+  /** 监听自动更新事件（重复调用只替换回调，不会堆积监听器） */
+  onUpdateEvent(callback: (payload: DesktopUpdateEvent) => void): void {
+    updateCallback = callback;
+    if (!updateBridged && api()) {
+      updateBridged = true;
+      api()!.onUpdateEvent((payload) => updateCallback?.(payload as DesktopUpdateEvent));
+    }
+  },
+};
diff --git a/apps/web-antd/src/utils/chinesePrescriptionMargin.ts b/apps/web-antd/src/utils/chinesePrescriptionMargin.ts
index 2bae9423..e352bbfe 100644
--- a/apps/web-antd/src/utils/chinesePrescriptionMargin.ts
+++ b/apps/web-antd/src/utils/chinesePrescriptionMargin.ts
@@ -1,60 +1,60 @@
-/**

- * 中药处方毛利率计算（仅商品计费，不含诊疗费/加工费）

- */

-

-export function isSeeRateEnabled(seeRate: unknown): boolean {

-  return Number(seeRate) === 1;

-}

-

-function isValidBuyPrice(value: unknown): boolean {

-  if (value === null || value === undefined || value === '') {

-    return false;

-  }

-  const n = Number(value);

-  return !Number.isNaN(n);

-}

-

-export function calcItemMarginPercent(

-  price: number | string | undefined,

-  buyPrice: number | string | undefined,

-): string {

-  const p = Number(price);

-  if (!p || p <= 0 || !isValidBuyPrice(buyPrice)) {

-    return '--';

-  }

-  const b = Number(buyPrice);

-  return (((p - b) / p) * 100).toFixed(2);

-}

-

-export interface ChineseDrugMarginRow {

-  price?: number | string;

-  buy_price?: number | string;

-  number?: number | string;

-  select_number?: number | string;

-}

-

-export function calcTotalMarginPercent(

-  drugs: ChineseDrugMarginRow[],

-  dosage: number,

-): string {

-  if (!drugs?.length || dosage <= 0) {

-    return '0.00';

-  }

-  let saleTotal = 0;

-  let buyTotal = 0;

-  for (const drug of drugs) {

-    if (!isValidBuyPrice(drug.buy_price)) {

-      return '--';

-    }

-    const qty = Number(drug.number ?? drug.select_number ?? 1);

-    const price = Number(drug.price || 0);

-    const buyPrice = Number(drug.buy_price);

-    saleTotal += price * qty * dosage;

-    buyTotal += buyPrice * qty * dosage;

-  }

-  if (saleTotal <= 0) {

-    return '0.00';

-  }

-  return (((saleTotal - buyTotal) / saleTotal) * 100).toFixed(2);

-}

-
\ No newline at end of file
+/**
+ * 中药处方毛利率计算（仅商品计费，不含诊疗费/加工费）
+ */
+
+export function isSeeRateEnabled(seeRate: unknown): boolean {
+  return Number(seeRate) === 1;
+}
+
+function isValidBuyPrice(value: unknown): boolean {
+  if (value === null || value === undefined || value === '') {
+    return false;
+  }
+  const n = Number(value);
+  return !Number.isNaN(n);
+}
+
+export function calcItemMarginPercent(
+  price: number | string | undefined,
+  buyPrice: number | string | undefined,
+): string {
+  const p = Number(price);
+  if (!p || p <= 0 || !isValidBuyPrice(buyPrice)) {
+    return '--';
+  }
+  const b = Number(buyPrice);
+  return (((p - b) / p) * 100).toFixed(2);
+}
+
+export interface ChineseDrugMarginRow {
+  price?: number | string;
+  buy_price?: number | string;
+  number?: number | string;
+  select_number?: number | string;
+}
+
+export function calcTotalMarginPercent(
+  drugs: ChineseDrugMarginRow[],
+  dosage: number,
+): string {
+  if (!drugs?.length || dosage <= 0) {
+    return '0.00';
+  }
+  let saleTotal = 0;
+  let buyTotal = 0;
+  for (const drug of drugs) {
+    if (!isValidBuyPrice(drug.buy_price)) {
+      return '--';
+    }
+    const qty = Number(drug.number ?? drug.select_number ?? 1);
+    const price = Number(drug.price || 0);
+    const buyPrice = Number(drug.buy_price);
+    saleTotal += price * qty * dosage;
+    buyTotal += buyPrice * qty * dosage;
+  }
+  if (saleTotal <= 0) {
+    return '0.00';
+  }
+  return (((saleTotal - buyTotal) / saleTotal) * 100).toFixed(2);
+}
+
diff --git a/apps/web-antd/src/utils/register-notify.ts b/apps/web-antd/src/utils/register-notify.ts
new file mode 100644
index 00000000..de65a1fe
--- /dev/null
+++ b/apps/web-antd/src/utils/register-notify.ts
@@ -0,0 +1,144 @@
+/**
+ * 挂号实时提醒工具（医生端）
+ *
+ * xk-api 在挂号支付成功后通过 Go WebSocket 推 message_type=15 的系统消息，
+ * useWebSocket 收到后调用 handleRegisterNotifyMessage 统一处理：
+ * - 桌面端（Electron）且窗口未聚焦：弹系统级消息通知 + 任务栏闪烁 + 播放提示音，
+ *   点击通知唤起窗口并跳转挂号订单页（走 basic.vue 已接线的 desktop.onNavigate）
+ * - 页面端（浏览器 / 桌面端窗口聚焦中）：弹站内 antd notification + 播放提示音
+ */
+import { notification } from 'ant-design-vue';
+
+import { router } from '#/router';
+import { desktop, isElectron } from '#/util/desktop';
+
+// 与 util/tool.ts 的 sys.mp3 同方式引入：经 Vite 处理，生产构建自动带部署 base 路径
+import RegisterNotifyMp3 from '/public/audio/register-notify.mp3';
+
+/** 与后端 App\Enum\chat\MessageTypeEnum::REGISTER_NOTIFY 对齐 */
+export const REGISTER_NOTIFY_MESSAGE_TYPE = 15;
+
+/** 挂号订单列表菜单路由（xk_menu path），通知点击后的统一落点 */
+const REGISTER_ORDER_ROUTE = '/business/register/list';
+
+/** 去重窗口：同一挂号单 10 秒内只提醒一次（防多标签页/重复投递叠加提示音） */
+const DEDUPE_WINDOW_MS = 10_000;
+const DEDUPE_KEY_PREFIX = 'xk-register-notify:';
+
+/** 后端 RegisterDoctorWsNotifyJob 拼装的通知载荷（message_content JSON） */
+interface RegisterNotifyPayload {
+  body: string;
+  order_no?: string;
+  register_id: number;
+  scene?: string;
+  title: string;
+}
+
+/** 提示音单例：复用同一个 Audio 对象，避免每次通知都新建请求 */
+let audioInstance: HTMLAudioElement | null = null;
+
+/**
+ * 播放通知提示音
+ * play() 返回的 Promise 在浏览器自动播放策略拒绝时会 reject（用户从未与页面交互过），
+ * 这里静默吞掉：医生登录后必然点击过页面，正常场景不会被拦
+ */
+function playNotifySound() {
+  try {
+    if (!audioInstance) {
+      audioInstance = new Audio(RegisterNotifyMp3);
+    }
+    audioInstance.currentTime = 0;
+    audioInstance.play().catch(() => {});
+  } catch {
+    // Audio 不可用（极老浏览器）时跳过声音，不影响通知展示
+  }
+}
+
+/**
+ * 解析 WS 消息里的通知载荷
+ * message_content 是后端 json_encode 的字符串；解析失败返回 null 直接忽略该条
+ */
+function parsePayload(raw: unknown): null | RegisterNotifyPayload {
+  try {
+    const data = typeof raw === 'string' ? JSON.parse(raw) : raw;
+    if (!data || typeof data !== 'object') return null;
+    const record = data as Record<string, unknown>;
+    const registerId = Number(record.register_id);
+    if (!Number.isFinite(registerId) || registerId <= 0) return null;
+    return {
+      register_id: registerId,
+      title: String(record.title || '新的挂号订单'),
+      body: String(record.body || ''),
+      order_no: String(record.order_no || ''),
+      scene: String(record.scene || ''),
+    };
+  } catch {
+    return null;
+  }
+}
+
+/**
+ * 同一挂号单去重：localStorage 记录上次提醒时间戳
+ * 医生开多个标签/窗口时每个连接都会收到推送（Go 服务发给用户所有在线设备），
+ * 不去重会同时响多次提示音；localStorage 跨标签共享，天然适合做这个锁
+ */
+function shouldNotify(registerId: number): boolean {
+  const key = DEDUPE_KEY_PREFIX + registerId;
+  try {
+    const last = Number(localStorage.getItem(key) || 0);
+    const now = Date.now();
+    if (now - last < DEDUPE_WINDOW_MS) return false;
+    localStorage.setItem(key, String(now));
+    return true;
+  } catch {
+    // localStorage 不可用（隐私模式）时放行，宁可重复提醒不可漏提醒
+    return true;
+  }
+}
+
+/**
+ * 弹站内通知卡片
+ * key 用挂号单 ID 保证同单只显示一张卡片；点击卡片跳转挂号订单页并收起。
+ * 页面在后台标签时不自动关闭（duration=0），医生切回来仍能看到提醒
+ */
+function showInPageNotification(payload: RegisterNotifyPayload) {
+  const key = `register-notify-${payload.register_id}`;
+  notification.open({
+    key,
+    message: payload.title,
+    description: payload.body || payload.order_no,
+    duration: document.hidden ? 0 : 8,
+    onClick: () => {
+      router.push(REGISTER_ORDER_ROUTE).catch(() => {});
+      notification.close(key);
+    },
+  });
+}
+
+/**
+ * 挂号提醒统一入口（useWebSocket 收到 message_type=15 时调用）
+ * 流程：解析载荷 → 跨标签去重 → 播放提示音 → 按运行环境选择通知形态
+ */
+export function handleRegisterNotifyMessage(data: {
+  message_content?: unknown;
+}) {
+  const payload = parsePayload(data?.message_content);
+  if (!payload || !shouldNotify(payload.register_id)) return;
+
+  playNotifySound();
+
+  // 桌面端窗口未聚焦：系统通知 + 任务栏闪烁（页内卡片此时用户看不到），
+  // 点击通知由主进程唤起窗口并回传路由（basic.vue 的 desktop.onNavigate 执行跳转）
+  if (isElectron() && !document.hasFocus()) {
+    desktop.notify({
+      title: payload.title,
+      body: payload.body || payload.order_no || '',
+      route: REGISTER_ORDER_ROUTE,
+    });
+    desktop.flashFrame();
+    return;
+  }
+
+  // 浏览器端 / 桌面端窗口聚焦中：站内提示
+  showInPageNotification(payload);
+}
diff --git a/apps/web-antd/src/utils/tagColor.ts b/apps/web-antd/src/utils/tagColor.ts
new file mode 100644
index 00000000..7418d954
--- /dev/null
+++ b/apps/web-antd/src/utils/tagColor.ts
@@ -0,0 +1,41 @@
+/**
+ * antd Tag 预设色名 → css 色值工具
+ *
+ * 为什么需要：Apple 风格卡片用「状态彩点 + tinted 胶囊」替代 antd Tag 色块，
+ * 但字典常量里沿用 antd 色名（red/green/processing…），这里统一转换成真实色值，
+ * 供订单三页卡片视图与详情弹窗共用，避免各组件复制色板。
+ */
+export const TAG_COLOR_HEX: Record<string, string> = {
+  red: '#f5222d',
+  orange: '#fa8c16',
+  gold: '#faad14',
+  yellow: '#d4b106',
+  green: '#52c41a',
+  cyan: '#13c2c2',
+  blue: '#1677ff',
+  geekblue: '#2f54eb',
+  purple: '#722ed1',
+  pink: '#eb2f96',
+  magenta: '#eb2f96',
+  processing: '#1677ff',
+  success: '#52c41a',
+  warning: '#fa8c16',
+  error: '#f5222d',
+  gray: '#8c8c8c',
+  default: '#8c8c8c',
+};
+
+/** 未知色名兜底灰（单独常量，规避 Record 索引返回 undefined 的类型收窄问题） */
+const DEFAULT_TAG_HEX = '#8c8c8c';
+
+/** Tag 色名转 css 色值；自定义 hex 原样返回，未知色名回退灰 */
+export function tagColorHex(color?: string): string {
+  if (!color) return DEFAULT_TAG_HEX;
+  return color.startsWith('#') ? color : (TAG_COLOR_HEX[color] ?? DEFAULT_TAG_HEX);
+}
+
+/** Apple tinted 胶囊内联样式：同色 10% 透明度底 + 同色文字（8 位 hex alpha） */
+export function pillStyle(color?: string) {
+  const hex = tagColorHex(color);
+  return { color: hex, background: `${hex}1a` };
+}
diff --git a/apps/web-antd/src/utils/vip.ts b/apps/web-antd/src/utils/vip.ts
index a7002bed..929f10e0 100644
--- a/apps/web-antd/src/utils/vip.ts
+++ b/apps/web-antd/src/utils/vip.ts
@@ -144,3 +144,58 @@ export function useVipPermission(
 export function useVipGate() {
   return useVipPermission();
 }
+
+/**
+ * 格式化 VIP 到期时间文案（列表/弹窗共用）
+ * @param vip 门店 VIP 信息
+ * @param options.emptyText 普通会员/无数据时的文案，默认空串
+ * @param options.lifetimeText 终身文案，默认「终身」
+ * @param options.withPrefix 是否加「至」前缀（非终身时）
+ */
+export function formatVipExpireAt(
+  vip?: StoreVipInfo | Record<string, any> | null,
+  options?: {
+    emptyText?: string;
+    lifetimeText?: string;
+    withPrefix?: boolean;
+  },
+): string {
+  const emptyText = options?.emptyText ?? '';
+  const lifetimeText = options?.lifetimeText ?? '终身';
+  const withPrefix = options?.withPrefix ?? false;
+  if (!vip) return emptyText;
+  const code = String(vip.level_code || 'V0').trim() || 'V0';
+  if (code === 'V0') return emptyText;
+  if (vip.is_lifetime) return lifetimeText;
+  const raw = vip.expire_at as unknown;
+  if (raw == null || raw === '' || raw === 0) {
+    // 无到期日且非 V0：按终身展示（与列表列逻辑一致）
+    return lifetimeText;
+  }
+  // 后端偶发已格式化成 Y-m-d H:i:s
+  if (typeof raw === 'string' && Number.isNaN(Number(raw))) {
+    return withPrefix ? `至 ${raw}` : raw;
+  }
+  const n = Number(raw);
+  if (!(n > 0)) return lifetimeText;
+  const d = new Date(n * 1000);
+  if (Number.isNaN(d.getTime())) return emptyText;
+  const pad = (x: number) => String(x).padStart(2, '0');
+  const text = `${d.getFullYear()}-${pad(d.getMonth() + 1)}-${pad(d.getDate())} ${pad(d.getHours())}:${pad(d.getMinutes())}:${pad(d.getSeconds())}`;
+  return withPrefix ? `至 ${text}` : text;
+}
+
+/**
+ * 列表副文案：时长类型 + 到期（如「月卡 · 至 2026-08-10 …」）
+ */
+export function formatVipDurationExpireLine(
+  vip?: StoreVipInfo | Record<string, any> | null,
+): string {
+  if (!vip) return '点击管理';
+  const code = String(vip.level_code || 'V0').trim() || 'V0';
+  if (code === 'V0') return '点击管理';
+  const duration = String(vip.duration_label || '').trim();
+  const expire = formatVipExpireAt(vip, { withPrefix: true, lifetimeText: '终身' });
+  if (duration && expire) return `${duration} · ${expire}`;
+  return duration || expire || '点击管理';
+}
diff --git a/apps/web-antd/src/views/_core/authentication/code-login.vue b/apps/web-antd/src/views/_core/authentication/code-login.vue
index 19898538..e9003994 100644
--- a/apps/web-antd/src/views/_core/authentication/code-login.vue
+++ b/apps/web-antd/src/views/_core/authentication/code-login.vue
@@ -53,8 +53,7 @@ const formSchema = computed((): VbenFormSchema[] => {
  * @param values 登录表单数据
  */
 async function handleLogin(values: Recordable<any>) {
-  // eslint-disable-next-line no-console
-  console.log(values);
+  void values;
 }
 </script>
 
diff --git a/apps/web-antd/src/views/_core/authentication/forget-password.vue b/apps/web-antd/src/views/_core/authentication/forget-password.vue
index fef0d427..10444d0a 100644
--- a/apps/web-antd/src/views/_core/authentication/forget-password.vue
+++ b/apps/web-antd/src/views/_core/authentication/forget-password.vue
@@ -29,8 +29,7 @@ const formSchema = computed((): VbenFormSchema[] => {
 });
 
 function handleSubmit(value: Recordable<any>) {
-  // eslint-disable-next-line no-console
-  console.log('reset email:', value);
+  void value;
 }
 </script>
 
diff --git a/apps/web-antd/src/views/_core/authentication/register.vue b/apps/web-antd/src/views/_core/authentication/register.vue
index b1a5de72..a1175357 100644
--- a/apps/web-antd/src/views/_core/authentication/register.vue
+++ b/apps/web-antd/src/views/_core/authentication/register.vue
@@ -46,7 +46,7 @@ const formSchema = computed((): VbenFormSchema[] => {
         rules(values) {
           const { password } = values;
           return z
-            .string({ required_error: $t('authentication.passwordTip') })
+            .string({ error: $t('authentication.passwordTip') })
             .min(1, { message: $t('authentication.passwordTip') })
             .refine((value) => value === password, {
               message: $t('authentication.confirmPasswordTip'),
@@ -82,8 +82,7 @@ const formSchema = computed((): VbenFormSchema[] => {
 });
 
 function handleSubmit(value: Recordable<any>) {
-  // eslint-disable-next-line no-console
-  console.log('register submit:', value);
+  void value;
 }
 </script>
 
diff --git a/apps/web-antd/src/views/_core/profile/api/index.ts b/apps/web-antd/src/views/_core/profile/api/index.ts
new file mode 100644
index 00000000..8bf00c2e
--- /dev/null
+++ b/apps/web-antd/src/views/_core/profile/api/index.ts
@@ -0,0 +1,20 @@
+import { requestClient } from '#/api/request';
+
+// 个人中心接口（后端 routes/admin.php 的 auth 分组，AdminController → common AdminProfileService）
+const prefix = 'auth/';
+
+/**
+ * 获取我的个人中心资料
+ * 与 auth/my-info（Redis 会话快照）不同，这里返回实时库数据 + 只读展示字段（登录账号/所属门店/最后登录时间等）
+ */
+export async function getMyProfile() {
+  return requestClient.get<any>(`${prefix}my-profile`);
+}
+
+/**
+ * 修改我的资料（后端白名单：仅昵称 nick_name、头像 avatar）
+ * 保存成功后后端会同步刷新 Redis 会话，前端只需重拉 my-info 即可让顶栏生效
+ */
+export async function updateMyProfile(data: any) {
+  return requestClient.post<any>(`${prefix}update-my-profile`, data);
+}
diff --git a/apps/web-antd/src/views/_core/profile/base-setting.vue b/apps/web-antd/src/views/_core/profile/base-setting.vue
new file mode 100644
index 00000000..aae04904
--- /dev/null
+++ b/apps/web-antd/src/views/_core/profile/base-setting.vue
@@ -0,0 +1,184 @@
+<script setup lang="ts">
+/**
+ * 个人中心 - 基本资料
+ * 可编辑：头像（复用表单 Avatar 上传组件）、昵称（与后端 update-my-profile 白名单一致）
+ * 只读展示：登录账号/手机号/角色/所属门店/最后登录时间等（账号身份信息不允许自助修改）
+ * 保存成功后重拉 my-info 刷新全局登录态，顶栏/工作台头像昵称立即生效
+ */
+import { computed, ref, watch } from 'vue';
+
+import { Button, message } from 'ant-design-vue';
+
+import { useVbenForm } from '#/adapter/form';
+import { useAuthStore } from '#/store/auth';
+
+import { updateMyProfile } from './api';
+
+const props = defineProps({
+  profile: {
+    type: Object,
+    default: () => ({}),
+  },
+});
+const emits = defineEmits(['saved']);
+
+const authStore = useAuthStore();
+
+/** 可编辑字段表单：仅头像 + 昵称，其余字段一律只读展示 */
+const [Form, formApi] = useVbenForm({
+  wrapperClass: 'grid-cols-12',
+  commonConfig: {
+    formItemClass: 'col-span-12',
+    labelWidth: 80,
+    componentProps: {
+      class: 'w-full',
+    },
+  },
+  layout: 'horizontal',
+  schema: [
+    {
+      component: 'Avatar',
+      fieldName: 'avatar',
+      label: '头像',
+    },
+    {
+      component: 'VbenInput',
+      fieldName: 'nick_name',
+      label: '昵称',
+      rules: 'required',
+      componentProps: {
+        placeholder: '请输入昵称',
+        maxlength: 20,
+      },
+    },
+  ],
+  showDefaultActions: false,
+});
+
+// 父组件拉取到实时资料后回填表单（保存成功刷新后同样走这里）
+watch(
+  () => props.profile,
+  (val: any) => {
+    if (val && val.id) {
+      formApi.setValues({
+        avatar: val.avatar,
+        nick_name: val.nick_name,
+      });
+    }
+  },
+  { deep: true, immediate: true },
+);
+
+/** 只读信息行：为空的可选字段（门店/工号/邮箱）不展示，避免一排「-」 */
+const readonlyRows = computed(() => {
+  const p: any = props.profile || {};
+  const rows: { label: string; value: string }[] = [
+    { label: '登录账号', value: p.login_account },
+    { label: '手机号', value: p.phone },
+    { label: '角色', value: p.role_name },
+  ];
+  if (p.store_name) {
+    rows.push({ label: '所属门店', value: p.store_name });
+  }
+  if (p.job_number) {
+    rows.push({ label: '工号', value: p.job_number });
+  }
+  if (p.email) {
+    rows.push({ label: '邮箱', value: p.email });
+  }
+  rows.push({ label: '最后登录', value: p.last_login_time });
+  rows.push({ label: '创建时间', value: p.created_at });
+  return rows.map((row) => ({ ...row, value: row.value || '-' }));
+});
+
+const saving = ref(false);
+
+/**
+ * 保存资料：校验 → 提交白名单字段 → 重拉全局登录态 → 通知父组件刷新
+ * 为什么要 fetchUserInfo：后端已刷新 Redis 会话，前端重拉 my-info 才能让顶栏/工作台立即显示新头像昵称
+ */
+function handleSave() {
+  formApi.validate().then(async (e: any) => {
+    if (!e.valid) return;
+    const values = await formApi.getValues();
+    saving.value = true;
+    try {
+      await updateMyProfile({
+        nick_name: values.nick_name,
+        avatar: values.avatar || '',
+      });
+      message.success('保存成功');
+      await authStore.fetchUserInfo();
+      emits('saved');
+    } finally {
+      saving.value = false;
+    }
+  });
+}
+</script>
+<template>
+  <div class="profile-base w-full lg:w-2/3">
+    <Form />
+    <Button type="primary" :loading="saving" @click="handleSave">
+      保存资料
+    </Button>
+    <div class="profile-base__section-title">账号信息</div>
+    <div class="profile-base__grid">
+      <div
+        v-for="row in readonlyRows"
+        :key="row.label"
+        class="profile-base__row"
+      >
+        <span class="profile-base__label">{{ row.label }}</span>
+        <span class="profile-base__value">{{ row.value }}</span>
+      </div>
+    </div>
+  </div>
+</template>
+<style scoped>
+/* 只读信息区：全部走主题变量，暗色模式自动适配 */
+.profile-base__section-title {
+  padding-bottom: 10px;
+  margin-top: 28px;
+  margin-bottom: 4px;
+  font-size: 14px;
+  font-weight: 600;
+  color: hsl(var(--foreground));
+  border-bottom: 1px solid hsl(var(--border));
+}
+
+.profile-base__grid {
+  display: grid;
+  grid-template-columns: repeat(2, minmax(0, 1fr));
+  gap: 0 24px;
+}
+
+.profile-base__row {
+  display: flex;
+  gap: 12px;
+  align-items: center;
+  padding: 10px 0;
+  border-bottom: 1px dashed hsl(var(--border) / 0.6);
+}
+
+.profile-base__label {
+  flex-shrink: 0;
+  width: 72px;
+  font-size: 13px;
+  color: hsl(var(--muted-foreground));
+}
+
+.profile-base__value {
+  overflow: hidden;
+  font-size: 13px;
+  color: hsl(var(--foreground));
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+@media (max-width: 768px) {
+  .profile-base__grid {
+    grid-template-columns: 1fr;
+  }
+}
+</style>
diff --git a/apps/web-antd/src/views/_core/profile/index.vue b/apps/web-antd/src/views/_core/profile/index.vue
new file mode 100644
index 00000000..5c866d0a
--- /dev/null
+++ b/apps/web-antd/src/views/_core/profile/index.vue
@@ -0,0 +1,67 @@
+<script setup lang="ts">
+/**
+ * 个人中心：左侧账号卡（头像/昵称/角色）+ 右侧 Tab（基本资料 / 修改密码）
+ * 入口：顶栏头像下拉「个人中心」、工作台问候头；静态路由 /profile（hideInMenu，不走 xk_menu）
+ * 资料数据统一从 auth/my-profile 实时接口拉取，子组件保存成功后回调刷新
+ */
+import { computed, onMounted, ref } from 'vue';
+
+import { Profile } from '@vben/common-ui';
+
+import { getMyProfile } from './api';
+import ProfileBase from './base-setting.vue';
+import ProfilePasswordSetting from './password-setting.vue';
+
+const tabsValue = ref<string>('basic');
+
+const tabs = ref([
+  {
+    label: '基本资料',
+    value: 'basic',
+  },
+  {
+    label: '修改密码',
+    value: 'password',
+  },
+]);
+
+/** 个人中心资料（basic tab 编辑 + 左侧账号卡展示共用一份数据） */
+const profile = ref<any>({});
+
+/**
+ * 左侧账号卡数据映射
+ * Profile 壳组件展示 realName（大字）与 username（小字），这里映射为 昵称 + 角色名
+ * avatar 为空时必须传 undefined（不能传空串），Profile 内部才会 ?? 兜底系统默认头像
+ */
+const cardUserInfo = computed(() => ({
+  avatar: profile.value.avatar || undefined,
+  nick_name: profile.value.nick_name || '',
+  userId: String(profile.value.id || ''),
+  username: profile.value.role_name || '',
+  realName: profile.value.nick_name || '',
+}));
+
+/** 拉取实时资料（初始化 + 保存成功后刷新） */
+async function loadProfile() {
+  profile.value = (await getMyProfile()) || {};
+}
+
+onMounted(loadProfile);
+</script>
+<template>
+  <Profile
+    v-model:model-value="tabsValue"
+    title="个人中心"
+    :user-info="cardUserInfo"
+    :tabs="tabs"
+  >
+    <template #content>
+      <ProfileBase
+        v-if="tabsValue === 'basic'"
+        :profile="profile"
+        @saved="loadProfile"
+      />
+      <ProfilePasswordSetting v-if="tabsValue === 'password'" />
+    </template>
+  </Profile>
+</template>
diff --git a/apps/web-antd/src/views/_core/profile/password-setting.vue b/apps/web-antd/src/views/_core/profile/password-setting.vue
new file mode 100644
index 00000000..661089bf
--- /dev/null
+++ b/apps/web-antd/src/views/_core/profile/password-setting.vue
@@ -0,0 +1,50 @@
+<script setup lang="ts">
+/**
+ * 个人中心 - 修改密码
+ * 复用顶栏「修改密码」弹窗同一份表单配置（layouts/config/form.ts 的 passwordModalForm）
+ * 与同一个接口（admin/update-password），保证两个入口口径完全一致，不重复造轮子
+ */
+import { ref } from 'vue';
+
+import { Button, message } from 'ant-design-vue';
+
+import { useVbenForm } from '#/adapter/form';
+import { passwordModalForm } from '#/layouts/config/form';
+import { updatePassword } from '#/views/system/admin/api';
+
+const [Form, formApi] = useVbenForm(passwordModalForm);
+
+const submitting = ref(false);
+
+/**
+ * 提交改密：校验 → 调 admin/update-password → 清空表单
+ * 成功提示与顶栏弹窗一致（token 仍有效，下次登录使用新密码）
+ */
+function handleSubmit() {
+  formApi.validate().then(async (e: any) => {
+    if (!e.valid) return;
+    const values = await formApi.getValues();
+    submitting.value = true;
+    try {
+      await updatePassword(values);
+      message.success('修改成功，请重新登录');
+      formApi.resetForm();
+    } finally {
+      submitting.value = false;
+    }
+  });
+}
+</script>
+<template>
+  <div class="w-full lg:w-1/2">
+    <Form />
+    <Button
+      class="mt-4"
+      type="primary"
+      :loading="submitting"
+      @click="handleSubmit"
+    >
+      修改密码
+    </Button>
+  </div>
+</template>
diff --git a/apps/web-antd/src/views/business/chat/components/SettingsModal.vue b/apps/web-antd/src/views/business/chat/components/SettingsModal.vue
index 4deb755a..3366ac88 100644
--- a/apps/web-antd/src/views/business/chat/components/SettingsModal.vue
+++ b/apps/web-antd/src/views/business/chat/components/SettingsModal.vue
@@ -235,6 +235,7 @@
 
 <script setup>
 import {ref, reactive, watch, onMounted} from 'vue'
+import {desktop, isElectron} from '#/util/desktop'
 import {useThemeStore} from '../stores/theme.ts'
 import CustomModal from './CustomModal.vue'
 
@@ -341,6 +342,11 @@ const updateTheme = () => {
 }
 
 const updateNotificationPermission = async () => {
+  // Electron 桌面端走 desktop.notify() 系统级通知，不依赖浏览器 Notification 权限；
+  // 若照旧申请权限，被拒后会把开关强制关掉，导致桌面通知被浏览器权限逻辑误关
+  if (isElectron()) {
+    return
+  }
   if (settings.desktopNotifications && 'Notification' in window) {
     if (Notification.permission === 'default') {
       const permission = await Notification.requestPermission()
@@ -352,7 +358,12 @@ const updateNotificationPermission = async () => {
   }
 }
 
+// 检查更新：桌面端走 Electron 自动更新（结果由主进程弹窗反馈），网页端保持原提示
 const checkUpdate = () => {
+  if (isElectron()) {
+    desktop.checkUpdate()
+    return
+  }
   showNotification('当前已是最新版本', 'info')
 }
 
diff --git a/apps/web-antd/src/views/business/chat/composables/useWebSocket.ts b/apps/web-antd/src/views/business/chat/composables/useWebSocket.ts
index f39d86c7..66286761 100644
--- a/apps/web-antd/src/views/business/chat/composables/useWebSocket.ts
+++ b/apps/web-antd/src/views/business/chat/composables/useWebSocket.ts
@@ -3,6 +3,10 @@ import { onMounted, onUnmounted, ref } from 'vue';
 import { useAccessStore } from '@vben/stores';
 
 import { getWebSocketUrl } from '#/util/tool';
+import {
+  handleRegisterNotifyMessage,
+  REGISTER_NOTIFY_MESSAGE_TYPE,
+} from '#/utils/register-notify';
 
 import { useChatStore } from '../stores/chat';
 import { useUserStore } from '../stores/user';
@@ -95,6 +99,12 @@ export function useWebSocket() {
         return;
       }
 
+      // 挂号实时提醒（message_type=15 系统通知）：弹桌面/站内通知+提示音，不进聊天窗口
+      if (Number(data.message_type) === REGISTER_NOTIFY_MESSAGE_TYPE) {
+        handleRegisterNotifyMessage(data);
+        return;
+      }
+
       // 优先处理通话信令（无论是否在当前聊天窗口）
       if (data.call_id && data.call_status) {
         handleCallSignal(data);
diff --git a/apps/web-antd/src/views/business/chat/stores/chat.ts b/apps/web-antd/src/views/business/chat/stores/chat.ts
index f57d56d5..daf6f578 100644
--- a/apps/web-antd/src/views/business/chat/stores/chat.ts
+++ b/apps/web-antd/src/views/business/chat/stores/chat.ts
@@ -2,6 +2,7 @@ import { computed, ref, watch } from 'vue';
 
 import { defineStore } from 'pinia';
 
+import { desktop, isElectron } from '#/util/desktop';
 import { playOnceAndDestroySys } from '#/util/tool';
 import {
   getChatFriendsListApi,
@@ -37,6 +38,33 @@ export const useChatStore = defineStore('chat', () => {
 
   const lastMessageId = ref(0);
 
+  /**
+   * 判断是否需要发桌面系统通知
+   * 条件：Electron 桌面端 + 窗口未聚焦（聚焦时页内已有提示音和 UI，不重复打扰）
+   * + 尊重聊天设置弹窗（SettingsModal）持久化在 chat-settings 里的开关
+   * @param settingKey 对应设置项：desktopNotifications（消息）/ callNotifications（来电）
+   */
+  const shouldDesktopNotify = (settingKey = 'desktopNotifications') => {
+    if (!isElectron() || document.hasFocus()) return false;
+    try {
+      const saved = localStorage.getItem('chat-settings');
+      if (saved && JSON.parse(saved)[settingKey] === false) return false;
+    } catch {
+      // 设置解析失败时按默认「开启」处理
+    }
+    return true;
+  };
+
+  /** 桌面端新消息提醒：系统通知（点击唤起窗口）+ 任务栏闪烁 */
+  const notifyDesktopNewMessage = (friend: any, preview: unknown) => {
+    if (!shouldDesktopNotify('desktopNotifications')) return;
+    desktop.notify({
+      title: friend?.name || friend?.nick_name || '新消息',
+      body: typeof preview === 'string' && preview ? preview : '[新消息]',
+    });
+    desktop.flashFrame();
+  };
+
   // 计算属性
   const isConnected = computed(() => connectionStatus.value === 'connected');
   const isInCall = computed(() =>
@@ -453,6 +481,8 @@ export const useChatStore = defineStore('chat', () => {
         friend.last_message = lastMessage;
         // 使用js 播放这个音频一次 SysAudioMp3
         playOnceAndDestroySys();
+        // 桌面端且窗口未聚焦时发系统通知 + 任务栏闪烁，避免错过 IM 消息
+        notifyDesktopNewMessage(friend, lastMessage);
 
         // await chatDB.updateFriendLastMessage(
         //   friend.id,
@@ -829,6 +859,18 @@ export const useChatStore = defineStore('chat', () => {
 
     logWithTime('log', '收到来电:', incomingCall.value);
 
+    // 桌面端且窗口未聚焦时发来电系统通知（尊重「通话通知」开关），点击唤起窗口接听
+    if (shouldDesktopNotify('callNotifications')) {
+      desktop.notify({
+        title: '来电提醒',
+        body:
+          incomingCall.value.callType === 'video'
+            ? '收到视频通话邀请，点击查看'
+            : '收到语音通话邀请，点击查看',
+      });
+      desktop.flashFrame();
+    }
+
     setCallTimeout(() => {
       if (callStatus.value === 'ringing' && incomingCall.value) {
         logWithTime('log', '来电超时，自动拒绝');
diff --git a/apps/web-antd/src/views/business/express/express-company/config/table.ts b/apps/web-antd/src/views/business/express/express-company/config/table.ts
index fdcd2dae..fe9f3b5f 100644
--- a/apps/web-antd/src/views/business/express/express-company/config/table.ts
+++ b/apps/web-antd/src/views/business/express/express-company/config/table.ts
@@ -56,7 +56,7 @@ export const gridOptions: VxeGridProps<RowType> = {
     // custom: true, // 自定义列
     zoom: true, // 最大化最小化
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
     custom: {
       // 自定义列-图标
diff --git a/apps/web-antd/src/views/business/express/express-company/index.vue b/apps/web-antd/src/views/business/express/express-company/index.vue
index b96967a0..88b8de32 100644
--- a/apps/web-antd/src/views/business/express/express-company/index.vue
+++ b/apps/web-antd/src/views/business/express/express-company/index.vue
@@ -68,7 +68,7 @@ const deleteApi = (row: any) => {
   <Page auto-content-height title="快递公司管理">
     <FormModal />
     <Grid>
-      <template #toolbar-buttons>
+      <template #toolbar-actions>
         <TableAction
           :actions="[
             {
diff --git a/apps/web-antd/src/views/business/order/prescription/components/PrescriptionOrderCardList.vue b/apps/web-antd/src/views/business/order/prescription/components/PrescriptionOrderCardList.vue
new file mode 100644
index 00000000..0b613ea6
--- /dev/null
+++ b/apps/web-antd/src/views/business/order/prescription/components/PrescriptionOrderCardList.vue
@@ -0,0 +1,477 @@
+<script lang="ts" setup>
+/**
+ * 处方订单卡片看板（C 端紧凑排版 + Apple 毛玻璃）：与列表视图展示同一批字段，仅排版不同
+ *
+ * 与商品订单卡片同一套设计语言：多列自适应网格、毛玻璃 14px 圆角 hairline 卡片、
+ * 状态彩点、tinted 小胶囊、人员信息内联行、底部 hairline 操作栏。
+ * 数据自取：props.formValues 变化时重置到第 1 页，触底自动加载下一页。
+ */
+import type { ActionItem } from '#/components/table-action';
+
+import { computed, nextTick, onBeforeUnmount, onMounted, ref, watch } from 'vue';
+
+import { Empty, message, Spin } from 'ant-design-vue';
+
+import { TableAction } from '#/components/table-action';
+import { pillStyle, tagColorHex } from '#/utils/tagColor';
+
+import { getPrescriptionListApi } from '../api';
+import {
+  PRESCRIPTION_IS_ONLINE_FALLBACK,
+  PRESCRIPTION_IS_ONLINE_MAP,
+  PRESCRIPTION_ORDER_TYPE_MAP,
+  PRESCRIPTION_STATUS_MAP,
+} from '../config/constants';
+
+const props = defineProps<{
+  /** 顶部统一搜索条件（含 status Tab / patient_keyword / doctor_keyword 等） */
+  formValues?: Record<string, any>;
+}>();
+
+const emit = defineEmits<{
+  /** 查看处方详情（复用父级弹窗） */
+  openDetail: [prescriptionId: number];
+  /** 处方溯源（复用父级弹窗） */
+  openSource: [prescriptionId: number];
+  /** 点诊所名打开诊所卡片 */
+  openStore: [storeId: number];
+}>();
+
+const items = ref<any[]>([]);
+const page = ref(1);
+const pageCount = ref(1);
+const loading = ref(false);
+const loadingMore = ref(false);
+/** 请求序号：只应用最后一次响应，避免快速改筛选时旧结果覆盖新列表 */
+let requestSeq = 0;
+
+const scrollEl = ref<HTMLElement | null>(null);
+const sentinelEl = ref<HTMLElement | null>(null);
+let observer: IntersectionObserver | null = null;
+
+const hasMore = computed(() => page.value < pageCount.value);
+
+/** 处方类型元数据 */
+function typeMeta(row: Record<string, any>) {
+  return PRESCRIPTION_ORDER_TYPE_MAP[Number(row?.prescription_type)] ?? null;
+}
+
+/** 审核状态元数据 */
+function statusMeta(row: Record<string, any>) {
+  return PRESCRIPTION_STATUS_MAP[Number(row?.status)] ?? null;
+}
+
+/** 处方来源元数据（未知兜底线下） */
+function isOnlineMeta(row: Record<string, any>) {
+  return PRESCRIPTION_IS_ONLINE_MAP[Number(row?.is_online)] ?? PRESCRIPTION_IS_ONLINE_FALLBACK;
+}
+
+/** 行操作：与列表 #action 槽一致（查看处方/处方溯源），通过 emit 复用父级弹窗 */
+function buildActions(row: Record<string, any>): ActionItem[] {
+  return [
+    {
+      label: '查看处方',
+      type: 'link',
+      icon: 'marketeq:eye',
+      onClick: () => emit('openDetail', Number(row.id)),
+    },
+    {
+      label: '处方溯源',
+      type: 'link',
+      icon: 'mdi:timeline-text',
+      onClick: () => emit('openSource', Number(row.id)),
+    },
+  ];
+}
+
+/**
+ * 拉取一页数据；reset 时清空列表并回到第 1 页
+ * 用 requestSeq 丢弃过期响应，防止筛选连点时旧条件结果覆盖新条件
+ */
+async function fetchPage(targetPage: number, reset = false) {
+  const seq = ++requestSeq;
+  if (reset) {
+    loading.value = true;
+  } else {
+    loadingMore.value = true;
+  }
+  try {
+    const res = await getPrescriptionListApi({
+      page: targetPage,
+      pageSize: 12,
+      ...(props.formValues || {}),
+    });
+    if (seq !== requestSeq) return;
+    items.value = reset ? (res?.items ?? []) : [...items.value, ...(res?.items ?? [])];
+    page.value = res?.page ?? targetPage;
+    pageCount.value = res?.page_count ?? 1;
+  } catch (error) {
+    if (seq !== requestSeq) return;
+    console.error(error);
+    message.error('加载处方列表失败');
+  } finally {
+    if (seq === requestSeq) {
+      loading.value = false;
+      loadingMore.value = false;
+    }
+  }
+}
+
+/** 筛选条件变化：重置回第 1 页 */
+async function reload() {
+  page.value = 1;
+  items.value = [];
+  await fetchPage(1, true);
+}
+
+/** 操作后原地刷新：按已加载条数一次性重拉，保持滚动位置 */
+async function refreshKeepPage() {
+  const loaded = Math.max(items.value.length, 12);
+  const seq = ++requestSeq;
+  loading.value = true;
+  try {
+    const res = await getPrescriptionListApi({
+      page: 1,
+      pageSize: loaded,
+      ...(props.formValues || {}),
+    });
+    if (seq !== requestSeq) return;
+    items.value = res?.items ?? [];
+    page.value = Math.ceil((res?.items?.length ?? 0) / 12) || 1;
+    pageCount.value = Math.ceil((res?.total ?? 0) / 12) || 1;
+  } catch (error) {
+    if (seq === requestSeq) console.error(error);
+  } finally {
+    if (seq === requestSeq) loading.value = false;
+  }
+}
+
+defineExpose({ reload, refreshKeepPage });
+
+async function loadMore() {
+  if (!hasMore.value || loading.value || loadingMore.value) return;
+  await fetchPage(page.value + 1, false);
+}
+
+/** 触底哨兵：滚动到底部附近自动加载下一页 */
+function setupObserver() {
+  observer?.disconnect();
+  if (!sentinelEl.value) return;
+  observer = new IntersectionObserver(
+    (entries) => {
+      if (entries.some((e) => e.isIntersecting)) {
+        void loadMore();
+      }
+    },
+    { root: scrollEl.value, rootMargin: '120px' },
+  );
+  observer.observe(sentinelEl.value);
+}
+
+watch(
+  () => props.formValues,
+  () => {
+    void reload();
+  },
+  { deep: true },
+);
+
+onMounted(async () => {
+  await reload();
+  await nextTick();
+  setupObserver();
+});
+
+onBeforeUnmount(() => {
+  observer?.disconnect();
+  observer = null;
+});
+</script>
+
+<template>
+  <div ref="scrollEl" class="rx-card-scroll">
+    <Spin :spinning="loading">
+      <div v-if="items.length" class="rx-card-grid">
+        <div v-for="row in items" :key="row.id" class="rx-card">
+          <!-- 角落径向荧光（与提现管理统计岛同款质感装饰） -->
+          <div class="rx-card__glow" />
+          <!-- 头部：诊所名（可点）+ 状态彩点 -->
+          <div class="rx-card__head">
+            <button
+              v-if="row.store?.id || row.store_id"
+              type="button"
+              class="rx-card__store"
+              @click="emit('openStore', Number(row.store?.id || row.store_id))"
+            >
+              <span class="rx-card__store-name">{{ row.store?.name || '—' }}</span>
+              <span class="rx-card__store-arrow">›</span>
+            </button>
+            <span v-else class="rx-card__store-name">{{ row.store?.name || '—' }}</span>
+            <span
+              v-if="statusMeta(row)"
+              class="rx-card__status"
+              :style="{ color: tagColorHex(statusMeta(row)!.color) }"
+            >
+              <i
+                class="rx-card__status-dot"
+                :style="{ background: tagColorHex(statusMeta(row)!.color) }"
+              ></i>
+              {{ statusMeta(row)!.label }}
+            </span>
+          </div>
+          <!-- 处方号 / 创建时间 -->
+          <div class="rx-card__sub">
+            <span class="truncate">{{ row.prescription_no || '—' }}</span>
+            <span class="rx-card__dot">·</span>
+            <span class="shrink-0">{{ row.created_at || '—' }}</span>
+          </div>
+          <!-- 语义胶囊：处方类型 / 来源 -->
+          <div class="rx-card__pills">
+            <span v-if="typeMeta(row)" class="rx-pill" :style="pillStyle(typeMeta(row)!.color)">
+              {{ typeMeta(row)!.label }}
+            </span>
+            <span class="rx-pill" :style="pillStyle(isOnlineMeta(row).color)">
+              {{ isOnlineMeta(row).label }}
+            </span>
+          </div>
+          <!-- 医生 / 就诊人：内联小字行（省高度） -->
+          <div class="rx-card__people">
+            <span class="rx-kv">
+              <i>开方医生</i>
+              <em>{{ row.doctor_info?.name || '—' }}</em>
+            </span>
+            <span class="rx-kv">
+              <i>就诊人</i>
+              <em>{{ row.user_patient?.name || '—' }}</em>
+            </span>
+          </div>
+          <!-- 拒绝原因（仅已拒绝时显示） -->
+          <div v-if="Number(row.status) === 2 && row.reject_reason" class="rx-card__reject">
+            拒绝原因：{{ row.reject_reason }}
+          </div>
+          <!-- 弹性占位：高度富余时把 footer 推到底（同行等高卡对齐），紧凑时保底 8px 间距 -->
+          <div class="rx-card__spacer"></div>
+          <!-- 底部操作：与列表 #action 槽同语义 -->
+          <div class="rx-card__footer">
+            <TableAction :actions="buildActions(row)" :drop-down-actions="[]" />
+          </div>
+        </div>
+      </div>
+      <Empty v-else-if="!loading" description="暂无处方" />
+    </Spin>
+    <div ref="sentinelEl" class="h-8"></div>
+    <div v-if="loadingMore" class="py-3 text-center text-xs text-[hsl(var(--muted-foreground))]">
+      加载中…
+    </div>
+    <div
+      v-else-if="items.length && !hasMore"
+      class="py-3 text-center text-xs text-[hsl(var(--muted-foreground))]"
+    >
+      没有更多了
+    </div>
+  </div>
+</template>
+
+<style scoped>
+.rx-card-scroll {
+  height: 100%;
+  /* 左右留 6px：卡片 hover 阴影不被容器裁出切边 */
+  padding: 4px 6px 20px;
+  overflow: auto;
+}
+
+/* 多列自适应网格：单卡最窄 340px，宽屏自动 2-4 列（C 端紧凑卡片密度）；
+   min(340px, 100%) 防止窄容器（分屏）时轨道小于容器导致横向滚动 */
+.rx-card-grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(min(340px, 100%), 1fr));
+  gap: 10px;
+}
+
+/* 玻璃质感紧凑卡片（与提现管理统计岛同款）：主色渐变玻璃底 + 12px 圆角 + 1px 边框（禁止左侧竖色条） */
+.rx-card {
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
+  background: linear-gradient(
+    135deg,
+    hsl(var(--primary) / 4%),
+    hsl(var(--card, var(--background)))
+  );
+  backdrop-filter: blur(8px);
+  border: 1px solid hsl(var(--border));
+  border-radius: 12px;
+  transition:
+    transform 0.2s ease,
+    box-shadow 0.2s ease,
+    border-color 0.2s ease;
+}
+
+.rx-card:hover {
+  border-color: hsl(var(--primary) / 40%);
+  box-shadow:
+    0 8px 20px hsl(var(--primary) / 14%),
+    0 2px 6px rgb(0 0 0 / 6%);
+  transform: translateY(-3px);
+}
+
+/* 角落径向荧光：右上角淡主色光斑，hover 增强 */
+.rx-card__glow {
+  position: absolute;
+  top: -40px;
+  right: -40px;
+  width: 110px;
+  height: 110px;
+  pointer-events: none;
+  background: radial-gradient(circle, hsl(var(--primary) / 18%) 0%, transparent 70%);
+  opacity: 0.4;
+  transition: opacity 0.2s ease;
+}
+
+.rx-card:hover .rx-card__glow {
+  opacity: 1;
+}
+
+.rx-card__head {
+  display: flex;
+  gap: 8px;
+  align-items: center;
+  padding: 10px 12px 0;
+}
+
+.rx-card__store {
+  display: inline-flex;
+  min-width: 0;
+  align-items: center;
+  gap: 2px;
+  padding: 0;
+  cursor: pointer;
+  background: none;
+  border: none;
+}
+
+.rx-card__store-name {
+  overflow: hidden;
+  font-size: 14px;
+  font-weight: 600;
+  letter-spacing: -0.2px;
+  color: hsl(var(--foreground));
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.rx-card__store:hover .rx-card__store-name {
+  color: hsl(var(--primary));
+}
+
+.rx-card__store-arrow {
+  flex-shrink: 0;
+  font-size: 14px;
+  color: hsl(var(--muted-foreground));
+}
+
+.rx-card__status {
+  display: inline-flex;
+  flex-shrink: 0;
+  gap: 4px;
+  align-items: center;
+  margin-left: auto;
+  font-size: 12px;
+  font-weight: 600;
+}
+
+.rx-card__status-dot {
+  width: 6px;
+  height: 6px;
+  border-radius: 50%;
+}
+
+.rx-card__sub {
+  display: flex;
+  gap: 4px;
+  align-items: center;
+  padding: 1px 12px 0;
+  font-size: 11px;
+  color: hsl(var(--muted-foreground));
+}
+
+.rx-card__dot {
+  flex-shrink: 0;
+}
+
+.rx-card__pills {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 4px;
+  padding: 6px 12px 0;
+}
+
+.rx-pill {
+  display: inline-flex;
+  align-items: center;
+  padding: 1px 7px;
+  font-size: 10px;
+  font-weight: 500;
+  line-height: 16px;
+  border: none;
+  border-radius: 999px;
+}
+
+/* 医生/就诊人内联行 */
+.rx-card__people {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 2px 14px;
+  padding: 7px 12px 0;
+  font-size: 12px;
+  line-height: 1.6;
+}
+
+.rx-kv {
+  display: inline-flex;
+  gap: 4px;
+  align-items: baseline;
+  min-width: 0;
+}
+
+.rx-kv > i {
+  flex-shrink: 0;
+  font-size: 11px;
+  font-style: normal;
+  color: hsl(var(--muted-foreground) / 75%);
+}
+
+.rx-kv > em {
+  overflow: hidden;
+  font-style: normal;
+  font-weight: 500;
+  color: hsl(var(--foreground));
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+/* 拒绝原因警示条（warning tinted，无左色条） */
+.rx-card__reject {
+  padding: 4px 8px;
+  margin: 6px 12px 0;
+  font-size: 11px;
+  line-height: 1.6;
+  color: hsl(var(--warning, 38 92% 50%));
+  background: hsl(var(--warning, 38 92% 50%) / 10%);
+  border-radius: 8px;
+}
+
+/* 弹性占位：吃掉剩余高度让 footer 吸底（同行等高卡操作栏对齐） */
+.rx-card__spacer {
+  flex: 1 1 auto;
+  min-height: 8px;
+}
+
+.rx-card__footer {
+  display: flex;
+  justify-content: flex-end;
+  padding: 4px 6px;
+  border-top: 1px solid hsl(var(--border) / 50%);
+}
+</style>
diff --git a/apps/web-antd/src/views/business/order/prescription/config/constants.ts b/apps/web-antd/src/views/business/order/prescription/config/constants.ts
new file mode 100644
index 00000000..b79764e7
--- /dev/null
+++ b/apps/web-antd/src/views/business/order/prescription/config/constants.ts
@@ -0,0 +1,54 @@
+/**
+ * 处方订单模块字典常量
+ * 列表 Tag 槽与卡片视图共用同一份映射，避免两处渲染语义漂移
+ */
+export interface TagMeta {
+  color: string;
+  label: string;
+}
+
+/** 处方类型映射（与列表 #status 槽第一行渲染语义一致） */
+export const PRESCRIPTION_ORDER_TYPE_MAP: Record<number, TagMeta> = {
+  1: { label: '中药', color: 'orange' },
+  2: { label: '商品【西药】', color: 'blue' },
+  3: { label: '商品【保健食品】', color: 'purple' },
+  4: { label: '已退款', color: 'green' },
+  5: { label: '产品服务包', color: 'pink' },
+  6: { label: '非药品', color: 'cyan' },
+  7: { label: '医疗器械', color: 'geekblue' },
+};
+
+/** 审核状态映射（status：0待审核 1已通过 2已拒绝 3/4无需审核） */
+export const PRESCRIPTION_STATUS_MAP: Record<number, TagMeta> = {
+  0: { label: '待审核', color: 'red' },
+  1: { label: '已通过', color: 'green' },
+  2: { label: '已拒绝', color: 'red' },
+  3: { label: '无需审核', color: 'purple' },
+  4: { label: '无需审核', color: 'green' },
+};
+
+/**
+ * 处方来源映射
+ * is_online 由挂号 type 经 RegisterTypeEnum::getIsOnlineByType 映射：
+ * 1=在线问诊 2=诊所在线复诊 3=药店在线复诊 0=线下
+ * （老页面漏了 3，药店复诊被误显示为线下，这里补全）
+ */
+export const PRESCRIPTION_IS_ONLINE_MAP: Record<number, TagMeta> = {
+  1: { label: '在线问诊', color: 'blue' },
+  2: { label: '在线复诊（诊所）', color: 'green' },
+  3: { label: '在线复诊（药店）', color: 'green' },
+};
+
+/** 来源兜底：线下就诊 */
+export const PRESCRIPTION_IS_ONLINE_FALLBACK: TagMeta = {
+  label: '线下就诊',
+  color: 'default',
+};
+
+/** 搜索下拉：处方来源选项 */
+export const PRESCRIPTION_IS_ONLINE_OPTIONS = [
+  { label: '在线问诊', value: 1 },
+  { label: '在线复诊（诊所）', value: 2 },
+  { label: '在线复诊（药店）', value: 3 },
+  { label: '线下就诊', value: 0 },
+];
diff --git a/apps/web-antd/src/views/business/order/prescription/config/search.ts b/apps/web-antd/src/views/business/order/prescription/config/search.ts
index 67af6e30..fb571765 100644
--- a/apps/web-antd/src/views/business/order/prescription/config/search.ts
+++ b/apps/web-antd/src/views/business/order/prescription/config/search.ts
@@ -3,13 +3,42 @@ import type { VbenFormProps } from '#/adapter/form';
 import dayjs from 'dayjs';
 import { getOrderPrescriptionTypeOption } from '#/views/business/order/product-order/api';
 
+import { PRESCRIPTION_IS_ONLINE_OPTIONS } from './constants';
+
 export const formOptions: VbenFormProps = {
-  // 默认展开
-  collapsed: false,
+  // 默认收起只显示第一行，点「展开」看全部筛选（占位最小化）
+  collapsed: true,
+  commonConfig: {
+    // label 默认 100px，本页筛选名最长 4 字，收窄到 70px 让控件占满格子（否则控件被挤得只剩一半宽）
+    labelWidth: 70,
+    // antd Select/RangePicker 默认按内容收缩，统一撑满格子，保证一行里各控件等宽整齐
+    componentProps: {
+      class: 'w-full',
+    },
+  },
+  // 响应式多列：抽出 grid 后 vben form 默认单列（一行一个字段），必须显式给栅格
+  wrapperClass: 'grid-cols-1 sm:grid-cols-2 md:grid-cols-3 xl:grid-cols-4 2xl:grid-cols-5',
   schema: [
     {
-      component: 'VbenInput',
+      // 放第一位：时间范围有默认值（本月至今），默认收起时必须始终可见，否则用户不知道当前查的是哪段数据
+      component: 'RangePicker',
       componentProps: {
+        format: 'YYYY-MM-DD',
+        // 提交纯日期，后端 getWhereBetween 会把结束日扩到当天 23:59:59
+        valueFormat: 'YYYY-MM-DD',
+      },
+      defaultValue: [
+        dayjs().startOf('month').format('YYYY-MM-DD'),
+        dayjs().format('YYYY-MM-DD'),
+      ],
+      fieldName: 'search_time',
+      label: '时间范围',
+    },
+    {
+      // 统一 antd 系控件：与 ApiSelect 同一套视觉（此前 VbenInput 是 shadcn 风格，高度圆角不一致）
+      component: 'Input',
+      componentProps: {
+        allowClear: true,
         placeholder: '输入订单号',
       },
       defaultValue: '',
@@ -36,18 +65,35 @@ export const formOptions: VbenFormProps = {
       label: '订单类型',
     },
     {
-      component: 'RangePicker',
+      // 就诊人姓名/手机号模糊（后端 PersonKeywordScopeService，whereHas 关联表）
+      component: 'Input',
       componentProps: {
-        format: 'YYYY-MM-DD',
-        // 提交纯日期，后端 getWhereBetween 会把结束日扩到当天 23:59:59
-        valueFormat: 'YYYY-MM-DD',
+        allowClear: true,
+        placeholder: '姓名/手机号',
       },
-      defaultValue: [
-        dayjs().startOf('month').format('YYYY-MM-DD'),
-        dayjs().format('YYYY-MM-DD'),
-      ],
-      fieldName: 'search_time',
-      label: '时间范围',
+      fieldName: 'patient_keyword',
+      label: '就诊人',
+    },
+    {
+      // 医生姓名/手机号模糊（后端 PersonKeywordScopeService）
+      component: 'Input',
+      componentProps: {
+        allowClear: true,
+        placeholder: '姓名/手机号',
+      },
+      fieldName: 'doctor_keyword',
+      label: '医生',
+    },
+    {
+      // 处方来源（后端 queryField 等值匹配；选项与 constants 映射同语义）
+      component: 'Select',
+      componentProps: {
+        allowClear: true,
+        options: PRESCRIPTION_IS_ONLINE_OPTIONS,
+        placeholder: '请选择',
+      },
+      fieldName: 'is_online',
+      label: '处方来源',
     },
   ],
   // 控制表单是否显示折叠按钮
@@ -55,9 +101,7 @@ export const formOptions: VbenFormProps = {
   submitButtonOptions: {
     content: '查询',
   },
-  // 是否在字段值改变时提交表单
-  // submitOnChange: true,
-  // submitOnChange: true,
   // 按下回车时是否提交表单
-  submitOnEnter: false,
+  // 任意输入框回车即搜索；下拉面板打开时的回车只选中选项（core 层已处理），第二次回车才搜索
+  submitOnEnter: true,
 };
diff --git a/apps/web-antd/src/views/business/order/prescription/config/table.ts b/apps/web-antd/src/views/business/order/prescription/config/table.ts
index a5b275f2..a9a2df25 100644
--- a/apps/web-antd/src/views/business/order/prescription/config/table.ts
+++ b/apps/web-antd/src/views/business/order/prescription/config/table.ts
@@ -2,12 +2,18 @@ import type { VxeGridProps } from '#/adapter/vxe-table';
 
 import { getPrescriptionListApi } from '../api';
 
+/**
+ * 处方列表行类型：后端行字段众多（含关联 store/doctor_info/user_patient），
+ * 用索引签名放宽，避免模板槽访问动态字段时 vue-tsc 报属性缺失
+ */
 interface RowType {
-  id: string;
-  name: string;
-  logo: string;
-  introduce: string;
+  id: number;
+  prescription_no: string;
+  prescription_type: number;
+  status: number;
+  is_online: number;
   created_at: string;
+  [key: string]: any;
 }
 
 export const gridOptions: VxeGridProps<RowType> = {
@@ -74,7 +80,7 @@ export const gridOptions: VxeGridProps<RowType> = {
     // custom: true, // 自定义列
     zoom: true, // 最大化最小化
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
     custom: {
       // 自定义列-图标
diff --git a/apps/web-antd/src/views/business/order/prescription/index.vue b/apps/web-antd/src/views/business/order/prescription/index.vue
index 98110538..b4ba5491 100644
--- a/apps/web-antd/src/views/business/order/prescription/index.vue
+++ b/apps/web-antd/src/views/business/order/prescription/index.vue
@@ -1,19 +1,36 @@
 <script lang="ts" setup>
+/**
+ * 处方订单管理页
+ *
+ * 支持「列表 / 卡片」双视图切换（通用 ViewModeSwitch + useViewMode 记忆偏好）：
+ * - 搜索表单从 grid 内嵌拆出为顶部统一 SearchForm，双视图共用同一份条件
+ * - 状态 Tabs（待审核/已通过/已拒绝）与搜索条件合并后同时驱动两个视图
+ * - 卡片视图展示内容与列表一致，行操作复用同一批弹窗
+ */
 import type { VxeGridListeners } from '#/adapter/vxe-table';
 
-import { ref, watch } from 'vue';
+import { computed, ref, watch } from 'vue';
 
 import { Page, useVbenModal } from '@vben/common-ui';
 
 import { Button, Tabs, Tag } from 'ant-design-vue';
 
+import { useVbenForm } from '#/adapter/form';
 import { useVbenVxeGrid } from '#/adapter/vxe-table';
 import { TableAction } from '#/components/table-action';
+import { useViewMode, ViewModeSwitch } from '#/components/view-mode-switch';
 import StoreCardModal from '#/components/store-card/StoreCardModal.vue';
 import PrescriptionDetail from '#/views/doctor/doctor-reception/components/PrescriptionDetail.vue';
 
 import { getPrescriptionListApi } from './api';
+import PrescriptionOrderCardList from './components/PrescriptionOrderCardList.vue';
 import PrescriptionSource from './components/source.vue';
+import {
+  PRESCRIPTION_IS_ONLINE_FALLBACK,
+  PRESCRIPTION_IS_ONLINE_MAP,
+  PRESCRIPTION_ORDER_TYPE_MAP,
+  PRESCRIPTION_STATUS_MAP,
+} from './config/constants';
 import { formOptions } from './config/search';
 import { gridOptions as baseGridOptions } from './config/table';
 
@@ -21,6 +38,9 @@ const hasTopTableDropDownActions = ref(false);
 /** 审核状态 Tab：0待审核 / 1已通过 / 2已拒绝 */
 const statusTab = ref('0');
 
+/** 列表/卡片双视图：通用 useViewMode 自带 localStorage 记忆 */
+const viewMode = useViewMode('prescription-order-view-mode');
+
 const gridEvents: VxeGridListeners<any> = {
   checkboxChange() {
     const records = gridApi.grid.getCheckboxRecords();
@@ -32,6 +52,51 @@ const gridEvents: VxeGridListeners<any> = {
   },
 };
 
+/**
+ * 从 schema 提取 defaultValue 作为首屏搜索条件
+ * 双视图首屏都要带默认时间范围，保证查询口径与表单显示一致
+ */
+function collectDefaultSearchValues(): Record<string, any> {
+  const values: Record<string, any> = {};
+  for (const item of formOptions.schema ?? []) {
+    if (item.fieldName && item.defaultValue !== undefined) {
+      values[item.fieldName] = item.defaultValue;
+    }
+  }
+  return values;
+}
+
+/** 列表与卡片共用的搜索条件（不含 status Tab，Tab 单独合并） */
+const searchValues = ref<Record<string, any>>(collectDefaultSearchValues());
+
+/** 卡片视图最终条件：搜索条件 + 状态 Tab（computed 保证 Tab 切换时卡片自动重拉） */
+const cardFormValues = computed(() => ({
+  ...searchValues.value,
+  status: Number(statusTab.value),
+}));
+
+/**
+ * 顶部统一搜索表单（从 grid 内嵌表单抽出，双视图共用）
+ * 列表模式提交后 reload 回第 1 页；卡片模式由 cardFormValues watch 自动拉数
+ */
+const [SearchForm, searchFormApi] = useVbenForm({
+  ...formOptions,
+  handleSubmit: async (values) => {
+    searchValues.value = { ...(values || {}) };
+    if (viewMode.value === 'list') {
+      gridApi.reload();
+    }
+  },
+  handleReset: async () => {
+    // 自定义 handleReset 会接管默认行为，必须手动还原控件到 defaultValue（reset 为新 API，resetForm 已弃用）
+    await searchFormApi.reset();
+    searchValues.value = collectDefaultSearchValues();
+    if (viewMode.value === 'list') {
+      gridApi.reload();
+    }
+  },
+});
+
 const [StoreCardModalComp, StoreCardModalApi] = useVbenModal({
   connectedComponent: StoreCardModal,
 });
@@ -43,17 +108,19 @@ function openStoreCard(storeId?: number) {
 }
 
 const [Grid, gridApi] = useVbenVxeGrid({
-  formOptions,
   gridOptions: {
     ...baseGridOptions,
+    // 搜索已抽出为顶部统一表单，关闭 grid 自带的表单开关按钮
+    toolbarConfig: { ...baseGridOptions.toolbarConfig, search: false },
     proxyConfig: {
       ajax: {
-        query: async ({ page }, formValues) => {
+        /** 始终合并顶部统一搜索条件 + 状态 Tab */
+        query: async ({ page }: { page: { currentPage: number; pageSize: number } }) => {
           return await getPrescriptionListApi({
             page: page.currentPage,
             pageSize: page.pageSize,
             status: Number(statusTab.value),
-            ...formValues,
+            ...searchValues.value,
           });
         },
       },
@@ -62,11 +129,21 @@ const [Grid, gridApi] = useVbenVxeGrid({
   gridEvents,
 });
 
+// Tab 切换：列表模式重查（卡片模式由 cardFormValues computed 触发 CardList watch）
 watch(statusTab, () => {
-  gridApi.query();
+  if (viewMode.value === 'list') {
+    gridApi.query();
+  }
 });
 
-function onStatusTabChange(key: string | number) {
+// 记忆持久化由 useViewMode 内部完成；切回列表时 grid 被 v-if 卸载过需主动重查
+watch(viewMode, (mode, prev) => {
+  if (mode === 'list' && prev === 'card') {
+    gridApi.query();
+  }
+});
+
+function onStatusTabChange(key: number | string) {
   statusTab.value = String(key);
 }
 
@@ -87,6 +164,17 @@ const openPrescriptionSourceModal = (id: number) => {
   PrescriptionSourceModalApi.setData({ id });
   PrescriptionSourceModalApi.open();
 };
+
+/** 列表槽用元数据取值 helper：v-if 双重索引无法类型收窄，统一在这里兜底 */
+function rowTypeMeta(row: Record<string, any>) {
+  return PRESCRIPTION_ORDER_TYPE_MAP[Number(row?.prescription_type)] ?? null;
+}
+function rowStatusMeta(row: Record<string, any>) {
+  return PRESCRIPTION_STATUS_MAP[Number(row?.status)] ?? null;
+}
+function rowIsOnlineMeta(row: Record<string, any>) {
+  return PRESCRIPTION_IS_ONLINE_MAP[Number(row?.is_online)] ?? PRESCRIPTION_IS_ONLINE_FALLBACK;
+}
 </script>
 
 <template>
@@ -101,8 +189,16 @@ const openPrescriptionSourceModal = (id: number) => {
         <Tabs.TabPane key="2" tab="已拒绝" />
       </Tabs>
     </div>
-    <Grid>
-      <template #toolbar-buttons>
+    <!-- 顶部统一搜索（双视图共用，替代原 grid 内嵌表单） -->
+    <div class="mb-3 rounded-lg border border-[hsl(var(--border))] bg-[hsl(var(--card,var(--background)))] p-3">
+      <SearchForm />
+    </div>
+    <!-- 视图切换：列表 / 卡片看板 -->
+    <div class="mb-3 flex items-center justify-between gap-3">
+      <ViewModeSwitch v-model="viewMode" />
+    </div>
+    <Grid v-if="viewMode === 'list'">
+      <template #toolbar-actions>
         <TableAction :actions="[]" :drop-down-actions="[]">
           <template #more>
             <Button style="margin-left: 16px">
@@ -124,41 +220,25 @@ const openPrescriptionSourceModal = (id: number) => {
         <span v-else>{{ row.store?.name || '—' }}</span>
       </template>
       <template #status="{ row }">
+        <!-- 处方类型与审核状态渲染统一走 constants 映射，与卡片视图同语义 -->
         <div>
-          <Tag v-if="row.prescription_type === 1" color="orange">中药</Tag>
-          <Tag v-else-if="row.prescription_type === 2" color="blue">
-            商品【西药】
-          </Tag>
-          <Tag v-else-if="row.prescription_type === 3" color="purple">
-            商品【保健食品】
-          </Tag>
-          <Tag v-else-if="row.prescription_type === 4" color="green">
-            已退款
-          </Tag>
-          <Tag v-else-if="row.prescription_type === 5" color="pink">
-            产品服务包
-          </Tag>
-          <Tag v-else-if="row.prescription_type === 6" color="cyan">
-            非药品
-          </Tag>
-          <Tag v-else-if="row.prescription_type === 7" color="geekblue">
-            医疗器械
+          <Tag v-if="rowTypeMeta(row)" :color="rowTypeMeta(row)!.color">
+            {{ rowTypeMeta(row)!.label }}
           </Tag>
         </div>
         <div class="mt-3">
-          <Tag v-if="row.status === 0" color="red">待审核</Tag>
-          <Tag v-else-if="row.status === 1" color="green">已通过</Tag>
-          <Tag v-else-if="row.status === 2" color="red"
-            >已拒绝：{{ row.reject_reason }}</Tag
-          >
-          <Tag v-else-if="row.status === 3" color="purple">无需审核</Tag>
-          <Tag v-else-if="row.status === 4" color="green">无需审核</Tag>
+          <Tag v-if="rowStatusMeta(row)" :color="rowStatusMeta(row)!.color">
+            {{ rowStatusMeta(row)!.label
+            }}<template v-if="row.status === 2 && row.reject_reason">
+              ：{{ row.reject_reason }}</template
+            >
+          </Tag>
         </div>
       </template>
       <template #is-online="{ row }">
-        <Tag v-if="row.is_online == 1" color="blue">在线问诊</Tag>
-        <Tag v-else-if="row.is_online == 2" color="green">在线复诊</Tag>
-        <Tag v-else color="default">线下就诊</Tag>
+        <Tag :color="rowIsOnlineMeta(row).color">
+          {{ rowIsOnlineMeta(row).label }}
+        </Tag>
       </template>
       <template #toolbar-tools></template>
       <template #action="{ row }">
@@ -173,7 +253,7 @@ const openPrescriptionSourceModal = (id: number) => {
             {
               label: '处方溯源',
               type: 'link',
-              icon: 'marketeq:eye',
+              icon: 'mdi:timeline-text',
               onClick: openPrescriptionSourceModal.bind(null, row.id),
             },
           ]"
@@ -181,11 +261,21 @@ const openPrescriptionSourceModal = (id: number) => {
         />
       </template>
     </Grid>
+    <!-- 卡片看板视图：展示内容与列表一致，弹窗复用父级（纯查看操作，无需操作后刷新句柄） -->
+    <div v-else class="rx-card-wrap">
+      <PrescriptionOrderCardList
+        :form-values="cardFormValues"
+        @open-detail="openPrescriptionDetail"
+        @open-source="openPrescriptionSourceModal"
+        @open-store="openStoreCard"
+      />
+    </div>
   </Page>
 </template>
 <style scoped lang="scss">
-.custom-list {
-  list-style-type: none;
-  padding-left: 0;
+/* 卡片看板容器：撑满剩余高度，内部滚动（Tabs + 收起态搜索一行 + 切换行约 220px，min-height 兜底） */
+.rx-card-wrap {
+  height: calc(100% - 220px);
+  min-height: 420px;
 }
 </style>
diff --git a/apps/web-antd/src/views/business/order/product-order/api/index.ts b/apps/web-antd/src/views/business/order/product-order/api/index.ts
index 159f7852..1b65dd3b 100644
--- a/apps/web-antd/src/views/business/order/product-order/api/index.ts
+++ b/apps/web-antd/src/views/business/order/product-order/api/index.ts
@@ -138,6 +138,10 @@ export interface OrderExportDataParams {
   delivery_method?: number;
   prescription_type?: number;
   drug_keyword?: string;
+  /** 就诊人姓名/手机号模糊（后端 whereHas userPatient） */
+  patient_keyword?: string;
+  /** 医生姓名/手机号模糊（后端 whereHas doctorInfo） */
+  doctor_keyword?: string;
 }
 
 export interface OrderExportDataResult {
diff --git a/apps/web-antd/src/views/business/order/product-order/components/ProductOrderCardList.vue b/apps/web-antd/src/views/business/order/product-order/components/ProductOrderCardList.vue
new file mode 100644
index 00000000..94b79751
--- /dev/null
+++ b/apps/web-antd/src/views/business/order/product-order/components/ProductOrderCardList.vue
@@ -0,0 +1,954 @@
+<script lang="ts" setup>
+/**
+ * 商品订单卡片看板（C 端紧凑排版 + Apple 毛玻璃）：与列表视图展示同一批字段，仅排版不同
+ *
+ * 排版语言参考 C 端 App 订单列表（外卖/电商）：
+ * - 多列自适应网格（minmax 自动 1-3 列），单卡窄而紧凑，减少纵向占用
+ * - 卡片：毛玻璃 + 14px 圆角 + hairline 细边框；状态用「彩点 + 彩字」
+ * - 商品行右侧直接放合计金额（C 端惯例），人员/收货信息压成内联小字行
+ * - 语义标签：tinted 小胶囊（同色低透明度底，无边框）
+ *
+ * 数据自取：props.formValues 变化时重置到第 1 页，触底自动加载下一页。
+ * 行操作复用父级 buildRowActions（与列表 #action 槽同一份定义）。
+ */
+import { computed, nextTick, onBeforeUnmount, onMounted, ref, watch } from 'vue';
+
+import { Button, Empty, Image, message, Spin, Switch } from 'ant-design-vue';
+
+import { CardActions } from '#/components/table-action';
+import SensitiveText from '#/components/sensitive-text/SensitiveText.vue';
+import { pillStyle, tagColorHex } from '#/utils/tagColor';
+
+import { getOrderList } from '../api';
+import {
+  IS_ONLINE_FALLBACK,
+  IS_ONLINE_MAP,
+  ORDER_STATUS_MAP,
+  ORDER_TYPE_MAP,
+  PRESCRIPTION_TYPE_MAP,
+} from '../config/constants';
+
+const props = defineProps<{
+  /** 顶部统一搜索条件（含 search_time / patient_keyword / doctor_keyword 等） */
+  formValues?: Record<string, any>;
+  /** 父级构造行操作（与列表 #action 槽同一份定义） */
+  buildRowActions: (row: Record<string, any>) => {
+    actions: any[];
+    dropDownActions: any[];
+  };
+  /** 金额是否可点调价（与列表 price-info 槽一致） */
+  canPercentAdjust?: (row: Record<string, any>) => boolean;
+}>();
+
+const emit = defineEmits<{
+  openStore: [storeId: number];
+  openDoctor: [row: Record<string, any>];
+  openUserPatients: [payload: { userId: number; nickname: string; avatarurl: string }];
+  openPatient: [payload: { upId: number; patientName: string }];
+  openWarehouse: [row: Record<string, any>, wh: { id: number; name: string }];
+  toggleFreeShipping: [row: Record<string, any>, checked: boolean];
+  percentAdjust: [row: Record<string, any>];
+  goRegister: [row: Record<string, any>];
+}>();
+
+const items = ref<any[]>([]);
+const page = ref(1);
+const pageCount = ref(1);
+const loading = ref(false);
+const loadingMore = ref(false);
+/** 请求序号：只应用最后一次响应，避免快速改筛选时旧结果覆盖新列表 */
+let requestSeq = 0;
+/** 已手动展开商品明细的订单 id 集合 */
+const expandedIds = ref<Set<number>>(new Set());
+
+const scrollEl = ref<HTMLElement | null>(null);
+const sentinelEl = ref<HTMLElement | null>(null);
+let observer: IntersectionObserver | null = null;
+
+const hasMore = computed(() => page.value < pageCount.value);
+
+/** 处方类型元数据（全量 0-7，含特色方），无处方类型时返回 null */
+function prescriptionTypeMeta(row: Record<string, any>) {
+  const type = Number(row?.prescription_type);
+  return Number.isFinite(type) ? (PRESCRIPTION_TYPE_MAP[type] ?? null) : null;
+}
+
+/** 状态元数据 */
+function statusMeta(row: Record<string, any>) {
+  return ORDER_STATUS_MAP[Number(row?.status)] ?? null;
+}
+
+/** 就诊来源元数据（0/未知兜底线下） */
+function isOnlineMeta(row: Record<string, any>) {
+  return IS_ONLINE_MAP[Number(row?.is_online)] ?? IS_ONLINE_FALLBACK;
+}
+
+/** 非处方订单（order_type=2/3）显示订单类型 */
+function orderTypeMeta(row: Record<string, any>) {
+  return ORDER_TYPE_MAP[Number(row?.order_type)] ?? null;
+}
+
+/** 卡片主类型胶囊：与列表 delivery-method 槽同口径——仅预约购药（order_type=2）显示订单类型，其余显示处方类型 */
+function headTypeMeta(row: Record<string, any>) {
+  if (Number(row?.order_type) === 2) {
+    return orderTypeMeta(row);
+  }
+  return prescriptionTypeMeta(row);
+}
+
+/** 首个商品（商品区首图/首名展示用） */
+function firstItem(row: Record<string, any>) {
+  return Array.isArray(row.product_order_items) ? row.product_order_items[0] : null;
+}
+
+/** 商品总件数（中药按剂量折算与明细 chips 同口径） */
+function totalPieces(row: Record<string, any>) {
+  const list = Array.isArray(row.product_order_items) ? row.product_order_items : [];
+  return list.reduce((sum: number, item: any) => {
+    const factor =
+      Number(row.prescription_type) === 1 && Number(item.dosage) > 0
+        ? Number(item.dosage)
+        : 1;
+    return sum + Number(item.number || 0) * factor;
+  }, 0);
+}
+
+/** 收货地址拼装（与列表 formatExpressAddress 同口径） */
+function expressAddress(row: Record<string, any>) {
+  if (Number(row.delivery_method) === 1) {
+    return row.store?.position || row.store?.name || '到店自提';
+  }
+  const region = row.address?.region || row.express_region || '';
+  const detail = row.address?.detail_address || row.express_address || '';
+  return [region, detail].filter(Boolean).join(' ') || '—';
+}
+
+/** 挂号金额（与列表 formatRegisterAmount 同口径） */
+function registerAmount(row: Record<string, any>) {
+  if (row.register_id == null || row.register_id === '') return '—';
+  const n = Number(row.register_price);
+  return Number.isFinite(n) ? `¥${n.toFixed(2)}` : '—';
+}
+
+/* ---- 人员内联行解析（与列表 OrderUserInfoCell 同口径，卡片用紧凑内联行省高度） ---- */
+
+/** 下单微信用户 ID */
+function resolveUserId(row: Record<string, any>) {
+  return Number(row.user?.id || row.user_id || 0);
+}
+
+/** 就诊人 ID */
+function resolveUpId(row: Record<string, any>) {
+  return Number(row.up_id || row.user_patient?.id || row.userPatient?.id || 0);
+}
+
+/** 就诊人姓名（多来源兜底） */
+function patientNameOf(row: Record<string, any>) {
+  return row.user_patient?.name || row.userPatient?.name || row.patient || '—';
+}
+
+/** 是否有代付信息（有付款人 ID 或至少有付款人类型） */
+function hasPayUser(row: Record<string, any>) {
+  const payUserId = Number(row.pay_user_id || row.pay_user?.id || 0);
+  return payUserId > 0 || Number(row.pay_user_type || 0) > 0;
+}
+
+/** 代付展示文案：[类型]名字（医生代付回落医生名，就诊人代付回落就诊人名） */
+function payUserText(row: Record<string, any>) {
+  const t = Number(row.pay_user_type || 0);
+  const typeLabel = t === 2 ? '医生' : t === 3 ? '就诊人' : t === 1 ? '用户' : '—';
+  const nick = String(row.pay_user?.nickname || '').trim();
+  let name = nick;
+  if (!name && t === 2 && row.doctor?.name) name = String(row.doctor.name);
+  if (!name && t === 3) name = String(patientNameOf(row));
+  return `[${typeLabel}] ${name || '—'}`;
+}
+
+/** 点击就诊人：打开详情弹窗 */
+function onPatientClick(row: Record<string, any>) {
+  const upId = resolveUpId(row);
+  if (!upId) return;
+  emit('openPatient', { upId, patientName: String(patientNameOf(row)) });
+}
+
+/** 点击下单用户：打开该用户就诊人列表 */
+function onUserClick(row: Record<string, any>) {
+  const userId = resolveUserId(row);
+  if (!userId) return;
+  emit('openUserPatients', {
+    userId,
+    nickname: String(row.user?.nickname || ''),
+    avatarurl: String(row.user?.avatarurl || ''),
+  });
+}
+
+/** 切换某订单的商品明细展开态 */
+function toggleExpand(row: Record<string, any>) {
+  const id = Number(row.id);
+  const next = new Set(expandedIds.value);
+  if (next.has(id)) {
+    next.delete(id);
+  } else {
+    next.add(id);
+  }
+  expandedIds.value = next;
+}
+
+/**
+ * 拉取一页数据；reset 时清空列表并回到第 1 页
+ * 用 requestSeq 丢弃过期响应，防止筛选连点时旧条件结果覆盖新条件
+ */
+async function fetchPage(targetPage: number, reset = false) {
+  const seq = ++requestSeq;
+  if (reset) {
+    loading.value = true;
+  } else {
+    loadingMore.value = true;
+  }
+  try {
+    const res = await getOrderList({
+      page: targetPage,
+      pageSize: 12,
+      ...(props.formValues || {}),
+    });
+    if (seq !== requestSeq) return;
+    items.value = reset ? (res?.items ?? []) : [...items.value, ...(res?.items ?? [])];
+    page.value = res?.page ?? targetPage;
+    pageCount.value = res?.page_count ?? 1;
+  } catch (error) {
+    if (seq !== requestSeq) return;
+    console.error(error);
+    message.error('加载订单列表失败');
+  } finally {
+    if (seq === requestSeq) {
+      loading.value = false;
+      loadingMore.value = false;
+    }
+  }
+}
+
+/** 筛选条件变化：重置回第 1 页 */
+async function reload() {
+  page.value = 1;
+  items.value = [];
+  await fetchPage(1, true);
+}
+
+/**
+ * 操作成功后的原地刷新：保留当前页码，避免退款/发货后跳回第 1 页
+ * 卡片是累积加载的，这里折衷为按已加载条数一次性重拉（页码 1、pageSize=已加载数）
+ */
+async function refreshKeepPage() {
+  const loaded = Math.max(items.value.length, 12);
+  const seq = ++requestSeq;
+  loading.value = true;
+  try {
+    const res = await getOrderList({
+      page: 1,
+      pageSize: loaded,
+      ...(props.formValues || {}),
+    });
+    if (seq !== requestSeq) return;
+    items.value = res?.items ?? [];
+    // 折算页数：保持触底加载能继续接在后面
+    page.value = Math.ceil((res?.items?.length ?? 0) / 12) || 1;
+    pageCount.value = Math.ceil((res?.total ?? 0) / 12) || 1;
+  } catch (error) {
+    if (seq === requestSeq) console.error(error);
+  } finally {
+    if (seq === requestSeq) loading.value = false;
+  }
+}
+
+defineExpose({ reload, refreshKeepPage });
+
+async function loadMore() {
+  if (!hasMore.value || loading.value || loadingMore.value) return;
+  await fetchPage(page.value + 1, false);
+}
+
+/** 触底哨兵：滚动到底部附近自动加载下一页 */
+function setupObserver() {
+  observer?.disconnect();
+  if (!sentinelEl.value) return;
+  observer = new IntersectionObserver(
+    (entries) => {
+      if (entries.some((e) => e.isIntersecting)) {
+        void loadMore();
+      }
+    },
+    { root: scrollEl.value, rootMargin: '120px' },
+  );
+  observer.observe(sentinelEl.value);
+}
+
+watch(
+  () => props.formValues,
+  () => {
+    void reload();
+  },
+  { deep: true },
+);
+
+onMounted(async () => {
+  await reload();
+  await nextTick();
+  setupObserver();
+});
+
+onBeforeUnmount(() => {
+  observer?.disconnect();
+  observer = null;
+});
+</script>
+
+<template>
+  <div ref="scrollEl" class="po-card-scroll">
+    <Spin :spinning="loading">
+      <div v-if="items.length" class="po-card-grid">
+        <div v-for="row in items" :key="row.id" class="po-card">
+          <!-- 角落径向荧光（与提现管理统计岛同款质感装饰） -->
+          <div class="po-card__glow" />
+          <!-- 行1 头部：诊所名（可点）+ 状态彩点 -->
+          <div class="po-card__head">
+            <button
+              v-if="row.store?.id"
+              type="button"
+              class="po-card__store"
+              @click="emit('openStore', row.store.id)"
+            >
+              <span class="po-card__store-name">{{ row.store?.name || '—' }}</span>
+              <span class="po-card__store-arrow">›</span>
+            </button>
+            <span v-else class="po-card__store-name">{{ row.store?.name || '—' }}</span>
+            <span
+              v-if="statusMeta(row)"
+              class="po-card__status"
+              :style="{ color: tagColorHex(statusMeta(row)!.color) }"
+            >
+              <i
+                class="po-card__status-dot"
+                :style="{ background: tagColorHex(statusMeta(row)!.color) }"
+              ></i>
+              {{ statusMeta(row)!.label }}
+            </span>
+          </div>
+          <!-- 行2 单号/时间 + 语义胶囊同一行（紧凑：小灰字在左，胶囊接排换行） -->
+          <div class="po-card__meta">
+            <span class="truncate">{{ row.order_no }}</span>
+            <span class="po-card__dot">·</span>
+            <span class="shrink-0">{{ row.created_at || '—' }}</span>
+          </div>
+          <div class="po-card__pills">
+            <span v-if="headTypeMeta(row)" class="po-pill" :style="pillStyle(headTypeMeta(row)!.color)">
+              {{ headTypeMeta(row)!.label }}
+            </span>
+            <span class="po-pill" :style="pillStyle(isOnlineMeta(row).color)">
+              {{ isOnlineMeta(row).label }}
+            </span>
+            <span
+              v-if="row.is_proxy_pay || Number(row.pay_user_type) === 2"
+              class="po-pill"
+              :style="pillStyle('magenta')"
+            >
+              代支付
+            </span>
+            <span v-if="row.delivery_method === 1" class="po-pill" :style="pillStyle('blue')">
+              到店自提
+            </span>
+            <span v-else-if="row.delivery_method === 0" class="po-pill" :style="pillStyle('green')">
+              上门快递
+            </span>
+            <span class="po-pill" :style="pillStyle(row.is_sync_erp === 1 ? 'green' : 'red')">
+              {{ row.is_sync_erp === 1 ? 'Erp已同步' : 'Erp未同步' }}
+            </span>
+            <template
+              v-if="Array.isArray(row.delivery_warehouses) && row.delivery_warehouses.length"
+            >
+              <button
+                v-for="wh in row.delivery_warehouses"
+                :key="wh.id"
+                type="button"
+                class="po-pill po-pill--action"
+                :style="pillStyle('processing')"
+                @click="emit('openWarehouse', row, wh)"
+              >
+                {{ wh.name }} ›
+              </button>
+            </template>
+          </div>
+          <!-- 行3 商品行（C 端惯例：左图文右合计金额），点击展开全部明细 -->
+          <div class="po-card__goods" role="button" @click="toggleExpand(row)">
+            <div v-if="firstItem(row)" class="po-card__goods-thumb">
+              <Image
+                v-if="firstItem(row)?.drug_image"
+                :src="firstItem(row).drug_image"
+                :preview="false"
+                width="100%"
+                height="100%"
+              />
+              <span v-else class="po-card__goods-placeholder">
+                {{ prescriptionTypeMeta(row)?.label?.slice(0, 2) || '商品' }}
+              </span>
+            </div>
+            <div class="min-w-0 flex-1">
+              <div class="po-card__goods-name">
+                {{
+                  firstItem(row)
+                    ? firstItem(row).display_drug_name || firstItem(row).drug_name
+                    : '无商品明细'
+                }}
+              </div>
+              <div v-if="firstItem(row)" class="po-card__goods-count">
+                {{ row.product_order_items.length }} 种 · 共 {{ totalPieces(row) }} 件
+                <span class="po-card__goods-toggle">
+                  {{ expandedIds.has(Number(row.id)) ? '收起' : '展开' }}
+                  <i :class="expandedIds.has(Number(row.id)) ? 'up' : ''">›</i>
+                </span>
+              </div>
+            </div>
+            <div class="po-card__amount" @click.stop>
+              <span
+                v-if="props.canPercentAdjust?.(row)"
+                class="po-card__amount-value po-card__amount-value--link"
+                role="button"
+                @click="emit('percentAdjust', row)"
+              >
+                <i>¥</i>{{ row.total_pay_price ?? '0.00' }}
+              </span>
+              <span v-else class="po-card__amount-value">
+                <i>¥</i>{{ row.total_pay_price ?? '0.00' }}
+              </span>
+            </div>
+          </div>
+          <!-- 展开后的全部商品 chips -->
+          <div
+            v-if="expandedIds.has(Number(row.id)) && Array.isArray(row.product_order_items) && row.product_order_items.length"
+            class="po-card__chips"
+          >
+            <span
+              v-for="(item, idx) in row.product_order_items"
+              :key="idx"
+              class="po-card__drug-chip"
+            >
+              {{ item.display_drug_name || item.drug_name }}
+              ×{{
+                Number(row.prescription_type) === 1
+                  ? item.number * (item.dosage > 0 ? item.dosage : 1)
+                  : item.number
+              }}
+            </span>
+          </div>
+          <!-- 行4 人员内联行：用户/医生/就诊人/代付（与列表 OrderUserInfoCell 同口径、可点） -->
+          <div class="po-card__people">
+            <span class="po-kv">
+              <i>用户</i>
+              <button
+                v-if="resolveUserId(row)"
+                type="button"
+                class="po-link"
+                @click="onUserClick(row)"
+              >
+                {{ row.user?.nickname || '—' }}
+              </button>
+              <em v-else>{{ row.user?.nickname || '—' }}</em>
+            </span>
+            <span class="po-kv">
+              <i>医生</i>
+              <button
+                v-if="row.doctor?.name"
+                type="button"
+                class="po-link"
+                @click="emit('openDoctor', row)"
+              >
+                {{ row.doctor.name }}
+              </button>
+              <em v-else>—</em>
+            </span>
+            <span class="po-kv">
+              <i>就诊人</i>
+              <button
+                v-if="resolveUpId(row)"
+                type="button"
+                class="po-link"
+                @click="onPatientClick(row)"
+              >
+                {{ patientNameOf(row) }}
+              </button>
+              <em v-else>{{ patientNameOf(row) }}</em>
+            </span>
+            <span v-if="hasPayUser(row)" class="po-kv">
+              <i>代付</i>
+              <em>{{ payUserText(row) }}</em>
+            </span>
+          </div>
+          <!-- 行5 收货内联行：收件人 + 电话 + 地址一行截断 -->
+          <div class="po-card__express">
+            <i>收货</i>
+            <span class="truncate">
+              {{ row.address?.name || row.express_name || row.patient || '—' }}
+              <SensitiveText
+                :record="row.address"
+                field="mobile"
+                :fallback="{ record: row, field: 'patient_mobile' }"
+              />
+              · {{ expressAddress(row) }}
+            </span>
+          </div>
+          <!-- 行6 推广员内联行（有则显示） -->
+          <div v-if="row.salesperson?.id" class="po-card__express po-card__salesperson">
+            <i>推广</i>
+            <Image
+              :src="row.salesperson.avatar || '/img/user-default-avatar.png'"
+              :width="16"
+              :height="16"
+              :preview="false"
+              class="shrink-0 rounded-full object-cover"
+            />
+            <span class="truncate">{{ row.salesperson.nick_name || '—' }}</span>
+            <span class="po-card__salesperson-status">
+              {{ row.salesperson.commission_status_text || '—' }}
+            </span>
+            <span class="shrink-0 font-medium text-orange-500">
+              ¥{{ row.salesperson.commission_amount || '0.00' }}
+            </span>
+          </div>
+          <!-- 弹性占位：高度富余时把 footer 推到底（同行等高卡对齐），紧凑时保底 8px 间距 -->
+          <div class="po-card__spacer"></div>
+          <!-- 行7 footer：左分项金额/包邮开关，右操作按钮 -->
+          <div class="po-card__footer">
+            <div class="po-card__amount-parts">
+              <span>
+                药品
+                <Button
+                  v-if="props.canPercentAdjust?.(row)"
+                  class="!h-auto !px-0 !py-0 !text-xs"
+                  type="link"
+                  @click="emit('percentAdjust', row)"
+                >
+                  ¥{{ row.items_price ?? '0.00' }}
+                </Button>
+                <template v-else>¥{{ row.items_price ?? '0.00' }}</template>
+              </span>
+              <span>
+                挂号
+                <Button
+                  v-if="row.register_order_no"
+                  class="!h-auto !px-0 !py-0 !text-xs"
+                  type="link"
+                  @click="emit('goRegister', row)"
+                >
+                  {{ registerAmount(row) }}
+                </Button>
+                <template v-else>{{ registerAmount(row) }}</template>
+              </span>
+              <Switch
+                :checked="row.is_free_shipping === 1"
+                checked-children="包邮"
+                un-checked-children="不包邮"
+                size="small"
+                @change="(checked: any) => emit('toggleFreeShipping', row, Boolean(checked))"
+              />
+            </div>
+            <!-- 卡片交互与列表解耦：只露出「详情」主操作，其余收进「···」菜单，避免按钮堆叠 -->
+            <CardActions
+              :actions="props.buildRowActions(row).actions"
+              :drop-down-actions="props.buildRowActions(row).dropDownActions"
+            />
+          </div>
+        </div>
+      </div>
+      <Empty v-else-if="!loading" description="暂无订单" />
+    </Spin>
+    <div ref="sentinelEl" class="h-8"></div>
+    <div v-if="loadingMore" class="py-3 text-center text-xs text-[hsl(var(--muted-foreground))]">
+      加载中…
+    </div>
+    <div
+      v-else-if="items.length && !hasMore"
+      class="py-3 text-center text-xs text-[hsl(var(--muted-foreground))]"
+    >
+      没有更多了
+    </div>
+  </div>
+</template>
+
+<style scoped>
+.po-card-scroll {
+  height: 100%;
+  /* 左右留 6px：卡片 hover 阴影不被容器裁出切边 */
+  padding: 4px 6px 20px;
+  overflow: auto;
+}
+
+/* 多列自适应网格：单卡最窄 400px，宽屏自动 2-3 列（C 端紧凑卡片密度）；
+   min(400px, 100%) 防止窄容器（分屏）时轨道小于容器导致横向滚动 */
+.po-card-grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(min(400px, 100%), 1fr));
+  gap: 10px;
+}
+
+/* 玻璃质感紧凑卡片（与提现管理统计岛同款）：主色渐变玻璃底 + 12px 圆角 + 1px 边框 */
+.po-card {
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
+  background: linear-gradient(
+    135deg,
+    hsl(var(--primary) / 4%),
+    hsl(var(--card, var(--background)))
+  );
+  backdrop-filter: blur(8px);
+  border: 1px solid hsl(var(--border));
+  border-radius: 12px;
+  transition:
+    transform 0.2s ease,
+    box-shadow 0.2s ease,
+    border-color 0.2s ease;
+}
+
+.po-card:hover {
+  border-color: hsl(var(--primary) / 40%);
+  box-shadow:
+    0 8px 20px hsl(var(--primary) / 14%),
+    0 2px 6px rgb(0 0 0 / 6%);
+  transform: translateY(-3px);
+}
+
+/* 角落径向荧光：右上角淡主色光斑，hover 增强 */
+.po-card__glow {
+  position: absolute;
+  top: -40px;
+  right: -40px;
+  width: 110px;
+  height: 110px;
+  pointer-events: none;
+  background: radial-gradient(circle, hsl(var(--primary) / 18%) 0%, transparent 70%);
+  opacity: 0.4;
+  transition: opacity 0.2s ease;
+}
+
+.po-card:hover .po-card__glow {
+  opacity: 1;
+}
+
+/* 行1 头部：店铺 + 状态彩点 */
+.po-card__head {
+  display: flex;
+  gap: 8px;
+  align-items: center;
+  padding: 10px 12px 0;
+}
+
+.po-card__store {
+  display: inline-flex;
+  min-width: 0;
+  align-items: center;
+  gap: 2px;
+  padding: 0;
+  cursor: pointer;
+  background: none;
+  border: none;
+}
+
+.po-card__store-name {
+  overflow: hidden;
+  font-size: 14px;
+  font-weight: 600;
+  letter-spacing: -0.2px;
+  color: hsl(var(--foreground));
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.po-card__store:hover .po-card__store-name {
+  color: hsl(var(--primary));
+}
+
+.po-card__store-arrow {
+  flex-shrink: 0;
+  font-size: 14px;
+  color: hsl(var(--muted-foreground));
+}
+
+.po-card__status {
+  display: inline-flex;
+  flex-shrink: 0;
+  gap: 4px;
+  align-items: center;
+  margin-left: auto;
+  font-size: 12px;
+  font-weight: 600;
+}
+
+.po-card__status-dot {
+  width: 6px;
+  height: 6px;
+  border-radius: 50%;
+}
+
+/* 行2 单号/时间小灰字 */
+.po-card__meta {
+  display: flex;
+  gap: 4px;
+  align-items: center;
+  padding: 1px 12px 0;
+  font-size: 11px;
+  color: hsl(var(--muted-foreground));
+}
+
+.po-card__dot {
+  flex-shrink: 0;
+}
+
+/* tinted 胶囊行（紧凑小号） */
+.po-card__pills {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 4px;
+  padding: 6px 12px 0;
+}
+
+.po-pill {
+  display: inline-flex;
+  align-items: center;
+  padding: 1px 7px;
+  font-size: 10px;
+  font-weight: 500;
+  line-height: 16px;
+  border: none;
+  border-radius: 999px;
+}
+
+.po-pill--action {
+  cursor: pointer;
+  transition: filter 0.15s ease;
+}
+
+.po-pill--action:hover {
+  filter: brightness(1.08) saturate(1.2);
+}
+
+/* 行3 商品行：左图文右合计（C 端订单卡惯例） */
+.po-card__goods {
+  display: flex;
+  gap: 10px;
+  align-items: center;
+  padding: 7px 10px;
+  margin: 8px 12px 0;
+  cursor: pointer;
+  background: hsl(var(--muted) / 30%);
+  border-radius: 10px;
+  transition: background-color 0.2s ease;
+}
+
+.po-card__goods:hover {
+  background: hsl(var(--muted) / 45%);
+}
+
+.po-card__goods-thumb {
+  display: flex;
+  flex-shrink: 0;
+  align-items: center;
+  justify-content: center;
+  width: 40px;
+  height: 40px;
+  overflow: hidden;
+  background: hsl(var(--card, var(--background)));
+  border-radius: 8px;
+  box-shadow: 0 1px 2px rgb(0 0 0 / 6%);
+}
+
+.po-card__goods-thumb :deep(img) {
+  object-fit: cover;
+}
+
+.po-card__goods-placeholder {
+  font-size: 11px;
+  font-weight: 600;
+  color: hsl(var(--muted-foreground));
+}
+
+.po-card__goods-name {
+  overflow: hidden;
+  font-size: 13px;
+  font-weight: 500;
+  color: hsl(var(--foreground));
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.po-card__goods-count {
+  display: flex;
+  gap: 6px;
+  align-items: center;
+  margin-top: 1px;
+  font-size: 11px;
+  color: hsl(var(--muted-foreground));
+}
+
+.po-card__goods-toggle {
+  display: inline-flex;
+  flex-shrink: 0;
+  gap: 1px;
+  align-items: center;
+  font-size: 11px;
+  color: hsl(var(--primary));
+}
+
+.po-card__goods-toggle i {
+  font-style: normal;
+  transform: rotate(90deg);
+  transition: transform 0.2s ease;
+}
+
+.po-card__goods-toggle i.up {
+  transform: rotate(-90deg);
+}
+
+/* 合计金额（商品行右侧） */
+.po-card__amount {
+  flex-shrink: 0;
+  margin-left: auto;
+}
+
+.po-card__amount-value {
+  /* DIN 等宽数字：与提现管理统计岛金额同款字体质感 */
+  font-family: 'DIN Alternate', ui-monospace, SFMono-Regular, Menlo, monospace;
+  font-size: 16px;
+  font-weight: 700;
+  letter-spacing: -0.3px;
+  color: hsl(var(--foreground));
+}
+
+.po-card__amount-value i {
+  margin-right: 1px;
+  font-size: 11px;
+  font-style: normal;
+  font-weight: 600;
+}
+
+.po-card__amount-value--link {
+  color: hsl(var(--primary));
+  cursor: pointer;
+}
+
+.po-card__chips {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 4px;
+  padding: 6px 12px 0;
+}
+
+.po-card__drug-chip {
+  padding: 1px 8px;
+  font-size: 11px;
+  color: hsl(var(--muted-foreground));
+  background: hsl(var(--muted) / 35%);
+  border-radius: 999px;
+}
+
+/* 行4 人员内联行：label 小灰字 + 可点链接，一行自动换行 */
+.po-card__people {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 2px 14px;
+  padding: 7px 12px 0;
+  font-size: 12px;
+  line-height: 1.6;
+}
+
+.po-kv {
+  display: inline-flex;
+  gap: 4px;
+  align-items: baseline;
+  min-width: 0;
+}
+
+.po-kv > i {
+  flex-shrink: 0;
+  font-size: 11px;
+  font-style: normal;
+  color: hsl(var(--muted-foreground) / 75%);
+}
+
+.po-kv > em {
+  overflow: hidden;
+  font-style: normal;
+  color: hsl(var(--foreground));
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.po-link {
+  max-width: 140px;
+  padding: 0;
+  overflow: hidden;
+  font-size: 12px;
+  color: hsl(var(--primary));
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  cursor: pointer;
+  background: none;
+  border: none;
+}
+
+.po-link:hover {
+  text-decoration: underline;
+}
+
+/* 行5/6 收货、推广员内联行：label + 单行截断 */
+.po-card__express {
+  display: flex;
+  gap: 6px;
+  align-items: center;
+  min-width: 0;
+  padding: 4px 12px 0;
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+}
+
+.po-card__express > i {
+  flex-shrink: 0;
+  font-size: 11px;
+  font-style: normal;
+  color: hsl(var(--muted-foreground) / 75%);
+}
+
+.po-card__salesperson-status {
+  flex-shrink: 0;
+  padding: 0 7px;
+  font-size: 10px;
+  line-height: 16px;
+  color: hsl(var(--muted-foreground));
+  background: hsl(var(--muted) / 40%);
+  border-radius: 999px;
+}
+
+/* 弹性占位：吃掉剩余高度让 footer 吸底 */
+.po-card__spacer {
+  flex: 1 1 auto;
+  min-height: 8px;
+}
+
+/* 行7 footer：左分项/包邮，右操作按钮；hairline 分隔 */
+.po-card__footer {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 4px 10px;
+  align-items: center;
+  justify-content: space-between;
+  padding: 4px 6px 4px 12px;
+  border-top: 1px solid hsl(var(--border) / 50%);
+}
+
+.po-card__amount-parts {
+  display: flex;
+  gap: 10px;
+  align-items: center;
+  font-size: 11px;
+  color: hsl(var(--muted-foreground));
+}
+</style>
diff --git a/apps/web-antd/src/views/business/order/product-order/components/ProductOrderExportModal.vue b/apps/web-antd/src/views/business/order/product-order/components/ProductOrderExportModal.vue
index 7ffc2513..c857d7bb 100644
--- a/apps/web-antd/src/views/business/order/product-order/components/ProductOrderExportModal.vue
+++ b/apps/web-antd/src/views/business/order/product-order/components/ProductOrderExportModal.vue
@@ -11,7 +11,6 @@ import {
   Button,
   Checkbox,
   DatePicker,
-  Divider,
   Input,
   Modal as AntModal,
   message,
@@ -77,7 +76,12 @@ const status = ref<number | undefined>(undefined);
 const deliveryMethod = ref<number | undefined>(undefined);
 const prescriptionType = ref<number | undefined>(undefined);
 const drugKeyword = ref('');
+/** 就诊人/医生关键字（姓名或手机号模糊，后端 whereHas 关联表筛选） */
+const patientKeyword = ref('');
+const doctorKeyword = ref('');
 const granularity = ref<ExportGranularity>('order');
+/** 订单维度导出时，是否附加「订单商品明细」工作簿（按订单分组的每单商品清单） */
+const withDetailWorkbook = ref(false);
 const selectedKeys = ref<string[]>(getDefaultSelectedKeys('order'));
 const orderedSelectedKeys = ref<string[]>(
   buildDefaultOrderedKeys(getDefaultSelectedKeys('order'), 'order'),
@@ -204,7 +208,10 @@ function resetFormDefaults() {
   deliveryMethod.value = undefined;
   prescriptionType.value = undefined;
   drugKeyword.value = '';
+  patientKeyword.value = '';
+  doctorKeyword.value = '';
   granularity.value = 'order';
+  withDetailWorkbook.value = false;
   selectedKeys.value = getDefaultSelectedKeys('order');
   orderedSelectedKeys.value = buildDefaultOrderedKeys(
     selectedKeys.value,
@@ -515,6 +522,8 @@ async function handleDeleteScheme() {
 }
 
 const [Modal, modalApi] = useVbenModal({
+  // 退出全屏后的宽度：两列布局左列固定 400px，弹窗必须足够宽右列才有空间
+  class: 'w-[1200px]',
   fullscreen: true,
   fullscreenButton: true,
   draggable: true,
@@ -557,6 +566,12 @@ const [Modal, modalApi] = useVbenModal({
       if (drugKeyword.value.trim()) {
         params.drug_keyword = drugKeyword.value.trim();
       }
+      if (patientKeyword.value.trim()) {
+        params.patient_keyword = patientKeyword.value.trim();
+      }
+      if (doctorKeyword.value.trim()) {
+        params.doctor_keyword = doctorKeyword.value.trim();
+      }
 
       const res = await getOrderExportDataApi(params);
       const rows = res?.rows ?? [];
@@ -565,6 +580,40 @@ const [Modal, modalApi] = useVbenModal({
         return;
       }
 
+      // 订单维度勾选附加工作簿：按同筛选条件再拉一次 item 粒度，用于按订单分组的商品明细 Sheet
+      let detailSheet:
+        | undefined
+        | {
+            fieldMeta: ReturnType<typeof getExportFields>;
+            rows: Record<string, unknown>[];
+            selectedFields: string[];
+          };
+      if (granularity.value === 'order' && withDetailWorkbook.value) {
+        loadingStep.value = '正在拉取商品明细…';
+        // 明细工作簿独立容错：明细接口失败只降级为「仅导出订单汇总」，不拖垮整个导出
+        try {
+          const detailRes = await getOrderExportDataApi({
+            ...params,
+            granularity: 'item',
+          });
+          const detailRows = detailRes?.rows ?? [];
+          if (detailRows.length > 0) {
+            detailSheet = {
+              rows: detailRows,
+              // 明细工作簿用 item 粒度默认字段集（不提供单独的字段选择，保持交互简单）
+              selectedFields: buildDefaultOrderedKeys(
+                getDefaultSelectedKeys('item'),
+                'item',
+              ),
+              fieldMeta: getExportFields('item'),
+            };
+          }
+        } catch (detailError) {
+          console.error('商品明细拉取失败，仅导出订单汇总:', detailError);
+          message.warning('商品明细拉取失败，本次仅导出订单汇总');
+        }
+      }
+
       loadingStep.value = '正在生成 Excel…';
       const fieldsMeta = getExportFields(granularity.value);
       const buffer = await exportProductOrderExcel({
@@ -573,6 +622,7 @@ const [Modal, modalApi] = useVbenModal({
         fieldMeta: fieldsMeta,
         granularity: granularity.value,
         exportedAt: new Date(),
+        detailSheet,
         filters: {
           search_time: timeRange,
           order_no: orderNo.value.trim() || undefined,
@@ -641,7 +691,18 @@ const [Modal, modalApi] = useVbenModal({
     :ok-text="loading ? loadingStep || '导出中…' : '导出 Excel'"
     title="导出商品订单"
   >
-    <div class="flex max-h-[calc(100vh-220px)] flex-col gap-4 py-1">
+    <!--
+      布局说明：不再用 max-h[calc] 写死高度——矮屏下会把各区块 flex 压缩导致内容互相叠压、
+      字段复选框被遮挡无法点选。改为：
+      - 小屏（<lg）：自然高度纵向铺开，滚动交给 vben modal body（自带 overflow-y-auto）
+      - 宽屏（lg+，全屏弹窗常态）：左右两列，左列「方案/筛选/导出设置」独立滚动，
+        右列整块留给「导出字段」内部滚动，字段再多也不会被挤压
+    -->
+    <div class="flex min-h-0 flex-col gap-4 py-1 lg:h-full lg:flex-row lg:items-stretch">
+      <!-- 左列：导出方案 + 筛选条件 + 导出设置 -->
+      <div
+        class="flex min-h-0 flex-col gap-4 lg:w-[400px] lg:flex-none lg:overflow-y-auto lg:pr-1"
+      >
       <!-- 导出方案 -->
       <div>
         <div class="mb-2 text-sm font-medium">导出方案</div>
@@ -770,6 +831,22 @@ const [Modal, modalApi] = useVbenModal({
               placeholder="药品名称/拼音首拼"
             />
           </div>
+          <div>
+            <div class="mb-1 text-xs text-muted-foreground">就诊人</div>
+            <Input
+              v-model:value="patientKeyword"
+              allow-clear
+              placeholder="姓名/手机号"
+            />
+          </div>
+          <div>
+            <div class="mb-1 text-xs text-muted-foreground">医生</div>
+            <Input
+              v-model:value="doctorKeyword"
+              allow-clear
+              placeholder="姓名/手机号"
+            />
+          </div>
         </div>
       </div>
 
@@ -780,18 +857,22 @@ const [Modal, modalApi] = useVbenModal({
           <Radio value="order">订单维度（一行一个订单）</Radio>
           <Radio value="item">商品明细维度（一行一个商品）</Radio>
         </Radio.Group>
+        <div v-if="granularity === 'order'" class="mt-2">
+          <Checkbox v-model:checked="withDetailWorkbook">
+            附加「订单商品明细」工作簿（按订单分组导出每单商品清单）
+          </Checkbox>
+        </div>
         <div class="mt-1 text-xs text-muted-foreground">
           当前粒度：{{ granularityLabel(granularity) }}，导出文件将包含筛选条件说明与专业表头样式
         </div>
       </div>
+      </div>
 
-      <Divider class="my-0" />
-
-      <!-- 区块 C：导出字段 -->
+      <!-- 区块 C：导出字段（右列，宽屏下独占一列内部滚动） -->
       <div class="flex min-h-0 flex-1 flex-col">
-        <div class="mb-2 flex items-center justify-between">
+        <div class="mb-2 flex flex-wrap items-center justify-between gap-2">
           <span class="text-sm font-medium">导出字段</span>
-          <Space size="small">
+          <Space size="small" wrap>
             <span class="text-xs text-muted-foreground">
               已选 {{ selectedCount }} / {{ totalFieldCount }}
             </span>
@@ -827,7 +908,8 @@ const [Modal, modalApi] = useVbenModal({
                 <span class="text-xs font-medium text-muted-foreground">{{ group }}</span>
               </Checkbox>
             </div>
-            <div class="grid grid-cols-3 gap-x-2 gap-y-1">
+            <!-- 列数随右列宽度自适应：宽屏铺开减少纵向滚动，窄屏两列保证可点面积 -->
+            <div class="grid grid-cols-2 gap-x-2 gap-y-1.5 md:grid-cols-3 xl:grid-cols-4 2xl:grid-cols-5">
               <Checkbox v-for="field in fields" :key="field.key" :value="field.key">
                 <span class="text-sm">{{ field.label }}</span>
               </Checkbox>
@@ -837,7 +919,7 @@ const [Modal, modalApi] = useVbenModal({
 
         <div
           v-if="fieldOrderPreview"
-          class="mt-2 rounded-md border border-dashed border-border bg-muted/10 px-3 py-2 text-xs leading-relaxed text-muted-foreground"
+          class="mt-2 max-h-24 flex-none overflow-y-auto rounded-md border border-dashed border-border bg-muted/10 px-3 py-2 text-xs leading-relaxed text-muted-foreground"
         >
           <span class="font-medium text-foreground">导出列顺序：</span>
           {{ fieldOrderPreview }}
diff --git a/apps/web-antd/src/views/business/order/product-order/components/cells/OrderUserInfoCell.vue b/apps/web-antd/src/views/business/order/product-order/components/cells/OrderUserInfoCell.vue
index 4eb7b3f9..26b60a3d 100644
--- a/apps/web-antd/src/views/business/order/product-order/components/cells/OrderUserInfoCell.vue
+++ b/apps/web-antd/src/views/business/order/product-order/components/cells/OrderUserInfoCell.vue
@@ -3,7 +3,7 @@
  * 订单列表：下单用户 / 医生 / 就诊人信息单元
  * 下单用户 → 该用户就诊人列表 Modal；就诊人 → 详情 Modal
  */
-import { Avatar, Button, Tag } from 'ant-design-vue';
+import { Avatar, Button } from 'ant-design-vue';
 
 import { resolveAvatarUrl } from '#/views/system/store-input/utils/inputUser';
 
diff --git a/apps/web-antd/src/views/business/order/product-order/config/constants.ts b/apps/web-antd/src/views/business/order/product-order/config/constants.ts
new file mode 100644
index 00000000..eab344a6
--- /dev/null
+++ b/apps/web-antd/src/views/business/order/product-order/config/constants.ts
@@ -0,0 +1,58 @@
+/**
+ * 商品订单模块共用常量
+ *
+ * 处方类型/订单状态等 Tag 映射此前散落在 index.vue 模板的 if-else 链里，
+ * 漏掉了特色方(0)，且列表/卡片/导出各处无法复用，统一收敛到这里。
+ */
+export interface TagMeta {
+  /** 显示文案 */
+  label: string;
+  /** antd Tag color */
+  color: string;
+}
+
+/**
+ * 处方类型（prescription_type）全量映射
+ * 对齐后端 ProductTypeEnum：含不参与开方筛选的特色方(0)与历史遗留值(4=西药)
+ */
+export const PRESCRIPTION_TYPE_MAP: Record<number, TagMeta> = {
+  0: { label: '特色方', color: 'gold' },
+  1: { label: '中药', color: 'orange' },
+  2: { label: '西药', color: 'blue' },
+  3: { label: '保健食品', color: 'purple' },
+  4: { label: '西药', color: 'green' },
+  5: { label: '产品服务包', color: 'pink' },
+  6: { label: '非药品', color: 'cyan' },
+  7: { label: '医疗器械', color: 'geekblue' },
+};
+
+/** 订单状态（status）映射，与列表原 if-else 链颜色语义一致 */
+export const ORDER_STATUS_MAP: Record<number, TagMeta> = {
+  0: { label: '待支付', color: 'red' },
+  1: { label: '待发货', color: 'orange' },
+  2: { label: '待收货', color: 'blue' },
+  3: { label: '待评价', color: 'purple' },
+  4: { label: '已退款', color: 'green' },
+  5: { label: '退款中', color: 'pink' },
+  6: { label: '已收货', color: 'cyan' },
+  7: { label: '确认收货', color: 'green' },
+  8: { label: '拒绝退款', color: '#B22222' },
+  9: { label: '已取消', color: 'gray' },
+};
+
+/** 订单类型（order_type）映射：非 1 的订单不展示处方类型 Tag */
+export const ORDER_TYPE_MAP: Record<number, TagMeta> = {
+  1: { label: '处方订单', color: 'yellow' },
+  2: { label: '预约购药订单', color: 'yellow' },
+  3: { label: '商城处方订单', color: 'yellow' },
+};
+
+/** 就诊来源（is_online）映射，0/其他值视为线下就诊 */
+export const IS_ONLINE_MAP: Record<number, TagMeta> = {
+  1: { label: '在线问诊', color: 'blue' },
+  2: { label: '在线复诊（诊所）', color: 'green' },
+  3: { label: '在线复诊（药店）', color: 'green' },
+};
+
+/** 就诊来源兜底（线下） */
+export const IS_ONLINE_FALLBACK: TagMeta = { label: '线下就诊', color: 'default' };
diff --git a/apps/web-antd/src/views/business/order/product-order/config/search.ts b/apps/web-antd/src/views/business/order/product-order/config/search.ts
index 629594ea..92e83b7d 100644
--- a/apps/web-antd/src/views/business/order/product-order/config/search.ts
+++ b/apps/web-antd/src/views/business/order/product-order/config/search.ts
@@ -7,12 +7,39 @@ import {
 } from '#/views/business/order/product-order/api';
 
 export const formOptions: VbenFormProps = {
-  // 默认展开
-  collapsed: false,
+  // 默认收起只显示第一行，点「展开」看全部筛选（字段多，全展开太占高度）
+  collapsed: true,
+  commonConfig: {
+    // label 默认 100px，本页筛选名最长 4 字，收窄到 70px 让控件占满格子（否则控件被挤得只剩一半宽）
+    labelWidth: 70,
+    // antd Select/RangePicker 默认按内容收缩，统一撑满格子，保证一行里各控件等宽整齐
+    componentProps: {
+      class: 'w-full',
+    },
+  },
+  // 响应式多列：抽出 grid 后 vben form 默认单列（一行一个字段），必须显式给栅格
+  wrapperClass: 'grid-cols-1 sm:grid-cols-2 md:grid-cols-3 xl:grid-cols-4 2xl:grid-cols-5',
   schema: [
     {
-      component: 'VbenInput',
+      // 放第一位：时间范围有默认值（本月至今），默认收起时必须始终可见，否则用户不知道当前查的是哪段数据
+      component: 'RangePicker',
       componentProps: {
+        format: 'YYYY-MM-DD',
+        // 提交纯日期，后端 getWhereBetween 会把结束日扩到当天 23:59:59
+        valueFormat: 'YYYY-MM-DD',
+      },
+      defaultValue: [
+        dayjs().startOf('month').format('YYYY-MM-DD'),
+        dayjs().format('YYYY-MM-DD'),
+      ],
+      fieldName: 'search_time',
+      label: '时间范围',
+    },
+    {
+      // 统一 antd 系控件：与 ApiSelect/门店搜索同一套视觉（此前 VbenInput 是 shadcn 风格，高度圆角不一致）
+      component: 'Input',
+      componentProps: {
+        allowClear: true,
         placeholder: '输入订单号',
       },
       defaultValue: '',
@@ -47,8 +74,8 @@ export const formOptions: VbenFormProps = {
       label: '订单状态',
     },
     {
-      // 医生代支付：按 pay_user_type=2 筛选，方便在列表中定位代付单
-      component: 'VbenSelect',
+      // 医生代支付：2=代支付（含历史单流水回落），1=用户自付
+      component: 'Select',
       componentProps: {
         allowClear: true,
         options: [
@@ -61,11 +88,9 @@ export const formOptions: VbenFormProps = {
       label: '付款方式',
     },
     {
-      component: 'VbenSelect',
+      component: 'Select',
       componentProps: {
         allowClear: true,
-        filterOption: true,
-        showSearch: true,
         options: [
           {
             label: '快递到家',
@@ -101,8 +126,9 @@ export const formOptions: VbenFormProps = {
       label: '订单类型',
     },
     {
-      component: 'VbenInput',
+      component: 'Input',
       componentProps: {
+        allowClear: true,
         placeholder: '药品名称/拼音首拼',
       },
       defaultValue: '',
@@ -110,23 +136,32 @@ export const formOptions: VbenFormProps = {
       label: '药品',
     },
     {
-      component: 'RangePicker',
+      // 就诊人筛选：后端 whereHas userPatient 姓名/手机号模糊
+      component: 'Input',
       componentProps: {
-        format: 'YYYY-MM-DD',
-        // 提交纯日期，后端 getWhereBetween 会把结束日扩到当天 23:59:59
-        valueFormat: 'YYYY-MM-DD',
+        allowClear: true,
+        placeholder: '姓名/手机号',
       },
-      defaultValue: [
-        dayjs().startOf('month').format('YYYY-MM-DD'),
-        dayjs().format('YYYY-MM-DD'),
-      ],
-      fieldName: 'search_time',
-      label: '时间范围',
+      defaultValue: '',
+      fieldName: 'patient_keyword',
+      label: '就诊人',
+    },
+    {
+      // 医生筛选：后端 whereHas doctorInfo 姓名/手机号模糊
+      component: 'Input',
+      componentProps: {
+        allowClear: true,
+        placeholder: '姓名/手机号',
+      },
+      defaultValue: '',
+      fieldName: 'doctor_keyword',
+      label: '医生',
     },
   ],
   showCollapseButton: true,
   submitButtonOptions: {
     content: '查询',
   },
-  submitOnEnter: false,
+  // 任意输入框回车即搜索；下拉面板打开时的回车只选中选项（core 层已处理），第二次回车才搜索
+  submitOnEnter: true,
 };
diff --git a/apps/web-antd/src/views/business/order/product-order/config/table.ts b/apps/web-antd/src/views/business/order/product-order/config/table.ts
index 61e73107..2becbe5f 100644
--- a/apps/web-antd/src/views/business/order/product-order/config/table.ts
+++ b/apps/web-antd/src/views/business/order/product-order/config/table.ts
@@ -2,12 +2,18 @@ import type { VxeGridProps } from '#/adapter/vxe-table';
 
 import { getOrderList } from '#/views/business/order/product-order/api';
 
+/**
+ * 商品订单列表行类型：后端行字段众多（含关联 store/address/salesperson/items），
+ * 用索引签名放宽，避免模板槽访问动态字段时 vue-tsc 报属性缺失
+ */
 interface RowType {
-  id: string;
-  name: string;
-  logo: string;
-  introduce: string;
+  id: number;
+  order_no: string;
+  status: number;
+  order_type: number;
+  prescription_type: number;
   created_at: string;
+  [key: string]: any;
 }
 
 export const gridOptions: VxeGridProps<RowType> = {
@@ -115,13 +121,15 @@ export const gridOptions: VxeGridProps<RowType> = {
   },
   border: false,
   toolbarConfig: {
+    // 是否显示搜索表单控制按钮
+    // @ts-ignore 正式环境时有完整的类型声明
     search: true,
     refresh: true,
     print: false,
     export: false,
     zoom: true,
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
     custom: {
       icon: 'vxe-icon-menu',
diff --git a/apps/web-antd/src/views/business/order/product-order/index.vue b/apps/web-antd/src/views/business/order/product-order/index.vue
index c400e095..1f38f345 100644
--- a/apps/web-antd/src/views/business/order/product-order/index.vue
+++ b/apps/web-antd/src/views/business/order/product-order/index.vue
@@ -2,18 +2,11 @@
 import type { VbenFormProps } from '#/adapter/form';
 import type { VxeGridListeners } from '#/adapter/vxe-table';
 
-import { computed, ref } from 'vue';
+import { computed, onMounted, ref, watch } from 'vue';
 import { useRoute, useRouter } from 'vue-router';
 
-import {
-  AnalysisOverview,
-  type AnalysisOverviewItem,
-  Page,
-  useVbenDrawer,
-  useVbenModal,
-} from '@vben/common-ui';
+import { Page, useVbenDrawer, useVbenModal } from '@vben/common-ui';
 import { useUserStore } from '@vben/stores';
-import { SvgCakeIcon } from '@vben/icons';
 
 import {
   Button,
@@ -30,6 +23,9 @@ import {
 
 import dayjs from 'dayjs';
 
+import type { ActionItem } from '#/components/table-action';
+
+import { useVbenForm } from '#/adapter/form';
 import { useVbenVxeGrid } from '#/adapter/vxe-table';
 import { TableAction } from '#/components/table-action';
 import SensitiveText from '#/components/sensitive-text/SensitiveText.vue';
@@ -67,16 +63,27 @@ import DetailModal from './components/detail.vue';
 import OrderUserInfoCell from './components/cells/OrderUserInfoCell.vue';
 import LogisticsModal from './components/logistics-modal.vue';
 import FormModalDemo from './components/modal.vue';
+import ProductOrderCardList from './components/ProductOrderCardList.vue';
 import ProductOrderExportModal from './components/ProductOrderExportModal.vue';
 import Refund from './components/refund.vue';
+import {
+  ORDER_STATUS_MAP,
+  ORDER_TYPE_MAP,
+  PRESCRIPTION_TYPE_MAP,
+} from './config/constants';
 import { formOptions } from './config/search';
 import { gridOptions } from './config/table';
+import { useViewMode, ViewModeSwitch } from '#/components/view-mode-switch';
+import { StatIslands, type StatIslandItem } from '#/components/stat-islands';
 import { isPlatformSuperAdmin } from '#/views/system/admin/_shared/platform-admin-role';
 
 const router = useRouter();
 const route = useRoute();
 const userStore = useUserStore();
-const canViewInviterCommission = isPlatformSuperAdmin(userStore.userInfo);
+// vben 登录态 roles 为 string[] 与本地 PlatformAdminUserInfo 结构不同，仅取 role_id 判断，直接断言
+const canViewInviterCommission = isPlatformSuperAdmin(
+  userStore.userInfo as Parameters<typeof isPlatformSuperAdmin>[0],
+);
 
 const hasTopTableDropDownActions = ref(false);
 
@@ -149,7 +156,14 @@ function buildFormOptionsFromRoute(): VbenFormProps {
     }
     if (item.fieldName === 'search_time') {
       if (timeScope === 'month') {
-        return { ...item, defaultValue: [dayjs().startOf('month'), dayjs()] };
+        // 与 RangePicker valueFormat 保持一致用字符串，defaultValue 会直接进入首屏搜索条件
+        return {
+          ...item,
+          defaultValue: [
+            dayjs().startOf('month').format('YYYY-MM-DD'),
+            dayjs().format('YYYY-MM-DD'),
+          ],
+        };
       }
       if (timeScope === 'all') {
         return { ...item, defaultValue: null };
@@ -160,31 +174,118 @@ function buildFormOptionsFromRoute(): VbenFormProps {
   return { ...formOptions, schema };
 }
 
-const [Grid, gridApi] = useVbenVxeGrid({
-  formOptions: buildFormOptionsFromRoute(),
-  gridOptions,
-  gridEvents,
+/** 列表/卡片双视图：通用 useViewMode 自带 localStorage 记忆 */
+const viewMode = useViewMode('product-order-view-mode');
+const cardListRef = ref<InstanceType<typeof ProductOrderCardList> | null>(null);
+
+/** 生效的搜索表单配置（含路由 store_id/time_scope 默认值注入） */
+const effectiveFormOptions = buildFormOptionsFromRoute();
+
+/**
+ * 从 schema 提取 defaultValue 作为首屏搜索条件
+ * 列表首屏 query 与卡片首屏 reload 都要带默认时间范围，否则查询口径与表单显示不一致
+ */
+function collectDefaultSearchValues(): Record<string, any> {
+  const values: Record<string, any> = {};
+  for (const item of effectiveFormOptions.schema ?? []) {
+    if (item.fieldName && item.defaultValue !== undefined) {
+      values[item.fieldName] = item.defaultValue;
+    }
+  }
+  return values;
+}
+
+/** 列表与卡片共用的搜索条件（提交/重置时整体替换，卡片靠 watch 自动拉数） */
+const searchValues = ref<Record<string, any>>(collectDefaultSearchValues());
+
+/**
+ * 顶部统一搜索表单（从 grid 内嵌表单抽出，双视图共用）
+ * 列表模式提交后 reload 回第 1 页；卡片模式改 searchValues 由 CardList watch 拉数
+ */
+const [SearchForm, searchFormApi] = useVbenForm({
+  ...effectiveFormOptions,
+  handleSubmit: async (values) => {
+    searchValues.value = { ...(values || {}) };
+    if (viewMode.value === 'list') {
+      gridApi.reload();
+    } else {
+      // 卡片视图数据由 formValues watch 驱动，这里只需同步顶部销售统计
+      saleAmount(searchValues.value);
+    }
+  },
+  handleReset: async () => {
+    // 自定义 handleReset 会接管默认行为，必须手动还原控件到 defaultValue（reset 为新 API，resetForm 已弃用）
+    await searchFormApi.reset();
+    searchValues.value = collectDefaultSearchValues();
+    if (viewMode.value === 'list') {
+      gridApi.reload();
+    } else {
+      saleAmount(searchValues.value);
+    }
+  },
 });
 
-const initTableAjax = () => {
-  gridApi.setGridOptions({
+const [Grid, gridApi] = useVbenVxeGrid({
+  gridOptions: {
+    ...gridOptions,
+    // 搜索已抽出为顶部统一表单，关闭 grid 自带的表单开关按钮
+    toolbarConfig: { ...gridOptions.toolbarConfig, search: false },
     proxyConfig: {
       ajax: {
-        // 请求后端接口方法
-        query: async ({ page }, formValues) => {
-          saleAmount(formValues);
+        /** 始终合并顶部统一搜索条件；同时刷新顶部销售金额统计 */
+        query: async ({ page }: { page: { currentPage: number; pageSize: number } }) => {
+          saleAmount(searchValues.value);
           return await getOrderList({
             page: page.currentPage,
             pageSize: page.pageSize,
-            ...formValues,
+            ...searchValues.value,
           });
         },
       },
     },
-  });
+  },
+  gridEvents,
+});
+
+// 记忆持久化由 useViewMode 内部完成；这里只处理切回列表时 grid 被 v-if 卸载过需重查
+watch(viewMode, (mode, prev) => {
+  if (mode === 'list' && prev === 'card') {
+    gridApi.query();
+  }
+});
+
+/** 操作成功后的视图刷新：列表保当前页，卡片原地重拉已加载范围 */
+async function refreshCurrentView() {
+  await (viewMode.value === 'list'
+    ? gridApi.query()
+    : cardListRef.value?.refreshKeepPage?.());
+}
+
+/** 回第 1 页的强刷新（弹窗内部 reload 语义） */
+function refreshCurrentViewFromPageOne() {
+  if (viewMode.value === 'list') {
+    gridApi.reload();
+  } else {
+    cardListRef.value?.reload?.();
+  }
+}
+
+/**
+ * 传给弹窗子组件的 gridApi 代理
+ * 发货/退款等弹窗内部只会调 reload()/query() 刷新列表，
+ * 卡片模式下需要转发给卡片列表，故不能直接把 gridApi 传进去
+ */
+const gridApiProxy = {
+  reload: () => refreshCurrentViewFromPageOne(),
+  query: () => refreshCurrentView(),
 };
 
-initTableAjax();
+// 首屏是卡片模式时 grid 不渲染（ajax query 不会触发），顶部销售统计需要手动拉一次
+onMounted(() => {
+  if (viewMode.value === 'card') {
+    saleAmount(searchValues.value);
+  }
+});
 const [FormModal, formModalApi] = useVbenModal({
   connectedComponent: FormModalDemo,
 });
@@ -208,7 +309,7 @@ const infoModal = (data: Record<string, any> = {}) => {
     // 带 id 走详情接口拿到 packages；values 作首屏兜底
     id: data?.id,
     values: data,
-    gridApi,
+    gridApi: gridApiProxy,
     // 详情内「发本包裹」：关详情后打开发货弹窗（仅平台包会传 0）
     onShipPackage: (warehouseId: number) => {
       modalApi.close();
@@ -248,7 +349,7 @@ const wareSend = (data: Record<string, any> = {}, warehouseId?: number) => {
   }
   formModalApi.setData({
     values,
-    gridApi,
+    gridApi: gridApiProxy,
   });
   formModalApi.open();
 };
@@ -259,12 +360,12 @@ const expandAll = () => {
 const collapseAll = () => {
   gridApi.grid?.setAllRowExpand(false);
 };
-const overviewItems = ref<AnalysisOverviewItem[]>([]);
+const overviewItems = ref<StatIslandItem[]>([]);
 const income = ref(0);
 const total = ref(0);
-/** 按当前列表筛选条件刷新顶部销售金额/收益（支持门店多选 store_ids） */
+/** 按当前筛选条件刷新顶部销售金额/收益（支持门店多选 store_ids，双视图共用） */
 const saleAmount = (formValues?: Record<string, any>) => {
-  const values = formValues ?? gridApi.formApi.latestSubmissionValues ?? {};
+  const values = formValues ?? searchValues.value ?? {};
   saleAmountApi({
     search_time: values.search_time,
     store_ids: values.store_ids,
@@ -274,20 +375,20 @@ const saleAmount = (formValues?: Record<string, any>) => {
   }).then((res) => {
     income.value = res.income;
     total.value = res.total;
+    // 紧凑统计岛（设计对齐提现管理），替代原 AnalysisOverview 大卡
     overviewItems.value = [
       {
-        icon: SvgCakeIcon,
-        title: '销售金额',
-        totalTitle: '销售金额',
-        totalValue: total.value,
+        key: 'total',
+        label: '销售金额',
         value: total.value,
+        icon: 'lucide:trending-up',
       },
       {
-        icon: 'fluent-emoji:balance-scale',
-        title: '我的收益',
-        totalTitle: '我的收益',
-        totalValue: income.value,
+        key: 'income',
+        label: '我的收益',
         value: income.value,
+        icon: 'lucide:wallet',
+        emphasize: true,
       },
     ];
   });
@@ -413,7 +514,7 @@ async function openOrderPercentAdjust(row: Record<string, any>) {
     productOrderId: row.id,
     quickOptions: normalizeQuickOptions(priceAdjustMeta.value.quickOptions),
     onSuccess: () => {
-      gridApi.reload();
+      refreshCurrentViewFromPageOne();
     },
   });
   percentAdjustDrawerApi.open();
@@ -446,7 +547,7 @@ function handleSimulatePay(row: Record<string, any>) {
     onOk: async () => {
       await simulatePayApi({ order_type: 'product', order_id: row.id });
       message.success('模拟支付成功');
-      await gridApi.query();
+      await refreshCurrentView();
     },
   });
 }
@@ -469,7 +570,7 @@ function handleRetryConfirmReceive(row: Record<string, any>) {
       message.success(
         res?.message || (isWaitReceive ? '确认收货成功' : '解冻重试成功'),
       );
-      await gridApi.query();
+      await refreshCurrentView();
     },
   });
 }
@@ -485,7 +586,7 @@ async function handleAccrueSalesperson(row: Record<string, any>) {
   try {
     await accrueSalespersonCommissionApi({ order_id: row.id });
     message.success('分成成功');
-    await gridApi.query();
+    await refreshCurrentView();
   } catch (error: any) {
     message.error(error?.message || '分成失败');
   } finally {
@@ -507,7 +608,7 @@ async function handleReverseSalesperson(row: Record<string, any>, salespersonId?
       salesperson_id: spId,
     });
     message.success('退回分成成功');
-    await gridApi.query();
+    await refreshCurrentView();
   } catch (error: any) {
     message.error(error?.message || '退回分成失败');
   } finally {
@@ -546,7 +647,7 @@ function formatCommissionRecordDetail(record: Record<string, any>) {
   return `${typeText}${path} · ${record.commission_mode_text || '固定单价'} · ${rule}`;
 }
 
-const openPrescriptionDetail = (values) => {
+const openPrescriptionDetail = (values: number) => {
   // 打开西药处方模态框逻辑
   PrescriptionDetailModalApi.setData({
     values,
@@ -561,12 +662,12 @@ const openExportModal = () => {
   exportModalApi.open();
 };
 
-const openRefundModal = (id) => {
+const openRefundModal = (id: number) => {
   RefundModalApi.setData({
     values: {
       order_id: id,
     },
-    gridApi,
+    gridApi: gridApiProxy,
   });
   RefundModalApi.open();
 };
@@ -576,7 +677,7 @@ async function handleCancelOrder(row: Record<string, any>) {
   try {
     await cancelOrderApi({ order_id: row.id });
     message.success('订单已取消');
-    await gridApi.query();
+    await refreshCurrentView();
   } catch (error: any) {
     message.error(error?.message || '取消失败');
   }
@@ -741,7 +842,7 @@ async function submitChangeWarehouse() {
     });
     message.success(`改仓成功（${items.length} 种药品）`);
     changeWhOpen.value = false;
-    await gridApi.query();
+    await refreshCurrentView();
   } catch (error: any) {
     message.error(error?.message || '改仓失败');
   } finally {
@@ -800,10 +901,119 @@ const fetchOrderAmountVerify = async () => {
   }
 };
 
-const openOrderAmountVerify = () => {
-  verifyMismatchOnly.value = false;
-  fetchOrderAmountVerify();
-};
+// 金额核对入口暂时下线（工具栏按钮已注释），恢复入口时一并取消本函数注释
+// const openOrderAmountVerify = () => {
+//   verifyMismatchOnly.value = false;
+//   fetchOrderAmountVerify();
+// };
+
+/**
+ * 列表槽用元数据取值 helper：v-if 双重索引无法类型收窄，统一在这里兜底
+ */
+function rowPrescriptionTypeMeta(row: Record<string, any>) {
+  return PRESCRIPTION_TYPE_MAP[Number(row?.prescription_type)] ?? null;
+}
+function rowStatusMeta(row: Record<string, any>) {
+  return ORDER_STATUS_MAP[Number(row?.status)] ?? null;
+}
+
+/**
+ * 构造行操作（列表 #action 槽与卡片 footer 共用同一份定义）
+ * 返回 TableAction 的 actions/dropDownActions，保证双视图按钮、权限（auth）、显隐条件完全一致
+ */
+function buildRowActions(row: Record<string, any>): {
+  actions: ActionItem[];
+  dropDownActions: ActionItem[];
+} {
+  return {
+    actions: [
+      {
+        label: '详情',
+        type: 'link',
+        icon: 'marketeq:eye',
+        size: 'small',
+        onClick: infoModal.bind(null, row),
+      },
+      {
+        label: '物流动态',
+        type: 'link',
+        icon: 'mdi:truck-delivery-outline',
+        size: 'small',
+        // 上门快递且已支付、非取消/待支付：可单独查看物流
+        ifShow:
+          row.delivery_method === 0 &&
+          row.is_pay === 1 &&
+          row.status !== 0 &&
+          row.status !== 9,
+        onClick: openLogisticsModal.bind(null, row),
+      },
+      {
+        label: '溯源',
+        type: 'link',
+        icon: 'mdi:timeline-text',
+        size: 'small',
+        onClick: openOrderTrace.bind(null, row),
+      },
+      {
+        label: '处方',
+        type: 'link',
+        icon: 'marketeq:eye',
+        ifShow: row.order_type !== 2 && row.order_type !== 3,
+        onClick: openPrescriptionDetail.bind(null, row.p_id),
+      },
+      {
+        label: '模拟支付',
+        type: 'link',
+        icon: 'mdi:cash-check',
+        auth: ['Super Admin'],
+        ifShow: row.is_pay === 0,
+        onClick: handleSimulatePay.bind(null, row),
+      },
+      {
+        // 仅超管：待收货确认收货 / 已确认收货重试解冻
+        label: Number(row.status) === 2 ? '确认收货' : '重试解冻',
+        type: 'link',
+        icon: 'mdi:package-check',
+        auth: ['Super Admin'],
+        ifShow:
+          Number(row.is_pay) === 1 &&
+          Number(row.cancel_status) === 0 &&
+          Number(row.refund_status) === 0 &&
+          (Number(row.status) === 2 || Number(row.status) === 7),
+        onClick: handleRetryConfirmReceive.bind(null, row),
+      },
+      {
+        label: '发货',
+        type: 'link',
+        icon: 'ri:send-plane-fill',
+        auth: ['Super Admin', 'Admin'],
+        onClick: () => wareSend(row),
+      },
+    ],
+    dropDownActions: [
+      {
+        label: '取消订单',
+        type: 'link',
+        icon: 'mdi:cancel',
+        auth: ['Super Admin', 'Admin'],
+        ifShow:
+          row.status === 0 && row.is_pay === 0 && row.cancel_status === 0,
+        popConfirm: {
+          title: '确定取消该待支付订单吗？',
+          confirm: handleCancelOrder.bind(null, row),
+        },
+      },
+      {
+        label: '退款',
+        type: 'link',
+        icon: 'mingcute:refund-dollar-fill',
+        auth: ['Super Admin', 'Admin'],
+        ifShow: row.is_pay === 1,
+        onClick: openRefundModal.bind(null, row.id),
+      },
+    ],
+  };
+}
 </script>
 
 <template>
@@ -866,10 +1076,22 @@ const openOrderAmountVerify = () => {
     <ExportModal />
     <PrescriptionDetailModal />
     <TraceDrawer />
-    <ChinaErpSyncDrawer @synced="() => gridApi.query()" />
-    <AnalysisOverview :items="overviewItems" :my-card="false" />
-    <Grid>
-      <template #toolbar-buttons>
+    <ChinaErpSyncDrawer @synced="() => refreshCurrentView()" />
+    <!-- 紧凑统计岛：一行 4 格（仅占 2 格），设计对齐提现管理账户卡统计岛 -->
+    <StatIslands class="mb-3" :items="overviewItems" :columns="4" />
+    <!-- 顶部统一搜索（双视图共用，替代原 grid 内嵌表单） -->
+    <div class="mb-3 rounded-lg border border-[hsl(var(--border))] bg-[hsl(var(--card,var(--background)))] p-3">
+      <SearchForm />
+    </div>
+    <!-- 视图切换：列表 / 卡片看板；卡片模式下补充导出入口（列表模式导出在表格工具栏） -->
+    <div class="mb-3 flex items-center justify-between gap-3">
+      <ViewModeSwitch v-model="viewMode" />
+      <Button v-if="viewMode === 'card'" type="primary" @click="openExportModal">
+        导出
+      </Button>
+    </div>
+    <Grid v-if="viewMode === 'list'">
+      <template #toolbar-actions>
         <TableAction
           :flex="false"
           :actions="[
@@ -1230,7 +1452,7 @@ const openOrderAmountVerify = () => {
           :checked="row.is_free_shipping === 1"
           checked-children="包邮"
           un-checked-children="不包邮"
-          @change="(checked) => toggleFreeShipping(row, checked)"
+          @change="(checked: any) => toggleFreeShipping(row, Boolean(checked))"
         />
       </template>
       <template #is-online="{ row }">
@@ -1240,37 +1462,15 @@ const openOrderAmountVerify = () => {
         <Tag v-else color="default">线下就诊</Tag>
       </template>
       <template #delivery-method="{ row }">
-        <!-- 判断是否为非处方订单-->
+        <!-- 订单类型：非处方订单（order_type=2）显示订单类型；其余按处方类型全量映射（含特色方 0） -->
         <div v-if="row.order_type === 2">
-          <Tag v-if="row.order_type === 1" color="yellow">处方订单</Tag>
-          <Tag v-else-if="row.order_type === 2" color="yellow">
-            预约购药订单
-          </Tag>
-          <Tag v-else-if="row.order_type === 3" color="yellow">
-            商城处方订单
+          <Tag color="yellow">
+            {{ ORDER_TYPE_MAP[row.order_type]?.label || '预约购药订单' }}
           </Tag>
         </div>
         <div v-else>
-          <Tag v-if="row.prescription_type === 1" color="orange">
-            处方订单【中药】
-          </Tag>
-          <Tag v-else-if="row.prescription_type === 2" color="blue">
-            处方订单【西药】
-          </Tag>
-          <Tag v-else-if="row.prescription_type === 3" color="purple">
-            处方订单【保健食品】
-          </Tag>
-          <Tag v-else-if="row.prescription_type === 4" color="green">
-            处方订单【西药】
-          </Tag>
-          <Tag v-else-if="row.prescription_type === 5" color="pink">
-            处方订单【产品服务包】
-          </Tag>
-          <Tag v-else-if="row.prescription_type === 6" color="cyan">
-            处方订单【非药品】
-          </Tag>
-          <Tag v-else-if="row.prescription_type === 7" color="geekblue">
-            处方订单【医疗器械】
+          <Tag v-if="rowPrescriptionTypeMeta(row)" :color="rowPrescriptionTypeMeta(row)!.color">
+            处方订单【{{ rowPrescriptionTypeMeta(row)!.label }}】
           </Tag>
         </div>
         <div class="mt-3">
@@ -1280,114 +1480,17 @@ const openOrderAmountVerify = () => {
           </Tag>
         </div>
         <div class="mt-3">
-          <Tag v-if="row.status === 0" color="red">待支付</Tag>
-          <Tag v-else-if="row.status === 1" color="orange">待发货</Tag>
-          <Tag v-else-if="row.status === 2" color="blue">待收货</Tag>
-          <Tag v-else-if="row.status === 3" color="purple">待评价</Tag>
-          <Tag v-else-if="row.status === 4" color="green">已退款</Tag>
-          <Tag v-else-if="row.status === 5" color="pink">退款中</Tag>
-          <Tag v-else-if="row.status === 6" color="cyan">已收货</Tag>
-          <Tag v-else-if="row.status === 7" color="green">确认收货</Tag>
-          <Tag v-else-if="row.status === 8" color="#B22222">拒绝退款</Tag>
-          <Tag v-else-if="row.status === 9" color="gray">已取消</Tag>
+          <Tag v-if="rowStatusMeta(row)" :color="rowStatusMeta(row)!.color">
+            {{ rowStatusMeta(row)!.label }}
+          </Tag>
         </div>
       </template>
       <template #toolbar-tools></template>
       <template #action="{ row }">
+        <!-- 行操作与卡片视图共用 buildRowActions，双视图按钮/权限/显隐保持一致 -->
         <TableAction
-          :actions="[
-            {
-              label: '详情',
-              type: 'link',
-              icon: 'marketeq:eye',
-              size: 'small',
-              // auth: ['order', 'sys:role:detail'],
-              onClick: infoModal.bind(null, row),
-            },
-            {
-              label: '物流动态',
-              type: 'link',
-              icon: 'mdi:truck-delivery-outline',
-              size: 'small',
-              // 上门快递且已支付、非取消/待支付：可单独查看物流
-              ifShow:
-                row.delivery_method === 0 &&
-                row.is_pay === 1 &&
-                row.status !== 0 &&
-                row.status !== 9,
-              onClick: openLogisticsModal.bind(null, row),
-            },
-            {
-              label: '溯源',
-              type: 'link',
-              icon: 'mdi:timeline-text',
-              size: 'small',
-              onClick: openOrderTrace.bind(null, row),
-            },
-            {
-              label: '处方',
-              type: 'link',
-              icon: 'marketeq:eye',
-              ifShow: row.order_type !== 2 && row.order_type !== 3,
-              // auth: ['超级订单', 'sys:user:save'],
-              onClick: openPrescriptionDetail.bind(null, row.p_id),
-            },
-            {
-              label: '模拟支付',
-              type: 'link',
-              icon: 'mdi:cash-check',
-              auth: ['Super Admin'],
-              ifShow: row.is_pay === 0,
-              onClick: handleSimulatePay.bind(null, row),
-            },
-            {
-              // 仅超管：待收货确认收货 / 已确认收货重试解冻
-              label: Number(row.status) === 2 ? '确认收货' : '重试解冻',
-              type: 'link',
-              icon: 'mdi:package-check',
-              auth: ['Super Admin'],
-              ifShow:
-                Number(row.is_pay) === 1 &&
-                Number(row.cancel_status) === 0 &&
-                Number(row.refund_status) === 0 &&
-                (Number(row.status) === 2 || Number(row.status) === 7),
-              onClick: handleRetryConfirmReceive.bind(null, row),
-            },
-            {
-              label: '发货',
-              type: 'link',
-              icon: 'ri:send-plane-fill',
-              auth: ['Super Admin','Admin'],
-              onClick: () => wareSend(row),
-            },
-          ]"
-          :drop-down-actions="[
-            {
-              label: '取消订单',
-              type: 'link',
-              icon: 'mdi:cancel',
-              auth: ['Super Admin', 'Admin'],
-              ifShow:
-                row.status === 0 && row.is_pay === 0 && row.cancel_status === 0,
-              popConfirm: {
-                title: '确定取消该待支付订单吗？',
-                confirm: handleCancelOrder.bind(null, row),
-              },
-            },
-            {
-              label: '退款',
-              type: 'link',
-              icon: 'mingcute:refund-dollar-fill',
-              auth: ['Super Admin','Admin'],
-              // auth: ['超级订单', 'sys:user:save'],
-              ifShow: row.is_pay === 1,
-              onClick: openRefundModal.bind(null, row.id),
-              // popConfirm: {
-              //   title: '确定发货吗？',
-              //   confirm: wareSend.bind(null, row),
-              // },
-            },
-          ]"
+          :actions="buildRowActions(row).actions"
+          :drop-down-actions="buildRowActions(row).dropDownActions"
         />
       </template>
 
@@ -1415,7 +1518,7 @@ const openOrderAmountVerify = () => {
                 </div>
                 <div class="ml-3 mt-5 text-sm">
                   <span class="text-gray-500 dark:text-gray-400">商品编号：</span>
-                  X00{{ index + 1 }}
+                  X00{{ Number(index) + 1 }}
                 </div>
               </div>
               <div class="flex-grow space-y-2">
@@ -1495,6 +1598,23 @@ const openOrderAmountVerify = () => {
         </div>
       </template>
     </Grid>
+    <!-- 卡片看板视图：展示内容与列表一致，行操作/弹窗全部复用父级逻辑 -->
+    <div v-else class="po-card-wrap">
+      <ProductOrderCardList
+        ref="cardListRef"
+        :form-values="searchValues"
+        :build-row-actions="buildRowActions"
+        :can-percent-adjust="canRowPercentAdjust"
+        @open-store="openStoreCard"
+        @open-doctor="showOrderDoctorCard"
+        @open-user-patients="openOrderUserPatients"
+        @open-patient="openOrderPatient"
+        @open-warehouse="openChangeWarehouse"
+        @toggle-free-shipping="toggleFreeShipping"
+        @percent-adjust="openOrderPercentAdjust"
+        @go-register="goRegisterOrder"
+      />
+    </div>
     <PercentAdjustDrawer />
     <!-- 订单改仓：按药分别选仓 -->
     <AntdModal
@@ -1582,4 +1702,10 @@ const openOrderAmountVerify = () => {
 .tcm-drug-chip {
   box-shadow: 0 1px 2px rgb(0 0 0 / 4%);
 }
+
+/* 卡片看板容器：撑满剩余高度，内部滚动（统计岛 + 收起态搜索一行 + 切换行约 220px，min-height 兜底） */
+.po-card-wrap {
+  height: calc(100% - 220px);
+  min-height: 420px;
+}
 </style>
diff --git a/apps/web-antd/src/views/business/order/product-order/utils/exportProductOrderExcel.ts b/apps/web-antd/src/views/business/order/product-order/utils/exportProductOrderExcel.ts
index fd15ac62..0f47795b 100644
--- a/apps/web-antd/src/views/business/order/product-order/utils/exportProductOrderExcel.ts
+++ b/apps/web-antd/src/views/business/order/product-order/utils/exportProductOrderExcel.ts
@@ -24,6 +24,15 @@ export interface ExportProductOrderExcelOptions {
   filters: OrderExportFilterInfo;
   granularity: ExportGranularity;
   exportedAt?: Date;
+  /**
+   * 附加「订单商品明细」工作簿（订单维度导出时可选）
+   * rows 为 item 粒度数据，按 order_no 分组渲染：组头行（订单概要）+ 组内商品明细行
+   */
+  detailSheet?: {
+    rows: Record<string, unknown>[];
+    selectedFields: string[];
+    fieldMeta: ExportFieldMeta[];
+  };
 }
 
 const THIN_BORDER: Partial<ExcelJS.Borders> = {
@@ -224,6 +233,7 @@ export async function exportProductOrderExcel(
     filters,
     granularity,
     exportedAt = new Date(),
+    detailSheet,
   } = options;
 
   const columns = selectedFields
@@ -386,9 +396,172 @@ export async function exportProductOrderExcel(
     fitToHeight: 0,
   };
 
+  // 附加「订单商品明细」工作簿：按订单分组展示每单商品
+  if (detailSheet && detailSheet.rows.length > 0) {
+    renderOrderDetailGroupSheet(workbook, detailSheet, exportedAt);
+  }
+
   return workbook.xlsx.writeBuffer();
 }
 
+/**
+ * 渲染按订单分组的商品明细工作簿
+ *
+ * 结构：标题行 → 表头行 → [订单组头行 + 该订单全部商品明细行] 循环 → 整表汇总行
+ * 组头行合并整行，汇总该订单的商品件数与订单总价，用浅蓝底与明细行区分，
+ * 方便财务/运营核对「一单多品」时逐单核对，而不用在扁平明细里肉眼找订单边界。
+ */
+function renderOrderDetailGroupSheet(
+  workbook: ExcelJS.Workbook,
+  detailSheet: NonNullable<ExportProductOrderExcelOptions['detailSheet']>,
+  exportedAt: Date,
+) {
+  const columns = detailSheet.selectedFields
+    .map((key) => detailSheet.fieldMeta.find((f) => f.key === key))
+    .filter((f): f is ExportFieldMeta => !!f);
+  if (columns.length === 0) return;
+
+  const sheet = workbook.addWorksheet('订单商品明细', {
+    views: [{ showGridLines: true }],
+  });
+  const colCount = columns.length;
+
+  // Row 1：标题
+  sheet.mergeCells(1, 1, 1, colCount);
+  const titleCell = sheet.getCell(1, 1);
+  titleCell.value = `萧康云医 · 订单商品明细（按订单分组）  导出时间：${formatDateTime(exportedAt)}`;
+  titleCell.font = { bold: true, size: 13, color: { argb: 'FF1F4E79' } };
+  titleCell.fill = {
+    type: 'pattern',
+    pattern: 'solid',
+    fgColor: { argb: 'FFF5F7FA' },
+  };
+  titleCell.alignment = { horizontal: 'center', vertical: 'middle' };
+  titleCell.border = THIN_BORDER;
+  sheet.getRow(1).height = 30;
+
+  // Row 2：表头
+  const headerRowNum = 2;
+  columns.forEach((meta, i) => {
+    const cell = sheet.getCell(headerRowNum, i + 1);
+    cell.value = meta.label;
+    cell.font = { bold: true, color: { argb: 'FF000000' } };
+    cell.fill = {
+      type: 'pattern',
+      pattern: 'solid',
+      fgColor: { argb: 'FFFFFF00' },
+    };
+    cell.alignment = { horizontal: 'center', vertical: 'middle' };
+    cell.border = THIN_BORDER;
+  });
+  sheet.getRow(headerRowNum).height = 26;
+
+  // 按 order_no 保序分组（后端按订单遍历输出明细行，顺序天然聚集）
+  const groups = new Map<string, Record<string, unknown>[]>();
+  for (const row of detailSheet.rows) {
+    const key = String(row.order_no ?? '');
+    const list = groups.get(key);
+    if (list) {
+      list.push(row);
+    } else {
+      groups.set(key, [row]);
+    }
+  }
+
+  let r = headerRowNum + 1;
+  groups.forEach((groupRows, orderNo) => {
+    const first = groupRows[0] ?? {};
+    // 组头行：订单概要（订单号/医生/状态/件数/订单总价）
+    sheet.mergeCells(r, 1, r, colCount);
+    const headCell = sheet.getCell(r, 1);
+    const pieces = [
+      `订单 ${orderNo || '—'}`,
+      first.store_name ? `门店 ${first.store_name}` : '',
+      first.doctor_name ? `医生 ${first.doctor_name}` : '',
+      first.status_text ? `状态 ${first.status_text}` : '',
+      `共 ${groupRows.length} 件商品`,
+      first.total_pay_price != null && first.total_pay_price !== ''
+        ? `订单总价 ¥${first.total_pay_price}`
+        : '',
+    ].filter(Boolean);
+    headCell.value = pieces.join(' ｜ ');
+    headCell.font = { bold: true, size: 10 };
+    headCell.fill = {
+      type: 'pattern',
+      pattern: 'solid',
+      fgColor: { argb: 'FFE8F0FE' },
+    };
+    headCell.alignment = { horizontal: 'left', vertical: 'middle' };
+    headCell.border = THIN_BORDER;
+    sheet.getRow(r).height = 22;
+    r += 1;
+
+    // 组内商品明细行
+    groupRows.forEach((row) => {
+      const excelRow = sheet.getRow(r);
+      columns.forEach((meta, colIdx) => {
+        const cell = excelRow.getCell(colIdx + 1);
+        cell.value = cellValue(row, meta.key, meta.format) as ExcelJS.CellValue;
+        applyCellFormat(cell, meta);
+      });
+      excelRow.height = 20;
+      r += 1;
+    });
+  });
+
+  const dataEndRow = r - 1;
+
+  // 整表汇总行：对 summary 字段（如行金额）求和
+  const summaryFields = columns.filter((c) => c.summary);
+  if (summaryFields.length > 0 && detailSheet.rows.length > 0) {
+    const summaryRowNum = r + 1;
+    columns.forEach((meta, colIdx) => {
+      const cell = sheet.getCell(summaryRowNum, colIdx + 1);
+      cell.border = {
+        ...THIN_BORDER,
+        top: { style: 'double', color: { argb: 'FF000000' } },
+      };
+      cell.fill = {
+        type: 'pattern',
+        pattern: 'solid',
+        fgColor: { argb: 'FFFFF9E6' },
+      };
+      cell.font = { bold: true };
+      if (colIdx === 0) {
+        cell.value = `汇总（${groups.size} 单 / ${detailSheet.rows.length} 件）`;
+      } else if (meta.summary) {
+        const sum = detailSheet.rows.reduce((acc, row) => {
+          const n = Number(row[meta.key]);
+          return acc + (Number.isFinite(n) ? n : 0);
+        }, 0);
+        cell.value = sum;
+        applyCellFormat(cell, meta);
+      }
+    });
+    sheet.getRow(summaryRowNum).height = 24;
+  }
+
+  autoFitColumns(sheet, colCount, columns, headerRowNum, dataEndRow);
+
+  // 冻结标题 + 表头两行，滚动时保持列名可见
+  sheet.views = [
+    {
+      state: 'frozen',
+      xSplit: 0,
+      ySplit: headerRowNum,
+      topLeftCell: `A${headerRowNum + 1}`,
+      activeCell: `A${headerRowNum + 1}`,
+    },
+  ];
+
+  sheet.pageSetup = {
+    orientation: 'landscape',
+    fitToPage: true,
+    fitToWidth: 1,
+    fitToHeight: 0,
+  };
+}
+
 function formatDateTime(d: Date): string {
   const pad = (n: number) => String(n).padStart(2, '0');
   return `${d.getFullYear()}-${pad(d.getMonth() + 1)}-${pad(d.getDate())} ${pad(d.getHours())}:${pad(d.getMinutes())}:${pad(d.getSeconds())}`;
diff --git a/apps/web-antd/src/views/business/order/register/api/index.ts b/apps/web-antd/src/views/business/order/register/api/index.ts
index b4fe5121..45392ea7 100644
--- a/apps/web-antd/src/views/business/order/register/api/index.ts
+++ b/apps/web-antd/src/views/business/order/register/api/index.ts
@@ -13,12 +13,19 @@ export interface RegisterOrderItem {
   refund_status?: number;
   refund_time?: string;
   created_at: string;
-  doctor_info?: { name: string; depart?: { name: string } };
-  user_patient?: { name: string };
-  store?: { name: string };
+  store_id?: number;
+  doctor_info?: {
+    avatar?: string;
+    depart?: { name: string };
+    name: string;
+  };
+  user_patient?: { age?: number; mobile?: string; name: string; sex?: number };
+  store?: { id?: number; mobile?: string; name: string; position?: string };
   salesperson_id?: number;
-  salesperson?: { id: number; nick_name: string; avatar?: string };
+  salesperson?: { avatar?: string; id: number; nick_name: string };
   prescription?: { id: number; prescription_no: string }[];
+  /** 详情弹窗使用的支付/取消/拒诊等扩展字段，后端 selectField 全量返回 */
+  [key: string]: any;
 }
 
 export async function getRegisterListApi(data: Record<string, unknown>) {
diff --git a/apps/web-antd/src/views/business/order/register/components/RegisterDetailModal.vue b/apps/web-antd/src/views/business/order/register/components/RegisterDetailModal.vue
new file mode 100644
index 00000000..b1af0cc0
--- /dev/null
+++ b/apps/web-antd/src/views/business/order/register/components/RegisterDetailModal.vue
@@ -0,0 +1,397 @@
+<script lang="ts" setup>
+/**
+ * 挂号订单详情弹窗（App 风格分组卡片）
+ *
+ * 数据来源：列表行数据（后端 list 已带 userPatient/user/store/doctorInfo.depart 关联），
+ * 无需再请求详情接口。父级通过 modalApi.setData({ row }) 传入。
+ *
+ * 展示分组：挂号信息 / 就诊人 / 下单用户 / 诊所 / 医生 / 价格与支付 / 关联处方 / 推广员
+ */
+import { computed, ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+
+import { Avatar } from 'ant-design-vue';
+
+import SensitiveText from '#/components/sensitive-text/SensitiveText.vue';
+import { pillStyle, tagColorHex } from '#/utils/tagColor';
+
+import {
+  REGISTER_PAY_TYPE_MAP,
+  REGISTER_REFUND_STATUS_MAP,
+  REGISTER_STATUS_MAP,
+  REGISTER_TYPE_MAP,
+} from '../config/constants';
+
+const emit = defineEmits<{
+  /** 点击处方号：由父级打开已有的处方详情弹窗 */
+  openPrescription: [prescriptionId: number];
+  /** 点击诊所名：由父级打开诊所卡片弹窗 */
+  openStore: [storeId: number];
+}>();
+
+const row = ref<Record<string, any>>({});
+
+const [Modal, modalApi] = useVbenModal({
+  onOpenChange(isOpen) {
+    if (isOpen) {
+      // 本项目 vben 版本 getData 无泛型签名，取值后显式断言
+      const data = modalApi.getData() as Record<string, any> | undefined;
+      row.value = data?.row ?? {};
+    }
+  },
+});
+
+const typeMeta = computed(
+  () => REGISTER_TYPE_MAP[Number(row.value?.type)] ?? { label: '未知', color: 'default' },
+);
+const statusMeta = computed(
+  () => REGISTER_STATUS_MAP[Number(row.value?.status)] ?? { label: '未知', color: 'default' },
+);
+const refundMeta = computed(
+  () =>
+    REGISTER_REFUND_STATUS_MAP[Number(row.value?.refund_status)] ?? {
+      label: '未退款',
+      color: 'default',
+    },
+);
+
+/** 性别文案（yii_user_patient.sex：0默认 1男 2女） */
+const patientSex = computed(() => {
+  const sex = Number(row.value?.userPatient?.sex ?? row.value?.user_patient?.sex);
+  if (sex === 1) return '男';
+  if (sex === 2) return '女';
+  return '—';
+});
+
+/** 就诊人/用户/诊所/医生关联兼容 snake_case 序列化（Laravel toArray 默认蛇形） */
+const patient = computed(() => row.value?.userPatient ?? row.value?.user_patient ?? {});
+const orderUser = computed(() => row.value?.user ?? {});
+const store = computed(() => row.value?.store ?? {});
+const doctor = computed(() => row.value?.doctorInfo ?? row.value?.doctor_info ?? {});
+const departName = computed(() => doctor.value?.depart?.name || '—');
+const prescriptions = computed(() =>
+  Array.isArray(row.value?.prescription) ? row.value.prescription : [],
+);
+const salesperson = computed(() => row.value?.salesperson ?? null);
+
+/** 金额格式化：非法值显示占位符 */
+function money(value: unknown) {
+  const n = Number(value);
+  return Number.isFinite(n) ? `¥${n.toFixed(2)}` : '—';
+}
+</script>
+
+<template>
+  <Modal title="挂号详情" class="w-[640px]" :footer="false">
+    <div class="rd-body">
+      <!-- 顶部概要：订单号 + 状态/方式 -->
+      <div class="rd-hero">
+        <div class="min-w-0">
+          <div class="rd-hero__no">{{ row.order_no || '—' }}</div>
+          <div class="rd-hero__time">下单时间：{{ row.created_at || '—' }}</div>
+        </div>
+        <div class="flex shrink-0 items-center gap-1.5">
+          <span class="rd-pill" :style="pillStyle(typeMeta.color)">{{ typeMeta.label }}</span>
+          <span class="rd-status" :style="{ color: tagColorHex(statusMeta.color) }">
+            <i class="rd-status__dot" :style="{ background: tagColorHex(statusMeta.color) }"></i>
+            {{ statusMeta.label }}
+          </span>
+        </div>
+      </div>
+      <!-- 就诊人信息 -->
+      <div class="rd-section">
+        <div class="rd-section__title">就诊人信息</div>
+        <div class="rd-grid">
+          <div class="rd-item">
+            <span class="rd-item__label">姓名</span>
+            <span class="rd-item__value">{{ patient.name || '—' }}</span>
+          </div>
+          <div class="rd-item">
+            <span class="rd-item__label">性别</span>
+            <span class="rd-item__value">{{ patientSex }}</span>
+          </div>
+          <div class="rd-item">
+            <span class="rd-item__label">年龄</span>
+            <span class="rd-item__value">{{ patient.age ?? '—' }}</span>
+          </div>
+          <div class="rd-item">
+            <span class="rd-item__label">手机号</span>
+            <span class="rd-item__value">
+              <!-- 就诊人手机为敏感字段，统一走 SensitiveText 脱敏/授权查看 -->
+              <SensitiveText :record="patient" field="mobile" />
+            </span>
+          </div>
+        </div>
+      </div>
+      <!-- 下单用户信息 -->
+      <div class="rd-section">
+        <div class="rd-section__title">用户信息</div>
+        <div class="flex items-center gap-3">
+          <Avatar :src="orderUser.avatarurl || '/img/user-default-avatar.png'" :size="40" />
+          <div class="min-w-0">
+            <div class="rd-item__value truncate">{{ orderUser.nickname || '—' }}</div>
+            <div class="rd-muted">用户 ID：{{ row.user_id || '—' }}</div>
+          </div>
+        </div>
+      </div>
+      <!-- 挂号诊所信息 -->
+      <div class="rd-section">
+        <div class="rd-section__title">挂号诊所</div>
+        <div class="rd-grid rd-grid--single">
+          <div class="rd-item">
+            <span class="rd-item__label">诊所</span>
+            <button
+              v-if="store.id"
+              type="button"
+              class="rd-link"
+              @click="emit('openStore', Number(store.id))"
+            >
+              {{ store.name || '—' }}
+            </button>
+            <span v-else class="rd-item__value">{{ store.name || '—' }}</span>
+          </div>
+          <div class="rd-item">
+            <span class="rd-item__label">地址</span>
+            <span class="rd-item__value">{{ store.position || '—' }}</span>
+          </div>
+          <div class="rd-item">
+            <span class="rd-item__label">电话</span>
+            <span class="rd-item__value">{{ store.mobile || '—' }}</span>
+          </div>
+        </div>
+      </div>
+      <!-- 医生信息 -->
+      <div class="rd-section">
+        <div class="rd-section__title">医生信息</div>
+        <div class="flex items-center gap-3">
+          <Avatar :src="doctor.avatar || '/img/user-default-avatar.png'" :size="40" />
+          <div class="min-w-0 flex-1">
+            <div class="rd-item__value truncate">{{ doctor.name || '—' }}</div>
+            <div class="rd-muted">科室：{{ departName }}</div>
+          </div>
+          <div class="rd-muted shrink-0">挂号序号 #{{ row.order_number ?? '—' }}</div>
+        </div>
+      </div>
+      <!-- 价格与支付 -->
+      <div class="rd-section">
+        <div class="rd-section__title">价格与支付</div>
+        <div class="rd-grid">
+          <div class="rd-item">
+            <span class="rd-item__label">挂号金额</span>
+            <span class="rd-item__value rd-item__value--price">{{ money(row.price) }}</span>
+          </div>
+          <div class="rd-item">
+            <span class="rd-item__label">支付状态</span>
+            <span class="rd-pill" :style="pillStyle(row.is_pay === 1 ? 'green' : 'red')">
+              {{ row.is_pay === 1 ? '已支付' : '未支付' }}
+            </span>
+          </div>
+          <div class="rd-item">
+            <span class="rd-item__label">支付方式</span>
+            <span class="rd-item__value">
+              {{ row.is_pay === 1 ? REGISTER_PAY_TYPE_MAP[Number(row.pay_type)] || '—' : '—' }}
+            </span>
+          </div>
+          <div class="rd-item">
+            <span class="rd-item__label">支付时间</span>
+            <span class="rd-item__value">{{ row.pay_time || '未支付' }}</span>
+          </div>
+          <div class="rd-item">
+            <span class="rd-item__label">退款状态</span>
+            <span class="rd-pill" :style="pillStyle(refundMeta.color)">
+              {{ refundMeta.label }}
+            </span>
+          </div>
+          <div v-if="Number(row.refund_status) === 3" class="rd-item">
+            <span class="rd-item__label">退款时间</span>
+            <span class="rd-item__value">{{ row.refund_time || '—' }}</span>
+          </div>
+        </div>
+        <!-- 取消/拒诊补充信息（有才显示） -->
+        <div v-if="row.cancel_status === 1 || row.refuse_reason" class="rd-extra">
+          <div v-if="row.cancel_status === 1">
+            已取消：{{ row.cancel_time || '—' }}
+            <template v-if="row.cancel_remark">（{{ row.cancel_remark }}）</template>
+          </div>
+          <div v-if="row.refuse_reason">拒诊原因：{{ row.refuse_reason }}</div>
+        </div>
+      </div>
+      <!-- 关联处方（有才显示） -->
+      <div v-if="prescriptions.length" class="rd-section">
+        <div class="rd-section__title">关联处方</div>
+        <div class="flex flex-wrap gap-2">
+          <button
+            v-for="item in prescriptions"
+            :key="item.id"
+            type="button"
+            class="rd-link rd-link--chip"
+            @click="emit('openPrescription', Number(item.id))"
+          >
+            {{ item.prescription_no }}
+          </button>
+        </div>
+      </div>
+      <!-- 推广员（有才显示） -->
+      <div v-if="salesperson?.id" class="rd-section">
+        <div class="rd-section__title">推广员</div>
+        <div class="flex items-center gap-3">
+          <Avatar :src="salesperson.avatar || '/img/user-default-avatar.png'" :size="32" />
+          <span class="rd-item__value">{{ salesperson.nick_name || '—' }}</span>
+        </div>
+      </div>
+    </div>
+  </Modal>
+</template>
+
+<style scoped>
+.rd-body {
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+  padding-bottom: 4px;
+}
+
+/* 顶部概要条（Apple 风格：浅灰内嵌块，无边框） */
+.rd-hero {
+  display: flex;
+  gap: 12px;
+  align-items: center;
+  justify-content: space-between;
+  padding: 12px 14px;
+  background: hsl(var(--muted) / 35%);
+  border-radius: 14px;
+}
+
+.rd-hero__no {
+  overflow: hidden;
+  font-size: 15px;
+  font-weight: 600;
+  color: hsl(var(--foreground));
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.rd-hero__time {
+  margin-top: 2px;
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+}
+
+/* 分组块：Apple 设置页风格，浅灰内嵌圆角块 + 小节标题（禁止左侧竖色条） */
+.rd-section {
+  padding: 12px 14px;
+  background: hsl(var(--muted) / 25%);
+  border-radius: 14px;
+}
+
+.rd-section__title {
+  margin-bottom: 10px;
+  font-size: 12px;
+  font-weight: 600;
+  color: hsl(var(--muted-foreground));
+  text-transform: uppercase;
+  letter-spacing: 0.4px;
+}
+
+/* 两列信息栅格 */
+.rd-grid {
+  display: grid;
+  grid-template-columns: repeat(2, minmax(0, 1fr));
+  gap: 8px 16px;
+}
+
+.rd-grid--single {
+  grid-template-columns: 1fr;
+}
+
+.rd-item {
+  display: flex;
+  gap: 8px;
+  align-items: baseline;
+  min-width: 0;
+  font-size: 13px;
+}
+
+.rd-item__label {
+  flex-shrink: 0;
+  color: hsl(var(--muted-foreground));
+}
+
+.rd-item__value {
+  min-width: 0;
+  overflow: hidden;
+  color: hsl(var(--foreground));
+  text-overflow: ellipsis;
+}
+
+.rd-item__value--price {
+  font-size: 15px;
+  font-weight: 700;
+}
+
+.rd-muted {
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+}
+
+.rd-link {
+  padding: 0;
+  font-size: 13px;
+  color: hsl(var(--primary));
+  cursor: pointer;
+  background: none;
+  border: none;
+}
+
+.rd-link:hover {
+  text-decoration: underline;
+}
+
+.rd-link--chip {
+  padding: 3px 10px;
+  background: hsl(var(--primary) / 8%);
+  border: 1px solid hsl(var(--primary) / 25%);
+  border-radius: 8px;
+}
+
+.rd-link--chip:hover {
+  text-decoration: none;
+  box-shadow: 0 0 6px hsl(var(--primary) / 18%);
+}
+
+/* tinted 胶囊 / 状态彩点（与订单卡片同一套 Apple 语言） */
+.rd-pill {
+  display: inline-flex;
+  align-items: center;
+  padding: 2px 9px;
+  font-size: 11px;
+  font-weight: 500;
+  line-height: 18px;
+  border-radius: 999px;
+}
+
+.rd-status {
+  display: inline-flex;
+  gap: 5px;
+  align-items: center;
+  font-size: 13px;
+  font-weight: 600;
+}
+
+.rd-status__dot {
+  width: 7px;
+  height: 7px;
+  border-radius: 50%;
+}
+
+.rd-extra {
+  padding: 8px 10px;
+  margin-top: 10px;
+  font-size: 12px;
+  line-height: 1.8;
+  color: hsl(var(--warning, 38 92% 50%));
+  background: hsl(var(--warning, 38 92% 50%) / 10%);
+  border-radius: 8px;
+}
+</style>
diff --git a/apps/web-antd/src/views/business/order/register/components/RegisterOrderCardList.vue b/apps/web-antd/src/views/business/order/register/components/RegisterOrderCardList.vue
new file mode 100644
index 00000000..f86831cd
--- /dev/null
+++ b/apps/web-antd/src/views/business/order/register/components/RegisterOrderCardList.vue
@@ -0,0 +1,568 @@
+<script lang="ts" setup>
+/**
+ * 挂号订单卡片看板（C 端紧凑排版 + Apple 毛玻璃）：与列表视图展示同一批字段，仅排版不同
+ *
+ * 与商品/处方订单卡片同一套设计语言：多列自适应网格、毛玻璃 14px 圆角 hairline 卡片、
+ * 状态彩点、tinted 小胶囊、人员信息内联行、底部 hairline 操作栏。
+ * 点击卡片主体打开挂号详情弹窗（就诊人/用户/诊所/医生/挂号方式/价格）。
+ * 数据自取：props.formValues 变化时重置到第 1 页，触底自动加载下一页。
+ */
+import type { ActionItem } from '#/components/table-action';
+
+import { computed, nextTick, onBeforeUnmount, onMounted, ref, watch } from 'vue';
+
+import { Empty, Image, message, Spin } from 'ant-design-vue';
+
+import { TableAction } from '#/components/table-action';
+import { pillStyle, tagColorHex } from '#/utils/tagColor';
+
+import { getRegisterListApi } from '../api';
+import {
+  REGISTER_REFUND_STATUS_MAP,
+  REGISTER_STATUS_MAP,
+  REGISTER_TYPE_MAP,
+} from '../config/constants';
+
+const props = defineProps<{
+  /** 顶部统一搜索条件（含 patient_keyword / doctor_keyword / type / is_pay 等） */
+  formValues?: Record<string, any>;
+  /** 是否可退款（与列表行操作同一份判定，父级传入保证口径一致） */
+  canRefund: (row: Record<string, any>) => boolean;
+}>();
+
+const emit = defineEmits<{
+  /** 点卡片打开挂号详情弹窗 */
+  openDetail: [row: Record<string, any>];
+  /** 退款（复用父级退款弹窗） */
+  refund: [registerId: number];
+  /** 点处方号打开处方详情 */
+  openPrescription: [prescriptionId: number];
+  /** 点诊所名打开诊所卡片 */
+  openStore: [storeId: number];
+}>();
+
+const items = ref<any[]>([]);
+const page = ref(1);
+const pageCount = ref(1);
+const loading = ref(false);
+const loadingMore = ref(false);
+/** 请求序号：只应用最后一次响应，避免快速改筛选时旧结果覆盖新列表 */
+let requestSeq = 0;
+
+const scrollEl = ref<HTMLElement | null>(null);
+const sentinelEl = ref<HTMLElement | null>(null);
+let observer: IntersectionObserver | null = null;
+
+const hasMore = computed(() => page.value < pageCount.value);
+
+/** 挂号方式元数据 */
+function typeMeta(row: Record<string, any>) {
+  return REGISTER_TYPE_MAP[Number(row?.type)] ?? null;
+}
+
+/** 挂号状态元数据 */
+function statusMeta(row: Record<string, any>) {
+  return REGISTER_STATUS_MAP[Number(row?.status)] ?? null;
+}
+
+/** 退款状态元数据（未退款不显示胶囊，减少噪音） */
+function refundMeta(row: Record<string, any>) {
+  const meta = REGISTER_REFUND_STATUS_MAP[Number(row?.refund_status)];
+  return meta && Number(row?.refund_status) !== 0 ? meta : null;
+}
+
+/** 挂号价格格式化（非法值显示占位符，¥ 符号由模板单独渲染） */
+function money(value: unknown) {
+  const n = Number(value);
+  return Number.isFinite(n) ? n.toFixed(2) : '—';
+}
+
+/** 行操作：退款（显隐与列表一致），通过 emit 复用父级弹窗 */
+function buildActions(row: Record<string, any>): ActionItem[] {
+  return [
+    {
+      label: '详情',
+      type: 'link',
+      icon: 'marketeq:eye',
+      onClick: () => emit('openDetail', row),
+    },
+    {
+      label: '退款',
+      type: 'link',
+      icon: 'mingcute:refund-dollar-fill',
+      ifShow: props.canRefund(row),
+      onClick: () => emit('refund', Number(row.id)),
+    },
+  ];
+}
+
+/**
+ * 拉取一页数据；reset 时清空列表并回到第 1 页
+ * 用 requestSeq 丢弃过期响应，防止筛选连点时旧条件结果覆盖新条件
+ */
+async function fetchPage(targetPage: number, reset = false) {
+  const seq = ++requestSeq;
+  if (reset) {
+    loading.value = true;
+  } else {
+    loadingMore.value = true;
+  }
+  try {
+    const res: any = await getRegisterListApi({
+      page: targetPage,
+      pageSize: 12,
+      ...(props.formValues || {}),
+    });
+    if (seq !== requestSeq) return;
+    items.value = reset ? (res?.items ?? []) : [...items.value, ...(res?.items ?? [])];
+    page.value = res?.page ?? targetPage;
+    pageCount.value = res?.page_count ?? 1;
+  } catch (error) {
+    if (seq !== requestSeq) return;
+    console.error(error);
+    message.error('加载挂号列表失败');
+  } finally {
+    if (seq === requestSeq) {
+      loading.value = false;
+      loadingMore.value = false;
+    }
+  }
+}
+
+/** 筛选条件变化：重置回第 1 页 */
+async function reload() {
+  page.value = 1;
+  items.value = [];
+  await fetchPage(1, true);
+}
+
+/** 操作后原地刷新：按已加载条数一次性重拉，保持滚动位置 */
+async function refreshKeepPage() {
+  const loaded = Math.max(items.value.length, 12);
+  const seq = ++requestSeq;
+  loading.value = true;
+  try {
+    const res: any = await getRegisterListApi({
+      page: 1,
+      pageSize: loaded,
+      ...(props.formValues || {}),
+    });
+    if (seq !== requestSeq) return;
+    items.value = res?.items ?? [];
+    page.value = Math.ceil((res?.items?.length ?? 0) / 12) || 1;
+    pageCount.value = Math.ceil((res?.total ?? 0) / 12) || 1;
+  } catch (error) {
+    if (seq === requestSeq) console.error(error);
+  } finally {
+    if (seq === requestSeq) loading.value = false;
+  }
+}
+
+defineExpose({ reload, refreshKeepPage });
+
+async function loadMore() {
+  if (!hasMore.value || loading.value || loadingMore.value) return;
+  await fetchPage(page.value + 1, false);
+}
+
+/** 触底哨兵：滚动到底部附近自动加载下一页 */
+function setupObserver() {
+  observer?.disconnect();
+  if (!sentinelEl.value) return;
+  observer = new IntersectionObserver(
+    (entries) => {
+      if (entries.some((e) => e.isIntersecting)) {
+        void loadMore();
+      }
+    },
+    { root: scrollEl.value, rootMargin: '120px' },
+  );
+  observer.observe(sentinelEl.value);
+}
+
+watch(
+  () => props.formValues,
+  () => {
+    void reload();
+  },
+  { deep: true },
+);
+
+onMounted(async () => {
+  await reload();
+  await nextTick();
+  setupObserver();
+});
+
+onBeforeUnmount(() => {
+  observer?.disconnect();
+  observer = null;
+});
+</script>
+
+<template>
+  <div ref="scrollEl" class="rg-card-scroll">
+    <Spin :spinning="loading">
+      <div v-if="items.length" class="rg-card-grid">
+        <div
+          v-for="row in items"
+          :key="row.id"
+          class="rg-card"
+          role="button"
+          tabindex="0"
+          @click="emit('openDetail', row)"
+          @keydown.enter="emit('openDetail', row)"
+        >
+          <!-- 角落径向荧光（与提现管理统计岛同款质感装饰） -->
+          <div class="rg-card__glow" />
+          <!-- 头部：诊所名（可点）+ 状态彩点 -->
+          <div class="rg-card__head">
+            <button
+              v-if="row.store?.id || row.store_id"
+              type="button"
+              class="rg-card__store"
+              @click.stop="emit('openStore', Number(row.store?.id || row.store_id))"
+            >
+              <span class="rg-card__store-name">{{ row.store?.name || '—' }}</span>
+              <span class="rg-card__store-arrow">›</span>
+            </button>
+            <span v-else class="rg-card__store-name">{{ row.store?.name || '—' }}</span>
+            <span
+              v-if="statusMeta(row)"
+              class="rg-card__status"
+              :style="{ color: tagColorHex(statusMeta(row)!.color) }"
+            >
+              <i
+                class="rg-card__status-dot"
+                :style="{ background: tagColorHex(statusMeta(row)!.color) }"
+              ></i>
+              {{ statusMeta(row)!.label }}
+            </span>
+          </div>
+          <!-- 订单号 / 创建时间 -->
+          <div class="rg-card__sub">
+            <span class="truncate">{{ row.order_no || '—' }}</span>
+            <span class="rg-card__dot">·</span>
+            <span class="shrink-0">{{ row.created_at || '—' }}</span>
+          </div>
+          <!-- 语义胶囊行：挂号方式/支付/退款，右侧挂号费金额（C 端惯例右上金额） -->
+          <div class="rg-card__pills">
+            <span v-if="typeMeta(row)" class="rg-pill" :style="pillStyle(typeMeta(row)!.color)">
+              {{ typeMeta(row)!.label }}
+            </span>
+            <span class="rg-pill" :style="pillStyle(row.is_pay === 1 ? 'green' : 'red')">
+              {{ row.is_pay === 1 ? '已支付' : '未支付' }}
+            </span>
+            <span v-if="refundMeta(row)" class="rg-pill" :style="pillStyle(refundMeta(row)!.color)">
+              {{ refundMeta(row)!.label }}
+            </span>
+            <span class="rg-card__amount-value"><i>¥</i>{{ money(row.price) }}</span>
+          </div>
+          <!-- 医生/科室/就诊人/推广员：内联小字行（省高度） -->
+          <div class="rg-card__people">
+            <span class="rg-kv">
+              <i>医生</i>
+              <em>{{ row.doctor_info?.name || '—' }}</em>
+            </span>
+            <span class="rg-kv">
+              <i>科室</i>
+              <em>{{ row.doctor_info?.depart?.name || '—' }}</em>
+            </span>
+            <span class="rg-kv">
+              <i>就诊人</i>
+              <em>{{ row.user_patient?.name || '—' }}</em>
+            </span>
+            <span class="rg-kv">
+              <i>推广</i>
+              <em class="rg-card__salesperson">
+                <Image
+                  v-if="row.salesperson?.id"
+                  :src="row.salesperson.avatar || '/img/user-default-avatar.png'"
+                  :width="16"
+                  :height="16"
+                  :preview="false"
+                  class="shrink-0 rounded-full object-cover"
+                  @click.stop
+                />
+                {{ row.salesperson?.nick_name || '无' }}
+              </em>
+            </span>
+          </div>
+          <!-- 关联处方（有才显示） -->
+          <div v-if="Array.isArray(row.prescription) && row.prescription.length" class="rg-card__rx">
+            <button
+              v-for="item in row.prescription"
+              :key="item.id"
+              type="button"
+              class="rg-card__rx-chip"
+              @click.stop="emit('openPrescription', Number(item.id))"
+            >
+              {{ item.prescription_no }}
+            </button>
+          </div>
+          <!-- 弹性占位：高度富余时把 footer 推到底（同行等高卡对齐），紧凑时保底 8px 间距 -->
+          <div class="rg-card__spacer"></div>
+          <!-- 底部操作：详情/退款（阻止冒泡避免触发卡片点击） -->
+          <div class="rg-card__footer" @click.stop>
+            <TableAction :actions="buildActions(row)" :drop-down-actions="[]" />
+          </div>
+        </div>
+      </div>
+      <Empty v-else-if="!loading" description="暂无挂号订单" />
+    </Spin>
+    <div ref="sentinelEl" class="h-8"></div>
+    <div v-if="loadingMore" class="py-3 text-center text-xs text-[hsl(var(--muted-foreground))]">
+      加载中…
+    </div>
+    <div
+      v-else-if="items.length && !hasMore"
+      class="py-3 text-center text-xs text-[hsl(var(--muted-foreground))]"
+    >
+      没有更多了
+    </div>
+  </div>
+</template>
+
+<style scoped>
+.rg-card-scroll {
+  height: 100%;
+  /* 左右留 6px：通栏卡片 hover 阴影不被容器裁出切边 */
+  padding: 4px 6px 20px;
+  overflow: auto;
+}
+
+/* 多列自适应网格：单卡最窄 340px，宽屏自动 2-4 列（C 端紧凑卡片密度）；
+   min(340px, 100%) 防止窄容器（分屏）时轨道小于容器导致横向滚动 */
+.rg-card-grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(min(340px, 100%), 1fr));
+  gap: 10px;
+}
+
+/* 玻璃质感紧凑卡片（与提现管理统计岛同款）：主色渐变玻璃底 + 12px 圆角 + 1px 边框；整卡可点看详情（禁止左侧竖色条） */
+.rg-card {
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
+  cursor: pointer;
+  background: linear-gradient(
+    135deg,
+    hsl(var(--primary) / 4%),
+    hsl(var(--card, var(--background)))
+  );
+  backdrop-filter: blur(8px);
+  border: 1px solid hsl(var(--border));
+  border-radius: 12px;
+  transition:
+    transform 0.2s ease,
+    box-shadow 0.2s ease,
+    border-color 0.2s ease;
+}
+
+.rg-card:hover {
+  border-color: hsl(var(--primary) / 40%);
+  box-shadow:
+    0 8px 20px hsl(var(--primary) / 14%),
+    0 2px 6px rgb(0 0 0 / 6%);
+  transform: translateY(-3px);
+}
+
+/* 角落径向荧光：右上角淡主色光斑，hover 增强 */
+.rg-card__glow {
+  position: absolute;
+  top: -40px;
+  right: -40px;
+  width: 110px;
+  height: 110px;
+  pointer-events: none;
+  background: radial-gradient(circle, hsl(var(--primary) / 18%) 0%, transparent 70%);
+  opacity: 0.4;
+  transition: opacity 0.2s ease;
+}
+
+.rg-card:hover .rg-card__glow {
+  opacity: 1;
+}
+
+.rg-card__head {
+  display: flex;
+  gap: 8px;
+  align-items: center;
+  padding: 10px 12px 0;
+}
+
+.rg-card__store {
+  display: inline-flex;
+  min-width: 0;
+  align-items: center;
+  gap: 2px;
+  padding: 0;
+  cursor: pointer;
+  background: none;
+  border: none;
+}
+
+.rg-card__store-name {
+  overflow: hidden;
+  font-size: 14px;
+  font-weight: 600;
+  letter-spacing: -0.2px;
+  color: hsl(var(--foreground));
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.rg-card__store:hover .rg-card__store-name {
+  color: hsl(var(--primary));
+}
+
+.rg-card__store-arrow {
+  flex-shrink: 0;
+  font-size: 14px;
+  color: hsl(var(--muted-foreground));
+}
+
+.rg-card__status {
+  display: inline-flex;
+  flex-shrink: 0;
+  gap: 4px;
+  align-items: center;
+  margin-left: auto;
+  font-size: 12px;
+  font-weight: 600;
+}
+
+.rg-card__status-dot {
+  width: 6px;
+  height: 6px;
+  border-radius: 50%;
+}
+
+.rg-card__sub {
+  display: flex;
+  gap: 4px;
+  align-items: center;
+  padding: 1px 12px 0;
+  font-size: 11px;
+  color: hsl(var(--muted-foreground));
+}
+
+.rg-card__dot {
+  flex-shrink: 0;
+}
+
+/* 胶囊行：左胶囊右金额（金额 margin-left:auto 顶到行尾） */
+.rg-card__pills {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 4px;
+  align-items: center;
+  padding: 6px 12px 0;
+}
+
+.rg-pill {
+  display: inline-flex;
+  align-items: center;
+  padding: 1px 7px;
+  font-size: 10px;
+  font-weight: 500;
+  line-height: 16px;
+  border: none;
+  border-radius: 999px;
+}
+
+/* 医生/科室/就诊人/推广员内联行 */
+.rg-card__people {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 2px 14px;
+  padding: 7px 12px 0;
+  font-size: 12px;
+  line-height: 1.6;
+}
+
+.rg-kv {
+  display: inline-flex;
+  gap: 4px;
+  align-items: baseline;
+  min-width: 0;
+}
+
+.rg-kv > i {
+  flex-shrink: 0;
+  font-size: 11px;
+  font-style: normal;
+  color: hsl(var(--muted-foreground) / 75%);
+}
+
+.rg-kv > em {
+  overflow: hidden;
+  font-style: normal;
+  font-weight: 500;
+  color: hsl(var(--foreground));
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.rg-card__salesperson {
+  display: inline-flex;
+  gap: 4px;
+  align-items: center;
+}
+
+/* 关联处方 chips */
+.rg-card__rx {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 4px;
+  padding: 6px 12px 0;
+}
+
+.rg-card__rx-chip {
+  padding: 1px 8px;
+  font-size: 11px;
+  color: hsl(var(--primary));
+  cursor: pointer;
+  background: hsl(var(--primary) / 8%);
+  border: 1px solid hsl(var(--primary) / 25%);
+  border-radius: 999px;
+  transition: box-shadow 0.15s ease;
+}
+
+.rg-card__rx-chip:hover {
+  box-shadow: 0 0 6px hsl(var(--primary) / 18%);
+}
+
+/* 挂号费金额：胶囊行右侧（DIN 等宽数字，与提现管理统计岛同款字体质感） */
+.rg-card__amount-value {
+  margin-left: auto;
+  font-family: 'DIN Alternate', ui-monospace, SFMono-Regular, Menlo, monospace;
+  font-size: 16px;
+  font-weight: 700;
+  letter-spacing: -0.3px;
+  color: hsl(var(--foreground));
+}
+
+.rg-card__amount-value i {
+  margin-right: 1px;
+  font-size: 11px;
+  font-style: normal;
+  font-weight: 600;
+}
+
+/* 弹性占位：吃掉剩余高度让 footer 吸底（同行等高卡操作栏对齐） */
+.rg-card__spacer {
+  flex: 1 1 auto;
+  min-height: 8px;
+}
+
+/* 底部操作栏 */
+.rg-card__footer {
+  display: flex;
+  justify-content: flex-end;
+  padding: 4px 6px;
+  cursor: default;
+  border-top: 1px solid hsl(var(--border) / 50%);
+}
+</style>
diff --git a/apps/web-antd/src/views/business/order/register/config/constants.ts b/apps/web-antd/src/views/business/order/register/config/constants.ts
new file mode 100644
index 00000000..7855c0b4
--- /dev/null
+++ b/apps/web-antd/src/views/business/order/register/config/constants.ts
@@ -0,0 +1,65 @@
+/**
+ * 挂号订单模块字典常量
+ * 列表 Tag 槽、卡片视图、详情弹窗、搜索下拉共用同一份映射，避免语义漂移
+ */
+export interface TagMeta {
+  color: string;
+  label: string;
+}
+
+/** 挂号方式（RegisterTypeEnum 口径：0线下 1在线问诊 2诊所在线复诊 3药店在线复诊） */
+export const REGISTER_TYPE_MAP: Record<number, TagMeta> = {
+  0: { label: '线下就诊', color: 'purple' },
+  1: { label: '在线问诊', color: 'blue' },
+  2: { label: '在线复诊（诊所）', color: 'green' },
+  3: { label: '在线复诊（药店）', color: 'green' },
+};
+
+/** 挂号状态（yii_register.status：0待支付1待接诊2接诊中3已结束4已取消5待评价6已评价7已拒诊） */
+export const REGISTER_STATUS_MAP: Record<number, TagMeta> = {
+  0: { label: '待支付', color: 'red' },
+  1: { label: '待接诊', color: 'orange' },
+  2: { label: '接诊中', color: 'blue' },
+  3: { label: '已结束', color: 'default' },
+  4: { label: '已取消', color: 'default' },
+  5: { label: '待评价', color: 'purple' },
+  6: { label: '已评价', color: 'purple' },
+  7: { label: '已拒诊', color: 'red' },
+};
+
+/** 退款状态（列表页口径：1退款中 3已退款） */
+export const REGISTER_REFUND_STATUS_MAP: Record<number, TagMeta> = {
+  0: { label: '未退款', color: 'default' },
+  1: { label: '退款中', color: 'pink' },
+  2: { label: '已拒绝', color: 'red' },
+  3: { label: '已退款', color: 'green' },
+};
+
+/** 支付方式（yii_register.pay_type：1微信 2易票联） */
+export const REGISTER_PAY_TYPE_MAP: Record<number, string> = {
+  1: '微信支付',
+  2: '易票联支付',
+};
+
+/** 搜索下拉：挂号类型选项（由映射生成，保证与展示同语义） */
+export const REGISTER_TYPE_OPTIONS = Object.entries(REGISTER_TYPE_MAP).map(
+  ([value, meta]) => ({ label: meta.label, value: Number(value) }),
+);
+
+/** 搜索下拉：支付状态选项 */
+export const REGISTER_IS_PAY_OPTIONS = [
+  { label: '已支付', value: 1 },
+  { label: '未支付', value: 0 },
+];
+
+/** 搜索下拉：挂号状态选项（由状态映射生成，避免手写重复） */
+export const REGISTER_STATUS_OPTIONS = Object.entries(REGISTER_STATUS_MAP).map(
+  ([value, meta]) => ({ label: meta.label, value: Number(value) }),
+);
+
+/** 搜索下拉：退款状态选项（挂号退款无「拒绝」流程，只提供实际会出现的值） */
+export const REGISTER_REFUND_STATUS_OPTIONS = [
+  { label: '未退款', value: 0 },
+  { label: '退款中', value: 1 },
+  { label: '已退款', value: 3 },
+];
diff --git a/apps/web-antd/src/views/business/order/register/config/search.ts b/apps/web-antd/src/views/business/order/register/config/search.ts
index 48e3003a..e3e60b94 100644
--- a/apps/web-antd/src/views/business/order/register/config/search.ts
+++ b/apps/web-antd/src/views/business/order/register/config/search.ts
@@ -2,20 +2,29 @@ import type { VbenFormProps } from '#/adapter/form';
 
 import dayjs from 'dayjs';
 
+import {
+  REGISTER_IS_PAY_OPTIONS,
+  REGISTER_REFUND_STATUS_OPTIONS,
+  REGISTER_STATUS_OPTIONS,
+  REGISTER_TYPE_OPTIONS,
+} from './constants';
+
 export const formOptions: VbenFormProps = {
-  // 默认展开
-  collapsed: false,
+  // 默认收起只显示第一行，点「展开」看全部筛选（字段多，全展开太占高度）
+  collapsed: true,
+  commonConfig: {
+    // label 默认 100px，本页筛选名最长 4 字，收窄到 70px 让控件占满格子（否则控件被挤得只剩一半宽）
+    labelWidth: 70,
+    // antd Select/RangePicker 默认按内容收缩，统一撑满格子，保证一行里各控件等宽整齐
+    componentProps: {
+      class: 'w-full',
+    },
+  },
+  // 响应式多列：抽出 grid 后 vben form 默认单列（一行一个字段），必须显式给栅格
+  wrapperClass: 'grid-cols-1 sm:grid-cols-2 md:grid-cols-3 xl:grid-cols-4 2xl:grid-cols-5',
   schema: [
     {
-      component: 'VbenInput',
-      componentProps: {
-        placeholder: '输入订单号',
-      },
-      defaultValue: '',
-      fieldName: 'order_no',
-      label: '订单号',
-    },
-    {
+      // 放第一位：时间范围有默认值（本月至今），默认收起时必须始终可见，否则用户不知道当前查的是哪段数据
       component: 'RangePicker',
       componentProps: {
         format: 'YYYY-MM-DD',
@@ -29,15 +38,87 @@ export const formOptions: VbenFormProps = {
       fieldName: 'search_time',
       label: '时间范围',
     },
+    {
+      // 统一 antd 系控件：与下拉/日期控件同一套视觉（此前 VbenInput 是 shadcn 风格，高度圆角不一致）
+      component: 'Input',
+      componentProps: {
+        allowClear: true,
+        placeholder: '输入订单号',
+      },
+      defaultValue: '',
+      fieldName: 'order_no',
+      label: '订单号',
+    },
+    {
+      // 就诊人姓名/手机号模糊（后端 PersonKeywordScopeService，whereHas 关联表）
+      component: 'Input',
+      componentProps: {
+        allowClear: true,
+        placeholder: '姓名/手机号',
+      },
+      fieldName: 'patient_keyword',
+      label: '就诊人',
+    },
+    {
+      // 医生姓名/手机号模糊（后端 PersonKeywordScopeService）
+      component: 'Input',
+      componentProps: {
+        allowClear: true,
+        placeholder: '姓名/手机号',
+      },
+      fieldName: 'doctor_keyword',
+      label: '医生',
+    },
+    {
+      // 挂号类型（后端 queryField 等值匹配）
+      component: 'Select',
+      componentProps: {
+        allowClear: true,
+        options: REGISTER_TYPE_OPTIONS,
+        placeholder: '请选择',
+      },
+      fieldName: 'type',
+      label: '挂号类型',
+    },
+    {
+      // 支付状态
+      component: 'Select',
+      componentProps: {
+        allowClear: true,
+        options: REGISTER_IS_PAY_OPTIONS,
+        placeholder: '请选择',
+      },
+      fieldName: 'is_pay',
+      label: '支付状态',
+    },
+    {
+      // 挂号状态
+      component: 'Select',
+      componentProps: {
+        allowClear: true,
+        options: REGISTER_STATUS_OPTIONS,
+        placeholder: '请选择',
+      },
+      fieldName: 'status',
+      label: '状态',
+    },
+    {
+      // 退款状态
+      component: 'Select',
+      componentProps: {
+        allowClear: true,
+        options: REGISTER_REFUND_STATUS_OPTIONS,
+        placeholder: '请选择',
+      },
+      fieldName: 'refund_status',
+      label: '退款状态',
+    },
   ],
   // 控制表单是否显示折叠按钮
   showCollapseButton: true,
   submitButtonOptions: {
     content: '查询',
   },
-  // 是否在字段值改变时提交表单
-  // submitOnChange: true,
-  // submitOnChange: true,
-  // 按下回车时是否提交表单
+  // 任意输入框回车即搜索；下拉面板打开时的回车只选中选项（core 层已处理），第二次回车才搜索
   submitOnEnter: true,
 };
diff --git a/apps/web-antd/src/views/business/order/register/config/table.ts b/apps/web-antd/src/views/business/order/register/config/table.ts
index d10cf98a..19a10d1c 100644
--- a/apps/web-antd/src/views/business/order/register/config/table.ts
+++ b/apps/web-antd/src/views/business/order/register/config/table.ts
@@ -68,7 +68,7 @@ export const gridOptions: VxeGridProps<RegisterOrderItem> = {
     // custom: true, // 自定义列
     zoom: true, // 最大化最小化
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
     custom: {
       // 自定义列-图标
diff --git a/apps/web-antd/src/views/business/order/register/index.vue b/apps/web-antd/src/views/business/order/register/index.vue
index 86bd12c2..ff72db51 100644
--- a/apps/web-antd/src/views/business/order/register/index.vue
+++ b/apps/web-antd/src/views/business/order/register/index.vue
@@ -1,44 +1,177 @@
 <script lang="ts" setup>
-import type { VxeGridListeners } from "#/adapter/vxe-table";
+/**
+ * 挂号订单管理页
+ *
+ * 支持「列表 / 卡片」双视图切换（通用 ViewModeSwitch + useViewMode 记忆偏好）：
+ * - 搜索表单从 grid 内嵌拆出为顶部统一 SearchForm，双视图共用同一份条件
+ * - 新增就诊人/医生关键字、挂号类型、支付/挂号/退款状态筛选
+ * - 点击卡片或行内「详情」打开挂号详情弹窗（就诊人/用户/诊所/医生/挂号方式/价格）
+ */
+import type { VbenFormProps } from '#/adapter/form';
+import type { VxeGridListeners } from '#/adapter/vxe-table';
 
-import { nextTick, onMounted, ref } from "vue";
-import { useRoute } from "vue-router";
+import { ref, watch } from 'vue';
+import { useRoute } from 'vue-router';
 
-import { Page, useVbenModal } from "@vben/common-ui";
+import { Page, useVbenModal } from '@vben/common-ui';
 
-import { Button, Image, message, Modal as AntdModal, Tag } from "ant-design-vue";
+import { Button, Image, Tag } from 'ant-design-vue';
 
-import { useVbenVxeGrid } from "#/adapter/vxe-table";
-import { TableAction } from "#/components/table-action";
-import StoreCardModal from "#/components/store-card/StoreCardModal.vue";
-import { simulatePayApi } from "#/views/business/order/api/order-ops";
-import PrescriptionDetail from "#/views/doctor/doctor-reception/components/PrescriptionDetail.vue";
+import { useVbenForm } from '#/adapter/form';
+import { useVbenVxeGrid } from '#/adapter/vxe-table';
+import { TableAction } from '#/components/table-action';
+import { useViewMode, ViewModeSwitch } from '#/components/view-mode-switch';
+import StoreCardModal from '#/components/store-card/StoreCardModal.vue';
+import PrescriptionDetail from '#/views/doctor/doctor-reception/components/PrescriptionDetail.vue';
 
-import { formOptions } from "./config/search";
-import { gridOptions } from "./config/table";
-import Refund from "./components/refund.vue";
+import { getRegisterListApi } from './api';
+import Refund from './components/refund.vue';
+import RegisterDetailModal from './components/RegisterDetailModal.vue';
+import RegisterOrderCardList from './components/RegisterOrderCardList.vue';
+import {
+  REGISTER_REFUND_STATUS_MAP,
+  REGISTER_STATUS_MAP,
+  REGISTER_TYPE_MAP,
+} from './config/constants';
+import { formOptions } from './config/search';
+import { gridOptions } from './config/table';
 
+const route = useRoute();
 const hasTopTableDropDownActions = ref(false);
 
+/** 列表/卡片双视图：通用 useViewMode 自带 localStorage 记忆 */
+const viewMode = useViewMode('register-order-view-mode');
+const cardListRef = ref<InstanceType<typeof RegisterOrderCardList> | null>(null);
+
 const gridEvents: VxeGridListeners<any> = {
   checkboxChange() {
-    // eslint-disable-next-line no-use-before-define
     const records = gridApi.grid.getCheckboxRecords();
     hasTopTableDropDownActions.value = records.length > 0;
   },
   checkboxAll() {
-    // eslint-disable-next-line no-use-before-define
     const records = gridApi.grid.getCheckboxRecords();
     hasTopTableDropDownActions.value = records.length > 0;
-  }
+  },
 };
 
-const [Grid, gridApi] = useVbenVxeGrid({
-  formOptions,
-  gridOptions,
-  gridEvents
+/**
+ * 从路由 query 生成带默认值的表单配置
+ * 商品订单页「挂号金额」跳转会带 order_no，写进 schema defaultValue 让双视图首屏直接生效
+ */
+function buildFormOptionsFromRoute(): VbenFormProps {
+  const raw = route.query.order_no;
+  const orderNo = Array.isArray(raw) ? raw[0] : raw;
+  if (!orderNo) {
+    return formOptions;
+  }
+  const schema = (formOptions.schema ?? []).map((item) => {
+    if (item.fieldName === 'order_no') {
+      return { ...item, defaultValue: String(orderNo) };
+    }
+    // 指定订单号查询时放开默认时间范围，避免历史订单被本月范围滤掉
+    if (item.fieldName === 'search_time') {
+      return { ...item, defaultValue: null };
+    }
+    return item;
+  });
+  return { ...formOptions, schema };
+}
+
+/** 生效的搜索表单配置（含路由 order_no 默认值注入） */
+const effectiveFormOptions = buildFormOptionsFromRoute();
+
+/**
+ * 从 schema 提取 defaultValue 作为首屏搜索条件
+ * 双视图首屏都要带默认时间范围，保证查询口径与表单显示一致
+ */
+function collectDefaultSearchValues(): Record<string, any> {
+  const values: Record<string, any> = {};
+  for (const item of effectiveFormOptions.schema ?? []) {
+    if (item.fieldName && item.defaultValue !== undefined) {
+      values[item.fieldName] = item.defaultValue;
+    }
+  }
+  return values;
+}
+
+/** 列表与卡片共用的搜索条件（提交/重置时整体替换，卡片靠 watch 自动拉数） */
+const searchValues = ref<Record<string, any>>(collectDefaultSearchValues());
+
+/**
+ * 顶部统一搜索表单（从 grid 内嵌表单抽出，双视图共用）
+ * 列表模式提交后 reload 回第 1 页；卡片模式由 formValues watch 自动拉数
+ */
+const [SearchForm, searchFormApi] = useVbenForm({
+  ...effectiveFormOptions,
+  handleSubmit: async (values) => {
+    searchValues.value = { ...(values || {}) };
+    if (viewMode.value === 'list') {
+      gridApi.reload();
+    }
+  },
+  handleReset: async () => {
+    // 自定义 handleReset 会接管默认行为，必须手动还原控件到 defaultValue（reset 为新 API，resetForm 已弃用）
+    await searchFormApi.reset();
+    searchValues.value = collectDefaultSearchValues();
+    if (viewMode.value === 'list') {
+      gridApi.reload();
+    }
+  },
 });
 
+const [Grid, gridApi] = useVbenVxeGrid({
+  gridOptions: {
+    ...gridOptions,
+    // 搜索已抽出为顶部统一表单，关闭 grid 自带的表单开关按钮
+    toolbarConfig: { ...gridOptions.toolbarConfig, search: false },
+    proxyConfig: {
+      ajax: {
+        /** 始终合并顶部统一搜索条件 */
+        query: async ({ page }: { page: { currentPage: number; pageSize: number } }) => {
+          return await getRegisterListApi({
+            page: page.currentPage,
+            pageSize: page.pageSize,
+            ...searchValues.value,
+          });
+        },
+      },
+    },
+  },
+  gridEvents,
+});
+
+// 记忆持久化由 useViewMode 内部完成；切回列表时 grid 被 v-if 卸载过需主动重查
+watch(viewMode, (mode, prev) => {
+  if (mode === 'list' && prev === 'card') {
+    gridApi.query();
+  }
+});
+
+/** 操作成功后的视图刷新：列表保当前页，卡片原地重拉已加载范围 */
+async function refreshCurrentView() {
+  await (viewMode.value === 'list'
+    ? gridApi.query()
+    : cardListRef.value?.refreshKeepPage?.());
+}
+
+/** 回第 1 页的强刷新（退款弹窗内部 reload 语义） */
+function refreshCurrentViewFromPageOne() {
+  if (viewMode.value === 'list') {
+    gridApi.reload();
+  } else {
+    cardListRef.value?.reload?.();
+  }
+}
+
+/**
+ * 传给退款弹窗的 gridApi 代理：弹窗内部只会调 reload()/query()，
+ * 卡片模式下需要转发给卡片列表，故不能直接把 gridApi 传进去
+ */
+const gridApiProxy = {
+  reload: () => refreshCurrentViewFromPageOne(),
+  query: () => refreshCurrentView(),
+};
+
 const [StoreCardModalComp, StoreCardModalApi] = useVbenModal({
   connectedComponent: StoreCardModal,
 });
@@ -49,55 +182,37 @@ function openStoreCard(storeId?: number) {
   StoreCardModalApi.open();
 }
 
-const route = useRoute();
-
-onMounted(() => {
-  void nextTick(async () => {
-    const raw = route.query.order_no;
-    const orderNo = Array.isArray(raw) ? raw[0] : raw;
-    if (!orderNo || !gridApi.formApi?.setValues) {
-      return;
-    }
-    await gridApi.formApi.setValues({ order_no: String(orderNo) });
-    await gridApi.query();
-  });
-});
-
 const [PrescriptionDetailModal, PrescriptionDetailModalApi] = useVbenModal({
-  connectedComponent: PrescriptionDetail
+  connectedComponent: PrescriptionDetail,
 });
 
 const [RefundModal, RefundModalApi] = useVbenModal({
-  connectedComponent: Refund
+  connectedComponent: Refund,
 });
 
+/** 挂号详情弹窗：列表行「详情」与卡片点击共用 */
+const [RegisterDetailModalComp, registerDetailModalApi] = useVbenModal({
+  connectedComponent: RegisterDetailModal,
+});
+
+function openRegisterDetail(row: Record<string, any>) {
+  registerDetailModalApi.setData({ row });
+  registerDetailModalApi.open();
+}
+
 function openPrescriptionDetail(id: number) {
   PrescriptionDetailModalApi.setData({
-    values: id
+    values: id,
   });
   PrescriptionDetailModalApi.open();
 }
 
-function handleSimulatePay(row: Record<string, any>) {
-  AntdModal.confirm({
-    title: "模拟支付",
-    content: `确认为挂号订单 ${row.order_no} 模拟易票联支付回调？`,
-    okText: "确认",
-    cancelText: "取消",
-    onOk: async () => {
-      await simulatePayApi({ order_type: "register", order_id: row.id });
-      message.success("模拟支付成功");
-      await gridApi.query();
-    }
-  });
-}
-
 function openRefundModal(id: number) {
   RefundModalApi.setData({
     values: {
-      register_id: id
+      register_id: id,
     },
-    gridApi
+    gridApi: gridApiProxy,
   });
   RefundModalApi.open();
 }
@@ -109,10 +224,26 @@ function canRefund(row: Record<string, any>) {
 function formatRegisterPrice(price: unknown) {
   const n = Number(price);
   if (!Number.isFinite(n)) {
-    return "—";
+    return '—';
   }
   return `¥${n.toFixed(2)}`;
 }
+
+/** 列表槽用元数据取值 helper：v-if 双重索引无法类型收窄，统一在这里兜底 */
+function rowTypeMeta(row: Record<string, any>) {
+  return REGISTER_TYPE_MAP[Number(row?.type)] ?? null;
+}
+function rowStatusMeta(row: Record<string, any>) {
+  return REGISTER_STATUS_MAP[Number(row?.status)] ?? null;
+}
+function rowRefundMeta(row: Record<string, any>) {
+  return (
+    REGISTER_REFUND_STATUS_MAP[Number(row?.refund_status ?? 0)] ?? {
+      label: '未退款',
+      color: 'default',
+    }
+  );
+}
 </script>
 
 <template>
@@ -120,13 +251,25 @@ function formatRegisterPrice(price: unknown) {
     <PrescriptionDetailModal />
     <RefundModal />
     <StoreCardModalComp />
-    <Grid>
-      <template #toolbar-buttons>
+    <!-- 挂号详情弹窗：处方号/诊所名点击透传到已有弹窗 -->
+    <RegisterDetailModalComp
+      @open-prescription="openPrescriptionDetail"
+      @open-store="openStoreCard"
+    />
+    <!-- 顶部统一搜索（双视图共用，替代原 grid 内嵌表单） -->
+    <div class="mb-3 rounded-lg border border-[hsl(var(--border))] bg-[hsl(var(--card,var(--background)))] p-3">
+      <SearchForm />
+    </div>
+    <!-- 视图切换：列表 / 卡片看板 -->
+    <div class="mb-3 flex items-center justify-between gap-3">
+      <ViewModeSwitch v-model="viewMode" />
+    </div>
+    <Grid v-if="viewMode === 'list'">
+      <template #toolbar-actions>
         <TableAction :actions="[]" :drop-down-actions="[]">
           <template #more>
             <Button style="margin-left: 16px">
               批量操作
-              <Icon icon="ant-design:down-outlined" />
             </Button>
           </template>
         </TableAction>
@@ -139,9 +282,9 @@ function formatRegisterPrice(price: unknown) {
           class="!px-0"
           @click="openStoreCard(row.store?.id || row.store_id)"
         >
-          {{ row.store?.name || "—" }}
+          {{ row.store?.name || '—' }}
         </Button>
-        <span v-else>{{ row.store?.name || "—" }}</span>
+        <span v-else>{{ row.store?.name || '—' }}</span>
       </template>
       <template #prescription="{ row }">
         <div v-for="item in row.prescription" :key="item.id">
@@ -158,7 +301,7 @@ function formatRegisterPrice(price: unknown) {
             :height="28"
             class="rounded-full object-cover"
           />
-          <span>{{ row.salesperson.nick_name || "—" }}</span>
+          <span>{{ row.salesperson.nick_name || '—' }}</span>
         </div>
         <span v-else class="text-sm text-gray-500">无推广员</span>
       </template>
@@ -167,38 +310,36 @@ function formatRegisterPrice(price: unknown) {
       </template>
       <template #is_pay="{ row }">
         <Tag :color="row.is_pay === 1 ? 'green' : 'red'">
-          {{ row.is_pay === 1 ? "已支付" : "未支付" }}
+          {{ row.is_pay === 1 ? '已支付' : '未支付' }}
         </Tag>
       </template>
       <template #refund_status="{ row }">
-        <Tag v-if="row.refund_status === 1" color="pink">退款中</Tag>
-        <Tag v-else-if="row.refund_status === 3" color="green">已退款</Tag>
-        <Tag v-else color="default">未退款</Tag>
+        <!-- 退款状态渲染统一走 constants 映射，与卡片/详情同语义 -->
+        <Tag :color="rowRefundMeta(row).color">
+          {{ rowRefundMeta(row).label }}
+        </Tag>
       </template>
       <template #type="{ row }">
-        <div class="mt-3">
-          <Tag v-if="row.type === 0" color="purple">线下就诊</Tag>
-          <Tag v-else-if="row.type === 1" color="blue">在线问诊</Tag>
-          <Tag v-else-if="row.type === 3" color="green">在线复诊</Tag>
-          <Tag v-else color="default">未知</Tag>
-        </div>
+        <Tag v-if="rowTypeMeta(row)" :color="rowTypeMeta(row)!.color">
+          {{ rowTypeMeta(row)!.label }}
+        </Tag>
+        <Tag v-else color="default">未知</Tag>
       </template>
       <template #status="{ row }">
-        <div class="mt-3">
-          <Tag v-if="row.status === 0" color="red">代支付</Tag>
-          <Tag v-else-if="row.status === 1" color="green">待接诊</Tag>
-          <Tag v-else-if="row.status === 2" color="red">接诊中</Tag>
-          <Tag v-else-if="row.status === 3" color="purple">已结束</Tag>
-          <Tag v-else-if="row.status === 4" color="orange">已取消</Tag>
-          <Tag v-else-if="row.status === 5" color="purple">待评价</Tag>
-          <Tag v-else-if="row.status === 6" color="purple">已评价</Tag>
-          <Tag v-else-if="row.status === 7" color="red">已拒诊</Tag>
-        </div>
+        <Tag v-if="rowStatusMeta(row)" :color="rowStatusMeta(row)!.color">
+          {{ rowStatusMeta(row)!.label }}
+        </Tag>
       </template>
       <template #toolbar-tools></template>
       <template #action="{ row }">
         <TableAction
           :actions="[
+            {
+              label: '详情',
+              type: 'link',
+              icon: 'marketeq:eye',
+              onClick: openRegisterDetail.bind(null, row),
+            },
             {
               label: '退款',
               type: 'link',
@@ -211,36 +352,25 @@ function formatRegisterPrice(price: unknown) {
         />
       </template>
     </Grid>
+    <!-- 卡片看板视图：展示内容与列表一致，点卡片看详情，弹窗复用父级 -->
+    <div v-else class="rg-card-wrap">
+      <RegisterOrderCardList
+        ref="cardListRef"
+        :form-values="searchValues"
+        :can-refund="canRefund"
+        @open-detail="openRegisterDetail"
+        @refund="openRefundModal"
+        @open-prescription="openPrescriptionDetail"
+        @open-store="openStoreCard"
+      />
+    </div>
   </Page>
 </template>
 
 <style scoped lang="scss">
-.custom-list {
-  list-style-type: none;
-  padding-left: 0;
-}
-
-.custom-list-item {
-  background-color: rgba(64, 158, 255, 0.04);
-  border-radius: 4px;
-  margin-bottom: 8px;
-  padding: 8px 12px;
-  font-size: 14px;
-  transition: background-color 0.3s;
-
-  &:hover {
-    background-color: rgba(64, 158, 255, 0.1);
-  }
-
-  &::before {
-    content: '';
-    display: inline-block;
-    width: 6px;
-    height: 6px;
-    background-color: #409eff;
-    border-radius: 50%;
-    margin-right: 8px;
-    vertical-align: middle;
-  }
+/* 卡片看板容器：撑满剩余高度，内部滚动（收起态搜索一行 + 切换行约 170px，min-height 兜底） */
+.rg-card-wrap {
+  height: calc(100% - 170px);
+  min-height: 420px;
 }
 </style>
diff --git a/apps/web-antd/src/views/business/patient-call-log-dict/config/table.ts b/apps/web-antd/src/views/business/patient-call-log-dict/config/table.ts
index 2c75f699..25f678f4 100644
--- a/apps/web-antd/src/views/business/patient-call-log-dict/config/table.ts
+++ b/apps/web-antd/src/views/business/patient-call-log-dict/config/table.ts
@@ -69,7 +69,7 @@ export const gridOptions: VxeGridProps<RowType> = {
     export: false,
     zoom: true,
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
     custom: {
       icon: 'vxe-icon-menu',
diff --git a/apps/web-antd/src/views/business/patient-call-log-dict/index.vue b/apps/web-antd/src/views/business/patient-call-log-dict/index.vue
index 01d1ade6..92175435 100644
--- a/apps/web-antd/src/views/business/patient-call-log-dict/index.vue
+++ b/apps/web-antd/src/views/business/patient-call-log-dict/index.vue
@@ -78,7 +78,7 @@ const deleteDictApi = (row: any) => {
       />
 
       <Grid>
-        <template #toolbar-buttons>
+        <template #toolbar-actions>
           <Button
             v-if="hasTopTableDropDownActions"
             danger
diff --git a/apps/web-antd/src/views/business/product/china-medicine/config/table.ts b/apps/web-antd/src/views/business/product/china-medicine/config/table.ts
index 73a3f158..be591e16 100644
--- a/apps/web-antd/src/views/business/product/china-medicine/config/table.ts
+++ b/apps/web-antd/src/views/business/product/china-medicine/config/table.ts
@@ -62,7 +62,7 @@ export const gridOptions: VxeGridProps<RowType> = {
     // custom: true, // 自定义列
     zoom: true, // 最大化最小化
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
     custom: {
       // 自定义列-图标
diff --git a/apps/web-antd/src/views/business/product/china-medicine/index.vue b/apps/web-antd/src/views/business/product/china-medicine/index.vue
index 2e20830a..04d05327 100644
--- a/apps/web-antd/src/views/business/product/china-medicine/index.vue
+++ b/apps/web-antd/src/views/business/product/china-medicine/index.vue
@@ -143,7 +143,7 @@ const openDrugNumberBatchModal = () => {
     <DrugDetailModalComp />
     <FormModal />
     <Grid>
-      <template #toolbar-buttons>
+      <template #toolbar-actions>
         <TableAction
           :actions="[
             {
diff --git a/apps/web-antd/src/views/business/product/drug-categories/config/table.ts b/apps/web-antd/src/views/business/product/drug-categories/config/table.ts
index fef06fee..2d744457 100644
--- a/apps/web-antd/src/views/business/product/drug-categories/config/table.ts
+++ b/apps/web-antd/src/views/business/product/drug-categories/config/table.ts
@@ -77,7 +77,7 @@ export const gridOptions: VxeGridProps<RowType> = {
     export: false,
     zoom: true,
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
     custom: {
       icon: 'vxe-icon-menu',
diff --git a/apps/web-antd/src/views/business/product/drug-categories/index.vue b/apps/web-antd/src/views/business/product/drug-categories/index.vue
index 2d02bcc4..36c80d9e 100644
--- a/apps/web-antd/src/views/business/product/drug-categories/index.vue
+++ b/apps/web-antd/src/views/business/product/drug-categories/index.vue
@@ -77,7 +77,7 @@ const collapseAll = () => {
   <Page auto-content-height title="商品分类管理">
     <FormModal />
     <Grid>
-      <template #toolbar-buttons>
+      <template #toolbar-actions>
         <TableAction
           :flex="false"
           :actions="[
diff --git a/apps/web-antd/src/views/business/product/health-food/config/table.ts b/apps/web-antd/src/views/business/product/health-food/config/table.ts
index 6c6c1a02..6e7b8664 100644
--- a/apps/web-antd/src/views/business/product/health-food/config/table.ts
+++ b/apps/web-antd/src/views/business/product/health-food/config/table.ts
@@ -89,7 +89,7 @@ export const gridOptions: VxeGridProps<RowType> = {
     export: false,
     zoom: true,
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
     custom: {
       icon: 'vxe-icon-menu',
diff --git a/apps/web-antd/src/views/business/product/health-food/index.vue b/apps/web-antd/src/views/business/product/health-food/index.vue
index 03683905..dde26e00 100644
--- a/apps/web-antd/src/views/business/product/health-food/index.vue
+++ b/apps/web-antd/src/views/business/product/health-food/index.vue
@@ -280,7 +280,7 @@ const openExcelUploadModal = () => {
     <CentralStockInModalComp />
     <WarehousePriceModalComp />
     <Grid>
-      <template #toolbar-buttons>
+      <template #toolbar-actions>
         <TableAction
           :flex="false"
           :actions="[
diff --git a/apps/web-antd/src/views/business/product/medical-device/config/table.ts b/apps/web-antd/src/views/business/product/medical-device/config/table.ts
index 04390b7f..659adc96 100644
--- a/apps/web-antd/src/views/business/product/medical-device/config/table.ts
+++ b/apps/web-antd/src/views/business/product/medical-device/config/table.ts
@@ -82,7 +82,7 @@ export const gridOptions: VxeGridProps<RowType> = {
     export: false,
     zoom: true,
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
     custom: {
       icon: 'vxe-icon-menu',
diff --git a/apps/web-antd/src/views/business/product/medical-device/index.vue b/apps/web-antd/src/views/business/product/medical-device/index.vue
index b4919a0e..f091aa2b 100644
--- a/apps/web-antd/src/views/business/product/medical-device/index.vue
+++ b/apps/web-antd/src/views/business/product/medical-device/index.vue
@@ -227,7 +227,7 @@ const openExcelUploadModal = () => {
     <CentralStockInModalComp />
     <WarehousePriceModalComp />
     <Grid>
-      <template #toolbar-buttons>
+      <template #toolbar-actions>
         <TableAction
           :flex="false"
           :actions="[
diff --git a/apps/web-antd/src/views/business/product/non-drug/config/table.ts b/apps/web-antd/src/views/business/product/non-drug/config/table.ts
index b0482e3e..f76fb94b 100644
--- a/apps/web-antd/src/views/business/product/non-drug/config/table.ts
+++ b/apps/web-antd/src/views/business/product/non-drug/config/table.ts
@@ -82,7 +82,7 @@ export const gridOptions: VxeGridProps<RowType> = {
     export: false,
     zoom: true,
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
     custom: {
       icon: 'vxe-icon-menu',
diff --git a/apps/web-antd/src/views/business/product/non-drug/index.vue b/apps/web-antd/src/views/business/product/non-drug/index.vue
index 23a49b61..14fb2659 100644
--- a/apps/web-antd/src/views/business/product/non-drug/index.vue
+++ b/apps/web-antd/src/views/business/product/non-drug/index.vue
@@ -223,7 +223,7 @@ const openExcelUploadModal = () => {
     <CentralStockInModalComp />
     <WarehousePriceModalComp />
     <Grid>
-      <template #toolbar-buttons>
+      <template #toolbar-actions>
         <TableAction
           :flex="false"
           :actions="[
diff --git a/apps/web-antd/src/views/business/product/service-pack/config/table.ts b/apps/web-antd/src/views/business/product/service-pack/config/table.ts
index 52791d3e..a38fbb05 100644
--- a/apps/web-antd/src/views/business/product/service-pack/config/table.ts
+++ b/apps/web-antd/src/views/business/product/service-pack/config/table.ts
@@ -82,7 +82,7 @@ export const gridOptions: VxeGridProps<RowType> = {
     export: false,
     zoom: true,
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
     custom: {
       icon: 'vxe-icon-menu',
diff --git a/apps/web-antd/src/views/business/product/service-pack/index.vue b/apps/web-antd/src/views/business/product/service-pack/index.vue
index 41eff179..a34e34b5 100644
--- a/apps/web-antd/src/views/business/product/service-pack/index.vue
+++ b/apps/web-antd/src/views/business/product/service-pack/index.vue
@@ -206,7 +206,7 @@ const deleteApi = (row: any) => {
     <CentralStockInModalComp />
     <WarehousePriceModalComp />
     <Grid>
-      <template #toolbar-buttons>
+      <template #toolbar-actions>
         <TableAction
           :actions="[
             {
diff --git a/apps/web-antd/src/views/business/product/western-medicine/config/table.ts b/apps/web-antd/src/views/business/product/western-medicine/config/table.ts
index 36cd6112..deb6786e 100644
--- a/apps/web-antd/src/views/business/product/western-medicine/config/table.ts
+++ b/apps/web-antd/src/views/business/product/western-medicine/config/table.ts
@@ -99,7 +99,7 @@ export const gridOptions: VxeGridProps<RowType> = {
     export: false,
     zoom: true,
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
     custom: {
       icon: 'vxe-icon-menu',
diff --git a/apps/web-antd/src/views/business/product/western-medicine/index.vue b/apps/web-antd/src/views/business/product/western-medicine/index.vue
index 29acbdd4..7ccd7998 100644
--- a/apps/web-antd/src/views/business/product/western-medicine/index.vue
+++ b/apps/web-antd/src/views/business/product/western-medicine/index.vue
@@ -269,7 +269,7 @@ const openExcelUploadModal = () => {
     <CentralStockInModalComp />
     <WarehousePriceModalComp />
     <Grid>
-      <template #toolbar-buttons>
+      <template #toolbar-actions>
         <TableAction
           :flex="false"
           :actions="[
diff --git a/apps/web-antd/src/views/business/special-prescription-category/config/table.ts b/apps/web-antd/src/views/business/special-prescription-category/config/table.ts
index 0c2a4c3f..10d9f72f 100644
--- a/apps/web-antd/src/views/business/special-prescription-category/config/table.ts
+++ b/apps/web-antd/src/views/business/special-prescription-category/config/table.ts
@@ -55,7 +55,7 @@ export const gridOptions: VxeGridProps<RowType> = {
     export: false,
     zoom: true,
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
     custom: {
       icon: 'vxe-icon-menu',
diff --git a/apps/web-antd/src/views/business/special-prescription-category/index.vue b/apps/web-antd/src/views/business/special-prescription-category/index.vue
index c399dd1e..87acd1bc 100644
--- a/apps/web-antd/src/views/business/special-prescription-category/index.vue
+++ b/apps/web-antd/src/views/business/special-prescription-category/index.vue
@@ -94,7 +94,7 @@ const deleteCategoryApi = (row: any) => {
       />
 
       <Grid>
-        <template #toolbar-buttons>
+        <template #toolbar-actions>
           <Button
             v-if="hasTopTableDropDownActions"
             danger
diff --git a/apps/web-antd/src/views/business/special-prescription/config/table.ts b/apps/web-antd/src/views/business/special-prescription/config/table.ts
index 83147024..63927111 100644
--- a/apps/web-antd/src/views/business/special-prescription/config/table.ts
+++ b/apps/web-antd/src/views/business/special-prescription/config/table.ts
@@ -109,7 +109,7 @@ export const gridOptions: VxeGridProps<RowType> = {
     export: false,
     zoom: true,
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
     custom: {
       icon: 'vxe-icon-menu',
diff --git a/apps/web-antd/src/views/business/special-prescription/index.vue b/apps/web-antd/src/views/business/special-prescription/index.vue
index 01f340c3..8148ab5d 100644
--- a/apps/web-antd/src/views/business/special-prescription/index.vue
+++ b/apps/web-antd/src/views/business/special-prescription/index.vue
@@ -281,7 +281,7 @@ const deleteApi = (row?: any) => {
           </template>
         </template>
 
-        <template #toolbar-buttons>
+        <template #toolbar-actions>
           <Button
             v-if="hasTopTableDropDownActions"
             danger
diff --git a/apps/web-antd/src/views/business/store/settings/config/form.ts b/apps/web-antd/src/views/business/store/settings/config/form.ts
index f651e1e1..72a97725 100644
--- a/apps/web-antd/src/views/business/store/settings/config/form.ts
+++ b/apps/web-antd/src/views/business/store/settings/config/form.ts
@@ -50,9 +50,10 @@ export const salespersonModalFormProps: VbenFormProps = {
       component: 'Input',
       fieldName: 'phone',
       label: '手机号',
-      rules: 'required',
+      // 与后端 checkPhone 一致：必填 + 大陆 11 位号段
+      rules: 'mobile',
       componentProps: {
-        minLength: 11,
+        maxlength: 11,
       },
     },
     {
diff --git a/apps/web-antd/src/views/business/store/settings/index.vue b/apps/web-antd/src/views/business/store/settings/index.vue
index 44c18f71..5db5258c 100644
--- a/apps/web-antd/src/views/business/store/settings/index.vue
+++ b/apps/web-antd/src/views/business/store/settings/index.vue
@@ -8,6 +8,7 @@ import {
   Avatar,
   Button,
   Card,
+  Empty,
   Image,
   ImagePreviewGroup,
   InputNumber,
@@ -17,6 +18,7 @@ import {
   Popconfirm,
   RadioButton,
   RadioGroup,
+  Spin,
   Tag,
 } from 'ant-design-vue';
 // eslint-disable-next-line n/no-extraneous-import
@@ -26,6 +28,8 @@ import DoctorQrCodePreview from '#/components/modal/DoctorQrCodePreview.vue';
 import SensitiveText from '#/components/sensitive-text/SensitiveText.vue';
 import StoreVipMemberCard from '#/components/vip/StoreVipMemberCard.vue';
 import DoctorCardModal from '#/views/doctor/doctor/components/DoctorCardModal.vue';
+import { getStoreRegisterSettingApi } from '#/views/doctor/doctor/api/schedule';
+import SchedulePanel from '#/views/doctor/doctor/components/schedule-calendar/SchedulePanel.vue';
 import {
   deleteNavApi,
   getStoreInfoApi,
@@ -130,7 +134,7 @@ const tabBar = computed<TabBarItem[]>(() => {
       { value: 6, label: '推广员' },
     ];
   }
-  // 诊所显示全部：诊所资料、商品价格、诊所二维码、我的医生团队、轮播图、推广员
+  // 诊所显示全部：诊所资料、商品价格、诊所二维码、我的医生团队、轮播图、推广员、排班管理
   return [
     { value: 1, label: '诊所资料' },
     { value: 2, label: '商品价格' },
@@ -138,9 +142,39 @@ const tabBar = computed<TabBarItem[]>(() => {
     { value: 4, label: '我的医生团队' },
     { value: 5, label: '轮播图' },
     { value: 6, label: '推广员' },
+    { value: 7, label: '排班管理' },
   ];
 });
 
+/**
+ * 排班管理 tab 的本店 ID：诊所管理员通过挂号设置接口自动解析本店
+ * 懒加载：首次切到该 tab 才请求，避免影响其他 tab 的加载速度。
+ * 必须有加载中/失败两个状态：接口失败或解析出 0 时若无提示，tab 会永久空白且用户无法自救
+ */
+const scheduleStoreId = ref(0);
+const scheduleLoading = ref(false);
+const scheduleLoadFailed = ref(false);
+const loadScheduleStoreId = () => {
+  if (scheduleStoreId.value > 0 || scheduleLoading.value) return;
+  scheduleLoading.value = true;
+  scheduleLoadFailed.value = false;
+  getStoreRegisterSettingApi()
+    .then((res: any) => {
+      scheduleStoreId.value = Number(res?.store_id || 0);
+      // 解析出 0 也视为失败：面板依赖 storeId，0 渲染不出任何内容
+      scheduleLoadFailed.value = scheduleStoreId.value <= 0;
+    })
+    .catch(() => {
+      scheduleLoadFailed.value = true;
+    })
+    .finally(() => {
+      scheduleLoading.value = false;
+    });
+};
+watch(activeTabBar, (val) => {
+  if (val === 7) loadScheduleStoreId();
+}, { immediate: true });
+
 // 监听tabBar变化，验证当前tab是否有效（药店和诊所tab选项不同）
 watch(tabBar, (newTabBar) => {
   const validValues = newTabBar.map(item => item.value);
@@ -762,6 +796,27 @@ const handleSwitchClinicType = () => {
       </template>
       <SalespersonCard />
     </Card>
+
+    <Card v-else-if="activeTabBar === 7" title="排班管理">
+      <template #extra>
+        <span class="text-sm text-gray-500"
+          >按日期给医生排班（套班次模板/休诊），未单独排班的日期按医生默认规则放号</span
+        >
+      </template>
+      <!-- 本店 id 解析完成后再渲染面板（面板依赖 storeId 拉医生/模板/日历） -->
+      <SchedulePanel
+        v-if="scheduleStoreId > 0"
+        :store-id="scheduleStoreId"
+        :store-name="data.name"
+      />
+      <!-- 加载中 / 失败态：失败给重试按钮，避免 tab 永久空白无法自救 -->
+      <div v-else-if="scheduleLoading" class="schedule-tab-state">
+        <Spin tip="正在解析本店排班信息…" />
+      </div>
+      <Empty v-else-if="scheduleLoadFailed" description="排班信息加载失败">
+        <Button type="primary" @click="loadScheduleStoreId">重试</Button>
+      </Empty>
+    </Card>
   </Page>
 </template>
 <style lang="scss" scoped>
@@ -839,4 +894,12 @@ const handleSwitchClinicType = () => {
     transform: scale(0.95);
   }
 }
+
+/* 排班 tab 加载态：居中占位，避免 Spin 贴左上角 */
+.schedule-tab-state {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 48px 0;
+}
 </style>
diff --git a/apps/web-antd/src/views/business/warehouse-drug-management/admin/config/table.ts b/apps/web-antd/src/views/business/warehouse-drug-management/admin/config/table.ts
index 4da28db6..378c9005 100644
--- a/apps/web-antd/src/views/business/warehouse-drug-management/admin/config/table.ts
+++ b/apps/web-antd/src/views/business/warehouse-drug-management/admin/config/table.ts
@@ -63,7 +63,7 @@ export function createGridOptions(productType: number): VxeGridProps<RowType> {
       export: false,
       zoom: true,
       slots: {
-        buttons: 'toolbar-buttons',
+        buttons: 'toolbar-actions',
       },
       custom: {
         icon: 'vxe-icon-menu',
diff --git a/apps/web-antd/src/views/business/warehouse-drug-management/admin/index.vue b/apps/web-antd/src/views/business/warehouse-drug-management/admin/index.vue
index c9b2f652..a17a9fc8 100644
--- a/apps/web-antd/src/views/business/warehouse-drug-management/admin/index.vue
+++ b/apps/web-antd/src/views/business/warehouse-drug-management/admin/index.vue
@@ -248,7 +248,7 @@ function onSpreadsheetConfigSaved() {
       />
     </div>
     <Grid v-if="productType && viewMode === 'list'">
-      <template #toolbar-buttons>
+      <template #toolbar-actions>
         <TableAction
           :actions="[
             {
diff --git a/apps/web-antd/src/views/business/warehouse-drug-management/shop/config/table.ts b/apps/web-antd/src/views/business/warehouse-drug-management/shop/config/table.ts
index 112c0cfa..835ffd39 100644
--- a/apps/web-antd/src/views/business/warehouse-drug-management/shop/config/table.ts
+++ b/apps/web-antd/src/views/business/warehouse-drug-management/shop/config/table.ts
@@ -64,7 +64,7 @@ export function createGridOptions(productType: number): VxeGridProps<RowType> {
       export: false,
       zoom: true,
       slots: {
-        buttons: 'toolbar-buttons',
+        buttons: 'toolbar-actions',
       },
       custom: {
         icon: 'vxe-icon-menu',
diff --git a/apps/web-antd/src/views/business/warehouse-drug-management/shop/index.vue b/apps/web-antd/src/views/business/warehouse-drug-management/shop/index.vue
index 4c946ce6..b5d581a4 100644
--- a/apps/web-antd/src/views/business/warehouse-drug-management/shop/index.vue
+++ b/apps/web-antd/src/views/business/warehouse-drug-management/shop/index.vue
@@ -161,7 +161,7 @@ checkSubscribe();
     <ExcelUploadModal />
     <FormModal />
     <Grid v-if="productType">
-      <template #toolbar-buttons>
+      <template #toolbar-actions>
         <TableAction
           :actions="[
             // {
diff --git a/apps/web-antd/src/views/business/warehouse-drug-management/store/config/table.ts b/apps/web-antd/src/views/business/warehouse-drug-management/store/config/table.ts
index b587f192..55f6773d 100644
--- a/apps/web-antd/src/views/business/warehouse-drug-management/store/config/table.ts
+++ b/apps/web-antd/src/views/business/warehouse-drug-management/store/config/table.ts
@@ -75,7 +75,7 @@ export function createGridOptions(productType: number): VxeGridProps<RowType> {
       export: false,
       zoom: true,
       slots: {
-        buttons: 'toolbar-buttons',
+        buttons: 'toolbar-actions',
       },
       custom: {
         icon: 'vxe-icon-menu',
diff --git a/apps/web-antd/src/views/business/warehouse-drug-management/store/index.vue b/apps/web-antd/src/views/business/warehouse-drug-management/store/index.vue
index 1dd14989..b788b138 100644
--- a/apps/web-antd/src/views/business/warehouse-drug-management/store/index.vue
+++ b/apps/web-antd/src/views/business/warehouse-drug-management/store/index.vue
@@ -176,7 +176,7 @@ checkSubscribe();
     <StorePriceBatchModalComp />
     <FormModal />
     <Grid v-if="productType">
-      <template #toolbar-buttons>
+      <template #toolbar-actions>
         <TableAction
           :actions="[
             {
diff --git a/apps/web-antd/src/views/dashboard/analytics/analytics-trends.vue b/apps/web-antd/src/views/dashboard/analytics/analytics-trends.vue
index fadfc917..f1f0b232 100644
--- a/apps/web-antd/src/views/dashboard/analytics/analytics-trends.vue
+++ b/apps/web-antd/src/views/dashboard/analytics/analytics-trends.vue
@@ -1,11 +1,9 @@
 <script lang="ts" setup>
+import type { EchartsUIType } from '@vben/plugins/echarts';
+
 import { onMounted, ref } from 'vue';
 
-import {
-  EchartsUI,
-  type EchartsUIType,
-  useEcharts,
-} from '@vben/plugins/echarts';
+import { EchartsUI, useEcharts } from '@vben/plugins/echarts';
 
 const chartRef = ref<EchartsUIType>();
 const { renderEcharts } = useEcharts(chartRef);
diff --git a/apps/web-antd/src/views/dashboard/analytics/analytics-visits-data.vue b/apps/web-antd/src/views/dashboard/analytics/analytics-visits-data.vue
index 30c4265d..190fb41f 100644
--- a/apps/web-antd/src/views/dashboard/analytics/analytics-visits-data.vue
+++ b/apps/web-antd/src/views/dashboard/analytics/analytics-visits-data.vue
@@ -1,11 +1,9 @@
 <script lang="ts" setup>
+import type { EchartsUIType } from '@vben/plugins/echarts';
+
 import { onMounted, ref } from 'vue';
 
-import {
-  EchartsUI,
-  type EchartsUIType,
-  useEcharts,
-} from '@vben/plugins/echarts';
+import { EchartsUI, useEcharts } from '@vben/plugins/echarts';
 
 const chartRef = ref<EchartsUIType>();
 const { renderEcharts } = useEcharts(chartRef);
diff --git a/apps/web-antd/src/views/dashboard/analytics/analytics-visits-sales.vue b/apps/web-antd/src/views/dashboard/analytics/analytics-visits-sales.vue
index 260520b8..6ff52086 100644
--- a/apps/web-antd/src/views/dashboard/analytics/analytics-visits-sales.vue
+++ b/apps/web-antd/src/views/dashboard/analytics/analytics-visits-sales.vue
@@ -1,11 +1,9 @@
 <script lang="ts" setup>
+import type { EchartsUIType } from '@vben/plugins/echarts';
+
 import { onMounted, ref } from 'vue';
 
-import {
-  EchartsUI,
-  type EchartsUIType,
-  useEcharts,
-} from '@vben/plugins/echarts';
+import { EchartsUI, useEcharts } from '@vben/plugins/echarts';
 
 const chartRef = ref<EchartsUIType>();
 const { renderEcharts } = useEcharts(chartRef);
@@ -26,7 +24,7 @@ onMounted(() => {
           { name: '定制', value: 310 },
           { name: '技术支持', value: 274 },
           { name: '远程', value: 400 },
-        ].sort((a, b) => {
+        ].toSorted((a, b) => {
           return a.value - b.value;
         }),
         name: '商业占比',
diff --git a/apps/web-antd/src/views/dashboard/analytics/analytics-visits-source.vue b/apps/web-antd/src/views/dashboard/analytics/analytics-visits-source.vue
index e0d0aab5..0915c7af 100644
--- a/apps/web-antd/src/views/dashboard/analytics/analytics-visits-source.vue
+++ b/apps/web-antd/src/views/dashboard/analytics/analytics-visits-source.vue
@@ -1,11 +1,9 @@
 <script lang="ts" setup>
+import type { EchartsUIType } from '@vben/plugins/echarts';
+
 import { onMounted, ref } from 'vue';
 
-import {
-  EchartsUI,
-  type EchartsUIType,
-  useEcharts,
-} from '@vben/plugins/echarts';
+import { EchartsUI, useEcharts } from '@vben/plugins/echarts';
 
 const chartRef = ref<EchartsUIType>();
 const { renderEcharts } = useEcharts(chartRef);
diff --git a/apps/web-antd/src/views/dashboard/analytics/analytics-visits.vue b/apps/web-antd/src/views/dashboard/analytics/analytics-visits.vue
index 7e1f14ee..7e0f1013 100644
--- a/apps/web-antd/src/views/dashboard/analytics/analytics-visits.vue
+++ b/apps/web-antd/src/views/dashboard/analytics/analytics-visits.vue
@@ -1,11 +1,9 @@
 <script lang="ts" setup>
+import type { EchartsUIType } from '@vben/plugins/echarts';
+
 import { onMounted, ref } from 'vue';
 
-import {
-  EchartsUI,
-  type EchartsUIType,
-  useEcharts,
-} from '@vben/plugins/echarts';
+import { EchartsUI, useEcharts } from '@vben/plugins/echarts';
 
 const chartRef = ref<EchartsUIType>();
 const { renderEcharts } = useEcharts(chartRef);
diff --git a/apps/web-antd/src/views/dashboard/analytics/index.vue b/apps/web-antd/src/views/dashboard/analytics/index.vue
index acdc4677..e794c99a 100644
--- a/apps/web-antd/src/views/dashboard/analytics/index.vue
+++ b/apps/web-antd/src/views/dashboard/analytics/index.vue
@@ -15,10 +15,10 @@ import {
 } from '@vben/icons';
 
 import AnalyticsTrends from './analytics-trends.vue';
-import AnalyticsVisits from './analytics-visits.vue';
 import AnalyticsVisitsData from './analytics-visits-data.vue';
 import AnalyticsVisitsSales from './analytics-visits-sales.vue';
 import AnalyticsVisitsSource from './analytics-visits-source.vue';
+import AnalyticsVisits from './analytics-visits.vue';
 
 const overviewItems: AnalysisOverviewItem[] = [
   {
@@ -65,7 +65,7 @@ const chartTabs: TabOption[] = [
 
 <template>
   <div class="p-5">
-    <AnalysisOverview :items="overviewItems" :my-card="false" />
+    <AnalysisOverview :items="overviewItems" />
     <AnalysisChartsTabs :tabs="chartTabs" class="mt-5">
       <template #trends>
         <AnalyticsTrends />
@@ -76,10 +76,10 @@ const chartTabs: TabOption[] = [
     </AnalysisChartsTabs>
 
     <div class="mt-5 w-full md:flex">
-      <AnalysisChartCard class="mt-5 md:mr-4 md:mt-0 md:w-1/3" title="访问数量">
+      <AnalysisChartCard class="mt-5 md:mt-0 md:mr-4 md:w-1/3" title="访问数量">
         <AnalyticsVisitsData />
       </AnalysisChartCard>
-      <AnalysisChartCard class="mt-5 md:mr-4 md:mt-0 md:w-1/3" title="访问来源">
+      <AnalysisChartCard class="mt-5 md:mt-0 md:mr-4 md:w-1/3" title="访问来源">
         <AnalyticsVisitsSource />
       </AnalysisChartCard>
       <AnalysisChartCard class="mt-5 md:mt-0 md:w-1/3" title="访问来源">
diff --git a/apps/web-antd/src/views/dashboard/calendar/api/index.ts b/apps/web-antd/src/views/dashboard/calendar/api/index.ts
new file mode 100644
index 00000000..28c237f1
--- /dev/null
+++ b/apps/web-antd/src/views/dashboard/calendar/api/index.ts
@@ -0,0 +1,29 @@
+import { requestClient } from '#/api/request';
+
+/** 日历待办 API（后端 admin/system/CalendarTodoController） */
+const prefix = 'calendar-todo/';
+
+/** 按时间范围获取本人待办列表（日历面板整月渲染，传面板首尾时间戳秒） */
+export async function getCalendarTodoList(data: { end_time: number; start_time: number }) {
+  return requestClient.get<any>(`${prefix}get-list`, { params: data });
+}
+
+/** 新建待办 */
+export async function createCalendarTodo(data: Record<string, any>) {
+  return requestClient.post<any>(`${prefix}create`, data);
+}
+
+/** 编辑待办 */
+export async function updateCalendarTodo(data: Record<string, any>) {
+  return requestClient.post<any>(`${prefix}update`, data);
+}
+
+/** 删除待办（软删） */
+export async function deleteCalendarTodo(data: { id: number }) {
+  return requestClient.post<any>(`${prefix}delete`, data);
+}
+
+/** 切换完成状态 */
+export async function toggleCalendarTodoDone(data: { id: number; is_done: number }) {
+  return requestClient.post<any>(`${prefix}toggle-done`, data);
+}
diff --git a/apps/web-antd/src/views/dashboard/calendar/components/CalendarPanel.vue b/apps/web-antd/src/views/dashboard/calendar/components/CalendarPanel.vue
new file mode 100644
index 00000000..2d61e1d5
--- /dev/null
+++ b/apps/web-antd/src/views/dashboard/calendar/components/CalendarPanel.vue
@@ -0,0 +1,1661 @@
+<script lang="ts" setup>
+/**
+ * 日程日历面板（Apple 风格卡片，可复用组件）
+ * 使用方：
+ * - 日程日历页 /dashboard/calendar/index：完整模式（图例 + 大标题 + 每格 3 条待办）
+ * - 工作台 work_calendar widget：compact 紧凑模式（隐藏图例、格子变矮、每格 2 条待办）
+ * 布局：左侧月历主区 + 右侧「选中日」详情侧栏（大日期数字/农历干支/宜忌/当日待办清单）
+ * - 点击任意格子即选中该日，侧栏联动展示当日黄历与待办
+ * - 右键格子弹出快捷菜单：新建待办 / 查看当日待办（定位到侧栏）
+ * - 待办支持站内信/邮箱/短信定时提醒（后端 calendar:todo-remind 每分钟扫描发送）
+ */
+import type { Dayjs } from 'dayjs';
+
+import { computed, onMounted, onUnmounted, reactive, ref, watch } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+import { IconifyIcon as VbenIcon } from '@vben/icons';
+
+import { Button, Calendar, Checkbox, message, Modal as AntModal, Spin, Tooltip } from 'ant-design-vue';
+import dayjs from 'dayjs';
+import { Solar } from 'lunar-typescript';
+
+import { deleteCalendarTodo, getCalendarTodoList, toggleCalendarTodoDone } from '../api';
+import { getDayAlmanac, getDayAlmanacDetail } from '../utils/almanac';
+import TodoModalComp from './todo-modal.vue';
+
+defineOptions({ name: 'CalendarPanel' });
+
+interface Props {
+  /** 紧凑模式：工作台 widget 用，隐藏图例、格子变矮、每格待办条数减少 */
+  compact?: boolean;
+}
+const props = withDefaults(defineProps<Props>(), { compact: false });
+
+/** 每格露出的待办条数：紧凑模式空间小只露 2 条，超出走「还有N项」 */
+const maxChips = computed(() => (props.compact ? 2 : 3));
+
+/** 日历面板当前值：既是展示月份也是选中日期（antd Calendar 点击格子会更新它） */
+const panelDate = ref<Dayjs>(dayjs());
+const loading = ref(false);
+/** 待办按日期分组：key = YYYY-MM-DD */
+const todosMap = ref<Map<string, any[]>>(new Map());
+
+/** 待办新建/编辑弹窗 */
+const [TodoFormModal, todoModalApi] = useVbenModal({
+  connectedComponent: TodoModalComp,
+});
+
+/** 头部标题：月份大数字 + 公历年 + 农历干支生肖年 */
+const headerTitle = computed(() => {
+  const d = panelDate.value;
+  const lunar = Solar.fromYmd(d.year(), d.month() + 1, 1).getLunar();
+  return {
+    month: d.format('M'),
+    year: d.format('YYYY年'),
+    lunar: `农历${lunar.getYearInGanZhi()}${lunar.getYearShengXiao()}年`,
+  };
+});
+
+/**
+ * 拉取面板范围内的待办并按日期分组
+ * 范围取当月前后各留一段：日历 42 格会露出上月末尾与下月开头，宽松范围一次覆盖
+ */
+async function loadTodos() {
+  loading.value = true;
+  try {
+    const start = panelDate.value.startOf('month').subtract(7, 'day').startOf('day');
+    const end = panelDate.value.endOf('month').add(14, 'day').endOf('day');
+    const list = await getCalendarTodoList({
+      start_time: start.unix(),
+      end_time: end.unix(),
+    });
+    const map = new Map<string, any[]>();
+    (list || []).forEach((todo: any) => {
+      const key = dayjs.unix(Number(todo.todo_time)).format('YYYY-MM-DD');
+      if (!map.has(key)) map.set(key, []);
+      map.get(key)!.push(todo);
+    });
+    todosMap.value = map;
+  } finally {
+    loading.value = false;
+  }
+}
+
+// 月份变化时重拉（同月内点选日期不触发，避免无谓请求）
+watch(() => panelDate.value.format('YYYY-MM'), loadTodos, { immediate: true });
+
+/** 组装单个格子的渲染数据：黄历信息 + 当日待办 + 今日/选中/周末状态 */
+function cellData(current: Dayjs) {
+  return {
+    almanac: getDayAlmanac(current.year(), current.month() + 1, current.date()),
+    todos: todosMap.value.get(current.format('YYYY-MM-DD')) || [],
+    isToday: current.isSame(dayjs(), 'day'),
+    isSelected: current.isSame(panelDate.value, 'day'),
+    isWeekend: current.day() === 0 || current.day() === 6,
+  };
+}
+
+/** 格子内待办时间点文案：00:00 视为全天不显示时间 */
+function todoTimeText(todo: any) {
+  const t = dayjs.unix(Number(todo.todo_time));
+  return t.format('HH:mm') === '00:00' ? '' : t.format('HH:mm');
+}
+
+// ---------------- 侧栏（选中日详情） ----------------
+/** 选中日期 key，侧栏与格子高亮共用 */
+const selectedKey = computed(() => panelDate.value.format('YYYY-MM-DD'));
+/** 选中日是否今天：决定侧栏是否显示「回今天」入口 */
+const isSelectedToday = computed(() => panelDate.value.isSame(dayjs(), 'day'));
+/** 选中日黄历详情（星期/农历/干支/宜忌） */
+const selectedDetail = computed(() =>
+  getDayAlmanacDetail(panelDate.value.year(), panelDate.value.month() + 1, panelDate.value.date()),
+);
+/** 选中日格子级黄历（节日/节气/休班），侧栏标签行复用 */
+const selectedAlmanac = computed(() =>
+  getDayAlmanac(panelDate.value.year(), panelDate.value.month() + 1, panelDate.value.date()),
+);
+/** 选中日待办列表：按时间点升序，全天（00:00）自然排最前 */
+const selectedTodos = computed(() => {
+  const list = todosMap.value.get(selectedKey.value) || [];
+  return [...list].sort((a, b) => Number(a.todo_time) - Number(b.todo_time));
+});
+/** 选中日未完成待办数，侧栏标题角标用 */
+const selectedUndoneCount = computed(
+  () => selectedTodos.value.filter((t) => Number(t.is_done) !== 1).length,
+);
+
+/** 侧栏待办时间文案：全天/HH:mm */
+function sideTimeText(todo: any) {
+  const t = dayjs.unix(Number(todo.todo_time));
+  return t.format('HH:mm') === '00:00' ? '全天' : t.format('HH:mm');
+}
+
+/** 侧栏勾选切换完成状态：本地同步字段，避免整月重拉造成闪烁 */
+async function onToggleDone(todo: any, checked: boolean) {
+  await toggleCalendarTodoDone({ id: todo.id, is_done: checked ? 1 : 0 });
+  todo.is_done = checked ? 1 : 0;
+}
+
+/** 侧栏删除待办：确认后删除并重拉当月 */
+function onDeleteTodo(todo: any) {
+  AntModal.confirm({
+    title: '删除待办',
+    content: `确定删除「${todo.title}」吗？`,
+    okText: '删除',
+    okType: 'danger',
+    cancelText: '取消',
+    onOk: async () => {
+      await deleteCalendarTodo({ id: todo.id });
+      message.success('删除成功');
+      loadTodos();
+    },
+  });
+}
+
+// ---------------- 右键菜单 ----------------
+/** 右键菜单状态：位置 + 目标日期 */
+const ctxMenu = reactive({ visible: false, x: 0, y: 0, date: '' });
+
+/** 打开右键菜单：贴边时向内收，避免菜单溢出视口 */
+function openCtxMenu(e: MouseEvent, current: Dayjs) {
+  ctxMenu.date = current.format('YYYY-MM-DD');
+  ctxMenu.x = Math.min(e.clientX, window.innerWidth - 180);
+  ctxMenu.y = Math.min(e.clientY, window.innerHeight - 120);
+  ctxMenu.visible = true;
+}
+
+function closeCtxMenu() {
+  ctxMenu.visible = false;
+}
+
+/** 右键菜单目标日期的待办数量 */
+const ctxTodoCount = computed(() => (todosMap.value.get(ctxMenu.date) || []).length);
+
+/** 点击任意处 / 滚动时关闭右键菜单与年月选择面板 */
+function closeFloatLayers() {
+  closeCtxMenu();
+  closePicker();
+}
+
+onMounted(() => {
+  window.addEventListener('click', closeFloatLayers);
+  window.addEventListener('scroll', closeFloatLayers, true);
+});
+onUnmounted(() => {
+  window.removeEventListener('click', closeFloatLayers);
+  window.removeEventListener('scroll', closeFloatLayers, true);
+});
+
+// ---------------- 待办操作 ----------------
+/** 新建待办：date 为默认日期（右键格子/侧栏/头部按钮带入，默认选中日） */
+function createTodo(date?: string) {
+  closeCtxMenu();
+  todoModalApi
+    .setData({
+      update: false,
+      defaultDate: date || selectedKey.value,
+      onSaved: loadTodos,
+    })
+    .open();
+}
+
+/** 编辑待办 */
+function editTodo(todo: any) {
+  closeCtxMenu();
+  todoModalApi.setData({ update: true, values: todo, onSaved: loadTodos }).open();
+}
+
+/** 选中某天：侧栏联动展示当日详情（右键「查看当日待办」与格子「还有N项」都走这里） */
+function selectDay(date: string) {
+  closeCtxMenu();
+  panelDate.value = dayjs(date);
+}
+
+// ---------------- 月份切换 ----------------
+function prevMonth() {
+  panelDate.value = panelDate.value.subtract(1, 'month');
+}
+function nextMonth() {
+  panelDate.value = panelDate.value.add(1, 'month');
+}
+function backToday() {
+  panelDate.value = dayjs();
+}
+
+// ---------------- 年/月快捷选择面板 ----------------
+/**
+ * 点击头部大月份数字弹「月份网格」（面板内可左右切年）、点击年份文字弹「年份网格」（12 年一页）
+ * viewYear：月面板顶部展示/翻页用的年，选中月份前改它不影响 panelDate
+ * yearBase：年面板当前页起始年（以选中年居中：-5 ~ +6）
+ */
+const picker = reactive({ mode: '' as '' | 'month' | 'year', viewYear: 0, yearBase: 0 });
+
+/** 年面板当前页的 12 个年份 */
+const yearList = computed(() =>
+  Array.from({ length: 12 }, (_, i) => picker.yearBase + i),
+);
+
+/** 打开/收起选择面板（重复点击同一入口则收起） */
+function togglePicker(mode: 'month' | 'year') {
+  closeCtxMenu();
+  if (picker.mode === mode) {
+    picker.mode = '';
+    return;
+  }
+  picker.mode = mode;
+  picker.viewYear = panelDate.value.year();
+  picker.yearBase = panelDate.value.year() - 5;
+}
+
+function closePicker() {
+  picker.mode = '';
+}
+
+/**
+ * 切换年月的统一入口：先落到目标月 1 号再夹取原选中日，
+ * 避免 dayjs 直接 set month 时因目标月天数不足产生进位（如 1/31 → 2 月变 3 月）
+ */
+function setYearMonth(year: number, monthIndex: number) {
+  const first = dayjs(new Date(year, monthIndex, 1));
+  const day = Math.min(panelDate.value.date(), first.daysInMonth());
+  panelDate.value = first.date(day);
+}
+
+/** 月面板选中某月（用面板顶部当前展示的 viewYear） */
+function pickMonth(month: number) {
+  setYearMonth(picker.viewYear, month - 1);
+  closePicker();
+}
+
+/** 年面板选中某年（保持当前月） */
+function pickYear(year: number) {
+  setYearMonth(year, panelDate.value.month());
+  closePicker();
+}
+</script>
+<template>
+  <div class="work-calendar" :class="{ 'is-compact': compact }">
+    <!-- 左侧：月历主区 -->
+    <div class="wc-main">
+      <!-- 自定义头部：月份大数字 + 图例 + 月份切换 + 新建 -->
+      <div class="wc-header">
+        <div class="wc-header-left">
+          <!-- 点大月份数字选月份，点年份文字选年份 -->
+          <div
+            class="wc-month-hero wc-pick-trigger"
+            title="点击选择月份"
+            @click.stop="togglePicker('month')"
+          >
+            <span class="wc-month-num">{{ headerTitle.month }}</span>
+            <span class="wc-month-unit">月</span>
+            <VbenIcon class="wc-caret" icon="lucide:chevron-down" />
+          </div>
+          <div class="wc-title-meta">
+            <span
+              class="wc-title-year wc-pick-trigger"
+              title="点击选择年份"
+              @click.stop="togglePicker('year')"
+            >
+              {{ headerTitle.year }}
+              <VbenIcon class="wc-caret wc-caret-sm" icon="lucide:chevron-down" />
+            </span>
+            <span class="wc-lunar-year">{{ headerTitle.lunar }}</span>
+          </div>
+
+          <!-- 年/月选择面板：毛玻璃浮层，选中即跳转对应月历 -->
+          <div v-if="picker.mode" class="wc-picker" @click.stop>
+            <template v-if="picker.mode === 'month'">
+              <div class="wc-picker-head">
+                <span class="wc-picker-title">{{ picker.viewYear }}年</span>
+                <div class="wc-picker-nav">
+                  <button class="wc-picker-nav-btn" title="上一年" @click="picker.viewYear--">
+                    <VbenIcon icon="lucide:chevron-left" />
+                  </button>
+                  <button class="wc-picker-nav-btn" title="下一年" @click="picker.viewYear++">
+                    <VbenIcon icon="lucide:chevron-right" />
+                  </button>
+                </div>
+              </div>
+              <div class="wc-picker-grid">
+                <button
+                  v-for="m in 12"
+                  :key="m"
+                  class="wc-picker-cell"
+                  :class="{
+                    active: picker.viewYear === panelDate.year() && m === panelDate.month() + 1,
+                    now: picker.viewYear === new Date().getFullYear() && m === new Date().getMonth() + 1,
+                  }"
+                  @click="pickMonth(m)"
+                >
+                  {{ m }}月
+                </button>
+              </div>
+            </template>
+            <template v-else>
+              <div class="wc-picker-head">
+                <span class="wc-picker-title">{{ yearList[0] }} - {{ yearList[11] }}</span>
+                <div class="wc-picker-nav">
+                  <button class="wc-picker-nav-btn" title="前 12 年" @click="picker.yearBase -= 12">
+                    <VbenIcon icon="lucide:chevron-left" />
+                  </button>
+                  <button class="wc-picker-nav-btn" title="后 12 年" @click="picker.yearBase += 12">
+                    <VbenIcon icon="lucide:chevron-right" />
+                  </button>
+                </div>
+              </div>
+              <div class="wc-picker-grid">
+                <button
+                  v-for="y in yearList"
+                  :key="y"
+                  class="wc-picker-cell"
+                  :class="{ active: y === panelDate.year(), now: y === new Date().getFullYear() }"
+                  @click="pickYear(y)"
+                >
+                  {{ y }}
+                </button>
+              </div>
+            </template>
+          </div>
+        </div>
+        <div class="wc-header-right">
+          <!-- 紧凑模式隐藏图例，把空间留给日历本体 -->
+          <div v-if="!compact" class="wc-legend">
+            <span class="wc-legend-item"><i class="dot traditional"></i>传统节日</span>
+            <span class="wc-legend-item"><i class="dot modern"></i>公历节日</span>
+            <span class="wc-legend-item"><i class="dot jieqi"></i>节气</span>
+            <span class="wc-legend-item"><i class="badge rest">休</i>法定假</span>
+            <span class="wc-legend-item"><i class="badge work">班</i>补班</span>
+          </div>
+          <div class="wc-nav">
+            <button class="wc-nav-btn" title="上一月" @click="prevMonth">
+              <VbenIcon icon="lucide:chevron-left" />
+            </button>
+            <button class="wc-nav-today" @click="backToday">今天</button>
+            <button class="wc-nav-btn" title="下一月" @click="nextMonth">
+              <VbenIcon icon="lucide:chevron-right" />
+            </button>
+          </div>
+          <Button type="primary" @click="createTodo()">
+            <span class="wc-btn-inner"><VbenIcon icon="lucide:plus" />新建待办</span>
+          </Button>
+        </div>
+      </div>
+      <div class="wc-body">
+        <Spin :spinning="loading">
+          <Calendar v-model:value="panelDate" :fullscreen="true">
+            <!-- 隐藏 antd 默认头部，统一用上方自定义头部 -->
+            <template #headerRender><span></span></template>
+            <template #dateFullCellRender="{ current }">
+              <div
+                class="cal-cell"
+                :class="{
+                  'is-today': cellData(current).isToday,
+                  'is-selected': cellData(current).isSelected,
+                  'is-weekend': cellData(current).isWeekend,
+                }"
+                @contextmenu.prevent="openCtxMenu($event, current)"
+              >
+                <div class="cal-cell-head">
+                  <span class="cal-day">{{ current.date() }}</span>
+                  <!-- 农历始终显示，不被节日/节气覆盖 -->
+                  <span class="cal-lunar">{{ cellData(current).almanac.lunarText }}</span>
+                  <span
+                    v-if="cellData(current).almanac.holiday"
+                    class="cal-badge"
+                    :class="cellData(current).almanac.holiday!.isWork ? 'work' : 'rest'"
+                  >
+                    {{ cellData(current).almanac.holiday!.isWork ? '班' : '休' }}
+                  </span>
+                  <button
+                    class="cal-add"
+                    title="新建待办"
+                    @click.stop="createTodo(current.format('YYYY-MM-DD'))"
+                  >
+                    <VbenIcon icon="lucide:plus" />
+                  </button>
+                </div>
+                <!-- 节气/节日副行：节气青色，传统节日红、公历节日橙（颜色差异化） -->
+                <div
+                  v-if="cellData(current).almanac.jieQi || cellData(current).almanac.festivalItems.length > 0"
+                  class="cal-subline"
+                >
+                  <span v-if="cellData(current).almanac.jieQi" class="cal-jieqi">
+                    {{ cellData(current).almanac.jieQi }}
+                  </span>
+                  <Tooltip
+                    v-if="cellData(current).almanac.festivalItems.length > 0"
+                    :title="cellData(current).almanac.festivalItems.map((f) => f.name).join('、')"
+                  >
+                    <span class="cal-festival" :class="cellData(current).almanac.festivalItems[0]!.kind">
+                      {{ cellData(current).almanac.festivalItems[0]!.name }}
+                    </span>
+                  </Tooltip>
+                </div>
+                <div class="cal-todos">
+                  <div
+                    v-for="todo in cellData(current).todos.slice(0, maxChips)"
+                    :key="todo.id"
+                    class="cal-todo"
+                    :class="{ done: Number(todo.is_done) === 1 }"
+                    @click.stop="editTodo(todo)"
+                  >
+                    <i class="cal-todo-dot"></i>
+                    <span class="cal-todo-text">
+                      <template v-if="todoTimeText(todo)">{{ todoTimeText(todo) }} </template>{{ todo.title }}
+                    </span>
+                  </div>
+                  <div
+                    v-if="cellData(current).todos.length > maxChips"
+                    class="cal-more"
+                    @click.stop="selectDay(current.format('YYYY-MM-DD'))"
+                  >
+                    还有 {{ cellData(current).todos.length - maxChips }} 项…
+                  </div>
+                </div>
+              </div>
+            </template>
+          </Calendar>
+        </Spin>
+      </div>
+    </div>
+    <!-- 右侧：选中日详情侧栏（万年历式「今日」卡片 + 当日待办清单） -->
+    <aside class="wc-side">
+      <div class="wc-side-hero">
+        <div class="wc-side-date">
+          <span class="wc-side-day">{{ panelDate.date() }}</span>
+          <div class="wc-side-date-meta">
+            <span class="wc-side-ym">{{ panelDate.format('YYYY年M月') }}</span>
+            <span class="wc-side-week">{{ selectedDetail.week }}</span>
+          </div>
+          <button v-if="!isSelectedToday" class="wc-back-today" @click="backToday">
+            <VbenIcon icon="lucide:undo-2" />回今天
+          </button>
+          <span v-else class="wc-today-flag">今天</span>
+        </div>
+        <div class="wc-side-lunar">
+          <span class="wc-side-lunar-main">农历{{ selectedDetail.lunarDate }}</span>
+          <span class="wc-side-lunar-ganzhi">
+            {{ selectedDetail.ganZhi }} · 属{{ selectedDetail.shengXiao }}
+          </span>
+        </div>
+        <div
+          v-if="
+            selectedAlmanac.festivalItems.length > 0 ||
+            selectedAlmanac.jieQi ||
+            selectedAlmanac.holiday
+          "
+          class="wc-side-tags"
+        >
+          <span v-if="selectedAlmanac.holiday" class="wc-tag" :class="selectedAlmanac.holiday.isWork ? 'work' : 'rest'">
+            {{ selectedAlmanac.holiday.isWork ? '班' : '休' }} · {{ selectedAlmanac.holiday.name }}
+          </span>
+          <span v-if="selectedAlmanac.jieQi" class="wc-tag jieqi">{{ selectedAlmanac.jieQi }}</span>
+          <!-- 节日标签跟随节日类型配色：传统红 / 公历橙 -->
+          <span
+            v-for="f in selectedAlmanac.festivalItems.slice(0, 3)"
+            :key="f.name"
+            class="wc-tag"
+            :class="f.kind"
+          >
+            {{ f.name }}
+          </span>
+        </div>
+      </div>
+      <!-- 宜忌：C 端万年历的氛围信息，民俗参考 -->
+      <div class="wc-yiji">
+        <div v-if="selectedDetail.yi.length > 0" class="wc-yiji-row">
+          <i class="wc-yiji-mark yi">宜</i>
+          <span class="wc-yiji-text">{{ selectedDetail.yi.slice(0, 6).join('　') }}</span>
+        </div>
+        <div v-if="selectedDetail.ji.length > 0" class="wc-yiji-row">
+          <i class="wc-yiji-mark ji">忌</i>
+          <span class="wc-yiji-text">{{ selectedDetail.ji.slice(0, 6).join('　') }}</span>
+        </div>
+      </div>
+      <!-- 当日待办清单 -->
+      <div class="wc-side-todos">
+        <div class="wc-side-todos-head">
+          <span class="wc-side-todos-title">
+            待办事项
+            <em v-if="selectedUndoneCount > 0" class="wc-side-todos-count">{{ selectedUndoneCount }}</em>
+          </span>
+          <button class="wc-mini-add" @click="createTodo(selectedKey)">
+            <VbenIcon icon="lucide:plus" />添加
+          </button>
+        </div>
+        <div class="wc-side-todo-list">
+          <div
+            v-for="todo in selectedTodos"
+            :key="todo.id"
+            class="side-todo"
+            :class="{ done: Number(todo.is_done) === 1 }"
+          >
+            <Checkbox
+              class="side-todo-check"
+              :checked="Number(todo.is_done) === 1"
+              @change="(e: any) => onToggleDone(todo, e.target.checked)"
+            />
+            <div class="side-todo-main" @click="editTodo(todo)">
+              <div class="side-todo-title">{{ todo.title }}</div>
+              <div class="side-todo-meta">
+                <span class="side-todo-time">
+                  <VbenIcon icon="lucide:clock" />{{ sideTimeText(todo) }}
+                </span>
+                <span v-if="Number(todo.remind_at) > 0" class="side-todo-remind">
+                  <VbenIcon icon="lucide:bell" />{{ dayjs.unix(Number(todo.remind_at)).format('MM-DD HH:mm') }}
+                </span>
+                <span v-if="Number(todo.remind_status) === 2" class="side-todo-remind-fail">提醒失败</span>
+              </div>
+            </div>
+            <button class="side-todo-del" title="删除" @click.stop="onDeleteTodo(todo)">
+              <VbenIcon icon="lucide:trash-2" />
+            </button>
+          </div>
+          <div v-if="selectedTodos.length === 0" class="wc-side-empty">
+            <VbenIcon icon="lucide:calendar-plus" class="wc-side-empty-icon" />
+            <p class="wc-side-empty-text">这一天暂无待办</p>
+            <button class="wc-side-empty-btn" @click="createTodo(selectedKey)">新建一条</button>
+          </div>
+        </div>
+      </div>
+    </aside>
+    <!-- 右键菜单：Teleport 到 body 避免被日历容器裁剪 -->
+    <Teleport to="body">
+      <div
+        v-if="ctxMenu.visible"
+        class="wc-ctx-menu"
+        :style="{ left: `${ctxMenu.x}px`, top: `${ctxMenu.y}px` }"
+        @click.stop
+      >
+        <div class="wc-ctx-date">{{ dayjs(ctxMenu.date).format('M月D日') }}</div>
+        <div class="wc-ctx-item" @click="createTodo(ctxMenu.date)">
+          <span class="wc-ctx-label"><VbenIcon icon="lucide:plus" />新建待办</span>
+        </div>
+        <div class="wc-ctx-item" @click="selectDay(ctxMenu.date)">
+          <span class="wc-ctx-label"><VbenIcon icon="lucide:list" />查看当日待办</span>
+          <span v-if="ctxTodoCount > 0" class="wc-ctx-count">{{ ctxTodoCount }}</span>
+        </div>
+      </div>
+    </Teleport>
+    <TodoFormModal />
+  </div>
+</template>
+<style lang="scss" scoped>
+.work-calendar {
+  display: flex;
+  gap: 14px;
+  align-items: stretch;
+  height: 100%;
+}
+
+/* ---------- 左侧月历卡片（Apple 风格：大圆角 + 发丝线描边 + 柔和弥散阴影） ---------- */
+.wc-main {
+  display: flex;
+  flex: 1;
+  flex-direction: column;
+  min-width: 0;
+  padding: 18px;
+  overflow: auto;
+  background: hsl(var(--card, var(--background)));
+  border: 1px solid hsl(var(--border) / 60%);
+  border-radius: 18px;
+  box-shadow: 0 2px 12px rgb(0 0 0 / 5%);
+}
+
+/* ---------- 头部 ---------- */
+.wc-header {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 10px;
+  align-items: center;
+  justify-content: space-between;
+  padding-bottom: 14px;
+}
+
+/* 相对定位：作为年/月选择浮层的锚点 */
+.wc-header-left {
+  position: relative;
+  display: flex;
+  gap: 10px;
+  align-items: center;
+}
+
+/* 可点击的年/月触发器：hover 轻着色提示可交互（负 margin 抵消 padding 保持布局不动） */
+.wc-pick-trigger {
+  padding: 2px 6px;
+  margin: -2px -6px;
+  cursor: pointer;
+  border-radius: 8px;
+  transition: background-color 0.2s, color 0.2s;
+
+  &:hover {
+    background: hsl(var(--muted) / 50%);
+
+    .wc-caret {
+      color: hsl(var(--primary));
+      transform: translateY(1px);
+    }
+  }
+}
+
+/* 年份文字触发器：行内 flex 让小箭头垂直对齐 */
+.wc-title-year.wc-pick-trigger {
+  display: inline-flex;
+  gap: 2px;
+  align-items: center;
+  align-self: flex-start;
+}
+
+.wc-caret {
+  align-self: center;
+  margin-left: 2px;
+  font-size: 14px;
+  color: hsl(var(--muted-foreground));
+  transition: color 0.2s, transform 0.2s;
+}
+
+.wc-caret-sm {
+  font-size: 12px;
+}
+
+/* ---------- 年/月选择面板：macOS 毛玻璃浮层 ---------- */
+.wc-picker {
+  position: absolute;
+  top: calc(100% + 8px);
+  left: 0;
+  z-index: 60;
+  width: 264px;
+  padding: 10px;
+  background: hsl(var(--popover, var(--background)) / 88%);
+  border: 1px solid hsl(var(--border) / 60%);
+  border-radius: 14px;
+  box-shadow: 0 12px 32px rgb(0 0 0 / 16%);
+  backdrop-filter: blur(18px) saturate(160%);
+}
+
+.wc-picker-head {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 0 4px 8px;
+}
+
+.wc-picker-title {
+  font-size: 13px;
+  font-weight: 600;
+  color: hsl(var(--foreground));
+  font-variant-numeric: tabular-nums;
+}
+
+.wc-picker-nav {
+  display: flex;
+  gap: 2px;
+  padding: 2px;
+  background: hsl(var(--muted) / 60%);
+  border-radius: 8px;
+}
+
+.wc-picker-nav-btn {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 22px;
+  height: 20px;
+  font-size: 13px;
+  color: hsl(var(--foreground) / 80%);
+  cursor: pointer;
+  background: transparent;
+  border: none;
+  border-radius: 6px;
+  transition: background-color 0.2s, color 0.2s;
+
+  &:hover {
+    color: hsl(var(--foreground));
+    background: hsl(var(--card, var(--background)));
+    box-shadow: 0 1px 3px rgb(0 0 0 / 10%);
+  }
+}
+
+.wc-picker-grid {
+  display: grid;
+  grid-template-columns: repeat(4, minmax(0, 1fr));
+  gap: 4px;
+}
+
+.wc-picker-cell {
+  padding: 7px 0;
+  font-size: 13px;
+  color: hsl(var(--foreground) / 85%);
+  cursor: pointer;
+  background: transparent;
+  border: 1px solid transparent;
+  border-radius: 8px;
+  transition: background-color 0.15s, color 0.15s, border-color 0.15s;
+  font-variant-numeric: tabular-nums;
+
+  &:hover {
+    background: hsl(var(--muted) / 60%);
+  }
+
+  /* 今天所在的年/月：主色细描边提示（未选中时也可辨认） */
+  &.now {
+    border-color: hsl(var(--primary) / 45%);
+  }
+
+  /* 当前选中：主色填充 */
+  &.active {
+    font-weight: 600;
+    color: hsl(var(--primary-foreground, 0 0% 100%));
+    background: hsl(var(--primary));
+    border-color: hsl(var(--primary));
+  }
+}
+
+/* 月份标题：Apple 日历的中性大标题（不用品牌色染标题） */
+.wc-month-hero {
+  display: flex;
+  align-items: baseline;
+  color: hsl(var(--foreground));
+}
+
+.wc-month-num {
+  font-size: 36px;
+  font-weight: 700;
+  line-height: 1;
+  letter-spacing: -1.5px;
+  font-variant-numeric: tabular-nums;
+}
+
+.wc-month-unit {
+  font-size: 15px;
+  font-weight: 600;
+}
+
+.wc-title-meta {
+  display: flex;
+  flex-direction: column;
+  gap: 1px;
+}
+
+.wc-title-year {
+  font-size: 14px;
+  font-weight: 600;
+  color: hsl(var(--foreground));
+}
+
+.wc-lunar-year {
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+}
+
+.wc-header-right {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 10px;
+  align-items: center;
+}
+
+.wc-btn-inner {
+  display: inline-flex;
+  gap: 4px;
+  align-items: center;
+}
+
+/* 新建按钮改胶囊形，贴近 iOS 填充按钮 */
+.wc-header-right :deep(.ant-btn-primary) {
+  padding-inline: 16px;
+  border-radius: 999px;
+}
+
+/* 月份切换：macOS 分段控件（灰色轨道 + 悬浮白片段） */
+.wc-nav {
+  display: flex;
+  gap: 2px;
+  align-items: center;
+  padding: 2px;
+  background: hsl(var(--muted) / 60%);
+  border-radius: 9px;
+}
+
+.wc-nav-btn,
+.wc-nav-today {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  height: 26px;
+  padding: 0 10px;
+  font-size: 13px;
+  color: hsl(var(--foreground) / 80%);
+  cursor: pointer;
+  background: transparent;
+  border: none;
+  border-radius: 7px;
+  transition: background-color 0.2s, color 0.2s, box-shadow 0.2s;
+
+  &:hover {
+    color: hsl(var(--foreground));
+    background: hsl(var(--card, var(--background)));
+    box-shadow: 0 1px 3px rgb(0 0 0 / 10%);
+  }
+}
+
+.wc-nav-today {
+  font-weight: 600;
+}
+
+.wc-legend {
+  display: flex;
+  gap: 10px;
+  align-items: center;
+}
+
+.wc-legend-item {
+  display: inline-flex;
+  gap: 4px;
+  align-items: center;
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+
+  .dot {
+    width: 6px;
+    height: 6px;
+    border-radius: 50%;
+
+    &.traditional {
+      background: hsl(var(--destructive));
+    }
+
+    &.modern {
+      background: hsl(var(--warning));
+    }
+
+    &.jieqi {
+      background: hsl(var(--primary));
+    }
+  }
+
+  .badge {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    width: 16px;
+    height: 16px;
+    font-size: 10px;
+    font-style: normal;
+    border-radius: 4px;
+
+    &.rest {
+      color: hsl(var(--primary));
+      background: hsl(var(--primary) / 12%);
+    }
+
+    &.work {
+      color: hsl(var(--warning));
+      background: hsl(var(--warning) / 14%);
+    }
+  }
+}
+
+/* 日历主体：灰底画布，本月格子以白卡浮起（Apple 小组件「卡片浮在画布上」的层次） */
+.wc-body {
+  flex: 1;
+  min-height: 0;
+  padding: 4px;
+  background: hsl(var(--muted) / 25%);
+  border-radius: 14px;
+}
+
+/* antd 日历根节点背景交给外层卡片，避免暗色主题下出现色块拼缝 */
+:deep(.ant-picker-calendar) {
+  background: transparent;
+}
+
+/* ---------- 日历格子 ---------- */
+.cal-cell {
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  min-height: 104px;
+  padding: 7px 8px;
+  margin: 3px;
+  overflow: hidden;
+  cursor: pointer;
+
+  /* 本月格子 = 浮在灰底画布上的白卡（Apple 小组件层次），非本月透明淡化见下方 :deep */
+  background: hsl(var(--card, var(--background)));
+  border: 1px solid hsl(var(--border) / 50%);
+  border-radius: 12px;
+  box-shadow: 0 1px 2px rgb(0 0 0 / 4%);
+  transition: background-color 0.2s, border-color 0.2s, box-shadow 0.2s;
+
+  &:hover {
+    box-shadow: 0 3px 10px rgb(0 0 0 / 8%);
+
+    .cal-add {
+      opacity: 1;
+    }
+  }
+
+  /* 周末日期数字置灰（Apple 日历的周末处理） */
+  &.is-weekend .cal-day {
+    color: hsl(var(--muted-foreground));
+  }
+
+  /* 选中态：主色描边 + 外圈焦点光晕（iOS 焦点环），让「点格子看侧栏」有明确焦点 */
+  &.is-selected {
+    border-color: hsl(var(--primary) / 70%);
+    box-shadow: 0 0 0 3px hsl(var(--primary) / 15%);
+  }
+
+  /* 今天：只给数字上主色圆徽（Apple 只标记数字），格子仅加淡主色描边 */
+  &.is-today {
+    border-color: hsl(var(--primary) / 45%);
+
+    .cal-day {
+      color: hsl(var(--primary-foreground, 0 0% 100%));
+      background: hsl(var(--primary));
+    }
+  }
+}
+
+.cal-cell-head {
+  display: flex;
+  gap: 6px;
+  align-items: center;
+  min-width: 0;
+}
+
+.cal-day {
+  display: inline-flex;
+  flex-shrink: 0;
+  align-items: center;
+  justify-content: center;
+  width: 24px;
+  height: 24px;
+  font-size: 14px;
+  font-weight: 600;
+  color: hsl(var(--foreground));
+  border-radius: 50%;
+  transition: background-color 0.2s;
+  font-variant-numeric: tabular-nums;
+}
+
+.cal-lunar {
+  flex: 1;
+  min-width: 0;
+  overflow: hidden;
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+/* 节气/节日副行：与农历分离，互不覆盖 */
+.cal-subline {
+  display: flex;
+  gap: 6px;
+  align-items: center;
+  min-width: 0;
+  margin-top: 3px;
+}
+
+.cal-jieqi {
+  flex-shrink: 0;
+  font-size: 11px;
+  font-weight: 600;
+  color: hsl(var(--primary));
+}
+
+/* 节日颜色差异化：传统农历节日红、公历现代节日橙 */
+.cal-festival {
+  overflow: hidden;
+  font-size: 11px;
+  font-weight: 600;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+
+  &.traditional {
+    color: hsl(var(--destructive));
+  }
+
+  &.modern {
+    color: hsl(var(--warning));
+  }
+}
+
+.cal-badge {
+  flex-shrink: 0;
+  padding: 0 4px;
+  font-size: 10px;
+  line-height: 16px;
+  border-radius: 4px;
+
+  &.rest {
+    color: hsl(var(--primary));
+    background: hsl(var(--primary) / 12%);
+  }
+
+  &.work {
+    color: hsl(var(--warning));
+    background: hsl(var(--warning) / 14%);
+  }
+}
+
+/* hover 才出现的快捷新建按钮，避免视觉噪音 */
+.cal-add {
+  display: inline-flex;
+  flex-shrink: 0;
+  align-items: center;
+  justify-content: center;
+  width: 20px;
+  height: 20px;
+  font-size: 13px;
+  color: hsl(var(--primary));
+  cursor: pointer;
+  background: hsl(var(--primary) / 10%);
+  border: none;
+  border-radius: 6px;
+  opacity: 0;
+  transition: opacity 0.2s, background-color 0.2s;
+
+  &:hover {
+    background: hsl(var(--primary) / 20%);
+  }
+}
+
+.cal-todos {
+  display: flex;
+  flex-direction: column;
+  gap: 3px;
+  margin-top: 6px;
+}
+
+/* 待办条目：Apple 事件块的柔和淡彩 + 1px 同色边框微光（规范禁止左侧色条式强调） */
+.cal-todo {
+  display: flex;
+  gap: 5px;
+  align-items: center;
+  min-width: 0;
+  padding: 2px 6px;
+  font-size: 12px;
+  color: hsl(var(--foreground) / 85%);
+  cursor: pointer;
+  background: hsl(var(--primary) / 7%);
+  border: 1px solid hsl(var(--primary) / 22%);
+  border-radius: 7px;
+  box-shadow: 0 0 5px hsl(var(--primary) / 12%);
+  transition: background-color 0.2s, border-color 0.2s, box-shadow 0.2s;
+
+  &:hover {
+    background: hsl(var(--primary) / 13%);
+    border-color: hsl(var(--primary) / 45%);
+    box-shadow: 0 0 7px hsl(var(--primary) / 22%);
+  }
+
+  &.done {
+    color: hsl(var(--muted-foreground));
+    text-decoration: line-through;
+    border-color: hsl(var(--muted-foreground) / 25%);
+    box-shadow: none;
+
+    .cal-todo-dot {
+      background: hsl(var(--muted-foreground));
+    }
+  }
+}
+
+.cal-todo-dot {
+  flex-shrink: 0;
+  width: 5px;
+  height: 5px;
+  background: hsl(var(--primary));
+  border-radius: 50%;
+}
+
+.cal-todo-text {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.cal-more {
+  padding-left: 6px;
+  font-size: 11px;
+  color: hsl(var(--primary));
+  cursor: pointer;
+
+  &:hover {
+    text-decoration: underline;
+  }
+}
+
+/* 非当月格子：去掉白卡（背景/描边/阴影）并整体淡化，与本月浮卡拉开层次 */
+:deep(.ant-picker-cell:not(.ant-picker-cell-in-view)) {
+  .cal-cell {
+    background: transparent;
+    border-color: transparent;
+    box-shadow: none;
+    opacity: 0.5;
+  }
+}
+
+/* 去掉 antd 日历自带的格子上边框与内边距，让自定义格子撑满 */
+:deep(.ant-picker-calendar .ant-picker-panel) {
+  background: transparent;
+  border-top: none;
+}
+
+:deep(.ant-picker-calendar .ant-picker-cell) {
+  padding: 0;
+}
+
+/* 星期表头：Apple 式小号灰字 + 轻字距 */
+:deep(.ant-picker-calendar .ant-picker-content th) {
+  padding: 10px 8px 8px;
+  font-size: 11px;
+  font-weight: 500;
+  color: hsl(var(--muted-foreground));
+  text-align: center;
+  letter-spacing: 0.05em;
+}
+
+/* ---------- 右侧详情侧栏（Apple 卡片：大圆角 + 发丝线 + 弥散阴影） ---------- */
+.wc-side {
+  display: flex;
+  flex-direction: column;
+  flex-shrink: 0;
+  width: 300px;
+  overflow: hidden;
+  background: hsl(var(--card, var(--background)));
+  border: 1px solid hsl(var(--border) / 60%);
+  border-radius: 18px;
+  box-shadow: 0 2px 12px rgb(0 0 0 / 5%);
+}
+
+/* 选中日 hero：平铺淡彩衬底 + 发丝线分隔（去掉渐变，Apple 偏平铺材质） */
+.wc-side-hero {
+  padding: 18px 16px 14px;
+  background: hsl(var(--primary) / 6%);
+  border-bottom: 1px solid hsl(var(--border) / 50%);
+}
+
+.wc-side-date {
+  display: flex;
+  gap: 10px;
+  align-items: center;
+}
+
+.wc-side-day {
+  font-size: 44px;
+  font-weight: 700;
+  line-height: 1;
+  color: hsl(var(--primary));
+  letter-spacing: -2px;
+  font-variant-numeric: tabular-nums;
+}
+
+.wc-side-date-meta {
+  display: flex;
+  flex: 1;
+  flex-direction: column;
+  gap: 2px;
+  min-width: 0;
+}
+
+.wc-side-ym {
+  font-size: 14px;
+  font-weight: 600;
+  color: hsl(var(--foreground));
+}
+
+.wc-side-week {
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+}
+
+.wc-back-today {
+  display: inline-flex;
+  gap: 3px;
+  align-items: center;
+  padding: 4px 10px;
+  font-size: 12px;
+  color: hsl(var(--primary));
+  cursor: pointer;
+  background: hsl(var(--primary) / 10%);
+  border: none;
+  border-radius: 999px;
+  transition: background-color 0.2s;
+
+  &:hover {
+    background: hsl(var(--primary) / 18%);
+  }
+}
+
+.wc-today-flag {
+  padding: 3px 10px;
+  font-size: 12px;
+  font-weight: 600;
+  color: hsl(var(--primary-foreground, 0 0% 100%));
+  background: hsl(var(--primary));
+  border-radius: 999px;
+}
+
+.wc-side-lunar {
+  display: flex;
+  flex-direction: column;
+  gap: 2px;
+  margin-top: 10px;
+}
+
+.wc-side-lunar-main {
+  font-size: 14px;
+  font-weight: 600;
+  color: hsl(var(--foreground));
+}
+
+.wc-side-lunar-ganzhi {
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+}
+
+.wc-side-tags {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 6px;
+  margin-top: 10px;
+}
+
+.wc-tag {
+  padding: 2px 8px;
+  font-size: 11px;
+  font-weight: 500;
+  border-radius: 999px;
+
+  &.traditional {
+    color: hsl(var(--destructive));
+    background: hsl(var(--destructive) / 10%);
+  }
+
+  &.modern {
+    color: hsl(var(--warning));
+    background: hsl(var(--warning) / 14%);
+  }
+
+  &.jieqi {
+    color: hsl(var(--primary));
+    background: hsl(var(--primary) / 10%);
+  }
+
+  &.rest {
+    color: hsl(var(--primary));
+    background: hsl(var(--primary) / 12%);
+  }
+
+  &.work {
+    color: hsl(var(--warning));
+    background: hsl(var(--warning) / 14%);
+  }
+}
+
+/* ---------- 宜忌：iOS 分组列表式内嵌圆角卡 ---------- */
+.wc-yiji {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  padding: 10px 12px;
+  margin: 12px 12px 0;
+  background: hsl(var(--muted) / 30%);
+  border-radius: 12px;
+}
+
+.wc-yiji-row {
+  display: flex;
+  gap: 8px;
+  align-items: flex-start;
+}
+
+.wc-yiji-mark {
+  display: inline-flex;
+  flex-shrink: 0;
+  align-items: center;
+  justify-content: center;
+  width: 20px;
+  height: 20px;
+  font-size: 12px;
+  font-style: normal;
+  font-weight: 600;
+  border-radius: 6px;
+
+  /* 宜=主色、忌=灰，避免大红大绿破坏后台整体色调 */
+  &.yi {
+    color: hsl(var(--primary));
+    background: hsl(var(--primary) / 12%);
+  }
+
+  &.ji {
+    color: hsl(var(--muted-foreground));
+    background: hsl(var(--muted) / 60%);
+  }
+}
+
+.wc-yiji-text {
+  display: -webkit-box;
+  overflow: hidden;
+  font-size: 12px;
+  line-height: 20px;
+  color: hsl(var(--foreground) / 75%);
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 2;
+}
+
+/* ---------- 侧栏待办清单 ---------- */
+.wc-side-todos {
+  display: flex;
+  flex: 1;
+  flex-direction: column;
+  min-height: 0;
+  padding: 12px;
+}
+
+.wc-side-todos-head {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding-right: 4px;
+  margin-bottom: 8px;
+}
+
+.wc-side-todos-title {
+  display: inline-flex;
+  gap: 6px;
+  align-items: center;
+  font-size: 14px;
+  font-weight: 600;
+  color: hsl(var(--foreground));
+}
+
+.wc-side-todos-count {
+  padding: 0 7px;
+  font-size: 11px;
+  font-style: normal;
+  font-weight: 600;
+  line-height: 18px;
+  color: hsl(var(--primary));
+  background: hsl(var(--primary) / 12%);
+  border-radius: 999px;
+}
+
+.wc-mini-add {
+  display: inline-flex;
+  gap: 3px;
+  align-items: center;
+  padding: 4px 10px;
+  font-size: 12px;
+  color: hsl(var(--primary));
+  cursor: pointer;
+  background: hsl(var(--primary) / 10%);
+  border: none;
+  border-radius: 999px;
+  transition: background-color 0.2s;
+
+  &:hover {
+    background: hsl(var(--primary) / 18%);
+  }
+}
+
+.wc-side-todo-list {
+  display: flex;
+  flex: 1;
+  flex-direction: column;
+  gap: 6px;
+  padding-right: 4px;
+  overflow-y: auto;
+}
+
+.side-todo {
+  display: flex;
+  gap: 8px;
+  align-items: flex-start;
+  padding: 9px 10px;
+  background: hsl(var(--muted) / 30%);
+  border: 1px solid transparent;
+  border-radius: 12px;
+  transition: border-color 0.2s, background-color 0.2s, box-shadow 0.2s;
+
+  &:hover {
+    background: hsl(var(--muted) / 45%);
+    border-color: hsl(var(--primary) / 35%);
+    box-shadow: 0 2px 8px rgb(0 0 0 / 6%);
+
+    .side-todo-del {
+      opacity: 1;
+    }
+  }
+
+  &.done {
+    .side-todo-title {
+      color: hsl(var(--muted-foreground));
+      text-decoration: line-through;
+    }
+  }
+}
+
+.side-todo-check {
+  margin-top: 1px;
+}
+
+.side-todo-main {
+  flex: 1;
+  min-width: 0;
+  cursor: pointer;
+}
+
+.side-todo-title {
+  overflow: hidden;
+  font-size: 13px;
+  font-weight: 500;
+  color: hsl(var(--foreground));
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.side-todo-meta {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 8px;
+  align-items: center;
+  margin-top: 3px;
+  font-size: 11px;
+  color: hsl(var(--muted-foreground));
+}
+
+.side-todo-time,
+.side-todo-remind {
+  display: inline-flex;
+  gap: 3px;
+  align-items: center;
+}
+
+.side-todo-remind {
+  color: hsl(var(--primary) / 90%);
+}
+
+.side-todo-remind-fail {
+  color: hsl(var(--destructive));
+}
+
+/* 删除按钮 hover 行内才出现，避免列表噪音 */
+.side-todo-del {
+  display: inline-flex;
+  flex-shrink: 0;
+  align-items: center;
+  justify-content: center;
+  width: 22px;
+  height: 22px;
+  font-size: 13px;
+  color: hsl(var(--muted-foreground));
+  cursor: pointer;
+  background: transparent;
+  border: none;
+  border-radius: 6px;
+  opacity: 0;
+  transition: opacity 0.2s, color 0.2s, background-color 0.2s;
+
+  &:hover {
+    color: hsl(var(--destructive));
+    background: hsl(var(--destructive) / 10%);
+  }
+}
+
+/* 空状态：轻量插画感 */
+.wc-side-empty {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  align-items: center;
+  padding: 36px 0;
+}
+
+.wc-side-empty-icon {
+  font-size: 40px;
+  color: hsl(var(--muted-foreground) / 45%);
+}
+
+.wc-side-empty-text {
+  margin: 0;
+  font-size: 13px;
+  color: hsl(var(--muted-foreground));
+}
+
+.wc-side-empty-btn {
+  padding: 5px 14px;
+  font-size: 12px;
+  color: hsl(var(--primary));
+  cursor: pointer;
+  background: hsl(var(--primary) / 10%);
+  border: none;
+  border-radius: 999px;
+  transition: background-color 0.2s;
+
+  &:hover {
+    background: hsl(var(--primary) / 18%);
+  }
+}
+
+/* ---------- 右键菜单：macOS 毛玻璃材质 ---------- */
+.wc-ctx-menu {
+  position: fixed;
+  z-index: 2100;
+  min-width: 172px;
+  padding: 6px;
+  background: hsl(var(--popover, var(--background)) / 82%);
+  border: 1px solid hsl(var(--border) / 60%);
+  border-radius: 12px;
+  box-shadow: 0 12px 32px rgb(0 0 0 / 16%);
+  backdrop-filter: blur(18px) saturate(160%);
+}
+
+.wc-ctx-date {
+  padding: 4px 10px 6px;
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+  border-bottom: 1px solid hsl(var(--border));
+}
+
+.wc-ctx-item {
+  display: flex;
+  gap: 8px;
+  align-items: center;
+  justify-content: space-between;
+  padding: 7px 10px;
+  margin-top: 2px;
+  font-size: 13px;
+  color: hsl(var(--foreground));
+  cursor: pointer;
+  border-radius: 6px;
+  transition: background-color 0.15s, color 0.15s;
+
+  &:hover {
+    color: hsl(var(--primary));
+    background: hsl(var(--primary) / 10%);
+  }
+}
+
+.wc-ctx-label {
+  display: inline-flex;
+  gap: 6px;
+  align-items: center;
+}
+
+.wc-ctx-count {
+  padding: 0 6px;
+  font-size: 11px;
+  color: hsl(var(--primary));
+  background: hsl(var(--primary) / 12%);
+  border-radius: 8px;
+}
+
+/* ---------- 紧凑模式（工作台 widget）：整体收紧尺寸 ---------- */
+.work-calendar.is-compact {
+  .wc-main {
+    padding: 14px;
+    border-radius: 16px;
+  }
+
+  .wc-month-num {
+    font-size: 26px;
+  }
+
+  .wc-header {
+    padding-bottom: 10px;
+  }
+
+  .cal-cell {
+    min-height: 70px;
+    padding: 5px 7px;
+    margin: 2px;
+  }
+
+  .wc-side {
+    width: 272px;
+    border-radius: 16px;
+  }
+
+  .wc-side-day {
+    font-size: 36px;
+  }
+
+  .wc-side-hero {
+    padding: 14px 14px 12px;
+  }
+
+  /* 紧凑模式待办清单限高，避免 widget 被撑得过长 */
+  .wc-side-todo-list {
+    max-height: 300px;
+  }
+}
+
+/* ---------- 窄屏适配：侧栏下移到日历下方 ---------- */
+@media (max-width: 1080px) {
+  .work-calendar {
+    flex-direction: column;
+    overflow-y: auto;
+  }
+
+  .wc-main {
+    flex: none;
+    overflow: visible;
+  }
+
+  /* 加上 is-compact 组合选择器保证优先级高于紧凑模式的固定宽度 */
+  .wc-side,
+  .work-calendar.is-compact .wc-side {
+    width: 100%;
+  }
+
+  .wc-side-todo-list {
+    max-height: 320px;
+  }
+}
+</style>
diff --git a/apps/web-antd/src/views/dashboard/calendar/components/todo-modal.vue b/apps/web-antd/src/views/dashboard/calendar/components/todo-modal.vue
new file mode 100644
index 00000000..8a31dc8a
--- /dev/null
+++ b/apps/web-antd/src/views/dashboard/calendar/components/todo-modal.vue
@@ -0,0 +1,119 @@
+<script lang="ts" setup>
+/**
+ * 日历待办新增/编辑弹窗
+ * 打开时通过 modalApi.setData 传入：
+ * - update: 是否编辑态
+ * - values: 编辑回填数据（时间戳字段已由本组件转为格式串）
+ * - defaultDate: 新建时的默认日期（右键格子带入，默认当天 09:00）
+ * - onSaved: 保存/删除成功后的刷新回调（父页面重拉当月待办）
+ */
+import { ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+
+import { Button, message, Modal as AntModal } from 'ant-design-vue';
+import dayjs from 'dayjs';
+
+import { useVbenForm } from '#/adapter/form';
+
+import { createCalendarTodo, deleteCalendarTodo, updateCalendarTodo } from '../api';
+import { todoModalFormProps } from '../config/form';
+
+const isUpdate = ref(false);
+const currentId = ref(0);
+const onSavedRef = ref<null | (() => void)>(null);
+
+const [Form, formApi] = useVbenForm(todoModalFormProps);
+
+const [Modal, modalApi] = useVbenModal({
+  fullscreenButton: false,
+  draggable: true,
+  onCancel() {
+    modalApi.close();
+  },
+  onConfirm: async () => {
+    const e = await formApi.validate();
+    if (!e.valid) return;
+    const values = await formApi.getValues();
+    // 时间字段由格式串转秒级时间戳提交，与后端 int 字段对齐
+    const payload: Record<string, any> = {
+      id: currentId.value || undefined,
+      title: values.title,
+      content: values.content || '',
+      todo_time: values.todo_time ? dayjs(values.todo_time).unix() : 0,
+      remind_at: values.remind_at ? dayjs(values.remind_at).unix() : 0,
+      remind_channels: values.remind_at ? values.remind_channels || [] : [],
+      remind_email: values.remind_email || '',
+      remind_phone: values.remind_phone || '',
+    };
+    modalApi.lock();
+    try {
+      await (isUpdate.value ? updateCalendarTodo(payload) : createCalendarTodo(payload));
+      message.success(isUpdate.value ? '保存成功' : '创建成功');
+      onSavedRef.value?.();
+      modalApi.close();
+    } finally {
+      modalApi.unlock();
+    }
+  },
+  onOpenChange(isOpen: boolean) {
+    if (!isOpen) {
+      formApi.resetForm();
+      return;
+    }
+    const data = (modalApi.getData() || {}) as Record<string, any>;
+    isUpdate.value = !!data.update;
+    currentId.value = Number(data.values?.id || 0);
+    onSavedRef.value = data.onSaved || null;
+    formApi.resetForm();
+    if (data.update && data.values) {
+      const v = data.values;
+      formApi.setValues({
+        id: v.id,
+        title: v.title,
+        content: v.content,
+        todo_time: v.todo_time ? dayjs.unix(Number(v.todo_time)).format('YYYY-MM-DD HH:mm') : '',
+        remind_at:
+          Number(v.remind_at) > 0 ? dayjs.unix(Number(v.remind_at)).format('YYYY-MM-DD HH:mm') : '',
+        remind_channels: v.remind_channels ? String(v.remind_channels).split(',').filter(Boolean) : [],
+        remind_email: v.remind_email || '',
+        remind_phone: v.remind_phone || '',
+      });
+    } else {
+      // 新建：右键格子带入日期，默认上午 9 点
+      const base = data.defaultDate ? dayjs(data.defaultDate) : dayjs();
+      formApi.setValues({
+        todo_time: base.hour(9).minute(0).format('YYYY-MM-DD HH:mm'),
+        remind_channels: ['notice'],
+      });
+    }
+  },
+});
+
+/** 编辑态底部左侧的删除入口：待办属于轻量数据，允许在编辑弹窗内直接删除 */
+function handleDelete() {
+  if (!currentId.value) return;
+  AntModal.confirm({
+    title: '删除待办',
+    content: '确定删除这条待办吗？删除后不可恢复。',
+    okText: '删除',
+    okType: 'danger',
+    cancelText: '取消',
+    onOk: async () => {
+      await deleteCalendarTodo({ id: currentId.value });
+      message.success('删除成功');
+      onSavedRef.value?.();
+      modalApi.close();
+    },
+  });
+}
+</script>
+<template>
+  <!-- Markdown 编辑器工具栏需要更宽的容器，弹窗放宽到 640px -->
+  <Modal :title="isUpdate ? '编辑待办' : '新建待办'" class="w-[640px]">
+    <Form />
+    <template #prepend-footer>
+      <Button v-if="isUpdate" danger @click="handleDelete">删除</Button>
+    </template>
+  </Modal>
+</template>
diff --git a/apps/web-antd/src/views/dashboard/calendar/config/constants.ts b/apps/web-antd/src/views/dashboard/calendar/config/constants.ts
new file mode 100644
index 00000000..b83e965f
--- /dev/null
+++ b/apps/web-antd/src/views/dashboard/calendar/config/constants.ts
@@ -0,0 +1,17 @@
+/**
+ * 日历待办模块常量
+ */
+
+/** 提醒渠道选项（值与后端 CalendarTodoRemindChannelEnum 对齐） */
+export const REMIND_CHANNEL_OPTIONS = [
+  { label: '站内信', value: 'notice' },
+  { label: '邮箱', value: 'email' },
+  { label: '短信', value: 'sms' },
+];
+
+/** 提醒渠道值常量，避免魔法字符串 */
+export const REMIND_CHANNEL = {
+  NOTICE: 'notice',
+  EMAIL: 'email',
+  SMS: 'sms',
+} as const;
diff --git a/apps/web-antd/src/views/dashboard/calendar/config/form.ts b/apps/web-antd/src/views/dashboard/calendar/config/form.ts
new file mode 100644
index 00000000..dd8eff03
--- /dev/null
+++ b/apps/web-antd/src/views/dashboard/calendar/config/form.ts
@@ -0,0 +1,118 @@
+import type { VbenFormProps } from '#/adapter/form';
+
+import { REMIND_CHANNEL, REMIND_CHANNEL_OPTIONS } from './constants';
+
+/**
+ * 待办新增/编辑弹窗表单配置
+ * 提醒相关字段级联显隐：设置了提醒时间才显示渠道选择，勾选邮箱/短信才显示对应收件人输入框
+ */
+export const todoModalFormProps: VbenFormProps = {
+  commonConfig: {
+    labelWidth: 90,
+  },
+  layout: 'vertical',
+  schema: [
+    {
+      component: 'VbenInput',
+      fieldName: 'id',
+      label: 'ID',
+      dependencies: {
+        show: false,
+        triggerFields: ['id'],
+      },
+    },
+    {
+      component: 'VbenInput',
+      componentProps: {
+        placeholder: '请输入待办标题',
+        maxlength: 200,
+      },
+      fieldName: 'title',
+      label: '待办标题',
+      rules: 'required',
+    },
+    {
+      component: 'DatePicker',
+      componentProps: {
+        class: 'w-full',
+        format: 'YYYY-MM-DD HH:mm',
+        valueFormat: 'YYYY-MM-DD HH:mm',
+        showTime: { format: 'HH:mm' },
+        placeholder: '请选择待办时间',
+      },
+      fieldName: 'todo_time',
+      label: '待办时间',
+      rules: 'selectRequired',
+    },
+    {
+      // Markdown 编辑器（自动注册的表单组件），内容以 MD 源码入库，站内信/邮件提醒按 MD 渲染
+      component: 'MarkdownEditor',
+      componentProps: {
+        placeholder: '详情备注（选填，支持 Markdown 格式）',
+        height: 220,
+      },
+      fieldName: 'content',
+      label: '详情备注',
+    },
+    {
+      component: 'DatePicker',
+      componentProps: {
+        class: 'w-full',
+        format: 'YYYY-MM-DD HH:mm',
+        valueFormat: 'YYYY-MM-DD HH:mm',
+        showTime: { format: 'HH:mm' },
+        placeholder: '不选则不提醒',
+        allowClear: true,
+      },
+      fieldName: 'remind_at',
+      help: '到达提醒时间后按所选渠道自动发送提醒，需晚于当前时间',
+      label: '提醒时间',
+    },
+    {
+      component: 'CheckboxGroup',
+      componentProps: {
+        options: REMIND_CHANNEL_OPTIONS,
+      },
+      // 只有设置了提醒时间才需要选择渠道
+      dependencies: {
+        show: (values) => !!values.remind_at,
+        rules: (values) => (values.remind_at ? 'required' : null),
+        triggerFields: ['remind_at'],
+      },
+      fieldName: 'remind_channels',
+      label: '提醒方式',
+    },
+    {
+      component: 'VbenInput',
+      componentProps: {
+        placeholder: '不填则使用个人资料中的邮箱',
+      },
+      dependencies: {
+        show: (values) =>
+          !!values.remind_at &&
+          Array.isArray(values.remind_channels) &&
+          values.remind_channels.includes(REMIND_CHANNEL.EMAIL),
+        triggerFields: ['remind_at', 'remind_channels'],
+      },
+      fieldName: 'remind_email',
+      label: '提醒邮箱',
+    },
+    {
+      component: 'VbenInput',
+      componentProps: {
+        placeholder: '不填则使用个人资料中的手机号',
+        maxlength: 11,
+      },
+      dependencies: {
+        show: (values) =>
+          !!values.remind_at &&
+          Array.isArray(values.remind_channels) &&
+          values.remind_channels.includes(REMIND_CHANNEL.SMS),
+        triggerFields: ['remind_at', 'remind_channels'],
+      },
+      fieldName: 'remind_phone',
+      label: '提醒手机号',
+    },
+  ],
+  showDefaultActions: false,
+};
diff --git a/apps/web-antd/src/views/dashboard/calendar/index.vue b/apps/web-antd/src/views/dashboard/calendar/index.vue
new file mode 100644
index 00000000..065c8062
--- /dev/null
+++ b/apps/web-antd/src/views/dashboard/calendar/index.vue
@@ -0,0 +1,17 @@
+<script lang="ts" setup>
+/**
+ * 日程日历页：完整日历面板的页面壳
+ * 日历本体抽离为 CalendarPanel 组件（工作台 work_calendar widget 复用同一组件的 compact 紧凑模式）
+ * 路由 name 必须保持 WorkCalendar 与 xk_menu.name 一致，否则菜单/缓存匹配失效
+ */
+import { Page } from '@vben/common-ui';
+
+import CalendarPanel from './components/CalendarPanel.vue';
+
+defineOptions({ name: 'WorkCalendar' });
+</script>
+<template>
+  <Page auto-content-height>
+    <CalendarPanel />
+  </Page>
+</template>
diff --git a/apps/web-antd/src/views/dashboard/calendar/utils/almanac.ts b/apps/web-antd/src/views/dashboard/calendar/utils/almanac.ts
new file mode 100644
index 00000000..9267016b
--- /dev/null
+++ b/apps/web-antd/src/views/dashboard/calendar/utils/almanac.ts
@@ -0,0 +1,149 @@
+import { HolidayUtil, Solar } from 'lunar-typescript';
+
+/**
+ * 黄历信息计算工具（基于 lunar-typescript）
+ * 设计说明：
+ * - 中国传统节日（春节/端午/中秋等）由农历推算，公历节日（元旦/国庆等）按公历
+ * - 农历文案与节日、节气三者并列返回互不覆盖：格子里农历始终显示，节日/节气展示在副行
+ * - 公历节日走白名单只保留中国也在过的，纯国外节日暂时注释掉（见 SOLAR_FESTIVAL_WHITELIST）
+ * - 法定节假日调休（休/班）数据由 HolidayUtil 内置，覆盖国务院历年放假安排
+ * - 按「y-m-d」缓存计算结果：日历一屏 42 格、频繁切月，避免重复实例化 Solar/Lunar
+ */
+
+/** 节日条目：kind 用于差异化配色（传统农历节日红、公历现代节日橙），产品要求节日颜色不能都一样 */
+export interface FestivalItem {
+  kind: 'modern' | 'traditional';
+  name: string;
+}
+
+/** 单日黄历信息（日历格子用） */
+export interface DayAlmanac {
+  /** 农历文案：初一显示月名（如「七月」），其余显示农历日（如「三十」），始终展示、不被节日覆盖 */
+  lunarText: string;
+  /** 当天节气（无则空串），与节日并列展示互不覆盖 */
+  jieQi: string;
+  /** 过滤后的节日列表：农历传统节日在前、公历现代节日在后，格子展示第一个、悬浮提示展示全部 */
+  festivalItems: FestivalItem[];
+  /** 完整农历日期，如「正月初一」，悬浮提示用 */
+  lunarDate: string;
+  /** 法定节假日安排：null=正常工作日/周末，否则含名称与是否补班 */
+  holiday: null | { isWork: boolean; name: string };
+}
+
+/** 单日黄历详情（侧栏「选中日」卡片用，信息比格子更全） */
+export interface DayAlmanacDetail {
+  /** 星期文本，如「星期三」 */
+  week: string;
+  /** 完整农历日期，如「六月廿九」 */
+  lunarDate: string;
+  /** 干支纪年月日，如「丙午年 丙申月 庚辰日」 */
+  ganZhi: string;
+  /** 生肖，如「马」 */
+  shengXiao: string;
+  /** 黄历宜（民俗参考，侧栏氛围信息） */
+  yi: string[];
+  /** 黄历忌 */
+  ji: string[];
+}
+
+/**
+ * 公历节日白名单：只保留中国也在过的节日（法定/官方节日 + 已本土化的舶来节日）
+ * 产品要求暂时屏蔽国内基本不过的国外节日，注释保留在这里，后续要恢复解开对应注释即可
+ */
+const SOLAR_FESTIVAL_WHITELIST = new Set([
+  '元旦节',
+  '情人节',
+  '妇女节',
+  '植树节',
+  '消费者权益日',
+  '劳动节',
+  '青年节',
+  '儿童节',
+  '建党节',
+  '建军节',
+  '教师节',
+  '国庆节',
+  '母亲节',
+  '父亲节',
+  '平安夜',
+  '圣诞节',
+  // '愚人节',
+  // '万圣节前夜',
+  // '万圣节',
+  // '感恩节',
+]);
+
+/** 计算结果缓存：跨月切换时同一天不重复计算 */
+const cache = new Map<string, DayAlmanac>();
+
+/** 详情缓存与格子缓存分开：详情仅选中日才算，字段更多没必要提前算 42 格 */
+const detailCache = new Map<string, DayAlmanacDetail>();
+
+/**
+ * 获取某个公历日期的黄历信息（农历/节气/节日/法定调休）
+ * @param year 公历年
+ * @param month 公历月（1-12）
+ * @param day 公历日
+ */
+export function getDayAlmanac(year: number, month: number, day: number): DayAlmanac {
+  const key = `${year}-${month}-${day}`;
+  const cached = cache.get(key);
+  if (cached) return cached;
+
+  const solar = Solar.fromYmd(year, month, day);
+  const lunar = solar.getLunar();
+
+  // 节日组装：农历传统节日（含除夕/下元节等民俗，都是中国节日全保留）在前，
+  // 公历节日过白名单在后；solar.getOtherFestivals() 是「世界XX日」类国际纪念日，国内基本不过，整体不展示
+  const festivalItems: FestivalItem[] = [
+    ...[...lunar.getFestivals(), ...lunar.getOtherFestivals()].map((name) => ({
+      kind: 'traditional' as const,
+      name,
+    })),
+    ...solar
+      .getFestivals()
+      .filter((name) => SOLAR_FESTIVAL_WHITELIST.has(name))
+      .map((name) => ({ kind: 'modern' as const, name })),
+  ];
+
+  // 初一显示月名（如「二月」），其余显示农历日（如「十五」）；农历始终展示，不再被节日/节气覆盖
+  const lunarText =
+    lunar.getDay() === 1 ? `${lunar.getMonthInChinese()}月` : lunar.getDayInChinese();
+
+  const h = HolidayUtil.getHoliday(year, month, day);
+  const result: DayAlmanac = {
+    lunarText,
+    jieQi: lunar.getJieQi(),
+    festivalItems,
+    lunarDate: `${lunar.getMonthInChinese()}月${lunar.getDayInChinese()}`,
+    holiday: h ? { isWork: h.isWork(), name: h.getName() } : null,
+  };
+  cache.set(key, result);
+  return result;
+}
+
+/**
+ * 获取某个公历日期的黄历详情（星期/完整农历/干支/生肖/宜忌）
+ * 供侧栏「选中日」卡片展示，走独立缓存避免与格子计算互相拖累
+ * @param year 公历年
+ * @param month 公历月（1-12）
+ * @param day 公历日
+ */
+export function getDayAlmanacDetail(year: number, month: number, day: number): DayAlmanacDetail {
+  const key = `${year}-${month}-${day}`;
+  const cached = detailCache.get(key);
+  if (cached) return cached;
+
+  const solar = Solar.fromYmd(year, month, day);
+  const lunar = solar.getLunar();
+  const result: DayAlmanacDetail = {
+    week: `星期${solar.getWeekInChinese()}`,
+    lunarDate: `${lunar.getMonthInChinese()}月${lunar.getDayInChinese()}`,
+    ganZhi: `${lunar.getYearInGanZhi()}年 ${lunar.getMonthInGanZhi()}月 ${lunar.getDayInGanZhi()}日`,
+    shengXiao: lunar.getYearShengXiao(),
+    yi: lunar.getDayYi(),
+    ji: lunar.getDayJi(),
+  };
+  detailCache.set(key, result);
+  return result;
+}
diff --git a/apps/web-antd/src/views/dashboard/workspace/api/index.ts b/apps/web-antd/src/views/dashboard/workspace/api/index.ts
new file mode 100644
index 00000000..a43c303c
--- /dev/null
+++ b/apps/web-antd/src/views/dashboard/workspace/api/index.ts
@@ -0,0 +1,179 @@
+import { requestClient } from '#/api/request';
+
+const prefix = 'workbench/';
+
+/** 工作台布局项（后端按角色下发） */
+export type WorkbenchLayoutItem = {
+  id: number;
+  widget_code: string;
+  title: string;
+  sort: number;
+  config: null | Record<string, any>;
+};
+
+/** 医生今日摘要（与医生小程序工作台同口径） */
+export type DoctorSummaryResult = {
+  range: string;
+  prescription_count: number;
+  wait_accept: number;
+  accepting: number;
+  completed: number;
+  prescription_amount: string;
+};
+
+/** 药师待审摘要 */
+export type PharmacistSummaryResult = {
+  pending_total: number;
+};
+
+/** 诊所今日摘要 */
+export type ClinicSummaryResult = {
+  wait_accept: number;
+  accepting: number;
+  completed: number;
+  wait_delivery: number;
+};
+
+/** 订单管理员摘要 */
+export type OrderSummaryResult = {
+  wait_delivery: number;
+  refunding: number;
+};
+
+/** 平台今日总览（超管/系统管理员） */
+export type PlatformOverviewResult = {
+  order_count: number;
+  register_count: number;
+  revenue: number;
+  store_input_count: number;
+};
+
+/** 待办中心单项（count>0 需要处理，path 为跳转路由） */
+export type TodoCenterItem = {
+  code: string;
+  label: string;
+  count: number;
+  path: string;
+};
+
+/** 待办中心结果 */
+export type TodoCenterResult = {
+  items: TodoCenterItem[];
+};
+
+/** 未来7天预约：单日分布 */
+export type AppointmentUpcomingDay = {
+  date: string;
+  label: string;
+  week: string;
+  count: number;
+};
+
+/** 未来7天预约统计（卡片） */
+export type AppointmentUpcomingResult = {
+  total: number;
+  days: AppointmentUpcomingDay[];
+};
+
+/** 未来7天预约明细行 */
+export type AppointmentUpcomingItem = {
+  register_id: number;
+  order_no: string;
+  visit_date: string;
+  week: string;
+  slot_name: string;
+  start_time: string;
+  end_time: string;
+  slot_label: string;
+  patient_name: string;
+  doctor_name: string;
+  store_name: string;
+  is_pay: number;
+  price: string;
+  status: number;
+  status_text: string;
+};
+
+/** 未来7天预约明细分页结果 */
+export type AppointmentUpcomingListResult = {
+  items: AppointmentUpcomingItem[];
+  total: number;
+};
+
+/**
+ * 获取当前登录角色的工作台布局
+ */
+export async function getWorkbenchLayoutApi() {
+  return requestClient.get<WorkbenchLayoutItem[]>(`${prefix}layout`);
+}
+
+/**
+ * 医生今日摘要
+ */
+export async function getDoctorSummaryApi(range: string = 'today') {
+  return requestClient.get<DoctorSummaryResult>(`${prefix}doctor-summary`, {
+    params: { range },
+  });
+}
+
+/**
+ * 药师待审摘要
+ */
+export async function getPharmacistSummaryApi() {
+  return requestClient.get<PharmacistSummaryResult>(
+    `${prefix}pharmacist-summary`,
+  );
+}
+
+/**
+ * 诊所今日摘要
+ */
+export async function getClinicSummaryApi() {
+  return requestClient.get<ClinicSummaryResult>(`${prefix}clinic-summary`);
+}
+
+/**
+ * 订单管理员摘要
+ */
+export async function getOrderSummaryApi() {
+  return requestClient.get<OrderSummaryResult>(`${prefix}order-summary`);
+}
+
+/**
+ * 平台今日总览（超管/系统管理员）
+ */
+export async function getPlatformOverviewApi() {
+  return requestClient.get<PlatformOverviewResult>(
+    `${prefix}platform-overview`,
+  );
+}
+
+/**
+ * 待办中心（超管/系统管理员）
+ */
+export async function getTodoCenterApi() {
+  return requestClient.get<TodoCenterResult>(`${prefix}todo-center`);
+}
+
+/**
+ * 未来7天预约号统计（卡片：总数 + 按天分布，scope 后端按登录身份判定）
+ */
+export async function getAppointmentUpcomingApi() {
+  return requestClient.get<AppointmentUpcomingResult>(
+    `${prefix}appointment-upcoming`,
+  );
+}
+
+/**
+ * 未来7天预约明细（卡片点击弹窗：分页 + 日期筛选）
+ */
+export async function getAppointmentUpcomingListApi(data: {
+  page: number;
+  page_size: number;
+  visit_date?: string;
+}) {
+  return requestClient.get<AppointmentUpcomingListResult>(
+    `${prefix}appointment-upcoming-list`,
+    { params: data },
+  );
+}
diff --git a/apps/web-antd/src/views/dashboard/workspace/components/KpiCard.vue b/apps/web-antd/src/views/dashboard/workspace/components/KpiCard.vue
new file mode 100644
index 00000000..c3159dfe
--- /dev/null
+++ b/apps/web-antd/src/views/dashboard/workspace/components/KpiCard.vue
@@ -0,0 +1,244 @@
+<script lang="ts" setup>
+/**
+ * KPI 卡片壳：统一「渐变竖条标题 + 芯片区」的 Premium 外壳
+ * 为什么：各角色 KPI 组件共用同一外壳，避免每个组件复制标题/容器样式
+ * 同时统一收口加载骨架 / 失败重试 / 手动刷新，KPI 组件只管拉数与渲染芯片
+ */
+import { IconifyIcon as VbenIcon } from '@vben/icons';
+
+interface Props {
+  /** 卡片标题 */
+  title: string;
+  /** 标题右侧补充说明（如「近7天」） */
+  subtitle?: string;
+  /** 加载中：渲染骨架占位，不再整卡消失 */
+  loading?: boolean;
+  /** 请求失败：渲染错误行 + 重试按钮 */
+  error?: boolean;
+}
+
+withDefaults(defineProps<Props>(), {
+  subtitle: '',
+  loading: false,
+  error: false,
+});
+
+const emit = defineEmits<{
+  /** 点击刷新/重试时触发，由外部组件重新拉数 */
+  refresh: [];
+}>();
+</script>
+
+<template>
+  <div class="kpi-card">
+    <div class="kpi-card__head">
+      <span class="kpi-card__title-bar"></span>
+      <span class="kpi-card__title">{{ title }}</span>
+      <span v-if="subtitle" class="kpi-card__subtitle">{{ subtitle }}</span>
+      <button
+        type="button"
+        class="kpi-card__refresh"
+        :class="{ 'is-loading': loading }"
+        :disabled="loading"
+        aria-label="刷新"
+        @click="emit('refresh')"
+      >
+        <VbenIcon icon="lucide:refresh-cw" />
+      </button>
+    </div>
+
+    <!-- 加载骨架：占位形状与统计芯片一致，避免布局跳动 -->
+    <div v-if="loading" class="kpi-card__chips" aria-label="加载中">
+      <div v-for="n in 3" :key="n" class="kpi-skeleton">
+        <div class="sk sk-icon"></div>
+        <div class="sk-lines">
+          <div class="sk sk-value"></div>
+          <div class="sk sk-label"></div>
+        </div>
+      </div>
+    </div>
+
+    <!-- 失败态：可重试，不再静默消失 -->
+    <div v-else-if="error" class="kpi-card__error">
+      <VbenIcon icon="lucide:cloud-off" class="kpi-card__error-icon" />
+      <span>数据加载失败</span>
+      <button type="button" class="kpi-card__retry" @click="emit('refresh')">
+        重试
+      </button>
+    </div>
+
+    <div v-else class="kpi-card__chips">
+      <slot></slot>
+    </div>
+  </div>
+</template>
+
+<style scoped>
+.kpi-card {
+  padding: 18px 20px;
+  background: hsl(var(--card));
+  border: 1px solid hsl(var(--border) / 0.7);
+  border-radius: 12px;
+}
+
+.kpi-card__head {
+  display: flex;
+  gap: 8px;
+  align-items: center;
+  margin-bottom: 12px;
+}
+
+.kpi-card__title-bar {
+  width: 3px;
+  height: 14px;
+  background: linear-gradient(180deg, hsl(var(--primary)), hsl(var(--primary) / 0.4));
+  border-radius: 2px;
+}
+
+.kpi-card__title {
+  font-size: 15px;
+  font-weight: 650;
+  color: hsl(var(--foreground));
+  letter-spacing: -0.01em;
+}
+
+.kpi-card__subtitle {
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+}
+
+/* 刷新按钮：靠右，hover 才显主色，避免抢视觉 */
+.kpi-card__refresh {
+  display: grid;
+  place-items: center;
+  width: 26px;
+  height: 26px;
+  margin-left: auto;
+  border: none;
+  border-radius: 8px;
+  background: transparent;
+  color: hsl(var(--muted-foreground));
+  cursor: pointer;
+  transition:
+    color 0.15s ease,
+    background 0.15s ease;
+}
+
+.kpi-card__refresh:hover:not(:disabled) {
+  color: hsl(var(--primary));
+  background: hsl(var(--primary) / 0.08);
+}
+
+.kpi-card__refresh :deep(svg) {
+  width: 14px;
+  height: 14px;
+}
+
+.kpi-card__refresh.is-loading :deep(svg) {
+  animation: kpi-spin 0.8s linear infinite;
+}
+
+.kpi-card__chips {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 10px;
+}
+
+/* ===== 骨架占位 ===== */
+.kpi-skeleton {
+  display: flex;
+  gap: 12px;
+  align-items: center;
+  min-width: 128px;
+  padding: 14px 16px;
+  border: 1px solid hsl(var(--border) / 0.5);
+  border-radius: 12px;
+}
+
+.sk {
+  border-radius: 8px;
+  background: linear-gradient(
+    90deg,
+    hsl(var(--muted) / 0.5) 25%,
+    hsl(var(--muted) / 0.3) 50%,
+    hsl(var(--muted) / 0.5) 75%
+  );
+  background-size: 200% 100%;
+  animation: kpi-shimmer 1.4s ease-in-out infinite;
+}
+
+.sk-icon {
+  width: 40px;
+  height: 40px;
+  border-radius: 10px;
+}
+
+.sk-lines {
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+}
+
+.sk-value {
+  width: 56px;
+  height: 18px;
+}
+
+.sk-label {
+  width: 40px;
+  height: 10px;
+}
+
+/* ===== 失败态 ===== */
+.kpi-card__error {
+  display: flex;
+  gap: 8px;
+  align-items: center;
+  padding: 14px 4px;
+  font-size: 13px;
+  color: hsl(var(--muted-foreground));
+}
+
+.kpi-card__error-icon {
+  width: 16px;
+  height: 16px;
+}
+
+.kpi-card__retry {
+  height: 26px;
+  padding: 0 12px;
+  border: 1px solid hsl(var(--primary) / 0.35);
+  border-radius: 999px;
+  background: hsl(var(--primary) / 0.06);
+  color: hsl(var(--primary));
+  font-size: 12px;
+  cursor: pointer;
+  transition: background 0.15s ease;
+}
+
+.kpi-card__retry:hover {
+  background: hsl(var(--primary) / 0.12);
+}
+
+@keyframes kpi-spin {
+  to {
+    transform: rotate(360deg);
+  }
+}
+
+@keyframes kpi-shimmer {
+  0% {
+    background-position: 200% 0;
+  }
+  100% {
+    background-position: -200% 0;
+  }
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .sk,
+  .kpi-card__refresh.is-loading :deep(svg) {
+    animation: none;
+  }
+}
+</style>
diff --git a/apps/web-antd/src/views/dashboard/workspace/components/NoticeTicker.vue b/apps/web-antd/src/views/dashboard/workspace/components/NoticeTicker.vue
new file mode 100644
index 00000000..fa62a432
--- /dev/null
+++ b/apps/web-antd/src/views/dashboard/workspace/components/NoticeTicker.vue
@@ -0,0 +1,455 @@
+<script lang="ts" setup>
+/**
+ * 公告轮播条（单行）：看板卡内嵌 / 独立卡两种形态
+ * 为什么做成单行轮播：公告曝光频率需求低但要常驻，列表卡占一整列太浪费；
+ * 压成一行自动轮播（5s 一条，hover 暂停、可手动翻页），点击弹详情，
+ * 把首屏空间让给快捷入口与日历。取代原 WidgetNotice 列表卡（该组件已弃用保留）
+ * 形态：默认内嵌（驾驶舱卡底部，带上分隔线）；standalone 独立卡（无驾驶舱角色全宽一行）
+ */
+import { computed, onMounted, onUnmounted, ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+import { IconifyIcon as VbenIcon } from '@vben/icons';
+
+import { getLatestNotice } from '#/views/system/notice/api';
+
+interface Props {
+  /** 独立卡形态：无驾驶舱角色时公告条单独成行（带卡片壳） */
+  standalone?: boolean;
+}
+withDefaults(defineProps<Props>(), { standalone: false });
+
+/** 公告项（announcement/latest 返回结构） */
+type NoticeItem = {
+  avatar: string;
+  content: string;
+  date: string;
+  title: string;
+};
+
+/** 展示用公告项：附加前端推导的类型标签 */
+type DisplayNoticeItem = NoticeItem & {
+  typeLabel: string;
+  typeTone: 'danger' | 'info' | 'primary' | 'warning';
+};
+
+/**
+ * 按标题关键词推导公告类型（纯前端展示，后端无类型字段）
+ * 顺序：维护类优先（最需要注意）→ 更新 → 活动 → 默认公告
+ */
+function resolveNoticeType(title: string): Pick<DisplayNoticeItem, 'typeLabel' | 'typeTone'> {
+  const t = title || '';
+  if (/维护|停机|故障/.test(t)) return { typeLabel: '维护', typeTone: 'danger' };
+  if (/更新|升级|版本|上线/.test(t)) return { typeLabel: '更新', typeTone: 'info' };
+  if (/活动|福利|优惠|节/.test(t)) return { typeLabel: '活动', typeTone: 'warning' };
+  return { typeLabel: '公告', typeTone: 'primary' };
+}
+
+const items = ref<DisplayNoticeItem[]>([]);
+/** 当前轮播下标 */
+const idx = ref(0);
+/** hover 时暂停自动轮播，避免用户正在读时被切走 */
+const paused = ref(false);
+let timer: null | ReturnType<typeof setInterval> = null;
+
+const current = computed(() => items.value[idx.value] || null);
+
+/** 详情弹层当前展示的公告 */
+const activeItem = ref<DisplayNoticeItem | null>(null);
+
+/** 公告详情弹层：只读展示，关闭默认页脚按钮 */
+const [DetailModal, detailModalApi] = useVbenModal({
+  footer: false,
+  header: false,
+  closable: true,
+  class: 'w-[560px]',
+});
+
+/** 弹层类型 pill 的 tone class（避免模板里拼接字符串） */
+const activeToneClass = computed(() =>
+  activeItem.value ? `pill--${activeItem.value.typeTone}` : '',
+);
+
+/**
+ * 拉取最新公告并附加类型标签；失败静默隐藏整条（空数组时组件不渲染）
+ */
+async function fetchLatest() {
+  try {
+    const res = await getLatestNotice(10);
+    const list: NoticeItem[] = Array.isArray(res) ? res : [];
+    items.value = list.map((it) => ({ ...it, ...resolveNoticeType(it.title) }));
+  } catch {
+    items.value = [];
+  }
+}
+
+/** 下一条（自动轮播与手动共用，循环） */
+function next() {
+  if (items.value.length === 0) return;
+  idx.value = (idx.value + 1) % items.value.length;
+}
+
+/** 上一条（循环） */
+function prev() {
+  if (items.value.length === 0) return;
+  idx.value = (idx.value - 1 + items.value.length) % items.value.length;
+}
+
+/** 打开详情弹层（content 已全量在手，无需再请求） */
+function openDetail(item: DisplayNoticeItem) {
+  activeItem.value = item;
+  detailModalApi.open();
+}
+
+onMounted(async () => {
+  await fetchLatest();
+  // 只有多于一条才需要轮播
+  if (items.value.length > 1) {
+    timer = setInterval(() => {
+      if (!paused.value) next();
+    }, 5000);
+  }
+});
+
+onUnmounted(() => {
+  if (timer) clearInterval(timer);
+});
+</script>
+
+<template>
+  <div
+    v-if="items.length > 0"
+    class="notice-ticker"
+    :class="{ standalone }"
+    @mouseenter="paused = true"
+    @mouseleave="paused = false"
+  >
+    <span class="nt-megaphone">
+      <VbenIcon icon="lucide:megaphone" />
+    </span>
+    <!-- 轮播视口：固定一行高，新条从下滚入、旧条向上滚出 -->
+    <div class="nt-viewport" role="button" tabindex="0" @click="current && openDetail(current)">
+      <Transition name="nt-roll">
+        <div v-if="current" :key="idx" class="nt-line">
+          <span class="pill" :class="`pill--${current.typeTone}`">{{ current.typeLabel }}</span>
+          <span class="nt-title">{{ current.title }}</span>
+          <!-- 公告内容后端可控，沿用原工作台富文本渲染（单行截断）；用 div 避免 span 内嵌块级标签 -->
+          <!-- eslint-disable-next-line vue/no-v-html -->
+          <div class="nt-summary" v-html="current.content"></div>
+          <span class="nt-date">{{ current.date }}</span>
+        </div>
+      </Transition>
+    </div>
+    <div class="nt-ctrl">
+      <button class="nt-ctrl-btn" title="上一条" type="button" @click.stop="prev">
+        <VbenIcon icon="lucide:chevron-up" />
+      </button>
+      <span class="nt-ctrl-count">{{ idx + 1 }}/{{ items.length }}</span>
+      <button class="nt-ctrl-btn" title="下一条" type="button" @click.stop="next">
+        <VbenIcon icon="lucide:chevron-down" />
+      </button>
+    </div>
+
+    <!-- 公告详情弹层：premium 风格 hero 头 + 富文本正文（沿用原列表卡的弹层设计） -->
+    <DetailModal>
+      <div v-if="activeItem" class="notice-detail">
+        <div class="notice-detail__hero">
+          <span class="notice-detail__hero-icon">
+            <VbenIcon :icon="activeItem.avatar || 'lucide:megaphone'" />
+          </span>
+          <div class="notice-detail__hero-meta">
+            <div class="notice-detail__hero-top">
+              <span class="pill" :class="activeToneClass">
+                {{ activeItem.typeLabel }}
+              </span>
+              <span class="notice-detail__date">{{ activeItem.date }}</span>
+            </div>
+            <div class="notice-detail__title">{{ activeItem.title }}</div>
+          </div>
+        </div>
+        <!-- 公告内容后端可控，沿用列表同源富文本渲染 -->
+        <!-- eslint-disable-next-line vue/no-v-html -->
+        <div class="notice-detail__content" v-html="activeItem.content"></div>
+      </div>
+    </DetailModal>
+  </div>
+</template>
+
+<style scoped>
+/* 内嵌形态（默认）：驾驶舱卡底部一行，上分隔线与数据区分层 */
+.notice-ticker {
+  display: flex;
+  gap: 10px;
+  align-items: center;
+  margin-top: 14px;
+  padding-top: 12px;
+  border-top: 1px solid hsl(var(--border) / 0.6);
+}
+
+/* 独立卡形态：无驾驶舱角色时单独成行 */
+.notice-ticker.standalone {
+  margin-top: 0;
+  padding: 12px 20px;
+  background: hsl(var(--card));
+  border: 1px solid hsl(var(--border) / 0.7);
+  border-radius: 12px;
+}
+
+.nt-megaphone {
+  display: grid;
+  flex-shrink: 0;
+  place-items: center;
+  width: 26px;
+  height: 26px;
+  color: hsl(var(--primary));
+  background: hsl(var(--primary) / 0.09);
+  border-radius: 8px;
+}
+
+.nt-megaphone :deep(svg) {
+  width: 14px;
+  height: 14px;
+}
+
+/* 轮播视口：固定一行高 + 裁剪滚动动画 */
+.nt-viewport {
+  position: relative;
+  flex: 1;
+  height: 22px;
+  min-width: 0;
+  overflow: hidden;
+  cursor: pointer;
+  outline: none;
+}
+
+.nt-line {
+  position: absolute;
+  inset: 0;
+  display: flex;
+  gap: 8px;
+  align-items: center;
+  min-width: 0;
+}
+
+.nt-title {
+  flex-shrink: 0;
+  max-width: 40%;
+  overflow: hidden;
+  font-size: 13px;
+  font-weight: 550;
+  color: hsl(var(--foreground));
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.nt-viewport:hover .nt-title {
+  color: hsl(var(--primary));
+}
+
+/* 摘要吃掉剩余宽度单行截断 */
+.nt-summary {
+  flex: 1;
+  min-width: 0;
+  overflow: hidden;
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.nt-summary :deep(a) {
+  color: hsl(var(--primary));
+}
+
+/* 富文本里的段落压平成行内，避免默认 margin 撑破单行视口 */
+.nt-summary :deep(p) {
+  display: inline;
+  margin: 0;
+}
+
+.nt-date {
+  flex-shrink: 0;
+  font-size: 12px;
+  color: hsl(var(--muted-foreground) / 0.8);
+  white-space: nowrap;
+}
+
+/* 翻页控制：上一条/序号/下一条 */
+.nt-ctrl {
+  display: flex;
+  flex-shrink: 0;
+  gap: 2px;
+  align-items: center;
+}
+
+.nt-ctrl-btn {
+  display: grid;
+  place-items: center;
+  width: 20px;
+  height: 20px;
+  color: hsl(var(--muted-foreground));
+  cursor: pointer;
+  background: transparent;
+  border: none;
+  border-radius: 6px;
+  transition: color 0.15s ease, background-color 0.15s ease;
+}
+
+.nt-ctrl-btn:hover {
+  color: hsl(var(--primary));
+  background: hsl(var(--primary) / 0.08);
+}
+
+.nt-ctrl-btn :deep(svg) {
+  width: 13px;
+  height: 13px;
+}
+
+.nt-ctrl-count {
+  min-width: 32px;
+  font-size: 11px;
+  color: hsl(var(--muted-foreground) / 0.8);
+  text-align: center;
+  font-variant-numeric: tabular-nums;
+}
+
+/* 垂直滚动动画：新条从下滚入、旧条向上滚出（广播 ticker 惯例） */
+.nt-roll-enter-active,
+.nt-roll-leave-active {
+  transition: transform 0.4s ease, opacity 0.4s ease;
+}
+
+.nt-roll-enter-from {
+  opacity: 0;
+  transform: translateY(100%);
+}
+
+.nt-roll-leave-to {
+  opacity: 0;
+  transform: translateY(-100%);
+}
+
+/* ===== 类型 pill：主题变量着色，亮/暗自适应 ===== */
+.pill {
+  flex-shrink: 0;
+  padding: 1px 7px;
+  font-size: 11px;
+  font-weight: 600;
+  line-height: 16px;
+  border-radius: 999px;
+}
+
+.pill--primary {
+  color: hsl(var(--primary));
+  background: hsl(var(--primary) / 0.1);
+}
+
+.pill--info {
+  color: hsl(210 90% 45%);
+  background: hsl(210 90% 50% / 0.12);
+}
+
+.pill--warning {
+  color: hsl(var(--warning, 38 92% 40%));
+  background: hsl(var(--warning, 38 92% 50%) / 0.14);
+}
+
+.pill--danger {
+  color: hsl(var(--destructive));
+  background: hsl(var(--destructive) / 0.1);
+}
+
+/* ===== 详情弹层（沿用原列表卡设计语言） ===== */
+.notice-detail {
+  padding: 4px 2px 8px;
+}
+
+/* hero 头：柔和主色光斑背景 */
+.notice-detail__hero {
+  display: flex;
+  gap: 14px;
+  align-items: flex-start;
+  padding: 16px 18px;
+  margin-bottom: 16px;
+  background:
+    radial-gradient(
+      80% 120% at 0% 0%,
+      hsl(var(--primary) / 0.14),
+      transparent 60%
+    ),
+    linear-gradient(
+      165deg,
+      hsl(var(--muted) / 0.4),
+      hsl(var(--card, var(--background)))
+    );
+  border: 1px solid hsl(var(--border));
+  border-radius: 14px;
+}
+
+.notice-detail__hero-icon {
+  display: grid;
+  flex-shrink: 0;
+  place-items: center;
+  width: 42px;
+  height: 42px;
+  color: hsl(var(--primary));
+  background: hsl(var(--primary) / 0.12);
+  border-radius: 12px;
+}
+
+.notice-detail__hero-icon :deep(svg) {
+  width: 20px;
+  height: 20px;
+}
+
+.notice-detail__hero-meta {
+  flex: 1;
+  min-width: 0;
+}
+
+.notice-detail__hero-top {
+  display: flex;
+  gap: 8px;
+  align-items: center;
+}
+
+.notice-detail__date {
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+}
+
+.notice-detail__title {
+  margin-top: 6px;
+  font-size: 17px;
+  font-weight: 700;
+  color: hsl(var(--foreground));
+  letter-spacing: -0.02em;
+  overflow-wrap: break-word;
+}
+
+.notice-detail__content {
+  max-height: 52vh;
+  padding: 0 2px;
+  overflow-y: auto;
+  font-size: 13.5px;
+  line-height: 1.75;
+  color: hsl(var(--foreground) / 0.88);
+  overflow-wrap: break-word;
+}
+
+.notice-detail__content :deep(a) {
+  color: hsl(var(--primary));
+}
+
+.notice-detail__content :deep(img) {
+  max-width: 100%;
+  border-radius: 10px;
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .nt-roll-enter-active,
+  .nt-roll-leave-active {
+    transition: none;
+  }
+}
+</style>
diff --git a/apps/web-antd/src/views/dashboard/workspace/components/StatChip.vue b/apps/web-antd/src/views/dashboard/workspace/components/StatChip.vue
new file mode 100644
index 00000000..0773acc2
--- /dev/null
+++ b/apps/web-antd/src/views/dashboard/workspace/components/StatChip.vue
@@ -0,0 +1,133 @@
+<script lang="ts" setup>
+/**
+ * KPI 统计卡：小图标 + 大数字 + 小标签，整卡可点跳转业务页
+ * Premium 视觉：tinted 图标容器、hover 轻抬升 + primary 描边透出；颜色全走主题变量，亮/暗自适应
+ */
+import { IconifyIcon as VbenIcon } from '@vben/icons';
+
+interface Props {
+  /** 指标标签 */
+  label: string;
+  /** 指标值（数字或金额字符串） */
+  value: number | string;
+  /** 高亮强调（如待办数 > 0 时用主题色） */
+  highlight?: boolean;
+  /** iconify 图标名（可选） */
+  icon?: string;
+}
+
+withDefaults(defineProps<Props>(), {
+  highlight: false,
+  icon: '',
+});
+
+defineEmits(['click']);
+</script>
+
+<template>
+  <div class="stat-chip" :class="{ 'stat-chip--hl': highlight }" @click="$emit('click')">
+    <div v-if="icon" class="stat-chip__icon-box">
+      <VbenIcon :icon="icon" class="stat-chip__icon" />
+    </div>
+    <div class="stat-chip__meta">
+      <span class="stat-chip__value">{{ value }}</span>
+      <span class="stat-chip__label">{{ label }}</span>
+    </div>
+  </div>
+</template>
+
+<style scoped>
+.stat-chip {
+  display: flex;
+  gap: 12px;
+  align-items: center;
+  min-width: 128px;
+  padding: 14px 16px;
+  cursor: pointer;
+  background: hsl(var(--card));
+  border: 1px solid hsl(var(--border) / 0.7);
+  border-radius: 12px;
+  transition:
+    transform 0.2s cubic-bezier(0.4, 0, 0.2, 1),
+    border-color 0.2s ease,
+    box-shadow 0.2s ease;
+}
+
+.stat-chip:hover {
+  transform: translateY(-1px);
+  border-color: hsl(var(--primary) / 0.35);
+  box-shadow:
+    0 1px 2px hsl(var(--foreground) / 0.04),
+    0 8px 24px hsl(var(--primary) / 0.08);
+}
+
+/* 高亮卡：待办类指标底色轻着色，暗色下同样柔和 */
+.stat-chip--hl {
+  background: linear-gradient(
+    135deg,
+    hsl(var(--primary) / 0.08),
+    hsl(var(--card)) 65%
+  );
+  border-color: hsl(var(--primary) / 0.25);
+}
+
+.stat-chip__icon-box {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 40px;
+  height: 40px;
+  background: hsl(var(--primary) / 0.1);
+  border-radius: 10px;
+  flex-shrink: 0;
+  transition: background-color 0.2s ease;
+}
+
+.stat-chip:hover .stat-chip__icon-box {
+  background: hsl(var(--primary) / 0.16);
+}
+
+.stat-chip__icon {
+  width: 20px;
+  height: 20px;
+  color: hsl(var(--primary));
+}
+
+.stat-chip__meta {
+  display: flex;
+  flex-direction: column;
+  gap: 1px;
+  min-width: 0;
+}
+
+.stat-chip__value {
+  overflow: hidden;
+  font-size: 22px;
+  font-weight: 650;
+  line-height: 1.2;
+  color: hsl(var(--foreground));
+  letter-spacing: -0.02em;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.stat-chip--hl .stat-chip__value {
+  color: hsl(var(--primary));
+}
+
+.stat-chip__label {
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+}
+
+/* 用户偏好减少动效时关闭位移动画 */
+@media (prefers-reduced-motion: reduce) {
+  .stat-chip {
+    transition: none;
+  }
+
+  .stat-chip:hover {
+    transform: none;
+  }
+}
+</style>
diff --git a/apps/web-antd/src/views/dashboard/workspace/components/WidgetAdminHub.vue b/apps/web-antd/src/views/dashboard/workspace/components/WidgetAdminHub.vue
new file mode 100644
index 00000000..7e458c42
--- /dev/null
+++ b/apps/web-antd/src/views/dashboard/workspace/components/WidgetAdminHub.vue
@@ -0,0 +1,408 @@
+<script lang="ts" setup>
+/**
+ * 管理驾驶舱合并卡（超管/系统管理员）：平台总览 + 待办中心整合为一张卡
+ * 为什么合并：两个模块都是「今日经营快照」，拆成两张卡会让首屏纵向过长；
+ * 合并后放在工作台顶部左列，与右列公告构成一行，信息密度更高
+ * 数据仍走 workbench/platform-overview 与 workbench/todo-center 两个接口并行拉取
+ */
+import type { PlatformOverviewResult, TodoCenterItem } from '../api';
+
+import { computed, onMounted, ref } from 'vue';
+import { useRouter } from 'vue-router';
+
+import { IconifyIcon as VbenIcon } from '@vben/icons';
+
+import { getPlatformOverviewApi, getTodoCenterApi } from '../api';
+import StatChip from './StatChip.vue';
+
+interface Props {
+  /** 总览分区标题（来自布局下发的 platform_overview.title） */
+  overviewTitle: string;
+  /** 待办分区标题（来自布局下发的 todo_center.title），未配置时兜底「待办中心」 */
+  todoTitle?: string;
+}
+const props = withDefaults(defineProps<Props>(), {
+  todoTitle: '待办中心',
+});
+
+/** 待办 code → 图标映射（后端只下发 code，图标属于前端展示细节） */
+const TODO_ICON_MAP: Record<string, string> = {
+  prescription_pending: 'lucide:shield-check',
+  withdraw_pending: 'lucide:banknote',
+  store_input_pending: 'lucide:store',
+  wait_delivery: 'lucide:package',
+  refunding: 'lucide:rotate-ccw',
+};
+
+const router = useRouter();
+const overview = ref<null | PlatformOverviewResult>(null);
+const todoItems = ref<TodoCenterItem[]>([]);
+const loading = ref(true);
+const error = ref(false);
+
+/** 待办全部清零时展示鼓励空态，而不是一排 0 */
+const allClear = computed(
+  () => todoItems.value.length > 0 && todoItems.value.every((it) => it.count <= 0),
+);
+
+/**
+ * 并行拉取总览与待办；任一失败进入整卡错误态可重试
+ * 为什么整卡而不是分区错误：两个接口来自同一后端服务，同挂同恢复，分区错误徒增复杂度
+ */
+async function fetchAll() {
+  loading.value = true;
+  error.value = false;
+  try {
+    const [ov, todo] = await Promise.all([
+      getPlatformOverviewApi(),
+      getTodoCenterApi(),
+    ]);
+    overview.value = ov;
+    todoItems.value = todo.items || [];
+  } catch {
+    error.value = true;
+  } finally {
+    loading.value = false;
+  }
+}
+
+/** 跳转指定路由（失败静默，避免无权限菜单时报错） */
+function go(path: string) {
+  if (!path) return;
+  router.push(path).catch(() => {});
+}
+
+onMounted(fetchAll);
+</script>
+
+<template>
+  <div class="admin-hub">
+    <!-- 总览分区头：标题 + 今日说明 + 整卡刷新 -->
+    <div class="admin-hub__head">
+      <span class="admin-hub__title-bar"></span>
+      <span class="admin-hub__title">{{ props.overviewTitle }}</span>
+      <span class="admin-hub__subtitle">今日</span>
+      <button
+        type="button"
+        class="admin-hub__refresh"
+        :class="{ 'is-loading': loading }"
+        :disabled="loading"
+        aria-label="刷新"
+        @click="fetchAll"
+      >
+        <VbenIcon icon="lucide:refresh-cw" />
+      </button>
+    </div>
+
+    <!-- 加载骨架：总览与待办两组芯片占位，避免布局跳动 -->
+    <template v-if="loading">
+      <div class="admin-hub__chips" aria-label="加载中">
+        <div v-for="n in 4" :key="n" class="hub-skeleton">
+          <div class="sk sk-icon"></div>
+          <div class="sk-lines">
+            <div class="sk sk-value"></div>
+            <div class="sk sk-label"></div>
+          </div>
+        </div>
+      </div>
+      <div class="admin-hub__divider"></div>
+      <div class="admin-hub__chips" aria-label="加载中">
+        <div v-for="n in 5" :key="n" class="hub-skeleton">
+          <div class="sk sk-icon"></div>
+          <div class="sk-lines">
+            <div class="sk sk-value"></div>
+            <div class="sk sk-label"></div>
+          </div>
+        </div>
+      </div>
+    </template>
+
+    <!-- 失败态：整卡重试 -->
+    <div v-else-if="error" class="admin-hub__error">
+      <VbenIcon icon="lucide:cloud-off" class="admin-hub__error-icon" />
+      <span>数据加载失败</span>
+      <button type="button" class="admin-hub__retry" @click="fetchAll">
+        重试
+      </button>
+    </div>
+
+    <template v-else>
+      <!-- 平台总览：四个统计芯片撑满一行 -->
+      <div v-if="overview" class="admin-hub__chips">
+        <StatChip
+          :value="overview.order_count"
+          icon="lucide:shopping-cart"
+          label="今日订单"
+          @click="go('/order/product-order')"
+        />
+        <StatChip
+          :value="`¥${overview.revenue}`"
+          icon="lucide:banknote"
+          label="今日营业额"
+          @click="go('/order/product-order')"
+        />
+        <StatChip
+          :value="overview.register_count"
+          icon="lucide:stethoscope"
+          label="今日挂号"
+          @click="go('/business/register/list')"
+        />
+        <StatChip
+          :value="overview.store_input_count"
+          icon="lucide:store"
+          label="新增门店录入"
+          @click="go('/system/store-input')"
+        />
+      </div>
+
+      <div class="admin-hub__divider"></div>
+
+      <!-- 待办中心分区 -->
+      <div class="admin-hub__sub-head">
+        <span class="admin-hub__title-bar admin-hub__title-bar--sub"></span>
+        <span class="admin-hub__sub-title">{{ props.todoTitle }}</span>
+      </div>
+
+      <div v-if="allClear" class="admin-hub__clear">
+        <VbenIcon icon="lucide:party-popper" class="admin-hub__clear-icon" />
+        <span>今日无待办，全部处理完毕</span>
+      </div>
+
+      <!-- 待办改用统计芯片（与总览同视觉），count>0 高亮提示优先处理 -->
+      <div v-else class="admin-hub__chips">
+        <StatChip
+          v-for="item in todoItems"
+          :key="item.code"
+          :value="item.count > 999 ? '999+' : item.count"
+          :label="item.label"
+          :icon="TODO_ICON_MAP[item.code] || 'lucide:list-todo'"
+          :highlight="item.count > 0"
+          @click="go(item.path)"
+        />
+      </div>
+    </template>
+
+    <!-- 卡底公告轮播条：父级按布局配置注入（NoticeTicker），数据源独立不受本卡 loading 影响 -->
+    <slot name="notice"></slot>
+  </div>
+</template>
+
+<style scoped>
+.admin-hub {
+  height: 100%;
+  padding: 18px 20px;
+  background: hsl(var(--card));
+  border: 1px solid hsl(var(--border) / 0.7);
+  border-radius: 12px;
+}
+
+.admin-hub__head {
+  display: flex;
+  gap: 8px;
+  align-items: center;
+  margin-bottom: 12px;
+}
+
+.admin-hub__title-bar {
+  width: 3px;
+  height: 14px;
+  background: linear-gradient(180deg, hsl(var(--primary)), hsl(var(--primary) / 0.4));
+  border-radius: 2px;
+}
+
+.admin-hub__title-bar--sub {
+  height: 12px;
+  opacity: 0.7;
+}
+
+.admin-hub__title {
+  font-size: 15px;
+  font-weight: 650;
+  color: hsl(var(--foreground));
+  letter-spacing: -0.01em;
+}
+
+.admin-hub__subtitle {
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+}
+
+/* 刷新按钮：靠右，hover 才显主色 */
+.admin-hub__refresh {
+  display: grid;
+  place-items: center;
+  width: 26px;
+  height: 26px;
+  margin-left: auto;
+  border: none;
+  border-radius: 8px;
+  background: transparent;
+  color: hsl(var(--muted-foreground));
+  cursor: pointer;
+  transition:
+    color 0.15s ease,
+    background 0.15s ease;
+}
+
+.admin-hub__refresh:hover:not(:disabled) {
+  color: hsl(var(--primary));
+  background: hsl(var(--primary) / 0.08);
+}
+
+.admin-hub__refresh :deep(svg) {
+  width: 14px;
+  height: 14px;
+}
+
+.admin-hub__refresh.is-loading :deep(svg) {
+  animation: hub-spin 0.8s linear infinite;
+}
+
+/* 统计芯片区（总览与待办共用）：芯片等分撑满一行，放不下自动换行 */
+.admin-hub__chips {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 10px;
+}
+
+.admin-hub__chips :deep(.stat-chip) {
+  flex: 1;
+  min-width: 128px;
+}
+
+.admin-hub__divider {
+  height: 1px;
+  margin: 14px 0;
+  background: hsl(var(--border) / 0.6);
+}
+
+.admin-hub__sub-head {
+  display: flex;
+  gap: 8px;
+  align-items: center;
+  margin-bottom: 10px;
+}
+
+.admin-hub__sub-title {
+  font-size: 13.5px;
+  font-weight: 600;
+  color: hsl(var(--foreground));
+}
+
+/* 空态：全部清零 */
+.admin-hub__clear {
+  display: flex;
+  gap: 8px;
+  align-items: center;
+  padding: 14px 4px;
+  font-size: 13px;
+  color: hsl(var(--muted-foreground));
+}
+
+.admin-hub__clear-icon {
+  width: 18px;
+  height: 18px;
+  color: hsl(var(--primary));
+}
+
+/* ===== 骨架占位 ===== */
+.hub-skeleton {
+  display: flex;
+  gap: 12px;
+  align-items: center;
+  flex: 1;
+  min-width: 128px;
+  padding: 14px 16px;
+  border: 1px solid hsl(var(--border) / 0.5);
+  border-radius: 12px;
+}
+
+.sk {
+  border-radius: 8px;
+  background: linear-gradient(
+    90deg,
+    hsl(var(--muted) / 0.5) 25%,
+    hsl(var(--muted) / 0.3) 50%,
+    hsl(var(--muted) / 0.5) 75%
+  );
+  background-size: 200% 100%;
+  animation: hub-shimmer 1.4s ease-in-out infinite;
+}
+
+.sk-icon {
+  width: 40px;
+  height: 40px;
+  border-radius: 10px;
+}
+
+.sk-lines {
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+}
+
+.sk-value {
+  width: 56px;
+  height: 18px;
+}
+
+.sk-label {
+  width: 40px;
+  height: 10px;
+}
+
+/* ===== 失败态 ===== */
+.admin-hub__error {
+  display: flex;
+  gap: 8px;
+  align-items: center;
+  padding: 14px 4px;
+  font-size: 13px;
+  color: hsl(var(--muted-foreground));
+}
+
+.admin-hub__error-icon {
+  width: 16px;
+  height: 16px;
+}
+
+.admin-hub__retry {
+  height: 26px;
+  padding: 0 12px;
+  border: 1px solid hsl(var(--primary) / 0.35);
+  border-radius: 999px;
+  background: hsl(var(--primary) / 0.06);
+  color: hsl(var(--primary));
+  font-size: 12px;
+  cursor: pointer;
+  transition: background 0.15s ease;
+}
+
+.admin-hub__retry:hover {
+  background: hsl(var(--primary) / 0.12);
+}
+
+@keyframes hub-spin {
+  to {
+    transform: rotate(360deg);
+  }
+}
+
+@keyframes hub-shimmer {
+  0% {
+    background-position: 200% 0;
+  }
+
+  100% {
+    background-position: -200% 0;
+  }
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .sk,
+  .admin-hub__refresh.is-loading :deep(svg) {
+    animation: none;
+    transition: none;
+  }
+}
+</style>
diff --git a/apps/web-antd/src/views/dashboard/workspace/components/WidgetAppointmentUpcoming.vue b/apps/web-antd/src/views/dashboard/workspace/components/WidgetAppointmentUpcoming.vue
new file mode 100644
index 00000000..bf2f5c97
--- /dev/null
+++ b/apps/web-antd/src/views/dashboard/workspace/components/WidgetAppointmentUpcoming.vue
@@ -0,0 +1,399 @@
+<script lang="ts" setup>
+/**
+ * 未来7天预约号卡片：总数 + 按天分布横条，点击打开明细弹窗（分页 + 日期筛选）
+ * scope 由后端按登录身份判定：医生=本人 / 诊所管理员=本店 / 平台管理员=全平台，
+ * 前端不传身份参数，防止越权拉取他人数据
+ */
+import type {
+  AppointmentUpcomingDay,
+  AppointmentUpcomingItem,
+  AppointmentUpcomingResult,
+} from '../api';
+
+import { onMounted, ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+import { IconifyIcon as VbenIcon } from '@vben/icons';
+
+import { Empty, Pagination, Spin, Tag } from 'ant-design-vue';
+
+import { getAppointmentUpcomingApi, getAppointmentUpcomingListApi } from '../api';
+import KpiCard from './KpiCard.vue';
+import StatChip from './StatChip.vue';
+
+interface Props {
+  title: string;
+}
+defineProps<Props>();
+
+const data = ref<AppointmentUpcomingResult | null>(null);
+const loading = ref(true);
+const error = ref(false);
+
+/** 明细弹窗状态：列表/分页/日期筛选（'' = 全部7天） */
+const listItems = ref<AppointmentUpcomingItem[]>([]);
+const listTotal = ref(0);
+const listLoading = ref(false);
+const listPage = ref(1);
+const listPageSize = ref(10);
+const filterDate = ref('');
+
+/** 明细弹窗：footer 关闭（纯查看），标题带统计窗口说明 */
+const [DetailModal, detailModalApi] = useVbenModal({
+  footer: false,
+  title: '未来7天预约明细',
+  class: 'w-[720px]',
+});
+
+/**
+ * 拉取卡片统计；失败进入错误态可重试
+ */
+async function fetchSummary() {
+  loading.value = true;
+  error.value = false;
+  try {
+    data.value = await getAppointmentUpcomingApi();
+  } catch {
+    error.value = true;
+  } finally {
+    loading.value = false;
+  }
+}
+
+/**
+ * 拉取明细分页（按当前筛选日期与页码）
+ */
+async function fetchList() {
+  listLoading.value = true;
+  try {
+    const res = await getAppointmentUpcomingListApi({
+      page: listPage.value,
+      page_size: listPageSize.value,
+      visit_date: filterDate.value,
+    });
+    listItems.value = res.items || [];
+    listTotal.value = res.total || 0;
+  } catch {
+    listItems.value = [];
+    listTotal.value = 0;
+  } finally {
+    listLoading.value = false;
+  }
+}
+
+/**
+ * 打开明细弹窗：默认展示全部 7 天，从第一页开始
+ */
+function openDetail(day?: AppointmentUpcomingDay) {
+  filterDate.value = day ? day.date : '';
+  listPage.value = 1;
+  detailModalApi.open();
+  fetchList();
+}
+
+/**
+ * 切换日期筛选（弹窗内 pill 点击）：回到第一页重查
+ */
+function switchFilter(date: string) {
+  if (filterDate.value === date) return;
+  filterDate.value = date;
+  listPage.value = 1;
+  fetchList();
+}
+
+/**
+ * 翻页
+ */
+function onPageChange(page: number, pageSize: number) {
+  listPage.value = page;
+  listPageSize.value = pageSize;
+  fetchList();
+}
+
+/**
+ * 状态标签颜色：待支付/待接诊需要关注用暖色，其余中性
+ */
+function statusColor(item: AppointmentUpcomingItem) {
+  if (item.is_pay !== 1) return 'orange';
+  if (item.status === 1) return 'blue';
+  if (item.status === 2) return 'processing';
+  return 'default';
+}
+
+onMounted(fetchSummary);
+</script>
+
+<template>
+  <div class="appt-widget">
+    <KpiCard
+      :title="title"
+      subtitle="含今天"
+      :loading="loading"
+      :error="error"
+      @refresh="fetchSummary"
+    >
+      <template v-if="data">
+        <StatChip
+          :highlight="data.total > 0"
+          :value="data.total"
+          icon="lucide:calendar-clock"
+          label="未来7天预约"
+          @click="openDetail()"
+        />
+        <!-- 按天分布横条：每天一格，点击直接按天筛选打开明细 -->
+        <div class="appt-days">
+          <div
+            v-for="day in data.days"
+            :key="day.date"
+            class="appt-day"
+            :class="{ 'appt-day--active': day.count > 0 }"
+            role="button"
+            tabindex="0"
+            @click="openDetail(day)"
+            @keydown.enter="openDetail(day)"
+          >
+            <span class="appt-day__label">{{ day.label }}</span>
+            <span class="appt-day__count">{{ day.count }}</span>
+            <span class="appt-day__week">{{ day.week }}</span>
+          </div>
+        </div>
+      </template>
+    </KpiCard>
+
+    <!-- 明细弹窗：日期筛选 pill + 明细行 + 分页（放卡片外层，避免随加载态卸载） -->
+    <DetailModal>
+      <div class="appt-detail">
+        <div class="appt-detail__filters">
+          <span
+            class="appt-pill"
+            :class="{ 'appt-pill--active': filterDate === '' }"
+            role="button"
+            tabindex="0"
+            @click="switchFilter('')"
+            @keydown.enter="switchFilter('')"
+          >
+            全部7天
+          </span>
+          <span
+            v-for="day in data ? data.days : []"
+            :key="day.date"
+            class="appt-pill"
+            :class="{ 'appt-pill--active': filterDate === day.date }"
+            role="button"
+            tabindex="0"
+            @click="switchFilter(day.date)"
+            @keydown.enter="switchFilter(day.date)"
+          >
+            {{ day.label }}({{ day.count }})
+          </span>
+        </div>
+
+        <Spin :spinning="listLoading">
+          <ul v-if="listItems.length > 0" class="appt-detail__list">
+            <li v-for="item in listItems" :key="item.register_id" class="appt-row">
+              <div class="appt-row__date">
+                <span class="appt-row__day">{{ item.visit_date }}</span>
+                <span class="appt-row__week">{{ item.week }}</span>
+              </div>
+              <div class="appt-row__main">
+                <div class="appt-row__line1">
+                  <span class="appt-row__patient">{{ item.patient_name || '未知就诊人' }}</span>
+                  <span class="appt-row__slot">{{ item.slot_label }}</span>
+                </div>
+                <div class="appt-row__line2">
+                  <span v-if="item.doctor_name">医生：{{ item.doctor_name }}</span>
+                  <span v-if="item.store_name">门店：{{ item.store_name }}</span>
+                  <span v-if="item.order_no">单号：{{ item.order_no }}</span>
+                </div>
+              </div>
+              <Tag :color="statusColor(item)">{{ item.status_text }}</Tag>
+            </li>
+          </ul>
+          <Empty v-else-if="!listLoading" description="暂无预约" />
+        </Spin>
+
+        <div v-if="listTotal > 0" class="appt-detail__pager">
+          <Pagination
+            :current="listPage"
+            :page-size="listPageSize"
+            :total="listTotal"
+            :show-size-changer="false"
+            size="small"
+            @change="onPageChange"
+          />
+        </div>
+      </div>
+    </DetailModal>
+  </div>
+</template>
+
+<style scoped>
+/* ===== 卡片内按天分布横条 ===== */
+.appt-days {
+  display: flex;
+  gap: 6px;
+  flex-wrap: wrap;
+  align-items: stretch;
+}
+
+.appt-day {
+  display: flex;
+  flex-direction: column;
+  gap: 2px;
+  align-items: center;
+  min-width: 52px;
+  padding: 8px 6px;
+  border: 1px solid hsl(var(--border) / 0.6);
+  border-radius: 10px;
+  cursor: pointer;
+  transition:
+    border-color 0.15s ease,
+    background 0.15s ease;
+}
+
+.appt-day:hover,
+.appt-day:focus-visible {
+  border-color: hsl(var(--primary) / 0.4);
+  background: hsl(var(--primary) / 0.05);
+  outline: none;
+}
+
+/* 有预约的天：主色轻着色突出 */
+.appt-day--active {
+  background: hsl(var(--primary) / 0.06);
+  border-color: hsl(var(--primary) / 0.25);
+}
+
+.appt-day__label {
+  font-size: 11px;
+  color: hsl(var(--muted-foreground));
+}
+
+.appt-day__count {
+  font-size: 16px;
+  font-weight: 650;
+  color: hsl(var(--foreground));
+}
+
+.appt-day--active .appt-day__count {
+  color: hsl(var(--primary));
+}
+
+.appt-day__week {
+  font-size: 10px;
+  color: hsl(var(--muted-foreground) / 0.8);
+}
+
+/* ===== 明细弹窗 ===== */
+.appt-detail {
+  padding: 2px 2px 6px;
+}
+
+.appt-detail__filters {
+  display: flex;
+  gap: 6px;
+  flex-wrap: wrap;
+  margin-bottom: 12px;
+}
+
+.appt-pill {
+  padding: 3px 10px;
+  border: 1px solid hsl(var(--border));
+  border-radius: 999px;
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+  cursor: pointer;
+  transition:
+    color 0.15s ease,
+    border-color 0.15s ease,
+    background 0.15s ease;
+}
+
+.appt-pill:hover {
+  color: hsl(var(--primary));
+  border-color: hsl(var(--primary) / 0.4);
+}
+
+.appt-pill--active {
+  color: hsl(var(--primary));
+  background: hsl(var(--primary) / 0.08);
+  border-color: hsl(var(--primary) / 0.4);
+}
+
+.appt-detail__list {
+  margin: 0;
+  padding: 0;
+  list-style: none;
+  max-height: 48vh;
+  overflow-y: auto;
+}
+
+.appt-row {
+  display: flex;
+  gap: 12px;
+  align-items: center;
+  padding: 10px 6px;
+}
+
+.appt-row + .appt-row {
+  border-top: 1px solid hsl(var(--border) / 0.5);
+}
+
+.appt-row__date {
+  display: flex;
+  flex-direction: column;
+  gap: 1px;
+  align-items: center;
+  min-width: 78px;
+  flex-shrink: 0;
+}
+
+.appt-row__day {
+  font-size: 13px;
+  font-weight: 600;
+  color: hsl(var(--foreground));
+}
+
+.appt-row__week {
+  font-size: 11px;
+  color: hsl(var(--muted-foreground));
+}
+
+.appt-row__main {
+  flex: 1;
+  min-width: 0;
+}
+
+.appt-row__line1 {
+  display: flex;
+  gap: 8px;
+  align-items: center;
+  min-width: 0;
+}
+
+.appt-row__patient {
+  font-size: 13px;
+  font-weight: 550;
+  color: hsl(var(--foreground));
+}
+
+.appt-row__slot {
+  font-size: 12px;
+  color: hsl(var(--primary));
+}
+
+.appt-row__line2 {
+  display: flex;
+  gap: 12px;
+  flex-wrap: wrap;
+  margin-top: 2px;
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+}
+
+.appt-detail__pager {
+  display: flex;
+  justify-content: flex-end;
+  margin-top: 12px;
+}
+</style>
diff --git a/apps/web-antd/src/views/dashboard/workspace/components/WidgetCalendarTodo.vue b/apps/web-antd/src/views/dashboard/workspace/components/WidgetCalendarTodo.vue
new file mode 100644
index 00000000..a0b6a0f0
--- /dev/null
+++ b/apps/web-antd/src/views/dashboard/workspace/components/WidgetCalendarTodo.vue
@@ -0,0 +1,386 @@
+<script lang="ts" setup>
+/**
+ * 工作台「日程待办」widget：放在快捷入口同一行右侧
+ * - 露出未来 7 天（含今天）的日历待办：紧凑列表自适应高度，超出内部滚动
+ * - 勾选即完成；点条目弹编辑弹窗（复用日历模块 TodoModal）；头部可新建/跳转日程日历页
+ * - 无待办时收缩为小尺寸空态，不占工作台空间
+ */
+import { computed, onMounted, ref } from 'vue';
+import { useRouter } from 'vue-router';
+
+import { useVbenModal } from '@vben/common-ui';
+import { IconifyIcon as VbenIcon } from '@vben/icons';
+
+import { Checkbox, Spin } from 'ant-design-vue';
+import dayjs from 'dayjs';
+
+import { getCalendarTodoList, toggleCalendarTodoDone } from '#/views/dashboard/calendar/api';
+import TodoModalComp from '#/views/dashboard/calendar/components/todo-modal.vue';
+
+interface Props {
+  title: string;
+}
+defineProps<Props>();
+
+const router = useRouter();
+const loading = ref(false);
+/** 未来 7 天（含今天）的待办，未完成在前、时间升序 */
+const list = ref<any[]>([]);
+
+/** 待办新建/编辑弹窗：与日程日历页共用同一组件 */
+const [TodoFormModal, todoModalApi] = useVbenModal({
+  connectedComponent: TodoModalComp,
+});
+
+/** 未完成数：标题角标 */
+const undoneCount = computed(
+  () => list.value.filter((t) => Number(t.is_done) !== 1).length,
+);
+
+/**
+ * 拉取今天 0 点起 7 天内的待办
+ * 排序策略：未完成优先（工作台关注「还要做什么」），组内按时间升序
+ */
+async function fetchTodos() {
+  loading.value = true;
+  try {
+    const start = dayjs().startOf('day');
+    const end = dayjs().add(6, 'day').endOf('day');
+    const res = await getCalendarTodoList({
+      start_time: start.unix(),
+      end_time: end.unix(),
+    });
+    list.value = (Array.isArray(res) ? res : []).sort((a: any, b: any) => {
+      const doneDiff = Number(a.is_done) - Number(b.is_done);
+      if (doneDiff !== 0) return doneDiff;
+      return Number(a.todo_time) - Number(b.todo_time);
+    });
+  } catch {
+    list.value = [];
+  } finally {
+    loading.value = false;
+  }
+}
+
+/** 行日期标签：今天/明天，更远的显示 M/D 周X */
+function dayLabel(todo: any) {
+  const t = dayjs.unix(Number(todo.todo_time)).startOf('day');
+  const diff = t.diff(dayjs().startOf('day'), 'day');
+  if (diff === 0) return '今天';
+  if (diff === 1) return '明天';
+  const weeks = ['日', '一', '二', '三', '四', '五', '六'];
+  return `${t.format('M/D')} 周${weeks[t.day()]}`;
+}
+
+/** 行时间标签：00:00 视为全天 */
+function timeLabel(todo: any) {
+  const t = dayjs.unix(Number(todo.todo_time));
+  return t.format('HH:mm') === '00:00' ? '全天' : t.format('HH:mm');
+}
+
+/** 勾选切换完成状态：本地同步字段避免整列表重拉闪烁 */
+async function onToggle(todo: any, checked: boolean) {
+  await toggleCalendarTodoDone({ id: todo.id, is_done: checked ? 1 : 0 });
+  todo.is_done = checked ? 1 : 0;
+}
+
+/** 新建待办：默认今天，保存后重拉列表 */
+function createTodo() {
+  todoModalApi
+    .setData({
+      update: false,
+      defaultDate: dayjs().format('YYYY-MM-DD'),
+      onSaved: fetchTodos,
+    })
+    .open();
+}
+
+/** 编辑待办 */
+function editTodo(todo: any) {
+  todoModalApi.setData({ update: true, values: todo, onSaved: fetchTodos }).open();
+}
+
+/** 跳转完整日程日历页（xk_menu path=/calendar） */
+function goCalendar() {
+  router.push('/calendar').catch(() => {});
+}
+
+onMounted(fetchTodos);
+</script>
+<template>
+  <div class="calendar-todo-widget">
+    <div class="ctw-head">
+      <span class="ctw-title">
+        <VbenIcon class="ctw-title-icon" icon="lucide:calendar-check-2" />
+        {{ title }}
+        <em v-if="undoneCount > 0" class="ctw-count">{{ undoneCount }}</em>
+      </span>
+      <div class="ctw-actions">
+        <button class="ctw-btn" @click="createTodo">
+          <VbenIcon icon="lucide:plus" />新建
+        </button>
+        <button class="ctw-btn ghost" title="打开日程日历" @click="goCalendar">
+          <VbenIcon icon="lucide:calendar-days" />日历
+        </button>
+      </div>
+    </div>
+    <Spin :spinning="loading">
+      <!-- 有待办：紧凑列表，超出内部滚动（列表高度自适应内容） -->
+      <div v-if="list.length > 0" class="ctw-list">
+        <div
+          v-for="todo in list"
+          :key="todo.id"
+          class="ctw-item"
+          :class="{ done: Number(todo.is_done) === 1 }"
+        >
+          <Checkbox
+            class="ctw-item-check"
+            :checked="Number(todo.is_done) === 1"
+            @change="(e: any) => onToggle(todo, e.target.checked)"
+          />
+          <div class="ctw-item-main" @click="editTodo(todo)">
+            <div class="ctw-item-title">{{ todo.title }}</div>
+            <div class="ctw-item-meta">
+              <span class="ctw-item-day" :class="{ today: dayLabel(todo) === '今天' }">
+                {{ dayLabel(todo) }}
+              </span>
+              <span class="ctw-item-time">
+                <VbenIcon icon="lucide:clock" />{{ timeLabel(todo) }}
+              </span>
+              <span v-if="Number(todo.remind_status) === 2" class="ctw-item-fail">提醒失败</span>
+            </div>
+          </div>
+          <VbenIcon class="ctw-item-arrow" icon="lucide:chevron-right" />
+        </div>
+      </div>
+      <!-- 空态：小尺寸不占空间 -->
+      <div v-else class="ctw-empty">
+        <VbenIcon class="ctw-empty-icon" icon="lucide:list-checks" />
+        <span class="ctw-empty-text">近 7 天暂无待办</span>
+        <button class="ctw-btn" @click="createTodo">新建一条</button>
+      </div>
+    </Spin>
+    <TodoFormModal />
+  </div>
+</template>
+<style lang="scss" scoped>
+/* 卡片外壳：与工作台其他 widget 一致（发丝线 + 12px 圆角，不用左侧色条） */
+.calendar-todo-widget {
+  display: flex;
+  flex-direction: column;
+  height: 100%;
+  padding: 18px 20px;
+  background: hsl(var(--card));
+  border: 1px solid hsl(var(--border) / 70%);
+  border-radius: 12px;
+}
+
+/* 2/8 分时列宽较窄：允许标题与按钮组换行，避免挤压溢出 */
+.ctw-head {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 6px;
+  align-items: center;
+  justify-content: space-between;
+  margin-bottom: 12px;
+}
+
+.ctw-title {
+  display: inline-flex;
+  gap: 6px;
+  align-items: center;
+  font-size: 15px;
+  font-weight: 600;
+  color: hsl(var(--foreground));
+}
+
+.ctw-title-icon {
+  font-size: 16px;
+  color: hsl(var(--primary));
+}
+
+.ctw-count {
+  padding: 0 7px;
+  font-size: 11px;
+  font-style: normal;
+  font-weight: 600;
+  line-height: 18px;
+  color: hsl(var(--primary));
+  background: hsl(var(--primary) / 12%);
+  border-radius: 999px;
+}
+
+.ctw-actions {
+  display: flex;
+  gap: 6px;
+  align-items: center;
+}
+
+.ctw-btn {
+  display: inline-flex;
+  gap: 3px;
+  align-items: center;
+  padding: 4px 10px;
+  font-size: 12px;
+  color: hsl(var(--primary));
+  cursor: pointer;
+  background: hsl(var(--primary) / 10%);
+  border: none;
+  border-radius: 999px;
+  transition: background-color 0.2s;
+
+  &:hover {
+    background: hsl(var(--primary) / 18%);
+  }
+
+  &.ghost {
+    color: hsl(var(--muted-foreground));
+    background: hsl(var(--muted) / 50%);
+
+    &:hover {
+      color: hsl(var(--foreground));
+      background: hsl(var(--muted) / 80%);
+    }
+  }
+}
+
+/* Spin 包裹层吃掉卡内剩余高度：与日历等高排布时列表在卡内弹性滚动（等高的关键） */
+.calendar-todo-widget :deep(.ant-spin-nested-loading) {
+  flex: 1;
+  min-height: 0;
+}
+
+.calendar-todo-widget :deep(.ant-spin-nested-loading .ant-spin-container) {
+  display: flex;
+  flex-direction: column;
+  height: 100%;
+}
+
+/* 列表：吃满剩余高度，超出内部滚动（行高由同行的日历决定） */
+.ctw-list {
+  display: flex;
+  flex: 1;
+  flex-direction: column;
+  gap: 6px;
+  min-height: 0;
+  padding-right: 4px;
+  overflow-y: auto;
+}
+
+/* 窄屏堆叠后行高不再受日历约束，限高防止长列表把工作台拉得过长 */
+@media (max-width: 1024px) {
+  .ctw-list {
+    max-height: 320px;
+  }
+}
+
+.ctw-item {
+  display: flex;
+  gap: 8px;
+  align-items: flex-start;
+  padding: 8px 10px;
+  background: hsl(var(--muted) / 30%);
+  border: 1px solid transparent;
+  border-radius: 10px;
+  transition: border-color 0.2s, background-color 0.2s, box-shadow 0.2s;
+
+  &:hover {
+    background: hsl(var(--muted) / 45%);
+    border-color: hsl(var(--primary) / 35%);
+    box-shadow: 0 0 6px hsl(var(--primary) / 15%);
+
+    .ctw-item-arrow {
+      opacity: 1;
+    }
+  }
+
+  &.done {
+    .ctw-item-title {
+      color: hsl(var(--muted-foreground));
+      text-decoration: line-through;
+    }
+  }
+}
+
+.ctw-item-check {
+  margin-top: 1px;
+}
+
+.ctw-item-main {
+  flex: 1;
+  min-width: 0;
+  cursor: pointer;
+}
+
+.ctw-item-title {
+  overflow: hidden;
+  font-size: 13px;
+  font-weight: 500;
+  color: hsl(var(--foreground));
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.ctw-item-meta {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 8px;
+  align-items: center;
+  margin-top: 3px;
+  font-size: 11px;
+  color: hsl(var(--muted-foreground));
+}
+
+/* 日期标签：今天用主色强调，一眼区分紧急程度 */
+.ctw-item-day {
+  padding: 0 6px;
+  font-weight: 600;
+  line-height: 16px;
+  background: hsl(var(--muted) / 60%);
+  border-radius: 4px;
+
+  &.today {
+    color: hsl(var(--primary));
+    background: hsl(var(--primary) / 12%);
+  }
+}
+
+.ctw-item-time {
+  display: inline-flex;
+  gap: 3px;
+  align-items: center;
+}
+
+.ctw-item-fail {
+  color: hsl(var(--destructive));
+}
+
+.ctw-item-arrow {
+  flex-shrink: 0;
+  margin-top: 3px;
+  font-size: 14px;
+  color: hsl(var(--muted-foreground));
+  opacity: 0;
+  transition: opacity 0.2s;
+}
+
+/* 空态：吃满剩余高度垂直居中（与日历等高时不显得头重脚轻） */
+.ctw-empty {
+  display: flex;
+  flex: 1;
+  gap: 10px;
+  align-items: center;
+  justify-content: center;
+  padding: 22px 0;
+}
+
+.ctw-empty-icon {
+  font-size: 22px;
+  color: hsl(var(--muted-foreground) / 50%);
+}
+
+.ctw-empty-text {
+  font-size: 13px;
+  color: hsl(var(--muted-foreground));
+}
+</style>
diff --git a/apps/web-antd/src/views/dashboard/workspace/components/WidgetClinicToday.vue b/apps/web-antd/src/views/dashboard/workspace/components/WidgetClinicToday.vue
new file mode 100644
index 00000000..9471e2ed
--- /dev/null
+++ b/apps/web-antd/src/views/dashboard/workspace/components/WidgetClinicToday.vue
@@ -0,0 +1,93 @@
+<script lang="ts" setup>
+/**
+ * 诊所今日摘要：今日挂号（待接诊/接诊中/已完成）+ 待发货订单
+ * 数据走 workbench/clinic-summary；挂号跳挂号订单页，待发货跳商品订单页
+ */
+import type { ClinicSummaryResult } from '../api';
+
+import { onMounted, ref } from 'vue';
+import { useRouter } from 'vue-router';
+
+import { getClinicSummaryApi } from '../api';
+import KpiCard from './KpiCard.vue';
+import StatChip from './StatChip.vue';
+
+interface Props {
+  title: string;
+}
+defineProps<Props>();
+
+const router = useRouter();
+const data = ref<ClinicSummaryResult | null>(null);
+const loading = ref(true);
+const error = ref(false);
+
+/**
+ * 拉取今日摘要；失败进入错误态可重试（不再静默消失）
+ */
+async function fetchSummary() {
+  loading.value = true;
+  error.value = false;
+  try {
+    data.value = await getClinicSummaryApi();
+  } catch {
+    error.value = true;
+  } finally {
+    loading.value = false;
+  }
+}
+
+/**
+ * 跳转挂号订单列表
+ */
+function goRegister() {
+  router.push('/business/register/list').catch(() => {});
+}
+
+/**
+ * 跳转商品订单列表
+ */
+function goProductOrder() {
+  router.push('/order/product-order').catch(() => {});
+}
+
+onMounted(fetchSummary);
+</script>
+
+<template>
+  <KpiCard
+    :title="title"
+    :loading="loading"
+    :error="error"
+    @refresh="fetchSummary"
+  >
+    <template v-if="data">
+      <StatChip
+        :highlight="data.wait_accept > 0"
+        :value="data.wait_accept"
+        icon="lucide:clock"
+        label="待接诊"
+        @click="goRegister"
+      />
+      <StatChip
+        :value="data.accepting"
+        icon="lucide:stethoscope"
+        label="接诊中"
+        @click="goRegister"
+      />
+      <StatChip
+        :value="data.completed"
+        icon="lucide:check-circle-2"
+        label="已完成"
+        @click="goRegister"
+      />
+      <StatChip
+        :highlight="data.wait_delivery > 0"
+        :value="data.wait_delivery"
+        icon="lucide:package"
+        label="待发货"
+        @click="goProductOrder"
+      />
+    </template>
+  </KpiCard>
+</template>
diff --git a/apps/web-antd/src/views/dashboard/workspace/components/WidgetDoctorToday.vue b/apps/web-antd/src/views/dashboard/workspace/components/WidgetDoctorToday.vue
new file mode 100644
index 00000000..2f3aab34
--- /dev/null
+++ b/apps/web-antd/src/views/dashboard/workspace/components/WidgetDoctorToday.vue
@@ -0,0 +1,91 @@
+<script lang="ts" setup>
+/**
+ * 医生今日摘要：待接诊/接诊中/已完成/今日开方/有效处方金额
+ * 数据走 workbench/doctor-summary（与医生小程序工作台同口径），整卡可点跳医生接诊页
+ */
+import type { DoctorSummaryResult } from '../api';
+
+import { onMounted, ref } from 'vue';
+import { useRouter } from 'vue-router';
+
+import { getDoctorSummaryApi } from '../api';
+import KpiCard from './KpiCard.vue';
+import StatChip from './StatChip.vue';
+
+interface Props {
+  title: string;
+}
+defineProps<Props>();
+
+const router = useRouter();
+const data = ref<DoctorSummaryResult | null>(null);
+const loading = ref(true);
+const error = ref(false);
+
+/**
+ * 拉取今日摘要；失败进入错误态可重试（不再静默消失）
+ */
+async function fetchSummary() {
+  loading.value = true;
+  error.value = false;
+  try {
+    data.value = await getDoctorSummaryApi('today');
+  } catch {
+    error.value = true;
+  } finally {
+    loading.value = false;
+  }
+}
+
+/**
+ * 跳转医生接诊页
+ */
+function goReception() {
+  router.push('/doctor/reception').catch(() => {});
+}
+
+onMounted(fetchSummary);
+</script>
+
+<template>
+  <KpiCard
+    :title="title"
+    :loading="loading"
+    :error="error"
+    @refresh="fetchSummary"
+  >
+    <template v-if="data">
+      <StatChip
+        :highlight="data.wait_accept > 0"
+        :value="data.wait_accept"
+        icon="lucide:clock"
+        label="待接诊"
+        @click="goReception"
+      />
+      <StatChip
+        :value="data.accepting"
+        icon="lucide:stethoscope"
+        label="接诊中"
+        @click="goReception"
+      />
+      <StatChip
+        :value="data.completed"
+        icon="lucide:check-circle-2"
+        label="已完成"
+        @click="goReception"
+      />
+      <StatChip
+        :value="data.prescription_count"
+        icon="lucide:file-text"
+        label="今日开方"
+        @click="goReception"
+      />
+      <StatChip
+        :value="data.prescription_amount"
+        icon="lucide:wallet"
+        label="有效处方金额"
+        @click="goReception"
+      />
+    </template>
+  </KpiCard>
+</template>
diff --git a/apps/web-antd/src/views/dashboard/workspace/components/WidgetNotice.vue b/apps/web-antd/src/views/dashboard/workspace/components/WidgetNotice.vue
new file mode 100644
index 00000000..037f58cb
--- /dev/null
+++ b/apps/web-antd/src/views/dashboard/workspace/components/WidgetNotice.vue
@@ -0,0 +1,410 @@
+<script lang="ts" setup>
+/**
+ * @deprecated 工作台公告已改用单行轮播条 NoticeTicker.vue（列表卡占一整列空间浪费），
+ * 本组件不再被布局引用，保留文件仅供回滚参考，勿再新增引用
+ *
+ * 最新动态（Premium）：紧凑公告列表，tinted 图标 + 类型 pill + 点击弹详情
+ * 类型为什么前端推导：announcement/latest（xk_notice 表）没有类型字段，
+ * 按标题关键词映射出「更新/活动/维护/公告」纯展示标签，后端无需改动
+ * 详情为什么不请求接口：latest 已全量返回 content，点击直接弹层展示即可
+ */
+import { computed, onMounted, ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+import { IconifyIcon as VbenIcon } from '@vben/icons';
+
+import { getLatestNotice } from '#/views/system/notice/api';
+
+interface Props {
+  title: string;
+}
+defineProps<Props>();
+
+/** 公告项（announcement/latest 返回结构） */
+type NoticeItem = {
+  avatar: string;
+  content: string;
+  date: string;
+  title: string;
+};
+
+/** 展示用公告项：附加前端推导的类型标签 */
+type DisplayNoticeItem = NoticeItem & {
+  typeLabel: string;
+  typeTone: 'danger' | 'info' | 'primary' | 'warning';
+};
+
+/**
+ * 按标题关键词推导公告类型（纯前端展示，后端无类型字段）
+ * 顺序：维护类优先（最需要注意）→ 更新 → 活动 → 默认公告
+ */
+function resolveNoticeType(title: string): Pick<DisplayNoticeItem, 'typeLabel' | 'typeTone'> {
+  const t = title || '';
+  if (/维护|停机|故障/.test(t)) return { typeLabel: '维护', typeTone: 'danger' };
+  if (/更新|升级|版本|上线/.test(t)) return { typeLabel: '更新', typeTone: 'info' };
+  if (/活动|福利|优惠|节/.test(t)) return { typeLabel: '活动', typeTone: 'warning' };
+  return { typeLabel: '公告', typeTone: 'primary' };
+}
+
+const items = ref<DisplayNoticeItem[]>([]);
+/** 当前弹层展示的公告 */
+const activeItem = ref<DisplayNoticeItem | null>(null);
+
+/** 公告详情弹层：只读展示，关闭默认页脚按钮 */
+const [DetailModal, detailModalApi] = useVbenModal({
+  footer: false,
+  header: false,
+  closable: true,
+  class: 'w-[560px]',
+});
+
+/**
+ * 拉取最新公告并附加类型标签；失败静默展示空态
+ */
+async function fetchLatest() {
+  try {
+    const res = await getLatestNotice(10);
+    const list: NoticeItem[] = Array.isArray(res) ? res : [];
+    items.value = list.map((it) => ({ ...it, ...resolveNoticeType(it.title) }));
+  } catch {
+    items.value = [];
+  }
+}
+
+/**
+ * 点击公告行：打开详情弹层（content 已全量在手，无需再请求）
+ */
+function openDetail(item: DisplayNoticeItem) {
+  activeItem.value = item;
+  detailModalApi.open();
+}
+
+/** 弹层类型 pill 的 tone class（避免模板里拼接字符串） */
+const activeToneClass = computed(() =>
+  activeItem.value ? `pill--${activeItem.value.typeTone}` : '',
+);
+
+onMounted(fetchLatest);
+</script>
+
+<template>
+  <div class="notice-widget">
+    <div class="notice-widget__title-wrap">
+      <span class="notice-widget__title-bar"></span>
+      <span class="notice-widget__title">{{ title }}</span>
+    </div>
+    <ul v-if="items.length > 0" class="notice-widget__list">
+      <li
+        v-for="item in items"
+        :key="item.title + item.date"
+        class="notice-widget__item"
+        role="button"
+        tabindex="0"
+        @click="openDetail(item)"
+        @keydown.enter="openDetail(item)"
+      >
+        <span class="notice-widget__icon-box">
+          <VbenIcon
+            :icon="item.avatar || 'lucide:megaphone'"
+            class="notice-widget__icon"
+          />
+        </span>
+        <div class="notice-widget__body">
+          <div class="notice-widget__item-head">
+            <span class="pill" :class="`pill--${item.typeTone}`">
+              {{ item.typeLabel }}
+            </span>
+            <span class="notice-widget__item-title">{{ item.title }}</span>
+          </div>
+          <!-- 公告内容后端可控，沿用原工作台渲染方式 -->
+          <!-- eslint-disable-next-line vue/no-v-html -->
+          <div class="notice-widget__content" v-html="item.content"></div>
+        </div>
+        <span class="notice-widget__date">{{ item.date }}</span>
+      </li>
+    </ul>
+    <div v-else class="notice-widget__empty">
+      <VbenIcon class="notice-widget__empty-icon" icon="lucide:inbox" />
+      暂无公告
+    </div>
+
+    <!-- 公告详情弹层：premium 风格 hero 头 + 富文本正文 -->
+    <DetailModal>
+      <div v-if="activeItem" class="notice-detail">
+        <div class="notice-detail__hero">
+          <span class="notice-detail__hero-icon">
+            <VbenIcon :icon="activeItem.avatar || 'lucide:megaphone'" />
+          </span>
+          <div class="notice-detail__hero-meta">
+            <div class="notice-detail__hero-top">
+              <span class="pill" :class="activeToneClass">
+                {{ activeItem.typeLabel }}
+              </span>
+              <span class="notice-detail__date">{{ activeItem.date }}</span>
+            </div>
+            <div class="notice-detail__title">{{ activeItem.title }}</div>
+          </div>
+        </div>
+        <!-- 公告内容后端可控，沿用列表同源富文本渲染 -->
+        <!-- eslint-disable-next-line vue/no-v-html -->
+        <div class="notice-detail__content" v-html="activeItem.content"></div>
+      </div>
+    </DetailModal>
+  </div>
+</template>
+
+<style scoped>
+.notice-widget {
+  padding: 18px 20px;
+  background: hsl(var(--card));
+  border: 1px solid hsl(var(--border) / 0.7);
+  border-radius: 12px;
+}
+
+.notice-widget__title-wrap {
+  display: flex;
+  gap: 8px;
+  align-items: center;
+  margin-bottom: 8px;
+}
+
+.notice-widget__title-bar {
+  width: 3px;
+  height: 14px;
+  background: linear-gradient(180deg, hsl(var(--primary)), hsl(var(--primary) / 0.4));
+  border-radius: 2px;
+}
+
+.notice-widget__title {
+  font-size: 15px;
+  font-weight: 650;
+  color: hsl(var(--foreground));
+  letter-spacing: -0.01em;
+}
+
+.notice-widget__list {
+  margin: 0;
+  padding: 0;
+  list-style: none;
+}
+
+.notice-widget__item {
+  display: flex;
+  gap: 12px;
+  align-items: flex-start;
+  margin: 0 -10px;
+  padding: 10px;
+  border-radius: 10px;
+  cursor: pointer;
+  outline: none;
+  transition: background-color 0.15s ease;
+}
+
+.notice-widget__item:hover,
+.notice-widget__item:focus-visible {
+  background: hsl(var(--muted) / 0.4);
+}
+
+.notice-widget__item + .notice-widget__item {
+  border-top: 1px solid hsl(var(--border) / 0.5);
+}
+
+.notice-widget__icon-box {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 30px;
+  height: 30px;
+  margin-top: 1px;
+  background: hsl(var(--primary) / 0.09);
+  border-radius: 9px;
+  flex-shrink: 0;
+}
+
+.notice-widget__icon {
+  width: 15px;
+  height: 15px;
+  color: hsl(var(--primary));
+}
+
+.notice-widget__body {
+  flex: 1;
+  min-width: 0;
+}
+
+.notice-widget__item-head {
+  display: flex;
+  gap: 6px;
+  align-items: center;
+  min-width: 0;
+}
+
+.notice-widget__item-title {
+  overflow: hidden;
+  font-size: 13px;
+  font-weight: 550;
+  color: hsl(var(--foreground));
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.notice-widget__content {
+  overflow: hidden;
+  margin-top: 2px;
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.notice-widget__content :deep(a) {
+  color: hsl(var(--primary));
+}
+
+.notice-widget__date {
+  margin-top: 2px;
+  font-size: 12px;
+  color: hsl(var(--muted-foreground) / 0.8);
+  white-space: nowrap;
+  flex-shrink: 0;
+}
+
+.notice-widget__empty {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  align-items: center;
+  padding: 28px 0;
+  font-size: 13px;
+  color: hsl(var(--muted-foreground));
+}
+
+.notice-widget__empty-icon {
+  width: 22px;
+  height: 22px;
+  color: hsl(var(--muted-foreground) / 0.6);
+}
+
+/* ===== 类型 pill：主题变量着色，亮/暗自适应 ===== */
+.pill {
+  flex-shrink: 0;
+  padding: 1px 7px;
+  border-radius: 999px;
+  font-size: 11px;
+  font-weight: 600;
+  line-height: 16px;
+}
+
+.pill--primary {
+  background: hsl(var(--primary) / 0.1);
+  color: hsl(var(--primary));
+}
+
+.pill--info {
+  background: hsl(210 90% 50% / 0.12);
+  color: hsl(210 90% 45%);
+}
+
+.pill--warning {
+  background: hsl(var(--warning, 38 92% 50%) / 0.14);
+  color: hsl(var(--warning, 38 92% 40%));
+}
+
+.pill--danger {
+  background: hsl(var(--destructive) / 0.1);
+  color: hsl(var(--destructive));
+}
+
+/* ===== 详情弹层 ===== */
+.notice-detail {
+  padding: 4px 2px 8px;
+}
+
+/* hero 头：柔和主色光斑背景，呼应消息详情场景弹层的 premium 语言 */
+.notice-detail__hero {
+  display: flex;
+  gap: 14px;
+  align-items: flex-start;
+  margin-bottom: 16px;
+  padding: 16px 18px;
+  border: 1px solid hsl(var(--border));
+  border-radius: 14px;
+  background:
+    radial-gradient(
+      80% 120% at 0% 0%,
+      hsl(var(--primary) / 0.14),
+      transparent 60%
+    ),
+    linear-gradient(
+      165deg,
+      hsl(var(--muted) / 0.4),
+      hsl(var(--card, var(--background)))
+    );
+}
+
+.notice-detail__hero-icon {
+  display: grid;
+  flex-shrink: 0;
+  place-items: center;
+  width: 42px;
+  height: 42px;
+  border-radius: 12px;
+  background: hsl(var(--primary) / 0.12);
+  color: hsl(var(--primary));
+}
+
+.notice-detail__hero-icon :deep(svg) {
+  width: 20px;
+  height: 20px;
+}
+
+.notice-detail__hero-meta {
+  flex: 1;
+  min-width: 0;
+}
+
+.notice-detail__hero-top {
+  display: flex;
+  gap: 8px;
+  align-items: center;
+}
+
+.notice-detail__date {
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+}
+
+.notice-detail__title {
+  margin-top: 6px;
+  font-size: 17px;
+  font-weight: 700;
+  letter-spacing: -0.02em;
+  color: hsl(var(--foreground));
+  overflow-wrap: break-word;
+}
+
+.notice-detail__content {
+  max-height: 52vh;
+  overflow-y: auto;
+  padding: 0 2px;
+  font-size: 13.5px;
+  line-height: 1.75;
+  color: hsl(var(--foreground) / 0.88);
+  overflow-wrap: break-word;
+}
+
+.notice-detail__content :deep(a) {
+  color: hsl(var(--primary));
+}
+
+.notice-detail__content :deep(img) {
+  max-width: 100%;
+  border-radius: 10px;
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .notice-widget__item {
+    transition: none;
+  }
+}
+</style>
diff --git a/apps/web-antd/src/views/dashboard/workspace/components/WidgetOrderPending.vue b/apps/web-antd/src/views/dashboard/workspace/components/WidgetOrderPending.vue
new file mode 100644
index 00000000..c9a7ed99
--- /dev/null
+++ b/apps/web-antd/src/views/dashboard/workspace/components/WidgetOrderPending.vue
@@ -0,0 +1,74 @@
+<script lang="ts" setup>
+/**
+ * 订单管理员摘要：平台待发货 / 退款处理中，整卡可点跳商品订单列表
+ * 数据走 workbench/order-summary（轻量 count）
+ */
+import type { OrderSummaryResult } from '../api';
+
+import { onMounted, ref } from 'vue';
+import { useRouter } from 'vue-router';
+
+import { getOrderSummaryApi } from '../api';
+import KpiCard from './KpiCard.vue';
+import StatChip from './StatChip.vue';
+
+interface Props {
+  title: string;
+}
+defineProps<Props>();
+
+const router = useRouter();
+const data = ref<null | OrderSummaryResult>(null);
+const loading = ref(true);
+const error = ref(false);
+
+/**
+ * 拉取订单摘要；失败进入错误态可重试（不再静默消失）
+ */
+async function fetchSummary() {
+  loading.value = true;
+  error.value = false;
+  try {
+    data.value = await getOrderSummaryApi();
+  } catch {
+    error.value = true;
+  } finally {
+    loading.value = false;
+  }
+}
+
+/**
+ * 跳转商品订单列表
+ */
+function goProductOrder() {
+  router.push('/order/product-order').catch(() => {});
+}
+
+onMounted(fetchSummary);
+</script>
+
+<template>
+  <KpiCard
+    :title="title"
+    :loading="loading"
+    :error="error"
+    @refresh="fetchSummary"
+  >
+    <template v-if="data">
+      <StatChip
+        :highlight="data.wait_delivery > 0"
+        :value="data.wait_delivery"
+        icon="lucide:package"
+        label="待发货"
+        @click="goProductOrder"
+      />
+      <StatChip
+        :highlight="data.refunding > 0"
+        :value="data.refunding"
+        icon="lucide:rotate-ccw"
+        label="退款处理中"
+        @click="goProductOrder"
+      />
+    </template>
+  </KpiCard>
+</template>
diff --git a/apps/web-antd/src/views/dashboard/workspace/components/WidgetPharmacistPending.vue b/apps/web-antd/src/views/dashboard/workspace/components/WidgetPharmacistPending.vue
new file mode 100644
index 00000000..0d8306ce
--- /dev/null
+++ b/apps/web-antd/src/views/dashboard/workspace/components/WidgetPharmacistPending.vue
@@ -0,0 +1,67 @@
+<script lang="ts" setup>
+/**
+ * 药师待审摘要：待审处方总数，整卡可点跳审方列表
+ * 数据走 workbench/pharmacist-summary（与审方列表 status=0 同口径）
+ */
+import type { PharmacistSummaryResult } from '../api';
+
+import { onMounted, ref } from 'vue';
+import { useRouter } from 'vue-router';
+
+import { getPharmacistSummaryApi } from '../api';
+import KpiCard from './KpiCard.vue';
+import StatChip from './StatChip.vue';
+
+interface Props {
+  title: string;
+}
+defineProps<Props>();
+
+const router = useRouter();
+const data = ref<null | PharmacistSummaryResult>(null);
+const loading = ref(true);
+const error = ref(false);
+
+/**
+ * 拉取待审数；失败进入错误态可重试（不再静默消失）
+ */
+async function fetchSummary() {
+  loading.value = true;
+  error.value = false;
+  try {
+    data.value = await getPharmacistSummaryApi();
+  } catch {
+    error.value = true;
+  } finally {
+    loading.value = false;
+  }
+}
+
+/**
+ * 跳转审方列表
+ */
+function goAudit() {
+  router.push('/pharmacist/review-prescription').catch(() => {});
+}
+
+onMounted(fetchSummary);
+</script>
+
+<template>
+  <KpiCard
+    :title="title"
+    :loading="loading"
+    :error="error"
+    @refresh="fetchSummary"
+  >
+    <template v-if="data">
+      <StatChip
+        :highlight="data.pending_total > 0"
+        :value="data.pending_total"
+        icon="lucide:shield-check"
+        label="待审处方"
+        @click="goAudit"
+      />
+    </template>
+  </KpiCard>
+</template>
diff --git a/apps/web-antd/src/views/dashboard/workspace/components/WidgetPlatformOverview.vue b/apps/web-antd/src/views/dashboard/workspace/components/WidgetPlatformOverview.vue
new file mode 100644
index 00000000..27414124
--- /dev/null
+++ b/apps/web-antd/src/views/dashboard/workspace/components/WidgetPlatformOverview.vue
@@ -0,0 +1,83 @@
+<script lang="ts" setup>
+/**
+ * 平台今日总览（超管/系统管理员）：今日订单/今日营业额/今日挂号/新增门店录入
+ * 数据走 workbench/platform-overview（轻量 count/sum，营业额口径与业务员看板一致）
+ */
+import type { PlatformOverviewResult } from '../api';
+
+import { onMounted, ref } from 'vue';
+import { useRouter } from 'vue-router';
+
+import { getPlatformOverviewApi } from '../api';
+import KpiCard from './KpiCard.vue';
+import StatChip from './StatChip.vue';
+
+interface Props {
+  title: string;
+}
+defineProps<Props>();
+
+const router = useRouter();
+const data = ref<null | PlatformOverviewResult>(null);
+const loading = ref(true);
+const error = ref(false);
+
+/**
+ * 拉取平台总览；失败进入错误态可重试（不再静默消失）
+ */
+async function fetchSummary() {
+  loading.value = true;
+  error.value = false;
+  try {
+    data.value = await getPlatformOverviewApi();
+  } catch {
+    error.value = true;
+  } finally {
+    loading.value = false;
+  }
+}
+
+/** 跳转指定路由（失败静默，避免无权限菜单时报错） */
+function go(path: string) {
+  router.push(path).catch(() => {});
+}
+
+onMounted(fetchSummary);
+</script>
+
+<template>
+  <KpiCard
+    :title="title"
+    :loading="loading"
+    :error="error"
+    subtitle="今日"
+    @refresh="fetchSummary"
+  >
+    <template v-if="data">
+      <StatChip
+        :value="data.order_count"
+        icon="lucide:shopping-cart"
+        label="今日订单"
+        @click="go('/order/product-order')"
+      />
+      <StatChip
+        :value="`¥${data.revenue}`"
+        icon="lucide:banknote"
+        label="今日营业额"
+        @click="go('/order/product-order')"
+      />
+      <StatChip
+        :value="data.register_count"
+        icon="lucide:stethoscope"
+        label="今日挂号"
+        @click="go('/business/register/list')"
+      />
+      <StatChip
+        :value="data.store_input_count"
+        icon="lucide:store"
+        label="新增门店录入"
+        @click="go('/system/store-input')"
+      />
+    </template>
+  </KpiCard>
+</template>
diff --git a/apps/web-antd/src/views/dashboard/workspace/components/WidgetQuickEntry.vue b/apps/web-antd/src/views/dashboard/workspace/components/WidgetQuickEntry.vue
new file mode 100644
index 00000000..c52387f3
--- /dev/null
+++ b/apps/web-antd/src/views/dashboard/workspace/components/WidgetQuickEntry.vue
@@ -0,0 +1,392 @@
+<script lang="ts" setup>
+/**
+ * 快捷入口（Premium）：角色钉住导航（图标瓷砖网格）+ 本地搜索全部授权菜单
+ * 视觉：40px tinted 圆角图标容器，hover 抬升 + 容器着色加深；搜索结果行式列表
+ * 数据源：钉住项走 admin/get-quick-menu；搜索池 = 钉住项 ∪ accessMenus 拍平叶子（纯本地，无接口）
+ */
+import type { SearchableMenuItem } from '../utils/flatten-menus';
+
+import { computed, onMounted, ref } from 'vue';
+import { useRouter } from 'vue-router';
+
+import { IconifyIcon as VbenIcon } from '@vben/icons';
+import { useAccessStore } from '@vben/stores';
+import { openWindow } from '@vben/utils';
+
+import { Input } from 'ant-design-vue';
+
+import { getQuickMenuApi } from '#/views/system/admin/api';
+
+import { filterMenusByKeyword, flattenMenus } from '../utils/flatten-menus';
+
+interface Props {
+  title: string;
+}
+defineProps<Props>();
+
+/** 钉住的快捷导航项（角色配置） */
+type PinnedItem = {
+  title: string;
+  icon: string;
+  url: string;
+  color?: string;
+};
+
+const router = useRouter();
+const accessStore = useAccessStore();
+
+const pinnedItems = ref<PinnedItem[]>([]);
+const keyword = ref('');
+
+/** 全部授权叶子菜单（本地拍平，一次计算） */
+const searchableMenus = computed<SearchableMenuItem[]>(() =>
+  flattenMenus(accessStore.accessMenus),
+);
+
+/**
+ * 搜索结果：钉住项 ∪ 叶子菜单，按 path 去重
+ */
+const searchResults = computed<SearchableMenuItem[]>(() => {
+  const kw = keyword.value.trim();
+  if (!kw) return [];
+  const fromPinned: SearchableMenuItem[] = pinnedItems.value
+    .filter((item) => item.title.toLowerCase().includes(kw.toLowerCase()))
+    .map((item) => ({ title: item.title, path: item.url, icon: item.icon }));
+  const fromMenus = filterMenusByKeyword(searchableMenus.value, kw);
+  const seen = new Set<string>();
+  const merged: SearchableMenuItem[] = [];
+  for (const item of [...fromPinned, ...fromMenus]) {
+    if (!item.path || seen.has(item.path)) continue;
+    seen.add(item.path);
+    merged.push(item);
+  }
+  return merged;
+});
+
+/** 是否处于搜索态 */
+const isSearching = computed(() => keyword.value.trim() !== '');
+
+/**
+ * 拉取角色钉住的快捷导航
+ */
+async function fetchPinned() {
+  try {
+    const res = await getQuickMenuApi();
+    pinnedItems.value = Array.isArray(res) ? res : [];
+  } catch {
+    pinnedItems.value = [];
+  }
+}
+
+/**
+ * 跳转：外链新窗口，内部路由 push
+ */
+function navTo(url: string) {
+  if (!url) return;
+  if (url.startsWith('http')) {
+    openWindow(url);
+    return;
+  }
+  router.push(url).catch(() => {});
+}
+
+/**
+ * 回车快捷跳转第一条搜索结果
+ */
+function onEnter() {
+  const first = searchResults.value[0];
+  if (first) navTo(first.path);
+}
+
+onMounted(fetchPinned);
+</script>
+
+<template>
+  <div class="quick-entry">
+    <div class="quick-entry__head">
+      <div class="quick-entry__title-wrap">
+        <span class="quick-entry__title-bar"></span>
+        <span class="quick-entry__title">{{ title }}</span>
+      </div>
+      <Input
+        v-model:value="keyword"
+        allow-clear
+        class="quick-entry__search"
+        placeholder="搜索菜单，回车直达"
+        @press-enter="onEnter"
+      >
+        <template #prefix>
+          <VbenIcon class="quick-entry__search-icon" icon="lucide:search" />
+        </template>
+      </Input>
+    </div>
+
+    <!-- 搜索态：紧凑结果列表 -->
+    <div v-if="isSearching" class="quick-entry__results">
+      <template v-if="searchResults.length > 0">
+        <div
+          v-for="item in searchResults"
+          :key="item.path"
+          class="quick-entry__result-item"
+          @click="navTo(item.path)"
+        >
+          <span class="quick-entry__result-icon-box">
+            <VbenIcon :icon="item.icon || 'lucide:file'" class="quick-entry__result-icon" />
+          </span>
+          <span class="quick-entry__result-title">{{ item.title }}</span>
+          <span class="quick-entry__result-path">{{ item.path }}</span>
+          <VbenIcon class="quick-entry__result-arrow" icon="lucide:arrow-right" />
+        </div>
+      </template>
+      <div v-else class="quick-entry__empty">
+        <VbenIcon class="quick-entry__empty-icon" icon="lucide:search-x" />
+        未找到匹配菜单
+      </div>
+    </div>
+
+    <!-- 默认态：钉住项瓷砖网格 -->
+    <div v-else-if="pinnedItems.length > 0" class="quick-entry__grid">
+      <div
+        v-for="item in pinnedItems"
+        :key="item.url + item.title"
+        class="quick-entry__cell"
+        @click="navTo(item.url)"
+      >
+        <span class="quick-entry__cell-icon-box">
+          <VbenIcon
+            :icon="item.icon || 'lucide:link'"
+            :style="item.color ? { color: item.color, opacity: 0.9 } : undefined"
+            class="quick-entry__cell-icon"
+          />
+        </span>
+        <span class="quick-entry__cell-title">{{ item.title }}</span>
+      </div>
+    </div>
+
+    <div v-else class="quick-entry__empty">
+      <VbenIcon class="quick-entry__empty-icon" icon="lucide:compass" />
+      请在「角色管理」配置快捷导航，或直接搜索菜单
+    </div>
+  </div>
+</template>
+
+<style scoped>
+.quick-entry {
+  padding: 18px 20px;
+  background: hsl(var(--card));
+  border: 1px solid hsl(var(--border) / 0.7);
+  border-radius: 12px;
+}
+
+.quick-entry__head {
+  display: flex;
+  gap: 12px;
+  align-items: center;
+  justify-content: space-between;
+  margin-bottom: 14px;
+}
+
+/* 标题前竖条：低成本的高级感层级标识 */
+.quick-entry__title-wrap {
+  display: flex;
+  gap: 8px;
+  align-items: center;
+}
+
+.quick-entry__title-bar {
+  width: 3px;
+  height: 14px;
+  background: linear-gradient(180deg, hsl(var(--primary)), hsl(var(--primary) / 0.4));
+  border-radius: 2px;
+}
+
+.quick-entry__title {
+  font-size: 15px;
+  font-weight: 650;
+  color: hsl(var(--foreground));
+  letter-spacing: -0.01em;
+}
+
+.quick-entry__search {
+  max-width: 280px;
+  border-radius: 8px;
+}
+
+.quick-entry__search-icon {
+  width: 15px;
+  height: 15px;
+  color: hsl(var(--muted-foreground));
+}
+
+/* 瓷砖网格：桌面 8 列 → 平板 6 列 → 手机 4 列 */
+.quick-entry__grid {
+  display: grid;
+  grid-template-columns: repeat(8, minmax(0, 1fr));
+  gap: 10px;
+}
+
+@media (max-width: 1024px) {
+  .quick-entry__grid {
+    grid-template-columns: repeat(6, minmax(0, 1fr));
+  }
+}
+
+@media (max-width: 640px) {
+  .quick-entry__grid {
+    grid-template-columns: repeat(4, minmax(0, 1fr));
+  }
+}
+
+.quick-entry__cell {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  align-items: center;
+  padding: 14px 4px 12px;
+  cursor: pointer;
+  border: 1px solid transparent;
+  border-radius: 12px;
+  transition:
+    transform 0.2s cubic-bezier(0.4, 0, 0.2, 1),
+    border-color 0.2s ease,
+    background-color 0.2s ease,
+    box-shadow 0.2s ease;
+}
+
+.quick-entry__cell:hover {
+  background: hsl(var(--card));
+  border-color: hsl(var(--primary) / 0.25);
+  transform: translateY(-2px);
+  box-shadow:
+    0 1px 2px hsl(var(--foreground) / 0.04),
+    0 8px 20px hsl(var(--primary) / 0.1);
+}
+
+/* 图标容器：tinted 圆角方块，hover 着色加深 */
+.quick-entry__cell-icon-box {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 40px;
+  height: 40px;
+  background: hsl(var(--primary) / 0.09);
+  border-radius: 11px;
+  transition: background-color 0.2s ease;
+}
+
+.quick-entry__cell:hover .quick-entry__cell-icon-box {
+  background: hsl(var(--primary) / 0.16);
+}
+
+.quick-entry__cell-icon {
+  width: 20px;
+  height: 20px;
+  color: hsl(var(--primary));
+}
+
+.quick-entry__cell-title {
+  max-width: 100%;
+  overflow: hidden;
+  font-size: 12px;
+  color: hsl(var(--foreground) / 0.85);
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.quick-entry__results {
+  max-height: 320px;
+  overflow-y: auto;
+}
+
+.quick-entry__result-item {
+  display: flex;
+  gap: 10px;
+  align-items: center;
+  padding: 9px 12px;
+  cursor: pointer;
+  border-radius: 10px;
+  transition: background-color 0.15s ease;
+}
+
+.quick-entry__result-item:hover {
+  background: hsl(var(--primary) / 0.07);
+}
+
+.quick-entry__result-icon-box {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 28px;
+  height: 28px;
+  background: hsl(var(--primary) / 0.09);
+  border-radius: 8px;
+  flex-shrink: 0;
+}
+
+.quick-entry__result-icon {
+  width: 14px;
+  height: 14px;
+  color: hsl(var(--primary));
+}
+
+.quick-entry__result-title {
+  font-size: 13px;
+  font-weight: 500;
+  color: hsl(var(--foreground));
+  white-space: nowrap;
+}
+
+.quick-entry__result-path {
+  flex: 1;
+  overflow: hidden;
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+/* 结果行箭头：hover 时滑入，提示可点 */
+.quick-entry__result-arrow {
+  width: 14px;
+  height: 14px;
+  color: hsl(var(--primary));
+  opacity: 0;
+  transform: translateX(-4px);
+  transition:
+    opacity 0.15s ease,
+    transform 0.15s ease;
+  flex-shrink: 0;
+}
+
+.quick-entry__result-item:hover .quick-entry__result-arrow {
+  opacity: 1;
+  transform: translateX(0);
+}
+
+.quick-entry__empty {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  align-items: center;
+  padding: 28px 0;
+  font-size: 13px;
+  color: hsl(var(--muted-foreground));
+}
+
+.quick-entry__empty-icon {
+  width: 22px;
+  height: 22px;
+  color: hsl(var(--muted-foreground) / 0.6);
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .quick-entry__cell,
+  .quick-entry__result-arrow {
+    transition: none;
+  }
+
+  .quick-entry__cell:hover {
+    transform: none;
+  }
+}
+</style>
diff --git a/apps/web-antd/src/views/dashboard/workspace/components/WidgetSalespersonSummary.vue b/apps/web-antd/src/views/dashboard/workspace/components/WidgetSalespersonSummary.vue
new file mode 100644
index 00000000..a1bc4c08
--- /dev/null
+++ b/apps/web-antd/src/views/dashboard/workspace/components/WidgetSalespersonSummary.vue
@@ -0,0 +1,94 @@
+<script lang="ts" setup>
+/**
+ * 门店录入摘要：录入总数/环比/待审核/有效营业额，整卡可点跳完整业务员看板
+ * 复用 store-input/dashboard 接口，仅取 summary（趋势图等留在完整看板页）
+ */
+import type { SalespersonDashboardResult } from '#/views/system/salesperson-dashboard/api';
+
+import { computed, onMounted, ref } from 'vue';
+import { useRouter } from 'vue-router';
+
+import { getSalespersonDashboardApi } from '#/views/system/salesperson-dashboard/api';
+
+import KpiCard from './KpiCard.vue';
+import StatChip from './StatChip.vue';
+
+interface Props {
+  title: string;
+}
+defineProps<Props>();
+
+const router = useRouter();
+const data = ref<null | SalespersonDashboardResult>(null);
+const loading = ref(true);
+const error = ref(false);
+
+/** 环比文案：正数带 +，空值显示 — */
+const momText = computed(() => {
+  const rate = data.value?.summary?.input_mom_rate;
+  if (rate === null || rate === undefined) return '—';
+  return `${rate > 0 ? '+' : ''}${rate}%`;
+});
+
+/**
+ * 拉取近 7 天录入摘要；失败进入错误态可重试（不再静默消失）
+ */
+async function fetchSummary() {
+  loading.value = true;
+  error.value = false;
+  try {
+    data.value = await getSalespersonDashboardApi({ period: 'last7days' });
+  } catch {
+    error.value = true;
+  } finally {
+    loading.value = false;
+  }
+}
+
+/**
+ * 跳转完整业务员看板
+ */
+function goDashboard() {
+  router.push('/system/salesperson-dashboard').catch(() => {});
+}
+
+onMounted(fetchSummary);
+</script>
+
+<template>
+  <KpiCard
+    :title="title"
+    :loading="loading"
+    :error="error"
+    subtitle="近7天"
+    @refresh="fetchSummary"
+  >
+    <template v-if="data">
+      <StatChip
+        :value="data.summary.input_total"
+        icon="lucide:clipboard-list"
+        label="录入总数"
+        @click="goDashboard"
+      />
+      <StatChip
+        :value="momText"
+        icon="lucide:trending-up"
+        label="录入环比"
+        @click="goDashboard"
+      />
+      <StatChip
+        :highlight="data.summary.pending_count > 0"
+        :value="data.summary.pending_count"
+        icon="lucide:hourglass"
+        label="待审核"
+        @click="goDashboard"
+      />
+      <StatChip
+        :value="data.summary.valid_amount_total"
+        icon="lucide:banknote"
+        label="有效营业额"
+        @click="goDashboard"
+      />
+    </template>
+  </KpiCard>
+</template>
diff --git a/apps/web-antd/src/views/dashboard/workspace/components/WidgetTodoCenter.vue b/apps/web-antd/src/views/dashboard/workspace/components/WidgetTodoCenter.vue
new file mode 100644
index 00000000..6998b923
--- /dev/null
+++ b/apps/web-antd/src/views/dashboard/workspace/components/WidgetTodoCenter.vue
@@ -0,0 +1,239 @@
+<script lang="ts" setup>
+/**
+ * 待办中心（超管/系统管理员）：平台各类待处理事项行式列表
+ * 数量 > 0 高亮并可点击直达处理页；全为 0 展示「今日无待办」空态
+ * 数据走 workbench/todo-center，path 由后端下发（与菜单路由对齐）
+ */
+import type { TodoCenterItem } from '../api';
+
+import { computed, onMounted, ref } from 'vue';
+import { useRouter } from 'vue-router';
+
+import { IconifyIcon as VbenIcon } from '@vben/icons';
+
+import { getTodoCenterApi } from '../api';
+import KpiCard from './KpiCard.vue';
+
+interface Props {
+  title: string;
+}
+defineProps<Props>();
+
+/** code → 图标映射（后端只下发 code，图标属于前端展示细节） */
+const ICON_MAP: Record<string, string> = {
+  prescription_pending: 'lucide:shield-check',
+  withdraw_pending: 'lucide:banknote',
+  store_input_pending: 'lucide:store',
+  wait_delivery: 'lucide:package',
+  refunding: 'lucide:rotate-ccw',
+};
+
+const router = useRouter();
+const items = ref<TodoCenterItem[]>([]);
+const loading = ref(true);
+const error = ref(false);
+
+/** 是否全部待办为 0（展示空态而不是一排 0） */
+const allClear = computed(
+  () => items.value.length > 0 && items.value.every((it) => it.count <= 0),
+);
+
+/**
+ * 拉取待办中心；失败进入错误态可重试
+ */
+async function fetchTodo() {
+  loading.value = true;
+  error.value = false;
+  try {
+    const res = await getTodoCenterApi();
+    items.value = res.items || [];
+  } catch {
+    error.value = true;
+  } finally {
+    loading.value = false;
+  }
+}
+
+/** 跳转对应处理页（失败静默，避免无权限菜单时报错） */
+function go(item: TodoCenterItem) {
+  if (!item.path) return;
+  router.push(item.path).catch(() => {});
+}
+
+onMounted(fetchTodo);
+</script>
+
+<template>
+  <KpiCard
+    :title="title"
+    :loading="loading"
+    :error="error"
+    @refresh="fetchTodo"
+  >
+    <!-- 全部清零：空态鼓励，不渲染一排 0 -->
+    <div v-if="allClear" class="todo-clear">
+      <VbenIcon icon="lucide:party-popper" class="todo-clear__icon" />
+      <span>今日无待办，全部处理完毕</span>
+    </div>
+
+    <ul v-else class="todo-list">
+      <li
+        v-for="item in items"
+        :key="item.code"
+        class="todo-row"
+        :class="{ 'is-active': item.count > 0 }"
+        role="button"
+        tabindex="0"
+        @click="go(item)"
+        @keydown.enter="go(item)"
+      >
+        <span class="todo-row__icon-box">
+          <VbenIcon :icon="ICON_MAP[item.code] || 'lucide:list-todo'" />
+        </span>
+        <span class="todo-row__label">{{ item.label }}</span>
+        <span class="todo-row__count" :class="{ 'is-zero': item.count <= 0 }">
+          {{ item.count > 999 ? '999+' : item.count }}
+        </span>
+        <VbenIcon icon="lucide:chevron-right" class="todo-row__arrow" />
+      </li>
+    </ul>
+  </KpiCard>
+</template>
+
+<style scoped>
+/* 撑满 KpiCard 芯片区，改为纵向行式布局 */
+.todo-list {
+  width: 100%;
+  margin: 0;
+  padding: 0;
+  list-style: none;
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+}
+
+.todo-row {
+  display: flex;
+  gap: 10px;
+  align-items: center;
+  padding: 10px 12px;
+  border: 1px solid hsl(var(--border) / 0.6);
+  border-radius: 10px;
+  cursor: pointer;
+  outline: none;
+  transition:
+    border-color 0.15s ease,
+    background 0.15s ease,
+    transform 0.15s ease;
+}
+
+.todo-row:hover,
+.todo-row:focus-visible {
+  background: hsl(var(--muted) / 0.35);
+  border-color: hsl(var(--primary) / 0.3);
+  transform: translateX(2px);
+}
+
+/* 有待办的行：主色轻着色突出优先级 */
+.todo-row.is-active {
+  background: linear-gradient(
+    135deg,
+    hsl(var(--primary) / 0.06),
+    hsl(var(--card)) 70%
+  );
+  border-color: hsl(var(--primary) / 0.22);
+}
+
+.todo-row.is-active:hover,
+.todo-row.is-active:focus-visible {
+  border-color: hsl(var(--primary) / 0.4);
+}
+
+.todo-row__icon-box {
+  display: grid;
+  place-items: center;
+  width: 32px;
+  height: 32px;
+  flex-shrink: 0;
+  border-radius: 9px;
+  background: hsl(var(--primary) / 0.1);
+  color: hsl(var(--primary));
+}
+
+.todo-row__icon-box :deep(svg) {
+  width: 16px;
+  height: 16px;
+}
+
+.todo-row__label {
+  flex: 1;
+  min-width: 0;
+  overflow: hidden;
+  font-size: 13.5px;
+  color: hsl(var(--foreground));
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.todo-row__count {
+  min-width: 26px;
+  height: 22px;
+  padding: 0 8px;
+  border-radius: 999px;
+  background: hsl(var(--primary));
+  color: hsl(var(--primary-foreground));
+  font-size: 12px;
+  font-weight: 650;
+  line-height: 22px;
+  text-align: center;
+  font-variant-numeric: tabular-nums;
+}
+
+/* 数量为 0：弱化成灰底，不抢注意力 */
+.todo-row__count.is-zero {
+  background: hsl(var(--muted) / 0.6);
+  color: hsl(var(--muted-foreground));
+  font-weight: 500;
+}
+
+.todo-row__arrow {
+  width: 15px;
+  height: 15px;
+  flex-shrink: 0;
+  color: hsl(var(--muted-foreground));
+  transition: transform 0.15s ease;
+}
+
+.todo-row:hover .todo-row__arrow {
+  transform: translateX(2px);
+  color: hsl(var(--primary));
+}
+
+/* 空态：全部清零 */
+.todo-clear {
+  display: flex;
+  gap: 8px;
+  align-items: center;
+  width: 100%;
+  padding: 16px 4px;
+  font-size: 13px;
+  color: hsl(var(--muted-foreground));
+}
+
+.todo-clear__icon {
+  width: 18px;
+  height: 18px;
+  color: hsl(var(--primary));
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .todo-row,
+  .todo-row__arrow {
+    transition: none;
+  }
+
+  .todo-row:hover {
+    transform: none;
+  }
+}
+</style>
diff --git a/apps/web-antd/src/views/dashboard/workspace/components/WidgetWorkCalendar.vue b/apps/web-antd/src/views/dashboard/workspace/components/WidgetWorkCalendar.vue
new file mode 100644
index 00000000..6e26a91c
--- /dev/null
+++ b/apps/web-antd/src/views/dashboard/workspace/components/WidgetWorkCalendar.vue
@@ -0,0 +1,28 @@
+<script lang="ts" setup>
+/**
+ * 工作台「日程日历」widget：快捷入口行下方全宽
+ * 直接复用日历模块的 CalendarPanel 紧凑模式（隐藏图例/格子变矮/每格 2 条待办），
+ * 面板自带月份大标题头部，故不再额外渲染 widget 标题（title 仅为对齐布局接口保留）
+ */
+import CalendarPanel from '#/views/dashboard/calendar/components/CalendarPanel.vue';
+
+interface Props {
+  title: string;
+}
+defineProps<Props>();
+</script>
+<template>
+  <div class="work-calendar-widget">
+    <CalendarPanel compact />
+  </div>
+</template>
+<style scoped>
+/* widget 外壳与面板都撑满网格行高：与右侧快捷入口等高对齐（行高由日历内容决定） */
+.work-calendar-widget {
+  height: 100%;
+}
+
+.work-calendar-widget :deep(.work-calendar) {
+  height: 100%;
+}
+</style>
diff --git a/apps/web-antd/src/views/dashboard/workspace/components/WorkspaceHeader.vue b/apps/web-antd/src/views/dashboard/workspace/components/WorkspaceHeader.vue
new file mode 100644
index 00000000..ab7f6ef1
--- /dev/null
+++ b/apps/web-antd/src/views/dashboard/workspace/components/WorkspaceHeader.vue
@@ -0,0 +1,297 @@
+<script lang="ts" setup>
+/**
+ * 工作台问候头（Premium）：primary 渐变底 + 装饰光斑，头像光环，按时段问候
+ * 右侧铃铛未读角标跳消息中心；头像/姓名可点击进入个人中心，铃铛旁另有「个人中心」按钮
+ * 颜色全走主题变量，暗色自动柔化
+ */
+import { computed, onMounted, ref } from 'vue';
+import { useRouter } from 'vue-router';
+
+import { IconifyIcon as VbenIcon } from '@vben/icons';
+import { preferences } from '@vben/preferences';
+import { useUserStore } from '@vben/stores';
+
+import { Avatar, Badge } from 'ant-design-vue';
+
+import { getNoticeUnreadCountApi } from '#/views/notice/api';
+
+const userStore = useUserStore();
+const router = useRouter();
+
+/** 未读消息数（铃铛角标同源接口） */
+const unreadCount = ref(0);
+
+/** 按时段生成问候语，比「哈喽」更有质感 */
+const greeting = computed(() => {
+  const hour = new Date().getHours();
+  if (hour < 6) return '夜深了';
+  if (hour < 12) return '早上好';
+  if (hour < 14) return '中午好';
+  if (hour < 18) return '下午好';
+  return '晚上好';
+});
+
+/**
+ * 拉取未读消息数；失败静默（角标非关键路径，不打断工作台加载）
+ */
+async function fetchUnreadCount() {
+  try {
+    const res = await getNoticeUnreadCountApi();
+    unreadCount.value = Number(res?.count || 0);
+  } catch {
+    unreadCount.value = 0;
+  }
+}
+
+/**
+ * 点击铃铛跳转消息中心
+ */
+function goNoticeCenter() {
+  router.push('/notice/list');
+}
+
+/**
+ * 进入个人中心（静态路由 /profile，与顶栏头像下拉同一入口）
+ * 头像/姓名区域与右侧按钮都走这里
+ */
+function goProfile() {
+  router.push({ name: 'Profile' });
+}
+
+/**
+ * 当天日期文案（中文长格式）
+ */
+function getTodayDate() {
+  const today = new Date();
+  const options: Intl.DateTimeFormatOptions = {
+    weekday: 'long',
+    year: 'numeric',
+    month: 'long',
+    day: 'numeric',
+  };
+  return today.toLocaleDateString('zh-CN', options);
+}
+const todayDate = getTodayDate();
+
+onMounted(fetchUnreadCount);
+</script>
+
+<template>
+  <div class="ws-header">
+    <!-- 装饰光斑：纯视觉元素，随主题色变化 -->
+    <div aria-hidden="true" class="ws-header__orb ws-header__orb--1"></div>
+    <div aria-hidden="true" class="ws-header__orb ws-header__orb--2"></div>
+
+    <div
+      class="ws-header__left ws-header__left--clickable"
+      role="button"
+      tabindex="0"
+      title="进入个人中心"
+      @click="goProfile"
+      @keydown.enter="goProfile"
+    >
+      <div class="ws-header__avatar-ring">
+        <Avatar
+          :size="44"
+          :src="userStore.userInfo?.avatar || preferences.app.defaultAvatar"
+        />
+      </div>
+      <div class="ws-header__text">
+        <div class="ws-header__title">
+          {{ greeting }}，{{ userStore.userInfo?.nick_name }}
+          <span class="ws-header__role">
+            {{ userStore.userInfo?.roles?.name }}
+          </span>
+        </div>
+        <div class="ws-header__date">{{ todayDate }} · 开始您一天的工作吧</div>
+      </div>
+    </div>
+
+    <div class="ws-header__right">
+      <button
+        aria-label="个人中心"
+        class="ws-header__bell"
+        title="个人中心"
+        type="button"
+        @click="goProfile"
+      >
+        <VbenIcon class="ws-header__bell-icon" icon="lucide:user" />
+      </button>
+      <Badge :count="unreadCount" :offset="[-2, 2]" :overflow-count="99">
+        <button
+          aria-label="消息中心"
+          class="ws-header__bell"
+          type="button"
+          @click="goNoticeCenter"
+        >
+          <VbenIcon class="ws-header__bell-icon" icon="lucide:bell" />
+        </button>
+      </Badge>
+    </div>
+  </div>
+</template>
+
+<style scoped>
+.ws-header {
+  position: relative;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 18px 20px;
+  overflow: hidden;
+  background:
+    linear-gradient(
+      120deg,
+      hsl(var(--primary) / 0.1),
+      hsl(var(--primary) / 0.03) 45%,
+      transparent 70%
+    ),
+    hsl(var(--card));
+  border: 1px solid hsl(var(--border) / 0.7);
+  border-radius: 12px;
+}
+
+/* 装饰光斑：低透明度 + 大模糊，暗色主题下自然减弱 */
+.ws-header__orb {
+  position: absolute;
+  border-radius: 50%;
+  filter: blur(64px);
+  pointer-events: none;
+}
+
+.ws-header__orb--1 {
+  top: -60px;
+  right: 10%;
+  width: 180px;
+  height: 180px;
+  background: hsl(var(--primary) / 0.18);
+}
+
+.ws-header__orb--2 {
+  right: -40px;
+  bottom: -80px;
+  width: 160px;
+  height: 160px;
+  background: hsl(var(--primary) / 0.1);
+}
+
+.ws-header__left {
+  position: relative;
+  display: flex;
+  gap: 14px;
+  align-items: center;
+  min-width: 0;
+}
+
+/* 头像/姓名整块可点击进入个人中心：hover 给出轻微反馈但不破坏问候头质感 */
+.ws-header__left--clickable {
+  padding: 4px 10px 4px 4px;
+  margin: -4px -10px -4px -4px;
+  cursor: pointer;
+  border-radius: 10px;
+  transition: background-color 0.2s ease;
+}
+
+.ws-header__left--clickable:hover {
+  background: hsl(var(--primary) / 0.08);
+}
+
+.ws-header__left--clickable:hover .ws-header__title {
+  color: hsl(var(--primary));
+}
+
+/* 头像光环：primary 低透明双环 */
+.ws-header__avatar-ring {
+  display: flex;
+  padding: 3px;
+  background: hsl(var(--card));
+  border-radius: 50%;
+  box-shadow:
+    0 0 0 2px hsl(var(--primary) / 0.25),
+    0 4px 12px hsl(var(--primary) / 0.12);
+  flex-shrink: 0;
+}
+
+.ws-header__text {
+  min-width: 0;
+}
+
+.ws-header__title {
+  overflow: hidden;
+  font-size: 16px;
+  font-weight: 650;
+  color: hsl(var(--foreground));
+  letter-spacing: -0.01em;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.ws-header__role {
+  display: inline-block;
+  margin-left: 8px;
+  padding: 1px 8px;
+  font-size: 11px;
+  font-weight: 500;
+  color: hsl(var(--primary));
+  vertical-align: 2px;
+  background: hsl(var(--primary) / 0.1);
+  border: 1px solid hsl(var(--primary) / 0.2);
+  border-radius: 999px;
+}
+
+.ws-header__date {
+  margin-top: 3px;
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+}
+
+.ws-header__right {
+  position: relative;
+  display: flex;
+  gap: 10px;
+  align-items: center;
+}
+
+/* 铃铛按钮：圆形玻璃感容器 */
+.ws-header__bell {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 38px;
+  height: 38px;
+  cursor: pointer;
+  background: hsl(var(--muted) / 0.4);
+  border: 1px solid hsl(var(--border) / 0.7);
+  border-radius: 50%;
+  transition:
+    background-color 0.2s ease,
+    border-color 0.2s ease,
+    transform 0.2s cubic-bezier(0.4, 0, 0.2, 1);
+}
+
+.ws-header__bell:hover {
+  background: hsl(var(--primary) / 0.1);
+  border-color: hsl(var(--primary) / 0.3);
+  transform: translateY(-1px);
+}
+
+.ws-header__bell-icon {
+  width: 17px;
+  height: 17px;
+  color: hsl(var(--foreground) / 0.75);
+}
+
+.ws-header__bell:hover .ws-header__bell-icon {
+  color: hsl(var(--primary));
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .ws-header__bell {
+    transition: none;
+  }
+
+  .ws-header__bell:hover {
+    transform: none;
+  }
+}
+</style>
diff --git a/apps/web-antd/src/views/dashboard/workspace/config/widgets.ts b/apps/web-antd/src/views/dashboard/workspace/config/widgets.ts
new file mode 100644
index 00000000..534a28a1
--- /dev/null
+++ b/apps/web-antd/src/views/dashboard/workspace/config/widgets.ts
@@ -0,0 +1,48 @@
+import type { Component } from 'vue';
+
+import NoticeTicker from '../components/NoticeTicker.vue';
+import WidgetAppointmentUpcoming from '../components/WidgetAppointmentUpcoming.vue';
+import WidgetCalendarTodo from '../components/WidgetCalendarTodo.vue';
+import WidgetClinicToday from '../components/WidgetClinicToday.vue';
+import WidgetDoctorToday from '../components/WidgetDoctorToday.vue';
+import WidgetOrderPending from '../components/WidgetOrderPending.vue';
+import WidgetPharmacistPending from '../components/WidgetPharmacistPending.vue';
+import WidgetPlatformOverview from '../components/WidgetPlatformOverview.vue';
+import WidgetQuickEntry from '../components/WidgetQuickEntry.vue';
+import WidgetSalespersonSummary from '../components/WidgetSalespersonSummary.vue';
+import WidgetTodoCenter from '../components/WidgetTodoCenter.vue';
+import WidgetWorkCalendar from '../components/WidgetWorkCalendar.vue';
+
+/**
+ * widget_code → 组件映射（与后端 WorkbenchWidgetEnum 对齐）
+ * 后端 layout 下发未知 code 时前端直接跳过，保证两端可独立灰度上线
+ * notice 已由列表卡（WidgetNotice，弃用保留）换成单行轮播条 NoticeTicker，
+ * 实际渲染位置由 index.vue 固定插槽控制（驾驶舱卡底内嵌 / 无驾驶舱独立一行）
+ */
+export const WIDGET_COMPONENT_MAP: Record<string, Component> = {
+  quick_nav: WidgetQuickEntry,
+  notice: NoticeTicker,
+  doctor_today: WidgetDoctorToday,
+  pharmacist_pending: WidgetPharmacistPending,
+  salesperson_summary: WidgetSalespersonSummary,
+  clinic_today: WidgetClinicToday,
+  order_pending: WidgetOrderPending,
+  platform_overview: WidgetPlatformOverview,
+  todo_center: WidgetTodoCenter,
+  appointment_upcoming: WidgetAppointmentUpcoming,
+  // 日程待办（快捷入口行右侧）与日程日历（快捷入口行下方全宽），布局位置固定不进 KPI 区
+  calendar_todo: WidgetCalendarTodo,
+  work_calendar: WidgetWorkCalendar,
+};
+
+/** KPI 类模块（渲染在中部 KPI 区，其余按固定位置渲染） */
+export const KPI_WIDGET_CODES = new Set([
+  'doctor_today',
+  'pharmacist_pending',
+  'salesperson_summary',
+  'clinic_today',
+  'order_pending',
+  'platform_overview',
+  'todo_center',
+  'appointment_upcoming',
+]);
diff --git a/apps/web-antd/src/views/dashboard/workspace/index.vue b/apps/web-antd/src/views/dashboard/workspace/index.vue
index e2da28ce..8c5321cc 100644
--- a/apps/web-antd/src/views/dashboard/workspace/index.vue
+++ b/apps/web-antd/src/views/dashboard/workspace/index.vue
@@ -1,185 +1,319 @@
 <script lang="ts" setup>
-import type {
-  WorkbenchProjectItem,
-  WorkbenchQuickNavItem,
-  WorkbenchTodoItem,
-  WorkbenchTrendItem,
-} from '@vben/common-ui';
+/**
+ * 工作台首页：按角色 layout 动态装载模块
+ * 行结构（自上而下）：
+ *   第一行：有驾驶舱（platform_overview/todo_center）时 = 左合并卡（卡底内嵌单行公告轮播）+ 右快捷入口（等高、内部滚动）；
+ *           无驾驶舱时 = 公告轮播条全宽一行 + 快捷入口全宽一行
+ *   第二行：日程日历（左 6）+ 日程待办（右 4），两列等高，待办列表内部滚动
+ *   之后：角色 KPI 摘要（按 sort 依次渲染）
+ * 布局由 workbench/layout 下发（xk_role_workbench_widget 按角色配置），未配置的模块不渲染
+ */
+import type { WorkbenchLayoutItem } from './api';
 
-import { ref } from 'vue';
-import { useRouter } from 'vue-router';
+import { computed, onMounted, ref } from 'vue';
 
-import {
-  AnalysisChartCard,
-  WorkbenchHeader,
-  WorkbenchProject,
-  WorkbenchQuickNav,
-  WorkbenchTodo,
-  WorkbenchTrends,
-} from '@vben/common-ui';
-import { LogoSvgICON } from '@vben/icons';
-import { preferences } from '@vben/preferences';
-import { useUserStore } from '@vben/stores';
-import { openWindow } from '@vben/utils';
+import { getWorkbenchLayoutApi } from './api';
+import NoticeTicker from './components/NoticeTicker.vue';
+import WidgetAdminHub from './components/WidgetAdminHub.vue';
+import WorkspaceHeader from './components/WorkspaceHeader.vue';
+import { KPI_WIDGET_CODES, WIDGET_COMPONENT_MAP } from './config/widgets';
 
-import AnalyticsVisitsSource from '../analytics/analytics-visits-source.vue';
-import {getQuickMenuApi} from "#/views/system/admin/api";
-import {getLatestNotice} from "#/views/system/notice/api";
+/** 角色布局（后端已按 sort 排序并过滤非法 code） */
+const layout = ref<WorkbenchLayoutItem[]>([]);
+const loaded = ref(false);
 
-const userStore = useUserStore();
+/** 有效模块：仅保留前端已注册的组件 */
+const validItems = computed(() =>
+  layout.value.filter((item) => WIDGET_COMPONENT_MAP[item.widget_code]),
+);
 
-// 这是一个示例数据，实际项目中需要根据实际情况进行调整
-// url 也可以是内部路由，在 navTo 方法中识别处理，进行内部跳转
-// 例如：url: /dashboard/workspace
-const projectItems: WorkbenchProjectItem[] = [
-  {
-    color: 'blue',
-    content: '不要等待机会，而要创造机会。',
-    date: '2021-04-01',
-    group: '萧康云医科技',
-    icon: LogoSvgICON,
-    title: '萧康后台管理系统-旧版本',
-    url: 'https://admin.xiaokang88.com',
-  },
-  {
-    color: 'blue',
-    content: '数据可视化平台。',
-    date: '2021-04-01',
-    group: '萧康云医科技',
-    icon: 'fluent-color:data-bar-vertical-ascending-20',
-    title: '数据大屏',
-    url: 'http://dls.xiaokang88.com',
-  },
-];
+/** 平台总览项（超管/系统管理员） */
+const overviewItem = computed(() =>
+  validItems.value.find((item) => item.widget_code === 'platform_overview'),
+);
 
-// 同样，这里的 url 也可以使用以 http 开头的外部链接
-const quickNavItems: WorkbenchQuickNavItem[] = ref([]);
+/** 待办中心项（超管/系统管理员） */
+const todoItem = computed(() =>
+  validItems.value.find((item) => item.widget_code === 'todo_center'),
+);
 
 /**
- * 获取快捷菜单
+ * 是否渲染顶部管理驾驶舱行：布局含总览或待办任一即启用
+ * 为什么合并渲染：总览+待办同属「今日经营快照」，合并成一张卡放左列信息密度更高
  */
-function getQuickMenu() {
-  getQuickMenuApi().then((res) => {
-    quickNavItems.value = res;
-  });
-}
-getQuickMenu();
-const todoItems = ref<WorkbenchTodoItem[]>([
-  {
-    completed: false,
-    content: `审查最近提交到Git仓库的前端代码，确保代码质量和规范。`,
-    date: '2024-07-30 11:00:00',
-    title: '审查前端代码提交',
-  },
-  {
-    completed: true,
-    content: `检查并优化系统性能，降低CPU使用率。`,
-    date: '2024-07-30 11:00:00',
-    title: '系统性能优化',
-  },
-  {
-    completed: false,
-    content: `进行系统安全检查，确保没有安全漏洞或未授权的访问。 `,
-    date: '2024-07-30 11:00:00',
-    title: '安全检查',
-  },
-  {
-    completed: false,
-    content: `更新项目中的所有npm依赖包，确保使用最新版本。`,
-    date: '2024-07-30 11:00:00',
-    title: '更新项目依赖',
-  },
-  {
-    completed: false,
-    content: `修复用户报告的页面UI显示问题，确保在不同浏览器中显示一致。 `,
-    date: '2024-07-30 11:00:00',
-    title: '修复UI显示问题',
-  },
-]);
-const trendItems = ref<WorkbenchTrendItem[]>([]);
+const hasAdminHub = computed(() => !!overviewItem.value || !!todoItem.value);
+
+/** 快捷入口：有驾驶舱时放第一行右列（与驾驶舱等高、内部滚动），否则全宽一行 */
+const quickNavItem = computed(() =>
+  validItems.value.find((item) => item.widget_code === 'quick_nav'),
+);
+
+/** 日程待办：第二行右列（与日历等高，列表内部滚动） */
+const calendarTodoItem = computed(() =>
+  validItems.value.find((item) => item.widget_code === 'calendar_todo'),
+);
+
+/** 日程日历：第二行左列（CalendarPanel 紧凑模式，6/4 分中的 6） */
+const workCalendarItem = computed(() =>
+  validItems.value.find((item) => item.widget_code === 'work_calendar'),
+);
+
+/** KPI 摘要区（中部，按 sort 依次渲染；总览/待办已合并进顶部驾驶舱，需排除） */
+const kpiItems = computed(() =>
+  validItems.value.filter(
+    (item) =>
+      KPI_WIDGET_CODES.has(item.widget_code) &&
+      item.widget_code !== 'platform_overview' &&
+      item.widget_code !== 'todo_center',
+  ),
+);
+
+/** 公告：单行轮播条（有驾驶舱时内嵌其卡底，无驾驶舱时独立全宽一行） */
+const noticeItem = computed(() =>
+  validItems.value.find((item) => item.widget_code === 'notice'),
+);
 
 /**
- * 获取最新公告
+ * 拉取角色布局；失败时兜底展示快捷入口 + 公告（保证工作台不白屏）
  */
-function getLatestNoticeList() {
-  getLatestNotice(10).then((res) => {
-    trendItems.value = res;
-  });
-}
-getLatestNoticeList();
-
-const router = useRouter();
-
-// 这是一个示例方法，实际项目中需要根据实际情况进行调整
-// This is a sample method, adjust according to the actual project requirements
-function navTo(nav: WorkbenchProjectItem | WorkbenchQuickNavItem) {
-  if (nav.url?.startsWith('http')) {
-    openWindow(nav.url);
-    return;
-  }
-  if (nav.url?.startsWith('/')) {
-    router.push(nav.url).catch((error) => {
-      console.error('Navigation failed:', error);
-    });
-  } else {
-    console.warn(`Unknown URL for navigation item: ${nav.title} -> ${nav.url}`);
+async function fetchLayout() {
+  try {
+    const res = await getWorkbenchLayoutApi();
+    layout.value = Array.isArray(res) ? res : [];
+  } catch {
+    layout.value = [
+      { id: 0, widget_code: 'quick_nav', title: '快捷入口', sort: 10, config: null },
+      { id: 0, widget_code: 'notice', title: '最新动态', sort: 90, config: null },
+    ];
+  } finally {
+    loaded.value = true;
   }
 }
 
-// 获取当天的日期和天气
-function getTodayDate() {
-  const today = new Date();
-  const options: Intl.DateTimeFormatOptions = {
-    weekday: 'long',
-    year: 'numeric',
-    month: 'long',
-    day: 'numeric',
-  };
-  return today.toLocaleDateString('zh-CN', options);
-}
-const todayDate = getTodayDate();
+onMounted(fetchLayout);
 </script>
 
 <template>
-  <div class="p-5">
-    <WorkbenchHeader
-      :avatar="userStore.userInfo?.avatar || preferences.app.defaultAvatar"
-    >
-      <template #title>
-        哈喽, {{ userStore.userInfo?.nick_name }} -
-        {{ userStore.userInfo?.roles?.name }}, 开始您一天的工作吧！
-        <!--        <Button type="primary" v-access:code="['Super Admin']">测我是超级管理员</Button>-->
-        <!--        <Button type="primary" v-access:code="['Admin']">测我是管理员</Button>-->
-      </template>
-      <template #description>
-        {{ todayDate }}
-      </template>
-    </WorkbenchHeader>
+  <div class="workspace-page">
+    <div class="workspace-page__inner">
+      <div class="workspace-page__section" style="--delay: 0">
+        <WorkspaceHeader />
+      </div>
 
-    <div class="mt-5 flex flex-col lg:flex-row">
-      <div class="mr-4 w-full lg:w-3/5">
-<!--        <WorkbenchProject :items="projectItems" title="项目" @click="navTo" />-->
-<!--        <WorkbenchTrends :items="trendItems" class="mt-5" title="最新动态" />-->
-        <WorkbenchQuickNav
-          :items="quickNavItems"
-          class="mt-5 lg:mt-0"
-          title="快捷导航"
-          @click="navTo"
-        />
-      </div>
-      <div class="w-full lg:w-2/5">
-        <WorkbenchTrends :items="trendItems" class="mt-5" title="最新动态" />
-<!--        <WorkbenchQuickNav-->
-<!--          :items="quickNavItems"-->
-<!--          class="mt-5 lg:mt-0"-->
-<!--          title="快捷导航"-->
-<!--          @click="navTo"-->
-<!--        />-->
-<!--        <WorkbenchTodo :items="todoItems" class="mt-5" title="待办事项" />-->
-<!--        <AnalysisChartCard class="mt-5" title="访问来源">-->
-<!--          <AnalyticsVisitsSource />-->
-<!--        </AnalysisChartCard>-->
-      </div>
+      <template v-if="loaded">
+        <!-- 第一行（有驾驶舱）：左合并卡（卡底内嵌公告轮播条）+ 右快捷入口（等高、内部滚动） -->
+        <div v-if="hasAdminHub" class="workspace-page__section" style="--delay: 1">
+          <div class="workspace-hero" :class="{ full: !quickNavItem }">
+            <div class="workspace-hero__main">
+              <WidgetAdminHub
+                :overview-title="overviewItem?.title || '平台总览'"
+                :todo-title="todoItem?.title || '待办中心'"
+              >
+                <template v-if="noticeItem" #notice>
+                  <NoticeTicker />
+                </template>
+              </WidgetAdminHub>
+            </div>
+            <div v-if="quickNavItem" class="workspace-hero__side">
+              <component
+                :is="WIDGET_COMPONENT_MAP[quickNavItem.widget_code]"
+                :title="quickNavItem.title"
+              />
+            </div>
+          </div>
+        </div>
+
+        <!-- 无驾驶舱：公告轮播条全宽一行 + 快捷入口全宽一行 -->
+        <template v-else>
+          <div v-if="noticeItem" class="workspace-page__section" style="--delay: 1">
+            <NoticeTicker standalone />
+          </div>
+          <div v-if="quickNavItem" class="workspace-page__section" style="--delay: 1">
+            <component
+              :is="WIDGET_COMPONENT_MAP[quickNavItem.widget_code]"
+              :title="quickNavItem.title"
+            />
+          </div>
+        </template>
+
+        <!-- 第二行：日程日历（左 6）+ 日程待办（右 4）等高；缺一方时另一方全宽 -->
+        <div
+          v-if="workCalendarItem || calendarTodoItem"
+          class="workspace-page__section"
+          style="--delay: 2"
+        >
+          <div
+            class="workspace-calrow"
+            :class="{ 'has-side': workCalendarItem && calendarTodoItem }"
+          >
+            <div v-if="workCalendarItem" class="workspace-calrow__main">
+              <component
+                :is="WIDGET_COMPONENT_MAP[workCalendarItem.widget_code]"
+                :title="workCalendarItem.title"
+              />
+            </div>
+            <div v-if="calendarTodoItem" class="workspace-calrow__side">
+              <component
+                :is="WIDGET_COMPONENT_MAP[calendarTodoItem.widget_code]"
+                :title="calendarTodoItem.title"
+              />
+            </div>
+          </div>
+        </div>
+
+        <!-- 角色 KPI 摘要 -->
+        <div
+          v-for="(item, index) in kpiItems"
+          :key="item.widget_code"
+          :style="{ '--delay': index + 3 }"
+          class="workspace-page__section"
+        >
+          <component
+            :is="WIDGET_COMPONENT_MAP[item.widget_code]"
+            :title="item.title"
+          />
+        </div>
+      </template>
     </div>
   </div>
 </template>
+
+<style scoped>
+.workspace-page {
+  padding: 20px;
+}
+
+/* 居中限宽：大屏下不至于被拉太宽，更显精致 */
+.workspace-page__inner {
+  display: flex;
+  flex-direction: column;
+  gap: 16px;
+  max-width: 1400px;
+  margin: 0 auto;
+}
+
+/* 顶部驾驶舱行：左合并卡（58%）+ 右快捷入口（42%），窄屏退化为上下堆叠 */
+.workspace-hero {
+  display: grid;
+  grid-template-columns: minmax(0, 58fr) minmax(0, 42fr);
+  gap: 16px;
+  align-items: stretch;
+}
+
+/* 未配置快捷入口时驾驶舱独占整行 */
+.workspace-hero.full {
+  grid-template-columns: 1fr;
+}
+
+.workspace-hero__main,
+.workspace-hero__side {
+  min-width: 0;
+}
+
+/* 行高完全由左侧驾驶舱决定：快捷入口绝对定位填充，不参与行高计算（钉住项多时只内部滚动，不把首行撑高） */
+.workspace-hero__side {
+  position: relative;
+}
+
+/* 快捷入口改纵向弹性布局：头部固定，内容区吃掉剩余高度并内部滚动（与驾驶舱等高的关键） */
+.workspace-hero__side :deep(.quick-entry) {
+  position: absolute;
+  inset: 0;
+  display: flex;
+  flex-direction: column;
+}
+
+/* 42% 列宽下瓷砖按格宽自适应列数；align-content 顶对齐避免行间被拉开 */
+.workspace-hero__side :deep(.quick-entry__grid) {
+  flex: 1;
+  grid-template-columns: repeat(auto-fill, minmax(92px, 1fr));
+  align-content: start;
+  min-height: 0;
+  overflow-y: auto;
+}
+
+/* 搜索结果同样吃满剩余高度滚动（解除组件内 320px 限高） */
+.workspace-hero__side :deep(.quick-entry__results) {
+  flex: 1;
+  min-height: 0;
+  max-height: none;
+  overflow-y: auto;
+}
+
+@media (max-width: 1024px) {
+  .workspace-hero {
+    grid-template-columns: 1fr;
+  }
+
+  /* 堆叠后取消绝对定位（否则高度塌陷），瓷砖内容自然撑高不滚动 */
+  .workspace-hero__side :deep(.quick-entry) {
+    position: static;
+  }
+
+  .workspace-hero__side :deep(.quick-entry__grid) {
+    overflow-y: visible;
+  }
+}
+
+/* 第二行：日程日历（80%）+ 日程待办（20%）等高；行高由日历内容决定 */
+.workspace-calrow {
+  display: grid;
+  grid-template-columns: 1fr;
+  gap: 16px;
+  align-items: stretch;
+}
+
+.workspace-calrow.has-side {
+  grid-template-columns: minmax(0, 8fr) minmax(0, 2fr);
+}
+
+.workspace-calrow__main,
+.workspace-calrow__side {
+  min-width: 0;
+}
+
+/* 行高完全由日历决定：待办卡绝对定位填充，不参与行高计算（待办再多也只在卡内滚动） */
+.workspace-calrow__side {
+  position: relative;
+}
+
+.workspace-calrow__side :deep(.calendar-todo-widget) {
+  position: absolute;
+  inset: 0;
+}
+
+@media (max-width: 1024px) {
+  .workspace-calrow.has-side {
+    grid-template-columns: 1fr;
+  }
+
+  /* 堆叠后取消绝对定位（否则高度塌陷），列表限高由组件内媒体查询接管 */
+  .workspace-calrow__side :deep(.calendar-todo-widget) {
+    position: static;
+  }
+}
+
+/* 区块交错入场：轻微上移淡入，节奏 60ms/块 */
+.workspace-page__section {
+  animation: ws-fade-up 0.4s cubic-bezier(0.4, 0, 0.2, 1) both;
+  animation-delay: calc(var(--delay, 0) * 60ms);
+}
+
+@keyframes ws-fade-up {
+  from {
+    opacity: 0;
+    transform: translateY(8px);
+  }
+
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .workspace-page__section {
+    animation: none;
+  }
+}
+</style>
diff --git a/apps/web-antd/src/views/dashboard/workspace/utils/flatten-menus.ts b/apps/web-antd/src/views/dashboard/workspace/utils/flatten-menus.ts
new file mode 100644
index 00000000..b9813f28
--- /dev/null
+++ b/apps/web-antd/src/views/dashboard/workspace/utils/flatten-menus.ts
@@ -0,0 +1,43 @@
+import type { MenuRecordRaw } from '@vben/types';
+
+/** 可搜索的菜单项（拍平后的叶子菜单） */
+export type SearchableMenuItem = {
+  title: string;
+  path: string;
+  icon: string;
+};
+
+/**
+ * 将 accessMenus 递归拍平为叶子菜单列表
+ * 为什么：工作台本地搜索需要覆盖当前账号全部授权页面，叶子节点才是可跳转页
+ */
+export function flattenMenus(menus: MenuRecordRaw[]): SearchableMenuItem[] {
+  const result: SearchableMenuItem[] = [];
+  const walk = (list: MenuRecordRaw[]) => {
+    for (const menu of list) {
+      if (menu.children && menu.children.length > 0) {
+        walk(menu.children);
+      } else if (menu.path) {
+        result.push({
+          title: String(menu.name || ''),
+          path: menu.path,
+          icon: typeof menu.icon === 'string' ? menu.icon : '',
+        });
+      }
+    }
+  };
+  walk(menus);
+  return result;
+}
+
+/**
+ * 本地关键字过滤（忽略大小写的标题包含匹配）
+ */
+export function filterMenusByKeyword(
+  items: SearchableMenuItem[],
+  keyword: string,
+): SearchableMenuItem[] {
+  const kw = keyword.trim().toLowerCase();
+  if (!kw) return [];
+  return items.filter((item) => item.title.toLowerCase().includes(kw));
+}
diff --git a/apps/web-antd/src/views/doctor/doctor-article/config/table.ts b/apps/web-antd/src/views/doctor/doctor-article/config/table.ts
index 511a39ba..848503a3 100644
--- a/apps/web-antd/src/views/doctor/doctor-article/config/table.ts
+++ b/apps/web-antd/src/views/doctor/doctor-article/config/table.ts
@@ -55,7 +55,7 @@ export const gridOptions: VxeGridProps<RowType> = {
     // custom: true, // 自定义列
     zoom: true, // 最大化最小化
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
     custom: {
       // 自定义列-图标
diff --git a/apps/web-antd/src/views/doctor/doctor-article/index.vue b/apps/web-antd/src/views/doctor/doctor-article/index.vue
index 5c7c22b4..a31da8ca 100644
--- a/apps/web-antd/src/views/doctor/doctor-article/index.vue
+++ b/apps/web-antd/src/views/doctor/doctor-article/index.vue
@@ -68,7 +68,7 @@ const showDetail = (row: any) => {
     <FormModal />
     <DetailModal />
     <Grid>
-      <template #toolbar-buttons>
+      <template #toolbar-actions>
         <TableAction
           :actions="[
             {
diff --git a/apps/web-antd/src/views/doctor/doctor-reception/components/PrescriptionDetail.vue b/apps/web-antd/src/views/doctor/doctor-reception/components/PrescriptionDetail.vue
index e8c08891..bd009146 100644
--- a/apps/web-antd/src/views/doctor/doctor-reception/components/PrescriptionDetail.vue
+++ b/apps/web-antd/src/views/doctor/doctor-reception/components/PrescriptionDetail.vue
@@ -8,8 +8,9 @@ import { computed, ref } from 'vue';
 
 import { Page, useVbenModal } from '@vben/common-ui';
 
-import { Button, Spin, message } from 'ant-design-vue';
+import { Button, Popover, Select, Spin, Switch, message } from 'ant-design-vue';
 
+import { desktop, isElectron } from '#/util/desktop';
 import { getPrescriptionInfoApi } from '#/views/doctor/doctor-reception/api';
 import { formatDoctorOrderText } from '#/utils/prescriptionDoctorOrder';
 import { formatStoreNameWithHu } from '#/utils/formatStoreNameWithHu';
@@ -121,7 +122,78 @@ function handleReject() {
   RejectionReasonModalApi.open();
 }
 
-function handleWindowPrint(_ele, fileName) {
+/** 是否运行在 Electron 桌面端（决定是否展示打印设置入口与静默打印分支） */
+const isDesktop = isElectron();
+/** 桌面端打印设置（打印机 + 静默开关），由主进程持久化到本地 */
+const printSettings = ref<{ printerName: string; silentPrint: boolean }>({
+  printerName: '',
+  silentPrint: false,
+});
+/** 打印机下拉选项（打开设置时从系统实时拉取） */
+const printerOptions = ref<Array<{ label: string; value: string }>>([]);
+if (isDesktop) {
+  desktop.getSettings().then((s) => {
+    printSettings.value = s;
+  });
+}
+
+/** 打开打印设置时拉取系统打印机列表（每次打开都刷新，应对打印机增删） */
+async function handlePrintSettingOpen(open: boolean) {
+  if (!open) return;
+  const printers = await desktop.getPrinters();
+  printerOptions.value = printers.map((p) => ({
+    label: `${p.displayName || p.name}${p.isDefault ? '（默认）' : ''}`,
+    value: p.name,
+  }));
+}
+
+/** 更新打印设置并持久化（主进程写 userData/desktop-settings.json） */
+async function updatePrintSettings(patch: {
+  printerName?: string;
+  silentPrint?: boolean;
+}) {
+  printSettings.value = await desktop.setSettings(patch);
+}
+
+/**
+ * 拼装完整打印 HTML：.print-box 内容 + 页面全部样式（含 scoped 样式与外链样式表）
+ * 与 iframe 打印用的是同一套模板内容，保证静默打印与对话框打印效果一致
+ */
+function buildPrintHtml(fileName: string): null | string {
+  const printBox = document.querySelector('.print-box');
+  if (!printBox) return null;
+  const styleTags: string[] = [];
+  document.querySelectorAll('style, link[rel="stylesheet"]').forEach((style) => {
+    // link 取绝对地址（.href 属性自动补全），隐藏窗口加载临时文件时才能命中样式
+    styleTags.push(
+      style.tagName === 'LINK'
+        ? `<link rel="stylesheet" href="${(style as HTMLLinkElement).href}" />`
+        : style.outerHTML,
+    );
+  });
+  return `<!DOCTYPE html><html><head><meta charset="utf-8" /><title>${fileName || '文档打印'}</title>${styleTags.join('')}</head><body>${printBox.outerHTML}</body></html>`;
+}
+
+async function handleWindowPrint(_ele, fileName) {
+  // 桌面端且开启静默打印：拼同样的打印 HTML 交给主进程隐藏窗口直接出纸，不弹打印对话框
+  if (isDesktop && printSettings.value.silentPrint) {
+    const html = buildPrintHtml(fileName);
+    if (!html) {
+      message.error('找不到打印内容');
+      return;
+    }
+    const result = await desktop.printHTML({
+      html,
+      deviceName: printSettings.value.printerName || undefined,
+      silent: true,
+    });
+    if (result.ok) {
+      message.success('已发送到打印机');
+    } else {
+      message.error(`打印失败：${result.message || '未知错误'}`);
+    }
+    return;
+  }
   const printBox = document.querySelector('.print-box');
   if (!printBox) {
     console.error('找不到具有 "print-box" 类的元素');
@@ -198,6 +270,46 @@ function parseRecipeContent(content: string | Record<string, unknown>) {
         <Button type="primary" @click="handleWindowPrint('#demo', '处方')">
           打印处方
         </Button>
+        <!-- 打印设置：仅桌面端可见，配置静默打印开关与目标打印机 -->
+        <Popover
+          v-if="isDesktop"
+          trigger="click"
+          placement="bottomLeft"
+          @open-change="handlePrintSettingOpen"
+        >
+          <template #content>
+            <div class="flex w-64 flex-col gap-3">
+              <div class="flex items-center justify-between">
+                <span>静默打印</span>
+                <Switch
+                  :checked="printSettings.silentPrint"
+                  @change="
+                    (checked: any) =>
+                      updatePrintSettings({ silentPrint: !!checked })
+                  "
+                />
+              </div>
+              <div>
+                <div class="mb-1">打印机</div>
+                <Select
+                  class="w-full"
+                  :value="printSettings.printerName || undefined"
+                  :options="printerOptions"
+                  placeholder="系统默认打印机"
+                  allow-clear
+                  @change="
+                    (value: any) =>
+                      updatePrintSettings({ printerName: (value as string) || '' })
+                  "
+                />
+              </div>
+              <div class="text-xs text-muted-foreground">
+                开启后打印处方不再弹出打印对话框，直接从所选打印机出纸
+              </div>
+            </div>
+          </template>
+          <Button class="ml-2">打印设置</Button>
+        </Popover>
         <div class="prescription-container print-box">
           <div class="prescription-header">
             <div class="header-top">
diff --git a/apps/web-antd/src/views/doctor/doctor-reception/index.vue b/apps/web-antd/src/views/doctor/doctor-reception/index.vue
index 481bfaca..ab74be11 100644
--- a/apps/web-antd/src/views/doctor/doctor-reception/index.vue
+++ b/apps/web-antd/src/views/doctor/doctor-reception/index.vue
@@ -11,6 +11,7 @@ import {
   FileTextOutlined,
   HistoryOutlined,
   MedicineBoxOutlined,
+  CheckCircleFilled,
   MenuFoldOutlined,
   MenuUnfoldOutlined,
   PlusOutlined,
@@ -790,6 +791,13 @@ const setVisible = (value, instruction = ''): void => {
   }
 };
 
+/**
+ * 处方发送成功页数据
+ * 发送成功后右区切到成功面板（tabType=3）展示本单摘要，
+ * 「代付收款」直接用这里的 order_id 拉代付码，医生不用再去处方记录抽屉里找
+ */
+const sentPrescriptionInfo = ref<any>(null);
+
 /**
  * 选择患者：已接诊直接进开方工作台；未接诊进轻量接诊操作区（不再进旧患者信息大页）
  */
@@ -814,6 +822,10 @@ const selectPatient = async (patient: Patient, isUpdateTabType = true) => {
     if (patient.status !== 2 && tabType.value === 2) {
       tabType.value = 1;
     }
+    // 发送成功页数据不跨刷新：缓存里是成功页但数据已丢时，按接诊状态回落
+    if (tabType.value === 3 && !sentPrescriptionInfo.value) {
+      tabType.value = patient.status === 2 ? 2 : 1;
+    }
   }
   activePatient.value = patient.user_patient;
 
@@ -1215,6 +1227,14 @@ const sendPrescription = () => {
     message.success('处方已发送');
     // 处方已提交，重置 AI 关联，避免下一张处方误关联
     aiRxGenerationId.value = 0;
+    // 先记录本次发送结果（下面会清空诊断/购物车，成功页要用的数据在这里先落住）
+    sentPrescriptionInfo.value = {
+      order_id: Number(res?.order_id || 0),
+      order_no: res?.order_no || '',
+      total_pay_price: res?.total_pay_price || '',
+      patient_name: activePatient.value?.name || '',
+      diagnosis: diagnosis.value,
+    };
     // 有 VIP 时同步保存病历（诊断/医嘱已与处方同源）
     if (canUseMedicalRecord.value) {
       try {
@@ -1257,8 +1277,9 @@ const sendPrescription = () => {
     // 清空当前数据
     clearPrescriptionCart(false);
     clearReceptionDraft(getRegisterId());
-    // 发送成功后留在开方工作台，刷新处方列表即可
-    tabType.value = 2;
+    // 转诊单要等中医诊所确认，留在开方工作台展示转方卡；
+    // 普通发送进入成功页（tabType=3）：摘要 + 代付入口，不自动打开处方记录抽屉
+    tabType.value = needTransfer && transferPrescriptionId ? 2 : 3;
     salespersonTransferPrescriptionId.value = 0;
     checkSalespersonTransfer();
 
@@ -4330,6 +4351,69 @@ function onStoreSelectOpenChange(open: boolean) {
       <!-- /rx-workspace -->
       </Spin>
     </Page>
+    <!-- 处方发送成功页：摘要与代付入口都在面板上，不自动打开处方记录抽屉 -->
+    <Page v-else-if="tabType === 3" class="prescription-panel">
+      <PatientBriefBar
+        :register="patientInfo"
+        :patient="activePatient"
+        :category="category"
+        :store-name="currentStoreName"
+        :is-online="false"
+      />
+      <!-- 成功页布局对齐 C 端付款成功页（shop/paied.vue）：
+           白色圆角卡居中大图标 + 胶囊小按钮，明细行复用 C 端收银台（record-pay.vue）的 label/value 形态 -->
+      <div class="rx-sent-wrap">
+        <!-- 卡 1：成功卡（大图标 + 标题 + 描边胶囊小按钮） -->
+        <div class="rx-sent-card rx-sent-hero">
+          <CheckCircleFilled class="rx-sent-icon" />
+          <h3 class="rx-sent-title">处方已发送</h3>
+          <p class="rx-sent-sub">已推送到患者微信 · 支付完成后门店按方发药</p>
+          <div class="rx-sent-pills">
+            <Button shape="round" size="small" @click="openPatientRxHistoryDrawer">处方记录</Button>
+            <Button shape="round" size="small" danger @click="endOfDiagnosis">结束诊断</Button>
+          </div>
+        </div>
+        <!-- 卡 2：订单明细（label 加粗深色 / 值灰色，合计行大号金额） -->
+        <div class="rx-sent-card rx-sent-detail">
+          <div class="rx-sent-row">
+            <span>订单号</span>
+            <b>{{ sentPrescriptionInfo?.order_no || '—' }}</b>
+          </div>
+          <div class="rx-sent-row">
+            <span>患者</span>
+            <b>{{ sentPrescriptionInfo?.patient_name || '—' }}</b>
+          </div>
+          <div v-if="sentPrescriptionInfo?.diagnosis" class="rx-sent-row">
+            <span>诊断</span>
+            <b>{{ sentPrescriptionInfo.diagnosis }}</b>
+          </div>
+          <div class="rx-sent-row">
+            <span>订单状态</span>
+            <Tag color="orange" class="rx-sent-tag">待患者支付</Tag>
+          </div>
+          <div class="rx-sent-total">
+            <span>总金额</span>
+            <span class="rx-sent-total-val">合计: <b>¥{{ sentPrescriptionInfo?.total_pay_price || '0.00' }}</b></span>
+          </div>
+        </div>
+        <!-- 底部操作：胶囊主按钮（代付收款）+ 描边胶囊次按钮（继续开方），对齐 C 端底部通栏确认钮 -->
+        <div class="rx-sent-ops">
+          <!-- 代付入口：患者不便操作手机时，医生代其发起收款（复用代付码弹窗） -->
+          <Button
+            v-if="sentPrescriptionInfo?.order_id"
+            type="primary"
+            shape="round"
+            size="large"
+            class="rx-sent-main"
+            @click="openProxyPayQrcode(Number(sentPrescriptionInfo.order_id))"
+          >
+            <QrcodeOutlined />
+            代付收款
+          </Button>
+          <Button shape="round" size="large" class="rx-sent-next" @click="tabType = 2">继续开方</Button>
+        </div>
+      </div>
+    </Page>
     <div v-else-if="tabType === 0" class="prescription-panel">
       <Empty/>
     </div>
@@ -4617,6 +4701,10 @@ function onStoreSelectOpenChange(open: boolean) {
 
 .prescription-panel {
   padding: 1rem;
+  /* 轻量接诊面板（待接诊/空态）在锁高布局里自身滚动：
+     健康信息、特殊处方导入卡、转方卡叠加后内容会超一屏，父级 overflow:hidden 会把超出部分裁掉 */
+  min-height: 0;
+  overflow-y: auto;
 }
 /* 开方工作台：占满右侧主区，内部再拆「固定顶栏 / 可滚动内容」 */
 .prescription-panel--rx {
@@ -4629,8 +4717,129 @@ function onStoreSelectOpenChange(open: boolean) {
   /* 内边距交给内部 content，避免双层 padding 挤掉高度 */
   padding: 0 !important;
 }
-/* Page 根下的内容区（无 header 时即第一个/唯一子节点） */
-.prescription-panel--rx :deep(> .h-full) {
+/* 处方发送成功页：视觉对齐 C 端付款成功页（浅灰蓝底 + 白色圆角卡 + 胶囊按钮），
+   颜色走主题变量保证暗色可用，主色用 --primary（与 C 端品牌蓝 #4175EE 同族） */
+.rx-sent-wrap {
+  max-width: 480px;
+  margin: 20px auto 0;
+  padding: 14px 14px 22px;
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+  border-radius: 14px;
+  /* 对应 C 端页面底色 #F8FAFC：用 muted 低透明度自动适配暗色 */
+  background: hsl(var(--muted) / 0.45);
+}
+.rx-sent-card {
+  border-radius: 10px;
+  background: hsl(var(--card, var(--background)));
+  border: 1px solid hsl(var(--border) / 0.55);
+  box-shadow: 0 1px 6px rgb(15 23 42 / 4%);
+}
+/* 成功卡：C 端 paied.vue 头卡形态（大图标居中 + 加粗标题 + 描边胶囊小按钮） */
+.rx-sent-hero {
+  padding: 28px 20px 20px;
+  text-align: center;
+}
+.rx-sent-icon {
+  font-size: 52px;
+  color: hsl(var(--primary));
+  animation: rx-sent-pop 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
+}
+@keyframes rx-sent-pop {
+  0% {
+    transform: scale(0.4);
+    opacity: 0;
+  }
+  100% {
+    transform: scale(1);
+    opacity: 1;
+  }
+}
+.rx-sent-title {
+  margin: 14px 0 4px;
+  font-size: 17px;
+  font-weight: 700;
+  color: hsl(var(--foreground));
+}
+.rx-sent-sub {
+  margin: 0;
+  font-size: 12.5px;
+  color: hsl(var(--muted-foreground));
+}
+.rx-sent-pills {
+  margin-top: 18px;
+  display: flex;
+  justify-content: center;
+  gap: 10px;
+}
+/* 明细卡：C 端 record-pay.vue 的 good_ 行形态（label 加粗深色 / 值常规灰色） */
+.rx-sent-detail {
+  padding: 6px 18px 14px;
+}
+.rx-sent-row {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 16px;
+  min-height: 42px;
+}
+.rx-sent-row > span {
+  flex-shrink: 0;
+  font-size: 13px;
+  font-weight: 600;
+  color: hsl(var(--foreground));
+}
+.rx-sent-row > b {
+  font-weight: 400;
+  font-size: 13px;
+  color: hsl(var(--muted-foreground));
+  text-align: right;
+  word-break: break-all;
+}
+.rx-sent-tag {
+  margin-inline-end: 0;
+}
+/* 合计行：C 端「合计:」小字 + 大号金额 */
+.rx-sent-total {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding-top: 12px;
+  margin-top: 4px;
+  border-top: 1px solid hsl(var(--border) / 0.55);
+}
+.rx-sent-total > span {
+  font-size: 13px;
+  font-weight: 600;
+  color: hsl(var(--foreground));
+}
+.rx-sent-total-val {
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+}
+.rx-sent-total-val b {
+  margin-left: 4px;
+  font-size: 19px;
+  font-weight: 600;
+  color: hsl(var(--foreground));
+}
+/* 底部操作：主按钮胶囊撑满（对齐 C 端底部通栏「确认」钮），次按钮等宽排布 */
+.rx-sent-ops {
+  display: flex;
+  gap: 10px;
+  margin-top: 2px;
+}
+.rx-sent-main {
+  flex: 1.6;
+}
+.rx-sent-next {
+  flex: 1;
+}
+/* Page 根下的内容区：未开 autoContentHeight 时 class 是 flex-1（开了才是 h-full），
+   两种都要命中，否则「固定顶栏 + 内容滚动」的高度链路断裂，长处方整页无法滚动 */
+.prescription-panel--rx :deep(> .h-full),
+.prescription-panel--rx :deep(> .flex-1) {
   flex: 1;
   min-height: 0;
   height: 100% !important;
diff --git a/apps/web-antd/src/views/doctor/doctor/api/schedule.ts b/apps/web-antd/src/views/doctor/doctor/api/schedule.ts
new file mode 100644
index 00000000..dfea6ca1
--- /dev/null
+++ b/apps/web-antd/src/views/doctor/doctor/api/schedule.ts
@@ -0,0 +1,182 @@
+import { requestClient } from '#/api/request';
+
+/**
+ * 医生排班配置 API（后端 xk-api /doctor-schedule）
+ * 排班规则：出诊模式（每天/按星期）× 时段类型（全天/上下午/自定义）× 各时段号源数 × 可预约天数
+ */
+const prefix = 'doctor-schedule/';
+
+/** 排班时段项 */
+export interface ScheduleSlot {
+  id?: number;
+  slot_name: string;
+  start_time: string;
+  end_time: string;
+  capacity: number;
+}
+
+/** 排班配置回显（doctor_id 为 su_id） */
+export async function getDoctorScheduleApi(doctorId: number) {
+  return requestClient.get<any>(`${prefix}detail`, {
+    params: { doctor_id: doctorId },
+  });
+}
+
+/** 保存医生排班（规则 + 时段整体提交，doctor_id 为 su_id） */
+export async function saveDoctorScheduleApi(data: Record<string, any>) {
+  return requestClient.post<any>(`${prefix}save`, data);
+}
+
+/** 门店统一挂号设置回显（诊所管理员不传 store_id 固定本店） */
+export async function getStoreRegisterSettingApi(storeId?: number) {
+  return requestClient.get<any>(`${prefix}get-store-setting`, {
+    params: storeId ? { store_id: storeId } : {},
+  });
+}
+
+/** 保存门店统一可预约天数 */
+export async function saveStoreRegisterSettingApi(data: Record<string, any>) {
+  return requestClient.post<any>(`${prefix}save-store-setting`, data);
+}
+
+/** 排班月历某天的时段（含已约数） */
+export interface ScheduleDaySlot {
+  slot_id: number;
+  slot_name: string;
+  start_time: string;
+  end_time: string;
+  capacity: number;
+  used: number;
+}
+
+/** 排班月历中的一天 */
+export interface ScheduleCalendarDay {
+  date: string;
+  date_ts: number;
+  week: number;
+  is_past: boolean;
+  is_today: boolean;
+  /** 排班来源：day=按日期排班（覆盖） rule=默认规则 */
+  source: 'day' | 'rule';
+  is_rest: boolean;
+  is_work: boolean;
+  total: number;
+  used_total: number;
+  slots: ScheduleDaySlot[];
+  /** 全店视角：该日被按日排班安排值班的医生数（格子「值班 N 人」徽标） */
+  store_duty_count?: number;
+}
+
+/** 班次模板（店级通用 doctor_id=0；医生专属 doctor_id>0，添加该医生排班时优先按专属写入） */
+export interface ShiftTemplate {
+  id: number;
+  store_id: number;
+  doctor_id?: number;
+  doctor_name?: string;
+  name: string;
+  slots: ScheduleSlot[];
+  sort: number;
+  status: number;
+}
+
+/** 排班月历（管理端日历排班视图，doctor_id 为 su_id；store_id 用于按店解析可约窗口提示） */
+export async function getScheduleMonthCalendarApi(
+  doctorId: number,
+  month: string,
+  storeId?: number,
+) {
+  return requestClient.get<any>(`${prefix}month-calendar`, {
+    params: { doctor_id: doctorId, month, ...(storeId ? { store_id: storeId } : {}) },
+  });
+}
+
+/**
+ * 批量按日期排班（doctor_id 单医生 / doctor_ids 多医生批量，二选一或同传自动合并去重）
+ * action：apply_template 套班次模板 / custom 自定义时段 / rest 设休诊 / clear 恢复默认规则
+ * prefer_doctor_template=1（仅套模板）：优先按各医生的专属模板写入，template_id 作为无专属医生的通用兜底（可为 0，要求人人有专属）
+ */
+export async function saveScheduleDaysApi(data: {
+  action: 'apply_template' | 'clear' | 'custom' | 'rest';
+  dates: string[];
+  doctor_id?: number;
+  doctor_ids?: number[];
+  prefer_doctor_template?: number;
+  slots?: ScheduleSlot[];
+  store_id?: number;
+  template_id?: number;
+}) {
+  return requestClient.post<any>(`${prefix}save-days`, data);
+}
+
+/** 出诊医生查询结果项（working_days=在所查日期中出诊的天数） */
+export interface WorkingDoctor {
+  id: number;
+  name: string;
+  avatar: string;
+  working_days: number;
+}
+
+/** 查询门店医生在指定日期集合的出诊命中天数（「选出诊医生」一键勾选用） */
+export async function getWorkingDoctorsApi(storeId: number, dates: string[]) {
+  return requestClient.get<any>(`${prefix}working-doctors`, {
+    params: { store_id: storeId, dates },
+  });
+}
+
+/** 矩阵总览中的一格（某医生某天） */
+export interface MatrixCell {
+  date: string;
+  /** 来源：day=日排班覆盖 rule=默认规则 default=未配置（每天全天） */
+  source: 'day' | 'default' | 'rule';
+  is_work: boolean;
+  is_rest: boolean;
+  slots: ScheduleSlot[];
+  slot_names: string[];
+  total: number;
+  used: number;
+}
+
+/** 矩阵总览日期轴项 */
+export interface MatrixDate {
+  date: string;
+  date_ts: number;
+  day: number;
+  week_text: string;
+  is_today: boolean;
+  is_past: boolean;
+}
+
+/** 矩阵总览医生行 */
+export interface MatrixDoctor {
+  id: number;
+  name: string;
+  avatar: string;
+  cells: MatrixCell[];
+}
+
+/** 门店排班矩阵总览（医生×日期，默认一周 7 列） */
+export async function getStoreMatrixApi(storeId: number, start: string, days = 7) {
+  return requestClient.get<any>(`${prefix}store-matrix`, {
+    params: { store_id: storeId, start, days },
+  });
+}
+
+/** 班次模板列表（店级，含禁用项） */
+export async function getShiftTemplateListApi(storeId?: number) {
+  return requestClient.get<any>(`${prefix}template-list`, {
+    params: storeId ? { store_id: storeId } : {},
+  });
+}
+
+/** 保存班次模板（id=0 新增） */
+export async function saveShiftTemplateApi(data: Record<string, any>) {
+  return requestClient.post<any>(`${prefix}save-template`, data);
+}
+
+/** 删除班次模板（软删，日排班行是时段快照不受影响） */
+export async function deleteShiftTemplateApi(id: number, storeId?: number) {
+  return requestClient.post<any>(`${prefix}delete-template`, {
+    id,
+    ...(storeId ? { store_id: storeId } : {}),
+  });
+}
diff --git a/apps/web-antd/src/views/doctor/doctor/components/ScheduleDrawer.vue b/apps/web-antd/src/views/doctor/doctor/components/ScheduleDrawer.vue
new file mode 100644
index 00000000..366cabdb
--- /dev/null
+++ b/apps/web-antd/src/views/doctor/doctor/components/ScheduleDrawer.vue
@@ -0,0 +1,410 @@
+<script lang="ts" setup>
+/**
+ * 医生排班设置抽屉
+ * 配置项：出诊模式（每天/按星期多选）、时段类型（全天/上下午/自定义时段增删）、
+ * 各时段号源数、可预约天数（0=跟随门店统一设置）、排班状态（停诊开关）
+ * 为什么自绘控件而不用 useVbenForm：时段是动态数组（自定义模式可增删行），
+ * vben form schema 不适配动态列表编辑，参照 workbench-widget.vue 自绘先例
+ */
+import type { ScheduleSlot } from '../api/schedule';
+
+import { computed, ref } from 'vue';
+
+import { useVbenDrawer } from '@vben/common-ui';
+import { IconifyIcon as VbenIcon } from '@vben/icons';
+
+import {
+  Button,
+  Checkbox,
+  InputNumber,
+  message,
+  Radio,
+  Switch,
+  TimePicker,
+} from 'ant-design-vue';
+import dayjs from 'dayjs';
+
+import { getDoctorScheduleApi, saveDoctorScheduleApi } from '../api/schedule';
+
+/** 星期选项（值与后端 1-7 对齐，周一=1） */
+const WEEK_OPTIONS = [
+  { label: '周一', value: 1 },
+  { label: '周二', value: 2 },
+  { label: '周三', value: 3 },
+  { label: '周四', value: 4 },
+  { label: '周五', value: 5 },
+  { label: '周六', value: 6 },
+  { label: '周日', value: 7 },
+];
+
+const record = ref<any>({});
+/** 出诊模式：1每天 2按星期 */
+const scheduleMode = ref<number>(1);
+/** 按星期出诊日 */
+const weekDays = ref<number[]>([]);
+/** 时段类型：1全天 2上下午 3自定义 */
+const slotType = ref<number>(1);
+/** 时段列表（随 slotType 切换重建） */
+const slots = ref<ScheduleSlot[]>([]);
+/** 可预约天数（0=跟随门店统一） */
+const bookDays = ref<number>(0);
+/** 门店统一天数（提示用） */
+const storeDefaultDays = ref<number>(7);
+/** 排班状态：true=正常放号 false=停诊 */
+const enabled = ref<boolean>(true);
+
+const drawerTitle = computed(() => {
+  const name = record.value?.name || record.value?.service_user?.name || '';
+  return name ? `排班设置 - ${name}` : '排班设置';
+});
+
+/** 医生 su_id（排班按医生维度，跨门店共享） */
+const doctorSuId = computed(() =>
+  Number(record.value?.su_id || record.value?.service_user?.id || 0),
+);
+
+/**
+ * 按时段类型生成默认时段（切换类型时调用）
+ */
+function buildDefaultSlots(type: number): ScheduleSlot[] {
+  if (type === 1) {
+    return [
+      { slot_name: '全天', start_time: '00:00', end_time: '23:59', capacity: 30 },
+    ];
+  }
+  if (type === 2) {
+    return [
+      { slot_name: '上午', start_time: '08:00', end_time: '12:00', capacity: 15 },
+      { slot_name: '下午', start_time: '13:00', end_time: '18:00', capacity: 15 },
+    ];
+  }
+  return [
+    { slot_name: '', start_time: '09:00', end_time: '10:00', capacity: 5 },
+  ];
+}
+
+/**
+ * 切换时段类型：保留全天容量总数体验，直接按类型重建时段行
+ */
+function onSlotTypeChange(type: number) {
+  slotType.value = type;
+  slots.value = buildDefaultSlots(type);
+}
+
+/** 自定义模式增加时段行（上限 10 个） */
+function addSlot() {
+  if (slots.value.length >= 10) {
+    message.warning('最多支持 10 个时段');
+    return;
+  }
+  slots.value.push({
+    slot_name: '',
+    start_time: '',
+    end_time: '',
+    capacity: 5,
+  });
+}
+
+/** 自定义模式删除时段行 */
+function removeSlot(index: number) {
+  if (slots.value.length <= 1) {
+    message.warning('至少保留一个时段');
+    return;
+  }
+  slots.value.splice(index, 1);
+}
+
+/** TimePicker 变更（HH:mm 字符串双向） */
+function onTimeChange(slot: ScheduleSlot, key: 'end_time' | 'start_time', val: any) {
+  slot[key] = val ? dayjs(val, 'HH:mm').format('HH:mm') : '';
+}
+
+/**
+ * 拉取排班配置回显
+ */
+async function fetchData() {
+  if (!doctorSuId.value) {
+    message.error('医生信息缺失（su_id）');
+    return;
+  }
+  const data = await getDoctorScheduleApi(doctorSuId.value);
+  scheduleMode.value = Number(data?.schedule_mode || 1);
+  weekDays.value = Array.isArray(data?.week_days) ? data.week_days : [];
+  slotType.value = Number(data?.slot_type || 1);
+  bookDays.value = Number(data?.book_days || 0);
+  storeDefaultDays.value = Number(data?.store_default_book_days || 7);
+  enabled.value = Number(data?.status ?? 1) === 1;
+  const list = Array.isArray(data?.slots) ? data.slots : [];
+  slots.value =
+    list.length > 0
+      ? list.map((item: any) => ({
+          id: Number(item.id || 0),
+          slot_name: String(item.slot_name || ''),
+          start_time: String(item.start_time || ''),
+          end_time: String(item.end_time || ''),
+          capacity: Number(item.capacity || 0),
+        }))
+      : buildDefaultSlots(slotType.value);
+}
+
+/**
+ * 前端轻校验后提交（重叠/格式等强校验在服务端兜底）
+ */
+async function handleSave() {
+  if (scheduleMode.value === 2 && weekDays.value.length === 0) {
+    message.warning('按星期出诊时请至少选择一个出诊日');
+    return;
+  }
+  for (const slot of slots.value) {
+    if (slotType.value !== 1 && (!slot.start_time || !slot.end_time)) {
+      message.warning('请补全各时段的开始/结束时间');
+      return;
+    }
+    if (!slot.capacity || slot.capacity < 1) {
+      message.warning('各时段号源数量至少为 1');
+      return;
+    }
+  }
+  DrawerApi.lock();
+  try {
+    await saveDoctorScheduleApi({
+      doctor_id: doctorSuId.value,
+      schedule_mode: scheduleMode.value,
+      week_days: weekDays.value,
+      slot_type: slotType.value,
+      book_days: bookDays.value,
+      status: enabled.value ? 1 : 0,
+      slots: slots.value,
+    });
+    message.success('排班保存成功');
+    DrawerApi.close();
+  } catch {
+    // 错误提示由 requestClient 统一弹出
+  } finally {
+    DrawerApi.unlock();
+  }
+}
+
+const [Drawer, DrawerApi] = useVbenDrawer({
+  onOpenChange(isOpen) {
+    if (isOpen) {
+      record.value = DrawerApi.getData()?.record || {};
+      DrawerApi.setState({ loading: true });
+      fetchData()
+        .catch(() => message.error('获取排班配置失败'))
+        .finally(() => DrawerApi.setState({ loading: false }));
+    }
+  },
+  onConfirm: handleSave,
+});
+
+defineExpose({ DrawerApi });
+</script>
+
+<template>
+  <Drawer :title="drawerTitle" class="w-[520px]">
+    <div class="schedule-form">
+      <!-- 排班状态 -->
+      <div class="schedule-form__item">
+        <div class="schedule-form__label">排班状态</div>
+        <div class="schedule-form__control">
+          <Switch v-model:checked="enabled" />
+          <span class="schedule-form__tip">{{
+            enabled ? '正常放号' : '停诊（患者端不可预约）'
+          }}</span>
+        </div>
+      </div>
+
+      <!-- 出诊模式 -->
+      <div class="schedule-form__item">
+        <div class="schedule-form__label">出诊模式</div>
+        <div class="schedule-form__control">
+          <Radio.Group v-model:value="scheduleMode">
+            <Radio :value="1">每天出诊</Radio>
+            <Radio :value="2">按星期出诊</Radio>
+          </Radio.Group>
+        </div>
+      </div>
+
+      <!-- 按星期出诊日 -->
+      <div v-if="scheduleMode === 2" class="schedule-form__item">
+        <div class="schedule-form__label">出诊日</div>
+        <div class="schedule-form__control">
+          <Checkbox.Group v-model:value="weekDays" :options="WEEK_OPTIONS" />
+        </div>
+      </div>
+
+      <!-- 时段类型 -->
+      <div class="schedule-form__item">
+        <div class="schedule-form__label">时段类型</div>
+        <div class="schedule-form__control">
+          <Radio.Group
+            :value="slotType"
+            @update:value="(val: any) => onSlotTypeChange(Number(val))"
+          >
+            <Radio :value="1">全天</Radio>
+            <Radio :value="2">上下午</Radio>
+            <Radio :value="3">自定义时段</Radio>
+          </Radio.Group>
+        </div>
+      </div>
+
+      <!-- 时段列表 -->
+      <div class="schedule-form__item">
+        <div class="schedule-form__label">
+          号源时段
+          <Button
+            v-if="slotType === 3"
+            size="small"
+            type="link"
+            @click="addSlot"
+          >
+            <VbenIcon icon="lucide:plus" />
+            加时段
+          </Button>
+        </div>
+        <div class="schedule-form__slots">
+          <div v-for="(slot, index) in slots" :key="index" class="slot-row">
+            <span v-if="slotType !== 3" class="slot-row__name">
+              {{ slot.slot_name }}
+            </span>
+            <template v-if="slotType !== 1">
+              <TimePicker
+                :value="slot.start_time ? dayjs(slot.start_time, 'HH:mm') : null"
+                format="HH:mm"
+                placeholder="开始"
+                size="small"
+                @update:value="(val: any) => onTimeChange(slot, 'start_time', val)"
+              />
+              <span class="slot-row__sep">~</span>
+              <TimePicker
+                :value="slot.end_time ? dayjs(slot.end_time, 'HH:mm') : null"
+                format="HH:mm"
+                placeholder="结束"
+                size="small"
+                @update:value="(val: any) => onTimeChange(slot, 'end_time', val)"
+              />
+            </template>
+            <span v-else class="slot-row__name-full">00:00 ~ 23:59</span>
+            <InputNumber
+              v-model:value="slot.capacity"
+              :max="999"
+              :min="1"
+              size="small"
+              style="width: 90px"
+            />
+            <span class="slot-row__unit">个号</span>
+            <Button
+              v-if="slotType === 3"
+              danger
+              size="small"
+              type="text"
+              @click="removeSlot(index)"
+            >
+              <VbenIcon icon="lucide:x" />
+            </Button>
+          </div>
+        </div>
+        <div v-if="slotType === 3" class="schedule-form__tip">
+          自定义时段名称留空时自动使用时间段命名，时段之间不可重叠
+        </div>
+      </div>
+
+      <!-- 可预约天数 -->
+      <div class="schedule-form__item">
+        <div class="schedule-form__label">可预约天数（含当天）</div>
+        <div class="schedule-form__control">
+          <InputNumber v-model:value="bookDays" :max="30" :min="0" style="width: 120px" />
+          <span class="schedule-form__tip">
+            0 = 跟随门店统一设置（当前 {{ storeDefaultDays }} 天）
+          </span>
+        </div>
+      </div>
+
+      <!-- 日历排班指引：本抽屉配置的是默认规则，按日期排班走诊所管理入口 -->
+      <div class="schedule-form__notice">
+        此处为医生的<b>默认排班规则</b>。如需按具体日期排班（周排/月排、套班次模板、单日休诊），
+        请到「诊所药店管理 → 操作 → 排班管理」的日历排班中设置，按日期排班优先于默认规则生效。
+      </div>
+    </div>
+  </Drawer>
+</template>
+
+<style scoped>
+.schedule-form {
+  display: flex;
+  flex-direction: column;
+  gap: 18px;
+}
+
+.schedule-form__label {
+  display: flex;
+  gap: 4px;
+  align-items: center;
+  margin-bottom: 8px;
+  font-size: 13px;
+  font-weight: 600;
+  color: hsl(var(--foreground));
+}
+
+.schedule-form__control {
+  display: flex;
+  gap: 8px;
+  align-items: center;
+  flex-wrap: wrap;
+}
+
+.schedule-form__tip {
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+}
+
+.schedule-form__slots {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+
+.slot-row {
+  display: flex;
+  gap: 8px;
+  align-items: center;
+  padding: 8px 10px;
+  background: hsl(var(--muted) / 0.25);
+  border: 1px solid hsl(var(--border));
+  border-radius: 6px;
+}
+
+.slot-row__name {
+  min-width: 36px;
+  font-size: 13px;
+  color: hsl(var(--foreground));
+}
+
+.slot-row__name-full {
+  font-size: 13px;
+  color: hsl(var(--muted-foreground));
+}
+
+.slot-row__sep,
+.slot-row__unit {
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+}
+
+/* 日历排班指引：同色系边框 + 微光，不用左侧色条 */
+.schedule-form__notice {
+  padding: 10px 12px;
+  font-size: 12px;
+  line-height: 1.7;
+  color: hsl(var(--muted-foreground));
+  background: hsl(var(--primary) / 0.04);
+  border: 1px solid hsl(var(--primary) / 30%);
+  border-radius: 8px;
+  box-shadow: 0 0 6px hsl(var(--primary) / 18%);
+}
+
+.schedule-form__notice b {
+  color: hsl(var(--foreground));
+}
+</style>
diff --git a/apps/web-antd/src/views/doctor/doctor/components/StoreSettingModal.vue b/apps/web-antd/src/views/doctor/doctor/components/StoreSettingModal.vue
new file mode 100644
index 00000000..c5d7ca8f
--- /dev/null
+++ b/apps/web-antd/src/views/doctor/doctor/components/StoreSettingModal.vue
@@ -0,0 +1,152 @@
+<script lang="ts" setup>
+/**
+ * 门店挂号统一设置弹窗：默认可预约天数（医生排班「跟随门店」时生效）
+ * 诊所管理员固定本店（后端强制）；平台管理员需先选门店再配置
+ */
+import { computed, ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+import { useUserStore } from '@vben/stores';
+
+import { InputNumber, message } from 'ant-design-vue';
+
+import StorePicker from '#/components/form/components/store-picker.vue';
+
+import {
+  getStoreRegisterSettingApi,
+  saveStoreRegisterSettingApi,
+} from '../api/schedule';
+
+const userStore = useUserStore();
+/** 平台管理员（user_type=2）需要选门店；诊所管理员后端固定本店 */
+const isPlatform = computed(
+  () => Number(userStore.userInfo?.roles?.user_type) === 2,
+);
+
+const storeId = ref<number | undefined>(undefined);
+const defaultBookDays = ref<number>(7);
+const loaded = ref(false);
+
+/**
+ * 拉取指定门店（或本店）的统一设置
+ */
+async function fetchSetting() {
+  loaded.value = false;
+  try {
+    const data = await getStoreRegisterSettingApi(storeId.value || undefined);
+    defaultBookDays.value = Number(data?.default_book_days || 7);
+    // 诊所管理员回显后端解析出的本店 id，避免再传 0
+    if (!isPlatform.value && data?.store_id) {
+      storeId.value = Number(data.store_id);
+    }
+    loaded.value = true;
+  } catch {
+    message.error('获取门店统一设置失败');
+  }
+}
+
+/** 平台管理员切换门店后重新拉取 */
+function onStoreChange(val: number | undefined) {
+  storeId.value = val;
+  if (val) fetchSetting();
+}
+
+/**
+ * 保存统一可预约天数
+ */
+async function handleSave() {
+  if (isPlatform.value && !storeId.value) {
+    message.warning('请先选择门店');
+    return;
+  }
+  if (!defaultBookDays.value || defaultBookDays.value < 1) {
+    message.warning('可预约天数至少为 1 天');
+    return;
+  }
+  ModalApi.lock();
+  try {
+    await saveStoreRegisterSettingApi({
+      store_id: storeId.value || 0,
+      default_book_days: defaultBookDays.value,
+    });
+    message.success('设置保存成功');
+    ModalApi.close();
+  } catch {
+    // 错误提示由 requestClient 统一弹出
+  } finally {
+    ModalApi.unlock();
+  }
+}
+
+const [Modal, ModalApi] = useVbenModal({
+  onOpenChange(isOpen) {
+    if (isOpen) {
+      storeId.value = undefined;
+      defaultBookDays.value = 7;
+      // 诊所管理员直接拉本店；平台管理员等选店后拉取
+      if (isPlatform.value) {
+        loaded.value = false;
+      } else {
+        fetchSetting();
+      }
+    }
+  },
+  onConfirm: handleSave,
+});
+
+defineExpose({ ModalApi });
+</script>
+
+<template>
+  <Modal class="w-[440px]" title="排班统一设置">
+    <div class="store-setting">
+      <div v-if="isPlatform" class="store-setting__item">
+        <div class="store-setting__label">选择门店</div>
+        <StorePicker :value="storeId" @update:value="onStoreChange" />
+      </div>
+      <div class="store-setting__item">
+        <div class="store-setting__label">默认可预约天数（含当天）</div>
+        <div class="store-setting__control">
+          <InputNumber
+            v-model:value="defaultBookDays"
+            :disabled="isPlatform && !loaded"
+            :max="30"
+            :min="1"
+            style="width: 120px"
+          />
+          <span class="store-setting__tip">
+            医生排班「可预约天数」为 0（跟随门店）时使用本值，默认 7 天
+          </span>
+        </div>
+      </div>
+    </div>
+  </Modal>
+</template>
+
+<style scoped>
+.store-setting {
+  display: flex;
+  flex-direction: column;
+  gap: 16px;
+  padding: 4px 2px;
+}
+
+.store-setting__label {
+  margin-bottom: 8px;
+  font-size: 13px;
+  font-weight: 600;
+  color: hsl(var(--foreground));
+}
+
+.store-setting__control {
+  display: flex;
+  gap: 8px;
+  align-items: center;
+  flex-wrap: wrap;
+}
+
+.store-setting__tip {
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+}
+</style>
diff --git a/apps/web-antd/src/views/doctor/doctor/components/schedule-calendar/AddDoctorScheduleModal.vue b/apps/web-antd/src/views/doctor/doctor/components/schedule-calendar/AddDoctorScheduleModal.vue
new file mode 100644
index 00000000..9346ad4b
--- /dev/null
+++ b/apps/web-antd/src/views/doctor/doctor/components/schedule-calendar/AddDoctorScheduleModal.vue
@@ -0,0 +1,520 @@
+<script lang="ts" setup>
+/**
+ * 添加医生排班弹窗（右键菜单快捷入口）
+ * 流程：右键日历日期 →「添加医生排班…」→ 本弹窗选医生（头像标签多选）→
+ * 选排班方式（套用班次模板 / 自定义时段）→ 提交 save-days 批量下发。
+ * 与底部操作条的区别：操作条依赖右栏批量集合，这里是一次性向导式选择，
+ * 适合「临时给某几天加几位医生的班」的快捷场景，不污染批量集合状态。
+ * 医生专属模板：勾选「优先按医生专属模板」时，有专属模板的医生按自己的
+ * 时段/号源写入（医生标签带「专」标），无专属的回落所选通用模板兜底。
+ */
+import type { ScheduleSlot, ShiftTemplate } from '../../api/schedule';
+
+import { computed, ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+
+import { Avatar, Button, Empty, message, Segmented, Switch } from 'ant-design-vue';
+import dayjs from 'dayjs';
+
+import { Icon } from '#/components/icon';
+
+import { saveScheduleDaysApi } from '../../api/schedule';
+import SlotRowsEditor from './SlotRowsEditor.vue';
+
+const emit = defineEmits<{ saved: [] }>();
+
+/** 打开时由父组件 setData 传入的上下文 */
+const storeId = ref(0);
+const dates = ref<string[]>([]);
+const doctors = ref<Array<{ avatar?: string; id: number; name: string }>>([]);
+const templates = ref<ShiftTemplate[]>([]);
+
+/** 已勾选医生集合 */
+const selectedDoctorIds = ref<number[]>([]);
+/** 排班方式：template=套用模板 custom=自定义时段 */
+const mode = ref<'custom' | 'template'>('template');
+/** 套用模板模式下选中的通用模板（优先专属时作为无专属医生的兜底，可不选） */
+const pickedTemplateId = ref<number | undefined>();
+/** 自定义时段模式的时段集合 */
+const customSlots = ref<ScheduleSlot[]>([]);
+/** 优先按医生专属模板写入（仅套用模板模式生效） */
+const preferPersonal = ref(true);
+
+/** 店级通用模板（模板卡片列表数据源；专属模板不能被套给任意医生，不进列表） */
+const generalTemplates = computed(() =>
+  templates.value.filter((t) => Number(t.doctor_id || 0) === 0),
+);
+
+/** 医生ID → 专属模板（判断「专」标与提交校验用） */
+const personalTemplateMap = computed(() => {
+  const map = new Map<number, ShiftTemplate>();
+  for (const t of templates.value) {
+    const did = Number(t.doctor_id || 0);
+    if (did > 0) map.set(did, t);
+  }
+  return map;
+});
+
+/** 已选医生中有专属模板的人数（提示文案用） */
+const selectedPersonalCount = computed(
+  () => selectedDoctorIds.value.filter((id) => personalTemplateMap.value.has(id)).length,
+);
+
+/** 已选医生中无专属模板的人数（优先专属时这些人需要通用兜底） */
+const selectedWithoutPersonalCount = computed(
+  () => selectedDoctorIds.value.length - selectedPersonalCount.value,
+);
+
+/** 日期 chips：最多铺 8 个，其余折叠成 +N（右键选区最多 62 天，全铺会撑爆头部） */
+const DATE_SHOW_LIMIT = 8;
+const visibleDates = computed(() => dates.value.slice(0, DATE_SHOW_LIMIT));
+const hiddenDateCount = computed(() => Math.max(0, dates.value.length - DATE_SHOW_LIMIT));
+
+/** 单击医生标签：切换勾选 */
+function toggleDoctor(id: number) {
+  const idx = selectedDoctorIds.value.indexOf(id);
+  if (idx === -1) {
+    selectedDoctorIds.value.push(id);
+  } else {
+    selectedDoctorIds.value.splice(idx, 1);
+  }
+}
+
+/** 全选/清空医生 */
+function selectAll() {
+  selectedDoctorIds.value = doctors.value.map((d) => d.id);
+}
+function clearAll() {
+  selectedDoctorIds.value = [];
+}
+
+/** 模板时段摘要（如「上午20 / 下午15」） */
+function templateSummary(tpl: ShiftTemplate): string {
+  return (tpl.slots || [])
+    .map((s) => `${s.slot_name || `${s.start_time}-${s.end_time}`}${s.capacity}`)
+    .join(' / ');
+}
+
+/** 医生「专」标悬浮说明（专属模板名 + 时段摘要） */
+function personalTitle(docId: number): string {
+  const tpl = personalTemplateMap.value.get(docId);
+  return tpl ? `专属模板：${tpl.name}（${templateSummary(tpl)}）` : '';
+}
+
+/** 提交：轻校验后调 save-days（强校验含已约保护在服务端，冲突会点名医生+日期） */
+async function handleSubmit() {
+  if (selectedDoctorIds.value.length === 0) {
+    message.warning('请至少选择一位医生');
+    return;
+  }
+  const extra: Record<string, any> = {};
+  if (mode.value === 'template') {
+    if (preferPersonal.value) {
+      // 优先专属：没有专属模板的医生必须有通用兜底，否则后端会点名拒绝
+      if (selectedWithoutPersonalCount.value > 0 && !pickedTemplateId.value) {
+        message.warning(
+          `有 ${selectedWithoutPersonalCount.value} 位已选医生没有专属模板，请选择一个通用班次模板兜底`,
+        );
+        return;
+      }
+      extra.prefer_doctor_template = 1;
+      extra.template_id = pickedTemplateId.value || 0;
+    } else {
+      if (!pickedTemplateId.value) {
+        message.warning('请选择一个班次模板');
+        return;
+      }
+      extra.template_id = pickedTemplateId.value;
+    }
+  } else {
+    if (customSlots.value.length === 0) {
+      message.warning('请至少添加一个时段');
+      return;
+    }
+    for (const slot of customSlots.value) {
+      if (!slot.start_time || !slot.end_time) {
+        message.warning('请补全各时段的开始/结束时间');
+        return;
+      }
+      if (!slot.capacity || slot.capacity < 1) {
+        message.warning('各时段号源数量至少为 1');
+        return;
+      }
+    }
+    extra.slots = customSlots.value;
+  }
+  ModalApi.lock();
+  try {
+    await saveScheduleDaysApi({
+      doctor_ids: selectedDoctorIds.value,
+      store_id: storeId.value,
+      dates: dates.value,
+      action: mode.value === 'template' ? 'apply_template' : 'custom',
+      ...extra,
+    });
+    message.success(
+      `已为 ${selectedDoctorIds.value.length} 位医生排好 ${dates.value.length} 天的班`,
+    );
+    emit('saved');
+    ModalApi.close();
+  } catch {
+    // 错误提示由 requestClient 统一弹出（如已约保护拦截）
+  } finally {
+    ModalApi.unlock();
+  }
+}
+
+const [Modal, ModalApi] = useVbenModal({
+  class: 'w-[92%] md:w-[640px]',
+  confirmText: '保存排班',
+  onConfirm: handleSubmit,
+  onOpenChange(isOpen) {
+    if (!isOpen) return;
+    const data = ModalApi.getData() || {};
+    storeId.value = Number(data.storeId || 0);
+    dates.value = Array.isArray(data.dates) ? [...data.dates].sort() : [];
+    doctors.value = Array.isArray(data.doctors) ? data.doctors : [];
+    templates.value = Array.isArray(data.templates) ? data.templates : [];
+    // 每次打开重置选择：向导式一次性操作，不继承上次状态
+    selectedDoctorIds.value = [];
+    mode.value = 'template';
+    preferPersonal.value = true;
+    pickedTemplateId.value =
+      generalTemplates.value.length === 1 ? generalTemplates.value[0]!.id : undefined;
+    if (customSlots.value.length === 0) {
+      customSlots.value = [
+        { slot_name: '', start_time: '08:00', end_time: '12:00', capacity: 10 },
+      ];
+    }
+  },
+});
+
+defineExpose({ ModalApi });
+</script>
+
+<template>
+  <Modal title="添加医生排班">
+    <div class="adddoc">
+      <!-- 目标日期 -->
+      <div class="adddoc__section">
+        <div class="adddoc__label">目标日期（{{ dates.length }} 天）</div>
+        <div class="adddoc__dates">
+          <span v-for="d in visibleDates" :key="d" class="adddoc__date-chip">
+            {{ dayjs(d).format('M月D日') }}
+          </span>
+          <span v-if="hiddenDateCount > 0" class="adddoc__date-chip adddoc__date-chip--more">
+            +{{ hiddenDateCount }}
+          </span>
+        </div>
+      </div>
+
+      <!-- 选医生：头像 + 姓名标签网格多选 -->
+      <div class="adddoc__section">
+        <div class="adddoc__label-row">
+          <span class="adddoc__label">选择医生（已选 {{ selectedDoctorIds.length }} 人）</span>
+          <span class="adddoc__label-tools">
+            <Button size="small" type="link" @click="selectAll">全选</Button>
+            <Button
+              :disabled="selectedDoctorIds.length === 0"
+              size="small"
+              type="link"
+              @click="clearAll"
+            >
+              清空
+            </Button>
+          </span>
+        </div>
+        <div class="adddoc__doctors">
+          <button
+            v-for="doc in doctors"
+            :key="doc.id"
+            class="adddoc__doc"
+            :class="{ 'adddoc__doc--active': selectedDoctorIds.includes(doc.id) }"
+            type="button"
+            @click="toggleDoctor(doc.id)"
+          >
+            <Avatar :size="22" :src="doc.avatar || undefined" class="adddoc__doc-avatar">
+              {{ doc.name.slice(0, 1) }}
+            </Avatar>
+            <span class="adddoc__doc-name">{{ doc.name }}</span>
+            <!-- 「专」标：该医生有专属模板，优先专属时按其自己的时段/号源写入 -->
+            <span
+              v-if="personalTemplateMap.has(doc.id)"
+              class="adddoc__doc-personal"
+              :title="personalTitle(doc.id)"
+            >
+              专
+            </span>
+            <Icon
+              v-if="selectedDoctorIds.includes(doc.id)"
+              class="adddoc__doc-check"
+              icon="lucide:check"
+            />
+          </button>
+          <Empty
+            v-if="doctors.length === 0"
+            :image-style="{ height: '48px' }"
+            description="该门店暂无医生"
+          />
+        </div>
+      </div>
+
+      <!-- 选排班方式 -->
+      <div class="adddoc__section">
+        <div class="adddoc__label">排班方式</div>
+        <Segmented
+          v-model:value="mode"
+          :options="[
+            { label: '套用班次模板', value: 'template' },
+            { label: '自定义时段', value: 'custom' },
+          ]"
+        />
+        <!-- 模板模式：优先专属开关 + 通用模板单选卡片（专属模板不进列表，自动按医生生效） -->
+        <div v-if="mode === 'template'" class="adddoc__templates">
+          <div class="adddoc__personal-row">
+            <Switch v-model:checked="preferPersonal" size="small" />
+            <span class="adddoc__personal-label">优先按医生专属模板写入</span>
+            <span v-if="preferPersonal && selectedDoctorIds.length > 0" class="adddoc__personal-hint">
+              已选 {{ selectedPersonalCount }} 人有专属模板{{
+                selectedWithoutPersonalCount > 0
+                  ? `，${selectedWithoutPersonalCount} 人将使用下方通用模板`
+                  : '，无需选通用模板'
+              }}
+            </span>
+          </div>
+          <button
+            v-for="tpl in generalTemplates"
+            :key="tpl.id"
+            class="adddoc__tpl"
+            :class="{ 'adddoc__tpl--active': pickedTemplateId === tpl.id }"
+            type="button"
+            @click="pickedTemplateId = pickedTemplateId === tpl.id ? undefined : tpl.id"
+          >
+            <span class="adddoc__tpl-name">{{ tpl.name }}</span>
+            <span class="adddoc__tpl-summary">{{ templateSummary(tpl) }}</span>
+            <Icon
+              v-if="pickedTemplateId === tpl.id"
+              class="adddoc__tpl-check"
+              icon="lucide:check-circle-2"
+            />
+          </button>
+          <Empty
+            v-if="generalTemplates.length === 0"
+            :image-style="{ height: '48px' }"
+            description="暂无启用中的通用班次模板，可切换为自定义时段"
+          />
+        </div>
+        <!-- 自定义时段编辑器 -->
+        <div v-else class="adddoc__custom">
+          <SlotRowsEditor v-model="customSlots" />
+        </div>
+      </div>
+    </div>
+  </Modal>
+</template>
+
+<style scoped>
+.adddoc {
+  display: flex;
+  flex-direction: column;
+  gap: 14px;
+}
+
+.adddoc__section {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+
+.adddoc__label {
+  font-size: 13px;
+  font-weight: 600;
+  color: hsl(var(--foreground));
+}
+
+.adddoc__label-row {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+
+.adddoc__label-tools {
+  display: inline-flex;
+  gap: 2px;
+}
+
+.adddoc__dates {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 6px;
+}
+
+.adddoc__date-chip {
+  padding: 1px 8px;
+  font-size: 12px;
+  color: hsl(var(--primary));
+  background: hsl(var(--primary) / 0.1);
+  border-radius: 6px;
+}
+
+.adddoc__date-chip--more {
+  color: hsl(var(--muted-foreground));
+  background: hsl(var(--muted) / 0.4);
+}
+
+/* 医生标签网格：自适应列宽，限高滚动防医生多时弹窗过长 */
+.adddoc__doctors {
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(min(150px, 100%), 1fr));
+  gap: 6px;
+  max-height: 200px;
+  padding: 2px;
+  overflow-y: auto;
+}
+
+.adddoc__doc {
+  display: flex;
+  gap: 6px;
+  align-items: center;
+  min-width: 0;
+  padding: 5px 8px;
+  text-align: left;
+  cursor: pointer;
+  user-select: none;
+  background: hsl(var(--muted) / 0.2);
+  border: 1px solid hsl(var(--border) / 0.7);
+  border-radius: 10px;
+  transition: border-color 0.15s, background 0.15s, box-shadow 0.15s;
+}
+
+.adddoc__doc:hover {
+  background: hsl(var(--primary) / 0.06);
+  border-color: hsl(var(--primary) / 0.35);
+}
+
+/* 选中态：1px 主色边框 + 微光 */
+.adddoc__doc--active {
+  background: hsl(var(--primary) / 0.1);
+  border-color: hsl(var(--primary) / 0.45);
+  box-shadow: 0 0 6px hsl(var(--primary) / 18%);
+}
+
+.adddoc__doc-avatar {
+  flex-shrink: 0;
+  font-size: 12px;
+  background: hsl(var(--primary) / 0.2);
+}
+
+.adddoc__doc-name {
+  flex: 1;
+  overflow: hidden;
+  font-size: 13px;
+  color: hsl(var(--foreground));
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.adddoc__doc--active .adddoc__doc-name {
+  font-weight: 600;
+  color: hsl(var(--primary));
+}
+
+.adddoc__doc-check {
+  flex-shrink: 0;
+  font-size: 14px;
+  color: hsl(var(--primary));
+}
+
+/* 「专」标：医生有专属模板的小徽标 */
+.adddoc__doc-personal {
+  flex-shrink: 0;
+  padding: 0 4px;
+  font-size: 10px;
+  line-height: 16px;
+  color: hsl(var(--primary));
+  background: hsl(var(--primary) / 0.12);
+  border-radius: 4px;
+}
+
+/* 优先专属开关行 */
+.adddoc__personal-row {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 6px;
+  align-items: center;
+}
+
+.adddoc__personal-label {
+  font-size: 12px;
+  color: hsl(var(--foreground));
+}
+
+.adddoc__personal-hint {
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+}
+
+/* 模板单选卡片 */
+.adddoc__templates {
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+  max-height: 190px;
+  padding: 2px;
+  overflow-y: auto;
+}
+
+.adddoc__tpl {
+  display: flex;
+  gap: 8px;
+  align-items: center;
+  padding: 8px 10px;
+  text-align: left;
+  cursor: pointer;
+  background: hsl(var(--muted) / 0.15);
+  border: 1px solid hsl(var(--border) / 0.7);
+  border-radius: 10px;
+  transition: border-color 0.15s, background 0.15s, box-shadow 0.15s;
+}
+
+.adddoc__tpl:hover {
+  border-color: hsl(var(--primary) / 0.35);
+}
+
+.adddoc__tpl--active {
+  background: hsl(var(--primary) / 0.08);
+  border-color: hsl(var(--primary) / 0.45);
+  box-shadow: 0 0 6px hsl(var(--primary) / 18%);
+}
+
+.adddoc__tpl-name {
+  flex-shrink: 0;
+  font-size: 13px;
+  font-weight: 600;
+  color: hsl(var(--foreground));
+}
+
+.adddoc__tpl--active .adddoc__tpl-name {
+  color: hsl(var(--primary));
+}
+
+.adddoc__tpl-summary {
+  flex: 1;
+  overflow: hidden;
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.adddoc__tpl-check {
+  flex-shrink: 0;
+  font-size: 15px;
+  color: hsl(var(--primary));
+}
+
+.adddoc__custom {
+  padding-top: 2px;
+}
+</style>
diff --git a/apps/web-antd/src/views/doctor/doctor/components/schedule-calendar/ScheduleCalendarModal.vue b/apps/web-antd/src/views/doctor/doctor/components/schedule-calendar/ScheduleCalendarModal.vue
new file mode 100644
index 00000000..849aa0eb
--- /dev/null
+++ b/apps/web-antd/src/views/doctor/doctor/components/schedule-calendar/ScheduleCalendarModal.vue
@@ -0,0 +1,93 @@
+<script lang="ts" setup>
+/**
+ * 排班管理弹窗（薄壳）
+ * 仅负责弹窗与传参，核心面板逻辑在 SchedulePanel（同时被诊所设置页 tab 复用）。
+ * 入口：诊所管理行操作「排班管理」（全店视角）/ 医生管理行操作「排班日历」（锁定医生）。
+ * 锁定医生且关联多店时（平台管理员视角）顶部提供门店切换，切店后面板自动重载。
+ */
+import { ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+
+import { Select } from 'ant-design-vue';
+
+import SchedulePanel from './SchedulePanel.vue';
+
+/** 弹窗传参（setData 注入） */
+const storeId = ref<number>(0);
+const storeName = ref<string>('');
+const lockedDoctorId = ref<number>(0);
+const lockedDoctorName = ref<string>('');
+/** 锁定医生关联的门店列表（多店时展示切换下拉） */
+const storeOptions = ref<Array<{ id: number; name: string }>>([]);
+/** 面板重建 key：同店重复打开时也强制重新初始化（防止上次的选择/视图残留） */
+const panelKey = ref<number>(0);
+
+/** 切换门店：同步门店名（Panel 内部 watch storeId 自动整体重载） */
+function onStoreChange(val: any) {
+  const hit = storeOptions.value.find((s) => s.id === Number(val));
+  storeName.value = hit?.name || '';
+}
+
+const [Modal, ModalApi] = useVbenModal({
+  footer: false,
+  fullscreenButton: true,
+  class: 'w-[1080px]',
+  onOpenChange(isOpen) {
+    if (isOpen) {
+      const data = ModalApi.getData() || {};
+      storeId.value = Number(data.storeId || 0);
+      storeName.value = String(data.storeName || '');
+      lockedDoctorId.value = Number(data.lockedDoctorId || 0);
+      lockedDoctorName.value = String(data.lockedDoctorName || '');
+      storeOptions.value = Array.isArray(data.storeOptions) ? data.storeOptions : [];
+      // 未显式传店但有门店列表时默认第一个（医生管理入口场景）
+      if (!storeId.value && storeOptions.value.length > 0) {
+        storeId.value = storeOptions.value[0]!.id;
+        storeName.value = storeOptions.value[0]!.name;
+      }
+      panelKey.value = Date.now();
+    }
+  },
+});
+
+defineExpose({ ModalApi });
+</script>
+
+<template>
+  <Modal :title="storeName ? `排班管理 - ${storeName}` : '排班管理'">
+    <!-- 锁定医生关联多店：顶部门店切换（模板按店隔离，排班行记录来源门店） -->
+    <div v-if="storeOptions.length > 1" class="sched-shell__store">
+      <span class="sched-shell__store-label">所在门店：</span>
+      <Select
+        v-model:value="storeId"
+        :field-names="{ label: 'name', value: 'id' }"
+        :options="storeOptions"
+        style="width: 220px"
+        @change="onStoreChange"
+      />
+    </div>
+    <SchedulePanel
+      v-if="storeId > 0"
+      :key="panelKey"
+      :locked-doctor-id="lockedDoctorId"
+      :locked-doctor-name="lockedDoctorName"
+      :store-id="storeId"
+      :store-name="storeName"
+    />
+  </Modal>
+</template>
+
+<style scoped>
+.sched-shell__store {
+  display: flex;
+  gap: 6px;
+  align-items: center;
+  margin-bottom: 10px;
+}
+
+.sched-shell__store-label {
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+}
+</style>
diff --git a/apps/web-antd/src/views/doctor/doctor/components/schedule-calendar/ScheduleContextMenu.vue b/apps/web-antd/src/views/doctor/doctor/components/schedule-calendar/ScheduleContextMenu.vue
new file mode 100644
index 00000000..6f34bc55
--- /dev/null
+++ b/apps/web-antd/src/views/doctor/doctor/components/schedule-calendar/ScheduleContextMenu.vue
@@ -0,0 +1,284 @@
+<script lang="ts" setup>
+/**
+ * 排班格子右键快捷菜单（月历视图 / 矩阵总览共用）
+ * 参照工作台日历 CalendarPanel 的右键菜单模式：Teleport body + fixed 定位 +
+ * 贴边收缩 + 点击/滚动关闭 + 毛玻璃样式；菜单项按排班动作定制。
+ * 组件只负责「展示与发出动作」，动作落地（调 save-days）由父组件完成，
+ * 这样月历（单医生多日期）与矩阵（多医生多日期）可以共用同一菜单。
+ */
+import type { ShiftTemplate } from '../../api/schedule';
+
+import { onMounted, onUnmounted, reactive, ref } from 'vue';
+
+import { Icon } from '#/components/icon';
+
+const props = defineProps<{
+  /** 剪贴板是否有可粘贴的排班（父组件内存快照） */
+  canPaste: boolean;
+  /** 粘贴项摘要（如「上午 20号 / 下午 15号」），提示粘贴内容 */
+  pasteSummary: string;
+  /** 启用中的班次模板（内联子列表数据源） */
+  templates: ShiftTemplate[];
+}>();
+
+const emit = defineEmits<{
+  /** 动作统一出口：父组件根据当前选区执行 */
+  action: [
+    type: 'add_doctors' | 'apply_template' | 'clear' | 'copy' | 'custom' | 'paste' | 'rest',
+    payload?: { templateId?: number },
+  ];
+}>();
+
+/** 菜单状态：位置 + 标题 + 右键格子是否可复制 */
+const state = reactive({
+  visible: false,
+  x: 0,
+  y: 0,
+  /** 标题文本（如「8月19日 · 已选 3 天」），由打开方组装 */
+  title: '',
+  /** 右键目标格子是否有可复制的时段（休诊/不出诊格禁用复制） */
+  copyEnabled: false,
+  /** 是否显示「添加医生排班」（月历视图才有意义；矩阵格已含医生维度、锁定医生入口无选人场景） */
+  addDoctorsEnabled: false,
+});
+
+/** 「套用班次模板」内联子列表展开态（每次打开菜单重置收起） */
+const templatesOpen = ref(false);
+
+/**
+ * 打开右键菜单：贴边时向内收缩，避免菜单溢出视口
+ * 估算高度 330（含模板子列表收起态），宽 210
+ */
+function open(
+  e: MouseEvent,
+  meta: { addDoctorsEnabled?: boolean; copyEnabled: boolean; title: string },
+) {
+  state.title = meta.title;
+  state.copyEnabled = meta.copyEnabled;
+  state.addDoctorsEnabled = Boolean(meta.addDoctorsEnabled);
+  // 贴边收缩 + 下限保护：小视口时也不让菜单跑出屏幕左上角
+  state.x = Math.max(8, Math.min(e.clientX, window.innerWidth - 220));
+  state.y = Math.max(8, Math.min(e.clientY, window.innerHeight - 340));
+  templatesOpen.value = false;
+  state.visible = true;
+}
+
+function close() {
+  state.visible = false;
+}
+
+/** 发出动作并关闭菜单 */
+function fire(
+  type: 'add_doctors' | 'apply_template' | 'clear' | 'copy' | 'custom' | 'paste' | 'rest',
+  payload?: { templateId?: number },
+) {
+  emit('action', type, payload);
+  close();
+}
+
+/** 点击任意处 / 滚动时关闭（capture 阶段监听滚动，覆盖弹窗内部滚动容器） */
+onMounted(() => {
+  window.addEventListener('click', close);
+  window.addEventListener('scroll', close, true);
+  window.addEventListener('resize', close);
+});
+onUnmounted(() => {
+  window.removeEventListener('click', close);
+  window.removeEventListener('scroll', close, true);
+  window.removeEventListener('resize', close);
+});
+
+defineExpose({ open, close });
+</script>
+
+<template>
+  <Teleport to="body">
+    <div
+      v-if="state.visible"
+      class="sched-ctx"
+      :style="{ left: `${state.x}px`, top: `${state.y}px` }"
+      @click.stop
+      @contextmenu.prevent
+    >
+      <div class="sched-ctx__title">{{ state.title }}</div>
+      <!-- 套用班次模板：点击内联展开模板子列表（避免自实现 hover 子菜单的复杂度） -->
+      <div class="sched-ctx__item" @click="templatesOpen = !templatesOpen">
+        <span class="sched-ctx__label">
+          <Icon icon="lucide:layers" />
+          套用班次模板
+        </span>
+        <Icon :icon="templatesOpen ? 'lucide:chevron-down' : 'lucide:chevron-right'" />
+      </div>
+      <div v-if="templatesOpen" class="sched-ctx__sub">
+        <div
+          v-for="tpl in props.templates"
+          :key="tpl.id"
+          class="sched-ctx__item sched-ctx__item--sub"
+          @click="fire('apply_template', { templateId: tpl.id })"
+        >
+          <span class="sched-ctx__label">{{ tpl.name }}</span>
+          <span class="sched-ctx__hint">
+            {{ tpl.slots.reduce((sum, s) => sum + Number(s.capacity || 0), 0) }}号
+          </span>
+        </div>
+        <div v-if="props.templates.length === 0" class="sched-ctx__empty">
+          暂无启用模板
+        </div>
+      </div>
+      <div class="sched-ctx__item" @click="fire('custom')">
+        <span class="sched-ctx__label">
+          <Icon icon="lucide:clock" />
+          自定义时段…
+        </span>
+      </div>
+      <!-- 添加医生排班：选医生 + 选模板/自定义时段，一步给多位医生排当天班 -->
+      <div
+        v-if="state.addDoctorsEnabled"
+        class="sched-ctx__item"
+        @click="fire('add_doctors')"
+      >
+        <span class="sched-ctx__label">
+          <Icon icon="lucide:user-plus" />
+          添加医生排班…
+        </span>
+      </div>
+      <div class="sched-ctx__divider"></div>
+      <div
+        class="sched-ctx__item"
+        :class="{ 'sched-ctx__item--disabled': !state.copyEnabled }"
+        @click="state.copyEnabled && fire('copy')"
+      >
+        <span class="sched-ctx__label">
+          <Icon icon="lucide:copy" />
+          复制该日排班
+        </span>
+      </div>
+      <div
+        class="sched-ctx__item"
+        :class="{ 'sched-ctx__item--disabled': !props.canPaste }"
+        @click="props.canPaste && fire('paste')"
+      >
+        <span class="sched-ctx__label">
+          <Icon icon="lucide:clipboard-paste" />
+          粘贴排班
+        </span>
+        <span v-if="props.canPaste" class="sched-ctx__hint">{{ props.pasteSummary }}</span>
+      </div>
+      <div class="sched-ctx__divider"></div>
+      <div class="sched-ctx__item sched-ctx__item--danger" @click="fire('rest')">
+        <span class="sched-ctx__label">
+          <Icon icon="lucide:ban" />
+          设为休诊
+        </span>
+      </div>
+      <div class="sched-ctx__item" @click="fire('clear')">
+        <span class="sched-ctx__label">
+          <Icon icon="lucide:rotate-ccw" />
+          恢复默认规则
+        </span>
+      </div>
+    </div>
+  </Teleport>
+</template>
+
+<style scoped>
+/* 毛玻璃浮层：与工作台日历右键菜单同一设计语言 */
+.sched-ctx {
+  position: fixed;
+  z-index: 2100;
+  min-width: 200px;
+  max-width: 260px;
+  padding: 6px;
+  background: hsl(var(--popover, var(--background)) / 82%);
+  border: 1px solid hsl(var(--border) / 60%);
+  border-radius: 12px;
+  box-shadow: 0 12px 32px rgb(0 0 0 / 16%);
+  backdrop-filter: blur(18px) saturate(160%);
+}
+
+.sched-ctx__title {
+  padding: 4px 10px 6px;
+  overflow: hidden;
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  border-bottom: 1px solid hsl(var(--border));
+}
+
+.sched-ctx__item {
+  display: flex;
+  gap: 8px;
+  align-items: center;
+  justify-content: space-between;
+  padding: 7px 10px;
+  margin-top: 2px;
+  font-size: 13px;
+  color: hsl(var(--foreground));
+  cursor: pointer;
+  border-radius: 6px;
+  transition: background 0.12s;
+}
+
+.sched-ctx__item:hover {
+  background: hsl(var(--primary) / 0.08);
+}
+
+.sched-ctx__item--sub {
+  padding-left: 26px;
+}
+
+.sched-ctx__item--danger {
+  color: hsl(var(--destructive));
+}
+
+.sched-ctx__item--danger:hover {
+  background: hsl(var(--destructive) / 0.08);
+}
+
+.sched-ctx__item--disabled {
+  color: hsl(var(--muted-foreground) / 0.55);
+  cursor: not-allowed;
+}
+
+.sched-ctx__item--disabled:hover {
+  background: none;
+}
+
+.sched-ctx__label {
+  display: inline-flex;
+  gap: 6px;
+  align-items: center;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.sched-ctx__hint {
+  flex-shrink: 0;
+  max-width: 90px;
+  overflow: hidden;
+  font-size: 11px;
+  color: hsl(var(--muted-foreground));
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+/* 模板子列表：限高滚动，防模板多时菜单超出视口 */
+.sched-ctx__sub {
+  max-height: 150px;
+  overflow-y: auto;
+}
+
+.sched-ctx__empty {
+  padding: 6px 10px 6px 26px;
+  font-size: 12px;
+  color: hsl(var(--muted-foreground) / 0.7);
+}
+
+.sched-ctx__divider {
+  height: 1px;
+  margin: 4px 6px;
+  background: hsl(var(--border) / 70%);
+}
+</style>
diff --git a/apps/web-antd/src/views/doctor/doctor/components/schedule-calendar/ScheduleMatrixView.vue b/apps/web-antd/src/views/doctor/doctor/components/schedule-calendar/ScheduleMatrixView.vue
new file mode 100644
index 00000000..e75c9e09
--- /dev/null
+++ b/apps/web-antd/src/views/doctor/doctor/components/schedule-calendar/ScheduleMatrixView.vue
@@ -0,0 +1,531 @@
+<script lang="ts" setup>
+/**
+ * 排班矩阵总览视图（行=医生 × 列=日期，周粒度）
+ * 医院排班表惯例：一屏看全店一周的出诊安排；格子支持标准桌面选择模型
+ * （点击单选 / Ctrl 追加 / Shift 矩形范围）后由父面板批量下发排班动作。
+ * 选择项是（医生,日期）组合，与月历的纯日期选择不同，所以批量提交时
+ * 由 getSelectionGroups 把「日期集合相同的医生」合并成组，减少请求次数。
+ */
+import type { MatrixCell, MatrixDate, MatrixDoctor } from '../../api/schedule';
+
+import { computed, ref, watch } from 'vue';
+
+import { Button, Empty, Tooltip } from 'ant-design-vue';
+import dayjs from 'dayjs';
+
+import { Icon } from '#/components/icon';
+
+import { getStoreMatrixApi } from '../../api/schedule';
+
+const props = defineProps<{
+  storeId: number;
+}>();
+
+const emit = defineEmits<{
+  /** 右键格子：上抛给父面板统一弹右键菜单（含选区归一逻辑） */
+  cellCtx: [event: MouseEvent, doctor: MatrixDoctor, cell: MatrixCell];
+  /** 选中格数变化：父面板操作条展示「已选 N 格」 */
+  selectionChange: [count: number];
+}>();
+
+/** 求某天所在周的周一（不依赖 dayjs locale 的 startOf('week') 起点差异） */
+function mondayOf(d: dayjs.Dayjs) {
+  const dow = d.day(); // 0=周日 1=周一 ... 6=周六
+  return d.subtract(dow === 0 ? 6 : dow - 1, 'day').startOf('day');
+}
+
+/** 周起点（周一），矩阵固定 7 列一周 */
+const weekStart = ref(mondayOf(dayjs()));
+/** 日期轴与医生行 */
+const dates = ref<MatrixDate[]>([]);
+const doctors = ref<MatrixDoctor[]>([]);
+const loading = ref(false);
+
+/** 选中格集合，key = `${doctorId}|${date}` */
+const selectedKeys = ref<Set<string>>(new Set());
+/** Shift 范围选择锚点（行/列下标） */
+const anchor = ref<null | { col: number; row: number }>(null);
+
+/** 最早回看 12 周 / 最远排 26 周，防无限翻页 */
+const canPrev = computed(() => weekStart.value.isAfter(dayjs().subtract(12, 'week')));
+const canNext = computed(() => weekStart.value.isBefore(dayjs().add(26, 'week')));
+
+/** 周标题（如 8月17日 - 8月23日） */
+const weekTitle = computed(() => {
+  const end = weekStart.value.add(6, 'day');
+  return `${weekStart.value.format('M月D日')} - ${end.format('M月D日')}`;
+});
+
+function cellKey(doctorId: number, date: string) {
+  return `${doctorId}|${date}`;
+}
+
+/** 拉取矩阵数据（切周/门店变化/父面板要求刷新时） */
+async function fetchMatrix() {
+  if (!props.storeId) return;
+  loading.value = true;
+  try {
+    const data = await getStoreMatrixApi(props.storeId, weekStart.value.format('YYYY-MM-DD'), 7);
+    dates.value = Array.isArray(data?.dates) ? data.dates : [];
+    doctors.value = Array.isArray(data?.doctors) ? data.doctors : [];
+  } finally {
+    loading.value = false;
+  }
+}
+
+/** 切周：清空选择（跨周选择容易误操作） */
+function switchWeek(offset: number) {
+  weekStart.value = weekStart.value.add(offset, 'week');
+  clearSelection();
+  fetchMatrix();
+}
+
+/** 回到本周 */
+function backToThisWeek() {
+  weekStart.value = mondayOf(dayjs());
+  clearSelection();
+  fetchMatrix();
+}
+
+/** 某格是否可选（过去日期只读） */
+function selectable(cell: MatrixCell, colIdx: number) {
+  return !(dates.value[colIdx]?.is_past ?? false) && !!cell;
+}
+
+function notifySelection() {
+  emit('selectionChange', selectedKeys.value.size);
+}
+
+/**
+ * 格子点击：标准桌面选择模型
+ * 普通点击=只选该格（替换）；Ctrl/Cmd=追加/取消；Shift=从锚点到当前格的矩形范围并入
+ */
+function onCellClick(e: MouseEvent, rowIdx: number, colIdx: number) {
+  const doctor = doctors.value[rowIdx];
+  const cell = doctor?.cells[colIdx];
+  if (!doctor || !cell || !selectable(cell, colIdx)) return;
+  const key = cellKey(doctor.id, cell.date);
+  const next = new Set(selectedKeys.value);
+
+  if (e.shiftKey && anchor.value) {
+    // 矩形范围：锚点与当前格围成的（医生行 × 日期列）区域全部并入（跳过过去日期）
+    const [r1, r2] = [Math.min(anchor.value.row, rowIdx), Math.max(anchor.value.row, rowIdx)];
+    const [c1, c2] = [Math.min(anchor.value.col, colIdx), Math.max(anchor.value.col, colIdx)];
+    for (let r = r1; r <= r2; r++) {
+      for (let c = c1; c <= c2; c++) {
+        const d = doctors.value[r];
+        const cc = d?.cells[c];
+        if (d && cc && selectable(cc, c)) {
+          next.add(cellKey(d.id, cc.date));
+        }
+      }
+    }
+  } else if (e.ctrlKey || e.metaKey) {
+    if (next.has(key)) {
+      next.delete(key);
+    } else {
+      next.add(key);
+    }
+    anchor.value = { row: rowIdx, col: colIdx };
+  } else {
+    next.clear();
+    next.add(key);
+    anchor.value = { row: rowIdx, col: colIdx };
+  }
+  selectedKeys.value = next;
+  notifySelection();
+}
+
+/** 右键格子：不在选区内则替换选区为该格，然后上抛父面板弹菜单 */
+function onCellCtx(e: MouseEvent, rowIdx: number, colIdx: number) {
+  const doctor = doctors.value[rowIdx];
+  const cell = doctor?.cells[colIdx];
+  if (!doctor || !cell || !selectable(cell, colIdx)) return;
+  const key = cellKey(doctor.id, cell.date);
+  if (!selectedKeys.value.has(key)) {
+    selectedKeys.value = new Set([key]);
+    anchor.value = { row: rowIdx, col: colIdx };
+    notifySelection();
+  }
+  emit('cellCtx', e, doctor, cell);
+}
+
+/** 点击日期表头：全选/反选该列（某天全员操作，如临时停业） */
+function toggleColumn(colIdx: number) {
+  const date = dates.value[colIdx];
+  if (!date || date.is_past) return;
+  const keys = doctors.value.map((d) => cellKey(d.id, date.date));
+  const allIn = keys.every((k) => selectedKeys.value.has(k));
+  const next = new Set(selectedKeys.value);
+  for (const k of keys) {
+    if (allIn) {
+      next.delete(k);
+    } else {
+      next.add(k);
+    }
+  }
+  selectedKeys.value = next;
+  notifySelection();
+}
+
+/** 点击医生名：全选/反选该行的可选日期（给某医生排整周） */
+function toggleRow(rowIdx: number) {
+  const doctor = doctors.value[rowIdx];
+  if (!doctor) return;
+  const keys: string[] = [];
+  doctor.cells.forEach((cell, c) => {
+    if (selectable(cell, c)) keys.push(cellKey(doctor.id, cell.date));
+  });
+  if (keys.length === 0) return;
+  const allIn = keys.every((k) => selectedKeys.value.has(k));
+  const next = new Set(selectedKeys.value);
+  for (const k of keys) {
+    if (allIn) {
+      next.delete(k);
+    } else {
+      next.add(k);
+    }
+  }
+  selectedKeys.value = next;
+  notifySelection();
+}
+
+function clearSelection() {
+  selectedKeys.value = new Set();
+  anchor.value = null;
+  notifySelection();
+}
+
+/**
+ * 把选中格按「日期集合相同的医生」合并成组（父面板批量调 save-days 用）
+ * 矩形选择时全部医生日期一致 → 只有 1 组 1 次请求；散选时才会拆多组
+ */
+function getSelectionGroups(): Array<{ dates: string[]; doctorIds: number[] }> {
+  const byDoctor = new Map<number, string[]>();
+  for (const key of selectedKeys.value) {
+    const [didStr, date] = key.split('|');
+    const did = Number(didStr);
+    if (!byDoctor.has(did)) byDoctor.set(did, []);
+    byDoctor.get(did)!.push(date!);
+  }
+  const byDates = new Map<string, number[]>();
+  for (const [did, ds] of byDoctor) {
+    const k = [...ds].sort().join(',');
+    if (!byDates.has(k)) byDates.set(k, []);
+    byDates.get(k)!.push(did);
+  }
+  return [...byDates.entries()].map(([k, doctorIds]) => ({
+    dates: k.split(','),
+    doctorIds,
+  }));
+}
+
+/** 门店切换时重置到本周并重拉 */
+watch(
+  () => props.storeId,
+  () => {
+    clearSelection();
+    fetchMatrix();
+  },
+  { immediate: true },
+);
+
+defineExpose({ clearSelection, fetchMatrix, getSelectionGroups });
+</script>
+
+<template>
+  <div class="smx" :class="{ 'smx--loading': loading }">
+    <!-- 周导航 -->
+    <div class="smx__nav">
+      <Button :disabled="!canPrev" size="small" type="text" @click="switchWeek(-1)">
+        <Icon icon="lucide:chevron-left" />
+      </Button>
+      <span class="smx__week-text">{{ weekTitle }}</span>
+      <Button :disabled="!canNext" size="small" type="text" @click="switchWeek(1)">
+        <Icon icon="lucide:chevron-right" />
+      </Button>
+      <Button size="small" type="link" @click="backToThisWeek">本周</Button>
+      <span class="smx__nav-tip">点医生名选整行 · 点日期选整列 · Ctrl 散选 · Shift 框选</span>
+    </div>
+
+    <!-- 矩阵表格 -->
+    <div v-if="doctors.length > 0" class="smx__table-wrap">
+      <table class="smx__table">
+        <thead>
+          <tr>
+            <th class="smx__corner">医生</th>
+            <th
+              v-for="(d, colIdx) in dates"
+              :key="d.date"
+              class="smx__date-head"
+              :class="{ 'smx__date-head--today': d.is_today, 'smx__date-head--past': d.is_past }"
+              @click="toggleColumn(colIdx)"
+            >
+              <div class="smx__date-week">周{{ d.week_text }}</div>
+              <div class="smx__date-day">
+                {{ d.day }}
+                <span v-if="d.is_today" class="smx__today-dot"></span>
+              </div>
+            </th>
+          </tr>
+        </thead>
+        <tbody>
+          <tr v-for="(doctor, rowIdx) in doctors" :key="doctor.id">
+            <td class="smx__doctor" @click="toggleRow(rowIdx)">
+              <Tooltip title="点击全选该医生整周">
+                <span class="smx__doctor-name">{{ doctor.name }}</span>
+              </Tooltip>
+            </td>
+            <td
+              v-for="(cell, colIdx) in doctor.cells"
+              :key="cell.date"
+              class="smx__cell"
+              :class="{
+                'smx__cell--past': dates[colIdx]?.is_past,
+                'smx__cell--selected': selectedKeys.has(`${doctor.id}|${cell.date}`),
+                'smx__cell--rest': cell.is_rest,
+                'smx__cell--day-source': cell.source === 'day' && !cell.is_rest,
+              }"
+              @click="onCellClick($event, rowIdx, colIdx)"
+              @contextmenu.prevent="onCellCtx($event, rowIdx, colIdx)"
+            >
+              <template v-if="cell.is_rest">
+                <span class="smx__chip smx__chip--rest">休诊</span>
+              </template>
+              <template v-else>
+                <!-- 未配置排班的默认兜底：弱化成文字不伪装成排班 chip，与月历视图口径一致 -->
+                <span v-if="cell.source === 'default'" class="smx__default">默认可约</span>
+                <template v-else>
+                  <span
+                    v-for="(name, i) in cell.slot_names.slice(0, 2)"
+                    :key="i"
+                    class="smx__chip"
+                    :class="cell.source === 'day' ? 'smx__chip--day' : 'smx__chip--rule'"
+                  >
+                    {{ name }}
+                  </span>
+                  <span v-if="cell.slot_names.length > 2" class="smx__chip smx__chip--more">
+                    +{{ cell.slot_names.length - 2 }}
+                  </span>
+                </template>
+                <span class="smx__cell-num">
+                  {{ cell.total }}号<template v-if="cell.used > 0">·约{{ cell.used }}</template>
+                </span>
+              </template>
+            </td>
+          </tr>
+        </tbody>
+      </table>
+    </div>
+    <Empty v-else description="该门店暂无医生" />
+  </div>
+</template>
+
+<style scoped>
+.smx {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  transition: opacity 0.2s;
+}
+
+.smx--loading {
+  pointer-events: none;
+  opacity: 0.55;
+}
+
+.smx__nav {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 4px;
+  align-items: center;
+}
+
+.smx__week-text {
+  min-width: 132px;
+  font-size: 14px;
+  font-weight: 600;
+  color: hsl(var(--foreground));
+  text-align: center;
+}
+
+.smx__nav-tip {
+  margin-left: auto;
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+}
+
+/* 矩阵表格：Apple 风圆角卡片容器 */
+.smx__table-wrap {
+  overflow: auto hidden;
+  border: 1px solid hsl(var(--border));
+  border-radius: 12px;
+}
+
+.smx__table {
+  width: 100%;
+  min-width: 720px;
+  border-collapse: collapse;
+  table-layout: fixed;
+}
+
+.smx__corner {
+  width: 92px;
+  padding: 8px;
+  font-size: 12px;
+  font-weight: 600;
+  color: hsl(var(--muted-foreground));
+  background: hsl(var(--muted) / 0.35);
+  border-bottom: 1px solid hsl(var(--border));
+}
+
+.smx__date-head {
+  padding: 6px 4px;
+  text-align: center;
+  cursor: pointer;
+  user-select: none;
+  background: hsl(var(--muted) / 0.35);
+  border-bottom: 1px solid hsl(var(--border));
+  border-left: 1px solid hsl(var(--border) / 0.6);
+  transition: background 0.15s;
+}
+
+.smx__date-head:hover {
+  background: hsl(var(--primary) / 0.08);
+}
+
+.smx__date-head--past {
+  cursor: not-allowed;
+  opacity: 0.5;
+}
+
+.smx__date-week {
+  font-size: 11px;
+  color: hsl(var(--muted-foreground));
+}
+
+.smx__date-day {
+  position: relative;
+  font-size: 14px;
+  font-weight: 600;
+  color: hsl(var(--foreground));
+}
+
+.smx__date-head--today .smx__date-day {
+  color: hsl(var(--primary));
+}
+
+.smx__today-dot {
+  position: absolute;
+  bottom: -3px;
+  left: 50%;
+  width: 4px;
+  height: 4px;
+  background: hsl(var(--primary));
+  border-radius: 50%;
+  transform: translateX(-50%);
+}
+
+.smx__doctor {
+  padding: 6px 8px;
+  overflow: hidden;
+  cursor: pointer;
+  user-select: none;
+  border-top: 1px solid hsl(var(--border) / 0.6);
+  transition: background 0.15s;
+}
+
+.smx__doctor:hover {
+  background: hsl(var(--primary) / 0.06);
+}
+
+.smx__doctor-name {
+  display: block;
+  overflow: hidden;
+  font-size: 13px;
+  font-weight: 500;
+  color: hsl(var(--foreground));
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.smx__cell {
+  height: 56px;
+  padding: 4px;
+  vertical-align: top;
+  cursor: pointer;
+  user-select: none;
+  border-top: 1px solid hsl(var(--border) / 0.6);
+  border-left: 1px solid hsl(var(--border) / 0.6);
+  transition: background 0.15s, box-shadow 0.15s;
+}
+
+.smx__cell:not(.smx__cell--past):hover {
+  background: hsl(var(--primary) / 0.06);
+}
+
+.smx__cell--past {
+  cursor: not-allowed;
+  opacity: 0.45;
+}
+
+/* 选中态：主色内描边 + 微光（同月历视图语言） */
+.smx__cell--selected {
+  background: hsl(var(--primary) / 0.1);
+  box-shadow: inset 0 0 0 2px hsl(var(--primary) / 0.55), 0 0 6px hsl(var(--primary) / 18%);
+}
+
+.smx__cell--day-source:not(.smx__cell--selected) {
+  box-shadow: inset 0 0 0 1px hsl(var(--primary) / 0.3);
+}
+
+.smx__cell--rest:not(.smx__cell--selected) {
+  background: hsl(var(--destructive) / 0.05);
+}
+
+.smx__chip {
+  display: inline-block;
+  max-width: 100%;
+  padding: 0 5px;
+  margin: 0 2px 2px 0;
+  overflow: hidden;
+  font-size: 11px;
+  line-height: 17px;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  vertical-align: top;
+  border-radius: 4px;
+}
+
+.smx__chip--day {
+  color: hsl(var(--primary));
+  background: hsl(var(--primary) / 0.12);
+}
+
+.smx__chip--rule {
+  color: hsl(var(--muted-foreground));
+  background: hsl(var(--muted) / 0.4);
+}
+
+.smx__chip--rest {
+  color: hsl(var(--destructive));
+  background: hsl(var(--destructive) / 0.12);
+}
+
+.smx__chip--more {
+  color: hsl(var(--muted-foreground));
+}
+
+.smx__cell-num {
+  display: block;
+  font-size: 10px;
+  color: hsl(var(--muted-foreground));
+}
+
+/* 未配置排班的默认兜底格：弱化文字，避免被误读为已排班 */
+.smx__default {
+  display: block;
+  font-size: 11px;
+  color: hsl(var(--muted-foreground) / 0.5);
+}
+</style>
diff --git a/apps/web-antd/src/views/doctor/doctor/components/schedule-calendar/SchedulePanel.vue b/apps/web-antd/src/views/doctor/doctor/components/schedule-calendar/SchedulePanel.vue
new file mode 100644
index 00000000..0f7b3bc5
--- /dev/null
+++ b/apps/web-antd/src/views/doctor/doctor/components/schedule-calendar/SchedulePanel.vue
@@ -0,0 +1,1760 @@
+<script lang="ts" setup>
+/**
+ * 排班面板（可复用核心组件）
+ * 三个入口共用：诊所管理「排班管理」弹窗 / 诊所设置页「排班管理」tab /
+ * 医生管理「排班日历」（lockedDoctorId 锁定医生，隐藏医生切换与矩阵视图）。
+ *
+ * 双视图：
+ * - 月历视图：左右布局——左侧单医生整月日历，右侧双页签
+ *   「当日值班」：单击日期联动展示当天排班方式、各时段值班人数与医生列表
+ *     （只有日排/规则算出诊；未配置排班的默认兜底降级到「未排」折叠组，不冒充值班）
+ *   「批量排班」：医生标签墙（头像+姓名），单击多选批量医生、双击切换日历展示医生
+ * - 总览视图（矩阵）：全店医生 × 一周日期，格子级选择批量操作
+ * 展示口径：默认兜底（register_num 全天可约）在月历/矩阵渲染为弱化的「默认可约」文字，
+ * 只有真排班（按日排班绿 chip / 规则排班灰 chip）才以 chip 呈现，避免噪音淹没真实排班
+ *
+ * 选择模型（标准桌面，同文件管理器）：
+ * 普通点击=只选该格（替换选区，并联动右栏值班视图）/ Ctrl+点击=追加或取消 /
+ * Shift+点击=锚点到当前范围并入（多选不打断批量工作流，不切页签）；
+ * 两视图格子均支持右键快捷菜单（套模板/自定义/休诊/恢复/复制粘贴/添加医生排班）。
+ */
+import type {
+  MatrixCell,
+  MatrixDoctor,
+  ScheduleCalendarDay,
+  ScheduleSlot,
+  ShiftTemplate,
+} from '../../api/schedule';
+
+import { computed, ref, watch } from 'vue';
+
+import {
+  Avatar,
+  Button,
+  Empty,
+  message,
+  Popconfirm,
+  Segmented,
+  Select,
+  Spin,
+  Tooltip,
+} from 'ant-design-vue';
+import dayjs from 'dayjs';
+
+import { Icon } from '#/components/icon';
+import { getDoctorOptionApi } from '#/views/system/store/api';
+
+import {
+  getScheduleMonthCalendarApi,
+  getShiftTemplateListApi,
+  getStoreMatrixApi,
+  getWorkingDoctorsApi,
+  saveScheduleDaysApi,
+} from '../../api/schedule';
+import AddDoctorScheduleModal from './AddDoctorScheduleModal.vue';
+import ScheduleContextMenu from './ScheduleContextMenu.vue';
+import ScheduleMatrixView from './ScheduleMatrixView.vue';
+import ShiftTemplateModal from './ShiftTemplateModal.vue';
+import SlotRowsEditor from './SlotRowsEditor.vue';
+
+const props = withDefaults(
+  defineProps<{
+    /** 锁定医生（医生管理入口传入）：隐藏医生下拉与矩阵视图，只排该医生 */
+    lockedDoctorId?: number;
+    lockedDoctorName?: string;
+    storeId: number;
+    storeName?: string;
+  }>(),
+  { lockedDoctorId: 0, lockedDoctorName: '', storeName: '' },
+);
+
+/** 周表头（周一开头，与后端 week 1-7 对齐） */
+const WEEK_HEADS = [
+  { label: '周一', value: 1 },
+  { label: '周二', value: 2 },
+  { label: '周三', value: 3 },
+  { label: '周四', value: 4 },
+  { label: '周五', value: 5 },
+  { label: '周六', value: 6 },
+  { label: '周日', value: 7 },
+];
+
+/** 视图记忆 key：用户偏好月历还是总览 */
+const VIEW_STORAGE_KEY = 'xk-schedule-panel-view';
+
+/** 当前视图：locked 场景强制月历（总览是全店视角，对单医生入口无意义） */
+const view = ref<'calendar' | 'matrix'>(
+  localStorage.getItem(VIEW_STORAGE_KEY) === 'matrix' ? 'matrix' : 'calendar',
+);
+if (props.lockedDoctorId) {
+  view.value = 'calendar';
+}
+
+/** 是否锁定医生模式 */
+const isLocked = computed(() => Number(props.lockedDoctorId) > 0);
+
+/** 医生选项与当前医生（月历视图）；avatar 供右栏标签墙展示 */
+const doctorOptions = ref<Array<{ avatar?: string; id: number; name: string }>>([]);
+const doctorId = ref<number | undefined>();
+/** 当前月份（YYYY-MM） */
+const month = ref<string>(dayjs().format('YYYY-MM'));
+/** 月历数据 */
+const days = ref<ScheduleCalendarDay[]>([]);
+/** 该医生是否还没配置过规则排班（提示用） */
+const isDefaultRule = ref(false);
+/** 患者端可预约窗口天数（提示用） */
+const bookDays = ref(7);
+/** 选中日期集合（月历视图，date 字符串） */
+const selected = ref<string[]>([]);
+/** Shift 范围选择锚点（date 字符串） */
+const anchorDate = ref<string>('');
+/** 班次模板列表 */
+const templates = ref<ShiftTemplate[]>([]);
+/** 操作条：套用模板选中值 */
+const templateId = ref<number | undefined>();
+/** 操作条：批量应用的医生集合（月历视图多医生批量，默认当前医生） */
+const batchDoctorIds = ref<number[]>([]);
+/** 自定义时段展开面板 */
+const customOpen = ref(false);
+const customSlots = ref<ScheduleSlot[]>([]);
+/** 加载与提交状态 */
+const loading = ref(false);
+const saving = ref(false);
+/** 矩阵视图已选格数（操作条计数） */
+const matrixCount = ref(0);
+/** 排班剪贴板（右键复制/粘贴，内存级，两视图共享） */
+const clipboard = ref<null | { slots: ScheduleSlot[]; summary: string }>(null);
+
+const templateModalRef = ref<InstanceType<typeof ShiftTemplateModal>>();
+const addModalRef = ref<InstanceType<typeof AddDoctorScheduleModal>>();
+const matrixRef = ref<InstanceType<typeof ScheduleMatrixView>>();
+const ctxMenuRef = ref<InstanceType<typeof ScheduleContextMenu>>();
+
+/** 右键目标上下文：菜单动作执行时读取（区分月历/矩阵与目标格） */
+const ctxTarget = ref<null | {
+  cellSlots: ScheduleSlot[];
+  view: 'calendar' | 'matrix';
+}>(null);
+
+/** 月历表头需要的前置空位数（本月 1 号是周几 - 1） */
+const leadingBlanks = computed(() =>
+  days.value.length > 0 ? (days.value[0]!.week + 6) % 7 : 0,
+);
+
+/** 启用中的模板（添加医生排班弹窗数据源：含医生专属，弹窗内自行分流） */
+const enabledTemplates = computed(() =>
+  templates.value.filter((t) => Number(t.status) === 1),
+);
+
+/**
+ * 启用中的店级通用模板（套用下拉与右键子列表数据源）
+ * 医生专属模板不进通用套用入口：把某位医生的专属时段套给任意医生集合是明显误操作
+ */
+const generalTemplates = computed(() =>
+  enabledTemplates.value.filter((t) => Number(t.doctor_id || 0) === 0),
+);
+
+/** 是否可以往前翻（限制最早回看 12 个月） */
+const canPrev = computed(() =>
+  dayjs(month.value).isAfter(dayjs().subtract(12, 'month'), 'month'),
+);
+/** 最多往后排 12 个月 */
+const canNext = computed(() =>
+  dayjs(month.value).isBefore(dayjs().add(12, 'month'), 'month'),
+);
+
+/** 视图切换：记忆偏好并清理跨视图状态 */
+function onViewChange(val: any) {
+  view.value = val as 'calendar' | 'matrix';
+  localStorage.setItem(VIEW_STORAGE_KEY, view.value);
+  customOpen.value = false;
+}
+
+/** 拉取门店医生下拉（锁定医生时跳过） */
+async function fetchDoctors() {
+  if (isLocked.value) {
+    doctorId.value = Number(props.lockedDoctorId);
+    batchDoctorIds.value = [doctorId.value];
+    return;
+  }
+  const list = await getDoctorOptionApi(props.storeId);
+  doctorOptions.value = Array.isArray(list) ? list : [];
+  // 默认选第一个医生，减少一步点击
+  if (!doctorId.value && doctorOptions.value.length > 0) {
+    doctorId.value = doctorOptions.value[0]!.id;
+  }
+  batchDoctorIds.value = doctorId.value ? [doctorId.value] : [];
+}
+
+/** 拉取班次模板 */
+async function fetchTemplates() {
+  const data = await getShiftTemplateListApi(props.storeId);
+  templates.value = Array.isArray(data?.list) ? data.list : [];
+  // 套用下拉只放通用模板，已选模板变专属/被禁用后要清掉避免误套
+  if (templateId.value && !generalTemplates.value.some((t) => t.id === templateId.value)) {
+    templateId.value = undefined;
+  }
+}
+
+/** 拉取月历（医生或月份变化时都走这里） */
+async function fetchCalendar() {
+  if (!doctorId.value) {
+    days.value = [];
+    return;
+  }
+  loading.value = true;
+  try {
+    const data = await getScheduleMonthCalendarApi(doctorId.value, month.value, props.storeId);
+    days.value = Array.isArray(data?.days) ? data.days : [];
+    isDefaultRule.value = Boolean(data?.is_default_rule);
+    bookDays.value = Number(data?.book_days || 7);
+  } finally {
+    loading.value = false;
+  }
+}
+
+/**
+ * 切换日历展示医生：只重拉月历，保留日期选择与批量医生集合
+ * 右栏标签墙已可视化批量集合，切人浏览不清状态才能支撑
+ * 「选日期 → 多选医生 → 逐个切人核对 → 批量应用」的完整工作流
+ */
+function onDoctorChange() {
+  if (batchDoctorIds.value.length === 0 && doctorId.value) {
+    batchDoctorIds.value = [doctorId.value];
+  }
+  fetchCalendar();
+}
+
+// ---------------- 右栏医生标签墙 ----------------
+
+/** 批量集合为空时实际生效的医生数（fallback 当前日历医生） */
+const effectiveBatchCount = computed(() =>
+  batchDoctorIds.value.length > 0 ? batchDoctorIds.value.length : (doctorId.value ? 1 : 0),
+);
+
+/** 单击标签：切换该医生是否加入批量集合 */
+function toggleBatchDoctor(id: number) {
+  const idx = batchDoctorIds.value.indexOf(id);
+  if (idx === -1) {
+    batchDoctorIds.value.push(id);
+  } else {
+    batchDoctorIds.value.splice(idx, 1);
+  }
+}
+
+/** 只切换日历展示医生（值班列表点击用，不动批量集合，避免误加批量对象） */
+function focusDoctorCalendar(id: number) {
+  if (doctorId.value !== id) {
+    doctorId.value = id;
+    fetchCalendar();
+  }
+}
+
+/** 双击标签：把日历切到该医生（核对排班），同时确保其在批量集合内 */
+function viewDoctorCalendar(id: number) {
+  if (!batchDoctorIds.value.includes(id)) {
+    batchDoctorIds.value.push(id);
+  }
+  focusDoctorCalendar(id);
+}
+
+/** 全选门店医生到批量集合 */
+function selectAllDoctors() {
+  batchDoctorIds.value = doctorOptions.value.map((d) => d.id);
+}
+
+/** 清空批量集合（应用时回落到当前日历医生） */
+function clearBatchDoctors() {
+  batchDoctorIds.value = [];
+}
+
+// ---------------- 右栏当日值班视图 ----------------
+
+/** 右栏页签记忆 key：用户偏好值班还是批量 */
+const SIDE_TAB_KEY = 'xk-schedule-side-tab';
+/** 右栏页签：duty=当日值班 batch=批量排班 */
+const sideTab = ref<'batch' | 'duty'>(
+  localStorage.getItem(SIDE_TAB_KEY) === 'batch' ? 'batch' : 'duty',
+);
+function onSideTabChange(val: any) {
+  sideTab.value = val as 'batch' | 'duty';
+  localStorage.setItem(SIDE_TAB_KEY, sideTab.value);
+}
+
+/** 当前展示值班的日期（YYYY-MM-DD，空=还没点过日期） */
+const dutyDate = ref('');
+const dutyLoading = ref(false);
+/** 该日全店医生矩阵行（days=1，每人一个 cell） */
+const dutyDoctors = ref<MatrixDoctor[]>([]);
+/** 休诊/未排医生折叠展开态 */
+const dutyOffExpanded = ref(false);
+/** 同日数据内存缓存（保存排班成功后整体失效），非响应式即可 */
+const dutyCache = new Map<string, MatrixDoctor[]>();
+/** 值班请求序号：快速连点日期时丢弃过期响应 */
+let dutySeq = 0;
+
+/** 排班来源短文案（值班列表标签用；default 不会进出诊列表，仅折叠组展示） */
+const DUTY_SOURCE_TEXT: Record<string, string> = {
+  day: '日排',
+  rule: '规则',
+  default: '默认',
+};
+
+/**
+ * 拉取某日全店值班（复用总览矩阵接口 days=1，后端零改动）
+ * 缓存命中直接用；竞态用序号守卫，避免旧响应覆盖新日期的数据
+ */
+async function fetchDuty(date: string) {
+  dutyDate.value = date;
+  dutyOffExpanded.value = false;
+  const cached = dutyCache.get(date);
+  if (cached) {
+    dutyDoctors.value = cached;
+    return;
+  }
+  const seq = ++dutySeq;
+  dutyLoading.value = true;
+  try {
+    const data = await getStoreMatrixApi(props.storeId, date, 1);
+    if (seq !== dutySeq) return;
+    const list = Array.isArray(data?.doctors) ? data.doctors : [];
+    dutyCache.set(date, list);
+    if (dutyDate.value === date) {
+      dutyDoctors.value = list;
+    }
+  } finally {
+    if (seq === dutySeq) {
+      dutyLoading.value = false;
+    }
+  }
+}
+
+/** 排班保存成功后失效值班缓存并重拉当前日（保证右栏与库内一致） */
+function invalidateDuty() {
+  dutyCache.clear();
+  if (dutyDate.value) {
+    fetchDuty(dutyDate.value);
+  }
+}
+
+/** 值班日期标题（如「8月13日 周四」） */
+const dutyDateText = computed(() => {
+  if (!dutyDate.value) return '';
+  const d = dayjs(dutyDate.value);
+  return `${d.format('M月D日')} 周${'日一二三四五六'[d.day()]}`;
+});
+
+/**
+ * 值班有效集合：只有「日排/规则」来源才算真排班计入出诊。
+ * source=default 是医生从未配置排班时的兜底放号（老字段 register_num 全天可约），
+ * 不是诊所安排的值班——混进出诊列表会把真实排班淹没（尤其安排完当日值班后），
+ * 所以统一降级到下方「未排」折叠组，仅作可约提示
+ */
+const dutyOnDuty = computed(() =>
+  dutyDoctors.value.flatMap((d) => {
+    const cell = d.cells?.[0];
+    if (!cell || !cell.is_work || cell.is_rest || cell.source === 'default') return [];
+    return [{ doc: d, cell }];
+  }),
+);
+
+/** 出诊医生（含来源标签与时段容量摘要，模板直接渲染不再调函数） */
+const dutyWorking = computed(() =>
+  dutyOnDuty.value.map(({ cell, doc }) => ({
+    id: doc.id,
+    name: doc.name,
+    avatar: doc.avatar,
+    source: cell.source,
+    sourceText: DUTY_SOURCE_TEXT[cell.source] || '规则',
+    summary: (cell.slots || [])
+      .map((s) => `${s.slot_name || '时段'}${s.capacity}`)
+      .join(' / '),
+  })),
+);
+
+/** 休诊/未排医生（折叠展示；isRest=主动休诊，isDefault=未配置排班仅默认可约） */
+const dutyOff = computed(() =>
+  dutyDoctors.value.flatMap((d) => {
+    const cell = d.cells?.[0];
+    const isDefault = Boolean(cell && cell.is_work && !cell.is_rest && cell.source === 'default');
+    if (cell && cell.is_work && !cell.is_rest && !isDefault) return [];
+    return [
+      {
+        id: d.id,
+        name: d.name,
+        avatar: d.avatar,
+        isRest: Boolean(cell?.is_rest),
+        isDefault,
+      },
+    ];
+  }),
+);
+
+/** 未配置排班、按默认全天可约的医生数（值班空态提示用） */
+const dutyDefaultCount = computed(() => dutyOff.value.filter((d) => d.isDefault).length);
+
+/** 时段分布：按「时段名+起止」聚合值班人数（回答"每个时间段多少医生值班"；默认兜底不计入） */
+const dutySlotGroups = computed(() => {
+  const map = new Map<string, { count: number; key: string; name: string; time: string }>();
+  for (const { cell } of dutyOnDuty.value) {
+    for (const s of cell.slots || []) {
+      const time = `${s.start_time}-${s.end_time}`;
+      const key = `${s.slot_name}|${time}`;
+      const hit = map.get(key);
+      if (hit) {
+        hit.count += 1;
+      } else {
+        map.set(key, { key, name: String(s.slot_name || '时段'), time, count: 1 });
+      }
+    }
+  }
+  // 按开始时间排序，展示顺序与一天的时间轴一致
+  return [...map.values()].sort((a, b) => a.time.localeCompare(b.time));
+});
+
+/** 翻月：清空选择（跨月多选容易误操作，明确按月批量） */
+function switchMonth(offset: number) {
+  month.value = dayjs(month.value).add(offset, 'month').format('YYYY-MM');
+  selected.value = [];
+  anchorDate.value = '';
+  fetchCalendar();
+}
+
+/** 某天是否可选（今天及以后才能改排班） */
+function selectable(day: ScheduleCalendarDay) {
+  return !day.is_past;
+}
+
+/**
+ * 月历格子点击：标准桌面选择模型
+ * 普通点击=只选该日（替换）；Ctrl/Cmd=追加/取消；Shift=锚点到当前日范围并入（跳过过去日期）
+ */
+function onDayClick(day: ScheduleCalendarDay, e: MouseEvent) {
+  if (!selectable(day)) return;
+
+  if (e.shiftKey && anchorDate.value) {
+    const [from, to] = [anchorDate.value, day.date].sort();
+    const range = days.value
+      .filter((d) => selectable(d) && d.date >= from! && d.date <= to!)
+      .map((d) => d.date);
+    selected.value = [...new Set([...selected.value, ...range])];
+  } else if (e.ctrlKey || e.metaKey) {
+    const idx = selected.value.indexOf(day.date);
+    if (idx === -1) {
+      selected.value.push(day.date);
+    } else {
+      selected.value.splice(idx, 1);
+    }
+    anchorDate.value = day.date;
+  } else {
+    selected.value = [day.date];
+    anchorDate.value = day.date;
+    // 普通单击联动右栏「当日值班」：自动切页签并拉取该日全店值班
+    // （Ctrl/Shift 多选不联动，避免打断「选日期→选医生→批量应用」的工作流）
+    if (!isLocked.value) {
+      if (sideTab.value !== 'duty') {
+        sideTab.value = 'duty';
+        localStorage.setItem(SIDE_TAB_KEY, 'duty');
+      }
+      fetchDuty(day.date);
+    }
+  }
+}
+
+/** 点击周表头：全选/反选该列的可选日期（周排场景一键选整列，保持追加语义） */
+function toggleWeekColumn(week: number) {
+  const colDates = days.value.filter((d) => d.week === week && selectable(d)).map((d) => d.date);
+  if (colDates.length === 0) return;
+  const allIn = colDates.every((d) => selected.value.includes(d));
+  selected.value = allIn
+    ? selected.value.filter((d) => !colDates.includes(d))
+    : [...new Set([...selected.value, ...colDates])];
+}
+
+/** 快捷选择：scope=month 全月 / workday 周一~五 / weekend 周末（追加语义） */
+function quickSelect(scope: 'month' | 'weekend' | 'workday') {
+  const dates = days.value
+    .filter((d) => {
+      if (!selectable(d)) return false;
+      if (scope === 'workday') return d.week <= 5;
+      if (scope === 'weekend') return d.week >= 6;
+      return true;
+    })
+    .map((d) => d.date);
+  selected.value = [...new Set([...selected.value, ...dates])];
+}
+
+/** 清空月历选择 */
+function clearSelected() {
+  selected.value = [];
+  anchorDate.value = '';
+}
+
+/** 把 ScheduleDaySlot（含 slot_id/used）萃取成可提交的四元组时段 */
+function pickSlots(list: Array<Record<string, any>>): ScheduleSlot[] {
+  return (list || []).map((s) => ({
+    slot_name: String(s.slot_name || ''),
+    start_time: String(s.start_time || ''),
+    end_time: String(s.end_time || ''),
+    capacity: Number(s.capacity || 0),
+  }));
+}
+
+/** 时段摘要（剪贴板提示用，如「上午20 / 下午15」） */
+function slotSummary(slots: ScheduleSlot[]): string {
+  return slots.map((s) => `${s.slot_name}${s.capacity}`).join(' / ');
+}
+
+// ---------------- 批量提交 ----------------
+
+/**
+ * 月历视图批量提交：对已选日期 × 已选医生统一下发动作
+ * 成功后清空选择并刷新月历，保证格子显示与库内一致
+ */
+async function applyAction(
+  action: 'apply_template' | 'clear' | 'custom' | 'rest',
+  extra: Record<string, any> = {},
+) {
+  if (view.value === 'matrix') {
+    await applyMatrixAction(action, extra);
+    return;
+  }
+  const doctorIds = batchDoctorIds.value.length > 0
+    ? batchDoctorIds.value
+    : (doctorId.value ? [doctorId.value] : []);
+  if (doctorIds.length === 0) {
+    message.warning('请先选择医生');
+    return;
+  }
+  if (selected.value.length === 0) {
+    message.warning('请先在日历上选择日期');
+    return;
+  }
+  saving.value = true;
+  try {
+    await saveScheduleDaysApi({
+      doctor_ids: doctorIds,
+      store_id: props.storeId,
+      dates: selected.value,
+      action,
+      ...extra,
+    });
+    message.success(
+      doctorIds.length > 1
+        ? `已更新 ${doctorIds.length} 位医生 × ${selected.value.length} 天排班`
+        : `已更新 ${selected.value.length} 天排班`,
+    );
+    clearSelected();
+    customOpen.value = false;
+    invalidateDuty();
+    await fetchCalendar();
+  } catch {
+    // 错误提示由 requestClient 统一弹出（如已约保护拦截，报错点名医生+日期）
+  } finally {
+    saving.value = false;
+  }
+}
+
+/**
+ * 矩阵视图批量提交：把（医生,日期）选择按「日期集合相同的医生」分组依次提交
+ * 矩形选择时只有 1 组（原子）；散选多组时任一组失败即停止，已成功组保持生效
+ */
+async function applyMatrixAction(
+  action: 'apply_template' | 'clear' | 'custom' | 'rest',
+  extra: Record<string, any> = {},
+) {
+  const groups = matrixRef.value?.getSelectionGroups() ?? [];
+  if (groups.length === 0) {
+    message.warning('请先在总览表格上选择格子');
+    return;
+  }
+  saving.value = true;
+  try {
+    for (const group of groups) {
+      await saveScheduleDaysApi({
+        doctor_ids: group.doctorIds,
+        store_id: props.storeId,
+        dates: group.dates,
+        action,
+        ...extra,
+      });
+    }
+    message.success(`已更新 ${matrixCount.value} 个排班格`);
+    matrixRef.value?.clearSelection();
+    customOpen.value = false;
+    invalidateDuty();
+    await matrixRef.value?.fetchMatrix();
+  } catch {
+    // 组间部分成功时后端已约保护会点名冲突医生+日期，用户剔除后重试即可
+    invalidateDuty();
+    await matrixRef.value?.fetchMatrix();
+  } finally {
+    saving.value = false;
+  }
+}
+
+/** 套用班次模板（操作条按钮） */
+function applyTemplate() {
+  if (!templateId.value) {
+    message.warning('请先选择班次模板');
+    return;
+  }
+  applyAction('apply_template', { template_id: templateId.value });
+}
+
+/** 打开自定义时段面板（默认给一个时段起步） */
+function openCustom() {
+  if (view.value === 'calendar' && selected.value.length === 0) {
+    message.warning('请先在日历上选择日期');
+    return;
+  }
+  if (view.value === 'matrix' && matrixCount.value === 0) {
+    message.warning('请先在总览表格上选择格子');
+    return;
+  }
+  if (customSlots.value.length === 0) {
+    customSlots.value = [
+      { slot_name: '', start_time: '08:00', end_time: '12:00', capacity: 10 },
+    ];
+  }
+  customOpen.value = true;
+}
+
+/** 应用自定义时段（轻校验后提交，强校验在服务端） */
+function applyCustom() {
+  for (const slot of customSlots.value) {
+    if (!slot.start_time || !slot.end_time) {
+      message.warning('请补全各时段的开始/结束时间');
+      return;
+    }
+    if (!slot.capacity || slot.capacity < 1) {
+      message.warning('各时段号源数量至少为 1');
+      return;
+    }
+  }
+  applyAction('custom', { slots: customSlots.value });
+}
+
+/** 打开班次模板管理（带上店内医生列表，供「医生专属模板」绑定选择） */
+function openTemplateModal() {
+  templateModalRef.value?.ModalApi?.setData({
+    storeId: props.storeId,
+    storeName: props.storeName,
+    doctors: doctorOptions.value,
+  });
+  templateModalRef.value?.ModalApi?.open();
+}
+
+// ---------------- 选出诊医生 ----------------
+
+/**
+ * 一键勾选「已选日期中出诊的医生」到批量医生集合
+ * 典型场景：周三临时停诊 → 选中周三 → 一键选中当天出诊医生 → 批量设休诊
+ */
+async function pickWorkingDoctors() {
+  if (selected.value.length === 0) {
+    message.warning('请先在日历上选择日期');
+    return;
+  }
+  const data = await getWorkingDoctorsApi(props.storeId, selected.value);
+  const hits = (Array.isArray(data?.list) ? data.list : []).filter(
+    (d: any) => Number(d.working_days) > 0,
+  );
+  if (hits.length === 0) {
+    message.info('所选日期没有出诊的医生');
+    return;
+  }
+  batchDoctorIds.value = hits.map((d: any) => Number(d.id));
+  message.success(`已选中 ${hits.length} 位出诊医生：${hits.map((d: any) => d.name).join('、')}`);
+}
+
+// ---------------- 右键菜单 ----------------
+
+/** 月历格子右键：不在选区内则替换选区为该日，再弹菜单 */
+function onDayCtx(day: ScheduleCalendarDay, e: MouseEvent) {
+  if (!selectable(day)) return;
+  if (!selected.value.includes(day.date)) {
+    selected.value = [day.date];
+    anchorDate.value = day.date;
+  }
+  ctxTarget.value = {
+    view: 'calendar',
+    cellSlots: day.is_work && !day.is_rest ? pickSlots(day.slots) : [],
+  };
+  ctxMenuRef.value?.open(e, {
+    title: `${dayjs(day.date).format('M月D日')} · 已选 ${selected.value.length} 天`,
+    copyEnabled: ctxTarget.value.cellSlots.length > 0,
+    // 添加医生排班只在非锁定的月历入口开放（锁定医生入口没有选人场景）
+    addDoctorsEnabled: !isLocked.value,
+  });
+}
+
+/** 矩阵格子右键（子组件已完成选区归一，这里组装菜单上下文） */
+function onMatrixCellCtx(e: MouseEvent, doctor: MatrixDoctor, cell: MatrixCell) {
+  ctxTarget.value = {
+    view: 'matrix',
+    cellSlots: cell.is_rest ? [] : pickSlots(cell.slots),
+  };
+  ctxMenuRef.value?.open(e, {
+    title: `${doctor.name} · ${dayjs(cell.date).format('M月D日')} · 已选 ${matrixCount.value} 格`,
+    copyEnabled: ctxTarget.value.cellSlots.length > 0,
+  });
+}
+
+/** 打开「添加医生排班」弹窗（右键选区日期 + 全店医生 + 启用模板作为上下文） */
+function openAddDoctorsModal() {
+  if (selected.value.length === 0) {
+    message.warning('请先在日历上选择日期');
+    return;
+  }
+  addModalRef.value?.ModalApi?.setData({
+    storeId: props.storeId,
+    dates: [...selected.value],
+    doctors: doctorOptions.value,
+    templates: enabledTemplates.value,
+  });
+  addModalRef.value?.ModalApi?.open();
+}
+
+/** 添加医生排班保存成功：刷新月历 + 失效值班缓存（保留日期选择便于继续操作） */
+function onAddDoctorsSaved() {
+  invalidateDuty();
+  fetchCalendar();
+}
+
+/** 右键菜单动作分发（复制进剪贴板 / 粘贴走 custom / 其余直接批量下发） */
+function onCtxAction(
+  type: 'add_doctors' | 'apply_template' | 'clear' | 'copy' | 'custom' | 'paste' | 'rest',
+  payload?: { templateId?: number },
+) {
+  switch (type) {
+    case 'add_doctors': {
+      openAddDoctorsModal();
+      break;
+    }
+    case 'apply_template': {
+      applyAction('apply_template', { template_id: payload?.templateId });
+      break;
+    }
+    case 'copy': {
+      const slots = ctxTarget.value?.cellSlots ?? [];
+      if (slots.length === 0) return;
+      clipboard.value = { slots, summary: slotSummary(slots) };
+      message.success(`已复制排班：${clipboard.value.summary}`);
+      break;
+    }
+    case 'custom': {
+      openCustom();
+      break;
+    }
+    case 'paste': {
+      if (!clipboard.value) return;
+      applyAction('custom', { slots: clipboard.value.slots });
+      break;
+    }
+    default: {
+      // rest / clear：右键快捷语义直接执行；已约冲突由后端保护拦截并点名
+      applyAction(type);
+    }
+  }
+}
+
+/** 门店变化（设置页 tab 异步拿到本店 id / 弹窗复用切店）时整体初始化 */
+watch(
+  () => props.storeId,
+  (val) => {
+    if (!val) return;
+    doctorId.value = isLocked.value ? Number(props.lockedDoctorId) : undefined;
+    month.value = dayjs().format('YYYY-MM');
+    clearSelected();
+    customOpen.value = false;
+    templateId.value = undefined;
+    days.value = [];
+    // 切店后值班数据全部作废（缓存与当前展示都清）
+    dutyCache.clear();
+    dutyDate.value = '';
+    dutyDoctors.value = [];
+    fetchDoctors().then(() => fetchCalendar());
+    fetchTemplates();
+  },
+  { immediate: true },
+);
+</script>
+
+<template>
+  <div class="sched">
+    <!-- 顶部工具栏：视图切换 + 医生 + 月份 + 模板管理 -->
+    <div class="sched__toolbar">
+      <div class="sched__toolbar-left">
+        <Segmented
+          v-if="!isLocked"
+          :options="[
+            { label: '月历', value: 'calendar' },
+            { label: '总览', value: 'matrix' },
+          ]"
+          :value="view"
+          @change="onViewChange"
+        />
+        <template v-if="view === 'calendar'">
+          <span v-if="isLocked" class="sched__locked-doctor">
+            <Icon icon="lucide:user" />
+            {{ lockedDoctorName || `医生 #${lockedDoctorId}` }}
+          </span>
+          <Select
+            v-else
+            v-model:value="doctorId"
+            :field-names="{ label: 'name', value: 'id' }"
+            :filter-option="
+              (input: string, option: any) =>
+                String(option.name || '').toLowerCase().includes(input.toLowerCase())
+            "
+            :options="doctorOptions"
+            placeholder="选择医生"
+            show-search
+            style="width: 160px"
+            @change="onDoctorChange"
+          />
+          <div class="sched__month-nav">
+            <Button :disabled="!canPrev" size="small" type="text" @click="switchMonth(-1)">
+              <Icon icon="lucide:chevron-left" />
+            </Button>
+            <span class="sched__month-text">{{ dayjs(month).format('YYYY年M月') }}</span>
+            <Button :disabled="!canNext" size="small" type="text" @click="switchMonth(1)">
+              <Icon icon="lucide:chevron-right" />
+            </Button>
+          </div>
+          <span v-if="isDefaultRule && doctorId" class="sched__default-tip">
+            该医生未配置默认排班，未单独排班的日期按「每天全天」放号
+          </span>
+          <Tooltip
+            :title="`患者端当前可预约未来 ${bookDays} 天（含今天）内的号源；更远的排班会在日期进入窗口后自动开放预约`"
+          >
+            <span v-if="doctorId" class="sched__window-tip">
+              <Icon icon="lucide:info" />
+              可约窗口 {{ bookDays }} 天
+            </span>
+          </Tooltip>
+        </template>
+      </div>
+      <div class="sched__toolbar-right">
+        <Button size="small" @click="openTemplateModal">
+          <Icon icon="lucide:layers" />
+          班次模板
+        </Button>
+      </div>
+    </div>
+
+    <!-- 月历视图 -->
+    <template v-if="view === 'calendar'">
+      <!-- 快捷选择 -->
+      <div class="sched__quick">
+        <span class="sched__quick-label">快捷选择：</span>
+        <Button size="small" type="link" @click="quickSelect('month')">整月</Button>
+        <Button size="small" type="link" @click="quickSelect('workday')">工作日</Button>
+        <Button size="small" type="link" @click="quickSelect('weekend')">周末</Button>
+        <span class="sched__quick-count">
+          已选 <b>{{ selected.length }}</b> 天
+          <Button v-if="selected.length > 0" size="small" type="link" @click="clearSelected">
+            清空
+          </Button>
+        </span>
+        <span class="sched__select-tip">点击单选 · Ctrl 追加 · Shift 连选 · 右键快捷操作</span>
+        <span class="sched__legend">
+          <span class="sched__legend-item sched__legend-item--day">按日排班</span>
+          <span class="sched__legend-item sched__legend-item--rule">规则排班</span>
+          <span class="sched__legend-item sched__legend-item--rest">休诊</span>
+        </span>
+      </div>
+
+      <!-- 左右布局：左侧月历主体，右侧医生标签墙（锁定医生时只有左侧） -->
+      <div class="sched__body">
+        <div class="sched__main">
+          <div
+            v-if="doctorId"
+            class="sched__calendar"
+            :class="{ 'sched__calendar--loading': loading }"
+          >
+            <div class="sched__week-head">
+              <Tooltip v-for="head in WEEK_HEADS" :key="head.value" title="点击全选该列">
+                <button class="sched__week-cell" type="button" @click="toggleWeekColumn(head.value)">
+                  {{ head.label }}
+                </button>
+              </Tooltip>
+            </div>
+            <div class="sched__grid">
+              <div v-for="i in leadingBlanks" :key="`blank-${i}`" class="sched__cell sched__cell--blank"></div>
+              <div
+                v-for="day in days"
+                :key="day.date"
+                class="sched__cell"
+                :class="{
+                  'sched__cell--past': day.is_past,
+                  'sched__cell--today': day.is_today,
+                  'sched__cell--selected': selected.includes(day.date),
+                  'sched__cell--day-source': day.source === 'day' && !day.is_rest,
+                  'sched__cell--rest': day.is_rest,
+                }"
+                @click="onDayClick(day, $event)"
+                @contextmenu.prevent="onDayCtx(day, $event)"
+              >
+                <div class="sched__cell-head">
+                  <span class="sched__cell-date">{{ dayjs(day.date).date() }}</span>
+                  <span v-if="day.is_today" class="sched__cell-today-badge">今天</span>
+                  <span v-if="day.used_total > 0" class="sched__cell-used">已约{{ day.used_total }}</span>
+                </div>
+                <div class="sched__cell-body">
+                  <template v-if="day.is_rest">
+                    <span class="sched__chip sched__chip--rest">休诊</span>
+                  </template>
+                  <template v-else-if="day.is_work">
+                    <!-- 未配置排班医生的兜底日：不伪装成排班 chip，弱化成文字，让真排班（绿色日排）一眼可辨 -->
+                    <span
+                      v-if="isDefaultRule && day.source === 'rule'"
+                      class="sched__cell-default"
+                    >
+                      默认可约
+                    </span>
+                    <template v-else>
+                      <span
+                        v-for="slot in day.slots.slice(0, 3)"
+                        :key="slot.slot_id"
+                        class="sched__chip"
+                        :class="day.source === 'day' ? 'sched__chip--day' : 'sched__chip--rule'"
+                      >
+                        {{ slot.slot_name }} {{ slot.capacity }}号
+                      </span>
+                      <span v-if="day.slots.length > 3" class="sched__chip sched__chip--more">
+                        +{{ day.slots.length - 3 }}
+                      </span>
+                    </template>
+                  </template>
+                  <template v-else>
+                    <span class="sched__cell-off">不出诊</span>
+                  </template>
+                </div>
+                <!-- 全店视角：该日按日排班安排的值班医生数（格子只画当前医生，
+                     没有这个徽标会误以为「这天没配置值班」；点击格子右栏看明细） -->
+                <span
+                  v-if="(day.store_duty_count || 0) > 0"
+                  class="sched__cell-duty"
+                  title="当日全店已安排的值班医生数，点击查看明细"
+                >
+                  <Icon icon="lucide:users" />
+                  值班 {{ day.store_duty_count }} 人
+                </span>
+              </div>
+            </div>
+          </div>
+          <Empty
+            v-else
+            :description="doctorOptions.length === 0 ? '该门店暂无医生' : '请先选择医生'"
+          />
+        </div>
+
+        <!-- 右栏：双页签（当日值班 / 批量排班；锁定医生入口不显示） -->
+        <aside v-if="!isLocked" class="sched__side">
+          <Segmented
+            :options="[
+              { label: '当日值班', value: 'duty' },
+              { label: '批量排班', value: 'batch' },
+            ]"
+            :value="sideTab"
+            block
+            size="small"
+            @change="onSideTabChange"
+          />
+          <!-- 当日值班：单击日历日期联动展示（排班方式 + 各时段人数 + 医生列表） -->
+          <template v-if="sideTab === 'duty'">
+            <Empty
+              v-if="!dutyDate"
+              :image-style="{ height: '48px' }"
+              description="点击日历上的日期，查看当天全店值班"
+            />
+            <template v-else>
+              <div class="sched__side-head">
+                <span class="sched__side-title">{{ dutyDateText }}</span>
+                <span class="sched__duty-summary">
+                  出诊 {{ dutyWorking.length }} · 未排/休 {{ dutyOff.length }}
+                </span>
+              </div>
+              <div v-if="dutyLoading" class="sched__duty-loading">
+                <Spin size="small" />
+              </div>
+              <template v-else>
+                <!-- 时段分布：每个时间段多少医生值班 -->
+                <div v-if="dutySlotGroups.length > 0" class="sched__duty-slots">
+                  <div v-for="g in dutySlotGroups" :key="g.key" class="sched__duty-slot">
+                    <span class="sched__duty-slot-name">{{ g.name }}</span>
+                    <span class="sched__duty-slot-time">{{ g.time }}</span>
+                    <span class="sched__duty-slot-count">{{ g.count }} 人</span>
+                  </div>
+                </div>
+                <div v-else class="sched__side-tip">
+                  当天暂无排班{{
+                    dutyDefaultCount > 0 ? `，${dutyDefaultCount} 位医生按默认全天可约` : ''
+                  }}
+                </div>
+                <!-- 值班医生列表：点击切换左侧日历到该医生 -->
+                <div class="sched__tags">
+                  <button
+                    v-for="doc in dutyWorking"
+                    :key="doc.id"
+                    class="sched__tag"
+                    :class="{ 'sched__tag--viewing': doctorId === doc.id }"
+                    type="button"
+                    @click="focusDoctorCalendar(doc.id)"
+                  >
+                    <Avatar :size="22" :src="doc.avatar || undefined" class="sched__tag-avatar">
+                      {{ doc.name.slice(0, 1) }}
+                    </Avatar>
+                    <span class="sched__duty-doc-main">
+                      <span class="sched__tag-name">{{ doc.name }}</span>
+                      <span class="sched__duty-doc-slots">{{ doc.summary }}</span>
+                    </span>
+                    <span class="sched__duty-source" :class="`sched__duty-source--${doc.source}`">
+                      {{ doc.sourceText }}
+                    </span>
+                  </button>
+                  <!-- 休诊/未排医生折叠一行，点击展开 -->
+                  <button
+                    v-if="dutyOff.length > 0"
+                    class="sched__duty-off-toggle"
+                    type="button"
+                    @click="dutyOffExpanded = !dutyOffExpanded"
+                  >
+                    <Icon :icon="dutyOffExpanded ? 'lucide:chevron-down' : 'lucide:chevron-right'" />
+                    休诊/未排 {{ dutyOff.length }} 人
+                  </button>
+                  <template v-if="dutyOffExpanded">
+                    <button
+                      v-for="doc in dutyOff"
+                      :key="doc.id"
+                      class="sched__tag sched__tag--off"
+                      type="button"
+                      @click="focusDoctorCalendar(doc.id)"
+                    >
+                      <Avatar :size="22" :src="doc.avatar || undefined" class="sched__tag-avatar">
+                        {{ doc.name.slice(0, 1) }}
+                      </Avatar>
+                      <span class="sched__tag-name">{{ doc.name }}</span>
+                      <span
+                        class="sched__duty-source"
+                        :class="
+                          doc.isRest
+                            ? 'sched__duty-source--rest'
+                            : doc.isDefault
+                              ? 'sched__duty-source--default'
+                              : 'sched__duty-source--none'
+                        "
+                      >
+                        {{ doc.isRest ? '休诊' : doc.isDefault ? '默认可约' : '未排' }}
+                      </span>
+                    </button>
+                  </template>
+                </div>
+              </template>
+            </template>
+          </template>
+          <!-- 批量排班：医生头像标签墙（多选批量排班对象） -->
+          <template v-else>
+            <div class="sched__side-head">
+              <span class="sched__side-title">批量排班医生</span>
+              <span class="sched__side-count">已选 {{ batchDoctorIds.length }} 人</span>
+            </div>
+            <div class="sched__side-tools">
+              <Tooltip title="按已选日期查询出诊医生并一键勾选（日排班覆盖优先，未配置规则的按每天出诊算）">
+                <Button size="small" @click="pickWorkingDoctors">
+                  <Icon icon="lucide:user-check" />
+                  选出诊
+                </Button>
+              </Tooltip>
+              <Button size="small" @click="selectAllDoctors">全选</Button>
+              <Button :disabled="batchDoctorIds.length === 0" size="small" @click="clearBatchDoctors">
+                清空
+              </Button>
+            </div>
+            <div class="sched__side-tip">单击选择 · 双击查看该医生月历</div>
+            <div class="sched__tags">
+              <button
+                v-for="doc in doctorOptions"
+                :key="doc.id"
+                class="sched__tag"
+                :class="{
+                  'sched__tag--active': batchDoctorIds.includes(doc.id),
+                  'sched__tag--viewing': doctorId === doc.id,
+                }"
+                type="button"
+                @click="toggleBatchDoctor(doc.id)"
+                @dblclick="viewDoctorCalendar(doc.id)"
+              >
+                <Avatar :size="22" :src="doc.avatar || undefined" class="sched__tag-avatar">
+                  {{ doc.name.slice(0, 1) }}
+                </Avatar>
+                <span class="sched__tag-name">{{ doc.name }}</span>
+                <Icon
+                  v-if="doctorId === doc.id"
+                  class="sched__tag-eye"
+                  icon="lucide:calendar-check"
+                />
+              </button>
+              <Empty
+                v-if="doctorOptions.length === 0"
+                :image-style="{ height: '48px' }"
+                description="该门店暂无医生"
+              />
+            </div>
+          </template>
+        </aside>
+      </div>
+    </template>
+
+    <!-- 总览（矩阵）视图 -->
+    <ScheduleMatrixView
+      v-else
+      ref="matrixRef"
+      :store-id="storeId"
+      @cell-ctx="onMatrixCellCtx"
+      @selection-change="(n: number) => (matrixCount = n)"
+    />
+
+    <!-- 底部批量操作条（两视图共用动作，选择来源不同；月历医生多选在右栏标签墙） -->
+    <div class="sched__actions">
+      <div class="sched__actions-row">
+        <span class="sched__actions-label">
+          {{
+            view === 'calendar'
+              ? `对 ${effectiveBatchCount} 位医生 × ${selected.length} 天：`
+              : `对已选 ${matrixCount} 格：`
+          }}
+        </span>
+        <Select
+          v-model:value="templateId"
+          :field-names="{ label: 'name', value: 'id' }"
+          :options="generalTemplates"
+          placeholder="选择班次模板"
+          style="width: 170px"
+        />
+        <Button :loading="saving" type="primary" @click="applyTemplate">套用模板</Button>
+        <Button :loading="saving" @click="openCustom">自定义时段</Button>
+        <Popconfirm
+          title="设为休诊后患者不可预约（已有预约的日期会被拦截），确定吗？"
+          @confirm="applyAction('rest')"
+        >
+          <Button :loading="saving" danger>设休诊</Button>
+        </Popconfirm>
+        <Popconfirm
+          title="恢复默认后这些日期回到医生默认排班规则，确定吗？"
+          @confirm="applyAction('clear')"
+        >
+          <Button :loading="saving">恢复默认规则</Button>
+        </Popconfirm>
+      </div>
+      <!-- 自定义时段展开面板 -->
+      <div v-if="customOpen" class="sched__custom">
+        <SlotRowsEditor v-model="customSlots" />
+        <div class="sched__custom-actions">
+          <Button size="small" @click="customOpen = false">收起</Button>
+          <Button :loading="saving" size="small" type="primary" @click="applyCustom">
+            {{ view === 'calendar' ? `应用到已选 ${selected.length} 天` : `应用到已选 ${matrixCount} 格` }}
+          </Button>
+        </div>
+      </div>
+    </div>
+
+    <ShiftTemplateModal ref="templateModalRef" @changed="fetchTemplates" />
+    <AddDoctorScheduleModal ref="addModalRef" @saved="onAddDoctorsSaved" />
+    <ScheduleContextMenu
+      ref="ctxMenuRef"
+      :can-paste="!!clipboard"
+      :paste-summary="clipboard?.summary || ''"
+      :templates="generalTemplates"
+      @action="onCtxAction"
+    />
+  </div>
+</template>
+
+<style scoped>
+.sched {
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+}
+
+.sched__toolbar {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 8px;
+  align-items: center;
+  justify-content: space-between;
+}
+
+.sched__toolbar-left {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 10px;
+  align-items: center;
+}
+
+.sched__locked-doctor {
+  display: inline-flex;
+  gap: 4px;
+  align-items: center;
+  padding: 3px 10px;
+  font-size: 13px;
+  font-weight: 600;
+  color: hsl(var(--primary));
+  background: hsl(var(--primary) / 0.08);
+  border: 1px solid hsl(var(--primary) / 30%);
+  border-radius: 8px;
+  box-shadow: 0 0 6px hsl(var(--primary) / 18%);
+}
+
+.sched__month-nav {
+  display: flex;
+  gap: 2px;
+  align-items: center;
+}
+
+.sched__month-text {
+  min-width: 92px;
+  font-size: 14px;
+  font-weight: 600;
+  color: hsl(var(--foreground));
+  text-align: center;
+}
+
+.sched__default-tip {
+  font-size: 12px;
+  color: hsl(var(--warning, 35 92% 50%));
+}
+
+.sched__window-tip {
+  display: inline-flex;
+  gap: 3px;
+  align-items: center;
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+  cursor: help;
+}
+
+.sched__quick {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 2px;
+  align-items: center;
+}
+
+.sched__quick-label,
+.sched__quick-count {
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+}
+
+.sched__quick-count {
+  margin-left: 8px;
+}
+
+.sched__quick-count b {
+  color: hsl(var(--primary));
+}
+
+.sched__select-tip {
+  margin-left: 10px;
+  font-size: 12px;
+  color: hsl(var(--muted-foreground) / 0.75);
+}
+
+.sched__legend {
+  display: flex;
+  gap: 10px;
+  margin-left: auto;
+}
+
+.sched__legend-item {
+  position: relative;
+  padding-left: 14px;
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+}
+
+.sched__legend-item::before {
+  position: absolute;
+  top: 50%;
+  left: 0;
+  width: 8px;
+  height: 8px;
+  content: '';
+  border-radius: 3px;
+  transform: translateY(-50%);
+}
+
+.sched__legend-item--day::before {
+  background: hsl(var(--primary) / 0.8);
+}
+
+.sched__legend-item--rule::before {
+  background: hsl(var(--muted-foreground) / 0.5);
+}
+
+.sched__legend-item--rest::before {
+  background: hsl(var(--destructive) / 0.7);
+}
+
+/* 左右布局：左侧日历自适应，右侧医生标签墙固定宽 */
+.sched__body {
+  display: flex;
+  gap: 12px;
+  align-items: stretch;
+}
+
+.sched__main {
+  flex: 1;
+  min-width: 0;
+}
+
+/* 右栏：Apple 风格卡片（1px 边框 + 微光），窄屏自动换行到下方 */
+.sched__side {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  width: 216px;
+  min-width: 216px;
+  max-height: 560px;
+  padding: 10px;
+  border: 1px solid hsl(var(--border));
+  border-radius: 12px;
+  box-shadow: 0 0 6px hsl(var(--border) / 40%);
+}
+
+@media (max-width: 860px) {
+  .sched__body {
+    flex-direction: column;
+  }
+
+  .sched__side {
+    width: 100%;
+    min-width: 0;
+    max-height: 300px;
+  }
+}
+
+.sched__side-head {
+  display: flex;
+  align-items: baseline;
+  justify-content: space-between;
+}
+
+.sched__side-title {
+  font-size: 13px;
+  font-weight: 600;
+  color: hsl(var(--foreground));
+}
+
+.sched__side-count {
+  font-size: 12px;
+  color: hsl(var(--primary));
+}
+
+.sched__side-tools {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 6px;
+}
+
+.sched__side-tip {
+  font-size: 11px;
+  color: hsl(var(--muted-foreground) / 0.75);
+}
+
+.sched__tags {
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+  overflow-y: auto;
+}
+
+/* 医生标签：头像 + 姓名 pill，选中态主色边框微光 */
+.sched__tag {
+  display: flex;
+  gap: 8px;
+  align-items: center;
+  padding: 5px 8px;
+  text-align: left;
+  cursor: pointer;
+  user-select: none;
+  background: hsl(var(--muted) / 0.2);
+  border: 1px solid hsl(var(--border) / 0.7);
+  border-radius: 10px;
+  transition: border-color 0.15s, background 0.15s, box-shadow 0.15s;
+}
+
+.sched__tag:hover {
+  background: hsl(var(--primary) / 0.06);
+  border-color: hsl(var(--primary) / 0.35);
+}
+
+.sched__tag--active {
+  background: hsl(var(--primary) / 0.1);
+  border-color: hsl(var(--primary) / 0.45);
+  box-shadow: 0 0 6px hsl(var(--primary) / 18%);
+}
+
+.sched__tag-avatar {
+  flex-shrink: 0;
+  font-size: 12px;
+  background: hsl(var(--primary) / 0.2);
+}
+
+.sched__tag-name {
+  flex: 1;
+  overflow: hidden;
+  font-size: 13px;
+  color: hsl(var(--foreground));
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.sched__tag--active .sched__tag-name {
+  font-weight: 600;
+  color: hsl(var(--primary));
+}
+
+/* 正在查看月历的医生：日历角标点亮 */
+.sched__tag-eye {
+  flex-shrink: 0;
+  font-size: 14px;
+  color: hsl(var(--primary));
+}
+
+/* ---------- 当日值班视图 ---------- */
+.sched__duty-summary {
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+}
+
+.sched__duty-loading {
+  display: flex;
+  justify-content: center;
+  padding: 18px 0;
+}
+
+/* 时段分布卡：1px 边框 + 微光（不用左侧色条） */
+.sched__duty-slots {
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+  padding: 8px;
+  border: 1px solid hsl(var(--primary) / 30%);
+  border-radius: 10px;
+  box-shadow: 0 0 6px hsl(var(--primary) / 18%);
+}
+
+.sched__duty-slot {
+  display: flex;
+  gap: 6px;
+  align-items: center;
+  font-size: 12px;
+}
+
+.sched__duty-slot-name {
+  max-width: 64px;
+  overflow: hidden;
+  font-weight: 600;
+  color: hsl(var(--foreground));
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.sched__duty-slot-time {
+  flex: 1;
+  color: hsl(var(--muted-foreground));
+}
+
+.sched__duty-slot-count {
+  font-weight: 600;
+  color: hsl(var(--primary));
+}
+
+/* 值班医生行：姓名 + 时段容量摘要两行 */
+.sched__duty-doc-main {
+  display: flex;
+  flex: 1;
+  flex-direction: column;
+  min-width: 0;
+}
+
+.sched__duty-doc-slots {
+  overflow: hidden;
+  font-size: 11px;
+  color: hsl(var(--muted-foreground));
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+/* 排班来源角标：日排=主色 / 规则=中性 / 默认=弱化 / 休诊=警示 */
+.sched__duty-source {
+  flex-shrink: 0;
+  padding: 0 6px;
+  font-size: 11px;
+  line-height: 18px;
+  border-radius: 5px;
+}
+
+.sched__duty-source--day {
+  color: hsl(var(--primary));
+  background: hsl(var(--primary) / 0.12);
+}
+
+.sched__duty-source--rule {
+  color: hsl(var(--muted-foreground));
+  background: hsl(var(--muted) / 0.4);
+}
+
+.sched__duty-source--default {
+  color: hsl(var(--muted-foreground) / 0.8);
+  background: hsl(var(--muted) / 0.25);
+}
+
+.sched__duty-source--rest {
+  color: hsl(var(--destructive));
+  background: hsl(var(--destructive) / 0.12);
+}
+
+.sched__duty-source--none {
+  color: hsl(var(--muted-foreground) / 0.7);
+  background: hsl(var(--muted) / 0.25);
+}
+
+/* 休诊/未排折叠行 */
+.sched__duty-off-toggle {
+  display: inline-flex;
+  gap: 4px;
+  align-items: center;
+  padding: 4px 2px;
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+  cursor: pointer;
+  background: none;
+  border: none;
+}
+
+.sched__duty-off-toggle:hover {
+  color: hsl(var(--primary));
+}
+
+/* 休诊/未排医生行弱化展示 */
+.sched__tag--off {
+  opacity: 0.72;
+}
+
+/* 日历主体：Apple 风格圆角卡片网格 */
+.sched__calendar {
+  overflow: hidden;
+  border: 1px solid hsl(var(--border));
+  border-radius: 12px;
+  transition: opacity 0.2s;
+}
+
+.sched__calendar--loading {
+  pointer-events: none;
+  opacity: 0.55;
+}
+
+.sched__week-head {
+  display: grid;
+  grid-template-columns: repeat(7, 1fr);
+  background: hsl(var(--muted) / 0.35);
+  border-bottom: 1px solid hsl(var(--border));
+}
+
+.sched__week-cell {
+  padding: 8px 0;
+  font-size: 12px;
+  font-weight: 600;
+  color: hsl(var(--muted-foreground));
+  cursor: pointer;
+  background: none;
+  border: none;
+  transition: color 0.15s, background 0.15s;
+}
+
+.sched__week-cell:hover {
+  color: hsl(var(--primary));
+  background: hsl(var(--primary) / 0.08);
+}
+
+.sched__grid {
+  display: grid;
+  grid-template-columns: repeat(7, 1fr);
+}
+
+.sched__cell {
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+  min-height: 86px;
+  padding: 6px;
+  cursor: pointer;
+  user-select: none;
+  border-right: 1px solid hsl(var(--border) / 0.6);
+  border-bottom: 1px solid hsl(var(--border) / 0.6);
+  transition: background 0.15s, box-shadow 0.15s;
+}
+
+.sched__cell:nth-child(7n) {
+  border-right: none;
+}
+
+.sched__cell--blank {
+  cursor: default;
+  background: hsl(var(--muted) / 0.15);
+}
+
+.sched__cell--past {
+  cursor: not-allowed;
+  opacity: 0.45;
+}
+
+.sched__cell:not(.sched__cell--past, .sched__cell--blank):hover {
+  background: hsl(var(--primary) / 0.06);
+}
+
+/* 选中态：主色内描边 + 微光（不用左侧色条） */
+.sched__cell--selected {
+  background: hsl(var(--primary) / 0.1);
+  box-shadow: inset 0 0 0 2px hsl(var(--primary) / 0.55), 0 0 6px hsl(var(--primary) / 18%);
+}
+
+/* 日排班来源：同色系细描边微光，与默认规则区分 */
+.sched__cell--day-source:not(.sched__cell--selected) {
+  box-shadow: inset 0 0 0 1px hsl(var(--primary) / 0.3);
+}
+
+.sched__cell--rest:not(.sched__cell--selected) {
+  background: hsl(var(--destructive) / 0.05);
+}
+
+.sched__cell-head {
+  display: flex;
+  gap: 4px;
+  align-items: center;
+}
+
+.sched__cell-date {
+  font-size: 13px;
+  font-weight: 600;
+  color: hsl(var(--foreground));
+}
+
+.sched__cell--today .sched__cell-date {
+  color: hsl(var(--primary));
+}
+
+.sched__cell-today-badge {
+  padding: 0 4px;
+  font-size: 10px;
+  color: hsl(var(--primary-foreground, 0 0% 100%));
+  background: hsl(var(--primary));
+  border-radius: 4px;
+}
+
+.sched__cell-used {
+  margin-left: auto;
+  font-size: 10px;
+  color: hsl(var(--warning, 35 92% 50%));
+}
+
+.sched__cell-body {
+  display: flex;
+  flex-direction: column;
+  gap: 2px;
+  overflow: hidden;
+}
+
+.sched__chip {
+  padding: 0 6px;
+  overflow: hidden;
+  font-size: 11px;
+  line-height: 18px;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  border-radius: 5px;
+}
+
+.sched__chip--day {
+  color: hsl(var(--primary));
+  background: hsl(var(--primary) / 0.12);
+}
+
+.sched__chip--rule {
+  color: hsl(var(--muted-foreground));
+  background: hsl(var(--muted) / 0.4);
+}
+
+.sched__chip--rest {
+  color: hsl(var(--destructive));
+  background: hsl(var(--destructive) / 0.12);
+}
+
+.sched__chip--more {
+  color: hsl(var(--muted-foreground));
+}
+
+.sched__cell-off {
+  font-size: 11px;
+  color: hsl(var(--muted-foreground) / 0.7);
+}
+
+/* 未配置排班的默认兜底日：比「不出诊」更弱化，避免被误读为已排班 */
+.sched__cell-default {
+  font-size: 11px;
+  color: hsl(var(--muted-foreground) / 0.5);
+}
+
+/* 全店当日值班徽标：沉底展示，主色弱化与当前医生的排班 chip 区分层级 */
+.sched__cell-duty {
+  display: inline-flex;
+  gap: 3px;
+  align-items: center;
+  margin-top: auto;
+  font-size: 11px;
+  color: hsl(var(--primary) / 0.85);
+}
+
+/* 底部操作条 */
+.sched__actions {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  padding: 10px 12px;
+  background: hsl(var(--muted) / 0.2);
+  border: 1px solid hsl(var(--border));
+  border-radius: 10px;
+}
+
+.sched__actions-row {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 8px;
+  align-items: center;
+}
+
+.sched__actions-label {
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+}
+
+.sched__custom {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  padding-top: 8px;
+  border-top: 1px dashed hsl(var(--border));
+}
+
+.sched__custom-actions {
+  display: flex;
+  gap: 8px;
+  justify-content: flex-end;
+}
+</style>
diff --git a/apps/web-antd/src/views/doctor/doctor/components/schedule-calendar/ShiftTemplateModal.vue b/apps/web-antd/src/views/doctor/doctor/components/schedule-calendar/ShiftTemplateModal.vue
new file mode 100644
index 00000000..af0f994d
--- /dev/null
+++ b/apps/web-antd/src/views/doctor/doctor/components/schedule-calendar/ShiftTemplateModal.vue
@@ -0,0 +1,345 @@
+<script lang="ts" setup>
+/**
+ * 班次模板管理弹窗（店级通用 + 医生专属两档）
+ * 诊所把常用班次（全天班/上午班/两班制等）保存成模板，日历排班时批量套用；
+ * 「适用范围」绑定医生后成为该医生的专属模板（一医生一店仅一个），
+ * 「添加医生排班」勾选优先专属时按医生自己的时段/号源写入。
+ * 列表 + 内联编辑两种视图切换：模板数量少（每店 ≤20），无需分页表格，卡片列表更直观
+ */
+import type { ScheduleSlot, ShiftTemplate } from '../../api/schedule';
+
+import { computed, ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+
+import { Button, Empty, Input, message, Popconfirm, Select, Switch, Tag } from 'ant-design-vue';
+
+import { Icon } from '#/components/icon';
+
+import {
+  deleteShiftTemplateApi,
+  getShiftTemplateListApi,
+  saveShiftTemplateApi,
+} from '../../api/schedule';
+import SlotRowsEditor from './SlotRowsEditor.vue';
+
+const emit = defineEmits<{ changed: [] }>();
+
+/** 当前门店（打开时由父组件传入） */
+const storeId = ref<number>(0);
+const storeName = ref<string>('');
+/** 店内医生列表（专属模板绑定选择用，父组件传入） */
+const doctors = ref<Array<{ id: number; name: string }>>([]);
+/** 模板列表 */
+const list = ref<ShiftTemplate[]>([]);
+/** 编辑态：null=列表视图，否则为正在编辑的模板（id=0 新增，doctor_id=0 通用 / >0 专属） */
+const editing = ref<null | {
+  id: number;
+  doctor_id: number;
+  name: string;
+  slots: ScheduleSlot[];
+  status: number;
+}>(null);
+/** 模板是否有变更（关闭时通知父组件刷新模板下拉） */
+const dirty = ref(false);
+
+/** 适用范围下拉：通用 + 店内医生（专属） */
+const scopeOptions = computed(() => [
+  { label: '通用（全店可套用）', value: 0 },
+  ...doctors.value.map((d) => ({ label: `专属 · ${d.name}`, value: d.id })),
+]);
+
+/** 拉取模板列表 */
+async function fetchList() {
+  ModalApi.setState({ loading: true });
+  try {
+    const data = await getShiftTemplateListApi(storeId.value);
+    list.value = Array.isArray(data?.list) ? data.list : [];
+  } finally {
+    ModalApi.setState({ loading: false });
+  }
+}
+
+/** 进入新增编辑态（默认给一个全天时段起步，默认通用范围） */
+function startCreate() {
+  editing.value = {
+    id: 0,
+    doctor_id: 0,
+    name: '',
+    slots: [{ slot_name: '全天', start_time: '08:00', end_time: '18:00', capacity: 30 }],
+    status: 1,
+  };
+}
+
+/** 进入编辑态（深拷贝防止未保存时污染列表显示） */
+function startEdit(row: ShiftTemplate) {
+  editing.value = {
+    id: row.id,
+    doctor_id: Number(row.doctor_id || 0),
+    name: row.name,
+    slots: JSON.parse(JSON.stringify(row.slots || [])),
+    status: Number(row.status),
+  };
+}
+
+/** 保存模板（新增/编辑共用） */
+async function handleSave() {
+  if (!editing.value) return;
+  if (!editing.value.name.trim()) {
+    message.warning('请输入模板名称');
+    return;
+  }
+  for (const slot of editing.value.slots) {
+    if (!slot.start_time || !slot.end_time) {
+      message.warning('请补全各时段的开始/结束时间');
+      return;
+    }
+    if (!slot.capacity || slot.capacity < 1) {
+      message.warning('各时段号源数量至少为 1');
+      return;
+    }
+  }
+  ModalApi.lock();
+  try {
+    await saveShiftTemplateApi({
+      id: editing.value.id,
+      store_id: storeId.value,
+      doctor_id: editing.value.doctor_id,
+      name: editing.value.name.trim(),
+      slots: editing.value.slots,
+      status: editing.value.status,
+    });
+    message.success('模板保存成功');
+    dirty.value = true;
+    editing.value = null;
+    await fetchList();
+  } catch {
+    // 错误提示由 requestClient 统一弹出
+  } finally {
+    ModalApi.unlock();
+  }
+}
+
+/** 启用/禁用切换（直接落库，禁用后套用下拉不再显示；doctor_id 必须回传否则会把专属绑定抹成通用） */
+async function toggleStatus(row: ShiftTemplate, checked: boolean | number | string) {
+  try {
+    await saveShiftTemplateApi({
+      id: row.id,
+      store_id: storeId.value,
+      doctor_id: Number(row.doctor_id || 0),
+      name: row.name,
+      slots: row.slots,
+      status: checked ? 1 : 0,
+    });
+    dirty.value = true;
+  } finally {
+    await fetchList();
+  }
+}
+
+/** 删除模板（日排班行是时段快照，删除模板不影响已排的班） */
+async function handleDelete(row: ShiftTemplate) {
+  await deleteShiftTemplateApi(row.id, storeId.value);
+  message.success('删除成功');
+  dirty.value = true;
+  await fetchList();
+}
+
+const [Modal, ModalApi] = useVbenModal({
+  footer: false,
+  class: 'w-[560px]',
+  onOpenChange(isOpen) {
+    if (isOpen) {
+      const data = ModalApi.getData() || {};
+      storeId.value = Number(data.storeId || 0);
+      storeName.value = String(data.storeName || '');
+      doctors.value = Array.isArray(data.doctors) ? data.doctors : [];
+      editing.value = null;
+      dirty.value = false;
+      fetchList();
+    } else if (dirty.value) {
+      emit('changed');
+    }
+  },
+});
+
+defineExpose({ ModalApi });
+</script>
+
+<template>
+  <Modal :title="storeName ? `班次模板 - ${storeName}` : '班次模板'">
+    <!-- 编辑视图 -->
+    <div v-if="editing" class="tpl-edit">
+      <div class="tpl-edit__item">
+        <div class="tpl-edit__label">模板名称</div>
+        <Input
+          v-model:value="editing.name"
+          :maxlength="16"
+          placeholder="如：全天班 / 上午班 / 两班制"
+          style="width: 260px"
+        />
+      </div>
+      <div class="tpl-edit__item">
+        <div class="tpl-edit__label">适用范围</div>
+        <Select
+          v-model:value="editing.doctor_id"
+          :options="scopeOptions"
+          option-filter-prop="label"
+          show-search
+          style="width: 260px"
+        />
+        <div class="tpl-edit__hint">
+          绑定医生后成为其专属模板（一医生仅一个），「添加医生排班」勾选优先专属时按该模板的时段/号源写入
+        </div>
+      </div>
+      <div class="tpl-edit__item">
+        <div class="tpl-edit__label">班次时段</div>
+        <SlotRowsEditor v-model="editing.slots" />
+      </div>
+      <div class="tpl-edit__actions">
+        <Button @click="editing = null">返回列表</Button>
+        <Button type="primary" @click="handleSave">保存模板</Button>
+      </div>
+    </div>
+
+    <!-- 列表视图 -->
+    <div v-else class="tpl-list">
+      <div class="tpl-list__head">
+        <span class="tpl-list__count">共 {{ list.length }} 个模板</span>
+        <Button size="small" type="primary" @click="startCreate">
+          <Icon icon="lucide:plus" />
+          新增模板
+        </Button>
+      </div>
+      <Empty v-if="list.length === 0" description="暂无班次模板，点击右上角新增" />
+      <div v-for="row in list" :key="row.id" class="tpl-card">
+        <div class="tpl-card__main">
+          <div class="tpl-card__title">
+            <span class="tpl-card__name">{{ row.name }}</span>
+            <!-- 专属模板标出绑定医生，通用不加标签减少噪音 -->
+            <Tag v-if="Number(row.doctor_id || 0) > 0" color="processing">
+              专属 · {{ row.doctor_name || `医生#${row.doctor_id}` }}
+            </Tag>
+            <Tag v-if="Number(row.status) !== 1" color="default">已禁用</Tag>
+          </div>
+          <div class="tpl-card__slots">
+            <span v-for="(slot, i) in row.slots" :key="i" class="tpl-card__slot">
+              {{ slot.slot_name || `${slot.start_time}-${slot.end_time}` }}
+              {{ slot.start_time }}~{{ slot.end_time }} · {{ slot.capacity }}号
+            </span>
+          </div>
+        </div>
+        <div class="tpl-card__actions">
+          <Switch
+            :checked="Number(row.status) === 1"
+            checked-children="启用"
+            size="small"
+            un-checked-children="禁用"
+            @change="(checked: any) => toggleStatus(row, checked)"
+          />
+          <Button size="small" type="link" @click="startEdit(row)">编辑</Button>
+          <Popconfirm title="确定删除该模板吗？已排的班不受影响" @confirm="handleDelete(row)">
+            <Button danger size="small" type="link">删除</Button>
+          </Popconfirm>
+        </div>
+      </div>
+    </div>
+  </Modal>
+</template>
+
+<style scoped>
+.tpl-edit {
+  display: flex;
+  flex-direction: column;
+  gap: 14px;
+}
+
+.tpl-edit__label {
+  margin-bottom: 6px;
+  font-size: 13px;
+  font-weight: 600;
+  color: hsl(var(--foreground));
+}
+
+.tpl-edit__hint {
+  margin-top: 4px;
+  font-size: 12px;
+  line-height: 1.5;
+  color: hsl(var(--muted-foreground));
+}
+
+.tpl-edit__actions {
+  display: flex;
+  gap: 8px;
+  justify-content: flex-end;
+}
+
+.tpl-list {
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+}
+
+.tpl-list__head {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+
+.tpl-list__count {
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+}
+
+/* 模板卡片：1px 同色系边框 + 微光（禁止左侧竖色条的全局卡片规范） */
+.tpl-card {
+  display: flex;
+  gap: 10px;
+  align-items: center;
+  justify-content: space-between;
+  padding: 10px 12px;
+  background: hsl(var(--card, var(--background)));
+  border: 1px solid hsl(var(--primary) / 30%);
+  border-radius: 10px;
+  box-shadow: 0 0 6px hsl(var(--primary) / 18%);
+}
+
+.tpl-card__main {
+  min-width: 0;
+  flex: 1;
+}
+
+.tpl-card__title {
+  display: flex;
+  gap: 6px;
+  align-items: center;
+}
+
+.tpl-card__name {
+  font-size: 14px;
+  font-weight: 600;
+  color: hsl(var(--foreground));
+}
+
+.tpl-card__slots {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 6px;
+  margin-top: 6px;
+}
+
+.tpl-card__slot {
+  padding: 2px 8px;
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+  background: hsl(var(--muted) / 0.35);
+  border-radius: 6px;
+}
+
+.tpl-card__actions {
+  display: flex;
+  flex: none;
+  gap: 2px;
+  align-items: center;
+}
+</style>
diff --git a/apps/web-antd/src/views/doctor/doctor/components/schedule-calendar/SlotRowsEditor.vue b/apps/web-antd/src/views/doctor/doctor/components/schedule-calendar/SlotRowsEditor.vue
new file mode 100644
index 00000000..d9d2e3f9
--- /dev/null
+++ b/apps/web-antd/src/views/doctor/doctor/components/schedule-calendar/SlotRowsEditor.vue
@@ -0,0 +1,124 @@
+<script lang="ts" setup>
+/**
+ * 排班时段行编辑器（通用小组件）
+ * 复用场景：班次模板编辑、日历排班「自定义时段」——两处都是编辑 1~10 个
+ * 「名称 + 开始/结束时间 + 号源数」的时段行，抽出来避免复制粘贴两套一样的行编辑 UI
+ * 名称留空时后端会自动用「开始-结束」时间段命名（与 ScheduleDrawer 自定义模式约定一致）
+ */
+import type { ScheduleSlot } from '../../api/schedule';
+
+import { useVModel } from '@vueuse/core';
+
+import { Button, Input, InputNumber, message, TimePicker } from 'ant-design-vue';
+import dayjs from 'dayjs';
+
+import { Icon } from '#/components/icon';
+
+const props = defineProps<{ modelValue: ScheduleSlot[] }>();
+const emit = defineEmits<{ 'update:modelValue': [value: ScheduleSlot[]] }>();
+
+/** v-model 代理，直接对数组做增删改 */
+const slots = useVModel(props, 'modelValue', emit);
+
+/** 新增一行（上限 10 个，与后端 normalizeSlots 限制一致） */
+function addRow() {
+  if (slots.value.length >= 10) {
+    message.warning('最多支持 10 个时段');
+    return;
+  }
+  slots.value.push({ slot_name: '', start_time: '', end_time: '', capacity: 5 });
+}
+
+/** 删除一行（至少保留一个时段） */
+function removeRow(index: number) {
+  if (slots.value.length <= 1) {
+    message.warning('至少保留一个时段');
+    return;
+  }
+  slots.value.splice(index, 1);
+}
+
+/** TimePicker 变更（内部 dayjs 与 HH:mm 字符串互转） */
+function onTimeChange(slot: ScheduleSlot, key: 'end_time' | 'start_time', val: any) {
+  slot[key] = val ? dayjs(val, 'HH:mm').format('HH:mm') : '';
+}
+</script>
+
+<template>
+  <div class="slot-rows">
+    <div v-for="(slot, index) in slots" :key="index" class="slot-rows__row">
+      <Input
+        v-model:value="slot.slot_name"
+        :maxlength="16"
+        class="slot-rows__name"
+        placeholder="名称(可空)"
+        size="small"
+      />
+      <TimePicker
+        :value="slot.start_time ? dayjs(slot.start_time, 'HH:mm') : null"
+        format="HH:mm"
+        placeholder="开始"
+        size="small"
+        @update:value="(val: any) => onTimeChange(slot, 'start_time', val)"
+      />
+      <span class="slot-rows__sep">~</span>
+      <TimePicker
+        :value="slot.end_time ? dayjs(slot.end_time, 'HH:mm') : null"
+        format="HH:mm"
+        placeholder="结束"
+        size="small"
+        @update:value="(val: any) => onTimeChange(slot, 'end_time', val)"
+      />
+      <InputNumber
+        v-model:value="slot.capacity"
+        :max="999"
+        :min="1"
+        size="small"
+        style="width: 78px"
+      />
+      <span class="slot-rows__unit">个号</span>
+      <Button danger size="small" type="text" @click="removeRow(index)">
+        <Icon icon="lucide:x" />
+      </Button>
+    </div>
+    <Button block size="small" type="dashed" @click="addRow">
+      <Icon icon="lucide:plus" />
+      加时段
+    </Button>
+    <div class="slot-rows__tip">名称留空自动按时间段命名；时段之间不可重叠</div>
+  </div>
+</template>
+
+<style scoped>
+.slot-rows {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+
+.slot-rows__row {
+  display: flex;
+  gap: 6px;
+  align-items: center;
+  padding: 6px 8px;
+  background: hsl(var(--muted) / 0.25);
+  border: 1px solid hsl(var(--border));
+  border-radius: 8px;
+}
+
+.slot-rows__name {
+  width: 96px;
+  flex: none;
+}
+
+.slot-rows__sep,
+.slot-rows__unit {
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+}
+
+.slot-rows__tip {
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+}
+</style>
diff --git a/apps/web-antd/src/views/doctor/doctor/config/form.ts b/apps/web-antd/src/views/doctor/doctor/config/form.ts
index 38a26771..00ee8527 100644
--- a/apps/web-antd/src/views/doctor/doctor/config/form.ts
+++ b/apps/web-antd/src/views/doctor/doctor/config/form.ts
@@ -182,7 +182,8 @@ export const infoModalFormProps: VbenFormProps = {
       fieldName: 'mobile',
       formItemClass: 'col-span-6',
       label: '手机号码',
-      rules: 'required',
+      // 与后端 checkPhone 一致：必填 + 大陆 11 位号段
+      rules: 'mobile',
     },
     {
       component: 'VbenInput',
diff --git a/apps/web-antd/src/views/doctor/doctor/config/table.ts b/apps/web-antd/src/views/doctor/doctor/config/table.ts
index 64c48744..b2d17143 100644
--- a/apps/web-antd/src/views/doctor/doctor/config/table.ts
+++ b/apps/web-antd/src/views/doctor/doctor/config/table.ts
@@ -74,7 +74,7 @@ export const gridOptions: VxeGridProps<RowType> = {
     // custom: true, // 自定义列
     zoom: true, // 最大化最小化
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
     custom: {
       // 自定义列-图标
diff --git a/apps/web-antd/src/views/doctor/doctor/index.vue b/apps/web-antd/src/views/doctor/doctor/index.vue
index f1e42c13..b3db9fef 100644
--- a/apps/web-antd/src/views/doctor/doctor/index.vue
+++ b/apps/web-antd/src/views/doctor/doctor/index.vue
@@ -3,7 +3,7 @@ import type { VxeGridListeners } from '#/adapter/vxe-table';
 
 import { ref } from 'vue';
 
-import { Page, useVbenModal } from '@vben/common-ui';
+import { Page, useVbenDrawer, useVbenModal } from '@vben/common-ui';
 
 import { Button, message, Tag } from 'ant-design-vue';
 
@@ -19,6 +19,9 @@ import DoctorBasicInfoCell from './components/cells/DoctorBasicInfoCell.vue';
 import DoctorProfessionalInfoCell from './components/cells/DoctorProfessionalInfoCell.vue';
 import FormModalDemo from './components/modal.vue';
 import DoctorCardModal from './components/DoctorCardModal.vue';
+import ScheduleCalendarModal from './components/schedule-calendar/ScheduleCalendarModal.vue';
+import ScheduleDrawerComp from './components/ScheduleDrawer.vue';
+import StoreSettingModalComp from './components/StoreSettingModal.vue';
 import { formOptions } from './config/search';
 import { gridOptions } from './config/table';
 
@@ -67,6 +70,16 @@ const [DoctorCardModals, DoctorCardModalApi] = useVbenModal({
   connectedComponent: DoctorCardModal,
 });
 
+/** 排班设置抽屉（真排班：每天/按星期 × 全天/上下午/自定义时段） */
+const [ScheduleDrawer, ScheduleDrawerApi] = useVbenDrawer({
+  connectedComponent: ScheduleDrawerComp,
+});
+
+/** 门店统一可预约天数设置弹窗 */
+const [StoreSettingModal, StoreSettingModalApi] = useVbenModal({
+  connectedComponent: StoreSettingModalComp,
+});
+
 const showModal = (data = {}, isUpdate = false) => {
   formModalApi.setData({
     values: data,
@@ -121,6 +134,43 @@ const showDoctorCard = (row: Record<string, any>) => {
   DoctorCardModalApi.open();
 };
 
+/** 打开排班设置抽屉 */
+const showScheduleDrawer = (row: Record<string, any>) => {
+  ScheduleDrawerApi.setData({ record: row });
+  ScheduleDrawerApi.open();
+};
+
+/** 排班日历弹窗（按日期排班，锁定该医生） */
+const scheduleCalendarModalRef = ref<InstanceType<typeof ScheduleCalendarModal>>();
+
+/**
+ * 打开排班日历（锁定医生模式）
+ * 店上下文取医生关联门店（列表行已带 stores）：单店直接进，多店弹窗顶部可切换；
+ * 未关联门店时排班无模板归属也无患者入口，直接提示先绑定诊所
+ */
+const showScheduleCalendar = (row: Record<string, any>) => {
+  const stores = (Array.isArray(row.stores) ? row.stores : [])
+    .filter((s: any) => s?.store?.id)
+    .map((s: any) => ({ id: Number(s.store.id), name: String(s.store.name || '') }));
+  if (stores.length === 0) {
+    message.warning('该医生未关联任何诊所，请先绑定诊所后再排班');
+    return;
+  }
+  scheduleCalendarModalRef.value?.ModalApi?.setData({
+    storeId: stores[0]!.id,
+    storeName: stores[0]!.name,
+    storeOptions: stores,
+    lockedDoctorId: Number(row.su_id || 0),
+    lockedDoctorName: String(row.name || ''),
+  });
+  scheduleCalendarModalRef.value?.ModalApi?.open();
+};
+
+/** 打开门店统一设置弹窗 */
+const showStoreSettingModal = () => {
+  StoreSettingModalApi.open();
+};
+
 const openPcWindows = (id: number) => {
   openPcWindowsApi(id).then(() => {
     message.success('开通成功!');
@@ -151,8 +201,11 @@ const refuse = (id: number) => {
     <BindDepartModal />
     <BindTitleModal />
     <DoctorCardModals />
+    <ScheduleDrawer />
+    <ScheduleCalendarModal ref="scheduleCalendarModalRef" />
+    <StoreSettingModal />
     <Grid>
-      <template #toolbar-buttons>
+      <template #toolbar-actions>
         <TableAction
           :actions="[
             {
@@ -161,6 +214,12 @@ const refuse = (id: number) => {
               icon: 'ant-design:plus-outlined',
               onClick: showModal.bind(null),
             },
+            {
+              label: '排班统一设置',
+              type: 'default',
+              icon: 'ant-design:setting-outlined',
+              onClick: showStoreSettingModal,
+            },
           ]"
           :drop-down-actions="[]"
         >
@@ -221,6 +280,20 @@ const refuse = (id: number) => {
               size: 'small',
               onClick: showModal.bind(null, row, true),
             },
+            {
+              label: '排班设置',
+              type: 'link',
+              icon: 'ant-design:calendar-outlined',
+              size: 'small',
+              onClick: showScheduleDrawer.bind(null, row),
+            },
+            {
+              label: '排班日历',
+              type: 'link',
+              icon: 'ant-design:schedule-outlined',
+              size: 'small',
+              onClick: showScheduleCalendar.bind(null, row),
+            },
             {
               label: '开通PC端',
               type: 'link',
diff --git a/apps/web-antd/src/views/doctor/medical-record/components/EntryListPage.vue b/apps/web-antd/src/views/doctor/medical-record/components/EntryListPage.vue
index 3f7cbd1e..95f299c6 100644
--- a/apps/web-antd/src/views/doctor/medical-record/components/EntryListPage.vue
+++ b/apps/web-antd/src/views/doctor/medical-record/components/EntryListPage.vue
@@ -108,7 +108,7 @@ const gridOptions = computed(() => ({
   toolbarConfig: {
     search: true,
     refresh: true,
-    slots: { buttons: 'toolbar-buttons' },
+    slots: { buttons: 'toolbar-actions' },
   },
 }));
 
@@ -245,7 +245,7 @@ function handleSyncPinyin() {
   <Page auto-content-height :title="pageTitle">
     <FormModal />
     <Grid>
-      <template #toolbar-buttons>
+      <template #toolbar-actions>
         <TableAction
           :actions="[
             {
diff --git a/apps/web-antd/src/views/doctor/online-consultation/components/PatientExperienceCard.vue b/apps/web-antd/src/views/doctor/online-consultation/components/PatientExperienceCard.vue
index 084c1a2c..e48de900 100644
--- a/apps/web-antd/src/views/doctor/online-consultation/components/PatientExperienceCard.vue
+++ b/apps/web-antd/src/views/doctor/online-consultation/components/PatientExperienceCard.vue
@@ -304,7 +304,7 @@ const handleAddToPrescription = async () => {
 .drug-name {
   color: #d97706;
   font-weight: 600;
-  //background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%);
+  /* background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%); */
   padding: 4px 12px;
   border-radius: 6px;
   display: inline-block;
diff --git a/apps/web-antd/src/views/doctor/pharmacist/config/form.ts b/apps/web-antd/src/views/doctor/pharmacist/config/form.ts
index 1c235d18..fc9a1ecc 100644
--- a/apps/web-antd/src/views/doctor/pharmacist/config/form.ts
+++ b/apps/web-antd/src/views/doctor/pharmacist/config/form.ts
@@ -157,7 +157,8 @@ export const infoModalFormProps: VbenFormProps = {
       fieldName: 'mobile',
       formItemClass: 'col-span-6',
       label: '手机号码',
-      rules: 'required',
+      // 与后端 checkPhone 一致：必填 + 大陆 11 位号段
+      rules: 'mobile',
     },
     {
       component: 'VbenInput',
diff --git a/apps/web-antd/src/views/doctor/pharmacist/config/table.ts b/apps/web-antd/src/views/doctor/pharmacist/config/table.ts
index beb52971..14ab3be6 100644
--- a/apps/web-antd/src/views/doctor/pharmacist/config/table.ts
+++ b/apps/web-antd/src/views/doctor/pharmacist/config/table.ts
@@ -71,7 +71,7 @@ export const gridOptions: VxeGridProps<RowType> = {
     // custom: true, // 自定义列
     zoom: true, // 最大化最小化
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
     custom: {
       // 自定义列-图标
diff --git a/apps/web-antd/src/views/doctor/pharmacist/index.vue b/apps/web-antd/src/views/doctor/pharmacist/index.vue
index 8fecf6a9..a22e60b4 100644
--- a/apps/web-antd/src/views/doctor/pharmacist/index.vue
+++ b/apps/web-antd/src/views/doctor/pharmacist/index.vue
@@ -106,7 +106,7 @@ const refuse = (id: number) => {
     <BindStoreModal />
     <PharmacistDetailModal />
     <Grid>
-      <template #toolbar-buttons>
+      <template #toolbar-actions>
         <TableAction
           :actions="[
             {
diff --git a/apps/web-antd/src/views/doctor/settings/api/index.ts b/apps/web-antd/src/views/doctor/settings/api/index.ts
index 96cf0544..2a188359 100644
--- a/apps/web-antd/src/views/doctor/settings/api/index.ts
+++ b/apps/web-antd/src/views/doctor/settings/api/index.ts
@@ -327,6 +327,14 @@ export async function getDoctorMyDiseaseListApi() {
 export async function saveServicePriceApi(data: Record<string, any>) {
   return requestClient.post<any>(`${prefix}save-service-price`, data);
 }
+/**
+ * 保存每日号源上限（yii_doctor_info.register_num，0 表示不放号）
+ * xk-api POST /doctor/save-register-num
+ * @param data { register_num: number }
+ */
+export async function saveRegisterNumApi(data: { register_num: number }) {
+  return requestClient.post<any>(`${prefix}save-register-num`, data);
+}
 /**
  * 创建医嘱
  * @param content
diff --git a/apps/web-antd/src/views/doctor/settings/index.vue b/apps/web-antd/src/views/doctor/settings/index.vue
index c88b0f59..b653ea47 100644
--- a/apps/web-antd/src/views/doctor/settings/index.vue
+++ b/apps/web-antd/src/views/doctor/settings/index.vue
@@ -42,6 +42,7 @@ import {
   getDoctorMyDiseaseListApi,
   getDoctorMyDoctorOrderApi,
   getDoctorMyInfoApi,
+  saveRegisterNumApi,
   saveServicePriceApi,
 } from '#/views/doctor/settings/api';
 import type { CommonPrescriptionResponse } from '#/views/doctor/settings/api';
@@ -121,6 +122,21 @@ const saveServicePrice = () => {
     // getMyInfo();
   });
 };
+/**
+ * 保存每日号源上限
+ * register_num 在医生信息表（yii_doctor_info）上，与挂号开关/价格（yii_doctor_service）分表，
+ * 所以单独走 save-register-num 接口；0 表示不放号（患者端显示约满）
+ */
+const saveRegisterNum = () => {
+  saveRegisterNumApi({
+    register_num: data.value.register_num,
+  }).then(() => {
+    notification.success({
+      message: '保存成功',
+      duration: 2,
+    });
+  });
+};
 
 const getDoctorMyDoctorOrder = () => {
   getDoctorMyDoctorOrderApi().then((res) => {
@@ -461,6 +477,22 @@ const handleViewSignature = () => {
             【{{ data.service.register_status === 1 ? '开启' : '关闭' }}】
           </div>
 
+          <!-- 每日号源上限：挂号防超卖的额度来源，0 表示不放号（患者端显示约满） -->
+          <div class="mb-3 flex items-center gap-4">
+            每日号源上限
+            <InputNumber
+              v-model:value="data.register_num"
+              :min="0"
+              :max="999"
+              :precision="0"
+              style="min-width: 100px"
+              @keydown.enter="saveRegisterNum"
+            >
+              <template #addonAfter> 个/天 </template>
+            </InputNumber>
+            <Button type="primary" @click="saveRegisterNum">保存</Button>
+          </div>
+
           <div class="flex flex-wrap gap-2"></div>
 
           <div class="mt-4 space-y-1"></div>
diff --git a/apps/web-antd/src/views/finance/charge-cash-pay-record/api/index.ts b/apps/web-antd/src/views/finance/charge-cash-pay-record/api/index.ts
index caa0c9ae..6cd25c0b 100644
--- a/apps/web-antd/src/views/finance/charge-cash-pay-record/api/index.ts
+++ b/apps/web-antd/src/views/finance/charge-cash-pay-record/api/index.ts
@@ -8,3 +8,11 @@ const prefix = 'charge-cash-pay-record/';
 export async function getChargeCashPayRecordListApi(data: any) {
   return requestClient.get<any>(`${prefix}list`, { params: data });
 }
+
+/**
+ * 代支付手续费详情（含关联提现申请，供互通抽屉）
+ * @param id
+ */
+export async function getChargeCashPayRecordDetailApi(id: number) {
+  return requestClient.get<any>(`${prefix}detail`, { params: { id } });
+}
diff --git a/apps/web-antd/src/views/finance/charge-cash-pay-record/config/table.ts b/apps/web-antd/src/views/finance/charge-cash-pay-record/config/table.ts
index 4b162921..bb0cd854 100644
--- a/apps/web-antd/src/views/finance/charge-cash-pay-record/config/table.ts
+++ b/apps/web-antd/src/views/finance/charge-cash-pay-record/config/table.ts
@@ -16,20 +16,20 @@ export const gridOptions: VxeGridProps<RowType> = {
     labelField: '',
   },
   columns: [
-    // { type: 'checkbox', width: 60 },
-    { field: 'id', align: 'left', title: 'ID' },
-    { field: 'order_no', title: '挂号订单号' },
-    { field: 'store.name', title: '诊所' },
+    { field: 'id', align: 'left', title: 'ID', width: 70 },
+    { field: 'order_no', title: '提现订单号' },
+    { field: 'subject_name', title: '申请主体', slots: { default: 'subject' } },
+    { field: 'apply_cash', title: '关联提现', slots: { default: 'apply-info' }, minWidth: 140 },
     { field: 'charge_cash', title: '手续费' },
-    { field: 'status', title: '状态', slots: { default: 'status' } },
+    { field: 'status', title: '代付状态', slots: { default: 'status' } },
     { field: 'created_at', title: '记录时间' },
-    // {
-    //   type: 'html',
-    //   title: '操作',
-    //   align: 'right',
-    //   slots: { default: 'action' },
-    //   width: 200,
-    // },
+    {
+      type: 'html',
+      title: '操作',
+      align: 'right',
+      slots: { default: 'action' },
+      width: 100,
+    },
   ],
   keepSource: true,
   pagerConfig: {},
@@ -39,13 +39,8 @@ export const gridOptions: VxeGridProps<RowType> = {
   rowConfig: {
     useKey: true,
   },
-  // scrollY: {
-  //   enabled: true,
-  //   gt: 0,
-  // },
   proxyConfig: {
     ajax: {
-      // 请求后端接口方法
       query: async ({ page }, formValues) => {
         return await getChargeCashPayRecordListApi({
           page: page.currentPage,
@@ -58,24 +53,19 @@ export const gridOptions: VxeGridProps<RowType> = {
   height: 'auto',
   border: false,
   toolbarConfig: {
-    // 是否显示搜索表单控制按钮
     // @ts-ignore 正式环境时有完整的类型声明
     search: true,
-    refresh: true, // 刷新
-    print: false, // 打印
-    export: false, // 导出
-    // custom: true, // 自定义列
-    zoom: true, // 最大化最小化
+    refresh: true,
+    print: false,
+    export: false,
+    zoom: true,
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
     custom: {
-      // 自定义列-图标
       icon: 'vxe-icon-menu',
     },
   },
-  expandConfig: {
-    // expandAll: true,
-  },
+  expandConfig: {},
   showOverflow: false,
 };
diff --git a/apps/web-antd/src/views/finance/charge-cash-pay-record/index.vue b/apps/web-antd/src/views/finance/charge-cash-pay-record/index.vue
index 2b129995..7801391b 100644
--- a/apps/web-antd/src/views/finance/charge-cash-pay-record/index.vue
+++ b/apps/web-antd/src/views/finance/charge-cash-pay-record/index.vue
@@ -1,20 +1,21 @@
 <script lang="ts" setup>
-import type { VxeGridListeners } from '#/adapter/vxe-table';
-
+/**
+ * 代支付手续费记录：展示关联提现申请，详情与审核页互通
+ */
 import { ref } from 'vue';
 
-import { Page } from '@vben/common-ui';
+import { Page, useVbenModal } from '@vben/common-ui';
 
 import { Button, Tag } from 'ant-design-vue';
 
 import { useVbenVxeGrid } from '#/adapter/vxe-table';
 import { TableAction } from '#/components/table-action';
+import { getChargeCashPayRecordListApi } from '#/views/finance/charge-cash-pay-record/api';
+import StatisticsReconciliation from '#/views/finance/reconciliation/components/statistics.vue';
+import WithdrawalRelationDetail from '#/views/finance/withdrawal/components/withdrawal-relation-detail.vue';
 
 import { formOptions } from './config/search';
 import { gridOptions } from './config/table';
-import DetailModal from '#/views/business/order/product-order/components/detail.vue';
-import { getChargeCashPayRecordListApi } from '#/views/finance/charge-cash-pay-record/api';
-import StatisticsReconciliation from "#/views/finance/reconciliation/components/statistics.vue";
 
 const [Grid, gridApi] = useVbenVxeGrid({
   formOptions,
@@ -22,18 +23,21 @@ const [Grid, gridApi] = useVbenVxeGrid({
 });
 
 const statistics = ref();
+
+const [RelationDetailModal, relationDetailApi] = useVbenModal({
+  connectedComponent: WithdrawalRelationDetail,
+});
+
 const initTableAjax = () => {
   gridApi.setGridOptions({
     proxyConfig: {
       ajax: {
-        // 请求后端接口方法
         query: async ({ page }, formValues) => {
           return await getChargeCashPayRecordListApi({
             page: page.currentPage,
             pageSize: page.pageSize,
             ...formValues,
           }).then((res) => {
-            statistics.value = null;
             statistics.value = [
               {
                 title: '总销代付额',
@@ -52,20 +56,24 @@ const initTableAjax = () => {
 };
 
 initTableAjax();
+
+/** 打开提现+代付互通详情 */
+const openDetail = (id: number) => {
+  relationDetailApi.setData({ id, source: 'charge' });
+  relationDetailApi.open();
+};
 </script>
 
 <template>
   <Page auto-content-height title="代支付手续费记录">
+    <RelationDetailModal />
     <StatisticsReconciliation
       v-if="statistics"
       :statistics="statistics"
     />
     <Grid>
-      <template #toolbar-buttons>
-        <TableAction
-          :actions="[]"
-          :drop-down-actions="[]"
-        >
+      <template #toolbar-actions>
+        <TableAction :actions="[]" :drop-down-actions="[]">
           <template #more>
             <Button style="margin-left: 16px">
               批量操作
@@ -74,8 +82,25 @@ initTableAjax();
           </template>
         </TableAction>
       </template>
+      <template #subject="{ row }">
+        <div>
+          <Tag color="green">{{ row.type_txt || '-' }}</Tag>
+          <div class="mt-2">{{ row.subject_name || row.store?.name || '-' }}</div>
+        </div>
+      </template>
+      <template #apply-info="{ row }">
+        <div>申请：¥{{ row.apply_cash ?? '-' }}</div>
+        <div class="mt-1">打款：¥{{ row.true_cash ?? '-' }}</div>
+        <div class="mt-1">
+          <Tag v-if="row.apply_check_status === 1" color="purple">待审核</Tag>
+          <Tag v-else-if="row.apply_check_status === 2" color="green">审核成功</Tag>
+          <Tag v-else-if="row.apply_check_status === 3" color="error">拒绝</Tag>
+          <Tag v-else-if="row.apply_check_status === 4" color="error">提现失败</Tag>
+          <Tag v-else color="default">无申请</Tag>
+        </div>
+      </template>
       <template #status="{ row }">
-        <div class="mt-3">
+        <div>
           <Tag v-if="row.status === 1" color="purple">已记录</Tag>
           <Tag v-else-if="row.status === 2" color="green">已支付</Tag>
           <Tag v-else-if="row.status === 3" color="orange">已取消</Tag>
@@ -84,39 +109,25 @@ initTableAjax();
       <template #toolbar-tools></template>
       <template #action="{ row }">
         <TableAction
-          :actions="[]"
+          :actions="[
+            {
+              label: '详情',
+              type: 'link',
+              icon: 'mdi:file-document-outline',
+              size: 'small',
+              onClick: openDetail.bind(null, row.id),
+            },
+          ]"
         />
       </template>
     </Grid>
   </Page>
 </template>
 <style scoped lang="scss">
-.custom-list {
-  list-style-type: none;
-  padding-left: 0;
+.mt-1 {
+  margin-top: 4px;
 }
-
-.custom-list-item {
-  background-color: rgba(64, 158, 255, 0.04);
-  border-radius: 4px;
-  margin-bottom: 8px;
-  padding: 8px 12px;
-  font-size: 14px;
-  transition: background-color 0.3s;
-
-  &:hover {
-    background-color: rgba(64, 158, 255, 0.1);
-  }
-
-  &::before {
-    content: '';
-    display: inline-block;
-    width: 6px;
-    height: 6px;
-    background-color: #409eff;
-    border-radius: 50%;
-    margin-right: 8px;
-    vertical-align: middle;
-  }
+.mt-2 {
+  margin-top: 8px;
 }
 </style>
diff --git a/apps/web-antd/src/views/finance/fund-water/config/table.ts b/apps/web-antd/src/views/finance/fund-water/config/table.ts
index 82756ad1..7086296e 100644
--- a/apps/web-antd/src/views/finance/fund-water/config/table.ts
+++ b/apps/web-antd/src/views/finance/fund-water/config/table.ts
@@ -67,7 +67,7 @@ export const gridOptions: VxeGridProps<RowType> = {
     // custom: true, // 自定义列
     zoom: true, // 最大化最小化
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
     custom: {
       // 自定义列-图标
diff --git a/apps/web-antd/src/views/finance/fund-water/index.vue b/apps/web-antd/src/views/finance/fund-water/index.vue
index dabe0a0a..e496b185 100644
--- a/apps/web-antd/src/views/finance/fund-water/index.vue
+++ b/apps/web-antd/src/views/finance/fund-water/index.vue
@@ -38,7 +38,7 @@ const infoModal = (id) => {
     <OrderDetailModal />
     <StatisticsReconciliation v-if="statistics" :statistics="statistics" />
     <Grid>
-      <template #toolbar-buttons>
+      <template #toolbar-actions>
         <TableAction :actions="[]" :drop-down-actions="[]">
           <template #more>
             <Button style="margin-left: 16px">
diff --git a/apps/web-antd/src/views/finance/invoice-center/config/table.ts b/apps/web-antd/src/views/finance/invoice-center/config/table.ts
index cd1dcdf0..5c7ba057 100644
--- a/apps/web-antd/src/views/finance/invoice-center/config/table.ts
+++ b/apps/web-antd/src/views/finance/invoice-center/config/table.ts
@@ -63,7 +63,7 @@ export function createGridOptions(getStatus: () => string | number): VxeGridProp
       print: false,
       export: false,
       zoom: true,
-      slots: { buttons: 'toolbar-buttons' },
+      slots: { buttons: 'toolbar-actions' },
     },
     showOverflow: false,
   };
diff --git a/apps/web-antd/src/views/finance/invoice-center/index.vue b/apps/web-antd/src/views/finance/invoice-center/index.vue
index b1b967ec..c9986360 100644
--- a/apps/web-antd/src/views/finance/invoice-center/index.vue
+++ b/apps/web-antd/src/views/finance/invoice-center/index.vue
@@ -202,7 +202,7 @@ onMounted(() => {
       <Tabs.TabPane key="all" tab="全部" />
     </Tabs>
     <Grid>
-      <template #toolbar-buttons />
+      <template #toolbar-actions />
       <template #status="{ row }">
         <Tag :color="statusColor(row.status)">{{ row.status_text }}</Tag>
       </template>
diff --git a/apps/web-antd/src/views/finance/monthly-payment-settlement/config/table.ts b/apps/web-antd/src/views/finance/monthly-payment-settlement/config/table.ts
index 4cafb0b5..26d58eaf 100644
--- a/apps/web-antd/src/views/finance/monthly-payment-settlement/config/table.ts
+++ b/apps/web-antd/src/views/finance/monthly-payment-settlement/config/table.ts
@@ -66,7 +66,7 @@ export const gridOptions: VxeGridProps<RowType> = {
     // custom: true, // 自定义列
     zoom: true, // 最大化最小化
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
     custom: {
       // 自定义列-图标
diff --git a/apps/web-antd/src/views/finance/monthly-payment-settlement/index.vue b/apps/web-antd/src/views/finance/monthly-payment-settlement/index.vue
index 9b89609d..3ee7c417 100644
--- a/apps/web-antd/src/views/finance/monthly-payment-settlement/index.vue
+++ b/apps/web-antd/src/views/finance/monthly-payment-settlement/index.vue
@@ -39,7 +39,7 @@ const infoModal = (id) => {
     <MonthlyPaymentModal />
     <StatisticsReconciliation v-if="statistics" :statistics="statistics" />
     <Grid>
-      <template #toolbar-buttons>
+      <template #toolbar-actions>
         <TableAction :actions="[]" :drop-down-actions="[]">
           <template #more>
             <Button style="margin-left: 16px">
diff --git a/apps/web-antd/src/views/finance/monthly-payment/config/table.ts b/apps/web-antd/src/views/finance/monthly-payment/config/table.ts
index 675e6635..7db9dc3a 100644
--- a/apps/web-antd/src/views/finance/monthly-payment/config/table.ts
+++ b/apps/web-antd/src/views/finance/monthly-payment/config/table.ts
@@ -65,7 +65,7 @@ export const gridOptions: VxeGridProps<RowType> = {
     // custom: true, // 自定义列
     zoom: true, // 最大化最小化
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
     custom: {
       // 自定义列-图标
diff --git a/apps/web-antd/src/views/finance/monthly-payment/index.vue b/apps/web-antd/src/views/finance/monthly-payment/index.vue
index 33a6e93b..7e249cce 100644
--- a/apps/web-antd/src/views/finance/monthly-payment/index.vue
+++ b/apps/web-antd/src/views/finance/monthly-payment/index.vue
@@ -71,7 +71,7 @@ initTableAjax();
     <MonthlyPaymentModal />
     <StatisticsReconciliation v-if="statistics" :statistics="statistics" />
     <Grid>
-      <template #toolbar-buttons>
+      <template #toolbar-actions>
         <TableAction :actions="[
             {
               label: '结算订单',
diff --git a/apps/web-antd/src/views/finance/my-invoice/config/table.ts b/apps/web-antd/src/views/finance/my-invoice/config/table.ts
index 8701c5b0..31e60773 100644
--- a/apps/web-antd/src/views/finance/my-invoice/config/table.ts
+++ b/apps/web-antd/src/views/finance/my-invoice/config/table.ts
@@ -51,7 +51,7 @@ export const gridOptions: VxeGridProps<RowType> = {
     print: false,
     export: false,
     zoom: true,
-    slots: { buttons: 'toolbar-buttons' },
+    slots: { buttons: 'toolbar-actions' },
   },
   showOverflow: false,
 };
diff --git a/apps/web-antd/src/views/finance/my-invoice/index.vue b/apps/web-antd/src/views/finance/my-invoice/index.vue
index 837efe10..d9587b03 100644
--- a/apps/web-antd/src/views/finance/my-invoice/index.vue
+++ b/apps/web-antd/src/views/finance/my-invoice/index.vue
@@ -69,7 +69,7 @@ function openPreview(files: string[]) {
     <CompleteModalComp />
     <FilePreviewModal v-model:open="previewOpen" :files="previewFiles" title="发票预览" />
     <Grid>
-      <template #toolbar-buttons />
+      <template #toolbar-actions />
       <template #status="{ row }">
         <Tag :color="partyStatusColor(row.status)">
           {{ row.status_text }}
diff --git a/apps/web-antd/src/views/finance/withdrawal-audit/components/WithdrawalAudit.vue b/apps/web-antd/src/views/finance/withdrawal-audit/components/WithdrawalAudit.vue
index 9ee96a41..fa036075 100644
--- a/apps/web-antd/src/views/finance/withdrawal-audit/components/WithdrawalAudit.vue
+++ b/apps/web-antd/src/views/finance/withdrawal-audit/components/WithdrawalAudit.vue
@@ -1,20 +1,28 @@
 <script lang="ts" setup>
+/**
+ * 提现审核通过/拒绝弹窗
+ * 打开时拉取申请详情预览金额与手续费，再填备注提交
+ */
 import { ref } from 'vue';
 
 import { useVbenModal } from '@vben/common-ui';
 
-import { message } from 'ant-design-vue';
+import { message, Spin, Tag } from 'ant-design-vue';
 
 import { useVbenForm } from '#/adapter/form';
 import {
   passApplicationApi,
   refuseApplicationApi,
 } from '#/views/finance/withdrawal-audit/api';
+import { getWithdrawalApplicationInfo } from '#/views/finance/withdrawal/api';
 
 import { withdrawalAudit } from '../config/form';
 
 const gridApi = ref();
-const type = ref(1);
+/** 0=通过 1=拒绝（与页面传入 modalType 一致） */
+const type = ref(0);
+const loading = ref(false);
+const preview = ref<Record<string, any> | null>(null);
 
 const [WithdrawalAuditForm, WithdrawalAuditFormApi] =
   useVbenForm(withdrawalAudit);
@@ -27,40 +35,135 @@ const [Modal, modalApi] = useVbenModal({
   },
   onConfirm: async () => {
     const formApi = WithdrawalAuditFormApi;
-    formApi.validate().then(async (e: any) => {
-      if (e.valid) {
-        const values = await formApi.getValues();
-        modalApi.setState({ loading: true, confirmLoading: true });
-        const submitApi =
-          type.value === 1 ? refuseApplicationApi : passApplicationApi;
-        submitApi(values)
-          .then(() => {
-            message.success('保存成功');
-            gridApi.value?.reload();
-            modalApi.close();
-          })
-          .finally(() => {
-            modalApi.setState({ loading: false, confirmLoading: false });
-          });
-      }
-    });
-    await formApi.validateAndSubmitForm();
+    const e = await formApi.validate();
+    if (!e.valid) return;
+    const values = await formApi.getValues();
+    modalApi.lock();
+    const submitApi =
+      type.value === 1 ? refuseApplicationApi : passApplicationApi;
+    try {
+      await submitApi(values);
+      message.success('保存成功');
+      gridApi.value?.reload();
+      modalApi.close();
+    } finally {
+      modalApi.unlock();
+    }
   },
-  onOpenChange(isOpen: boolean) {
+  async onOpenChange(isOpen: boolean) {
     gridApi.value = isOpen ? modalApi.getData()?.gridApi : null;
-    if (isOpen) {
-      const { id, modalType } = modalApi.getData<Record<string, any>>();
-      type.value = modalType;
-      WithdrawalAuditFormApi.setValues({
-        id,
-      });
+    if (!isOpen) {
+      preview.value = null;
+      return;
+    }
+    const { id, modalType } = modalApi.getData<Record<string, any>>();
+    type.value = modalType;
+    WithdrawalAuditFormApi.setValues({ id, reason: '' });
+    loading.value = true;
+    try {
+      // 审核前预览真实手续费（来自代付关联 display_charge_cash）
+      preview.value = await getWithdrawalApplicationInfo(id);
+    } finally {
+      loading.value = false;
     }
   },
 });
+
+function formatMoney(val: any) {
+  const n = Number(val || 0);
+  return Number.isFinite(n) ? n.toFixed(2) : '0.00';
+}
 </script>
 
 <template>
-  <Modal :title="`提现审核【${type === 1 ? '拒绝' : '通过'}】`" class="w-[80%] md:w-[50%] lg:w-[30%] h-[60%]">
-    <WithdrawalAuditForm />
+  <Modal
+    :title="`提现审核【${type === 1 ? '拒绝' : '通过'}】`"
+    class="w-[80%] md:w-[50%] lg:w-[36%]"
+  >
+    <Spin :spinning="loading">
+      <div v-if="preview" class="audit-preview">
+        <div class="preview-row">
+          <span class="label">申请主体</span>
+          <span class="value">
+            <Tag color="green">{{ preview.user_type_txt || '-' }}</Tag>
+            {{
+              preview.store?.name ||
+              preview.supplier?.name ||
+              preview.delivery_warehouse?.name ||
+              preview.deliveryWarehouse?.name ||
+              (Number(preview.user_type) === 2 ? '萧康云医' : '-')
+            }}
+          </span>
+        </div>
+        <div class="preview-row">
+          <span class="label">订单号</span>
+          <span class="value mono">{{ preview.order_no || '-' }}</span>
+        </div>
+        <div class="preview-row">
+          <span class="label">申请金额</span>
+          <span class="value">¥{{ formatMoney(preview.apply_cash) }}</span>
+        </div>
+        <div class="preview-row">
+          <span class="label">打款金额</span>
+          <span class="value">¥{{ formatMoney(preview.true_cash) }}</span>
+        </div>
+        <div class="preview-row">
+          <span class="label">代付手续费</span>
+          <span class="value fee">
+            ¥{{ formatMoney(preview.display_charge_cash) }}
+            <Tag v-if="preview.charge_status_txt" class="ml-2" color="processing">
+              {{ preview.charge_status_txt }}
+            </Tag>
+          </span>
+        </div>
+      </div>
+      <WithdrawalAuditForm />
+    </Spin>
   </Modal>
 </template>
+
+<style scoped lang="scss">
+.audit-preview {
+  margin-bottom: 16px;
+  padding: 12px 14px;
+  border: 1px solid hsl(var(--border));
+  border-radius: 10px;
+  background: hsl(var(--muted) / 0.25);
+}
+
+.preview-row {
+  display: flex;
+  justify-content: space-between;
+  gap: 12px;
+  margin-bottom: 8px;
+  font-size: 13px;
+
+  &:last-child {
+    margin-bottom: 0;
+  }
+}
+
+.label {
+  flex-shrink: 0;
+  color: hsl(var(--muted-foreground));
+}
+
+.value {
+  text-align: right;
+  color: hsl(var(--foreground));
+  word-break: break-all;
+}
+
+.value.mono {
+  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
+}
+
+.value.fee {
+  font-weight: 600;
+  color: hsl(var(--primary));
+}
+
+.ml-2 {
+  margin-left: 8px;
+}
+</style>
diff --git a/apps/web-antd/src/views/finance/withdrawal-audit/config/table.ts b/apps/web-antd/src/views/finance/withdrawal-audit/config/table.ts
index bc306b08..74511862 100644
--- a/apps/web-antd/src/views/finance/withdrawal-audit/config/table.ts
+++ b/apps/web-antd/src/views/finance/withdrawal-audit/config/table.ts
@@ -21,7 +21,7 @@ export const gridOptions: VxeGridProps<RowType> = {
     { field: 'order_no', title: '订单号' },
     { field: 'apply_cash', title: '申请金额' },
     { field: 'true_cash', title: '打款金额' },
-    { field: 'charge_cash', title: '手续费' },
+    { field: 'display_charge_cash', title: '手续费', slots: { default: 'charge-cash' } },
     { field: 'check_id', title: '审核信息', slots: { default: 'check-id' } },
     { field: 'dakuan_status', title: '打款信息', slots: { default: 'dakuan-status'} },
     { field: 'apply_time', title: '申请时间' },
@@ -69,7 +69,7 @@ export const gridOptions: VxeGridProps<RowType> = {
     // custom: true, // 自定义列
     zoom: true, // 最大化最小化
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
     custom: {
       // 自定义列-图标
diff --git a/apps/web-antd/src/views/finance/withdrawal-audit/index.vue b/apps/web-antd/src/views/finance/withdrawal-audit/index.vue
index cc8f8a3b..86637719 100644
--- a/apps/web-antd/src/views/finance/withdrawal-audit/index.vue
+++ b/apps/web-antd/src/views/finance/withdrawal-audit/index.vue
@@ -1,15 +1,19 @@
 <script lang="ts" setup>
+/**
+ * 提现审核列表：通过/拒绝 + 详情（与代付手续费互通）
+ */
 import { ref } from 'vue';
 
 import { Page, useVbenModal } from '@vben/common-ui';
 
-import {Button, message, Tag} from 'ant-design-vue';
+import { Button, Tag } from 'ant-design-vue';
 
 import { useVbenVxeGrid } from '#/adapter/vxe-table';
 import { TableAction } from '#/components/table-action';
-import WithdrawalAudit from './components/WithdrawalAudit.vue';
 import StatisticsReconciliation from '#/views/finance/reconciliation/components/statistics.vue';
+import WithdrawalRelationDetail from '#/views/finance/withdrawal/components/withdrawal-relation-detail.vue';
 
+import WithdrawalAudit from './components/WithdrawalAudit.vue';
 import { formOptions } from './config/search';
 import { gridOptions } from './config/table';
 
@@ -24,27 +28,38 @@ const [WithdrawalAuditModal, WithdrawalAuditModalApi] = useVbenModal({
   connectedComponent: WithdrawalAudit,
 });
 
-const infoModal = (id, modalType = 0) => {
-  if (modalType === 0) {
-    message.info('正在开发');
-    return;
-  }
+const [RelationDetailModal, relationDetailApi] = useVbenModal({
+  connectedComponent: WithdrawalRelationDetail,
+});
+
+/**
+ * 打开审核弹窗
+ * @param id 申请 id
+ * @param modalType 0=通过 1=拒绝
+ */
+const infoModal = (id: number, modalType = 0) => {
   WithdrawalAuditModalApi.setData({
-    // 表单值
     id,
     modalType,
     gridApi,
   });
   WithdrawalAuditModalApi.open();
 };
+
+/** 打开提现+代付互通详情 */
+const openDetail = (id: number) => {
+  relationDetailApi.setData({ id, source: 'apply' });
+  relationDetailApi.open();
+};
 </script>
 
 <template>
   <Page auto-content-height title="提现审核">
     <WithdrawalAuditModal />
+    <RelationDetailModal />
     <StatisticsReconciliation v-if="statistics" :statistics="statistics" />
     <Grid>
-      <template #toolbar-buttons>
+      <template #toolbar-actions>
         <TableAction :actions="[]" :drop-down-actions="[]">
           <template #more>
             <Button style="margin-left: 16px">
@@ -66,21 +81,27 @@ const infoModal = (id, modalType = 0) => {
           }}</Tag>
         </div>
       </template>
+      <template #charge-cash="{ row }">
+        <span>{{ row.display_charge_cash ?? row.charge_cash_pay_record?.charge_cash ?? 0 }}</span>
+        <div v-if="row.charge_status_txt" class="mt-1">
+          <Tag color="processing">{{ row.charge_status_txt }}</Tag>
+        </div>
+      </template>
       <template #check-id="{ row }">
         <div v-if="row.check_id !== 0">
           <span v-if="row.is_new === 0">{{ row.check_admin?.nickname || '旧后台' }}</span>
           <span v-else-if="row.is_new === 1">{{ row.new_check_admin?.nick_name || '新后台' }}</span>
         </div>
-        <div :class="row.check_id !== 0? 'mt-3': ''">
+        <div :class="row.check_id !== 0 ? 'mt-3' : ''">
           <Tag v-if="row.check_status === 1" color="purple">待审核</Tag>
           <Tag v-else-if="row.check_status === 2" color="green">审核通过</Tag>
           <Tag v-else-if="row.check_status === 3" color="error">审核拒绝</Tag>
           <Tag v-else-if="row.check_status === 4" color="error">提现失败</Tag>
         </div>
-        <div v-if="row.check_result" :class="row.check_id !== 0? 'mt-3': ''">
+        <div v-if="row.check_result" :class="row.check_id !== 0 ? 'mt-3' : ''">
           备注：{{ row.check_result }}
         </div>
-        <div v-if="row.check_time" :class="row.check_id !== 0? 'mt-3': ''">
+        <div v-if="row.check_time" :class="row.check_id !== 0 ? 'mt-3' : ''">
           {{ row.check_time }}
         </div>
       </template>
@@ -98,14 +119,20 @@ const infoModal = (id, modalType = 0) => {
       <template #action="{ row }">
         <TableAction
           :actions="[
+            {
+              label: '详情',
+              type: 'link',
+              icon: 'mdi:file-document-outline',
+              size: 'small',
+              onClick: openDetail.bind(null, row.id),
+            },
             {
               label: '审核通过',
               type: 'link',
               icon: 'mdi:success-bold',
               ifShow: row.check_status === 1,
               size: 'small',
-              // auth: ['order', 'sys:role:detail'],
-              onClick: infoModal.bind(null, row.id),
+              onClick: infoModal.bind(null, row.id, 0),
             },
             {
               label: '拒绝审核',
@@ -113,7 +140,6 @@ const infoModal = (id, modalType = 0) => {
               icon: 'icon-park-solid:error',
               ifShow: row.check_status === 1,
               size: 'small',
-              // auth: ['order', 'sys:role:detail'],
               onClick: infoModal.bind(null, row.id, 1),
             },
           ]"
diff --git a/apps/web-antd/src/views/finance/withdrawal/components/account-info-card.vue b/apps/web-antd/src/views/finance/withdrawal/components/account-info-card.vue
new file mode 100644
index 00000000..d262560f
--- /dev/null
+++ b/apps/web-antd/src/views/finance/withdrawal/components/account-info-card.vue
@@ -0,0 +1,712 @@
+<script setup lang="ts">
+/**
+ * 提现管理账户信息卡
+ * 模拟真实银行卡质感（炭灰金质感，非蓝紫）+ 带右上角图标的玻璃质感统计岛
+ * 设计规范：fintech skeuomorphic bank card + glassmorphism stat tiles
+ */
+import { computed, ref } from 'vue';
+
+import { IconifyIcon as VbenIcon } from '@vben/icons';
+
+import { Button } from 'ant-design-vue';
+
+import { desensitize } from '#/util/tool';
+
+defineOptions({
+  name: 'AccountInfoCard',
+});
+
+const props = defineProps<{
+  /** 银行卡信息 */
+  myCard: Record<string, any> | null;
+  /** 是否门店账号（隐藏未确认收货冻结） */
+  isStoreUser: boolean;
+  /** 是否平台账号（展示累计代付手续费） */
+  isPlatformUser: boolean;
+  balance: number;
+  pendingEarnings: number;
+  totalEarnings: number;
+  withdrawnAmount: number;
+  withdrawnFrozenAmount: number;
+  frozenAmount: number;
+  /** 累计代付手续费（平台 charge） */
+  fee: number;
+}>();
+
+const emit = defineEmits<{
+  apply: [];
+  editCard: [];
+  refresh: [];
+}>();
+
+/** 鼠标在银行卡上的相对位置（用于光泽跟随），-1 表示未进入 */
+const glowX = ref(-1);
+const glowY = ref(-1);
+
+/** 尊重用户的动效偏好（accessibility: prefers-reduced-motion） */
+const prefersReduced = ref(false);
+if (typeof window !== 'undefined' && window.matchMedia) {
+  const mq = window.matchMedia('(prefers-reduced-motion: reduce)');
+  prefersReduced.value = mq.matches;
+}
+
+function onCardMove(e: MouseEvent) {
+  if (prefersReduced.value) return;
+  const el = e.currentTarget as HTMLElement;
+  const rect = el.getBoundingClientRect();
+  glowX.value = e.clientX - rect.left;
+  glowY.value = e.clientY - rect.top;
+}
+
+function onCardLeave() {
+  glowX.value = -1;
+  glowY.value = -1;
+}
+
+/** 主体展示名：优先卡上用户名，再回落到门店/供应商 */
+const subjectName = computed(() => {
+  const card = props.myCard;
+  if (!card) return '账户信息';
+  return (
+    card.user_name ||
+    card.store?.name ||
+    card.supplier?.name ||
+    card.platform?.name ||
+    '账户信息'
+  );
+});
+
+/** 脱敏卡号，无卡时占位 */
+const maskedCard = computed(() => {
+  const raw = props.myCard?.bank_card;
+  if (!raw) return '**** **** **** ----';
+  return desensitize(String(raw), 'bankCard') || '**** **** **** ----';
+});
+
+/**
+ * 组装统计岛：核心字段优先，平台额外展示累计代付手续费
+ * 每项配一个 SVG iconify 图标（规范：不用 emoji），放在卡片右上角
+ */
+const statItems = computed(() => {
+  const items: {
+    key: string;
+    label: string;
+    value: number;
+    icon: string;
+    emphasize?: boolean;
+  }[] = [
+    {
+      key: 'balance',
+      label: '可提现余额',
+      value: Number(props.balance || 0),
+      icon: 'lucide:scale',
+    },
+    {
+      key: 'reviewing',
+      label: '审核中金额',
+      value: Number(props.withdrawnFrozenAmount || 0),
+      icon: 'lucide:clock',
+    },
+    {
+      key: 'pending',
+      label: '待结算收益',
+      value: Number(props.pendingEarnings || 0),
+      icon: 'lucide:hourglass',
+    },
+    {
+      key: 'withdrawn',
+      label: '已提现金额',
+      value: Number(props.withdrawnAmount || 0),
+      icon: 'lucide:check-circle',
+    },
+    {
+      key: 'total',
+      label: '累计收益',
+      value: Number(props.totalEarnings || 0),
+      icon: 'lucide:trending-up',
+    },
+  ];
+  if (!props.isStoreUser) {
+    items.splice(3, 0, {
+      key: 'frozen',
+      label: '未确认收货冻结',
+      value: Number(props.frozenAmount || 0),
+      icon: 'lucide:snowflake',
+    });
+  }
+  if (props.isPlatformUser) {
+    items.push({
+      key: 'fee',
+      label: '累计代付手续费',
+      value: Number(props.fee || 0),
+      icon: 'lucide:receipt',
+      emphasize: true,
+    });
+  }
+  return items;
+});
+
+/** 金额展示为两位小数 */
+function formatMoney(val: number) {
+  const n = Number(val || 0);
+  return n.toFixed(2);
+}
+</script>
+
+<template>
+  <div class="account-info-card">
+    <div class="card-header">
+      <div class="header-title">
+        <span class="title-dot" />
+        {{ subjectName }} · 账户信息
+      </div>
+      <div class="header-actions">
+        <Button type="primary" size="small" @click="emit('apply')">申请提现</Button>
+        <Button size="small" @click="emit('editCard')">编辑账户</Button>
+        <Button size="small" type="text" @click="emit('refresh')">
+          <template #icon>
+            <VbenIcon icon="lucide:refresh-cw" />
+          </template>
+          刷新
+        </Button>
+      </div>
+    </div>
+
+    <!--
+      左右布局：左侧银行卡纵向撑满，右侧统计岛两列网格（平台 7 个 → 4 行，门店/供应商 5/6 个）
+      响应式：窄屏折回上下，统计岛变两列
+    -->
+    <div class="card-layout">
+      <!--
+        真实银行卡质感：
+        - 深炭灰底（#1a1d29 → #0d0f17），非蓝紫
+        - 金色细节（芯片、品牌点、分隔线），高端卡常用配色
+        - 多层：拉丝纹理 + 装饰几何 + 鼠标光泽 + 扫光
+      -->
+      <section
+        class="bank-card"
+        aria-label="银行卡信息"
+        @mousemove="onCardMove"
+        @mouseleave="onCardLeave"
+      >
+        <div class="bank-bg" />
+        <div class="bank-brush" />
+        <div class="bank-decorator decorator-a" />
+        <div class="bank-decorator decorator-b" />
+        <div
+          v-if="glowX >= 0"
+          class="bank-glow"
+          :style="{ left: `${glowX}px`, top: `${glowY}px` }"
+        />
+        <div v-if="!prefersReduced" class="bank-sheen" />
+
+        <div class="bank-content">
+          <header class="bank-row bank-row--top">
+            <div class="bank-brand">
+              <span class="bank-chip" />
+              <span class="bank-name">{{ myCard?.bank_name || '未绑定银行卡' }}</span>
+            </div>
+            <div class="bank-logo">
+              <VbenIcon icon="lucide:credit-card" />
+              <span class="bank-tag">{{ myCard?.bank_account_type_txt || '未配置' }}</span>
+            </div>
+          </header>
+
+          <div class="bank-number">{{ maskedCard }}</div>
+
+          <div class="bank-row bank-row--bottom">
+            <div class="bank-meta">
+              <VbenIcon class="bank-meta-icon" icon="lucide:user" />
+              <span class="bank-holder">{{ myCard?.bank_user_name || '-' }}</span>
+            </div>
+            <span class="bank-currency">CNY</span>
+          </div>
+
+          <div v-if="myCard?.bank_no" class="bank-row bank-row--extra">
+            <div class="bank-meta">
+              <VbenIcon class="bank-meta-icon" icon="lucide:building-2" />
+              <span class="bank-no">{{ myCard.bank_no }}</span>
+            </div>
+          </div>
+        </div>
+      </section>
+
+      <!-- 右侧统计岛：固定两列网格，平台 7 个 → 4 行 -->
+      <div class="stats-col">
+        <article
+          v-for="item in statItems"
+          :key="item.key"
+          class="stat-island"
+          :class="{ 'stat-island--fee': item.emphasize }"
+          :aria-label="item.label"
+        >
+          <div class="stat-island-glow" />
+          <!-- 右上角图标（规范：SVG 图标，固定尺寸） -->
+          <VbenIcon class="stat-icon" :icon="item.icon" />
+          <div class="stat-label">{{ item.label }}</div>
+          <div class="stat-val">
+            <span class="stat-val-prefix">¥</span>{{ formatMoney(item.value) }}
+          </div>
+        </article>
+      </div>
+    </div>
+  </div>
+</template>
+
+<style scoped lang="scss">
+.account-info-card {
+  margin-bottom: 12px;
+  padding: 14px 16px;
+  border: 1px solid hsl(var(--border));
+  border-radius: 14px;
+  background: hsl(var(--card, var(--background)));
+  box-shadow: 0 1px 2px rgb(0 0 0 / 4%);
+}
+
+.card-header {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  justify-content: space-between;
+  gap: 8px;
+  margin-bottom: 12px;
+}
+
+.header-title {
+  display: inline-flex;
+  align-items: center;
+  gap: 8px;
+  font-size: 15px;
+  font-weight: 600;
+  color: hsl(var(--foreground));
+}
+
+.title-dot {
+  width: 4px;
+  height: 16px;
+  border-radius: 2px;
+  /* 金色，呼应银行卡金质感 */
+  background: linear-gradient(180deg, #d4a73a 0%, #b88a2a 100%);
+}
+
+.header-actions {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: 6px;
+}
+
+/* ===== 左右布局：左侧银行卡收紧，右侧统计岛一行四个 ===== */
+.card-layout {
+  display: flex;
+  align-items: stretch;
+  gap: 12px;
+}
+
+/* 银行卡：左侧适中宽度，纵向撑满 */
+.bank-card {
+  flex: 0 0 360px;
+  min-width: 0;
+}
+
+/* 统计岛列：右侧一行四个，自动折行 */
+.stats-col {
+  display: grid;
+  grid-template-columns: repeat(4, minmax(0, 1fr));
+  gap: 10px;
+  flex: 1 1 auto;
+  min-width: 0;
+}
+
+/* 窄屏：折回上下，银行卡在上 */
+@media (max-width: 1199px) {
+  .card-layout {
+    flex-direction: column;
+  }
+
+  .bank-card {
+    flex: 1 1 auto;
+  }
+
+  .stats-col {
+    grid-template-columns: repeat(4, minmax(0, 1fr));
+  }
+}
+
+@media (max-width: 767px) {
+  .stats-col {
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+  }
+}
+
+/* ===== 银行卡：炭灰金质感（模拟真实银行卡） ===== */
+.bank-card {
+  position: relative;
+  overflow: hidden;
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+  padding: 16px 18px;
+  border-radius: 14px;
+  color: #f5f5f7;
+  isolation: isolate;
+  cursor: default;
+  transition: transform 0.25s ease, box-shadow 0.25s ease;
+  box-shadow:
+    0 8px 20px rgb(0 0 0 / 30%),
+    0 2px 6px rgb(0 0 0 / 20%);
+}
+
+.bank-card:hover {
+  transform: translateY(-2px);
+  box-shadow:
+    0 14px 28px rgb(0 0 0 / 40%),
+    0 4px 10px rgb(0 0 0 / 25%);
+}
+
+/* 底层：深炭灰渐变，模拟高端银行卡底色 */
+.bank-bg {
+  position: absolute;
+  inset: 0;
+  z-index: 0;
+  background: linear-gradient(135deg, #2a2d3a 0%, #1a1d29 45%, #0d0f17 100%);
+}
+
+/* 暗色模式：略提亮以保持对比 */
+.dark .bank-bg {
+  background: linear-gradient(135deg, #353846 0%, #252836 45%, #161821 100%);
+}
+
+/* 拉丝纹理（极淡），增强材质感 */
+.bank-brush {
+  position: absolute;
+  inset: 0;
+  z-index: 0;
+  background:
+    repeating-linear-gradient(
+      90deg,
+      rgb(255 255 255 / 0.012) 0px,
+      rgb(255 255 255 / 0.012) 1px,
+      transparent 1px,
+      transparent 3px
+    );
+  pointer-events: none;
+}
+
+/* 顶部金色高光 + 底部暗影 */
+.bank-bg::before {
+  content: '';
+  position: absolute;
+  inset: 0;
+  background:
+    radial-gradient(120% 80% at 0% 0%, rgb(212 167 58 / 14%), transparent 55%),
+    radial-gradient(100% 80% at 100% 100%, rgb(0 0 0 / 35%), transparent 60%);
+}
+
+/* 装饰几何 */
+.bank-decorator {
+  position: absolute;
+  border-radius: 50%;
+  pointer-events: none;
+  z-index: 0;
+}
+
+.decorator-a {
+  top: -40px;
+  right: -30px;
+  width: 150px;
+  height: 150px;
+  border: 20px solid rgb(212 167 58 / 8%);
+}
+
+.decorator-b {
+  bottom: -55px;
+  right: 50px;
+  width: 110px;
+  height: 110px;
+  border: 16px solid rgb(255 255 255 / 5%);
+}
+
+/* 鼠标光泽跟随（毛玻璃质感的核心） */
+.bank-glow {
+  position: absolute;
+  width: 220px;
+  height: 220px;
+  pointer-events: none;
+  z-index: 1;
+  transform: translate(-50%, -50%);
+  background: radial-gradient(
+    circle,
+    rgb(255 255 255 / 18%) 0%,
+    rgb(255 255 255 / 6%) 35%,
+    transparent 70%
+  );
+  mix-blend-mode: screen;
+  filter: blur(2px);
+}
+
+/* 周期扫光（金色，更克制） */
+.bank-sheen {
+  position: absolute;
+  top: 0;
+  left: -60%;
+  z-index: 2;
+  width: 60%;
+  height: 100%;
+  pointer-events: none;
+  background: linear-gradient(
+    100deg,
+    transparent 0%,
+    rgb(212 167 58 / 14%) 50%,
+    transparent 100%
+  );
+  transform: skewX(-18deg);
+  animation: bank-sheen 6s ease-in-out infinite;
+}
+
+@keyframes bank-sheen {
+  0%,
+  60% {
+    left: -60%;
+  }
+  100% {
+    left: 130%;
+  }
+}
+
+.bank-content {
+  position: relative;
+  z-index: 3;
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+}
+
+.bank-row {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 8px;
+}
+
+.bank-brand {
+  display: inline-flex;
+  align-items: center;
+  gap: 8px;
+  min-width: 0;
+}
+
+/* 金色芯片，模拟实体卡芯片 */
+.bank-chip {
+  flex-shrink: 0;
+  width: 24px;
+  height: 18px;
+  border-radius: 3px;
+  background: linear-gradient(135deg, #f0d27a 0%, #c89a35 50%, #a37c28 100%);
+  box-shadow:
+    inset 0 0 0 1px rgb(0 0 0 / 25%),
+    inset 0 -2px 4px rgb(0 0 0 / 20%);
+  position: relative;
+}
+
+/* 芯片纹理 */
+.bank-chip::after {
+  content: '';
+  position: absolute;
+  inset: 3px 4px;
+  border-left: 1px solid rgb(0 0 0 / 30%);
+  border-right: 1px solid rgb(0 0 0 / 30%);
+}
+
+.bank-name {
+  overflow: hidden;
+  font-size: 14px;
+  font-weight: 600;
+  letter-spacing: 0.4px;
+  text-overflow: ellipsis;
+  text-shadow: 0 1px 2px rgb(0 0 0 / 40%);
+  white-space: nowrap;
+}
+
+.bank-logo {
+  display: inline-flex;
+  align-items: center;
+  gap: 6px;
+  color: #d4a73a;
+}
+
+.bank-logo :deep(svg) {
+  width: 16px;
+  height: 16px;
+}
+
+.bank-tag {
+  padding: 2px 8px;
+  font-size: 11px;
+  font-weight: 500;
+  color: rgb(255 255 255 / 82%);
+  background: rgb(255 255 255 / 8%);
+  border: 1px solid rgb(212 167 58 / 30%);
+  border-radius: 999px;
+  backdrop-filter: blur(6px);
+}
+
+.bank-number {
+  font-family: 'DIN Alternate', ui-monospace, SFMono-Regular, Menlo, monospace;
+  font-size: 17px;
+  font-weight: 600;
+  letter-spacing: 2.5px;
+  text-shadow: 0 1px 3px rgb(0 0 0 / 50%);
+}
+
+.bank-row--bottom,
+.bank-row--extra {
+  font-size: 12px;
+  color: rgb(255 255 255 / 72%);
+}
+
+.bank-meta {
+  display: inline-flex;
+  align-items: center;
+  gap: 5px;
+  min-width: 0;
+}
+
+.bank-meta-icon {
+  flex-shrink: 0;
+  width: 14px;
+  height: 14px;
+  color: #d4a73a;
+}
+
+.bank-holder,
+.bank-no {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  letter-spacing: 0.5px;
+}
+
+.bank-currency {
+  flex-shrink: 0;
+  padding: 1px 6px;
+  font-size: 11px;
+  letter-spacing: 1px;
+  color: #d4a73a;
+  border: 1px solid rgb(212 167 58 / 40%);
+  border-radius: 4px;
+}
+
+/* ===== 统计岛：玻璃质感 + 右上角图标 + 淡荧光 ===== */
+.stat-island {
+  position: relative;
+  overflow: hidden;
+  padding: 14px;
+  border: 1px solid hsl(var(--border));
+  border-radius: 12px;
+  background: linear-gradient(
+    135deg,
+    hsl(var(--primary) / 0.04),
+    hsl(var(--card, var(--background)))
+  );
+  backdrop-filter: blur(8px);
+  cursor: default;
+  transition:
+    transform 0.2s ease,
+    box-shadow 0.2s ease,
+    border-color 0.2s ease;
+}
+
+.stat-island:hover {
+  transform: translateY(-3px);
+  border-color: hsl(var(--primary) / 0.4);
+  box-shadow:
+    0 8px 20px hsl(var(--primary) / 0.14),
+    0 2px 6px rgb(0 0 0 / 6%);
+}
+
+/* 角落局部高光，强化荧光感 */
+.stat-island-glow {
+  position: absolute;
+  top: -40px;
+  right: -40px;
+  width: 110px;
+  height: 110px;
+  pointer-events: none;
+  background: radial-gradient(
+    circle,
+    hsl(var(--primary) / 0.18) 0%,
+    transparent 70%
+  );
+  opacity: 0.5;
+  transition: opacity 0.2s ease;
+}
+
+.stat-island:hover .stat-island-glow {
+  opacity: 1;
+}
+
+/* 累计代付手续费：稍强荧光 + primary 色字 */
+.stat-island--fee {
+  border-color: hsl(var(--primary) / 0.3);
+  background: linear-gradient(
+    135deg,
+    hsl(var(--primary) / 0.1),
+    hsl(var(--card, var(--background)))
+  );
+}
+
+.stat-island--fee .stat-island-glow {
+  opacity: 0.85;
+}
+
+/* 右上角图标：固定 24x24，主色调 */
+.stat-icon {
+  position: absolute;
+  top: 12px;
+  right: 12px;
+  width: 24px;
+  height: 24px;
+  color: hsl(var(--primary) / 0.7);
+  transition: color 0.2s ease;
+}
+
+.stat-island:hover .stat-icon {
+  color: hsl(var(--primary));
+}
+
+.stat-island--fee .stat-icon {
+  color: hsl(var(--primary));
+}
+
+.stat-label {
+  position: relative;
+  z-index: 1;
+  margin-bottom: 6px;
+  padding-right: 32px;
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+  line-height: 1.2;
+}
+
+.stat-val {
+  position: relative;
+  z-index: 1;
+  font-family: 'DIN Alternate', ui-monospace, SFMono-Regular, Menlo, monospace;
+  font-size: 18px;
+  font-weight: 700;
+  color: hsl(var(--foreground));
+  line-height: 1.2;
+}
+
+.stat-val-prefix {
+  margin-right: 2px;
+  font-size: 12px;
+  font-weight: 500;
+  color: hsl(var(--muted-foreground));
+}
+
+.stat-island--fee .stat-val {
+  color: hsl(var(--primary));
+}
+</style>
diff --git a/apps/web-antd/src/views/finance/withdrawal/components/statistics.vue b/apps/web-antd/src/views/finance/withdrawal/components/statistics.vue
index f362d007..81ff892f 100644
--- a/apps/web-antd/src/views/finance/withdrawal/components/statistics.vue
+++ b/apps/web-antd/src/views/finance/withdrawal/components/statistics.vue
@@ -1,17 +1,19 @@
 <script setup lang="ts">
-import { ref } from 'vue';
+/**
+ * 提现管理顶部账户区：拉取余额/银行卡，渲染紧凑账户卡并挂载申请/绑卡弹窗
+ */
+import { computed, ref } from 'vue';
 
-import { type AnalysisOverviewItem, useVbenModal } from '@vben/common-ui';
-import { AnalysisOverview } from '@vben/common-ui';
-import { SvgCakeIcon } from '@vben/icons';
+import { useVbenModal } from '@vben/common-ui';
 import { useUserStore } from '@vben/stores';
 
-import { Button, Card, message } from 'ant-design-vue';
+import { message } from 'ant-design-vue';
 
 import { getAdminAccountBalance, getMyCard } from '#/views/system/admin/api';
 
-import SaveMyCard from '../components/card-modal.vue';
-import FormModalDemo from '../components/withdrawal-modal.vue';
+import AccountInfoCard from './account-info-card.vue';
+import SaveMyCard from './card-modal.vue';
+import FormModalDemo from './withdrawal-modal.vue';
 
 defineOptions({
   name: 'Statistics',
@@ -24,10 +26,13 @@ const props = defineProps({
 });
 
 const userStore = useUserStore();
+const userType = computed(() =>
+  Number((userStore.userInfo as Record<string, any> | null)?.roles?.user_type),
+);
 /** 门店账号无「未确认收货」冻结概念，不展示该卡片（提现冻结走「审核中金额」） */
-const isStoreUser =
-  Number((userStore.userInfo as Record<string, any> | null)?.roles?.user_type) ===
-  1;
+const isStoreUser = computed(() => userType.value === 1);
+/** 平台账号需展示累计代付手续费 */
+const isPlatformUser = computed(() => userType.value === 2);
 
 const balance = ref(0);
 const pendingEarnings = ref(0);
@@ -36,88 +41,37 @@ const totalEarnings = ref(0);
 const withdrawnAmount = ref(0);
 const withdrawnFrozenAmount = ref(0);
 const frozenAmount = ref(0);
-// const arrivedAmount = ref(0);
 const fee = ref(0);
-const isShow = ref(false);
-const myCard = ref();
-
-const overviewItems = ref<AnalysisOverviewItem[]>([]);
+const myCard = ref<Record<string, any> | null>(null);
 
 /**
- * 获取余额卡片列表数据
- * 门店不组装「冻结金额（用户未确认收货）」，避免把提现审核款误展示成未确认收货
+ * 拉取余额与银行卡，供账户卡展示
+ * 平台 charge 映射为累计代付手续费
  */
 function showCard() {
   showMyCard();
   getAdminAccountBalance().then((res) => {
     balance.value = res.balance;
-    pendingEarnings.value = res.pending_earnings; // 待结算
+    pendingEarnings.value = res.pending_earnings;
     settledEarnings.value = res.settled_earnings;
-    totalEarnings.value = res.total; // 累计收益
-    withdrawnAmount.value = res.withdrawn; // 已提现金额
-    withdrawnFrozenAmount.value = res.withdrawn_frozen; // 审核中金额
-    frozenAmount.value = res.frozen; // 未确认收货款（仅供应商/配送仓有意义）
-    // arrivedAmount.value = res.data.arrived_amount.toNumber();
+    totalEarnings.value = res.total;
+    withdrawnAmount.value = res.withdrawn;
+    withdrawnFrozenAmount.value = res.withdrawn_frozen;
+    frozenAmount.value = res.frozen;
     fee.value = res.charge;
-    const items: AnalysisOverviewItem[] = [
-      {
-        icon: SvgCakeIcon,
-        title: '累计收益',
-        totalTitle: '累计收益',
-        totalValue: totalEarnings.value,
-        value: totalEarnings.value,
-      },
-      {
-        icon: 'fluent-emoji:balance-scale',
-        title: '账户余额',
-        totalTitle: '账户余额',
-        totalValue: balance.value,
-        value: balance.value,
-      },
-    ];
-    // 供应商/配送仓才有确认收货前冻结；门店现金账户无此字段
-    if (!isStoreUser) {
-      items.push({
-        icon: 'game-icons:frozen-orb',
-        title: '冻结金额（用户未确认收货）',
-        totalTitle: '冻结金额（用户未确认收货）',
-        totalValue: frozenAmount.value,
-        value: frozenAmount.value,
-      });
-    }
-    items.push(
-      {
-        icon: 'fxemoji:hourglassflowingsand',
-        title: '待结算收益',
-        totalTitle: '待结算收益',
-        totalValue: pendingEarnings.value,
-        value: pendingEarnings.value,
-      },
-      {
-        icon: 'fluent-emoji:alarm-clock',
-        title: '审核中金额',
-        totalTitle: '审核中金额',
-        totalValue: withdrawnFrozenAmount.value,
-        value: withdrawnFrozenAmount.value,
-      },
-      {
-        icon: 'flat-color-icons:ok',
-        title: '已提现金额',
-        totalTitle: '已提现金额',
-        totalValue: withdrawnAmount.value,
-        value: withdrawnAmount.value,
-      },
-    );
-    overviewItems.value = items;
   });
 }
+
 function showMyCard() {
   getMyCard().then((res) => {
-    res.user_name = res?.user_name || res?.store?.name || res?.supplier?.name || res?.platform?.name;
+    res.user_name =
+      res?.user_name || res?.store?.name || res?.supplier?.name || res?.platform?.name;
     myCard.value = res;
   });
 }
+
 showCard();
+
 const [FormModal, formModalApi] = useVbenModal({
   connectedComponent: FormModalDemo,
 });
@@ -130,13 +84,8 @@ function refresh() {
   showCard();
 }
 
-function updateShowStatus() {
-  isShow.value = !isShow.value;
-}
-
 const showModal = (data = {}) => {
   formModalApi.setData({
-    // 表单值
     values: data,
     balance,
     gridApi: props.gridApi,
@@ -147,7 +96,6 @@ const showModal = (data = {}) => {
 
 const showCardModal = () => {
   saveMyCardApi.setData({
-    // 表单值
     values: myCard.value,
     balance,
     gridApi: props.gridApi,
@@ -158,20 +106,23 @@ const showCardModal = () => {
 </script>
 
 <template>
-  <Card
-    :title="`${myCard?.user_name || myCard?.store?.name || myCard?.supplier?.name}--账户信息`"
-    class="p-5"
-  >
-<!--    <template #extra>-->
-<!--      <Button type="link" @click="updateShowStatus">{{ isShow === false ? '展开' : '收起' }}</Button>-->
-<!--    </template>-->
+  <div>
     <FormModal />
     <saveMyCardModal />
-    <Button class="ml-5" type="primary" @click="showModal"> 申请提现 </Button>
-    <Button class="ml-3" type="primary" @click="showCardModal">
-      编辑账户
-    </Button>
-    <Button type="link" @click="refresh">刷新</Button>
-    <AnalysisOverview :items="overviewItems" :my-card="myCard" class="mt-5" />
-  </Card>
+    <AccountInfoCard
+      :my-card="myCard"
+      :is-store-user="isStoreUser"
+      :is-platform-user="isPlatformUser"
+      :balance="balance"
+      :pending-earnings="pendingEarnings"
+      :total-earnings="totalEarnings"
+      :withdrawn-amount="withdrawnAmount"
+      :withdrawn-frozen-amount="withdrawnFrozenAmount"
+      :frozen-amount="frozenAmount"
+      :fee="fee"
+      @apply="showModal"
+      @edit-card="showCardModal"
+      @refresh="refresh"
+    />
+  </div>
 </template>
diff --git a/apps/web-antd/src/views/finance/withdrawal/components/withdrawal-relation-detail.vue b/apps/web-antd/src/views/finance/withdrawal/components/withdrawal-relation-detail.vue
new file mode 100644
index 00000000..f17b4f1c
--- /dev/null
+++ b/apps/web-antd/src/views/finance/withdrawal/components/withdrawal-relation-detail.vue
@@ -0,0 +1,332 @@
+<script lang="ts" setup>
+/**
+ * 提现申请 ↔ 代付手续费 互通详情弹窗
+ * 两边列表共用，按 source 拉取对应详情并展示完整关联信息
+ */
+import { computed, ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+
+import { Spin, Tag } from 'ant-design-vue';
+
+import { getChargeCashPayRecordDetailApi } from '#/views/finance/charge-cash-pay-record/api';
+import { getWithdrawalApplicationInfo } from '#/views/finance/withdrawal/api';
+
+defineOptions({
+  name: 'WithdrawalRelationDetail',
+});
+
+const loading = ref(false);
+/** 归一化后的展示数据 */
+const view = ref<Record<string, any> | null>(null);
+
+const [Modal, modalApi] = useVbenModal({
+  footer: false,
+  draggable: true,
+  onOpenChange(isOpen) {
+    if (isOpen) {
+      loadDetail();
+    } else {
+      view.value = null;
+    }
+  },
+});
+
+const heroAmount = computed(() => {
+  const v = view.value;
+  if (!v) return '0.00';
+  return formatMoney(v.true_cash ?? v.apply_cash ?? 0);
+});
+
+const checkStatusColor = computed(() => {
+  const s = Number(view.value?.check_status ?? 0);
+  if (s === 2) return 'success';
+  if (s === 3 || s === 4) return 'error';
+  return 'warning';
+});
+
+/**
+ * 按入口源加载：apply 走提现详情，charge 走代付详情再归一化
+ */
+async function loadDetail() {
+  const data = modalApi.getData<{
+    id: number;
+    source: 'apply' | 'charge';
+  }>();
+  if (!data?.id) return;
+  loading.value = true;
+  try {
+    if (data.source === 'charge') {
+      const res = await getChargeCashPayRecordDetailApi(data.id);
+      view.value = normalizeFromCharge(res);
+    } else {
+      const res = await getWithdrawalApplicationInfo(data.id);
+      view.value = normalizeFromApply(res);
+    }
+  } finally {
+    loading.value = false;
+  }
+}
+
+/** 从提现申请详情归一化 */
+function normalizeFromApply(res: Record<string, any>) {
+  const charge =
+    res?.charge_cash_pay_record || res?.chargeCashPayRecord || null;
+  return {
+    order_no: res?.order_no,
+    apply_id: res?.id,
+    charge_id: charge?.id,
+    apply_cash: res?.apply_cash,
+    true_cash: res?.true_cash,
+    display_charge_cash: res?.display_charge_cash ?? charge?.charge_cash ?? 0,
+    check_status: res?.check_status,
+    check_status_txt: res?.check_status_txt,
+    check_result: res?.check_result,
+    check_time: res?.check_time,
+    apply_time: res?.apply_time,
+    dakuan_status: res?.dakuan_status,
+    dakuan_status_txt: res?.dakuan_status_txt,
+    dakuan_time: res?.dakuan_time,
+    user_type_txt: res?.user_type_txt,
+    subject_name:
+      res?.store?.name ||
+      res?.supplier?.name ||
+      res?.delivery_warehouse?.name ||
+      res?.deliveryWarehouse?.name ||
+      (Number(res?.user_type) === 2 ? '萧康云医' : '-'),
+    charge_status: res?.charge_status ?? charge?.status,
+    charge_status_txt: res?.charge_status_txt,
+    charge_created_at: charge?.created_at,
+  };
+}
+
+/** 从代付记录详情归一化 */
+function normalizeFromCharge(res: Record<string, any>) {
+  const apply = res?.cash_apply || res?.cashApply || null;
+  return {
+    order_no: res?.order_no,
+    apply_id: res?.apply_id || apply?.id,
+    charge_id: res?.id,
+    apply_cash: res?.apply_cash ?? apply?.apply_cash,
+    true_cash: res?.true_cash ?? apply?.true_cash,
+    display_charge_cash: res?.charge_cash,
+    check_status: res?.apply_check_status ?? apply?.check_status,
+    check_status_txt: res?.apply_check_status_txt,
+    check_result: apply?.check_result,
+    check_time: apply?.check_time,
+    apply_time: apply?.apply_time,
+    dakuan_status: res?.apply_dakuan_status ?? apply?.dakuan_status,
+    dakuan_status_txt: res?.apply_dakuan_status_txt,
+    dakuan_time: apply?.dakuan_time,
+    user_type_txt: res?.type_txt,
+    subject_name: res?.subject_name || '-',
+    charge_status: res?.status,
+    charge_status_txt: res?.status_txt,
+    charge_created_at: res?.created_at,
+  };
+}
+
+function formatMoney(val: any) {
+  const n = Number(val || 0);
+  return Number.isFinite(n) ? n.toFixed(2) : '0.00';
+}
+
+function chargeTagColor(status: number) {
+  if (status === 2) return 'success';
+  if (status === 3) return 'default';
+  return 'processing';
+}
+</script>
+
+<template>
+  <Modal class="w-[640px]" title="提现与代付详情">
+    <Spin :spinning="loading">
+      <div v-if="view" class="relation-detail">
+        <div class="hero">
+          <div class="hero-label">打款金额（元）</div>
+          <div class="hero-amount">{{ heroAmount }}</div>
+          <div class="hero-tags">
+            <Tag :color="checkStatusColor">
+              {{ view.check_status_txt || '未知审核状态' }}
+            </Tag>
+            <Tag :color="chargeTagColor(Number(view.charge_status || 0))">
+              手续费{{ view.charge_status_txt || '无记录' }}
+            </Tag>
+          </div>
+        </div>
+
+        <div class="section">
+          <div class="section-title">提现申请</div>
+          <div class="rows">
+            <div class="row">
+              <span class="label">订单号</span>
+              <span class="value mono">{{ view.order_no || '-' }}</span>
+            </div>
+            <div class="row">
+              <span class="label">申请主体</span>
+              <span class="value">
+                {{ view.user_type_txt || '-' }} · {{ view.subject_name || '-' }}
+              </span>
+            </div>
+            <div class="row">
+              <span class="label">申请金额</span>
+              <span class="value">¥{{ formatMoney(view.apply_cash) }}</span>
+            </div>
+            <div class="row">
+              <span class="label">打款金额</span>
+              <span class="value">¥{{ formatMoney(view.true_cash) }}</span>
+            </div>
+            <div class="row">
+              <span class="label">申请时间</span>
+              <span class="value">{{ view.apply_time || '-' }}</span>
+            </div>
+            <div class="row">
+              <span class="label">打款状态</span>
+              <span class="value">{{ view.dakuan_status_txt || '-' }}</span>
+            </div>
+            <div v-if="view.dakuan_time" class="row">
+              <span class="label">打款时间</span>
+              <span class="value">{{ view.dakuan_time }}</span>
+            </div>
+            <div v-if="view.check_result" class="row">
+              <span class="label">审核说明</span>
+              <span
+                class="value"
+                :class="{ danger: Number(view.check_status) === 3 }"
+              >
+                {{ view.check_result }}
+              </span>
+            </div>
+          </div>
+        </div>
+
+        <div class="section section--fee">
+          <div class="section-title">代付手续费</div>
+          <div class="rows">
+            <div class="row">
+              <span class="label">手续费金额</span>
+              <span class="value fee">
+                ¥{{ formatMoney(view.display_charge_cash) }}
+              </span>
+            </div>
+            <div class="row">
+              <span class="label">代付状态</span>
+              <span class="value">{{ view.charge_status_txt || '无关联记录' }}</span>
+            </div>
+            <div class="row">
+              <span class="label">记录时间</span>
+              <span class="value">{{ view.charge_created_at || '-' }}</span>
+            </div>
+            <div class="row">
+              <span class="label">代付记录ID</span>
+              <span class="value">{{ view.charge_id || '-' }}</span>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div v-else-if="!loading" class="empty">暂无详情</div>
+    </Spin>
+  </Modal>
+</template>
+
+<style scoped lang="scss">
+.relation-detail {
+  padding: 4px 4px 8px;
+}
+
+.hero {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  margin-bottom: 20px;
+  padding: 16px 12px;
+  border-radius: 12px;
+  background: hsl(var(--muted) / 0.35);
+}
+
+.hero-label {
+  margin-bottom: 6px;
+  font-size: 13px;
+  color: hsl(var(--muted-foreground));
+}
+
+.hero-amount {
+  margin-bottom: 10px;
+  font-family: 'DIN Alternate', ui-monospace, SFMono-Regular, Menlo, monospace;
+  font-size: 32px;
+  font-weight: 700;
+  color: hsl(var(--foreground));
+  line-height: 1.1;
+}
+
+.hero-tags {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 6px;
+  justify-content: center;
+}
+
+.section {
+  margin-bottom: 14px;
+  padding: 12px 14px;
+  border: 1px solid hsl(var(--border));
+  border-radius: 10px;
+  background: hsl(var(--card, var(--background)));
+}
+
+.section--fee {
+  border-color: hsl(var(--primary) / 0.3);
+  background: hsl(var(--primary) / 0.06);
+}
+
+.section-title {
+  margin-bottom: 10px;
+  font-size: 13px;
+  font-weight: 600;
+  color: hsl(var(--foreground));
+}
+
+.rows {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+
+.row {
+  display: flex;
+  justify-content: space-between;
+  gap: 12px;
+  font-size: 13px;
+  line-height: 1.4;
+}
+
+.label {
+  flex-shrink: 0;
+  color: hsl(var(--muted-foreground));
+}
+
+.value {
+  text-align: right;
+  color: hsl(var(--foreground));
+  word-break: break-all;
+}
+
+.value.mono {
+  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
+}
+
+.value.fee {
+  font-weight: 600;
+  color: hsl(var(--primary));
+}
+
+.value.danger {
+  color: hsl(var(--destructive, 0 84% 60%));
+}
+
+.empty {
+  padding: 32px 0;
+  text-align: center;
+  color: hsl(var(--muted-foreground));
+}
+</style>
diff --git a/apps/web-antd/src/views/finance/withdrawal/config/account-change-table.ts b/apps/web-antd/src/views/finance/withdrawal/config/account-change-table.ts
index 1f3df4e5..c94b84b4 100644
--- a/apps/web-antd/src/views/finance/withdrawal/config/account-change-table.ts
+++ b/apps/web-antd/src/views/finance/withdrawal/config/account-change-table.ts
@@ -49,7 +49,7 @@ export const accountChangeGridOptions: VxeGridProps = {
     export: false,
     zoom: true,
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
   },
   showOverflow: false,
diff --git a/apps/web-antd/src/views/finance/withdrawal/config/settlement-table.ts b/apps/web-antd/src/views/finance/withdrawal/config/settlement-table.ts
index 2fe7d711..7cc3839f 100644
--- a/apps/web-antd/src/views/finance/withdrawal/config/settlement-table.ts
+++ b/apps/web-antd/src/views/finance/withdrawal/config/settlement-table.ts
@@ -67,7 +67,7 @@ export const gridOptions2: VxeGridProps<RowType> = {
     // custom: true, // 自定义列
     zoom: true, // 最大化最小化
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
     custom: {
       // 自定义列-图标
@@ -134,7 +134,7 @@ export const gridOptions3: VxeGridProps<RowType> = {
     // custom: true, // 自定义列
     zoom: true, // 最大化最小化
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
     custom: {
       // 自定义列-图标
diff --git a/apps/web-antd/src/views/finance/withdrawal/config/table.ts b/apps/web-antd/src/views/finance/withdrawal/config/table.ts
index 094db2b9..3e88e273 100644
--- a/apps/web-antd/src/views/finance/withdrawal/config/table.ts
+++ b/apps/web-antd/src/views/finance/withdrawal/config/table.ts
@@ -33,7 +33,7 @@ export const gridOptions: VxeGridProps<RowType> = {
     { field: 'user_id', title: '名称', slots: { default: 'user_id' } },
     { field: 'apply_cash', title: '申请金额' },
     { field: 'true_cash', title: '实际到账金额' },
-    { field: 'charge_cash', title: '手续费' },
+    { field: 'display_charge_cash', title: '手续费' },
     { field: 'apply_time', title: '申请时间' },
     { field: 'check_id', title: '审核人', slots: { default: 'check_id' } },
     {
@@ -85,7 +85,7 @@ export const gridOptions: VxeGridProps<RowType> = {
     // custom: true, // 自定义列
     zoom: true, // 最大化最小化
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
     custom: {
       // 自定义列-图标
diff --git a/apps/web-antd/src/views/finance/withdrawal/index.vue b/apps/web-antd/src/views/finance/withdrawal/index.vue
index a3a34f5d..01690c1f 100644
--- a/apps/web-antd/src/views/finance/withdrawal/index.vue
+++ b/apps/web-antd/src/views/finance/withdrawal/index.vue
@@ -1,17 +1,16 @@
 <script lang="ts" setup>
+/**
+ * 提现管理页
+ * 顶部账户信息卡（银行卡质感）+ 四个记录列表（统一走 useVbenVxeGrid 封装）
+ * 状态列统一用主题化状态胶囊（StatusPill 样式），金额涨跌用 --success/--destructive 变量，全量适配暗色
+ */
 import { ref } from 'vue';
 import { useRouter } from 'vue-router';
 
 import { AnalysisChartsTabs, Page, useVbenModal } from '@vben/common-ui';
+import { IconifyIcon as VbenIcon } from '@vben/icons';
 
-import { ArrowDownOutlined, ArrowUpOutlined } from '@ant-design/icons-vue';
-import {
-  FloatButton,
-  FloatButtonGroup,
-  message,
-  Popover,
-  Tag,
-} from 'ant-design-vue';
+import { FloatButton, FloatButtonGroup, message, Popover } from 'ant-design-vue';
 
 import { useVbenVxeGrid } from '#/adapter/vxe-table';
 import { TableAction } from '#/components/table-action';
@@ -95,6 +94,23 @@ const isShow = ref(true);
 function updateShowStatus() {
   isShow.value = !isShow.value;
 }
+
+/**
+ * 审核状态 → 胶囊配色映射
+ * 1待审核=warning 2审核成功=success 3拒绝=danger，统一走主题变量适配暗色
+ */
+function checkStatusPill(status: number) {
+  if (status === 2) return { cls: 'is-success', text: '审核成功' };
+  if (status === 3) return { cls: 'is-danger', text: '已拒绝' };
+  return { cls: 'is-warning', text: '待审核' };
+}
+
+/** 打款状态 → 胶囊配色映射：-1失败 0处理中 1成功 */
+function dakuanStatusPill(status: number) {
+  if (status === 1) return { cls: 'is-success', text: '打款成功' };
+  if (status === -1) return { cls: 'is-danger', text: '打款失败' };
+  return { cls: 'is-info', text: '处理中' };
+}
 </script>
 
 <template>
@@ -106,47 +122,55 @@ function updateShowStatus() {
     <OrderDetailModal />
     <Statistics v-show="isShow" :grid-api="GridApi" />
 
-    <div style="min-height: 500px">
-
-      <AnalysisChartsTabs :tabs="chartTabs" class="mt-5">
+    <div class="withdrawal-lists" style="min-height: 500px">
+      <AnalysisChartsTabs :tabs="chartTabs" class="mt-3">
         <template #trends>
           <div style="min-height: 500px">
             <Grid>
-              <template #toolbar-buttons></template>
+              <template #toolbar-actions></template>
               <template #toolbar-tools></template>
               <template #user_id="{ row }">
                 <span v-if="row.user_type === 1">{{ row.store?.name }}</span>
                 <span v-else-if="row.user_type === 2">萧康平台</span>
                 <span v-else-if="row.user_type === 3">{{
-                    row.supplier?.name
-                  }}</span>
+                  row.supplier?.name
+                }}</span>
                 <span v-else-if="row.user_type === 4">{{
-                    row.delivery_warehouse?.name || row.deliveryWarehouse?.name
-                  }}</span>
+                  row.delivery_warehouse?.name || row.deliveryWarehouse?.name
+                }}</span>
                 <span v-else>-</span>
               </template>
               <template #check_status="{ row }">
-                <Tag v-if="row.check_status === 1" color="blue">待审核</Tag>
-                <Tag v-else-if="row.check_status === 2" color="green">
-                  审核成功
-                </Tag>
-                <Tag v-else-if="row.check_status === 3" color="red">拒绝</Tag>
+                <span
+                  class="status-pill"
+                  :class="checkStatusPill(row.check_status).cls"
+                >
+                  <i class="pill-dot" />
+                  {{ checkStatusPill(row.check_status).text }}
+                </span>
               </template>
               <template #check_result="{ row }">
-                <Tag v-if="row.check_status === 2" color="green">
+                <span
+                  v-if="row.check_status === 2 || row.check_status === 3"
+                  class="status-pill"
+                  :class="row.check_status === 2 ? 'is-success' : 'is-danger'"
+                >
+                  <i class="pill-dot" />
                   {{ row.check_result }}
-                </Tag>
-                <Tag v-else-if="row.check_status === 3" color="red">
-                  {{ row.check_result }}
-                </Tag>
+                </span>
+                <span v-else class="cell-muted">-</span>
               </template>
               <template #dakuan_status="{ row }">
-                <span v-if="row.dakuan_status === -1">打款失败</span>
-                <span v-else-if="row.dakuan_status === 0">处理中</span>
-                <span v-else-if="row.dakuan_status === 1">打款成功</span>
+                <span
+                  class="status-pill"
+                  :class="dakuanStatusPill(row.dakuan_status).cls"
+                >
+                  <i class="pill-dot" />
+                  {{ dakuanStatusPill(row.dakuan_status).text }}
+                </span>
               </template>
               <template #check_id="{ row }">
-              <span>{{
+                <span>{{
                   row.check_admin?.username ||
                   row.check_admin?.nick_name ||
                   '暂无'
@@ -161,24 +185,24 @@ function updateShowStatus() {
         <template #visits>
           <div style="min-height: 500px">
             <Grid3>
-              <template #toolbar-buttons></template>
+              <template #toolbar-actions></template>
               <template #toolbar-tools></template>
               <template #action="{ row }">
                 <TableAction
                   :actions="[
-                  {
-                    label: '查看明细',
-                    type: 'link',
-                    size: 'small',
-                    onClick: showSettlementDetail.bind(null, row),
-                  },
-                  {
-                    label: '订单详情',
-                    type: 'link',
-                    size: 'small',
-                    onClick: openOrderDetail.bind(null, row),
-                  },
-                ]"
+                    {
+                      label: '查看明细',
+                      type: 'link',
+                      size: 'small',
+                      onClick: showSettlementDetail.bind(null, row),
+                    },
+                    {
+                      label: '订单详情',
+                      type: 'link',
+                      size: 'small',
+                      onClick: openOrderDetail.bind(null, row),
+                    },
+                  ]"
                   :drop-down-actions="[]"
                 />
               </template>
@@ -189,17 +213,17 @@ function updateShowStatus() {
         <template #visitsItems>
           <div style="min-height: 500px">
             <Grid2>
-              <template #toolbar-buttons></template>
+              <template #toolbar-actions></template>
               <template #toolbar-tools></template>
               <template #user_id="{ row }">
                 <span v-if="row.user_type === 1">{{ row.store?.name }}</span>
                 <span v-else-if="row.user_type === 2">萧康平台</span>
                 <span v-else-if="row.user_type === 3">{{
-                    row.supplier?.name
-                  }}</span>
+                  row.supplier?.name
+                }}</span>
                 <span v-else-if="row.user_type === 4">{{
-                    row.delivery_warehouse?.name || row.deliveryWarehouse?.name
-                  }}</span>
+                  row.delivery_warehouse?.name || row.deliveryWarehouse?.name
+                }}</span>
                 <span v-else>-</span>
               </template>
               <template #action="{ row }">
@@ -211,48 +235,36 @@ function updateShowStatus() {
         <template #accountChange>
           <div style="min-height: 500px">
             <Grid4>
-              <template #toolbar-buttons></template>
+              <template #toolbar-actions></template>
               <template #toolbar-tools></template>
               <template #change_amount="{ row }">
-              <span
-                v-if="Number(row.change_amount) > 0"
-                style="
-                  color: #52c41a;
-                  display: flex;
-                  align-items: center;
-                  gap: 4px;
-                "
-              >
-                <ArrowUpOutlined />
-                +{{ Number(row.change_amount).toFixed(2) }}
-              </span>
-
+                <span
+                  v-if="Number(row.change_amount) > 0"
+                  class="amount-cell is-up"
+                >
+                  <VbenIcon icon="lucide:trending-up" class="amount-icon" />
+                  +{{ Number(row.change_amount).toFixed(2) }}
+                </span>
                 <span
                   v-else-if="Number(row.change_amount) < 0"
-                  style="
-                  color: #ff4d4f;
-                  display: flex;
-                  align-items: center;
-                  gap: 4px;
-                "
+                  class="amount-cell is-down"
                 >
-                <ArrowDownOutlined />
-                {{ Number(row.change_amount).toFixed(2) }}
-              </span>
-
-                <span v-else style="color: #999">0</span>
+                  <VbenIcon icon="lucide:trending-down" class="amount-icon" />
+                  {{ Number(row.change_amount).toFixed(2) }}
+                </span>
+                <span v-else class="cell-muted">0.00</span>
               </template>
               <template #action="{ row }">
                 <TableAction
                   :actions="[
-                  {
-                    label: '订单详情',
-                    type: 'link',
-                    size: 'small',
-                    ifShow: !!row.order_id,
-                    onClick: openOrderDetail.bind(null, row),
-                  },
-                ]"
+                    {
+                      label: '订单详情',
+                      type: 'link',
+                      size: 'small',
+                      ifShow: !!row.order_id,
+                      onClick: openOrderDetail.bind(null, row),
+                    },
+                  ]"
                   :drop-down-actions="[]"
                 />
               </template>
@@ -300,3 +312,83 @@ function updateShowStatus() {
     </FloatButtonGroup>
   </Page>
 </template>
+
+<style scoped lang="scss">
+/* ===== 列表区卡片壳：与账户卡同一套圆角/描边视觉 ===== */
+.withdrawal-lists {
+  :deep(.card-box) {
+    border-radius: 14px;
+    border: 1px solid hsl(var(--border));
+    box-shadow: 0 1px 2px rgb(0 0 0 / 4%);
+  }
+}
+
+/* ===== 状态胶囊：主题变量配色（success/warning/destructive），自动适配暗色 ===== */
+.status-pill {
+  display: inline-flex;
+  align-items: center;
+  gap: 5px;
+  height: 22px;
+  padding: 0 9px;
+  border-radius: 999px;
+  font-size: 12px;
+  font-weight: 500;
+  line-height: 1;
+  white-space: nowrap;
+
+  .pill-dot {
+    flex-shrink: 0;
+    width: 5px;
+    height: 5px;
+    border-radius: 50%;
+    background: currentColor;
+  }
+
+  &.is-success {
+    color: hsl(var(--success));
+    background: hsl(var(--success) / 0.12);
+  }
+
+  &.is-warning {
+    color: hsl(var(--warning));
+    background: hsl(var(--warning) / 0.14);
+  }
+
+  &.is-danger {
+    color: hsl(var(--destructive));
+    background: hsl(var(--destructive) / 0.1);
+  }
+
+  &.is-info {
+    color: hsl(var(--muted-foreground));
+    background: hsl(var(--muted) / 0.6);
+  }
+}
+
+/* ===== 资金变动金额：涨绿跌红走主题变量，数字用等宽字体对齐 ===== */
+.amount-cell {
+  display: inline-flex;
+  align-items: center;
+  gap: 4px;
+  font-family: 'DIN Alternate', ui-monospace, SFMono-Regular, Menlo, monospace;
+  font-weight: 600;
+  font-variant-numeric: tabular-nums;
+
+  &.is-up {
+    color: hsl(var(--success));
+  }
+
+  &.is-down {
+    color: hsl(var(--destructive));
+  }
+}
+
+.amount-icon {
+  width: 14px;
+  height: 14px;
+}
+
+.cell-muted {
+  color: hsl(var(--muted-foreground));
+}
+</style>
diff --git a/apps/web-antd/src/views/log/api-log/config/table.ts b/apps/web-antd/src/views/log/api-log/config/table.ts
index 3cfc7f8e..e04c164b 100644
--- a/apps/web-antd/src/views/log/api-log/config/table.ts
+++ b/apps/web-antd/src/views/log/api-log/config/table.ts
@@ -90,7 +90,7 @@ export const gridOptions: VxeGridProps<RowType> = {
     // custom: true, // 自定义列
     zoom: true, // 最大化最小化
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
     custom: {
       // 自定义列-图标
diff --git a/apps/web-antd/src/views/log/api-log/index.vue b/apps/web-antd/src/views/log/api-log/index.vue
index 10eec74f..5590284a 100644
--- a/apps/web-antd/src/views/log/api-log/index.vue
+++ b/apps/web-antd/src/views/log/api-log/index.vue
@@ -63,7 +63,7 @@ const showModal = (data = {}, isUpdate = false) => {
   <Page auto-content-height title="Api访问日志管理">
     <FormModal />
     <Grid>
-      <template #toolbar-buttons>
+      <template #toolbar-actions>
       </template>
       <template #type="{ row }">
         <Tag v-if="row.type === 0" color="green"> 访问成功 </Tag>
diff --git a/apps/web-antd/src/views/log/doctor-schedule-log/api/index.ts b/apps/web-antd/src/views/log/doctor-schedule-log/api/index.ts
new file mode 100644
index 00000000..a10e2be4
--- /dev/null
+++ b/apps/web-antd/src/views/log/doctor-schedule-log/api/index.ts
@@ -0,0 +1,20 @@
+/**
+ * 医生排班变更日志 API（只读列表/详情/动作下拉）
+ */
+import { requestClient } from '#/api/request';
+
+const prefix = 'doctor-schedule-log/';
+
+export async function getDoctorScheduleLogList(data: any) {
+  return requestClient.get<any>(`${prefix}list`, { params: data });
+}
+
+export async function getDoctorScheduleLogDetail(id: number) {
+  return requestClient.get<any>(`${prefix}detail`, { params: { id } });
+}
+
+export async function getScheduleLogActionOption() {
+  return requestClient.get<{ label: string; value: number }[]>(
+    `${prefix}action-option`,
+  );
+}
diff --git a/apps/web-antd/src/views/log/doctor-schedule-log/components/detail-modal.vue b/apps/web-antd/src/views/log/doctor-schedule-log/components/detail-modal.vue
new file mode 100644
index 00000000..d2c25a01
--- /dev/null
+++ b/apps/web-antd/src/views/log/doctor-schedule-log/components/detail-modal.vue
@@ -0,0 +1,241 @@
+<script lang="ts" setup>
+/**
+ * 排班变更日志详情：基础信息 + 结构化前后快照对照
+ * before 是「按日期分组」的原排班（无键日期=原本走默认规则），
+ * after 是本次统一应用到全部选中日期的新排班（空对象=恢复默认规则）
+ */
+import { computed, ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+
+import { Descriptions, Tag } from 'ant-design-vue';
+
+import { getDoctorScheduleLogDetail } from '../api';
+import { scheduleActionColor } from '../config/constants';
+
+const data = ref<Record<string, any>>({});
+const loading = ref(false);
+
+/** 涉及日期数组（后端 dates JSON 已解码） */
+const dates = computed<string[]>(() =>
+  Array.isArray(data.value?.dates) ? data.value.dates : [],
+);
+
+/** 变更后快照：{is_rest, slots} 或 空对象（恢复默认） */
+const after = computed<Record<string, any>>(() =>
+  data.value?.after_snapshot && typeof data.value.after_snapshot === 'object'
+    ? data.value.after_snapshot
+    : {},
+);
+
+/** 变更后是否为「恢复默认规则」（空对象） */
+const afterIsClear = computed(() => Object.keys(after.value).length === 0);
+
+/** 变更前快照：{日期: {is_rest, slots}}，转成有序数组渲染 */
+const beforeEntries = computed<Array<{ date: string; snap: Record<string, any> }>>(() => {
+  const snap = data.value?.before_snapshot;
+  if (!snap || typeof snap !== 'object') return [];
+  return Object.keys(snap)
+    .sort()
+    .map((date) => ({ date, snap: snap[date] || {} }));
+});
+
+/** 时段行文本：「上午 08:30-12:00 号源20」 */
+function slotText(slot: Record<string, any>): string {
+  const name = slot?.slot_name || '时段';
+  return `${name} ${slot?.start_time || ''}-${slot?.end_time || ''} 号源${slot?.capacity ?? 0}`;
+}
+
+const [Modal, modalApi] = useVbenModal({
+  fullscreenButton: true,
+  draggable: true,
+  showConfirmButton: false,
+  cancelText: '关闭',
+  onCancel() {
+    modalApi.close();
+  },
+  async onOpenChange(isOpen: boolean) {
+    if (!isOpen) {
+      data.value = {};
+      return;
+    }
+    const payload = modalApi.getData<{ id?: number; values?: Record<string, any> }>();
+    const id = Number(payload?.id || payload?.values?.id || 0);
+    if (id <= 0) {
+      data.value = payload?.values || {};
+      return;
+    }
+    loading.value = true;
+    modalApi.setState({ loading: true });
+    try {
+      const res = await getDoctorScheduleLogDetail(id);
+      data.value = res?.data || res || {};
+    } catch {
+      data.value = payload?.values || {};
+    } finally {
+      loading.value = false;
+      modalApi.setState({ loading: false });
+    }
+  },
+});
+</script>
+
+<template>
+  <Modal class="w-[92%] md:w-[760px]" title="排班变更详情">
+    <Descriptions
+      :column="{ xxl: 2, xl: 2, lg: 2, md: 1, sm: 1, xs: 1 }"
+      bordered
+      size="small"
+    >
+      <Descriptions.Item label="操作时间">{{ data.created_at }}</Descriptions.Item>
+      <Descriptions.Item label="操作人">
+        {{ data.operator_name || '-' }}
+        <Tag class="ml-1">{{ data.user_type_txt || '-' }}</Tag>
+      </Descriptions.Item>
+      <Descriptions.Item label="门店">{{ data.store_name || `#${data.store_id || 0}` }}</Descriptions.Item>
+      <Descriptions.Item label="医生">{{ data.doctor_name || `#${data.doctor_id || 0}` }}</Descriptions.Item>
+      <Descriptions.Item label="变更动作">
+        <Tag :color="scheduleActionColor(Number(data.action))">
+          {{ data.action_txt || data.action }}
+        </Tag>
+        <template v-if="data.template_name">「{{ data.template_name }}」</template>
+      </Descriptions.Item>
+      <Descriptions.Item label="批次号">{{ data.batch_no || '-' }}</Descriptions.Item>
+      <Descriptions.Item :span="2" label="涉及日期">
+        <div class="date-chips">
+          <Tag v-for="d in dates" :key="d">{{ d }}</Tag>
+          <span v-if="dates.length === 0">-</span>
+        </div>
+      </Descriptions.Item>
+      <Descriptions.Item v-if="data.remark" :span="2" label="备注">
+        {{ data.remark }}
+      </Descriptions.Item>
+    </Descriptions>
+
+    <!-- 前后对照：左（变更前按日期）右（变更后统一） -->
+    <div class="diff">
+      <div class="diff__col">
+        <div class="diff__head">变更前</div>
+        <div v-if="beforeEntries.length === 0" class="diff__empty">
+          所选日期原本均走默认排班规则（无单独日排班）
+        </div>
+        <div v-else class="diff__list">
+          <div v-for="item in beforeEntries" :key="item.date" class="diff__row">
+            <span class="diff__date">{{ item.date }}</span>
+            <template v-if="Number(item.snap.is_rest) === 1">
+              <Tag color="red">休诊</Tag>
+            </template>
+            <template v-else>
+              <span
+                v-for="(slot, i) in item.snap.slots || []"
+                :key="i"
+                class="diff__slot"
+              >
+                {{ slotText(slot) }}
+              </span>
+            </template>
+          </div>
+          <div class="diff__note">未列出的日期原本走默认规则</div>
+        </div>
+      </div>
+      <div class="diff__col">
+        <div class="diff__head">变更后（应用到全部选中日期）</div>
+        <div v-if="afterIsClear" class="diff__empty">恢复默认排班规则</div>
+        <template v-else>
+          <Tag v-if="Number(after.is_rest) === 1" color="red">休诊</Tag>
+          <div v-else class="diff__list">
+            <span
+              v-for="(slot, i) in after.slots || []"
+              :key="i"
+              class="diff__slot diff__slot--after"
+            >
+              {{ slotText(slot) }}
+            </span>
+          </div>
+        </template>
+      </div>
+    </div>
+  </Modal>
+</template>
+
+<style scoped>
+.date-chips {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 4px;
+  max-height: 120px;
+  overflow-y: auto;
+}
+
+.diff {
+  display: grid;
+  grid-template-columns: 1fr 1fr;
+  gap: 10px;
+  margin-top: 12px;
+}
+
+@media (max-width: 640px) {
+  .diff {
+    grid-template-columns: 1fr;
+  }
+}
+
+.diff__col {
+  padding: 10px 12px;
+  border: 1px solid hsl(var(--border));
+  border-radius: 10px;
+}
+
+.diff__head {
+  margin-bottom: 8px;
+  font-size: 13px;
+  font-weight: 600;
+  color: hsl(var(--foreground));
+}
+
+.diff__empty {
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+}
+
+.diff__list {
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+  max-height: 260px;
+  overflow-y: auto;
+}
+
+.diff__row {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 6px;
+  align-items: center;
+  font-size: 12px;
+}
+
+.diff__date {
+  min-width: 84px;
+  font-weight: 600;
+  color: hsl(var(--foreground));
+  font-variant-numeric: tabular-nums;
+}
+
+.diff__slot {
+  padding: 1px 8px;
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+  background: hsl(var(--muted) / 0.35);
+  border-radius: 6px;
+}
+
+.diff__slot--after {
+  color: hsl(var(--primary));
+  background: hsl(var(--primary) / 0.1);
+}
+
+.diff__note {
+  font-size: 11px;
+  color: hsl(var(--muted-foreground) / 0.7);
+}
+</style>
diff --git a/apps/web-antd/src/views/log/doctor-schedule-log/config/constants.ts b/apps/web-antd/src/views/log/doctor-schedule-log/config/constants.ts
new file mode 100644
index 00000000..c4b314e3
--- /dev/null
+++ b/apps/web-antd/src/views/log/doctor-schedule-log/config/constants.ts
@@ -0,0 +1,22 @@
+/**
+ * 排班变更日志字典（与后端 ScheduleLogActionEnum 对齐，接口失败时兜底）
+ */
+export const SCHEDULE_ACTION_OPTIONS = [
+  { label: '套用班次模板', value: 1 },
+  { label: '自定义时段', value: 2 },
+  { label: '设为休诊', value: 3 },
+  { label: '恢复默认规则', value: 4 },
+];
+
+/** 动作值 → Tag 颜色（休诊红、恢复灰、模板青、自定义蓝） */
+export function scheduleActionColor(action: number): string {
+  if (action === 3) return 'red';
+  if (action === 4) return 'default';
+  if (action === 1) return 'cyan';
+  return 'blue';
+}
+
+export const USER_TYPE_OPTIONS = [
+  { label: '门店', value: 1 },
+  { label: '平台', value: 2 },
+];
diff --git a/apps/web-antd/src/views/log/doctor-schedule-log/config/search.ts b/apps/web-antd/src/views/log/doctor-schedule-log/config/search.ts
new file mode 100644
index 00000000..238f4de4
--- /dev/null
+++ b/apps/web-antd/src/views/log/doctor-schedule-log/config/search.ts
@@ -0,0 +1,70 @@
+import type { VbenFormProps } from '#/adapter/form';
+
+import dayjs from 'dayjs';
+
+import { SCHEDULE_ACTION_OPTIONS } from './constants';
+
+/**
+ * 排班变更日志搜索表单
+ * 关键词模糊搜医生/操作人/门店/模板/批次号；动作精确筛；时间范围转时间戳
+ */
+export const formOptions: VbenFormProps = {
+  collapsed: false,
+  schema: [
+    {
+      component: 'VbenInput',
+      componentProps: {
+        placeholder: '医生 / 操作人 / 门店 / 模板 / 批次号',
+        allowClear: true,
+      },
+      fieldName: 'keyword',
+      label: '关键词',
+    },
+    {
+      component: 'Select',
+      componentProps: {
+        allowClear: true,
+        options: [...SCHEDULE_ACTION_OPTIONS],
+        placeholder: '全部',
+      },
+      fieldName: 'action',
+      label: '变更动作',
+    },
+    {
+      component: 'RangePicker',
+      componentProps: {
+        format: 'YYYY-MM-DD',
+        valueFormat: 'YYYY-MM-DD',
+      },
+      fieldName: 'search_time',
+      label: '操作时间',
+    },
+  ],
+  showCollapseButton: true,
+  submitButtonOptions: {
+    content: '查询',
+  },
+  submitOnChange: false,
+  submitOnEnter: true,
+};
+
+/**
+ * search_time → start_time/end_time 时间戳；清理空值参数
+ */
+export function normalizeScheduleLogFilters(
+  formValues: Record<string, any> = {},
+) {
+  const params: Record<string, any> = { ...formValues };
+  const range = params.search_time;
+  delete params.search_time;
+  if (Array.isArray(range) && range.length === 2 && range[0] && range[1]) {
+    params.start_time = dayjs(range[0]).startOf('day').unix();
+    params.end_time = dayjs(range[1]).endOf('day').unix();
+  }
+  Object.keys(params).forEach((k) => {
+    if (params[k] === '' || params[k] === undefined || params[k] === null) {
+      delete params[k];
+    }
+  });
+  return params;
+}
diff --git a/apps/web-antd/src/views/log/doctor-schedule-log/config/table.ts b/apps/web-antd/src/views/log/doctor-schedule-log/config/table.ts
new file mode 100644
index 00000000..488ed73d
--- /dev/null
+++ b/apps/web-antd/src/views/log/doctor-schedule-log/config/table.ts
@@ -0,0 +1,65 @@
+import type { VxeGridProps } from '#/adapter/vxe-table';
+
+import { getDoctorScheduleLogList } from '../api';
+import { normalizeScheduleLogFilters } from './search';
+
+/**
+ * 排班变更日志列定义：谁（操作人）在哪（门店）把谁（医生）的哪些天改成了什么（动作/模板）
+ */
+export const gridOptions: VxeGridProps<any> = {
+  columns: [
+    { field: 'id', title: 'ID', width: 70 },
+    { field: 'operator_name', title: '操作人', minWidth: 90 },
+    {
+      field: 'user_type_txt',
+      title: '端',
+      width: 70,
+      slots: { default: 'user_type' },
+    },
+    { field: 'store_name', title: '门店', minWidth: 130 },
+    { field: 'doctor_name', title: '医生', minWidth: 90 },
+    {
+      field: 'action_txt',
+      title: '变更动作',
+      width: 120,
+      slots: { default: 'action_type' },
+    },
+    { field: 'template_name', title: '班次模板', minWidth: 100 },
+    {
+      field: 'dates_count',
+      title: '涉及天数',
+      width: 90,
+      slots: { default: 'dates_count' },
+    },
+    { field: 'batch_no', title: '批次号', minWidth: 150 },
+    { field: 'created_at', title: '操作时间', width: 170 },
+    {
+      title: '操作',
+      width: 80,
+      fixed: 'right',
+      slots: { default: 'action' },
+    },
+  ],
+  keepSource: true,
+  pagerConfig: {},
+  proxyConfig: {
+    ajax: {
+      query: async ({ page }, formValues) => {
+        return await getDoctorScheduleLogList({
+          page: page.currentPage,
+          pageSize: page.pageSize,
+          ...normalizeScheduleLogFilters(formValues || {}),
+        });
+      },
+    },
+  },
+  height: 'auto',
+  toolbarConfig: {
+    search: true,
+    refresh: true,
+    zoom: true,
+    slots: {
+      buttons: 'toolbar-actions',
+    },
+  },
+};
diff --git a/apps/web-antd/src/views/log/doctor-schedule-log/index.vue b/apps/web-antd/src/views/log/doctor-schedule-log/index.vue
new file mode 100644
index 00000000..ca56d8e5
--- /dev/null
+++ b/apps/web-antd/src/views/log/doctor-schedule-log/index.vue
@@ -0,0 +1,87 @@
+<script lang="ts" setup>
+/**
+ * 医生排班变更日志列表（日志审计）
+ * 记录日历排班的每次修改：操作人、门店、医生、动作、涉及日期与前后快照；
+ * 同一次多医生批量操作通过批次号串联，详情弹窗展示前后排班对照
+ */
+import { onMounted } from 'vue';
+
+import { Page, useVbenModal } from '@vben/common-ui';
+
+import { Tag } from 'ant-design-vue';
+
+import { useVbenVxeGrid } from '#/adapter/vxe-table';
+import { TableAction } from '#/components/table-action';
+
+import { getScheduleLogActionOption } from './api';
+import DetailModal from './components/detail-modal.vue';
+import { scheduleActionColor } from './config/constants';
+import { formOptions } from './config/search';
+import { gridOptions } from './config/table';
+
+defineOptions({ name: 'DoctorScheduleLog' });
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  formOptions,
+  gridOptions,
+});
+
+const [DetailModalComp, detailModalApi] = useVbenModal({
+  connectedComponent: DetailModal,
+});
+
+/** 打开详情弹窗（传行数据兜底，详情接口失败时仍可看列表字段） */
+function openDetail(row: Record<string, any>) {
+  detailModalApi.setData({ id: Number(row?.id || 0), values: row });
+  detailModalApi.open();
+}
+
+onMounted(async () => {
+  try {
+    const opts = await getScheduleLogActionOption();
+    const options = Array.isArray(opts) ? opts : [];
+    gridApi.formApi?.updateSchema?.([
+      {
+        fieldName: 'action',
+        componentProps: { allowClear: true, options, placeholder: '全部' },
+      },
+    ]);
+  } catch {
+    // 接口失败时沿用 constants 兜底选项
+  }
+});
+</script>
+
+<template>
+  <Page auto-content-height title="排班变更日志">
+    <DetailModalComp />
+    <Grid>
+      <template #toolbar-actions />
+      <template #user_type="{ row }">
+        <Tag :color="Number(row.user_type) === 2 ? 'geekblue' : 'green'">
+          {{ row.user_type_txt || row.user_type }}
+        </Tag>
+      </template>
+      <template #action_type="{ row }">
+        <Tag :color="scheduleActionColor(Number(row.action))">
+          {{ row.action_txt || row.action }}
+        </Tag>
+      </template>
+      <template #dates_count="{ row }">
+        {{ row.dates_count || (Array.isArray(row.dates) ? row.dates.length : 0) }} 天
+      </template>
+      <template #action="{ row }">
+        <TableAction
+          :actions="[
+            {
+              label: '详情',
+              type: 'link',
+              size: 'small',
+              onClick: () => openDetail(row),
+            },
+          ]"
+        />
+      </template>
+    </Grid>
+  </Page>
+</template>
diff --git a/apps/web-antd/src/views/log/ledger-log/config/table.ts b/apps/web-antd/src/views/log/ledger-log/config/table.ts
index a386d3da..9c04fd6e 100644
--- a/apps/web-antd/src/views/log/ledger-log/config/table.ts
+++ b/apps/web-antd/src/views/log/ledger-log/config/table.ts
@@ -53,7 +53,7 @@ export const gridOptions: VxeGridProps<RowType> = {
     // custom: true, // 自定义列
     zoom: true, // 最大化最小化
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
     custom: {
       // 自定义列-图标
diff --git a/apps/web-antd/src/views/log/ledger-log/index.vue b/apps/web-antd/src/views/log/ledger-log/index.vue
index c247cd5a..23436c23 100644
--- a/apps/web-antd/src/views/log/ledger-log/index.vue
+++ b/apps/web-antd/src/views/log/ledger-log/index.vue
@@ -38,7 +38,7 @@ const showModal = (data = {}, isUpdate = false) => {
   <Page auto-content-height title="分账日志管理">
     <FormModal />
     <Grid>
-      <template #toolbar-buttons>
+      <template #toolbar-actions>
       </template>
       <template #store="{ row }">
         <span v-if="row.user_type === 1">{{ row.store.name }}</span>
diff --git a/apps/web-antd/src/views/log/old-api-log/config/table.ts b/apps/web-antd/src/views/log/old-api-log/config/table.ts
index f6a8ae80..bf258e6b 100644
--- a/apps/web-antd/src/views/log/old-api-log/config/table.ts
+++ b/apps/web-antd/src/views/log/old-api-log/config/table.ts
@@ -62,7 +62,7 @@ export const gridOptions: VxeGridProps<RowType> = {
     // custom: true, // 自定义列
     zoom: true, // 最大化最小化
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
     custom: {
       // 自定义列-图标
diff --git a/apps/web-antd/src/views/log/old-api-log/index.vue b/apps/web-antd/src/views/log/old-api-log/index.vue
index 04c055e3..9e0d9ea6 100644
--- a/apps/web-antd/src/views/log/old-api-log/index.vue
+++ b/apps/web-antd/src/views/log/old-api-log/index.vue
@@ -38,7 +38,7 @@ const showModal = (data = {}, isUpdate = false) => {
   <Page auto-content-height title="Api访问日志管理">
     <FormModal />
     <Grid>
-      <template #toolbar-buttons>
+      <template #toolbar-actions>
       </template>
       <template #type="{ row }">
         <Tag v-if="row.type === 0" color="green"> 访问成功 </Tag>
diff --git a/apps/web-antd/src/views/log/op-log/config/table.ts b/apps/web-antd/src/views/log/op-log/config/table.ts
index 2377439c..8c8afb76 100644
--- a/apps/web-antd/src/views/log/op-log/config/table.ts
+++ b/apps/web-antd/src/views/log/op-log/config/table.ts
@@ -62,7 +62,7 @@ export const gridOptions: VxeGridProps<RowType> = {
     // custom: true, // 自定义列
     zoom: true, // 最大化最小化
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
     custom: {
       // 自定义列-图标
diff --git a/apps/web-antd/src/views/log/op-log/index.vue b/apps/web-antd/src/views/log/op-log/index.vue
index 3c685286..351fb55f 100644
--- a/apps/web-antd/src/views/log/op-log/index.vue
+++ b/apps/web-antd/src/views/log/op-log/index.vue
@@ -38,7 +38,7 @@ const showModal = (data = {}, isUpdate = false) => {
   <Page auto-content-height title="操作日志管理">
     <FormModal />
     <Grid>
-      <template #toolbar-buttons>
+      <template #toolbar-actions>
         <TableAction
           :actions="[
           ]"
diff --git a/apps/web-antd/src/views/log/order-log/config/table.ts b/apps/web-antd/src/views/log/order-log/config/table.ts
index 9cd7efc1..11eec48d 100644
--- a/apps/web-antd/src/views/log/order-log/config/table.ts
+++ b/apps/web-antd/src/views/log/order-log/config/table.ts
@@ -54,7 +54,7 @@ export const gridOptions: VxeGridProps<RowType> = {
     // custom: true, // 自定义列
     zoom: true, // 最大化最小化
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
     custom: {
       // 自定义列-图标
diff --git a/apps/web-antd/src/views/log/order-log/index.vue b/apps/web-antd/src/views/log/order-log/index.vue
index 875e681d..f6ad6fa4 100644
--- a/apps/web-antd/src/views/log/order-log/index.vue
+++ b/apps/web-antd/src/views/log/order-log/index.vue
@@ -38,7 +38,7 @@ const showModal = (data = {}, isUpdate = false) => {
   <Page auto-content-height title="订单日志管理">
     <FormModal />
     <Grid>
-      <template #toolbar-buttons>
+      <template #toolbar-actions>
       </template>
       <template #logo="{ row }">
         <Image :src="row.logo" height="30" width="30" />
diff --git a/apps/web-antd/src/views/log/prescription-log/config/table.ts b/apps/web-antd/src/views/log/prescription-log/config/table.ts
index d31be66d..c4b98551 100644
--- a/apps/web-antd/src/views/log/prescription-log/config/table.ts
+++ b/apps/web-antd/src/views/log/prescription-log/config/table.ts
@@ -55,7 +55,7 @@ export const gridOptions: VxeGridProps<RowType> = {
     // custom: true, // 自定义列
     zoom: true, // 最大化最小化
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
     custom: {
       // 自定义列-图标
diff --git a/apps/web-antd/src/views/log/prescription-log/index.vue b/apps/web-antd/src/views/log/prescription-log/index.vue
index a9547980..49ec5108 100644
--- a/apps/web-antd/src/views/log/prescription-log/index.vue
+++ b/apps/web-antd/src/views/log/prescription-log/index.vue
@@ -38,7 +38,7 @@ const showModal = (data = {}, isUpdate = false) => {
   <Page auto-content-height title="处方日志管理">
     <FormModal />
     <Grid>
-      <template #toolbar-buttons>
+      <template #toolbar-actions>
       </template>
       <template #toolbar-tools></template>
       <template #action="{ row }">
diff --git a/apps/web-antd/src/views/log/queue-job/components/QueueJobList.vue b/apps/web-antd/src/views/log/queue-job/components/QueueJobList.vue
index 9c02c91c..838f0b0f 100644
--- a/apps/web-antd/src/views/log/queue-job/components/QueueJobList.vue
+++ b/apps/web-antd/src/views/log/queue-job/components/QueueJobList.vue
@@ -55,7 +55,11 @@ const [OpLogModalComp, opLogModalApi] = useVbenModal({
 });
 
 function openDetail(row: Record<string, any>) {
-  detailModalApi.setData({ id: Number(row?.id || 0), values: row });
+  detailModalApi.setData({
+    id: Number(row?.id || 0),
+    values: row,
+    onRetried: () => gridApi.query(),
+  });
   detailModalApi.open();
 }
 
@@ -190,7 +194,7 @@ onMounted(async () => {
     <DetailModalComp />
     <OpLogModalComp />
     <Grid>
-      <template #toolbar-buttons />
+      <template #toolbar-actions />
       <template #title="{ row }">
         <a
           class="cursor-pointer text-primary"
diff --git a/apps/web-antd/src/views/log/queue-job/components/detail-modal.vue b/apps/web-antd/src/views/log/queue-job/components/detail-modal.vue
index d03250d4..850a0654 100644
--- a/apps/web-antd/src/views/log/queue-job/components/detail-modal.vue
+++ b/apps/web-antd/src/views/log/queue-job/components/detail-modal.vue
@@ -1,18 +1,21 @@
 <script lang="ts" setup>
 /**
- * 队列任务详情：展示 payload、错误信息、重跑链路
+ * 队列任务详情：展示 payload、错误信息、重跑链路；失败/取消可重跑
+ * 供队列列表与站内信 queue_failure 共用
  */
-import { ref } from 'vue';
+import { computed, ref } from 'vue';
 
 import { useVbenModal } from '@vben/common-ui';
 
-import { Descriptions, Tag } from 'ant-design-vue';
+import { Button, Descriptions, Modal, Tag, message } from 'ant-design-vue';
 
-import { getQueueJobDetail } from '../api';
+import { getQueueJobDetail, retryQueueJob } from '../api';
 import { statusTagColor } from '../config/constants';
 
 const data = ref<Record<string, any>>({});
 const loading = ref(false);
+const retrying = ref(false);
+const onRetried = ref<null | (() => void)>(null);
 
 function formatJson(val: unknown): string {
   if (val == null || val === '') {
@@ -25,7 +28,12 @@ function formatJson(val: unknown): string {
   }
 }
 
-const [Modal, modalApi] = useVbenModal({
+const canRetry = computed(() => {
+  const status = Number(data.value?.status);
+  return status === 3 || status === 4;
+});
+
+const [ModalComp, modalApi] = useVbenModal({
   fullscreenButton: true,
   draggable: true,
   showConfirmButton: false,
@@ -36,12 +44,15 @@ const [Modal, modalApi] = useVbenModal({
   async onOpenChange(isOpen: boolean) {
     if (!isOpen) {
       data.value = {};
+      onRetried.value = null;
       return;
     }
     const payload = modalApi.getData<{
       id?: number;
       values?: Record<string, any>;
+      onRetried?: () => void;
     }>();
+    onRetried.value = payload?.onRetried || null;
     const id = Number(payload?.id || payload?.values?.id || 0);
     if (id <= 0) {
       data.value = payload?.values || {};
@@ -60,10 +71,39 @@ const [Modal, modalApi] = useVbenModal({
     }
   },
 });
+
+/**
+ * 失败/取消后重跑：新建任务投递，与列表页逻辑一致
+ */
+function onRetry() {
+  const id = Number(data.value?.id || 0);
+  if (id <= 0) return;
+  Modal.confirm({
+    title: '确认重新执行？',
+    content:
+      `将基于 #${id} 新建一条任务并重新投递。` +
+      '订单/退款等业务重跑可能产生副作用，请确认业务幂等后再操作。',
+    okType: 'danger',
+    onOk: async () => {
+      retrying.value = true;
+      try {
+        const res = await retryQueueJob(id);
+        const newId = res?.id ?? res?.data?.id;
+        message.success(newId ? `已重新投递，新任务 #${newId}` : '已重新投递');
+        onRetried.value?.();
+        // 刷新当前详情（原任务状态可能仍失败，链路会多一条）
+        const detail = await getQueueJobDetail(id);
+        data.value = detail?.data || detail || data.value;
+      } finally {
+        retrying.value = false;
+      }
+    },
+  });
+}
 </script>
 
 <template>
-  <Modal class="w-[90%] md:w-[780px]" title="队列任务详情">
+  <ModalComp class="w-[90%] md:w-[780px]" title="队列任务详情">
     <Descriptions
       :column="{ xxl: 2, xl: 2, lg: 2, md: 1, sm: 1, xs: 1 }"
       bordered
@@ -100,7 +140,7 @@ const [Modal, modalApi] = useVbenModal({
         </Tag>
         <span
           v-if="Number(data.is_delayed) === 1 && Number(data.delay_seconds) > 0"
-          class="ml-1 text-xs text-gray-500"
+          class="ml-1 text-xs text-muted-foreground"
         >
           （相对创建 {{ data.delay_type_txt || '延迟' }}）
         </span>
@@ -115,7 +155,7 @@ const [Modal, modalApi] = useVbenModal({
         <code class="break-all text-xs">{{ data.job_name || '-' }}</code>
       </Descriptions.Item>
       <Descriptions.Item label="错误信息" :span="2">
-        <pre class="snap-pre">{{ data.error_message || '（无）' }}</pre>
+        <pre class="snap-pre error-pre">{{ data.error_message || '（无）' }}</pre>
       </Descriptions.Item>
       <Descriptions.Item label="重跑参数 payload" :span="2">
         <pre class="snap-pre">{{ formatJson(data.payload) }}</pre>
@@ -132,8 +172,8 @@ const [Modal, modalApi] = useVbenModal({
               {{ item.status_txt }}
             </Tag>
             {{ item.title }}
-            <span class="text-gray-400">{{ item.created_at }}</span>
-            <span v-if="item.retry_from_id" class="text-gray-400">
+            <span class="text-muted-foreground">{{ item.created_at }}</span>
+            <span v-if="item.retry_from_id" class="text-muted-foreground">
               （来自 #{{ item.retry_from_id }}）
             </span>
           </div>
@@ -141,7 +181,13 @@ const [Modal, modalApi] = useVbenModal({
         <span v-else>-</span>
       </Descriptions.Item>
     </Descriptions>
-  </Modal>
+
+    <div v-if="canRetry" class="mt-4 flex justify-end">
+      <Button type="primary" danger :loading="retrying" @click="onRetry">
+        重新执行
+      </Button>
+    </div>
+  </ModalComp>
 </template>
 
 <style scoped>
@@ -153,5 +199,14 @@ const [Modal, modalApi] = useVbenModal({
   word-break: break-all;
   font-size: 12px;
   line-height: 1.5;
+  color: hsl(var(--foreground));
+}
+
+.error-pre {
+  max-height: 200px;
+  padding: 8px 10px;
+  border-radius: 8px;
+  background: hsl(0 72% 50% / 0.08);
+  color: hsl(0 72% 40%);
 }
 </style>
diff --git a/apps/web-antd/src/views/log/queue-job/config/table.ts b/apps/web-antd/src/views/log/queue-job/config/table.ts
index c9230a15..3d3158cc 100644
--- a/apps/web-antd/src/views/log/queue-job/config/table.ts
+++ b/apps/web-antd/src/views/log/queue-job/config/table.ts
@@ -77,7 +77,7 @@ export function createGridOptions(category: number): VxeGridProps<any> {
       refresh: true,
       zoom: true,
       slots: {
-        buttons: 'toolbar-buttons',
+        buttons: 'toolbar-actions',
       },
     },
   };
diff --git a/apps/web-antd/src/views/log/warehouse-drug-change-log/config/table.ts b/apps/web-antd/src/views/log/warehouse-drug-change-log/config/table.ts
index c7c5478f..9e0466b9 100644
--- a/apps/web-antd/src/views/log/warehouse-drug-change-log/config/table.ts
+++ b/apps/web-antd/src/views/log/warehouse-drug-change-log/config/table.ts
@@ -55,7 +55,7 @@ export const gridOptions: VxeGridProps<any> = {
     refresh: true,
     zoom: true,
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
   },
 };
diff --git a/apps/web-antd/src/views/log/warehouse-drug-change-log/index.vue b/apps/web-antd/src/views/log/warehouse-drug-change-log/index.vue
index b3701746..f90330dd 100644
--- a/apps/web-antd/src/views/log/warehouse-drug-change-log/index.vue
+++ b/apps/web-antd/src/views/log/warehouse-drug-change-log/index.vue
@@ -80,7 +80,7 @@ onMounted(async () => {
   <Page auto-content-height title="仓库修改记录">
     <DetailModalComp />
     <Grid>
-      <template #toolbar-buttons />
+      <template #toolbar-actions />
       <template #user_type="{ row }">
         <Tag :color="Number(row.user_type) === 2 ? 'geekblue' : 'green'">
           {{ row.user_type_txt || row.user_type }}
diff --git a/apps/web-antd/src/views/notice/action/NoticeActionHost.vue b/apps/web-antd/src/views/notice/action/NoticeActionHost.vue
new file mode 100644
index 00000000..6a653be1
--- /dev/null
+++ b/apps/web-antd/src/views/notice/action/NoticeActionHost.vue
@@ -0,0 +1,122 @@
+<script lang="ts" setup>
+/**
+ * 布局级站内信动作宿主
+ * - 消息详情走自定义 NoticeSceneHost（非 VbenModal）
+ * - 业务审核表单仍复用列表页 Vben Modal（仓品完整审核 / 提现审核等）
+ */
+import { onMounted, onUnmounted, ref } from 'vue';
+import { useRouter } from 'vue-router';
+
+import { useVbenModal } from '@vben/common-ui';
+
+import WithdrawalAudit from '#/views/finance/withdrawal-audit/components/WithdrawalAudit.vue';
+import WarehouseAuditModal from '#/views/system/delivery-warehouse-product-audit/components/audit-modal.vue';
+import { readApi } from '#/views/notice/api';
+import NoticeSceneHost from '#/views/notice/scenes/NoticeSceneHost.vue';
+
+import { emitNoticeRefresh, registerNoticeActionHandler } from './bus';
+import { NOTICE_ACTION, type NoticeItemLike } from './types';
+
+const router = useRouter();
+
+const sceneOpen = ref(false);
+const sceneNotice = ref<Record<string, any> | null>(null);
+
+const [WithdrawAuditModal, withdrawAuditApi] = useVbenModal({
+  connectedComponent: WithdrawalAudit,
+});
+const [WarehouseModal, warehouseModalApi] = useVbenModal({
+  connectedComponent: WarehouseAuditModal,
+});
+
+const readSentIds = new Set<number>();
+
+async function markRead(item: NoticeItemLike) {
+  if (!item?.id) return;
+  const id = Number(item.id);
+  item.status = 1;
+  if (readSentIds.has(id)) return;
+  readSentIds.add(id);
+  try {
+    await readApi(id);
+    emitNoticeRefresh();
+  } catch {
+    readSentIds.delete(id);
+  }
+}
+
+function openWithdrawAudit(bizId: number, modalType: number) {
+  if (!bizId) return;
+  withdrawAuditApi.setData({
+    id: bizId,
+    modalType,
+    gridApi: { reload: emitNoticeRefresh, query: emitNoticeRefresh },
+  });
+  withdrawAuditApi.open();
+}
+
+function openWarehouseAudit(bizId: number) {
+  warehouseModalApi.setData({
+    id: bizId,
+    values: { id: bizId },
+    gridApi: { query: emitNoticeRefresh, reload: emitNoticeRefresh },
+  });
+  warehouseModalApi.open();
+}
+
+/** 打开消息专属场景弹层 */
+function openScene(item: NoticeItemLike) {
+  sceneNotice.value = { ...item };
+  sceneOpen.value = true;
+}
+
+async function handleAction(item: NoticeItemLike) {
+  void markRead(item);
+  const action = String(item.action_type || '');
+  const typeCode = String(item.type_code || '');
+  const payload = (item.action_payload || {}) as Record<string, any>;
+
+  if (
+    action === NOTICE_ACTION.OPEN_ROUTE &&
+    typeCode !== 'queue_failure' &&
+    typeCode !== 'invoice_todo'
+  ) {
+    const route = String(payload.route || '');
+    if (route) {
+      router.push(route);
+      return;
+    }
+  }
+
+  // 全部消息类型统一走自定义场景弹层（含队列失败详情+重试）
+  openScene(item);
+}
+
+function onWithdrawAudit(payload: { bizId: number; modalType: number }) {
+  openWithdrawAudit(payload.bizId, payload.modalType);
+}
+
+function onOpenBizAudit(payload: { typeCode: string; bizId: number }) {
+  if (payload.typeCode === 'warehouse_product_audit') {
+    openWarehouseAudit(payload.bizId);
+  }
+}
+
+onMounted(() => {
+  registerNoticeActionHandler(handleAction);
+});
+onUnmounted(() => {
+  registerNoticeActionHandler(null);
+});
+</script>
+
+<template>
+  <NoticeSceneHost
+    v-model:open="sceneOpen"
+    :notice="sceneNotice"
+    :on-withdraw-audit="onWithdrawAudit"
+    :on-open-biz-audit="onOpenBizAudit"
+  />
+  <WithdrawAuditModal />
+  <WarehouseModal />
+</template>
diff --git a/apps/web-antd/src/views/notice/action/bus.ts b/apps/web-antd/src/views/notice/action/bus.ts
new file mode 100644
index 00000000..8097b1cc
--- /dev/null
+++ b/apps/web-antd/src/views/notice/action/bus.ts
@@ -0,0 +1,40 @@
+/**
+ * 站内信动作总线
+ * NoticeActionHost 挂载后注册 handler；铃铛/消息中心调用 openNoticeAction
+ */
+import type { NoticeItemLike } from './types';
+
+type NoticeActionHandler = (item: NoticeItemLike) => void | Promise<void>;
+
+let handler: NoticeActionHandler | null = null;
+const refreshListeners = new Set<() => void>();
+
+/** Host 注册：打开业务弹窗 / 详情抽屉 */
+export function registerNoticeActionHandler(fn: NoticeActionHandler | null) {
+  handler = fn;
+}
+
+/** 打开站内信动作（先已读由调用方或 Host 内处理） */
+export async function openNoticeAction(item: NoticeItemLike) {
+  if (!handler) {
+    console.warn('[notice] NoticeActionHost 未挂载');
+    return;
+  }
+  await handler(item);
+}
+
+/** 审核成功后刷新铃铛 */
+export function onNoticeRefresh(fn: () => void) {
+  refreshListeners.add(fn);
+  return () => refreshListeners.delete(fn);
+}
+
+export function emitNoticeRefresh() {
+  refreshListeners.forEach((fn) => {
+    try {
+      fn();
+    } catch {
+      /* ignore */
+    }
+  });
+}
diff --git a/apps/web-antd/src/views/notice/action/types.ts b/apps/web-antd/src/views/notice/action/types.ts
new file mode 100644
index 00000000..4649a8a6
--- /dev/null
+++ b/apps/web-antd/src/views/notice/action/types.ts
@@ -0,0 +1,143 @@
+/**
+ * 站内信动作类型常量（与后端 AdminNoticeActionTypeEnum 对齐）
+ */
+export const NOTICE_ACTION = {
+  OPEN_WITHDRAW_AUDIT: 'open_withdraw_audit',
+  OPEN_WAREHOUSE_PRODUCT_AUDIT: 'open_warehouse_product_audit',
+  OPEN_STORE_INPUT_AUDIT: 'open_store_input_audit',
+  OPEN_DOCTOR_INPUT_AUDIT: 'open_doctor_input_audit',
+  OPEN_INVOICE_TODO: 'open_invoice_todo',
+  OPEN_PERIOD_REPORT: 'open_period_report',
+  OPEN_VIP_CARD: 'open_vip_card',
+  OPEN_ROUTE: 'open_route',
+  OPEN_QUEUE_JOB_DETAIL: 'open_queue_job_detail',
+} as const;
+
+export type NoticeActionType =
+  (typeof NOTICE_ACTION)[keyof typeof NOTICE_ACTION];
+
+export interface NoticeItemLike {
+  id: number;
+  title?: string;
+  detail?: string;
+  content?: string;
+  type?: number;
+  type_code?: string;
+  type_name?: string;
+  type_icon?: string;
+  type_color?: string;
+  action_type?: string;
+  action_payload?: Record<string, any> | null;
+  cover_url?: string;
+  priority?: number;
+  status?: number;
+  edit_type?: number;
+  created_at?: string;
+  [key: string]: any;
+}
+
+/** 主题色 → Tailwind 类名（亮/暗自适应） */
+export const NOTICE_COLOR_MAP: Record<
+  string,
+  { text: string; bg: string; border: string; bar: string }
+> = {
+  sky: {
+    text: 'text-sky-500',
+    bg: 'bg-sky-500/10',
+    border: 'border-sky-500/30',
+    bar: 'bg-sky-500',
+  },
+  amber: {
+    text: 'text-amber-500',
+    bg: 'bg-amber-500/10',
+    border: 'border-amber-500/30',
+    bar: 'bg-amber-500',
+  },
+  emerald: {
+    text: 'text-emerald-500',
+    bg: 'bg-emerald-500/10',
+    border: 'border-emerald-500/30',
+    bar: 'bg-emerald-500',
+  },
+  teal: {
+    text: 'text-teal-500',
+    bg: 'bg-teal-500/10',
+    border: 'border-teal-500/30',
+    bar: 'bg-teal-500',
+  },
+  cyan: {
+    text: 'text-cyan-500',
+    bg: 'bg-cyan-500/10',
+    border: 'border-cyan-500/30',
+    bar: 'bg-cyan-500',
+  },
+  orange: {
+    text: 'text-orange-500',
+    bg: 'bg-orange-500/10',
+    border: 'border-orange-500/30',
+    bar: 'bg-orange-500',
+  },
+  violet: {
+    text: 'text-violet-500',
+    bg: 'bg-violet-500/10',
+    border: 'border-violet-500/30',
+    bar: 'bg-violet-500',
+  },
+  indigo: {
+    text: 'text-indigo-500',
+    bg: 'bg-indigo-500/10',
+    border: 'border-indigo-500/30',
+    bar: 'bg-indigo-500',
+  },
+  blue: {
+    text: 'text-blue-500',
+    bg: 'bg-blue-500/10',
+    border: 'border-blue-500/30',
+    bar: 'bg-blue-500',
+  },
+  green: {
+    text: 'text-green-500',
+    bg: 'bg-green-500/10',
+    border: 'border-green-500/30',
+    bar: 'bg-green-500',
+  },
+  red: {
+    text: 'text-red-500',
+    bg: 'bg-red-500/10',
+    border: 'border-red-500/30',
+    bar: 'bg-red-500',
+  },
+  lime: {
+    text: 'text-lime-500',
+    bg: 'bg-lime-500/10',
+    border: 'border-lime-500/30',
+    bar: 'bg-lime-500',
+  },
+};
+
+/**
+ * 未读重要卡片微光色相（与 type_color token 对齐，供 CSS hsl(var(--notice-glow) / a)）
+ */
+export const NOTICE_GLOW_HSL: Record<string, string> = {
+  sky: '199 89% 48%',
+  amber: '38 92% 50%',
+  emerald: '160 84% 39%',
+  teal: '173 80% 40%',
+  cyan: '189 94% 43%',
+  orange: '25 95% 53%',
+  violet: '262 83% 58%',
+  indigo: '239 84% 67%',
+  blue: '217 91% 60%',
+  green: '142 71% 45%',
+  red: '0 84% 60%',
+  lime: '84 81% 44%',
+};
+
+export function resolveNoticeColor(color?: string) {
+  return NOTICE_COLOR_MAP[color || 'sky'] || NOTICE_COLOR_MAP.sky;
+}
+
+/** 解析类型微光 HSL 通道 */
+export function resolveNoticeGlow(color?: string) {
+  return NOTICE_GLOW_HSL[color || 'sky'] || NOTICE_GLOW_HSL.sky;
+}
diff --git a/apps/web-antd/src/views/notice/api/index.ts b/apps/web-antd/src/views/notice/api/index.ts
index bf746698..7e6fa2e3 100644
--- a/apps/web-antd/src/views/notice/api/index.ts
+++ b/apps/web-antd/src/views/notice/api/index.ts
@@ -1,62 +1,57 @@
 import { requestClient } from '#/api/request';
 
 const prefix = 'notice/';
+
 /**
- * 查询通知列表
- * @param data
+ * 查询通知列表（xk-api）
  */
 export async function getNoticeListApi(data: any) {
   return requestClient.get<any>(`${prefix}list`, { params: data });
 }
+
+/**
+ * 未读总数（铃铛角标）
+ */
+export async function getNoticeUnreadCountApi() {
+  return requestClient.get<any>(`${prefix}unread-count`);
+}
+
 /**
  * 获取接受消息用户下拉列表
  */
 export async function getUserOptionApi() {
   return requestClient.get<any>(`${prefix}user-option`);
 }
+
 /**
- * 查询通知详情
- * @param id
+ * 查询通知详情（会标记已读）
  */
 export async function getNoticeDetailApi(id: number) {
-  const result = requestClient.get<any>(`${prefix}detail`, { params: {id} });
-  localStorage.setItem(
-    `readStatus`,
-    // 随机数
-    Math.random().toString(36).slice(2),
-  );
+  const result = requestClient.get<any>(`${prefix}detail`, { params: { id } });
+  localStorage.setItem(`readStatus`, Math.random().toString(36).slice(2));
   return result;
 }
+
 /**
  * 设置已读某条消息
- * @param id
  */
 export async function readApi(id: number) {
-  const result = requestClient.post<any>(`${prefix}read`, {id});
-  localStorage.setItem(
-    `readStatus`,
-    // 随机数
-    Math.random().toString(36).slice(2),
-  );
+  const result = requestClient.post<any>(`${prefix}read`, { id });
+  localStorage.setItem(`readStatus`, Math.random().toString(36).slice(2));
   return result;
 }
+
 /**
  * 设置已读全部消息
  */
 export async function readAllApi() {
   const result = requestClient.post<any>(`${prefix}read-all`);
-  localStorage.setItem(
-    `readStatus`,
-    // 随机数
-    Math.random().toString(36).slice(2),
-  );
+  localStorage.setItem(`readStatus`, Math.random().toString(36).slice(2));
   return result;
 }
 
-
 /**
  * 群发消息
- * @param data
  */
 export async function sendNoticeApi(data: any) {
   return requestClient.post<any>(`${prefix}send`, data);
diff --git a/apps/web-antd/src/views/notice/compoents/detail.vue b/apps/web-antd/src/views/notice/compoents/detail.vue
index 15b5495a..6feb8aa6 100644
--- a/apps/web-antd/src/views/notice/compoents/detail.vue
+++ b/apps/web-antd/src/views/notice/compoents/detail.vue
@@ -1,9 +1,15 @@
 <script setup lang="ts">
+/**
+ * 通知详情页（路由 /notice/detail/:id）
+ * 与收件箱 / 场景弹窗同一套视觉语言：氛围渐变 + hero 卡片 + 主题变量配色（全量适配暗色）
+ * 保留原有逻辑：VIP content JSON 解析、未读人员名单、Markdown/富文本双渲染
+ */
 import { computed, onMounted, ref } from 'vue';
 import { useRoute, useRouter } from 'vue-router';
 
 import { Page, useVbenModal } from '@vben/common-ui';
 import { useTabs } from '@vben/hooks';
+import { usePreferences } from '@vben/preferences';
 
 import {
   ArrowLeft,
@@ -13,6 +19,7 @@ import {
   Crown,
   Megaphone,
   User,
+  Users,
 } from 'lucide-vue-next';
 import { MdPreview } from 'md-editor-v3';
 
@@ -30,60 +37,32 @@ const router = useRouter();
 const route = useRoute();
 const noticeId = ref(route.params.id);
 
-const notice = ref(null);
+const notice = ref<Record<string, any> | null>(null);
 const loading = ref(true);
-const error = ref(null);
+const error = ref<null | string>(null);
 
 const { setTabTitle } = useTabs();
+/** Markdown 预览主题必须跟随系统亮/暗切换，不能写死 dark */
+const { isDark } = usePreferences();
+const mdTheme = computed(() => (isDark.value ? 'dark' : 'light'));
 
-// 消息类型定义（含 VIP 通知 type=3）
+/**
+ * 消息类型定义（含 VIP 通知 type=3）
+ * tone 为 HSL 三元组字符串，通过 CSS 变量注入，亮暗两种主题下均有足够对比度
+ */
 const messageTypes = [
-  {
-    id: 0,
-    name: '系统公告',
-    icon: Megaphone,
-    color: 'text-sky-500',
-    darkColor: 'dark:text-sky-400',
-    bgColor: 'bg-sky-50',
-    darkBgColor: 'dark:bg-sky-900/30',
-    borderColor: 'border-sky-200',
-    darkBorderColor: 'dark:border-sky-800',
-  },
-  {
-    id: 1,
-    name: '系统通知',
-    icon: Bell,
-    color: 'text-amber-500',
-    darkColor: 'dark:text-amber-400',
-    bgColor: 'bg-amber-50',
-    darkBgColor: 'dark:bg-amber-900/30',
-    borderColor: 'border-amber-200',
-    darkBorderColor: 'dark:border-amber-800',
-  },
-  {
-    id: 2,
-    name: '周报提醒',
-    icon: CalendarClock,
-    color: 'text-emerald-500',
-    darkColor: 'dark:text-emerald-400',
-    bgColor: 'bg-emerald-50',
-    darkBgColor: 'dark:bg-emerald-900/30',
-    borderColor: 'border-emerald-200',
-    darkBorderColor: 'dark:border-emerald-800',
-  },
-  {
-    id: 3,
-    name: 'VIP通知',
-    icon: Crown,
-    color: 'text-violet-500',
-    darkColor: 'dark:text-violet-400',
-    bgColor: 'bg-violet-50',
-    darkBgColor: 'dark:bg-violet-900/30',
-    borderColor: 'border-violet-200',
-    darkBorderColor: 'dark:border-violet-800',
-  },
+  { id: 0, name: '系统公告', icon: Megaphone, tone: '199 89% 48%' },
+  { id: 1, name: '系统通知', icon: Bell, tone: '38 92% 50%' },
+  { id: 2, name: '周报提醒', icon: CalendarClock, tone: '160 60% 40%' },
+  { id: 3, name: 'VIP通知', icon: Crown, tone: '258 70% 60%' },
 ];
 
+/** 当前通知的类型信息（默认回落到系统公告） */
+const typeInfo = computed(() => {
+  const typeId = Number(notice.value?.type);
+  return messageTypes.find((t) => t.id === typeId) || messageTypes[0];
+});
+
 /** 解析 VIP 站内信 content JSON */
 const vipContent = computed(() => {
   if (!notice.value || Number(notice.value.type) !== 3) return null;
@@ -105,7 +84,7 @@ const vipSceneLabel = computed(() => {
   return 'VIP通知';
 });
 
-// 获取通知详情
+/** 获取通知详情，成功后同步 Tab 标题 */
 const getNoticeDetail = async () => {
   loading.value = true;
   error.value = null;
@@ -122,18 +101,12 @@ const getNoticeDetail = async () => {
   }
 };
 
-// 返回列表
 const goBack = () => {
   router.push('/notice');
 };
 
-// 获取类型信息
-const getTypeInfo = (typeId) => {
-  return messageTypes.find((t) => t.id === typeId) || messageTypes[0];
-};
-
-// 格式化内容，将换行符转换为<br>
-const formatContent = (content) => {
+/** 富文本内容换行符转 <br>（后端存的是纯文本换行） */
+const formatContent = (content: string) => {
   return content ? content.replaceAll('\n', '<br>') : '';
 };
 
@@ -147,134 +120,73 @@ const [UnreadUserListModal, UnreadUserListModalApi] = useVbenModal({
 
 const showUnreadList = () => {
   UnreadUserListModalApi.setData({
-    values: notice.value.user_list,
-    unread_count: notice.value.unread_count,
+    values: notice.value?.user_list,
+    unread_count: notice.value?.unread_count,
   });
   UnreadUserListModalApi.open();
 };
 </script>
 
 <template>
-  <Page>
+  <Page auto-content-height content-class="!p-0">
     <UnreadUserListModal />
-    <template #title>
-      <div class="flex items-center gap-2">
-        <button
-          class="flex h-8 w-8 items-center justify-center rounded-full text-gray-500 transition-colors hover:bg-gray-100 hover:text-gray-700 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-300"
-          @click="goBack"
-        >
-          <ArrowLeft class="h-5 w-5" />
-        </button>
-        <h1 class="text-xl font-semibold text-gray-900 dark:text-gray-100">
-          通知详情
-        </h1>
-      </div>
-    </template>
+    <div class="notice-detail" :style="{ '--tone': typeInfo.tone }">
+      <!-- 顶部氛围渐变：跟消息类型色走 -->
+      <div class="detail-atmosphere" aria-hidden="true"></div>
 
-    <div class="mx-auto max-w-3xl">
-      <!-- 加载状态 -->
-      <div v-if="loading" class="flex justify-center py-20">
-        <div
-          class="h-10 w-10 animate-spin rounded-full border-4 border-gray-200 border-t-sky-500 dark:border-gray-700 dark:border-t-sky-400"
-        ></div>
-      </div>
+      <div class="detail-wrap">
+        <!-- 顶栏：返回 + 页面标识 -->
+        <header class="detail-topbar">
+          <button type="button" class="back-btn" aria-label="返回列表" @click="goBack">
+            <ArrowLeft class="size-4" />
+            <span>消息</span>
+          </button>
+        </header>
 
-      <!-- 错误状态 -->
-      <div
-        v-else-if="error"
-        class="rounded-lg border border-red-200 bg-red-50 p-4 text-center text-red-600 transition-colors dark:border-red-800 dark:bg-red-900/20 dark:text-red-400"
-      >
-        {{ error }}
-        <button
-          class="mt-2 rounded-md bg-red-100 px-3 py-1 text-sm font-medium text-red-700 transition-colors hover:bg-red-200 dark:bg-red-900/30 dark:text-red-300 dark:hover:bg-red-900/50"
-          @click="getNoticeDetail"
-        >
-          重试
-        </button>
-      </div>
+        <!-- 加载状态 -->
+        <div v-if="loading" class="state-box">
+          <div class="state-spinner"></div>
+          <p>正在加载通知…</p>
+        </div>
 
-      <!-- 通知详情 -->
-      <div v-else-if="notice" class="space-y-6">
-        <!-- 标题和类型 -->
-        <div
-          class="rounded-lg border border-gray-200 bg-white p-6 shadow-sm transition-colors dark:border-gray-700 dark:bg-gray-800"
-        >
-          <div class="mb-4 flex items-start justify-between">
-            <h2
-              class="text-xl font-bold text-gray-900 transition-colors dark:text-gray-100"
-            >
-              {{ notice.title }}
-            </h2>
-            <div
-              :class="[
-                getTypeInfo(notice.type).bgColor,
-                getTypeInfo(notice.type).darkBgColor,
-              ]"
-              class="flex items-center gap-1.5 rounded-full px-3 py-1 transition-colors"
-            >
-              <component
-                :is="getTypeInfo(notice.type).icon"
-                :class="[
-                  getTypeInfo(notice.type).color,
-                  getTypeInfo(notice.type).darkColor,
-                ]"
-                class="h-4 w-4"
-              />
-              <span
-                :class="[
-                  getTypeInfo(notice.type).color,
-                  getTypeInfo(notice.type).darkColor,
-                ]"
-                class="text-xs font-medium"
-              >
-                {{ getTypeInfo(notice.type).name }}
+        <!-- 错误状态 -->
+        <div v-else-if="error" class="state-box is-error">
+          <p>{{ error }}</p>
+          <button type="button" class="retry-btn" @click="getNoticeDetail">重试</button>
+        </div>
+
+        <!-- 通知详情 -->
+        <template v-else-if="notice">
+          <!-- Hero：类型徽标 + 标题 + 元信息 -->
+          <section class="hero-card">
+            <div class="hero-kicker">
+              <span class="type-pill">
+                <component :is="typeInfo.icon" class="size-3.5" />
+                {{ typeInfo.name }}
+              </span>
+              <time class="hero-time">
+                <Clock class="size-3.5" />
+                {{ notice.created_at }} · {{ formatTimeToRelative(notice.created_at) }}
+              </time>
+            </div>
+            <h1 class="hero-title">{{ notice.title }}</h1>
+            <p v-if="notice.detail" class="hero-desc">{{ formatContent(notice.detail).replaceAll('<br>', ' ') }}</p>
+            <div class="hero-meta">
+              <span class="meta-chip">
+                <Icon icon="svg:logo" />
+                萧康云医
+              </span>
+              <span class="meta-chip">
+                <User class="size-3.5" />
+                {{ notice.admin?.nick_name || '系统' }}
               </span>
             </div>
-          </div>
-
-          <!-- 元信息 -->
-          <div
-            class="mb-6 flex flex-wrap items-center gap-x-6 gap-y-2 text-sm text-gray-500 transition-colors dark:text-gray-400"
-          >
-            <div class="flex items-center gap-1.5">
-              来自:
-              <Icon icon="svg:logo" />
-              <span>萧康云医</span>
-            </div>
-
-            <div class="flex items-center gap-1.5">
-              收件人:
-              <User class="h-4 w-4" />
-              <span>{{ notice.admin?.nick_name || '系统' }}</span>
-            </div>
-          </div>
-
-          <div
-            class="mb-6 flex flex-wrap items-center gap-x-6 gap-y-2 text-sm text-gray-500 transition-colors dark:text-gray-400"
-          >
-            <div v-html="formatContent(notice.detail)"></div>
-            <div class="flex items-center gap-1.5" style="margin-left: auto">
-              <Clock class="h-4 w-4" />
-              <span>{{ notice.created_at }}({{
-                  formatTimeToRelative(notice.created_at)
-                }})</span>
-            </div>
-          </div>
-
-          <!-- 分隔线 -->
-          <div
-            class="mb-6 h-px w-full bg-gray-100 transition-colors dark:bg-gray-700"
-          ></div>
+          </section>
 
           <!-- VIP 通知：解析 content JSON，展示时效徽标 + 等级徽标 -->
-          <div
-            v-if="vipContent"
-            class="rounded-lg bg-violet-50/80 p-4 transition-colors dark:bg-violet-900/20"
-          >
-            <div class="mb-3 text-sm font-medium text-violet-700 dark:text-violet-300">
-              {{ vipSceneLabel }}
-            </div>
-            <div class="mb-3 flex items-center gap-4">
+          <section v-if="vipContent" class="body-card vip-card">
+            <div class="vip-scene">{{ vipSceneLabel }}</div>
+            <div class="vip-main">
               <VipBadgeCombo
                 size="lg"
                 :badge-url="vipContent.badge_url"
@@ -282,117 +194,408 @@ const showUnreadList = () => {
                 :level-name="vipContent.level_name"
                 :duration-label="vipContent.duration_label"
               />
-              <div class="text-sm text-gray-700 dark:text-gray-200">
-                <div>{{ vipContent.duration_label || '-' }} · {{ vipContent.level_name || '-' }}（{{ vipContent.level_code || '-' }}）</div>
-                <div class="mt-1 text-gray-500">门店：{{ vipContent.store_name || '-' }}</div>
+              <div class="vip-info">
+                <div class="vip-line">
+                  {{ vipContent.duration_label || '-' }} · {{ vipContent.level_name || '-' }}（{{ vipContent.level_code || '-' }}）
+                </div>
+                <div class="vip-line is-sub">门店：{{ vipContent.store_name || '-' }}</div>
               </div>
             </div>
-            <div class="text-xs text-gray-500 dark:text-gray-400">
+            <div class="vip-price">
               原价 ¥{{ vipContent.original_price || '0.00' }}
               · 实付 ¥{{ vipContent.pay_amount || '0.00' }}
             </div>
-          </div>
+          </section>
 
-          <!-- 内容 -->
-          <div
-            v-else-if="notice.edit_type === 0"
-            class="rounded-lg bg-gray-50 p-4 transition-colors dark:bg-gray-700"
-          >
+          <!-- 富文本 / Markdown 内容 -->
+          <section v-else class="body-card">
             <div
-              class="prose prose-sm dark:prose-invert max-w-none text-gray-700 transition-colors dark:text-gray-300"
+              v-if="notice.edit_type === 0"
+              class="prose prose-sm dark:prose-invert content-text max-w-none"
               v-html="formatContent(notice.content)"
             ></div>
-          </div>
-          <MdPreview
-            v-else-if="notice.edit_type === 1"
-            v-model="notice.content"
-            style="padding: 10px 20px"
-            theme="dark"
-          />
-        </div>
-
-        <!-- 操作按钮 -->
-        <div class="flex justify-between">
-          <button
-            class="flex items-center gap-2 rounded-lg border border-gray-200 bg-white px-4 py-2 text-sm font-medium text-gray-700 shadow-sm transition-colors hover:bg-gray-50 dark:border-gray-700 dark:bg-gray-800 dark:text-gray-300 dark:hover:bg-gray-700"
-            @click="goBack"
-          >
-            <ArrowLeft class="h-4 w-4" />
-            返回列表
-          </button>
-
-          <div class="flex gap-2">
-            <!-- 这里可以添加其他操作按钮，如删除、转发等 -->
+            <MdPreview
+              v-else-if="notice.edit_type === 1"
+              :model-value="String(notice.content || '')"
+              :theme="mdTheme"
+              class="md-body"
+            />
+          </section>
 
+          <!-- 底部操作 -->
+          <footer class="detail-actions">
+            <button type="button" class="ghost-btn" @click="goBack">
+              <ArrowLeft class="size-4" />
+              返回列表
+            </button>
             <button
               v-if="notice.is_my === 1"
-              class="flex items-center gap-2 rounded-lg border border-gray-200 bg-white px-4 py-2 text-sm font-medium text-gray-700 shadow-sm transition-colors hover:bg-gray-50 dark:border-gray-700 dark:bg-gray-800 dark:text-gray-300 dark:hover:bg-gray-700"
+              type="button"
+              class="ghost-btn"
+              :class="{ 'is-accent': notice.is_all_read !== 1 }"
               @click="showUnreadList"
             >
+              <Users class="size-4" />
               {{
                 notice.is_all_read === 1
                   ? '全部已读'
                   : `有 ${notice.unread_count} 人未读`
               }}
             </button>
-          </div>
-        </div>
-      </div>
+          </footer>
+        </template>
 
-      <!-- 通知不存在 -->
-      <div
-        v-else
-        class="rounded-lg border border-gray-200 bg-white p-8 text-center shadow-sm transition-colors dark:border-gray-700 dark:bg-gray-800"
-      >
-        <Bell class="mx-auto mb-4 h-12 w-12 text-gray-300 dark:text-gray-600" />
-        <h3
-          class="mb-2 text-lg font-medium text-gray-900 transition-colors dark:text-gray-100"
-        >
-          通知不存在
-        </h3>
-        <p class="mb-4 text-gray-500 transition-colors dark:text-gray-400">
-          该通知可能已被删除或您没有权限查看
-        </p>
-        <button
-          class="rounded-md bg-sky-500 px-4 py-2 text-sm font-medium text-white transition-colors hover:bg-sky-600 dark:bg-sky-600 dark:hover:bg-sky-500"
-          @click="goBack"
-        >
-          返回通知列表
-        </button>
+        <!-- 通知不存在 -->
+        <div v-else class="state-box">
+          <div class="state-ico">
+            <Bell class="size-7" />
+          </div>
+          <p class="state-title">通知不存在</p>
+          <p>该通知可能已被删除或您没有权限查看</p>
+          <button type="button" class="retry-btn" @click="goBack">返回通知列表</button>
+        </div>
       </div>
     </div>
   </Page>
 </template>
 
 <style scoped>
-/* 新增 Markdown 样式（如果使用 GitHub 风格） */
-
-/* 调整 Markdown 容器样式 */
-.markdown-body {
-  padding: 20px;
-}
-/* 平滑过渡效果 */
-.fade-enter-active,
-.fade-leave-active {
-  transition: opacity 0.3s ease;
+.notice-detail {
+  --ease: cubic-bezier(0.22, 1, 0.36, 1);
+  position: relative;
+  min-height: 100%;
+  padding: 24px 20px 48px;
+  overflow: hidden;
 }
 
-.fade-enter-from,
-.fade-leave-to {
-  opacity: 0;
+/* 顶部氛围渐变：按消息类型色晕染，暗色下同样成立（低透明度） */
+.detail-atmosphere {
+  pointer-events: none;
+  position: absolute;
+  inset: 0 0 auto 0;
+  height: 240px;
+  background:
+    radial-gradient(55% 90% at 15% 0%, hsl(var(--tone) / 0.14), transparent 70%),
+    radial-gradient(40% 60% at 85% 8%, hsl(var(--tone) / 0.07), transparent 65%);
+  mask-image: linear-gradient(to bottom, #000 40%, transparent);
 }
 
-/* 确保内容中的换行正确显示 */
-:deep(.prose) {
+.detail-wrap {
+  position: relative;
+  z-index: 1;
+  max-width: 760px;
+  margin: 0 auto;
+}
+
+.detail-topbar {
+  margin-bottom: 16px;
+}
+
+.back-btn {
+  display: inline-flex;
+  align-items: center;
+  gap: 6px;
+  height: 34px;
+  padding: 0 12px;
+  border: 1px solid hsl(var(--border) / 0.8);
+  border-radius: 999px;
+  background: hsl(var(--card, var(--background)) / 0.7);
+  backdrop-filter: blur(8px);
+  color: hsl(var(--foreground));
+  font-size: 13px;
+  cursor: pointer;
+  transition:
+    background 0.2s var(--ease),
+    border-color 0.2s var(--ease);
+}
+
+.back-btn:hover {
+  background: hsl(var(--muted) / 0.45);
+  border-color: hsl(var(--foreground) / 0.18);
+}
+
+/* ===== Hero 卡片 ===== */
+.hero-card {
+  padding: 22px 24px;
+  border: 1px solid hsl(var(--border) / 0.8);
+  border-radius: 18px;
+  background:
+    radial-gradient(80% 130% at 0% 0%, hsl(var(--tone) / 0.08), transparent 60%),
+    hsl(var(--card, var(--background)));
+  box-shadow: 0 1px 2px rgb(0 0 0 / 4%);
+  animation: rise 0.4s var(--ease) both;
+}
+
+.hero-kicker {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  flex-wrap: wrap;
+  gap: 8px;
+  margin-bottom: 12px;
+}
+
+.type-pill {
+  display: inline-flex;
+  align-items: center;
+  gap: 5px;
+  height: 24px;
+  padding: 0 10px;
+  border-radius: 999px;
+  font-size: 12px;
+  font-weight: 600;
+  color: hsl(var(--tone));
+  background: hsl(var(--tone) / 0.12);
+}
+
+.hero-time {
+  display: inline-flex;
+  align-items: center;
+  gap: 5px;
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+  font-variant-numeric: tabular-nums;
+}
+
+.hero-title {
+  margin: 0;
+  font-size: 22px;
+  font-weight: 700;
+  letter-spacing: -0.02em;
+  line-height: 1.3;
+  color: hsl(var(--foreground));
+}
+
+.hero-desc {
+  margin: 10px 0 0;
+  font-size: 13.5px;
+  line-height: 1.55;
+  color: hsl(var(--muted-foreground));
+}
+
+.hero-meta {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 8px;
+  margin-top: 14px;
+}
+
+.meta-chip {
+  display: inline-flex;
+  align-items: center;
+  gap: 5px;
+  height: 26px;
+  padding: 0 10px;
+  border-radius: 999px;
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+  background: hsl(var(--muted) / 0.5);
+}
+
+/* ===== 内容卡片 ===== */
+.body-card {
+  margin-top: 14px;
+  padding: 20px 24px;
+  border: 1px solid hsl(var(--border) / 0.8);
+  border-radius: 18px;
+  background: hsl(var(--card, var(--background)));
+  box-shadow: 0 1px 2px rgb(0 0 0 / 4%);
+  animation: rise 0.4s var(--ease) 0.06s both;
+}
+
+.content-text {
+  color: hsl(var(--foreground) / 0.85);
   white-space: pre-line;
+  line-height: 1.65;
 }
 
-/* 暗黑模式特有样式 */
-.dark .bg-gray-750 {
-  background-color: #1e293b;
+/* MdPreview 背景交给卡片，避免深浅两层底色打架 */
+.md-body {
+  background: transparent;
 }
 
-.dark .bg-gray-650 {
-  background-color: #334155;
+.md-body :deep(.md-editor-preview-wrapper) {
+  padding: 0;
+}
+
+/* ===== VIP 卡片：紫调走类型 tone 变量 ===== */
+.vip-card {
+  background:
+    radial-gradient(90% 140% at 100% 0%, hsl(var(--tone) / 0.1), transparent 55%),
+    hsl(var(--card, var(--background)));
+}
+
+.vip-scene {
+  margin-bottom: 12px;
+  font-size: 13px;
+  font-weight: 650;
+  color: hsl(var(--tone));
+}
+
+.vip-main {
+  display: flex;
+  align-items: center;
+  gap: 16px;
+}
+
+.vip-line {
+  font-size: 14px;
+  color: hsl(var(--foreground));
+}
+
+.vip-line.is-sub {
+  margin-top: 4px;
+  font-size: 13px;
+  color: hsl(var(--muted-foreground));
+}
+
+.vip-price {
+  margin-top: 12px;
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+}
+
+/* ===== 底部操作 ===== */
+.detail-actions {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 8px;
+  margin-top: 16px;
+  animation: rise 0.4s var(--ease) 0.12s both;
+}
+
+.ghost-btn {
+  display: inline-flex;
+  align-items: center;
+  gap: 6px;
+  height: 36px;
+  padding: 0 14px;
+  border: 1px solid hsl(var(--border) / 0.8);
+  border-radius: 999px;
+  background: hsl(var(--card, var(--background)) / 0.7);
+  color: hsl(var(--foreground));
+  font-size: 13px;
+  cursor: pointer;
+  transition:
+    background 0.2s var(--ease),
+    border-color 0.2s var(--ease),
+    color 0.2s var(--ease);
+}
+
+.ghost-btn:hover {
+  background: hsl(var(--muted) / 0.45);
+  border-color: hsl(var(--foreground) / 0.18);
+}
+
+/* 有未读时强调：主色描边提醒发送者跟进 */
+.ghost-btn.is-accent {
+  border-color: hsl(var(--primary) / 0.4);
+  background: hsl(var(--primary) / 0.08);
+  color: hsl(var(--primary));
+}
+
+.ghost-btn.is-accent:hover {
+  background: hsl(var(--primary) / 0.14);
+}
+
+/* ===== 加载 / 错误 / 空状态 ===== */
+.state-box {
+  display: grid;
+  place-items: center;
+  gap: 8px;
+  padding: 72px 20px;
+  text-align: center;
+  font-size: 13px;
+  color: hsl(var(--muted-foreground));
+}
+
+.state-spinner {
+  width: 42px;
+  height: 42px;
+  border-radius: 50%;
+  border: 2px solid hsl(var(--primary) / 0.25);
+  border-top-color: hsl(var(--primary));
+  animation: spin 0.8s linear infinite;
+}
+
+.state-ico {
+  width: 64px;
+  height: 64px;
+  margin-bottom: 8px;
+  border-radius: 22px;
+  display: grid;
+  place-items: center;
+  background: hsl(var(--muted) / 0.45);
+  color: hsl(var(--foreground) / 0.55);
+}
+
+.state-title {
+  margin: 0;
+  font-size: 16px;
+  font-weight: 650;
+  color: hsl(var(--foreground));
+}
+
+.state-box.is-error {
+  color: hsl(var(--destructive));
+}
+
+.retry-btn {
+  margin-top: 8px;
+  height: 32px;
+  padding: 0 16px;
+  border: none;
+  border-radius: 999px;
+  background: hsl(var(--primary));
+  color: hsl(var(--primary-foreground));
+  font-size: 13px;
+  font-weight: 500;
+  cursor: pointer;
+  transition: opacity 0.15s ease;
+}
+
+.retry-btn:hover {
+  opacity: 0.88;
+}
+
+@keyframes rise {
+  from {
+    opacity: 0;
+    transform: translateY(10px);
+  }
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
+}
+
+@keyframes spin {
+  to {
+    transform: rotate(360deg);
+  }
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .hero-card,
+  .body-card,
+  .detail-actions {
+    animation: none;
+  }
+}
+
+@media (max-width: 720px) {
+  .notice-detail {
+    padding: 16px 12px 36px;
+  }
+
+  .hero-card,
+  .body-card {
+    padding: 16px;
+  }
+
+  .hero-title {
+    font-size: 19px;
+  }
 }
 </style>
diff --git a/apps/web-antd/src/views/notice/compoents/send.vue b/apps/web-antd/src/views/notice/compoents/send.vue
index d7a44af4..a90f36de 100644
--- a/apps/web-antd/src/views/notice/compoents/send.vue
+++ b/apps/web-antd/src/views/notice/compoents/send.vue
@@ -18,6 +18,7 @@ import {
 
 import { uploadFile } from '#/api/core/upload';
 import { getUserOptionApi, sendNoticeApi } from '#/views/notice/api';
+import { getAdminNoticeTypeOption } from '#/views/system/admin-notice-type/api';
 
 // Import Markdown editor (using a popular Vue 3 Markdown editor)
 import { MdEditor } from 'md-editor-v3';
@@ -32,15 +33,10 @@ const title = ref('');
 const detail = ref('');
 const content = ref('');
 const markdownContent = ref(''); // For 1 content
-const type = ref(0);
+const typeCode = ref('system');
 const userIds = ref([]);
 const editorMode = ref(0); // 0 or 1
-const typeOption = ref([
-  {
-    label: '公告',
-    value: 0,
-  },
-]);
+const typeOption = ref<{ label: string; value: string }[]>([]);
 
 // 用户选项数据
 const userOption = ref([]);
@@ -56,6 +52,16 @@ const getUserOption = () => {
 };
 getUserOption();
 
+getAdminNoticeTypeOption().then((res) => {
+  typeOption.value = (res || []).map((item: any) => ({
+    label: item.label,
+    value: item.value,
+  }));
+  if (!typeOption.value.find((t) => t.value === typeCode.value)) {
+    typeCode.value = typeOption.value[0]?.value || 'system';
+  }
+});
+
 // Watch for editor mode changes to convert content between formats
 watch(editorMode, (newMode, oldMode) => {
   if (newMode === oldMode) return;
@@ -93,7 +99,7 @@ const send = () => {
 
   sendNoticeApi({
     title: title.value,
-    type: type.value,
+    type_code: typeCode.value,
     edit_type: editorMode.value,
     detail: detail.value,
     content: finalContent,
@@ -333,9 +339,9 @@ const setupQuillPasteHandler = () => {
       <!-- 消息标题输入框 -->
       <Input v-model:value="title" placeholder="请输入消息标题" />
 
-      <!-- 消息类型选择器 -->
+      <!-- 消息类型选择器（字典 type_code） -->
       <Select
-        v-model:value="type"
+        v-model:value="typeCode"
         class="mt-5 w-full"
         placeholder="请选择消息类型"
       >
@@ -344,9 +350,9 @@ const setupQuillPasteHandler = () => {
         </template>
       </Select>
 
-      <!-- 用户选择器，仅在类型为2时显示 -->
+      <!-- 非广播类型需指定接收人 -->
       <Select
-        v-if="type === 2"
+        v-if="typeCode !== 'broadcast'"
         v-model:value="userIds"
         class="mt-5 w-full"
         mode="multiple"
diff --git a/apps/web-antd/src/views/notice/index.vue b/apps/web-antd/src/views/notice/index.vue
index 688d5ba8..8b9cf186 100644
--- a/apps/web-antd/src/views/notice/index.vue
+++ b/apps/web-antd/src/views/notice/index.vue
@@ -1,566 +1,441 @@
 <script setup lang="ts">
+/**
+ * 消息中心：C 端产品向收件箱
+ * 按日分组时间线 + 氛围头图 + 未读浅底，避免后台表格/芯片堆砌感
+ */
 import { computed, onMounted, ref, watch } from 'vue';
-import { useRouter } from 'vue-router';
 
-import { Page } from '@vben/common-ui';
+import { Page, VbenIcon } from '@vben/common-ui';
 
-import { Button, notification, Tag } from 'ant-design-vue';
+import { notification } from 'ant-design-vue';
 import {
+  ArrowRight,
   Bell,
-  CalendarClock,
-  CheckCircle2,
-  ChevronDown,
-  ChevronLeft,
-  ChevronRight,
-  Eye,
-  Filter,
-  Megaphone,
+  CheckCheck,
+  Inbox,
   Search,
+  Sparkles,
   X,
 } from 'lucide-vue-next';
 
-import { getNoticeListApi, readAllApi, readApi } from '#/views/notice/api';
+import { openNoticeAction } from '#/views/notice/action/bus';
+import {
+  resolveNoticeColor,
+  resolveNoticeGlow,
+} from '#/views/notice/action/types';
+import {
+  getNoticeListApi,
+  readAllApi,
+  readApi,
+} from '#/views/notice/api';
+import { getAdminNoticeTypeOption } from '#/views/system/admin-notice-type/api';
 
-const router = useRouter();
+defineOptions({ name: 'NoticeList' });
 
-// 消息数据和分页状态
-const messages = ref([]);
+const messages = ref<any[]>([]);
 const loading = ref(false);
 const currentPage = ref(1);
-const pageSize = ref(5);
+const pageSize = ref(20);
 const total = ref(0);
 const totalPages = ref(1);
-
-// 筛选相关
-const filterType = ref(-1); // -1表示全部
+const unreadTotal = ref(0);
+const filterTypeCode = ref('');
+const filterUnreadOnly = ref(false);
 const searchQuery = ref('');
-const showFilterDropdown = ref(false);
+const searchOpen = ref(false);
+const typeOptions = ref<
+  { label: string; value: string; icon?: string; color?: string }[]
+>([]);
 
-// 消息类型定义
-const messageTypes = [
-  { id: -1, name: '全部消息' },
-  { id: 0, name: '系统公告', icon: Megaphone },
-  { id: 1, name: '系统通知', icon: Bell },
-  { id: 2, name: '周报提醒', icon: CalendarClock },
-];
+const segments = computed(() => {
+  const list = [
+    { key: 'all', label: '全部' },
+    { key: 'unread', label: '未读' },
+  ];
+  // 只露出高频类型，避免一排后台筛选芯片
+  const prefer = [
+    'withdraw_audit',
+    'warehouse_product_audit',
+    'period_report',
+    'vip',
+    'system',
+    'broadcast',
+  ];
+  const ranked = [...typeOptions.value].sort((a, b) => {
+    const ai = prefer.indexOf(a.value);
+    const bi = prefer.indexOf(b.value);
+    return (ai === -1 ? 99 : ai) - (bi === -1 ? 99 : bi);
+  });
+  for (const t of ranked.slice(0, 5)) {
+    list.push({ key: t.value, label: t.label });
+  }
+  return list;
+});
 
-// 获取消息列表数据
-const getNoticeList = async () => {
+const activeSegment = computed(() => {
+  if (filterUnreadOnly.value) return 'unread';
+  return filterTypeCode.value || 'all';
+});
+
+function selectSegment(key: string) {
+  if (key === 'unread') {
+    filterUnreadOnly.value = true;
+    filterTypeCode.value = '';
+    return;
+  }
+  filterUnreadOnly.value = false;
+  filterTypeCode.value = key === 'all' ? '' : key;
+}
+
+/** 解析时间戳或已格式化字符串 → Date */
+function toDate(raw: string | number): Date | null {
+  if (raw == null || raw === '') return null;
+  if (typeof raw === 'number') {
+    const ms = raw < 1e12 ? raw * 1000 : raw;
+    const d = new Date(ms);
+    return Number.isNaN(d.getTime()) ? null : d;
+  }
+  const s = String(raw).trim();
+  if (/^\d+$/.test(s)) {
+    const n = Number(s);
+    const ms = n < 1e12 ? n * 1000 : n;
+    const d = new Date(ms);
+    return Number.isNaN(d.getTime()) ? null : d;
+  }
+  const d = new Date(s.replace(/-/g, '/'));
+  return Number.isNaN(d.getTime()) ? null : d;
+}
+
+function startOfDay(d: Date) {
+  return new Date(d.getFullYear(), d.getMonth(), d.getDate()).getTime();
+}
+
+function groupLabel(d: Date): string {
+  const today = startOfDay(new Date());
+  const day = startOfDay(d);
+  const diff = Math.round((today - day) / 86400000);
+  if (diff === 0) return '今天';
+  if (diff === 1) return '昨天';
+  if (diff > 1 && diff < 7) return '近 7 天';
+  return '更早';
+}
+
+function formatClock(d: Date) {
+  const hh = String(d.getHours()).padStart(2, '0');
+  const mm = String(d.getMinutes()).padStart(2, '0');
+  return `${hh}:${mm}`;
+}
+
+function formatDay(d: Date) {
+  return `${d.getMonth() + 1}月${d.getDate()}日`;
+}
+
+/** 按日分组：今天 / 昨天 / 近7天 / 更早（保持 messages 引用，便于就地改已读） */
+const grouped = computed(() => {
+  const order = ['今天', '昨天', '近 7 天', '更早'];
+  const map = new Map<string, any[]>();
+  for (const item of messages.value) {
+    const d = toDate(item.date || item.created_at);
+    const label = d ? groupLabel(d) : '更早';
+    if (!map.has(label)) map.set(label, []);
+    // 就地挂展示字段，不 spread 成新对象，否则点开改 status 不会回写列表
+    item._date = d;
+    item._clock = d ? formatClock(d) : '';
+    item._day = d ? formatDay(d) : '';
+    map.get(label)!.push(item);
+  }
+  return order
+    .filter((k) => map.has(k))
+    .map((k) => ({ label: k, items: map.get(k)! }));
+});
+
+const heroSubtitle = computed(() => {
+  if (unreadTotal.value > 0) {
+    return `有 ${unreadTotal.value} 条事需要你留意`;
+  }
+  return '所有消息都已读完';
+});
+
+async function loadTypes() {
+  try {
+    typeOptions.value = (await getAdminNoticeTypeOption()) || [];
+  } catch {
+    typeOptions.value = [];
+  }
+}
+
+async function getNoticeList(append = false) {
   loading.value = true;
   try {
     const res = await getNoticeListApi({
       page: currentPage.value,
-      size: pageSize.value,
-      type: filterType.value === -1 ? undefined : filterType.value,
+      pageSize: pageSize.value,
+      type_code: filterTypeCode.value || undefined,
+      status: filterUnreadOnly.value ? 0 : undefined,
       title: searchQuery.value || undefined,
     });
-
-    messages.value = res.items.map((item) => ({
+    const items = (res.items || []).map((item: any) => ({
       ...item,
-      // 将API返回的数据映射到组件需要的格式
-      type_txt: getMessageTypeName(item.type),
       date: item.created_at,
-      // status: 0表示未读，1表示已读
     }));
-
-    total.value = res.total;
-    totalPages.value = res.page_count;
+    messages.value = append ? [...messages.value, ...items] : items;
+    total.value = res.total || 0;
+    totalPages.value =
+      res.page_count || Math.ceil(total.value / pageSize.value) || 1;
+    unreadTotal.value = Number(res.unread_total ?? unreadTotal.value);
   } catch (error) {
     console.error('获取消息列表失败:', error);
   } finally {
     loading.value = false;
   }
-};
+}
 
-// 根据类型ID获取类型名称
-const getMessageTypeName = (typeId) => {
-  const type = messageTypes.find((t) => t.id === typeId);
-  return type ? type.name : '未知类型';
-};
-
-// 监听筛选条件变化，重新获取数据
-watch([filterType, searchQuery], () => {
+watch([filterTypeCode, filterUnreadOnly, searchQuery], () => {
   currentPage.value = 1;
-  getNoticeList();
+  getNoticeList(false);
 });
 
-// 监听页码变化，重新获取数据
-watch(currentPage, () => {
-  getNoticeList();
+onMounted(async () => {
+  await loadTypes();
+  getNoticeList(false);
 });
 
-// 组件挂载时获取数据
-onMounted(() => {
-  getNoticeList();
-});
+function colorOf(item: any) {
+  return resolveNoticeColor(item.type_color);
+}
 
-// 未读消息数量
-const unreadCount = computed(() => {
-  return messages.value.filter((msg) => msg.status === 0).length;
-});
+/** 重要未读微光：跟消息类型字典 color 走 */
+function glowOf(item: any) {
+  return resolveNoticeGlow(item.type_color);
+}
 
-// 样式相关
-const typeIcons = {
-  0: Megaphone,
-  1: Bell,
-  2: CalendarClock,
-};
+/**
+ * 点击消息：立刻取消未读态，再打开详情/动作（已读接口不挡 UI）
+ */
+async function handleItemClick(item: any) {
+  if (Number(item.status) === 0) {
+    item.status = 1;
+    unreadTotal.value = Math.max(0, unreadTotal.value - 1);
+  }
+  await openNoticeAction(item);
+}
 
-const typeColors = {
-  0: 'text-sky-500 dark:text-sky-400',
-  1: 'text-amber-500 dark:text-amber-400',
-  2: 'text-emerald-500 dark:text-emerald-400',
-};
-
-const typeBgColors = {
-  0: 'bg-sky-50 dark:bg-sky-900/30',
-  1: 'bg-amber-50 dark:bg-amber-900/30',
-  2: 'bg-emerald-50 dark:bg-emerald-900/30',
-};
-
-const typeBorderColors = {
-  0: 'border-sky-200 dark:border-sky-800',
-  1: 'border-amber-200 dark:border-amber-800',
-  2: 'border-emerald-200 dark:border-emerald-800',
-};
-
-// 处理消息点击
-const handleItemClick = (item) => {
-  router.push(`/notice/detail/${item.id}`);
-};
-
-// 标记消息为已读
-const markAsRead = async (event, item) => {
+async function markAsRead(event: Event, item: any) {
   event.stopPropagation();
   try {
     await readApi(item.id);
-    item.status = 1; // 临时更新UI状态
-    // 成功后可以重新获取数据或者直接更新本地状态
-    notification.success({
-      message: '标记成功',
-      duration: 2,
-    });
-    // getNoticeList();
+    item.status = 1;
+    unreadTotal.value = Math.max(0, unreadTotal.value - 1);
   } catch (error) {
     console.error('标记已读失败:', error);
   }
-};
+}
 
-// 标记所有消息为已读
-const markAllAsRead = async () => {
+async function markAllAsRead() {
   try {
     await readAllApi();
     messages.value.forEach((msg) => {
       msg.status = 1;
     });
-    // 成功后可以重新获取数据或者直接更新本地状态
-    notification.success({
-      message: '标记成功',
-      duration: 2,
-    });
-    // getNoticeList();
+    unreadTotal.value = 0;
+    notification.success({ message: '已全部读完', duration: 1.5 });
   } catch (error) {
     console.error('标记全部已读失败:', error);
   }
-};
+}
 
-// 清除搜索
-const clearSearch = () => {
-  searchQuery.value = '';
-};
-
-// 切换筛选下拉菜单
-const toggleFilterDropdown = () => {
-  showFilterDropdown.value = !showFilterDropdown.value;
-};
-
-// 选择筛选类型
-const selectFilterType = (type) => {
-  filterType.value = type;
-  showFilterDropdown.value = false;
-};
-
-// 分页导航
-const goToPage = (page) => {
-  if (page >= 1 && page <= totalPages.value) {
-    currentPage.value = page;
-  }
-};
-
-// 获取当前选中的筛选类型名称
-const currentFilterName = computed(() => {
-  const type = messageTypes.find((t) => t.id === filterType.value);
-  return type ? type.name : '全部消息';
-});
-
-// 展开消息详情
-const expandedMessage = ref(null);
-const toggleExpand = (event, id) => {
-  event.stopPropagation();
-  expandedMessage.value = expandedMessage.value === id ? null : id;
-};
+async function loadMore() {
+  if (loading.value || currentPage.value >= totalPages.value) return;
+  currentPage.value += 1;
+  await getNoticeList(true);
+}
 </script>
 
 <template>
-  <Page title="消息中心" description="关于执行的操作通知、公告等等信息都会在这里">
-    <template #extra>
-      <div class="flex items-center gap-2">
-        <span class="text-gray-500 dark:text-gray-400">共 {{ total }} 条消息</span>
-        <span
-          v-if="unreadCount > 0"
-          class="rounded-full bg-red-500 px-2 py-0.5 text-xs font-medium text-white dark:bg-red-600"
-        >
-          {{ unreadCount }} 未读
-        </span>
-      </div>
-    </template>
+  <Page auto-content-height content-class="!p-0">
+    <div class="inbox">
+      <div class="inbox-atmosphere" aria-hidden="true"></div>
 
-    <div class="mx-auto max-w-4xl">
-      <!-- 筛选和搜索工具栏 -->
-      <div
-        class="mb-4 flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between"
-      >
-        <!-- 筛选下拉菜单 -->
-        <div class="relative">
+      <header class="inbox-hero">
+        <div class="hero-copy">
+          <p class="hero-kicker">
+            <Sparkles class="size-3.5" />
+            Inbox
+          </p>
+          <h1 class="hero-title">消息</h1>
+          <p class="hero-sub">{{ heroSubtitle }}</p>
+        </div>
+        <div class="hero-actions">
           <button
-            class="flex items-center gap-2 rounded-lg border border-gray-200 bg-white px-4 py-2 text-sm font-medium text-gray-700 shadow-sm transition-colors hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-sky-500 focus:ring-offset-2 dark:border-gray-700 dark:bg-gray-800 dark:text-gray-200 dark:hover:bg-gray-700 dark:focus:ring-sky-400 dark:focus:ring-offset-gray-900"
-            @click="toggleFilterDropdown"
+            type="button"
+            class="ghost-btn"
+            :class="{ on: searchOpen }"
+            aria-label="搜索"
+            @click="searchOpen = !searchOpen"
           >
-            <Filter class="h-4 w-4" />
-            {{ currentFilterName }}
-            <ChevronDown class="h-4 w-4" />
+            <Search class="size-4" />
           </button>
-
-          <div
-            v-if="showFilterDropdown"
-            class="absolute left-0 top-full z-10 mt-1 w-56 origin-top-left rounded-md bg-white shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none dark:bg-gray-800 dark:ring-white dark:ring-opacity-10"
+          <button
+            type="button"
+            class="ghost-btn"
+            :disabled="unreadTotal <= 0"
+            @click="markAllAsRead"
           >
-            <div class="py-1">
-              <button
-                v-for="type in messageTypes"
-                :key="type.id"
-                :class="
-                  filterType === type.id
-                    ? 'bg-gray-50 font-medium text-sky-600 dark:bg-gray-700 dark:text-sky-400'
-                    : 'text-gray-700 dark:text-gray-200'
-                "
-                class="flex w-full items-center gap-2 px-4 py-2 text-left text-sm transition-colors hover:bg-gray-100 dark:hover:bg-gray-700"
-                @click="selectFilterType(type.id)"
-              >
-                <component
-                  :is="type.icon"
-                  v-if="type.id !== -1 && type.icon"
-                  :class="type.id !== -1 ? typeColors[type.id] : ''"
-                  class="h-4 w-4"
-                />
-                {{ type.name }}
-              </button>
+            <CheckCheck class="size-4" />
+            <span>全部已读</span>
+          </button>
+        </div>
+      </header>
+
+      <div v-if="searchOpen" class="search-bar">
+        <Search class="search-ico" />
+        <input
+          v-model="searchQuery"
+          autofocus
+          type="search"
+          placeholder="搜标题、摘要…"
+        />
+        <button
+          v-if="searchQuery"
+          type="button"
+          class="clear-btn"
+          @click="searchQuery = ''"
+        >
+          <X class="size-3.5" />
+        </button>
+      </div>
+
+      <nav class="seg" aria-label="消息筛选">
+        <button
+          v-for="s in segments"
+          :key="s.key"
+          type="button"
+          class="seg-item"
+          :class="{ active: activeSegment === s.key }"
+          @click="selectSegment(s.key)"
+        >
+          {{ s.label }}
+          <span
+            v-if="s.key === 'unread' && unreadTotal > 0"
+            class="seg-badge"
+          >{{ unreadTotal > 99 ? '99+' : unreadTotal }}</span>
+        </button>
+      </nav>
+
+      <div class="timeline">
+        <!-- 首次加载骨架屏：占位形状与真实消息行一致，避免布局跳动 -->
+        <div v-if="loading && messages.length === 0" class="skeleton-list" aria-label="加载中">
+          <div v-for="n in 5" :key="n" class="skeleton-row" :style="{ '--i': n - 1 }">
+            <div class="sk sk-avatar"></div>
+            <div class="sk-lines">
+              <div class="sk sk-title"></div>
+              <div class="sk sk-text"></div>
             </div>
           </div>
         </div>
 
-        <!-- 搜索框 -->
-        <div class="relative flex-1 sm:max-w-xs">
-          <div
-            class="pointer-events-none absolute inset-y-0 left-0 flex items-center pl-3"
-          >
-            <Search class="h-4 w-4 text-gray-400 dark:text-gray-500" />
+        <div v-else-if="messages.length === 0" class="empty-state">
+          <div class="empty-ico">
+            <Inbox class="size-7" />
           </div>
-          <input
-            v-model="searchQuery"
-            class="block w-full rounded-lg border border-gray-200 bg-white py-2 pl-10 pr-10 text-sm text-gray-700 transition-colors focus:border-sky-500 focus:outline-none focus:ring-1 focus:ring-sky-500 dark:border-gray-700 dark:bg-gray-800 dark:text-gray-200 dark:focus:border-sky-400 dark:focus:ring-sky-400"
-            placeholder="搜索消息..."
-            type="text"
-          />
-          <button
-            v-if="searchQuery"
-            class="absolute inset-y-0 right-0 flex items-center pr-3"
-            @click="clearSearch"
-          >
-            <X
-              class="h-4 w-4 text-gray-400 transition-colors hover:text-gray-600 dark:text-gray-500 dark:hover:text-gray-300"
-            />
-          </button>
+          <p class="empty-title">这里很安静</p>
+          <p class="empty-desc">新的审核、报表和系统提醒会出现在这里</p>
         </div>
 
-        <!-- 标记全部已读按钮 -->
-        <button
-          v-if="unreadCount > 0"
-          class="flex items-center gap-1 rounded-lg bg-white px-3 py-2 text-sm font-medium text-gray-700 shadow-sm ring-1 ring-gray-200 transition-colors hover:bg-gray-50 dark:bg-gray-800 dark:text-gray-200 dark:ring-gray-700 dark:hover:bg-gray-700"
-          @click="markAllAsRead"
+        <section
+          v-for="group in grouped"
+          :key="group.label"
+          class="day-group"
         >
-          <CheckCircle2 class="h-4 w-4 text-gray-500 dark:text-gray-400" />
-          标记全部已读
-        </button>
-        <Button type="link" @click="getNoticeList">刷新</Button>
-      </div>
-
-      <!-- 消息列表 -->
-      <div
-        class="overflow-hidden rounded-xl border border-gray-200 bg-white shadow-sm dark:border-gray-700 dark:bg-gray-800"
-      >
-        <!-- 加载状态 -->
-        <div v-if="loading" class="flex justify-center py-12">
-          <div
-            class="h-8 w-8 animate-spin rounded-full border-4 border-gray-200 border-t-sky-500 dark:border-gray-700 dark:border-t-sky-400"
-          ></div>
-        </div>
-
-        <!-- 空状态 -->
-        <div
-          v-else-if="messages.length === 0"
-          class="flex flex-col items-center justify-center py-16"
-        >
-          <Bell class="mb-4 h-16 w-16 text-gray-200 dark:text-gray-700" />
-          <p class="text-gray-500 dark:text-gray-400">暂无消息</p>
-          <p
-            v-if="searchQuery || filterType !== -1"
-            class="mt-2 text-sm text-gray-400 dark:text-gray-500"
-          >
-            尝试调整筛选条件
-          </p>
-        </div>
-
-        <!-- 消息列表 -->
-        <ul v-else class="divide-y divide-gray-100 dark:divide-gray-700">
-          <li
-            v-for="item in messages"
-            :key="item.id"
-            :class="[
-              item.status === 0
-                ? 'bg-gray-50 dark:bg-gray-900'
-                : 'bg-gray-50 dark:bg-gray-800',
-            ]"
-            class="group relative cursor-pointer transition-all duration-200"
-            @click="handleItemClick(item)"
-          >
-            <div class="flex items-start gap-4 p-4 sm:p-5">
-              <!-- 图标 -->
+          <h3 class="day-label">{{ group.label }}</h3>
+          <ul class="day-list">
+            <li
+              v-for="(item, idx) in group.items"
+              :key="item.id"
+              class="msg"
+              :class="{
+                unread: Number(item.status) === 0,
+                actionable: !!item.action_type,
+                priority: Number(item.priority) === 1,
+              }"
+              :style="{
+                '--i': idx,
+                '--notice-glow': glowOf(item),
+              }"
+              role="button"
+              tabindex="0"
+              @click="handleItemClick(item)"
+              @keydown.enter="handleItemClick(item)"
+            >
               <div
-                :class="[
-                  item.status === 1
-                    ? 'bg-gray-100 dark:bg-gray-700'
-                    : typeBgColors[item.type],
-                ]"
-                class="flex h-10 w-10 shrink-0 items-center justify-center rounded-full transition-all duration-200"
-                style="margin: auto 0;"
+                class="avatar"
+                :class="[colorOf(item).bg, colorOf(item).text]"
               >
-                <component
-                  :is="typeIcons[item.type]"
-                  :class="[
-                    item.status === 1
-                      ? 'text-gray-400 group-hover:text-gray-600 dark:text-gray-500 dark:group-hover:text-gray-300'
-                      : typeColors[item.type],
-                  ]"
-                  class="h-5 w-5 transition-all duration-200"
+                <img
+                  v-if="item.cover_url"
+                  :src="item.cover_url"
+                  alt=""
+                  class="avatar-img"
                 />
+                <template v-else>
+                  <VbenIcon
+                    v-if="item.type_icon"
+                    :icon="item.type_icon"
+                    class="size-5"
+                  />
+                  <Bell v-else class="size-5" />
+                </template>
               </div>
 
-              <!-- 内容 -->
-              <div class="min-w-0 flex-1">
-                <div class="flex items-start justify-between gap-2">
-                  <h3
-                    :class="[
-                      item.status === 0
-                        ? 'font-semibold text-gray-900 dark:text-white'
-                        : 'text-gray-700 group-hover:text-gray-900 dark:text-gray-300 dark:group-hover:text-white',
-                    ]"
-                    class="text-sm font-medium transition-all duration-200 sm:text-base"
-                  >
-                    {{ item.title }}
-                  </h3>
-                  <span
-                    class="shrink-0 whitespace-nowrap text-xs text-gray-400 dark:text-gray-500"
-                    >{{ item.date }}</span>
+              <div class="content">
+                <div class="row-top">
+                  <h4 class="title">{{ item.title }}</h4>
+                  <time class="time">{{
+                    group.label === '今天' || group.label === '昨天'
+                      ? item._clock
+                      : item._day
+                  }}</time>
                 </div>
-
-                <div class="mt-1 flex flex-wrap items-center gap-2">
+                <p class="preview">{{ item.detail || item.type_name || '查看详情' }}</p>
+                <div class="meta">
                   <span
-                    :class="[
-                      item.status === 1
-                        ? 'border-gray-200 text-gray-500 dark:border-gray-700 dark:text-gray-400'
-                        : `${typeColors[item.type]} ${typeBorderColors[item.type]}`,
-                    ]"
-                    class="inline-flex items-center rounded-full border px-2 py-0.5 text-xs font-medium transition-all duration-200"
+                    v-if="item.type_name"
+                    class="type-tag"
+                    :class="colorOf(item).text"
+                  >{{ item.type_name }}</span>
+                  <span v-if="Number(item.priority) === 1" class="prio-tag"
+                    >重要</span
                   >
-                    {{ item.type_txt }}
-                  </span>
-
-                  <!-- 详情文本，只显示第一行，可展开 -->
-                  <div class="mt-1 w-full">
-                    <p
-                      :class="[
-                        item.status === 1
-                          ? 'text-gray-500 dark:text-gray-400'
-                          : 'text-gray-700 dark:text-gray-300',
-                        expandedMessage === item.id ? '' : 'line-clamp-1',
-                      ]"
-                      class="text-xs transition-all duration-200"
-                    >
-                      {{ item.detail }}
-                    </p>
-
-                    <!-- 展开/收起按钮 -->
-                    <button
-                      v-if="item.detail && item.detail.length > 70"
-                      class="mt-1 flex items-center gap-1 text-xs text-sky-500 transition-colors hover:text-sky-600 dark:text-sky-400 dark:hover:text-sky-300"
-                      @click="toggleExpand($event, item.id)"
-                    >
-                      <Eye class="h-3 w-3" />
-                      {{ expandedMessage === item.id ? '收起' : '展开' }}
-                    </button>
-                  </div>
-
-                  <span
-                    v-if="item.is_my === 1"
-                    style="position: absolute; bottom: 10px; right: 10px"
-                  >
-                    我发布的 （{{ item.is_all_read === 1 ? '全部已读' : `有 ${item.unread_count} 人未读` }}）
-                  </span>
                 </div>
               </div>
 
-              <!-- 操作按钮 -->
-              <div class="flex shrink-0 items-center gap-2">
+              <div class="aside">
+                <span
+                  v-if="Number(item.status) === 0"
+                  class="dot"
+                  aria-label="未读"
+                ></span>
                 <button
-                  v-if="item.status === 0"
-                  class="rounded-full p-1.5 text-gray-400 transition-all duration-200 hover:bg-gray-100 hover:text-gray-600 dark:text-gray-500 dark:hover:bg-gray-700 dark:hover:text-gray-300"
-                  title="标记为已读"
+                  v-if="Number(item.status) === 0"
+                  type="button"
+                  class="mark"
                   @click="markAsRead($event, item)"
                 >
-                  <CheckCircle2 class="h-5 w-5" />
+                  标已读
                 </button>
-                <ChevronRight
-                  class="h-5 w-5 text-gray-300 transition-all duration-200 group-hover:text-gray-400 dark:text-gray-600 dark:group-hover:text-gray-500"
-                />
+                <span v-if="item.action_type" class="go">
+                  去处理
+                  <ArrowRight class="size-3.5" />
+                </span>
               </div>
-            </div>
+            </li>
+          </ul>
+        </section>
 
-            <!-- 未读指示器 -->
-            <div
-              v-if="item.status === 0"
-              :class="[typeColors[item.type]]"
-              class="absolute bottom-0 left-0 top-0 w-1"
-            ></div>
-          </li>
-        </ul>
-
-        <!-- 分页控件 -->
-        <div
-          v-if="totalPages > 1"
-          class="dark:bg-gray-750 flex items-center justify-between border-t border-gray-200 bg-gray-50 px-4 py-3 sm:px-6 dark:border-gray-700"
-        >
-          <div class="flex flex-1 justify-between sm:hidden">
-            <button
-              :class="[
-                currentPage === 1
-                  ? 'text-gray-300 dark:text-gray-600'
-                  : 'text-gray-700 hover:bg-gray-50 dark:text-gray-300 dark:hover:bg-gray-700',
-              ]"
-              :disabled="currentPage === 1"
-              class="relative inline-flex items-center rounded-md border border-gray-300 bg-white px-4 py-2 text-sm font-medium transition-colors dark:border-gray-600 dark:bg-gray-800"
-              @click="goToPage(currentPage - 1)"
-            >
-              上一页
-            </button>
-            <button
-              :class="[
-                currentPage === totalPages
-                  ? 'text-gray-300 dark:text-gray-600'
-                  : 'text-gray-700 hover:bg-gray-50 dark:text-gray-300 dark:hover:bg-gray-700',
-              ]"
-              :disabled="currentPage === totalPages"
-              class="relative ml-3 inline-flex items-center rounded-md border border-gray-300 bg-white px-4 py-2 text-sm font-medium transition-colors dark:border-gray-600 dark:bg-gray-800"
-              @click="goToPage(currentPage + 1)"
-            >
-              下一页
-            </button>
-          </div>
-          <div
-            class="hidden sm:flex sm:flex-1 sm:items-center sm:justify-between"
-          >
-            <div>
-              <p class="text-sm text-gray-700 dark:text-gray-300">
-                显示第
-                <span class="font-medium">{{
-                  (currentPage - 1) * pageSize + 1
-                }}</span>
-                至
-                <span class="font-medium">{{
-                  Math.min(currentPage * pageSize, total)
-                }}</span>
-                条， 共
-                <span class="font-medium">{{ total }}</span>
-                条
-              </p>
-            </div>
-            <div>
-              <nav
-                aria-label="Pagination"
-                class="isolate inline-flex -space-x-px rounded-md shadow-sm"
-              >
-                <button
-                  :class="
-                    currentPage === 1
-                      ? 'cursor-not-allowed'
-                      : 'hover:text-gray-500 dark:hover:text-gray-300'
-                  "
-                  :disabled="currentPage === 1"
-                  class="relative inline-flex items-center rounded-l-md px-2 py-2 text-gray-400 ring-1 ring-inset ring-gray-300 transition-colors hover:bg-gray-50 focus:z-20 focus:outline-offset-0 dark:text-gray-500 dark:ring-gray-600 dark:hover:bg-gray-700"
-                  @click="goToPage(currentPage - 1)"
-                >
-                  <span class="sr-only">上一页</span>
-                  <ChevronLeft class="h-5 w-5" />
-                </button>
-
-                <!-- 页码按钮 -->
-                <template v-for="page in totalPages" :key="page">
-                  <button
-                    v-if="
-                      page === currentPage ||
-                      page === 1 ||
-                      page === totalPages ||
-                      (page >= currentPage - 1 && page <= currentPage + 1)
-                    "
-                    :class="[
-                      page === currentPage
-                        ? 'z-10 bg-sky-500 text-white focus:z-20 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-sky-500 dark:bg-sky-600 dark:focus-visible:outline-sky-400'
-                        : 'text-gray-900 ring-1 ring-inset ring-gray-300 hover:bg-gray-50 focus:z-20 focus:outline-offset-0 dark:text-gray-200 dark:ring-gray-600 dark:hover:bg-gray-700',
-                    ]"
-                    class="relative inline-flex items-center px-4 py-2 text-sm font-semibold transition-colors"
-                    @click="goToPage(page)"
-                  >
-                    {{ page }}
-                  </button>
-
-                  <!-- 省略号 -->
-                  <span
-                    v-else-if="
-                      (page === 2 && currentPage > 3) ||
-                      (page === totalPages - 1 && currentPage < totalPages - 2)
-                    "
-                    class="relative inline-flex items-center px-4 py-2 text-sm font-semibold text-gray-700 ring-1 ring-inset ring-gray-300 dark:text-gray-300 dark:ring-gray-600"
-                  >
-                    ...
-                  </span>
-                </template>
-
-                <button
-                  :class="
-                    currentPage === totalPages
-                      ? 'cursor-not-allowed'
-                      : 'hover:text-gray-500 dark:hover:text-gray-300'
-                  "
-                  :disabled="currentPage === totalPages"
-                  class="relative inline-flex items-center rounded-r-md px-2 py-2 text-gray-400 ring-1 ring-inset ring-gray-300 transition-colors hover:bg-gray-50 focus:z-20 focus:outline-offset-0 dark:text-gray-500 dark:ring-gray-600 dark:hover:bg-gray-700"
-                  @click="goToPage(currentPage + 1)"
-                >
-                  <span class="sr-only">下一页</span>
-                  <ChevronRight class="h-5 w-5" />
-                </button>
-              </nav>
-            </div>
-          </div>
+        <div v-if="currentPage < totalPages" class="more-wrap">
+          <button type="button" class="more-btn" @click="loadMore">
+            {{ loading ? '加载中…' : '加载更早的消息' }}
+          </button>
         </div>
       </div>
     </div>
@@ -568,47 +443,638 @@ const toggleExpand = (event, id) => {
 </template>
 
 <style scoped>
-.line-clamp-1 {
+.inbox {
+  --ease: cubic-bezier(0.22, 1, 0.36, 1);
+  position: relative;
+  min-height: 100%;
+  padding: 28px 20px 48px;
+  overflow: hidden;
+}
+
+.inbox-atmosphere {
+  pointer-events: none;
+  position: absolute;
+  inset: 0 0 auto 0;
+  height: 280px;
+  background:
+    radial-gradient(
+      60% 80% at 12% 0%,
+      hsl(var(--primary) / 0.16),
+      transparent 70%
+    ),
+    radial-gradient(
+      45% 60% at 88% 10%,
+      hsl(var(--primary) / 0.08),
+      transparent 65%
+    );
+  mask-image: linear-gradient(to bottom, #000 40%, transparent);
+}
+
+.inbox-hero,
+.search-bar,
+.seg,
+.timeline {
+  position: relative;
+  z-index: 1;
+  max-width: 760px;
+  margin-left: auto;
+  margin-right: auto;
+}
+
+.inbox-hero {
+  display: flex;
+  align-items: flex-end;
+  justify-content: space-between;
+  gap: 16px;
+  margin-bottom: 20px;
+}
+
+.hero-kicker {
+  display: inline-flex;
+  align-items: center;
+  gap: 6px;
+  margin: 0 0 8px;
+  color: hsl(var(--primary));
+  font-size: 12px;
+  font-weight: 600;
+  letter-spacing: 0.08em;
+  text-transform: uppercase;
+}
+
+.hero-title {
+  margin: 0;
+  font-size: clamp(34px, 5vw, 44px);
+  font-weight: 700;
+  letter-spacing: -0.04em;
+  line-height: 1.05;
+  color: hsl(var(--foreground));
+}
+
+.hero-sub {
+  margin: 10px 0 0;
+  font-size: 15px;
+  color: hsl(var(--muted-foreground));
+  letter-spacing: -0.01em;
+}
+
+.hero-actions {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  padding-bottom: 4px;
+}
+
+.ghost-btn {
+  display: inline-flex;
+  align-items: center;
+  gap: 6px;
+  height: 36px;
+  padding: 0 12px;
+  border: 1px solid hsl(var(--border) / 0.8);
+  border-radius: 999px;
+  background: hsl(var(--card, var(--background)) / 0.7);
+  backdrop-filter: blur(8px);
+  color: hsl(var(--foreground));
+  font-size: 13px;
+  cursor: pointer;
+  transition:
+    background 0.2s var(--ease),
+    border-color 0.2s var(--ease),
+    transform 0.2s var(--ease);
+}
+
+.ghost-btn:hover:not(:disabled) {
+  background: hsl(var(--muted) / 0.45);
+  border-color: hsl(var(--foreground) / 0.18);
+}
+
+.ghost-btn.on {
+  border-color: hsl(var(--primary) / 0.4);
+  background: hsl(var(--primary) / 0.1);
+  color: hsl(var(--primary));
+}
+
+.ghost-btn:disabled {
+  opacity: 0.35;
+  cursor: not-allowed;
+}
+
+.search-bar {
+  position: relative;
+  margin-bottom: 14px;
+  animation: rise 0.28s var(--ease);
+}
+
+.search-bar input {
+  width: 100%;
+  height: 44px;
+  padding: 0 40px 0 42px;
+  border: 1px solid hsl(var(--border) / 0.7);
+  border-radius: 14px;
+  background: hsl(var(--card, var(--background)) / 0.85);
+  color: hsl(var(--foreground));
+  font-size: 14px;
+  outline: none;
+  box-shadow: 0 10px 30px hsl(var(--foreground) / 0.03);
+}
+
+.search-bar input:focus {
+  border-color: hsl(var(--primary) / 0.45);
+  box-shadow: 0 0 0 3px hsl(var(--primary) / 0.12);
+}
+
+.search-ico {
+  position: absolute;
+  left: 14px;
+  top: 50%;
+  width: 16px;
+  height: 16px;
+  transform: translateY(-50%);
+  color: hsl(var(--muted-foreground));
+}
+
+.clear-btn {
+  position: absolute;
+  right: 10px;
+  top: 50%;
+  transform: translateY(-50%);
+  display: grid;
+  place-items: center;
+  width: 26px;
+  height: 26px;
+  border: none;
+  border-radius: 50%;
+  background: hsl(var(--muted) / 0.7);
+  color: hsl(var(--muted-foreground));
+  cursor: pointer;
+}
+
+.seg {
+  display: flex;
+  gap: 4px;
+  overflow-x: auto;
+  margin-bottom: 22px;
+  padding: 4px;
+  border-radius: 14px;
+  background: hsl(var(--muted) / 0.35);
+  scrollbar-width: none;
+}
+
+.seg::-webkit-scrollbar {
+  display: none;
+}
+
+.seg-item {
+  position: relative;
+  flex-shrink: 0;
+  display: inline-flex;
+  align-items: center;
+  gap: 6px;
+  height: 34px;
+  padding: 0 14px;
+  border: none;
+  border-radius: 10px;
+  background: transparent;
+  color: hsl(var(--muted-foreground));
+  font-size: 13px;
+  cursor: pointer;
+  transition:
+    background 0.2s var(--ease),
+    color 0.2s var(--ease),
+    box-shadow 0.2s var(--ease);
+}
+
+.seg-item.active {
+  background: hsl(var(--card, var(--background)));
+  color: hsl(var(--foreground));
+  font-weight: 600;
+  box-shadow: 0 1px 2px hsl(var(--foreground) / 0.06);
+}
+
+.seg-badge {
+  min-width: 18px;
+  height: 18px;
+  padding: 0 5px;
+  border-radius: 9px;
+  background: hsl(var(--primary));
+  color: hsl(var(--primary-foreground));
+  font-size: 11px;
+  font-weight: 650;
+  line-height: 18px;
+  text-align: center;
+}
+
+.day-group + .day-group {
+  margin-top: 28px;
+}
+
+/* 日期分组标题：滚动时粘性吸顶，毛玻璃底保证盖在消息行上仍可读 */
+.day-label {
+  position: sticky;
+  top: 0;
+  z-index: 2;
+  margin: 0 0 10px;
+  padding: 6px 4px;
+  font-size: 12px;
+  font-weight: 650;
+  letter-spacing: 0.06em;
+  text-transform: uppercase;
+  color: hsl(var(--muted-foreground));
+  background: hsl(var(--background) / 0.82);
+  backdrop-filter: blur(8px);
+}
+
+.day-list {
+  list-style: none;
+  margin: 0;
+  padding: 0;
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+
+.msg {
+  --i: 0;
+  display: grid;
+  grid-template-columns: 48px minmax(0, 1fr) auto;
+  gap: 14px;
+  align-items: center;
+  padding: 14px 14px 14px 12px;
+  border: 1px solid transparent;
+  border-radius: 18px;
+  background: hsl(var(--card, var(--background)) / 0.55);
+  cursor: pointer;
+  outline: none;
+  animation: rise 0.45s var(--ease) both;
+  animation-delay: calc(var(--i) * 35ms);
+  transition:
+    background 0.2s var(--ease),
+    border-color 0.2s var(--ease),
+    transform 0.2s var(--ease);
+}
+
+.msg:hover,
+.msg:focus-visible {
+  background: hsl(var(--card, var(--background)));
+  border-color: hsl(var(--border) / 0.9);
+  transform: translateY(-1px);
+}
+
+.msg:active {
+  transform: translateY(0);
+}
+
+.msg.unread {
+  background: hsl(var(--primary) / 0.06);
+  border-color: hsl(var(--primary) / 0.12);
+}
+
+.msg.unread:hover,
+.msg.unread:focus-visible {
+  background: hsl(var(--primary) / 0.09);
+  border-color: hsl(var(--primary) / 0.22);
+}
+
+/* 重要且未读：按消息类型色发光；已读后取消 */
+.msg.priority.unread {
+  border-color: hsl(var(--notice-glow, 38 92% 50%) / 0.45);
+  box-shadow:
+    0 0 0 1px hsl(var(--notice-glow, 38 92% 50%) / 0.18),
+    0 0 18px hsl(var(--notice-glow, 38 92% 50%) / 0.22);
+}
+
+.msg.priority.unread:hover,
+.msg.priority.unread:focus-visible {
+  border-color: hsl(var(--notice-glow, 38 92% 50%) / 0.6);
+  box-shadow:
+    0 0 0 1px hsl(var(--notice-glow, 38 92% 50%) / 0.28),
+    0 0 22px hsl(var(--notice-glow, 38 92% 50%) / 0.3);
+}
+
+.avatar {
+  width: 48px;
+  height: 48px;
+  border-radius: 16px;
+  display: grid;
+  place-items: center;
+  overflow: hidden;
+  box-shadow: inset 0 0 0 1px hsl(var(--foreground) / 0.04);
+}
+
+.avatar-img {
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+}
+
+.content {
+  min-width: 0;
+}
+
+.row-top {
+  display: flex;
+  align-items: baseline;
+  justify-content: space-between;
+  gap: 12px;
+}
+
+.title {
+  margin: 0;
+  min-width: 0;
+  flex: 1;
+  font-size: 15px;
+  font-weight: 500;
+  letter-spacing: -0.015em;
+  line-height: 1.35;
+  color: hsl(var(--foreground));
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.msg.unread .title {
+  font-weight: 680;
+}
+
+.time {
+  flex-shrink: 0;
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+  font-variant-numeric: tabular-nums;
+}
+
+.preview {
+  margin: 5px 0 0;
+  font-size: 13px;
+  line-height: 1.45;
+  color: hsl(var(--muted-foreground));
   display: -webkit-box;
-  -webkit-line-clamp: 1;
+  -webkit-line-clamp: 2;
   -webkit-box-orient: vertical;
   overflow: hidden;
 }
 
-/* 平滑过渡效果 */
-.fade-enter-active,
-.fade-leave-active {
-  transition: opacity 0.3s ease;
+.meta {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 6px;
+  margin-top: 8px;
 }
 
-.fade-enter-from,
-.fade-leave-to {
+.type-tag,
+.prio-tag {
+  font-size: 11px;
+  font-weight: 600;
+  letter-spacing: 0.02em;
+  padding: 2px 8px;
+  border-radius: 999px;
+  background: hsl(var(--muted) / 0.55);
+}
+
+.prio-tag {
+  color: hsl(var(--warning, 38 92% 40%));
+  background: hsl(var(--warning, 38 92% 50%) / 0.12);
+}
+
+.aside {
+  display: flex;
+  flex-direction: column;
+  align-items: flex-end;
+  gap: 8px;
+  min-width: 72px;
+}
+
+.dot {
+  width: 9px;
+  height: 9px;
+  border-radius: 50%;
+  background: hsl(var(--primary));
+  box-shadow: 0 0 0 4px hsl(var(--primary) / 0.12);
+}
+
+.mark {
+  border: none;
+  background: transparent;
+  color: hsl(var(--muted-foreground));
+  font-size: 12px;
+  padding: 0;
+  cursor: pointer;
   opacity: 0;
+  transition: opacity 0.15s ease, color 0.15s ease;
 }
 
-/* 微妙的悬停动画 */
-@keyframes pulse {
+.msg:hover .mark,
+.msg:focus-within .mark {
+  opacity: 1;
+}
+
+.mark:hover {
+  color: hsl(var(--primary));
+}
+
+.go {
+  display: inline-flex;
+  align-items: center;
+  gap: 3px;
+  height: 28px;
+  padding: 0 10px;
+  border-radius: 999px;
+  background: hsl(var(--primary));
+  color: hsl(var(--primary-foreground));
+  font-size: 12px;
+  font-weight: 600;
+  letter-spacing: -0.01em;
+  transition: transform 0.2s var(--ease), opacity 0.2s var(--ease);
+}
+
+.msg:hover .go {
+  transform: translateX(2px);
+}
+
+.empty-state {
+  display: grid;
+  place-items: center;
+  gap: 8px;
+  padding: 72px 20px;
+  text-align: center;
+  color: hsl(var(--muted-foreground));
+}
+
+.empty-ico {
+  width: 64px;
+  height: 64px;
+  margin-bottom: 8px;
+  border-radius: 22px;
+  display: grid;
+  place-items: center;
+  background: hsl(var(--muted) / 0.45);
+  color: hsl(var(--foreground) / 0.55);
+}
+
+.empty-title {
+  margin: 0;
+  font-size: 16px;
+  font-weight: 650;
+  color: hsl(var(--foreground));
+}
+
+.empty-desc {
+  margin: 0;
+  font-size: 13px;
+  max-width: 260px;
+}
+
+/* ===== 骨架屏：与 .msg 同布局同圆角，闪烁动画走主题 muted 色 ===== */
+.skeleton-list {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+
+.skeleton-row {
+  --i: 0;
+  display: grid;
+  grid-template-columns: 48px minmax(0, 1fr);
+  gap: 14px;
+  align-items: center;
+  padding: 14px 14px 14px 12px;
+  border-radius: 18px;
+  background: hsl(var(--card, var(--background)) / 0.55);
+  animation: rise 0.45s var(--ease) both;
+  animation-delay: calc(var(--i) * 50ms);
+}
+
+.sk {
+  border-radius: 10px;
+  background: linear-gradient(
+    90deg,
+    hsl(var(--muted) / 0.5) 25%,
+    hsl(var(--muted) / 0.3) 50%,
+    hsl(var(--muted) / 0.5) 75%
+  );
+  background-size: 200% 100%;
+  animation: shimmer 1.4s ease-in-out infinite;
+}
+
+.sk-avatar {
+  width: 48px;
+  height: 48px;
+  border-radius: 16px;
+}
+
+.sk-lines {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+
+.sk-title {
+  width: 45%;
+  height: 14px;
+}
+
+.sk-text {
+  width: 80%;
+  height: 12px;
+}
+
+@keyframes shimmer {
   0% {
-    box-shadow: 0 0 0 0 rgba(var(--color-primary-rgb), 0.2);
-  }
-  70% {
-    box-shadow: 0 0 0 6px rgba(var(--color-primary-rgb), 0);
+    background-position: 200% 0;
   }
   100% {
-    box-shadow: 0 0 0 0 rgba(var(--color-primary-rgb), 0);
+    background-position: -200% 0;
   }
 }
 
-.group:hover .pulse-on-hover {
-  animation: pulse 1.5s infinite;
+.more-wrap {
+  display: flex;
+  justify-content: center;
+  margin-top: 24px;
 }
 
-/* 暗黑模式下的自定义灰色 */
-.dark .bg-gray-750 {
-  background-color: #1a202c; /* 介于gray-800和gray-900之间 */
+.more-btn {
+  border: none;
+  background: transparent;
+  color: hsl(var(--muted-foreground));
+  font-size: 13px;
+  padding: 10px 16px;
+  border-radius: 999px;
+  cursor: pointer;
 }
 
-.dark .bg-gray-650 {
-  background-color: #2d3748; /* 介于gray-600和gray-700之间 */
+.more-btn:hover {
+  color: hsl(var(--primary));
+  background: hsl(var(--primary) / 0.08);
+}
+
+@keyframes rise {
+  from {
+    opacity: 0;
+    transform: translateY(10px);
+  }
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .msg,
+  .search-bar,
+  .skeleton-row,
+  .sk {
+    animation: none;
+  }
+  .msg:hover,
+  .msg:hover .go {
+    transform: none;
+  }
+}
+
+@media (max-width: 720px) {
+  .inbox {
+    padding: 18px 12px 36px;
+  }
+
+  .inbox-hero {
+    flex-direction: column;
+    align-items: flex-start;
+  }
+
+  .msg {
+    grid-template-columns: 44px minmax(0, 1fr);
+    grid-template-areas:
+      'avatar content'
+      'avatar aside';
+  }
+
+  .avatar {
+    width: 44px;
+    height: 44px;
+    border-radius: 14px;
+    grid-area: avatar;
+  }
+
+  .content {
+    grid-area: content;
+  }
+
+  .aside {
+    grid-area: aside;
+    flex-direction: row;
+    align-items: center;
+    justify-content: flex-start;
+    min-width: 0;
+    margin-top: 4px;
+  }
+
+  .mark {
+    opacity: 1;
+  }
+
+  .ghost-btn span {
+    display: none;
+  }
 }
 </style>
diff --git a/apps/web-antd/src/views/notice/scenes/NoticeSceneHost.vue b/apps/web-antd/src/views/notice/scenes/NoticeSceneHost.vue
new file mode 100644
index 00000000..503a2a57
--- /dev/null
+++ b/apps/web-antd/src/views/notice/scenes/NoticeSceneHost.vue
@@ -0,0 +1,138 @@
+<script lang="ts" setup>
+/**
+ * 消息场景宿主：自定义弹层 + 按 type_code 挂载专属视图（彻底不走 VbenModal）
+ */
+import { computed, ref, watch } from 'vue';
+
+import { getNoticeDetailApi } from '#/views/notice/api';
+import { resolveNoticeView } from '#/views/notice/views/registry';
+
+import { resolveNoticeSceneMeta } from './meta';
+import NoticeSceneShell from './NoticeSceneShell.vue';
+
+const props = defineProps<{
+  notice: null | Record<string, any>;
+  onOpenBizAudit?: (payload: { bizId: number; typeCode: string; }) => void;
+  onWithdrawAudit?: (payload: { bizId: number; modalType: number }) => void;
+}>();
+
+const emit = defineEmits<{
+  close: [];
+}>();
+
+const open = defineModel<boolean>('open', { default: false });
+
+const loading = ref(false);
+const detail = ref<Record<string, any>>({});
+
+const merged = computed(() => ({
+  ...(props.notice || {}),
+  ...detail.value,
+}));
+
+/**
+ * 有效类型编码：决定用哪套场景 meta 与视图
+ * 特殊处理：人工群发的个人日报/周报是富文本，但旧 type=2 被后端映射成
+ * period_report；只有自动运营总结才带 action_payload.metrics，
+ * 没有 metrics 的一律降级按富文本（system）渲染，避免显示一堆 0 的「运营总结」
+ */
+const effectiveTypeCode = computed(() => {
+  const code = String(merged.value?.type_code || '');
+  if (code === 'period_report' && !merged.value?.action_payload?.metrics) {
+    return 'system';
+  }
+  return code;
+});
+
+const meta = computed(() => resolveNoticeSceneMeta(effectiveTypeCode.value));
+
+const sceneTitle = computed(() => {
+  const t = meta.value.title;
+  const noticeTitle = String(merged.value?.title || '');
+  // VIP / 富文本用消息标题更贴切
+  const code = effectiveTypeCode.value;
+  if (code === 'system' || code === 'broadcast' || code === 'vip') {
+    return noticeTitle || t;
+  }
+  return t;
+});
+
+const ViewComp = computed(() => resolveNoticeView(effectiveTypeCode.value));
+
+watch(
+  () => [open.value, props.notice?.id] as const,
+  async ([isOpen, id]) => {
+    if (!isOpen) {
+      detail.value = {};
+      loading.value = false;
+      return;
+    }
+    detail.value = {};
+    const nid = Number(id || 0);
+    if (nid <= 0) return;
+    loading.value = true;
+    try {
+      const res = await getNoticeDetailApi(nid);
+      detail.value = res || {};
+    } catch {
+      detail.value = {};
+    } finally {
+      loading.value = false;
+    }
+  },
+);
+
+function close() {
+  open.value = false;
+  emit('close');
+}
+
+function onViewAudit(modalType?: number) {
+  const typeCode = String(merged.value?.type_code || '');
+  const bizId = Number(merged.value?.action_payload?.biz_id || 0);
+  if (typeCode === 'withdraw_audit') {
+    props.onWithdrawAudit?.({
+      bizId,
+      modalType: typeof modalType === 'number' ? modalType : 0,
+    });
+    close();
+    return;
+  }
+  props.onOpenBizAudit?.({ typeCode, bizId });
+  close();
+}
+
+function onViewDone() {
+  close();
+}
+</script>
+
+<template>
+  <NoticeSceneShell
+    v-model:open="open"
+    :title="sceneTitle"
+    :kicker="meta.kicker"
+    :tone="meta.tone"
+    :size="meta.size"
+    :bare-header="!!meta.bareHeader"
+    @close="emit('close')"
+  >
+    <div v-if="loading" class="loading">加载消息内容…</div>
+    <component
+      :is="ViewComp"
+      v-else-if="merged.id || merged.title"
+      :notice="merged"
+      @audit="onViewAudit"
+      @done="onViewDone"
+    />
+  </NoticeSceneShell>
+</template>
+
+<style scoped>
+.loading {
+  padding: 48px 0;
+  text-align: center;
+  color: hsl(var(--muted-foreground));
+  font-size: 14px;
+}
+</style>
diff --git a/apps/web-antd/src/views/notice/scenes/NoticeSceneShell.vue b/apps/web-antd/src/views/notice/scenes/NoticeSceneShell.vue
new file mode 100644
index 00000000..b12bf84d
--- /dev/null
+++ b/apps/web-antd/src/views/notice/scenes/NoticeSceneShell.vue
@@ -0,0 +1,260 @@
+<script lang="ts" setup>
+/**
+ * 消息专用场景弹层外壳（非 VbenModal）
+ * 遮罩 + 类型色调面板 + 关闭；内容由各场景组件填充
+ */
+import { onMounted, onUnmounted, watch } from 'vue';
+
+import { X } from 'lucide-vue-next';
+
+import type { NoticeSceneSize, NoticeSceneTone } from './meta';
+
+const props = withDefaults(
+  defineProps<{
+    open: boolean;
+    title?: string;
+    kicker?: string;
+    tone?: NoticeSceneTone;
+    size?: NoticeSceneSize;
+    bareHeader?: boolean;
+  }>(),
+  {
+    title: '消息详情',
+    kicker: 'NOTICE',
+    tone: 'default',
+    size: 'md',
+    bareHeader: false,
+  },
+);
+
+const emit = defineEmits<{
+  'update:open': [boolean];
+  close: [];
+}>();
+
+function close() {
+  emit('update:open', false);
+  emit('close');
+}
+
+function onKeydown(e: KeyboardEvent) {
+  if (e.key === 'Escape' && props.open) {
+    close();
+  }
+}
+
+watch(
+  () => props.open,
+  (v) => {
+    document.body.style.overflow = v ? 'hidden' : '';
+  },
+);
+
+onMounted(() => window.addEventListener('keydown', onKeydown));
+onUnmounted(() => {
+  window.removeEventListener('keydown', onKeydown);
+  document.body.style.overflow = '';
+});
+</script>
+
+<template>
+  <Teleport to="body">
+    <Transition name="ns">
+      <div
+        v-if="open"
+        class="ns-root"
+        role="presentation"
+      >
+        <div class="ns-mask" @click="close" />
+        <div
+          class="ns-panel"
+          :class="[`tone-${tone}`, `size-${size}`, { bare: bareHeader }]"
+          role="dialog"
+          aria-modal="true"
+          :aria-label="title"
+          @click.stop
+        >
+          <button
+            type="button"
+            class="ns-close"
+            aria-label="关闭"
+            @click="close"
+          >
+            <X class="size-4" />
+          </button>
+          <header v-if="!bareHeader" class="ns-head">
+            <div class="ns-kicker">{{ kicker }}</div>
+            <h2 class="ns-title">{{ title }}</h2>
+          </header>
+          <div class="ns-body">
+            <slot />
+          </div>
+        </div>
+      </div>
+    </Transition>
+  </Teleport>
+</template>
+
+<style scoped>
+.ns-root {
+  position: fixed;
+  inset: 0;
+  z-index: 1200;
+  display: grid;
+  place-items: center;
+  padding: 24px 16px;
+}
+
+.ns-mask {
+  position: absolute;
+  inset: 0;
+  background: hsl(0 0% 0% / 0.48);
+  backdrop-filter: blur(6px);
+}
+
+.ns-panel {
+  position: relative;
+  z-index: 1;
+  width: min(720px, 96vw);
+  max-height: min(88vh, 920px);
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
+  border-radius: 20px;
+  border: 1px solid hsl(var(--border));
+  background: hsl(var(--card, var(--background)));
+  box-shadow:
+    0 24px 64px hsl(0 0% 0% / 0.28),
+    0 0 0 1px hsl(var(--foreground) / 0.03);
+}
+
+.ns-panel.size-lg {
+  width: min(860px, 96vw);
+}
+
+.ns-panel.size-xl {
+  width: min(960px, 96vw);
+}
+
+.ns-panel.tone-vip {
+  border-color: hsl(160 50% 40% / 0.35);
+  box-shadow:
+    0 24px 64px hsl(160 40% 12% / 0.45),
+    0 0 40px hsl(160 60% 40% / 0.12);
+}
+
+.ns-panel.tone-danger {
+  border-color: hsl(0 72% 50% / 0.35);
+  box-shadow:
+    0 24px 64px hsl(0 40% 10% / 0.4),
+    0 0 36px hsl(0 72% 50% / 0.12);
+}
+
+.ns-panel.tone-money {
+  border-color: hsl(var(--primary) / 0.35);
+}
+
+.ns-panel.tone-report {
+  border-color: hsl(160 60% 40% / 0.3);
+}
+
+.ns-panel.tone-invoice {
+  border-color: hsl(250 60% 55% / 0.3);
+}
+
+.ns-panel.tone-audit {
+  border-color: hsl(190 70% 42% / 0.28);
+}
+
+.ns-close {
+  position: absolute;
+  top: 14px;
+  right: 14px;
+  z-index: 3;
+  display: grid;
+  place-items: center;
+  width: 32px;
+  height: 32px;
+  border: 0;
+  border-radius: 999px;
+  cursor: pointer;
+  color: hsl(var(--muted-foreground));
+  background: hsl(var(--muted) / 0.55);
+  transition:
+    background 0.15s ease,
+    color 0.15s ease,
+    transform 0.15s ease;
+}
+
+.ns-close:hover {
+  color: hsl(var(--foreground));
+  background: hsl(var(--muted));
+  transform: scale(1.04);
+}
+
+.ns-head {
+  flex-shrink: 0;
+  padding: 20px 48px 0 22px;
+}
+
+.ns-kicker {
+  font-size: 11px;
+  font-weight: 750;
+  letter-spacing: 0.12em;
+  color: hsl(var(--primary));
+}
+
+.tone-danger .ns-kicker {
+  color: hsl(0 72% 52%);
+}
+
+.tone-vip .ns-kicker {
+  color: hsl(160 55% 42%);
+}
+
+.tone-invoice .ns-kicker {
+  color: hsl(250 60% 55%);
+}
+
+.ns-title {
+  margin: 6px 0 0;
+  font-size: 18px;
+  font-weight: 720;
+  letter-spacing: -0.02em;
+  color: hsl(var(--foreground));
+}
+
+.ns-body {
+  flex: 1;
+  overflow: auto;
+  padding: 16px 22px 22px;
+}
+
+.ns-panel.bare .ns-body {
+  padding-top: 18px;
+}
+
+/* enter / leave */
+.ns-enter-active,
+.ns-leave-active {
+  transition: opacity 0.2s ease;
+}
+
+.ns-enter-active .ns-panel,
+.ns-leave-active .ns-panel {
+  transition:
+    transform 0.22s cubic-bezier(0.22, 1, 0.36, 1),
+    opacity 0.22s ease;
+}
+
+.ns-enter-from,
+.ns-leave-to {
+  opacity: 0;
+}
+
+.ns-enter-from .ns-panel,
+.ns-leave-to .ns-panel {
+  opacity: 0;
+  transform: translateY(12px) scale(0.98);
+}
+</style>
diff --git a/apps/web-antd/src/views/notice/scenes/meta.ts b/apps/web-antd/src/views/notice/scenes/meta.ts
new file mode 100644
index 00000000..cf015169
--- /dev/null
+++ b/apps/web-antd/src/views/notice/scenes/meta.ts
@@ -0,0 +1,113 @@
+/**
+ * 消息场景弹层元信息：标题 / 色调 / 尺寸（非 Vben，消息专用）
+ */
+export type NoticeSceneTone =
+  | 'default'
+  | 'vip'
+  | 'danger'
+  | 'money'
+  | 'report'
+  | 'audit'
+  | 'invoice';
+
+export type NoticeSceneSize = 'md' | 'lg' | 'xl';
+
+export interface NoticeSceneMeta {
+  title: string;
+  kicker: string;
+  tone: NoticeSceneTone;
+  size: NoticeSceneSize;
+  /** true：内容自带头图，外壳只留关闭钮 */
+  bareHeader?: boolean;
+}
+
+const DEFAULT_META: NoticeSceneMeta = {
+  title: '消息详情',
+  kicker: 'NOTICE',
+  tone: 'default',
+  size: 'md',
+};
+
+export const NOTICE_SCENE_META: Record<string, NoticeSceneMeta> = {
+  vip: {
+    title: 'VIP 通知',
+    kicker: 'MEMBERSHIP',
+    tone: 'vip',
+    size: 'lg',
+    bareHeader: true,
+  },
+  period_report: {
+    title: '运营总结',
+    kicker: 'REPORT',
+    tone: 'report',
+    size: 'lg',
+  },
+  withdraw_audit: {
+    title: '提现待审',
+    kicker: 'FINANCE',
+    tone: 'money',
+    size: 'md',
+  },
+  invoice_todo: {
+    title: '开票待办',
+    kicker: 'INVOICE',
+    tone: 'invoice',
+    size: 'md',
+  },
+  queue_failure: {
+    title: '队列失败',
+    kicker: 'QUEUE',
+    tone: 'danger',
+    size: 'lg',
+  },
+  warehouse_product_audit: {
+    title: '仓品待审',
+    kicker: 'WAREHOUSE',
+    tone: 'audit',
+    size: 'lg',
+  },
+  store_input_audit: {
+    title: '门店录入待审',
+    kicker: 'STORE',
+    tone: 'audit',
+    size: 'xl',
+  },
+  doctor_input_audit: {
+    title: '医生预填待审',
+    kicker: 'DOCTOR',
+    tone: 'audit',
+    size: 'xl',
+  },
+  price_change: {
+    title: '药价变更',
+    kicker: 'PRICE',
+    tone: 'report',
+    size: 'md',
+  },
+  system: {
+    title: '系统通知',
+    kicker: 'SYSTEM',
+    tone: 'default',
+    size: 'md',
+  },
+  broadcast: {
+    title: '系统公告',
+    kicker: 'BROADCAST',
+    tone: 'default',
+    size: 'md',
+  },
+  prescription_audit: {
+    title: '处方审核',
+    kicker: 'RX',
+    tone: 'audit',
+    size: 'md',
+  },
+};
+
+export function resolveNoticeSceneMeta(typeCode?: string): NoticeSceneMeta {
+  const code = String(typeCode || '').trim();
+  return NOTICE_SCENE_META[code] || {
+    ...DEFAULT_META,
+    title: DEFAULT_META.title,
+  };
+}
diff --git a/apps/web-antd/src/views/notice/views/DoctorInputNoticeView.vue b/apps/web-antd/src/views/notice/views/DoctorInputNoticeView.vue
new file mode 100644
index 00000000..86c50675
--- /dev/null
+++ b/apps/web-antd/src/views/notice/views/DoctorInputNoticeView.vue
@@ -0,0 +1,434 @@
+<script lang="ts" setup>
+/**
+ * 消息中心 · 医生预填快捷审核
+ * 拉取预填详情展示后直接通过/拒绝，避免只弹出空审核表单
+ */
+import { computed, onMounted, ref, watch } from 'vue';
+
+import {
+  Avatar,
+  Descriptions,
+  DescriptionsItem,
+  Image,
+  Radio,
+  RadioGroup,
+  Spin,
+  Textarea,
+  Tag,
+  message,
+  Button,
+} from 'ant-design-vue';
+
+import SensitiveText from '#/components/sensitive-text/SensitiveText.vue';
+import { emitNoticeRefresh } from '#/views/notice/action/bus';
+import { auditDoctorInput, getDoctorInputDetail } from '#/views/system/doctor-input/api';
+import {
+  inputUserDisplayName,
+  normalizeInputUser,
+  resolveAvatarUrl,
+} from '#/views/system/store-input/utils/inputUser';
+
+const props = defineProps<{
+  notice: Record<string, any>;
+}>();
+
+const emit = defineEmits<{
+  /** 审核完成或无需再操作时关闭外层消息 Modal */
+  done: [];
+}>();
+
+const loading = ref(false);
+const submitting = ref(false);
+const detail = ref<Record<string, any> | null>(null);
+const auditStatus = ref(1);
+const auditRemark = ref('');
+
+const bizId = computed(() => Number(props.notice?.action_payload?.biz_id || 0));
+const canAudit = computed(() => Number(detail.value?.status) === 0);
+
+function typeText(type: number) {
+  if (type === 1) return '中医医生';
+  if (type === 2) return '西医医生';
+  return '-';
+}
+
+function signTypeText(signType: number) {
+  if (signType === 1) return '电子签名';
+  if (signType === 2) return '手写签名';
+  return '-';
+}
+
+function statusMeta(status: number) {
+  if (status === 0) return { color: 'orange', text: '待审核' };
+  if (status === 1) return { color: 'success', text: '审核通过' };
+  if (status === 2) return { color: 'error', text: '审核拒绝' };
+  return { color: 'default', text: '-' };
+}
+
+/** 兼容后端已格式化字符串或时间戳 */
+function formatAuditTime(val: unknown) {
+  if (val == null || val === '' || val === 0) return '-';
+  if (typeof val === 'string' && Number.isNaN(Number(val))) return val;
+  const n = Number(val);
+  if (!n) return '-';
+  if (n < 1e12) {
+    const d = new Date(n * 1000);
+    return Number.isNaN(d.getTime()) ? String(val) : d.toLocaleString();
+  }
+  return new Date(n).toLocaleString();
+}
+
+function imgSrc(url?: string | null) {
+  return resolveAvatarUrl(url) || String(url || '');
+}
+
+/**
+ * 按消息 payload 中的预填 ID 拉详情
+ */
+async function loadDetail() {
+  const id = bizId.value;
+  if (id <= 0) {
+    detail.value = null;
+    return;
+  }
+  loading.value = true;
+  detail.value = null;
+  try {
+    const res = await getDoctorInputDetail(id);
+    detail.value = res || null;
+    normalizeInputUser(detail.value);
+  } catch {
+    message.error('加载医生预填详情失败');
+    detail.value = null;
+  } finally {
+    loading.value = false;
+  }
+}
+
+/**
+ * 提交快捷审核：通过=1 / 拒绝=2
+ */
+async function submitAudit() {
+  const id = Number(detail.value?.id || bizId.value || 0);
+  if (id <= 0) {
+    message.error('缺少预填 ID');
+    return;
+  }
+  if (!canAudit.value) {
+    message.warning('该预填已审核，无需重复操作');
+    return;
+  }
+  submitting.value = true;
+  try {
+    await auditDoctorInput({
+      id,
+      status: auditStatus.value,
+      audit_remark: auditRemark.value,
+    });
+    message.success(auditStatus.value === 1 ? '已通过审核' : '已拒绝');
+    emitNoticeRefresh();
+    emit('done');
+  } catch {
+    message.error('审核失败，请稍后重试');
+  } finally {
+    submitting.value = false;
+  }
+}
+
+watch(
+  () => bizId.value,
+  () => {
+    auditStatus.value = 1;
+    auditRemark.value = '';
+    loadDetail();
+  },
+);
+
+onMounted(loadDetail);
+</script>
+
+<template>
+  <div class="doctor-quick">
+    <div class="head">
+      <div>
+        <div class="kicker">医生预填待审</div>
+        <div class="title">{{ notice.title || '医生预填审核' }}</div>
+        <p class="desc">{{ notice.detail || '请核对证件与资料后完成审核' }}</p>
+      </div>
+      <Tag v-if="detail" :color="statusMeta(Number(detail.status)).color">
+        {{ statusMeta(Number(detail.status)).text }}
+      </Tag>
+    </div>
+
+    <Spin :spinning="loading">
+      <div v-if="!bizId" class="empty">消息未携带预填 ID，无法加载详情</div>
+      <div v-else-if="!loading && !detail" class="empty">未找到预填记录</div>
+      <template v-else-if="detail">
+        <Descriptions
+          class="detail-grid"
+          :column="{ xxl: 2, xl: 2, lg: 2, md: 1, sm: 1, xs: 1 }"
+          bordered
+          size="small"
+        >
+          <DescriptionsItem label="预填 ID">#{{ detail.id }}</DescriptionsItem>
+          <DescriptionsItem label="医生姓名">{{ detail.name || '-' }}</DescriptionsItem>
+          <DescriptionsItem label="手机号">
+            <SensitiveText :record="detail" field="mobile" />
+          </DescriptionsItem>
+          <DescriptionsItem label="身份证">
+            <SensitiveText :record="detail" field="idcard" />
+          </DescriptionsItem>
+          <DescriptionsItem label="身份">{{ typeText(Number(detail.type)) }}</DescriptionsItem>
+          <DescriptionsItem label="签名类型">
+            {{ signTypeText(Number(detail.sign_type)) }}
+          </DescriptionsItem>
+          <DescriptionsItem label="科室">{{ detail.depart?.name || '-' }}</DescriptionsItem>
+          <DescriptionsItem label="职称">{{ detail.titleInfo?.name || '-' }}</DescriptionsItem>
+          <DescriptionsItem label="挂号费">
+            {{ detail.register_price != null ? detail.register_price : '-' }}
+          </DescriptionsItem>
+          <DescriptionsItem label="录入人">
+            <div class="input-user">
+              <Avatar
+                v-if="resolveAvatarUrl(detail.inputUser?.avatar)"
+                :src="resolveAvatarUrl(detail.inputUser?.avatar)"
+                :size="28"
+              />
+              <Avatar v-else :size="28">
+                {{ inputUserDisplayName(detail.inputUser).charAt(0) }}
+              </Avatar>
+              <span>{{ inputUserDisplayName(detail.inputUser) }}</span>
+            </div>
+          </DescriptionsItem>
+          <DescriptionsItem label="擅长" :span="2">
+            {{ detail.good_at || '-' }}
+          </DescriptionsItem>
+          <DescriptionsItem label="简介" :span="2">
+            {{ detail.intro || '-' }}
+          </DescriptionsItem>
+          <DescriptionsItem v-if="detail.audit_remark" label="历史备注" :span="2">
+            {{ detail.audit_remark }}
+          </DescriptionsItem>
+          <DescriptionsItem v-if="detail.audit_time" label="审核时间">
+            {{ formatAuditTime(detail.audit_time) }}
+          </DescriptionsItem>
+          <DescriptionsItem v-if="detail.auditAdmin" label="审核人">
+            {{ detail.auditAdmin.nick_name || '-' }}
+          </DescriptionsItem>
+        </Descriptions>
+
+        <div class="certs">
+          <div v-if="detail.avatar" class="cert">
+            <div class="cert-label">头像</div>
+            <Image :src="imgSrc(detail.avatar)" :width="88" :height="88" :preview="true" />
+          </div>
+          <div v-if="detail.qualification" class="cert">
+            <div class="cert-label">资格证书</div>
+            <Image
+              :src="imgSrc(detail.qualification)"
+              :width="88"
+              :height="88"
+              :preview="true"
+            />
+          </div>
+          <div v-if="detail.practicing" class="cert">
+            <div class="cert-label">执业证书</div>
+            <Image
+              :src="imgSrc(detail.practicing)"
+              :width="88"
+              :height="88"
+              :preview="true"
+            />
+          </div>
+          <div v-if="detail.title" class="cert">
+            <div class="cert-label">职称证书</div>
+            <Image :src="imgSrc(detail.title)" :width="88" :height="88" :preview="true" />
+          </div>
+          <div v-if="detail.card_up" class="cert">
+            <div class="cert-label">身份证正面</div>
+            <Image :src="imgSrc(detail.card_up)" :width="88" :height="88" :preview="true" />
+          </div>
+          <div v-if="detail.card_down" class="cert">
+            <div class="cert-label">身份证反面</div>
+            <Image :src="imgSrc(detail.card_down)" :width="88" :height="88" :preview="true" />
+          </div>
+          <div v-if="detail.sign_image" class="cert">
+            <div class="cert-label">签名</div>
+            <Image
+              :src="imgSrc(detail.sign_image)"
+              :width="88"
+              :height="88"
+              :preview="true"
+            />
+          </div>
+        </div>
+
+        <div v-if="canAudit" class="audit-box">
+          <div class="audit-title">快捷审核</div>
+          <RadioGroup v-model:value="auditStatus" class="audit-radio">
+            <Radio :value="1">审核通过</Radio>
+            <Radio :value="2">审核拒绝</Radio>
+          </RadioGroup>
+          <Textarea
+            v-model:value="auditRemark"
+            class="audit-remark"
+            :rows="3"
+            placeholder="审核备注（可选）"
+          />
+          <div class="actions">
+            <Button
+              danger
+              size="large"
+              :loading="submitting && auditStatus === 2"
+              :disabled="submitting"
+              @click="
+                () => {
+                  auditStatus = 2;
+                  submitAudit();
+                }
+              "
+            >
+              拒绝
+            </Button>
+            <Button
+              type="primary"
+              size="large"
+              :loading="submitting && auditStatus === 1"
+              :disabled="submitting"
+              @click="
+                () => {
+                  auditStatus = 1;
+                  submitAudit();
+                }
+              "
+            >
+              通过审核
+            </Button>
+          </div>
+        </div>
+        <div v-else class="done-tip">该预填已处理，可关闭本窗口</div>
+      </template>
+    </Spin>
+  </div>
+</template>
+
+<style scoped>
+.doctor-quick {
+  padding: 2px 0 4px;
+}
+
+.head {
+  display: flex;
+  align-items: flex-start;
+  justify-content: space-between;
+  gap: 12px;
+  margin-bottom: 14px;
+  padding: 14px 16px;
+  border-radius: 14px;
+  background:
+    radial-gradient(
+      70% 120% at 0% 0%,
+      hsl(var(--primary) / 0.14),
+      transparent 55%
+    ),
+    hsl(var(--muted) / 0.35);
+}
+
+.kicker {
+  font-size: 12px;
+  font-weight: 650;
+  color: hsl(var(--primary));
+}
+
+.title {
+  margin-top: 4px;
+  font-size: 16px;
+  font-weight: 700;
+  color: hsl(var(--foreground));
+}
+
+.desc {
+  margin: 6px 0 0;
+  font-size: 13px;
+  color: hsl(var(--muted-foreground));
+}
+
+.empty {
+  padding: 36px 0;
+  text-align: center;
+  color: hsl(var(--muted-foreground));
+  font-size: 14px;
+}
+
+.detail-grid {
+  margin-top: 2px;
+}
+
+.input-user {
+  display: inline-flex;
+  align-items: center;
+  gap: 8px;
+}
+
+.certs {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 12px;
+  margin-top: 14px;
+}
+
+.cert {
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+  padding: 8px;
+  border-radius: 10px;
+  border: 1px solid hsl(var(--border));
+  background: hsl(var(--card, var(--background)));
+}
+
+.cert-label {
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+}
+
+.audit-box {
+  margin-top: 16px;
+  padding: 14px;
+  border-radius: 12px;
+  border: 1px solid hsl(var(--border));
+  background: hsl(var(--muted) / 0.28);
+}
+
+.audit-title {
+  margin-bottom: 10px;
+  font-size: 14px;
+  font-weight: 650;
+  color: hsl(var(--foreground));
+}
+
+.audit-radio {
+  display: block;
+  margin-bottom: 10px;
+}
+
+.audit-remark {
+  margin-bottom: 12px;
+}
+
+.actions {
+  display: flex;
+  justify-content: flex-end;
+  gap: 10px;
+}
+
+.done-tip {
+  margin-top: 14px;
+  padding: 12px;
+  border-radius: 10px;
+  text-align: center;
+  font-size: 13px;
+  color: hsl(var(--muted-foreground));
+  background: hsl(var(--muted) / 0.3);
+}
+</style>
diff --git a/apps/web-antd/src/views/notice/views/InvoiceNoticeView.vue b/apps/web-antd/src/views/notice/views/InvoiceNoticeView.vue
new file mode 100644
index 00000000..2360aa61
--- /dev/null
+++ b/apps/web-antd/src/views/notice/views/InvoiceNoticeView.vue
@@ -0,0 +1,135 @@
+<script lang="ts" setup>
+/**
+ * 开票待办定制视图：摘要 + 跳转开票中心
+ */
+import { computed } from 'vue';
+import { useRouter } from 'vue-router';
+
+import { Button } from 'ant-design-vue';
+import { FileText } from 'lucide-vue-next';
+
+const props = defineProps<{
+  notice: Record<string, any>;
+}>();
+
+const router = useRouter();
+const payload = computed(() => props.notice?.action_payload || {});
+
+function goInvoice() {
+  const route = String(payload.value.route || '/finance/invoice-center');
+  router.push(route);
+}
+</script>
+
+<template>
+  <div class="invoice-view">
+    <div class="hero">
+      <div class="ico">
+        <FileText class="size-7" />
+      </div>
+      <div>
+        <div class="kicker">开票待办</div>
+        <h3 class="title">{{ notice.title || '开票申请待处理' }}</h3>
+        <p class="desc">{{ notice.detail || '有新的开票申请需要处理' }}</p>
+      </div>
+    </div>
+    <dl class="facts">
+      <div class="fact">
+        <dt>开票单 ID</dt>
+        <dd>#{{ payload.biz_id || '—' }}</dd>
+      </div>
+      <div class="fact">
+        <dt>时间</dt>
+        <dd>{{ notice.created_at || '—' }}</dd>
+      </div>
+    </dl>
+    <div class="actions">
+      <Button type="primary" size="large" @click="goInvoice">
+        打开开票中心
+      </Button>
+    </div>
+  </div>
+</template>
+
+<style scoped>
+.invoice-view {
+  padding: 2px 0;
+}
+
+.hero {
+  display: flex;
+  gap: 14px;
+  align-items: flex-start;
+  padding: 16px;
+  border-radius: 14px;
+  background:
+    radial-gradient(
+      70% 120% at 0% 0%,
+      hsl(250 70% 55% / 0.16),
+      transparent 55%
+    ),
+    hsl(var(--muted) / 0.35);
+}
+
+.ico {
+  display: grid;
+  place-items: center;
+  width: 52px;
+  height: 52px;
+  border-radius: 14px;
+  color: hsl(250 60% 48%);
+  background: hsl(250 70% 55% / 0.12);
+}
+
+.kicker {
+  font-size: 12px;
+  font-weight: 650;
+  color: hsl(250 60% 48%);
+}
+
+.title {
+  margin: 6px 0 0;
+  font-size: 18px;
+  font-weight: 720;
+  color: hsl(var(--foreground));
+}
+
+.desc {
+  margin: 6px 0 0;
+  font-size: 13px;
+  color: hsl(var(--muted-foreground));
+}
+
+.facts {
+  margin: 14px 0 0;
+  display: grid;
+  gap: 8px;
+}
+
+.fact {
+  display: flex;
+  justify-content: space-between;
+  padding: 10px 12px;
+  border-radius: 10px;
+  border: 1px solid hsl(var(--border));
+  background: hsl(var(--card, var(--background)));
+}
+
+.fact dt {
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+}
+
+.fact dd {
+  margin: 0;
+  font-size: 13px;
+  font-weight: 600;
+  color: hsl(var(--foreground));
+}
+
+.actions {
+  display: flex;
+  justify-content: flex-end;
+  margin-top: 18px;
+}
+</style>
diff --git a/apps/web-antd/src/views/notice/views/PeriodReportView.vue b/apps/web-antd/src/views/notice/views/PeriodReportView.vue
new file mode 100644
index 00000000..7aec906f
--- /dev/null
+++ b/apps/web-antd/src/views/notice/views/PeriodReportView.vue
@@ -0,0 +1,513 @@
+<script lang="ts" setup>
+/**
+ * 周期总结定制视图（分受众版本 + 毛玻璃视觉）
+ * 后端 action_payload.audience 区分 平台/诊所/药店/供应商/配送仓库 五个版本，
+ * 各受众一套指标卡配置驱动渲染（不复制五份模板）；
+ * 旧数据无 audience 字段时按平台版兼容展示
+ */
+import { computed, ref } from 'vue';
+
+import { IconifyIcon as VbenIcon } from '@vben/icons';
+
+const props = defineProps<{
+  notice: Record<string, any>;
+}>();
+
+/** 单个指标瓷砖配置：取值 key + 展示样式 */
+type MetricTile = {
+  /** money 时值加 ¥ 前缀 */
+  format?: 'money';
+  icon: string;
+  /** metrics 里的字段名 */
+  key: string;
+  label: string;
+  /** normal 常规 / ok 正向 / warn 需关注 */
+  tone: 'normal' | 'ok' | 'warn';
+};
+
+/** 受众元信息：徽标文案/图标 + 指标瓷砖布局 */
+type AudienceMeta = {
+  icon: string;
+  kicker: string;
+  label: string;
+  tiles: MetricTile[];
+};
+
+/**
+ * 五套受众配置：每个受众关心的指标不同
+ * 平台看全局运营，诊所看挂号/处方，药店看订单/发货，供应商看结算，仓库看包裹
+ */
+const AUDIENCE_META: Record<string, AudienceMeta> = {
+  platform: {
+    label: '平台',
+    icon: 'lucide:globe',
+    kicker: '平台运营总结',
+    tiles: [
+      { key: 'active_store_count', label: '活跃门店', icon: 'lucide:store', tone: 'normal' },
+      { key: 'register_total', label: '挂号总数', icon: 'lucide:stethoscope', tone: 'normal' },
+      { key: 'rx_total', label: '处方总数', icon: 'lucide:file-text', tone: 'normal' },
+      { key: '_rx_split', label: '线上 / 线下', icon: 'lucide:split', tone: 'normal' },
+      { key: 'rx_pending', label: '待审处方', icon: 'lucide:hourglass', tone: 'warn' },
+      { key: 'rx_passed', label: '已通过', icon: 'lucide:check-circle', tone: 'ok' },
+      { key: 'rx_rejected', label: '已驳回', icon: 'lucide:x-circle', tone: 'warn' },
+      { key: 'expire_soon', label: '临期待审', icon: 'lucide:alarm-clock', tone: 'warn' },
+    ],
+  },
+  clinic: {
+    label: '诊所',
+    icon: 'lucide:stethoscope',
+    kicker: '诊所运营总结',
+    tiles: [
+      { key: 'register_total', label: '挂号总数', icon: 'lucide:clipboard-list', tone: 'normal' },
+      { key: 'register_completed', label: '已完成挂号', icon: 'lucide:check-circle', tone: 'ok' },
+      { key: 'rx_total', label: '处方总数', icon: 'lucide:file-text', tone: 'normal' },
+      { key: 'rx_pending', label: '当前待审', icon: 'lucide:hourglass', tone: 'warn' },
+      { key: 'settled_amount', label: '已结算金额', icon: 'lucide:banknote', tone: 'ok', format: 'money' },
+      { key: 'pending_amount', label: '待结算金额', icon: 'lucide:wallet', tone: 'warn', format: 'money' },
+    ],
+  },
+  pharmacy: {
+    label: '药店',
+    icon: 'lucide:pill',
+    kicker: '药店运营总结',
+    tiles: [
+      { key: 'order_total', label: '有效订单', icon: 'lucide:shopping-cart', tone: 'normal' },
+      { key: 'order_amount', label: '营业额', icon: 'lucide:banknote', tone: 'ok', format: 'money' },
+      { key: 'wait_delivery', label: '当前待发货', icon: 'lucide:package', tone: 'warn' },
+      { key: 'refunding', label: '退款处理中', icon: 'lucide:rotate-ccw', tone: 'warn' },
+      { key: 'settled_amount', label: '已结算金额', icon: 'lucide:circle-check-big', tone: 'ok', format: 'money' },
+      { key: 'pending_amount', label: '待结算金额', icon: 'lucide:wallet', tone: 'warn', format: 'money' },
+    ],
+  },
+  supplier: {
+    label: '供应商',
+    icon: 'lucide:factory',
+    kicker: '供应商结算总结',
+    tiles: [
+      { key: 'ledger_count', label: '分账笔数', icon: 'lucide:receipt', tone: 'normal' },
+      { key: 'settled_amount', label: '已结算金额', icon: 'lucide:banknote', tone: 'ok', format: 'money' },
+      { key: 'pending_amount', label: '待结算金额', icon: 'lucide:wallet', tone: 'warn', format: 'money' },
+    ],
+  },
+  warehouse: {
+    label: '配送仓库',
+    icon: 'lucide:warehouse',
+    kicker: '配送仓运营总结',
+    tiles: [
+      { key: 'shipment_new', label: '新增包裹', icon: 'lucide:package-plus', tone: 'normal' },
+      { key: 'shipment_sent', label: '已发货', icon: 'lucide:truck', tone: 'ok' },
+      { key: 'shipment_wait', label: '当前待发货', icon: 'lucide:package', tone: 'warn' },
+      { key: 'settled_amount', label: '已结算金额', icon: 'lucide:banknote', tone: 'ok', format: 'money' },
+      { key: 'pending_amount', label: '待结算金额', icon: 'lucide:wallet', tone: 'warn', format: 'money' },
+    ],
+  },
+};
+
+const payload = computed(() => props.notice?.action_payload || {});
+const metrics = computed(() => payload.value?.metrics || {});
+const period = computed(() => payload.value?.period || {});
+/** 旧数据无 audience 时兜底平台版，保证历史消息可读 */
+const meta = computed(
+  () => AUDIENCE_META[String(payload.value?.audience || 'platform')] || AUDIENCE_META.platform!,
+);
+/** 报告主体名称（诊所/药店/供应商/仓库名，平台为空不展示） */
+const subjectName = computed(() => {
+  const name = String(payload.value?.subject?.name || '');
+  return name === '平台' ? '' : name;
+});
+
+/** 周期粒度徽标：日报/周报/月报/年报 */
+const grainLabel = computed(() => {
+  const grain = String(period.value?.grain || '');
+  const map: Record<string, string> = {
+    day: '日报',
+    week: '周报',
+    month: '月报',
+    year: '年报',
+  };
+  return map[grain] || '总结';
+});
+
+/**
+ * 指标瓷砖取值：money 格式加 ¥；平台版「线上/线下」是拼接虚拟字段特殊处理
+ */
+function tileValue(tile: MetricTile): string {
+  const m = metrics.value;
+  if (tile.key === '_rx_split') {
+    return `${m.rx_online || 0} / ${m.rx_offline || 0}`;
+  }
+  const raw = m[tile.key];
+  const val = raw === undefined || raw === null ? 0 : raw;
+  return tile.format === 'money' ? `¥${val}` : String(val);
+}
+
+/** Markdown 摘要折叠状态：默认收起，指标卡已表达核心信息 */
+const summaryOpen = ref(false);
+</script>
+
+<template>
+  <div class="report-view">
+    <!-- Hero：受众徽标 + 周期 + 主体名称，毛玻璃底 + 主色光斑 -->
+    <div class="hero">
+      <div class="hero__orb hero__orb--a"></div>
+      <div class="hero__orb hero__orb--b"></div>
+      <div class="hero__inner">
+        <div class="hero__icon">
+          <VbenIcon :icon="meta.icon" />
+        </div>
+        <div class="hero__meta">
+          <div class="hero__badges">
+            <span class="badge badge--audience">{{ meta.label }}</span>
+            <span class="badge badge--grain">{{ grainLabel }}</span>
+          </div>
+          <div class="hero__label">{{ period.label || notice.detail || '-' }}</div>
+          <div v-if="subjectName" class="hero__subject">{{ subjectName }}</div>
+        </div>
+        <div class="hero__kicker">{{ meta.kicker }}</div>
+      </div>
+    </div>
+
+    <!-- 指标瓷砖：毛玻璃质感，按受众配置驱动 -->
+    <div class="grid">
+      <div
+        v-for="tile in meta.tiles"
+        :key="tile.key"
+        class="metric"
+        :class="[`metric--${tile.tone}`]"
+      >
+        <div class="metric-head">
+          <span class="metric-icon">
+            <VbenIcon :icon="tile.icon" />
+          </span>
+          <span class="metric-label">{{ tile.label }}</span>
+        </div>
+        <div class="metric-value">{{ tileValue(tile) }}</div>
+      </div>
+    </div>
+
+    <!-- Markdown 摘要：折叠玻璃面板，默认收起（指标卡已表达核心信息） -->
+    <div v-if="notice.content" class="summary">
+      <button type="button" class="summary__toggle" @click="summaryOpen = !summaryOpen">
+        <VbenIcon
+          icon="lucide:chevron-right"
+          class="summary__chevron"
+          :class="{ 'is-open': summaryOpen }"
+        />
+        <span>文字摘要</span>
+      </button>
+      <div v-if="summaryOpen" class="summary__body whitespace-pre-wrap">
+        {{ notice.content }}
+      </div>
+    </div>
+  </div>
+</template>
+
+<style scoped>
+.report-view {
+  padding: 2px 0 8px;
+}
+
+/* ===== Hero：毛玻璃 + 双光斑 ===== */
+.hero {
+  position: relative;
+  margin-bottom: 16px;
+  overflow: hidden;
+  border: 1px solid hsl(var(--border) / 0.8);
+  border-radius: 18px;
+  background: linear-gradient(
+    165deg,
+    hsl(var(--muted) / 0.45),
+    hsl(var(--card, var(--background)))
+  );
+}
+
+/* 柔和光斑：主色低透明度大半径模糊，撑起高级氛围 */
+.hero__orb {
+  position: absolute;
+  border-radius: 50%;
+  filter: blur(38px);
+  pointer-events: none;
+}
+
+.hero__orb--a {
+  top: -70px;
+  left: -40px;
+  width: 220px;
+  height: 220px;
+  background: hsl(var(--primary) / 0.22);
+}
+
+.hero__orb--b {
+  right: -60px;
+  bottom: -90px;
+  width: 240px;
+  height: 240px;
+  background: hsl(var(--primary) / 0.1);
+}
+
+/* 毛玻璃层：内容压在光斑上再 blur，形成磨砂质感 */
+.hero__inner {
+  position: relative;
+  display: flex;
+  gap: 14px;
+  align-items: flex-start;
+  padding: 18px 20px;
+  backdrop-filter: blur(18px);
+  -webkit-backdrop-filter: blur(18px);
+}
+
+.hero__icon {
+  display: grid;
+  flex-shrink: 0;
+  place-items: center;
+  width: 46px;
+  height: 46px;
+  border: 1px solid hsl(var(--primary) / 0.25);
+  border-radius: 14px;
+  background: hsl(var(--primary) / 0.12);
+  color: hsl(var(--primary));
+  box-shadow: inset 0 1px 0 hsl(var(--background) / 0.5);
+}
+
+.hero__icon :deep(svg) {
+  width: 22px;
+  height: 22px;
+}
+
+.hero__meta {
+  flex: 1;
+  min-width: 0;
+}
+
+.hero__badges {
+  display: flex;
+  gap: 6px;
+  align-items: center;
+}
+
+.badge {
+  padding: 2px 9px;
+  border-radius: 999px;
+  font-size: 11px;
+  font-weight: 650;
+  line-height: 17px;
+  letter-spacing: 0.02em;
+}
+
+.badge--audience {
+  border: 1px solid hsl(var(--primary) / 0.3);
+  background: hsl(var(--primary) / 0.1);
+  color: hsl(var(--primary));
+}
+
+.badge--grain {
+  border: 1px solid hsl(var(--border));
+  background: hsl(var(--muted) / 0.5);
+  color: hsl(var(--muted-foreground));
+}
+
+.hero__label {
+  margin-top: 8px;
+  font-size: 18px;
+  font-weight: 720;
+  letter-spacing: -0.02em;
+  color: hsl(var(--foreground));
+}
+
+.hero__subject {
+  margin-top: 3px;
+  overflow: hidden;
+  font-size: 13px;
+  color: hsl(var(--muted-foreground));
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.hero__kicker {
+  flex-shrink: 0;
+  font-size: 11px;
+  font-weight: 700;
+  letter-spacing: 0.08em;
+  color: hsl(var(--primary) / 0.75);
+  text-transform: uppercase;
+  writing-mode: horizontal-tb;
+}
+
+/* ===== 指标瓷砖网格 ===== */
+.grid {
+  display: grid;
+  grid-template-columns: repeat(2, minmax(0, 1fr));
+  gap: 10px;
+}
+
+@media (min-width: 640px) {
+  .grid {
+    grid-template-columns: repeat(3, minmax(0, 1fr));
+  }
+}
+
+/* 玻璃瓷砖：半透明底 + blur + 顶部内侧高光细线 */
+.metric {
+  position: relative;
+  padding: 13px 14px;
+  border: 1px solid hsl(var(--border) / 0.55);
+  border-radius: 14px;
+  background: hsl(var(--card, var(--background)) / 0.55);
+  backdrop-filter: blur(12px);
+  -webkit-backdrop-filter: blur(12px);
+  box-shadow:
+    inset 0 1px 0 hsl(var(--background) / 0.6),
+    0 1px 2px hsl(var(--foreground) / 0.03);
+  transition:
+    border-color 0.2s ease,
+    transform 0.2s ease,
+    box-shadow 0.2s ease;
+}
+
+.metric:hover {
+  transform: translateY(-1px);
+  border-color: hsl(var(--primary) / 0.3);
+  box-shadow:
+    inset 0 1px 0 hsl(var(--background) / 0.6),
+    0 8px 24px hsl(var(--primary) / 0.08);
+}
+
+.metric--warn {
+  border-color: hsl(var(--warning, 38 92% 50%) / 0.35);
+  background:
+    linear-gradient(
+      150deg,
+      hsl(var(--warning, 38 92% 50%) / 0.09),
+      transparent 55%
+    ),
+    hsl(var(--card, var(--background)) / 0.55);
+}
+
+.metric--ok {
+  border-color: hsl(var(--success) / 0.35);
+  background:
+    linear-gradient(
+      150deg,
+      hsl(var(--success) / 0.1),
+      transparent 55%
+    ),
+    hsl(var(--card, var(--background)) / 0.55);
+}
+
+.metric-head {
+  display: flex;
+  gap: 7px;
+  align-items: center;
+}
+
+.metric-icon {
+  display: grid;
+  place-items: center;
+  width: 22px;
+  height: 22px;
+  border-radius: 7px;
+  background: hsl(var(--primary) / 0.1);
+  color: hsl(var(--primary));
+}
+
+.metric--warn .metric-icon {
+  background: hsl(var(--warning, 38 92% 50%) / 0.14);
+  color: hsl(var(--warning, 38 92% 40%));
+}
+
+.metric--ok .metric-icon {
+  background: hsl(var(--success) / 0.14);
+  color: hsl(var(--success));
+}
+
+.metric-icon :deep(svg) {
+  width: 13px;
+  height: 13px;
+}
+
+.metric-label {
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+}
+
+.metric-value {
+  margin-top: 8px;
+  overflow: hidden;
+  font-size: 22px;
+  font-weight: 700;
+  letter-spacing: -0.03em;
+  color: hsl(var(--foreground));
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  font-variant-numeric: tabular-nums;
+}
+
+.metric--warn .metric-value {
+  color: hsl(var(--warning, 38 92% 40%));
+}
+
+/* 正向色走主题 --success 变量：亮/暗自适应，禁止 :global 泄漏全局 */
+.metric--ok .metric-value {
+  color: hsl(var(--success));
+}
+
+/* ===== Markdown 摘要折叠面板 ===== */
+.summary {
+  margin-top: 14px;
+  overflow: hidden;
+  border: 1px solid hsl(var(--border) / 0.55);
+  border-radius: 14px;
+  background: hsl(var(--card, var(--background)) / 0.55);
+  backdrop-filter: blur(12px);
+  -webkit-backdrop-filter: blur(12px);
+}
+
+.summary__toggle {
+  display: flex;
+  gap: 6px;
+  align-items: center;
+  width: 100%;
+  padding: 11px 14px;
+  border: none;
+  background: transparent;
+  font-size: 13px;
+  font-weight: 600;
+  color: hsl(var(--foreground));
+  cursor: pointer;
+  transition: background 0.15s ease;
+}
+
+.summary__toggle:hover {
+  background: hsl(var(--muted) / 0.35);
+}
+
+.summary__chevron {
+  width: 14px;
+  height: 14px;
+  color: hsl(var(--muted-foreground));
+  transition: transform 0.2s ease;
+}
+
+.summary__chevron.is-open {
+  transform: rotate(90deg);
+}
+
+.summary__body {
+  padding: 12px 14px 14px;
+  font-size: 13px;
+  line-height: 1.8;
+  color: hsl(var(--muted-foreground));
+  border-top: 1px solid hsl(var(--border) / 0.4);
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .metric,
+  .summary__chevron {
+    transition: none;
+  }
+
+  .metric:hover {
+    transform: none;
+  }
+}
+</style>
diff --git a/apps/web-antd/src/views/notice/views/PriceChangeNoticeView.vue b/apps/web-antd/src/views/notice/views/PriceChangeNoticeView.vue
new file mode 100644
index 00000000..774d02b1
--- /dev/null
+++ b/apps/web-antd/src/views/notice/views/PriceChangeNoticeView.vue
@@ -0,0 +1,89 @@
+<script lang="ts" setup>
+/**
+ * 药价变更定制视图
+ */
+import { computed } from 'vue';
+
+import { usePreferences } from '@vben/preferences';
+import { MdPreview } from 'md-editor-v3';
+
+import 'md-editor-v3/lib/style.css';
+
+const props = defineProps<{
+  notice: Record<string, any>;
+}>();
+
+const { isDark } = usePreferences();
+const isMarkdown = computed(() => Number(props.notice?.edit_type) === 1);
+const mdTheme = computed(() => (isDark.value ? 'dark' : 'light'));
+const contentHtml = computed(() =>
+  String(props.notice?.content || '').replaceAll('\n', '<br>'),
+);
+</script>
+
+<template>
+  <div class="price-view">
+    <div class="hero">
+      <div class="kicker">药价变更</div>
+      <h3 class="title">{{ notice.title || '药价变更通知' }}</h3>
+      <p class="desc">{{ notice.detail || '配送仓药品价格已调整' }}</p>
+    </div>
+    <div class="body">
+      <MdPreview
+        v-if="isMarkdown"
+        :model-value="String(notice.content || '')"
+        :theme="mdTheme"
+      />
+      <div
+        v-else
+        class="prose prose-sm dark:prose-invert max-w-none"
+        v-html="contentHtml"
+      ></div>
+    </div>
+  </div>
+</template>
+
+<style scoped>
+.price-view {
+  padding: 2px 0;
+}
+
+.hero {
+  margin-bottom: 14px;
+  padding: 16px;
+  border-radius: 14px;
+  background:
+    radial-gradient(
+      70% 120% at 100% 0%,
+      hsl(84 70% 40% / 0.18),
+      transparent 55%
+    ),
+    hsl(var(--muted) / 0.35);
+}
+
+.kicker {
+  font-size: 12px;
+  font-weight: 650;
+  color: hsl(84 55% 38%);
+}
+
+.title {
+  margin: 8px 0 0;
+  font-size: 18px;
+  font-weight: 720;
+  color: hsl(var(--foreground));
+}
+
+.desc {
+  margin: 8px 0 0;
+  font-size: 13px;
+  color: hsl(var(--muted-foreground));
+}
+
+.body {
+  padding: 14px;
+  border-radius: 14px;
+  border: 1px solid hsl(var(--border));
+  background: hsl(var(--card, var(--background)));
+}
+</style>
diff --git a/apps/web-antd/src/views/notice/views/QueueFailureView.vue b/apps/web-antd/src/views/notice/views/QueueFailureView.vue
new file mode 100644
index 00000000..a95755ed
--- /dev/null
+++ b/apps/web-antd/src/views/notice/views/QueueFailureView.vue
@@ -0,0 +1,234 @@
+<script lang="ts" setup>
+/**
+ * 消息场景 · 队列失败
+ * 在自定义弹层内展示任务详情 / 错误 / 重跑（不套 VbenModal）
+ */
+import { computed, onMounted, ref, watch } from 'vue';
+import { useRouter } from 'vue-router';
+
+import {
+  Button,
+  Descriptions,
+  Modal,
+  Spin,
+  Tag,
+  message,
+} from 'ant-design-vue';
+import { TriangleAlert } from 'lucide-vue-next';
+
+import {
+  getQueueJobDetail,
+  retryQueueJob,
+} from '#/views/log/queue-job/api';
+import { statusTagColor } from '#/views/log/queue-job/config/constants';
+import { emitNoticeRefresh } from '#/views/notice/action/bus';
+
+const props = defineProps<{
+  notice: Record<string, any>;
+}>();
+
+const router = useRouter();
+const loading = ref(false);
+const retrying = ref(false);
+const job = ref<Record<string, any> | null>(null);
+
+const payload = computed(() => props.notice?.action_payload || {});
+const bizId = computed(() => Number(payload.value.biz_id || 0));
+const canRetry = computed(() => {
+  const status = Number(job.value?.status);
+  return status === 3 || status === 4;
+});
+
+function formatJson(val: unknown): string {
+  if (val == null || val === '') return '（无）';
+  try {
+    return JSON.stringify(val, null, 2);
+  } catch {
+    return String(val);
+  }
+}
+
+async function loadJob() {
+  const id = bizId.value;
+  if (id <= 0) {
+    job.value = null;
+    return;
+  }
+  loading.value = true;
+  try {
+    const res = await getQueueJobDetail(id);
+    job.value = res?.data || res || null;
+  } catch {
+    message.error('加载队列详情失败');
+    job.value = null;
+  } finally {
+    loading.value = false;
+  }
+}
+
+function onRetry() {
+  const id = Number(job.value?.id || bizId.value || 0);
+  if (id <= 0) return;
+  Modal.confirm({
+    title: '确认重新执行？',
+    content:
+      `将基于 #${id} 新建一条任务并重新投递。` +
+      '订单/退款等业务重跑可能产生副作用，请确认业务幂等后再操作。',
+    okType: 'danger',
+    onOk: async () => {
+      retrying.value = true;
+      try {
+        const res = await retryQueueJob(id);
+        const newId = res?.id ?? res?.data?.id;
+        message.success(newId ? `已重新投递，新任务 #${newId}` : '已重新投递');
+        emitNoticeRefresh();
+        await loadJob();
+      } finally {
+        retrying.value = false;
+      }
+    },
+  });
+}
+
+function goMonitor() {
+  router.push(String(payload.value.route || '/log/queue-job/monitor'));
+}
+
+watch(() => bizId.value, loadJob);
+onMounted(loadJob);
+</script>
+
+<template>
+  <div class="queue-scene">
+    <div class="alert">
+      <TriangleAlert class="size-6 shrink-0" />
+      <div>
+        <div class="alert-title">{{ notice.title || '队列任务失败' }}</div>
+        <p class="alert-desc">
+          {{ notice.detail || '请查看错误信息并视情况重跑' }}
+        </p>
+      </div>
+    </div>
+
+    <Spin :spinning="loading">
+      <div v-if="!bizId" class="empty">
+        <p>历史消息缺少任务 ID</p>
+        <Button type="primary" danger @click="goMonitor">打开队列监控</Button>
+      </div>
+      <template v-else-if="job">
+        <Descriptions
+          :column="{ xxl: 2, xl: 2, lg: 2, md: 1, sm: 1, xs: 1 }"
+          bordered
+          size="small"
+        >
+          <Descriptions.Item label="ID">{{ job.id }}</Descriptions.Item>
+          <Descriptions.Item label="状态">
+            <Tag :color="statusTagColor(Number(job.status))">
+              {{ job.status_txt || job.status }}
+            </Tag>
+          </Descriptions.Item>
+          <Descriptions.Item label="标题" :span="2">
+            {{ job.title || '-' }}
+          </Descriptions.Item>
+          <Descriptions.Item label="任务类型">
+            {{ job.job_name_txt || '-' }}
+          </Descriptions.Item>
+          <Descriptions.Item label="分类">
+            {{ job.category_txt || job.category }}
+          </Descriptions.Item>
+          <Descriptions.Item label="耗时">
+            {{ job.time_difference || '-' }}
+          </Descriptions.Item>
+          <Descriptions.Item label="创建时间">
+            {{ job.created_at || '-' }}
+          </Descriptions.Item>
+          <Descriptions.Item label="任务类名" :span="2">
+            <code class="break-all text-xs">{{ job.job_name || '-' }}</code>
+          </Descriptions.Item>
+          <Descriptions.Item label="错误信息" :span="2">
+            <pre class="snap-pre error-pre">{{
+              job.error_message || '（无）'
+            }}</pre>
+          </Descriptions.Item>
+          <Descriptions.Item label="payload" :span="2">
+            <pre class="snap-pre">{{ formatJson(job.payload) }}</pre>
+          </Descriptions.Item>
+        </Descriptions>
+        <div class="actions">
+          <Button @click="goMonitor">队列监控</Button>
+          <Button
+            v-if="canRetry"
+            type="primary"
+            danger
+            :loading="retrying"
+            @click="onRetry"
+          >
+            重新执行
+          </Button>
+        </div>
+      </template>
+      <div v-else-if="!loading" class="empty">未找到队列任务</div>
+    </Spin>
+  </div>
+</template>
+
+<style scoped>
+.queue-scene {
+  padding: 2px 0 4px;
+}
+
+.alert {
+  display: flex;
+  gap: 12px;
+  align-items: flex-start;
+  margin-bottom: 14px;
+  padding: 14px;
+  border-radius: 14px;
+  border: 1px solid hsl(0 72% 50% / 0.28);
+  background: hsl(0 72% 50% / 0.08);
+  color: hsl(0 72% 42%);
+}
+
+.alert-title {
+  font-size: 15px;
+  font-weight: 700;
+  color: hsl(var(--foreground));
+}
+
+.alert-desc {
+  margin: 4px 0 0;
+  font-size: 13px;
+  color: hsl(var(--muted-foreground));
+}
+
+.empty {
+  padding: 28px 0;
+  text-align: center;
+  color: hsl(var(--muted-foreground));
+}
+
+.snap-pre {
+  margin: 0;
+  max-height: 220px;
+  overflow: auto;
+  white-space: pre-wrap;
+  word-break: break-all;
+  font-size: 12px;
+  line-height: 1.5;
+  color: hsl(var(--foreground));
+}
+
+.error-pre {
+  padding: 8px 10px;
+  border-radius: 8px;
+  background: hsl(0 72% 50% / 0.08);
+  color: hsl(0 72% 40%);
+}
+
+.actions {
+  display: flex;
+  justify-content: flex-end;
+  gap: 10px;
+  margin-top: 16px;
+}
+</style>
diff --git a/apps/web-antd/src/views/notice/views/RichTextNoticeView.vue b/apps/web-antd/src/views/notice/views/RichTextNoticeView.vue
new file mode 100644
index 00000000..24b66d8e
--- /dev/null
+++ b/apps/web-antd/src/views/notice/views/RichTextNoticeView.vue
@@ -0,0 +1,103 @@
+<script lang="ts" setup>
+/**
+ * 通用富文本/Markdown 消息视图（系统通知 / 公告 / 处方等）
+ */
+import { computed } from 'vue';
+
+import { usePreferences } from '@vben/preferences';
+import { MdPreview } from 'md-editor-v3';
+
+import 'md-editor-v3/lib/style.css';
+
+const props = defineProps<{
+  notice: Record<string, any>;
+}>();
+
+const { isDark } = usePreferences();
+const isMarkdown = computed(() => Number(props.notice?.edit_type) === 1);
+const mdTheme = computed(() => (isDark.value ? 'dark' : 'light'));
+const contentHtml = computed(() =>
+  String(props.notice?.content || '').replaceAll('\n', '<br>'),
+);
+const typeLabel = computed(
+  () => props.notice?.type_name || props.notice?.title || '通知',
+);
+</script>
+
+<template>
+  <div class="rich-view">
+    <div class="hero">
+      <div class="kicker">{{ typeLabel }}</div>
+      <h3 class="title">{{ notice.title || '消息详情' }}</h3>
+      <p v-if="notice.detail" class="desc">{{ notice.detail }}</p>
+      <time v-if="notice.created_at" class="time">{{ notice.created_at }}</time>
+    </div>
+    <div class="body">
+      <MdPreview
+        v-if="isMarkdown"
+        :model-value="String(notice.content || '')"
+        :theme="mdTheme"
+      />
+      <div
+        v-else
+        class="prose prose-sm dark:prose-invert max-w-none"
+        v-html="contentHtml"
+      ></div>
+    </div>
+  </div>
+</template>
+
+<style scoped>
+.rich-view {
+  padding: 2px 0;
+}
+
+.hero {
+  margin-bottom: 14px;
+  padding: 16px;
+  border-radius: 14px;
+  background:
+    radial-gradient(
+      80% 120% at 0% 0%,
+      hsl(var(--primary) / 0.12),
+      transparent 60%
+    ),
+    hsl(var(--muted) / 0.35);
+}
+
+.kicker {
+  font-size: 12px;
+  font-weight: 650;
+  color: hsl(var(--primary));
+}
+
+.title {
+  margin: 8px 0 0;
+  font-size: 18px;
+  font-weight: 720;
+  letter-spacing: -0.02em;
+  color: hsl(var(--foreground));
+}
+
+.desc {
+  margin: 8px 0 0;
+  font-size: 13px;
+  line-height: 1.5;
+  color: hsl(var(--muted-foreground));
+}
+
+.time {
+  display: inline-block;
+  margin-top: 10px;
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+}
+
+.body {
+  padding: 14px;
+  border-radius: 14px;
+  border: 1px solid hsl(var(--border));
+  background: hsl(var(--card, var(--background)));
+  min-height: 88px;
+}
+</style>
diff --git a/apps/web-antd/src/views/notice/views/ScheduleChangeNoticeView.vue b/apps/web-antd/src/views/notice/views/ScheduleChangeNoticeView.vue
new file mode 100644
index 00000000..72404d3f
--- /dev/null
+++ b/apps/web-antd/src/views/notice/views/ScheduleChangeNoticeView.vue
@@ -0,0 +1,295 @@
+<script lang="ts" setup>
+/**
+ * 消息中心 · 排班变更专属视图（type_code=schedule_change）
+ * 渲染 action_payload：动作场景卡 + 涉及日期 chips + 新时段表 + 操作人/批次溯源
+ * 医生收到后一眼看清「哪家诊所把我哪些天改成了什么班」
+ */
+import { computed, ref } from 'vue';
+
+const props = defineProps<{
+  notice: Record<string, any>;
+}>();
+
+/** 日期默认收起阈值：月排可能 30+ 天，全量平铺会把弹窗撑爆 */
+const DATE_COLLAPSE_LIMIT = 12;
+const datesExpanded = ref(false);
+
+/** action_payload 可能是对象（接口已解析）或 JSON 字符串（兜底解析） */
+const payload = computed<Record<string, any>>(() => {
+  const p = props.notice?.action_payload;
+  if (p && typeof p === 'object') return p;
+  try {
+    return JSON.parse(String(p || '{}')) || {};
+  } catch {
+    return {};
+  }
+});
+
+/** 动作场景：文案 + 色调（休诊红 / 恢复默认灰 / 排班青） */
+const scene = computed(() => {
+  const action = Number(payload.value?.action || 0);
+  if (action === 3) return { label: '设为休诊', tone: 'danger' };
+  if (action === 4) return { label: '恢复默认规则', tone: 'normal' };
+  if (action === 1) {
+    const name = String(payload.value?.template_name || '');
+    return { label: name ? `套用模板「${name}」` : '套用班次模板', tone: 'work' };
+  }
+  return { label: payload.value?.action_txt || '排班调整', tone: 'work' };
+});
+
+const dates = computed<string[]>(() =>
+  Array.isArray(payload.value?.dates) ? payload.value.dates : [],
+);
+
+/** 收起态只显示前 N 个日期 */
+const visibleDates = computed(() =>
+  datesExpanded.value ? dates.value : dates.value.slice(0, DATE_COLLAPSE_LIMIT),
+);
+
+const slots = computed<Array<Record<string, any>>>(() =>
+  Array.isArray(payload.value?.slots) ? payload.value.slots : [],
+);
+
+/** 日期显示成「8/19 周三」这种紧凑格式 */
+function formatDate(date: string): string {
+  const d = new Date(`${date}T00:00:00`);
+  if (Number.isNaN(d.getTime())) return date;
+  const weeks = ['日', '一', '二', '三', '四', '五', '六'];
+  return `${d.getMonth() + 1}/${d.getDate()} 周${weeks[d.getDay()]}`;
+}
+</script>
+
+<template>
+  <div class="sched-notice">
+    <!-- 场景卡：动作 + 医生 + 门店 -->
+    <div class="hero" :class="`tone-${scene.tone}`">
+      <div class="hero__glow" aria-hidden="true"></div>
+      <div class="hero__top">
+        <span class="scene-pill">{{ scene.label }}</span>
+        <span class="count-pill">{{ dates.length }} 天</span>
+      </div>
+      <h3 class="hero__title">
+        {{ payload.doctor_name || '您' }} 的出诊排班有调整
+      </h3>
+      <p class="hero__store">{{ payload.store_name || notice.title || '' }}</p>
+    </div>
+
+    <!-- 涉及日期 -->
+    <div v-if="dates.length > 0" class="section">
+      <div class="section__label">涉及日期</div>
+      <div class="date-chips">
+        <span v-for="d in visibleDates" :key="d" class="date-chip">
+          {{ formatDate(d) }}
+        </span>
+        <button
+          v-if="dates.length > DATE_COLLAPSE_LIMIT"
+          class="date-chip date-chip--more"
+          type="button"
+          @click="datesExpanded = !datesExpanded"
+        >
+          {{ datesExpanded ? '收起' : `+${dates.length - DATE_COLLAPSE_LIMIT}` }}
+        </button>
+      </div>
+    </div>
+
+    <!-- 新排班时段（休诊/恢复默认无时段） -->
+    <div v-if="slots.length > 0" class="section">
+      <div class="section__label">调整后的出诊时段</div>
+      <div class="slot-list">
+        <div v-for="(slot, i) in slots" :key="i" class="slot-row">
+          <span class="slot-row__name">{{ slot.slot_name || `时段${i + 1}` }}</span>
+          <span class="slot-row__time">{{ slot.start_time }} - {{ slot.end_time }}</span>
+          <span class="slot-row__cap">号源 {{ slot.capacity }}</span>
+        </div>
+      </div>
+    </div>
+    <div v-else-if="Number(payload.action) === 3" class="section rest-hint">
+      以上日期已停诊，患者端不再放号；已有预约不受本次操作影响
+    </div>
+    <div v-else-if="Number(payload.action) === 4" class="section rest-hint">
+      以上日期回到您的默认排班规则（按医生管理里配置的每天/按星期规则放号）
+    </div>
+
+    <p v-if="notice.detail" class="detail">{{ notice.detail }}</p>
+    <div class="meta-line">
+      <span v-if="payload.operator_name">操作人：{{ payload.operator_name }}</span>
+      <span v-if="payload.batch_no">批次号：{{ payload.batch_no }}</span>
+    </div>
+  </div>
+</template>
+
+<style scoped>
+.sched-notice {
+  padding: 2px 0 6px;
+}
+
+/* 场景 hero 卡：青色系（对应 schedule_change 类型色），休诊红、恢复灰 */
+.hero {
+  position: relative;
+  padding: 18px 20px;
+  overflow: hidden;
+  color: #fff;
+  background: linear-gradient(135deg, #16323a 0%, #1f5560 48%, #2a97a8 100%);
+  border-radius: 16px;
+  box-shadow:
+    0 10px 28px hsl(190 45% 22% / 0.28),
+    inset 0 1px 0 hsl(0 0% 100% / 0.12);
+}
+
+.hero.tone-danger {
+  background: linear-gradient(135deg, #2a181c 0%, #5a2430 52%, #a33b4a 100%);
+  box-shadow:
+    0 10px 28px hsl(350 45% 22% / 0.28),
+    inset 0 1px 0 hsl(0 0% 100% / 0.12);
+}
+
+.hero.tone-normal {
+  background: linear-gradient(135deg, #23272e 0%, #3a4149 52%, #5d6b77 100%);
+  box-shadow:
+    0 10px 28px hsl(215 15% 22% / 0.28),
+    inset 0 1px 0 hsl(0 0% 100% / 0.12);
+}
+
+.hero__glow {
+  position: absolute;
+  inset: -40% auto auto -20%;
+  width: 70%;
+  height: 90%;
+  pointer-events: none;
+  background: radial-gradient(circle, hsl(0 0% 100% / 0.16), transparent 68%);
+}
+
+.hero__top {
+  position: relative;
+  z-index: 1;
+  display: flex;
+  gap: 8px;
+  align-items: center;
+  margin-bottom: 12px;
+}
+
+.scene-pill,
+.count-pill {
+  display: inline-flex;
+  padding: 3px 10px;
+  font-size: 11px;
+  font-weight: 700;
+  letter-spacing: 0.04em;
+  background: hsl(0 0% 100% / 0.16);
+  backdrop-filter: blur(6px);
+  border-radius: 999px;
+}
+
+.hero__title {
+  position: relative;
+  z-index: 1;
+  margin: 0;
+  font-size: 18px;
+  font-weight: 720;
+  letter-spacing: -0.02em;
+}
+
+.hero__store {
+  position: relative;
+  z-index: 1;
+  margin: 6px 0 0;
+  font-size: 13px;
+  opacity: 0.85;
+}
+
+.section {
+  margin-top: 14px;
+}
+
+.section__label {
+  margin-bottom: 8px;
+  font-size: 12px;
+  font-weight: 600;
+  color: hsl(var(--muted-foreground));
+}
+
+.date-chips {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 6px;
+}
+
+.date-chip {
+  padding: 3px 10px;
+  font-size: 12px;
+  color: hsl(var(--foreground));
+  background: hsl(var(--muted) / 0.35);
+  border: 1px solid hsl(var(--border));
+  border-radius: 8px;
+}
+
+.date-chip--more {
+  color: hsl(var(--primary));
+  cursor: pointer;
+  background: hsl(var(--primary) / 0.08);
+  border-color: hsl(var(--primary) / 0.35);
+}
+
+.slot-list {
+  overflow: hidden;
+  border: 1px solid hsl(var(--border));
+  border-radius: 12px;
+}
+
+.slot-row {
+  display: flex;
+  gap: 12px;
+  align-items: center;
+  padding: 10px 14px;
+  background: hsl(var(--card, var(--background)));
+}
+
+.slot-row + .slot-row {
+  border-top: 1px solid hsl(var(--border) / 0.6);
+}
+
+.slot-row__name {
+  min-width: 64px;
+  font-size: 13px;
+  font-weight: 600;
+  color: hsl(var(--foreground));
+}
+
+.slot-row__time {
+  flex: 1;
+  font-size: 13px;
+  color: hsl(var(--muted-foreground));
+  font-variant-numeric: tabular-nums;
+}
+
+.slot-row__cap {
+  font-size: 12px;
+  font-weight: 600;
+  color: hsl(var(--primary));
+}
+
+.rest-hint {
+  padding: 10px 14px;
+  font-size: 13px;
+  color: hsl(var(--muted-foreground));
+  background: hsl(var(--muted) / 0.25);
+  border: 1px solid hsl(var(--border));
+  border-radius: 12px;
+}
+
+.detail {
+  margin: 14px 0 0;
+  font-size: 13px;
+  line-height: 1.55;
+  color: hsl(var(--muted-foreground));
+}
+
+.meta-line {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 12px;
+  margin-top: 10px;
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+}
+</style>
diff --git a/apps/web-antd/src/views/notice/views/StoreInputNoticeView.vue b/apps/web-antd/src/views/notice/views/StoreInputNoticeView.vue
new file mode 100644
index 00000000..fa19b911
--- /dev/null
+++ b/apps/web-antd/src/views/notice/views/StoreInputNoticeView.vue
@@ -0,0 +1,422 @@
+<script lang="ts" setup>
+/**
+ * 消息中心 · 门店录入快捷审核
+ * 拉详情展示门店资料/合同/关联医生，支持 ERP/MES + 一并审医生
+ */
+import { computed, onMounted, ref, watch } from 'vue';
+
+import {
+  Avatar,
+  Button,
+  Descriptions,
+  DescriptionsItem,
+  Image,
+  Input,
+  Radio,
+  RadioGroup,
+  Spin,
+  Textarea,
+  Tag,
+  message,
+} from 'ant-design-vue';
+
+import SensitiveText from '#/components/sensitive-text/SensitiveText.vue';
+import { emitNoticeRefresh } from '#/views/notice/action/bus';
+import {
+  auditStoreInput,
+  getStoreInputDetail,
+} from '#/views/system/store-input/api';
+import DoctorInputCardGrid from '#/views/system/store-input/components/DoctorInputCardGrid.vue';
+import {
+  getLinkedDoctors,
+  isDoctorPending,
+} from '#/views/system/store-input/utils/doctorInputDisplay';
+import {
+  inputUserDisplayName,
+  normalizeInputUser,
+  resolveAvatarUrl,
+} from '#/views/system/store-input/utils/inputUser';
+
+const props = defineProps<{
+  notice: Record<string, any>;
+}>();
+
+const emit = defineEmits<{
+  done: [];
+}>();
+
+const loading = ref(false);
+const submitting = ref(false);
+const detail = ref<Record<string, any> | null>(null);
+const auditStatus = ref(1);
+const auditRemark = ref('');
+const erpId = ref('');
+const mesId = ref('');
+const selectedDoctorIds = ref<number[]>([]);
+
+const bizId = computed(() => Number(props.notice?.action_payload?.biz_id || 0));
+const canAudit = computed(() => Number(detail.value?.status) === 0);
+const doctors = computed(() =>
+  detail.value ? getLinkedDoctors(detail.value) : [],
+);
+const pendingDoctorIds = computed(() =>
+  doctors.value
+    .filter((d) => isDoctorPending(d))
+    .map((d) => Number(d.id))
+    .filter((id) => id > 0),
+);
+const carousel = computed(() => {
+  const url = detail.value?.url;
+  return Array.isArray(url) ? url.filter(Boolean) : [];
+});
+const contracts = computed(() => {
+  const files = detail.value?.contract_files;
+  return Array.isArray(files) ? files : [];
+});
+
+function statusMeta(status: number) {
+  if (status === 0) return { color: 'orange', text: '待审核' };
+  if (status === 1) return { color: 'success', text: '审核通过' };
+  if (status === 2) return { color: 'error', text: '审核拒绝' };
+  return { color: 'default', text: '-' };
+}
+
+async function loadDetail() {
+  const id = bizId.value;
+  if (id <= 0) {
+    detail.value = null;
+    return;
+  }
+  loading.value = true;
+  detail.value = null;
+  try {
+    const res = await getStoreInputDetail(id);
+    detail.value = res || null;
+    normalizeInputUser(detail.value);
+    erpId.value =
+      res?.erp_id != null && String(res.erp_id) !== ''
+        ? String(res.erp_id)
+        : '';
+    mesId.value =
+      res?.mes_id != null && String(res.mes_id) !== ''
+        ? String(res.mes_id)
+        : '';
+    selectedDoctorIds.value = getLinkedDoctors(detail.value)
+      .filter((d) => isDoctorPending(d))
+      .map((d) => Number(d.id))
+      .filter((id) => id > 0);
+  } catch {
+    message.error('加载门店录入详情失败');
+    detail.value = null;
+  } finally {
+    loading.value = false;
+  }
+}
+
+watch(auditStatus, (v) => {
+  if (v !== 1) {
+    selectedDoctorIds.value = [];
+  } else {
+    selectedDoctorIds.value = [...pendingDoctorIds.value];
+  }
+});
+
+async function submitAudit(forceStatus?: number) {
+  const id = Number(detail.value?.id || bizId.value || 0);
+  if (id <= 0) {
+    message.error('缺少录入 ID');
+    return;
+  }
+  if (!canAudit.value) {
+    message.warning('该录入已审核');
+    return;
+  }
+  if (typeof forceStatus === 'number') {
+    auditStatus.value = forceStatus;
+  }
+  if (auditStatus.value === 1 && !erpId.value.trim()) {
+    message.error('审核通过时请填写 ERP ID');
+    return;
+  }
+  submitting.value = true;
+  try {
+    const payload: Parameters<typeof auditStoreInput>[0] = {
+      id,
+      status: auditStatus.value,
+      audit_remark: auditRemark.value,
+      erp_id: auditStatus.value === 1 ? erpId.value.trim() : undefined,
+      mes_id:
+        auditStatus.value === 1 && mesId.value.trim()
+          ? mesId.value.trim()
+          : undefined,
+    };
+    if (auditStatus.value === 1 && selectedDoctorIds.value.length > 0) {
+      payload.doctor_input_ids = [...selectedDoctorIds.value];
+    }
+    await auditStoreInput(payload);
+    const n = auditStatus.value === 1 ? selectedDoctorIds.value.length : 0;
+    message.success(
+      n > 0 ? `审核成功，已一并通过 ${n} 位医生预填` : '审核成功',
+    );
+    emitNoticeRefresh();
+    emit('done');
+  } catch {
+    message.error('审核失败，请稍后重试');
+  } finally {
+    submitting.value = false;
+  }
+}
+
+watch(() => bizId.value, loadDetail);
+onMounted(loadDetail);
+</script>
+
+<template>
+  <div class="store-quick">
+    <div class="head">
+      <div>
+        <div class="kicker">门店录入待审</div>
+        <div class="title">{{ detail?.name || notice.title || '门店录入' }}</div>
+        <p class="desc">{{ notice.detail || '请核对门店资料后完成审核' }}</p>
+      </div>
+      <Tag v-if="detail" :color="statusMeta(Number(detail.status)).color">
+        {{ statusMeta(Number(detail.status)).text }}
+      </Tag>
+    </div>
+
+    <Spin :spinning="loading">
+      <div v-if="!bizId" class="empty">消息未携带录入 ID</div>
+      <div v-else-if="!loading && !detail" class="empty">未找到录入记录</div>
+      <template v-else-if="detail">
+        <Descriptions
+          :column="{ xxl: 2, xl: 2, lg: 2, md: 1, sm: 1, xs: 1 }"
+          bordered
+          size="small"
+        >
+          <DescriptionsItem label="录入 ID">#{{ detail.id }}</DescriptionsItem>
+          <DescriptionsItem label="类型">
+            {{ Number(detail.type) === 1 ? '药店' : '诊所' }}
+          </DescriptionsItem>
+          <DescriptionsItem label="诊所类型">
+            {{
+              Number(detail.clinic_type) === 1
+                ? '西医诊所'
+                : Number(detail.clinic_type) === 2
+                  ? '中医诊所'
+                  : '未设置'
+            }}
+          </DescriptionsItem>
+          <DescriptionsItem label="联系人">{{ detail.contact || '-' }}</DescriptionsItem>
+          <DescriptionsItem label="联系电话">
+            <SensitiveText :record="detail" field="mobile" />
+          </DescriptionsItem>
+          <DescriptionsItem label="省市区">
+            {{ detail.province?.name || '' }} {{ detail.city?.name || '' }}
+          </DescriptionsItem>
+          <DescriptionsItem label="地址" :span="2">
+            {{ detail.position || '-' }}
+          </DescriptionsItem>
+          <DescriptionsItem label="录入人">
+            <div class="input-user">
+              <Avatar
+                v-if="resolveAvatarUrl(detail.inputUser?.avatar)"
+                :src="resolveAvatarUrl(detail.inputUser?.avatar)"
+                :size="28"
+              />
+              <span>{{ inputUserDisplayName(detail.inputUser) }}</span>
+            </div>
+          </DescriptionsItem>
+        </Descriptions>
+
+        <div v-if="carousel.length || detail.see_rate || contracts.length" class="media">
+          <div v-if="detail.see_rate" class="media-item">
+            <div class="media-label">公章</div>
+            <Image
+              :src="resolveAvatarUrl(detail.see_rate) || detail.see_rate"
+              :width="88"
+              :height="88"
+              :preview="true"
+            />
+          </div>
+          <div v-for="(img, idx) in carousel" :key="idx" class="media-item">
+            <div class="media-label">轮播 {{ idx + 1 }}</div>
+            <Image
+              :src="resolveAvatarUrl(img) || img"
+              :width="88"
+              :height="88"
+              :preview="true"
+            />
+          </div>
+          <div v-for="(f, idx) in contracts" :key="`c-${idx}`" class="media-item file">
+            <div class="media-label">合同</div>
+            <a :href="f.file_url" target="_blank" rel="noreferrer">{{
+              f.file_name || '查看文件'
+            }}</a>
+          </div>
+        </div>
+
+        <div v-if="doctors.length" class="doctors">
+          <div class="section-title">关联医生预填</div>
+          <DoctorInputCardGrid
+            v-model:selected-ids="selectedDoctorIds"
+            :doctors="doctors"
+            :selectable="canAudit && auditStatus === 1"
+            only-pending-selectable
+          />
+        </div>
+
+        <div v-if="canAudit" class="audit-box">
+          <div class="section-title">快捷审核</div>
+          <RadioGroup v-model:value="auditStatus" class="mb-3">
+            <Radio :value="1">审核通过</Radio>
+            <Radio :value="2">审核拒绝</Radio>
+          </RadioGroup>
+          <div v-if="auditStatus === 1" class="field">
+            <div class="field-label">ERP ID（必填）</div>
+            <Input v-model:value="erpId" placeholder="审核通过必填" />
+          </div>
+          <div v-if="auditStatus === 1" class="field">
+            <div class="field-label">MES ID（可选）</div>
+            <Input v-model:value="mesId" placeholder="煎药中心编码" />
+          </div>
+          <div class="field">
+            <div class="field-label">审核备注</div>
+            <Textarea v-model:value="auditRemark" :rows="3" placeholder="可选" />
+          </div>
+          <div class="actions">
+            <Button
+              danger
+              size="large"
+              :loading="submitting && auditStatus === 2"
+              :disabled="submitting"
+              @click="submitAudit(2)"
+            >
+              拒绝
+            </Button>
+            <Button
+              type="primary"
+              size="large"
+              :loading="submitting && auditStatus === 1"
+              :disabled="submitting"
+              @click="submitAudit(1)"
+            >
+              通过审核
+            </Button>
+          </div>
+        </div>
+        <div v-else class="done-tip">该录入已处理</div>
+      </template>
+    </Spin>
+  </div>
+</template>
+
+<style scoped>
+.store-quick {
+  padding: 2px 0 4px;
+}
+
+.head {
+  display: flex;
+  justify-content: space-between;
+  gap: 12px;
+  margin-bottom: 14px;
+  padding: 14px 16px;
+  border-radius: 14px;
+  background:
+    radial-gradient(
+      70% 120% at 0% 0%,
+      hsl(var(--primary) / 0.14),
+      transparent 55%
+    ),
+    hsl(var(--muted) / 0.35);
+}
+
+.kicker {
+  font-size: 12px;
+  font-weight: 650;
+  color: hsl(var(--primary));
+}
+
+.title {
+  margin-top: 4px;
+  font-size: 17px;
+  font-weight: 700;
+  color: hsl(var(--foreground));
+}
+
+.desc {
+  margin: 6px 0 0;
+  font-size: 13px;
+  color: hsl(var(--muted-foreground));
+}
+
+.empty,
+.done-tip {
+  padding: 28px 0;
+  text-align: center;
+  color: hsl(var(--muted-foreground));
+}
+
+.input-user {
+  display: inline-flex;
+  align-items: center;
+  gap: 8px;
+}
+
+.media {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 10px;
+  margin-top: 14px;
+}
+
+.media-item {
+  padding: 8px;
+  border-radius: 10px;
+  border: 1px solid hsl(var(--border));
+  background: hsl(var(--card, var(--background)));
+}
+
+.media-item.file {
+  min-width: 120px;
+}
+
+.media-label,
+.field-label,
+.section-title {
+  margin-bottom: 6px;
+  font-size: 12px;
+  font-weight: 650;
+  color: hsl(var(--muted-foreground));
+}
+
+.section-title {
+  margin-top: 16px;
+  margin-bottom: 10px;
+  font-size: 14px;
+  color: hsl(var(--foreground));
+}
+
+.doctors {
+  margin-top: 4px;
+}
+
+.audit-box {
+  margin-top: 16px;
+  padding: 14px;
+  border-radius: 12px;
+  border: 1px solid hsl(var(--border));
+  background: hsl(var(--muted) / 0.28);
+}
+
+.field {
+  margin-bottom: 10px;
+}
+
+.actions {
+  display: flex;
+  justify-content: flex-end;
+  gap: 10px;
+  margin-top: 12px;
+}
+</style>
diff --git a/apps/web-antd/src/views/notice/views/VipNoticeView.vue b/apps/web-antd/src/views/notice/views/VipNoticeView.vue
new file mode 100644
index 00000000..df73fc1a
--- /dev/null
+++ b/apps/web-antd/src/views/notice/views/VipNoticeView.vue
@@ -0,0 +1,340 @@
+<script lang="ts" setup>
+/**
+ * 消息中心 · VIP 通知高级视图
+ * 优先用 payload 徽标；缺失时按 level_id / duration_type 回补，避免演示/旧数据只显示「-」
+ */
+import { computed, onMounted, ref, watch } from 'vue';
+
+import { Spin } from 'ant-design-vue';
+
+import VipBadgeCombo from '#/components/vip/VipBadgeCombo.vue';
+import { getVipDurationOption } from '#/views/system/vip/duration/api';
+import { getVipLevelInfo, getVipLevelOption } from '#/views/system/vip/level/api';
+
+const props = defineProps<{
+  notice: Record<string, any>;
+}>();
+
+const loading = ref(false);
+const card = ref<Record<string, any>>({});
+
+function parsePayload(): Record<string, any> {
+  const p = props.notice?.action_payload;
+  if (p && typeof p === 'object') return { ...p };
+  try {
+    return JSON.parse(String(props.notice?.content || '')) || {};
+  } catch {
+    return {};
+  }
+}
+
+const scene = computed(() => {
+  const type = String(card.value?.type || '');
+  if (type === 'vip_open_success') {
+    return { label: '开通成功', tone: 'success' };
+  }
+  if (type === 'vip_expiring') {
+    return { label: '即将到期', tone: 'warn' };
+  }
+  if (type === 'vip_expired') {
+    return { label: '已到期', tone: 'danger' };
+  }
+  return { label: props.notice?.type_name || 'VIP 通知', tone: 'normal' };
+});
+
+const hasBadge = computed(
+  () => !!(card.value?.badge_url || card.value?.duration_badge_url),
+);
+
+const monogram = computed(() => {
+  const name = String(card.value?.level_name || card.value?.level_code || 'VIP');
+  return name.slice(0, 2).toUpperCase();
+});
+
+const expireText = computed(() => {
+  if (card.value?.is_lifetime || Number(card.value?.expire_at) === 0) {
+    return card.value?.duration_label || '终身有效';
+  }
+  const at = Number(card.value?.expire_at || 0);
+  if (!at) return card.value?.duration_label || '—';
+  if (typeof card.value?.expire_at === 'string' && String(card.value.expire_at).includes('-')) {
+    return String(card.value.expire_at);
+  }
+  const d = new Date(at < 1e12 ? at * 1000 : at);
+  const pad = (n: number) => String(n).padStart(2, '0');
+  return `${d.getFullYear()}-${pad(d.getMonth() + 1)}-${pad(d.getDate())}`;
+});
+
+/**
+ * 补齐等级徽标 / 期限丝带 URL（演示 SQL 常缺图）
+ */
+async function hydrateBadges(base: Record<string, any>) {
+  const next = { ...base };
+  try {
+    if (!next.badge_url) {
+      if (Number(next.level_id) > 0) {
+        const level = await getVipLevelInfo(Number(next.level_id));
+        next.badge_url = level?.badge_url || next.badge_url;
+        next.level_name = next.level_name || level?.name;
+        next.level_code = next.level_code || level?.code;
+      } else if (next.level_code) {
+        const opts = (await getVipLevelOption()) || [];
+        const hit = (Array.isArray(opts) ? opts : []).find(
+          (o: any) => String(o.code) === String(next.level_code),
+        );
+        if (hit) {
+          next.badge_url = hit.badge_url || '';
+          next.level_id = hit.id || next.level_id;
+          next.level_name = next.level_name || hit.name;
+        }
+      }
+    }
+    if (!next.duration_badge_url) {
+      const durations = (await getVipDurationOption()) || [];
+      const list = Array.isArray(durations) ? durations : [];
+      const hit =
+        list.find((o: any) => String(o.code) === String(next.duration_type)) ||
+        list.find((o: any) => String(o.name) === String(next.duration_label));
+      if (hit) {
+        next.duration_badge_url = hit.badge_url || '';
+        next.duration_label = next.duration_label || hit.name;
+      }
+    }
+  } catch {
+    /* 徽标补齐失败仍展示文案卡 */
+  }
+  return next;
+}
+
+async function loadCard() {
+  loading.value = true;
+  try {
+    card.value = await hydrateBadges(parsePayload());
+  } finally {
+    loading.value = false;
+  }
+}
+
+watch(
+  () => [props.notice?.id, props.notice?.action_payload],
+  () => loadCard(),
+  { deep: true },
+);
+
+onMounted(loadCard);
+</script>
+
+<template>
+  <Spin :spinning="loading">
+    <div class="vip-view">
+      <div class="vip-card" :class="`tone-${scene.tone}`">
+        <div class="vip-card__glow" aria-hidden="true"></div>
+        <div class="vip-card__top">
+          <span class="scene-pill">{{ scene.label }}</span>
+          <span v-if="card.level_code" class="code-pill">{{ card.level_code }}</span>
+        </div>
+        <div class="vip-card__body">
+          <div class="badge-wrap">
+            <VipBadgeCombo
+              v-if="hasBadge"
+              size="xl"
+              :badge-url="card.badge_url"
+              :duration-badge-url="card.duration_badge_url"
+              :level-name="card.level_name"
+              :duration-label="card.duration_label"
+            />
+            <div v-else class="mono">{{ monogram }}</div>
+          </div>
+          <div class="info">
+            <div class="level-name">{{ card.level_name || '会员' }}</div>
+            <div class="duration">{{ card.duration_label || '会员权益' }}</div>
+            <div class="store">{{ card.store_name || '门店' }}</div>
+            <div class="expire">有效期至 {{ expireText }}</div>
+          </div>
+        </div>
+      </div>
+
+      <div class="price-row">
+        <div class="price-item">
+          <span class="label">原价</span>
+          <span class="val">¥{{ card.original_price || '0.00' }}</span>
+        </div>
+        <div class="price-item accent">
+          <span class="label">实付</span>
+          <span class="val">¥{{ card.pay_amount || '0.00' }}</span>
+        </div>
+      </div>
+
+      <p v-if="notice.detail" class="detail">{{ notice.detail }}</p>
+      <div v-if="card.store_id || card.open_record_id" class="meta-line">
+        <span v-if="card.store_id">门店 ID #{{ card.store_id }}</span>
+        <span v-if="card.open_record_id">开通记录 #{{ card.open_record_id }}</span>
+      </div>
+    </div>
+  </Spin>
+</template>
+
+<style scoped>
+.vip-view {
+  padding: 2px 0 6px;
+}
+
+.vip-card {
+  position: relative;
+  overflow: hidden;
+  padding: 20px 22px 22px;
+  border-radius: 18px;
+  color: #fff;
+  background:
+    linear-gradient(135deg, #1f2a37 0%, #2d4a3e 48%, #3d9b88 100%);
+  box-shadow:
+    0 12px 32px hsl(160 40% 20% / 0.28),
+    inset 0 1px 0 hsl(0 0% 100% / 0.12);
+}
+
+.vip-card.tone-warn {
+  background: linear-gradient(135deg, #2a2418 0%, #5c4020 52%, #b8860b 100%);
+}
+
+.vip-card.tone-danger {
+  background: linear-gradient(135deg, #2a181c 0%, #5a2430 52%, #a33b4a 100%);
+}
+
+.vip-card__glow {
+  position: absolute;
+  inset: -40% auto auto -20%;
+  width: 70%;
+  height: 90%;
+  background: radial-gradient(circle, hsl(0 0% 100% / 0.18), transparent 68%);
+  pointer-events: none;
+}
+
+.vip-card__top {
+  position: relative;
+  z-index: 1;
+  display: flex;
+  gap: 8px;
+  align-items: center;
+  margin-bottom: 16px;
+}
+
+.scene-pill,
+.code-pill {
+  display: inline-flex;
+  padding: 3px 10px;
+  border-radius: 999px;
+  font-size: 11px;
+  font-weight: 700;
+  letter-spacing: 0.04em;
+  background: hsl(0 0% 100% / 0.16);
+  backdrop-filter: blur(6px);
+}
+
+.vip-card__body {
+  position: relative;
+  z-index: 1;
+  display: flex;
+  align-items: center;
+  gap: 22px;
+}
+
+.badge-wrap {
+  flex-shrink: 0;
+  filter: drop-shadow(0 10px 18px hsl(0 0% 0% / 0.35));
+}
+
+.mono {
+  width: 120px;
+  height: 120px;
+  border-radius: 50%;
+  display: grid;
+  place-items: center;
+  font-size: 36px;
+  font-weight: 800;
+  letter-spacing: 0.04em;
+  color: #fff;
+  background: hsl(0 0% 100% / 0.16);
+  border: 1px solid hsl(0 0% 100% / 0.22);
+}
+
+.info {
+  min-width: 0;
+  flex: 1;
+}
+
+.level-name {
+  font-size: 24px;
+  font-weight: 780;
+  letter-spacing: -0.03em;
+  line-height: 1.2;
+}
+
+.duration {
+  margin-top: 6px;
+  font-size: 14px;
+  opacity: 0.92;
+}
+
+.store {
+  margin-top: 10px;
+  font-size: 13px;
+  opacity: 0.86;
+}
+
+.expire {
+  margin-top: 4px;
+  font-size: 12px;
+  opacity: 0.72;
+}
+
+.price-row {
+  display: grid;
+  grid-template-columns: 1fr 1fr;
+  gap: 10px;
+  margin-top: 14px;
+}
+
+.price-item {
+  padding: 12px 14px;
+  border-radius: 12px;
+  border: 1px solid hsl(var(--border));
+  background: hsl(var(--card, var(--background)));
+}
+
+.price-item.accent {
+  border-color: hsl(var(--primary) / 0.35);
+  background: hsl(var(--primary) / 0.08);
+}
+
+.price-item .label {
+  display: block;
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+}
+
+.price-item .val {
+  display: block;
+  margin-top: 4px;
+  font-size: 20px;
+  font-weight: 720;
+  letter-spacing: -0.02em;
+  font-variant-numeric: tabular-nums;
+  color: hsl(var(--foreground));
+}
+
+.detail {
+  margin: 14px 0 0;
+  font-size: 13px;
+  line-height: 1.55;
+  color: hsl(var(--muted-foreground));
+}
+
+.meta-line {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 12px;
+  margin-top: 10px;
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+}
+</style>
diff --git a/apps/web-antd/src/views/notice/views/WarehouseProductNoticeView.vue b/apps/web-antd/src/views/notice/views/WarehouseProductNoticeView.vue
new file mode 100644
index 00000000..d1db5959
--- /dev/null
+++ b/apps/web-antd/src/views/notice/views/WarehouseProductNoticeView.vue
@@ -0,0 +1,197 @@
+<script lang="ts" setup>
+/**
+ * 消息中心 · 仓品待审预览
+ * 展示药品图/规格/报价；完整审核表单较复杂，点「去审核」打开业务审核 Modal
+ */
+import { computed, onMounted, ref, watch } from 'vue';
+
+import { Button, Descriptions, Image, Spin, Tag, message } from 'ant-design-vue';
+
+import { getDeliveryWarehouseProductInfo } from '#/views/system/delivery-warehouse-product-audit/api';
+
+const props = defineProps<{
+  notice: Record<string, any>;
+}>();
+
+const emit = defineEmits<{
+  audit: [];
+}>();
+
+const loading = ref(false);
+const detail = ref<Record<string, any> | null>(null);
+
+const bizId = computed(() => Number(props.notice?.action_payload?.biz_id || 0));
+
+async function loadDetail() {
+  const id = bizId.value;
+  if (id <= 0) {
+    detail.value = null;
+    return;
+  }
+  loading.value = true;
+  try {
+    const res = await getDeliveryWarehouseProductInfo(id);
+    detail.value = res || null;
+  } catch {
+    message.error('加载仓品详情失败');
+    detail.value = null;
+  } finally {
+    loading.value = false;
+  }
+}
+
+watch(() => bizId.value, loadDetail);
+onMounted(loadDetail);
+</script>
+
+<template>
+  <div class="wh-view">
+    <div class="head">
+      <div>
+        <div class="kicker">仓品待审</div>
+        <div class="title">
+          {{ detail?.drug_name || notice.title || '仓品上传待审核' }}
+        </div>
+        <p class="desc">{{ notice.detail || '请核对药品信息后完成分区分类审核' }}</p>
+      </div>
+      <div class="tags">
+        <Tag v-if="detail?.type_txt">{{ detail.type_txt }}</Tag>
+        <Tag v-if="detail?.audit_status_txt" color="orange">{{
+          detail.audit_status_txt
+        }}</Tag>
+      </div>
+    </div>
+
+    <Spin :spinning="loading">
+      <div v-if="!bizId" class="empty">消息未携带商品 ID</div>
+      <div v-else-if="!loading && !detail" class="empty">未找到仓品记录</div>
+      <div v-else-if="detail" class="body">
+        <div class="preview">
+          <div v-if="detail.image" class="thumb">
+            <Image
+              :src="detail.image"
+              :width="120"
+              :height="120"
+              :preview="true"
+            />
+          </div>
+          <div v-else class="thumb placeholder">无图</div>
+          <Descriptions
+            class="facts"
+            :column="1"
+            size="small"
+            bordered
+          >
+            <Descriptions.Item label="商品 ID">#{{ detail.id }}</Descriptions.Item>
+            <Descriptions.Item label="规格">{{
+              detail.specification || '—'
+            }}</Descriptions.Item>
+            <Descriptions.Item label="上传报价">
+              ¥{{ detail.upload_quote ?? '—' }}
+            </Descriptions.Item>
+            <Descriptions.Item label="当前状态">
+              {{ detail.status_txt || '—' }}
+              <span v-if="detail.audit_status_txt">
+                · {{ detail.audit_status_txt }}
+              </span>
+            </Descriptions.Item>
+          </Descriptions>
+        </div>
+        <div class="actions">
+          <Button type="primary" size="large" @click="emit('audit')">
+            打开完整审核
+          </Button>
+        </div>
+      </div>
+    </Spin>
+  </div>
+</template>
+
+<style scoped>
+.wh-view {
+  padding: 2px 0 4px;
+}
+
+.head {
+  display: flex;
+  justify-content: space-between;
+  gap: 12px;
+  margin-bottom: 14px;
+  padding: 14px 16px;
+  border-radius: 14px;
+  background:
+    radial-gradient(
+      70% 120% at 100% 0%,
+      hsl(190 80% 45% / 0.16),
+      transparent 55%
+    ),
+    hsl(var(--muted) / 0.35);
+}
+
+.kicker {
+  font-size: 12px;
+  font-weight: 650;
+  color: hsl(var(--primary));
+}
+
+.title {
+  margin-top: 4px;
+  font-size: 17px;
+  font-weight: 700;
+  color: hsl(var(--foreground));
+}
+
+.desc {
+  margin: 6px 0 0;
+  font-size: 13px;
+  color: hsl(var(--muted-foreground));
+}
+
+.tags {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 6px;
+  justify-content: flex-end;
+}
+
+.empty {
+  padding: 32px 0;
+  text-align: center;
+  color: hsl(var(--muted-foreground));
+}
+
+.preview {
+  display: grid;
+  grid-template-columns: 120px 1fr;
+  gap: 14px;
+  align-items: start;
+}
+
+@media (max-width: 640px) {
+  .preview {
+    grid-template-columns: 1fr;
+  }
+}
+
+.thumb {
+  border-radius: 12px;
+  overflow: hidden;
+  border: 1px solid hsl(var(--border));
+  background: hsl(var(--card, var(--background)));
+}
+
+.thumb.placeholder {
+  width: 120px;
+  height: 120px;
+  display: grid;
+  place-items: center;
+  color: hsl(var(--muted-foreground));
+  font-size: 13px;
+}
+
+.actions {
+  display: flex;
+  justify-content: flex-end;
+  margin-top: 16px;
+}
+</style>
diff --git a/apps/web-antd/src/views/notice/views/WithdrawNoticeView.vue b/apps/web-antd/src/views/notice/views/WithdrawNoticeView.vue
new file mode 100644
index 00000000..1ee0c147
--- /dev/null
+++ b/apps/web-antd/src/views/notice/views/WithdrawNoticeView.vue
@@ -0,0 +1,136 @@
+<script lang="ts" setup>
+/**
+ * 提现待审定制视图：金额强调 + 通过/拒绝交给 ActionHost 打开业务审核
+ */
+import { computed } from 'vue';
+
+import { Button } from 'ant-design-vue';
+
+const props = defineProps<{
+  notice: Record<string, any>;
+}>();
+
+const emit = defineEmits<{
+  audit: [modalType: number];
+}>();
+
+const payload = computed(() => props.notice?.action_payload || {});
+</script>
+
+<template>
+  <div class="withdraw-view">
+    <div class="hero">
+      <div class="kicker">提现待审</div>
+      <div class="amount">
+        <span class="currency">¥</span>{{ payload.amount || '—' }}
+      </div>
+      <p class="subject">{{ notice.detail || '有一笔提现申请等待你处理' }}</p>
+    </div>
+    <dl class="facts">
+      <div class="fact">
+        <dt>单号</dt>
+        <dd>{{ payload.order_no || '—' }}</dd>
+      </div>
+      <div class="fact">
+        <dt>申请 ID</dt>
+        <dd>#{{ payload.biz_id || '—' }}</dd>
+      </div>
+      <div class="fact">
+        <dt>时间</dt>
+        <dd>{{ notice.created_at || '—' }}</dd>
+      </div>
+    </dl>
+    <div class="actions">
+      <Button danger size="large" @click="emit('audit', 1)">拒绝</Button>
+      <Button type="primary" size="large" @click="emit('audit', 0)">
+        通过审核
+      </Button>
+    </div>
+  </div>
+</template>
+
+<style scoped>
+.withdraw-view {
+  padding: 4px 0;
+}
+
+.hero {
+  padding: 20px 18px;
+  border-radius: 16px;
+  background:
+    radial-gradient(
+      70% 100% at 100% 0%,
+      hsl(var(--primary) / 0.2),
+      transparent 55%
+    ),
+    linear-gradient(
+      160deg,
+      hsl(var(--muted) / 0.55),
+      hsl(var(--card, var(--background)))
+    );
+  border: 1px solid hsl(var(--border));
+}
+
+.kicker {
+  font-size: 12px;
+  font-weight: 650;
+  color: hsl(var(--primary));
+}
+
+.amount {
+  margin-top: 10px;
+  font-size: 40px;
+  font-weight: 780;
+  letter-spacing: -0.04em;
+  font-variant-numeric: tabular-nums;
+  color: hsl(var(--foreground));
+}
+
+.currency {
+  margin-right: 2px;
+  font-size: 22px;
+  font-weight: 650;
+}
+
+.subject {
+  margin: 8px 0 0;
+  font-size: 13px;
+  color: hsl(var(--muted-foreground));
+}
+
+.facts {
+  display: grid;
+  gap: 10px;
+  margin: 16px 0 0;
+}
+
+.fact {
+  display: flex;
+  justify-content: space-between;
+  gap: 12px;
+  padding: 10px 12px;
+  border-radius: 10px;
+  background: hsl(var(--card, var(--background)));
+  border: 1px solid hsl(var(--border));
+}
+
+.fact dt {
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+}
+
+.fact dd {
+  margin: 0;
+  font-size: 13px;
+  font-weight: 600;
+  color: hsl(var(--foreground));
+  font-variant-numeric: tabular-nums;
+}
+
+.actions {
+  display: flex;
+  justify-content: flex-end;
+  gap: 10px;
+  margin-top: 18px;
+}
+</style>
diff --git a/apps/web-antd/src/views/notice/views/registry.ts b/apps/web-antd/src/views/notice/views/registry.ts
new file mode 100644
index 00000000..13c9a47a
--- /dev/null
+++ b/apps/web-antd/src/views/notice/views/registry.ts
@@ -0,0 +1,45 @@
+/**
+ * 消息类型 → 定制展示组件注册表
+ * 点击消息时优先按 type_code 选视图，再叠加 action_type 打开业务审核
+ */
+import type { Component } from 'vue';
+
+import DoctorInputNoticeView from './DoctorInputNoticeView.vue';
+import InvoiceNoticeView from './InvoiceNoticeView.vue';
+import PeriodReportView from './PeriodReportView.vue';
+import PriceChangeNoticeView from './PriceChangeNoticeView.vue';
+import QueueFailureView from './QueueFailureView.vue';
+import RichTextNoticeView from './RichTextNoticeView.vue';
+import ScheduleChangeNoticeView from './ScheduleChangeNoticeView.vue';
+import StoreInputNoticeView from './StoreInputNoticeView.vue';
+import VipNoticeView from './VipNoticeView.vue';
+import WarehouseProductNoticeView from './WarehouseProductNoticeView.vue';
+import WithdrawNoticeView from './WithdrawNoticeView.vue';
+
+export const NOTICE_TYPE_VIEW: Record<string, Component> = {
+  vip: VipNoticeView,
+  period_report: PeriodReportView,
+  withdraw_audit: WithdrawNoticeView,
+  invoice_todo: InvoiceNoticeView,
+  queue_failure: QueueFailureView,
+  doctor_input_audit: DoctorInputNoticeView,
+  store_input_audit: StoreInputNoticeView,
+  warehouse_product_audit: WarehouseProductNoticeView,
+  price_change: PriceChangeNoticeView,
+  schedule_change: ScheduleChangeNoticeView,
+  system: RichTextNoticeView,
+  broadcast: RichTextNoticeView,
+  prescription_audit: RichTextNoticeView,
+};
+
+export function resolveNoticeView(typeCode?: string): Component {
+  const code = String(typeCode || '').trim();
+  return NOTICE_TYPE_VIEW[code] || RichTextNoticeView;
+}
+
+/** 仍需继续打开外部业务审核 Modal 的类型（视图内 emit audit） */
+export const AUDIT_TYPE_CODES = new Set([
+  'withdraw_audit',
+  'warehouse_product_audit',
+  'invoice_todo',
+]);
diff --git a/apps/web-antd/src/views/pharmacist/audit-prescription/config/table.ts b/apps/web-antd/src/views/pharmacist/audit-prescription/config/table.ts
index ace337e5..03dd8f0d 100644
--- a/apps/web-antd/src/views/pharmacist/audit-prescription/config/table.ts
+++ b/apps/web-antd/src/views/pharmacist/audit-prescription/config/table.ts
@@ -108,7 +108,7 @@ export const gridOptions: VxeGridProps<RowType> = {
     export: false,
     zoom: true,
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
   },
   showOverflow: false,
diff --git a/apps/web-antd/src/views/pharmacist/audit-prescription/index.vue b/apps/web-antd/src/views/pharmacist/audit-prescription/index.vue
index a59abd8e..2ca001dc 100644
--- a/apps/web-antd/src/views/pharmacist/audit-prescription/index.vue
+++ b/apps/web-antd/src/views/pharmacist/audit-prescription/index.vue
@@ -258,7 +258,7 @@ function onViewModeChange(mode: string | number) {
       />
     </div>
     <Grid v-if="viewMode === 'list'">
-      <template #toolbar-buttons>
+      <template #toolbar-actions>
         <TableAction :actions="[]" :drop-down-actions="[]" />
       </template>
       <template #prescription_no="{ row }">
diff --git a/apps/web-antd/src/views/system/admin-notice-type/api/index.ts b/apps/web-antd/src/views/system/admin-notice-type/api/index.ts
new file mode 100644
index 00000000..6c588ebd
--- /dev/null
+++ b/apps/web-antd/src/views/system/admin-notice-type/api/index.ts
@@ -0,0 +1,24 @@
+import { requestClient } from '#/api/request';
+
+/** 站内信类型字典 API */
+const prefix = 'admin-notice-type/';
+
+export async function getAdminNoticeTypeList(data: any) {
+  return requestClient.get<any>(`${prefix}list`, { params: data });
+}
+
+export async function getAdminNoticeTypeOption(data?: any) {
+  return requestClient.get<any>(`${prefix}option`, { params: data });
+}
+
+export async function createAdminNoticeType(data: Record<string, any>) {
+  return requestClient.post<any>(`${prefix}create`, data);
+}
+
+export async function updateAdminNoticeType(data: Record<string, any>) {
+  return requestClient.post<any>(`${prefix}update`, data);
+}
+
+export async function deleteAdminNoticeType(data: Record<string, any>) {
+  return requestClient.post<any>(`${prefix}delete`, data);
+}
diff --git a/apps/web-antd/src/views/system/admin-notice-type/components/modal.vue b/apps/web-antd/src/views/system/admin-notice-type/components/modal.vue
new file mode 100644
index 00000000..8e62d192
--- /dev/null
+++ b/apps/web-antd/src/views/system/admin-notice-type/components/modal.vue
@@ -0,0 +1,69 @@
+<script lang="ts" setup>
+/**
+ * 站内信类型字典新增/编辑弹窗
+ */
+import { ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+
+import { message } from 'ant-design-vue';
+
+import { useVbenForm } from '#/adapter/form';
+
+import { createAdminNoticeType, updateAdminNoticeType } from '../api';
+import { modalFormProps } from '../config/form';
+
+const isUpdate = ref(false);
+const gridApi = ref();
+const [Form, formApi] = useVbenForm(modalFormProps);
+const [Modal, modalApi] = useVbenModal({
+  fullscreenButton: false,
+  draggable: true,
+  onCancel() {
+    modalApi.close();
+  },
+  onConfirm: async () => {
+    const e = await formApi.validate();
+    if (!e.valid) return;
+    const values = await formApi.getValues();
+    modalApi.setState({ confirmLoading: true });
+    try {
+      const api = isUpdate.value ? updateAdminNoticeType : createAdminNoticeType;
+      await api(values);
+      message.success('保存成功');
+      gridApi.value?.query?.();
+      gridApi.value?.reload?.();
+      modalApi.close();
+    } finally {
+      modalApi.setState({ confirmLoading: false });
+    }
+  },
+  onOpenChange(isOpen: boolean) {
+    gridApi.value = isOpen ? modalApi.getData()?.gridApi : null;
+    if (!isOpen) {
+      formApi.resetForm();
+      return;
+    }
+    const { values, update } = modalApi.getData<Record<string, any>>() || {};
+    isUpdate.value = !!update;
+    // 编辑时锁定 code，避免业务硬编码失效
+    formApi.updateSchema([
+      {
+        fieldName: 'code',
+        componentProps: { disabled: !!update },
+      },
+    ]);
+    if (values && update) {
+      formApi.setValues({ ...values });
+    } else {
+      formApi.resetForm();
+      formApi.setValues({ sort: 0, status: 1, color: 'sky', icon: '', cover_url: '' });
+    }
+  },
+});
+</script>
+<template>
+  <Modal :title="`${isUpdate ? '编辑' : '新增'}消息类型`" class="w-[560px]">
+    <Form />
+  </Modal>
+</template>
diff --git a/apps/web-antd/src/views/system/admin-notice-type/config/constants.ts b/apps/web-antd/src/views/system/admin-notice-type/config/constants.ts
new file mode 100644
index 00000000..f864748f
--- /dev/null
+++ b/apps/web-antd/src/views/system/admin-notice-type/config/constants.ts
@@ -0,0 +1,22 @@
+/** 站内信类型字典常量 */
+
+export const STATUS_OPTIONS = [
+  { label: '启用', value: 1 },
+  { label: '禁用', value: 0 },
+];
+
+/** 主题色 token，与铃铛/卡片 CSS 映射一致 */
+export const COLOR_OPTIONS = [
+  { label: '天蓝 sky', value: 'sky' },
+  { label: '琥珀 amber', value: 'amber' },
+  { label: '翠绿 emerald', value: 'emerald' },
+  { label: '青绿 teal', value: 'teal' },
+  { label: '青色 cyan', value: 'cyan' },
+  { label: '橙色 orange', value: 'orange' },
+  { label: '紫色 violet', value: 'violet' },
+  { label: '靛蓝 indigo', value: 'indigo' },
+  { label: '蓝色 blue', value: 'blue' },
+  { label: '绿色 green', value: 'green' },
+  { label: '红色 red', value: 'red' },
+  { label: '酸橙 lime', value: 'lime' },
+];
diff --git a/apps/web-antd/src/views/system/admin-notice-type/config/form.ts b/apps/web-antd/src/views/system/admin-notice-type/config/form.ts
new file mode 100644
index 00000000..0fcb8e8f
--- /dev/null
+++ b/apps/web-antd/src/views/system/admin-notice-type/config/form.ts
@@ -0,0 +1,75 @@
+import type { VbenFormProps } from '#/adapter/form';
+
+import { COLOR_OPTIONS, STATUS_OPTIONS } from './constants';
+
+/** 站内信类型表单 */
+export const modalFormProps: VbenFormProps = {
+  wrapperClass: 'grid-cols-12',
+  commonConfig: {
+    formItemClass: 'col-span-12',
+    componentProps: { class: 'w-full' },
+  },
+  layout: 'horizontal',
+  schema: [
+    {
+      component: 'VbenInput',
+      fieldName: 'id',
+      label: 'ID',
+      dependencies: { show: false, triggerFields: ['id'] },
+    },
+    {
+      component: 'VbenInput',
+      fieldName: 'code',
+      label: '类型编码',
+      rules: 'required',
+      componentProps: { placeholder: 'snake_case，如 withdraw_audit' },
+    },
+    {
+      component: 'VbenInput',
+      fieldName: 'name',
+      label: '展示名称',
+      rules: 'required',
+      componentProps: { placeholder: '如：提现待审' },
+    },
+    {
+      component: 'VbenInput',
+      fieldName: 'icon',
+      label: '图标',
+      componentProps: {
+        placeholder: 'iconify 名，如 ant-design:bell-outlined',
+      },
+      defaultValue: '',
+    },
+    {
+      component: 'VbenInput',
+      fieldName: 'cover_url',
+      label: '封面图',
+      componentProps: { placeholder: '可选图片 URL' },
+      defaultValue: '',
+    },
+    {
+      component: 'VbenSelect',
+      fieldName: 'color',
+      label: '主题色',
+      formItemClass: 'col-span-6',
+      componentProps: { options: COLOR_OPTIONS },
+      defaultValue: 'sky',
+    },
+    {
+      component: 'InputNumber',
+      fieldName: 'sort',
+      label: '排序',
+      formItemClass: 'col-span-6',
+      componentProps: { min: 0 },
+      defaultValue: 0,
+    },
+    {
+      component: 'VbenSelect',
+      fieldName: 'status',
+      label: '状态',
+      componentProps: { options: STATUS_OPTIONS },
+      defaultValue: 1,
+    },
+  ],
+  showDefaultActions: false,
+};
diff --git a/apps/web-antd/src/views/system/admin-notice-type/index.vue b/apps/web-antd/src/views/system/admin-notice-type/index.vue
new file mode 100644
index 00000000..dc829a52
--- /dev/null
+++ b/apps/web-antd/src/views/system/admin-notice-type/index.vue
@@ -0,0 +1,178 @@
+<script lang="ts" setup>
+/**
+ * 站内信类型字典：维护 code/图标/主题色，供消息中心与铃铛展示
+ */
+import type { VxeGridListeners } from '#/adapter/vxe-table';
+
+import { ref } from 'vue';
+
+import { Page, useVbenModal } from '@vben/common-ui';
+
+import { message } from 'ant-design-vue';
+
+import { useVbenVxeGrid } from '#/adapter/vxe-table';
+import { TableAction } from '#/components/table-action';
+
+import {
+  deleteAdminNoticeType,
+  getAdminNoticeTypeList,
+} from './api';
+import FormModal from './components/modal.vue';
+import { STATUS_OPTIONS } from './config/constants';
+
+defineOptions({ name: 'AdminNoticeType' });
+
+const hasTopTableDropDownActions = ref(false);
+
+const formOptions = {
+  schema: [
+    {
+      component: 'VbenInput',
+      fieldName: 'code',
+      label: '编码',
+      componentProps: { placeholder: 'type_code' },
+    },
+    {
+      component: 'VbenInput',
+      fieldName: 'name',
+      label: '名称',
+      componentProps: { placeholder: '展示名' },
+    },
+    {
+      component: 'VbenSelect',
+      fieldName: 'status',
+      label: '状态',
+      componentProps: { options: STATUS_OPTIONS, allowClear: true },
+    },
+  ],
+};
+
+const gridOptions = {
+  checkboxConfig: { highlight: true, labelField: '' },
+  columns: [
+    { type: 'checkbox', width: 60 },
+    { field: 'id', title: 'ID', width: 80 },
+    { field: 'code', title: '编码', minWidth: 160 },
+    { field: 'name', title: '名称', minWidth: 120 },
+    { field: 'icon', title: '图标', minWidth: 180 },
+    { field: 'color', title: '主题色', width: 100 },
+    { field: 'sort', title: '排序', width: 80 },
+    { field: 'status_txt', title: '状态', width: 80 },
+    { field: 'created_at', title: '创建时间', width: 170 },
+    { title: '操作', slots: { default: 'action' }, width: 140, fixed: 'right' },
+  ],
+  keepSource: true,
+  pagerConfig: {},
+  proxyConfig: {
+    ajax: {
+      query: async ({ page }: any, formValues: any) => {
+        return await getAdminNoticeTypeList({
+          page: page.currentPage,
+          pageSize: page.pageSize,
+          ...formValues,
+        });
+      },
+    },
+  },
+  height: 'auto',
+  toolbarConfig: {
+    search: true,
+    refresh: true,
+    slots: { buttons: 'toolbar-actions' },
+  },
+};
+
+const gridEvents: VxeGridListeners<any> = {
+  checkboxChange() {
+    hasTopTableDropDownActions.value =
+      gridApi.grid.getCheckboxRecords().length > 0;
+  },
+  checkboxAll() {
+    hasTopTableDropDownActions.value =
+      gridApi.grid.getCheckboxRecords().length > 0;
+  },
+};
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  formOptions,
+  gridOptions: gridOptions as any,
+  gridEvents,
+});
+
+const [FormModalComp, formModalApi] = useVbenModal({
+  connectedComponent: FormModal,
+});
+
+const showModal = (data: any = {}, isUpdate = false) => {
+  formModalApi.setData({
+    values: data,
+    update: isUpdate,
+    gridApi,
+  });
+  formModalApi.open();
+};
+
+const handleDelete = (row: any) => {
+  deleteAdminNoticeType({ ids: [row.id] }).then(() => {
+    message.success('删除成功');
+    gridApi.query();
+  });
+};
+
+const handleBatchDelete = () => {
+  const rows = gridApi.grid.getCheckboxRecords();
+  if (!rows.length) return;
+  deleteAdminNoticeType({ ids: rows.map((r: any) => r.id) }).then(() => {
+    message.success('删除成功');
+    gridApi.query();
+  });
+};
+</script>
+<template>
+  <Page auto-content-height>
+    <FormModalComp />
+    <Grid>
+      <template #toolbar-actions>
+        <TableAction
+          :actions="[
+            {
+              label: '新增',
+              type: 'primary',
+              onClick: () => showModal({}, false),
+            },
+          ]"
+          :drop-down-actions="
+            hasTopTableDropDownActions
+              ? [
+                  {
+                    label: '批量删除',
+                    popConfirm: {
+                      title: '确认删除选中类型？',
+                      confirm: handleBatchDelete,
+                    },
+                  },
+                ]
+              : []
+          "
+        />
+      </template>
+      <template #action="{ row }">
+        <TableAction
+          :actions="[
+            {
+              label: '编辑',
+              onClick: () => showModal(row, true),
+            },
+            {
+              label: '删除',
+              popConfirm: {
+                title: '确认删除该类型？',
+                confirm: () => handleDelete(row),
+              },
+            },
+          ]"
+        />
+      </template>
+    </Grid>
+  </Page>
+</template>
diff --git a/apps/web-antd/src/views/system/admin/_shared/admin-page.vue b/apps/web-antd/src/views/system/admin/_shared/admin-page.vue
index 954f773b..4e4ad805 100644
--- a/apps/web-antd/src/views/system/admin/_shared/admin-page.vue
+++ b/apps/web-antd/src/views/system/admin/_shared/admin-page.vue
@@ -227,7 +227,7 @@ const copyToClipboard = async (text: string) => {
     <DoctorCardModals />
     <OaAccountModals />
     <Grid>
-      <template #toolbar-buttons>
+      <template #toolbar-actions>
         <TableAction
           :actions="[
             {
diff --git a/apps/web-antd/src/views/system/admin/_shared/form-schemas.ts b/apps/web-antd/src/views/system/admin/_shared/form-schemas.ts
index 206bd759..fd8f92ff 100644
--- a/apps/web-antd/src/views/system/admin/_shared/form-schemas.ts
+++ b/apps/web-antd/src/views/system/admin/_shared/form-schemas.ts
@@ -140,7 +140,8 @@ export function createAdminModalFormProps(
       },
       fieldName: 'phone',
       label: '手机号',
-      rules: 'required',
+      // 与后端 checkPhone 一致：必填 + 大陆 11 位号段
+      rules: 'mobile',
       formItemClass: 'col-span-6',
     },
   ];
diff --git a/apps/web-antd/src/views/system/admin/_shared/table-config.ts b/apps/web-antd/src/views/system/admin/_shared/table-config.ts
index 54dc8676..f0e7bb01 100644
--- a/apps/web-antd/src/views/system/admin/_shared/table-config.ts
+++ b/apps/web-antd/src/views/system/admin/_shared/table-config.ts
@@ -168,7 +168,7 @@ export function createAdminGridOptions(
       export: false,
       zoom: true,
       slots: {
-        buttons: 'toolbar-buttons',
+        buttons: 'toolbar-actions',
       },
       custom: {
         icon: 'vxe-icon-menu',
diff --git a/apps/web-antd/src/views/system/admin/config/form.ts b/apps/web-antd/src/views/system/admin/config/form.ts
index 862d4e21..c0c97398 100644
--- a/apps/web-antd/src/views/system/admin/config/form.ts
+++ b/apps/web-antd/src/views/system/admin/config/form.ts
@@ -59,7 +59,8 @@ export const modalFormProps: VbenFormProps = {
       },
       fieldName: 'phone',
       label: '手机号',
-      rules: 'required',
+      // 与后端 checkPhone 一致：必填 + 大陆 11 位号段
+      rules: 'mobile',
       formItemClass: 'col-span-6',
     },
     {
diff --git a/apps/web-antd/src/views/system/admin/config/table.ts b/apps/web-antd/src/views/system/admin/config/table.ts
index 7b63be49..5519d217 100644
--- a/apps/web-antd/src/views/system/admin/config/table.ts
+++ b/apps/web-antd/src/views/system/admin/config/table.ts
@@ -83,7 +83,7 @@ export const gridOptions: VxeGridProps<RowType> = {
     // custom: true, // 自定义列
     zoom: true, // 最大化最小化
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
     custom: {
       // 自定义列-图标
diff --git a/apps/web-antd/src/views/system/ai/api-key/index.vue b/apps/web-antd/src/views/system/ai/api-key/index.vue
index 8590a647..62caff72 100644
--- a/apps/web-antd/src/views/system/ai/api-key/index.vue
+++ b/apps/web-antd/src/views/system/ai/api-key/index.vue
@@ -81,7 +81,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
     toolbarConfig: {
       search: true,
       refresh: true,
-      slots: { buttons: 'toolbar-buttons' },
+      slots: { buttons: 'toolbar-actions' },
     },
   },
   gridEvents: {
@@ -139,7 +139,7 @@ onMounted(async () => {
   <Page auto-content-height>
     <FormModalComp />
     <Grid>
-      <template #toolbar-buttons>
+      <template #toolbar-actions>
         <TableAction
           :actions="[
             {
diff --git a/apps/web-antd/src/views/system/base-config/config/table.ts b/apps/web-antd/src/views/system/base-config/config/table.ts
index 84aaae10..4aa5a65e 100644
--- a/apps/web-antd/src/views/system/base-config/config/table.ts
+++ b/apps/web-antd/src/views/system/base-config/config/table.ts
@@ -55,7 +55,7 @@ export const gridOptions: VxeGridProps<RowType> = {
     // custom: true, // 自定义列
     zoom: true, // 最大化最小化
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
     custom: {
       // 自定义列-图标
diff --git a/apps/web-antd/src/views/system/base-config/index.vue b/apps/web-antd/src/views/system/base-config/index.vue
index 7e3f39f4..189dfad1 100644
--- a/apps/web-antd/src/views/system/base-config/index.vue
+++ b/apps/web-antd/src/views/system/base-config/index.vue
@@ -68,7 +68,7 @@ const showDetail = (row: any) => {
     <FormModal />
     <DetailModal />
     <Grid>
-      <template #toolbar-buttons>
+      <template #toolbar-actions>
         <TableAction
           :actions="[
             {
diff --git a/apps/web-antd/src/views/system/delivery-warehouse-drug/config/table.ts b/apps/web-antd/src/views/system/delivery-warehouse-drug/config/table.ts
index 50212a90..52bf0986 100644
--- a/apps/web-antd/src/views/system/delivery-warehouse-drug/config/table.ts
+++ b/apps/web-antd/src/views/system/delivery-warehouse-drug/config/table.ts
@@ -79,7 +79,7 @@ export const gridOptions: VxeGridProps<RowType> = {
     export: false,
     zoom: true,
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
     custom: {
       icon: 'vxe-icon-menu',
diff --git a/apps/web-antd/src/views/system/delivery-warehouse-drug/index.vue b/apps/web-antd/src/views/system/delivery-warehouse-drug/index.vue
index 794f4547..a8893f76 100644
--- a/apps/web-antd/src/views/system/delivery-warehouse-drug/index.vue
+++ b/apps/web-antd/src/views/system/delivery-warehouse-drug/index.vue
@@ -65,7 +65,7 @@ const deleteApi = (row: any) => {
   <Page auto-content-height title="仓药绑定管理">
     <FormModal />
     <Grid>
-      <template #toolbar-buttons>
+      <template #toolbar-actions>
         <TableAction
           :actions="[
             {
diff --git a/apps/web-antd/src/views/system/delivery-warehouse-order/config/table.ts b/apps/web-antd/src/views/system/delivery-warehouse-order/config/table.ts
index ba2105fb..1a35f543 100644
--- a/apps/web-antd/src/views/system/delivery-warehouse-order/config/table.ts
+++ b/apps/web-antd/src/views/system/delivery-warehouse-order/config/table.ts
@@ -64,7 +64,7 @@ export const gridOptions: VxeGridProps<RowType> = {
     export: false,
     zoom: true,
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
     custom: {
       icon: 'vxe-icon-menu',
diff --git a/apps/web-antd/src/views/system/delivery-warehouse-product-audit/config/table.ts b/apps/web-antd/src/views/system/delivery-warehouse-product-audit/config/table.ts
index 6582793c..fe63af3d 100644
--- a/apps/web-antd/src/views/system/delivery-warehouse-product-audit/config/table.ts
+++ b/apps/web-antd/src/views/system/delivery-warehouse-product-audit/config/table.ts
@@ -85,7 +85,7 @@ export const gridOptions: VxeGridProps<RowType> = {
     export: false,
     zoom: true,
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
     custom: {
       icon: 'vxe-icon-menu',
diff --git a/apps/web-antd/src/views/system/delivery-warehouse-product-audit/index.vue b/apps/web-antd/src/views/system/delivery-warehouse-product-audit/index.vue
index c2b22a79..734fdad3 100644
--- a/apps/web-antd/src/views/system/delivery-warehouse-product-audit/index.vue
+++ b/apps/web-antd/src/views/system/delivery-warehouse-product-audit/index.vue
@@ -49,7 +49,7 @@ function auditTagColor(status: number) {
   <Page auto-content-height title="仓品审核">
     <AuditModal />
     <Grid>
-      <template #toolbar-buttons>
+      <template #toolbar-actions>
         <TableAction :actions="[]" :drop-down-actions="[]" />
       </template>
       <template #image="{ row }">
diff --git a/apps/web-antd/src/views/system/delivery-warehouse-product/config/table.ts b/apps/web-antd/src/views/system/delivery-warehouse-product/config/table.ts
index 3b9701c3..7d375f3b 100644
--- a/apps/web-antd/src/views/system/delivery-warehouse-product/config/table.ts
+++ b/apps/web-antd/src/views/system/delivery-warehouse-product/config/table.ts
@@ -85,7 +85,7 @@ export const gridOptions: VxeGridProps<RowType> = {
     export: false,
     zoom: true,
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
     custom: {
       icon: 'vxe-icon-menu',
diff --git a/apps/web-antd/src/views/system/delivery-warehouse-product/index.vue b/apps/web-antd/src/views/system/delivery-warehouse-product/index.vue
index 1d6bf590..4c03e99a 100644
--- a/apps/web-antd/src/views/system/delivery-warehouse-product/index.vue
+++ b/apps/web-antd/src/views/system/delivery-warehouse-product/index.vue
@@ -49,7 +49,7 @@ function auditTagColor(status: number) {
   <Page auto-content-height title="我的商品">
     <FormModal />
     <Grid>
-      <template #toolbar-buttons>
+      <template #toolbar-actions>
         <TableAction
           :actions="[
             {
diff --git a/apps/web-antd/src/views/system/delivery-warehouse-stock/config/table.ts b/apps/web-antd/src/views/system/delivery-warehouse-stock/config/table.ts
index c2906f76..036bba6c 100644
--- a/apps/web-antd/src/views/system/delivery-warehouse-stock/config/table.ts
+++ b/apps/web-antd/src/views/system/delivery-warehouse-stock/config/table.ts
@@ -57,7 +57,7 @@ export const gridOptions: VxeGridProps<RowType> = {
     export: false,
     zoom: true,
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
     custom: {
       icon: 'vxe-icon-menu',
diff --git a/apps/web-antd/src/views/system/delivery-warehouse/config/form.ts b/apps/web-antd/src/views/system/delivery-warehouse/config/form.ts
index c213b5c8..0500abcf 100644
--- a/apps/web-antd/src/views/system/delivery-warehouse/config/form.ts
+++ b/apps/web-antd/src/views/system/delivery-warehouse/config/form.ts
@@ -67,7 +67,8 @@ export const modalFormProps: VbenFormProps = {
       },
       fieldName: 'phone',
       label: '手机号',
-      rules: 'required',
+      // 与后端 checkPhone 一致：必填 + 大陆 11 位号段
+      rules: 'mobile',
       help: '默认初始密码 Xk123456@',
       dependencies: {
         if({ id }: { id?: number | string }) {
diff --git a/apps/web-antd/src/views/system/delivery-warehouse/config/table.ts b/apps/web-antd/src/views/system/delivery-warehouse/config/table.ts
index 18c186e0..206d18fa 100644
--- a/apps/web-antd/src/views/system/delivery-warehouse/config/table.ts
+++ b/apps/web-antd/src/views/system/delivery-warehouse/config/table.ts
@@ -66,7 +66,7 @@ export const gridOptions: VxeGridProps<RowType> = {
     export: false,
     zoom: true,
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
     custom: {
       icon: 'vxe-icon-menu',
diff --git a/apps/web-antd/src/views/system/delivery-warehouse/index.vue b/apps/web-antd/src/views/system/delivery-warehouse/index.vue
index 75fdce9b..de0dde40 100644
--- a/apps/web-antd/src/views/system/delivery-warehouse/index.vue
+++ b/apps/web-antd/src/views/system/delivery-warehouse/index.vue
@@ -122,7 +122,7 @@ const deleteApi = (row: any) => {
     <BankCardReportModalComponent />
     <BankCardStatusModalComponent />
     <Grid>
-      <template #toolbar-buttons>
+      <template #toolbar-actions>
         <TableAction
           :actions="[
             {
diff --git a/apps/web-antd/src/views/system/department/api/index.ts b/apps/web-antd/src/views/system/department/api/index.ts
new file mode 100644
index 00000000..0a243275
--- /dev/null
+++ b/apps/web-antd/src/views/system/department/api/index.ts
@@ -0,0 +1,44 @@
+import { requestClient } from '#/api/request';
+
+const prefix = 'department/';
+
+/**
+ * 获取科室树形列表（平铺返回，前端 treeConfig transform 组树）
+ * xk-api GET /department/list
+ * @param data name 科室名称模糊搜索
+ */
+export async function getDepartmentList(data: any) {
+  return requestClient.get<any>(`${prefix}list`, { params: data });
+}
+
+/**
+ * 获取科室下拉选项（选择父级科室用，返回 [{id, name, pid, level}]）
+ * xk-api GET /department/option
+ */
+export async function getDepartmentOption() {
+  return requestClient.get<any>(`${prefix}option`);
+}
+
+/**
+ * 新增科室（level 由后端按 pid 推导，最多两级）
+ * xk-api POST /department/create
+ */
+export async function createDepartment(data: Record<string, any>) {
+  return requestClient.post<any>(`${prefix}create`, data);
+}
+
+/**
+ * 编辑科室
+ * xk-api POST /department/update
+ */
+export async function updateDepartment(data: Record<string, any>) {
+  return requestClient.post<any>(`${prefix}update`, data);
+}
+
+/**
+ * 删除科室（物理删除，后端校验子科室与医生绑定）
+ * xk-api POST /department/delete
+ */
+export async function deleteDepartment(data: Record<string, any>) {
+  return requestClient.post<any>(`${prefix}delete`, data);
+}
diff --git a/apps/web-antd/src/views/system/department/components/modal.vue b/apps/web-antd/src/views/system/department/components/modal.vue
new file mode 100644
index 00000000..c88e17b1
--- /dev/null
+++ b/apps/web-antd/src/views/system/department/components/modal.vue
@@ -0,0 +1,85 @@
+<script lang="ts" setup>
+// 科室新增/编辑弹窗
+// 父级科室选项在打开弹窗时从接口拉取（仅一级科室可选），编辑时排除自己防止自挂
+import { ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+
+import { message } from 'ant-design-vue';
+
+import { useVbenForm } from '#/adapter/form';
+
+import { createDepartment, getDepartmentOption, updateDepartment } from '../api';
+import { modalFormProps } from '../config/form';
+
+const isUpdate = ref(false);
+const gridApi = ref();
+
+const [Form, formApi] = useVbenForm(modalFormProps);
+
+/**
+ * 拉取父级科室选项并注入 pid 下拉
+ * 只允许一级科室作为父级（后端强制两级封顶），编辑时排除自身
+ */
+const loadParentOptions = async (excludeId?: number) => {
+  const list = await getDepartmentOption();
+  const options = [
+    { label: '作为一级科室（无父级）', value: 0 },
+    ...(list || [])
+      .filter((item: any) => item.level === 1 && item.id !== excludeId)
+      .map((item: any) => ({ label: item.name, value: item.id })),
+  ];
+  formApi.updateSchema([
+    {
+      fieldName: 'pid',
+      componentProps: {
+        options,
+      },
+    },
+  ]);
+};
+
+const [Modal, modalApi] = useVbenModal({
+  fullscreenButton: false,
+  draggable: true,
+  onCancel() {
+    modalApi.close();
+  },
+  onConfirm: async () => {
+    formApi.validate().then(async (e: any) => {
+      if (e.valid) {
+        const values = await formApi.getValues();
+        modalApi.lock();
+        const submitApi = isUpdate.value ? updateDepartment : createDepartment;
+        submitApi(values)
+          .then(() => {
+            message.success('保存成功');
+            gridApi.value?.query();
+            modalApi.close();
+          })
+          .finally(() => {
+            modalApi.unlock();
+          });
+      }
+    });
+  },
+  onOpenChange(isOpen: boolean) {
+    gridApi.value = isOpen ? modalApi.getData()?.gridApi : null;
+    if (isOpen) {
+      const { values, update } = modalApi.getData<Record<string, any>>();
+      isUpdate.value = !!update;
+      // 先重置再回填，避免上一次打开的残留值
+      formApi.resetForm();
+      loadParentOptions(update ? values?.id : undefined);
+      if (values) {
+        formApi.setValues(values);
+      }
+    }
+  },
+});
+</script>
+<template>
+  <Modal :title="`${isUpdate === true ? '编辑' : '新增'}科室`" class="w-[520px]">
+    <Form />
+  </Modal>
+</template>
diff --git a/apps/web-antd/src/views/system/department/config/form.ts b/apps/web-antd/src/views/system/department/config/form.ts
new file mode 100644
index 00000000..a1e386a8
--- /dev/null
+++ b/apps/web-antd/src/views/system/department/config/form.ts
@@ -0,0 +1,81 @@
+import type { VbenFormProps } from '#/adapter/form';
+
+/**
+ * 科室新增/编辑弹窗表单
+ * pid 的选项来自接口（仅一级科室可作为父级），在 modal.vue 的 onOpenChange 里
+ * 通过 formApi.updateSchema 动态注入，禁止在此写死
+ */
+export const modalFormProps: VbenFormProps = {
+  wrapperClass: 'grid-cols-12',
+  commonConfig: {
+    formItemClass: 'col-span-12',
+    // 所有表单项
+    componentProps: {
+      class: 'w-full',
+    },
+  },
+  layout: 'horizontal',
+  showDefaultActions: false,
+  schema: [
+    {
+      component: 'VbenInput',
+      fieldName: 'id',
+      label: 'ID',
+      dependencies: {
+        show: false,
+        triggerFields: ['id'],
+      },
+    },
+    {
+      component: 'VbenInput',
+      componentProps: {
+        placeholder: '请输入科室名称',
+        maxlength: 50,
+      },
+      fieldName: 'name',
+      label: '科室名称',
+      rules: 'required',
+    },
+    {
+      component: 'Select',
+      componentProps: {
+        placeholder: '请选择父级科室（不选则为一级科室）',
+        options: [],
+        showSearch: true,
+        optionFilterProp: 'label',
+      },
+      defaultValue: 0,
+      fieldName: 'pid',
+      label: '父级科室',
+      rules: 'selectRequired',
+    },
+    {
+      component: 'VbenInput',
+      componentProps: {
+        placeholder: '拼音首拼（如：儿科=EK，可不填）',
+        maxlength: 50,
+      },
+      fieldName: 'pinyin_simple',
+      label: '拼音首拼',
+    },
+    {
+      component: 'RadioGroup',
+      componentProps: {
+        options: [
+          {
+            label: '否',
+            value: 0,
+          },
+          {
+            label: '是',
+            value: 1,
+          },
+        ],
+      },
+      defaultValue: 0,
+      fieldName: 'feature',
+      label: '特色专科',
+      rules: 'required',
+    },
+  ],
+};
diff --git a/apps/web-antd/src/views/system/department/config/search.ts b/apps/web-antd/src/views/system/department/config/search.ts
new file mode 100644
index 00000000..ee752fe3
--- /dev/null
+++ b/apps/web-antd/src/views/system/department/config/search.ts
@@ -0,0 +1,29 @@
+import type { VbenFormProps } from '#/adapter/form';
+
+/**
+ * 科室列表顶部搜索表单（按名称模糊搜索，后端会自动补齐父链保证树可渲染）
+ */
+export const formOptions: VbenFormProps = {
+  // 默认展开
+  collapsed: false,
+  schema: [
+    {
+      component: 'VbenInput',
+      componentProps: {
+        placeholder: '输入科室名称',
+      },
+      defaultValue: '',
+      fieldName: 'name',
+      label: '科室名称',
+    },
+  ],
+  // 控制表单是否显示折叠按钮
+  showCollapseButton: false,
+  submitButtonOptions: {
+    content: '查询',
+  },
+  // 是否在字段值改变时提交表单
+  submitOnChange: true,
+  // 按下回车时是否提交表单
+  submitOnEnter: false,
+};
diff --git a/apps/web-antd/src/views/system/department/config/table.ts b/apps/web-antd/src/views/system/department/config/table.ts
new file mode 100644
index 00000000..7d37a876
--- /dev/null
+++ b/apps/web-antd/src/views/system/department/config/table.ts
@@ -0,0 +1,93 @@
+import type { VxeGridProps } from '#/adapter/vxe-table';
+
+import { getDepartmentList } from '../api';
+
+interface RowType {
+  id: number;
+  name: string;
+  pinyin_simple: string;
+  pid: number;
+  level: number;
+  feature: number;
+  doctor_count: number;
+  created_at: string;
+  updated_at: string;
+}
+
+/**
+ * 科室树形表格配置
+ * 后端返回平铺数据（含 id/pid），treeConfig.transform 自动组树；
+ * 树形结构下分页会截断父子关系，故关闭分页、一次性全量展示（科室量级很小）
+ */
+export const gridOptions: VxeGridProps<RowType> = {
+  checkboxConfig: {
+    highlight: true,
+    labelField: '',
+  },
+  columnConfig: {
+    useKey: true,
+  },
+  rowConfig: {
+    useKey: true,
+  },
+  columns: [
+    { type: 'checkbox', width: 60 },
+    { field: 'name', align: 'left', title: '科室名称', treeNode: true, minWidth: 220 },
+    { field: 'pinyin_simple', title: '拼音首拼', width: 120 },
+    {
+      field: 'level',
+      title: '层级',
+      width: 100,
+      slots: { default: 'level' },
+    },
+    {
+      field: 'feature',
+      title: '特色专科',
+      width: 110,
+      slots: { default: 'feature' },
+    },
+    { field: 'doctor_count', title: '绑定医生数', width: 110 },
+    { field: 'created_at', title: '创建时间', width: 180 },
+    { field: 'updated_at', title: '更新时间', width: 180 },
+    {
+      type: 'html',
+      align: 'right',
+      title: '操作',
+      slots: { default: 'action' },
+      width: 240,
+    },
+  ],
+  treeConfig: {
+    parentField: 'pid',
+    rowField: 'id',
+    transform: true,
+    expandAll: true,
+  },
+  keepSource: true,
+  pagerConfig: {
+    enabled: false,
+  },
+  proxyConfig: {
+    ajax: {
+      // 树形全量加载，不传分页参数
+      query: async (_params, formValues) => {
+        return await getDepartmentList({ ...formValues });
+      },
+    },
+  },
+  height: 'auto',
+  border: false,
+  toolbarConfig: {
+    // 是否显示搜索表单控制按钮
+    // @ts-ignore 正式环境时有完整的类型声明
+    search: true,
+    refresh: true, // 刷新
+    print: false, // 打印
+    export: false, // 导出
+    zoom: true, // 最大化最小化
+    slots: {
+      buttons: 'toolbar-actions',
+    },
+  },
+  showOverflow: false,
+};
diff --git a/apps/web-antd/src/views/system/department/index.vue b/apps/web-antd/src/views/system/department/index.vue
new file mode 100644
index 00000000..680cb4c4
--- /dev/null
+++ b/apps/web-antd/src/views/system/department/index.vue
@@ -0,0 +1,150 @@
+<script lang="ts" setup>
+// 科室字典管理（yii_department，老库表不迁库，管理入口收敛到新后台）
+// 树形展示一级/二级科室，支持新增、编辑、添加子科室、删除（后端校验医生绑定）
+import type { VxeGridListeners } from '#/adapter/vxe-table';
+
+import { ref } from 'vue';
+
+import { Page, useVbenModal } from '@vben/common-ui';
+
+import { message, Tag } from 'ant-design-vue';
+
+import { useVbenVxeGrid } from '#/adapter/vxe-table';
+import { TableAction } from '#/components/table-action';
+
+import { deleteDepartment } from './api';
+import FormModalDemo from './components/modal.vue';
+import { formOptions } from './config/search';
+import { gridOptions } from './config/table';
+
+defineOptions({ name: 'SystemDepartment' });
+
+const hasTopTableDropDownActions = ref(false);
+
+const gridEvents: VxeGridListeners<any> = {
+  checkboxChange() {
+    // eslint-disable-next-line no-use-before-define
+    const records = gridApi.grid.getCheckboxRecords();
+    hasTopTableDropDownActions.value = records.length > 0;
+  },
+  checkboxAll() {
+    // eslint-disable-next-line no-use-before-define
+    const records = gridApi.grid.getCheckboxRecords();
+    hasTopTableDropDownActions.value = records.length > 0;
+  },
+};
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  formOptions,
+  gridOptions,
+  gridEvents,
+});
+
+const [FormModal, formModalApi] = useVbenModal({
+  connectedComponent: FormModalDemo,
+});
+
+/**
+ * 打开新增/编辑弹窗
+ * 「添加子科室」复用新增弹窗：只预填 pid，其余字段留空
+ */
+const showModal = (data: Record<string, any> = {}, isUpdate = false) => {
+  formModalApi.setData({
+    values: data,
+    update: isUpdate,
+    gridApi,
+  });
+  formModalApi.open();
+};
+
+/**
+ * 删除科室（单个或勾选批量）
+ * 物理删除，后端会拦截「有子科室 / 有医生绑定」的情况
+ */
+const deleteApi = (row: any) => {
+  let ids = [];
+  if (row) {
+    ids.push(row.id);
+  } else {
+    ids = gridApi.grid.getCheckboxRecords().map((item) => item.id);
+  }
+  deleteDepartment({ ids }).then(() => {
+    message.success('删除成功!');
+    gridApi.query();
+  });
+};
+</script>
+
+<template>
+  <Page auto-content-height title="科室管理">
+    <FormModal />
+    <Grid>
+      <template #toolbar-actions>
+        <TableAction
+          :actions="[
+            {
+              label: '新增科室',
+              type: 'primary',
+              icon: 'ant-design:plus-outlined',
+              onClick: showModal.bind(null, {}, false),
+            },
+          ]"
+          :drop-down-actions="[
+            {
+              label: '批量删除',
+              icon: 'ant-design:delete-outlined',
+              ifShow: hasTopTableDropDownActions,
+              popConfirm: {
+                title: '确定删除选中的科室吗？',
+                confirm: deleteApi.bind(null, false),
+              },
+            },
+          ]"
+        />
+      </template>
+      <template #level="{ row }">
+        <Tag :color="row.level === 1 ? 'blue' : 'cyan'">
+          {{ row.level === 1 ? '一级科室' : '二级科室' }}
+        </Tag>
+      </template>
+      <template #feature="{ row }">
+        <Tag :color="row.feature === 1 ? 'gold' : 'default'">
+          {{ row.feature === 1 ? '特色专科' : '普通' }}
+        </Tag>
+      </template>
+      <template #action="{ row }">
+        <TableAction
+          :actions="[
+            {
+              label: '编辑',
+              type: 'link',
+              icon: 'uil:edit',
+              size: 'small',
+              onClick: showModal.bind(null, row, true),
+            },
+            {
+              label: '添加子科室',
+              type: 'link',
+              icon: 'ant-design:apartment-outlined',
+              size: 'small',
+              ifShow: row.level === 1,
+              onClick: showModal.bind(null, { pid: row.id }, false),
+            },
+          ]"
+          :drop-down-actions="[
+            {
+              label: '删除',
+              type: 'link',
+              icon: 'ant-design:delete-outlined',
+              size: 'small',
+              popConfirm: {
+                title: '确定删除该科室吗？',
+                confirm: deleteApi.bind(null, row),
+              },
+            },
+          ]"
+        />
+      </template>
+    </Grid>
+  </Page>
+</template>
diff --git a/apps/web-antd/src/views/system/dict/disease/index.vue b/apps/web-antd/src/views/system/dict/disease/index.vue
index b1967020..29196731 100644
--- a/apps/web-antd/src/views/system/dict/disease/index.vue
+++ b/apps/web-antd/src/views/system/dict/disease/index.vue
@@ -71,7 +71,7 @@ const gridOptions = {
   toolbarConfig: {
     search: true,
     refresh: true,
-    slots: { buttons: 'toolbar-buttons' },
+    slots: { buttons: 'toolbar-actions' },
   },
 };
 
@@ -221,7 +221,7 @@ function handleSyncPinyin() {
       <Form />
     </FormModal>
     <Grid>
-      <template #toolbar-buttons>
+      <template #toolbar-actions>
         <TableAction
           :actions="[
             {
diff --git a/apps/web-antd/src/views/system/dict/doctor-order/index.vue b/apps/web-antd/src/views/system/dict/doctor-order/index.vue
index a71244a7..ed8792f6 100644
--- a/apps/web-antd/src/views/system/dict/doctor-order/index.vue
+++ b/apps/web-antd/src/views/system/dict/doctor-order/index.vue
@@ -68,7 +68,7 @@ const gridOptions = {
   toolbarConfig: {
     search: true,
     refresh: true,
-    slots: { buttons: 'toolbar-buttons' },
+    slots: { buttons: 'toolbar-actions' },
   },
 };
 
@@ -187,7 +187,7 @@ function handleSyncPinyin() {
       <Form />
     </FormModal>
     <Grid>
-      <template #toolbar-buttons>
+      <template #toolbar-actions>
         <TableAction
           :actions="[
             {
diff --git a/apps/web-antd/src/views/system/dict/tcm/components/TcmDictListPage.vue b/apps/web-antd/src/views/system/dict/tcm/components/TcmDictListPage.vue
index 7ec8745d..bb6ddcb5 100644
--- a/apps/web-antd/src/views/system/dict/tcm/components/TcmDictListPage.vue
+++ b/apps/web-antd/src/views/system/dict/tcm/components/TcmDictListPage.vue
@@ -78,7 +78,7 @@ const gridOptions = computed(() => ({
   toolbarConfig: {
     search: true,
     refresh: true,
-    slots: { buttons: 'toolbar-buttons' },
+    slots: { buttons: 'toolbar-actions' },
   },
 }));
 
@@ -227,7 +227,7 @@ function handleSyncPinyin() {
       <Form />
     </FormModal>
     <Grid>
-      <template #toolbar-buttons>
+      <template #toolbar-actions>
         <TableAction
           :actions="[
             {
diff --git a/apps/web-antd/src/views/system/dict/west-unit/index.vue b/apps/web-antd/src/views/system/dict/west-unit/index.vue
index f0c1aaf3..c0daa86b 100644
--- a/apps/web-antd/src/views/system/dict/west-unit/index.vue
+++ b/apps/web-antd/src/views/system/dict/west-unit/index.vue
@@ -65,7 +65,7 @@ const gridOptions = {
   toolbarConfig: {
     search: true,
     refresh: true,
-    slots: { buttons: 'toolbar-buttons' },
+    slots: { buttons: 'toolbar-actions' },
   },
 };
 
@@ -164,7 +164,7 @@ async function handleDelete(ids: number[]) {
       <Form />
     </FormModal>
     <Grid>
-      <template #toolbar-buttons>
+      <template #toolbar-actions>
         <TableAction
           :actions="[
             {
diff --git a/apps/web-antd/src/views/system/doctor-input/components/AuditModal.vue b/apps/web-antd/src/views/system/doctor-input/components/AuditModal.vue
index d4071d09..d729538e 100644
--- a/apps/web-antd/src/views/system/doctor-input/components/AuditModal.vue
+++ b/apps/web-antd/src/views/system/doctor-input/components/AuditModal.vue
@@ -1,38 +1,93 @@
 <script lang="ts" setup>
-import { ref } from 'vue';
+/**
+ * 医生预填审核弹窗（列表页）
+ * 打开时按 ID 拉取详情，避免只显示通过/拒绝而看不到预填资料
+ */
+import { computed, ref } from 'vue';
 
 import { useVbenModal } from '@vben/common-ui';
 
-import { message, Radio, RadioGroup, Textarea } from 'ant-design-vue';
+import {
+  Avatar,
+  Descriptions,
+  DescriptionsItem,
+  Image,
+  Radio,
+  RadioGroup,
+  Spin,
+  Textarea,
+  message,
+} from 'ant-design-vue';
 
-import { auditDoctorInput } from '../api';
+import SensitiveText from '#/components/sensitive-text/SensitiveText.vue';
+
+import { auditDoctorInput, getDoctorInputDetail } from '../api';
+import {
+  inputUserDisplayName,
+  normalizeInputUser,
+  resolveAvatarUrl,
+} from '../../store-input/utils/inputUser';
 
 const auditStatus = ref<number>(1);
 const auditRemark = ref<string>('');
 const currentRow = ref<any>(null);
+const detail = ref<Record<string, any> | null>(null);
 const gridApi = ref<any>(null);
 const loading = ref(false);
+const detailLoading = ref(false);
+
+const display = computed(() => detail.value || currentRow.value || null);
+
+function typeText(type: number) {
+  if (type === 1) return '中医医生';
+  if (type === 2) return '西医医生';
+  return '-';
+}
+
+function signTypeText(signType: number) {
+  if (signType === 1) return '电子签名';
+  if (signType === 2) return '手写签名';
+  return '-';
+}
+
+function imgSrc(url?: string | null) {
+  return resolveAvatarUrl(url) || String(url || '');
+}
+
+async function loadDetail(id: number) {
+  detailLoading.value = true;
+  detail.value = null;
+  try {
+    const res = await getDoctorInputDetail(id);
+    detail.value = res || null;
+    normalizeInputUser(detail.value);
+  } catch {
+    message.error('加载预填详情失败');
+  } finally {
+    detailLoading.value = false;
+  }
+}
 
 /**
  * 提交医生预填审核结果
- * 通过 onConfirm 注册，与 Vben Modal 确认按钮对接
  */
 const handleAudit = async () => {
-  if (!currentRow.value) {
+  const id = Number(display.value?.id || currentRow.value?.id || 0);
+  if (!id) {
     message.error('数据错误');
     return;
   }
-
   loading.value = true;
   modalApi.setState({ confirmLoading: true });
   try {
     await auditDoctorInput({
-      id: currentRow.value.id,
+      id,
       status: auditStatus.value,
       audit_remark: auditRemark.value,
     });
     message.success('审核成功');
-    gridApi.value?.reload();
+    gridApi.value?.reload?.();
+    gridApi.value?.query?.();
     modalApi.close();
     auditStatus.value = 1;
     auditRemark.value = '';
@@ -52,13 +107,20 @@ const [ModalComponent, modalApi] = useVbenModal({
     modalApi.close();
   },
   onConfirm: handleAudit,
-  onOpenChange(isOpen: boolean) {
-    if (isOpen) {
-      const { values, gridApi: api } = modalApi.getData<Record<string, any>>();
-      currentRow.value = values;
-      gridApi.value = api;
-      auditStatus.value = 1;
-      auditRemark.value = '';
+  async onOpenChange(isOpen: boolean) {
+    if (!isOpen) {
+      detail.value = null;
+      currentRow.value = null;
+      return;
+    }
+    const { values, gridApi: api } = modalApi.getData<Record<string, any>>() || {};
+    currentRow.value = values;
+    gridApi.value = api;
+    auditStatus.value = 1;
+    auditRemark.value = '';
+    const id = Number(values?.id || 0);
+    if (id > 0) {
+      await loadDetail(id);
     }
   },
 });
@@ -67,25 +129,121 @@ const [ModalComponent, modalApi] = useVbenModal({
 <template>
   <ModalComponent
     title="审核医生预填"
-    class="w-[500px]"
+    class="w-[820px] max-w-[96vw]"
     :confirm-loading="loading"
   >
-    <div class="space-y-4 p-4">
-      <div>
-        <div class="mb-2 font-semibold">审核结果：</div>
-        <RadioGroup v-model:value="auditStatus">
-          <Radio :value="1">审核通过</Radio>
-          <Radio :value="2">审核拒绝</Radio>
-        </RadioGroup>
+    <Spin :spinning="detailLoading">
+      <div v-if="display" class="space-y-4 p-2">
+        <Descriptions
+          :column="{ xxl: 2, xl: 2, lg: 2, md: 1, sm: 1, xs: 1 }"
+          bordered
+          size="small"
+        >
+          <DescriptionsItem label="预填 ID">#{{ display.id }}</DescriptionsItem>
+          <DescriptionsItem label="医生姓名">{{ display.name || '-' }}</DescriptionsItem>
+          <DescriptionsItem label="手机号">
+            <SensitiveText :record="display" field="mobile" />
+          </DescriptionsItem>
+          <DescriptionsItem label="身份证">
+            <SensitiveText :record="display" field="idcard" />
+          </DescriptionsItem>
+          <DescriptionsItem label="身份">{{ typeText(Number(display.type)) }}</DescriptionsItem>
+          <DescriptionsItem label="签名类型">
+            {{ signTypeText(Number(display.sign_type)) }}
+          </DescriptionsItem>
+          <DescriptionsItem label="科室">{{ display.depart?.name || '-' }}</DescriptionsItem>
+          <DescriptionsItem label="职称">{{ display.titleInfo?.name || '-' }}</DescriptionsItem>
+          <DescriptionsItem label="录入人">
+            <div class="flex items-center gap-2">
+              <Avatar
+                v-if="resolveAvatarUrl(display.inputUser?.avatar)"
+                :src="resolveAvatarUrl(display.inputUser?.avatar)"
+                :size="28"
+              />
+              <span>{{ inputUserDisplayName(display.inputUser) }}</span>
+            </div>
+          </DescriptionsItem>
+          <DescriptionsItem label="擅长" :span="2">{{ display.good_at || '-' }}</DescriptionsItem>
+          <DescriptionsItem label="简介" :span="2">{{ display.intro || '-' }}</DescriptionsItem>
+        </Descriptions>
+
+        <div class="flex flex-wrap gap-3">
+          <div v-if="display.avatar" class="cert">
+            <div class="cert-label">头像</div>
+            <Image :src="imgSrc(display.avatar)" :width="80" :height="80" :preview="true" />
+          </div>
+          <div v-if="display.qualification" class="cert">
+            <div class="cert-label">资格证书</div>
+            <Image
+              :src="imgSrc(display.qualification)"
+              :width="80"
+              :height="80"
+              :preview="true"
+            />
+          </div>
+          <div v-if="display.practicing" class="cert">
+            <div class="cert-label">执业证书</div>
+            <Image
+              :src="imgSrc(display.practicing)"
+              :width="80"
+              :height="80"
+              :preview="true"
+            />
+          </div>
+          <div v-if="display.title" class="cert">
+            <div class="cert-label">职称证书</div>
+            <Image :src="imgSrc(display.title)" :width="80" :height="80" :preview="true" />
+          </div>
+          <div v-if="display.card_up" class="cert">
+            <div class="cert-label">身份证正面</div>
+            <Image :src="imgSrc(display.card_up)" :width="80" :height="80" :preview="true" />
+          </div>
+          <div v-if="display.card_down" class="cert">
+            <div class="cert-label">身份证反面</div>
+            <Image :src="imgSrc(display.card_down)" :width="80" :height="80" :preview="true" />
+          </div>
+          <div v-if="display.sign_image" class="cert">
+            <div class="cert-label">签名</div>
+            <Image :src="imgSrc(display.sign_image)" :width="80" :height="80" :preview="true" />
+          </div>
+        </div>
+
+        <div>
+          <div class="mb-2 font-semibold">审核结果：</div>
+          <RadioGroup v-model:value="auditStatus">
+            <Radio :value="1">审核通过</Radio>
+            <Radio :value="2">审核拒绝</Radio>
+          </RadioGroup>
+        </div>
+        <div>
+          <div class="mb-2 font-semibold">审核备注：</div>
+          <Textarea
+            v-model:value="auditRemark"
+            :rows="4"
+            placeholder="请输入审核备注（可选）"
+          />
+        </div>
       </div>
-      <div>
-        <div class="mb-2 font-semibold">审核备注：</div>
-        <Textarea
-          v-model:value="auditRemark"
-          :rows="4"
-          placeholder="请输入审核备注（可选）"
-        />
+      <div v-else-if="!detailLoading" class="p-8 text-center text-muted-foreground">
+        暂无预填数据
       </div>
-    </div>
+    </Spin>
   </ModalComponent>
 </template>
+
+<style scoped>
+.cert {
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+  padding: 8px;
+  border-radius: 10px;
+  border: 1px solid hsl(var(--border));
+  background: hsl(var(--card, var(--background)));
+}
+
+.cert-label {
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+}
+</style>
diff --git a/apps/web-antd/src/views/system/doctor-input/config/form.ts b/apps/web-antd/src/views/system/doctor-input/config/form.ts
index 70c007de..1130f466 100644
--- a/apps/web-antd/src/views/system/doctor-input/config/form.ts
+++ b/apps/web-antd/src/views/system/doctor-input/config/form.ts
@@ -96,7 +96,8 @@ export const modalFormProps: VbenFormProps = {
       fieldName: 'mobile',
       formItemClass: 'col-span-6',
       label: '手机号码',
-      rules: 'required',
+      // 与后端 checkPhone 一致：必填 + 大陆 11 位号段
+      rules: 'mobile',
     },
     {
       component: 'VbenInput',
diff --git a/apps/web-antd/src/views/system/doctor-input/config/table.ts b/apps/web-antd/src/views/system/doctor-input/config/table.ts
index 7c097330..de9bfe8f 100644
--- a/apps/web-antd/src/views/system/doctor-input/config/table.ts
+++ b/apps/web-antd/src/views/system/doctor-input/config/table.ts
@@ -89,7 +89,7 @@ export const inputGridOptions: VxeGridProps<RowType> = {
     export: false,
     zoom: true,
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
   },
   showOverflow: false,
diff --git a/apps/web-antd/src/views/system/doctor-input/index.vue b/apps/web-antd/src/views/system/doctor-input/index.vue
index 998e03ee..6978c4e8 100644
--- a/apps/web-antd/src/views/system/doctor-input/index.vue
+++ b/apps/web-antd/src/views/system/doctor-input/index.vue
@@ -88,7 +88,7 @@ const getStatusText = (status: number) => {
     <FormModal />
     <DetailModalComponent />
     <Grid>
-      <template #toolbar-buttons>
+      <template #toolbar-actions>
         <TableAction
           :actions="[
             {
diff --git a/apps/web-antd/src/views/system/golden-formula/index.vue b/apps/web-antd/src/views/system/golden-formula/index.vue
index d1c88e7d..48abeb68 100644
--- a/apps/web-antd/src/views/system/golden-formula/index.vue
+++ b/apps/web-antd/src/views/system/golden-formula/index.vue
@@ -115,7 +115,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
     toolbarConfig: {
       search: true,
       refresh: true,
-      slots: { buttons: 'toolbar-buttons' },
+      slots: { buttons: 'toolbar-actions' },
     },
   },
   gridEvents: {
@@ -270,7 +270,7 @@ async function handleConfirmImport(payload: { rows: any[]; sourceId: number }) {
     <FormulaDrugsModalComp />
     <MissingDrugModalComp />
     <Grid>
-      <template #toolbar-buttons>
+      <template #toolbar-actions>
         <TableAction
           :flex="false"
           :actions="[
diff --git a/apps/web-antd/src/views/system/home-zones/config/table.ts b/apps/web-antd/src/views/system/home-zones/config/table.ts
index 9c08b4e4..1342be02 100644
--- a/apps/web-antd/src/views/system/home-zones/config/table.ts
+++ b/apps/web-antd/src/views/system/home-zones/config/table.ts
@@ -104,7 +104,7 @@ export const gridOptions: VxeGridProps<RowType> = {
     export: false,
     zoom: true,
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
     custom: {
       icon: 'vxe-icon-menu',
diff --git a/apps/web-antd/src/views/system/home-zones/index.vue b/apps/web-antd/src/views/system/home-zones/index.vue
index 4be1bdae..007e4487 100644
--- a/apps/web-antd/src/views/system/home-zones/index.vue
+++ b/apps/web-antd/src/views/system/home-zones/index.vue
@@ -112,7 +112,7 @@ const deleteZonesApi = (row: any) => {
           />
         </template>
 
-        <template #toolbar-buttons>
+        <template #toolbar-actions>
           <Button
             v-if="hasTopTableDropDownActions"
             danger
diff --git a/apps/web-antd/src/views/system/menu/config/table.ts b/apps/web-antd/src/views/system/menu/config/table.ts
index f4f2338a..c4c641dd 100644
--- a/apps/web-antd/src/views/system/menu/config/table.ts
+++ b/apps/web-antd/src/views/system/menu/config/table.ts
@@ -86,7 +86,7 @@ export const gridOptions: VxeGridProps<RowType> = {
     // custom: true, // 自定义列
     zoom: true, // 最大化最小化
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
     custom: {
       // 自定义列-图标
diff --git a/apps/web-antd/src/views/system/menu/index.vue b/apps/web-antd/src/views/system/menu/index.vue
index 5e98b54f..be1bf78f 100644
--- a/apps/web-antd/src/views/system/menu/index.vue
+++ b/apps/web-antd/src/views/system/menu/index.vue
@@ -78,7 +78,7 @@ const collapseAll = () => {
   <Page auto-content-height title="菜单管理">
     <FormModal />
     <Grid>
-      <template #toolbar-buttons>
+      <template #toolbar-actions>
         <TableAction
           :actions="[
             {
diff --git a/apps/web-antd/src/views/system/notice/config/table.ts b/apps/web-antd/src/views/system/notice/config/table.ts
index 78dcfd70..90d47687 100644
--- a/apps/web-antd/src/views/system/notice/config/table.ts
+++ b/apps/web-antd/src/views/system/notice/config/table.ts
@@ -73,7 +73,7 @@ export const gridOptions: VxeGridProps<RowType> = {
     // custom: true, // 自定义列
     zoom: true, // 最大化最小化
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
     custom: {
       // 自定义列-图标
diff --git a/apps/web-antd/src/views/system/notice/index.vue b/apps/web-antd/src/views/system/notice/index.vue
index 9497060a..ab81475d 100644
--- a/apps/web-antd/src/views/system/notice/index.vue
+++ b/apps/web-antd/src/views/system/notice/index.vue
@@ -69,7 +69,7 @@ const deleteApi = (row: any) => {
   <Page auto-content-height title="公告管理">
     <FormModal />
     <Grid>
-      <template #toolbar-buttons>
+      <template #toolbar-actions>
         <TableAction
           :actions="[
             {
diff --git a/apps/web-antd/src/views/system/oa-chat/config/table.ts b/apps/web-antd/src/views/system/oa-chat/config/table.ts
index 2aacfb93..4b3d60ce 100644
--- a/apps/web-antd/src/views/system/oa-chat/config/table.ts
+++ b/apps/web-antd/src/views/system/oa-chat/config/table.ts
@@ -86,7 +86,7 @@ export const gridOptions: VxeGridProps<RowType> = {
     export: false,
     zoom: true,
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
     custom: {
       icon: 'vxe-icon-menu',
diff --git a/apps/web-antd/src/views/system/oa-chat/index.vue b/apps/web-antd/src/views/system/oa-chat/index.vue
index 2b838e3a..0689b5e3 100644
--- a/apps/web-antd/src/views/system/oa-chat/index.vue
+++ b/apps/web-antd/src/views/system/oa-chat/index.vue
@@ -147,7 +147,7 @@ onMounted(() => {
       </Tabs.TabPane>
       <Tabs.TabPane key="chat" tab="群聊">
         <Grid v-if="activeKey === 'chat'">
-          <template #toolbar-buttons>
+          <template #toolbar-actions>
             <TableAction
               :actions="[
                 {
diff --git a/apps/web-antd/src/views/system/oa-notify-log/config/table.ts b/apps/web-antd/src/views/system/oa-notify-log/config/table.ts
index 2f3b2961..862a1964 100644
--- a/apps/web-antd/src/views/system/oa-notify-log/config/table.ts
+++ b/apps/web-antd/src/views/system/oa-notify-log/config/table.ts
@@ -68,7 +68,7 @@ export const gridOptions: VxeGridProps<RowType> = {
     export: false,
     zoom: true,
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
     custom: {
       icon: 'vxe-icon-menu',
diff --git a/apps/web-antd/src/views/system/oa-notify-log/index.vue b/apps/web-antd/src/views/system/oa-notify-log/index.vue
index a99b02a4..7aa0d33f 100644
--- a/apps/web-antd/src/views/system/oa-notify-log/index.vue
+++ b/apps/web-antd/src/views/system/oa-notify-log/index.vue
@@ -89,7 +89,7 @@ function formatPayload(raw: any): string {
 <template>
   <Page auto-content-height title="OA 通知发送日志">
     <Grid>
-      <template #toolbar-buttons>
+      <template #toolbar-actions>
         <span class="text-xs text-gray-400">
           日志为只读，记录每次 OA 通知发送的请求和响应（含成功和失败）
         </span>
diff --git a/apps/web-antd/src/views/system/oa-robot/config/table.ts b/apps/web-antd/src/views/system/oa-robot/config/table.ts
index b905b92e..bb7d5eb4 100644
--- a/apps/web-antd/src/views/system/oa-robot/config/table.ts
+++ b/apps/web-antd/src/views/system/oa-robot/config/table.ts
@@ -66,7 +66,7 @@ export const gridOptions: VxeGridProps<RowType> = {
     export: false,
     zoom: true,
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
     custom: {
       icon: 'vxe-icon-menu',
diff --git a/apps/web-antd/src/views/system/oa-robot/index.vue b/apps/web-antd/src/views/system/oa-robot/index.vue
index a899ce17..ce749406 100644
--- a/apps/web-antd/src/views/system/oa-robot/index.vue
+++ b/apps/web-antd/src/views/system/oa-robot/index.vue
@@ -201,7 +201,7 @@ loadPlatforms();
     <AppCredentialEditModal />
     <ChatBindEditModal />
     <Grid>
-      <template #toolbar-buttons>
+      <template #toolbar-actions>
         <TableAction
           :actions="[
             {
diff --git a/apps/web-antd/src/views/system/oa-scene/config/table.ts b/apps/web-antd/src/views/system/oa-scene/config/table.ts
index 3e5fd73d..1146574d 100644
--- a/apps/web-antd/src/views/system/oa-scene/config/table.ts
+++ b/apps/web-antd/src/views/system/oa-scene/config/table.ts
@@ -93,7 +93,7 @@ export const gridOptions: VxeGridProps<RowType> = {
     export: false,
     zoom: true,
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
     custom: {
       icon: 'vxe-icon-menu',
diff --git a/apps/web-antd/src/views/system/oa-scene/index.vue b/apps/web-antd/src/views/system/oa-scene/index.vue
index c364448d..b0bc9269 100644
--- a/apps/web-antd/src/views/system/oa-scene/index.vue
+++ b/apps/web-antd/src/views/system/oa-scene/index.vue
@@ -135,7 +135,7 @@ const deleteApi = (row: any) => {
     <div v-show="!showForm">
       <Page auto-content-height title="OA 通知场景管理">
         <Grid>
-          <template #toolbar-buttons>
+          <template #toolbar-actions>
             <TableAction
               :actions="[
                 {
diff --git a/apps/web-antd/src/views/system/pharmacy/config/form.ts b/apps/web-antd/src/views/system/pharmacy/config/form.ts
index 387cb9b6..cca97221 100644
--- a/apps/web-antd/src/views/system/pharmacy/config/form.ts
+++ b/apps/web-antd/src/views/system/pharmacy/config/form.ts
@@ -152,7 +152,8 @@ export const modalFormProps: VbenFormProps = {
       },
       fieldName: 'mobile',
       label: '联系人手机号',
-      rules: 'required',
+      // 与后端 checkPhone 一致：必填 + 大陆 11 位号段
+      rules: 'mobile',
     },
     {
       // 编辑时可选：同步修改药店管理员后台登录手机号
diff --git a/apps/web-antd/src/views/system/pharmacy/config/table.ts b/apps/web-antd/src/views/system/pharmacy/config/table.ts
index e5c02953..c2595e0e 100644
--- a/apps/web-antd/src/views/system/pharmacy/config/table.ts
+++ b/apps/web-antd/src/views/system/pharmacy/config/table.ts
@@ -107,7 +107,7 @@ export const gridOptions: VxeGridProps<RowType> = {
     export: false,
     zoom: true,
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
     custom: {
       icon: 'vxe-icon-menu',
diff --git a/apps/web-antd/src/views/system/pharmacy/index.vue b/apps/web-antd/src/views/system/pharmacy/index.vue
index f7ce2fb5..40151f0b 100644
--- a/apps/web-antd/src/views/system/pharmacy/index.vue
+++ b/apps/web-antd/src/views/system/pharmacy/index.vue
@@ -423,7 +423,7 @@ const batchSyncDrugPrice = () => {
     <BindPrescriptionTypesModalComponent />
     <StoreExternalFieldModalComponent />
     <Grid>
-      <template #toolbar-buttons>
+      <template #toolbar-actions>
         <TableAction
           :actions="[
             {
diff --git a/apps/web-antd/src/views/system/platform-info/config/qualifications-table.ts b/apps/web-antd/src/views/system/platform-info/config/qualifications-table.ts
index dfd7dc2a..aa06ae7d 100644
--- a/apps/web-antd/src/views/system/platform-info/config/qualifications-table.ts
+++ b/apps/web-antd/src/views/system/platform-info/config/qualifications-table.ts
@@ -116,7 +116,7 @@ export const gridOptions: VxeGridProps<RowType> = {
     // custom: true, // 自定义列
     zoom: true, // 最大化最小化
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
     custom: {
       // 自定义列-图标
diff --git a/apps/web-antd/src/views/system/platform-info/index.vue b/apps/web-antd/src/views/system/platform-info/index.vue
index 0e4f5ce6..fac040ae 100644
--- a/apps/web-antd/src/views/system/platform-info/index.vue
+++ b/apps/web-antd/src/views/system/platform-info/index.vue
@@ -111,7 +111,7 @@ const deleteQualificationsApi = (row: any) => {
       <!-- Tab 2: 平台资质管理 -->
       <TabPane key="qualifications" tab="平台资质管理">
         <QualificationsGrid>
-          <template #toolbar-buttons>
+          <template #toolbar-actions>
             <TableAction
               :actions="[
                 {
diff --git a/apps/web-antd/src/views/system/platform-qualifications/config/table.ts b/apps/web-antd/src/views/system/platform-qualifications/config/table.ts
index 37456b08..07c8a84b 100644
--- a/apps/web-antd/src/views/system/platform-qualifications/config/table.ts
+++ b/apps/web-antd/src/views/system/platform-qualifications/config/table.ts
@@ -81,7 +81,7 @@ export const gridOptions: VxeGridProps<RowType> = {
     // custom: true, // 自定义列
     zoom: true, // 最大化最小化
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
     custom: {
       // 自定义列-图标
diff --git a/apps/web-antd/src/views/system/platform-qualifications/index.vue b/apps/web-antd/src/views/system/platform-qualifications/index.vue
index 4a58a820..f9afadfc 100644
--- a/apps/web-antd/src/views/system/platform-qualifications/index.vue
+++ b/apps/web-antd/src/views/system/platform-qualifications/index.vue
@@ -68,7 +68,7 @@ const deleteApi = (row: any) => {
   <Page auto-content-height title="平台资质管理">
     <FormModal />
     <Grid>
-      <template #toolbar-buttons>
+      <template #toolbar-actions>
         <TableAction
           :actions="[
             // {
diff --git a/apps/web-antd/src/views/system/platform/config/table.ts b/apps/web-antd/src/views/system/platform/config/table.ts
index f64133a3..505ccef0 100644
--- a/apps/web-antd/src/views/system/platform/config/table.ts
+++ b/apps/web-antd/src/views/system/platform/config/table.ts
@@ -62,7 +62,7 @@ export const gridOptions: VxeGridProps<RowType> = {
     // custom: true, // 自定义列
     zoom: true, // 最大化最小化
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
     custom: {
       // 自定义列-图标
diff --git a/apps/web-antd/src/views/system/platform/index.vue b/apps/web-antd/src/views/system/platform/index.vue
index 7a940a0f..dc912bcb 100644
--- a/apps/web-antd/src/views/system/platform/index.vue
+++ b/apps/web-antd/src/views/system/platform/index.vue
@@ -68,7 +68,7 @@ const deleteApi = (row: any) => {
   <Page auto-content-height title="平台管理">
     <FormModal />
     <Grid>
-      <template #toolbar-buttons>
+      <template #toolbar-actions>
         <TableAction
           :actions="[
             {
diff --git a/apps/web-antd/src/views/system/process/components/inline-field-editor.vue b/apps/web-antd/src/views/system/process/components/inline-field-editor.vue
index b95243e5..c8199757 100644
--- a/apps/web-antd/src/views/system/process/components/inline-field-editor.vue
+++ b/apps/web-antd/src/views/system/process/components/inline-field-editor.vue
@@ -1,182 +1,182 @@
-<script lang="ts" setup>

-import { ref, watch } from 'vue';

-

-import { Button, Input, InputNumber, Popover, Tag } from 'ant-design-vue';

-

-type TagOption = { label: string; value: number | string };

-

-const props = withDefaults(

-  defineProps<{

-    disabled?: boolean;

-    displayFormatter?: (value: unknown) => string;

-    label?: string;

-    options?: TagOption[];

-    placeholder?: string;

-    type?: 'number' | 'tags' | 'text';

-    value?: null | number | string;

-  }>(),

-  {

-    disabled: false,

-    label: '',

-    options: () => [],

-    placeholder: '请输入',

-    type: 'text',

-    value: '',

-  },

-);

-

-const emit = defineEmits<{

-  save: [value: number | string];

-}>();

-

-const open = ref(false);

-const draftText = ref('');

-const draftNumber = ref<null | number>(null);

-const saving = ref(false);

-

-watch(open, (visible) => {

-  if (!visible) {

-    return;

-  }

-  if (props.type === 'number') {

-    const raw = props.value;

-    draftNumber.value =

-      raw !== null && raw !== undefined && raw !== '' ? Number(raw) : null;

-    return;

-  }

-  draftText.value = String(props.value ?? '');

-});

-

-function displayText() {

-  if (props.displayFormatter) {

-    return props.displayFormatter(props.value);

-  }

-  if (props.value === null || props.value === undefined || props.value === '') {

-    return '点击设置';

-  }

-  if (props.type === 'tags') {

-    const matched = props.options.find(

-      (item) => String(item.value) === String(props.value),

-    );

-    return matched?.label ?? String(props.value);

-  }

-  return String(props.value);

-}

-

-function isEmptyValue() {

-  return props.value === null || props.value === undefined || props.value === '';

-}

-

-async function confirmSave() {

-  saving.value = true;

-  try {

-    if (props.type === 'number') {

-      if (draftNumber.value === null || draftNumber.value === undefined) {

-        return;

-      }

-      emit('save', draftNumber.value);

-    } else {

-      const text = draftText.value.trim();

-      if (!text) {

-        return;

-      }

-      emit('save', text);

-    }

-    open.value = false;

-  } finally {

-    saving.value = false;

-  }

-}

-

-function selectTag(value: number | string) {

-  emit('save', value);

-  open.value = false;

-}

-</script>

-

-<template>

-  <Popover v-model:open="open" trigger="click" placement="bottomLeft">

-    <template #content>

-      <div class="inline-editor-popover min-w-[220px]">

-        <div v-if="label" class="mb-2 text-xs text-muted-foreground">{{ label }}</div>

-        <template v-if="type === 'tags'">

-          <div class="inline-editor-popover__tags">

-            <Tag

-              v-for="opt in options"

-              :key="String(opt.value)"

-              class="cursor-pointer transition-colors duration-200"

-              :color="String(value) === String(opt.value) ? 'processing' : 'default'"

-              @click="selectTag(opt.value)"

-            >

-              {{ opt.label }}

-            </Tag>

-          </div>

-        </template>

-        <template v-else-if="type === 'number'">

-          <InputNumber

-            v-model:value="draftNumber"

-            class="w-full"

-            :min="0"

-            :placeholder="placeholder"

-          />

-          <div class="inline-editor-popover__actions">

-            <Button size="small" @click="open = false">取消</Button>

-            <Button

-              size="small"

-              type="primary"

-              :loading="saving"

-              @click="confirmSave"

-            >

-              保存

-            </Button>

-          </div>

-        </template>

-        <template v-else>

-          <Input

-            v-model:value="draftText"

-            :placeholder="placeholder"

-            @press-enter="confirmSave"

-          />

-          <div class="inline-editor-popover__actions">

-            <Button size="small" @click="open = false">取消</Button>

-            <Button

-              size="small"

-              type="primary"

-              :loading="saving"

-              @click="confirmSave"

-            >

-              保存

-            </Button>

-          </div>

-        </template>

-      </div>

-    </template>

-    <button

-      type="button"

-      class="inline-edit-trigger cursor-pointer border-b border-dashed border-transparent text-left transition-colors duration-200 hover:border-primary/50 hover:text-primary disabled:cursor-not-allowed disabled:opacity-50"

-      :class="{

-        'text-muted-foreground': isEmptyValue() && !displayFormatter,

-      }"

-      :disabled="disabled"

-      @click.stop

-    >

-      {{ displayText() }}

-    </button>

-  </Popover>

-</template>

-

-<style scoped>

-.inline-editor-popover__tags {

-  display: flex;

-  flex-wrap: wrap;

-  gap: 8px;

-  max-width: 280px;

-}

-

-.inline-editor-popover__actions {

-  display: flex;

-  justify-content: flex-end;

-  gap: 8px;

-  margin-top: 12px;

-}

-</style>

+<script lang="ts" setup>
+import { ref, watch } from 'vue';
+
+import { Button, Input, InputNumber, Popover, Tag } from 'ant-design-vue';
+
+type TagOption = { label: string; value: number | string };
+
+const props = withDefaults(
+  defineProps<{
+    disabled?: boolean;
+    displayFormatter?: (value: unknown) => string;
+    label?: string;
+    options?: TagOption[];
+    placeholder?: string;
+    type?: 'number' | 'tags' | 'text';
+    value?: null | number | string;
+  }>(),
+  {
+    disabled: false,
+    label: '',
+    options: () => [],
+    placeholder: '请输入',
+    type: 'text',
+    value: '',
+  },
+);
+
+const emit = defineEmits<{
+  save: [value: number | string];
+}>();
+
+const open = ref(false);
+const draftText = ref('');
+const draftNumber = ref<null | number>(null);
+const saving = ref(false);
+
+watch(open, (visible) => {
+  if (!visible) {
+    return;
+  }
+  if (props.type === 'number') {
+    const raw = props.value;
+    draftNumber.value =
+      raw !== null && raw !== undefined && raw !== '' ? Number(raw) : null;
+    return;
+  }
+  draftText.value = String(props.value ?? '');
+});
+
+function displayText() {
+  if (props.displayFormatter) {
+    return props.displayFormatter(props.value);
+  }
+  if (props.value === null || props.value === undefined || props.value === '') {
+    return '点击设置';
+  }
+  if (props.type === 'tags') {
+    const matched = props.options.find(
+      (item) => String(item.value) === String(props.value),
+    );
+    return matched?.label ?? String(props.value);
+  }
+  return String(props.value);
+}
+
+function isEmptyValue() {
+  return props.value === null || props.value === undefined || props.value === '';
+}
+
+async function confirmSave() {
+  saving.value = true;
+  try {
+    if (props.type === 'number') {
+      if (draftNumber.value === null || draftNumber.value === undefined) {
+        return;
+      }
+      emit('save', draftNumber.value);
+    } else {
+      const text = draftText.value.trim();
+      if (!text) {
+        return;
+      }
+      emit('save', text);
+    }
+    open.value = false;
+  } finally {
+    saving.value = false;
+  }
+}
+
+function selectTag(value: number | string) {
+  emit('save', value);
+  open.value = false;
+}
+</script>
+
+<template>
+  <Popover v-model:open="open" trigger="click" placement="bottomLeft">
+    <template #content>
+      <div class="inline-editor-popover min-w-[220px]">
+        <div v-if="label" class="mb-2 text-xs text-muted-foreground">{{ label }}</div>
+        <template v-if="type === 'tags'">
+          <div class="inline-editor-popover__tags">
+            <Tag
+              v-for="opt in options"
+              :key="String(opt.value)"
+              class="cursor-pointer transition-colors duration-200"
+              :color="String(value) === String(opt.value) ? 'processing' : 'default'"
+              @click="selectTag(opt.value)"
+            >
+              {{ opt.label }}
+            </Tag>
+          </div>
+        </template>
+        <template v-else-if="type === 'number'">
+          <InputNumber
+            v-model:value="draftNumber"
+            class="w-full"
+            :min="0"
+            :placeholder="placeholder"
+          />
+          <div class="inline-editor-popover__actions">
+            <Button size="small" @click="open = false">取消</Button>
+            <Button
+              size="small"
+              type="primary"
+              :loading="saving"
+              @click="confirmSave"
+            >
+              保存
+            </Button>
+          </div>
+        </template>
+        <template v-else>
+          <Input
+            v-model:value="draftText"
+            :placeholder="placeholder"
+            @press-enter="confirmSave"
+          />
+          <div class="inline-editor-popover__actions">
+            <Button size="small" @click="open = false">取消</Button>
+            <Button
+              size="small"
+              type="primary"
+              :loading="saving"
+              @click="confirmSave"
+            >
+              保存
+            </Button>
+          </div>
+        </template>
+      </div>
+    </template>
+    <button
+      type="button"
+      class="inline-edit-trigger cursor-pointer border-b border-dashed border-transparent text-left transition-colors duration-200 hover:border-primary/50 hover:text-primary disabled:cursor-not-allowed disabled:opacity-50"
+      :class="{
+        'text-muted-foreground': isEmptyValue() && !displayFormatter,
+      }"
+      :disabled="disabled"
+      @click.stop
+    >
+      {{ displayText() }}
+    </button>
+  </Popover>
+</template>
+
+<style scoped>
+.inline-editor-popover__tags {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 8px;
+  max-width: 280px;
+}
+
+.inline-editor-popover__actions {
+  display: flex;
+  justify-content: flex-end;
+  gap: 8px;
+  margin-top: 12px;
+}
+</style>
diff --git a/apps/web-antd/src/views/system/region/config/table.ts b/apps/web-antd/src/views/system/region/config/table.ts
index ec503085..a7ea65a4 100644
--- a/apps/web-antd/src/views/system/region/config/table.ts
+++ b/apps/web-antd/src/views/system/region/config/table.ts
@@ -54,7 +54,7 @@ export const gridOptions: VxeGridProps = {
     // custom: true, // 自定义列
     zoom: true, // 最大化最小化
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
     custom: {
       // 自定义列-图标
diff --git a/apps/web-antd/src/views/system/role-quick-nav/config/table.ts b/apps/web-antd/src/views/system/role-quick-nav/config/table.ts
index b69e8f2b..266c7744 100644
--- a/apps/web-antd/src/views/system/role-quick-nav/config/table.ts
+++ b/apps/web-antd/src/views/system/role-quick-nav/config/table.ts
@@ -69,7 +69,7 @@ export const gridOptions: VxeGridProps<RowType> = {
     // custom: true, // 自定义列
     zoom: true, // 最大化最小化
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
     custom: {
       // 自定义列-图标
diff --git a/apps/web-antd/src/views/system/role-quick-nav/index.vue b/apps/web-antd/src/views/system/role-quick-nav/index.vue
index 666ec507..fea102fe 100644
--- a/apps/web-antd/src/views/system/role-quick-nav/index.vue
+++ b/apps/web-antd/src/views/system/role-quick-nav/index.vue
@@ -69,7 +69,7 @@ const deleteApi = (row: any) => {
   <Page auto-content-height title="快捷导航管理">
     <FormModal />
     <Grid>
-      <template #toolbar-buttons>
+      <template #toolbar-actions>
         <TableAction
           :actions="[
             {
diff --git a/apps/web-antd/src/views/system/role/api/index.ts b/apps/web-antd/src/views/system/role/api/index.ts
index d9afd86e..2be34879 100644
--- a/apps/web-antd/src/views/system/role/api/index.ts
+++ b/apps/web-antd/src/views/system/role/api/index.ts
@@ -67,3 +67,59 @@ export async function updateRole(data: Record<string, any>) {
 export async function deleteRole(data: Record<string, any>) {
   return requestClient.post<any>(`${prefix}delete`, data);
 }
+
+const workbenchPrefix = 'role-workbench-widget/';
+
+/**
+ * 工作台模块可选字典（code + 中文名）
+ */
+export async function getWorkbenchWidgetOptions() {
+  return requestClient.get<any>(`${workbenchPrefix}options`);
+}
+
+/**
+ * 按角色获取已配置的工作台模块（配置回显）
+ */
+export async function getWorkbenchWidgetByRoleId(roleId: number) {
+  return requestClient.get<any>(`${workbenchPrefix}get-by-role-id`, {
+    params: { role_id: roleId },
+  });
+}
+
+/**
+ * 批量保存角色工作台模块（按数组顺序写排序）
+ */
+export async function batchSaveWorkbenchWidget(data: {
+  role_id: number;
+  widget_codes: string[];
+}) {
+  return requestClient.post<any>(`${workbenchPrefix}batch-save`, data);
+}
+
+const wxEntryPrefix = 'wx-workbench-entry/';
+
+/**
+ * 小程序功能入口全量字典（角色分配抽屉可选项，含分组）
+ */
+export async function getWxWorkbenchEntryOptions() {
+  return requestClient.get<any>(`${wxEntryPrefix}options`);
+}
+
+/**
+ * 按角色获取已分配的小程序功能入口（配置回显，按排序返回）
+ */
+export async function getWxWorkbenchEntryByRoleId(roleId: number) {
+  return requestClient.get<any>(`${wxEntryPrefix}get-by-role-id`, {
+    params: { role_id: roleId },
+  });
+}
+
+/**
+ * 批量保存角色的小程序功能入口分配（按数组顺序写排序）
+ */
+export async function batchSaveWxWorkbenchEntry(data: {
+  entry_ids: number[];
+  role_id: number;
+}) {
+  return requestClient.post<any>(`${wxEntryPrefix}batch-save`, data);
+}
diff --git a/apps/web-antd/src/views/system/role/components/mp-entry.vue b/apps/web-antd/src/views/system/role/components/mp-entry.vue
new file mode 100644
index 00000000..a5d27b26
--- /dev/null
+++ b/apps/web-antd/src/views/system/role/components/mp-entry.vue
@@ -0,0 +1,283 @@
+<script lang="ts" setup>
+/**
+ * 角色小程序功能入口分配抽屉：勾选入口 + 上移/下移排序，保存调 wx-workbench-entry/batch-save
+ * 交互完整复刻 workbench-widget.vue（模块少用箭头排序，不引拖拽库）；
+ * 与之的差异：可选项来自 xk_wx_workbench_entry 字典并按 group_name 分组展示
+ */
+import { computed, ref } from 'vue';
+
+import { useVbenDrawer } from '@vben/common-ui';
+import { IconifyIcon as VbenIcon } from '@vben/icons';
+
+import { Button, Checkbox, message } from 'ant-design-vue';
+
+import {
+  batchSaveWxWorkbenchEntry,
+  getWxWorkbenchEntryByRoleId,
+  getWxWorkbenchEntryOptions,
+} from '../api';
+
+/** 字典入口项 */
+type EntryOption = {
+  code: string;
+  description: string;
+  group_name: string;
+  id: number;
+  name: string;
+};
+
+const record = ref<any>({});
+const options = ref<EntryOption[]>([]);
+/** 已分配的入口 id（数组顺序即小程序展示顺序） */
+const enabledIds = ref<number[]>([]);
+
+const drawerTitle = computed(() => {
+  const roleName = record.value?.name || '';
+  return roleName ? `小程序入口 - ${roleName}` : '小程序入口';
+});
+
+/** 未分配的入口，按分组聚合（供勾选添加） */
+const disabledGroups = computed(() => {
+  const rest = options.value.filter(
+    (item) => !enabledIds.value.includes(item.id),
+  );
+  const groups: { items: EntryOption[]; name: string }[] = [];
+  rest.forEach((item) => {
+    const name = item.group_name || '未分组';
+    let group = groups.find((g) => g.name === name);
+    if (!group) {
+      group = { name, items: [] };
+      groups.push(group);
+    }
+    group.items.push(item);
+  });
+  return groups;
+});
+
+/**
+ * 入口 id → 展示名（带分组前缀便于区分不同端的同名入口，如两端都有「提现管理」）
+ */
+function labelOf(id: number) {
+  const item = options.value.find((option) => option.id === id);
+  if (!item) return `#${id}`;
+  return item.group_name ? `【${item.group_name}】${item.name}` : item.name;
+}
+
+/**
+ * 勾选/取消某入口
+ */
+function toggle(id: number, checked: boolean) {
+  if (checked) {
+    if (!enabledIds.value.includes(id)) {
+      enabledIds.value.push(id);
+    }
+  } else {
+    enabledIds.value = enabledIds.value.filter((item) => item !== id);
+  }
+}
+
+/**
+ * 上移/下移调整顺序（offset -1 上移 / 1 下移）
+ */
+function move(index: number, offset: number) {
+  const target = index + offset;
+  if (target < 0 || target >= enabledIds.value.length) return;
+  const list = [...enabledIds.value];
+  const [item] = list.splice(index, 1);
+  list.splice(target, 0, item!);
+  enabledIds.value = list;
+}
+
+/**
+ * 拉取字典 + 角色已分配入口
+ */
+async function fetchData() {
+  const roleId = Number(record.value?.id || 0);
+  if (!roleId) return;
+  try {
+    const [opts, assigned] = await Promise.all([
+      getWxWorkbenchEntryOptions(),
+      getWxWorkbenchEntryByRoleId(roleId),
+    ]);
+    options.value = Array.isArray(opts) ? opts : [];
+    enabledIds.value = (Array.isArray(assigned) ? assigned : []).map(
+      (item: any) => Number(item.entry_id),
+    );
+  } catch {
+    message.error('获取小程序入口配置失败');
+    options.value = [];
+    enabledIds.value = [];
+  }
+}
+
+/**
+ * 保存配置（空数组表示清空该角色全部入口，小程序端会回落硬编码菜单保可用）
+ */
+async function handleSave() {
+  const roleId = Number(record.value?.id || 0);
+  if (!roleId) {
+    message.error('角色ID不能为空');
+    return;
+  }
+  DrawerApi.lock();
+  try {
+    await batchSaveWxWorkbenchEntry({
+      role_id: roleId,
+      entry_ids: enabledIds.value,
+    });
+    message.success('保存成功');
+    DrawerApi.close();
+  } catch {
+    message.error('保存失败');
+  } finally {
+    DrawerApi.unlock();
+  }
+}
+
+const [Drawer, DrawerApi] = useVbenDrawer({
+  onOpenChange(isOpen) {
+    if (isOpen) {
+      record.value = DrawerApi.getData()?.record || {};
+      options.value = [];
+      enabledIds.value = [];
+      DrawerApi.setState({ loading: true });
+      fetchData().finally(() => {
+        DrawerApi.setState({ loading: false });
+      });
+    }
+  },
+  onConfirm: handleSave,
+});
+
+defineExpose({
+  DrawerApi,
+});
+</script>
+
+<template>
+  <Drawer :title="drawerTitle" class="w-[420px]">
+    <div class="entry-config">
+      <div class="entry-config__section-title">已分配（自上而下为展示顺序）</div>
+      <div v-if="enabledIds.length > 0" class="entry-config__list">
+        <div
+          v-for="(id, index) in enabledIds"
+          :key="id"
+          class="entry-config__row"
+        >
+          <span class="entry-config__label">{{ labelOf(id) }}</span>
+          <span class="entry-config__ops">
+            <Button
+              :disabled="index === 0"
+              size="small"
+              type="text"
+              @click="move(index, -1)"
+            >
+              <VbenIcon icon="lucide:arrow-up" />
+            </Button>
+            <Button
+              :disabled="index === enabledIds.length - 1"
+              size="small"
+              type="text"
+              @click="move(index, 1)"
+            >
+              <VbenIcon icon="lucide:arrow-down" />
+            </Button>
+            <Button danger size="small" type="text" @click="toggle(id, false)">
+              <VbenIcon icon="lucide:x" />
+            </Button>
+          </span>
+        </div>
+      </div>
+      <div v-else class="entry-config__empty">
+        未分配任何入口，小程序端将回落默认菜单
+      </div>
+
+      <div class="entry-config__section-title mt-4">可添加</div>
+      <template v-if="disabledGroups.length > 0">
+        <div
+          v-for="group in disabledGroups"
+          :key="group.name"
+          class="entry-config__group"
+        >
+          <div class="entry-config__group-title">{{ group.name }}</div>
+          <div class="entry-config__list">
+            <div
+              v-for="item in group.items"
+              :key="item.id"
+              class="entry-config__row"
+            >
+              <Checkbox
+                :checked="false"
+                @update:checked="(val: boolean) => toggle(item.id, val)"
+              >
+                {{ item.name }}
+                <span v-if="item.description" class="entry-config__desc">
+                  {{ item.description }}
+                </span>
+              </Checkbox>
+            </div>
+          </div>
+        </div>
+      </template>
+      <div v-else class="entry-config__empty">全部入口已分配</div>
+    </div>
+  </Drawer>
+</template>
+
+<style scoped>
+.entry-config__section-title {
+  margin-bottom: 8px;
+  font-size: 13px;
+  font-weight: 600;
+  color: hsl(var(--foreground));
+}
+
+.entry-config__group {
+  margin-bottom: 10px;
+}
+
+.entry-config__group-title {
+  margin-bottom: 6px;
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+}
+
+.entry-config__list {
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+}
+
+.entry-config__row {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 6px 10px;
+  background: hsl(var(--muted) / 0.25);
+  border: 1px solid hsl(var(--border));
+  border-radius: 6px;
+}
+
+.entry-config__label {
+  font-size: 13px;
+  color: hsl(var(--foreground));
+}
+
+.entry-config__desc {
+  margin-left: 6px;
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+}
+
+.entry-config__ops {
+  display: flex;
+  gap: 2px;
+  align-items: center;
+}
+
+.entry-config__empty {
+  padding: 12px 0;
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+}
+</style>
diff --git a/apps/web-antd/src/views/system/role/components/workbench-widget.vue b/apps/web-antd/src/views/system/role/components/workbench-widget.vue
new file mode 100644
index 00000000..23444ad9
--- /dev/null
+++ b/apps/web-antd/src/views/system/role/components/workbench-widget.vue
@@ -0,0 +1,234 @@
+<script lang="ts" setup>
+/**
+ * 角色工作台模块配置抽屉：勾选模块 + 上移/下移排序，保存调 batch-save
+ * 为什么用上下移而不是拖拽：模块总数少（≤7 个），箭头排序更轻，无需引 SortableJS
+ */
+import { computed, ref } from 'vue';
+
+import { useVbenDrawer } from '@vben/common-ui';
+import { IconifyIcon as VbenIcon } from '@vben/icons';
+
+import { Button, Checkbox, message } from 'ant-design-vue';
+
+import {
+  batchSaveWorkbenchWidget,
+  getWorkbenchWidgetByRoleId,
+  getWorkbenchWidgetOptions,
+} from '../api';
+
+/** 模块字典项 */
+type WidgetOption = {
+  code: string;
+  label: string;
+};
+
+const record = ref<any>({});
+const options = ref<WidgetOption[]>([]);
+/** 已启用的模块 code（数组顺序即展示顺序） */
+const enabledCodes = ref<string[]>([]);
+
+const drawerTitle = computed(() => {
+  const roleName = record.value?.name || '';
+  return roleName ? `工作台模块 - ${roleName}` : '工作台模块';
+});
+
+/** 未启用的模块（供勾选添加） */
+const disabledOptions = computed(() =>
+  options.value.filter((item) => !enabledCodes.value.includes(item.code)),
+);
+
+/**
+ * code → 中文名
+ */
+function labelOf(code: string) {
+  return options.value.find((item) => item.code === code)?.label || code;
+}
+
+/**
+ * 勾选/取消某模块
+ */
+function toggle(code: string, checked: boolean) {
+  if (checked) {
+    if (!enabledCodes.value.includes(code)) {
+      enabledCodes.value.push(code);
+    }
+  } else {
+    enabledCodes.value = enabledCodes.value.filter((item) => item !== code);
+  }
+}
+
+/**
+ * 上移/下移调整顺序（offset -1 上移 / 1 下移）
+ */
+function move(index: number, offset: number) {
+  const target = index + offset;
+  if (target < 0 || target >= enabledCodes.value.length) return;
+  const list = [...enabledCodes.value];
+  const [item] = list.splice(index, 1);
+  list.splice(target, 0, item!);
+  enabledCodes.value = list;
+}
+
+/**
+ * 拉取字典 + 角色已配置模块
+ */
+async function fetchData() {
+  const roleId = Number(record.value?.id || 0);
+  if (!roleId) return;
+  try {
+    const [opts, layout] = await Promise.all([
+      getWorkbenchWidgetOptions(),
+      getWorkbenchWidgetByRoleId(roleId),
+    ]);
+    options.value = Array.isArray(opts) ? opts : [];
+    enabledCodes.value = (Array.isArray(layout) ? layout : []).map(
+      (item: any) => item.widget_code,
+    );
+  } catch {
+    message.error('获取工作台模块配置失败');
+    options.value = [];
+    enabledCodes.value = [];
+  }
+}
+
+/**
+ * 保存配置（空数组表示清空该角色全部模块）
+ */
+async function handleSave() {
+  const roleId = Number(record.value?.id || 0);
+  if (!roleId) {
+    message.error('角色ID不能为空');
+    return;
+  }
+  DrawerApi.lock();
+  try {
+    await batchSaveWorkbenchWidget({
+      role_id: roleId,
+      widget_codes: enabledCodes.value,
+    });
+    message.success('保存成功');
+    DrawerApi.close();
+  } catch {
+    message.error('保存失败');
+  } finally {
+    DrawerApi.unlock();
+  }
+}
+
+const [Drawer, DrawerApi] = useVbenDrawer({
+  onOpenChange(isOpen) {
+    if (isOpen) {
+      record.value = DrawerApi.getData()?.record || {};
+      options.value = [];
+      enabledCodes.value = [];
+      DrawerApi.setState({ loading: true });
+      fetchData().finally(() => {
+        DrawerApi.setState({ loading: false });
+      });
+    }
+  },
+  onConfirm: handleSave,
+});
+
+defineExpose({
+  DrawerApi,
+});
+</script>
+
+<template>
+  <Drawer :title="drawerTitle" class="w-[420px]">
+    <div class="widget-config">
+      <div class="widget-config__section-title">已启用（自上而下为展示顺序）</div>
+      <div v-if="enabledCodes.length > 0" class="widget-config__list">
+        <div
+          v-for="(code, index) in enabledCodes"
+          :key="code"
+          class="widget-config__row"
+        >
+          <span class="widget-config__label">{{ labelOf(code) }}</span>
+          <span class="widget-config__ops">
+            <Button
+              :disabled="index === 0"
+              size="small"
+              type="text"
+              @click="move(index, -1)"
+            >
+              <VbenIcon icon="lucide:arrow-up" />
+            </Button>
+            <Button
+              :disabled="index === enabledCodes.length - 1"
+              size="small"
+              type="text"
+              @click="move(index, 1)"
+            >
+              <VbenIcon icon="lucide:arrow-down" />
+            </Button>
+            <Button danger size="small" type="text" @click="toggle(code, false)">
+              <VbenIcon icon="lucide:x" />
+            </Button>
+          </span>
+        </div>
+      </div>
+      <div v-else class="widget-config__empty">未启用任何模块，工作台将为空</div>
+
+      <div class="widget-config__section-title mt-4">可添加</div>
+      <div v-if="disabledOptions.length > 0" class="widget-config__list">
+        <div
+          v-for="item in disabledOptions"
+          :key="item.code"
+          class="widget-config__row"
+        >
+          <Checkbox
+            :checked="false"
+            @update:checked="(val: boolean) => toggle(item.code, val)"
+          >
+            {{ item.label }}
+          </Checkbox>
+        </div>
+      </div>
+      <div v-else class="widget-config__empty">全部模块已启用</div>
+    </div>
+  </Drawer>
+</template>
+
+<style scoped>
+.widget-config__section-title {
+  margin-bottom: 8px;
+  font-size: 13px;
+  font-weight: 600;
+  color: hsl(var(--foreground));
+}
+
+.widget-config__list {
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+}
+
+.widget-config__row {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 6px 10px;
+  background: hsl(var(--muted) / 0.25);
+  border: 1px solid hsl(var(--border));
+  border-radius: 6px;
+}
+
+.widget-config__label {
+  font-size: 13px;
+  color: hsl(var(--foreground));
+}
+
+.widget-config__ops {
+  display: flex;
+  gap: 2px;
+  align-items: center;
+}
+
+.widget-config__empty {
+  padding: 12px 0;
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+}
+</style>
diff --git a/apps/web-antd/src/views/system/role/config/table.ts b/apps/web-antd/src/views/system/role/config/table.ts
index 6133fbb8..88a98954 100644
--- a/apps/web-antd/src/views/system/role/config/table.ts
+++ b/apps/web-antd/src/views/system/role/config/table.ts
@@ -62,7 +62,7 @@ export const gridOptions: VxeGridProps<RowType> = {
     // custom: true, // 自定义列
     zoom: true, // 最大化最小化
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
     custom: {
       // 自定义列-图标
diff --git a/apps/web-antd/src/views/system/role/index.vue b/apps/web-antd/src/views/system/role/index.vue
index 3d20466c..1de17ce8 100644
--- a/apps/web-antd/src/views/system/role/index.vue
+++ b/apps/web-antd/src/views/system/role/index.vue
@@ -15,7 +15,12 @@ import FormModalDemo from './components/modal.vue';
 import { formOptions } from './config/search';
 import { gridOptions } from './config/table';
 import AuthMenu from "#/views/system/role/components/auth-menu.vue";
+import MpEntry from "#/views/system/role/components/mp-entry.vue";
 import QuickNav from "#/views/system/role/components/quick-nav.vue";
+import WorkbenchWidget from "#/views/system/role/components/workbench-widget.vue";
+
+// 支持配置小程序工作台入口的角色（1/2平台 3/4/6业务员线 8诊所管理员 14诊所推广员）
+const MP_ENTRY_ROLE_IDS = [1, 2, 3, 4, 6, 8, 14];
 
 const hasTopTableDropDownActions = ref(false);
 
@@ -77,6 +82,28 @@ const handleQuickNav = (record: any) => {
     quickNavRef.value.DrawerApi.open();
   }
 };
+
+// 工作台模块配置
+const workbenchWidgetRef = ref();
+const handleWorkbenchWidget = (record: any) => {
+  if (workbenchWidgetRef.value && workbenchWidgetRef.value.DrawerApi) {
+    workbenchWidgetRef.value.DrawerApi.setData({
+      record,
+    });
+    workbenchWidgetRef.value.DrawerApi.open();
+  }
+};
+
+// 小程序功能入口分配
+const mpEntryRef = ref();
+const handleMpEntry = (record: any) => {
+  if (mpEntryRef.value && mpEntryRef.value.DrawerApi) {
+    mpEntryRef.value.DrawerApi.setData({
+      record,
+    });
+    mpEntryRef.value.DrawerApi.open();
+  }
+};
 const deleteApi = (row: any) => {
   let ids = [];
   if (row) {
@@ -96,8 +123,10 @@ const deleteApi = (row: any) => {
     <FormModal />
     <AuthMenu ref="authMenuRef" />
     <QuickNav ref="quickNavRef" />
+    <WorkbenchWidget ref="workbenchWidgetRef" />
+    <MpEntry ref="mpEntryRef" />
     <Grid>
-      <template #toolbar-buttons>
+      <template #toolbar-actions>
         <TableAction
           :actions="[
             {
@@ -160,6 +189,22 @@ const deleteApi = (row: any) => {
               // auth: ['admin', 'sys:role:detail'],
               onClick: handleQuickNav.bind(null, row),
             },
+            {
+              label: '工作台模块',
+              type: 'link',
+              icon: 'mdi:view-dashboard-outline',
+              size: 'small',
+              // auth: ['admin', 'sys:role:detail'],
+              onClick: handleWorkbenchWidget.bind(null, row),
+            },
+            {
+              label: '小程序入口',
+              type: 'link',
+              icon: 'mdi:cellphone-cog',
+              size: 'small',
+              ifShow: MP_ENTRY_ROLE_IDS.includes(Number(row.id)),
+              onClick: handleMpEntry.bind(null, row),
+            },
           ]"
           :drop-down-actions="[
             {
diff --git a/apps/web-antd/src/views/system/salesperson-dashboard/components/CompareTrendChart.vue b/apps/web-antd/src/views/system/salesperson-dashboard/components/CompareTrendChart.vue
index 3ea72bb1..da4a891e 100644
--- a/apps/web-antd/src/views/system/salesperson-dashboard/components/CompareTrendChart.vue
+++ b/apps/web-antd/src/views/system/salesperson-dashboard/components/CompareTrendChart.vue
@@ -1,83 +1,83 @@
-<script setup lang="ts">

-import { computed, nextTick, ref, watch } from 'vue';

-

-import {

-  EchartsUI,

-  type EchartsUIType,

-  useEcharts,

-} from '@vben/plugins/echarts';

-

-import type { SalespersonDashboardTrendItem } from '../api';

-

-const props = defineProps<{

-  /** 本周期 trend，用于环比柱状图「本周期」系列 */

-  current: SalespersonDashboardTrendItem[];

-  /** 上一等长周期 compare_trend，用于「上周期」系列 */

-  previous: SalespersonDashboardTrendItem[];

-}>();

-

-const chartRef = ref<EchartsUIType>();

-const { renderEcharts, resize } = useEcharts(chartRef);

-

-const maxLen = computed(() => Math.max(props.current.length, props.previous.length));

-

-function resolveInputTotal(item: SalespersonDashboardTrendItem) {

-  return item.input_total ?? item.clinic_count + item.pharmacy_count;

-}

-

-/** 按序号对齐本周期与上周期录入总数，tooltip 展示真实时间标签 */

-async function renderChart() {

-  const labels = Array.from({ length: maxLen.value }, (_, i) => `T${i + 1}`);

-  const currentData = props.current.map((item) => resolveInputTotal(item));

-  const previousData = props.previous.map((item) => resolveInputTotal(item));

-

-  await renderEcharts({

-    tooltip: {

-      trigger: 'axis',

-      formatter(params: any) {

-        const list = Array.isArray(params) ? params : [params];

-        const idx = list[0]?.dataIndex ?? 0;

-        const cur = props.current[idx];

-        const prev = props.previous[idx];

-        const lines = [`序号 ${idx + 1}`];

-        if (cur) lines.push(`本周期 ${cur.label}：${resolveInputTotal(cur)} 家`);

-        if (prev) lines.push(`上周期 ${prev.label}：${resolveInputTotal(prev)} 家`);

-        return lines.join('<br/>');

-      },

-    },

-    legend: { data: ['本周期录入', '上周期录入'] },

-    grid: { left: '3%', right: '4%', bottom: '3%', containLabel: true },

-    xAxis: { type: 'category', data: labels },

-    yAxis: { type: 'value', name: '录入数(家)', minInterval: 1 },

-    series: [

-      {

-        name: '本周期录入',

-        type: 'bar',

-        data: currentData,

-        itemStyle: { color: '#1677ff' },

-      },

-      {

-        name: '上周期录入',

-        type: 'bar',

-        data: previousData,

-        itemStyle: { color: '#bfbfbf' },

-      },

-    ],

-  });

-  await nextTick();

-  resize();

-}

-

-watch([() => props.current, () => props.previous], renderChart, { deep: true, immediate: true });

-</script>

-

-<template>

-  <EchartsUI ref="chartRef" class="dashboard-chart" />

-</template>

-

-<style scoped>

-.dashboard-chart {

-  width: 100%;

-  height: 320px;

-}

-</style>

+<script setup lang="ts">
+import type { SalespersonDashboardTrendItem } from '../api';
+
+import { computed, nextTick, ref, watch } from 'vue';
+
+import {
+  EchartsUI,
+  type EchartsUIType,
+  useEcharts,
+} from '@vben/plugins/echarts';
+
+const props = defineProps<{
+  /** 本周期 trend，用于环比柱状图「本周期」系列 */
+  current: SalespersonDashboardTrendItem[];
+  /** 上一等长周期 compare_trend，用于「上周期」系列 */
+  previous: SalespersonDashboardTrendItem[];
+}>();
+
+const chartRef = ref<EchartsUIType>();
+const { renderEcharts, resize } = useEcharts(chartRef);
+
+const maxLen = computed(() => Math.max(props.current.length, props.previous.length));
+
+function resolveInputTotal(item: SalespersonDashboardTrendItem) {
+  return item.input_total ?? item.clinic_count + item.pharmacy_count;
+}
+
+/** 按序号对齐本周期与上周期录入总数，tooltip 展示真实时间标签 */
+async function renderChart() {
+  const labels = Array.from({ length: maxLen.value }, (_, i) => `T${i + 1}`);
+  const currentData = props.current.map((item) => resolveInputTotal(item));
+  const previousData = props.previous.map((item) => resolveInputTotal(item));
+
+  await renderEcharts({
+    tooltip: {
+      trigger: 'axis',
+      formatter(params: any) {
+        const list = Array.isArray(params) ? params : [params];
+        const idx = list[0]?.dataIndex ?? 0;
+        const cur = props.current[idx];
+        const prev = props.previous[idx];
+        const lines = [`序号 ${idx + 1}`];
+        if (cur) lines.push(`本周期 ${cur.label}：${resolveInputTotal(cur)} 家`);
+        if (prev) lines.push(`上周期 ${prev.label}：${resolveInputTotal(prev)} 家`);
+        return lines.join('<br/>');
+      },
+    },
+    legend: { data: ['本周期录入', '上周期录入'] },
+    grid: { left: '3%', right: '4%', bottom: '3%', containLabel: true },
+    xAxis: { type: 'category', data: labels },
+    yAxis: { type: 'value', name: '录入数(家)', minInterval: 1 },
+    series: [
+      {
+        name: '本周期录入',
+        type: 'bar',
+        data: currentData,
+        itemStyle: { color: '#1677ff' },
+      },
+      {
+        name: '上周期录入',
+        type: 'bar',
+        data: previousData,
+        itemStyle: { color: '#bfbfbf' },
+      },
+    ],
+  });
+  await nextTick();
+  resize();
+}
+
+watch([() => props.current, () => props.previous], renderChart, { deep: true, immediate: true });
+</script>
+
+<template>
+  <EchartsUI ref="chartRef" class="dashboard-chart" />
+</template>
+
+<style scoped>
+.dashboard-chart {
+  width: 100%;
+  height: 320px;
+}
+</style>
diff --git a/apps/web-antd/src/views/system/salesperson-dashboard/components/InputCountTrendChart.vue b/apps/web-antd/src/views/system/salesperson-dashboard/components/InputCountTrendChart.vue
index e449fb68..697a1e44 100644
--- a/apps/web-antd/src/views/system/salesperson-dashboard/components/InputCountTrendChart.vue
+++ b/apps/web-antd/src/views/system/salesperson-dashboard/components/InputCountTrendChart.vue
@@ -1,86 +1,86 @@
-<script setup lang="ts">

-import { nextTick, ref, watch } from 'vue';

-

-import {

-  EchartsUI,

-  type EchartsUIType,

-  useEcharts,

-} from '@vben/plugins/echarts';

-

-import type { SalespersonDashboardTrendItem } from '../api';

-

-const props = defineProps<{

-  /** 来自 dashboardData.trend：按时间桶聚合的录入趋势 */

-  data: SalespersonDashboardTrendItem[];

-}>();

-

-const chartRef = ref<EchartsUIType>();

-const { renderEcharts, resize } = useEcharts(chartRef);

-

-/** 录入总数兜底：兼容旧接口未返回 input_total 的情况 */

-function resolveInputTotal(item: SalespersonDashboardTrendItem) {

-  return item.input_total ?? item.clinic_count + item.pharmacy_count;

-}

-

-/**

- * 将 trend 数据映射为 ECharts series

- * - 堆叠柱：录入诊所 / 录入药店

- * - 折线：录入总数

- */

-async function renderChart() {

-  const labels = props.data.map((item) => item.label);

-  const clinicData = props.data.map((item) => item.clinic_count);

-  const pharmacyData = props.data.map((item) => item.pharmacy_count);

-  const totalData = props.data.map((item) => resolveInputTotal(item));

-

-  await renderEcharts({

-    tooltip: { trigger: 'axis' },

-    legend: { data: ['录入诊所', '录入药店', '录入总数'] },

-    grid: { left: '3%', right: '4%', bottom: '3%', containLabel: true },

-    xAxis: {

-      type: 'category',

-      data: labels,

-      axisLabel: { rotate: labels.length > 10 ? 45 : 0 },

-    },

-    yAxis: { type: 'value', name: '录入数(家)', minInterval: 1 },

-    series: [

-      {

-        name: '录入诊所',

-        type: 'bar',

-        stack: 'input',

-        data: clinicData,

-        itemStyle: { color: '#1677ff' },

-      },

-      {

-        name: '录入药店',

-        type: 'bar',

-        stack: 'input',

-        data: pharmacyData,

-        itemStyle: { color: '#52c41a' },

-      },

-      {

-        name: '录入总数',

-        type: 'line',

-        smooth: true,

-        data: totalData,

-        itemStyle: { color: '#722ed1' },

-      },

-    ],

-  });

-  await nextTick();

-  resize();

-}

-

-watch(() => props.data, renderChart, { deep: true, immediate: true });

-</script>

-

-<template>

-  <EchartsUI ref="chartRef" class="dashboard-chart" />

-</template>

-

-<style scoped>

-.dashboard-chart {

-  width: 100%;

-  height: 360px;

-}

-</style>

+<script setup lang="ts">
+import type { SalespersonDashboardTrendItem } from '../api';
+
+import { nextTick, ref, watch } from 'vue';
+
+import {
+  EchartsUI,
+  type EchartsUIType,
+  useEcharts,
+} from '@vben/plugins/echarts';
+
+const props = defineProps<{
+  /** 来自 dashboardData.trend：按时间桶聚合的录入趋势 */
+  data: SalespersonDashboardTrendItem[];
+}>();
+
+const chartRef = ref<EchartsUIType>();
+const { renderEcharts, resize } = useEcharts(chartRef);
+
+/** 录入总数兜底：兼容旧接口未返回 input_total 的情况 */
+function resolveInputTotal(item: SalespersonDashboardTrendItem) {
+  return item.input_total ?? item.clinic_count + item.pharmacy_count;
+}
+
+/**
+ * 将 trend 数据映射为 ECharts series
+ * - 堆叠柱：录入诊所 / 录入药店
+ * - 折线：录入总数
+ */
+async function renderChart() {
+  const labels = props.data.map((item) => item.label);
+  const clinicData = props.data.map((item) => item.clinic_count);
+  const pharmacyData = props.data.map((item) => item.pharmacy_count);
+  const totalData = props.data.map((item) => resolveInputTotal(item));
+
+  await renderEcharts({
+    tooltip: { trigger: 'axis' },
+    legend: { data: ['录入诊所', '录入药店', '录入总数'] },
+    grid: { left: '3%', right: '4%', bottom: '3%', containLabel: true },
+    xAxis: {
+      type: 'category',
+      data: labels,
+      axisLabel: { rotate: labels.length > 10 ? 45 : 0 },
+    },
+    yAxis: { type: 'value', name: '录入数(家)', minInterval: 1 },
+    series: [
+      {
+        name: '录入诊所',
+        type: 'bar',
+        stack: 'input',
+        data: clinicData,
+        itemStyle: { color: '#1677ff' },
+      },
+      {
+        name: '录入药店',
+        type: 'bar',
+        stack: 'input',
+        data: pharmacyData,
+        itemStyle: { color: '#52c41a' },
+      },
+      {
+        name: '录入总数',
+        type: 'line',
+        smooth: true,
+        data: totalData,
+        itemStyle: { color: '#722ed1' },
+      },
+    ],
+  });
+  await nextTick();
+  resize();
+}
+
+watch(() => props.data, renderChart, { deep: true, immediate: true });
+</script>
+
+<template>
+  <EchartsUI ref="chartRef" class="dashboard-chart" />
+</template>
+
+<style scoped>
+.dashboard-chart {
+  width: 100%;
+  height: 360px;
+}
+</style>
diff --git a/apps/web-antd/src/views/system/store-input/config/form.ts b/apps/web-antd/src/views/system/store-input/config/form.ts
index 89c7dc41..71bcfeaf 100644
--- a/apps/web-antd/src/views/system/store-input/config/form.ts
+++ b/apps/web-antd/src/views/system/store-input/config/form.ts
@@ -137,7 +137,8 @@ export const modalFormProps: VbenFormProps = {
       },
       fieldName: 'mobile',
       label: '联系人手机号',
-      rules: 'required',
+      // 与后端 checkPhone 一致：必填 + 大陆 11 位号段
+      rules: 'mobile',
     },
     {
       component: 'PromoterPicker',
diff --git a/apps/web-antd/src/views/system/store-input/config/table.ts b/apps/web-antd/src/views/system/store-input/config/table.ts
index 67639fe8..1a20061b 100644
--- a/apps/web-antd/src/views/system/store-input/config/table.ts
+++ b/apps/web-antd/src/views/system/store-input/config/table.ts
@@ -101,7 +101,7 @@ export const inputGridOptions: VxeGridProps<RowType> = {
     export: false,
     zoom: true,
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
   },
   showOverflow: false,
@@ -192,7 +192,7 @@ export const auditGridOptions: VxeGridProps<RowType> = {
     export: false,
     zoom: true,
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
   },
   showOverflow: false,
diff --git a/apps/web-antd/src/views/system/store-input/index.vue b/apps/web-antd/src/views/system/store-input/index.vue
index 586eb782..f386c5cc 100644
--- a/apps/web-antd/src/views/system/store-input/index.vue
+++ b/apps/web-antd/src/views/system/store-input/index.vue
@@ -117,7 +117,7 @@ const getStatusText = (status: number) => {
     <FormModal />
     <DetailModalComponent />
     <Grid>
-      <template #toolbar-buttons>
+      <template #toolbar-actions>
         <TableAction
           :actions="[
             {
diff --git a/apps/web-antd/src/views/system/store/components/DrugPriceModal.vue b/apps/web-antd/src/views/system/store/components/DrugPriceModal.vue
index 92dd87e0..9d037603 100644
--- a/apps/web-antd/src/views/system/store/components/DrugPriceModal.vue
+++ b/apps/web-antd/src/views/system/store/components/DrugPriceModal.vue
@@ -97,7 +97,7 @@ const rowImageSrc = (row: DrugItem) => {
         />
       </Tabs>
       <DrugGrid v-if="activeTab">
-        <template #toolbar-buttons>
+        <template #toolbar-actions>
           <Button type="primary" @click="handleBatchSaveCurrent">
             批量保存
           </Button>
diff --git a/apps/web-antd/src/views/system/store/config/drug-price-table.ts b/apps/web-antd/src/views/system/store/config/drug-price-table.ts
index 27b2942b..61d73dd7 100644
--- a/apps/web-antd/src/views/system/store/config/drug-price-table.ts
+++ b/apps/web-antd/src/views/system/store/config/drug-price-table.ts
@@ -251,7 +251,7 @@ export const getDrugPriceGridOptions = (
       refresh: true,
       zoom: true,
       slots: {
-        buttons: 'toolbar-buttons',
+        buttons: 'toolbar-actions',
       },
     },
     height: 500,
diff --git a/apps/web-antd/src/views/system/store/config/form.ts b/apps/web-antd/src/views/system/store/config/form.ts
index 241ae8fa..03b8becd 100644
--- a/apps/web-antd/src/views/system/store/config/form.ts
+++ b/apps/web-antd/src/views/system/store/config/form.ts
@@ -177,7 +177,8 @@ export const modalFormProps: VbenFormProps = {
       },
       fieldName: 'mobile',
       label: '联系人手机号',
-      rules: 'required',
+      // 与后端 checkPhone 一致：必填 + 大陆 11 位号段
+      rules: 'mobile',
     },
     {
       // 编辑时可选：同步修改诊所管理员后台登录手机号
diff --git a/apps/web-antd/src/views/system/store/config/table.ts b/apps/web-antd/src/views/system/store/config/table.ts
index 2050e4ea..06f05743 100644
--- a/apps/web-antd/src/views/system/store/config/table.ts
+++ b/apps/web-antd/src/views/system/store/config/table.ts
@@ -34,7 +34,8 @@ export const gridOptions: VxeGridProps<RowType> = {
       field: 'vip',
       align: 'left',
       title: 'VIP会员',
-      width: 160,
+      minWidth: 200,
+      width: 240,
       slots: { default: 'vip' },
     },
     {
@@ -121,7 +122,7 @@ export const gridOptions: VxeGridProps<RowType> = {
     export: false,
     zoom: true,
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
     custom: {
       icon: 'vxe-icon-menu',
diff --git a/apps/web-antd/src/views/system/store/index.vue b/apps/web-antd/src/views/system/store/index.vue
index 4d397568..168ab2f5 100644
--- a/apps/web-antd/src/views/system/store/index.vue
+++ b/apps/web-antd/src/views/system/store/index.vue
@@ -41,6 +41,7 @@ import BindPrescriptionTypesModal from './components/BindPrescriptionTypesModal.
 import StoreExternalFieldModal from './components/StoreExternalFieldModal.vue';
 import SalespersonCommissionDrawer from './components/SalespersonCommissionDrawer.vue';
 import AddDoctorFromStoreModal from './components/AddDoctorFromStoreModal.vue';
+import ScheduleCalendarModal from '#/views/doctor/doctor/components/schedule-calendar/ScheduleCalendarModal.vue';
 import StoreCardModal from '#/components/store-card/StoreCardModal.vue';
 import StoreVipCell from '#/components/vip/StoreVipCell.vue';
 import VipHubModal from '#/components/vip/VipHubModal.vue';
@@ -385,6 +386,20 @@ const openSalespersonCommission = (row: { id: number; name: string }) => {
   salespersonDrawerRef.value?.open(row);
 };
 
+const scheduleCalendarModalRef = ref<InstanceType<typeof ScheduleCalendarModal>>();
+
+/**
+ * 打开「排班管理」日历面板
+ * 诊所维度入口：面板内选医生 → 月历多选日期 → 套班次模板/自定义时段/休诊
+ */
+const openScheduleCalendar = (row: { id: number; name: string }) => {
+  scheduleCalendarModalRef.value?.ModalApi?.setData({
+    storeId: Number(row?.id || 0),
+    storeName: row?.name || '',
+  });
+  scheduleCalendarModalRef.value?.ModalApi?.open();
+};
+
 /**
  * 更新包邮状态
  */
@@ -503,8 +518,9 @@ const handleSwitchClinicType = (row: any) => {
     <BindPrescriptionTypesModalComponent />
     <StoreExternalFieldModalComponent />
     <SalespersonCommissionDrawer ref="salespersonDrawerRef" />
+    <ScheduleCalendarModal ref="scheduleCalendarModalRef" />
     <Grid>
-      <template #toolbar-buttons>
+      <template #toolbar-actions>
         <TableAction
           :actions="[
             {
@@ -779,6 +795,14 @@ const handleSwitchClinicType = (row: any) => {
               ifShow: canAddDoctor,
               onClick: openAddDoctorModal.bind(null, row),
             },
+            {
+              label: '排班管理',
+              type: 'link',
+              icon: 'ant-design:calendar-outlined',
+              size: 'small',
+              auth: ['Super Admin', 'Admin'],
+              onClick: () => openScheduleCalendar(row),
+            },
             {
               label: '绑定特色方医生',
               type: 'link',
diff --git a/apps/web-antd/src/views/system/supplier/config/table.ts b/apps/web-antd/src/views/system/supplier/config/table.ts
index 89da44a1..94961e58 100644
--- a/apps/web-antd/src/views/system/supplier/config/table.ts
+++ b/apps/web-antd/src/views/system/supplier/config/table.ts
@@ -83,7 +83,7 @@ export const gridOptions: VxeGridProps<RowType> = {
     // custom: true, // 自定义列
     zoom: true, // 最大化最小化
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
     custom: {
       // 自定义列-图标
diff --git a/apps/web-antd/src/views/system/supplier/index.vue b/apps/web-antd/src/views/system/supplier/index.vue
index 5d959598..aa4b3d72 100644
--- a/apps/web-antd/src/views/system/supplier/index.vue
+++ b/apps/web-antd/src/views/system/supplier/index.vue
@@ -68,7 +68,7 @@ const deleteApi = (row: any) => {
   <Page auto-content-height title="供应商管理">
     <FormModal />
     <Grid>
-      <template #toolbar-buttons>
+      <template #toolbar-actions>
         <TableAction
           :actions="[
             {
diff --git a/apps/web-antd/src/views/system/transfer-question/config/table.ts b/apps/web-antd/src/views/system/transfer-question/config/table.ts
index 9954923f..fd5fb479 100644
--- a/apps/web-antd/src/views/system/transfer-question/config/table.ts
+++ b/apps/web-antd/src/views/system/transfer-question/config/table.ts
@@ -77,7 +77,7 @@ export const gridOptions: VxeGridProps<RowType> = {
     // custom: true, // 自定义列
     zoom: true, // 最大化最小化
     slots: {
-      buttons: 'toolbar-buttons',
+      buttons: 'toolbar-actions',
     },
   },
   showOverflow: false,
diff --git a/apps/web-antd/src/views/system/transfer-question/index.vue b/apps/web-antd/src/views/system/transfer-question/index.vue
index a57f85bd..cc3ff34e 100644
--- a/apps/web-antd/src/views/system/transfer-question/index.vue
+++ b/apps/web-antd/src/views/system/transfer-question/index.vue
@@ -74,7 +74,7 @@ const deleteApi = (row: any) => {
     <FormModal />
     <AssistantConfigModal />
     <Grid>
-      <template #toolbar-buttons>
+      <template #toolbar-actions>
         <TableAction
           :actions="[
             {
diff --git a/apps/web-antd/src/views/system/vip/level/config/table.ts b/apps/web-antd/src/views/system/vip/level/config/table.ts
index 8bad0525..7f2cf55c 100644
--- a/apps/web-antd/src/views/system/vip/level/config/table.ts
+++ b/apps/web-antd/src/views/system/vip/level/config/table.ts
@@ -45,6 +45,6 @@ export const gridOptions: VxeGridProps<any> = {
     search: true,
     refresh: true,
     zoom: true,
-    slots: { buttons: 'toolbar-buttons' },
+    slots: { buttons: 'toolbar-actions' },
   },
 };
diff --git a/apps/web-antd/src/views/system/vip/store/components/open-modal.vue b/apps/web-antd/src/views/system/vip/store/components/open-modal.vue
index accb5b0c..fc4243c4 100644
--- a/apps/web-antd/src/views/system/vip/store/components/open-modal.vue
+++ b/apps/web-antd/src/views/system/vip/store/components/open-modal.vue
@@ -103,6 +103,14 @@ const [Modal, modalApi] = useVbenModal({
     gridApi.value = data.gridApi;
     storeId.value = Number(data.store_id || 0);
     storeName.value = data.store_name || '';
+    const vip = data.vip || null;
+    const code = String(vip?.level_code || 'V0').trim() || 'V0';
+    const expireAt = Number(vip?.expire_at || 0);
+    // 非普通且未过期（含终身 expire_at=0）可继承剩余时间
+    const canKeep =
+      !!vip &&
+      code !== 'V0' &&
+      !(expireAt > 0 && expireAt * 1000 <= Date.now());
     const [levels, presets] = await Promise.all([
       getVipLevelOption(),
       getVipDurationPresets(),
@@ -111,10 +119,12 @@ const [Modal, modalApi] = useVbenModal({
       label: `${i.name}（${i.code}）¥${i.price}`,
       value: i.id,
     }));
-    presetOptions.value = (presets || []).map((i: any) => ({
-      label: i.label,
-      value: i.value,
-    }));
+    presetOptions.value = (presets || [])
+      .filter((i: any) => i.value !== 'keep' || canKeep)
+      .map((i: any) => ({
+        label: i.label,
+        value: i.value,
+      }));
     formApi.updateSchema([
       {
         fieldName: 'level_id',
@@ -125,7 +135,13 @@ const [Modal, modalApi] = useVbenModal({
         componentProps: { options: presetOptions.value },
       },
     ]);
-    formApi.setValues({ remark: '', custom_years: undefined });
+    formApi.setValues({
+      remark: '',
+      custom_years: undefined,
+      level_id: vip?.level_id ? Number(vip.level_id) : undefined,
+      // 非普通会员默认继承剩余时间，不改动到期
+      duration_preset: canKeep ? 'keep' : undefined,
+    });
   },
 });
 </script>
diff --git a/apps/web-antd/src/views/system/vip/store/config/table.ts b/apps/web-antd/src/views/system/vip/store/config/table.ts
index 002cb39e..8b197b2a 100644
--- a/apps/web-antd/src/views/system/vip/store/config/table.ts
+++ b/apps/web-antd/src/views/system/vip/store/config/table.ts
@@ -1,5 +1,7 @@
 import type { VxeGridProps } from '#/adapter/vxe-table';
 
+import { formatVipExpireAt } from '#/utils/vip';
+
 import { getVipStoreList } from '../api';
 
 export const gridOptions: VxeGridProps<any> = {
@@ -32,21 +34,10 @@ export const gridOptions: VxeGridProps<any> = {
     {
       field: 'expire_at',
       title: '到期时间',
-      width: 170,
-      formatter: ({ row }) => {
-        if (!row.vip) return '-';
-        if (row.vip.is_lifetime) return '终身';
-        const expireAt = Number(row.vip.expire_at || 0);
-        if (!expireAt) {
-          return row.vip.level_code === 'V0' ? '-' : '终身';
-        }
-        if (typeof row.vip.expire_at === 'string' && String(row.vip.expire_at).includes('-')) {
-          return row.vip.expire_at;
-        }
-        const d = new Date(expireAt * 1000);
-        const pad = (n: number) => String(n).padStart(2, '0');
-        return `${d.getFullYear()}-${pad(d.getMonth() + 1)}-${pad(d.getDate())} ${pad(d.getHours())}:${pad(d.getMinutes())}`;
-      },
+      width: 180,
+      formatter: ({ row }) =>
+        formatVipExpireAt(row.vip, { emptyText: '-', lifetimeText: '终身' }) ||
+        '-',
     },
     { title: '操作', slots: { default: 'action' }, width: 100, fixed: 'right' },
   ],
diff --git a/apps/web-antd/src/views/system/wx-workbench-entry/api/index.ts b/apps/web-antd/src/views/system/wx-workbench-entry/api/index.ts
new file mode 100644
index 00000000..d1077596
--- /dev/null
+++ b/apps/web-antd/src/views/system/wx-workbench-entry/api/index.ts
@@ -0,0 +1,20 @@
+import { requestClient } from '#/api/request';
+
+/** 小程序工作台功能入口字典 API */
+const prefix = 'wx-workbench-entry/';
+
+export async function getWxWorkbenchEntryList(data: any) {
+  return requestClient.get<any>(`${prefix}list`, { params: data });
+}
+
+export async function createWxWorkbenchEntry(data: Record<string, any>) {
+  return requestClient.post<any>(`${prefix}create`, data);
+}
+
+export async function updateWxWorkbenchEntry(data: Record<string, any>) {
+  return requestClient.post<any>(`${prefix}update`, data);
+}
+
+export async function deleteWxWorkbenchEntry(data: Record<string, any>) {
+  return requestClient.post<any>(`${prefix}delete`, data);
+}
diff --git a/apps/web-antd/src/views/system/wx-workbench-entry/components/modal.vue b/apps/web-antd/src/views/system/wx-workbench-entry/components/modal.vue
new file mode 100644
index 00000000..c5efeab9
--- /dev/null
+++ b/apps/web-antd/src/views/system/wx-workbench-entry/components/modal.vue
@@ -0,0 +1,79 @@
+<script lang="ts" setup>
+/**
+ * 小程序工作台功能入口新增/编辑弹窗
+ * theme_color 为虚拟字段：回显时从存库 theme JSON 解析主色，提交时组装回 {bg,color}
+ */
+import { ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+
+import { message } from 'ant-design-vue';
+
+import { useVbenForm } from '#/adapter/form';
+
+import { createWxWorkbenchEntry, updateWxWorkbenchEntry } from '../api';
+import { buildThemeByColor, parseThemeColor } from '../config/constants';
+import { modalFormProps } from '../config/form';
+
+const isUpdate = ref(false);
+const gridApi = ref();
+const [Form, formApi] = useVbenForm(modalFormProps);
+const [Modal, modalApi] = useVbenModal({
+  fullscreenButton: false,
+  draggable: true,
+  onCancel() {
+    modalApi.close();
+  },
+  onConfirm: async () => {
+    const e = await formApi.validate();
+    if (!e.valid) return;
+    const values: Record<string, any> = await formApi.getValues();
+    // 虚拟字段 theme_color → 完整主题对象；未选时不覆盖已有主题
+    const theme = buildThemeByColor(values.theme_color || '');
+    if (theme) {
+      values.theme = theme;
+    }
+    delete values.theme_color;
+    modalApi.setState({ confirmLoading: true });
+    try {
+      const api = isUpdate.value ? updateWxWorkbenchEntry : createWxWorkbenchEntry;
+      await api(values);
+      message.success('保存成功');
+      gridApi.value?.query?.();
+      modalApi.close();
+    } finally {
+      modalApi.setState({ confirmLoading: false });
+    }
+  },
+  onOpenChange(isOpen: boolean) {
+    gridApi.value = isOpen ? modalApi.getData()?.gridApi : null;
+    if (!isOpen) {
+      formApi.resetForm();
+      return;
+    }
+    const { values, update } = modalApi.getData<Record<string, any>>() || {};
+    isUpdate.value = !!update;
+    // 编辑时锁定 code：小程序端按编码映射行为（角标/表单预填/弹窗），改码会导致行为失效
+    formApi.updateSchema([
+      {
+        fieldName: 'code',
+        componentProps: { disabled: !!update },
+      },
+    ]);
+    if (values && update) {
+      formApi.setValues({
+        ...values,
+        theme_color: parseThemeColor(values.theme),
+      });
+    } else {
+      formApi.resetForm();
+      formApi.setValues({ sort: 0, status: 1, icon: 'grid-fill', description: '', path: '' });
+    }
+  },
+});
+</script>
+<template>
+  <Modal :title="`${isUpdate ? '编辑' : '新增'}功能入口`" class="w-[560px]">
+    <Form />
+  </Modal>
+</template>
diff --git a/apps/web-antd/src/views/system/wx-workbench-entry/config/constants.ts b/apps/web-antd/src/views/system/wx-workbench-entry/config/constants.ts
new file mode 100644
index 00000000..f1c2cb29
--- /dev/null
+++ b/apps/web-antd/src/views/system/wx-workbench-entry/config/constants.ts
@@ -0,0 +1,54 @@
+/**
+ * 小程序工作台功能入口字典：常量定义
+ * 主题预设与小程序端 xk-service-card 现用配色一一对应，避免后台随手填出不协调的颜色
+ */
+
+/** 启用状态选项 */
+export const STATUS_OPTIONS = [
+  { label: '启用', value: 1 },
+  { label: '禁用', value: 0 },
+];
+
+/** 主题预设：value 为图标主色，bg 为图标区渐变底（与小程序端现有配色一致） */
+export const THEME_PRESETS = [
+  { label: '橙金', value: '#F97316', bg: 'linear-gradient(135deg, #FFF7ED, #FFEDD5)' },
+  { label: '科技蓝', value: '#3B82F6', bg: 'linear-gradient(135deg, #EFF6FF, #DBEAFE)' },
+  { label: '优雅紫', value: '#A855F7', bg: 'linear-gradient(135deg, #FAF5FF, #F3E8FF)' },
+  { label: '安全绿', value: '#22C55E', bg: 'linear-gradient(135deg, #F0FDF4, #DCFCE7)' },
+  { label: '青色', value: '#06B6D4', bg: 'linear-gradient(135deg, #ECFEFF, #CFFAFE)' },
+  { label: '琥珀', value: '#D97706', bg: 'linear-gradient(135deg, #FFFBEB, #FEF3C7)' },
+  { label: '警戒红', value: '#EF4444', bg: 'linear-gradient(135deg, #FEE2E2, #FECACA)' },
+  { label: '翡翠绿', value: '#10B981', bg: 'linear-gradient(135deg, #ECFDF5, #D1FAE5)' },
+  { label: '天空蓝', value: '#0EA5E9', bg: 'linear-gradient(135deg, #F0F9FF, #E0F2FE)' },
+  { label: '中性灰', value: '#6B7280', bg: 'linear-gradient(135deg, #F3F4F6, #E5E7EB)' },
+];
+
+/** 主题下拉选项（label + value） */
+export const THEME_OPTIONS = THEME_PRESETS.map((item) => ({
+  label: item.label,
+  value: item.value,
+}));
+
+/**
+ * 按主色反查完整主题对象（提交时组装 {bg,color} 存库）
+ */
+export function buildThemeByColor(color: string) {
+  const preset = THEME_PRESETS.find((item) => item.value === color);
+  if (!preset) return null;
+  return { bg: preset.bg, color: preset.value };
+}
+
+/**
+ * 解析存库的 theme（可能是 JSON 字符串或对象），返回主色用于表单回显
+ */
+export function parseThemeColor(theme: any): string {
+  let parsed = theme;
+  if (typeof theme === 'string' && theme) {
+    try {
+      parsed = JSON.parse(theme);
+    } catch {
+      parsed = null;
+    }
+  }
+  return parsed?.color || '';
+}
diff --git a/apps/web-antd/src/views/system/wx-workbench-entry/config/form.ts b/apps/web-antd/src/views/system/wx-workbench-entry/config/form.ts
new file mode 100644
index 00000000..9d234719
--- /dev/null
+++ b/apps/web-antd/src/views/system/wx-workbench-entry/config/form.ts
@@ -0,0 +1,93 @@
+import type { VbenFormProps } from '#/adapter/form';
+
+import { STATUS_OPTIONS, THEME_OPTIONS } from './constants';
+
+/**
+ * 小程序工作台功能入口新增/编辑表单
+ * theme_color 是表单虚拟字段：选主色，提交时由 modal 组装成 {bg,color} JSON 存 theme 列
+ */
+export const modalFormProps: VbenFormProps = {
+  wrapperClass: 'grid-cols-12',
+  commonConfig: {
+    formItemClass: 'col-span-12',
+    componentProps: { class: 'w-full' },
+  },
+  layout: 'horizontal',
+  schema: [
+    {
+      component: 'VbenInput',
+      fieldName: 'id',
+      label: 'ID',
+      dependencies: { show: false, triggerFields: ['id'] },
+    },
+    {
+      component: 'VbenInput',
+      fieldName: 'code',
+      label: '入口编码',
+      rules: 'required',
+      componentProps: {
+        placeholder: 'snake_case 全局唯一，按端加前缀：clinic_admin_ / platform_ / sp_ / cs_',
+      },
+    },
+    {
+      component: 'VbenInput',
+      fieldName: 'name',
+      label: '入口名称',
+      rules: 'required',
+      componentProps: { placeholder: '卡片标题，如：提现管理' },
+    },
+    {
+      component: 'VbenInput',
+      fieldName: 'description',
+      label: '入口描述',
+      componentProps: { placeholder: '卡片副标题，如：提现流水查询' },
+      defaultValue: '',
+    },
+    {
+      component: 'VbenInput',
+      fieldName: 'group_name',
+      label: '分组标题',
+      rules: 'required',
+      componentProps: { placeholder: '首页分区块标题，如：财务管理' },
+    },
+    {
+      component: 'VbenInput',
+      fieldName: 'icon',
+      label: '图标',
+      componentProps: { placeholder: 'uView 图标名，如 red-packet-fill' },
+      defaultValue: 'grid-fill',
+    },
+    {
+      component: 'VbenSelect',
+      fieldName: 'theme_color',
+      label: '主题配色',
+      formItemClass: 'col-span-6',
+      componentProps: { options: THEME_OPTIONS, allowClear: true },
+    },
+    {
+      component: 'InputNumber',
+      fieldName: 'sort',
+      label: '排序',
+      formItemClass: 'col-span-6',
+      componentProps: { min: 0 },
+      defaultValue: 0,
+    },
+    {
+      component: 'VbenInput',
+      fieldName: 'path',
+      label: '跳转路径',
+      componentProps: {
+        placeholder: '小程序页面路径；留空表示前端按编码特殊处理（如传方弹窗）',
+      },
+      defaultValue: '',
+    },
+    {
+      component: 'VbenSelect',
+      fieldName: 'status',
+      label: '状态',
+      componentProps: { options: STATUS_OPTIONS },
+      defaultValue: 1,
+    },
+  ],
+  showDefaultActions: false,
+};
diff --git a/apps/web-antd/src/views/system/wx-workbench-entry/index.vue b/apps/web-antd/src/views/system/wx-workbench-entry/index.vue
new file mode 100644
index 00000000..a4bef5d2
--- /dev/null
+++ b/apps/web-antd/src/views/system/wx-workbench-entry/index.vue
@@ -0,0 +1,200 @@
+<script lang="ts" setup>
+/**
+ * 小程序工作台功能入口字典：维护四个业务角色（诊所管理员/平台管理员/业务员/诊所推广员）
+ * 工作台宫格入口的展示信息（编码/名称/描述/图标/主题/路径/分组），
+ * 角色可见性在「角色管理 → 小程序入口」抽屉里按角色勾选分配
+ */
+import type { VxeGridListeners } from '#/adapter/vxe-table';
+
+import { ref } from 'vue';
+
+import { Page, useVbenModal } from '@vben/common-ui';
+
+import { message } from 'ant-design-vue';
+
+import { useVbenVxeGrid } from '#/adapter/vxe-table';
+import { TableAction } from '#/components/table-action';
+
+import { deleteWxWorkbenchEntry, getWxWorkbenchEntryList } from './api';
+import FormModal from './components/modal.vue';
+import { STATUS_OPTIONS } from './config/constants';
+
+defineOptions({ name: 'WxWorkbenchEntry' });
+
+const hasTopTableDropDownActions = ref(false);
+
+const formOptions = {
+  schema: [
+    {
+      component: 'VbenInput',
+      fieldName: 'code',
+      label: '编码',
+      componentProps: { placeholder: '如 clinic_admin_withdrawal' },
+    },
+    {
+      component: 'VbenInput',
+      fieldName: 'name',
+      label: '名称',
+      componentProps: { placeholder: '入口名称' },
+    },
+    {
+      component: 'VbenInput',
+      fieldName: 'group_name',
+      label: '分组',
+      componentProps: { placeholder: '如 财务管理' },
+    },
+    {
+      component: 'VbenSelect',
+      fieldName: 'status',
+      label: '状态',
+      componentProps: { options: STATUS_OPTIONS, allowClear: true },
+    },
+  ],
+};
+
+const gridOptions = {
+  checkboxConfig: { highlight: true, labelField: '' },
+  columns: [
+    { type: 'checkbox', width: 60 },
+    { field: 'id', title: 'ID', width: 70 },
+    { field: 'code', title: '编码', minWidth: 200 },
+    { field: 'name', title: '名称', minWidth: 120 },
+    { field: 'description', title: '描述', minWidth: 160 },
+    { field: 'group_name', title: '分组', width: 110 },
+    { field: 'icon', title: '图标', width: 140 },
+    { field: 'path', title: '跳转路径', minWidth: 240 },
+    { field: 'sort', title: '排序', width: 70 },
+    { field: 'status', title: '状态', width: 80, slots: { default: 'status' } },
+    { field: 'created_at', title: '创建时间', width: 170 },
+    { title: '操作', slots: { default: 'action' }, width: 130, fixed: 'right' },
+  ],
+  keepSource: true,
+  pagerConfig: {},
+  proxyConfig: {
+    ajax: {
+      query: async ({ page }: any, formValues: any) => {
+        return await getWxWorkbenchEntryList({
+          page: page.currentPage,
+          pageSize: page.pageSize,
+          ...formValues,
+        });
+      },
+    },
+  },
+  height: 'auto',
+  toolbarConfig: {
+    search: true,
+    refresh: true,
+    slots: { buttons: 'toolbar-actions' },
+  },
+};
+
+const gridEvents: VxeGridListeners<any> = {
+  checkboxChange() {
+    hasTopTableDropDownActions.value =
+      gridApi.grid.getCheckboxRecords().length > 0;
+  },
+  checkboxAll() {
+    hasTopTableDropDownActions.value =
+      gridApi.grid.getCheckboxRecords().length > 0;
+  },
+};
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  formOptions,
+  gridOptions: gridOptions as any,
+  gridEvents,
+});
+
+const [FormModalComp, formModalApi] = useVbenModal({
+  connectedComponent: FormModal,
+});
+
+const showModal = (data: any = {}, isUpdate = false) => {
+  formModalApi.setData({
+    values: data,
+    update: isUpdate,
+    gridApi,
+  });
+  formModalApi.open();
+};
+
+const handleDelete = (row: any) => {
+  deleteWxWorkbenchEntry({ ids: [row.id] }).then(() => {
+    message.success('删除成功');
+    gridApi.query();
+  });
+};
+
+const handleBatchDelete = () => {
+  const rows = gridApi.grid.getCheckboxRecords();
+  if (!rows.length) return;
+  deleteWxWorkbenchEntry({ ids: rows.map((r: any) => r.id) }).then(() => {
+    message.success('删除成功');
+    gridApi.query();
+  });
+};
+</script>
+<template>
+  <Page auto-content-height>
+    <FormModalComp />
+    <Grid>
+      <template #toolbar-actions>
+        <TableAction
+          :actions="[
+            {
+              label: '新增',
+              type: 'primary',
+              onClick: () => showModal({}, false),
+            },
+          ]"
+          :drop-down-actions="
+            hasTopTableDropDownActions
+              ? [
+                  {
+                    label: '批量删除',
+                    popConfirm: {
+                      title: '确认删除选中入口？删除后各角色将不再展示',
+                      confirm: handleBatchDelete,
+                    },
+                  },
+                ]
+              : []
+          "
+        />
+      </template>
+      <template #status="{ row }">
+        <span :class="row.status === 1 ? 'entry-status-on' : 'entry-status-off'">
+          {{ row.status === 1 ? '启用' : '禁用' }}
+        </span>
+      </template>
+      <template #action="{ row }">
+        <TableAction
+          :actions="[
+            {
+              label: '编辑',
+              onClick: () => showModal(row, true),
+            },
+            {
+              label: '删除',
+              popConfirm: {
+                title: '确认删除该入口？删除后各角色将不再展示',
+                confirm: () => handleDelete(row),
+              },
+            },
+          ]"
+        />
+      </template>
+    </Grid>
+  </Page>
+</template>
+<style scoped>
+/* 状态文案：主题变量着色，暗色自动适配 */
+.entry-status-on {
+  color: hsl(var(--success, 142 71% 45%));
+}
+
+.entry-status-off {
+  color: hsl(var(--muted-foreground));
+}
+</style>
diff --git a/apps/web-antd/tailwind.config.mjs b/apps/web-antd/tailwind.config.mjs
deleted file mode 100644
index f17f556f..00000000
--- a/apps/web-antd/tailwind.config.mjs
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from '@vben/tailwind-config';
diff --git a/apps/web-antd/tsconfig.json b/apps/web-antd/tsconfig.json
index 02c287fe..858a0ec0 100644
--- a/apps/web-antd/tsconfig.json
+++ b/apps/web-antd/tsconfig.json
@@ -2,7 +2,6 @@
   "$schema": "https://json.schemastore.org/tsconfig",
   "extends": "@vben/tsconfig/web-app.json",
   "compilerOptions": {
-    "baseUrl": ".",
     "paths": {
       "#/*": ["./src/*"]
     }
diff --git a/apps/web-antd/tsconfig.node.json b/apps/web-antd/tsconfig.node.json
index c2f0d86c..36e9fb5f 100644
--- a/apps/web-antd/tsconfig.node.json
+++ b/apps/web-antd/tsconfig.node.json
@@ -6,5 +6,5 @@
     "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.node.tsbuildinfo",
     "noEmit": false
   },
-  "include": ["vite.config.mts"]
+  "include": ["vite.config.ts"]
 }
diff --git a/apps/web-antd/vite.config.mts b/apps/web-antd/vite.config.ts
similarity index 89%
rename from apps/web-antd/vite.config.mts
rename to apps/web-antd/vite.config.ts
index f5ea5344..699fc9a7 100644
--- a/apps/web-antd/vite.config.mts
+++ b/apps/web-antd/vite.config.ts
@@ -4,6 +4,12 @@ export default defineConfig(async () => {
   return {
     application: {},
     vite: {
+      optimizeDeps: {
+        exclude: [
+          '@vben/plugins/echarts',
+          'echarts',
+        ],
+      },
       server: {
         proxy: {
           '/api': {
diff --git a/apps/web-antdv-next/.env b/apps/web-antdv-next/.env
new file mode 100644
index 00000000..40b046d2
--- /dev/null
+++ b/apps/web-antdv-next/.env
@@ -0,0 +1,8 @@
+# 应用标题
+VITE_APP_TITLE=Vben Admin Antdv Next
+
+# 应用命名空间，用于缓存、store等功能的前缀，确保隔离
+VITE_APP_NAMESPACE=vben-web-antdv-next
+
+# 对store进行加密的密钥，在将store持久化到localStorage时会使用该密钥进行加密
+VITE_APP_STORE_SECURE_KEY=please-replace-me-with-your-own-key
diff --git a/apps/web-antdv-next/.env.analyze b/apps/web-antdv-next/.env.analyze
new file mode 100644
index 00000000..ffafa8dd
--- /dev/null
+++ b/apps/web-antdv-next/.env.analyze
@@ -0,0 +1,7 @@
+# public path
+VITE_BASE=/
+
+# Basic interface address SPA
+VITE_GLOB_API_URL=/api
+
+VITE_VISUALIZER=true
diff --git a/apps/web-antdv-next/.env.development b/apps/web-antdv-next/.env.development
new file mode 100644
index 00000000..f2b44428
--- /dev/null
+++ b/apps/web-antdv-next/.env.development
@@ -0,0 +1,16 @@
+# 端口号
+VITE_PORT=5999
+
+VITE_BASE=/
+
+# 接口地址
+VITE_GLOB_API_URL=/api
+
+# 是否开启 Nitro Mock服务，true 为开启，false 为关闭
+VITE_NITRO_MOCK=true
+
+# 是否打开 devtools，true 为打开，false 为关闭
+VITE_DEVTOOLS=false
+
+# 是否注入全局loading
+VITE_INJECT_APP_LOADING=true
diff --git a/apps/web-antdv-next/.env.production b/apps/web-antdv-next/.env.production
new file mode 100644
index 00000000..5375847a
--- /dev/null
+++ b/apps/web-antdv-next/.env.production
@@ -0,0 +1,19 @@
+VITE_BASE=/
+
+# 接口地址
+VITE_GLOB_API_URL=https://mock-napi.vben.pro/api
+
+# 是否开启压缩，可以设置为 none, brotli, gzip
+VITE_COMPRESS=none
+
+# 是否开启 PWA
+VITE_PWA=false
+
+# vue-router 的模式
+VITE_ROUTER_HISTORY=hash
+
+# 是否注入全局loading
+VITE_INJECT_APP_LOADING=true
+
+# 打包后是否生成dist.zip
+VITE_ARCHIVER=true
diff --git a/apps/web-antdv-next/index.html b/apps/web-antdv-next/index.html
new file mode 100644
index 00000000..e3b9ae5c
--- /dev/null
+++ b/apps/web-antdv-next/index.html
@@ -0,0 +1,35 @@
+<!doctype html>
+<html lang="zh">
+  <head>
+    <meta charset="UTF-8" />
+    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
+    <meta name="renderer" content="webkit" />
+    <meta name="description" content="A Modern Back-end Management System" />
+    <meta name="keywords" content="Vben Admin Vue3 Vite" />
+    <meta name="author" content="Vben" />
+    <meta
+      name="viewport"
+      content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=0"
+    />
+    <!-- 由 vite 注入 VITE_APP_TITLE 变量，在 .env 文件内配置 -->
+    <title>%VITE_APP_TITLE%</title>
+    <link rel="icon" href="/favicon.ico" />
+    <script>
+      // 生产环境下注入百度统计
+      if (window._VBEN_ADMIN_PRO_APP_CONF_) {
+        var _hmt = _hmt || [];
+        (function () {
+          var hm = document.createElement('script');
+          hm.src =
+            'https://hm.baidu.com/hm.js?b38e689f40558f20a9a686d7f6f33edf';
+          var s = document.getElementsByTagName('script')[0];
+          s.parentNode.insertBefore(hm, s);
+        })();
+      }
+    </script>
+  </head>
+  <body>
+    <div id="app"></div>
+    <script type="module" src="/src/main.ts"></script>
+  </body>
+</html>
diff --git a/apps/web-antdv-next/package.json b/apps/web-antdv-next/package.json
new file mode 100644
index 00000000..928084d9
--- /dev/null
+++ b/apps/web-antdv-next/package.json
@@ -0,0 +1,50 @@
+{
+  "name": "@vben/web-antdv-next",
+  "version": "5.7.0",
+  "homepage": "https://vben.pro",
+  "bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/vbenjs/vue-vben-admin.git",
+    "directory": "apps/web-antdv-next"
+  },
+  "license": "MIT",
+  "author": {
+    "name": "vben",
+    "email": "ann.vben@gmail.com",
+    "url": "https://github.com/anncwb"
+  },
+  "type": "module",
+  "scripts": {
+    "build": "pnpm vite build --mode production",
+    "build:analyze": "pnpm vite build --mode analyze",
+    "dev": "pnpm vite --mode development",
+    "preview": "vite preview",
+    "typecheck": "vue-tsc --noEmit --skipLibCheck"
+  },
+  "imports": {
+    "#/*": "./src/*"
+  },
+  "dependencies": {
+    "@vben/access": "workspace:*",
+    "@vben/common-ui": "workspace:*",
+    "@vben/constants": "workspace:*",
+    "@vben/hooks": "workspace:*",
+    "@vben/icons": "workspace:*",
+    "@vben/layouts": "workspace:*",
+    "@vben/locales": "workspace:*",
+    "@vben/plugins": "workspace:*",
+    "@vben/preferences": "workspace:*",
+    "@vben/request": "workspace:*",
+    "@vben/stores": "workspace:*",
+    "@vben/styles": "workspace:*",
+    "@vben/types": "workspace:*",
+    "@vben/utils": "workspace:*",
+    "@vueuse/core": "catalog:",
+    "antdv-next": "catalog:",
+    "dayjs": "catalog:",
+    "pinia": "catalog:",
+    "vue": "catalog:",
+    "vue-router": "catalog:"
+  }
+}
diff --git a/apps/web-antdv-next/public/favicon.ico b/apps/web-antdv-next/public/favicon.ico
new file mode 100644
index 00000000..fcf9818e
Binary files /dev/null and b/apps/web-antdv-next/public/favicon.ico differ
diff --git a/apps/web-antdv-next/src/adapter/component/index.ts b/apps/web-antdv-next/src/adapter/component/index.ts
new file mode 100644
index 00000000..6f40a6a4
--- /dev/null
+++ b/apps/web-antdv-next/src/adapter/component/index.ts
@@ -0,0 +1,787 @@
+/**
+ * 通用组件共同的使用的基础组件，原先放在 adapter/form 内部，限制了使用范围，这里提取出来，方便其他地方使用
+ * 可用于 vben-form、vben-modal、vben-drawer 等组件使用,
+ */
+
+/* eslint-disable vue/one-component-per-file */
+
+import type {
+  AutoCompleteProps,
+  ButtonProps,
+  CascaderProps,
+  CheckboxGroupProps,
+  CheckboxProps,
+  DatePickerProps,
+  DividerProps,
+  InputNumberProps,
+  InputProps,
+  MentionsProps,
+  RadioGroupProps,
+  RadioProps,
+  RangePickerProps,
+  RateProps,
+  SelectProps,
+  SpaceProps,
+  SwitchProps,
+  TextAreaProps,
+  TimePickerProps,
+  TreeSelectProps,
+  UploadChangeParam,
+  UploadFile,
+  UploadProps,
+} from 'antdv-next';
+
+import type { Component, Ref } from 'vue';
+
+import type {
+  ApiComponentSharedProps,
+  BaseFormComponentType,
+  CollapsibleParamsProps,
+  IconPickerProps,
+} from '@vben/common-ui';
+import type { Sortable } from '@vben/hooks';
+import type { TipTapProps } from '@vben/plugins/tiptap';
+import type { Recordable } from '@vben/types';
+
+import {
+  computed,
+  defineAsyncComponent,
+  defineComponent,
+  h,
+  nextTick,
+  onMounted,
+  onUnmounted,
+  ref,
+  render,
+  unref,
+  watch,
+} from 'vue';
+
+import {
+  ApiComponent,
+  globalShareState,
+  IconPicker,
+  VbenCollapsibleParams,
+  VCropper,
+} from '@vben/common-ui';
+import { useSortable } from '@vben/hooks';
+import { IconifyIcon } from '@vben/icons';
+import { $t } from '@vben/locales';
+import { VbenTiptap } from '@vben/plugins/tiptap';
+import { isEmpty } from '@vben/utils';
+
+import { message, Modal, notification } from 'antdv-next';
+
+import { upload_file } from '#/api';
+type AdapterUploadProps = UploadProps & {
+  aspectRatio?: string;
+  crop?: boolean;
+  draggable?: boolean;
+  handleChange?: (event: UploadChangeParam) => void;
+  maxSize?: number;
+  onDragSort?: (oldIndex: number, newIndex: number) => void;
+  onHandleChange?: (event: UploadChangeParam) => void;
+};
+
+const AutoComplete = defineAsyncComponent(
+  () => import('antdv-next/dist/auto-complete/index'),
+);
+const Button = defineAsyncComponent(
+  () => import('antdv-next/dist/button/index'),
+);
+const Checkbox = defineAsyncComponent(
+  () => import('antdv-next/dist/checkbox/index'),
+);
+const CheckboxGroup = defineAsyncComponent(() =>
+  import('antdv-next/dist/checkbox/index').then((res) => res.CheckboxGroup),
+);
+const DatePicker = defineAsyncComponent(
+  () => import('antdv-next/dist/date-picker/index'),
+);
+const Divider = defineAsyncComponent(
+  () => import('antdv-next/dist/divider/index'),
+);
+const Input = defineAsyncComponent(() => import('antdv-next/dist/input/index'));
+const InputNumber = defineAsyncComponent(
+  () => import('antdv-next/dist/input-number/index'),
+);
+const InputPassword = defineAsyncComponent(() =>
+  import('antdv-next/dist/input/index').then((res) => res.InputPassword),
+);
+const Mentions = defineAsyncComponent(
+  () => import('antdv-next/dist/mentions/index'),
+);
+const Radio = defineAsyncComponent(() => import('antdv-next/dist/radio/index'));
+const RadioGroup = defineAsyncComponent(() =>
+  import('antdv-next/dist/radio/index').then((res) => res.RadioGroup),
+);
+const RangePicker = defineAsyncComponent(() =>
+  import('antdv-next/dist/date-picker/index').then(
+    (res) => res.DateRangePicker,
+  ),
+);
+const Rate = defineAsyncComponent(() => import('antdv-next/dist/rate/index'));
+const Select = defineAsyncComponent(
+  () => import('antdv-next/dist/select/index'),
+);
+const Space = defineAsyncComponent(() => import('antdv-next/dist/space/index'));
+const Switch = defineAsyncComponent(
+  () => import('antdv-next/dist/switch/index'),
+);
+const Textarea = defineAsyncComponent(
+  () => import('antdv-next/dist/input/TextArea'),
+);
+const TimePicker = defineAsyncComponent(
+  () => import('antdv-next/dist/time-picker/index'),
+);
+const TreeSelect = defineAsyncComponent(
+  () => import('antdv-next/dist/tree-select/index'),
+);
+const Cascader = defineAsyncComponent(
+  () => import('antdv-next/dist/cascader/index'),
+);
+const Upload = defineAsyncComponent(
+  () => import('antdv-next/dist/upload/index'),
+);
+const Image = defineAsyncComponent(() => import('antdv-next/dist/image/index'));
+const PreviewGroup = defineAsyncComponent(() =>
+  import('antdv-next/dist/image/index').then((res) => res.ImagePreviewGroup),
+);
+
+const withDefaultPlaceholder = (
+  component: Component,
+  type: 'input' | 'select',
+  componentProps: Recordable<any> = {},
+) => {
+  return defineComponent({
+    name: component.name,
+    inheritAttrs: false,
+    setup: (props: any, { attrs, expose, slots }) => {
+      const placeholder =
+        props?.placeholder ||
+        attrs?.placeholder ||
+        $t(`ui.placeholder.${type}`);
+      // 透传组件暴露的方法
+      const innerRef = ref();
+      expose(
+        new Proxy(
+          {},
+          {
+            get: (_target, key) => innerRef.value?.[key],
+            has: (_target, key) => key in (innerRef.value || {}),
+          },
+        ),
+      );
+      return () =>
+        h(
+          component,
+          { ...componentProps, placeholder, ...props, ...attrs, ref: innerRef },
+          slots,
+        );
+    },
+  });
+};
+
+const IMAGE_EXTENSIONS = new Set([
+  'bmp',
+  'gif',
+  'jpeg',
+  'jpg',
+  'png',
+  'svg',
+  'webp',
+]);
+
+/**
+ * 检查是否为图片文件
+ */
+function isImageFile(file: UploadFile): boolean {
+  if (file.url) {
+    try {
+      const pathname = new URL(file.url, 'http://localhost').pathname;
+      const ext = pathname.split('.').pop()?.toLowerCase();
+      return ext ? IMAGE_EXTENSIONS.has(ext) : false;
+    } catch {
+      const ext = file.url?.split('.').pop()?.toLowerCase();
+      return ext ? IMAGE_EXTENSIONS.has(ext) : false;
+    }
+  }
+  if (!file.type) {
+    const ext = file.name?.split('.').pop()?.toLowerCase();
+    return ext ? IMAGE_EXTENSIONS.has(ext) : false;
+  }
+  return file.type.startsWith('image/');
+}
+
+/**
+ * 创建默认的上传按钮插槽
+ */
+function createDefaultUploadSlots(listType: string, placeholder: string) {
+  if (listType === 'picture-card') {
+    return { default: () => placeholder };
+  }
+  return {
+    default: () =>
+      h(
+        Button,
+        {
+          icon: h(IconifyIcon, {
+            icon: 'ant-design:upload-outlined',
+            class: 'mb-1 size-4',
+          }),
+        },
+        () => placeholder,
+      ),
+  };
+}
+
+/**
+ * 获取文件的 Base64
+ */
+function getBase64(file: File): Promise<string> {
+  return new Promise((resolve, reject) => {
+    const reader = new FileReader();
+    reader.readAsDataURL(file);
+    reader.addEventListener('load', () => resolve(reader.result as string));
+    reader.addEventListener('error', reject);
+  });
+}
+
+/**
+ * 预览图片
+ */
+async function previewImage(
+  file: UploadFile,
+  open: Ref<boolean>,
+  fileList: Ref<UploadProps['fileList']>,
+) {
+  // 非图片文件直接打开链接
+  if (!isImageFile(file)) {
+    const url = file.url || file.preview;
+    if (url) {
+      window.open(url, '_blank');
+    } else if (file.preview) {
+      window.open(file.preview, '_blank');
+    } else {
+      message.error($t('ui.formRules.previewWarning'));
+    }
+    return;
+  }
+
+  const [ImageComponent, PreviewGroupComponent] = await Promise.all([
+    Image,
+    PreviewGroup,
+  ]);
+
+  // 过滤图片文件并生成预览
+  const imageFiles = (unref(fileList) || []).filter((f) => isImageFile(f));
+
+  for (const imgFile of imageFiles) {
+    if (!imgFile.url && !imgFile.preview && imgFile.originFileObj) {
+      imgFile.preview = await getBase64(imgFile.originFileObj);
+    }
+  }
+
+  const container = document.createElement('div');
+  document.body.append(container);
+  let isUnmounted = false;
+
+  const currentIndex = imageFiles.findIndex((f) => f.uid === file.uid);
+
+  const PreviewWrapper = {
+    setup() {
+      return () => {
+        if (isUnmounted) return null;
+        return h(
+          PreviewGroupComponent,
+          {
+            classes: { popup: { root: '!z-2000' } },
+            preview: {
+              open: open.value,
+              current: currentIndex,
+              onOpenChange: (value: boolean) => {
+                open.value = value;
+                if (!value) {
+                  setTimeout(() => {
+                    if (!isUnmounted && container) {
+                      isUnmounted = true;
+                      render(null, container);
+                      container.remove();
+                    }
+                  }, 300);
+                }
+              },
+            },
+          },
+          () =>
+            imageFiles.map((imgFile) =>
+              h(ImageComponent, {
+                key: imgFile.uid,
+                src: imgFile.url || imgFile.preview,
+              }),
+            ),
+        );
+      };
+    },
+  };
+
+  render(h(PreviewWrapper), container);
+}
+
+/**
+ * 图片裁剪操作
+ */
+function cropImage(file: File, aspectRatio: string | undefined) {
+  return new Promise<Blob | string | undefined>((resolve, reject) => {
+    const container = document.createElement('div');
+    document.body.append(container);
+
+    let isUnmounted = false;
+    let objectUrl: null | string = null;
+
+    const open = ref<boolean>(true);
+    const cropperRef = ref<InstanceType<typeof VCropper> | null>(null);
+
+    function closeModal() {
+      open.value = false;
+      setTimeout(() => {
+        if (!isUnmounted && container) {
+          if (objectUrl) {
+            URL.revokeObjectURL(objectUrl);
+          }
+          isUnmounted = true;
+          render(null, container);
+          container.remove();
+        }
+      }, 300);
+    }
+
+    const CropperWrapper = {
+      setup() {
+        return () => {
+          if (isUnmounted) return null;
+          if (!objectUrl) {
+            objectUrl = URL.createObjectURL(file);
+          }
+          return h(
+            Modal,
+            {
+              open: open.value,
+              title: h('div', {}, [
+                $t('ui.crop.title'),
+                h(
+                  'span',
+                  {
+                    class: `${aspectRatio ? '' : 'hidden'} ml-2 text-sm text-gray-400 font-normal`,
+                  },
+                  $t('ui.crop.titleTip', [aspectRatio]),
+                ),
+              ]),
+              centered: true,
+              width: 548,
+              zIndex: 9999,
+              keyboard: false,
+              maskClosable: false,
+              closable: false,
+              cancelText: $t('common.cancel'),
+              okText: $t('ui.crop.confirm'),
+              destroyOnHidden: true,
+              onOk: async () => {
+                const cropper = cropperRef.value;
+                if (!cropper) {
+                  reject(new Error('Cropper not found'));
+                  closeModal();
+                  return;
+                }
+                try {
+                  const dataUrl = await cropper.getCropImage();
+                  if (dataUrl) {
+                    resolve(dataUrl);
+                  } else {
+                    reject(new Error($t('ui.crop.errorTip')));
+                  }
+                } catch {
+                  reject(new Error($t('ui.crop.errorTip')));
+                } finally {
+                  closeModal();
+                }
+              },
+              onCancel() {
+                resolve('');
+                closeModal();
+              },
+            },
+            () =>
+              h(VCropper, {
+                ref: (ref: any) => (cropperRef.value = ref),
+                img: objectUrl as string,
+                aspectRatio,
+              }),
+          );
+        };
+      },
+    };
+
+    render(h(CropperWrapper), container);
+  });
+}
+
+/**
+ * 带预览功能的上传组件
+ */
+function withPreviewUpload() {
+  return defineComponent({
+    name: Upload.name,
+    emits: ['update:modelValue'],
+    setup(
+      props: any,
+      { attrs, slots, emit }: { attrs: any; emit: any; slots: any },
+    ) {
+      const previewVisible = ref<boolean>(false);
+      const placeholder = attrs?.placeholder || $t('ui.placeholder.upload');
+      const listType = attrs?.listType || attrs?.['list-type'] || 'text';
+      const fileList = ref<UploadProps['fileList']>(
+        attrs?.fileList || attrs?.['file-list'] || [],
+      );
+
+      const maxSize = computed(() => attrs?.maxSize ?? attrs?.['max-size']);
+      const aspectRatio = computed(
+        () => attrs?.aspectRatio ?? attrs?.['aspect-ratio'],
+      );
+
+      async function handleBeforeUpload(
+        file: UploadFile,
+        originFileList: Array<File>,
+      ) {
+        // 文件大小限制
+        if (maxSize.value && (file.size || 0) / 1024 / 1024 > maxSize.value) {
+          message.error($t('ui.formRules.sizeLimit', [maxSize.value]));
+          file.status = 'removed';
+          return false;
+        }
+
+        // 图片裁剪处理
+        if (
+          attrs.crop &&
+          !attrs.multiple &&
+          originFileList[0] &&
+          isImageFile(file)
+        ) {
+          file.status = 'removed';
+          const blob = await cropImage(originFileList[0], aspectRatio.value);
+          if (!blob) {
+            throw new Error($t('ui.crop.errorTip'));
+          }
+          return blob;
+        }
+
+        return attrs.beforeUpload?.(file) ?? true;
+      }
+
+      function handleChange(event: UploadChangeParam) {
+        try {
+          attrs.handleChange?.(event);
+          attrs.onHandleChange?.(event);
+        } catch (error) {
+          console.error(error);
+        }
+        fileList.value = event.fileList.filter(
+          (file) => file.status !== 'removed',
+        );
+        emit(
+          'update:modelValue',
+          event.fileList?.length ? fileList.value : undefined,
+        );
+      }
+
+      function handlePreview(file: UploadFile) {
+        previewVisible.value = true;
+        return previewImage(file, previewVisible, fileList);
+      }
+
+      function renderUploadButton() {
+        if (attrs.disabled) return null;
+        return isEmpty(slots)
+          ? createDefaultUploadSlots(listType, placeholder)
+          : slots;
+      }
+
+      // 拖拽排序
+      const draggable = computed(
+        () => (attrs.draggable ?? false) && !attrs.disabled,
+      );
+      const uploadId = `upload-${Date.now()}-${Math.random().toString(36).slice(2, 9)}`;
+      const sortableInstance = ref<null | Sortable>(null);
+
+      const styleId = `upload-drag-style-${uploadId}`;
+
+      function injectDragStyle() {
+        if (!document.querySelector(`[id="${styleId}"]`)) {
+          const style = document.createElement('style');
+          style.id = styleId;
+          style.textContent = `
+            [data-upload-id="${uploadId}"] .ant-upload-list-item { cursor: move; }
+            [data-upload-id="${uploadId}"] .ant-upload-list-item:hover { box-shadow: 0 2px 8px rgba(0,0,0,0.15); }
+          `;
+          document.head.append(style);
+        }
+      }
+
+      function removeDragStyle() {
+        document.querySelector(`[id="${styleId}"]`)?.remove();
+      }
+
+      async function initSortable(retryCount = 0) {
+        if (!draggable.value) return;
+
+        injectDragStyle();
+        await nextTick();
+        await new Promise((resolve) => setTimeout(resolve, 100));
+
+        const container = document.querySelector(
+          `[data-upload-id="${uploadId}"] .ant-upload-list`,
+        ) as HTMLElement;
+
+        if (!container) {
+          if (retryCount < 5) {
+            setTimeout(() => initSortable(retryCount + 1), 200);
+          }
+          return;
+        }
+
+        const { initializeSortable } = useSortable(container, {
+          animation: 300,
+          delay: 400,
+          delayOnTouchOnly: true,
+          filter:
+            '.ant-upload-select, .ant-upload-list-item-error, .ant-upload-list-item-uploading',
+          onEnd: (evt) => {
+            const { oldIndex, newIndex } = evt;
+            if (
+              oldIndex === undefined ||
+              newIndex === undefined ||
+              oldIndex === newIndex
+            ) {
+              return;
+            }
+
+            const list = [...(fileList.value || [])];
+            const [movedItem] = list.splice(oldIndex, 1);
+            if (movedItem) {
+              list.splice(newIndex, 0, movedItem);
+              fileList.value = list;
+            }
+
+            attrs.onDragSort?.(oldIndex, newIndex);
+            emit('update:modelValue', fileList.value);
+          },
+        });
+
+        sortableInstance.value = await initializeSortable();
+      }
+
+      // 监听表单值变化
+      watch(
+        () => attrs.modelValue,
+        (res) => {
+          fileList.value = res;
+        },
+      );
+
+      onMounted(initSortable);
+      onUnmounted(() => {
+        sortableInstance.value?.destroy();
+        removeDragStyle();
+      });
+
+      return () =>
+        h(
+          'div',
+          { 'data-upload-id': uploadId, class: 'w-full' },
+          h(
+            Upload,
+            {
+              ...props,
+              ...attrs,
+              fileList: fileList.value,
+              beforeUpload: handleBeforeUpload,
+              onChange: handleChange,
+              onPreview: handlePreview,
+            },
+            renderUploadButton() as any,
+          ),
+        );
+    },
+  });
+}
+
+// 这里需要自行根据业务组件库进行适配，需要用到的组件都需要在这里类型说明
+export type ComponentType =
+  | 'ApiCascader'
+  | 'ApiSelect'
+  | 'ApiTreeSelect'
+  | 'AutoComplete'
+  | 'Cascader'
+  | 'Checkbox'
+  | 'CheckboxGroup'
+  | 'CollapsibleParams'
+  | 'DatePicker'
+  | 'DefaultButton'
+  | 'Divider'
+  | 'IconPicker'
+  | 'Input'
+  | 'InputNumber'
+  | 'InputPassword'
+  | 'Mentions'
+  | 'PrimaryButton'
+  | 'Radio'
+  | 'RadioGroup'
+  | 'RangePicker'
+  | 'Rate'
+  | 'RichEditor'
+  | 'Select'
+  | 'Space'
+  | 'Switch'
+  | 'Textarea'
+  | 'TimePicker'
+  | 'TreeSelect'
+  | 'Upload'
+  | BaseFormComponentType;
+
+/**
+ * 与 {@link ComponentType} 中注册的组件名一一对应，便于 Schema 上 `component` + `componentProps` 联动提示
+ */
+export interface ComponentPropsMap {
+  ApiCascader: ApiComponentSharedProps & CascaderProps;
+  ApiSelect: ApiComponentSharedProps & SelectProps;
+  ApiTreeSelect: ApiComponentSharedProps & TreeSelectProps;
+  AutoComplete: AutoCompleteProps;
+  Cascader: CascaderProps;
+  Checkbox: CheckboxProps;
+  CheckboxGroup: CheckboxGroupProps;
+  CollapsibleParams: CollapsibleParamsProps;
+  DatePicker: DatePickerProps;
+  DefaultButton: ButtonProps;
+  Divider: DividerProps;
+  IconPicker: IconPickerProps;
+  Input: InputProps;
+  InputNumber: InputNumberProps;
+  InputPassword: InputProps;
+  Mentions: MentionsProps;
+  PrimaryButton: ButtonProps;
+  Radio: RadioProps;
+  RadioGroup: RadioGroupProps;
+  RangePicker: RangePickerProps;
+  Rate: RateProps;
+  RichEditor: TipTapProps;
+  Select: SelectProps;
+  Space: SpaceProps;
+  Switch: SwitchProps;
+  Textarea: TextAreaProps;
+  TimePicker: TimePickerProps;
+  TreeSelect: TreeSelectProps;
+  Upload: AdapterUploadProps;
+}
+
+async function initComponentAdapter() {
+  const components: Partial<Record<ComponentType, Component>> = {
+    // 如果你的组件体积比较大，可以使用异步加载
+    // Button: () =>
+    // import('xxx').then((res) => res.Button),
+
+    ApiCascader: withDefaultPlaceholder(ApiComponent, 'select', {
+      component: Cascader,
+      fieldNames: { label: 'label', value: 'value', children: 'children' },
+      loadingSlot: 'suffixIcon',
+      modelPropName: 'value',
+      visibleEvent: 'onOpenChange',
+    }),
+    ApiSelect: withDefaultPlaceholder(ApiComponent, 'select', {
+      component: Select,
+      loadingSlot: 'suffixIcon',
+      modelPropName: 'value',
+      visibleEvent: 'onOpenChange',
+    }),
+    ApiTreeSelect: withDefaultPlaceholder(ApiComponent, 'select', {
+      component: TreeSelect,
+      fieldNames: { label: 'label', value: 'value', children: 'children' },
+      loadingSlot: 'suffixIcon',
+      modelPropName: 'value',
+      optionsPropName: 'treeData',
+      visibleEvent: 'onOpenChange',
+    }),
+    AutoComplete,
+    Cascader,
+    Checkbox,
+    CheckboxGroup,
+    DatePicker,
+    // 自定义默认按钮
+    DefaultButton: (props, { attrs, slots }) => {
+      return h(Button, { ...props, attrs, type: 'default' }, slots);
+    },
+    Divider,
+    IconPicker: withDefaultPlaceholder(IconPicker, 'select', {
+      iconSlot: 'addonAfter',
+      inputComponent: Input,
+      modelValueProp: 'value',
+    }),
+    Input: withDefaultPlaceholder(Input, 'input'),
+    InputNumber: withDefaultPlaceholder(InputNumber, 'input'),
+    InputPassword: withDefaultPlaceholder(InputPassword, 'input'),
+    Mentions: withDefaultPlaceholder(Mentions, 'input'),
+    // 自定义主要按钮
+    PrimaryButton: (props, { attrs, slots }) => {
+      return h(Button, { ...props, attrs, type: 'primary' }, slots);
+    },
+    Radio,
+    RadioGroup,
+    RangePicker,
+    Rate,
+    RichEditor: withDefaultPlaceholder(VbenTiptap, 'input', {
+      imageUpload: {
+        upload: (file: any, onProgress: any) => {
+          return new Promise((resolve, reject) => {
+            upload_file({
+              file,
+              onProgress({ percent }) {
+                onProgress?.(percent);
+              },
+              onSuccess(response) {
+                // 从响应中提取图片URL
+                resolve(response?.data?.url ?? response?.url ?? '');
+              },
+              onError() {
+                reject(new Error($t('ui.tiptap.upload.uploadFailed')));
+              },
+            });
+          });
+        },
+      },
+    }),
+    Select: withDefaultPlaceholder(Select, 'select'),
+    Space,
+    Switch,
+    Textarea: withDefaultPlaceholder(Textarea, 'input'),
+    TimePicker,
+    TreeSelect: withDefaultPlaceholder(TreeSelect, 'select'),
+    Upload: withPreviewUpload(),
+    CollapsibleParams: VbenCollapsibleParams,
+  };
+
+  // 将组件注册到全局共享状态中
+  globalShareState.setComponents(components);
+
+  // 定义全局共享状态中的消息提示
+  globalShareState.defineMessage({
+    // 复制成功消息提示
+    copyPreferencesSuccess: (title, content) => {
+      notification.success({
+        description: content,
+        title,
+        placement: 'bottomRight',
+      });
+    },
+  });
+}
+
+export { initComponentAdapter };
diff --git a/apps/web-antdv-next/src/adapter/form.ts b/apps/web-antdv-next/src/adapter/form.ts
new file mode 100644
index 00000000..9bbfd5c1
--- /dev/null
+++ b/apps/web-antdv-next/src/adapter/form.ts
@@ -0,0 +1,67 @@
+import type {
+  VbenFormProps as FormProps,
+  VbenFormSchema as FormSchema,
+  FormValues,
+} from '@vben/common-ui';
+
+import type { ComponentPropsMap, ComponentType } from './component';
+
+import { setupVbenForm, useVbenForm as useForm, z } from '@vben/common-ui';
+import { $t } from '@vben/locales';
+
+async function initSetupVbenForm() {
+  setupVbenForm<ComponentType>({
+    config: {
+      // ant design vue组件库默认都是 v-model:value
+      baseModelPropName: 'value',
+
+      // 一些组件是 v-model:checked 或者 v-model:fileList
+      modelPropNameMap: {
+        Checkbox: 'checked',
+        Radio: 'checked',
+        Switch: 'checked',
+        Upload: 'fileList',
+      },
+    },
+    rules: {
+      // 输入项目必填国际化适配
+      required: (value, _params, ctx) => {
+        if (value === undefined || value === null || value.length === 0) {
+          return $t('ui.formRules.required', [ctx.label]);
+        }
+        return true;
+      },
+      // 选择项目必填国际化适配
+      selectRequired: (value, _params, ctx) => {
+        if (value === undefined || value === null) {
+          return $t('ui.formRules.selectRequired', [ctx.label]);
+        }
+        return true;
+      },
+    },
+  });
+}
+function useVbenForm<
+  TFormValues extends FormValues = FormValues,
+  TSubmitValues extends FormValues = TFormValues,
+>(
+  options: FormProps<
+    ComponentType,
+    ComponentPropsMap,
+    TFormValues,
+    TSubmitValues
+  >,
+) {
+  return useForm<TFormValues, ComponentType, ComponentPropsMap, TSubmitValues>(
+    options,
+  );
+}
+
+export { initSetupVbenForm, useVbenForm, z };
+
+export type VbenFormSchema<TValues extends FormValues = FormValues> =
+  FormSchema<ComponentType, ComponentPropsMap, TValues>;
+export type VbenFormProps<
+  TFormValues extends FormValues = FormValues,
+  TSubmitValues extends FormValues = TFormValues,
+> = FormProps<ComponentType, ComponentPropsMap, TFormValues, TSubmitValues>;
diff --git a/apps/web-antdv-next/src/adapter/vxe-table.ts b/apps/web-antdv-next/src/adapter/vxe-table.ts
new file mode 100644
index 00000000..5f492158
--- /dev/null
+++ b/apps/web-antdv-next/src/adapter/vxe-table.ts
@@ -0,0 +1,93 @@
+import type { FormValues } from '@vben/common-ui';
+import type { VxeTableGridOptions } from '@vben/plugins/vxe-table';
+
+import type { ComponentPropsMap, ComponentType } from './component';
+
+import { h } from 'vue';
+
+import {
+  setupVbenVxeTable,
+  useVbenVxeGrid as useGrid,
+} from '@vben/plugins/vxe-table';
+
+import { Button, Image } from 'antdv-next';
+
+import { useVbenForm } from './form';
+
+setupVbenVxeTable({
+  configVxeTable: (vxeUI) => {
+    vxeUI.setConfig({
+      grid: {
+        align: 'center',
+        border: false,
+        columnConfig: {
+          resizable: true,
+        },
+        minHeight: 180,
+        formConfig: {
+          // 全局禁用vxe-table的表单配置，使用formOptions
+          enabled: false,
+        },
+        proxyConfig: {
+          autoLoad: true,
+          response: {
+            result: 'items',
+            total: 'total',
+            list: 'items',
+          },
+          showActiveMsg: true,
+          showResponseMsg: false,
+        },
+        round: true,
+        showOverflow: true,
+        size: 'small',
+      } as VxeTableGridOptions,
+    });
+
+    // 表格配置项可以用 cellRender: { name: 'CellImage' },
+    vxeUI.renderer.add('CellImage', {
+      renderTableDefault(renderOpts, params) {
+        const { props } = renderOpts;
+        const { column, row } = params;
+        return h(Image, { src: row[column.field], ...props });
+      },
+    });
+
+    // 表格配置项可以用 cellRender: { name: 'CellLink' },
+    vxeUI.renderer.add('CellLink', {
+      renderTableDefault(renderOpts) {
+        const { props } = renderOpts;
+        return h(
+          Button,
+          { size: 'small', type: 'link' },
+          { default: () => props?.text },
+        );
+      },
+    });
+
+    // 这里可以自行扩展 vxe-table 的全局配置，比如自定义格式化
+    // vxeUI.formats.add
+  },
+  useVbenForm,
+});
+
+export const useVbenVxeGrid = <
+  T extends Record<string, any>,
+  TFormValues extends FormValues = FormValues,
+  TSubmitValues extends FormValues = TFormValues,
+>(
+  ...rest: Parameters<
+    typeof useGrid<
+      T,
+      ComponentType,
+      ComponentPropsMap,
+      TFormValues,
+      TSubmitValues
+    >
+  >
+) =>
+  useGrid<T, ComponentType, ComponentPropsMap, TFormValues, TSubmitValues>(
+    ...rest,
+  );
+
+export type * from '@vben/plugins/vxe-table';
diff --git a/apps/web-antdv-next/src/api/core/auth.ts b/apps/web-antdv-next/src/api/core/auth.ts
new file mode 100644
index 00000000..71d9f994
--- /dev/null
+++ b/apps/web-antdv-next/src/api/core/auth.ts
@@ -0,0 +1,51 @@
+import { baseRequestClient, requestClient } from '#/api/request';
+
+export namespace AuthApi {
+  /** 登录接口参数 */
+  export interface LoginParams {
+    password?: string;
+    username?: string;
+  }
+
+  /** 登录接口返回值 */
+  export interface LoginResult {
+    accessToken: string;
+  }
+
+  export interface RefreshTokenResult {
+    data: string;
+    status: number;
+  }
+}
+
+/**
+ * 登录
+ */
+export async function loginApi(data: AuthApi.LoginParams) {
+  return requestClient.post<AuthApi.LoginResult>('/auth/login', data);
+}
+
+/**
+ * 刷新accessToken
+ */
+export async function refreshTokenApi() {
+  return baseRequestClient.post<AuthApi.RefreshTokenResult>('/auth/refresh', {
+    withCredentials: true,
+  });
+}
+
+/**
+ * 退出登录
+ */
+export async function logoutApi() {
+  return baseRequestClient.post('/auth/logout', {
+    withCredentials: true,
+  });
+}
+
+/**
+ * 获取用户权限码
+ */
+export async function getAccessCodesApi() {
+  return requestClient.get<string[]>('/auth/codes');
+}
diff --git a/apps/web-antdv-next/src/api/core/index.ts b/apps/web-antdv-next/src/api/core/index.ts
new file mode 100644
index 00000000..04256867
--- /dev/null
+++ b/apps/web-antdv-next/src/api/core/index.ts
@@ -0,0 +1,4 @@
+export * from './auth';
+export * from './menu';
+export * from './upload';
+export * from './user';
diff --git a/apps/web-antdv-next/src/api/core/menu.ts b/apps/web-antdv-next/src/api/core/menu.ts
new file mode 100644
index 00000000..9ef60b11
--- /dev/null
+++ b/apps/web-antdv-next/src/api/core/menu.ts
@@ -0,0 +1,10 @@
+import type { RouteRecordStringComponent } from '@vben/types';
+
+import { requestClient } from '#/api/request';
+
+/**
+ * 获取用户所有菜单
+ */
+export async function getAllMenusApi() {
+  return requestClient.get<RouteRecordStringComponent[]>('/menu/all');
+}
diff --git a/apps/web-antdv-next/src/api/core/upload.ts b/apps/web-antdv-next/src/api/core/upload.ts
new file mode 100644
index 00000000..246d4f26
--- /dev/null
+++ b/apps/web-antdv-next/src/api/core/upload.ts
@@ -0,0 +1,25 @@
+import { requestClient } from '#/api/request';
+
+interface UploadFileParams {
+  file: File;
+  onError?: (error: Error) => void;
+  onProgress?: (progress: { percent: number }) => void;
+  onSuccess?: (data: any, file: File) => void;
+}
+export async function upload_file({
+  file,
+  onError,
+  onProgress,
+  onSuccess,
+}: UploadFileParams) {
+  try {
+    onProgress?.({ percent: 0 });
+
+    const data = await requestClient.upload('/upload', { file });
+
+    onProgress?.({ percent: 100 });
+    onSuccess?.(data, file);
+  } catch (error) {
+    onError?.(error instanceof Error ? error : new Error(String(error)));
+  }
+}
diff --git a/apps/web-antdv-next/src/api/core/user.ts b/apps/web-antdv-next/src/api/core/user.ts
new file mode 100644
index 00000000..7e28ea84
--- /dev/null
+++ b/apps/web-antdv-next/src/api/core/user.ts
@@ -0,0 +1,10 @@
+import type { UserInfo } from '@vben/types';
+
+import { requestClient } from '#/api/request';
+
+/**
+ * 获取用户信息
+ */
+export async function getUserInfoApi() {
+  return requestClient.get<UserInfo>('/user/info');
+}
diff --git a/apps/web-antdv-next/src/api/index.ts b/apps/web-antdv-next/src/api/index.ts
new file mode 100644
index 00000000..4b0e0413
--- /dev/null
+++ b/apps/web-antdv-next/src/api/index.ts
@@ -0,0 +1 @@
+export * from './core';
diff --git a/apps/web-antdv-next/src/api/request.ts b/apps/web-antdv-next/src/api/request.ts
new file mode 100644
index 00000000..d97a2163
--- /dev/null
+++ b/apps/web-antdv-next/src/api/request.ts
@@ -0,0 +1,113 @@
+/**
+ * 该文件可自行根据业务逻辑进行调整
+ */
+import type { RequestClientOptions } from '@vben/request';
+
+import { useAppConfig } from '@vben/hooks';
+import { preferences } from '@vben/preferences';
+import {
+  authenticateResponseInterceptor,
+  defaultResponseInterceptor,
+  errorMessageResponseInterceptor,
+  RequestClient,
+} from '@vben/request';
+import { useAccessStore } from '@vben/stores';
+
+import { message } from 'antdv-next';
+
+import { useAuthStore } from '#/store';
+
+import { refreshTokenApi } from './core';
+
+const { apiURL } = useAppConfig(import.meta.env, import.meta.env.PROD);
+
+function createRequestClient(baseURL: string, options?: RequestClientOptions) {
+  const client = new RequestClient({
+    ...options,
+    baseURL,
+  });
+
+  /**
+   * 重新认证逻辑
+   */
+  async function doReAuthenticate() {
+    console.warn('Access token or refresh token is invalid or expired. ');
+    const accessStore = useAccessStore();
+    const authStore = useAuthStore();
+    accessStore.setAccessToken(null);
+    if (
+      preferences.app.loginExpiredMode === 'modal' &&
+      accessStore.isAccessChecked
+    ) {
+      accessStore.setLoginExpired(true);
+    } else {
+      await authStore.logout();
+    }
+  }
+
+  /**
+   * 刷新token逻辑
+   */
+  async function doRefreshToken() {
+    const accessStore = useAccessStore();
+    const resp = await refreshTokenApi();
+    const newToken = resp.data;
+    accessStore.setAccessToken(newToken);
+    return newToken;
+  }
+
+  function formatToken(token: null | string) {
+    return token ? `Bearer ${token}` : null;
+  }
+
+  // 请求头处理
+  client.addRequestInterceptor({
+    fulfilled: async (config) => {
+      const accessStore = useAccessStore();
+
+      config.headers.Authorization = formatToken(accessStore.accessToken);
+      config.headers['Accept-Language'] = preferences.app.locale;
+      return config;
+    },
+  });
+
+  // 处理返回的响应数据格式
+  client.addResponseInterceptor(
+    defaultResponseInterceptor({
+      codeField: 'code',
+      dataField: 'data',
+      successCode: 0,
+    }),
+  );
+
+  // token过期的处理
+  client.addResponseInterceptor(
+    authenticateResponseInterceptor({
+      client,
+      doReAuthenticate,
+      doRefreshToken,
+      enableRefreshToken: preferences.app.enableRefreshToken,
+      formatToken,
+    }),
+  );
+
+  // 通用的错误处理,如果没有进入上面的错误处理逻辑，就会进入这里
+  client.addResponseInterceptor(
+    errorMessageResponseInterceptor((msg: string, error) => {
+      // 这里可以根据业务进行定制,你可以拿到 error 内的信息进行定制化处理，根据不同的 code 做不同的提示，而不是直接使用 message.error 提示 msg
+      // 当前mock接口返回的错误字段是 error 或者 message
+      const responseData = error?.response?.data ?? {};
+      const errorMessage = responseData?.error ?? responseData?.message ?? '';
+      // 如果没有错误信息，则会根据状态码进行提示
+      message.error(errorMessage || msg);
+    }),
+  );
+
+  return client;
+}
+
+export const requestClient = createRequestClient(apiURL, {
+  responseReturn: 'data',
+});
+
+export const baseRequestClient = new RequestClient({ baseURL: apiURL });
diff --git a/apps/web-antdv-next/src/app.vue b/apps/web-antdv-next/src/app.vue
new file mode 100644
index 00000000..46366e91
--- /dev/null
+++ b/apps/web-antdv-next/src/app.vue
@@ -0,0 +1,50 @@
+<script lang="ts" setup>
+import { computed, watch } from 'vue';
+
+import { useAntdDesignTokens } from '@vben/hooks';
+import { preferences, usePreferences } from '@vben/preferences';
+
+import { App, ConfigProvider, StyleProvider, theme } from 'antdv-next';
+
+import { antdLocale } from '#/locales';
+
+defineOptions({ name: 'App' });
+
+const { isDark } = usePreferences();
+const { tokens } = useAntdDesignTokens();
+
+const tokenTheme = computed(() => {
+  const algorithm = isDark.value
+    ? [theme.darkAlgorithm]
+    : [theme.defaultAlgorithm];
+
+  // antd 紧凑模式算法
+  if (preferences.app.compact) {
+    algorithm.push(theme.compactAlgorithm);
+  }
+
+  return {
+    algorithm,
+    token: tokens,
+  };
+});
+
+watch(
+  tokenTheme,
+  (themeConfig) => {
+    ConfigProvider.config({ theme: themeConfig });
+  },
+  { immediate: true },
+);
+</script>
+
+<template>
+  <!-- layer: antd 组件样式注入 @layer antd，让 Tailwind 工具类可以覆盖组件样式 -->
+  <StyleProvider layer>
+    <ConfigProvider :locale="antdLocale" :theme="tokenTheme">
+      <App>
+        <RouterView />
+      </App>
+    </ConfigProvider>
+  </StyleProvider>
+</template>
diff --git a/apps/web-antdv-next/src/bootstrap.ts b/apps/web-antdv-next/src/bootstrap.ts
new file mode 100644
index 00000000..8c161703
--- /dev/null
+++ b/apps/web-antdv-next/src/bootstrap.ts
@@ -0,0 +1,76 @@
+import { createApp, watchEffect } from 'vue';
+
+import { registerAccessDirective } from '@vben/access';
+import { registerLoadingDirective } from '@vben/common-ui/es/loading';
+import { preferences } from '@vben/preferences';
+import { initStores } from '@vben/stores';
+import '@vben/styles';
+import '@vben/styles/antdv-next';
+
+import { useTitle } from '@vueuse/core';
+
+import { $t, setupI18n } from '#/locales';
+
+import { initComponentAdapter } from './adapter/component';
+import { initSetupVbenForm } from './adapter/form';
+import App from './app.vue';
+import { router } from './router';
+
+async function bootstrap(namespace: string) {
+  // 初始化组件适配器
+  await initComponentAdapter();
+
+  // 初始化表单组件
+  await initSetupVbenForm();
+
+  // // 设置弹窗的默认配置
+  // setDefaultModalProps({
+  //   fullscreenButton: false,
+  // });
+  // // 设置抽屉的默认配置
+  // setDefaultDrawerProps({
+  //   zIndex: 1020,
+  // });
+
+  const app = createApp(App);
+
+  // 注册v-loading指令
+  registerLoadingDirective(app, {
+    loading: 'loading', // 在这里可以自定义指令名称，也可以明确提供false表示不注册这个指令
+    spinning: 'spinning',
+  });
+
+  // 国际化 i18n 配置
+  await setupI18n(app);
+
+  // 配置 pinia-tore
+  await initStores(app, { namespace });
+
+  // 安装权限指令
+  registerAccessDirective(app);
+
+  // 初始化 tippy
+  const { initTippy } = await import('@vben/common-ui/es/tippy');
+  initTippy(app);
+
+  // 配置路由及路由守卫
+  app.use(router);
+
+  // 配置Motion插件
+  const { MotionPlugin } = await import('@vben/plugins/motion');
+  app.use(MotionPlugin);
+
+  // 动态更新标题
+  watchEffect(() => {
+    if (preferences.app.dynamicTitle) {
+      const routeTitle = router.currentRoute.value.meta?.title;
+      const pageTitle =
+        (routeTitle ? `${$t(routeTitle)} - ` : '') + preferences.app.name;
+      useTitle(pageTitle);
+    }
+  });
+
+  app.mount('#app');
+}
+
+export { bootstrap };
diff --git a/apps/web-antdv-next/src/layouts/auth.vue b/apps/web-antdv-next/src/layouts/auth.vue
new file mode 100644
index 00000000..8ba66e85
--- /dev/null
+++ b/apps/web-antdv-next/src/layouts/auth.vue
@@ -0,0 +1,25 @@
+<script lang="ts" setup>
+import { computed } from 'vue';
+
+import { AuthPageLayout } from '@vben/layouts';
+import { preferences } from '@vben/preferences';
+
+import { $t } from '#/locales';
+
+const appName = computed(() => preferences.app.name);
+const logo = computed(() => preferences.logo.source);
+const logoDark = computed(() => preferences.logo.sourceDark);
+</script>
+
+<template>
+  <AuthPageLayout
+    :app-name="appName"
+    :logo="logo"
+    :logo-dark="logoDark"
+    :page-description="$t('authentication.pageDesc')"
+    :page-title="$t('authentication.pageTitle')"
+  >
+    <!-- 自定义工具栏 -->
+    <!-- <template #toolbar></template> -->
+  </AuthPageLayout>
+</template>
diff --git a/apps/web-antdv-next/src/layouts/basic.vue b/apps/web-antdv-next/src/layouts/basic.vue
new file mode 100644
index 00000000..e85dd1cf
--- /dev/null
+++ b/apps/web-antdv-next/src/layouts/basic.vue
@@ -0,0 +1,261 @@
+<script lang="ts" setup>
+import type { NotificationItem } from '@vben/layouts';
+
+import { computed, ref, watch } from 'vue';
+import { useRouter } from 'vue-router';
+
+import { AuthenticationLoginExpiredModal } from '@vben/common-ui';
+import { VBEN_DOC_URL, VBEN_GITHUB_URL } from '@vben/constants';
+import { useWatermark } from '@vben/hooks';
+import { BookOpenText, CircleHelp, SvgGithubIcon } from '@vben/icons';
+import {
+  BasicLayout,
+  LockScreen,
+  Notification,
+  UserDropdown,
+} from '@vben/layouts';
+import { preferences, usePreferences } from '@vben/preferences';
+import { useAccessStore, useUserStore } from '@vben/stores';
+import { openWindow } from '@vben/utils';
+
+import { $t } from '#/locales';
+import { useAuthStore } from '#/store';
+import LoginForm from '#/views/_core/authentication/login.vue';
+
+const notifications = ref<NotificationItem[]>([
+  {
+    id: 1,
+    avatar: 'https://avatar.vercel.sh/vercel.svg?text=VB',
+    date: '3小时前',
+    isRead: true,
+    message: '描述信息描述信息描述信息',
+    title: '收到了 14 份新周报',
+  },
+  {
+    id: 2,
+    avatar: 'https://avatar.vercel.sh/1',
+    date: '刚刚',
+    isRead: false,
+    message: '描述信息描述信息描述信息',
+    title: '朱偏右 回复了你',
+  },
+  {
+    id: 3,
+    avatar: 'https://avatar.vercel.sh/1',
+    date: '2024-01-01',
+    isRead: false,
+    message: '描述信息描述信息描述信息',
+    title: '曲丽丽 评论了你',
+  },
+  {
+    id: 4,
+    avatar: 'https://avatar.vercel.sh/satori',
+    date: '1天前',
+    isRead: false,
+    message: '描述信息描述信息描述信息',
+    title: '代办提醒',
+  },
+  {
+    id: 5,
+    avatar: 'https://avatar.vercel.sh/satori',
+    date: '1天前',
+    isRead: false,
+    message: '描述信息描述信息描述信息',
+    title: '跳转Workspace示例',
+    link: '/workspace',
+  },
+  {
+    id: 6,
+    avatar: 'https://avatar.vercel.sh/satori',
+    date: '1天前',
+    isRead: false,
+    message: '描述信息描述信息描述信息',
+    title: '跳转外部链接示例',
+    link: 'https://doc.vben.pro',
+  },
+]);
+
+const router = useRouter();
+const userStore = useUserStore();
+const authStore = useAuthStore();
+const accessStore = useAccessStore();
+const { destroyWatermark, updateWatermark } = useWatermark();
+const { isDark } = usePreferences();
+const showDot = computed(() =>
+  notifications.value.some((item) => !item.isRead),
+);
+
+const menus = computed(() => [
+  {
+    handler: () => {
+      router.push({ name: 'Profile' });
+    },
+    icon: 'lucide:user',
+    text: $t('page.auth.profile'),
+  },
+  {
+    handler: () => {
+      openWindow(VBEN_DOC_URL, {
+        target: '_blank',
+      });
+    },
+    icon: BookOpenText,
+    text: $t('ui.widgets.document'),
+  },
+  {
+    handler: () => {
+      openWindow(VBEN_GITHUB_URL, {
+        target: '_blank',
+      });
+    },
+    icon: SvgGithubIcon,
+    text: 'GitHub',
+  },
+  {
+    handler: () => {
+      openWindow(`${VBEN_GITHUB_URL}/issues`, {
+        target: '_blank',
+      });
+    },
+    icon: CircleHelp,
+    text: $t('ui.widgets.qa'),
+  },
+]);
+
+const avatar = computed(() => {
+  return userStore.userInfo?.avatar ?? preferences.app.defaultAvatar;
+});
+
+async function handleLogout() {
+  await authStore.logout(false);
+}
+
+function handleNoticeClear() {
+  notifications.value = [];
+}
+
+function markRead(id: number | string) {
+  const item = notifications.value.find((item) => item.id === id);
+  if (item) {
+    item.isRead = true;
+  }
+}
+
+function remove(id: number | string) {
+  notifications.value = notifications.value.filter((item) => item.id !== id);
+}
+
+function handleMakeAll() {
+  notifications.value.forEach((item) => (item.isRead = true));
+}
+
+const viewAll = () => {};
+
+const handleClick = (item: NotificationItem) => {
+  // 如果通知项有链接，点击时跳转
+  if (item.link) {
+    navigateTo(item.link, item.query, item.state);
+  }
+};
+
+function navigateTo(
+  link: string,
+  query?: Record<string, any>,
+  state?: Record<string, any>,
+) {
+  if (link.startsWith('http://') || link.startsWith('https://')) {
+    // 外部链接，在新标签页打开
+    window.open(link, '_blank');
+  } else {
+    // 内部路由链接，支持 query 参数和 state
+    router.push({
+      path: link,
+      query: query || {},
+      state,
+    });
+  }
+}
+
+watch(
+  () => ({
+    enable: preferences.app.watermark,
+    content: preferences.app.watermarkContent,
+    isDark: isDark.value,
+  }),
+  async ({ enable, content, isDark: isDarkValue }) => {
+    if (enable) {
+      const watermarkColor = isDarkValue
+        ? 'rgba(255, 255, 255, 0.12)'
+        : 'rgba(0, 0, 0, 0.12)';
+
+      await updateWatermark({
+        advancedStyle: {
+          colorStops: [
+            {
+              color: watermarkColor,
+              offset: 0,
+            },
+            {
+              color: watermarkColor,
+              offset: 1,
+            },
+          ],
+          type: 'linear',
+        },
+        content:
+          content ||
+          `${userStore.userInfo?.username} - ${userStore.userInfo?.realName}`,
+      });
+    } else {
+      destroyWatermark();
+    }
+  },
+  {
+    immediate: true,
+  },
+);
+</script>
+
+<template>
+  <BasicLayout
+    :avatar
+    :text="userStore.userInfo?.realName"
+    @clear-preferences-and-logout="handleLogout"
+    @logout="handleLogout"
+  >
+    <template #user-dropdown>
+      <UserDropdown
+        :avatar
+        :menus
+        :text="userStore.userInfo?.realName"
+        description="ann.vben@gmail.com"
+        tag-text="Pro"
+        @clear-preferences-and-logout="handleLogout"
+        @logout="handleLogout"
+      />
+    </template>
+    <template #notification>
+      <Notification
+        :dot="showDot"
+        :notifications="notifications"
+        @clear="handleNoticeClear"
+        @read="(item) => item.id && markRead(item.id)"
+        @remove="(item) => item.id && remove(item.id)"
+        @make-all="handleMakeAll"
+        @on-click="handleClick"
+        @view-all="viewAll"
+      />
+    </template>
+    <template #extra>
+      <AuthenticationLoginExpiredModal
+        v-model:open="accessStore.loginExpired"
+        :avatar
+      >
+        <LoginForm />
+      </AuthenticationLoginExpiredModal>
+    </template>
+    <template #lock-screen>
+      <LockScreen :avatar @to-login="handleLogout" />
+    </template>
+  </BasicLayout>
+</template>
diff --git a/apps/web-antdv-next/src/layouts/index.ts b/apps/web-antdv-next/src/layouts/index.ts
new file mode 100644
index 00000000..a4320780
--- /dev/null
+++ b/apps/web-antdv-next/src/layouts/index.ts
@@ -0,0 +1,6 @@
+const BasicLayout = () => import('./basic.vue');
+const AuthPageLayout = () => import('./auth.vue');
+
+const IFrameView = () => import('@vben/layouts').then((m) => m.IFrameView);
+
+export { AuthPageLayout, BasicLayout, IFrameView };
diff --git a/apps/web-antdv-next/src/locales/README.md b/apps/web-antdv-next/src/locales/README.md
new file mode 100644
index 00000000..7b451032
--- /dev/null
+++ b/apps/web-antdv-next/src/locales/README.md
@@ -0,0 +1,3 @@
+# locale
+
+每个app使用的国际化可能不同，这里用于扩展国际化的功能，例如扩展 dayjs、antd组件库的多语言切换，以及app本身的国际化文件。
diff --git a/apps/web-antdv-next/src/locales/index.ts b/apps/web-antdv-next/src/locales/index.ts
new file mode 100644
index 00000000..2586d859
--- /dev/null
+++ b/apps/web-antdv-next/src/locales/index.ts
@@ -0,0 +1,102 @@
+import type { Locale } from 'antdv-next/dist/locale/index';
+
+import type { App } from 'vue';
+
+import type { LocaleSetupOptions, SupportedLanguagesType } from '@vben/locales';
+
+import { ref } from 'vue';
+
+import {
+  $t,
+  setupI18n as coreSetup,
+  loadLocalesMapFromDir,
+} from '@vben/locales';
+import { preferences } from '@vben/preferences';
+
+import antdEnLocale from 'antdv-next/dist/locale/en_US';
+import antdDefaultLocale from 'antdv-next/dist/locale/zh_CN';
+import dayjs from 'dayjs';
+
+const antdLocale = ref<Locale>(antdDefaultLocale);
+
+const modules = import.meta.glob('./langs/**/*.json');
+
+const localesMap = loadLocalesMapFromDir(
+  /\.\/langs\/([^/]+)\/(.*)\.json$/,
+  modules,
+);
+/**
+ * 加载应用特有的语言包
+ * 这里也可以改造为从服务端获取翻译数据
+ * @param lang
+ */
+async function loadMessages(lang: SupportedLanguagesType) {
+  const [appLocaleMessages] = await Promise.all([
+    localesMap[lang]?.(),
+    loadThirdPartyMessage(lang),
+  ]);
+  return appLocaleMessages?.default;
+}
+
+/**
+ * 加载第三方组件库的语言包
+ * @param lang
+ */
+async function loadThirdPartyMessage(lang: SupportedLanguagesType) {
+  await Promise.all([loadAntdLocale(lang), loadDayjsLocale(lang)]);
+}
+
+/**
+ * 加载dayjs的语言包
+ * @param lang
+ */
+async function loadDayjsLocale(lang: SupportedLanguagesType) {
+  let locale;
+  switch (lang) {
+    case 'en-US': {
+      locale = await import('dayjs/locale/en');
+      break;
+    }
+    case 'zh-CN': {
+      locale = await import('dayjs/locale/zh-cn');
+      break;
+    }
+    // 默认使用英语
+    default: {
+      locale = await import('dayjs/locale/en');
+    }
+  }
+  if (locale) {
+    dayjs.locale(locale);
+  } else {
+    console.error(`Failed to load dayjs locale for ${lang}`);
+  }
+}
+
+/**
+ * 加载antd的语言包
+ * @param lang
+ */
+async function loadAntdLocale(lang: SupportedLanguagesType) {
+  switch (lang) {
+    case 'en-US': {
+      antdLocale.value = antdEnLocale;
+      break;
+    }
+    case 'zh-CN': {
+      antdLocale.value = antdDefaultLocale;
+      break;
+    }
+  }
+}
+
+async function setupI18n(app: App, options: LocaleSetupOptions = {}) {
+  await coreSetup(app, {
+    defaultLocale: preferences.app.locale,
+    loadMessages,
+    missingWarn: !import.meta.env.PROD,
+    ...options,
+  });
+}
+
+export { $t, antdLocale, setupI18n };
diff --git a/apps/web-antdv-next/src/locales/langs/en-US/demos.json b/apps/web-antdv-next/src/locales/langs/en-US/demos.json
new file mode 100644
index 00000000..551f22b4
--- /dev/null
+++ b/apps/web-antdv-next/src/locales/langs/en-US/demos.json
@@ -0,0 +1,14 @@
+{
+  "title": "Demos",
+  "antd": "Antdv Next",
+  "vben": {
+    "title": "Project",
+    "about": "About",
+    "document": "Document",
+    "antdv": "Ant Design Vue Version",
+    "antdv-next": "Antdv Next Version",
+    "naive-ui": "Naive UI Version",
+    "element-plus": "Element Plus Version",
+    "tdesign": "TDesign Vue Version"
+  }
+}
diff --git a/apps/web-antdv-next/src/locales/langs/en-US/page.json b/apps/web-antdv-next/src/locales/langs/en-US/page.json
new file mode 100644
index 00000000..39f1641c
--- /dev/null
+++ b/apps/web-antdv-next/src/locales/langs/en-US/page.json
@@ -0,0 +1,15 @@
+{
+  "auth": {
+    "login": "Login",
+    "register": "Register",
+    "codeLogin": "Code Login",
+    "qrcodeLogin": "Qr Code Login",
+    "forgetPassword": "Forget Password",
+    "profile": "Profile"
+  },
+  "dashboard": {
+    "title": "Dashboard",
+    "analytics": "Analytics",
+    "workspace": "Workspace"
+  }
+}
diff --git a/apps/web-antdv-next/src/locales/langs/zh-CN/demos.json b/apps/web-antdv-next/src/locales/langs/zh-CN/demos.json
new file mode 100644
index 00000000..ef4e43fd
--- /dev/null
+++ b/apps/web-antdv-next/src/locales/langs/zh-CN/demos.json
@@ -0,0 +1,14 @@
+{
+  "title": "演示",
+  "antd": "Antdv Next",
+  "vben": {
+    "title": "项目",
+    "about": "关于",
+    "document": "文档",
+    "antdv": "Ant Design Vue 版本",
+    "antdv-next": "Antdv Next 版本",
+    "naive-ui": "Naive UI 版本",
+    "element-plus": "Element Plus 版本",
+    "tdesign": "TDesign Vue 版本"
+  }
+}
diff --git a/apps/web-antdv-next/src/locales/langs/zh-CN/page.json b/apps/web-antdv-next/src/locales/langs/zh-CN/page.json
new file mode 100644
index 00000000..2192d1d5
--- /dev/null
+++ b/apps/web-antdv-next/src/locales/langs/zh-CN/page.json
@@ -0,0 +1,15 @@
+{
+  "auth": {
+    "login": "登录",
+    "register": "注册",
+    "codeLogin": "验证码登录",
+    "qrcodeLogin": "二维码登录",
+    "forgetPassword": "忘记密码",
+    "profile": "个人中心"
+  },
+  "dashboard": {
+    "title": "概览",
+    "analytics": "分析页",
+    "workspace": "工作台"
+  }
+}
diff --git a/apps/web-antdv-next/src/main.ts b/apps/web-antdv-next/src/main.ts
new file mode 100644
index 00000000..5d728a02
--- /dev/null
+++ b/apps/web-antdv-next/src/main.ts
@@ -0,0 +1,31 @@
+import { initPreferences } from '@vben/preferences';
+import { unmountGlobalLoading } from '@vben/utils';
+
+import { overridesPreferences } from './preferences';
+
+/**
+ * 应用初始化完成之后再进行页面加载渲染
+ */
+async function initApplication() {
+  // name用于指定项目唯一标识
+  // 用于区分不同项目的偏好设置以及存储数据的key前缀以及其他一些需要隔离的数据
+  const env = import.meta.env.PROD ? 'prod' : 'dev';
+  const appVersion = import.meta.env.VITE_APP_VERSION;
+  const namespace = `${import.meta.env.VITE_APP_NAMESPACE}-${appVersion}-${env}`;
+
+  // app偏好设置初始化
+  await initPreferences({
+    namespace,
+    overrides: overridesPreferences,
+  });
+
+  // 启动应用并挂载
+  // vue应用主要逻辑及视图
+  const { bootstrap } = await import('./bootstrap');
+  await bootstrap(namespace);
+
+  // 移除并销毁loading
+  unmountGlobalLoading();
+}
+
+initApplication();
diff --git a/apps/web-antdv-next/src/preferences.ts b/apps/web-antdv-next/src/preferences.ts
new file mode 100644
index 00000000..303c496e
--- /dev/null
+++ b/apps/web-antdv-next/src/preferences.ts
@@ -0,0 +1,17 @@
+import {
+  appCopyrightPreferences,
+  defineOverridesPreferences,
+} from '@vben/preferences';
+
+/**
+ * @description 项目配置文件
+ * 只需要覆盖项目中的一部分配置，不需要的配置不用覆盖，会自动使用默认配置
+ * !!! 更改配置后请清空缓存，否则可能不生效
+ */
+export const overridesPreferences = defineOverridesPreferences({
+  // overrides
+  app: {
+    name: import.meta.env.VITE_APP_TITLE,
+  },
+  copyright: appCopyrightPreferences,
+});
diff --git a/apps/web-antdv-next/src/router/access.ts b/apps/web-antdv-next/src/router/access.ts
new file mode 100644
index 00000000..e9e98511
--- /dev/null
+++ b/apps/web-antdv-next/src/router/access.ts
@@ -0,0 +1,42 @@
+import type {
+  ComponentRecordType,
+  GenerateMenuAndRoutesOptions,
+} from '@vben/types';
+
+import { generateAccessible } from '@vben/access';
+import { preferences } from '@vben/preferences';
+
+import { message } from 'antdv-next';
+
+import { getAllMenusApi } from '#/api';
+import { BasicLayout, IFrameView } from '#/layouts';
+import { $t } from '#/locales';
+
+const forbiddenComponent = () => import('#/views/_core/fallback/forbidden.vue');
+
+async function generateAccess(options: GenerateMenuAndRoutesOptions) {
+  const pageMap: ComponentRecordType = import.meta.glob('../views/**/*.vue');
+
+  const layoutMap: ComponentRecordType = {
+    BasicLayout,
+    IFrameView,
+  };
+
+  return await generateAccessible(preferences.app.accessMode, {
+    ...options,
+    fetchMenuListAsync: async () => {
+      message.loading({
+        content: `${$t('common.loadingMenu')}...`,
+        duration: 1.5,
+      });
+      return await getAllMenusApi();
+    },
+    // 可以指定没有权限跳转403页面
+    forbiddenComponent,
+    // 如果 route.meta.menuVisibleWithForbidden = true
+    layoutMap,
+    pageMap,
+  });
+}
+
+export { generateAccess };
diff --git a/apps/web-antdv-next/src/router/guard.ts b/apps/web-antdv-next/src/router/guard.ts
new file mode 100644
index 00000000..a1ad6d88
--- /dev/null
+++ b/apps/web-antdv-next/src/router/guard.ts
@@ -0,0 +1,133 @@
+import type { Router } from 'vue-router';
+
+import { LOGIN_PATH } from '@vben/constants';
+import { preferences } from '@vben/preferences';
+import { useAccessStore, useUserStore } from '@vben/stores';
+import { startProgress, stopProgress } from '@vben/utils';
+
+import { accessRoutes, coreRouteNames } from '#/router/routes';
+import { useAuthStore } from '#/store';
+
+import { generateAccess } from './access';
+
+/**
+ * 通用守卫配置
+ * @param router
+ */
+function setupCommonGuard(router: Router) {
+  // 记录已经加载的页面
+  const loadedPaths = new Set<string>();
+
+  router.beforeEach((to) => {
+    to.meta.loaded = loadedPaths.has(to.path);
+
+    // 页面加载进度条
+    if (!to.meta.loaded && preferences.transition.progress) {
+      startProgress();
+    }
+    return true;
+  });
+
+  router.afterEach((to) => {
+    // 记录页面是否加载,如果已经加载，后续的页面切换动画等效果不在重复执行
+
+    loadedPaths.add(to.path);
+
+    // 关闭页面加载进度条
+    if (preferences.transition.progress) {
+      stopProgress();
+    }
+  });
+}
+
+/**
+ * 权限访问守卫配置
+ * @param router
+ */
+function setupAccessGuard(router: Router) {
+  router.beforeEach(async (to, from) => {
+    const accessStore = useAccessStore();
+    const userStore = useUserStore();
+    const authStore = useAuthStore();
+
+    // 基本路由，这些路由不需要进入权限拦截
+    if (coreRouteNames.includes(to.name as string)) {
+      if (to.path === LOGIN_PATH && accessStore.accessToken) {
+        return decodeURIComponent(
+          (to.query?.redirect as string) ||
+            userStore.userInfo?.homePath ||
+            preferences.app.defaultHomePath,
+        );
+      }
+      return true;
+    }
+
+    // accessToken 检查
+    if (!accessStore.accessToken) {
+      // 明确声明忽略权限访问权限，则可以访问
+      if (to.meta.ignoreAccess) {
+        return true;
+      }
+
+      // 没有访问权限，跳转登录页面
+      if (to.fullPath !== LOGIN_PATH) {
+        return {
+          path: LOGIN_PATH,
+          // 如不需要，直接删除 query
+          query:
+            to.fullPath === preferences.app.defaultHomePath
+              ? {}
+              : { redirect: encodeURIComponent(to.fullPath) },
+          // 携带当前跳转的页面，登录后重新跳转该页面
+          replace: true,
+        };
+      }
+      return to;
+    }
+
+    // 是否已经生成过动态路由
+    if (accessStore.isAccessChecked) {
+      return true;
+    }
+
+    // 生成路由表
+    // 当前登录用户拥有的角色标识列表
+    const userInfo = userStore.userInfo || (await authStore.fetchUserInfo());
+    const userRoles = userInfo.roles ?? [];
+
+    // 生成菜单和路由
+    const { accessibleMenus, accessibleRoutes } = await generateAccess({
+      roles: userRoles,
+      router,
+      // 则会在菜单中显示，但是访问会被重定向到403
+      routes: accessRoutes,
+    });
+
+    // 保存菜单信息和路由信息
+    accessStore.setAccessMenus(accessibleMenus);
+    accessStore.setAccessRoutes(accessibleRoutes);
+    accessStore.setIsAccessChecked(true);
+    const redirectPath = (from.query.redirect ??
+      (to.path === preferences.app.defaultHomePath
+        ? userInfo.homePath || preferences.app.defaultHomePath
+        : to.fullPath)) as string;
+
+    return {
+      ...router.resolve(decodeURIComponent(redirectPath)),
+      replace: true,
+    };
+  });
+}
+
+/**
+ * 项目守卫配置
+ * @param router
+ */
+function createRouterGuard(router: Router) {
+  /** 通用 */
+  setupCommonGuard(router);
+  /** 权限访问 */
+  setupAccessGuard(router);
+}
+
+export { createRouterGuard };
diff --git a/apps/web-antdv-next/src/router/index.ts b/apps/web-antdv-next/src/router/index.ts
new file mode 100644
index 00000000..48402303
--- /dev/null
+++ b/apps/web-antdv-next/src/router/index.ts
@@ -0,0 +1,37 @@
+import {
+  createRouter,
+  createWebHashHistory,
+  createWebHistory,
+} from 'vue-router';
+
+import { resetStaticRoutes } from '@vben/utils';
+
+import { createRouterGuard } from './guard';
+import { routes } from './routes';
+
+/**
+ *  @zh_CN 创建vue-router实例
+ */
+const router = createRouter({
+  history:
+    import.meta.env.VITE_ROUTER_HISTORY === 'hash'
+      ? createWebHashHistory(import.meta.env.VITE_BASE)
+      : createWebHistory(import.meta.env.VITE_BASE),
+  // 应该添加到路由的初始路由列表。
+  routes,
+  scrollBehavior: (to, _from, savedPosition) => {
+    if (savedPosition) {
+      return savedPosition;
+    }
+    return to.hash ? { behavior: 'smooth', el: to.hash } : { left: 0, top: 0 };
+  },
+  // 是否应该禁止尾部斜杠。
+  // strict: true,
+});
+
+const resetRoutes = () => resetStaticRoutes(router, routes);
+
+// 创建路由守卫
+createRouterGuard(router);
+
+export { resetRoutes, router };
diff --git a/apps/web-antdv-next/src/router/routes/core.ts b/apps/web-antdv-next/src/router/routes/core.ts
new file mode 100644
index 00000000..949b0b65
--- /dev/null
+++ b/apps/web-antdv-next/src/router/routes/core.ts
@@ -0,0 +1,97 @@
+import type { RouteRecordRaw } from 'vue-router';
+
+import { LOGIN_PATH } from '@vben/constants';
+import { preferences } from '@vben/preferences';
+
+import { $t } from '#/locales';
+
+const BasicLayout = () => import('#/layouts/basic.vue');
+const AuthPageLayout = () => import('#/layouts/auth.vue');
+/** 全局404页面 */
+const fallbackNotFoundRoute: RouteRecordRaw = {
+  component: () => import('#/views/_core/fallback/not-found.vue'),
+  meta: {
+    hideInBreadcrumb: true,
+    hideInMenu: true,
+    hideInTab: true,
+    title: '404',
+  },
+  name: 'FallbackNotFound',
+  path: '/:path(.*)*',
+};
+
+/** 基本路由，这些路由是必须存在的 */
+const coreRoutes: RouteRecordRaw[] = [
+  /**
+   * 根路由
+   * 使用基础布局，作为所有页面的父级容器，子级就不必配置BasicLayout。
+   * 此路由必须存在，且不应修改
+   */
+  {
+    component: BasicLayout,
+    meta: {
+      hideInBreadcrumb: true,
+      title: 'Root',
+    },
+    name: 'Root',
+    path: '/',
+    redirect: preferences.app.defaultHomePath,
+    children: [],
+  },
+  {
+    component: AuthPageLayout,
+    meta: {
+      hideInTab: true,
+      title: 'Authentication',
+    },
+    name: 'Authentication',
+    path: '/auth',
+    redirect: LOGIN_PATH,
+    children: [
+      {
+        name: 'Login',
+        path: 'login',
+        component: () => import('#/views/_core/authentication/login.vue'),
+        meta: {
+          title: $t('page.auth.login'),
+        },
+      },
+      {
+        name: 'CodeLogin',
+        path: 'code-login',
+        component: () => import('#/views/_core/authentication/code-login.vue'),
+        meta: {
+          title: $t('page.auth.codeLogin'),
+        },
+      },
+      {
+        name: 'QrCodeLogin',
+        path: 'qrcode-login',
+        component: () =>
+          import('#/views/_core/authentication/qrcode-login.vue'),
+        meta: {
+          title: $t('page.auth.qrcodeLogin'),
+        },
+      },
+      {
+        name: 'ForgetPassword',
+        path: 'forget-password',
+        component: () =>
+          import('#/views/_core/authentication/forget-password.vue'),
+        meta: {
+          title: $t('page.auth.forgetPassword'),
+        },
+      },
+      {
+        name: 'Register',
+        path: 'register',
+        component: () => import('#/views/_core/authentication/register.vue'),
+        meta: {
+          title: $t('page.auth.register'),
+        },
+      },
+    ],
+  },
+];
+
+export { coreRoutes, fallbackNotFoundRoute };
diff --git a/apps/web-antdv-next/src/router/routes/index.ts b/apps/web-antdv-next/src/router/routes/index.ts
new file mode 100644
index 00000000..e6fb1440
--- /dev/null
+++ b/apps/web-antdv-next/src/router/routes/index.ts
@@ -0,0 +1,37 @@
+import type { RouteRecordRaw } from 'vue-router';
+
+import { mergeRouteModules, traverseTreeValues } from '@vben/utils';
+
+import { coreRoutes, fallbackNotFoundRoute } from './core';
+
+const dynamicRouteFiles = import.meta.glob('./modules/**/*.ts', {
+  eager: true,
+});
+
+// 有需要可以自行打开注释，并创建文件夹
+// const externalRouteFiles = import.meta.glob('./external/**/*.ts', { eager: true });
+// const staticRouteFiles = import.meta.glob('./static/**/*.ts', { eager: true });
+
+/** 动态路由 */
+const dynamicRoutes: RouteRecordRaw[] = mergeRouteModules(dynamicRouteFiles);
+
+/** 外部路由列表，访问这些页面可以不需要Layout，可能用于内嵌在别的系统(不会显示在菜单中) */
+// const externalRoutes: RouteRecordRaw[] = mergeRouteModules(externalRouteFiles);
+// const staticRoutes: RouteRecordRaw[] = mergeRouteModules(staticRouteFiles);
+const staticRoutes: RouteRecordRaw[] = [];
+const externalRoutes: RouteRecordRaw[] = [];
+
+/** 路由列表，由基本路由、外部路由和404兜底路由组成
+ *  无需走权限验证（会一直显示在菜单中） */
+const routes: RouteRecordRaw[] = [
+  ...coreRoutes,
+  ...externalRoutes,
+  fallbackNotFoundRoute,
+];
+
+/** 基本路由列表，这些路由不需要进入权限拦截 */
+const coreRouteNames = traverseTreeValues(coreRoutes, (route) => route.name);
+
+/** 有权限校验的路由列表，包含动态路由和静态路由 */
+const accessRoutes = [...dynamicRoutes, ...staticRoutes];
+export { accessRoutes, coreRouteNames, routes };
diff --git a/apps/web-antdv-next/src/router/routes/modules/dashboard.ts b/apps/web-antdv-next/src/router/routes/modules/dashboard.ts
new file mode 100644
index 00000000..44f15ef9
--- /dev/null
+++ b/apps/web-antdv-next/src/router/routes/modules/dashboard.ts
@@ -0,0 +1,38 @@
+import type { RouteRecordRaw } from 'vue-router';
+
+import { $t } from '#/locales';
+
+const routes: RouteRecordRaw[] = [
+  {
+    meta: {
+      icon: 'lucide:layout-dashboard',
+      order: -1,
+      title: $t('page.dashboard.title'),
+    },
+    name: 'Dashboard',
+    path: '/dashboard',
+    children: [
+      {
+        name: 'Analytics',
+        path: 'analytics',
+        component: () => import('#/views/dashboard/analytics/index.vue'),
+        meta: {
+          affixTab: true,
+          icon: 'lucide:area-chart',
+          title: $t('page.dashboard.analytics'),
+        },
+      },
+      {
+        name: 'Workspace',
+        path: 'workspace',
+        component: () => import('#/views/dashboard/workspace/index.vue'),
+        meta: {
+          icon: 'carbon:workspace',
+          title: $t('page.dashboard.workspace'),
+        },
+      },
+    ],
+  },
+];
+
+export default routes;
diff --git a/apps/web-antdv-next/src/router/routes/modules/demos.ts b/apps/web-antdv-next/src/router/routes/modules/demos.ts
new file mode 100644
index 00000000..18b756c7
--- /dev/null
+++ b/apps/web-antdv-next/src/router/routes/modules/demos.ts
@@ -0,0 +1,28 @@
+import type { RouteRecordRaw } from 'vue-router';
+
+import { $t } from '#/locales';
+
+const routes: RouteRecordRaw[] = [
+  {
+    meta: {
+      icon: 'ic:baseline-view-in-ar',
+      keepAlive: true,
+      order: 1000,
+      title: $t('demos.title'),
+    },
+    name: 'Demos',
+    path: '/demos',
+    children: [
+      {
+        meta: {
+          title: $t('demos.antd'),
+        },
+        name: 'AntDesignDemos',
+        path: 'ant-design-next',
+        component: () => import('#/views/demos/antd/index.vue'),
+      },
+    ],
+  },
+];
+
+export default routes;
diff --git a/apps/web-antdv-next/src/router/routes/modules/vben.ts b/apps/web-antdv-next/src/router/routes/modules/vben.ts
new file mode 100644
index 00000000..1f3e238b
--- /dev/null
+++ b/apps/web-antdv-next/src/router/routes/modules/vben.ts
@@ -0,0 +1,116 @@
+import type { RouteRecordRaw } from 'vue-router';
+
+import {
+  VBEN_ANT_PREVIEW_URL,
+  VBEN_DOC_URL,
+  VBEN_ELE_PREVIEW_URL,
+  VBEN_GITHUB_URL,
+  VBEN_LOGO_URL,
+  VBEN_NAIVE_PREVIEW_URL,
+  VBEN_TD_PREVIEW_URL,
+} from '@vben/constants';
+import { SvgAntdvLogoIcon, SvgTDesignIcon } from '@vben/icons';
+
+import { IFrameView } from '#/layouts';
+import { $t } from '#/locales';
+
+const routes: RouteRecordRaw[] = [
+  {
+    meta: {
+      badgeType: 'dot',
+      icon: VBEN_LOGO_URL,
+      order: 9998,
+      title: $t('demos.vben.title'),
+    },
+    name: 'VbenProject',
+    path: '/vben-admin',
+    children: [
+      {
+        name: 'VbenDocument',
+        path: 'document',
+        component: IFrameView,
+        meta: {
+          icon: 'lucide:book-open-text',
+          link: VBEN_DOC_URL,
+          title: $t('demos.vben.document'),
+        },
+      },
+      {
+        name: 'VbenGithub',
+        path: 'github',
+        component: IFrameView,
+        meta: {
+          icon: 'mdi:github',
+          link: VBEN_GITHUB_URL,
+          title: 'Github',
+        },
+      },
+      {
+        name: 'VbenAntd',
+        path: 'antd',
+        component: IFrameView,
+        meta: {
+          badgeType: 'dot',
+          icon: SvgAntdvLogoIcon,
+          link: VBEN_ANT_PREVIEW_URL,
+          title: $t('demos.vben.antdv'),
+        },
+      },
+      {
+        name: 'VbenNaive',
+        path: 'naive',
+        component: IFrameView,
+        meta: {
+          badgeType: 'dot',
+          icon: 'logos:naiveui',
+          link: VBEN_NAIVE_PREVIEW_URL,
+          title: $t('demos.vben.naive-ui'),
+        },
+      },
+      {
+        name: 'VbenTDesign',
+        path: 'tdesign',
+        component: IFrameView,
+        meta: {
+          badgeType: 'dot',
+          icon: SvgTDesignIcon,
+          link: VBEN_TD_PREVIEW_URL,
+          title: $t('demos.vben.tdesign'),
+        },
+      },
+      {
+        name: 'VbenElementPlus',
+        path: 'ele',
+        component: IFrameView,
+        meta: {
+          badgeType: 'dot',
+          icon: 'logos:element',
+          link: VBEN_ELE_PREVIEW_URL,
+          title: $t('demos.vben.element-plus'),
+        },
+      },
+    ],
+  },
+  {
+    name: 'VbenAbout',
+    path: '/vben-admin/about',
+    component: () => import('#/views/_core/about/index.vue'),
+    meta: {
+      icon: 'lucide:copyright',
+      title: $t('demos.vben.about'),
+      order: 9999,
+    },
+  },
+  {
+    name: 'Profile',
+    path: '/profile',
+    component: () => import('#/views/_core/profile/index.vue'),
+    meta: {
+      icon: 'lucide:user',
+      hideInMenu: true,
+      title: $t('page.auth.profile'),
+    },
+  },
+];
+
+export default routes;
diff --git a/apps/web-antdv-next/src/store/auth.ts b/apps/web-antdv-next/src/store/auth.ts
new file mode 100644
index 00000000..90af35c8
--- /dev/null
+++ b/apps/web-antdv-next/src/store/auth.ts
@@ -0,0 +1,117 @@
+import type { Recordable, UserInfo } from '@vben/types';
+
+import { ref } from 'vue';
+import { useRouter } from 'vue-router';
+
+import { LOGIN_PATH } from '@vben/constants';
+import { preferences } from '@vben/preferences';
+import { resetAllStores, useAccessStore, useUserStore } from '@vben/stores';
+
+import { notification } from 'antdv-next';
+import { defineStore } from 'pinia';
+
+import { getAccessCodesApi, getUserInfoApi, loginApi, logoutApi } from '#/api';
+import { $t } from '#/locales';
+
+export const useAuthStore = defineStore('auth', () => {
+  const accessStore = useAccessStore();
+  const userStore = useUserStore();
+  const router = useRouter();
+
+  const loginLoading = ref(false);
+
+  /**
+   * 异步处理登录操作
+   * Asynchronously handle the login process
+   * @param params 登录表单数据
+   */
+  async function authLogin(
+    params: Recordable<any>,
+    onSuccess?: () => Promise<void> | void,
+  ) {
+    // 异步处理用户登录操作并获取 accessToken
+    let userInfo: null | UserInfo = null;
+    try {
+      loginLoading.value = true;
+      const { accessToken } = await loginApi(params);
+
+      // 如果成功获取到 accessToken
+      if (accessToken) {
+        accessStore.setAccessToken(accessToken);
+
+        // 获取用户信息并存储到 accessStore 中
+        const [fetchUserInfoResult, accessCodes] = await Promise.all([
+          fetchUserInfo(),
+          getAccessCodesApi(),
+        ]);
+
+        userInfo = fetchUserInfoResult;
+
+        userStore.setUserInfo(userInfo);
+        accessStore.setAccessCodes(accessCodes);
+
+        if (accessStore.loginExpired) {
+          accessStore.setLoginExpired(false);
+        } else {
+          onSuccess
+            ? await onSuccess?.()
+            : await router.push(
+                userInfo.homePath || preferences.app.defaultHomePath,
+              );
+        }
+
+        if (userInfo?.realName) {
+          notification.success({
+            description: `${$t('authentication.loginSuccessDesc')}:${userInfo?.realName}`,
+            duration: 3,
+            title: $t('authentication.loginSuccess'),
+          });
+        }
+      }
+    } finally {
+      loginLoading.value = false;
+    }
+
+    return {
+      userInfo,
+    };
+  }
+
+  async function logout(redirect: boolean = true) {
+    try {
+      await logoutApi();
+    } catch {
+      // 不做任何处理
+    }
+    resetAllStores();
+    accessStore.setLoginExpired(false);
+
+    // 回登录页带上当前路由地址
+    await router.replace({
+      path: LOGIN_PATH,
+      query: redirect
+        ? {
+            redirect: encodeURIComponent(router.currentRoute.value.fullPath),
+          }
+        : {},
+    });
+  }
+
+  async function fetchUserInfo() {
+    const userInfo = await getUserInfoApi();
+    userStore.setUserInfo(userInfo);
+    return userInfo;
+  }
+
+  function $reset() {
+    loginLoading.value = false;
+  }
+
+  return {
+    $reset,
+    authLogin,
+    fetchUserInfo,
+    loginLoading,
+    logout,
+  };
+});
diff --git a/apps/web-antdv-next/src/store/index.ts b/apps/web-antdv-next/src/store/index.ts
new file mode 100644
index 00000000..269586ee
--- /dev/null
+++ b/apps/web-antdv-next/src/store/index.ts
@@ -0,0 +1 @@
+export * from './auth';
diff --git a/apps/web-antdv-next/src/views/_core/README.md b/apps/web-antdv-next/src/views/_core/README.md
new file mode 100644
index 00000000..8248afe6
--- /dev/null
+++ b/apps/web-antdv-next/src/views/_core/README.md
@@ -0,0 +1,3 @@
+# \_core
+
+此目录包含应用程序正常运行所需的基本视图。这些视图是应用程序布局中使用的视图。
diff --git a/apps/web-antdv-next/src/views/_core/about/index.vue b/apps/web-antdv-next/src/views/_core/about/index.vue
new file mode 100644
index 00000000..0ee52433
--- /dev/null
+++ b/apps/web-antdv-next/src/views/_core/about/index.vue
@@ -0,0 +1,9 @@
+<script lang="ts" setup>
+import { About } from '@vben/common-ui';
+
+defineOptions({ name: 'About' });
+</script>
+
+<template>
+  <About />
+</template>
diff --git a/apps/web-antdv-next/src/views/_core/authentication/code-login.vue b/apps/web-antdv-next/src/views/_core/authentication/code-login.vue
new file mode 100644
index 00000000..02370f7d
--- /dev/null
+++ b/apps/web-antdv-next/src/views/_core/authentication/code-login.vue
@@ -0,0 +1,68 @@
+<script lang="ts" setup>
+import type { VbenFormSchema } from '@vben/common-ui';
+import type { Recordable } from '@vben/types';
+
+import { computed, ref } from 'vue';
+
+import { AuthenticationCodeLogin, z } from '@vben/common-ui';
+import { $t } from '@vben/locales';
+
+defineOptions({ name: 'CodeLogin' });
+
+const loading = ref(false);
+const CODE_LENGTH = 6;
+
+const formSchema = computed((): VbenFormSchema[] => {
+  return [
+    {
+      component: 'VbenInput',
+      componentProps: {
+        placeholder: $t('authentication.mobile'),
+      },
+      fieldName: 'phoneNumber',
+      label: $t('authentication.mobile'),
+      rules: z
+        .string()
+        .min(1, { message: $t('authentication.mobileTip') })
+        .refine((v) => /^\d{11}$/.test(v), {
+          message: $t('authentication.mobileErrortip'),
+        }),
+    },
+    {
+      component: 'VbenPinInput',
+      componentProps: {
+        codeLength: CODE_LENGTH,
+        createText: (countdown: number) => {
+          const text =
+            countdown > 0
+              ? $t('authentication.sendText', [countdown])
+              : $t('authentication.sendCode');
+          return text;
+        },
+        placeholder: $t('authentication.code'),
+      },
+      fieldName: 'code',
+      label: $t('authentication.code'),
+      rules: z.string().length(CODE_LENGTH, {
+        message: $t('authentication.codeTip', [CODE_LENGTH]),
+      }),
+    },
+  ];
+});
+/**
+ * 异步处理登录操作
+ * Asynchronously handle the login process
+ * @param values 登录表单数据
+ */
+async function handleLogin(values: Recordable<any>) {
+  void values;
+}
+</script>
+
+<template>
+  <AuthenticationCodeLogin
+    :form-schema="formSchema"
+    :loading="loading"
+    @submit="handleLogin"
+  />
+</template>
diff --git a/apps/web-antdv-next/src/views/_core/authentication/forget-password.vue b/apps/web-antdv-next/src/views/_core/authentication/forget-password.vue
new file mode 100644
index 00000000..10444d0a
--- /dev/null
+++ b/apps/web-antdv-next/src/views/_core/authentication/forget-password.vue
@@ -0,0 +1,42 @@
+<script lang="ts" setup>
+import type { VbenFormSchema } from '@vben/common-ui';
+import type { Recordable } from '@vben/types';
+
+import { computed, ref } from 'vue';
+
+import { AuthenticationForgetPassword, z } from '@vben/common-ui';
+import { $t } from '@vben/locales';
+
+defineOptions({ name: 'ForgetPassword' });
+
+const loading = ref(false);
+
+const formSchema = computed((): VbenFormSchema[] => {
+  return [
+    {
+      component: 'VbenInput',
+      componentProps: {
+        placeholder: 'example@example.com',
+      },
+      fieldName: 'email',
+      label: $t('authentication.email'),
+      rules: z
+        .string()
+        .min(1, { message: $t('authentication.emailTip') })
+        .email($t('authentication.emailValidErrorTip')),
+    },
+  ];
+});
+
+function handleSubmit(value: Recordable<any>) {
+  void value;
+}
+</script>
+
+<template>
+  <AuthenticationForgetPassword
+    :form-schema="formSchema"
+    :loading="loading"
+    @submit="handleSubmit"
+  />
+</template>
diff --git a/apps/web-antdv-next/src/views/_core/authentication/login.vue b/apps/web-antdv-next/src/views/_core/authentication/login.vue
new file mode 100644
index 00000000..099e4c8c
--- /dev/null
+++ b/apps/web-antdv-next/src/views/_core/authentication/login.vue
@@ -0,0 +1,98 @@
+<script lang="ts" setup>
+import type { VbenFormSchema } from '@vben/common-ui';
+import type { BasicOption } from '@vben/types';
+
+import { computed, markRaw } from 'vue';
+
+import { AuthenticationLogin, SliderCaptcha, z } from '@vben/common-ui';
+import { $t } from '@vben/locales';
+
+import { useAuthStore } from '#/store';
+
+defineOptions({ name: 'Login' });
+
+const authStore = useAuthStore();
+
+const MOCK_USER_OPTIONS: BasicOption[] = [
+  {
+    label: 'Super',
+    value: 'vben',
+  },
+  {
+    label: 'Admin',
+    value: 'admin',
+  },
+  {
+    label: 'User',
+    value: 'jack',
+  },
+];
+
+const formSchema = computed((): VbenFormSchema[] => {
+  return [
+    {
+      component: 'VbenSelect',
+      componentProps: {
+        options: MOCK_USER_OPTIONS,
+        placeholder: $t('authentication.selectAccount'),
+      },
+      fieldName: 'selectAccount',
+      label: $t('authentication.selectAccount'),
+      rules: z
+        .string()
+        .min(1, { message: $t('authentication.selectAccount') })
+        .optional()
+        .default('vben'),
+    },
+    {
+      component: 'VbenInput',
+      componentProps: {
+        placeholder: $t('authentication.usernameTip'),
+      },
+      dependencies: {
+        trigger(values, form) {
+          if (values.selectAccount) {
+            const findUser = MOCK_USER_OPTIONS.find(
+              (item) => item.value === values.selectAccount,
+            );
+            if (findUser) {
+              form.setValues({
+                password: '123456',
+                username: findUser.value,
+              });
+            }
+          }
+        },
+        triggerFields: ['selectAccount'],
+      },
+      fieldName: 'username',
+      label: $t('authentication.username'),
+      rules: z.string().min(1, { message: $t('authentication.usernameTip') }),
+    },
+    {
+      component: 'VbenInputPassword',
+      componentProps: {
+        placeholder: $t('authentication.password'),
+      },
+      fieldName: 'password',
+      label: $t('authentication.password'),
+      rules: z.string().min(1, { message: $t('authentication.passwordTip') }),
+    },
+    {
+      component: markRaw(SliderCaptcha),
+      fieldName: 'captcha',
+      rules: z.boolean().refine((value) => value, {
+        message: $t('authentication.verifyRequiredTip'),
+      }),
+    },
+  ];
+});
+</script>
+
+<template>
+  <AuthenticationLogin
+    :form-schema="formSchema"
+    :loading="authStore.loginLoading"
+    @submit="authStore.authLogin"
+  />
+</template>
diff --git a/apps/web-antdv-next/src/views/_core/authentication/qrcode-login.vue b/apps/web-antdv-next/src/views/_core/authentication/qrcode-login.vue
new file mode 100644
index 00000000..23f5f2da
--- /dev/null
+++ b/apps/web-antdv-next/src/views/_core/authentication/qrcode-login.vue
@@ -0,0 +1,10 @@
+<script lang="ts" setup>
+import { AuthenticationQrCodeLogin } from '@vben/common-ui';
+import { LOGIN_PATH } from '@vben/constants';
+
+defineOptions({ name: 'QrCodeLogin' });
+</script>
+
+<template>
+  <AuthenticationQrCodeLogin :login-path="LOGIN_PATH" />
+</template>
diff --git a/apps/web-antdv-next/src/views/_core/authentication/register.vue b/apps/web-antdv-next/src/views/_core/authentication/register.vue
new file mode 100644
index 00000000..a1175357
--- /dev/null
+++ b/apps/web-antdv-next/src/views/_core/authentication/register.vue
@@ -0,0 +1,95 @@
+<script lang="ts" setup>
+import type { VbenFormSchema } from '@vben/common-ui';
+import type { Recordable } from '@vben/types';
+
+import { computed, h, ref } from 'vue';
+
+import { AuthenticationRegister, z } from '@vben/common-ui';
+import { $t } from '@vben/locales';
+
+defineOptions({ name: 'Register' });
+
+const loading = ref(false);
+
+const formSchema = computed((): VbenFormSchema[] => {
+  return [
+    {
+      component: 'VbenInput',
+      componentProps: {
+        placeholder: $t('authentication.usernameTip'),
+      },
+      fieldName: 'username',
+      label: $t('authentication.username'),
+      rules: z.string().min(1, { message: $t('authentication.usernameTip') }),
+    },
+    {
+      component: 'VbenInputPassword',
+      componentProps: {
+        passwordStrength: true,
+        placeholder: $t('authentication.password'),
+      },
+      fieldName: 'password',
+      label: $t('authentication.password'),
+      renderComponentContent() {
+        return {
+          strengthText: () => $t('authentication.passwordStrength'),
+        };
+      },
+      rules: z.string().min(1, { message: $t('authentication.passwordTip') }),
+    },
+    {
+      component: 'VbenInputPassword',
+      componentProps: {
+        placeholder: $t('authentication.confirmPassword'),
+      },
+      dependencies: {
+        rules(values) {
+          const { password } = values;
+          return z
+            .string({ error: $t('authentication.passwordTip') })
+            .min(1, { message: $t('authentication.passwordTip') })
+            .refine((value) => value === password, {
+              message: $t('authentication.confirmPasswordTip'),
+            });
+        },
+        triggerFields: ['password'],
+      },
+      fieldName: 'confirmPassword',
+      label: $t('authentication.confirmPassword'),
+    },
+    {
+      component: 'VbenCheckbox',
+      fieldName: 'agreePolicy',
+      renderComponentContent: () => ({
+        default: () =>
+          h('span', [
+            $t('authentication.agree'),
+            h(
+              'a',
+              {
+                class: 'vben-link ml-1 ',
+                href: '',
+              },
+              `${$t('authentication.privacyPolicy')} & ${$t('authentication.terms')}`,
+            ),
+          ]),
+      }),
+      rules: z.boolean().refine((value) => !!value, {
+        message: $t('authentication.agreeTip'),
+      }),
+    },
+  ];
+});
+
+function handleSubmit(value: Recordable<any>) {
+  void value;
+}
+</script>
+
+<template>
+  <AuthenticationRegister
+    :form-schema="formSchema"
+    :loading="loading"
+    @submit="handleSubmit"
+  />
+</template>
diff --git a/apps/web-antdv-next/src/views/_core/fallback/coming-soon.vue b/apps/web-antdv-next/src/views/_core/fallback/coming-soon.vue
new file mode 100644
index 00000000..f394930f
--- /dev/null
+++ b/apps/web-antdv-next/src/views/_core/fallback/coming-soon.vue
@@ -0,0 +1,7 @@
+<script lang="ts" setup>
+import { Fallback } from '@vben/common-ui';
+</script>
+
+<template>
+  <Fallback status="coming-soon" />
+</template>
diff --git a/apps/web-antdv-next/src/views/_core/fallback/forbidden.vue b/apps/web-antdv-next/src/views/_core/fallback/forbidden.vue
new file mode 100644
index 00000000..8ea65fed
--- /dev/null
+++ b/apps/web-antdv-next/src/views/_core/fallback/forbidden.vue
@@ -0,0 +1,9 @@
+<script lang="ts" setup>
+import { Fallback } from '@vben/common-ui';
+
+defineOptions({ name: 'Fallback403Demo' });
+</script>
+
+<template>
+  <Fallback status="403" />
+</template>
diff --git a/apps/web-antdv-next/src/views/_core/fallback/internal-error.vue b/apps/web-antdv-next/src/views/_core/fallback/internal-error.vue
new file mode 100644
index 00000000..819a47d5
--- /dev/null
+++ b/apps/web-antdv-next/src/views/_core/fallback/internal-error.vue
@@ -0,0 +1,9 @@
+<script lang="ts" setup>
+import { Fallback } from '@vben/common-ui';
+
+defineOptions({ name: 'Fallback500Demo' });
+</script>
+
+<template>
+  <Fallback status="500" />
+</template>
diff --git a/apps/web-antdv-next/src/views/_core/fallback/not-found.vue b/apps/web-antdv-next/src/views/_core/fallback/not-found.vue
new file mode 100644
index 00000000..4d178e9c
--- /dev/null
+++ b/apps/web-antdv-next/src/views/_core/fallback/not-found.vue
@@ -0,0 +1,9 @@
+<script lang="ts" setup>
+import { Fallback } from '@vben/common-ui';
+
+defineOptions({ name: 'Fallback404Demo' });
+</script>
+
+<template>
+  <Fallback status="404" />
+</template>
diff --git a/apps/web-antdv-next/src/views/_core/fallback/offline.vue b/apps/web-antdv-next/src/views/_core/fallback/offline.vue
new file mode 100644
index 00000000..5de4a88d
--- /dev/null
+++ b/apps/web-antdv-next/src/views/_core/fallback/offline.vue
@@ -0,0 +1,9 @@
+<script lang="ts" setup>
+import { Fallback } from '@vben/common-ui';
+
+defineOptions({ name: 'FallbackOfflineDemo' });
+</script>
+
+<template>
+  <Fallback status="offline" />
+</template>
diff --git a/apps/web-antdv-next/src/views/_core/profile/base-setting.vue b/apps/web-antdv-next/src/views/_core/profile/base-setting.vue
new file mode 100644
index 00000000..aa8a4c26
--- /dev/null
+++ b/apps/web-antdv-next/src/views/_core/profile/base-setting.vue
@@ -0,0 +1,65 @@
+<script setup lang="ts">
+import type { BasicOption } from '@vben/types';
+
+import type { VbenFormSchema } from '#/adapter/form';
+
+import { computed, onMounted, ref } from 'vue';
+
+import { ProfileBaseSetting } from '@vben/common-ui';
+
+import { getUserInfoApi } from '#/api';
+
+const profileBaseSettingRef = ref();
+
+const MOCK_ROLES_OPTIONS: BasicOption[] = [
+  {
+    label: '管理员',
+    value: 'super',
+  },
+  {
+    label: '用户',
+    value: 'user',
+  },
+  {
+    label: '测试',
+    value: 'test',
+  },
+];
+
+const formSchema = computed((): VbenFormSchema[] => {
+  return [
+    {
+      fieldName: 'realName',
+      component: 'Input',
+      label: '姓名',
+    },
+    {
+      fieldName: 'username',
+      component: 'Input',
+      label: '用户名',
+    },
+    {
+      fieldName: 'roles',
+      component: 'Select',
+      componentProps: {
+        mode: 'tags',
+        options: MOCK_ROLES_OPTIONS,
+      },
+      label: '角色',
+    },
+    {
+      fieldName: 'introduction',
+      component: 'Textarea',
+      label: '个人简介',
+    },
+  ];
+});
+
+onMounted(async () => {
+  const data = await getUserInfoApi();
+  profileBaseSettingRef.value.getFormApi().setValues(data);
+});
+</script>
+<template>
+  <ProfileBaseSetting ref="profileBaseSettingRef" :form-schema="formSchema" />
+</template>
diff --git a/apps/web-antdv-next/src/views/_core/profile/index.vue b/apps/web-antdv-next/src/views/_core/profile/index.vue
new file mode 100644
index 00000000..8740894e
--- /dev/null
+++ b/apps/web-antdv-next/src/views/_core/profile/index.vue
@@ -0,0 +1,49 @@
+<script setup lang="ts">
+import { ref } from 'vue';
+
+import { Profile } from '@vben/common-ui';
+import { useUserStore } from '@vben/stores';
+
+import ProfileBase from './base-setting.vue';
+import ProfileNotificationSetting from './notification-setting.vue';
+import ProfilePasswordSetting from './password-setting.vue';
+import ProfileSecuritySetting from './security-setting.vue';
+
+const userStore = useUserStore();
+
+const tabsValue = ref<string>('basic');
+
+const tabs = ref([
+  {
+    label: '基本设置',
+    value: 'basic',
+  },
+  {
+    label: '安全设置',
+    value: 'security',
+  },
+  {
+    label: '修改密码',
+    value: 'password',
+  },
+  {
+    label: '新消息提醒',
+    value: 'notice',
+  },
+]);
+</script>
+<template>
+  <Profile
+    v-model:model-value="tabsValue"
+    title="个人中心"
+    :user-info="userStore.userInfo"
+    :tabs="tabs"
+  >
+    <template #content>
+      <ProfileBase v-if="tabsValue === 'basic'" />
+      <ProfileSecuritySetting v-if="tabsValue === 'security'" />
+      <ProfilePasswordSetting v-if="tabsValue === 'password'" />
+      <ProfileNotificationSetting v-if="tabsValue === 'notice'" />
+    </template>
+  </Profile>
+</template>
diff --git a/apps/web-antdv-next/src/views/_core/profile/notification-setting.vue b/apps/web-antdv-next/src/views/_core/profile/notification-setting.vue
new file mode 100644
index 00000000..324a4b39
--- /dev/null
+++ b/apps/web-antdv-next/src/views/_core/profile/notification-setting.vue
@@ -0,0 +1,31 @@
+<script setup lang="ts">
+import { computed } from 'vue';
+
+import { ProfileNotificationSetting } from '@vben/common-ui';
+
+const formSchema = computed(() => {
+  return [
+    {
+      value: true,
+      fieldName: 'accountPassword',
+      label: '账户密码',
+      description: '其他用户的消息将以站内信的形式通知',
+    },
+    {
+      value: true,
+      fieldName: 'systemMessage',
+      label: '系统消息',
+      description: '系统消息将以站内信的形式通知',
+    },
+    {
+      value: true,
+      fieldName: 'todoTask',
+      label: '待办任务',
+      description: '待办任务将以站内信的形式通知',
+    },
+  ];
+});
+</script>
+<template>
+  <ProfileNotificationSetting :form-schema="formSchema" />
+</template>
diff --git a/apps/web-antdv-next/src/views/_core/profile/password-setting.vue b/apps/web-antdv-next/src/views/_core/profile/password-setting.vue
new file mode 100644
index 00000000..a79d083a
--- /dev/null
+++ b/apps/web-antdv-next/src/views/_core/profile/password-setting.vue
@@ -0,0 +1,63 @@
+<script setup lang="ts">
+import type { VbenFormSchema } from '#/adapter/form';
+
+import { computed } from 'vue';
+
+import { ProfilePasswordSetting, z } from '@vben/common-ui';
+
+import { message } from 'antdv-next';
+
+const formSchema = computed((): VbenFormSchema[] => {
+  return [
+    {
+      fieldName: 'oldPassword',
+      label: '旧密码',
+      component: 'VbenInputPassword',
+      componentProps: {
+        placeholder: '请输入旧密码',
+      },
+    },
+    {
+      fieldName: 'newPassword',
+      label: '新密码',
+      component: 'VbenInputPassword',
+      componentProps: {
+        passwordStrength: true,
+        placeholder: '请输入新密码',
+      },
+    },
+    {
+      fieldName: 'confirmPassword',
+      label: '确认密码',
+      component: 'VbenInputPassword',
+      componentProps: {
+        passwordStrength: true,
+        placeholder: '请再次输入新密码',
+      },
+      dependencies: {
+        rules(values) {
+          const { newPassword } = values;
+          return z
+            .string({ error: '请再次输入新密码' })
+            .min(1, { message: '请再次输入新密码' })
+            .refine((value) => value === newPassword, {
+              message: '两次输入的密码不一致',
+            });
+        },
+        triggerFields: ['newPassword'],
+      },
+    },
+  ];
+});
+
+function handleSubmit() {
+  message.success('密码修改成功');
+}
+</script>
+<template>
+  <ProfilePasswordSetting
+    class="w-1/3"
+    :form-schema="formSchema"
+    @submit="handleSubmit"
+  />
+</template>
diff --git a/apps/web-antdv-next/src/views/_core/profile/security-setting.vue b/apps/web-antdv-next/src/views/_core/profile/security-setting.vue
new file mode 100644
index 00000000..be30db58
--- /dev/null
+++ b/apps/web-antdv-next/src/views/_core/profile/security-setting.vue
@@ -0,0 +1,43 @@
+<script setup lang="ts">
+import { computed } from 'vue';
+
+import { ProfileSecuritySetting } from '@vben/common-ui';
+
+const formSchema = computed(() => {
+  return [
+    {
+      value: true,
+      fieldName: 'accountPassword',
+      label: '账户密码',
+      description: '当前密码强度：强',
+    },
+    {
+      value: true,
+      fieldName: 'securityPhone',
+      label: '密保手机',
+      description: '已绑定手机：138****8293',
+    },
+    {
+      value: true,
+      fieldName: 'securityQuestion',
+      label: '密保问题',
+      description: '未设置密保问题，密保问题可有效保护账户安全',
+    },
+    {
+      value: true,
+      fieldName: 'securityEmail',
+      label: '备用邮箱',
+      description: '已绑定邮箱：ant***sign.com',
+    },
+    {
+      value: false,
+      fieldName: 'securityMfa',
+      label: 'MFA 设备',
+      description: '未绑定 MFA 设备，绑定后，可以进行二次确认',
+    },
+  ];
+});
+</script>
+<template>
+  <ProfileSecuritySetting :form-schema="formSchema" />
+</template>
diff --git a/apps/web-antdv-next/src/views/dashboard/analytics/analytics-trends.vue b/apps/web-antdv-next/src/views/dashboard/analytics/analytics-trends.vue
new file mode 100644
index 00000000..f1f0b232
--- /dev/null
+++ b/apps/web-antdv-next/src/views/dashboard/analytics/analytics-trends.vue
@@ -0,0 +1,98 @@
+<script lang="ts" setup>
+import type { EchartsUIType } from '@vben/plugins/echarts';
+
+import { onMounted, ref } from 'vue';
+
+import { EchartsUI, useEcharts } from '@vben/plugins/echarts';
+
+const chartRef = ref<EchartsUIType>();
+const { renderEcharts } = useEcharts(chartRef);
+
+onMounted(() => {
+  renderEcharts({
+    grid: {
+      bottom: 0,
+      containLabel: true,
+      left: '1%',
+      right: '1%',
+      top: '2 %',
+    },
+    series: [
+      {
+        areaStyle: {},
+        data: [
+          111, 2000, 6000, 16_000, 33_333, 55_555, 64_000, 33_333, 18_000,
+          36_000, 70_000, 42_444, 23_222, 13_000, 8000, 4000, 1200, 333, 222,
+          111,
+        ],
+        itemStyle: {
+          color: '#5ab1ef',
+        },
+        smooth: true,
+        type: 'line',
+      },
+      {
+        areaStyle: {},
+        data: [
+          33, 66, 88, 333, 3333, 6200, 20_000, 3000, 1200, 13_000, 22_000,
+          11_000, 2221, 1201, 390, 198, 60, 30, 22, 11,
+        ],
+        itemStyle: {
+          color: '#019680',
+        },
+        smooth: true,
+        type: 'line',
+      },
+    ],
+    tooltip: {
+      axisPointer: {
+        lineStyle: {
+          color: '#019680',
+          width: 1,
+        },
+      },
+      trigger: 'axis',
+    },
+    // xAxis: {
+    //   axisTick: {
+    //     show: false,
+    //   },
+    //   boundaryGap: false,
+    //   data: Array.from({ length: 18 }).map((_item, index) => `${index + 6}:00`),
+    //   type: 'category',
+    // },
+    xAxis: {
+      axisTick: {
+        show: false,
+      },
+      boundaryGap: false,
+      data: Array.from({ length: 18 }).map((_item, index) => `${index + 6}:00`),
+      splitLine: {
+        lineStyle: {
+          type: 'solid',
+          width: 1,
+        },
+        show: true,
+      },
+      type: 'category',
+    },
+    yAxis: [
+      {
+        axisTick: {
+          show: false,
+        },
+        max: 80_000,
+        splitArea: {
+          show: true,
+        },
+        splitNumber: 4,
+        type: 'value',
+      },
+    ],
+  });
+});
+</script>
+
+<template>
+  <EchartsUI ref="chartRef" />
+</template>
diff --git a/apps/web-antdv-next/src/views/dashboard/analytics/analytics-visits-data.vue b/apps/web-antdv-next/src/views/dashboard/analytics/analytics-visits-data.vue
new file mode 100644
index 00000000..190fb41f
--- /dev/null
+++ b/apps/web-antdv-next/src/views/dashboard/analytics/analytics-visits-data.vue
@@ -0,0 +1,82 @@
+<script lang="ts" setup>
+import type { EchartsUIType } from '@vben/plugins/echarts';
+
+import { onMounted, ref } from 'vue';
+
+import { EchartsUI, useEcharts } from '@vben/plugins/echarts';
+
+const chartRef = ref<EchartsUIType>();
+const { renderEcharts } = useEcharts(chartRef);
+
+onMounted(() => {
+  renderEcharts({
+    legend: {
+      bottom: 0,
+      data: ['访问', '趋势'],
+    },
+    radar: {
+      indicator: [
+        {
+          name: '网页',
+        },
+        {
+          name: '移动端',
+        },
+        {
+          name: 'Ipad',
+        },
+        {
+          name: '客户端',
+        },
+        {
+          name: '第三方',
+        },
+        {
+          name: '其它',
+        },
+      ],
+      radius: '60%',
+      splitNumber: 8,
+    },
+    series: [
+      {
+        areaStyle: {
+          opacity: 1,
+          shadowBlur: 0,
+          shadowColor: 'rgba(0,0,0,.2)',
+          shadowOffsetX: 0,
+          shadowOffsetY: 10,
+        },
+        data: [
+          {
+            itemStyle: {
+              color: '#b6a2de',
+            },
+            name: '访问',
+            value: [90, 50, 86, 40, 50, 20],
+          },
+          {
+            itemStyle: {
+              color: '#5ab1ef',
+            },
+            name: '趋势',
+            value: [70, 75, 70, 76, 20, 85],
+          },
+        ],
+        itemStyle: {
+          // borderColor: '#fff',
+          borderRadius: 10,
+          borderWidth: 2,
+        },
+        symbolSize: 0,
+        type: 'radar',
+      },
+    ],
+    tooltip: {},
+  });
+});
+</script>
+
+<template>
+  <EchartsUI ref="chartRef" />
+</template>
diff --git a/apps/web-antdv-next/src/views/dashboard/analytics/analytics-visits-sales.vue b/apps/web-antdv-next/src/views/dashboard/analytics/analytics-visits-sales.vue
new file mode 100644
index 00000000..6ff52086
--- /dev/null
+++ b/apps/web-antdv-next/src/views/dashboard/analytics/analytics-visits-sales.vue
@@ -0,0 +1,46 @@
+<script lang="ts" setup>
+import type { EchartsUIType } from '@vben/plugins/echarts';
+
+import { onMounted, ref } from 'vue';
+
+import { EchartsUI, useEcharts } from '@vben/plugins/echarts';
+
+const chartRef = ref<EchartsUIType>();
+const { renderEcharts } = useEcharts(chartRef);
+
+onMounted(() => {
+  renderEcharts({
+    series: [
+      {
+        animationDelay() {
+          return Math.random() * 400;
+        },
+        animationEasing: 'exponentialInOut',
+        animationType: 'scale',
+        center: ['50%', '50%'],
+        color: ['#5ab1ef', '#b6a2de', '#67e0e3', '#2ec7c9'],
+        data: [
+          { name: '外包', value: 500 },
+          { name: '定制', value: 310 },
+          { name: '技术支持', value: 274 },
+          { name: '远程', value: 400 },
+        ].toSorted((a, b) => {
+          return a.value - b.value;
+        }),
+        name: '商业占比',
+        radius: '80%',
+        roseType: 'radius',
+        type: 'pie',
+      },
+    ],
+
+    tooltip: {
+      trigger: 'item',
+    },
+  });
+});
+</script>
+
+<template>
+  <EchartsUI ref="chartRef" />
+</template>
diff --git a/apps/web-antdv-next/src/views/dashboard/analytics/analytics-visits-source.vue b/apps/web-antdv-next/src/views/dashboard/analytics/analytics-visits-source.vue
new file mode 100644
index 00000000..0915c7af
--- /dev/null
+++ b/apps/web-antdv-next/src/views/dashboard/analytics/analytics-visits-source.vue
@@ -0,0 +1,65 @@
+<script lang="ts" setup>
+import type { EchartsUIType } from '@vben/plugins/echarts';
+
+import { onMounted, ref } from 'vue';
+
+import { EchartsUI, useEcharts } from '@vben/plugins/echarts';
+
+const chartRef = ref<EchartsUIType>();
+const { renderEcharts } = useEcharts(chartRef);
+
+onMounted(() => {
+  renderEcharts({
+    legend: {
+      bottom: '2%',
+      left: 'center',
+    },
+    series: [
+      {
+        animationDelay() {
+          return Math.random() * 100;
+        },
+        animationEasing: 'exponentialInOut',
+        animationType: 'scale',
+        avoidLabelOverlap: false,
+        color: ['#5ab1ef', '#b6a2de', '#67e0e3', '#2ec7c9'],
+        data: [
+          { name: '搜索引擎', value: 1048 },
+          { name: '直接访问', value: 735 },
+          { name: '邮件营销', value: 580 },
+          { name: '联盟广告', value: 484 },
+        ],
+        emphasis: {
+          label: {
+            fontSize: '12',
+            fontWeight: 'bold',
+            show: true,
+          },
+        },
+        itemStyle: {
+          // borderColor: '#fff',
+          borderRadius: 10,
+          borderWidth: 2,
+        },
+        label: {
+          position: 'center',
+          show: false,
+        },
+        labelLine: {
+          show: false,
+        },
+        name: '访问来源',
+        radius: ['40%', '65%'],
+        type: 'pie',
+      },
+    ],
+    tooltip: {
+      trigger: 'item',
+    },
+  });
+});
+</script>
+
+<template>
+  <EchartsUI ref="chartRef" />
+</template>
diff --git a/apps/web-antdv-next/src/views/dashboard/analytics/analytics-visits.vue b/apps/web-antdv-next/src/views/dashboard/analytics/analytics-visits.vue
new file mode 100644
index 00000000..7e0f1013
--- /dev/null
+++ b/apps/web-antdv-next/src/views/dashboard/analytics/analytics-visits.vue
@@ -0,0 +1,55 @@
+<script lang="ts" setup>
+import type { EchartsUIType } from '@vben/plugins/echarts';
+
+import { onMounted, ref } from 'vue';
+
+import { EchartsUI, useEcharts } from '@vben/plugins/echarts';
+
+const chartRef = ref<EchartsUIType>();
+const { renderEcharts } = useEcharts(chartRef);
+
+onMounted(() => {
+  renderEcharts({
+    grid: {
+      bottom: 0,
+      containLabel: true,
+      left: '1%',
+      right: '1%',
+      top: '2 %',
+    },
+    series: [
+      {
+        barMaxWidth: 80,
+        // color: '#4f69fd',
+        data: [
+          3000, 2000, 3333, 5000, 3200, 4200, 3200, 2100, 3000, 5100, 6000,
+          3200, 4800,
+        ],
+        type: 'bar',
+      },
+    ],
+    tooltip: {
+      axisPointer: {
+        lineStyle: {
+          // color: '#4f69fd',
+          width: 1,
+        },
+      },
+      trigger: 'axis',
+    },
+    xAxis: {
+      data: Array.from({ length: 12 }).map((_item, index) => `${index + 1}月`),
+      type: 'category',
+    },
+    yAxis: {
+      max: 8000,
+      splitNumber: 4,
+      type: 'value',
+    },
+  });
+});
+</script>
+
+<template>
+  <EchartsUI ref="chartRef" />
+</template>
diff --git a/apps/web-antdv-next/src/views/dashboard/analytics/index.vue b/apps/web-antdv-next/src/views/dashboard/analytics/index.vue
new file mode 100644
index 00000000..e794c99a
--- /dev/null
+++ b/apps/web-antdv-next/src/views/dashboard/analytics/index.vue
@@ -0,0 +1,90 @@
+<script lang="ts" setup>
+import type { AnalysisOverviewItem } from '@vben/common-ui';
+import type { TabOption } from '@vben/types';
+
+import {
+  AnalysisChartCard,
+  AnalysisChartsTabs,
+  AnalysisOverview,
+} from '@vben/common-ui';
+import {
+  SvgBellIcon,
+  SvgCakeIcon,
+  SvgCardIcon,
+  SvgDownloadIcon,
+} from '@vben/icons';
+
+import AnalyticsTrends from './analytics-trends.vue';
+import AnalyticsVisitsData from './analytics-visits-data.vue';
+import AnalyticsVisitsSales from './analytics-visits-sales.vue';
+import AnalyticsVisitsSource from './analytics-visits-source.vue';
+import AnalyticsVisits from './analytics-visits.vue';
+
+const overviewItems: AnalysisOverviewItem[] = [
+  {
+    icon: SvgCardIcon,
+    title: '用户量',
+    totalTitle: '总用户量',
+    totalValue: 120_000,
+    value: 2000,
+  },
+  {
+    icon: SvgCakeIcon,
+    title: '访问量',
+    totalTitle: '总访问量',
+    totalValue: 500_000,
+    value: 20_000,
+  },
+  {
+    icon: SvgDownloadIcon,
+    title: '下载量',
+    totalTitle: '总下载量',
+    totalValue: 120_000,
+    value: 8000,
+  },
+  {
+    icon: SvgBellIcon,
+    title: '使用量',
+    totalTitle: '总使用量',
+    totalValue: 50_000,
+    value: 5000,
+  },
+];
+
+const chartTabs: TabOption[] = [
+  {
+    label: '流量趋势',
+    value: 'trends',
+  },
+  {
+    label: '月访问量',
+    value: 'visits',
+  },
+];
+</script>
+
+<template>
+  <div class="p-5">
+    <AnalysisOverview :items="overviewItems" />
+    <AnalysisChartsTabs :tabs="chartTabs" class="mt-5">
+      <template #trends>
+        <AnalyticsTrends />
+      </template>
+      <template #visits>
+        <AnalyticsVisits />
+      </template>
+    </AnalysisChartsTabs>
+
+    <div class="mt-5 w-full md:flex">
+      <AnalysisChartCard class="mt-5 md:mt-0 md:mr-4 md:w-1/3" title="访问数量">
+        <AnalyticsVisitsData />
+      </AnalysisChartCard>
+      <AnalysisChartCard class="mt-5 md:mt-0 md:mr-4 md:w-1/3" title="访问来源">
+        <AnalyticsVisitsSource />
+      </AnalysisChartCard>
+      <AnalysisChartCard class="mt-5 md:mt-0 md:w-1/3" title="访问来源">
+        <AnalyticsVisitsSales />
+      </AnalysisChartCard>
+    </div>
+  </div>
+</template>
diff --git a/apps/web-antdv-next/src/views/dashboard/workspace/index.vue b/apps/web-antdv-next/src/views/dashboard/workspace/index.vue
new file mode 100644
index 00000000..b95d6138
--- /dev/null
+++ b/apps/web-antdv-next/src/views/dashboard/workspace/index.vue
@@ -0,0 +1,266 @@
+<script lang="ts" setup>
+import type {
+  WorkbenchProjectItem,
+  WorkbenchQuickNavItem,
+  WorkbenchTodoItem,
+  WorkbenchTrendItem,
+} from '@vben/common-ui';
+
+import { ref } from 'vue';
+import { useRouter } from 'vue-router';
+
+import {
+  AnalysisChartCard,
+  WorkbenchHeader,
+  WorkbenchProject,
+  WorkbenchQuickNav,
+  WorkbenchTodo,
+  WorkbenchTrends,
+} from '@vben/common-ui';
+import { preferences } from '@vben/preferences';
+import { useUserStore } from '@vben/stores';
+import { openWindow } from '@vben/utils';
+
+import AnalyticsVisitsSource from '../analytics/analytics-visits-source.vue';
+
+const userStore = useUserStore();
+
+// 这是一个示例数据，实际项目中需要根据实际情况进行调整
+// url 也可以是内部路由，在 navTo 方法中识别处理，进行内部跳转
+// 例如：url: /dashboard/workspace
+const projectItems: WorkbenchProjectItem[] = [
+  {
+    color: '',
+    content: '不要等待机会，而要创造机会。',
+    date: '2021-04-01',
+    group: '开源组',
+    icon: 'carbon:logo-github',
+    title: 'Github',
+    url: 'https://github.com',
+  },
+  {
+    color: '#3fb27f',
+    content: '现在的你决定将来的你。',
+    date: '2021-04-01',
+    group: '算法组',
+    icon: 'ion:logo-vue',
+    title: 'Vue',
+    url: 'https://vuejs.org',
+  },
+  {
+    color: '#e18525',
+    content: '没有什么才能比努力更重要。',
+    date: '2021-04-01',
+    group: '上班摸鱼',
+    icon: 'ion:logo-html5',
+    title: 'Html5',
+    url: 'https://developer.mozilla.org/zh-CN/docs/Web/HTML',
+  },
+  {
+    color: '#bf0c2c',
+    content: '热情和欲望可以突破一切难关。',
+    date: '2021-04-01',
+    group: 'UI',
+    icon: 'ion:logo-angular',
+    title: 'Angular',
+    url: 'https://angular.io',
+  },
+  {
+    color: '#00d8ff',
+    content: '健康的身体是实现目标的基石。',
+    date: '2021-04-01',
+    group: '技术牛',
+    icon: 'bx:bxl-react',
+    title: 'React',
+    url: 'https://reactjs.org',
+  },
+  {
+    color: '#EBD94E',
+    content: '路是走出来的，而不是空想出来的。',
+    date: '2021-04-01',
+    group: '架构组',
+    icon: 'ion:logo-javascript',
+    title: 'Js',
+    url: 'https://developer.mozilla.org/zh-CN/docs/Web/JavaScript',
+  },
+];
+
+// 同样，这里的 url 也可以使用以 http 开头的外部链接
+const quickNavItems: WorkbenchQuickNavItem[] = [
+  {
+    color: '#1fdaca',
+    icon: 'ion:home-outline',
+    title: '首页',
+    url: '/',
+  },
+  {
+    color: '#bf0c2c',
+    icon: 'ion:grid-outline',
+    title: '仪表盘',
+    url: '/dashboard',
+  },
+  {
+    color: '#e18525',
+    icon: 'ion:layers-outline',
+    title: '组件',
+    url: '/demos/features/icons',
+  },
+  {
+    color: '#3fb27f',
+    icon: 'ion:settings-outline',
+    title: '系统管理',
+    url: '/demos/features/login-expired', // 这里的 URL 是示例，实际项目中需要根据实际情况进行调整
+  },
+  {
+    color: '#4daf1bc9',
+    icon: 'ion:key-outline',
+    title: '权限管理',
+    url: '/demos/access/page-control',
+  },
+  {
+    color: '#00d8ff',
+    icon: 'ion:bar-chart-outline',
+    title: '图表',
+    url: '/analytics',
+  },
+];
+
+const todoItems = ref<WorkbenchTodoItem[]>([
+  {
+    completed: false,
+    content: `审查最近提交到Git仓库的前端代码，确保代码质量和规范。`,
+    date: '2024-07-30 11:00:00',
+    title: '审查前端代码提交',
+  },
+  {
+    completed: true,
+    content: `检查并优化系统性能，降低CPU使用率。`,
+    date: '2024-07-30 11:00:00',
+    title: '系统性能优化',
+  },
+  {
+    completed: false,
+    content: `进行系统安全检查，确保没有安全漏洞或未授权的访问。 `,
+    date: '2024-07-30 11:00:00',
+    title: '安全检查',
+  },
+  {
+    completed: false,
+    content: `更新项目中的所有npm依赖包，确保使用最新版本。`,
+    date: '2024-07-30 11:00:00',
+    title: '更新项目依赖',
+  },
+  {
+    completed: false,
+    content: `修复用户报告的页面UI显示问题，确保在不同浏览器中显示一致。 `,
+    date: '2024-07-30 11:00:00',
+    title: '修复UI显示问题',
+  },
+]);
+const trendItems: WorkbenchTrendItem[] = [
+  {
+    avatar: 'svg:avatar-1',
+    content: `在 <a>开源组</a> 创建了项目 <a>Vue</a>`,
+    date: '刚刚',
+    title: '威廉',
+  },
+  {
+    avatar: 'svg:avatar-2',
+    content: `关注了 <a>威廉</a> `,
+    date: '1个小时前',
+    title: '艾文',
+  },
+  {
+    avatar: 'svg:avatar-3',
+    content: `发布了 <a>个人动态</a> `,
+    date: '1天前',
+    title: '克里斯',
+  },
+  {
+    avatar: 'svg:avatar-4',
+    content: `发表文章 <a>如何编写一个Vite插件</a> `,
+    date: '2天前',
+    title: 'Vben',
+  },
+  {
+    avatar: 'svg:avatar-1',
+    content: `回复了 <a>杰克</a> 的问题 <a>如何进行项目优化？</a>`,
+    date: '3天前',
+    title: '皮特',
+  },
+  {
+    avatar: 'svg:avatar-2',
+    content: `关闭了问题 <a>如何运行项目</a> `,
+    date: '1周前',
+    title: '杰克',
+  },
+  {
+    avatar: 'svg:avatar-3',
+    content: `发布了 <a>个人动态</a> `,
+    date: '1周前',
+    title: '威廉',
+  },
+  {
+    avatar: 'svg:avatar-4',
+    content: `推送了代码到 <a>Github</a>`,
+    date: '2021-04-01 20:00',
+    title: '威廉',
+  },
+  {
+    avatar: 'svg:avatar-4',
+    content: `发表文章 <a>如何编写使用 Admin Vben</a> `,
+    date: '2021-03-01 20:00',
+    title: 'Vben',
+  },
+];
+
+const router = useRouter();
+
+// 这是一个示例方法，实际项目中需要根据实际情况进行调整
+// This is a sample method, adjust according to the actual project requirements
+function navTo(nav: WorkbenchProjectItem | WorkbenchQuickNavItem) {
+  if (nav.url?.startsWith('http')) {
+    openWindow(nav.url);
+    return;
+  }
+  if (nav.url?.startsWith('/')) {
+    router.push(nav.url).catch((error) => {
+      console.error('Navigation failed:', error);
+    });
+  } else {
+    console.warn(`Unknown URL for navigation item: ${nav.title} -> ${nav.url}`);
+  }
+}
+</script>
+
+<template>
+  <div class="p-5">
+    <WorkbenchHeader
+      :avatar="userStore.userInfo?.avatar || preferences.app.defaultAvatar"
+    >
+      <template #title>
+        早安, {{ userStore.userInfo?.realName }}, 开始您一天的工作吧！
+      </template>
+      <template #description> 今日晴，20℃ - 32℃！ </template>
+    </WorkbenchHeader>
+
+    <div class="mt-5 flex flex-col lg:flex-row">
+      <div class="mr-4 w-full lg:w-3/5">
+        <WorkbenchProject :items="projectItems" title="项目" @click="navTo" />
+        <WorkbenchTrends :items="trendItems" class="mt-5" title="最新动态" />
+      </div>
+      <div class="w-full lg:w-2/5">
+        <WorkbenchQuickNav
+          :items="quickNavItems"
+          class="mt-5 lg:mt-0"
+          title="快捷导航"
+          @click="navTo"
+        />
+        <WorkbenchTodo :items="todoItems" class="mt-5" title="待办事项" />
+        <AnalysisChartCard class="mt-5" title="访问来源">
+          <AnalyticsVisitsSource />
+        </AnalysisChartCard>
+      </div>
+    </div>
+  </div>
+</template>
diff --git a/apps/web-antdv-next/src/views/demos/antd/index.vue b/apps/web-antdv-next/src/views/demos/antd/index.vue
new file mode 100644
index 00000000..6fb1998d
--- /dev/null
+++ b/apps/web-antdv-next/src/views/demos/antd/index.vue
@@ -0,0 +1,66 @@
+<script lang="ts" setup>
+import { Page } from '@vben/common-ui';
+
+import { Button, Card, message, notification, Space } from 'antdv-next';
+
+type NotificationType = 'error' | 'info' | 'success' | 'warning';
+
+function info() {
+  message.info('How many roads must a man walk down');
+}
+
+function error() {
+  message.error({
+    content: 'Once upon a time you dressed so fine',
+    duration: 2.5,
+  });
+}
+
+function warning() {
+  message.warning('How many roads must a man walk down');
+}
+function success() {
+  message.success('Cause you walked hand in hand With another man in my place');
+}
+
+function notify(type: NotificationType) {
+  notification[type]({
+    duration: 2.5,
+    title: '说点啥呢',
+    type,
+  });
+}
+</script>
+
+<template>
+  <Page
+    description="支持多语言，主题功能集成切换等"
+    title="Ant Design Vue组件使用演示"
+  >
+    <Card class="mb-5" title="按钮">
+      <Space>
+        <Button>Default</Button>
+        <Button type="primary"> Primary </Button>
+        <Button> Info </Button>
+        <Button danger> Error </Button>
+      </Space>
+    </Card>
+    <Card class="mb-5" title="Message">
+      <Space>
+        <Button @click="info"> 信息 </Button>
+        <Button danger @click="error"> 错误 </Button>
+        <Button @click="warning"> 警告 </Button>
+        <Button @click="success"> 成功 </Button>
+      </Space>
+    </Card>
+
+    <Card class="mb-5" title="Notification">
+      <Space>
+        <Button @click="notify('info')"> 信息 </Button>
+        <Button danger @click="notify('error')"> 错误 </Button>
+        <Button @click="notify('warning')"> 警告 </Button>
+        <Button @click="notify('success')"> 成功 </Button>
+      </Space>
+    </Card>
+  </Page>
+</template>
diff --git a/apps/web-antdv-next/tsconfig.json b/apps/web-antdv-next/tsconfig.json
new file mode 100644
index 00000000..858a0ec0
--- /dev/null
+++ b/apps/web-antdv-next/tsconfig.json
@@ -0,0 +1,11 @@
+{
+  "$schema": "https://json.schemastore.org/tsconfig",
+  "extends": "@vben/tsconfig/web-app.json",
+  "compilerOptions": {
+    "paths": {
+      "#/*": ["./src/*"]
+    }
+  },
+  "references": [{ "path": "./tsconfig.node.json" }],
+  "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.vue"]
+}
diff --git a/apps/web-antdv-next/tsconfig.node.json b/apps/web-antdv-next/tsconfig.node.json
new file mode 100644
index 00000000..36e9fb5f
--- /dev/null
+++ b/apps/web-antdv-next/tsconfig.node.json
@@ -0,0 +1,10 @@
+{
+  "$schema": "https://json.schemastore.org/tsconfig",
+  "extends": "@vben/tsconfig/node.json",
+  "compilerOptions": {
+    "composite": true,
+    "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.node.tsbuildinfo",
+    "noEmit": false
+  },
+  "include": ["vite.config.ts"]
+}
diff --git a/apps/web-ele/src/types/element-plus-style-css.d.ts b/apps/web-ele/src/types/element-plus-style-css.d.ts
new file mode 100644
index 00000000..ba7a7667
--- /dev/null
+++ b/apps/web-ele/src/types/element-plus-style-css.d.ts
@@ -0,0 +1,4 @@
+declare module 'element-plus/es/components/*/style/css' {
+  const sideEffect: undefined;
+  export default sideEffect;
+}
diff --git a/apps/web-ele/src/views/_core/profile/base-setting.vue b/apps/web-ele/src/views/_core/profile/base-setting.vue
new file mode 100644
index 00000000..aa8a4c26
--- /dev/null
+++ b/apps/web-ele/src/views/_core/profile/base-setting.vue
@@ -0,0 +1,65 @@
+<script setup lang="ts">
+import type { BasicOption } from '@vben/types';
+
+import type { VbenFormSchema } from '#/adapter/form';
+
+import { computed, onMounted, ref } from 'vue';
+
+import { ProfileBaseSetting } from '@vben/common-ui';
+
+import { getUserInfoApi } from '#/api';
+
+const profileBaseSettingRef = ref();
+
+const MOCK_ROLES_OPTIONS: BasicOption[] = [
+  {
+    label: '管理员',
+    value: 'super',
+  },
+  {
+    label: '用户',
+    value: 'user',
+  },
+  {
+    label: '测试',
+    value: 'test',
+  },
+];
+
+const formSchema = computed((): VbenFormSchema[] => {
+  return [
+    {
+      fieldName: 'realName',
+      component: 'Input',
+      label: '姓名',
+    },
+    {
+      fieldName: 'username',
+      component: 'Input',
+      label: '用户名',
+    },
+    {
+      fieldName: 'roles',
+      component: 'Select',
+      componentProps: {
+        mode: 'tags',
+        options: MOCK_ROLES_OPTIONS,
+      },
+      label: '角色',
+    },
+    {
+      fieldName: 'introduction',
+      component: 'Textarea',
+      label: '个人简介',
+    },
+  ];
+});
+
+onMounted(async () => {
+  const data = await getUserInfoApi();
+  profileBaseSettingRef.value.getFormApi().setValues(data);
+});
+</script>
+<template>
+  <ProfileBaseSetting ref="profileBaseSettingRef" :form-schema="formSchema" />
+</template>
diff --git a/apps/web-ele/src/views/_core/profile/index.vue b/apps/web-ele/src/views/_core/profile/index.vue
new file mode 100644
index 00000000..8740894e
--- /dev/null
+++ b/apps/web-ele/src/views/_core/profile/index.vue
@@ -0,0 +1,49 @@
+<script setup lang="ts">
+import { ref } from 'vue';
+
+import { Profile } from '@vben/common-ui';
+import { useUserStore } from '@vben/stores';
+
+import ProfileBase from './base-setting.vue';
+import ProfileNotificationSetting from './notification-setting.vue';
+import ProfilePasswordSetting from './password-setting.vue';
+import ProfileSecuritySetting from './security-setting.vue';
+
+const userStore = useUserStore();
+
+const tabsValue = ref<string>('basic');
+
+const tabs = ref([
+  {
+    label: '基本设置',
+    value: 'basic',
+  },
+  {
+    label: '安全设置',
+    value: 'security',
+  },
+  {
+    label: '修改密码',
+    value: 'password',
+  },
+  {
+    label: '新消息提醒',
+    value: 'notice',
+  },
+]);
+</script>
+<template>
+  <Profile
+    v-model:model-value="tabsValue"
+    title="个人中心"
+    :user-info="userStore.userInfo"
+    :tabs="tabs"
+  >
+    <template #content>
+      <ProfileBase v-if="tabsValue === 'basic'" />
+      <ProfileSecuritySetting v-if="tabsValue === 'security'" />
+      <ProfilePasswordSetting v-if="tabsValue === 'password'" />
+      <ProfileNotificationSetting v-if="tabsValue === 'notice'" />
+    </template>
+  </Profile>
+</template>
diff --git a/apps/web-ele/src/views/_core/profile/notification-setting.vue b/apps/web-ele/src/views/_core/profile/notification-setting.vue
new file mode 100644
index 00000000..324a4b39
--- /dev/null
+++ b/apps/web-ele/src/views/_core/profile/notification-setting.vue
@@ -0,0 +1,31 @@
+<script setup lang="ts">
+import { computed } from 'vue';
+
+import { ProfileNotificationSetting } from '@vben/common-ui';
+
+const formSchema = computed(() => {
+  return [
+    {
+      value: true,
+      fieldName: 'accountPassword',
+      label: '账户密码',
+      description: '其他用户的消息将以站内信的形式通知',
+    },
+    {
+      value: true,
+      fieldName: 'systemMessage',
+      label: '系统消息',
+      description: '系统消息将以站内信的形式通知',
+    },
+    {
+      value: true,
+      fieldName: 'todoTask',
+      label: '待办任务',
+      description: '待办任务将以站内信的形式通知',
+    },
+  ];
+});
+</script>
+<template>
+  <ProfileNotificationSetting :form-schema="formSchema" />
+</template>
diff --git a/apps/web-ele/src/views/_core/profile/password-setting.vue b/apps/web-ele/src/views/_core/profile/password-setting.vue
new file mode 100644
index 00000000..61b0ebfc
--- /dev/null
+++ b/apps/web-ele/src/views/_core/profile/password-setting.vue
@@ -0,0 +1,63 @@
+<script setup lang="ts">
+import type { VbenFormSchema } from '#/adapter/form';
+
+import { computed } from 'vue';
+
+import { ProfilePasswordSetting, z } from '@vben/common-ui';
+
+import { ElMessage } from 'element-plus';
+
+const formSchema = computed((): VbenFormSchema[] => {
+  return [
+    {
+      fieldName: 'oldPassword',
+      label: '旧密码',
+      component: 'VbenInputPassword',
+      componentProps: {
+        placeholder: '请输入旧密码',
+      },
+    },
+    {
+      fieldName: 'newPassword',
+      label: '新密码',
+      component: 'VbenInputPassword',
+      componentProps: {
+        passwordStrength: true,
+        placeholder: '请输入新密码',
+      },
+    },
+    {
+      fieldName: 'confirmPassword',
+      label: '确认密码',
+      component: 'VbenInputPassword',
+      componentProps: {
+        passwordStrength: true,
+        placeholder: '请再次输入新密码',
+      },
+      dependencies: {
+        rules(values) {
+          const { newPassword } = values;
+          return z
+            .string({ error: '请再次输入新密码' })
+            .min(1, { message: '请再次输入新密码' })
+            .refine((value) => value === newPassword, {
+              message: '两次输入的密码不一致',
+            });
+        },
+        triggerFields: ['newPassword'],
+      },
+    },
+  ];
+});
+
+function handleSubmit() {
+  ElMessage.success('密码修改成功');
+}
+</script>
+<template>
+  <ProfilePasswordSetting
+    class="w-1/3"
+    :form-schema="formSchema"
+    @submit="handleSubmit"
+  />
+</template>
diff --git a/apps/web-ele/src/views/_core/profile/security-setting.vue b/apps/web-ele/src/views/_core/profile/security-setting.vue
new file mode 100644
index 00000000..be30db58
--- /dev/null
+++ b/apps/web-ele/src/views/_core/profile/security-setting.vue
@@ -0,0 +1,43 @@
+<script setup lang="ts">
+import { computed } from 'vue';
+
+import { ProfileSecuritySetting } from '@vben/common-ui';
+
+const formSchema = computed(() => {
+  return [
+    {
+      value: true,
+      fieldName: 'accountPassword',
+      label: '账户密码',
+      description: '当前密码强度：强',
+    },
+    {
+      value: true,
+      fieldName: 'securityPhone',
+      label: '密保手机',
+      description: '已绑定手机：138****8293',
+    },
+    {
+      value: true,
+      fieldName: 'securityQuestion',
+      label: '密保问题',
+      description: '未设置密保问题，密保问题可有效保护账户安全',
+    },
+    {
+      value: true,
+      fieldName: 'securityEmail',
+      label: '备用邮箱',
+      description: '已绑定邮箱：ant***sign.com',
+    },
+    {
+      value: false,
+      fieldName: 'securityMfa',
+      label: 'MFA 设备',
+      description: '未绑定 MFA 设备，绑定后，可以进行二次确认',
+    },
+  ];
+});
+</script>
+<template>
+  <ProfileSecuritySetting :form-schema="formSchema" />
+</template>
diff --git a/apps/web-ele/vite.config.ts b/apps/web-ele/vite.config.ts
new file mode 100644
index 00000000..c50186cc
--- /dev/null
+++ b/apps/web-ele/vite.config.ts
@@ -0,0 +1,27 @@
+import { defineConfig, viteCssLayerPlugin } from '@vben/vite-config';
+
+import ElementPlus from 'unplugin-element-plus/vite';
+
+export default defineConfig(async () => {
+  return {
+    application: {},
+    vite: {
+      plugins: [
+        // element-plus 的 css 包进 @layer el，使 Tailwind 工具类可覆盖组件样式
+        viteCssLayerPlugin({ layerName: 'el', packageName: 'element-plus' }),
+        ElementPlus({ format: 'esm' }),
+      ],
+      server: {
+        proxy: {
+          '/api': {
+            changeOrigin: true,
+            rewrite: (path) => path.replace(/^\/api/, ''),
+            // mock代理目标地址
+            target: 'http://localhost:5320/api',
+            ws: true,
+          },
+        },
+      },
+    },
+  };
+});
diff --git a/apps/web-naive/src/views/_core/profile/base-setting.vue b/apps/web-naive/src/views/_core/profile/base-setting.vue
new file mode 100644
index 00000000..aa8a4c26
--- /dev/null
+++ b/apps/web-naive/src/views/_core/profile/base-setting.vue
@@ -0,0 +1,65 @@
+<script setup lang="ts">
+import type { BasicOption } from '@vben/types';
+
+import type { VbenFormSchema } from '#/adapter/form';
+
+import { computed, onMounted, ref } from 'vue';
+
+import { ProfileBaseSetting } from '@vben/common-ui';
+
+import { getUserInfoApi } from '#/api';
+
+const profileBaseSettingRef = ref();
+
+const MOCK_ROLES_OPTIONS: BasicOption[] = [
+  {
+    label: '管理员',
+    value: 'super',
+  },
+  {
+    label: '用户',
+    value: 'user',
+  },
+  {
+    label: '测试',
+    value: 'test',
+  },
+];
+
+const formSchema = computed((): VbenFormSchema[] => {
+  return [
+    {
+      fieldName: 'realName',
+      component: 'Input',
+      label: '姓名',
+    },
+    {
+      fieldName: 'username',
+      component: 'Input',
+      label: '用户名',
+    },
+    {
+      fieldName: 'roles',
+      component: 'Select',
+      componentProps: {
+        mode: 'tags',
+        options: MOCK_ROLES_OPTIONS,
+      },
+      label: '角色',
+    },
+    {
+      fieldName: 'introduction',
+      component: 'Textarea',
+      label: '个人简介',
+    },
+  ];
+});
+
+onMounted(async () => {
+  const data = await getUserInfoApi();
+  profileBaseSettingRef.value.getFormApi().setValues(data);
+});
+</script>
+<template>
+  <ProfileBaseSetting ref="profileBaseSettingRef" :form-schema="formSchema" />
+</template>
diff --git a/apps/web-naive/src/views/_core/profile/index.vue b/apps/web-naive/src/views/_core/profile/index.vue
new file mode 100644
index 00000000..8740894e
--- /dev/null
+++ b/apps/web-naive/src/views/_core/profile/index.vue
@@ -0,0 +1,49 @@
+<script setup lang="ts">
+import { ref } from 'vue';
+
+import { Profile } from '@vben/common-ui';
+import { useUserStore } from '@vben/stores';
+
+import ProfileBase from './base-setting.vue';
+import ProfileNotificationSetting from './notification-setting.vue';
+import ProfilePasswordSetting from './password-setting.vue';
+import ProfileSecuritySetting from './security-setting.vue';
+
+const userStore = useUserStore();
+
+const tabsValue = ref<string>('basic');
+
+const tabs = ref([
+  {
+    label: '基本设置',
+    value: 'basic',
+  },
+  {
+    label: '安全设置',
+    value: 'security',
+  },
+  {
+    label: '修改密码',
+    value: 'password',
+  },
+  {
+    label: '新消息提醒',
+    value: 'notice',
+  },
+]);
+</script>
+<template>
+  <Profile
+    v-model:model-value="tabsValue"
+    title="个人中心"
+    :user-info="userStore.userInfo"
+    :tabs="tabs"
+  >
+    <template #content>
+      <ProfileBase v-if="tabsValue === 'basic'" />
+      <ProfileSecuritySetting v-if="tabsValue === 'security'" />
+      <ProfilePasswordSetting v-if="tabsValue === 'password'" />
+      <ProfileNotificationSetting v-if="tabsValue === 'notice'" />
+    </template>
+  </Profile>
+</template>
diff --git a/apps/web-naive/src/views/_core/profile/notification-setting.vue b/apps/web-naive/src/views/_core/profile/notification-setting.vue
new file mode 100644
index 00000000..324a4b39
--- /dev/null
+++ b/apps/web-naive/src/views/_core/profile/notification-setting.vue
@@ -0,0 +1,31 @@
+<script setup lang="ts">
+import { computed } from 'vue';
+
+import { ProfileNotificationSetting } from '@vben/common-ui';
+
+const formSchema = computed(() => {
+  return [
+    {
+      value: true,
+      fieldName: 'accountPassword',
+      label: '账户密码',
+      description: '其他用户的消息将以站内信的形式通知',
+    },
+    {
+      value: true,
+      fieldName: 'systemMessage',
+      label: '系统消息',
+      description: '系统消息将以站内信的形式通知',
+    },
+    {
+      value: true,
+      fieldName: 'todoTask',
+      label: '待办任务',
+      description: '待办任务将以站内信的形式通知',
+    },
+  ];
+});
+</script>
+<template>
+  <ProfileNotificationSetting :form-schema="formSchema" />
+</template>
diff --git a/apps/web-naive/src/views/_core/profile/password-setting.vue b/apps/web-naive/src/views/_core/profile/password-setting.vue
new file mode 100644
index 00000000..bacc0c8b
--- /dev/null
+++ b/apps/web-naive/src/views/_core/profile/password-setting.vue
@@ -0,0 +1,63 @@
+<script setup lang="ts">
+import type { VbenFormSchema } from '#/adapter/form';
+
+import { computed } from 'vue';
+
+import { ProfilePasswordSetting, z } from '@vben/common-ui';
+
+import { message } from '#/adapter/naive';
+
+const formSchema = computed((): VbenFormSchema[] => {
+  return [
+    {
+      fieldName: 'oldPassword',
+      label: '旧密码',
+      component: 'VbenInputPassword',
+      componentProps: {
+        placeholder: '请输入旧密码',
+      },
+    },
+    {
+      fieldName: 'newPassword',
+      label: '新密码',
+      component: 'VbenInputPassword',
+      componentProps: {
+        passwordStrength: true,
+        placeholder: '请输入新密码',
+      },
+    },
+    {
+      fieldName: 'confirmPassword',
+      label: '确认密码',
+      component: 'VbenInputPassword',
+      componentProps: {
+        passwordStrength: true,
+        placeholder: '请再次输入新密码',
+      },
+      dependencies: {
+        rules(values) {
+          const { newPassword } = values;
+          return z
+            .string({ error: '请再次输入新密码' })
+            .min(1, { message: '请再次输入新密码' })
+            .refine((value) => value === newPassword, {
+              message: '两次输入的密码不一致',
+            });
+        },
+        triggerFields: ['newPassword'],
+      },
+    },
+  ];
+});
+
+function handleSubmit() {
+  message.success('密码修改成功');
+}
+</script>
+<template>
+  <ProfilePasswordSetting
+    class="w-1/3"
+    :form-schema="formSchema"
+    @submit="handleSubmit"
+  />
+</template>
diff --git a/apps/web-naive/src/views/_core/profile/security-setting.vue b/apps/web-naive/src/views/_core/profile/security-setting.vue
new file mode 100644
index 00000000..be30db58
--- /dev/null
+++ b/apps/web-naive/src/views/_core/profile/security-setting.vue
@@ -0,0 +1,43 @@
+<script setup lang="ts">
+import { computed } from 'vue';
+
+import { ProfileSecuritySetting } from '@vben/common-ui';
+
+const formSchema = computed(() => {
+  return [
+    {
+      value: true,
+      fieldName: 'accountPassword',
+      label: '账户密码',
+      description: '当前密码强度：强',
+    },
+    {
+      value: true,
+      fieldName: 'securityPhone',
+      label: '密保手机',
+      description: '已绑定手机：138****8293',
+    },
+    {
+      value: true,
+      fieldName: 'securityQuestion',
+      label: '密保问题',
+      description: '未设置密保问题，密保问题可有效保护账户安全',
+    },
+    {
+      value: true,
+      fieldName: 'securityEmail',
+      label: '备用邮箱',
+      description: '已绑定邮箱：ant***sign.com',
+    },
+    {
+      value: false,
+      fieldName: 'securityMfa',
+      label: 'MFA 设备',
+      description: '未绑定 MFA 设备，绑定后，可以进行二次确认',
+    },
+  ];
+});
+</script>
+<template>
+  <ProfileSecuritySetting :form-schema="formSchema" />
+</template>
diff --git a/apps/web-naive/src/views/demos/form/modal.vue b/apps/web-naive/src/views/demos/form/modal.vue
new file mode 100644
index 00000000..14a7021d
--- /dev/null
+++ b/apps/web-naive/src/views/demos/form/modal.vue
@@ -0,0 +1,77 @@
+<script lang="ts" setup>
+import { useVbenModal } from '@vben/common-ui';
+
+import { useVbenForm } from '#/adapter/form';
+
+defineOptions({
+  name: 'FormModelDemo',
+});
+
+interface FormModalData {
+  values?: Record<string, unknown>;
+}
+
+const [Form, formApi] = useVbenForm({
+  schema: [
+    {
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入',
+      },
+      fieldName: 'field1',
+      label: '字段1',
+      rules: 'required',
+    },
+    {
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入',
+      },
+      fieldName: 'field2',
+      label: '字段2',
+      rules: 'required',
+    },
+    {
+      component: 'Select',
+      componentProps: {
+        options: [
+          { label: '选项1', value: '1' },
+          { label: '选项2', value: '2' },
+        ],
+        placeholder: '请输入',
+      },
+      fieldName: 'field3',
+      label: '字段3',
+      rules: 'required',
+    },
+  ],
+  showDefaultActions: false,
+});
+
+const [Modal, modalApi] = useVbenModal<FormModalData>({
+  fullscreenButton: false,
+  onCancel() {
+    modalApi.close();
+  },
+  onConfirm: async () => {
+    await formApi.validateAndSubmit();
+    // modalApi.close();
+  },
+  onOpenChange(isOpen: boolean) {
+    if (isOpen) {
+      const data = modalApi.getData();
+      if (data?.values) {
+        formApi.setValues(data.values);
+      }
+    }
+  },
+  title: '内嵌表单示例',
+});
+
+defineExpose({ modalApi });
+</script>
+<template>
+  <Modal>
+    <Form />
+  </Modal>
+</template>
diff --git a/apps/web-naive/src/views/demos/naive/array-form/index.vue b/apps/web-naive/src/views/demos/naive/array-form/index.vue
new file mode 100644
index 00000000..b715f880
--- /dev/null
+++ b/apps/web-naive/src/views/demos/naive/array-form/index.vue
@@ -0,0 +1,121 @@
+<script lang="ts" setup>
+import { Page } from '@vben/common-ui';
+
+import { NButton, NCard, useMessage } from 'naive-ui';
+
+import { useVbenForm } from '#/adapter/form';
+
+const message = useMessage();
+
+const [Form, formApi] = useVbenForm({
+  layout: 'vertical',
+  wrapperClass: 'grid-cols-1',
+  handleSubmit: (values) => {
+    message.success(`提交成功：${JSON.stringify(values)}`);
+  },
+  schema: [
+    {
+      component: 'Input',
+      fieldName: 'projectName',
+      label: '项目名称',
+      rules: 'required',
+    },
+    {
+      component: 'VbenFormFieldArray',
+      fieldName: 'members',
+      label: '项目成员',
+      // 初始化为空数组，供数组编辑器使用
+      defaultValue: [],
+      componentProps: {
+        min: 1,
+        max: 5,
+        createRow: () => ({
+          name: null,
+          age: null,
+          role: null,
+          joinDate: null,
+          active: true,
+        }),
+        // 每一列就是一个子字段，复用 vbenForm 的所有编辑组件
+        schema: [
+          {
+            component: 'Input',
+            fieldName: 'name',
+            label: '姓名',
+            rules: 'required',
+            componentProps: { placeholder: '请输入姓名' },
+          },
+          {
+            component: 'InputNumber',
+            fieldName: 'age',
+            label: '年龄',
+            componentProps: { min: 0, max: 150 },
+          },
+          {
+            component: 'Select',
+            fieldName: 'role',
+            label: '角色',
+            rules: 'selectRequired',
+            componentProps: {
+              placeholder: '请选择',
+              options: [
+                { label: '前端', value: 'fe' },
+                { label: '后端', value: 'be' },
+                { label: '测试', value: 'qa' },
+                { label: '产品', value: 'pm' },
+              ],
+            },
+          },
+          {
+            component: 'DatePicker',
+            fieldName: 'joinDate',
+            label: '入职日期',
+          },
+          {
+            component: 'Switch',
+            fieldName: 'active',
+            label: '在职',
+          },
+        ],
+      },
+    },
+  ],
+});
+
+function setFormValues() {
+  formApi.setValues({
+    projectName: 'Vben Admin',
+    members: [
+      { name: '张三', age: 28, role: 'fe', joinDate: Date.now(), active: true },
+      {
+        name: '李四',
+        age: 32,
+        role: 'be',
+        joinDate: Date.now(),
+        active: false,
+      },
+    ],
+  });
+}
+
+async function getFormValues() {
+  const values = await formApi.getValues();
+  message.info(JSON.stringify(values));
+}
+</script>
+
+<template>
+  <Page
+    description="基于 useVbenForm 的数组编辑器（VbenFormFieldArray）：可增删行，每个单元格复用 vbenForm 注册的编辑组件，并享受逐格校验。"
+    title="数组编辑器表单"
+  >
+    <NCard title="数组编辑器">
+      <template #header-extra>
+        <NButton class="mr-2" @click="setFormValues">设置表单值</NButton>
+        <NButton class="mr-2" @click="getFormValues">获取表单值</NButton>
+        <NButton type="primary" @click="formApi.submit()"> 提交校验 </NButton>
+      </template>
+      <Form />
+    </NCard>
+  </Page>
+</template>
diff --git a/apps/web-tdesign/.env b/apps/web-tdesign/.env
new file mode 100644
index 00000000..dae0149d
--- /dev/null
+++ b/apps/web-tdesign/.env
@@ -0,0 +1,8 @@
+# 应用标题
+VITE_APP_TITLE=Vben Admin Tdesign
+
+# 应用命名空间，用于缓存、store等功能的前缀，确保隔离
+VITE_APP_NAMESPACE=vben-web-tdesign
+
+# 对store进行加密的密钥，在将store持久化到localStorage时会使用该密钥进行加密
+VITE_APP_STORE_SECURE_KEY=please-replace-me-with-your-own-key
diff --git a/apps/web-tdesign/.env.analyze b/apps/web-tdesign/.env.analyze
new file mode 100644
index 00000000..ffafa8dd
--- /dev/null
+++ b/apps/web-tdesign/.env.analyze
@@ -0,0 +1,7 @@
+# public path
+VITE_BASE=/
+
+# Basic interface address SPA
+VITE_GLOB_API_URL=/api
+
+VITE_VISUALIZER=true
diff --git a/apps/web-tdesign/.env.development b/apps/web-tdesign/.env.development
new file mode 100644
index 00000000..f2b44428
--- /dev/null
+++ b/apps/web-tdesign/.env.development
@@ -0,0 +1,16 @@
+# 端口号
+VITE_PORT=5999
+
+VITE_BASE=/
+
+# 接口地址
+VITE_GLOB_API_URL=/api
+
+# 是否开启 Nitro Mock服务，true 为开启，false 为关闭
+VITE_NITRO_MOCK=true
+
+# 是否打开 devtools，true 为打开，false 为关闭
+VITE_DEVTOOLS=false
+
+# 是否注入全局loading
+VITE_INJECT_APP_LOADING=true
diff --git a/apps/web-tdesign/.env.production b/apps/web-tdesign/.env.production
new file mode 100644
index 00000000..5375847a
--- /dev/null
+++ b/apps/web-tdesign/.env.production
@@ -0,0 +1,19 @@
+VITE_BASE=/
+
+# 接口地址
+VITE_GLOB_API_URL=https://mock-napi.vben.pro/api
+
+# 是否开启压缩，可以设置为 none, brotli, gzip
+VITE_COMPRESS=none
+
+# 是否开启 PWA
+VITE_PWA=false
+
+# vue-router 的模式
+VITE_ROUTER_HISTORY=hash
+
+# 是否注入全局loading
+VITE_INJECT_APP_LOADING=true
+
+# 打包后是否生成dist.zip
+VITE_ARCHIVER=true
diff --git a/apps/web-tdesign/index.html b/apps/web-tdesign/index.html
new file mode 100644
index 00000000..e3b9ae5c
--- /dev/null
+++ b/apps/web-tdesign/index.html
@@ -0,0 +1,35 @@
+<!doctype html>
+<html lang="zh">
+  <head>
+    <meta charset="UTF-8" />
+    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
+    <meta name="renderer" content="webkit" />
+    <meta name="description" content="A Modern Back-end Management System" />
+    <meta name="keywords" content="Vben Admin Vue3 Vite" />
+    <meta name="author" content="Vben" />
+    <meta
+      name="viewport"
+      content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=0"
+    />
+    <!-- 由 vite 注入 VITE_APP_TITLE 变量，在 .env 文件内配置 -->
+    <title>%VITE_APP_TITLE%</title>
+    <link rel="icon" href="/favicon.ico" />
+    <script>
+      // 生产环境下注入百度统计
+      if (window._VBEN_ADMIN_PRO_APP_CONF_) {
+        var _hmt = _hmt || [];
+        (function () {
+          var hm = document.createElement('script');
+          hm.src =
+            'https://hm.baidu.com/hm.js?b38e689f40558f20a9a686d7f6f33edf';
+          var s = document.getElementsByTagName('script')[0];
+          s.parentNode.insertBefore(hm, s);
+        })();
+      }
+    </script>
+  </head>
+  <body>
+    <div id="app"></div>
+    <script type="module" src="/src/main.ts"></script>
+  </body>
+</html>
diff --git a/apps/web-tdesign/package.json b/apps/web-tdesign/package.json
new file mode 100644
index 00000000..e2b13263
--- /dev/null
+++ b/apps/web-tdesign/package.json
@@ -0,0 +1,51 @@
+{
+  "name": "@vben/web-tdesign",
+  "version": "5.7.0",
+  "homepage": "https://vben.pro",
+  "bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/vbenjs/vue-vben-admin.git",
+    "directory": "apps/web-tdesign"
+  },
+  "license": "MIT",
+  "author": {
+    "name": "vben",
+    "email": "ann.vben@gmail.com",
+    "url": "https://github.com/anncwb"
+  },
+  "type": "module",
+  "scripts": {
+    "build": "pnpm vite build --mode production",
+    "build:analyze": "pnpm vite build --mode analyze",
+    "dev": "pnpm vite --mode development",
+    "preview": "vite preview",
+    "typecheck": "vue-tsc --noEmit --skipLibCheck"
+  },
+  "imports": {
+    "#/*": "./src/*"
+  },
+  "dependencies": {
+    "@vben/access": "workspace:*",
+    "@vben/common-ui": "workspace:*",
+    "@vben/constants": "workspace:*",
+    "@vben/hooks": "workspace:*",
+    "@vben/icons": "workspace:*",
+    "@vben/layouts": "workspace:*",
+    "@vben/locales": "workspace:*",
+    "@vben/plugins": "workspace:*",
+    "@vben/preferences": "workspace:*",
+    "@vben/request": "workspace:*",
+    "@vben/stores": "workspace:*",
+    "@vben/styles": "workspace:*",
+    "@vben/types": "workspace:*",
+    "@vben/utils": "workspace:*",
+    "@vueuse/core": "catalog:",
+    "dayjs": "catalog:",
+    "es-toolkit": "catalog:",
+    "pinia": "catalog:",
+    "tdesign-vue-next": "catalog:",
+    "vue": "catalog:",
+    "vue-router": "catalog:"
+  }
+}
diff --git a/apps/web-tdesign/public/favicon.ico b/apps/web-tdesign/public/favicon.ico
new file mode 100644
index 00000000..fcf9818e
Binary files /dev/null and b/apps/web-tdesign/public/favicon.ico differ
diff --git a/apps/web-tdesign/src/adapter/component/index.ts b/apps/web-tdesign/src/adapter/component/index.ts
new file mode 100644
index 00000000..c2f9634d
--- /dev/null
+++ b/apps/web-tdesign/src/adapter/component/index.ts
@@ -0,0 +1,294 @@
+import type {
+  AutoCompleteProps,
+  ButtonProps,
+  CheckboxGroupProps,
+  CheckboxProps,
+  DatePickerProps,
+  DateRangePickerProps,
+  DividerProps,
+  InputNumberProps,
+  InputProps,
+  RadioGroupProps,
+  RadioProps,
+  SelectProps,
+  SpaceProps,
+  SwitchProps,
+  TextareaProps,
+  TimePickerProps,
+  TreeSelectProps,
+} from 'tdesign-vue-next';
+import type { TdRateProps } from 'tdesign-vue-next/es/rate/type';
+import type { UploadProps } from 'tdesign-vue-next/es/upload/types';
+
+import type { Component } from 'vue';
+
+import type {
+  ApiComponentSharedProps,
+  BaseFormComponentType,
+  IconPickerProps,
+} from '@vben/common-ui';
+import type { Recordable } from '@vben/types';
+
+import { defineAsyncComponent, defineComponent, h, ref } from 'vue';
+
+import { ApiComponent, globalShareState, IconPicker } from '@vben/common-ui';
+import { $t } from '@vben/locales';
+
+import { notification } from '#/adapter/tdesign';
+
+/**
+ * 通用组件共同的使用的基础组件，原先放在 adapter/form 内部，限制了使用范围，这里提取出来，方便其他地方使用
+ * 可用于 vben-form、vben-modal、vben-drawer 等组件使用,
+ */
+
+const AutoComplete = defineAsyncComponent(
+  () => import('tdesign-vue-next/es/auto-complete'),
+);
+const Button = defineAsyncComponent(() => import('tdesign-vue-next/es/button'));
+const Checkbox = defineAsyncComponent(
+  () => import('tdesign-vue-next/es/checkbox'),
+);
+const CheckboxGroup = defineAsyncComponent(() =>
+  import('tdesign-vue-next/es/checkbox').then((res) => res.CheckboxGroup),
+);
+const DatePicker = defineAsyncComponent(
+  () => import('tdesign-vue-next/es/date-picker'),
+);
+const Divider = defineAsyncComponent(
+  () => import('tdesign-vue-next/es/divider'),
+);
+const Input = defineAsyncComponent(() => import('tdesign-vue-next/es/input'));
+const InputNumber = defineAsyncComponent(
+  () => import('tdesign-vue-next/es/input-number'),
+);
+// const InputPassword = defineAsyncComponent(() =>
+//   import('tdesign-vue-next/es/input').then((res) => res.InputPassword),
+// );
+// const Mentions = defineAsyncComponent(
+//   () => import('tdesign-vue-next/es/mentions'),
+// );
+const Radio = defineAsyncComponent(() => import('tdesign-vue-next/es/radio'));
+const RadioGroup = defineAsyncComponent(() =>
+  import('tdesign-vue-next/es/radio').then((res) => res.RadioGroup),
+);
+const RangePicker = defineAsyncComponent(() =>
+  import('tdesign-vue-next/es/date-picker').then((res) => res.DateRangePicker),
+);
+const Rate = defineAsyncComponent(() => import('tdesign-vue-next/es/rate'));
+const Select = defineAsyncComponent(() => import('tdesign-vue-next/es/select'));
+const Space = defineAsyncComponent(() => import('tdesign-vue-next/es/space'));
+const Switch = defineAsyncComponent(() => import('tdesign-vue-next/es/switch'));
+const Textarea = defineAsyncComponent(
+  () => import('tdesign-vue-next/es/textarea'),
+);
+const TimePicker = defineAsyncComponent(
+  () => import('tdesign-vue-next/es/time-picker'),
+);
+const TreeSelect = defineAsyncComponent(
+  () => import('tdesign-vue-next/es/tree-select'),
+);
+const Upload = defineAsyncComponent(() => import('tdesign-vue-next/es/upload'));
+
+const withDefaultPlaceholder = (
+  component: Component,
+  type: 'input' | 'select',
+  componentProps: Recordable<any> = {},
+) => {
+  return defineComponent({
+    name: component.name,
+    inheritAttrs: false,
+    setup: (props: any, { attrs, expose, slots }) => {
+      const placeholder =
+        props?.placeholder ||
+        attrs?.placeholder ||
+        $t(`ui.placeholder.${type}`);
+      // 透传组件暴露的方法
+      const innerRef = ref();
+      expose(
+        new Proxy(
+          {},
+          {
+            get: (_target, key) => innerRef.value?.[key],
+            has: (_target, key) => key in (innerRef.value || {}),
+          },
+        ),
+      );
+      return () =>
+        h(
+          component,
+          { ...componentProps, placeholder, ...props, ...attrs, ref: innerRef },
+          slots,
+        );
+    },
+  });
+};
+
+// 这里需要自行根据业务组件库进行适配，需要用到的组件都需要在这里类型说明
+export type ComponentType =
+  | 'ApiSelect'
+  | 'ApiTreeSelect'
+  | 'AutoComplete'
+  | 'Checkbox'
+  | 'CheckboxGroup'
+  | 'DatePicker'
+  | 'DefaultButton'
+  | 'Divider'
+  | 'IconPicker'
+  | 'Input'
+  | 'InputNumber'
+  // | 'InputPassword'
+  // | 'Mentions'
+  | 'PrimaryButton'
+  | 'Radio'
+  | 'RadioGroup'
+  | 'RangePicker'
+  | 'Rate'
+  | 'Select'
+  | 'Space'
+  | 'Switch'
+  | 'Textarea'
+  | 'TimePicker'
+  | 'TreeSelect'
+  | 'Upload'
+  | BaseFormComponentType;
+
+/**
+ * 与 {@link ComponentType} 中注册的组件名一一对应，便于 Schema 上 `component` + `componentProps` 联动提示
+ */
+export interface ComponentPropsMap {
+  ApiSelect: ApiComponentSharedProps & SelectProps;
+  ApiTreeSelect: ApiComponentSharedProps & TreeSelectProps;
+  AutoComplete: AutoCompleteProps;
+  Checkbox: CheckboxProps;
+  CheckboxGroup: CheckboxGroupProps;
+  DatePicker: DatePickerProps;
+  DefaultButton: ButtonProps;
+  Divider: DividerProps;
+  IconPicker: IconPickerProps;
+  Input: InputProps;
+  InputNumber: InputNumberProps;
+  PrimaryButton: ButtonProps;
+  Radio: RadioProps;
+  RadioGroup: RadioGroupProps;
+  RangePicker: DateRangePickerProps;
+  Rate: TdRateProps;
+  Select: SelectProps;
+  Space: SpaceProps;
+  Switch: SwitchProps;
+  Textarea: TextareaProps;
+  TimePicker: TimePickerProps;
+  TreeSelect: TreeSelectProps;
+  Upload: UploadProps;
+}
+
+async function initComponentAdapter() {
+  const components: Partial<Record<ComponentType, Component>> = {
+    // 如果你的组件体积比较大，可以使用异步加载
+    // Button: () =>
+    // import('xxx').then((res) => res.Button),
+    ApiSelect: withDefaultPlaceholder(
+      {
+        ...ApiComponent,
+        name: 'ApiSelect',
+      },
+      'select',
+      {
+        component: Select,
+        loadingSlot: 'suffixIcon',
+        visibleEvent: 'onDropdownVisibleChange',
+        modelPropName: 'value',
+      },
+    ),
+    ApiTreeSelect: withDefaultPlaceholder(
+      {
+        ...ApiComponent,
+        name: 'ApiTreeSelect',
+      },
+      'select',
+      {
+        component: TreeSelect,
+        fieldNames: { label: 'label', value: 'value', children: 'children' },
+        loadingSlot: 'suffixIcon',
+        modelPropName: 'value',
+        optionsPropName: 'treeData',
+        visibleEvent: 'onVisibleChange',
+      },
+    ),
+    AutoComplete,
+    Checkbox,
+    CheckboxGroup,
+    DatePicker,
+    // 自定义默认按钮
+    DefaultButton: (props, { attrs, slots }) => {
+      let ghost = false;
+      let variant = props.variant;
+      if (props.variant === 'ghost') {
+        ghost = true;
+        variant = 'base';
+      }
+      return h(
+        Button,
+        { ...props, ghost, variant, attrs, theme: 'default' },
+        slots,
+      );
+    },
+    Divider,
+    IconPicker: withDefaultPlaceholder(IconPicker, 'select', {
+      iconSlot: 'addonAfter',
+      inputComponent: Input,
+      modelValueProp: 'value',
+    }),
+    Input: withDefaultPlaceholder(Input, 'input'),
+    InputNumber: withDefaultPlaceholder(InputNumber, 'input'),
+    // InputPassword: withDefaultPlaceholder(InputPassword, 'input'),
+    // Mentions: withDefaultPlaceholder(Mentions, 'input'),
+    // 自定义主要按钮
+    PrimaryButton: (props, { attrs, slots }) => {
+      let ghost = false;
+      let variant = props.variant;
+      if (props.variant === 'ghost') {
+        ghost = true;
+        variant = 'base';
+      }
+      return h(
+        Button,
+        { ...props, ghost, variant, attrs, theme: 'primary' },
+        slots,
+      );
+    },
+    Radio,
+    RadioGroup,
+    RangePicker: (props, { attrs, slots }) => {
+      return h(
+        RangePicker,
+        { ...props, modelValue: props.modelValue ?? [], attrs },
+        slots,
+      );
+    },
+    Rate,
+    Select: withDefaultPlaceholder(Select, 'select'),
+    Space,
+    Switch,
+    Textarea: withDefaultPlaceholder(Textarea, 'input'),
+    TimePicker,
+    TreeSelect: withDefaultPlaceholder(TreeSelect, 'select'),
+    Upload,
+  };
+
+  // 将组件注册到全局共享状态中
+  globalShareState.setComponents(components);
+
+  // 定义全局共享状态中的消息提示
+  globalShareState.defineMessage({
+    // 复制成功消息提示
+    copyPreferencesSuccess: (title, content) => {
+      notification.success({
+        title,
+        content,
+        placement: 'bottom-right',
+      });
+    },
+  });
+}
+
+export { initComponentAdapter };
diff --git a/apps/web-tdesign/src/adapter/form.ts b/apps/web-tdesign/src/adapter/form.ts
new file mode 100644
index 00000000..34f12166
--- /dev/null
+++ b/apps/web-tdesign/src/adapter/form.ts
@@ -0,0 +1,68 @@
+import type {
+  VbenFormProps as FormProps,
+  VbenFormSchema as FormSchema,
+  FormValues,
+} from '@vben/common-ui';
+
+import type { ComponentPropsMap, ComponentType } from './component';
+
+import { setupVbenForm, useVbenForm as useForm, z } from '@vben/common-ui';
+import { $t } from '@vben/locales';
+
+async function initSetupVbenForm() {
+  setupVbenForm<ComponentType>({
+    config: {
+      // tdesign组件库默认都是 v-model:value
+      baseModelPropName: 'value',
+
+      // 一些组件是 v-model:checked 或者 v-model:fileList
+      modelPropNameMap: {
+        Checkbox: 'checked',
+        Radio: 'checked',
+        Switch: 'checked',
+        Upload: 'fileList',
+      },
+    },
+    rules: {
+      // 输入项目必填国际化适配
+      required: (value, _params, ctx) => {
+        if (value === undefined || value === null || value.length === 0) {
+          return $t('ui.formRules.required', [ctx.label]);
+        }
+        return true;
+      },
+      // 选择项目必填国际化适配
+      selectRequired: (value, _params, ctx) => {
+        if (value === undefined || value === null) {
+          return $t('ui.formRules.selectRequired', [ctx.label]);
+        }
+        return true;
+      },
+    },
+  });
+}
+
+function useVbenForm<
+  TFormValues extends FormValues = FormValues,
+  TSubmitValues extends FormValues = TFormValues,
+>(
+  options: FormProps<
+    ComponentType,
+    ComponentPropsMap,
+    TFormValues,
+    TSubmitValues
+  >,
+) {
+  return useForm<TFormValues, ComponentType, ComponentPropsMap, TSubmitValues>(
+    options,
+  );
+}
+
+export { initSetupVbenForm, useVbenForm, z };
+
+export type VbenFormSchema<TValues extends FormValues = FormValues> =
+  FormSchema<ComponentType, ComponentPropsMap, TValues>;
+export type VbenFormProps<
+  TFormValues extends FormValues = FormValues,
+  TSubmitValues extends FormValues = TFormValues,
+> = FormProps<ComponentType, ComponentPropsMap, TFormValues, TSubmitValues>;
diff --git a/apps/web-tdesign/src/adapter/tdesign.ts b/apps/web-tdesign/src/adapter/tdesign.ts
new file mode 100644
index 00000000..70c67601
--- /dev/null
+++ b/apps/web-tdesign/src/adapter/tdesign.ts
@@ -0,0 +1,5 @@
+export {
+  DialogPlugin as dialog,
+  MessagePlugin as message,
+  NotifyPlugin as notification,
+} from 'tdesign-vue-next';
diff --git a/apps/web-tdesign/src/adapter/vxe-table.ts b/apps/web-tdesign/src/adapter/vxe-table.ts
new file mode 100644
index 00000000..c621320b
--- /dev/null
+++ b/apps/web-tdesign/src/adapter/vxe-table.ts
@@ -0,0 +1,93 @@
+import type { FormValues } from '@vben/common-ui';
+import type { VxeTableGridOptions } from '@vben/plugins/vxe-table';
+
+import type { ComponentPropsMap, ComponentType } from './component';
+
+import { h } from 'vue';
+
+import {
+  setupVbenVxeTable,
+  useVbenVxeGrid as useGrid,
+} from '@vben/plugins/vxe-table';
+
+import { Button, Image } from 'tdesign-vue-next';
+
+import { useVbenForm } from './form';
+
+setupVbenVxeTable({
+  configVxeTable: (vxeUI) => {
+    vxeUI.setConfig({
+      grid: {
+        align: 'center',
+        border: false,
+        columnConfig: {
+          resizable: true,
+        },
+        minHeight: 180,
+        formConfig: {
+          // 全局禁用vxe-table的表单配置，使用formOptions
+          enabled: false,
+        },
+        proxyConfig: {
+          autoLoad: true,
+          response: {
+            result: 'items',
+            total: 'total',
+            list: 'items',
+          },
+          showActiveMsg: true,
+          showResponseMsg: false,
+        },
+        round: true,
+        showOverflow: true,
+        size: 'small',
+      } as VxeTableGridOptions,
+    });
+
+    // 表格配置项可以用 cellRender: { name: 'CellImage' },
+    vxeUI.renderer.add('CellImage', {
+      renderTableDefault(renderOpts, params) {
+        const { props } = renderOpts;
+        const { column, row } = params;
+        return h(Image, { src: row[column.field], ...props });
+      },
+    });
+
+    // 表格配置项可以用 cellRender: { name: 'CellLink' },
+    vxeUI.renderer.add('CellLink', {
+      renderTableDefault(renderOpts) {
+        const { props } = renderOpts;
+        return h(
+          Button,
+          { size: 'small', theme: 'primary', variant: 'text' },
+          { default: () => props?.text },
+        );
+      },
+    });
+
+    // 这里可以自行扩展 vxe-table 的全局配置，比如自定义格式化
+    // vxeUI.formats.add
+  },
+  useVbenForm,
+});
+
+export const useVbenVxeGrid = <
+  T extends Record<string, any>,
+  TFormValues extends FormValues = FormValues,
+  TSubmitValues extends FormValues = TFormValues,
+>(
+  ...rest: Parameters<
+    typeof useGrid<
+      T,
+      ComponentType,
+      ComponentPropsMap,
+      TFormValues,
+      TSubmitValues
+    >
+  >
+) =>
+  useGrid<T, ComponentType, ComponentPropsMap, TFormValues, TSubmitValues>(
+    ...rest,
+  );
+
+export type * from '@vben/plugins/vxe-table';
diff --git a/apps/web-tdesign/src/api/core/auth.ts b/apps/web-tdesign/src/api/core/auth.ts
new file mode 100644
index 00000000..71d9f994
--- /dev/null
+++ b/apps/web-tdesign/src/api/core/auth.ts
@@ -0,0 +1,51 @@
+import { baseRequestClient, requestClient } from '#/api/request';
+
+export namespace AuthApi {
+  /** 登录接口参数 */
+  export interface LoginParams {
+    password?: string;
+    username?: string;
+  }
+
+  /** 登录接口返回值 */
+  export interface LoginResult {
+    accessToken: string;
+  }
+
+  export interface RefreshTokenResult {
+    data: string;
+    status: number;
+  }
+}
+
+/**
+ * 登录
+ */
+export async function loginApi(data: AuthApi.LoginParams) {
+  return requestClient.post<AuthApi.LoginResult>('/auth/login', data);
+}
+
+/**
+ * 刷新accessToken
+ */
+export async function refreshTokenApi() {
+  return baseRequestClient.post<AuthApi.RefreshTokenResult>('/auth/refresh', {
+    withCredentials: true,
+  });
+}
+
+/**
+ * 退出登录
+ */
+export async function logoutApi() {
+  return baseRequestClient.post('/auth/logout', {
+    withCredentials: true,
+  });
+}
+
+/**
+ * 获取用户权限码
+ */
+export async function getAccessCodesApi() {
+  return requestClient.get<string[]>('/auth/codes');
+}
diff --git a/apps/web-tdesign/src/api/core/index.ts b/apps/web-tdesign/src/api/core/index.ts
new file mode 100644
index 00000000..28a5aef4
--- /dev/null
+++ b/apps/web-tdesign/src/api/core/index.ts
@@ -0,0 +1,3 @@
+export * from './auth';
+export * from './menu';
+export * from './user';
diff --git a/apps/web-tdesign/src/api/core/menu.ts b/apps/web-tdesign/src/api/core/menu.ts
new file mode 100644
index 00000000..9ef60b11
--- /dev/null
+++ b/apps/web-tdesign/src/api/core/menu.ts
@@ -0,0 +1,10 @@
+import type { RouteRecordStringComponent } from '@vben/types';
+
+import { requestClient } from '#/api/request';
+
+/**
+ * 获取用户所有菜单
+ */
+export async function getAllMenusApi() {
+  return requestClient.get<RouteRecordStringComponent[]>('/menu/all');
+}
diff --git a/apps/web-tdesign/src/api/core/user.ts b/apps/web-tdesign/src/api/core/user.ts
new file mode 100644
index 00000000..7e28ea84
--- /dev/null
+++ b/apps/web-tdesign/src/api/core/user.ts
@@ -0,0 +1,10 @@
+import type { UserInfo } from '@vben/types';
+
+import { requestClient } from '#/api/request';
+
+/**
+ * 获取用户信息
+ */
+export async function getUserInfoApi() {
+  return requestClient.get<UserInfo>('/user/info');
+}
diff --git a/apps/web-tdesign/src/api/index.ts b/apps/web-tdesign/src/api/index.ts
new file mode 100644
index 00000000..4b0e0413
--- /dev/null
+++ b/apps/web-tdesign/src/api/index.ts
@@ -0,0 +1 @@
+export * from './core';
diff --git a/apps/web-tdesign/src/api/request.ts b/apps/web-tdesign/src/api/request.ts
new file mode 100644
index 00000000..86b181d3
--- /dev/null
+++ b/apps/web-tdesign/src/api/request.ts
@@ -0,0 +1,112 @@
+/**
+ * 该文件可自行根据业务逻辑进行调整
+ */
+import type { RequestClientOptions } from '@vben/request';
+
+import { useAppConfig } from '@vben/hooks';
+import { preferences } from '@vben/preferences';
+import {
+  authenticateResponseInterceptor,
+  defaultResponseInterceptor,
+  errorMessageResponseInterceptor,
+  RequestClient,
+} from '@vben/request';
+import { useAccessStore } from '@vben/stores';
+
+import { message } from '#/adapter/tdesign';
+import { useAuthStore } from '#/store';
+
+import { refreshTokenApi } from './core';
+
+const { apiURL } = useAppConfig(import.meta.env, import.meta.env.PROD);
+
+function createRequestClient(baseURL: string, options?: RequestClientOptions) {
+  const client = new RequestClient({
+    ...options,
+    baseURL,
+  });
+
+  /**
+   * 重新认证逻辑
+   */
+  async function doReAuthenticate() {
+    console.warn('Access token or refresh token is invalid or expired. ');
+    const accessStore = useAccessStore();
+    const authStore = useAuthStore();
+    accessStore.setAccessToken(null);
+    if (
+      preferences.app.loginExpiredMode === 'modal' &&
+      accessStore.isAccessChecked
+    ) {
+      accessStore.setLoginExpired(true);
+    } else {
+      await authStore.logout();
+    }
+  }
+
+  /**
+   * 刷新token逻辑
+   */
+  async function doRefreshToken() {
+    const accessStore = useAccessStore();
+    const resp = await refreshTokenApi();
+    const newToken = resp.data;
+    accessStore.setAccessToken(newToken);
+    return newToken;
+  }
+
+  function formatToken(token: null | string) {
+    return token ? `Bearer ${token}` : null;
+  }
+
+  // 请求头处理
+  client.addRequestInterceptor({
+    fulfilled: async (config) => {
+      const accessStore = useAccessStore();
+
+      config.headers.Authorization = formatToken(accessStore.accessToken);
+      config.headers['Accept-Language'] = preferences.app.locale;
+      return config;
+    },
+  });
+
+  // 处理返回的响应数据格式
+  client.addResponseInterceptor(
+    defaultResponseInterceptor({
+      codeField: 'code',
+      dataField: 'data',
+      successCode: 0,
+    }),
+  );
+
+  // token过期的处理
+  client.addResponseInterceptor(
+    authenticateResponseInterceptor({
+      client,
+      doReAuthenticate,
+      doRefreshToken,
+      enableRefreshToken: preferences.app.enableRefreshToken,
+      formatToken,
+    }),
+  );
+
+  // 通用的错误处理,如果没有进入上面的错误处理逻辑，就会进入这里
+  client.addResponseInterceptor(
+    errorMessageResponseInterceptor((msg: string, error) => {
+      // 这里可以根据业务进行定制,你可以拿到 error 内的信息进行定制化处理，根据不同的 code 做不同的提示，而不是直接使用 message.error 提示 msg
+      // 当前mock接口返回的错误字段是 error 或者 message
+      const responseData = error?.response?.data ?? {};
+      const errorMessage = responseData?.error ?? responseData?.message ?? '';
+      // 如果没有错误信息，则会根据状态码进行提示
+      message.error(errorMessage || msg);
+    }),
+  );
+
+  return client;
+}
+
+export const requestClient = createRequestClient(apiURL, {
+  responseReturn: 'data',
+});
+
+export const baseRequestClient = new RequestClient({ baseURL: apiURL });
diff --git a/apps/web-tdesign/src/app.vue b/apps/web-tdesign/src/app.vue
new file mode 100644
index 00000000..01ce79db
--- /dev/null
+++ b/apps/web-tdesign/src/app.vue
@@ -0,0 +1,43 @@
+<script lang="ts" setup>
+import type { GlobalConfigProvider } from 'tdesign-vue-next';
+
+import { watch } from 'vue';
+
+import { useTDesignDesignTokens } from '@vben/hooks';
+import { usePreferences } from '@vben/preferences';
+
+import { merge } from 'es-toolkit/compat';
+import { ConfigProvider } from 'tdesign-vue-next';
+import zhConfig from 'tdesign-vue-next/es/locale/zh_CN';
+
+defineOptions({ name: 'App' });
+const { isDark } = usePreferences();
+
+// 将 Vben 设计系统的 CSS 变量适配到 TDesign 的设计变量上
+useTDesignDesignTokens();
+
+watch(
+  () => isDark.value,
+  (dark) => {
+    document.documentElement.setAttribute(
+      'theme-mode',
+      dark ? 'dark' : 'light',
+    );
+  },
+  { immediate: true },
+);
+
+const customConfig: GlobalConfigProvider = {
+  // 可以在此处定义更多自定义配置，具体可配置内容参看 API 文档
+  calendar: {},
+  table: {},
+  pagination: {},
+};
+const globalConfig = merge(zhConfig, customConfig);
+</script>
+
+<template>
+  <ConfigProvider :global-config="globalConfig">
+    <RouterView />
+  </ConfigProvider>
+</template>
diff --git a/apps/web-tdesign/src/bootstrap.ts b/apps/web-tdesign/src/bootstrap.ts
new file mode 100644
index 00000000..ad7fef6a
--- /dev/null
+++ b/apps/web-tdesign/src/bootstrap.ts
@@ -0,0 +1,78 @@
+import { createApp, watchEffect } from 'vue';
+
+import { registerAccessDirective } from '@vben/access';
+import { registerLoadingDirective } from '@vben/common-ui/es/loading';
+import { preferences } from '@vben/preferences';
+import { initStores } from '@vben/stores';
+import '@vben/styles';
+
+import { useTitle } from '@vueuse/core';
+
+import { $t, setupI18n } from '#/locales';
+
+import { initComponentAdapter } from './adapter/component';
+import { initSetupVbenForm } from './adapter/form';
+import App from './app.vue';
+import { router } from './router';
+
+// 引入组件库的少量全局样式变量
+import 'tdesign-vue-next/es/style/index.css';
+
+async function bootstrap(namespace: string) {
+  // 初始化组件适配器
+  await initComponentAdapter();
+
+  // 初始化表单组件
+  await initSetupVbenForm();
+
+  // // 设置弹窗的默认配置
+  // setDefaultModalProps({
+  //   fullscreenButton: false,
+  // });
+  // // 设置抽屉的默认配置
+  // setDefaultDrawerProps({
+  //   zIndex: 1020,
+  // });
+
+  const app = createApp(App);
+
+  // 注册v-loading指令
+  registerLoadingDirective(app, {
+    loading: 'loading', // 在这里可以自定义指令名称，也可以明确提供false表示不注册这个指令
+    spinning: 'spinning',
+  });
+
+  // 国际化 i18n 配置
+  await setupI18n(app);
+
+  // 配置 pinia-tore
+  await initStores(app, { namespace });
+
+  // 安装权限指令
+  registerAccessDirective(app);
+
+  // 初始化 tippy
+  const { initTippy } = await import('@vben/common-ui/es/tippy');
+  initTippy(app);
+
+  // 配置路由及路由守卫
+  app.use(router);
+
+  // 配置Motion插件
+  const { MotionPlugin } = await import('@vben/plugins/motion');
+  app.use(MotionPlugin);
+
+  // 动态更新标题
+  watchEffect(() => {
+    if (preferences.app.dynamicTitle) {
+      const routeTitle = router.currentRoute.value.meta?.title;
+      const pageTitle =
+        (routeTitle ? `${$t(routeTitle)} - ` : '') + preferences.app.name;
+      useTitle(pageTitle);
+    }
+  });
+
+  app.mount('#app');
+}
+
+export { bootstrap };
diff --git a/apps/web-tdesign/src/layouts/auth.vue b/apps/web-tdesign/src/layouts/auth.vue
new file mode 100644
index 00000000..18d415bc
--- /dev/null
+++ b/apps/web-tdesign/src/layouts/auth.vue
@@ -0,0 +1,23 @@
+<script lang="ts" setup>
+import { computed } from 'vue';
+
+import { AuthPageLayout } from '@vben/layouts';
+import { preferences } from '@vben/preferences';
+
+import { $t } from '#/locales';
+
+const appName = computed(() => preferences.app.name);
+const logo = computed(() => preferences.logo.source);
+</script>
+
+<template>
+  <AuthPageLayout
+    :app-name="appName"
+    :logo="logo"
+    :page-description="$t('authentication.pageDesc')"
+    :page-title="$t('authentication.pageTitle')"
+  >
+    <!-- 自定义工具栏 -->
+    <!-- <template #toolbar></template> -->
+  </AuthPageLayout>
+</template>
diff --git a/apps/web-tdesign/src/layouts/basic.vue b/apps/web-tdesign/src/layouts/basic.vue
new file mode 100644
index 00000000..e85dd1cf
--- /dev/null
+++ b/apps/web-tdesign/src/layouts/basic.vue
@@ -0,0 +1,261 @@
+<script lang="ts" setup>
+import type { NotificationItem } from '@vben/layouts';
+
+import { computed, ref, watch } from 'vue';
+import { useRouter } from 'vue-router';
+
+import { AuthenticationLoginExpiredModal } from '@vben/common-ui';
+import { VBEN_DOC_URL, VBEN_GITHUB_URL } from '@vben/constants';
+import { useWatermark } from '@vben/hooks';
+import { BookOpenText, CircleHelp, SvgGithubIcon } from '@vben/icons';
+import {
+  BasicLayout,
+  LockScreen,
+  Notification,
+  UserDropdown,
+} from '@vben/layouts';
+import { preferences, usePreferences } from '@vben/preferences';
+import { useAccessStore, useUserStore } from '@vben/stores';
+import { openWindow } from '@vben/utils';
+
+import { $t } from '#/locales';
+import { useAuthStore } from '#/store';
+import LoginForm from '#/views/_core/authentication/login.vue';
+
+const notifications = ref<NotificationItem[]>([
+  {
+    id: 1,
+    avatar: 'https://avatar.vercel.sh/vercel.svg?text=VB',
+    date: '3小时前',
+    isRead: true,
+    message: '描述信息描述信息描述信息',
+    title: '收到了 14 份新周报',
+  },
+  {
+    id: 2,
+    avatar: 'https://avatar.vercel.sh/1',
+    date: '刚刚',
+    isRead: false,
+    message: '描述信息描述信息描述信息',
+    title: '朱偏右 回复了你',
+  },
+  {
+    id: 3,
+    avatar: 'https://avatar.vercel.sh/1',
+    date: '2024-01-01',
+    isRead: false,
+    message: '描述信息描述信息描述信息',
+    title: '曲丽丽 评论了你',
+  },
+  {
+    id: 4,
+    avatar: 'https://avatar.vercel.sh/satori',
+    date: '1天前',
+    isRead: false,
+    message: '描述信息描述信息描述信息',
+    title: '代办提醒',
+  },
+  {
+    id: 5,
+    avatar: 'https://avatar.vercel.sh/satori',
+    date: '1天前',
+    isRead: false,
+    message: '描述信息描述信息描述信息',
+    title: '跳转Workspace示例',
+    link: '/workspace',
+  },
+  {
+    id: 6,
+    avatar: 'https://avatar.vercel.sh/satori',
+    date: '1天前',
+    isRead: false,
+    message: '描述信息描述信息描述信息',
+    title: '跳转外部链接示例',
+    link: 'https://doc.vben.pro',
+  },
+]);
+
+const router = useRouter();
+const userStore = useUserStore();
+const authStore = useAuthStore();
+const accessStore = useAccessStore();
+const { destroyWatermark, updateWatermark } = useWatermark();
+const { isDark } = usePreferences();
+const showDot = computed(() =>
+  notifications.value.some((item) => !item.isRead),
+);
+
+const menus = computed(() => [
+  {
+    handler: () => {
+      router.push({ name: 'Profile' });
+    },
+    icon: 'lucide:user',
+    text: $t('page.auth.profile'),
+  },
+  {
+    handler: () => {
+      openWindow(VBEN_DOC_URL, {
+        target: '_blank',
+      });
+    },
+    icon: BookOpenText,
+    text: $t('ui.widgets.document'),
+  },
+  {
+    handler: () => {
+      openWindow(VBEN_GITHUB_URL, {
+        target: '_blank',
+      });
+    },
+    icon: SvgGithubIcon,
+    text: 'GitHub',
+  },
+  {
+    handler: () => {
+      openWindow(`${VBEN_GITHUB_URL}/issues`, {
+        target: '_blank',
+      });
+    },
+    icon: CircleHelp,
+    text: $t('ui.widgets.qa'),
+  },
+]);
+
+const avatar = computed(() => {
+  return userStore.userInfo?.avatar ?? preferences.app.defaultAvatar;
+});
+
+async function handleLogout() {
+  await authStore.logout(false);
+}
+
+function handleNoticeClear() {
+  notifications.value = [];
+}
+
+function markRead(id: number | string) {
+  const item = notifications.value.find((item) => item.id === id);
+  if (item) {
+    item.isRead = true;
+  }
+}
+
+function remove(id: number | string) {
+  notifications.value = notifications.value.filter((item) => item.id !== id);
+}
+
+function handleMakeAll() {
+  notifications.value.forEach((item) => (item.isRead = true));
+}
+
+const viewAll = () => {};
+
+const handleClick = (item: NotificationItem) => {
+  // 如果通知项有链接，点击时跳转
+  if (item.link) {
+    navigateTo(item.link, item.query, item.state);
+  }
+};
+
+function navigateTo(
+  link: string,
+  query?: Record<string, any>,
+  state?: Record<string, any>,
+) {
+  if (link.startsWith('http://') || link.startsWith('https://')) {
+    // 外部链接，在新标签页打开
+    window.open(link, '_blank');
+  } else {
+    // 内部路由链接，支持 query 参数和 state
+    router.push({
+      path: link,
+      query: query || {},
+      state,
+    });
+  }
+}
+
+watch(
+  () => ({
+    enable: preferences.app.watermark,
+    content: preferences.app.watermarkContent,
+    isDark: isDark.value,
+  }),
+  async ({ enable, content, isDark: isDarkValue }) => {
+    if (enable) {
+      const watermarkColor = isDarkValue
+        ? 'rgba(255, 255, 255, 0.12)'
+        : 'rgba(0, 0, 0, 0.12)';
+
+      await updateWatermark({
+        advancedStyle: {
+          colorStops: [
+            {
+              color: watermarkColor,
+              offset: 0,
+            },
+            {
+              color: watermarkColor,
+              offset: 1,
+            },
+          ],
+          type: 'linear',
+        },
+        content:
+          content ||
+          `${userStore.userInfo?.username} - ${userStore.userInfo?.realName}`,
+      });
+    } else {
+      destroyWatermark();
+    }
+  },
+  {
+    immediate: true,
+  },
+);
+</script>
+
+<template>
+  <BasicLayout
+    :avatar
+    :text="userStore.userInfo?.realName"
+    @clear-preferences-and-logout="handleLogout"
+    @logout="handleLogout"
+  >
+    <template #user-dropdown>
+      <UserDropdown
+        :avatar
+        :menus
+        :text="userStore.userInfo?.realName"
+        description="ann.vben@gmail.com"
+        tag-text="Pro"
+        @clear-preferences-and-logout="handleLogout"
+        @logout="handleLogout"
+      />
+    </template>
+    <template #notification>
+      <Notification
+        :dot="showDot"
+        :notifications="notifications"
+        @clear="handleNoticeClear"
+        @read="(item) => item.id && markRead(item.id)"
+        @remove="(item) => item.id && remove(item.id)"
+        @make-all="handleMakeAll"
+        @on-click="handleClick"
+        @view-all="viewAll"
+      />
+    </template>
+    <template #extra>
+      <AuthenticationLoginExpiredModal
+        v-model:open="accessStore.loginExpired"
+        :avatar
+      >
+        <LoginForm />
+      </AuthenticationLoginExpiredModal>
+    </template>
+    <template #lock-screen>
+      <LockScreen :avatar @to-login="handleLogout" />
+    </template>
+  </BasicLayout>
+</template>
diff --git a/apps/web-tdesign/src/layouts/index.ts b/apps/web-tdesign/src/layouts/index.ts
new file mode 100644
index 00000000..a4320780
--- /dev/null
+++ b/apps/web-tdesign/src/layouts/index.ts
@@ -0,0 +1,6 @@
+const BasicLayout = () => import('./basic.vue');
+const AuthPageLayout = () => import('./auth.vue');
+
+const IFrameView = () => import('@vben/layouts').then((m) => m.IFrameView);
+
+export { AuthPageLayout, BasicLayout, IFrameView };
diff --git a/apps/web-tdesign/src/locales/README.md b/apps/web-tdesign/src/locales/README.md
new file mode 100644
index 00000000..7b451032
--- /dev/null
+++ b/apps/web-tdesign/src/locales/README.md
@@ -0,0 +1,3 @@
+# locale
+
+每个app使用的国际化可能不同，这里用于扩展国际化的功能，例如扩展 dayjs、antd组件库的多语言切换，以及app本身的国际化文件。
diff --git a/apps/web-tdesign/src/locales/index.ts b/apps/web-tdesign/src/locales/index.ts
new file mode 100644
index 00000000..6d98579a
--- /dev/null
+++ b/apps/web-tdesign/src/locales/index.ts
@@ -0,0 +1,77 @@
+import type { App } from 'vue';
+
+import type { LocaleSetupOptions, SupportedLanguagesType } from '@vben/locales';
+
+import {
+  $t,
+  setupI18n as coreSetup,
+  loadLocalesMapFromDir,
+} from '@vben/locales';
+import { preferences } from '@vben/preferences';
+
+import dayjs from 'dayjs';
+
+const modules = import.meta.glob('./langs/**/*.json');
+
+const localesMap = loadLocalesMapFromDir(
+  /\.\/langs\/([^/]+)\/(.*)\.json$/,
+  modules,
+);
+/**
+ * 加载应用特有的语言包
+ * 这里也可以改造为从服务端获取翻译数据
+ * @param lang
+ */
+async function loadMessages(lang: SupportedLanguagesType) {
+  const [appLocaleMessages] = await Promise.all([
+    localesMap[lang]?.(),
+    loadThirdPartyMessage(lang),
+  ]);
+  return appLocaleMessages?.default;
+}
+
+/**
+ * 加载第三方组件库的语言包
+ * @param lang
+ */
+async function loadThirdPartyMessage(lang: SupportedLanguagesType) {
+  await loadDayjsLocale(lang);
+}
+
+/**
+ * 加载dayjs的语言包
+ * @param lang
+ */
+async function loadDayjsLocale(lang: SupportedLanguagesType) {
+  let locale;
+  switch (lang) {
+    case 'en-US': {
+      locale = await import('dayjs/locale/en');
+      break;
+    }
+    case 'zh-CN': {
+      locale = await import('dayjs/locale/zh-cn');
+      break;
+    }
+    // 默认使用英语
+    default: {
+      locale = await import('dayjs/locale/en');
+    }
+  }
+  if (locale) {
+    dayjs.locale(locale);
+  } else {
+    console.error(`Failed to load dayjs locale for ${lang}`);
+  }
+}
+
+async function setupI18n(app: App, options: LocaleSetupOptions = {}) {
+  await coreSetup(app, {
+    defaultLocale: preferences.app.locale,
+    loadMessages,
+    missingWarn: !import.meta.env.PROD,
+    ...options,
+  });
+}
+
+export { $t, setupI18n };
diff --git a/apps/web-tdesign/src/locales/langs/en-US/demos.json b/apps/web-tdesign/src/locales/langs/en-US/demos.json
new file mode 100644
index 00000000..0cb50b7f
--- /dev/null
+++ b/apps/web-tdesign/src/locales/langs/en-US/demos.json
@@ -0,0 +1,13 @@
+{
+  "title": "Demos",
+  "tdesign": "TDesign Vue",
+  "vben": {
+    "title": "Project",
+    "about": "About",
+    "document": "Document",
+    "antdv": "Ant Design Vue Version",
+    "antdv-next": "Antdv Next Version",
+    "naive-ui": "Naive UI Version",
+    "element-plus": "Element Plus Version"
+  }
+}
diff --git a/apps/web-tdesign/src/locales/langs/en-US/page.json b/apps/web-tdesign/src/locales/langs/en-US/page.json
new file mode 100644
index 00000000..39f1641c
--- /dev/null
+++ b/apps/web-tdesign/src/locales/langs/en-US/page.json
@@ -0,0 +1,15 @@
+{
+  "auth": {
+    "login": "Login",
+    "register": "Register",
+    "codeLogin": "Code Login",
+    "qrcodeLogin": "Qr Code Login",
+    "forgetPassword": "Forget Password",
+    "profile": "Profile"
+  },
+  "dashboard": {
+    "title": "Dashboard",
+    "analytics": "Analytics",
+    "workspace": "Workspace"
+  }
+}
diff --git a/apps/web-tdesign/src/locales/langs/zh-CN/demos.json b/apps/web-tdesign/src/locales/langs/zh-CN/demos.json
new file mode 100644
index 00000000..25e2a0f9
--- /dev/null
+++ b/apps/web-tdesign/src/locales/langs/zh-CN/demos.json
@@ -0,0 +1,13 @@
+{
+  "title": "演示",
+  "tdesign": "TDesign Vue",
+  "vben": {
+    "title": "项目",
+    "about": "关于",
+    "document": "文档",
+    "antdv": "Ant Design Vue 版本",
+    "antdv-next": "Antdv Next 版本",
+    "naive-ui": "Naive UI 版本",
+    "element-plus": "Element Plus 版本"
+  }
+}
diff --git a/apps/web-tdesign/src/locales/langs/zh-CN/page.json b/apps/web-tdesign/src/locales/langs/zh-CN/page.json
new file mode 100644
index 00000000..2192d1d5
--- /dev/null
+++ b/apps/web-tdesign/src/locales/langs/zh-CN/page.json
@@ -0,0 +1,15 @@
+{
+  "auth": {
+    "login": "登录",
+    "register": "注册",
+    "codeLogin": "验证码登录",
+    "qrcodeLogin": "二维码登录",
+    "forgetPassword": "忘记密码",
+    "profile": "个人中心"
+  },
+  "dashboard": {
+    "title": "概览",
+    "analytics": "分析页",
+    "workspace": "工作台"
+  }
+}
diff --git a/apps/web-tdesign/src/main.ts b/apps/web-tdesign/src/main.ts
new file mode 100644
index 00000000..5d728a02
--- /dev/null
+++ b/apps/web-tdesign/src/main.ts
@@ -0,0 +1,31 @@
+import { initPreferences } from '@vben/preferences';
+import { unmountGlobalLoading } from '@vben/utils';
+
+import { overridesPreferences } from './preferences';
+
+/**
+ * 应用初始化完成之后再进行页面加载渲染
+ */
+async function initApplication() {
+  // name用于指定项目唯一标识
+  // 用于区分不同项目的偏好设置以及存储数据的key前缀以及其他一些需要隔离的数据
+  const env = import.meta.env.PROD ? 'prod' : 'dev';
+  const appVersion = import.meta.env.VITE_APP_VERSION;
+  const namespace = `${import.meta.env.VITE_APP_NAMESPACE}-${appVersion}-${env}`;
+
+  // app偏好设置初始化
+  await initPreferences({
+    namespace,
+    overrides: overridesPreferences,
+  });
+
+  // 启动应用并挂载
+  // vue应用主要逻辑及视图
+  const { bootstrap } = await import('./bootstrap');
+  await bootstrap(namespace);
+
+  // 移除并销毁loading
+  unmountGlobalLoading();
+}
+
+initApplication();
diff --git a/apps/web-tdesign/src/preferences.ts b/apps/web-tdesign/src/preferences.ts
new file mode 100644
index 00000000..303c496e
--- /dev/null
+++ b/apps/web-tdesign/src/preferences.ts
@@ -0,0 +1,17 @@
+import {
+  appCopyrightPreferences,
+  defineOverridesPreferences,
+} from '@vben/preferences';
+
+/**
+ * @description 项目配置文件
+ * 只需要覆盖项目中的一部分配置，不需要的配置不用覆盖，会自动使用默认配置
+ * !!! 更改配置后请清空缓存，否则可能不生效
+ */
+export const overridesPreferences = defineOverridesPreferences({
+  // overrides
+  app: {
+    name: import.meta.env.VITE_APP_TITLE,
+  },
+  copyright: appCopyrightPreferences,
+});
diff --git a/apps/web-tdesign/src/router/access.ts b/apps/web-tdesign/src/router/access.ts
new file mode 100644
index 00000000..08cb4b0b
--- /dev/null
+++ b/apps/web-tdesign/src/router/access.ts
@@ -0,0 +1,41 @@
+import type {
+  ComponentRecordType,
+  GenerateMenuAndRoutesOptions,
+} from '@vben/types';
+
+import { generateAccessible } from '@vben/access';
+import { preferences } from '@vben/preferences';
+
+import { message } from '#/adapter/tdesign';
+import { getAllMenusApi } from '#/api';
+import { BasicLayout, IFrameView } from '#/layouts';
+import { $t } from '#/locales';
+
+const forbiddenComponent = () => import('#/views/_core/fallback/forbidden.vue');
+
+async function generateAccess(options: GenerateMenuAndRoutesOptions) {
+  const pageMap: ComponentRecordType = import.meta.glob('../views/**/*.vue');
+
+  const layoutMap: ComponentRecordType = {
+    BasicLayout,
+    IFrameView,
+  };
+
+  return await generateAccessible(preferences.app.accessMode, {
+    ...options,
+    fetchMenuListAsync: async () => {
+      message.loading({
+        content: `${$t('common.loadingMenu')}...`,
+        duration: 1500,
+      });
+      return await getAllMenusApi();
+    },
+    // 可以指定没有权限跳转403页面
+    forbiddenComponent,
+    // 如果 route.meta.menuVisibleWithForbidden = true
+    layoutMap,
+    pageMap,
+  });
+}
+
+export { generateAccess };
diff --git a/apps/web-tdesign/src/router/guard.ts b/apps/web-tdesign/src/router/guard.ts
new file mode 100644
index 00000000..a1ad6d88
--- /dev/null
+++ b/apps/web-tdesign/src/router/guard.ts
@@ -0,0 +1,133 @@
+import type { Router } from 'vue-router';
+
+import { LOGIN_PATH } from '@vben/constants';
+import { preferences } from '@vben/preferences';
+import { useAccessStore, useUserStore } from '@vben/stores';
+import { startProgress, stopProgress } from '@vben/utils';
+
+import { accessRoutes, coreRouteNames } from '#/router/routes';
+import { useAuthStore } from '#/store';
+
+import { generateAccess } from './access';
+
+/**
+ * 通用守卫配置
+ * @param router
+ */
+function setupCommonGuard(router: Router) {
+  // 记录已经加载的页面
+  const loadedPaths = new Set<string>();
+
+  router.beforeEach((to) => {
+    to.meta.loaded = loadedPaths.has(to.path);
+
+    // 页面加载进度条
+    if (!to.meta.loaded && preferences.transition.progress) {
+      startProgress();
+    }
+    return true;
+  });
+
+  router.afterEach((to) => {
+    // 记录页面是否加载,如果已经加载，后续的页面切换动画等效果不在重复执行
+
+    loadedPaths.add(to.path);
+
+    // 关闭页面加载进度条
+    if (preferences.transition.progress) {
+      stopProgress();
+    }
+  });
+}
+
+/**
+ * 权限访问守卫配置
+ * @param router
+ */
+function setupAccessGuard(router: Router) {
+  router.beforeEach(async (to, from) => {
+    const accessStore = useAccessStore();
+    const userStore = useUserStore();
+    const authStore = useAuthStore();
+
+    // 基本路由，这些路由不需要进入权限拦截
+    if (coreRouteNames.includes(to.name as string)) {
+      if (to.path === LOGIN_PATH && accessStore.accessToken) {
+        return decodeURIComponent(
+          (to.query?.redirect as string) ||
+            userStore.userInfo?.homePath ||
+            preferences.app.defaultHomePath,
+        );
+      }
+      return true;
+    }
+
+    // accessToken 检查
+    if (!accessStore.accessToken) {
+      // 明确声明忽略权限访问权限，则可以访问
+      if (to.meta.ignoreAccess) {
+        return true;
+      }
+
+      // 没有访问权限，跳转登录页面
+      if (to.fullPath !== LOGIN_PATH) {
+        return {
+          path: LOGIN_PATH,
+          // 如不需要，直接删除 query
+          query:
+            to.fullPath === preferences.app.defaultHomePath
+              ? {}
+              : { redirect: encodeURIComponent(to.fullPath) },
+          // 携带当前跳转的页面，登录后重新跳转该页面
+          replace: true,
+        };
+      }
+      return to;
+    }
+
+    // 是否已经生成过动态路由
+    if (accessStore.isAccessChecked) {
+      return true;
+    }
+
+    // 生成路由表
+    // 当前登录用户拥有的角色标识列表
+    const userInfo = userStore.userInfo || (await authStore.fetchUserInfo());
+    const userRoles = userInfo.roles ?? [];
+
+    // 生成菜单和路由
+    const { accessibleMenus, accessibleRoutes } = await generateAccess({
+      roles: userRoles,
+      router,
+      // 则会在菜单中显示，但是访问会被重定向到403
+      routes: accessRoutes,
+    });
+
+    // 保存菜单信息和路由信息
+    accessStore.setAccessMenus(accessibleMenus);
+    accessStore.setAccessRoutes(accessibleRoutes);
+    accessStore.setIsAccessChecked(true);
+    const redirectPath = (from.query.redirect ??
+      (to.path === preferences.app.defaultHomePath
+        ? userInfo.homePath || preferences.app.defaultHomePath
+        : to.fullPath)) as string;
+
+    return {
+      ...router.resolve(decodeURIComponent(redirectPath)),
+      replace: true,
+    };
+  });
+}
+
+/**
+ * 项目守卫配置
+ * @param router
+ */
+function createRouterGuard(router: Router) {
+  /** 通用 */
+  setupCommonGuard(router);
+  /** 权限访问 */
+  setupAccessGuard(router);
+}
+
+export { createRouterGuard };
diff --git a/apps/web-tdesign/src/router/index.ts b/apps/web-tdesign/src/router/index.ts
new file mode 100644
index 00000000..48402303
--- /dev/null
+++ b/apps/web-tdesign/src/router/index.ts
@@ -0,0 +1,37 @@
+import {
+  createRouter,
+  createWebHashHistory,
+  createWebHistory,
+} from 'vue-router';
+
+import { resetStaticRoutes } from '@vben/utils';
+
+import { createRouterGuard } from './guard';
+import { routes } from './routes';
+
+/**
+ *  @zh_CN 创建vue-router实例
+ */
+const router = createRouter({
+  history:
+    import.meta.env.VITE_ROUTER_HISTORY === 'hash'
+      ? createWebHashHistory(import.meta.env.VITE_BASE)
+      : createWebHistory(import.meta.env.VITE_BASE),
+  // 应该添加到路由的初始路由列表。
+  routes,
+  scrollBehavior: (to, _from, savedPosition) => {
+    if (savedPosition) {
+      return savedPosition;
+    }
+    return to.hash ? { behavior: 'smooth', el: to.hash } : { left: 0, top: 0 };
+  },
+  // 是否应该禁止尾部斜杠。
+  // strict: true,
+});
+
+const resetRoutes = () => resetStaticRoutes(router, routes);
+
+// 创建路由守卫
+createRouterGuard(router);
+
+export { resetRoutes, router };
diff --git a/apps/web-tdesign/src/router/routes/core.ts b/apps/web-tdesign/src/router/routes/core.ts
new file mode 100644
index 00000000..949b0b65
--- /dev/null
+++ b/apps/web-tdesign/src/router/routes/core.ts
@@ -0,0 +1,97 @@
+import type { RouteRecordRaw } from 'vue-router';
+
+import { LOGIN_PATH } from '@vben/constants';
+import { preferences } from '@vben/preferences';
+
+import { $t } from '#/locales';
+
+const BasicLayout = () => import('#/layouts/basic.vue');
+const AuthPageLayout = () => import('#/layouts/auth.vue');
+/** 全局404页面 */
+const fallbackNotFoundRoute: RouteRecordRaw = {
+  component: () => import('#/views/_core/fallback/not-found.vue'),
+  meta: {
+    hideInBreadcrumb: true,
+    hideInMenu: true,
+    hideInTab: true,
+    title: '404',
+  },
+  name: 'FallbackNotFound',
+  path: '/:path(.*)*',
+};
+
+/** 基本路由，这些路由是必须存在的 */
+const coreRoutes: RouteRecordRaw[] = [
+  /**
+   * 根路由
+   * 使用基础布局，作为所有页面的父级容器，子级就不必配置BasicLayout。
+   * 此路由必须存在，且不应修改
+   */
+  {
+    component: BasicLayout,
+    meta: {
+      hideInBreadcrumb: true,
+      title: 'Root',
+    },
+    name: 'Root',
+    path: '/',
+    redirect: preferences.app.defaultHomePath,
+    children: [],
+  },
+  {
+    component: AuthPageLayout,
+    meta: {
+      hideInTab: true,
+      title: 'Authentication',
+    },
+    name: 'Authentication',
+    path: '/auth',
+    redirect: LOGIN_PATH,
+    children: [
+      {
+        name: 'Login',
+        path: 'login',
+        component: () => import('#/views/_core/authentication/login.vue'),
+        meta: {
+          title: $t('page.auth.login'),
+        },
+      },
+      {
+        name: 'CodeLogin',
+        path: 'code-login',
+        component: () => import('#/views/_core/authentication/code-login.vue'),
+        meta: {
+          title: $t('page.auth.codeLogin'),
+        },
+      },
+      {
+        name: 'QrCodeLogin',
+        path: 'qrcode-login',
+        component: () =>
+          import('#/views/_core/authentication/qrcode-login.vue'),
+        meta: {
+          title: $t('page.auth.qrcodeLogin'),
+        },
+      },
+      {
+        name: 'ForgetPassword',
+        path: 'forget-password',
+        component: () =>
+          import('#/views/_core/authentication/forget-password.vue'),
+        meta: {
+          title: $t('page.auth.forgetPassword'),
+        },
+      },
+      {
+        name: 'Register',
+        path: 'register',
+        component: () => import('#/views/_core/authentication/register.vue'),
+        meta: {
+          title: $t('page.auth.register'),
+        },
+      },
+    ],
+  },
+];
+
+export { coreRoutes, fallbackNotFoundRoute };
diff --git a/apps/web-tdesign/src/router/routes/index.ts b/apps/web-tdesign/src/router/routes/index.ts
new file mode 100644
index 00000000..e6fb1440
--- /dev/null
+++ b/apps/web-tdesign/src/router/routes/index.ts
@@ -0,0 +1,37 @@
+import type { RouteRecordRaw } from 'vue-router';
+
+import { mergeRouteModules, traverseTreeValues } from '@vben/utils';
+
+import { coreRoutes, fallbackNotFoundRoute } from './core';
+
+const dynamicRouteFiles = import.meta.glob('./modules/**/*.ts', {
+  eager: true,
+});
+
+// 有需要可以自行打开注释，并创建文件夹
+// const externalRouteFiles = import.meta.glob('./external/**/*.ts', { eager: true });
+// const staticRouteFiles = import.meta.glob('./static/**/*.ts', { eager: true });
+
+/** 动态路由 */
+const dynamicRoutes: RouteRecordRaw[] = mergeRouteModules(dynamicRouteFiles);
+
+/** 外部路由列表，访问这些页面可以不需要Layout，可能用于内嵌在别的系统(不会显示在菜单中) */
+// const externalRoutes: RouteRecordRaw[] = mergeRouteModules(externalRouteFiles);
+// const staticRoutes: RouteRecordRaw[] = mergeRouteModules(staticRouteFiles);
+const staticRoutes: RouteRecordRaw[] = [];
+const externalRoutes: RouteRecordRaw[] = [];
+
+/** 路由列表，由基本路由、外部路由和404兜底路由组成
+ *  无需走权限验证（会一直显示在菜单中） */
+const routes: RouteRecordRaw[] = [
+  ...coreRoutes,
+  ...externalRoutes,
+  fallbackNotFoundRoute,
+];
+
+/** 基本路由列表，这些路由不需要进入权限拦截 */
+const coreRouteNames = traverseTreeValues(coreRoutes, (route) => route.name);
+
+/** 有权限校验的路由列表，包含动态路由和静态路由 */
+const accessRoutes = [...dynamicRoutes, ...staticRoutes];
+export { accessRoutes, coreRouteNames, routes };
diff --git a/apps/web-tdesign/src/router/routes/modules/dashboard.ts b/apps/web-tdesign/src/router/routes/modules/dashboard.ts
new file mode 100644
index 00000000..44f15ef9
--- /dev/null
+++ b/apps/web-tdesign/src/router/routes/modules/dashboard.ts
@@ -0,0 +1,38 @@
+import type { RouteRecordRaw } from 'vue-router';
+
+import { $t } from '#/locales';
+
+const routes: RouteRecordRaw[] = [
+  {
+    meta: {
+      icon: 'lucide:layout-dashboard',
+      order: -1,
+      title: $t('page.dashboard.title'),
+    },
+    name: 'Dashboard',
+    path: '/dashboard',
+    children: [
+      {
+        name: 'Analytics',
+        path: 'analytics',
+        component: () => import('#/views/dashboard/analytics/index.vue'),
+        meta: {
+          affixTab: true,
+          icon: 'lucide:area-chart',
+          title: $t('page.dashboard.analytics'),
+        },
+      },
+      {
+        name: 'Workspace',
+        path: 'workspace',
+        component: () => import('#/views/dashboard/workspace/index.vue'),
+        meta: {
+          icon: 'carbon:workspace',
+          title: $t('page.dashboard.workspace'),
+        },
+      },
+    ],
+  },
+];
+
+export default routes;
diff --git a/apps/web-tdesign/src/router/routes/modules/demos.ts b/apps/web-tdesign/src/router/routes/modules/demos.ts
new file mode 100644
index 00000000..527f9b25
--- /dev/null
+++ b/apps/web-tdesign/src/router/routes/modules/demos.ts
@@ -0,0 +1,28 @@
+import type { RouteRecordRaw } from 'vue-router';
+
+import { $t } from '#/locales';
+
+const routes: RouteRecordRaw[] = [
+  {
+    meta: {
+      icon: 'ic:baseline-view-in-ar',
+      keepAlive: true,
+      order: 1000,
+      title: $t('demos.title'),
+    },
+    name: 'Demos',
+    path: '/demos',
+    children: [
+      {
+        meta: {
+          title: $t('demos.tdesign'),
+        },
+        name: 'TDesignDemos',
+        path: 'tdesign',
+        component: () => import('#/views/demos/tdesign/index.vue'),
+      },
+    ],
+  },
+];
+
+export default routes;
diff --git a/apps/web-tdesign/src/router/routes/modules/vben.ts b/apps/web-tdesign/src/router/routes/modules/vben.ts
new file mode 100644
index 00000000..cb125e33
--- /dev/null
+++ b/apps/web-tdesign/src/router/routes/modules/vben.ts
@@ -0,0 +1,116 @@
+import type { RouteRecordRaw } from 'vue-router';
+
+import {
+  VBEN_ANT_PREVIEW_URL,
+  VBEN_ANTDV_NEXT_PREVIEW_URL,
+  VBEN_DOC_URL,
+  VBEN_ELE_PREVIEW_URL,
+  VBEN_GITHUB_URL,
+  VBEN_LOGO_URL,
+  VBEN_NAIVE_PREVIEW_URL,
+} from '@vben/constants';
+import { SvgAntdvLogoIcon, SvgAntdvNextLogoIcon } from '@vben/icons';
+
+import { IFrameView } from '#/layouts';
+import { $t } from '#/locales';
+
+const routes: RouteRecordRaw[] = [
+  {
+    meta: {
+      badgeType: 'dot',
+      icon: VBEN_LOGO_URL,
+      order: 9998,
+      title: $t('demos.vben.title'),
+    },
+    name: 'VbenProject',
+    path: '/vben-admin',
+    children: [
+      {
+        name: 'VbenDocument',
+        path: 'document',
+        component: IFrameView,
+        meta: {
+          icon: 'lucide:book-open-text',
+          link: VBEN_DOC_URL,
+          title: $t('demos.vben.document'),
+        },
+      },
+      {
+        name: 'VbenGithub',
+        path: 'github',
+        component: IFrameView,
+        meta: {
+          icon: 'mdi:github',
+          link: VBEN_GITHUB_URL,
+          title: 'Github',
+        },
+      },
+      {
+        name: 'VbenNaive',
+        path: 'naive',
+        component: IFrameView,
+        meta: {
+          badgeType: 'dot',
+          icon: 'logos:naiveui',
+          link: VBEN_NAIVE_PREVIEW_URL,
+          title: $t('demos.vben.naive-ui'),
+        },
+      },
+      {
+        name: 'VbenAntdv',
+        path: 'antdv',
+        component: IFrameView,
+        meta: {
+          badgeType: 'dot',
+          icon: SvgAntdvLogoIcon,
+          link: VBEN_ANT_PREVIEW_URL,
+          title: $t('demos.vben.antdv'),
+        },
+      },
+      {
+        name: 'VbenAntdVNext',
+        path: 'antdv-next',
+        component: IFrameView,
+        meta: {
+          badgeType: 'dot',
+          icon: SvgAntdvNextLogoIcon,
+          link: VBEN_ANTDV_NEXT_PREVIEW_URL,
+          title: $t('demos.vben.antdv-next'),
+        },
+      },
+      {
+        name: 'VbenElementPlus',
+        path: 'ele',
+        component: IFrameView,
+        meta: {
+          badgeType: 'dot',
+          icon: 'logos:element',
+          link: VBEN_ELE_PREVIEW_URL,
+          title: $t('demos.vben.element-plus'),
+        },
+      },
+    ],
+  },
+  {
+    name: 'VbenAbout',
+    path: '/vben-admin/about',
+    component: () => import('#/views/_core/about/index.vue'),
+    meta: {
+      icon: 'lucide:copyright',
+      title: $t('demos.vben.about'),
+      order: 9999,
+    },
+  },
+  {
+    name: 'Profile',
+    path: '/profile',
+    component: () => import('#/views/_core/profile/index.vue'),
+    meta: {
+      icon: 'lucide:user',
+      hideInMenu: true,
+      title: $t('page.auth.profile'),
+    },
+  },
+];
+
+export default routes;
diff --git a/apps/web-tdesign/src/store/auth.ts b/apps/web-tdesign/src/store/auth.ts
new file mode 100644
index 00000000..7f8d8f9b
--- /dev/null
+++ b/apps/web-tdesign/src/store/auth.ts
@@ -0,0 +1,116 @@
+import type { Recordable, UserInfo } from '@vben/types';
+
+import { ref } from 'vue';
+import { useRouter } from 'vue-router';
+
+import { LOGIN_PATH } from '@vben/constants';
+import { preferences } from '@vben/preferences';
+import { resetAllStores, useAccessStore, useUserStore } from '@vben/stores';
+
+import { defineStore } from 'pinia';
+
+import { notification } from '#/adapter/tdesign';
+import { getAccessCodesApi, getUserInfoApi, loginApi, logoutApi } from '#/api';
+import { $t } from '#/locales';
+
+export const useAuthStore = defineStore('auth', () => {
+  const accessStore = useAccessStore();
+  const userStore = useUserStore();
+  const router = useRouter();
+
+  const loginLoading = ref(false);
+
+  /**
+   * 异步处理登录操作
+   * Asynchronously handle the login process
+   * @param params 登录表单数据
+   */
+  async function authLogin(
+    params: Recordable<any>,
+    onSuccess?: () => Promise<void> | void,
+  ) {
+    // 异步处理用户登录操作并获取 accessToken
+    let userInfo: null | UserInfo = null;
+    try {
+      loginLoading.value = true;
+      const { accessToken } = await loginApi(params);
+
+      // 如果成功获取到 accessToken
+      if (accessToken) {
+        accessStore.setAccessToken(accessToken);
+        // 获取用户信息并存储到 accessStore 中
+        const [fetchUserInfoResult, accessCodes] = await Promise.all([
+          fetchUserInfo(),
+          getAccessCodesApi(),
+        ]);
+
+        userInfo = fetchUserInfoResult;
+
+        userStore.setUserInfo(userInfo);
+        accessStore.setAccessCodes(accessCodes);
+
+        if (accessStore.loginExpired) {
+          accessStore.setLoginExpired(false);
+        } else {
+          onSuccess
+            ? await onSuccess?.()
+            : await router.push(
+                userInfo.homePath || preferences.app.defaultHomePath,
+              );
+        }
+
+        if (userInfo?.realName) {
+          notification.success({
+            title: $t('authentication.loginSuccess'),
+            content: `${$t('authentication.loginSuccessDesc')}:${userInfo?.realName}`,
+            duration: 3000,
+          });
+        }
+      }
+    } finally {
+      loginLoading.value = false;
+    }
+
+    return {
+      userInfo,
+    };
+  }
+
+  async function logout(redirect: boolean = true) {
+    try {
+      await logoutApi();
+    } catch {
+      // 不做任何处理
+    }
+    resetAllStores();
+    accessStore.setLoginExpired(false);
+
+    // 回登录页带上当前路由地址
+    await router.replace({
+      path: LOGIN_PATH,
+      query: redirect
+        ? {
+            redirect: encodeURIComponent(router.currentRoute.value.fullPath),
+          }
+        : {},
+    });
+  }
+
+  async function fetchUserInfo() {
+    const userInfo = await getUserInfoApi();
+    userStore.setUserInfo(userInfo);
+    return userInfo;
+  }
+
+  function $reset() {
+    loginLoading.value = false;
+  }
+
+  return {
+    $reset,
+    authLogin,
+    fetchUserInfo,
+    loginLoading,
+    logout,
+  };
+});
diff --git a/apps/web-tdesign/src/store/index.ts b/apps/web-tdesign/src/store/index.ts
new file mode 100644
index 00000000..269586ee
--- /dev/null
+++ b/apps/web-tdesign/src/store/index.ts
@@ -0,0 +1 @@
+export * from './auth';
diff --git a/apps/web-tdesign/src/views/_core/README.md b/apps/web-tdesign/src/views/_core/README.md
new file mode 100644
index 00000000..8248afe6
--- /dev/null
+++ b/apps/web-tdesign/src/views/_core/README.md
@@ -0,0 +1,3 @@
+# \_core
+
+此目录包含应用程序正常运行所需的基本视图。这些视图是应用程序布局中使用的视图。
diff --git a/apps/web-tdesign/src/views/_core/about/index.vue b/apps/web-tdesign/src/views/_core/about/index.vue
new file mode 100644
index 00000000..0ee52433
--- /dev/null
+++ b/apps/web-tdesign/src/views/_core/about/index.vue
@@ -0,0 +1,9 @@
+<script lang="ts" setup>
+import { About } from '@vben/common-ui';
+
+defineOptions({ name: 'About' });
+</script>
+
+<template>
+  <About />
+</template>
diff --git a/apps/web-tdesign/src/views/_core/authentication/code-login.vue b/apps/web-tdesign/src/views/_core/authentication/code-login.vue
new file mode 100644
index 00000000..02370f7d
--- /dev/null
+++ b/apps/web-tdesign/src/views/_core/authentication/code-login.vue
@@ -0,0 +1,68 @@
+<script lang="ts" setup>
+import type { VbenFormSchema } from '@vben/common-ui';
+import type { Recordable } from '@vben/types';
+
+import { computed, ref } from 'vue';
+
+import { AuthenticationCodeLogin, z } from '@vben/common-ui';
+import { $t } from '@vben/locales';
+
+defineOptions({ name: 'CodeLogin' });
+
+const loading = ref(false);
+const CODE_LENGTH = 6;
+
+const formSchema = computed((): VbenFormSchema[] => {
+  return [
+    {
+      component: 'VbenInput',
+      componentProps: {
+        placeholder: $t('authentication.mobile'),
+      },
+      fieldName: 'phoneNumber',
+      label: $t('authentication.mobile'),
+      rules: z
+        .string()
+        .min(1, { message: $t('authentication.mobileTip') })
+        .refine((v) => /^\d{11}$/.test(v), {
+          message: $t('authentication.mobileErrortip'),
+        }),
+    },
+    {
+      component: 'VbenPinInput',
+      componentProps: {
+        codeLength: CODE_LENGTH,
+        createText: (countdown: number) => {
+          const text =
+            countdown > 0
+              ? $t('authentication.sendText', [countdown])
+              : $t('authentication.sendCode');
+          return text;
+        },
+        placeholder: $t('authentication.code'),
+      },
+      fieldName: 'code',
+      label: $t('authentication.code'),
+      rules: z.string().length(CODE_LENGTH, {
+        message: $t('authentication.codeTip', [CODE_LENGTH]),
+      }),
+    },
+  ];
+});
+/**
+ * 异步处理登录操作
+ * Asynchronously handle the login process
+ * @param values 登录表单数据
+ */
+async function handleLogin(values: Recordable<any>) {
+  void values;
+}
+</script>
+
+<template>
+  <AuthenticationCodeLogin
+    :form-schema="formSchema"
+    :loading="loading"
+    @submit="handleLogin"
+  />
+</template>
diff --git a/apps/web-tdesign/src/views/_core/authentication/forget-password.vue b/apps/web-tdesign/src/views/_core/authentication/forget-password.vue
new file mode 100644
index 00000000..10444d0a
--- /dev/null
+++ b/apps/web-tdesign/src/views/_core/authentication/forget-password.vue
@@ -0,0 +1,42 @@
+<script lang="ts" setup>
+import type { VbenFormSchema } from '@vben/common-ui';
+import type { Recordable } from '@vben/types';
+
+import { computed, ref } from 'vue';
+
+import { AuthenticationForgetPassword, z } from '@vben/common-ui';
+import { $t } from '@vben/locales';
+
+defineOptions({ name: 'ForgetPassword' });
+
+const loading = ref(false);
+
+const formSchema = computed((): VbenFormSchema[] => {
+  return [
+    {
+      component: 'VbenInput',
+      componentProps: {
+        placeholder: 'example@example.com',
+      },
+      fieldName: 'email',
+      label: $t('authentication.email'),
+      rules: z
+        .string()
+        .min(1, { message: $t('authentication.emailTip') })
+        .email($t('authentication.emailValidErrorTip')),
+    },
+  ];
+});
+
+function handleSubmit(value: Recordable<any>) {
+  void value;
+}
+</script>
+
+<template>
+  <AuthenticationForgetPassword
+    :form-schema="formSchema"
+    :loading="loading"
+    @submit="handleSubmit"
+  />
+</template>
diff --git a/apps/web-tdesign/src/views/_core/authentication/login.vue b/apps/web-tdesign/src/views/_core/authentication/login.vue
new file mode 100644
index 00000000..89af0c27
--- /dev/null
+++ b/apps/web-tdesign/src/views/_core/authentication/login.vue
@@ -0,0 +1,99 @@
+<script lang="ts" setup>
+import type { VbenFormSchema } from '@vben/common-ui';
+import type { BasicOption } from '@vben/types';
+
+import { computed, markRaw } from 'vue';
+
+import { AuthenticationLogin, SliderCaptcha, z } from '@vben/common-ui';
+import { $t } from '@vben/locales';
+
+import { useAuthStore } from '#/store';
+
+defineOptions({ name: 'Login' });
+
+const authStore = useAuthStore();
+
+const MOCK_USER_OPTIONS: BasicOption[] = [
+  {
+    label: 'Super',
+    value: 'vben',
+  },
+  {
+    label: 'Admin',
+    value: 'admin',
+  },
+  {
+    label: 'User',
+    value: 'jack',
+  },
+];
+
+const formSchema = computed((): VbenFormSchema[] => {
+  return [
+    {
+      component: 'VbenSelect',
+      componentProps: {
+        options: MOCK_USER_OPTIONS,
+        placeholder: $t('authentication.selectAccount'),
+      },
+      fieldName: 'selectAccount',
+      label: $t('authentication.selectAccount'),
+      rules: z
+        .string()
+        .min(1, { message: $t('authentication.selectAccount') })
+        .optional()
+        .default('vben'),
+    },
+    {
+      component: 'VbenInput',
+      componentProps: {
+        placeholder: $t('authentication.usernameTip'),
+      },
+      dependencies: {
+        trigger(values, form) {
+          if (values.selectAccount) {
+            const findUser = MOCK_USER_OPTIONS.find(
+              (item) => item.value === values.selectAccount,
+            );
+            if (findUser) {
+              form.setValues({
+                password: '123456',
+                username: findUser.value,
+              });
+            }
+          }
+        },
+        triggerFields: ['selectAccount'],
+      },
+      fieldName: 'username',
+      label: $t('authentication.username'),
+      rules: z.string().min(1, { message: $t('authentication.usernameTip') }),
+    },
+    {
+      component: 'VbenInputPassword',
+      componentProps: {
+        placeholder: $t('authentication.password'),
+      },
+      fieldName: 'password',
+      label: $t('authentication.password'),
+      rules: z.string().min(1, { message: $t('authentication.passwordTip') }),
+    },
+
+    {
+      component: markRaw(SliderCaptcha),
+      fieldName: 'captcha',
+      rules: z.boolean().refine((value) => value, {
+        message: $t('authentication.verifyRequiredTip'),
+      }),
+    },
+  ];
+});
+</script>
+
+<template>
+  <AuthenticationLogin
+    :form-schema="formSchema"
+    :loading="authStore.loginLoading"
+    @submit="authStore.authLogin"
+  />
+</template>
diff --git a/apps/web-tdesign/src/views/_core/authentication/qrcode-login.vue b/apps/web-tdesign/src/views/_core/authentication/qrcode-login.vue
new file mode 100644
index 00000000..23f5f2da
--- /dev/null
+++ b/apps/web-tdesign/src/views/_core/authentication/qrcode-login.vue
@@ -0,0 +1,10 @@
+<script lang="ts" setup>
+import { AuthenticationQrCodeLogin } from '@vben/common-ui';
+import { LOGIN_PATH } from '@vben/constants';
+
+defineOptions({ name: 'QrCodeLogin' });
+</script>
+
+<template>
+  <AuthenticationQrCodeLogin :login-path="LOGIN_PATH" />
+</template>
diff --git a/apps/web-tdesign/src/views/_core/authentication/register.vue b/apps/web-tdesign/src/views/_core/authentication/register.vue
new file mode 100644
index 00000000..6805d558
--- /dev/null
+++ b/apps/web-tdesign/src/views/_core/authentication/register.vue
@@ -0,0 +1,95 @@
+<script lang="ts" setup>
+import type { VbenFormSchema } from '@vben/common-ui';
+import type { Recordable } from '@vben/types';
+
+import { computed, h, ref } from 'vue';
+
+import { AuthenticationRegister, z } from '@vben/common-ui';
+import { $t } from '@vben/locales';
+
+defineOptions({ name: 'Register' });
+
+const loading = ref(false);
+
+const formSchema = computed((): VbenFormSchema[] => {
+  return [
+    {
+      component: 'VbenInput',
+      componentProps: {
+        placeholder: $t('authentication.usernameTip'),
+      },
+      fieldName: 'username',
+      label: $t('authentication.username'),
+      rules: z.string().min(1, { message: $t('authentication.usernameTip') }),
+    },
+    {
+      component: 'VbenInputPassword',
+      componentProps: {
+        passwordStrength: true,
+        placeholder: $t('authentication.password'),
+      },
+      fieldName: 'password',
+      label: $t('authentication.password'),
+      renderComponentContent() {
+        return {
+          strengthText: () => $t('authentication.passwordStrength'),
+        };
+      },
+      rules: z.string().min(1, { message: $t('authentication.passwordTip') }),
+    },
+    {
+      component: 'VbenInputPassword',
+      componentProps: {
+        placeholder: $t('authentication.confirmPassword'),
+      },
+      dependencies: {
+        rules(values) {
+          const { password } = values;
+          return z
+            .string({ error: $t('authentication.passwordTip') })
+            .min(1, { message: $t('authentication.passwordTip') })
+            .refine((value) => value === password, {
+              message: $t('authentication.confirmPasswordTip'),
+            });
+        },
+        triggerFields: ['password'],
+      },
+      fieldName: 'confirmPassword',
+      label: $t('authentication.confirmPassword'),
+    },
+    {
+      component: 'VbenCheckbox',
+      fieldName: 'agreePolicy',
+      renderComponentContent: () => ({
+        default: () =>
+          h('span', [
+            $t('authentication.agree'),
+            h(
+              'a',
+              {
+                class: 'vben-link ml-1 ',
+                href: '',
+              },
+              `${$t('authentication.privacyPolicy')} & ${$t('authentication.terms')}`,
+            ),
+          ]),
+      }),
+      rules: z.boolean().refine((value) => !!value, {
+        message: $t('authentication.agreeTip'),
+      }),
+    },
+  ];
+});
+
+async function handleSubmit(value: Recordable<any>) {
+  void value;
+}
+</script>
+
+<template>
+  <AuthenticationRegister
+    :form-schema="formSchema"
+    :loading="loading"
+    @submit="handleSubmit"
+  />
+</template>
diff --git a/apps/web-tdesign/src/views/_core/fallback/coming-soon.vue b/apps/web-tdesign/src/views/_core/fallback/coming-soon.vue
new file mode 100644
index 00000000..f394930f
--- /dev/null
+++ b/apps/web-tdesign/src/views/_core/fallback/coming-soon.vue
@@ -0,0 +1,7 @@
+<script lang="ts" setup>
+import { Fallback } from '@vben/common-ui';
+</script>
+
+<template>
+  <Fallback status="coming-soon" />
+</template>
diff --git a/apps/web-tdesign/src/views/_core/fallback/forbidden.vue b/apps/web-tdesign/src/views/_core/fallback/forbidden.vue
new file mode 100644
index 00000000..8ea65fed
--- /dev/null
+++ b/apps/web-tdesign/src/views/_core/fallback/forbidden.vue
@@ -0,0 +1,9 @@
+<script lang="ts" setup>
+import { Fallback } from '@vben/common-ui';
+
+defineOptions({ name: 'Fallback403Demo' });
+</script>
+
+<template>
+  <Fallback status="403" />
+</template>
diff --git a/apps/web-tdesign/src/views/_core/fallback/internal-error.vue b/apps/web-tdesign/src/views/_core/fallback/internal-error.vue
new file mode 100644
index 00000000..819a47d5
--- /dev/null
+++ b/apps/web-tdesign/src/views/_core/fallback/internal-error.vue
@@ -0,0 +1,9 @@
+<script lang="ts" setup>
+import { Fallback } from '@vben/common-ui';
+
+defineOptions({ name: 'Fallback500Demo' });
+</script>
+
+<template>
+  <Fallback status="500" />
+</template>
diff --git a/apps/web-tdesign/src/views/_core/fallback/not-found.vue b/apps/web-tdesign/src/views/_core/fallback/not-found.vue
new file mode 100644
index 00000000..4d178e9c
--- /dev/null
+++ b/apps/web-tdesign/src/views/_core/fallback/not-found.vue
@@ -0,0 +1,9 @@
+<script lang="ts" setup>
+import { Fallback } from '@vben/common-ui';
+
+defineOptions({ name: 'Fallback404Demo' });
+</script>
+
+<template>
+  <Fallback status="404" />
+</template>
diff --git a/apps/web-tdesign/src/views/_core/fallback/offline.vue b/apps/web-tdesign/src/views/_core/fallback/offline.vue
new file mode 100644
index 00000000..5de4a88d
--- /dev/null
+++ b/apps/web-tdesign/src/views/_core/fallback/offline.vue
@@ -0,0 +1,9 @@
+<script lang="ts" setup>
+import { Fallback } from '@vben/common-ui';
+
+defineOptions({ name: 'FallbackOfflineDemo' });
+</script>
+
+<template>
+  <Fallback status="offline" />
+</template>
diff --git a/apps/web-tdesign/src/views/_core/profile/base-setting.vue b/apps/web-tdesign/src/views/_core/profile/base-setting.vue
new file mode 100644
index 00000000..aa8a4c26
--- /dev/null
+++ b/apps/web-tdesign/src/views/_core/profile/base-setting.vue
@@ -0,0 +1,65 @@
+<script setup lang="ts">
+import type { BasicOption } from '@vben/types';
+
+import type { VbenFormSchema } from '#/adapter/form';
+
+import { computed, onMounted, ref } from 'vue';
+
+import { ProfileBaseSetting } from '@vben/common-ui';
+
+import { getUserInfoApi } from '#/api';
+
+const profileBaseSettingRef = ref();
+
+const MOCK_ROLES_OPTIONS: BasicOption[] = [
+  {
+    label: '管理员',
+    value: 'super',
+  },
+  {
+    label: '用户',
+    value: 'user',
+  },
+  {
+    label: '测试',
+    value: 'test',
+  },
+];
+
+const formSchema = computed((): VbenFormSchema[] => {
+  return [
+    {
+      fieldName: 'realName',
+      component: 'Input',
+      label: '姓名',
+    },
+    {
+      fieldName: 'username',
+      component: 'Input',
+      label: '用户名',
+    },
+    {
+      fieldName: 'roles',
+      component: 'Select',
+      componentProps: {
+        mode: 'tags',
+        options: MOCK_ROLES_OPTIONS,
+      },
+      label: '角色',
+    },
+    {
+      fieldName: 'introduction',
+      component: 'Textarea',
+      label: '个人简介',
+    },
+  ];
+});
+
+onMounted(async () => {
+  const data = await getUserInfoApi();
+  profileBaseSettingRef.value.getFormApi().setValues(data);
+});
+</script>
+<template>
+  <ProfileBaseSetting ref="profileBaseSettingRef" :form-schema="formSchema" />
+</template>
diff --git a/apps/web-tdesign/src/views/_core/profile/index.vue b/apps/web-tdesign/src/views/_core/profile/index.vue
new file mode 100644
index 00000000..8740894e
--- /dev/null
+++ b/apps/web-tdesign/src/views/_core/profile/index.vue
@@ -0,0 +1,49 @@
+<script setup lang="ts">
+import { ref } from 'vue';
+
+import { Profile } from '@vben/common-ui';
+import { useUserStore } from '@vben/stores';
+
+import ProfileBase from './base-setting.vue';
+import ProfileNotificationSetting from './notification-setting.vue';
+import ProfilePasswordSetting from './password-setting.vue';
+import ProfileSecuritySetting from './security-setting.vue';
+
+const userStore = useUserStore();
+
+const tabsValue = ref<string>('basic');
+
+const tabs = ref([
+  {
+    label: '基本设置',
+    value: 'basic',
+  },
+  {
+    label: '安全设置',
+    value: 'security',
+  },
+  {
+    label: '修改密码',
+    value: 'password',
+  },
+  {
+    label: '新消息提醒',
+    value: 'notice',
+  },
+]);
+</script>
+<template>
+  <Profile
+    v-model:model-value="tabsValue"
+    title="个人中心"
+    :user-info="userStore.userInfo"
+    :tabs="tabs"
+  >
+    <template #content>
+      <ProfileBase v-if="tabsValue === 'basic'" />
+      <ProfileSecuritySetting v-if="tabsValue === 'security'" />
+      <ProfilePasswordSetting v-if="tabsValue === 'password'" />
+      <ProfileNotificationSetting v-if="tabsValue === 'notice'" />
+    </template>
+  </Profile>
+</template>
diff --git a/apps/web-tdesign/src/views/_core/profile/notification-setting.vue b/apps/web-tdesign/src/views/_core/profile/notification-setting.vue
new file mode 100644
index 00000000..324a4b39
--- /dev/null
+++ b/apps/web-tdesign/src/views/_core/profile/notification-setting.vue
@@ -0,0 +1,31 @@
+<script setup lang="ts">
+import { computed } from 'vue';
+
+import { ProfileNotificationSetting } from '@vben/common-ui';
+
+const formSchema = computed(() => {
+  return [
+    {
+      value: true,
+      fieldName: 'accountPassword',
+      label: '账户密码',
+      description: '其他用户的消息将以站内信的形式通知',
+    },
+    {
+      value: true,
+      fieldName: 'systemMessage',
+      label: '系统消息',
+      description: '系统消息将以站内信的形式通知',
+    },
+    {
+      value: true,
+      fieldName: 'todoTask',
+      label: '待办任务',
+      description: '待办任务将以站内信的形式通知',
+    },
+  ];
+});
+</script>
+<template>
+  <ProfileNotificationSetting :form-schema="formSchema" />
+</template>
diff --git a/apps/web-tdesign/src/views/_core/profile/password-setting.vue b/apps/web-tdesign/src/views/_core/profile/password-setting.vue
new file mode 100644
index 00000000..eda3f3d4
--- /dev/null
+++ b/apps/web-tdesign/src/views/_core/profile/password-setting.vue
@@ -0,0 +1,63 @@
+<script setup lang="ts">
+import type { VbenFormSchema } from '#/adapter/form';
+
+import { computed } from 'vue';
+
+import { ProfilePasswordSetting, z } from '@vben/common-ui';
+
+import { message } from '#/adapter/tdesign';
+
+const formSchema = computed((): VbenFormSchema[] => {
+  return [
+    {
+      fieldName: 'oldPassword',
+      label: '旧密码',
+      component: 'VbenInputPassword',
+      componentProps: {
+        placeholder: '请输入旧密码',
+      },
+    },
+    {
+      fieldName: 'newPassword',
+      label: '新密码',
+      component: 'VbenInputPassword',
+      componentProps: {
+        passwordStrength: true,
+        placeholder: '请输入新密码',
+      },
+    },
+    {
+      fieldName: 'confirmPassword',
+      label: '确认密码',
+      component: 'VbenInputPassword',
+      componentProps: {
+        passwordStrength: true,
+        placeholder: '请再次输入新密码',
+      },
+      dependencies: {
+        rules(values) {
+          const { newPassword } = values;
+          return z
+            .string({ error: '请再次输入新密码' })
+            .min(1, { message: '请再次输入新密码' })
+            .refine((value) => value === newPassword, {
+              message: '两次输入的密码不一致',
+            });
+        },
+        triggerFields: ['newPassword'],
+      },
+    },
+  ];
+});
+
+function handleSubmit() {
+  message.success('密码修改成功');
+}
+</script>
+<template>
+  <ProfilePasswordSetting
+    class="w-1/3"
+    :form-schema="formSchema"
+    @submit="handleSubmit"
+  />
+</template>
diff --git a/apps/web-tdesign/src/views/_core/profile/security-setting.vue b/apps/web-tdesign/src/views/_core/profile/security-setting.vue
new file mode 100644
index 00000000..be30db58
--- /dev/null
+++ b/apps/web-tdesign/src/views/_core/profile/security-setting.vue
@@ -0,0 +1,43 @@
+<script setup lang="ts">
+import { computed } from 'vue';
+
+import { ProfileSecuritySetting } from '@vben/common-ui';
+
+const formSchema = computed(() => {
+  return [
+    {
+      value: true,
+      fieldName: 'accountPassword',
+      label: '账户密码',
+      description: '当前密码强度：强',
+    },
+    {
+      value: true,
+      fieldName: 'securityPhone',
+      label: '密保手机',
+      description: '已绑定手机：138****8293',
+    },
+    {
+      value: true,
+      fieldName: 'securityQuestion',
+      label: '密保问题',
+      description: '未设置密保问题，密保问题可有效保护账户安全',
+    },
+    {
+      value: true,
+      fieldName: 'securityEmail',
+      label: '备用邮箱',
+      description: '已绑定邮箱：ant***sign.com',
+    },
+    {
+      value: false,
+      fieldName: 'securityMfa',
+      label: 'MFA 设备',
+      description: '未绑定 MFA 设备，绑定后，可以进行二次确认',
+    },
+  ];
+});
+</script>
+<template>
+  <ProfileSecuritySetting :form-schema="formSchema" />
+</template>
diff --git a/apps/web-tdesign/src/views/dashboard/analytics/analytics-trends.vue b/apps/web-tdesign/src/views/dashboard/analytics/analytics-trends.vue
new file mode 100644
index 00000000..f1f0b232
--- /dev/null
+++ b/apps/web-tdesign/src/views/dashboard/analytics/analytics-trends.vue
@@ -0,0 +1,98 @@
+<script lang="ts" setup>
+import type { EchartsUIType } from '@vben/plugins/echarts';
+
+import { onMounted, ref } from 'vue';
+
+import { EchartsUI, useEcharts } from '@vben/plugins/echarts';
+
+const chartRef = ref<EchartsUIType>();
+const { renderEcharts } = useEcharts(chartRef);
+
+onMounted(() => {
+  renderEcharts({
+    grid: {
+      bottom: 0,
+      containLabel: true,
+      left: '1%',
+      right: '1%',
+      top: '2 %',
+    },
+    series: [
+      {
+        areaStyle: {},
+        data: [
+          111, 2000, 6000, 16_000, 33_333, 55_555, 64_000, 33_333, 18_000,
+          36_000, 70_000, 42_444, 23_222, 13_000, 8000, 4000, 1200, 333, 222,
+          111,
+        ],
+        itemStyle: {
+          color: '#5ab1ef',
+        },
+        smooth: true,
+        type: 'line',
+      },
+      {
+        areaStyle: {},
+        data: [
+          33, 66, 88, 333, 3333, 6200, 20_000, 3000, 1200, 13_000, 22_000,
+          11_000, 2221, 1201, 390, 198, 60, 30, 22, 11,
+        ],
+        itemStyle: {
+          color: '#019680',
+        },
+        smooth: true,
+        type: 'line',
+      },
+    ],
+    tooltip: {
+      axisPointer: {
+        lineStyle: {
+          color: '#019680',
+          width: 1,
+        },
+      },
+      trigger: 'axis',
+    },
+    // xAxis: {
+    //   axisTick: {
+    //     show: false,
+    //   },
+    //   boundaryGap: false,
+    //   data: Array.from({ length: 18 }).map((_item, index) => `${index + 6}:00`),
+    //   type: 'category',
+    // },
+    xAxis: {
+      axisTick: {
+        show: false,
+      },
+      boundaryGap: false,
+      data: Array.from({ length: 18 }).map((_item, index) => `${index + 6}:00`),
+      splitLine: {
+        lineStyle: {
+          type: 'solid',
+          width: 1,
+        },
+        show: true,
+      },
+      type: 'category',
+    },
+    yAxis: [
+      {
+        axisTick: {
+          show: false,
+        },
+        max: 80_000,
+        splitArea: {
+          show: true,
+        },
+        splitNumber: 4,
+        type: 'value',
+      },
+    ],
+  });
+});
+</script>
+
+<template>
+  <EchartsUI ref="chartRef" />
+</template>
diff --git a/apps/web-tdesign/src/views/dashboard/analytics/analytics-visits-data.vue b/apps/web-tdesign/src/views/dashboard/analytics/analytics-visits-data.vue
new file mode 100644
index 00000000..190fb41f
--- /dev/null
+++ b/apps/web-tdesign/src/views/dashboard/analytics/analytics-visits-data.vue
@@ -0,0 +1,82 @@
+<script lang="ts" setup>
+import type { EchartsUIType } from '@vben/plugins/echarts';
+
+import { onMounted, ref } from 'vue';
+
+import { EchartsUI, useEcharts } from '@vben/plugins/echarts';
+
+const chartRef = ref<EchartsUIType>();
+const { renderEcharts } = useEcharts(chartRef);
+
+onMounted(() => {
+  renderEcharts({
+    legend: {
+      bottom: 0,
+      data: ['访问', '趋势'],
+    },
+    radar: {
+      indicator: [
+        {
+          name: '网页',
+        },
+        {
+          name: '移动端',
+        },
+        {
+          name: 'Ipad',
+        },
+        {
+          name: '客户端',
+        },
+        {
+          name: '第三方',
+        },
+        {
+          name: '其它',
+        },
+      ],
+      radius: '60%',
+      splitNumber: 8,
+    },
+    series: [
+      {
+        areaStyle: {
+          opacity: 1,
+          shadowBlur: 0,
+          shadowColor: 'rgba(0,0,0,.2)',
+          shadowOffsetX: 0,
+          shadowOffsetY: 10,
+        },
+        data: [
+          {
+            itemStyle: {
+              color: '#b6a2de',
+            },
+            name: '访问',
+            value: [90, 50, 86, 40, 50, 20],
+          },
+          {
+            itemStyle: {
+              color: '#5ab1ef',
+            },
+            name: '趋势',
+            value: [70, 75, 70, 76, 20, 85],
+          },
+        ],
+        itemStyle: {
+          // borderColor: '#fff',
+          borderRadius: 10,
+          borderWidth: 2,
+        },
+        symbolSize: 0,
+        type: 'radar',
+      },
+    ],
+    tooltip: {},
+  });
+});
+</script>
+
+<template>
+  <EchartsUI ref="chartRef" />
+</template>
diff --git a/apps/web-tdesign/src/views/dashboard/analytics/analytics-visits-sales.vue b/apps/web-tdesign/src/views/dashboard/analytics/analytics-visits-sales.vue
new file mode 100644
index 00000000..6ff52086
--- /dev/null
+++ b/apps/web-tdesign/src/views/dashboard/analytics/analytics-visits-sales.vue
@@ -0,0 +1,46 @@
+<script lang="ts" setup>
+import type { EchartsUIType } from '@vben/plugins/echarts';
+
+import { onMounted, ref } from 'vue';
+
+import { EchartsUI, useEcharts } from '@vben/plugins/echarts';
+
+const chartRef = ref<EchartsUIType>();
+const { renderEcharts } = useEcharts(chartRef);
+
+onMounted(() => {
+  renderEcharts({
+    series: [
+      {
+        animationDelay() {
+          return Math.random() * 400;
+        },
+        animationEasing: 'exponentialInOut',
+        animationType: 'scale',
+        center: ['50%', '50%'],
+        color: ['#5ab1ef', '#b6a2de', '#67e0e3', '#2ec7c9'],
+        data: [
+          { name: '外包', value: 500 },
+          { name: '定制', value: 310 },
+          { name: '技术支持', value: 274 },
+          { name: '远程', value: 400 },
+        ].toSorted((a, b) => {
+          return a.value - b.value;
+        }),
+        name: '商业占比',
+        radius: '80%',
+        roseType: 'radius',
+        type: 'pie',
+      },
+    ],
+
+    tooltip: {
+      trigger: 'item',
+    },
+  });
+});
+</script>
+
+<template>
+  <EchartsUI ref="chartRef" />
+</template>
diff --git a/apps/web-tdesign/src/views/dashboard/analytics/analytics-visits-source.vue b/apps/web-tdesign/src/views/dashboard/analytics/analytics-visits-source.vue
new file mode 100644
index 00000000..0915c7af
--- /dev/null
+++ b/apps/web-tdesign/src/views/dashboard/analytics/analytics-visits-source.vue
@@ -0,0 +1,65 @@
+<script lang="ts" setup>
+import type { EchartsUIType } from '@vben/plugins/echarts';
+
+import { onMounted, ref } from 'vue';
+
+import { EchartsUI, useEcharts } from '@vben/plugins/echarts';
+
+const chartRef = ref<EchartsUIType>();
+const { renderEcharts } = useEcharts(chartRef);
+
+onMounted(() => {
+  renderEcharts({
+    legend: {
+      bottom: '2%',
+      left: 'center',
+    },
+    series: [
+      {
+        animationDelay() {
+          return Math.random() * 100;
+        },
+        animationEasing: 'exponentialInOut',
+        animationType: 'scale',
+        avoidLabelOverlap: false,
+        color: ['#5ab1ef', '#b6a2de', '#67e0e3', '#2ec7c9'],
+        data: [
+          { name: '搜索引擎', value: 1048 },
+          { name: '直接访问', value: 735 },
+          { name: '邮件营销', value: 580 },
+          { name: '联盟广告', value: 484 },
+        ],
+        emphasis: {
+          label: {
+            fontSize: '12',
+            fontWeight: 'bold',
+            show: true,
+          },
+        },
+        itemStyle: {
+          // borderColor: '#fff',
+          borderRadius: 10,
+          borderWidth: 2,
+        },
+        label: {
+          position: 'center',
+          show: false,
+        },
+        labelLine: {
+          show: false,
+        },
+        name: '访问来源',
+        radius: ['40%', '65%'],
+        type: 'pie',
+      },
+    ],
+    tooltip: {
+      trigger: 'item',
+    },
+  });
+});
+</script>
+
+<template>
+  <EchartsUI ref="chartRef" />
+</template>
diff --git a/apps/web-tdesign/src/views/dashboard/analytics/analytics-visits.vue b/apps/web-tdesign/src/views/dashboard/analytics/analytics-visits.vue
new file mode 100644
index 00000000..7e0f1013
--- /dev/null
+++ b/apps/web-tdesign/src/views/dashboard/analytics/analytics-visits.vue
@@ -0,0 +1,55 @@
+<script lang="ts" setup>
+import type { EchartsUIType } from '@vben/plugins/echarts';
+
+import { onMounted, ref } from 'vue';
+
+import { EchartsUI, useEcharts } from '@vben/plugins/echarts';
+
+const chartRef = ref<EchartsUIType>();
+const { renderEcharts } = useEcharts(chartRef);
+
+onMounted(() => {
+  renderEcharts({
+    grid: {
+      bottom: 0,
+      containLabel: true,
+      left: '1%',
+      right: '1%',
+      top: '2 %',
+    },
+    series: [
+      {
+        barMaxWidth: 80,
+        // color: '#4f69fd',
+        data: [
+          3000, 2000, 3333, 5000, 3200, 4200, 3200, 2100, 3000, 5100, 6000,
+          3200, 4800,
+        ],
+        type: 'bar',
+      },
+    ],
+    tooltip: {
+      axisPointer: {
+        lineStyle: {
+          // color: '#4f69fd',
+          width: 1,
+        },
+      },
+      trigger: 'axis',
+    },
+    xAxis: {
+      data: Array.from({ length: 12 }).map((_item, index) => `${index + 1}月`),
+      type: 'category',
+    },
+    yAxis: {
+      max: 8000,
+      splitNumber: 4,
+      type: 'value',
+    },
+  });
+});
+</script>
+
+<template>
+  <EchartsUI ref="chartRef" />
+</template>
diff --git a/apps/web-tdesign/src/views/dashboard/analytics/index.vue b/apps/web-tdesign/src/views/dashboard/analytics/index.vue
new file mode 100644
index 00000000..e794c99a
--- /dev/null
+++ b/apps/web-tdesign/src/views/dashboard/analytics/index.vue
@@ -0,0 +1,90 @@
+<script lang="ts" setup>
+import type { AnalysisOverviewItem } from '@vben/common-ui';
+import type { TabOption } from '@vben/types';
+
+import {
+  AnalysisChartCard,
+  AnalysisChartsTabs,
+  AnalysisOverview,
+} from '@vben/common-ui';
+import {
+  SvgBellIcon,
+  SvgCakeIcon,
+  SvgCardIcon,
+  SvgDownloadIcon,
+} from '@vben/icons';
+
+import AnalyticsTrends from './analytics-trends.vue';
+import AnalyticsVisitsData from './analytics-visits-data.vue';
+import AnalyticsVisitsSales from './analytics-visits-sales.vue';
+import AnalyticsVisitsSource from './analytics-visits-source.vue';
+import AnalyticsVisits from './analytics-visits.vue';
+
+const overviewItems: AnalysisOverviewItem[] = [
+  {
+    icon: SvgCardIcon,
+    title: '用户量',
+    totalTitle: '总用户量',
+    totalValue: 120_000,
+    value: 2000,
+  },
+  {
+    icon: SvgCakeIcon,
+    title: '访问量',
+    totalTitle: '总访问量',
+    totalValue: 500_000,
+    value: 20_000,
+  },
+  {
+    icon: SvgDownloadIcon,
+    title: '下载量',
+    totalTitle: '总下载量',
+    totalValue: 120_000,
+    value: 8000,
+  },
+  {
+    icon: SvgBellIcon,
+    title: '使用量',
+    totalTitle: '总使用量',
+    totalValue: 50_000,
+    value: 5000,
+  },
+];
+
+const chartTabs: TabOption[] = [
+  {
+    label: '流量趋势',
+    value: 'trends',
+  },
+  {
+    label: '月访问量',
+    value: 'visits',
+  },
+];
+</script>
+
+<template>
+  <div class="p-5">
+    <AnalysisOverview :items="overviewItems" />
+    <AnalysisChartsTabs :tabs="chartTabs" class="mt-5">
+      <template #trends>
+        <AnalyticsTrends />
+      </template>
+      <template #visits>
+        <AnalyticsVisits />
+      </template>
+    </AnalysisChartsTabs>
+
+    <div class="mt-5 w-full md:flex">
+      <AnalysisChartCard class="mt-5 md:mt-0 md:mr-4 md:w-1/3" title="访问数量">
+        <AnalyticsVisitsData />
+      </AnalysisChartCard>
+      <AnalysisChartCard class="mt-5 md:mt-0 md:mr-4 md:w-1/3" title="访问来源">
+        <AnalyticsVisitsSource />
+      </AnalysisChartCard>
+      <AnalysisChartCard class="mt-5 md:mt-0 md:w-1/3" title="访问来源">
+        <AnalyticsVisitsSales />
+      </AnalysisChartCard>
+    </div>
+  </div>
+</template>
diff --git a/apps/web-tdesign/src/views/dashboard/workspace/index.vue b/apps/web-tdesign/src/views/dashboard/workspace/index.vue
new file mode 100644
index 00000000..b95d6138
--- /dev/null
+++ b/apps/web-tdesign/src/views/dashboard/workspace/index.vue
@@ -0,0 +1,266 @@
+<script lang="ts" setup>
+import type {
+  WorkbenchProjectItem,
+  WorkbenchQuickNavItem,
+  WorkbenchTodoItem,
+  WorkbenchTrendItem,
+} from '@vben/common-ui';
+
+import { ref } from 'vue';
+import { useRouter } from 'vue-router';
+
+import {
+  AnalysisChartCard,
+  WorkbenchHeader,
+  WorkbenchProject,
+  WorkbenchQuickNav,
+  WorkbenchTodo,
+  WorkbenchTrends,
+} from '@vben/common-ui';
+import { preferences } from '@vben/preferences';
+import { useUserStore } from '@vben/stores';
+import { openWindow } from '@vben/utils';
+
+import AnalyticsVisitsSource from '../analytics/analytics-visits-source.vue';
+
+const userStore = useUserStore();
+
+// 这是一个示例数据，实际项目中需要根据实际情况进行调整
+// url 也可以是内部路由，在 navTo 方法中识别处理，进行内部跳转
+// 例如：url: /dashboard/workspace
+const projectItems: WorkbenchProjectItem[] = [
+  {
+    color: '',
+    content: '不要等待机会，而要创造机会。',
+    date: '2021-04-01',
+    group: '开源组',
+    icon: 'carbon:logo-github',
+    title: 'Github',
+    url: 'https://github.com',
+  },
+  {
+    color: '#3fb27f',
+    content: '现在的你决定将来的你。',
+    date: '2021-04-01',
+    group: '算法组',
+    icon: 'ion:logo-vue',
+    title: 'Vue',
+    url: 'https://vuejs.org',
+  },
+  {
+    color: '#e18525',
+    content: '没有什么才能比努力更重要。',
+    date: '2021-04-01',
+    group: '上班摸鱼',
+    icon: 'ion:logo-html5',
+    title: 'Html5',
+    url: 'https://developer.mozilla.org/zh-CN/docs/Web/HTML',
+  },
+  {
+    color: '#bf0c2c',
+    content: '热情和欲望可以突破一切难关。',
+    date: '2021-04-01',
+    group: 'UI',
+    icon: 'ion:logo-angular',
+    title: 'Angular',
+    url: 'https://angular.io',
+  },
+  {
+    color: '#00d8ff',
+    content: '健康的身体是实现目标的基石。',
+    date: '2021-04-01',
+    group: '技术牛',
+    icon: 'bx:bxl-react',
+    title: 'React',
+    url: 'https://reactjs.org',
+  },
+  {
+    color: '#EBD94E',
+    content: '路是走出来的，而不是空想出来的。',
+    date: '2021-04-01',
+    group: '架构组',
+    icon: 'ion:logo-javascript',
+    title: 'Js',
+    url: 'https://developer.mozilla.org/zh-CN/docs/Web/JavaScript',
+  },
+];
+
+// 同样，这里的 url 也可以使用以 http 开头的外部链接
+const quickNavItems: WorkbenchQuickNavItem[] = [
+  {
+    color: '#1fdaca',
+    icon: 'ion:home-outline',
+    title: '首页',
+    url: '/',
+  },
+  {
+    color: '#bf0c2c',
+    icon: 'ion:grid-outline',
+    title: '仪表盘',
+    url: '/dashboard',
+  },
+  {
+    color: '#e18525',
+    icon: 'ion:layers-outline',
+    title: '组件',
+    url: '/demos/features/icons',
+  },
+  {
+    color: '#3fb27f',
+    icon: 'ion:settings-outline',
+    title: '系统管理',
+    url: '/demos/features/login-expired', // 这里的 URL 是示例，实际项目中需要根据实际情况进行调整
+  },
+  {
+    color: '#4daf1bc9',
+    icon: 'ion:key-outline',
+    title: '权限管理',
+    url: '/demos/access/page-control',
+  },
+  {
+    color: '#00d8ff',
+    icon: 'ion:bar-chart-outline',
+    title: '图表',
+    url: '/analytics',
+  },
+];
+
+const todoItems = ref<WorkbenchTodoItem[]>([
+  {
+    completed: false,
+    content: `审查最近提交到Git仓库的前端代码，确保代码质量和规范。`,
+    date: '2024-07-30 11:00:00',
+    title: '审查前端代码提交',
+  },
+  {
+    completed: true,
+    content: `检查并优化系统性能，降低CPU使用率。`,
+    date: '2024-07-30 11:00:00',
+    title: '系统性能优化',
+  },
+  {
+    completed: false,
+    content: `进行系统安全检查，确保没有安全漏洞或未授权的访问。 `,
+    date: '2024-07-30 11:00:00',
+    title: '安全检查',
+  },
+  {
+    completed: false,
+    content: `更新项目中的所有npm依赖包，确保使用最新版本。`,
+    date: '2024-07-30 11:00:00',
+    title: '更新项目依赖',
+  },
+  {
+    completed: false,
+    content: `修复用户报告的页面UI显示问题，确保在不同浏览器中显示一致。 `,
+    date: '2024-07-30 11:00:00',
+    title: '修复UI显示问题',
+  },
+]);
+const trendItems: WorkbenchTrendItem[] = [
+  {
+    avatar: 'svg:avatar-1',
+    content: `在 <a>开源组</a> 创建了项目 <a>Vue</a>`,
+    date: '刚刚',
+    title: '威廉',
+  },
+  {
+    avatar: 'svg:avatar-2',
+    content: `关注了 <a>威廉</a> `,
+    date: '1个小时前',
+    title: '艾文',
+  },
+  {
+    avatar: 'svg:avatar-3',
+    content: `发布了 <a>个人动态</a> `,
+    date: '1天前',
+    title: '克里斯',
+  },
+  {
+    avatar: 'svg:avatar-4',
+    content: `发表文章 <a>如何编写一个Vite插件</a> `,
+    date: '2天前',
+    title: 'Vben',
+  },
+  {
+    avatar: 'svg:avatar-1',
+    content: `回复了 <a>杰克</a> 的问题 <a>如何进行项目优化？</a>`,
+    date: '3天前',
+    title: '皮特',
+  },
+  {
+    avatar: 'svg:avatar-2',
+    content: `关闭了问题 <a>如何运行项目</a> `,
+    date: '1周前',
+    title: '杰克',
+  },
+  {
+    avatar: 'svg:avatar-3',
+    content: `发布了 <a>个人动态</a> `,
+    date: '1周前',
+    title: '威廉',
+  },
+  {
+    avatar: 'svg:avatar-4',
+    content: `推送了代码到 <a>Github</a>`,
+    date: '2021-04-01 20:00',
+    title: '威廉',
+  },
+  {
+    avatar: 'svg:avatar-4',
+    content: `发表文章 <a>如何编写使用 Admin Vben</a> `,
+    date: '2021-03-01 20:00',
+    title: 'Vben',
+  },
+];
+
+const router = useRouter();
+
+// 这是一个示例方法，实际项目中需要根据实际情况进行调整
+// This is a sample method, adjust according to the actual project requirements
+function navTo(nav: WorkbenchProjectItem | WorkbenchQuickNavItem) {
+  if (nav.url?.startsWith('http')) {
+    openWindow(nav.url);
+    return;
+  }
+  if (nav.url?.startsWith('/')) {
+    router.push(nav.url).catch((error) => {
+      console.error('Navigation failed:', error);
+    });
+  } else {
+    console.warn(`Unknown URL for navigation item: ${nav.title} -> ${nav.url}`);
+  }
+}
+</script>
+
+<template>
+  <div class="p-5">
+    <WorkbenchHeader
+      :avatar="userStore.userInfo?.avatar || preferences.app.defaultAvatar"
+    >
+      <template #title>
+        早安, {{ userStore.userInfo?.realName }}, 开始您一天的工作吧！
+      </template>
+      <template #description> 今日晴，20℃ - 32℃！ </template>
+    </WorkbenchHeader>
+
+    <div class="mt-5 flex flex-col lg:flex-row">
+      <div class="mr-4 w-full lg:w-3/5">
+        <WorkbenchProject :items="projectItems" title="项目" @click="navTo" />
+        <WorkbenchTrends :items="trendItems" class="mt-5" title="最新动态" />
+      </div>
+      <div class="w-full lg:w-2/5">
+        <WorkbenchQuickNav
+          :items="quickNavItems"
+          class="mt-5 lg:mt-0"
+          title="快捷导航"
+          @click="navTo"
+        />
+        <WorkbenchTodo :items="todoItems" class="mt-5" title="待办事项" />
+        <AnalysisChartCard class="mt-5" title="访问来源">
+          <AnalyticsVisitsSource />
+        </AnalysisChartCard>
+      </div>
+    </div>
+  </div>
+</template>
diff --git a/apps/web-tdesign/src/views/demos/tdesign/index.vue b/apps/web-tdesign/src/views/demos/tdesign/index.vue
new file mode 100644
index 00000000..f6342ae3
--- /dev/null
+++ b/apps/web-tdesign/src/views/demos/tdesign/index.vue
@@ -0,0 +1,67 @@
+<script lang="ts" setup>
+import { Page } from '@vben/common-ui';
+
+import { Button, Card, Space } from 'tdesign-vue-next';
+
+import { message, notification } from '#/adapter/tdesign';
+
+type NotificationType = 'error' | 'info' | 'success' | 'warning';
+
+function info() {
+  message.info('How many roads must a man walk down');
+}
+
+function error() {
+  message.error({
+    content: 'Once upon a time you dressed so fine',
+    duration: 2500,
+  });
+}
+
+function warning() {
+  message.warning('How many roads must a man walk down');
+}
+function success() {
+  message.success('Cause you walked hand in hand With another man in my place');
+}
+
+function notify(type: NotificationType) {
+  notification[type]({
+    duration: 2500,
+    title: '说点啥呢',
+  });
+}
+</script>
+
+<template>
+  <Page
+    description="支持多语言，主题功能集成切换等"
+    title="TDesign Vue组件使用演示"
+  >
+    <Card class="mb-5!" title="按钮">
+      <Space>
+        <Button>Default</Button>
+        <Button theme="primary"> Primary </Button>
+        <Button theme="default"> Info </Button>
+        <Button theme="danger"> Error </Button>
+      </Space>
+    </Card>
+    <Card class="mb-5!" title="Message">
+      <Space>
+        <Button @click="info"> 信息 </Button>
+        <Button theme="danger" @click="error"> 错误 </Button>
+        <Button @click="warning"> 警告 </Button>
+        <Button @click="success"> 成功 </Button>
+      </Space>
+    </Card>
+
+    <Card class="mb-5!" title="Notification">
+      <Space>
+        <Button @click="notify('info')"> 信息 </Button>
+        <Button theme="danger" @click="notify('error')"> 错误 </Button>
+        <Button @click="notify('warning')"> 警告 </Button>
+        <Button @click="notify('success')"> 成功 </Button>
+      </Space>
+    </Card>
+  </Page>
+</template>
diff --git a/apps/web-tdesign/tsconfig.json b/apps/web-tdesign/tsconfig.json
new file mode 100644
index 00000000..858a0ec0
--- /dev/null
+++ b/apps/web-tdesign/tsconfig.json
@@ -0,0 +1,11 @@
+{
+  "$schema": "https://json.schemastore.org/tsconfig",
+  "extends": "@vben/tsconfig/web-app.json",
+  "compilerOptions": {
+    "paths": {
+      "#/*": ["./src/*"]
+    }
+  },
+  "references": [{ "path": "./tsconfig.node.json" }],
+  "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.vue"]
+}
diff --git a/apps/web-tdesign/tsconfig.node.json b/apps/web-tdesign/tsconfig.node.json
new file mode 100644
index 00000000..36e9fb5f
--- /dev/null
+++ b/apps/web-tdesign/tsconfig.node.json
@@ -0,0 +1,10 @@
+{
+  "$schema": "https://json.schemastore.org/tsconfig",
+  "extends": "@vben/tsconfig/node.json",
+  "compilerOptions": {
+    "composite": true,
+    "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.node.tsbuildinfo",
+    "noEmit": false
+  },
+  "include": ["vite.config.ts"]
+}
diff --git a/apps/web-tdesign/vite.config.ts b/apps/web-tdesign/vite.config.ts
new file mode 100644
index 00000000..c79ec9a4
--- /dev/null
+++ b/apps/web-tdesign/vite.config.ts
@@ -0,0 +1,27 @@
+import { defineConfig, viteCssLayerPlugin } from '@vben/vite-config';
+
+export default defineConfig(async () => {
+  return {
+    application: {},
+    vite: {
+      plugins: [
+        // tdesign 的 css 包进 @layer td，使 Tailwind 工具类可覆盖组件样式
+        viteCssLayerPlugin({
+          layerName: 'td',
+          packageName: 'tdesign-vue-next',
+        }),
+      ],
+      server: {
+        proxy: {
+          '/api': {
+            changeOrigin: true,
+            rewrite: (path) => path.replace(/^\/api/, ''),
+            // mock代理目标地址
+            target: 'http://localhost:5320/api',
+            ws: true,
+          },
+        },
+      },
+    },
+  };
+});
diff --git a/cspell.json b/cspell.json
index 89545b43..982392e1 100644
--- a/cspell.json
+++ b/cspell.json
@@ -7,40 +7,64 @@
     "acmr",
     "antd",
     "antdv",
+    "archiver",
     "astro",
+    "axios",
     "brotli",
+    "cascader",
+    "chatcmpl",
     "clsx",
+    "dedup",
     "defu",
     "demi",
+    "dotenv",
+    "echart",
     "echarts",
     "ependencies",
+    "esbuild",
     "esno",
     "etag",
     "execa",
     "iconify",
     "iconoir",
+    "indexeddb",
     "intlify",
+    "isequal",
+    "jspm",
     "lockb",
     "lucide",
     "minh",
     "minw",
     "mkdist",
     "mockjs",
+    "myapp",
     "naiveui",
+    "napi",
     "nocheck",
+    "nolebase",
     "noopener",
     "noreferrer",
     "nprogress",
     "nuxt",
+    "organisation",
+    "oxfmt",
+    "oxlint",
     "pinia",
     "prefixs",
     "publint",
     "qrcode",
+    "reka",
+    "rollup",
     "shadcn",
     "sonner",
     "sortablejs",
     "styl",
+    "tabler",
     "taze",
+    "tdesign",
+    "tsdown",
+    "tsgolint",
+    "turborepo",
     "ui-kit",
     "uicons",
     "unplugin",
@@ -50,19 +74,20 @@
     "vite",
     "vitejs",
     "vitepress",
+    "vitest",
     "vnode",
     "vueuse",
     "yxxx"
   ],
   "ignorePaths": [
-    "**/node_modules/**",
-    "**/dist/**",
     "**/*-dist/**",
-    "**/icons/**",
-    "pnpm-lock.yaml",
     "**/*.log",
-    "**/*.test.ts",
     "**/*.spec.ts",
-    "**/__tests__/**"
+    "**/*.test.ts",
+    "**/__tests__/**",
+    "**/dist/**",
+    "**/icons/**",
+    "**/node_modules/**",
+    "pnpm-lock.yaml"
   ]
 }
diff --git a/design-system/xk-admin/MASTER.md b/design-system/xk-admin/MASTER.md
new file mode 100644
index 00000000..9e70343c
--- /dev/null
+++ b/design-system/xk-admin/MASTER.md
@@ -0,0 +1,206 @@
+# Design System Master File
+
+> **LOGIC:** When building a specific page, first check `design-system/pages/[page-name].md`.
+> If that file exists, its rules **override** this Master file.
+> If not, strictly follow the rules below.
+
+---
+
+**Project:** XK Admin
+**Generated:** 2026-08-11 14:59:17
+**Category:** Financial Dashboard
+
+---
+
+## Global Rules
+
+### Color Palette
+
+| Role | Hex | CSS Variable |
+|------|-----|--------------|
+| Primary | `#0F172A` | `--color-primary` |
+| Secondary | `#1E293B` | `--color-secondary` |
+| CTA/Accent | `#22C55E` | `--color-cta` |
+| Background | `#020617` | `--color-background` |
+| Text | `#F8FAFC` | `--color-text` |
+
+**Color Notes:** Dark bg + green positive indicators
+
+### Typography
+
+- **Heading Font:** Fira Code
+- **Body Font:** Fira Sans
+- **Mood:** dashboard, data, analytics, code, technical, precise
+- **Google Fonts:** [Fira Code + Fira Sans](https://fonts.google.com/share?selection.family=Fira+Code:wght@400;500;600;700|Fira+Sans:wght@300;400;500;600;700)
+
+**CSS Import:**
+```css
+@import url('https://fonts.googleapis.com/css2?family=Fira+Code:wght@400;500;600;700&family=Fira+Sans:wght@300;400;500;600;700&display=swap');
+```
+
+### Spacing Variables
+
+| Token | Value | Usage |
+|-------|-------|-------|
+| `--space-xs` | `4px` / `0.25rem` | Tight gaps |
+| `--space-sm` | `8px` / `0.5rem` | Icon gaps, inline spacing |
+| `--space-md` | `16px` / `1rem` | Standard padding |
+| `--space-lg` | `24px` / `1.5rem` | Section padding |
+| `--space-xl` | `32px` / `2rem` | Large gaps |
+| `--space-2xl` | `48px` / `3rem` | Section margins |
+| `--space-3xl` | `64px` / `4rem` | Hero padding |
+
+### Shadow Depths
+
+| Level | Value | Usage |
+|-------|-------|-------|
+| `--shadow-sm` | `0 1px 2px rgba(0,0,0,0.05)` | Subtle lift |
+| `--shadow-md` | `0 4px 6px rgba(0,0,0,0.1)` | Cards, buttons |
+| `--shadow-lg` | `0 10px 15px rgba(0,0,0,0.1)` | Modals, dropdowns |
+| `--shadow-xl` | `0 20px 25px rgba(0,0,0,0.15)` | Hero images, featured cards |
+
+---
+
+## Component Specs
+
+### Buttons
+
+```css
+/* Primary Button */
+.btn-primary {
+  background: #22C55E;
+  color: white;
+  padding: 12px 24px;
+  border-radius: 8px;
+  font-weight: 600;
+  transition: all 200ms ease;
+  cursor: pointer;
+}
+
+.btn-primary:hover {
+  opacity: 0.9;
+  transform: translateY(-1px);
+}
+
+/* Secondary Button */
+.btn-secondary {
+  background: transparent;
+  color: #0F172A;
+  border: 2px solid #0F172A;
+  padding: 12px 24px;
+  border-radius: 8px;
+  font-weight: 600;
+  transition: all 200ms ease;
+  cursor: pointer;
+}
+```
+
+### Cards
+
+```css
+.card {
+  background: #020617;
+  border-radius: 12px;
+  padding: 24px;
+  box-shadow: var(--shadow-md);
+  transition: all 200ms ease;
+  cursor: pointer;
+}
+
+.card:hover {
+  box-shadow: var(--shadow-lg);
+  transform: translateY(-2px);
+}
+```
+
+### Inputs
+
+```css
+.input {
+  padding: 12px 16px;
+  border: 1px solid #E2E8F0;
+  border-radius: 8px;
+  font-size: 16px;
+  transition: border-color 200ms ease;
+}
+
+.input:focus {
+  border-color: #0F172A;
+  outline: none;
+  box-shadow: 0 0 0 3px #0F172A20;
+}
+```
+
+### Modals
+
+```css
+.modal-overlay {
+  background: rgba(0, 0, 0, 0.5);
+  backdrop-filter: blur(4px);
+}
+
+.modal {
+  background: white;
+  border-radius: 16px;
+  padding: 32px;
+  box-shadow: var(--shadow-xl);
+  max-width: 500px;
+  width: 90%;
+}
+```
+
+---
+
+## Style Guidelines
+
+**Style:** Dark Mode (OLED)
+
+**Keywords:** Dark theme, low light, high contrast, deep black, midnight blue, eye-friendly, OLED, night mode, power efficient
+
+**Best For:** Night-mode apps, coding platforms, entertainment, eye-strain prevention, OLED devices, low-light
+
+**Key Effects:** Minimal glow (text-shadow: 0 0 10px), dark-to-light transitions, low white emission, high readability, visible focus
+
+### Page Pattern
+
+**Pattern Name:** Horizontal Scroll Journey
+
+- **Conversion Strategy:** Immersive product discovery. High engagement. Keep navigation visible.
+28,Bento Grid Showcase,bento,  grid,  features,  modular,  apple-style,  showcase", 1. Hero, 2. Bento Grid (Key Features), 3. Detail Cards, 4. Tech Specs, 5. CTA, Floating Action Button or Bottom of Grid, Card backgrounds: #F5F5F7 or Glass. Icons: Vibrant brand colors. Text: Dark., Hover card scale (1.02), video inside cards, tilt effect, staggered reveal, Scannable value props. High information density without clutter. Mobile stack.
+29,Interactive 3D Configurator,3d,  configurator,  customizer,  interactive,  product", 1. Hero (Configurator), 2. Feature Highlight (synced), 3. Price/Specs, 4. Purchase, Inside Configurator UI + Sticky Bottom Bar, Neutral studio background. Product: Realistic materials. UI: Minimal overlay., Real-time rendering, material swap animation, camera rotate/zoom, light reflection, Increases ownership feeling. 360 view reduces return rates. Direct add-to-cart.
+30,AI-Driven Dynamic Landing,ai,  dynamic,  personalized,  adaptive,  generative", 1. Prompt/Input Hero, 2. Generated Result Preview, 3. How it Works, 4. Value Prop, Input Field (Hero) + 'Try it' Buttons, Adaptive to user input. Dark mode for compute feel. Neon accents., Typing text effects, shimmering generation loaders, morphing layouts, Immediate value demonstration. 'Show, don't tell'. Low friction start.
+- **CTA Placement:** Floating Sticky CTA or End of Horizontal Track
+- **Section Order:** 1. Intro (Vertical), 2. The Journey (Horizontal Track), 3. Detail Reveal, 4. Vertical Footer
+
+---
+
+## Anti-Patterns (Do NOT Use)
+
+- ❌ Light mode default
+- ❌ Slow rendering
+
+### Additional Forbidden Patterns
+
+- ❌ **Emojis as icons** — Use SVG icons (Heroicons, Lucide, Simple Icons)
+- ❌ **Missing cursor:pointer** — All clickable elements must have cursor:pointer
+- ❌ **Layout-shifting hovers** — Avoid scale transforms that shift layout
+- ❌ **Low contrast text** — Maintain 4.5:1 minimum contrast ratio
+- ❌ **Instant state changes** — Always use transitions (150-300ms)
+- ❌ **Invisible focus states** — Focus states must be visible for a11y
+
+---
+
+## Pre-Delivery Checklist
+
+Before delivering any UI code, verify:
+
+- [ ] No emojis used as icons (use SVG instead)
+- [ ] All icons from consistent icon set (Heroicons/Lucide)
+- [ ] `cursor-pointer` on all clickable elements
+- [ ] Hover states with smooth transitions (150-300ms)
+- [ ] Light mode: text contrast 4.5:1 minimum
+- [ ] Focus states visible for keyboard navigation
+- [ ] `prefers-reduced-motion` respected
+- [ ] Responsive: 375px, 768px, 1024px, 1440px
+- [ ] No content hidden behind fixed navbars
+- [ ] No horizontal scroll on mobile
diff --git a/design-system/xk-admin/pages/workspace.md b/design-system/xk-admin/pages/workspace.md
new file mode 100644
index 00000000..5fa66de5
--- /dev/null
+++ b/design-system/xk-admin/pages/workspace.md
@@ -0,0 +1,73 @@
+# Workspace Page Overrides
+
+> **PROJECT:** XK Admin
+> **Generated:** 2026-08-11 14:59:17（人工校准：对齐 Vben 主题变量）
+> **Page Type:** Dashboard / Workbench（角色差异化工作台）
+
+> ⚠️ **IMPORTANT:** Rules in this file **override** the Master file (`design-system/MASTER.md`).
+> 本页规则以 **Vben 主题 CSS 变量** 为唯一色源，Master 中写死的 hex 色板对本页 **不适用**。
+
+---
+
+## Page-Specific Rules
+
+### Color Overrides（强制，亮/暗双主题）
+
+一律使用 Vben 语义变量，禁止写死 hex：
+
+| 用途 | 变量 |
+|------|------|
+| 页面/卡片背景 | `hsl(var(--background))` / `hsl(var(--card))` |
+| 次级底色 | `hsl(var(--muted) / 0.25)` |
+| 主文字 | `hsl(var(--foreground))` |
+| 次要文字 | `hsl(var(--muted-foreground))` |
+| 边框/分割线 | `hsl(var(--border))` |
+| 强调/选中/hover | `hsl(var(--primary))`、`hsl(var(--primary) / 0.1)` |
+| 警示 | `hsl(var(--warning))`、`hsl(var(--destructive))` |
+
+角色配置的 accent color 仅用于图标点缀，暗色下加透明度（如 `color-mix` 或 opacity 0.85）。
+
+### Typography Overrides
+
+- 不引入 Fira Code / Google Fonts，沿用项目现有字体栈
+- KPI 数字：`text-2xl font-semibold`；标签：`text-xs text-muted-foreground`
+
+### Layout Overrides（Dense Workbench）
+
+- 不使用 Master 的 Horizontal Scroll Journey；采用纵向密集布局：
+  1. 紧凑问候条（头像 40px，单行）
+  2. 快捷入口卡（搜索框 + 密集网格：桌面 6~8 列 / 移动 4 列）
+  3. 角色 KPI 摘要条（stat chips，横向 wrap）
+  4. 公告紧凑列表
+- 区块间距 `gap-4`（16px），卡片内 padding `p-4`
+- 快捷入口单元：图标 20px + 单行标题 12px，`py-3`，禁止旧版 `w-1/3 py-8` 大卡
+
+### Component Overrides（Premium Elegant 视觉语言）
+
+参考 ui-ux-pro-max「Liquid Glass / Premium」方向做克制版（管理台不牺牲可读性）：
+
+- **卡片壳**：圆角 12px；边框 `hsl(var(--border)/0.7)`；柔和双层阴影 `0 1px 2px + 0 8px 24px（primary 低透明）`；hover 轻抬升 `translateY(-1px)`
+- **问候头**：primary 色相柔和渐变底 + 右上装饰性模糊光斑（`blur(64px)`、低透明度，暗色自动柔化）；头像带 2px primary/20 光环
+- **快捷入口单元**：图标坐 40px 圆角容器（`hsl(var(--primary)/0.1)` 底色），hover 抬升 + 图标容器变实色；200ms `cubic-bezier(0.4,0,0.2,1)`
+- **KPI 卡**：左上小图标（tinted 容器）+ 大数字 + 小标签；hover 抬升 + 边框透出 primary
+- **公告行**：圆点/图标前缀，hover 整行 `hsl(var(--muted)/0.4)` 底色
+- 搜索框 antd `Input` allowClear 圆角 8px，聚焦态跟 `--primary`
+- 空态文案 `text-muted-foreground`
+- 动效统一 200ms；`prefers-reduced-motion: reduce` 时关闭 transform 动效
+- 禁止：彩虹渐变/iridescent、重 backdrop-filter 大面积使用（性能与对比度）、Google Fonts 引入
+
+---
+
+## Interaction Rules
+
+- 搜索输入即过滤（本地），Enter 跳转第一条结果
+- 所有可点击元素 `cursor-pointer`，键盘 focus 可见
+- 遵守 `prefers-reduced-motion`
+
+---
+
+## Pre-Delivery Checklist（本页）
+
+- [ ] 亮色 + 暗色主题各自检查一遍对比度
+- [ ] 无写死 `#fff` / `#000` / `#0f172a` 等色值
+- [ ] 375px / 768px / 1024px / 1440px 响应式
diff --git a/docs/.vitepress/build/dayjs-loader.mjs b/docs/.vitepress/build/dayjs-loader.mjs
new file mode 100644
index 00000000..623c394f
--- /dev/null
+++ b/docs/.vitepress/build/dayjs-loader.mjs
@@ -0,0 +1,2 @@
+import { register } from 'node:module';
+register('./dayjs-resolve-hook.mjs', import.meta.url);
diff --git a/docs/.vitepress/build/dayjs-resolve-hook.mjs b/docs/.vitepress/build/dayjs-resolve-hook.mjs
new file mode 100644
index 00000000..f8989044
--- /dev/null
+++ b/docs/.vitepress/build/dayjs-resolve-hook.mjs
@@ -0,0 +1,10 @@
+const DAYJS_SUBPATH_RE = /^dayjs\/(plugin|locale)\/([^./]+)$/;
+
+/** @type {import('node:module').ResolveHook} */
+export async function resolve(specifier, context, nextResolve) {
+  const match = specifier.match(DAYJS_SUBPATH_RE);
+  if (match) {
+    return nextResolve(`${specifier}.js`, context);
+  }
+  return nextResolve(specifier, context);
+}
diff --git a/docs/src/components/common-ui/vben-alert.md b/docs/src/components/common-ui/vben-alert.md
new file mode 100644
index 00000000..a14e47bb
--- /dev/null
+++ b/docs/src/components/common-ui/vben-alert.md
@@ -0,0 +1,112 @@
+---
+outline: deep
+---
+
+# Vben Alert 轻量提示框
+
+`Alert` 提供了一组纯 JavaScript 调用的轻量提示框能力，适合快速创建 `alert`、`confirm`、`prompt` 这类简单交互。
+
+::: info 适用场景
+
+`Alert` 与 `Modal` 的能力有部分重叠，但更适合临时确认、简单提示和轻量输入场景。复杂弹窗仍然建议使用 `Vben Modal`。:::
+
+::: tip 注意
+
+通过 `alert`、`confirm`、`prompt` 动态创建的弹窗，在已经打开的情况下不支持 HMR 热更新。修改相关代码后，需要关闭后重新打开。:::
+
+## 基础用法
+
+使用 `alert` 创建只有确认按钮的提示框。
+
+<DemoPreview dir="demos/vben-alert/alert" />
+
+使用 `confirm` 创建带确认和取消按钮的提示框。
+
+<DemoPreview dir="demos/vben-alert/confirm" />
+
+使用 `prompt` 创建可接收用户输入的提示框。
+
+<DemoPreview dir="demos/vben-alert/prompt" />
+
+## useAlertContext
+
+当 `content`、`footer` 或 `icon` 使用的是自定义组件时，可以在这些组件内部通过 `useAlertContext()` 获取当前弹窗上下文，并主动触发确认或取消。
+
+::: tip 注意
+
+`useAlertContext` 只能在 `setup` 或函数式组件中使用。:::
+
+### Methods
+
+| 方法      | 描述                   | 类型         | 版本要求 |
+| --------- | ---------------------- | ------------ | -------- |
+| doConfirm | 触发当前弹窗的确认操作 | `() => void` | `>5.5.4` |
+| doCancel  | 触发当前弹窗的取消操作 | `() => void` | `>5.5.4` |
+
+## 类型说明
+
+```ts
+export type IconType = 'error' | 'info' | 'question' | 'success' | 'warning';
+
+export type BeforeCloseScope = {
+  isConfirm: boolean;
+};
+
+export type AlertProps = {
+  beforeClose?: (
+    scope: BeforeCloseScope,
+  ) => boolean | Promise<boolean | undefined> | undefined;
+  bordered?: boolean;
+  buttonAlign?: 'center' | 'end' | 'start';
+  cancelText?: string;
+  centered?: boolean;
+  confirmText?: string;
+  containerClass?: string;
+  content: Component | string;
+  contentClass?: string;
+  contentMasking?: boolean;
+  footer?: Component | string;
+  icon?: Component | IconType;
+  overlayBlur?: number;
+  showCancel?: boolean;
+  title?: string;
+};
+
+export type PromptProps<T = any> = {
+  beforeClose?: (scope: {
+    isConfirm: boolean;
+    value: T | undefined;
+  }) => boolean | Promise<boolean | undefined> | undefined;
+  component?: Component;
+  componentProps?: Recordable<any>;
+  componentSlots?:
+    (() => any) | Recordable<unknown> | VNode | VNodeArrayChildren;
+  defaultValue?: T;
+  modelPropName?: string;
+} & Omit<AlertProps, 'beforeClose'>;
+
+export function alert(options: AlertProps): Promise<void>;
+export function alert(
+  message: string,
+  options?: Partial<AlertProps>,
+): Promise<void>;
+export function alert(
+  message: string,
+  title?: string,
+  options?: Partial<AlertProps>,
+): Promise<void>;
+
+export async function prompt<T = any>(
+  options: Omit<AlertProps, 'beforeClose'> & {
+    beforeClose?: (
+      scope: BeforeCloseScope & {
+        value: T;
+      },
+    ) => boolean | Promise<boolean | undefined> | undefined;
+    component?: Component;
+    componentProps?: Recordable<any>;
+    defaultValue?: T;
+    modelPropName?: string;
+  },
+): Promise<T | undefined>;
+```
diff --git a/docs/src/components/common-ui/vben-api-component.md b/docs/src/components/common-ui/vben-api-component.md
index f275adfc..b14e0725 100644
--- a/docs/src/components/common-ui/vben-api-component.md
+++ b/docs/src/components/common-ui/vben-api-component.md
@@ -14,7 +14,7 @@ outline: deep
 
 ## 基础用法
 
-通过 `component` 传入其它组件的定义，并配置相关的其它属性（主要是一些名称映射）。包装组件将通过`api`获取数据（`beforerFetch`、`afterFetch`将分别在`api`运行前、运行后被调用），使用`resultField`从中提取数组，使用`valueField`、`labelField`等来从数据中提取value和label（如果提供了`childrenField`，会将其作为树形结构递归处理每一级数据），之后将处理好的数据通过`optionsPropName`指定的属性传递给目标组件。
+通过 `component` 传入其它组件的定义，并配置相关的其它属性（主要是一些名称映射）。包装组件将通过 `api` 获取数据（`beforeFetch`、`afterFetch` 将分别在 `api` 运行前、运行后被调用），使用 `resultField` 从中提取数组，使用 `valueField`、`labelField` 等来从数据中提取 value 和 label（如果提供了 `childrenField`，会将其作为树形结构递归处理每一级数据），之后将处理好的数据通过 `optionsPropName` 指定的属性传递给目标组件。
 
 ::: details 包装级联选择器,点击下拉时开始加载远程数据
 
@@ -22,7 +22,7 @@ outline: deep
 <script lang="ts" setup>
 import { ApiComponent } from '@vben/common-ui';
 
-import { Cascader } from 'ant-design-vue';
+import { Cascader } from 'antdv-next';
 
 const treeData: Record<string, any> = [
   {
@@ -123,30 +123,51 @@ function fetchApi(): Promise<Record<string, any>> {
 
 :::
 
+## 并发和缓存
+
+有些场景下可能需要使用多个ApiComponent，它们使用了相同的远程数据源（例如用在可编辑的表格中）。如果直接将请求后端接口的函数传递给api属性，则每一个实例都会访问一次接口，这会造成资源浪费，是完全没有必要的。Tanstack Query提供了并发控制、缓存、重试等诸多特性，我们可以将接口请求函数用useQuery包装一下再传递给ApiComponent，这样的话无论页面有多少个使用相同数据源的ApiComponent实例，都只会发起一次远程请求。演示效果请参考 [Playground vue-query](https://www.vben.pro/#/demos/features/vue-query)，具体代码请查看项目文件[concurrency-caching](https://github.com/vbenjs/vue-vben-admin/blob/main/playground/src/views/demos/features/vue-query/concurrency-caching.vue)
+
 ## API
 
 ### Props
 
-| 属性名 | 描述 | 类型 | 默认值 |
+| 属性名 | 描述 | 类型 | 默认值 | 版本要求 |
+| --- | --- | --- | --- | --- |
+| modelValue(v-model) | 当前值 | `any` | - | - |
+| component | 欲包装的组件（以下称为目标组件） | `Component` | - | - |
+| numberToString | 是否将value从数字转为string | `boolean` | `false` | - |
+| api | 获取数据的函数 | `(arg?: any) => Promise<OptionsItem[] \| Record<string, any>>` | - | - |
+| params | 传递给api的参数 | `Record<string, any>` | - | - |
+| resultField | 从api返回的结果中提取options数组的字段名 | `string` | - | - |
+| labelField | label字段名 | `string` | `label` | - |
+| childrenField | 子级数据字段名，需要层级数据的组件可用 | `string` | `` | - |
+| valueField | value字段名 | `string` | `value` | - |
+| optionsPropName | 目标组件接收options数据的属性名称 | `string` | `options` | - |
+| modelPropName | 目标组件的双向绑定属性名，默认为modelValue。部分组件可能为value | `string` | `modelValue` | - |
+| immediate | 是否立即调用api | `boolean` | `true` | - |
+| alwaysLoad | 每次`visibleEvent`事件发生时都重新请求数据 | `boolean` | `false` | - |
+| beforeFetch | 在api请求之前的回调函数 | `AnyPromiseFunction<any, any>` | - | - |
+| afterFetch | 在api请求之后的回调函数 | `AnyPromiseFunction<any, any>` | - | - |
+| options | 直接传入选项数据，也作为api返回空数据时的后备数据 | `OptionsItem[]` | - | - |
+| visibleEvent | 触发重新请求数据的事件名 | `string` | - | - |
+| loadingSlot | 目标组件的插槽名称，用来显示一个"加载中"的图标 | `string` | - | - |
+| autoSelect | 自动设置选项 | `'first' \| 'last' \| 'one'\| ((item: OptionsItem[]) => OptionsItem) \| false` | `false` | >5.5.4 |
+
+#### autoSelect 自动设置选项
+
+如果当前值为undefined，在选项数据成功加载之后，自动从备选项中选择一个作为当前值。默认值为`false`，即不自动选择选项。注意：该属性不应用于多选组件。可选值有：
+
+- `"first"`：自动选择第一个选项
+- `"last"`：自动选择最后一个选项
+- `"one"`：有且仅有一个选项时，自动选择它
+- `自定义函数`：自定义选择逻辑，函数的参数为options，返回值为选择的选项
+- `false`：不自动选择选项
+
+### Methods
+
+| 方法 | 描述 | 类型 | 版本要求 |
 | --- | --- | --- | --- |
-| component | 欲包装的组件 | `Component` | - |
-| numberToString | 是否将value从数字转为string | `boolean` | `false` |
-| api | 获取数据的函数 | `(arg?: any) => Promise<OptionsItem[] \| Record<string, any>>` | - |
-| params | 传递给api的参数 | `Record<string, any>` | - |
-| resultField | 从api返回的结果中提取options数组的字段名 | `string` | - |
-| labelField | label字段名 | `string` | `label` |
-| childrenField | 子级数据字段名，需要层级数据的组件可用 | `string` | `` |
-| valueField | value字段名 | `string` | `value` |
-| optionsPropName | 组件接收options数据的属性名称 | `string` | `options` |
-| modelPropName | 组件的双向绑定属性名，默认为modelValue。部分组件可能为value | `string` | `modelValue` |
-| immediate | 是否立即调用api | `boolean` | `true` |
-| alwaysLoad | 每次`visibleEvent`事件发生时都重新请求数据 | `boolean` | `false` |
-| beforeFetch | 在api请求之前的回调函数 | `AnyPromiseFunction<any, any>` | - |
-| afterFetch | 在api请求之后的回调函数 | `AnyPromiseFunction<any, any>` | - |
-| options | 直接传入选项数据，也作为api返回空数据时的后备数据 | `OptionsItem[]` | - |
-| visibleEvent | 触发重新请求数据的事件名 | `string` | - |
-| loadingSlot | 组件的插槽名称，用来显示一个"加载中"的图标 | `string` | - |
-
-```
-
-```
+| getComponentRef | 获取被包装的组件的实例 | ()=>T | >5.5.4 |
+| updateParam | 设置接口请求参数（将与params属性合并） | (newParams: Record<string, any>)=>void | >5.5.4 |
+| getOptions | 获取已加载的选项数据 | ()=>OptionsItem[] | >5.5.4 |
+| getValue | 获取当前值 | ()=>any | >5.5.4 |
diff --git a/docs/src/components/common-ui/vben-cropper.md b/docs/src/components/common-ui/vben-cropper.md
new file mode 100644
index 00000000..c25d3257
--- /dev/null
+++ b/docs/src/components/common-ui/vben-cropper.md
@@ -0,0 +1,172 @@
+---
+outline: deep
+---
+
+# Vben Cropper 图片裁剪
+
+`VCropper` 是一个纯原生实现的图片裁剪组件，支持自由比例和固定比例裁剪，可通过方法调用获取裁剪后的图片。
+
+> 如果文档内没有参数说明，可以尝试在在线示例内寻找
+
+::: info 写在前面
+
+如果你觉得现有组件的封装不够理想，或者不完全符合你的需求，可以直接使用原生组件，亦或亲手封装一个适合的组件。框架提供的组件并非束缚，使用与否，完全取决于你的需求与自由。
+
+:::
+
+## 基础用法
+
+最基本的图片裁剪，支持自由比例调整。
+
+<DemoPreview dir="demos/vben-cropper/basic" />
+
+## 固定比例裁剪
+
+通过 `aspectRatio` 属性设置裁剪比例，格式为 `"宽:高"`，如 `"1:1"`、`"16:9"`、`"3:4"` 等。
+
+<DemoPreview dir="demos/vben-cropper/aspect-ratio" />
+
+## API
+
+### Props
+
+| 属性名        | 描述                                  | 类型     | 默认值 |
+| ------------- | ------------------------------------- | -------- | ------ |
+| `img`         | 图片地址（必填）                      | `string` | -      |
+| `width`       | 容器宽度                              | `number` | `500`  |
+| `height`      | 容器高度                              | `number` | `400`  |
+| `aspectRatio` | 裁剪比例，格式如 `"1:1"`、`"16:9"` 等 | `string` | -      |
+
+### Methods
+
+通过 `ref` 调用组件方法：
+
+```vue
+<script setup lang="ts">
+import { ref } from 'vue';
+import { VCropper } from '@vben/common-ui';
+
+const cropperRef = ref<InstanceType<typeof VCropper>>();
+
+const handleCrop = async () => {
+  const result = await cropperRef.value?.getCropImage();
+  // result 为 Blob 或 base64 字符串
+};
+</script>
+```
+
+#### getCropImage
+
+裁剪并获取图片。
+
+```ts
+interface GetCropImageOptions {
+  /** 输出图片格式 */
+  format?: 'image/jpeg' | 'image/png';
+  /** 压缩质量（0-1），仅对 jpeg 格式有效 */
+  quality?: number;
+  /** 输出类型 */
+  outputType?: 'base64' | 'blob';
+  /** 目标宽度（可选，不传则为原始裁剪宽度） */
+  targetWidth?: number;
+  /** 目标高度（可选，不传则为原始裁剪高度） */
+  targetHeight?: number;
+}
+
+getCropImage(
+  format?: 'image/jpeg' | 'image/png',
+  quality?: number,
+  outputType?: 'base64' | 'blob',
+  targetWidth?: number,
+  targetHeight?: number,
+): Promise<Blob | string | undefined>
+```
+
+**参数说明：**
+
+| 参数 | 类型 | 默认值 | 描述 |
+| --- | --- | --- | --- |
+| `format` | `'image/jpeg' \| 'image/png'` | `'image/png'` | 输出图片格式 |
+| `quality` | `number` | `0.92` | 压缩质量（0-1），仅 jpeg 有效 |
+| `outputType` | `'base64' \| 'blob'` | `'blob'` | 输出类型，base64 字符串或 Blob 对象 |
+| `targetWidth` | `number` | - | 目标宽度，不传则使用原始裁剪宽度 |
+| `targetHeight` | `number` | - | 目标高度，不传则使用原始裁剪高度 |
+
+## 功能特性
+
+### 裁剪操作
+
+- **拖拽移动** - 拖拽裁剪框中心区域移动裁剪位置
+- **边角调整** - 拖拽四角调整裁剪框大小
+- **边缘调整** - 拖拽四边中点调整单边
+
+### 比例控制
+
+- **自由比例** - 不设置 `aspectRatio` 时，可自由调整任意比例
+- **固定比例** - 设置 `aspectRatio` 后，裁剪框始终保持设定比例
+
+### 高清屏适配
+
+组件自动适配 Retina 等高清屏幕，保证输出图片清晰无模糊。
+
+### 图片适配
+
+- 图片自动等比缩放以完整显示在容器内
+- 支持本地图片和网络图片
+- 网络图片需目标服务端支持 CORS 才能导出裁剪结果
+
+## 使用示例
+
+```vue
+<script setup lang="ts">
+import { ref } from 'vue';
+import { VCropper } from '@vben/common-ui';
+
+const cropperRef = ref<InstanceType<typeof VCropper>>();
+const imageUrl = ref('https://example.com/image.jpg');
+const croppedImage = ref('');
+
+// 获取裁剪后的 Blob 对象
+const handleCropBlob = async () => {
+  const blob = await cropperRef.value?.getCropImage('image/jpeg', 0.9, 'blob');
+  if (blob instanceof Blob) {
+    // 上传到服务器或创建预览URL
+    const url = URL.createObjectURL(blob);
+    croppedImage.value = url;
+  }
+};
+
+// 获取裁剪后的 base64 字符串
+const handleCropBase64 = async () => {
+  const base64 = await cropperRef.value?.getCropImage('image/png', 1, 'base64');
+  if (typeof base64 === 'string') {
+    croppedImage.value = base64;
+  }
+};
+
+// 导出指定尺寸
+const handleCropWithSize = async () => {
+  const blob = await cropperRef.value?.getCropImage(
+    'image/jpeg',
+    0.9,
+    'blob',
+    200, // 目标宽度
+    200, // 目标高度
+  );
+};
+</script>
+
+<template>
+  <div>
+    <VCropper
+      ref="cropperRef"
+      :img="imageUrl"
+      :width="500"
+      :height="400"
+      aspect-ratio="1:1"
+    />
+    <button @click="handleCropBlob">裁剪</button>
+    <img v-if="croppedImage" :src="croppedImage" />
+  </div>
+</template>
+```
diff --git a/docs/src/components/common-ui/vben-descriptions.md b/docs/src/components/common-ui/vben-descriptions.md
new file mode 100644
index 00000000..fa48c725
--- /dev/null
+++ b/docs/src/components/common-ui/vben-descriptions.md
@@ -0,0 +1,102 @@
+---
+outline: deep
+---
+
+# Vben Descriptions 描述列表
+
+`Descriptions` 用于成组展示只读的字段信息，常用于详情页、信息预览等场景。组件基于 shadcn-ui 构建，API 参考 Ant Design Vue 的 Descriptions，支持响应式列数、跨列、边框、垂直布局等能力。
+
+> 如果文档内没有覆盖到你需要的细节，可以结合在线示例一起查看。
+
+::: info 写在前面
+
+组件提供两种使用方式：通过 `items` 数据驱动（推荐），或通过子组件 `VbenDescriptionsItem` 声明列表项。两者可按需选择，`items` 优先级更高。:::
+
+## 基础用法
+
+通过 `items` 传入字段数组，每项包含 `label` 与 `content`。默认按断点自适应列数（`xs` 1 列、`sm` 2 列、`md` 及以上 3 列）。
+
+<DemoPreview dir="demos/vben-descriptions/basic" />
+
+## 带边框
+
+设置 `bordered` 展示边框样式，配合 `title` 标题与 `#extra` 插槽（位于标题右侧的操作区域）。
+
+<DemoPreview dir="demos/vben-descriptions/bordered" />
+
+## 垂直布局
+
+通过 `layout="vertical"` 让标签位于内容上方。
+
+<DemoPreview dir="demos/vben-descriptions/vertical" />
+
+## 不同尺寸
+
+通过 `size` 设置 `small`、`middle`、`large` 三种尺寸。
+
+<DemoPreview dir="demos/vben-descriptions/size" />
+
+## 跨列与响应式
+
+单项通过 `span` 设置跨列数，`'filled'` 表示占满当前行剩余空间；`column` 支持传入按断点配置的对象实现响应式列数。
+
+<DemoPreview dir="demos/vben-descriptions/span" />
+
+## 子组件用法
+
+不传 `items` 时，可在默认插槽中使用 `VbenDescriptionsItem` 声明列表项，内容支持默认插槽或 `#content` 插槽自定义。
+
+<DemoPreview dir="demos/vben-descriptions/custom" />
+
+## API
+
+### Descriptions Props
+
+| 属性名 | 描述 | 类型 | 默认值 |
+| --- | --- | --- | --- |
+| items | 数据驱动的列表项；不传则读取默认插槽 | `DescriptionsItemType[]` | - |
+| bordered | 是否展示边框 | `boolean` | `false` |
+| column | 一行的列数，支持按断点配置 | `number \| Partial<Record<Breakpoint, number>>` | `{ xs: 1, sm: 2, md: 3, xxxl: 4 }` |
+| layout | 布局方式 | `'horizontal' \| 'vertical'` | `'horizontal'` |
+| size | 尺寸 | `'small' \| 'middle' \| 'large'` | `'middle'` |
+| colon | 是否显示冒号（仅非边框的水平布局生效） | `boolean` | `true` |
+| title | 标题 | `string` | - |
+| extra | 标题右侧的操作区域 | `string` | - |
+| labelStyle | 统一的标签样式 | `CSSProperties` | - |
+| contentStyle | 统一的内容样式 | `CSSProperties` | - |
+| class | 根节点自定义类名 | `string` | - |
+
+### Descriptions Slots
+
+| 插槽名  | 描述                               |
+| ------- | ---------------------------------- |
+| title   | 自定义标题                         |
+| extra   | 自定义标题右侧操作区域             |
+| default | 放置 `VbenDescriptionsItem` 子组件 |
+
+### DescriptionsItem
+
+`items` 数组中的每一项，或子组件 `VbenDescriptionsItem` 的属性。
+
+| 属性名 | 描述 | 类型 | 默认值 |
+| --- | --- | --- | --- |
+| label | 标签 | `string \| number \| (() => VNode) \| Component` | - |
+| content | 内容 | `string \| number \| (() => VNode) \| Component` | - |
+| span | 跨列数，`'filled'` 占满当前行剩余 | `number \| 'filled' \| Partial<Record<Breakpoint, number>>` | `1` |
+| labelStyle | 标签样式 | `CSSProperties` | - |
+| contentStyle | 内容样式 | `CSSProperties` | - |
+| key | 唯一标识 | `string \| number` | - |
+
+### DescriptionsItem Slots
+
+仅子组件用法可用。
+
+| 插槽名  | 描述                     |
+| ------- | ------------------------ |
+| default | 内容（等价于 `content`） |
+| content | 自定义内容               |
+| label   | 自定义标签               |
+
+::: tip Breakpoint
+
+响应式断点 `Breakpoint` 取值为 `'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'xxl' | 'xxxl'`，断点像素与 Ant Design 一致（`sm` 576、`md` 768、`lg` 992、`xl` 1200、`xxl` 1600、`xxxl` 2000）。:::
diff --git a/docs/src/components/common-ui/vben-ellipsis-text.md b/docs/src/components/common-ui/vben-ellipsis-text.md
index 109f1161..32a8fa58 100644
--- a/docs/src/components/common-ui/vben-ellipsis-text.md
+++ b/docs/src/components/common-ui/vben-ellipsis-text.md
@@ -4,53 +4,61 @@ outline: deep
 
 # Vben EllipsisText 省略文本
 
-框架提供的文本展示组件，可配置超长省略、tooltip提示、展开收起等功能。
+`EllipsisText` 用于展示超长文本，支持省略、Tooltip 提示以及点击展开收起。
 
-> 如果文档内没有参数说明，可以尝试在在线示例内寻找
+> 如果文档内没有覆盖到你需要的细节，可以结合在线示例一起查看。
 
 ## 基础用法
 
-通过默认插槽设置文本内容，`maxWidth`属性设置最大宽度。
+通过默认插槽提供文本内容，`maxWidth` 用于限制文本区域宽度。
 
 <DemoPreview dir="demos/vben-ellipsis-text/line" />
 
-## 可折叠的文本块
+## 可折叠文本
 
-通过`line`设置折叠后的行数，`expand`属性设置是否支持展开收起。
+通过 `line` 设置折叠后的最大行数，通过 `expand` 开启点击展开与收起。
 
 <DemoPreview dir="demos/vben-ellipsis-text/expand" />
 
 ## 自定义提示浮层
 
-通过名为`tooltip`的插槽定制提示信息。
+通过 `tooltip` 插槽自定义提示内容。
 
 <DemoPreview dir="demos/vben-ellipsis-text/tooltip" />
 
+## 仅在省略时显示 Tooltip
+
+通过 `tooltip-when-ellipsis` 控制仅在文本被截断时显示 Tooltip。
+
+<DemoPreview dir="demos/vben-ellipsis-text/auto-display" />
+
 ## API
 
 ### Props
 
 | 属性名 | 描述 | 类型 | 默认值 |
 | --- | --- | --- | --- |
-| expand | 支持点击展开或收起 | `boolean` | `false` |
-| line | 文本最大行数 | `number` | `1` |
+| expand | 是否支持点击展开或收起 | `boolean` | `false` |
+| line | 文本最大显示行数 | `number` | `1` |
 | maxWidth | 文本区域最大宽度 | `number \| string` | `'100%'` |
-| placement | 提示浮层的位置 | `'bottom'\|'left'\|'right'\|'top'` | `'top'` |
-| tooltip | 启用文本提示 | `boolean` | `true` |
-| tooltipBackgroundColor | 提示文本的背景颜色 | `string` | - |
-| tooltipColor | 提示文本的颜色 | `string` | - |
-| tooltipFontSize | 提示文本的大小 | `string` | - |
-| tooltipMaxWidth | 提示浮层的最大宽度。如不设置则保持与文本宽度一致 | `number` | - |
-| tooltipOverlayStyle | 提示框内容区域样式 | `CSSProperties` | `{ textAlign: 'justify' }` |
+| placement | 提示浮层位置 | `'bottom' \| 'left' \| 'right' \| 'top'` | `'top'` |
+| tooltip | 是否启用文本提示 | `boolean` | `true` |
+| tooltipWhenEllipsis | 是否仅在文本被截断时显示提示 | `boolean` | `false` |
+| ellipsisThreshold | 文本截断检测阈值，值越大判定越严格 | `number` | `3` |
+| tooltipBackgroundColor | 提示背景色 | `string` | `''` |
+| tooltipColor | 提示文字颜色 | `string` | `''` |
+| tooltipFontSize | 提示文字大小，单位 `px` | `number` | `14` |
+| tooltipMaxWidth | 提示内容最大宽度，单位 `px` | `number` | - |
+| tooltipOverlayStyle | 提示内容区域样式 | `CSSProperties` | `{ textAlign: 'justify' }` |
 
 ### Events
 
-| 事件名       | 描述         | 类型                       |
-| ------------ | ------------ | -------------------------- |
-| expandChange | 展开状态改变 | `(isExpand:boolean)=>void` |
+| 事件名       | 描述               | 类型                          |
+| ------------ | ------------------ | ----------------------------- |
+| expandChange | 展开状态变化时触发 | `(isExpand: boolean) => void` |
 
 ### Slots
 
-| 插槽名  | 描述                             |
-| ------- | -------------------------------- |
-| tooltip | 启用文本提示时，用来定制提示内容 |
+| 插槽名  | 描述                               |
+| ------- | ---------------------------------- |
+| tooltip | 开启文本提示时，用于自定义提示内容 |
diff --git a/docs/src/components/common-ui/vben-table-action.md b/docs/src/components/common-ui/vben-table-action.md
new file mode 100644
index 00000000..6ffe34dc
--- /dev/null
+++ b/docs/src/components/common-ui/vben-table-action.md
@@ -0,0 +1,165 @@
+---
+outline: deep
+---
+
+# Vben TableAction 表格操作
+
+`TableAction` 用于在表格操作列中渲染一组操作按钮，参考 vben2 的 TableAction 设计。基于 shadcn-ui 构建，支持权限控制、气泡确认、提示、下拉「更多」、分割线等能力，可在表格内外任意场景复用。
+
+> 如果文档内没有覆盖到你需要的细节，可以结合在线示例一起查看。
+
+::: info 写在前面
+
+组件本身不依赖任何业务逻辑（不直接读取权限 store），权限通过注入 `hasPermission` 实现，从而保持核心层零耦合、可跨框架复用。在 vxe-table 中推荐通过列插槽（`slots: { default: 'action' }`）在页面里渲染，不改变表格原有的渲染机制。:::
+
+## 基础用法
+
+通过 `actions` 传入操作项数组，每项包含 `text`、`onClick` 等；`danger` 标记危险操作，`divider` 显示按钮间分割线。
+
+<DemoPreview dir="demos/vben-table-action/basic" />
+
+## 提示
+
+通过 `tooltip` 为操作项添加提示，支持字符串或 `{ content, side }` 配置。
+
+<DemoPreview dir="demos/vben-table-action/tooltip" />
+
+## 气泡确认
+
+通过 `popConfirm` 开启点击前的气泡确认，常用于删除等危险操作。
+
+<DemoPreview dir="demos/vben-table-action/popconfirm" />
+
+## 更多下拉
+
+通过 `dropdownActions` 将次要操作收纳到「更多」下拉中，`moreText` 可自定义按钮文案。
+
+<DemoPreview dir="demos/vben-table-action/dropdown" />
+
+## 权限控制
+
+为操作项设置 `auth` 权限码，并注入 `hasPermission` 判断函数，无权限的操作会被隐藏。
+
+<DemoPreview dir="demos/vben-table-action/permission" />
+
+## 在 vxe-table 中使用
+
+不改变 vxe-table 原有渲染方式，推荐在列配置中声明插槽，在页面通过插槽渲染。
+
+::: tip 推荐：使用适配器封装的版本项目的 `#/adapter/vxe-table` 已对 `VbenTableAction` 做了二次封装，内部统一注入了 `hasPermission`（基于 `useAccess().hasAccessByCodes`）。因此从适配器引入时**无需再传入 `:has-permission`**，只需通过操作项的 `auth` 字段声明权限码即可。:::
+
+```ts
+// data.ts —— 列配置声明插槽
+{
+  align: 'center',
+  field: 'operation',
+  fixed: 'right',
+  slots: { default: 'action' },
+  title: $t('system.user.operation'),
+  width: 180,
+}
+```
+
+```vue
+<!-- list.vue —— 从适配器引入，权限自动注入，无需传入 has-permission -->
+<script setup lang="ts">
+import { VbenTableAction } from '#/adapter/vxe-table';
+</script>
+
+<template>
+  <Grid>
+    <template #action="{ row }">
+      <template #action="{ row }">
+        <VbenTableAction
+          :actions="[
+            {
+              text: $t('common.detail'),
+              icon: 'lucide:eye',
+              onClick: () => onDetail(row),
+            },
+            {
+              text: $t('common.edit'),
+              icon: 'lucide:edit',
+              onClick: () => onEdit(row),
+            },
+          ]"
+          :dropdown-actions="[
+            {
+              text: $t('common.delete'),
+              icon: 'lucide:trash-2',
+              danger: true,
+              onClick: () => onDelete(row),
+              auth: ['AC_100100'],
+            },
+          ]"
+          align="center"
+        />
+      </template>
+    </template>
+  </Grid>
+</template>
+```
+
+若直接从 `@vben/common-ui` 引入核心组件（不经过适配器），组件不依赖任何业务逻辑，需自行注入 `hasPermission`：
+
+```vue
+<script setup lang="ts">
+import { useAccess } from '@vben/access';
+import { VbenTableAction } from '@vben/common-ui';
+
+const { hasAccessByCodes } = useAccess();
+function hasPermission(auth?: string | string[]) {
+  if (!auth) return true;
+  return hasAccessByCodes(Array.isArray(auth) ? auth : [auth]);
+}
+</script>
+
+<template>
+  <VbenTableAction
+    v-bind="useActions(row, onActionClick)"
+    :has-permission="hasPermission"
+    align="center"
+  />
+</template>
+```
+
+## API
+
+### TableAction Props
+
+| 属性名 | 描述 | 类型 | 默认值 |
+| --- | --- | --- | --- |
+| actions | 主操作按钮 | `ActionItem[]` | `[]` |
+| dropdownActions | 「更多」下拉中的操作 | `ActionItem[]` | `[]` |
+| align | 对齐方式 | `'start' \| 'center' \| 'end'` | `'end'` |
+| divider | 按钮之间是否显示分割线 | `boolean` | `false` |
+| moreText | 「更多」按钮文案（提供时显示在图标右侧） | `string` | - |
+| hasPermission | 权限判断函数，返回 `false` 则隐藏对应 `auth` 的操作（从 `#/adapter/vxe-table` 引入时已自动注入，无需手动传入） | `(auth?: string \| string[]) => boolean` | - |
+| class | 根节点自定义类名 | `string` | - |
+
+### ActionItem
+
+| 属性名 | 描述 | 类型 | 默认值 |
+| --- | --- | --- | --- |
+| text | 按钮文本 | `string` | - |
+| icon | 图标组件 | `string`\| `VbenIcon` | - |
+| onClick | 点击回调 | `() => void` | - |
+| auth | 权限码，配合 `hasPermission` 过滤 | `string \| string[]` | - |
+| ifShow | 是否显示 | `boolean \| (() => boolean)` | `true` |
+| disabled | 是否禁用 | `boolean` | `false` |
+| loading | 加载状态 | `boolean` | `false` |
+| danger | 危险操作（红色文字） | `boolean` | `false` |
+| tooltip | 提示 | `string \| { content: string; side?: 'top' \| 'bottom' \| 'left' \| 'right' }` | - |
+| popConfirm | 气泡确认 | `TableActionPopConfirm` | - |
+| variant | 按钮样式变体 | `ButtonVariants['variant']` | `'link'` |
+| size | 按钮尺寸 | `ButtonVariants['size']` | `'sm'` |
+| key | 唯一标识 | `string \| number` | - |
+
+### TableActionPopConfirm
+
+| 属性名 | 描述 | 类型 | 默认值 |
+| --- | --- | --- | --- |
+| title | 提示标题 | `string` | `'Are you sure?'` |
+| okText | 确认按钮文案 | `string` | `'OK'` |
+| cancelText | 取消按钮文案 | `string` | `'Cancel'` |
+| confirm | 确认回调；未提供时回退到 `action.onClick` | `() => void` | - |
diff --git a/docs/src/components/common-ui/vben-tiptap.md b/docs/src/components/common-ui/vben-tiptap.md
new file mode 100644
index 00000000..84b84ad1
--- /dev/null
+++ b/docs/src/components/common-ui/vben-tiptap.md
@@ -0,0 +1,199 @@
+---
+outline: deep
+---
+
+# Vben Tiptap 富文本编辑器
+
+基于 [Tiptap](https://tiptap.dev/) 构建的富文本编辑器组件，支持丰富的文本格式化、图片插入、图片上传等功能。
+
+> 如果文档内没有参数说明，可以尝试在在线示例内寻找
+
+::: info 写在前面
+
+如果你觉得现有组件的封装不够理想，或者不完全符合你的需求，可以直接使用原生组件，亦或亲手封装一个适合的组件。框架提供的组件并非束缚，使用与否，完全取决于你的需求与自由。
+
+:::
+
+## 基础用法
+
+<DemoPreview dir="demos/vben-tiptap/basic" />
+
+## 组件列表
+
+### VbenTiptap
+
+富文本编辑器主组件。
+
+### VbenTiptapPreview
+
+富文本内容预览组件，用于只读展示编辑器内容。
+
+## API
+
+### Props
+
+| 属性名 | 说明 | 类型 | 默认值 |
+| --- | --- | --- | --- |
+| `modelValue` (v-model) | 编辑器内容（HTML字符串） | `string` | `''` |
+| `editable` | 是否可编辑 | `boolean` | `true` |
+| `toolbar` | 是否显示工具栏 | `boolean` | `true` |
+| `previewable` | 是否显示预览按钮 | `boolean` | `true` |
+| `placeholder` | 占位提示文本 | `string` | - |
+| `minHeight` | 最小高度 | `number \| string` | `240` |
+| `maxHeight` | 最大高度 | `number \| string` | `400` |
+| `extensions` | 自定义 Tiptap 扩展配置 | `Extensions` | - |
+| `imageUpload` | 图片上传配置 | `ImageUploadOptions` | - |
+
+### Events
+
+| 事件名   | 说明           | 参数类型                |
+| -------- | -------------- | ----------------------- |
+| `change` | 内容变化时触发 | `VbenTiptapChangeEvent` |
+
+#### VbenTiptapChangeEvent
+
+```ts
+interface VbenTiptapChangeEvent {
+  html: string; // HTML 内容
+  json: JSONContent; // JSON 结构内容
+  text: string; // 纯文本内容
+}
+```
+
+### ImageUploadOptions
+
+图片上传配置项：
+
+```ts
+interface ImageUploadOptions {
+  /** 允许的文件类型，默认 'image/*' */
+  accept?: string;
+  /** 最大文件大小(字节)，默认 5MB */
+  maxSize?: number;
+  /** 上传失败回调，未提供时使用 alert 弹窗提示 */
+  onUploadError?: (error: unknown) => void;
+  /** 上传函数，返回图片 URL */
+  upload: (
+    file: File,
+    onProgress?: (percent: number) => void,
+  ) => Promise<string>;
+}
+```
+
+### VbenTiptapPreview Props
+
+| 属性名      | 说明               | 类型               | 默认值 |
+| ----------- | ------------------ | ------------------ | ------ |
+| `content`   | 要预览的 HTML 内容 | `string`           | `''`   |
+| `minHeight` | 最小高度           | `number \| string` | `160`  |
+| `class`     | 自定义类名         | `any`              | -      |
+
+## 工具栏功能
+
+编辑器工具栏提供以下功能：
+
+### 格式化
+
+- **撤销/重做** - 撤销或重做编辑操作
+- **清除格式** - 清除选中文本的所有格式
+- **粗体** - 加粗文本
+- **斜体** - 斜体文本
+- **下划线** - 下划线文本
+- **删除线** - 删除线文本
+- **行内代码** - 行内代码标记
+
+### 结构
+
+- **标题** - 段落、H1-H4 标题切换
+- **有序列表** - 有序编号列表
+- **无序列表** - 无序符号列表
+- **引用块** - 引用块样式
+- **代码块** - 多行代码块
+
+### 链接与图片
+
+- **插入链接** - 插入或编辑超链接
+- **移除链接** - 移除选中文本的链接
+- **插入图片** - 通过 URL 插入图片
+
+### 样式
+
+- **文字颜色** - 设置文字颜色（预设色板）
+- **背景颜色** - 设置文字背景高亮颜色
+
+### 对齐
+
+- **左对齐** - 文本左对齐
+- **居中对齐** - 文本居中对齐
+- **右对齐** - 文本右对齐
+
+### 其他
+
+- **预览** - 在弹窗中预览编辑内容
+
+## 图片上传
+
+<DemoPreview dir="demos/vben-tiptap/image-upload" />
+
+当配置 `imageUpload` 时，工具栏的图片按钮会变为下拉菜单，包含「本地上传」和「URL 插入」两个选项。
+
+### 上传方式
+
+支持三种图片上传方式：
+
+1. **文件选择** - 点击工具栏本地上传按钮
+2. **拖拽上传** - 直接拖拽图片到编辑器区域
+3. **粘贴上传** - 粘贴图片到编辑器
+
+### 上传进度显示
+
+上传过程中会显示：
+
+- **加载指示器** - 旋转动画指示上传进行中
+- **进度条** - 当上传函数提供 `onProgress` 回调时，显示进度条
+
+### 文件校验
+
+- `accept` - 指定允许的文件类型（MIME类型）
+- `maxSize` - 最大文件大小限制（字节）
+- 校验失败时会触发 `onUploadError` 回调或默认 alert 提示
+
+::: warning 注意事项
+
+- 仅支持单张图片上传，多图拖拽/粘贴时会提示并仅处理第一张
+- 上传中不要保存编辑器内容（`getHTML()`），因为此时图片 URL 为临时 blob URL
+- 自定义 `extensions` 时，图片上传功能将不显示（因为可能缺少 uploadImage 命令）
+
+:::
+
+## 自定义扩展
+
+通过 `extensions` 属性可以传入自定义的 Tiptap 扩展配置：
+
+```vue
+<script setup lang="ts">
+import { VbenTiptap } from '@vben/plugins/tiptap';
+import StarterKit from '@tiptap/starter-kit';
+import Underline from '@tiptap/extension-underline';
+
+const extensions = [
+  StarterKit,
+  Underline,
+  // 其他扩展...
+];
+</script>
+
+<template>
+  <VbenTiptap v-model="content" :extensions="extensions" />
+</template>
+```
+
+::: warning 自定义扩展注意事项
+
+使用自定义 `extensions` 时：
+
+- 默认扩展配置将不会生效
+- 图片上传功能不可用（工具栏不显示上传选项）
+- 需自行配置所需的编辑器功能
+
+:::
diff --git a/docs/src/demos/vben-alert/alert/index.vue b/docs/src/demos/vben-alert/alert/index.vue
new file mode 100644
index 00000000..89ae1608
--- /dev/null
+++ b/docs/src/demos/vben-alert/alert/index.vue
@@ -0,0 +1,36 @@
+<script lang="ts" setup>
+import { h } from 'vue';
+
+import { alert, VbenButton } from '@vben/common-ui';
+
+import { Result } from 'antdv-next';
+
+function showAlert() {
+  alert('This is an alert message');
+}
+
+function showIconAlert() {
+  alert({
+    content: 'This is an alert message with icon',
+    icon: 'success',
+  });
+}
+
+function showCustomAlert() {
+  alert({
+    buttonAlign: 'center',
+    content: h(Result, {
+      status: 'success',
+      subTitle: '已成功创建订单。订单ID：2017182818828182881',
+      title: '操作成功',
+    }),
+  });
+}
+</script>
+<template>
+  <div class="flex gap-4">
+    <VbenButton @click="showAlert">Alert</VbenButton>
+    <VbenButton @click="showIconAlert">Alert With Icon</VbenButton>
+    <VbenButton @click="showCustomAlert">Alert With Custom Content</VbenButton>
+  </div>
+</template>
diff --git a/docs/src/demos/vben-alert/confirm/index.vue b/docs/src/demos/vben-alert/confirm/index.vue
new file mode 100644
index 00000000..4264f9dc
--- /dev/null
+++ b/docs/src/demos/vben-alert/confirm/index.vue
@@ -0,0 +1,75 @@
+<script lang="ts" setup>
+import { h, ref } from 'vue';
+
+import { alert, confirm, VbenButton } from '@vben/common-ui';
+
+import { Checkbox, message } from 'antdv-next';
+
+function showConfirm() {
+  confirm('This is an alert message')
+    .then(() => {
+      alert('Confirmed');
+    })
+    .catch(() => {
+      alert('Canceled');
+    });
+}
+
+function showIconConfirm() {
+  confirm({
+    content: 'This is an alert message with icon',
+    icon: 'success',
+  });
+}
+
+function showfooterConfirm() {
+  const checked = ref(false);
+  confirm({
+    cancelText: '不要虾扯蛋',
+    confirmText: '是的，我们都是NPC',
+    content:
+      '刚才发生的事情，为什么我似乎早就经历过一般？\n我甚至能在事情发生过程中潜意识里预知到接下来会发生什么。\n\n听起来挺玄乎的，你有过这种感觉吗？',
+    footer: () =>
+      h(
+        Checkbox,
+        {
+          checked: checked.value,
+          class: 'flex-1',
+          'onUpdate:checked': (v) => (checked.value = v),
+        },
+        '不再提示',
+      ),
+    icon: 'question',
+    title: '未解之谜',
+  }).then(() => {
+    if (checked.value) {
+      message.success('我不会再拿这个问题烦你了');
+    } else {
+      message.info('下次还要继续问你哟');
+    }
+  });
+}
+
+function showAsyncConfirm() {
+  confirm({
+    beforeClose({ isConfirm }) {
+      if (isConfirm) {
+        // 这里可以执行一些异步操作。如果最终返回了false，将阻止关闭弹窗
+        return new Promise((resolve) => setTimeout(resolve, 2000));
+      }
+    },
+    content: 'This is an alert message with async confirm',
+    icon: 'success',
+  }).then(() => {
+    alert('Confirmed');
+  });
+}
+</script>
+<template>
+  <div class="flex gap-4">
+    <VbenButton @click="showConfirm">Confirm</VbenButton>
+    <VbenButton @click="showIconConfirm">Confirm With Icon</VbenButton>
+    <VbenButton @click="showfooterConfirm">Confirm With Footer</VbenButton>
+    <VbenButton @click="showAsyncConfirm">Async Confirm</VbenButton>
+  </div>
+</template>
diff --git a/docs/src/demos/vben-alert/prompt/index.vue b/docs/src/demos/vben-alert/prompt/index.vue
new file mode 100644
index 00000000..7e807d06
--- /dev/null
+++ b/docs/src/demos/vben-alert/prompt/index.vue
@@ -0,0 +1,118 @@
+<script lang="ts" setup>
+import { h } from 'vue';
+
+import { alert, prompt, useAlertContext, VbenButton } from '@vben/common-ui';
+
+import { BadgeJapaneseYen } from '@lucide/vue';
+import { Input, RadioGroup, Select } from 'antdv-next';
+
+function showPrompt() {
+  prompt({
+    content: '请输入一些东西',
+  })
+    .then((val) => {
+      alert(`已收到你的输入：${val}`);
+    })
+    .catch(() => {
+      alert('Canceled');
+    });
+}
+
+function showSlotsPrompt() {
+  prompt({
+    component: () => {
+      // 获取弹窗上下文。注意：只能在setup或者函数式组件中调用
+      const { doConfirm } = useAlertContext();
+      return h(
+        Input,
+        {
+          onKeydown(e: KeyboardEvent) {
+            if (e.key === 'Enter') {
+              e.preventDefault();
+              // 调用弹窗提供的确认方法
+              doConfirm();
+            }
+          },
+          placeholder: '请输入',
+          prefix: '充值金额：',
+          type: 'number',
+        },
+        {
+          addonAfter: () => h(BadgeJapaneseYen),
+        },
+      );
+    },
+    content:
+      '此弹窗演示了如何使用自定义插槽，并且可以使用useAlertContext获取到弹窗的上下文。\n在输入框中按下回车键会触发确认操作。',
+    icon: 'question',
+    modelPropName: 'value',
+  }).then((val) => {
+    if (val) alert(`你输入的是${val}`);
+  });
+}
+
+function showSelectPrompt() {
+  prompt({
+    component: Select,
+    componentProps: {
+      options: [
+        { label: 'Option A', value: 'Option A' },
+        { label: 'Option B', value: 'Option B' },
+        { label: 'Option C', value: 'Option C' },
+      ],
+      placeholder: '请选择',
+      // 弹窗会设置body的pointer-events为none，这回影响下拉框的点击事件
+      popupClassName: 'pointer-events-auto',
+    },
+    content: '此弹窗演示了如何使用component传递自定义组件',
+    icon: 'question',
+    modelPropName: 'value',
+  }).then((val) => {
+    if (val) {
+      alert(`你选择了${val}`);
+    }
+  });
+}
+
+function sleep(ms: number) {
+  return new Promise((resolve) => setTimeout(resolve, ms));
+}
+
+function showAsyncPrompt() {
+  prompt({
+    async beforeClose(scope) {
+      if (scope.isConfirm) {
+        if (scope.value) {
+          // 模拟异步操作，如果不成功，可以返回false
+          await sleep(2000);
+        } else {
+          alert('请选择一个选项');
+          return false;
+        }
+      }
+    },
+    component: RadioGroup,
+    componentProps: {
+      class: 'flex flex-col',
+      options: [
+        { label: 'Option 1', value: 'option1' },
+        { label: 'Option 2', value: 'option2' },
+        { label: 'Option 3', value: 'option3' },
+      ],
+    },
+    content: '选择一个选项后再点击[确认]',
+    icon: 'question',
+    modelPropName: 'value',
+  }).then((val) => {
+    alert(`${val} 已设置。`);
+  });
+}
+</script>
+<template>
+  <div class="flex gap-4">
+    <VbenButton @click="showPrompt">Prompt</VbenButton>
+    <VbenButton @click="showSlotsPrompt"> Prompt With slots </VbenButton>
+    <VbenButton @click="showSelectPrompt">Prompt With Select</VbenButton>
+    <VbenButton @click="showAsyncPrompt">Prompt With Async</VbenButton>
+  </div>
+</template>
diff --git a/docs/src/demos/vben-api-component/cascader/index.vue b/docs/src/demos/vben-api-component/cascader/index.vue
index 957964cd..e7e85681 100644
--- a/docs/src/demos/vben-api-component/cascader/index.vue
+++ b/docs/src/demos/vben-api-component/cascader/index.vue
@@ -1,7 +1,7 @@
 <script lang="ts" setup>
 import { ApiComponent } from '@vben/common-ui';
 
-import { Cascader } from 'ant-design-vue';
+import { Cascader } from 'antdv-next';
 
 const treeData: Record<string, any> = [
   {
diff --git a/docs/src/demos/vben-cropper/aspect-ratio/index.vue b/docs/src/demos/vben-cropper/aspect-ratio/index.vue
new file mode 100644
index 00000000..8c28174a
--- /dev/null
+++ b/docs/src/demos/vben-cropper/aspect-ratio/index.vue
@@ -0,0 +1,102 @@
+<script lang="ts" setup>
+import { onBeforeUnmount, ref } from 'vue';
+
+import { VCropper } from '@vben/common-ui';
+
+const cropperRef = ref<InstanceType<typeof VCropper>>();
+const aspectRatio = ref('1:1');
+const imageUrl = ref('https://picsum.photos/seed/cropper-ratio/800/600');
+const croppedImage = ref('');
+
+const aspectOptions = [
+  { label: '1:1 (正方形)', value: '1:1' },
+  { label: '16:9 (宽屏)', value: '16:9' },
+  { label: '4:3 (标准)', value: '4:3' },
+  { label: '3:4 (竖版)', value: '3:4' },
+  { label: '3:2 (照片)', value: '3:2' },
+];
+
+// 释放旧的 object URL 以避免内存泄漏
+const revokeCroppedImage = () => {
+  if (croppedImage.value?.startsWith('blob:')) {
+    URL.revokeObjectURL(croppedImage.value);
+  }
+};
+
+const handleCrop = async () => {
+  const blob = await cropperRef.value?.getCropImage('image/jpeg', 0.9, 'blob');
+  if (blob instanceof Blob) {
+    // 释放旧的 URL
+    revokeCroppedImage();
+    croppedImage.value = URL.createObjectURL(blob);
+  }
+};
+
+const handleReset = () => {
+  // 释放 URL
+  revokeCroppedImage();
+  croppedImage.value = '';
+  imageUrl.value = `https://picsum.photos/seed/cropper-${Date.now()}/800/600`;
+};
+
+// 组件卸载时清理
+onBeforeUnmount(() => {
+  revokeCroppedImage();
+});
+</script>
+
+<template>
+  <div>
+    <div class="mb-4">
+      <label class="text-sm text-gray-500 mr-2">选择比例:</label>
+      <select v-model="aspectRatio" class="px-3 py-1 border rounded text-sm">
+        <option
+          v-for="option in aspectOptions"
+          :key="option.value"
+          :value="option.value"
+        >
+          {{ option.label }}
+        </option>
+      </select>
+    </div>
+
+    <VCropper
+      ref="cropperRef"
+      :img="imageUrl"
+      :width="500"
+      :height="300"
+      :aspect-ratio="aspectRatio"
+    />
+
+    <div class="mt-4 flex gap-2">
+      <button
+        class="px-4 py-2 bg-blue-500 rounded hover:bg-blue-600"
+        @click="handleCrop"
+      >
+        裁剪图片
+      </button>
+      <button
+        class="px-4 py-2 bg-gray-500 rounded hover:bg-gray-600"
+        @click="handleReset"
+      >
+        重置
+      </button>
+    </div>
+
+    <div v-if="croppedImage" class="mt-4">
+      <p class="text-sm text-gray-500 mb-2">
+        裁剪结果 (比例: {{ aspectRatio }}):
+      </p>
+      <img :src="croppedImage" class="max-w-full rounded border" />
+    </div>
+
+    <div class="mt-4">
+      <p class="text-sm text-gray-500">提示:</p>
+      <ul class="mt-2 text-xs text-gray-400 list-disc pl-4">
+        <li>设置固定比例后，裁剪框始终维持该比例</li>
+        <li>切换比例会自动重新计算裁剪框大小</li>
+        <li>比例格式为 "宽:高"，如 "16:9"</li>
+      </ul>
+    </div>
+  </div>
+</template>
diff --git a/docs/src/demos/vben-cropper/basic/index.vue b/docs/src/demos/vben-cropper/basic/index.vue
new file mode 100644
index 00000000..332a1c35
--- /dev/null
+++ b/docs/src/demos/vben-cropper/basic/index.vue
@@ -0,0 +1,70 @@
+<script lang="ts" setup>
+import { onBeforeUnmount, ref } from 'vue';
+
+import { VCropper } from '@vben/common-ui';
+
+const cropperRef = ref<InstanceType<typeof VCropper>>();
+const imageUrl = ref('https://picsum.photos/seed/cropper-demo/800/600');
+const croppedImage = ref('');
+
+// 释放旧的 object URL 以避免内存泄漏
+const revokeCroppedImage = () => {
+  if (croppedImage.value?.startsWith('blob:')) {
+    URL.revokeObjectURL(croppedImage.value);
+  }
+};
+
+const handleCrop = async () => {
+  const blob = await cropperRef.value?.getCropImage('image/jpeg', 0.9, 'blob');
+  if (blob instanceof Blob) {
+    // 释放旧的 URL
+    revokeCroppedImage();
+    croppedImage.value = URL.createObjectURL(blob);
+  }
+};
+
+const handleReset = () => {
+  // 释放 URL
+  revokeCroppedImage();
+  croppedImage.value = '';
+  // 重新加载图片以重置裁剪框
+  imageUrl.value = `https://picsum.photos/seed/cropper-${Date.now()}/800/600`;
+};
+
+// 组件卸载时清理
+onBeforeUnmount(() => {
+  revokeCroppedImage();
+});
+</script>
+
+<template>
+  <div>
+    <VCropper ref="cropperRef" :img="imageUrl" :width="500" :height="300" />
+    <div class="mt-4 flex gap-2">
+      <button
+        class="px-4 py-2 bg-blue-500 rounded hover:bg-blue-600"
+        @click="handleCrop"
+      >
+        裁剪图片
+      </button>
+      <button
+        class="px-4 py-2 bg-gray-500 rounded hover:bg-gray-600"
+        @click="handleReset"
+      >
+        重置
+      </button>
+    </div>
+    <div v-if="croppedImage" class="mt-4">
+      <p class="text-sm text-gray-500 mb-2">裁剪结果:</p>
+      <img :src="croppedImage" class="max-w-full rounded border" />
+    </div>
+    <div class="mt-4">
+      <p class="text-sm text-gray-500">提示:</p>
+      <ul class="mt-2 text-xs text-gray-400 list-disc pl-4">
+        <li>拖拽裁剪框中心区域可移动裁剪位置</li>
+        <li>拖拽四角或四边可调整裁剪框大小</li>
+        <li>默认为自由比例，可调整为任意比例</li>
+      </ul>
+    </div>
+  </div>
+</template>
diff --git a/docs/src/demos/vben-descriptions/basic/index.vue b/docs/src/demos/vben-descriptions/basic/index.vue
new file mode 100644
index 00000000..8b73fe63
--- /dev/null
+++ b/docs/src/demos/vben-descriptions/basic/index.vue
@@ -0,0 +1,18 @@
+<script lang="ts" setup>
+import { VbenDescriptions } from '@vben/common-ui';
+
+const items = [
+  { content: 'Vben', label: '用户名' },
+  { content: '13800138000', label: '手机号' },
+  { content: '中国 · 杭州', label: '居住地' },
+  { content: '前端工程师', label: '职位' },
+  {
+    content: '这是一段较长的备注信息，用于演示跨列展示。',
+    label: '备注',
+    span: 3,
+  },
+];
+</script>
+<template>
+  <VbenDescriptions :items="items" />
+</template>
diff --git a/docs/src/demos/vben-descriptions/bordered/index.vue b/docs/src/demos/vben-descriptions/bordered/index.vue
new file mode 100644
index 00000000..08215729
--- /dev/null
+++ b/docs/src/demos/vben-descriptions/bordered/index.vue
@@ -0,0 +1,22 @@
+<script lang="ts" setup>
+import { VbenDescriptions } from '@vben/common-ui';
+
+const items = [
+  { content: 'Vben', label: '用户名' },
+  { content: '13800138000', label: '手机号' },
+  { content: '正常', label: '状态' },
+  { content: '中国 · 杭州', label: '居住地' },
+  {
+    content: '浙江省杭州市西湖区某某街道某某小区 1 幢 2 单元',
+    label: '地址',
+    span: 3,
+  },
+];
+</script>
+<template>
+  <VbenDescriptions bordered title="用户信息" :items="items">
+    <template #extra>
+      <span style="color: #1677ff; cursor: pointer">编辑</span>
+    </template>
+  </VbenDescriptions>
+</template>
diff --git a/docs/src/demos/vben-descriptions/custom/index.vue b/docs/src/demos/vben-descriptions/custom/index.vue
new file mode 100644
index 00000000..cd93ea0f
--- /dev/null
+++ b/docs/src/demos/vben-descriptions/custom/index.vue
@@ -0,0 +1,17 @@
+<script lang="ts" setup>
+import { VbenDescriptions, VbenDescriptionsItem } from '@vben/common-ui';
+</script>
+<template>
+  <!-- 通过子组件 VbenDescriptionsItem 声明列表项 -->
+  <VbenDescriptions bordered :column="2">
+    <VbenDescriptionsItem label="用户名">Vben</VbenDescriptionsItem>
+    <VbenDescriptionsItem label="状态">
+      <span style="color: #52c41a">● 正常</span>
+    </VbenDescriptionsItem>
+    <VbenDescriptionsItem label="备注" :span="2">
+      <template #content>
+        <span style="color: #888">通过 #content 插槽自定义内容</span>
+      </template>
+    </VbenDescriptionsItem>
+  </VbenDescriptions>
+</template>
diff --git a/docs/src/demos/vben-descriptions/size/index.vue b/docs/src/demos/vben-descriptions/size/index.vue
new file mode 100644
index 00000000..cfb70dc4
--- /dev/null
+++ b/docs/src/demos/vben-descriptions/size/index.vue
@@ -0,0 +1,35 @@
+<script lang="ts" setup>
+import { VbenDescriptions } from '@vben/common-ui';
+
+const items = [
+  { content: 'Vben', label: '用户名' },
+  { content: '13800138000', label: '手机号' },
+  { content: '中国 · 杭州', label: '居住地' },
+  { content: '前端工程师', label: '职位' },
+];
+</script>
+<template>
+  <div class="flex gap-4 flex-col">
+    <VbenDescriptions
+      size="small"
+      bordered
+      title="Small"
+      :column="2"
+      :items="items"
+    />
+    <VbenDescriptions
+      size="middle"
+      bordered
+      title="Middle"
+      :column="2"
+      :items="items"
+    />
+    <VbenDescriptions
+      size="large"
+      bordered
+      title="Large"
+      :column="2"
+      :items="items"
+    />
+  </div>
+</template>
diff --git a/docs/src/demos/vben-descriptions/span/index.vue b/docs/src/demos/vben-descriptions/span/index.vue
new file mode 100644
index 00000000..07248f97
--- /dev/null
+++ b/docs/src/demos/vben-descriptions/span/index.vue
@@ -0,0 +1,17 @@
+<script lang="ts" setup>
+import type { DescriptionsItemType } from '@vben/common-ui';
+
+import { VbenDescriptions } from '@vben/common-ui';
+
+const items: DescriptionsItemType[] = [
+  { content: '1', label: 'A' },
+  { content: '2（span: 2）', label: 'B', span: 2 },
+  { content: '3', label: 'C' },
+  { content: '占满当前行剩余空间', label: 'D（span: filled）', span: 'filled' },
+  { content: '5', label: 'E' },
+];
+</script>
+<template>
+  <!-- 列数随断点变化：xs 1 列、sm 2 列、md 及以上 3 列 -->
+  <VbenDescriptions bordered :column="{ md: 3, sm: 2, xs: 1 }" :items="items" />
+</template>
diff --git a/docs/src/demos/vben-descriptions/vertical/index.vue b/docs/src/demos/vben-descriptions/vertical/index.vue
new file mode 100644
index 00000000..ae1756d3
--- /dev/null
+++ b/docs/src/demos/vben-descriptions/vertical/index.vue
@@ -0,0 +1,15 @@
+<script lang="ts" setup>
+import type { DescriptionsItemType } from '@vben/common-ui';
+
+import { VbenDescriptions } from '@vben/common-ui';
+
+const items: DescriptionsItemType[] = [
+  { content: 'Vben', label: '用户名' },
+  { content: '13800138000', label: '手机号' },
+  { content: '中国 · 杭州', label: '居住地' },
+  { content: '这是一段较长的备注信息。', label: '备注', span: 3 },
+];
+</script>
+<template>
+  <VbenDescriptions bordered layout="vertical" :items="items" />
+</template>
diff --git a/docs/src/demos/vben-ellipsis-text/auto-display/index.vue b/docs/src/demos/vben-ellipsis-text/auto-display/index.vue
new file mode 100644
index 00000000..fb5a32a5
--- /dev/null
+++ b/docs/src/demos/vben-ellipsis-text/auto-display/index.vue
@@ -0,0 +1,16 @@
+<script lang="ts" setup>
+import { EllipsisText } from '@vben/common-ui';
+
+const text = `
+Vben Admin 是一个基于 Vue3.0、Vite、 TypeScript 的后台解决方案，目标是为开发中大型项目提供开箱即用的解决方案。
+`;
+</script>
+<template>
+  <EllipsisText :line="2" :tooltip-when-ellipsis="true">
+    {{ text }}
+  </EllipsisText>
+
+  <EllipsisText :line="3" :tooltip-when-ellipsis="true">
+    {{ text }}
+  </EllipsisText>
+</template>
diff --git a/docs/src/demos/vben-form/value-format/index.vue b/docs/src/demos/vben-form/value-format/index.vue
new file mode 100644
index 00000000..559099dc
--- /dev/null
+++ b/docs/src/demos/vben-form/value-format/index.vue
@@ -0,0 +1,168 @@
+<script lang="ts" setup>
+import { computed, nextTick, onMounted, ref } from 'vue';
+
+import { Button, Card, message, Space, Tag } from 'antdv-next';
+
+import { useVbenForm } from '#/adapter/form';
+
+interface ValueFormatFormValues {
+  firstName?: string;
+  lastName?: string;
+  tags?: string[];
+}
+
+function encodeValueFormatValues(values: Readonly<ValueFormatFormValues>) {
+  return {
+    fullName: [values.firstName, values.lastName].filter(Boolean).join(' '),
+    tags: (values.tags ?? []).join(','),
+  };
+}
+
+type ValueFormatSubmitValues = ReturnType<typeof encodeValueFormatValues>;
+
+function decodeValueFormatValues(
+  values: Readonly<ValueFormatSubmitValues>,
+): ValueFormatFormValues {
+  const [firstName = '', ...lastNameParts] = values.fullName
+    .trim()
+    .split(/\s+/);
+  return {
+    firstName,
+    lastName: lastNameParts.join(' '),
+    tags: values.tags ? values.tags.split(',') : [],
+  };
+}
+
+const transformedValues = ref<Partial<ValueFormatSubmitValues>>({});
+const liveValues = ref<Partial<ValueFormatFormValues>>({});
+
+const [Form, formApi] = useVbenForm({
+  codec: {
+    decode: decodeValueFormatValues,
+    encode: encodeValueFormatValues,
+  },
+  commonConfig: {
+    componentProps: {
+      class: 'w-full',
+    },
+  },
+  handleSubmit,
+  handleValuesChange,
+  schema: [
+    {
+      component: 'Input',
+      fieldName: 'firstName',
+      help: '与姓氏一起编码为 fullName',
+      label: '名字',
+    },
+    {
+      component: 'Input',
+      fieldName: 'lastName',
+      help: '与名字一起编码为 fullName',
+      label: '姓氏',
+    },
+    {
+      component: 'Select',
+      componentProps: {
+        mode: 'multiple',
+        options: [
+          { label: '管理员', value: 'admin' },
+          { label: '审核员', value: 'reviewer' },
+          { label: '访客', value: 'guest' },
+        ],
+        placeholder: '请选择标签',
+      },
+      fieldName: 'tags',
+      help: '数组编码为逗号分隔字符串',
+      label: '标签',
+    },
+  ],
+  wrapperClass: 'grid-cols-1 md:grid-cols-2',
+});
+
+const liveValuesPreview = computed(() => formatJsonPreview(liveValues.value));
+
+const transformedValuesPreview = computed(() => {
+  return formatJsonPreview(transformedValues.value);
+});
+
+function formatJsonPreview(value: unknown) {
+  return JSON.stringify(value, null, 2);
+}
+
+async function handleInspectValues() {
+  await syncPreviewValues();
+  message.success('已刷新 getValues 输出');
+}
+
+async function handleSetSubmitValues() {
+  await formApi.setSubmitValues({
+    fullName: 'Ada Lovelace',
+    tags: 'admin,reviewer',
+  });
+  await syncPreviewValues();
+  message.success('已通过 codec.decode 回填提交值');
+}
+
+function handleSubmit(values: ValueFormatSubmitValues) {
+  transformedValues.value = values;
+  message.success({
+    content: `getValues output: ${JSON.stringify(values)}`,
+  });
+}
+
+function handleValuesChange(
+  values: Readonly<ValueFormatFormValues>,
+  _fieldsChanged: string[],
+  getFormattedValues: () => ValueFormatSubmitValues,
+) {
+  liveValues.value = { ...values };
+  transformedValues.value = getFormattedValues();
+}
+
+async function syncPreviewValues(values?: Readonly<ValueFormatFormValues>) {
+  const rawValues = values ?? (await formApi.getRawValues());
+  liveValues.value = { ...rawValues };
+  transformedValues.value = await formApi.getValues();
+}
+
+onMounted(async () => {
+  await nextTick();
+  await syncPreviewValues();
+});
+</script>
+
+<template>
+  <div class="space-y-4">
+    <div class="flex flex-wrap gap-2">
+      <Tag color="processing">encode：生成完整提交值</Tag>
+      <Tag color="success">decode：恢复完整表单值</Tag>
+      <Tag color="warning">多字段转换原子执行</Tag>
+    </div>
+
+    <Card title="Codec 示例">
+      <template #extra>
+        <Space wrap>
+          <Button @click="handleSetSubmitValues">从提交值回填</Button>
+          <Button type="primary" @click="handleInspectValues">
+            查看 getValues 输出
+          </Button>
+        </Space>
+      </template>
+      <Form />
+    </Card>
+
+    <div class="grid gap-4 lg:grid-cols-2">
+      <Card title="getRawValues() 输出（组件值）">
+        <pre class="bg-muted overflow-auto rounded-md p-4 text-sm">{{
+          liveValuesPreview
+        }}</pre>
+      </Card>
+      <Card title="getValues / submit 输出（codec.encode 后）">
+        <pre class="bg-muted overflow-auto rounded-md p-4 text-sm">{{
+          transformedValuesPreview
+        }}</pre>
+      </Card>
+    </div>
+  </div>
+</template>
diff --git a/docs/src/demos/vben-modal/animation-type/index.vue b/docs/src/demos/vben-modal/animation-type/index.vue
new file mode 100644
index 00000000..f364687b
--- /dev/null
+++ b/docs/src/demos/vben-modal/animation-type/index.vue
@@ -0,0 +1,36 @@
+<script lang="ts" setup>
+import { useVbenModal, VbenButton } from '@vben/common-ui';
+
+const [SlideModal, slideModalApi] = useVbenModal({
+  animationType: 'slide',
+});
+
+const [ScaleModal, scaleModalApi] = useVbenModal({
+  animationType: 'scale',
+});
+
+function openSlideModal() {
+  slideModalApi.open();
+}
+
+function openScaleModal() {
+  scaleModalApi.open();
+}
+</script>
+
+<template>
+  <div class="space-y-4">
+    <div class="flex gap-4">
+      <VbenButton @click="openSlideModal">滑动动画</VbenButton>
+      <VbenButton @click="openScaleModal">缩放动画</VbenButton>
+    </div>
+
+    <SlideModal title="滑动动画示例" class="w-125">
+      <p>这是使用滑动动画的弹窗，从顶部向下滑动进入。</p>
+    </SlideModal>
+
+    <ScaleModal title="缩放动画示例" class="w-125">
+      <p>这是使用缩放动画的弹窗，以缩放淡入淡出的方式显示。</p>
+    </ScaleModal>
+  </div>
+</template>
diff --git a/docs/src/demos/vben-table-action/basic/index.vue b/docs/src/demos/vben-table-action/basic/index.vue
new file mode 100644
index 00000000..b88cd4a1
--- /dev/null
+++ b/docs/src/demos/vben-table-action/basic/index.vue
@@ -0,0 +1,28 @@
+<script lang="ts" setup>
+import type { ActionItem } from '@vben/common-ui';
+
+import { ref } from 'vue';
+
+import { VbenTableAction } from '@vben/common-ui';
+
+const last = ref('无');
+
+const actions: ActionItem[] = [
+  { key: 'edit', onClick: () => (last.value = '编辑'), text: '编辑' },
+  { key: 'detail', onClick: () => (last.value = '详情'), text: '详情' },
+  {
+    danger: true,
+    key: 'delete',
+    onClick: () => (last.value = '删除'),
+    text: '删除',
+  },
+];
+</script>
+<template>
+  <div>
+    <VbenTableAction :actions="actions" align="start" divider />
+    <p style="margin-top: 8px; font-size: 13px; opacity: 0.7">
+      最近点击：{{ last }}
+    </p>
+  </div>
+</template>
diff --git a/docs/src/demos/vben-table-action/dropdown/index.vue b/docs/src/demos/vben-table-action/dropdown/index.vue
new file mode 100644
index 00000000..b7664e51
--- /dev/null
+++ b/docs/src/demos/vben-table-action/dropdown/index.vue
@@ -0,0 +1,44 @@
+<script lang="ts" setup>
+import type { ActionItem } from '@vben/common-ui';
+
+import { ref } from 'vue';
+
+import { VbenTableAction } from '@vben/common-ui';
+
+const last = ref('无');
+
+const actions: ActionItem[] = [
+  { key: 'edit', onClick: () => (last.value = '编辑'), text: '编辑' },
+];
+
+const dropdownActions: ActionItem[] = [
+  { key: 'copy', onClick: () => (last.value = '复制'), text: '复制' },
+  { key: 'export', onClick: () => (last.value = '导出'), text: '导出' },
+  {
+    danger: true,
+    key: 'remove',
+    // 下拉项同样支持气泡确认
+    popConfirm: {
+      cancelText: '取消',
+      confirm: () => (last.value = '已移除'),
+      okText: '确认',
+      title: '确定移除吗？',
+    },
+    text: '移除',
+  },
+];
+</script>
+<template>
+  <div>
+    <VbenTableAction
+      :actions="actions"
+      :dropdown-actions="dropdownActions"
+      align="start"
+      divider
+      more-text="更多"
+    />
+    <p style="margin-top: 8px; font-size: 13px; opacity: 0.7">
+      最近点击：{{ last }}
+    </p>
+  </div>
+</template>
diff --git a/docs/src/demos/vben-table-action/permission/index.vue b/docs/src/demos/vben-table-action/permission/index.vue
new file mode 100644
index 00000000..bce245ca
--- /dev/null
+++ b/docs/src/demos/vben-table-action/permission/index.vue
@@ -0,0 +1,28 @@
+<script lang="ts" setup>
+import type { ActionItem } from '@vben/common-ui';
+
+import { VbenTableAction } from '@vben/common-ui';
+
+// 模拟当前用户拥有的权限码
+const allow = new Set(['user:detail', 'user:edit']);
+
+function hasPermission(auth?: string | string[]) {
+  if (!auth) return true;
+  const codes = Array.isArray(auth) ? auth : [auth];
+  return codes.some((code) => allow.has(code));
+}
+
+const actions: ActionItem[] = [
+  { auth: 'user:edit', key: 'edit', text: '编辑' },
+  { auth: 'user:detail', key: 'detail', text: '详情' },
+  // 无 user:delete 权限，按钮被隐藏
+  { auth: 'user:delete', danger: true, key: 'delete', text: '删除（无权限）' },
+];
+</script>
+<template>
+  <VbenTableAction
+    :actions="actions"
+    :has-permission="hasPermission"
+    align="start"
+  />
+</template>
diff --git a/docs/src/demos/vben-table-action/popconfirm/index.vue b/docs/src/demos/vben-table-action/popconfirm/index.vue
new file mode 100644
index 00000000..513430ce
--- /dev/null
+++ b/docs/src/demos/vben-table-action/popconfirm/index.vue
@@ -0,0 +1,32 @@
+<script lang="ts" setup>
+import type { ActionItem } from '@vben/common-ui';
+
+import { ref } from 'vue';
+
+import { VbenTableAction } from '@vben/common-ui';
+
+const last = ref('无');
+
+const actions: ActionItem[] = [
+  { key: 'edit', onClick: () => (last.value = '编辑'), text: '编辑' },
+  {
+    danger: true,
+    key: 'delete',
+    popConfirm: {
+      cancelText: '取消',
+      confirm: () => (last.value = '已删除'),
+      okText: '确认',
+      title: '确定删除这一行吗？',
+    },
+    text: '删除',
+  },
+];
+</script>
+<template>
+  <div>
+    <VbenTableAction :actions="actions" align="start" />
+    <p style="margin-top: 8px; font-size: 13px; opacity: 0.7">
+      最近操作：{{ last }}
+    </p>
+  </div>
+</template>
diff --git a/docs/src/demos/vben-table-action/tooltip/index.vue b/docs/src/demos/vben-table-action/tooltip/index.vue
new file mode 100644
index 00000000..2bd75e28
--- /dev/null
+++ b/docs/src/demos/vben-table-action/tooltip/index.vue
@@ -0,0 +1,17 @@
+<script lang="ts" setup>
+import type { ActionItem } from '@vben/common-ui';
+
+import { VbenTableAction } from '@vben/common-ui';
+
+const actions: ActionItem[] = [
+  { key: 'edit', text: '编辑', tooltip: '编辑这一行' },
+  {
+    key: 'detail',
+    text: '详情',
+    tooltip: { content: '查看详情', side: 'top' },
+  },
+];
+</script>
+<template>
+  <VbenTableAction :actions="actions" align="start" />
+</template>
diff --git a/docs/src/demos/vben-tiptap/basic/index.vue b/docs/src/demos/vben-tiptap/basic/index.vue
new file mode 100644
index 00000000..fc7579a5
--- /dev/null
+++ b/docs/src/demos/vben-tiptap/basic/index.vue
@@ -0,0 +1,19 @@
+<script lang="ts" setup>
+import { ref } from 'vue';
+
+import { VbenTiptap } from '@vben/plugins/tiptap';
+
+const content = ref('<p>开始编辑你的内容...</p>');
+</script>
+
+<template>
+  <div>
+    <VbenTiptap v-model="content" />
+    <div class="mt-4">
+      <p class="text-sm text-gray-500">当前内容:</p>
+      <pre class="mt-2 p-2 bg-gray-100 rounded text-xs overflow-auto max-h-40">
+        {{ content }}
+      </pre>
+    </div>
+  </div>
+</template>
diff --git a/docs/src/demos/vben-tiptap/image-upload/index.vue b/docs/src/demos/vben-tiptap/image-upload/index.vue
new file mode 100644
index 00000000..db2bdf13
--- /dev/null
+++ b/docs/src/demos/vben-tiptap/image-upload/index.vue
@@ -0,0 +1,45 @@
+<script lang="ts" setup>
+import { ref } from 'vue';
+
+import { type ImageUploadOptions, VbenTiptap } from '@vben/plugins/tiptap';
+
+const content = ref('');
+
+// Mock upload function with progress simulation
+const imageUpload: ImageUploadOptions = {
+  accept: 'image/jpeg,image/png,image/gif,image/webp',
+  maxSize: 5 * 1024 * 1024, // 5MB
+  upload: async (_file, onProgress) => {
+    // Simulate upload progress
+    for (let i = 0; i <= 100; i += 10) {
+      await new Promise((resolve) => setTimeout(resolve, 100));
+      onProgress?.(i);
+    }
+
+    // Return a mock image URL (using picsum for demo)
+    return `https://picsum.photos/seed/${Date.now()}/800/400`;
+  },
+  onUploadError: (error) => {
+    console.error('Upload error:', error);
+  },
+};
+</script>
+
+<template>
+  <div>
+    <VbenTiptap
+      v-model="content"
+      :image-upload="imageUpload"
+      placeholder="尝试拖拽或粘贴图片..."
+    />
+    <div class="mt-4">
+      <p class="text-sm text-gray-500">提示:</p>
+      <ul class="mt-2 text-xs text-gray-400 list-disc pl-4">
+        <li>点击工具栏图片按钮可选择本地上传或 URL 插入</li>
+        <li>拖拽图片到编辑器区域可直接上传</li>
+        <li>粘贴图片也会触发上传</li>
+        <li>上传过程中会显示进度条</li>
+      </ul>
+    </div>
+  </div>
+</template>
diff --git a/docs/src/en/components/common-ui/vben-alert.md b/docs/src/en/components/common-ui/vben-alert.md
new file mode 100644
index 00000000..1ec4d77c
--- /dev/null
+++ b/docs/src/en/components/common-ui/vben-alert.md
@@ -0,0 +1,73 @@
+---
+outline: deep
+---
+
+# Vben Alert
+
+`Alert` provides lightweight JavaScript-driven dialogs for simple `alert`, `confirm`, and `prompt` style interactions.
+
+## Basic Usage
+
+Use `alert` for a single confirm button dialog:
+
+<DemoPreview dir="demos/vben-alert/alert" />
+
+Use `confirm` for confirm/cancel interactions:
+
+<DemoPreview dir="demos/vben-alert/confirm" />
+
+Use `prompt` when you need simple user input:
+
+<DemoPreview dir="demos/vben-alert/prompt" />
+
+## useAlertContext
+
+If `content`, `footer`, or `icon` is rendered through a custom component, you can call `useAlertContext()` inside that component to access the current dialog actions.
+
+| Method      | Description                | Type         |
+| ----------- | -------------------------- | ------------ |
+| `doConfirm` | trigger the confirm action | `() => void` |
+| `doCancel`  | trigger the cancel action  | `() => void` |
+
+## Core Types
+
+```ts
+export type IconType = 'error' | 'info' | 'question' | 'success' | 'warning';
+
+export type BeforeCloseScope = {
+  isConfirm: boolean;
+};
+
+export type AlertProps = {
+  beforeClose?: (
+    scope: BeforeCloseScope,
+  ) => boolean | Promise<boolean | undefined> | undefined;
+  bordered?: boolean;
+  buttonAlign?: 'center' | 'end' | 'start';
+  cancelText?: string;
+  centered?: boolean;
+  confirmText?: string;
+  containerClass?: string;
+  content: Component | string;
+  contentClass?: string;
+  contentMasking?: boolean;
+  footer?: Component | string;
+  icon?: Component | IconType;
+  overlayBlur?: number;
+  showCancel?: boolean;
+  title?: string;
+};
+
+export type PromptProps<T = any> = {
+  beforeClose?: (scope: {
+    isConfirm: boolean;
+    value: T | undefined;
+  }) => boolean | Promise<boolean | undefined> | undefined;
+  component?: Component;
+  componentProps?: Recordable<any>;
+  componentSlots?:
+    (() => any) | Recordable<unknown> | VNode | VNodeArrayChildren;
+  defaultValue?: T;
+  modelPropName?: string;
+} & Omit<AlertProps, 'beforeClose'>;
+```
diff --git a/docs/src/en/components/common-ui/vben-api-component.md b/docs/src/en/components/common-ui/vben-api-component.md
new file mode 100644
index 00000000..a38a9e18
--- /dev/null
+++ b/docs/src/en/components/common-ui/vben-api-component.md
@@ -0,0 +1,69 @@
+---
+outline: deep
+---
+
+# Vben ApiComponent
+
+`ApiComponent` is a wrapper used to attach remote-option loading behavior to an existing component while preserving the original component usage pattern.
+
+## Common Usage
+
+The current wrapper flow is:
+
+- pass the target component through `component`
+- fetch remote data through `api`
+- transform data through `beforeFetch` and `afterFetch`
+- map remote fields through `resultField`, `valueField`, `labelField`, and `childrenField`
+- pass normalized options to the target component through `optionsPropName`
+
+```vue
+<script lang="ts" setup>
+import { ApiComponent } from '@vben/common-ui';
+
+import { Cascader } from 'antdv-next';
+
+function fetchApi() {
+  return Promise.resolve([
+    {
+      label: 'Zhejiang',
+      value: 'zhejiang',
+      children: [{ label: 'Hangzhou', value: 'hangzhou' }],
+    },
+  ]);
+}
+</script>
+
+<template>
+  <ApiComponent
+    :api="fetchApi"
+    :component="Cascader"
+    :immediate="false"
+    children-field="children"
+    loading-slot="suffixIcon"
+    visible-event="onDropdownVisibleChange"
+  />
+</template>
+```
+
+## Current Props
+
+| Prop | Description | Type |
+| --- | --- | --- |
+| `component` | wrapped target component | `Component` |
+| `api` | remote request function | `(arg?: any) => Promise<any>` |
+| `params` | extra request params | `Record<string, any>` |
+| `beforeFetch` | hook before request | `AnyPromiseFunction` |
+| `afterFetch` | hook after request | `AnyPromiseFunction` |
+| `visibleEvent` | event name used to lazy-load data | `string` |
+| `loadingSlot` | slot name used to render the loading icon | `string` |
+| `modelPropName` | model prop name of the wrapped component | `string` |
+| `autoSelect` | auto-pick the first / last / only option, or use a custom function | `'first' \| 'last' \| 'one' \| ((items) => item) \| false` |
+
+## Exposed Methods
+
+| Method                   | Description                            |
+| ------------------------ | -------------------------------------- |
+| `getComponentRef()`      | returns the wrapped component instance |
+| `updateParam(newParams)` | merges and updates request params      |
+| `getOptions()`           | returns loaded options                 |
+| `getValue()`             | returns the current bound value        |
diff --git a/docs/src/en/components/common-ui/vben-count-to-animator.md b/docs/src/en/components/common-ui/vben-count-to-animator.md
new file mode 100644
index 00000000..615a417b
--- /dev/null
+++ b/docs/src/en/components/common-ui/vben-count-to-animator.md
@@ -0,0 +1,51 @@
+---
+outline: deep
+---
+
+# Vben CountToAnimator
+
+`CountToAnimator` renders animated number transitions.
+
+## Basic Usage
+
+Use `start-val`, `end-val`, and `duration` to control the animation range and timing.
+
+<DemoPreview dir="demos/vben-count-to-animator/basic" />
+
+## Formatting
+
+Use `prefix`, `suffix`, `separator`, and `decimal` to control how the number is displayed.
+
+<DemoPreview dir="demos/vben-count-to-animator/custom" />
+
+## Props
+
+| Prop | Description | Type | Default |
+| --- | --- | --- | --- |
+| `startVal` | starting value | `number` | `0` |
+| `endVal` | ending value | `number` | `2021` |
+| `duration` | animation duration in ms | `number` | `1500` |
+| `autoplay` | start automatically | `boolean` | `true` |
+| `prefix` | value prefix | `string` | `''` |
+| `suffix` | value suffix | `string` | `''` |
+| `separator` | thousands separator | `string` | `','` |
+| `decimal` | decimal separator | `string` | `'.'` |
+| `color` | text color | `string` | `''` |
+| `useEasing` | enable transition preset easing | `boolean` | `true` |
+| `transition` | transition preset name | `keyof typeof TransitionPresets` | `'linear'` |
+| `decimals` | decimal places to keep | `number` | `0` |
+
+## Events
+
+| Event        | Description                     | Type         |
+| ------------ | ------------------------------- | ------------ |
+| `started`    | fired when the animation starts | `() => void` |
+| `finished`   | fired when the animation ends   | `() => void` |
+| `onStarted`  | deprecated alias of `started`   | `() => void` |
+| `onFinished` | deprecated alias of `finished`  | `() => void` |
+
+## Exposed Methods
+
+| Method  | Description                       | Type         |
+| ------- | --------------------------------- | ------------ |
+| `reset` | reset to `startVal` and run again | `() => void` |
diff --git a/docs/src/en/components/common-ui/vben-cropper.md b/docs/src/en/components/common-ui/vben-cropper.md
new file mode 100644
index 00000000..ebddda31
--- /dev/null
+++ b/docs/src/en/components/common-ui/vben-cropper.md
@@ -0,0 +1,159 @@
+---
+outline: deep
+---
+
+# Vben Cropper Image Cropping
+
+`VCropper` is a pure native image cropping component that supports both free and fixed aspect ratio cropping, with method-based access to cropped results.
+
+> If some details are not obvious from the docs, check the live demos as well.
+
+::: info Note
+
+If you feel the current component implementation doesn't meet your needs, you can use native components directly or create your own component. The components provided by the framework are not constraints - use them at your discretion.
+
+:::
+
+## Basic Usage
+
+Basic image cropping with free aspect ratio adjustment.
+
+<DemoPreview dir="demos/vben-cropper/basic" />
+
+## Fixed Aspect Ratio
+
+Set the cropping ratio via the `aspectRatio` prop. The format is `"width:height"`, e.g. `"1:1"`, `"16:9"`, `"3:4"`.
+
+<DemoPreview dir="demos/vben-cropper/aspect-ratio" />
+
+## API
+
+### Props
+
+| Property      | Description                        | Type     | Default |
+| ------------- | ---------------------------------- | -------- | ------- |
+| `img`         | Image URL (required)               | `string` | -       |
+| `width`       | Container width                    | `number` | `500`   |
+| `height`      | Container height                   | `number` | `400`   |
+| `aspectRatio` | Crop ratio, e.g. `"1:1"`, `"16:9"` | `string` | -       |
+
+### Methods
+
+Call component methods via `ref`:
+
+```vue
+<script setup lang="ts">
+import { ref } from 'vue';
+import { VCropper } from '@vben/common-ui';
+
+const cropperRef = ref<InstanceType<typeof VCropper>>();
+
+const handleCrop = async () => {
+  const result = await cropperRef.value?.getCropImage();
+  // result is a Blob or base64 string
+};
+</script>
+```
+
+#### getCropImage
+
+Crop and retrieve the image.
+
+```ts
+getCropImage(
+  format?: 'image/jpeg' | 'image/png',
+  quality?: number,
+  outputType?: 'base64' | 'blob',
+  targetWidth?: number,
+  targetHeight?: number,
+): Promise<Blob | string | undefined>
+```
+
+**Parameters:**
+
+| Parameter | Type | Default | Description |
+| --- | --- | --- | --- |
+| `format` | `'image/jpeg' \| 'image/png'` | `'image/png'` | Output image format |
+| `quality` | `number` | `0.92` | Compression quality (0-1), only effective for jpeg |
+| `outputType` | `'base64' \| 'blob'` | `'blob'` | Output type, base64 string or Blob object |
+| `targetWidth` | `number` | - | Target width, defaults to original crop width if omitted |
+| `targetHeight` | `number` | - | Target height, defaults to original crop height if omitted |
+
+## Features
+
+### Cropping Operations
+
+- **Drag to Move** - Drag the center area of the crop box to move its position
+- **Corner Resize** - Drag the four corners to resize the crop box
+- **Edge Resize** - Drag the midpoints of edges to adjust a single side
+
+### Aspect Ratio Control
+
+- **Free Ratio** - Without `aspectRatio`, adjust the crop box to any ratio
+- **Fixed Ratio** - With `aspectRatio` set, the crop box maintains the specified ratio
+
+### HiDPI Support
+
+The component automatically adapts to Retina and other high-DPI screens, ensuring crisp output images.
+
+### Image Fitting
+
+- Images are automatically scaled to fit within the container
+- Supports both local and remote images
+- Remote images require CORS support from the server to export cropped results
+
+## Usage Example
+
+```vue
+<script setup lang="ts">
+import { ref } from 'vue';
+import { VCropper } from '@vben/common-ui';
+
+const cropperRef = ref<InstanceType<typeof VCropper>>();
+const imageUrl = ref('https://example.com/image.jpg');
+const croppedImage = ref('');
+
+// Get cropped Blob
+const handleCropBlob = async () => {
+  const blob = await cropperRef.value?.getCropImage('image/jpeg', 0.9, 'blob');
+  if (blob instanceof Blob) {
+    // Upload to server or create preview URL
+    const url = URL.createObjectURL(blob);
+    croppedImage.value = url;
+  }
+};
+
+// Get cropped base64 string
+const handleCropBase64 = async () => {
+  const base64 = await cropperRef.value?.getCropImage('image/png', 1, 'base64');
+  if (typeof base64 === 'string') {
+    croppedImage.value = base64;
+  }
+};
+
+// Export with specific dimensions
+const handleCropWithSize = async () => {
+  const blob = await cropperRef.value?.getCropImage(
+    'image/jpeg',
+    0.9,
+    'blob',
+    200, // target width
+    200, // target height
+  );
+};
+</script>
+
+<template>
+  <div>
+    <VCropper
+      ref="cropperRef"
+      :img="imageUrl"
+      :width="500"
+      :height="400"
+      aspect-ratio="1:1"
+    />
+    <button @click="handleCropBlob">Crop</button>
+    <img v-if="croppedImage" :src="croppedImage" />
+  </div>
+</template>
+```
diff --git a/docs/src/en/components/common-ui/vben-descriptions.md b/docs/src/en/components/common-ui/vben-descriptions.md
new file mode 100644
index 00000000..4685b1f5
--- /dev/null
+++ b/docs/src/en/components/common-ui/vben-descriptions.md
@@ -0,0 +1,102 @@
+---
+outline: deep
+---
+
+# Vben Descriptions
+
+`Descriptions` displays a group of read-only fields, commonly used on detail pages and information previews. It is built on shadcn-ui with an API modeled after Ant Design Vue's Descriptions, supporting responsive columns, column spanning, borders, and vertical layout.
+
+> If the documentation does not cover the details you need, please refer to the online examples.
+
+::: info Before you start
+
+The component supports two usages: data-driven via `items` (recommended), or declaring entries with the `VbenDescriptionsItem` child component. `items` takes precedence when both are provided. :::
+
+## Basic Usage
+
+Pass an array of fields via `items`, each with a `label` and `content`. Columns adapt to breakpoints by default (1 column on `xs`, 2 on `sm`, 3 on `md` and above).
+
+<DemoPreview dir="demos/vben-descriptions/basic" />
+
+## Bordered
+
+Set `bordered` for a bordered style, combined with the `title` prop and the `#extra` slot (an action area on the right of the title).
+
+<DemoPreview dir="demos/vben-descriptions/bordered" />
+
+## Vertical Layout
+
+Use `layout="vertical"` to place labels above their content.
+
+<DemoPreview dir="demos/vben-descriptions/vertical" />
+
+## Sizes
+
+Use `size` to switch between `small`, `middle`, and `large`.
+
+<DemoPreview dir="demos/vben-descriptions/size" />
+
+## Span & Responsive
+
+Set `span` on an item to span multiple columns; `'filled'` fills the remaining space of the current row. `column` accepts a breakpoint-keyed object for responsive columns.
+
+<DemoPreview dir="demos/vben-descriptions/span" />
+
+## Child Component Usage
+
+When `items` is omitted, declare entries with `VbenDescriptionsItem` in the default slot. Content can be customized via the default slot or the `#content` slot.
+
+<DemoPreview dir="demos/vben-descriptions/custom" />
+
+## API
+
+### Descriptions Props
+
+| Prop | Description | Type | Default |
+| --- | --- | --- | --- |
+| items | Data-driven entries; reads the default slot when omitted | `DescriptionsItemType[]` | - |
+| bordered | Whether to show borders | `boolean` | `false` |
+| column | Columns per row, supports breakpoint config | `number \| Partial<Record<Breakpoint, number>>` | `{ xs: 1, sm: 2, md: 3, xxxl: 4 }` |
+| layout | Layout direction | `'horizontal' \| 'vertical'` | `'horizontal'` |
+| size | Size | `'small' \| 'middle' \| 'large'` | `'middle'` |
+| colon | Show colon (only for non-bordered horizontal layout) | `boolean` | `true` |
+| title | Title | `string` | - |
+| extra | Action area on the right of the title | `string` | - |
+| labelStyle | Shared label style | `CSSProperties` | - |
+| contentStyle | Shared content style | `CSSProperties` | - |
+| class | Custom class for the root node | `string` | - |
+
+### Descriptions Slots
+
+| Slot    | Description                           |
+| ------- | ------------------------------------- |
+| title   | Custom title                          |
+| extra   | Custom action area beside the title   |
+| default | Place `VbenDescriptionsItem` children |
+
+### DescriptionsItem
+
+Each entry in `items`, or the props of the `VbenDescriptionsItem` child component.
+
+| Prop | Description | Type | Default |
+| --- | --- | --- | --- |
+| label | Label | `string \| number \| (() => VNode) \| Component` | - |
+| content | Content | `string \| number \| (() => VNode) \| Component` | - |
+| span | Columns to span, `'filled'` fills the rest of the row | `number \| 'filled' \| Partial<Record<Breakpoint, number>>` | `1` |
+| labelStyle | Label style | `CSSProperties` | - |
+| contentStyle | Content style | `CSSProperties` | - |
+| key | Unique key | `string \| number` | - |
+
+### DescriptionsItem Slots
+
+Available only for the child component usage.
+
+| Slot    | Description                       |
+| ------- | --------------------------------- |
+| default | Content (equivalent to `content`) |
+| content | Custom content                    |
+| label   | Custom label                      |
+
+::: tip Breakpoint
+
+The responsive `Breakpoint` is one of `'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'xxl' | 'xxxl'`, with pixel values aligned with Ant Design (`sm` 576, `md` 768, `lg` 992, `xl` 1200, `xxl` 1600, `xxxl` 2000). :::
diff --git a/docs/src/en/components/common-ui/vben-drawer.md b/docs/src/en/components/common-ui/vben-drawer.md
new file mode 100644
index 00000000..83448b29
--- /dev/null
+++ b/docs/src/en/components/common-ui/vben-drawer.md
@@ -0,0 +1,79 @@
+---
+outline: deep
+---
+
+# Vben Drawer
+
+`Vben Drawer` is the shared drawer wrapper used by the framework. It supports auto-height layout, loading state, connected components, and an imperative API similar to the modal API.
+
+## Basic Usage
+
+```ts
+const [Drawer, drawerApi] = useVbenDrawer({
+  // props
+  // events
+});
+```
+
+<DemoPreview dir="demos/vben-drawer/basic" />
+
+## Current Usage Notes
+
+- If you use `connectedComponent`, the inner and outer components share data through `drawerApi.setData()` and `drawerApi.getData()`.
+- Default drawer behavior can be adjusted in `apps/<app>/src/bootstrap.ts` through `setDefaultDrawerProps(...)`.
+- `setState(...)` works on `DrawerState`, not `ModalState`.
+
+## Shared Data Types
+
+The recommended approach is to declare the data type once in the connected component and expose `drawerApi`. The outer call then infers the data contract from `connectedComponent`:
+
+```ts
+// Connected component
+const [Drawer, drawerApi] = useVbenDrawer<EditData>();
+defineExpose({ drawerApi });
+
+// Outer component, EditData is inferred
+const [Drawer, drawerApi] = useVbenDrawer({
+  connectedComponent: EditDrawer,
+});
+```
+
+Use `useVbenDrawer<EditData>()` explicitly when the component type cannot expose the contract. For larger features, pre-bind one reusable contract in a separate module:
+
+```ts
+export const useEditDrawer = createVbenDrawer<EditData>();
+```
+
+The precedence is explicit generic, connected component inference, then `unknown`. Plain SFCs support inference through `defineExpose`; generic SFCs, functional components, and components widened to `Component` should use an explicit generic or contract factory. `getData()` returns `undefined` before `setData()` is called. Include `null` or partial payloads in the data type when they are valid business values.
+
+## Key Props
+
+| Prop | Description | Type |
+| --- | --- | --- |
+| `appendToMain` | mount inside the main content area instead of `body` | `boolean` |
+| `connectedComponent` | connect an inner component to the drawer wrapper | `Component` |
+| `closeIconPlacement` | position of the close icon | `'left' \| 'right'` |
+| `placement` | drawer side | `'left' \| 'right' \| 'top' \| 'bottom'` |
+| `overlayBlur` | blur amount for the overlay | `number` |
+| `submitting` | lock drawer interactions while submitting | `boolean` |
+
+## Events
+
+| Event | Description | Type |
+| --- | --- | --- |
+| `onBeforeClose` | called before close; returning `false` or rejecting prevents close | `() => Promise<boolean \| undefined> \| boolean \| undefined` |
+| `onOpenChange` | called when open state changes | `(isOpen: boolean) => void` |
+| `onOpened` | called after open animation completes | `() => void` |
+| `onClosed` | called after close animation completes | `() => void` |
+
+## drawerApi
+
+| Method                  | Description                            |
+| ----------------------- | -------------------------------------- |
+| `setState(...)`         | updates drawer state                   |
+| `open()`                | opens the drawer                       |
+| `close()`               | closes the drawer                      |
+| `setData(data: TData)`  | stores typed shared data               |
+| `getData()`             | returns `TData \| undefined`           |
+| `lock(isLocked = true)` | locks the drawer into submitting state |
+| `unlock()`              | alias for `lock(false)`                |
diff --git a/docs/src/en/components/common-ui/vben-ellipsis-text.md b/docs/src/en/components/common-ui/vben-ellipsis-text.md
new file mode 100644
index 00000000..602812a0
--- /dev/null
+++ b/docs/src/en/components/common-ui/vben-ellipsis-text.md
@@ -0,0 +1,42 @@
+---
+outline: deep
+---
+
+# Vben EllipsisText
+
+`EllipsisText` displays long text with truncation, tooltip support, and optional expand/collapse behavior.
+
+## Basic Usage
+
+Pass the text through the default slot and limit the visual width with `maxWidth`.
+
+<DemoPreview dir="demos/vben-ellipsis-text/line" />
+
+## Current Props
+
+| Prop | Description | Type | Default |
+| --- | --- | --- | --- |
+| `expand` | allow click-to-expand behavior | `boolean` | `false` |
+| `line` | max visible line count | `number` | `1` |
+| `maxWidth` | max width of the text area | `number \| string` | `'100%'` |
+| `placement` | tooltip placement | `'bottom' \| 'left' \| 'right' \| 'top'` | `'top'` |
+| `tooltip` | enable tooltip | `boolean` | `true` |
+| `tooltipWhenEllipsis` | only show tooltip when text is actually truncated | `boolean` | `false` |
+| `ellipsisThreshold` | pixel threshold used when checking truncation | `number` | `3` |
+| `tooltipBackgroundColor` | tooltip background color | `string` | `''` |
+| `tooltipColor` | tooltip text color | `string` | `''` |
+| `tooltipFontSize` | tooltip font size in px | `number` | `14` |
+| `tooltipMaxWidth` | tooltip max width in px | `number` | - |
+| `tooltipOverlayStyle` | tooltip content style | `CSSProperties` | `{ textAlign: 'justify' }` |
+
+## Events
+
+| Event | Description | Type |
+| --- | --- | --- |
+| `expandChange` | fired when expand state changes | `(isExpand: boolean) => void` |
+
+## Slots
+
+| Slot      | Description            |
+| --------- | ---------------------- |
+| `tooltip` | custom tooltip content |
diff --git a/docs/src/en/components/common-ui/vben-form.md b/docs/src/en/components/common-ui/vben-form.md
new file mode 100644
index 00000000..6e09df01
--- /dev/null
+++ b/docs/src/en/components/common-ui/vben-form.md
@@ -0,0 +1,365 @@
+---
+outline: deep
+---
+
+# Vben Form
+
+::: warning Field Slot Breaking Change
+
+Named field slot control bindings are now grouped under `slotProps.componentProps`. The old binding forwards form metadata such as `field`, `formApi`, and `values` to the rendered control, which can produce invalid attributes and Vue runtime warnings.
+
+```vue
+<!-- Old usage -->
+<Input v-bind="slotProps" />
+
+<!-- New usage -->
+<Input v-bind="slotProps.componentProps" />
+```
+
+Migrate every field slot from `v-bind="slotProps"` to `v-bind="slotProps.componentProps"`. Root metadata remains available for template logic through `field`, `componentField`, `modelValue`, `name`, `disabled`, `isInValid`, `values`, and `formApi`, but it is no longer forwarded automatically to the rendered control.
+
+In this release, starting a Vben application or Playground development server prints this migration warning in the terminal, and loading the page prints the same warning in the browser console. The warning is excluded from production builds and is planned for removal in the next release.
+
+:::
+
+`Vben Form` is the shared form abstraction used across different UI-library variants such as `Ant Design Vue`, `Element Plus`, `Naive UI`, and other adapters added inside this repository.
+
+It uses [TanStack Form](https://tanstack.com/form/latest/docs/framework/vue/overview) internally for state and validation lifecycles, with [Zod 4](https://zod.dev/v4) schemas. Application code should continue using `useVbenForm`, `FormApi`, and the adapter layer instead of depending on the raw TanStack instance.
+
+Read the [Zod 4 and TanStack Form migration guide](/en/guide/in-depth/zod-v4-form-migration) before upgrading an existing project.
+
+> If some details are not obvious from the docs, check the live demos as well.
+
+## Adapter Setup
+
+Each app keeps its own adapter layer under `src/adapter/form.ts` and `src/adapter/component/index.ts`.
+
+The current adapter pattern is:
+
+- initialize the shared component adapter first
+- call `setupVbenForm(...)`
+- map special `v-model:*` prop names through `modelPropNameMap`
+- keep the form empty state aligned with the actual UI library behavior
+
+### Form Adapter Example
+
+```ts
+import type {
+  FormValues,
+  VbenFormProps as FormProps,
+  VbenFormSchema as FormSchema,
+} from '@vben/common-ui';
+
+import type { ComponentType } from './component';
+
+import { setupVbenForm, useVbenForm as useForm, z } from '@vben/common-ui';
+import { $t } from '@vben/locales';
+
+import { initComponentAdapter } from './component';
+
+initComponentAdapter();
+setupVbenForm<ComponentType>({
+  config: {
+    baseModelPropName: 'value',
+    emptyStateValue: null,
+    modelPropNameMap: {
+      Checkbox: 'checked',
+      Radio: 'checked',
+      Switch: 'checked',
+      Upload: 'fileList',
+    },
+  },
+  rules: {
+    required: (value, _params, ctx) => {
+      if (value === undefined || value === null || value.length === 0) {
+        return $t('ui.formRules.required', [ctx.label]);
+      }
+      return true;
+    },
+    selectRequired: (value, _params, ctx) => {
+      if (value === undefined || value === null) {
+        return $t('ui.formRules.selectRequired', [ctx.label]);
+      }
+      return true;
+    },
+  },
+});
+
+function useVbenForm<TValues extends FormValues = FormValues>(
+  options: FormProps<ComponentType, Record<never, never>, TValues>,
+) {
+  return useForm<TValues, ComponentType, Record<never, never>>(options);
+}
+
+export { useVbenForm, z };
+export type VbenFormSchema<TValues extends FormValues = FormValues> =
+  FormSchema<ComponentType, Record<never, never>, TValues>;
+export type VbenFormProps<TValues extends FormValues = FormValues> = FormProps<
+  ComponentType,
+  Record<never, never>,
+  TValues
+>;
+```
+
+### Component Adapter Example
+
+```ts
+import type { Component, SetupContext } from 'vue';
+
+import type { BaseFormComponentType } from '@vben/common-ui';
+
+import { h } from 'vue';
+
+import { globalShareState } from '@vben/common-ui';
+import { $t } from '@vben/locales';
+import {
+  AutoComplete,
+  Button,
+  Checkbox,
+  CheckboxGroup,
+  DatePicker,
+  Divider,
+  Input,
+  InputNumber,
+  InputPassword,
+  Mentions,
+  notification,
+  Radio,
+  RadioGroup,
+  RangePicker,
+  Rate,
+  Select,
+  Space,
+  Switch,
+  Textarea,
+  TimePicker,
+  TreeSelect,
+  Upload,
+} from 'antdv-next';
+
+const withDefaultPlaceholder = <T extends Component>(
+  component: T,
+  type: 'input' | 'select',
+) => {
+  return (props: any, { attrs, slots }: Omit<SetupContext, 'expose'>) => {
+    const placeholder = props?.placeholder || $t(`ui.placeholder.${type}`);
+    return h(component, { ...props, ...attrs, placeholder }, slots);
+  };
+};
+
+export type ComponentType =
+  | 'AutoComplete'
+  | 'Checkbox'
+  | 'CheckboxGroup'
+  | 'DatePicker'
+  | 'DefaultButton'
+  | 'Divider'
+  | 'Input'
+  | 'InputNumber'
+  | 'InputPassword'
+  | 'Mentions'
+  | 'PrimaryButton'
+  | 'Radio'
+  | 'RadioGroup'
+  | 'RangePicker'
+  | 'Rate'
+  | 'Select'
+  | 'Space'
+  | 'Switch'
+  | 'Textarea'
+  | 'TimePicker'
+  | 'TreeSelect'
+  | 'Upload'
+  | BaseFormComponentType;
+
+async function initComponentAdapter() {
+  const components: Partial<Record<ComponentType, Component>> = {
+    AutoComplete,
+    Checkbox,
+    CheckboxGroup,
+    DatePicker,
+    DefaultButton: (props, { attrs, slots }) => {
+      return h(Button, { ...props, attrs, type: 'default' }, slots);
+    },
+    Divider,
+    Input: withDefaultPlaceholder(Input, 'input'),
+    InputNumber: withDefaultPlaceholder(InputNumber, 'input'),
+    InputPassword: withDefaultPlaceholder(InputPassword, 'input'),
+    Mentions: withDefaultPlaceholder(Mentions, 'input'),
+    PrimaryButton: (props, { attrs, slots }) => {
+      return h(Button, { ...props, attrs, type: 'primary' }, slots);
+    },
+    Radio,
+    RadioGroup,
+    RangePicker,
+    Rate,
+    Select: withDefaultPlaceholder(Select, 'select'),
+    Space,
+    Switch,
+    Textarea: withDefaultPlaceholder(Textarea, 'input'),
+    TimePicker,
+    TreeSelect: withDefaultPlaceholder(TreeSelect, 'select'),
+    Upload,
+  };
+
+  globalShareState.setComponents(components);
+  globalShareState.defineMessage({
+    copyPreferencesSuccess: (title, content) => {
+      notification.success({
+        description: content,
+        message: title,
+        placement: 'bottomRight',
+      });
+    },
+  });
+}
+
+export { initComponentAdapter };
+```
+
+## Basic Usage
+
+Create the form through `useVbenForm`:
+
+<DemoPreview dir="demos/vben-form/basic" />
+
+## Typed Values and Slots
+
+Use `useVbenForm<TFormValues, TSubmitValues>` to declare component-facing form values and submission values separately. Schema, slots, selectors, and `setValues` use `TFormValues`; `getValues()` and `submit()` return `Promise<TSubmitValues>`, while `submit()` only accepts an optional native `Event`; the first `handleSubmit` argument is `TSubmitValues`. Pass one generic when both shapes are identical.
+
+```vue
+<script setup lang="ts">
+import { useVbenForm } from '#/adapter/form';
+
+interface AccountFormValues {
+  email: string;
+  nickname: string;
+}
+
+const [Form, formApi] = useVbenForm<AccountFormValues>({
+  handleSubmit(values) {
+    return addAccount(values); // AccountFormValues
+  },
+  schema: [
+    { component: 'Input', fieldName: 'email', label: 'Email' },
+    { component: 'Input', fieldName: 'nickname', label: 'Nickname' },
+  ],
+});
+
+async function fillForm() {
+  await formApi.setValues({ email: 'user@example.com' });
+  return formApi.getValues(); // Promise<AccountFormValues>
+}
+</script>
+
+<template>
+  <Form>
+    <template #email="{ componentField, field, formApi, values }">
+      <!-- field.state.value and componentField.modelValue are strings -->
+      <input v-bind="componentField" :data-email="values.email" />
+      <button type="button" @click="formApi.clearValidation('email')">
+        Clear
+      </button>
+    </template>
+    <template #default="{ formApi, shapes, values }">
+      <button type="button" @click="formApi.submit()">
+        Submit {{ shapes.length }} fields for {{ values.email }}
+      </button>
+    </template>
+  </Form>
+</template>
+```
+
+Named field slots expose grouped control bindings through `componentProps`, together with `field`, `componentField`, `modelValue`, `name`, `disabled`, `isInValid`, `values`, and `formApi`. The default slot exposes `shapes`, `values`, and `formApi`; action slots expose `values` and `formApi`.
+
+Use a precise form-value interface without a string index signature to infer each field value. A broad type such as `Record<string, unknown>` keeps the complete slot-prop structure instead of degrading the whole scope to `any`, but field values can only use the declared index value type.
+
+## Field Slots
+
+Control bindings are grouped under `componentProps`. It contains the model value, matching `update:*` event, schema/common/dependency props, and disabled state:
+
+```vue
+<Form>
+  <template #fieldName="slotProps">
+    <Input v-bind="slotProps.componentProps" />
+  </template>
+</Form>
+```
+
+Root metadata remains available for template logic through `field`, `componentField`, `modelValue`, `name`, `disabled`, `isInValid`, `values`, and `formApi`; it is not forwarded automatically to the rendered control.
+
+## Form Codec
+
+Use the form-level `codec` when component values and the backend payload have different shapes. `encode` converts the complete `TFormValues` object to `TSubmitValues`; `decode` performs the inverse conversion. Multi-field splits and merges are atomic and do not depend on schema order or string-path writes.
+
+Define `codec` directly in the `useVbenForm` options. Annotate only the form-value input of `encode`; `TSubmitValues` is inferred from its return object and flows into `decode`, `getValues()`, and submit callbacks:
+
+```ts
+const [Form, formApi] = useVbenForm({
+  codec: {
+    decode(values) {
+      return { period: [values.startTime, values.endTime] };
+    },
+    encode(values: Readonly<FormValues>) {
+      return {
+        endTime: values.period[1],
+        startTime: values.period[0],
+      };
+    },
+  },
+  schema,
+});
+```
+
+<DemoPreview dir="demos/vben-form/value-format" />
+
+`schema.valueFormat`, `fieldMappingTime`, and `arrayToStringFields` remain runtime-compatible but are deprecated. When a codec is configured it takes precedence and deprecated transforms are ignored.
+
+## Performance Benchmarks
+
+The form benchmarks cover component initialization, single-field and batch updates, reset, Zod validation, dynamic schemas, dependencies, codec encoding and snapshots, plus array editing, row mutations, and child-schema updates. Run the complete benchmark suite with:
+
+```bash
+pnpm test:benchmark
+```
+
+To run only the form benchmarks, pass both files explicitly:
+
+```bash
+pnpm exec vitest bench --run packages/@core/ui-kit/form-ui/__tests__/form-component-performance.benchmark.ts packages/@core/ui-kit/form-ui/__tests__/form-performance.benchmark.ts
+```
+
+Use benchmark results to compare relative changes on the same machine and runtime; do not treat one run's absolute timings as portable thresholds. Stop CPU-intensive development servers first and keep the Node.js version consistent. Benchmark files are not included in the regular `test:unit` command.
+
+::: warning Mounted form context
+
+`formApi.form` is the `FormContextApi` injected after `<Form />` mounts. Do not destructure or cache `form` from the second `useVbenForm` return value during setup, because that captures the pre-mount empty reference. Prefer mount-aware public methods such as `getRawValues()`, `setFieldError()`, `setFieldValue()`, and `validate()` for business actions. Access fine-grained subscription methods on `formApi.form` only from an already-mounted form context.
+
+:::
+
+## Key API Notes
+
+- `useVbenForm` returns `[Form, formApi]`
+- `useVbenForm<TFormValues, TSubmitValues>` keeps component values and submission values distinct
+- prefer `reset`, `submit`, `validateAndSubmit`, and `clearValidation`
+- `resetForm`, `submitForm`, `validateAndSubmitForm`, and `resetValidate` remain deprecated aliases that warn once in development
+- `clearValidation` invalidates in-flight async results before clearing errors
+- `formApi.getFieldComponentRef()` and `formApi.getFocusedField()` are available in current versions
+- `handleValuesChange(values, fieldsChanged)` receives readonly `TFormValues` before codec or legacy formatting
+- its third `getFormattedValues` argument formats lazily, so raw-only change handlers avoid clone and transform work
+- `getRawValues()` returns only an independent raw snapshot, `getValues()` returns only the formatted payload, and `getValueSnapshot()` returns both
+- `handleSubmit(values, rawValues)` receives the formatted payload and its corresponding raw snapshot
+- `fieldMappingTime`, `arrayToStringFields`, and `schema.valueFormat` are deprecated compatibility options
+- `codec.encode` defines the `getValues()` payload and `codec.decode` powers complete `setSubmitValues()` fills
+- `formApi.form` exposes the mounted `FormContextApi`; do not destructure or cache it before `<Form />` mounts
+- prefer `formApi.form.useFieldValue`, `useFieldValues`, and `useFieldError` for fine-grained subscriptions; use `useValues` only when the whole form is required
+- `useSelector` remains the compatibility selector for combined `{ values, errors, meta }` state
+- legacy `setupVbenForm({ defineRules })` still works, warns once in development, and is silent in production; use `rules` for new code
+- prefer `dependencies: { triggerFields, resolve(context) }` for one atomic dynamic-state patch; legacy dependency callbacks remain supported but are deprecated and warn once in development
+- top-level `componentProps`, `help`, and `renderComponentContent` functions receive `FormSchemaContext`; value-dependent rendering belongs in `dependencies.resolve`
+- use `formFieldProps.validateOn` with `blur` and/or `change`; submit always validates, and `asyncDebounceMs` debounces async validators
+- use `changeEventFallback: true` only for components that emit `change` without an `update:*` event
+
+## Reference
+
+For the complete Chinese API tables and more examples, see the Chinese component page if you need the full parameter matrix.
diff --git a/docs/src/en/components/common-ui/vben-modal.md b/docs/src/en/components/common-ui/vben-modal.md
new file mode 100644
index 00000000..76c2b088
--- /dev/null
+++ b/docs/src/en/components/common-ui/vben-modal.md
@@ -0,0 +1,79 @@
+---
+outline: deep
+---
+
+# Vben Modal
+
+`Vben Modal` is the shared modal wrapper used by the framework. It supports draggable behavior, fullscreen mode, auto-height handling, loading state, connected components, and an imperative API.
+
+## Basic Usage
+
+```ts
+const [Modal, modalApi] = useVbenModal({
+  // props
+  // events
+});
+```
+
+<DemoPreview dir="demos/vben-modal/basic" />
+
+## Current Usage Notes
+
+- If you use `connectedComponent`, the inner and outer components share data through `modalApi.setData()` and `modalApi.getData()`.
+- When `connectedComponent` is present, avoid pushing extra modal props through the connected side. Prefer `useVbenModal(...)` or `modalApi.setState(...)`.
+- Default modal behavior can be adjusted in `apps/<app>/src/bootstrap.ts` through `setDefaultModalProps(...)`.
+
+## Shared Data Types
+
+The recommended approach is to declare the data type once in the connected component and expose `modalApi`. The outer call then infers the data contract from `connectedComponent`:
+
+```ts
+// Connected component
+const [Modal, modalApi] = useVbenModal<EditData>();
+defineExpose({ modalApi });
+
+// Outer component, EditData is inferred
+const [Modal, modalApi] = useVbenModal({
+  connectedComponent: EditModal,
+});
+```
+
+Use `useVbenModal<EditData>()` explicitly when the component type cannot expose the contract. For larger features, pre-bind one reusable contract in a separate module:
+
+```ts
+export const useEditModal = createVbenModal<EditData>();
+```
+
+The precedence is explicit generic, connected component inference, then `unknown`. Plain SFCs support inference through `defineExpose`; generic SFCs, functional components, and components widened to `Component` should use an explicit generic or contract factory. `getData()` returns `undefined` before `setData()` is called. Include `null` or partial payloads in the data type when they are valid business values.
+
+## Key Props
+
+| Prop | Description | Type |
+| --- | --- | --- |
+| `appendToMain` | mount inside the main content area instead of `body` | `boolean` |
+| `connectedComponent` | connect an inner component to the modal wrapper | `Component` |
+| `animationType` | modal enter/leave animation | `'slide' \| 'scale'` |
+| `fullscreenButton` | show or hide the fullscreen toggle | `boolean` |
+| `overlayBlur` | blur amount for the overlay | `number` |
+| `submitting` | lock modal interactions while submitting | `boolean` |
+
+## Events
+
+| Event | Description | Type |
+| --- | --- | --- |
+| `onBeforeClose` | called before close; returning `false` or rejecting prevents close | `() => Promise<boolean \| undefined> \| boolean \| undefined` |
+| `onOpenChange` | called when open state changes | `(isOpen: boolean) => void` |
+| `onOpened` | called after open animation completes | `() => void` |
+| `onClosed` | called after close animation completes | `() => void` |
+
+## modalApi
+
+| Method                  | Description                           |
+| ----------------------- | ------------------------------------- |
+| `setState(...)`         | updates modal state                   |
+| `open()`                | opens the modal                       |
+| `close()`               | closes the modal                      |
+| `setData(data: TData)`  | stores typed shared data              |
+| `getData()`             | returns `TData \| undefined`          |
+| `lock(isLocked = true)` | locks the modal into submitting state |
+| `unlock()`              | alias for `lock(false)`               |
diff --git a/docs/src/en/components/common-ui/vben-table-action.md b/docs/src/en/components/common-ui/vben-table-action.md
new file mode 100644
index 00000000..7c1e7655
--- /dev/null
+++ b/docs/src/en/components/common-ui/vben-table-action.md
@@ -0,0 +1,165 @@
+---
+outline: deep
+---
+
+# Vben TableAction
+
+`TableAction` renders a group of action buttons for table operation columns, inspired by the TableAction component from vben2. Built on shadcn-ui, it supports permission control, popconfirm, tooltips, a "more" dropdown, and dividers, and can be reused inside or outside tables.
+
+> If the documentation does not cover the details you need, please refer to the online examples.
+
+::: info Before you start
+
+The component carries no business logic (it does not read the permission store directly); permissions are handled by injecting `hasPermission`, keeping the core layer decoupled and reusable across frameworks. Inside vxe-table, the recommended approach is to render it via a column slot (`slots: { default: 'action' }`) on the page, without changing the table's original rendering mechanism. :::
+
+## Basic Usage
+
+Pass an array of action items via `actions`, each with `text`, `onClick`, etc. `danger` marks destructive actions, and `divider` shows separators between buttons.
+
+<DemoPreview dir="demos/vben-table-action/basic" />
+
+## Tooltip
+
+Add a tooltip to an action via `tooltip`, accepting a string or a `{ content, side }` object.
+
+<DemoPreview dir="demos/vben-table-action/tooltip" />
+
+## PopConfirm
+
+Use `popConfirm` to require confirmation before the action runs, commonly used for destructive actions like delete.
+
+<DemoPreview dir="demos/vben-table-action/popconfirm" />
+
+## More Dropdown
+
+Use `dropdownActions` to collapse secondary actions into a "more" dropdown. `moreText` customizes the button label.
+
+<DemoPreview dir="demos/vben-table-action/dropdown" />
+
+## Permission Control
+
+Set an `auth` code on an action and inject a `hasPermission` resolver; actions without permission are hidden.
+
+<DemoPreview dir="demos/vben-table-action/permission" />
+
+## Usage with vxe-table
+
+Without changing vxe-table's rendering mechanism, declare a slot in the column config and render it on the page.
+
+::: tip Recommended: use the adapter-wrapped version The project's `#/adapter/vxe-table` re-wraps `VbenTableAction` and injects `hasPermission` internally (based on `useAccess().hasAccessByCodes`). So when you import it from the adapter, **you no longer need to pass `:has-permission`** — just declare permission codes via the `auth` field of each action. :::
+
+```ts
+// data.ts — declare a slot in the column config
+{
+  align: 'center',
+  field: 'operation',
+  fixed: 'right',
+  slots: { default: 'action' },
+  title: $t('system.user.operation'),
+  width: 180,
+}
+```
+
+```vue
+<!-- list.vue — import from the adapter; permission is auto-injected, no has-permission needed -->
+<script setup lang="ts">
+import { VbenTableAction } from '#/adapter/vxe-table';
+</script>
+
+<template>
+  <Grid>
+    <template #action="{ row }">
+      <template #action="{ row }">
+        <VbenTableAction
+          :actions="[
+            {
+              text: $t('common.detail'),
+              icon: 'lucide:eye',
+              onClick: () => onDetail(row),
+            },
+            {
+              text: $t('common.edit'),
+              icon: 'lucide:edit',
+              onClick: () => onEdit(row),
+            },
+          ]"
+          :dropdown-actions="[
+            {
+              text: $t('common.delete'),
+              icon: 'lucide:trash-2',
+              danger: true,
+              onClick: () => onDelete(row),
+              auth: ['AC_100100'],
+            },
+          ]"
+          align="center"
+        />
+      </template>
+    </template>
+  </Grid>
+</template>
+```
+
+If you import the core component directly from `@vben/common-ui` (without going through the adapter), the component carries no business logic and you need to inject `hasPermission` yourself:
+
+```vue
+<script setup lang="ts">
+import { useAccess } from '@vben/access';
+import { VbenTableAction } from '@vben/common-ui';
+
+const { hasAccessByCodes } = useAccess();
+function hasPermission(auth?: string | string[]) {
+  if (!auth) return true;
+  return hasAccessByCodes(Array.isArray(auth) ? auth : [auth]);
+}
+</script>
+
+<template>
+  <VbenTableAction
+    v-bind="useActions(row, onActionClick)"
+    :has-permission="hasPermission"
+    align="center"
+  />
+</template>
+```
+
+## API
+
+### TableAction Props
+
+| Prop | Description | Type | Default |
+| --- | --- | --- | --- |
+| actions | Main action buttons | `ActionItem[]` | `[]` |
+| dropdownActions | Actions inside the "more" dropdown | `ActionItem[]` | `[]` |
+| align | Alignment | `'start' \| 'center' \| 'end'` | `'end'` |
+| divider | Whether to show separators between buttons | `boolean` | `false` |
+| moreText | Label for the "more" button (shown beside the icon) | `string` | - |
+| hasPermission | Permission resolver; returning `false` hides the action with that `auth` (auto-injected when imported from `#/adapter/vxe-table`, no need to pass manually) | `(auth?: string \| string[]) => boolean` | - |
+| class | Custom class for the root node | `string` | - |
+
+### ActionItem
+
+| Prop | Description | Type | Default |
+| --- | --- | --- | --- |
+| text | Button text | `string` | - |
+| icon | Icon component | `string` \| `VbenIcon` | - |
+| onClick | Click callback | `() => void` | - |
+| auth | Permission code, filtered by `hasPermission` | `string \| string[]` | - |
+| ifShow | Whether to show | `boolean \| (() => boolean)` | `true` |
+| disabled | Whether disabled | `boolean` | `false` |
+| loading | Loading state | `boolean` | `false` |
+| danger | Destructive action (red text) | `boolean` | `false` |
+| tooltip | Tooltip | `string \| { content: string; side?: 'top' \| 'bottom' \| 'left' \| 'right' }` | - |
+| popConfirm | PopConfirm | `TableActionPopConfirm` | - |
+| variant | Button variant | `ButtonVariants['variant']` | `'link'` |
+| size | Button size | `ButtonVariants['size']` | `'sm'` |
+| key | Unique key | `string \| number` | - |
+
+### TableActionPopConfirm
+
+| Prop | Description | Type | Default |
+| --- | --- | --- | --- |
+| title | Confirm title | `string` | `'Are you sure?'` |
+| okText | Confirm button text | `string` | `'OK'` |
+| cancelText | Cancel button text | `string` | `'Cancel'` |
+| confirm | Confirm callback; falls back to `action.onClick` if omitted | `() => void` | - |
diff --git a/docs/src/en/components/common-ui/vben-tiptap.md b/docs/src/en/components/common-ui/vben-tiptap.md
new file mode 100644
index 00000000..e9dfe8b8
--- /dev/null
+++ b/docs/src/en/components/common-ui/vben-tiptap.md
@@ -0,0 +1,199 @@
+---
+outline: deep
+---
+
+# Vben Tiptap Rich Text Editor
+
+A rich text editor component built on [Tiptap](https://tiptap.dev/), supporting rich text formatting, image insertion, and image upload features.
+
+> If some details are not obvious from the docs, check the live demos as well.
+
+::: info Note
+
+If you feel the current component implementation doesn't meet your needs, you can use native components directly or create your own component. The components provided by the framework are not constraints - use them at your discretion.
+
+:::
+
+## Basic Usage
+
+<DemoPreview dir="demos/vben-tiptap/basic" />
+
+## Component List
+
+### VbenTiptap
+
+Main rich text editor component.
+
+### VbenTiptapPreview
+
+Read-only preview component for displaying editor content.
+
+## API
+
+### Props
+
+| Property | Description | Type | Default |
+| --- | --- | --- | --- |
+| `modelValue` (v-model) | Editor content (HTML string) | `string` | `''` |
+| `editable` | Whether the editor is editable | `boolean` | `true` |
+| `toolbar` | Whether to show the toolbar | `boolean` | `true` |
+| `previewable` | Whether to show the preview button | `boolean` | `true` |
+| `placeholder` | Placeholder text | `string` | - |
+| `minHeight` | Minimum height | `number \| string` | `240` |
+| `maxHeight` | Maximum height | `number \| string` | `400` |
+| `extensions` | Custom Tiptap extensions | `Extensions` | - |
+| `imageUpload` | Image upload configuration | `ImageUploadOptions` | - |
+
+### Events
+
+| Event    | Description                    | Parameters              |
+| -------- | ------------------------------ | ----------------------- |
+| `change` | Triggered when content changes | `VbenTiptapChangeEvent` |
+
+#### VbenTiptapChangeEvent
+
+```ts
+interface VbenTiptapChangeEvent {
+  html: string; // HTML content
+  json: JSONContent; // JSON structure
+  text: string; // Plain text content
+}
+```
+
+### ImageUploadOptions
+
+Image upload configuration:
+
+```ts
+interface ImageUploadOptions {
+  /** Allowed file types, default 'image/*' */
+  accept?: string;
+  /** Max file size in bytes, default 5MB */
+  maxSize?: number;
+  /** Upload error callback, uses alert if not provided */
+  onUploadError?: (error: unknown) => void;
+  /** Upload function, returns image URL */
+  upload: (
+    file: File,
+    onProgress?: (percent: number) => void,
+  ) => Promise<string>;
+}
+```
+
+### VbenTiptapPreview Props
+
+| Property    | Description             | Type               | Default |
+| ----------- | ----------------------- | ------------------ | ------- |
+| `content`   | HTML content to preview | `string`           | `''`    |
+| `minHeight` | Minimum height          | `number \| string` | `160`   |
+| `class`     | Custom class name       | `any`              | -       |
+
+## Toolbar Features
+
+The editor toolbar provides the following features:
+
+### Formatting
+
+- **Undo/Redo** - Undo or redo editing operations
+- **Clear Formatting** - Remove all formatting from selected text
+- **Bold** - Bold text
+- **Italic** - Italic text
+- **Underline** - Underline text
+- **Strikethrough** - Strikethrough text
+- **Inline Code** - Inline code mark
+
+### Structure
+
+- **Headings** - Paragraph, H1-H4 heading switching
+- **Ordered List** - Numbered list
+- **Bullet List** - Bulleted list
+- **Blockquote** - Quote block style
+- **Code Block** - Multi-line code block
+
+### Links & Images
+
+- **Insert Link** - Insert or edit hyperlinks
+- **Remove Link** - Remove link from selected text
+- **Insert Image** - Insert image via URL
+
+### Style
+
+- **Text Color** - Set text color (preset palette)
+- **Highlight Color** - Set text background highlight color
+
+### Alignment
+
+- **Align Left** - Left align text
+- **Align Center** - Center align text
+- **Align Right** - Right align text
+
+### Other
+
+- **Preview** - Preview content in a modal
+
+## Image Upload
+
+<DemoPreview dir="demos/vben-tiptap/image-upload" />
+
+When `imageUpload` is configured, the toolbar image button becomes a dropdown menu with "Upload" and "URL" options.
+
+### Upload Methods
+
+Three image upload methods are supported:
+
+1. **File Selection** - Click the upload button in toolbar
+2. **Drag & Drop** - Drag images directly into the editor
+3. **Paste** - Paste images into the editor
+
+### Upload Progress Display
+
+During upload:
+
+- **Loading Indicator** - Spinner animation indicating upload in progress
+- **Progress Bar** - Shows progress bar when upload function provides `onProgress` callback
+
+### File Validation
+
+- `accept` - Specify allowed file types (MIME types)
+- `maxSize` - Maximum file size limit (bytes)
+- Validation failure triggers `onUploadError` callback or default alert
+
+::: warning Important Notes
+
+- Only single image upload is supported; multi-image drag/paste will show a prompt and process only the first image
+- Do not save editor content (`getHTML()`) during upload as image URLs are temporary blob URLs
+- When using custom `extensions`, the image upload feature will not be available (toolbar won't show upload option)
+
+:::
+
+## Custom Extensions
+
+Pass custom Tiptap extension configurations via the `extensions` property:
+
+```vue
+<script setup lang="ts">
+import { VbenTiptap } from '@vben/plugins/tiptap';
+import StarterKit from '@tiptap/starter-kit';
+import Underline from '@tiptap/extension-underline';
+
+const extensions = [
+  StarterKit,
+  Underline,
+  // Other extensions...
+];
+</script>
+
+<template>
+  <VbenTiptap v-model="content" :extensions="extensions" />
+</template>
+```
+
+::: warning Custom Extensions Note
+
+When using custom `extensions`:
+
+- Default extension configuration will not take effect
+- Image upload feature is not available (toolbar won't show upload option)
+- You need to configure all required editor features yourself
+
+:::
diff --git a/docs/src/en/components/common-ui/vben-vxe-table.md b/docs/src/en/components/common-ui/vben-vxe-table.md
new file mode 100644
index 00000000..2fba1dc0
--- /dev/null
+++ b/docs/src/en/components/common-ui/vben-vxe-table.md
@@ -0,0 +1,87 @@
+---
+outline: deep
+---
+
+# Vben Vxe Table
+
+`Vben Vxe Table` wraps `vxe-table` together with `Vben Form` so you can build searchable data grids with a shared API.
+
+## Adapter Example
+
+The current renderer adapter uses `renderTableDefault(...)` for table cell rendering:
+
+```ts
+vxeUI.renderer.add('CellImage', {
+  renderTableDefault(_renderOpts, params) {
+    const { column, row } = params;
+    return h(Image, { src: row[column.field] });
+  },
+});
+
+vxeUI.renderer.add('CellLink', {
+  renderTableDefault(renderOpts) {
+    const { props } = renderOpts;
+    return h(
+      Button,
+      { size: 'small', type: 'link' },
+      { default: () => props?.text },
+    );
+  },
+});
+```
+
+## Basic Usage
+
+```vue
+<script setup lang="ts">
+import { useVbenVxeGrid } from '#/adapter/vxe-table';
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  gridOptions: {},
+  formOptions: {},
+  gridEvents: {},
+});
+</script>
+
+<template>
+  <Grid />
+</template>
+```
+
+<DemoPreview dir="demos/vben-vxe-table/basic" />
+
+## GridApi
+
+| Method | Description | Type |
+| --- | --- | --- |
+| `setLoading` | update loading state | `(loading: boolean) => void` |
+| `setGridOptions` | merge new grid options | `(options: Partial<VxeGridProps['gridOptions']>) => void` |
+| `reload` | reload data and reset pagination | `(params?: Record<string, any>) => void` |
+| `query` | query data while keeping the current page | `(params?: Record<string, any>) => void` |
+| `grid` | `vxe-grid` instance | `VxeGridInstance` |
+| `formApi` | search form API | `FormApi` |
+| `toggleSearchForm` | toggle or force the search form visible state | `(show?: boolean) => boolean` |
+
+## Props
+
+| Prop | Description | Type |
+| --- | --- | --- |
+| `tableTitle` | table title | `string` |
+| `tableTitleHelp` | help text for the table title | `string` |
+| `class` | class for the outer container | `string` |
+| `gridClass` | class for the `vxe-grid` node | `string` |
+| `gridOptions` | `vxe-grid` options | `DeepPartial<VxeTableGridOptions>` |
+| `gridEvents` | `vxe-grid` event handlers | `DeepPartial<VxeGridListeners>` |
+| `formOptions` | search form options | `VbenFormProps` |
+| `showSearchForm` | whether the search form is visible | `boolean` |
+| `separator` | separator between the search form and table body | `boolean \| SeparatorOptions` |
+
+## Slots
+
+| Slot              | Description                                             |
+| ----------------- | ------------------------------------------------------- |
+| `toolbar-actions` | left side of the toolbar, near the title                |
+| `toolbar-tools`   | right side of the toolbar, before built-in tool buttons |
+| `table-title`     | custom table title                                      |
+
+All named slots starting with `form-` are forwarded to the search form.
diff --git a/docs/src/en/components/introduction.md b/docs/src/en/components/introduction.md
new file mode 100644
index 00000000..806ef09f
--- /dev/null
+++ b/docs/src/en/components/introduction.md
@@ -0,0 +1,15 @@
+# Introduction
+
+::: info README
+
+This section documents the framework components, including their usage patterns, configuration points, and major APIs. If the built-in wrappers do not fit your needs, you can always use native components directly or build your own abstractions.
+
+:::
+
+## Layout Components
+
+Layout components are usually used as top-level containers inside the page content area. They provide shared layout styles and some baseline behavior.
+
+## Common Components
+
+Common components include frequently used UI building blocks such as modals, drawers, forms, and API-backed selectors. Most of them are implemented on top of shared Tailwind CSS and shadcn-vue based primitives, while still allowing each app to adapt them to its own UI library.
diff --git a/docs/src/en/components/layout-ui/page.md b/docs/src/en/components/layout-ui/page.md
new file mode 100644
index 00000000..467d30c4
--- /dev/null
+++ b/docs/src/en/components/layout-ui/page.md
@@ -0,0 +1,29 @@
+---
+outline: deep
+---
+
+# Page
+
+`Page` is the standard top-level layout container for business pages. It provides a header area, a content area, and an optional footer area.
+
+## Props
+
+| Prop | Description | Type | Default |
+| --- | --- | --- | --- |
+| `title` | page title | `string \| slot` | - |
+| `description` | page description | `string \| slot` | - |
+| `contentClass` | class for the content area | `string` | - |
+| `headerClass` | class for the header area | `string` | - |
+| `footerClass` | class for the footer area | `string` | - |
+| `autoContentHeight` | auto-calculate the content area height from the visible layout height | `boolean` | `false` |
+| `heightOffset` | extra height offset subtracted from the content area when auto height is enabled | `number` | `0` |
+
+## Slots
+
+| Slot          | Description               |
+| ------------- | ------------------------- |
+| `default`     | page content              |
+| `title`       | custom title              |
+| `description` | custom description        |
+| `extra`       | right-side header content |
+| `footer`      | footer content            |
diff --git a/docs/src/en/guide/in-depth/zod-v4-form-migration.md b/docs/src/en/guide/in-depth/zod-v4-form-migration.md
new file mode 100644
index 00000000..c3912642
--- /dev/null
+++ b/docs/src/en/guide/in-depth/zod-v4-form-migration.md
@@ -0,0 +1,242 @@
+---
+outline: deep
+---
+
+# Zod 4 and TanStack Form Migration
+
+This migration upgrades form schemas from Zod 3 to Zod 4 and replaces vee-validate with TanStack Form internally. The Vben business API remains stable while implementation-specific form APIs are removed from the public boundary.
+
+## Dependency Changes
+
+| Area | Before | After |
+| --- | --- | --- |
+| Schema | `zod@^3.25.76` | `zod@^4.4.3` |
+| Defaults | `zod-defaults@0.1.3` | `zod-defaults@^0.2.3` |
+| Form engine | `vee-validate@^4.15.1` | `@tanstack/vue-form@^1.33.2` |
+| Zod adapter | `@vee-validate/zod@^4.15.1` | Removed; TanStack Form supports Standard Schema |
+
+Source files, package manifests, and the lockfile must no longer depend on `vee-validate` or `@vee-validate/zod`.
+
+## Compatibility Boundary
+
+The following Vben APIs remain supported:
+
+- `useVbenForm(options)` returning `[Form, formApi]`
+- existing `FormApi` methods for values, reset, validation, submission, schema updates, and component refs
+- existing `FormSchema` fields, dependencies, deprecated `valueFormat`, and array schema structure
+- application adapters and the re-exported `z` namespace
+- the existing `componentField` slot and binding shape
+
+`formApi.form` is now the library-independent `FormContextApi`. It exposes values, errors, meta, set/reset/validate/submit methods, and array operations without leaking vee or raw TanStack generics.
+
+New code uses `reset`, `submit`, `validateAndSubmit`, and `clearValidation`. The former `resetForm`, `submitForm`, `validateAndSubmitForm`, and `resetValidate` names remain deprecated forwarding aliases. They emit one warning per name in development and stay silent in production.
+
+## Form UI API Changes in This Refactor
+
+### Added APIs
+
+| API | Type/Location | Description |
+| --- | --- | --- |
+| `dependencies.resolve(context)` | `FormItemDependenciesResolve` | Evaluates one complete dynamic patch from declared `triggerFields` and commits it atomically. Context contains readonly `values`, `actions`, `controller`, and row-aware `schema`. |
+| `useValues()` | `FormContextApi` | Subscribes to all form values. Use only when full-form reactivity is required. |
+| `useFieldValue(fieldName)` | `FormContextApi` | Subscribes to one field value without reacting to unrelated fields. |
+| `useFieldValues(fieldNames)` | `FormContextApi` | Subscribes to a declared group of field values. |
+| `useFieldError(fieldName)` | `FormContextApi` | Subscribes to one field error without consuming the full error object. |
+| `getRawValues()` | `FormApi` | Returns an independent form-value snapshot before codec or legacy formatting. |
+| `formatValues(rawValues)` | `FormApi` | Runs the unified formatting pipeline on a supplied raw snapshot. |
+| `getValueSnapshot()` | `FormApi` | Returns `{ rawValues, values }`, where `values` is `TSubmitValues`. |
+| `asyncDebounceMs` | `FormFieldOptions` | Configures TanStack Field async validation debounce. |
+| `changeEventFallback` | `FormCommonConfig` / adapter config | Enables fallback for legacy components that emit `change` without `update:*`; defaults to `false`. |
+
+`dependencies.resolve` may return `if`, `show`, `disabled`, `required`, `rules`, `componentProps`, `help`, and `renderComponentContent`. Omitting `rules` keeps the static rule; returning `rules: null` disables it.
+
+### Changed APIs
+
+| API | Before | After |
+| --- | --- | --- |
+| Submit callback | `handleSubmit(values)` | `handleSubmit(values, rawValues)`; the first argument is formatted and the second is the matching readonly raw snapshot. Existing single-argument functions remain valid. |
+| Values change callback | `handleValuesChange(values, fieldsChanged)` | `handleValuesChange(rawValues, fieldsChanged, getFormattedValues)`; formatting is lazy and incurs no clone/transform cost unless requested. |
+| Field validation triggers | Four `validateOn*` booleans | `validateOn?: readonly ('blur' \| 'change')[]`; submit always validates. |
+| Change-event compatibility | `disabledOnChangeListener: false` enabled fallback | `changeEventFallback: true` enables fallback with positive semantics. |
+| Top-level render callbacks | `componentProps(values, actions, ctx)`, `help(values, actions, ctx)`, `renderComponentContent(values, actions, ctx)` | Receive only lightweight `FormSchemaContext`; value-dependent behavior moves to `dependencies.resolve`. |
+| `validateAndSubmit()` | Repeated low-level validation/scroll handling and could validate again during submit | Delegates to canonical `validate()` and shared submission logic; invalid forms do not submit. |
+| `getValues()` | Implicitly returned transformed values | Returns codec-encoded `TSubmitValues`; without a codec it preserves legacy formatting. |
+
+### Removed APIs
+
+| Removed API | Replacement |
+| --- | --- |
+| `FormValidationOptions` | `validate()` and `validateField(fieldName)` no longer accept options. |
+| `force` / `silent` / `validated-only` validation modes | Removed because these vee modes have no TanStack runtime semantics. |
+| `validateOnBlur` / `validateOnChange` / `validateOnInput` / `validateOnModelUpdate` | Use `formFieldProps.validateOn`; input and model updates are represented by `change`. |
+| `disabledOnChangeListener` | Use positive `changeEventFallback`. |
+| `disabledOnInputListener` | Input listeners are no longer bound automatically; provide `componentProps.onInput` explicitly when required. |
+| `values/actions` parameters from top-level schema render functions | Use `FormSchemaContext`; move value-dependent behavior to `dependencies.resolve`. |
+
+### Deprecated but Supported
+
+- `dependencies.if/show/disabled/required/rules/componentProps/trigger` remain compatible for this release, but every callback is marked `@deprecated` and emits one development warning. If both syntaxes bypass the type union, `resolve` wins.
+- `resetForm`, `submitForm`, `resetValidate`, and `validateAndSubmitForm` continue forwarding to canonical methods.
+- `FormActions` remains as a deprecated alias of `FormContextApi`.
+- `setupVbenForm({ defineRules })` remains supported; `rules` wins for duplicate names.
+- The re-exported `z`, `componentField` slots, and `emptyStateValue` remain unchanged.
+
+### Internal Behavior Changes
+
+- Field components use fine-grained value/error selectors; full error aggregation is no longer on the normal input path.
+- Async validators discard stale Promises through a Vben generation without reading private TanStack AbortController or meta fields.
+- New and legacy dependencies share one atomic executor, so stale async results cannot overwrite newer state.
+- New code uses one form-level codec to encode the complete object atomically; legacy array-to-string, range mapping, and schema `valueFormat` remain compatible but deprecated.
+
+## Typed Values and Slots
+
+Application adapters keep the UI component mapping fixed and expose the business value shape as the only generic:
+
+```ts
+interface AccountFormValues {
+  email: string;
+  nickname: string;
+}
+
+const [Form, formApi] = useVbenForm<AccountFormValues>({
+  handleSubmit(values) {
+    return addAccount(values);
+  },
+  schema: [
+    { component: 'Input', fieldName: 'email' },
+    { component: 'Input', fieldName: 'nickname' },
+  ],
+});
+```
+
+`TValues` flows through `VbenFormProps`, `FormSchema`, `FormApi`, `FormContextApi`, value APIs, submit/change callbacks, selectors, and dynamic schema callbacks. The returned `Form` component also exposes typed slots: known field slots use the matching value type for `field.state.value` and `componentField.modelValue`, while all field/default/action slots receive the complete `values` and matching `formApi`. Legacy forms without `TValues` retain arbitrary slot names and broad props.
+
+## New and Legacy Rule Registration
+
+Use `rules` in new code:
+
+```ts
+setupVbenForm({
+  rules: {
+    required(value, _params, context) {
+      const isEmpty =
+        value === undefined ||
+        value === null ||
+        value === '' ||
+        (Array.isArray(value) && value.length === 0);
+      return isEmpty ? `${context.label} is required` : true;
+    },
+  },
+});
+```
+
+The legacy `defineRules` option forwards to the same registry:
+
+```ts
+setupVbenForm({
+  defineRules: {
+    required: legacyRequiredRule,
+  },
+});
+```
+
+Legacy runtime usage emits one warning per deprecation key in development and no warnings in production. If both options define the same rule, `rules` wins. The `FormActions` type remains as a deprecated alias of `FormContextApi`; editors report the type deprecation because type-only usage cannot emit runtime warnings.
+
+## Running the Codemod
+
+Run the pinned tool against each affected tsconfig from a clean Git worktree:
+
+```bash
+npx --yes zod-v3-to-v4@1.21.3 path/to/tsconfig.json
+```
+
+The tool edits `.ts`, `.tsx`, and `.vue` files in place and has no dry-run mode. Always review `git diff` afterward.
+
+The codemod primarily recognizes direct `zod` imports. Schemas that obtain `z` through `@vben/common-ui` or an application adapter need manual review, especially constructor errors, string formats, and dynamic refinement messages.
+
+## Zod 4 Changes
+
+### Unified Error Parameters
+
+Replace `required_error` and `invalid_type_error` with `error`:
+
+```ts
+const count = z.number({
+  error: (issue) =>
+    issue.input === undefined ? 'Count is required' : 'Count must be a number',
+});
+```
+
+Use an `error(issue)` callback for dynamic refinement messages instead of passing a function that returns params as the second argument to `.refine()`.
+
+### String Formats and Errors
+
+Prefer top-level format schemas:
+
+```ts
+z.email('Invalid email');
+z.url('Invalid URL');
+z.uuid('Invalid UUID');
+```
+
+Read validation details from `ZodError.issues`; the old `.errors` property is removed.
+
+### Defaults and Optionality
+
+Zod 4 defaults may return immediately when the input is `undefined`. Review `.default().optional()` using actual parse behavior instead of internal type names.
+
+Vben initial values use this precedence:
+
+1. explicit schema `defaultValue`
+2. Zod `.default()`
+3. Zod 4-compatible `zod-defaults`
+4. component empty-state conventions
+
+Required markers are derived from whether the schema accepts `undefined`.
+
+### Wrappers, Refine, Transform, and Coerce
+
+Do not read `_def`, `_zod.def`, or `typeName`. Use public `.unwrap()` APIs and public pipe inputs. Delegate intersection defaults to the Zod 4-compatible `zod-defaults` package.
+
+Standard Schema validation does not write transform/coerce output back into TanStack Form state. Use the form-level codec for submission payload conversion, or explicitly call `parseAsync` inside the codec `encode` boundary when transformed schema output is required.
+
+Also review these changes:
+
+- `z.record()` should specify key and value schemas
+- `z.enum()` replaces former `nativeEnum` use cases
+- number integer, Infinity, and finite behavior
+- object strictness, merge, and unknown keys
+- intersection merge conflicts
+- coerce input types defaulting to `unknown`
+- removal of Zod 3 types such as `ZodEffects`, `ZodTypeAny`, and `AnyZodObject`
+
+## Form Engine Behavior
+
+`formFieldProps.validateOn` accepts `blur` and `change`, with both enabled by default; submit always validates fields. `asyncDebounceMs` configures TanStack Field async debounce. The four vee-style `validateOn*` booleans and `force/silent/validated-only` modes have been removed.
+
+The shadcn form primitives now use a Vben-owned field context. Labels, controls, descriptions, and messages continue to provide ids, `aria-invalid`, `aria-describedby`, touched, dirty, valid, and error states.
+
+`clearValidation(fieldNames?)` advances Vben's validator generation and clears public error state without relying on a private TanStack AbortController. A Promise that finishes later is discarded as stale. Omitting `fieldNames` covers every registered field and every field with an existing error.
+
+`dependencies.resolve(context)` is the recommended API: it evaluates once and atomically commits one dynamic-state patch, while stale async results are discarded as a unit. Legacy `if/show/disabled/required/rules/componentProps/trigger` callbacks remain supported through the same normalized executor, but are marked `@deprecated` and emit one development warning. Both APIs react only to declared `triggerFields`.
+
+`handleValuesChange(rawValues, fieldsChanged, getFormattedValues)` receives readonly `TFormValues` and runs codec or legacy formatting only when its third argument is called. `getRawValues()` returns form values and `getValues()` returns `TSubmitValues`; use `getValueSnapshot()` when both are required. `handleSubmit(values, rawValues)` receives both forms at submission. Legacy array-to-string, range mapping, and schema `valueFormat` remain compatible but deprecated. Array fields keep using TanStack push/remove operations and stable row identity.
+
+## Test and Acceptance Matrix
+
+Required coverage includes:
+
+- Zod defaults, optional, nullable, intersection, pipe, transform, coerce, and errors
+- runtime values, selectors, reset, manual errors, validation, and async validation
+- field binding, blur/change triggers, error messages, ARIA, dependencies, and arrays
+- new/legacy API equivalence, warning deduplication, production silence, and type aliases
+- complete `useVbenForm` lifecycle, submission, `handleValuesChange`, submit-on-change, and async race handling
+
+Acceptance requires zero TypeScript errors, zero build errors, all tests passing, no unhandled browser errors, modified-file formatting and lint passing, and no source dependency on vee or Zod private structures.
+
+## References
+
+- [Zod 4 release notes](https://zod.dev/v4)
+- [Zod migration guide](https://zod.dev/v4/changelog)
+- [TanStack Form Vue overview](https://tanstack.com/form/latest/docs/framework/vue/overview)
+- [TanStack Form validation](https://tanstack.com/form/latest/docs/framework/vue/guides/validation)
diff --git a/docs/src/guide/in-depth/zod-v4-form-migration.md b/docs/src/guide/in-depth/zod-v4-form-migration.md
new file mode 100644
index 00000000..6b7f9acd
--- /dev/null
+++ b/docs/src/guide/in-depth/zod-v4-form-migration.md
@@ -0,0 +1,274 @@
+---
+outline: deep
+---
+
+# Zod 4 与 TanStack Form 迁移指南
+
+本次迁移将表单校验 schema 从 Zod 3 升级到 Zod 4，并将内部表单引擎从 vee-validate 替换为 TanStack Form。迁移目标是保持 Vben 业务 API 稳定，同时移除业务代码对具体表单引擎的耦合。
+
+## 依赖变化
+
+| 类型 | 迁移前 | 迁移后 |
+| --- | --- | --- |
+| Schema | `zod@^3.25.76` | `zod@^4.4.3` |
+| 默认值 | `zod-defaults@0.1.3` | `zod-defaults@^0.2.3` |
+| 表单引擎 | `vee-validate@^4.15.1` | `@tanstack/vue-form@^1.33.2` |
+| Zod 适配器 | `@vee-validate/zod@^4.15.1` | 不再需要，TanStack Form 支持 Standard Schema |
+
+迁移后，源码、package manifest 和锁文件中都不应再依赖 `vee-validate` 或 `@vee-validate/zod`。
+
+## 上层兼容范围
+
+以下 Vben API 保持兼容：
+
+- `useVbenForm(options)` 仍返回 `[Form, formApi]`
+- `FormApi` 的值、校验、提交、重置、schema 更新和组件引用能力
+- `FormSchema` 的 `fieldName`、`component`、`componentProps`、`rules`、`dependencies`、`defaultValue`、已弃用的 `valueFormat` 和数组字段结构
+- `dependencies.triggerFields` 与回调参数
+- 组件适配器和 `z` 重导出路径
+- 自定义 slot 中原有的 `componentField` 绑定对象
+
+`formApi.form` 现在是库无关的 `FormContextApi`。它提供 values、errors、meta、字段读写、验证、提交、重置和数组操作，但不再暴露 vee `FormContext` 或原始 TanStack 实例。
+
+新代码使用 `reset`、`submit`、`validateAndSubmit` 和 `clearValidation`。旧的 `resetForm`、`submitForm`、`validateAndSubmitForm` 和 `resetValidate` 仍会委托给新实现，并通过 `@deprecated` 与开发环境一次性 warning 提示迁移；生产环境不输出 warning。
+
+## 本轮 Form UI API 变更
+
+### 新增 API
+
+| API | 类型/位置 | 说明 |
+| --- | --- | --- |
+| `dependencies.resolve(context)` | `FormItemDependenciesResolve` | 根据声明的 `triggerFields` 一次计算完整动态 patch，并原子更新字段状态。context 包含只读 `values`、`actions`、`controller` 和数组行感知的 `schema`。 |
+| `useValues()` | `FormContextApi` | 订阅完整表单值。仅在确实需要整表响应式值时使用。 |
+| `useFieldValue(fieldName)` | `FormContextApi` | 订阅单字段值，避免无关字段变化触发组件更新。 |
+| `useFieldValues(fieldNames)` | `FormContextApi` | 订阅一组字段值，主要用于声明式依赖计算。 |
+| `useFieldError(fieldName)` | `FormContextApi` | 订阅单字段错误，不再依赖全量错误对象。 |
+| `getRawValues()` | `FormApi` | 返回未执行 codec 或旧格式化管道的独立表单值快照。 |
+| `formatValues(rawValues)` | `FormApi` | 对指定原始值执行统一格式化流水线。 |
+| `getValueSnapshot()` | `FormApi` | 同时返回 `{ rawValues, values }`，其中 `values` 为 `TSubmitValues`。 |
+| `asyncDebounceMs` | `FormFieldOptions` | 设置 TanStack Field 异步校验防抖时间。 |
+| `changeEventFallback` | `FormCommonConfig` / adapter config | 为只发送 `change`、不发送 `update:*` 的旧组件启用事件回退，默认 `false`。 |
+
+`dependencies.resolve` 可以返回 `if`、`show`、`disabled`、`required`、`rules`、`componentProps`、`help` 和 `renderComponentContent`。未返回 `rules` 时继续使用静态规则；显式返回 `rules: null` 时关闭静态规则。
+
+### 变更的 API
+
+| API | 迁移前 | 迁移后 |
+| --- | --- | --- |
+| 提交回调 | `handleSubmit(values)` | `handleSubmit(values, rawValues)`；首参为格式化值，次参为同一次提交对应的只读原始快照。旧单参数函数仍可直接使用。 |
+| 值变化回调 | `handleValuesChange(values, fieldsChanged)` | `handleValuesChange(rawValues, fieldsChanged, getFormattedValues)`；第三个参数为惰性格式化函数，不调用时不产生深拷贝和转换开销。 |
+| 字段校验触发 | 四个 `validateOn*` 布尔项 | `validateOn?: readonly ('blur' \| 'change')[]`；submit 始终校验。 |
+| change 事件兼容 | `disabledOnChangeListener: false` 表示启用 | `changeEventFallback: true` 表示启用，改为正向语义。 |
+| 顶层动态渲染回调 | `componentProps(values, actions, ctx)`、`help(values, actions, ctx)`、`renderComponentContent(values, actions, ctx)` | 仅接收轻量 `FormSchemaContext`。依赖表单值的动态逻辑迁移到 `dependencies.resolve`。 |
+| `validateAndSubmit()` | 自行调用底层校验并重复实现错误滚动，提交阶段可能再次校验 | 委托统一 `validate()` 与共享提交逻辑，无效时不提交，错误滚动只有一个实现。 |
+| `getValues()` | 隐式完成所有字段转换 | 返回 codec 编码后的 `TSubmitValues`；无 codec 时保持旧格式化行为。 |
+
+### 删除的 API
+
+| 已删除 API | 替代方式 |
+| --- | --- |
+| `FormValidationOptions` | `validate()` 与 `validateField(fieldName)` 不再接收 options。 |
+| `force` / `silent` / `validated-only` validation mode | 这些 vee mode 在 TanStack runtime 中没有对应语义，直接删除。 |
+| `validateOnBlur` / `validateOnChange` / `validateOnInput` / `validateOnModelUpdate` | 使用 `formFieldProps.validateOn`；input 与 model update 统一归入 `change`。 |
+| `disabledOnChangeListener` | 使用正向语义的 `changeEventFallback`。 |
+| `disabledOnInputListener` | 不再自动绑定 input listener；确需自定义 input 处理时在 `componentProps.onInput` 中显式提供。 |
+| 顶层 schema 渲染函数中的 `values/actions` 参数 | 使用 `FormSchemaContext`；值相关联动使用 `dependencies.resolve`。 |
+
+### 已弃用但保留兼容
+
+- `dependencies.if/show/disabled/required/rules/componentProps/trigger` 本轮仍完整兼容，但均已标记 `@deprecated`。开发环境首次使用时警告一次；新旧语法绕过类型同时存在时以 `resolve` 为准。
+- `resetForm`、`submitForm`、`resetValidate` 和 `validateAndSubmitForm` 继续转发到新方法。
+- `FormActions` 继续作为 `FormContextApi` 的弃用类型别名。
+- `setupVbenForm({ defineRules })` 继续兼容；与 `rules` 同名时新 API 优先。
+- `z` 重导出、`componentField` slot 和 `emptyStateValue` 保持不变。
+
+### 非 API 行为调整
+
+- 字段组件改用细粒度 value/error selector；全量错误聚合退出普通输入热路径。
+- async validator 通过 Vben generation 丢弃过期 Promise，不读取 TanStack 私有 AbortController 或 meta 字段。
+- dependencies 新旧语法共用一个原子执行器，异步旧结果不会覆盖新状态。
+- 新代码使用表单级 codec 原子编码完整对象；旧 array-to-string、时间范围映射和 schema `valueFormat` 继续兼容但已弃用。
+
+## 值类型与插槽类型
+
+应用 adapter 保留 UI 组件类型，只把业务值类型作为泛型暴露：
+
+```ts
+interface AccountFormValues {
+  email: string;
+  nickname: string;
+}
+
+const [Form, formApi] = useVbenForm<AccountFormValues>({
+  handleSubmit(values) {
+    return addAccount(values);
+  },
+  schema: [
+    { component: 'Input', fieldName: 'email' },
+    { component: 'Input', fieldName: 'nickname' },
+  ],
+});
+```
+
+`TValues` 会传递给 `VbenFormProps`、`FormSchema`、`FormApi`、`FormContextApi`、值读写 API、提交/变化回调、selector 和 schema 动态回调。返回的 `Form` 组件同时提供 typed slots：已知字段插槽的 `field.state.value` 与 `componentField.modelValue` 使用对应字段类型，并额外提供完整 `values` 与同型 `formApi`；默认和操作插槽也提供 `values/formApi`。未声明 `TValues` 的旧表单仍允许任意字段插槽并回退为宽泛类型。
+
+## 新旧规则注册 API
+
+新代码使用 `rules`：
+
+```ts
+setupVbenForm({
+  rules: {
+    required(value, _params, context) {
+      const isEmpty =
+        value === undefined ||
+        value === null ||
+        value === '' ||
+        (Array.isArray(value) && value.length === 0);
+      return isEmpty ? `${context.label} is required` : true;
+    },
+  },
+});
+```
+
+旧的 `defineRules` 仍会转发到同一个规则注册表：
+
+```ts
+setupVbenForm({
+  defineRules: {
+    required: legacyRequiredRule,
+  },
+});
+```
+
+使用旧入口时，开发环境针对该弃用项只输出一次警告；生产环境不输出。若同时提供 `rules` 与 `defineRules` 的同名规则，`rules` 优先。`FormActions` 类型保留为 `FormContextApi` 的弃用别名，类型别名本身无法触发运行时警告，编辑器会通过 `@deprecated` 提示迁移。
+
+## 使用迁移工具
+
+建议在干净的 Git 工作树中按项目 tsconfig 执行固定版本工具：
+
+```bash
+npx --yes zod-v3-to-v4@1.21.3 path/to/tsconfig.json
+```
+
+工具会原地修改 `.ts`、`.tsx` 和 `.vue` 文件，没有 dry-run 模式。执行后必须检查 `git diff`。
+
+工具只能可靠识别直接从 `zod` 导入的调用。通过 `@vben/common-ui` 或应用 adapter 间接取得 `z` 的 schema 需要人工审计，尤其是构造器错误参数、字符串格式和动态 refine 参数。
+
+## Zod 4 代码变更
+
+### 错误参数
+
+构造器中的 `required_error` 和 `invalid_type_error` 合并为 `error`：
+
+```ts
+const count = z.number({
+  error: (issue) =>
+    issue.input === undefined ? 'Count is required' : 'Count must be a number',
+});
+```
+
+refinement 继续支持字符串或对象参数。需要根据输入动态生成消息时，使用 `error(issue)`，不再传入返回 params 的第二个函数。
+
+### 字符串格式
+
+优先使用顶层格式 API：
+
+```ts
+z.email('Invalid email');
+z.url('Invalid URL');
+z.uuid('Invalid UUID');
+```
+
+旧的 `z.string().email()` 等形式不应继续新增。
+
+### 错误列表
+
+ZodError 使用 `issues`：
+
+```ts
+const result = schema.safeParse(value);
+if (!result.success) {
+  console.log(result.error.issues);
+}
+```
+
+不要读取已移除的 `.errors`。
+
+### 默认值与 optional
+
+Zod 4 的 default 在输入为 `undefined` 时可以直接返回默认值。`.default().optional()` 的结果必须按实际 parse 语义复核，而不是通过类型名称猜测。
+
+Vben 表单按以下优先级生成初值：
+
+1. schema 中显式 `defaultValue`
+2. Zod schema 中的 `.default()`
+3. `zod-defaults` 生成的对象、intersection 和基础空值
+4. Vben 组件约定的空字符串、空数组或空状态值
+
+必填标记以 schema 是否接受 `undefined` 为准。
+
+### 包装器、refine 与 transform
+
+不要读取 `_def`、`_zod.def` 或 `typeName`。公共包装器使用 `.unwrap()`；Zod 4 的 transform/pipe 使用公开的输入 schema。intersection 的默认值交给支持 Zod 4 的 `zod-defaults` 处理。
+
+TanStack Form 使用 Standard Schema 校验时不会自动把 transform/coerce 的输出写回当前表单 state。提交 payload 需要转换时，使用表单级 codec；如果必须提交 schema transform 后的结果，应在 codec 的 `encode` 边界显式调用 `parseAsync`。
+
+### 其他需要复核的 API
+
+- `z.record()` 需要明确 key schema 与 value schema
+- `z.enum()` 已覆盖原 `nativeEnum` 用法
+- number 的 `int`、Infinity 和 finite 约束需按 Zod 4 语义复核
+- object 的 strict、merge、unknown keys 行为需要通过测试确认
+- intersection 合并冲突现在可能直接抛出错误
+- coerce schema 的 input 类型默认为 `unknown`
+- `ZodEffects`、`ZodTypeAny`、`AnyZodObject` 等 Zod 3 类型不应继续使用
+
+## 表单引擎行为
+
+### 验证触发
+
+`formFieldProps.validateOn` 接收 `blur`、`change` 数组，默认两者都启用；所有字段仍会在 submit 时验证。`asyncDebounceMs` 映射到 TanStack Field 的异步防抖配置。原 vee 风格的四个 `validateOn*` 布尔项和 `force/silent/validated-only` mode 已删除。
+
+### 错误与可访问性
+
+shadcn form primitive 使用 Vben 自有字段上下文，不再注入 vee 的 `FieldContextKey`。`FormLabel`、`FormControl`、`FormDescription` 和 `FormMessage` 继续维护：
+
+- `for` 与 control id
+- `aria-invalid`
+- `aria-describedby`
+- touched、dirty、valid 和错误消息
+
+`clearValidation(fieldNames?)` 会递增 Vben validator generation 并清空公开错误状态，不依赖 TanStack 私有 AbortController。异步 Promise 即使随后完成也会因代次过期而被丢弃；省略字段参数时会处理全部已注册或已有错误的字段。
+
+### 依赖与数组
+
+`dependencies.resolve(context)` 是推荐语法：一次求值并原子提交完整动态 patch，过期异步结果整体丢弃。旧的 `if/show/disabled/required/rules/componentProps/trigger` 语法仍兼容，但已标记为 `@deprecated` 并在开发环境首次使用时提示迁移；内部仍归一到同一个执行器。两种语法都只根据 `triggerFields` 重算，无关字段变化不会执行回调。
+
+`handleValuesChange(rawValues, fieldsChanged, getFormattedValues)` 接收只读 `TFormValues`，第三个参数仅在调用时执行 codec 或旧格式化管道。`getRawValues()` 返回表单值，`getValues()` 返回 `TSubmitValues`；需要同时比较时使用 `getValueSnapshot()`。提交回调通过 `handleSubmit(values, rawValues)` 同时取得两种结构。旧 array-to-string、时间范围映射和 schema `valueFormat` 继续兼容但已弃用。数组字段继续使用 TanStack push/remove 操作和稳定行身份。
+
+## 测试与验收
+
+迁移至少需要覆盖以下层级：
+
+- Zod 4 helper：default、optional、nullable、intersection、pipe、transform、coerce 与错误参数
+- runtime：值读写、selector、reset、字段错误、validate 和异步校验
+- 组件：输入绑定、blur/change 触发、错误消息、ARIA、dependencies 和数组增删
+- 兼容：`rules`/`defineRules` 结果一致、开发 warning 去重、生产静默、类型别名
+- 集成：`useVbenForm` 生命周期、提交、`handleValuesChange`、submit-on-change 和 async race
+
+验收标准：
+
+1. 受影响 package、应用、playground 和 docs 无 TypeScript 错误
+2. form-ui 与所有应用构建成功
+3. 单元、组件和集成测试全部通过
+4. 浏览器 smoke 流程无 `pageerror`、`console.error` 或未处理 Promise
+5. 修改文件通过 oxfmt 与 ESLint
+6. 静态搜索中不再出现 vee 依赖、Zod 私有结构或 Zod 3 错误参数
+
+## 参考资料
+
+- [Zod 4 release notes](https://zod.dev/v4)
+- [Zod migration guide](https://zod.dev/v4/changelog)
+- [TanStack Form Vue overview](https://tanstack.com/form/latest/docs/framework/vue/overview)
+- [TanStack Form validation](https://tanstack.com/form/latest/docs/framework/vue/guides/validation)
diff --git a/docs/updates/20260811-个人中心.md b/docs/updates/20260811-个人中心.md
new file mode 100644
index 00000000..43f34d98
--- /dev/null
+++ b/docs/updates/20260811-个人中心.md
@@ -0,0 +1,28 @@
+# 2026-08-11 更新说明：个人中心（PC）
+
+## 一、功能概述
+
+顶栏头像下拉的「个人中心」此前指向 Vben 模板假数据页，本次重做为真实功能页，并在工作台新增入口。
+
+- **基本资料 tab**：头像（复用表单 Avatar 上传组件，走 `upload/image`）+ 昵称可编辑；登录账号 / 手机号 / 角色 / 所属门店 / 工号 / 最后登录等只读展示（身份信息不允许自助修改）
+- **修改密码 tab**：复用顶栏「修改密码」弹窗同一份表单 schema（`layouts/config/form.ts` 的 `passwordModalForm`）与同一个接口（`admin/update-password`），两个入口口径完全一致
+- 保存资料成功后后端同步刷新 Redis 会话，前端重拉 `auth/my-info`，顶栏与工作台头像昵称立即生效
+
+## 二、入口
+
+1. 顶栏头像下拉「个人中心」（已有，指向静态路由 `/profile`，不走 `xk_menu`）
+2. 工作台问候头：头像/姓名区域整块可点击（hover 反馈），铃铛旁新增「个人中心」圆形图标按钮（`lucide:user`，同 bell 样式）
+
+## 三、涉及文件
+
+- 重做 `views/_core/profile/index.vue`：左侧账号卡（头像/昵称/角色）+ 右侧 tab 容器，资料统一从 `auth/my-profile` 实时接口拉取；删除模板假 tab「安全设置」「新消息提醒」（连同 `security-setting.vue`、`notification-setting.vue`）
+- 重写 `views/_core/profile/base-setting.vue`：`useVbenForm`（Avatar + VbenInput）+ 只读信息栅格（主题变量适配暗色）
+- 重写 `views/_core/profile/password-setting.vue`：复用 `passwordModalForm` schema + `views/system/admin/api` 的 `updatePassword`
+- 新建 `views/_core/profile/api/index.ts`：`getMyProfile` / `updateMyProfile`（后端 `auth/my-profile`、`auth/update-my-profile`）
+- 修改 `views/dashboard/workspace/components/WorkspaceHeader.vue`：左侧区域可点 + 右侧个人中心按钮，颜色全走主题变量
+
+## 四、后端配套（xk-api）
+
+- 新增 `app/Service/common/profile/AdminProfileService.php`（五端共用：PC + 四个小程序管理端）
+- `AdminController` 加 `myProfile` / `updateMyProfile`，`routes/admin.php` auth 分组注册
+- 详细见 `sql/doc/0811-个人中心.md`
diff --git a/docs/updates/20260811-工作台与UI优化.md b/docs/updates/20260811-工作台与UI优化.md
new file mode 100644
index 00000000..bae975eb
--- /dev/null
+++ b/docs/updates/20260811-工作台与UI优化.md
@@ -0,0 +1,144 @@
+# 2026-08-11 更新说明：角色工作台 + 后台 UI 优化
+
+> 约定：以后每轮增强都在 `docs/updates/` 下按日期新增一份更新说明。
+
+## 一、角色工作台模块体系（新功能）
+
+工作台首页从「所有人一样」升级为「按角色装载模块」，模块配置存库、后台可视化调整。
+
+- 新表 `xk_role_workbench_widget`：按 `role_id` 配置模块（widget_code / 标题覆盖 / 排序 / 启停）
+- 后端 `workbench/layout` 按当前登录角色下发布局，前端按 code 动态挂组件
+- 角色管理页新增「工作台模块」配置抽屉：勾选模块、上下排序、保存即生效
+- 各角色专属 KPI 摘要接口（轻量 count，与对应列表页同口径）：
+  - 医生：今日接诊（待接诊/接诊中/已完成/开方数/有效处方金额，与医生小程序同口径）
+  - 药师：待审方总数
+  - 业务员/省/市经理：门店录入摘要（近 7 天，复用业务员看板接口）
+  - 诊所管理员：今日挂号 + 待发货
+  - 订单管理员：平台待发货 / 退款处理中
+
+## 二、超管/系统管理员工作台修正（本次反馈重点）
+
+**问题**：超管看到的是业务员视角的「门店录入」摘要（近 7 天无新录入时全是 0），不是角色判断 bug，而是初版种子把该模块也配给了超管/系统管理员，内容错配。
+
+**修正**：超管/系统管理员换成两个专属模块——
+
+1. **平台总览**（`platform_overview`）：今日订单数、今日营业额（有效商品订单 + 有效挂号，与业务员看板同口径）、今日挂号数、今日新增门店录入，点击直达对应列表页
+2. **待办中心**（`todo_center`）：行式待办列表，数量 > 0 高亮，点击直达处理页
+   - 待审方 → 审方列表
+   - 待审核提现 → 提现审核
+   - 待审核门店录入 → 录入审核
+   - 待发货订单 / 退款处理中 → 商品订单
+   - 全部清零时展示「今日无待办」空态
+
+省/市经理和业务员仍保留「门店录入」摘要（语义匹配）。超管如需再看门店录入，可在「角色管理 → 工作台模块」自助勾回。
+
+## 三、工作台 KPI 组件健壮性（功能性补强）
+
+此前 KPI 卡接口失败或加载中会**整卡消失**（用户感知为「功能坏了」），本次统一收口到 `KpiCard` 外壳：
+
+- 加载中：渲染与统计芯片同形状的骨架占位，无布局跳动
+- 失败：显示「数据加载失败 + 重试」，可点击重拉
+- 标题栏新增手动刷新按钮（加载时图标旋转）
+- 七个 KPI 模块（医生/药师/业务员/诊所/订单/平台总览/待办中心）全部接入
+
+## 四、提现管理页 UI 优化
+
+- 状态列（审核状态/审核结果/打款状态）从素 Tag、裸文本换成带圆点的主题化状态胶囊，颜色走 `--success/--warning/--destructive` 变量，暗色自动适配
+- 资金变动金额列去掉写死的 `#52c41a/#ff4d4f`（暗色下刺眼），改主题变量 + 涨跌趋势图标 + 等宽数字
+- 列表区外壳与顶部账户卡统一 14px 圆角 + 主题描边
+- 四个列表本就走自有封装 `useVbenVxeGrid`，保持不变
+
+## 五、消息中心优化
+
+- **消息列表**：首次加载改为与消息行同布局的 shimmer 骨架屏；「今天/昨天/近 7 天」日期分组滚动吸顶（毛玻璃底）
+- **通知详情页**（`/notice/detail/:id`）整页重做：
+  - 与收件箱同一套视觉：按消息类型色晕染的氛围渐变 + Hero 卡片 + 主题变量配色，暗色全适配（原来写死 gray/sky 色值）
+  - 修复 bug：Markdown 预览原来写死暗色主题，亮色模式下是一块黑底，现在跟随系统亮/暗切换
+  - 保留全部逻辑：VIP 站内信解析、未读人员名单、富文本/Markdown 双渲染
+
+## 六、工作台布局重排 + 周期总结分受众（第三轮增强）
+
+### 6.1 超管工作台顶部双列布局
+
+- **平台总览 + 待办中心合并为一张「管理驾驶舱」卡**（`WidgetAdminHub.vue`）：上半是四个总览统计芯片，分隔线下半是待办统计芯片（同视觉，count>0 主色高亮），两个接口并行拉取、共用一个刷新/骨架/重试
+- 合并卡放在**快捷入口上方左列（约 58%）**，右列（约 42%）是公告卡，窄屏（<1024px）自动退化为上下堆叠
+- 其他角色（布局不含这两个模块）保持原布局不变（快捷入口在顶、公告在底）
+
+### 6.2 公告卡增强（后端零改动）
+
+- 每条公告新增**类型胶囊**：按标题关键词前端推导（维护/停机 → 维护、更新/升级 → 更新、活动/福利 → 活动、默认 → 公告），主题色变量着色
+- **点击公告行弹出详情弹层**：`announcement/latest` 本就全量返回 content，前端直接用 premium 风格弹层（光斑 Hero 头 + 富文本正文）展示，暗色全适配
+
+### 6.3 周期总结分受众版本（后端新能力）
+
+原周期总结只发平台管理员、只有平台指标。现在一次 `notice:period-report` 执行推送**五个受众版本**，各自看各自的经营数据：
+
+| 受众 | 接收人 | 指标 |
+|---|---|---|
+| 平台 | 超管/系统管理员/总部财务 | 活跃门店、挂号、处方（线上/线下、待审/通过/驳回）、临期待审 |
+| 诊所 | 诊所管理员（yii_store.type=0） | 本店挂号（总数/已完成）、处方（总数/待审）、结算收入 |
+| 药店 | 诊所管理员（yii_store.type=1） | 本店有效订单/营业额、待发货、退款处理中、结算收入 |
+| 供应商 | 供应商账号（role 7） | 分账笔数、已结算/待结算金额（yii_ledger user_type=3） |
+| 配送仓库 | 仓库管理员（role 16） | 新增/已发/待发包裹（xk_product_order_shipment）、结算收入 |
+
+- 指标全部 `whereIn + groupBy` 批量聚合（`AudienceOpsSummaryService`），不逐店查库
+- `action_payload` 新增 `audience` / `subject`（主体 id+名称）字段，旧数据无 audience 按平台版兼容渲染
+- crontab 不变，同一条命令自动多受众分发
+
+### 6.4 周期总结详情视图重做（毛玻璃）
+
+`PeriodReportView.vue` 整体重写：
+
+- 按 `audience` 切换五套指标瓷砖配置 + 受众徽标（平台/诊所/药店/供应商/配送仓库），一套模板配置驱动
+- 毛玻璃视觉：Hero 区双主色光斑 + `backdrop-filter: blur`，指标瓷砖半透明底 + 磨砂 + 内侧高光细线，warn/ok 色调走 `--warning`/成功色低透明度，暗色全适配
+- Markdown 文字摘要收进可折叠玻璃面板（默认收起，指标卡已表达核心信息）
+
+## 七、SQL 与上线步骤
+
+按顺序执行（均幂等，可重复执行）：
+
+1. `sql/20260811/xk_role_workbench_widget.sql` — 建表 + 全角色初版种子
+2. `sql/20260811/xk_role_workbench_widget_fix_admin.sql` — 软删超管/系统的门店录入，换上平台总览 + 待办中心
+
+后端无需额外操作（路由自动注册）；前端正常发版即可。
+
+## 涉及文件清单
+
+### xk-api（后端）
+
+| 文件 | 变更 |
+|---|---|
+| `app/Enum/WorkbenchWidgetEnum.php` | 新增 `platform_overview` / `todo_center` |
+| `app/Service/admin/system/WorkbenchService.php` | 新增 `platformOverview()` / `todoCenter()` |
+| `app/Http/Controllers/admin/system/WorkbenchController.php` | 新增两个 GET 端点 |
+| `app/Service/admin/system/RoleWorkbenchWidgetService.php` | （前轮）角色模块配置 CRUD |
+| `app/Service/common/doctor/DoctorWorkbenchStatsService.php` | （前轮）医生统计公共口径 |
+| `app/Enum/PeriodReportAudienceEnum.php` | 新增：周期总结受众枚举 |
+| `app/Service/common/notice/AudienceOpsSummaryService.php` | 新增：诊所/药店/供应商/仓库指标批量聚合 |
+| `app/Service/common/notice/AdminNoticePeriodReportService.php` | 重构：五受众分发，payload 带 audience/subject |
+| `app/Console/Commands/NoticePeriodReportCommand.php` | 描述更新（签名不变，crontab 无需调整） |
+
+### xk-admin（前端）
+
+| 文件 | 变更 |
+|---|---|
+| `views/dashboard/workspace/components/WidgetPlatformOverview.vue` | 新增：平台总览 |
+| `views/dashboard/workspace/components/WidgetTodoCenter.vue` | 新增：待办中心 |
+| `views/dashboard/workspace/components/KpiCard.vue` | 收口加载骨架/失败重试/手动刷新 |
+| `views/dashboard/workspace/components/Widget*.vue`（5 个角色 KPI） | 接入 loading/error/refresh |
+| `views/dashboard/workspace/api/index.ts`、`config/widgets.ts` | 新接口 + 组件注册 |
+| `views/dashboard/workspace/components/WidgetAdminHub.vue` | 新增：总览+待办合并驾驶舱卡 |
+| `views/dashboard/workspace/index.vue` | 顶部双列布局（左驾驶舱右公告） |
+| `views/dashboard/workspace/components/WidgetNotice.vue` | 类型胶囊 + 点击弹公告详情 |
+| `views/notice/views/PeriodReportView.vue` | 重写：五受众配置 + 毛玻璃视觉 |
+| `views/finance/withdrawal/index.vue` | 状态胶囊 + 暗色修复 + 列表壳统一 |
+| `views/notice/index.vue` | 骨架屏 + 粘性日期分组 |
+| `views/notice/compoents/detail.vue` | 整页重做 + MdPreview 主题跟随修复 |
+
+### sql
+
+| 文件 | 变更 |
+|---|---|
+| `20260811/xk_role_workbench_widget.sql` | （前轮）建表 + 初版种子 |
+| `20260811/xk_role_workbench_widget_fix_admin.sql` | 新增：超管/系统模块修正 |
+| `z_xk数据结构.sql` | （前轮）同步新表结构 |
diff --git a/docs/updates/20260812-日历待办与VIP质感.md b/docs/updates/20260812-日历待办与VIP质感.md
new file mode 100644
index 00000000..fba0cd62
--- /dev/null
+++ b/docs/updates/20260812-日历待办与VIP质感.md
@@ -0,0 +1,55 @@
+# 20260812 更新：日程日历（待办 + 提醒）与 VIP 组件黑金质感
+
+## 一、日程日历页（新增）
+
+菜单：「概览」组下「日程日历」（`/calendar`，name `WorkCalendar`，component `/dashboard/calendar/index`，SQL 见 sql 仓库 `20260812/xk_calendar_todo.sql`）。
+
+### 目录结构
+
+```
+views/dashboard/calendar/
+├── index.vue                    # 日历页（自定义头部 + antd Calendar + 右键菜单）
+├── api/index.ts                 # calendar-todo CRUD API
+├── config/
+│   ├── constants.ts             # 提醒渠道选项（notice/email/sms）
+│   └── form.ts                  # 待办弹窗表单 schema（级联显隐）
+├── components/
+│   ├── todo-modal.vue           # 新建/编辑待办弹窗（含删除）
+│   └── day-todos-modal.vue      # 当日待办列表弹窗（勾选完成/编辑/删除）
+└── utils/almanac.ts             # 黄历计算封装（lunar-typescript，带缓存）
+```
+
+### 功能点
+
+- **黄历**：农历（初一显示月名）、二十四节气、节日、法定调休「休/班」徽标；格子副标题按 节日 > 节气 > 农历日 择优展示，多个节日 Tooltip 全量提示
+  - 中国传统节日（春节/端午/中秋…）按农历推算；国际节日（元旦/圣诞/母亲节…）按公历——由 `lunar-typescript` 内置数据支持（新增依赖）
+- **右键菜单**：任意格子右键 → 新建待办 / 查看当日待办（Teleport 到 body，贴边自动内收，点击/滚动关闭）
+- **待办**：格子内直接显示前 3 条（完成划线），超出显示「还有 N 项」；hover 格子出现快捷「+」
+- **详情备注为 Markdown**：编辑用新封装的 `MarkdownEditor` 表单组件（`components/form/components/markdown-editor.vue`，自动注册、全项目可复用：精简工具栏 + 主题跟随亮暗），弹窗放宽到 640px；站内信提醒以 `edit_type=1` 发送、消息详情 MdPreview 渲染，邮件提醒后端转 HTML
+- **提醒**：待办可设提醒时间 + 多选渠道（站内信/邮箱/短信），表单级联显隐（选邮箱/短信渠道时出现收件人输入，不填回落个人资料）；后端每分钟扫描发送
+- **头部**：公历年月 + 农历干支生肖年、图例、上月/今天/下月、新建待办
+- 全部配色走 `hsl(var(--xxx))` 主题变量，暗色模式自动适配
+
+### 新依赖
+
+- `lunar-typescript@1.8.6`（农历/节气/节假日计算，纯 TS 无副作用）
+
+## 二、VIP 组件黑金质感升级
+
+旧版蓝绿渐变卡面（#2c3e50 → #6acdbb）统一升级为「黑金贵宾卡」视觉：深色曜石渐变底 + 右上暗金光晕 + 斜切流光 + 金色描边 + 香槟金文字。深色卡面亮/暗主题通用，删除了原 `.dark` 渐变分支。
+
+| 组件 | 改动 |
+| --- | --- |
+| `components/vip/StoreVipMemberCard.vue` | 诊所设置会员卡：黑金卡面 + glow/sheen 装饰层，期限改金字胶囊并入标题行 |
+| `components/vip/HeaderVipBadge.vue` | 顶栏 VIP 气泡卡头图：黑金化 + glow，期限胶囊化 |
+| `components/vip/VipUpgradeModal.vue` | 开通/升级弹窗预览卡：黑金化 + glow |
+
+`VipHubModal` / `VipStoreRecordsModal` / `StoreVipCell`（主题变量）与 `VipBadgeCombo`（纯图片）/ `VipGate`（纯逻辑）无需调整。
+
+小程序端（xk-doctor-wx）同步升级：`vip-member-card.vue`（我的页会员卡）与 `my/vip-detail.vue`（会员详情头卡）同款黑金视觉。
+
+## 三、后端接口（xk-api）
+
+- `GET calendar-todo/get-list?start_time&end_time`：按范围查本人待办
+- `POST calendar-todo/create|update|delete|toggle-done`
+- 提醒调度：`calendar:todo-remind` 每分钟（routes/console.php）；短信模板需配 `SMS_TODO_REMIND_TEMPLATE_ID`，邮箱需配 SMTP
diff --git a/eslint.config.mjs b/eslint.config.mjs
index b29b567f..63bd9adc 100644
--- a/eslint.config.mjs
+++ b/eslint.config.mjs
@@ -1,5 +1,3 @@
-// @ts-check
-
 import { defineConfig } from '@vben/eslint-config';
 
 export default defineConfig();
diff --git a/internal/lint-configs/commitlint-config/index.d.ts b/internal/lint-configs/commitlint-config/index.d.ts
new file mode 100644
index 00000000..14b40f13
--- /dev/null
+++ b/internal/lint-configs/commitlint-config/index.d.ts
@@ -0,0 +1,6 @@
+// eslint-disable-next-line n/no-extraneous-import
+import type { UserConfig } from '@commitlint/types';
+
+declare const userConfig: UserConfig;
+
+export default userConfig;
diff --git a/internal/lint-configs/commitlint-config/index.mjs b/internal/lint-configs/commitlint-config/index.mjs
index 3d854399..36c3b09a 100644
--- a/internal/lint-configs/commitlint-config/index.mjs
+++ b/internal/lint-configs/commitlint-config/index.mjs
@@ -21,7 +21,7 @@ const scopeComplete = execSync('git status --porcelain || true')
   .trim()
   .split('\n')
   .find((r) => ~r.indexOf('M  src'))
-  ?.replace(/(\/)/g, '%%')
+  ?.replaceAll(/(\/)/g, '%%')
   ?.match(/src%%((\w|-)*)/)?.[1]
   ?.replace(/s$/, '');
 
diff --git a/internal/lint-configs/commitlint-config/package.json b/internal/lint-configs/commitlint-config/package.json
index 01b43088..58039485 100644
--- a/internal/lint-configs/commitlint-config/package.json
+++ b/internal/lint-configs/commitlint-config/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vben/commitlint-config",
-  "version": "5.5.1",
+  "version": "5.7.0",
   "private": true,
   "homepage": "https://github.com/vbenjs/vue-vben-admin",
   "bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
@@ -18,6 +18,7 @@
   "module": "./index.mjs",
   "exports": {
     ".": {
+      "types": "./index.d.ts",
       "import": "./index.mjs",
       "default": "./index.mjs"
     }
diff --git a/internal/lint-configs/eslint-config/build.config.ts b/internal/lint-configs/eslint-config/build.config.ts
deleted file mode 100644
index 97e572c5..00000000
--- a/internal/lint-configs/eslint-config/build.config.ts
+++ /dev/null
@@ -1,7 +0,0 @@
-import { defineBuildConfig } from 'unbuild';
-
-export default defineBuildConfig({
-  clean: true,
-  declaration: true,
-  entries: ['src/index'],
-});
diff --git a/internal/lint-configs/eslint-config/package.json b/internal/lint-configs/eslint-config/package.json
index 12556ec5..c59d4d46 100644
--- a/internal/lint-configs/eslint-config/package.json
+++ b/internal/lint-configs/eslint-config/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vben/eslint-config",
-  "version": "5.0.0",
+  "version": "5.7.0",
   "private": true,
   "homepage": "https://github.com/vbenjs/vue-vben-admin",
   "bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
@@ -12,7 +12,7 @@
   "license": "MIT",
   "type": "module",
   "scripts": {
-    "stub": "pnpm unbuild --stub"
+    "stub": "pnpm exec tsdown"
   },
   "files": [
     "dist"
@@ -27,30 +27,19 @@
     }
   },
   "dependencies": {
-    "eslint-config-turbo": "catalog:",
-    "eslint-plugin-command": "catalog:",
-    "eslint-plugin-import-x": "catalog:"
-  },
-  "devDependencies": {
     "@eslint/js": "catalog:",
-    "@types/eslint": "catalog:",
-    "@typescript-eslint/eslint-plugin": "catalog:",
     "@typescript-eslint/parser": "catalog:",
+    "@vben/oxlint-config": "workspace:*",
     "eslint": "catalog:",
-    "eslint-plugin-eslint-comments": "catalog:",
-    "eslint-plugin-jsdoc": "catalog:",
     "eslint-plugin-jsonc": "catalog:",
     "eslint-plugin-n": "catalog:",
-    "eslint-plugin-no-only-tests": "catalog:",
     "eslint-plugin-perfectionist": "catalog:",
-    "eslint-plugin-prettier": "catalog:",
-    "eslint-plugin-regexp": "catalog:",
-    "eslint-plugin-unicorn": "catalog:",
+    "eslint-plugin-pnpm": "catalog:",
     "eslint-plugin-unused-imports": "catalog:",
-    "eslint-plugin-vitest": "catalog:",
     "eslint-plugin-vue": "catalog:",
+    "eslint-plugin-yml": "catalog:",
     "globals": "catalog:",
-    "jsonc-eslint-parser": "catalog:",
-    "vue-eslint-parser": "catalog:"
+    "vue-eslint-parser": "catalog:",
+    "yaml-eslint-parser": "catalog:"
   }
 }
diff --git a/internal/lint-configs/eslint-config/src/configs/command.ts b/internal/lint-configs/eslint-config/src/configs/command.ts
deleted file mode 100644
index 67651b23..00000000
--- a/internal/lint-configs/eslint-config/src/configs/command.ts
+++ /dev/null
@@ -1,10 +0,0 @@
-import createCommand from 'eslint-plugin-command/config';
-
-export async function command() {
-  return [
-    {
-      // @ts-expect-error - no types
-      ...createCommand(),
-    },
-  ];
-}
diff --git a/internal/lint-configs/eslint-config/src/configs/comments.ts b/internal/lint-configs/eslint-config/src/configs/comments.ts
deleted file mode 100644
index 77ccd5dd..00000000
--- a/internal/lint-configs/eslint-config/src/configs/comments.ts
+++ /dev/null
@@ -1,24 +0,0 @@
-import type { Linter } from 'eslint';
-
-import { interopDefault } from '../util';
-
-export async function comments(): Promise<Linter.Config[]> {
-  const [pluginComments] = await Promise.all([
-    // @ts-expect-error - no types
-    interopDefault(import('eslint-plugin-eslint-comments')),
-  ] as const);
-
-  return [
-    {
-      plugins: {
-        'eslint-comments': pluginComments,
-      },
-      rules: {
-        'eslint-comments/no-aggregating-enable': 'error',
-        'eslint-comments/no-duplicate-disable': 'error',
-        'eslint-comments/no-unlimited-disable': 'error',
-        'eslint-comments/no-unused-enable': 'error',
-      },
-    },
-  ];
-}
diff --git a/internal/lint-configs/eslint-config/src/configs/disableds.ts b/internal/lint-configs/eslint-config/src/configs/disableds.ts
deleted file mode 100644
index 152b84ca..00000000
--- a/internal/lint-configs/eslint-config/src/configs/disableds.ts
+++ /dev/null
@@ -1,28 +0,0 @@
-import type { Linter } from 'eslint';
-
-export async function disableds(): Promise<Linter.Config[]> {
-  return [
-    {
-      files: ['**/__tests__/**/*.?([cm])[jt]s?(x)'],
-      name: 'disables/test',
-      rules: {
-        '@typescript-eslint/ban-ts-comment': 'off',
-        'no-console': 'off',
-      },
-    },
-    {
-      files: ['**/*.d.ts'],
-      name: 'disables/dts',
-      rules: {
-        '@typescript-eslint/triple-slash-reference': 'off',
-      },
-    },
-    {
-      files: ['**/*.js', '**/*.mjs', '**/*.cjs'],
-      name: 'disables/js',
-      rules: {
-        '@typescript-eslint/explicit-module-boundary-types': 'off',
-      },
-    },
-  ];
-}
diff --git a/internal/lint-configs/eslint-config/src/configs/ignores.ts b/internal/lint-configs/eslint-config/src/configs/ignores.ts
index 136c956d..29b16ce6 100644
--- a/internal/lint-configs/eslint-config/src/configs/ignores.ts
+++ b/internal/lint-configs/eslint-config/src/configs/ignores.ts
@@ -46,6 +46,14 @@ export async function ignores(): Promise<Linter.Config[]> {
         '**/*.sh',
         '**/*.ttf',
         '**/*.woff',
+        '**/.github',
+        '**/lefthook.yml',
+
+        '**/.agent/**',
+        '**/.agents/**',
+        '**/.codex/**',
+        '**/.claude/**',
+        '**/.cursor/**',
       ],
     },
   ];
diff --git a/internal/lint-configs/eslint-config/src/configs/import.ts b/internal/lint-configs/eslint-config/src/configs/import.ts
deleted file mode 100644
index 67a08fea..00000000
--- a/internal/lint-configs/eslint-config/src/configs/import.ts
+++ /dev/null
@@ -1,24 +0,0 @@
-import type { Linter } from 'eslint';
-
-import * as pluginImport from 'eslint-plugin-import-x';
-
-export async function importPluginConfig(): Promise<Linter.Config[]> {
-  return [
-    {
-      plugins: {
-        // @ts-expect-error - This is a dynamic import
-        import: pluginImport,
-      },
-      rules: {
-        'import/first': 'error',
-        'import/newline-after-import': 'error',
-        'import/no-duplicates': 'error',
-        'import/no-mutable-exports': 'error',
-        'import/no-named-default': 'error',
-        'import/no-self-import': 'error',
-        'import/no-unresolved': 'off',
-        'import/no-webpack-loader-syntax': 'error',
-      },
-    },
-  ];
-}
diff --git a/internal/lint-configs/eslint-config/src/configs/index.ts b/internal/lint-configs/eslint-config/src/configs/index.ts
index c0284efb..c1c2b4c9 100644
--- a/internal/lint-configs/eslint-config/src/configs/index.ts
+++ b/internal/lint-configs/eslint-config/src/configs/index.ts
@@ -1,17 +1,9 @@
-export * from './command';
-export * from './comments';
-export * from './disableds';
 export * from './ignores';
-export * from './import';
 export * from './javascript';
-export * from './jsdoc';
 export * from './jsonc';
 export * from './node';
 export * from './perfectionist';
-export * from './prettier';
-export * from './regexp';
-export * from './test';
-export * from './turbo';
+export * from './pnpm';
 export * from './typescript';
-export * from './unicorn';
 export * from './vue';
+export * from './yaml';
diff --git a/internal/lint-configs/eslint-config/src/configs/javascript.ts b/internal/lint-configs/eslint-config/src/configs/javascript.ts
index 0d87c1ba..0cab71f1 100644
--- a/internal/lint-configs/eslint-config/src/configs/javascript.ts
+++ b/internal/lint-configs/eslint-config/src/configs/javascript.ts
@@ -1,11 +1,80 @@
 import type { Linter } from 'eslint';
 
-// @ts-expect-error - no types
 import js from '@eslint/js';
 import pluginUnusedImports from 'eslint-plugin-unused-imports';
 import globals from 'globals';
 
+const rulesCoveredByOxlint = new Set([
+  'constructor-super',
+  'for-direction',
+  'getter-return',
+  'no-async-promise-executor',
+  'no-case-declarations',
+  'no-class-assign',
+  'no-compare-neg-zero',
+  'no-cond-assign',
+  'no-const-assign',
+  'no-constant-binary-expression',
+  'no-constant-condition',
+  'no-control-regex',
+  'no-debugger',
+  'no-delete-var',
+  'no-dupe-args',
+  'no-dupe-class-members',
+  'no-dupe-else-if',
+  'no-dupe-keys',
+  'no-duplicate-case',
+  'no-empty',
+  'no-empty-character-class',
+  'no-empty-pattern',
+  'no-empty-static-block',
+  'no-ex-assign',
+  'no-extra-boolean-cast',
+  'no-fallthrough',
+  'no-func-assign',
+  'no-global-assign',
+  'no-import-assign',
+  'no-invalid-regexp',
+  'no-irregular-whitespace',
+  'no-loss-of-precision',
+  'no-misleading-character-class',
+  'no-new-native-nonconstructor',
+  'no-nonoctal-decimal-escape',
+  'no-obj-calls',
+  'no-prototype-builtins',
+  'no-redeclare',
+  'no-regex-spaces',
+  'no-self-assign',
+  'no-setter-return',
+  'no-shadow-restricted-names',
+  'no-sparse-arrays',
+  'no-this-before-super',
+  'no-unassigned-vars',
+  'no-unexpected-multiline',
+  'no-unreachable',
+  'no-unsafe-finally',
+  'no-unsafe-negation',
+  'no-unsafe-optional-chaining',
+  'no-unused-labels',
+  'no-unused-private-class-members',
+  'no-unused-vars',
+  'no-useless-backreference',
+  'no-useless-catch',
+  'no-useless-escape',
+  'no-with',
+  'preserve-caught-error',
+  'require-yield',
+  'use-isnan',
+  'valid-typeof',
+]);
+
 export async function javascript(): Promise<Linter.Config[]> {
+  const recommendedRules = Object.fromEntries(
+    Object.entries(js.configs.recommended.rules).filter(
+      ([ruleName]) => !rulesCoveredByOxlint.has(ruleName),
+    ),
+  );
+
   return [
     {
       languageOptions: {
@@ -34,79 +103,12 @@ export async function javascript(): Promise<Linter.Config[]> {
         'unused-imports': pluginUnusedImports,
       },
       rules: {
-        ...js.configs.recommended.rules,
-        'accessor-pairs': [
-          'error',
-          { enforceForClassMembers: true, setWithoutGet: true },
-        ],
-        'array-callback-return': 'error',
-        'block-scoped-var': 'error',
-        'constructor-super': 'error',
-        'default-case-last': 'error',
+        ...recommendedRules,
         'dot-notation': ['error', { allowKeywords: true }],
-        eqeqeq: ['error', 'always'],
         'keyword-spacing': 'off',
-
-        'new-cap': [
-          'error',
-          { capIsNew: false, newIsCap: true, properties: true },
-        ],
-        'no-alert': 'error',
-        'no-array-constructor': 'error',
-        'no-async-promise-executor': 'error',
-        'no-caller': 'error',
-        'no-case-declarations': 'error',
-        'no-class-assign': 'error',
-        'no-compare-neg-zero': 'error',
-        'no-cond-assign': ['error', 'always'],
-        'no-console': ['error', { allow: ['warn', 'error'] }],
-        'no-const-assign': 'error',
-        'no-control-regex': 'error',
-        'no-debugger': 'error',
-        'no-delete-var': 'error',
-        'no-dupe-args': 'error',
-        'no-dupe-class-members': 'error',
-        'no-dupe-keys': 'error',
-        'no-duplicate-case': 'error',
-        'no-empty': ['error', { allowEmptyCatch: true }],
-        'no-empty-character-class': 'error',
         'no-empty-function': 'off',
-        'no-empty-pattern': 'error',
-        'no-eval': 'error',
-        'no-ex-assign': 'error',
-        'no-extend-native': 'error',
-        'no-extra-bind': 'error',
-        'no-extra-boolean-cast': 'error',
-        'no-fallthrough': 'error',
-        'no-func-assign': 'error',
-        'no-global-assign': 'error',
-        'no-implied-eval': 'error',
-        'no-import-assign': 'error',
-        'no-invalid-regexp': 'error',
-        'no-irregular-whitespace': 'error',
-        'no-iterator': 'error',
-        'no-labels': ['error', { allowLoop: false, allowSwitch: false }],
-        'no-lone-blocks': 'error',
-        'no-loss-of-precision': 'error',
-        'no-misleading-character-class': 'error',
-        'no-multi-str': 'error',
-        'no-new': 'error',
-        'no-new-func': 'error',
-        'no-new-object': 'error',
-        'no-new-symbol': 'error',
-        'no-new-wrappers': 'error',
-        'no-obj-calls': 'error',
         'no-octal': 'error',
         'no-octal-escape': 'error',
-        'no-proto': 'error',
-        'no-prototype-builtins': 'error',
-        'no-redeclare': ['error', { builtinGlobals: false }],
-        'no-regex-spaces': 'error',
-        'no-restricted-globals': [
-          'error',
-          { message: 'Use `globalThis` instead.', name: 'global' },
-          { message: 'Use `globalThis` instead.', name: 'self' },
-        ],
         'no-restricted-properties': [
           'error',
           {
@@ -139,57 +141,16 @@ export async function javascript(): Promise<Linter.Config[]> {
           'TSEnumDeclaration[const=true]',
           'TSExportAssignment',
         ],
-        'no-self-assign': ['error', { props: true }],
-        'no-self-compare': 'error',
-        'no-sequences': 'error',
-        'no-shadow-restricted-names': 'error',
-        'no-sparse-arrays': 'error',
-        'no-template-curly-in-string': 'error',
-        'no-this-before-super': 'error',
-        'no-throw-literal': 'error',
-        'no-undef': 'off',
         'no-undef-init': 'error',
-        'no-unexpected-multiline': 'error',
-        'no-unmodified-loop-condition': 'error',
-        'no-unneeded-ternary': ['error', { defaultAssignment: false }],
-        'no-unreachable': 'error',
+        'no-undef': 'off',
         'no-unreachable-loop': 'error',
-        'no-unsafe-finally': 'error',
-        'no-unsafe-negation': 'error',
-        'no-unused-expressions': [
-          'error',
-          {
-            allowShortCircuit: true,
-            allowTaggedTemplates: true,
-            allowTernary: true,
-          },
-        ],
-        'no-unused-vars': [
-          'error',
-          {
-            args: 'none',
-            caughtErrors: 'none',
-            ignoreRestSiblings: true,
-            vars: 'all',
-          },
-        ],
-        'no-use-before-define': [
-          'error',
-          { classes: false, functions: false, variables: true },
-        ],
-        'no-useless-backreference': 'error',
-        'no-useless-call': 'error',
-        'no-useless-catch': 'error',
-        'no-useless-computed-key': 'error',
-        'no-useless-constructor': 'error',
-        'no-useless-rename': 'error',
-        'no-useless-return': 'error',
-        'no-var': 'error',
-        'no-with': 'error',
         'object-shorthand': [
           'error',
           'always',
-          { avoidQuotes: true, ignoreConstructors: false },
+          {
+            avoidQuotes: true,
+            ignoreConstructors: false,
+          },
         ],
         'one-var': ['error', { initialized: 'never' }],
         'prefer-arrow-callback': [
@@ -199,24 +160,14 @@ export async function javascript(): Promise<Linter.Config[]> {
             allowUnboundThis: true,
           },
         ],
-        'prefer-const': [
+        'prefer-regex-literals': [
           'error',
           {
-            destructuring: 'all',
-            ignoreReadBeforeAssign: true,
+            disallowRedundantWrapping: true,
           },
         ],
-        'prefer-exponentiation-operator': 'error',
-
-        'prefer-promise-reject-errors': 'error',
-        'prefer-regex-literals': ['error', { disallowRedundantWrapping: true }],
-        'prefer-rest-params': 'error',
-        'prefer-spread': 'error',
-        'prefer-template': 'error',
-        'space-before-function-paren': 'off',
         'spaced-comment': 'error',
-        'symbol-description': 'error',
-        'unicode-bom': ['error', 'never'],
+        'space-before-function-paren': 'off',
 
         'unused-imports/no-unused-imports': 'error',
         'unused-imports/no-unused-vars': [
@@ -228,14 +179,6 @@ export async function javascript(): Promise<Linter.Config[]> {
             varsIgnorePattern: '^_',
           },
         ],
-        'use-isnan': [
-          'error',
-          { enforceForIndexOf: true, enforceForSwitchCase: true },
-        ],
-        'valid-typeof': ['error', { requireStringLiterals: true }],
-
-        'vars-on-top': 'error',
-        yoda: ['error', 'never'],
       },
     },
   ];
diff --git a/internal/lint-configs/eslint-config/src/configs/jsdoc.ts b/internal/lint-configs/eslint-config/src/configs/jsdoc.ts
deleted file mode 100644
index 13681976..00000000
--- a/internal/lint-configs/eslint-config/src/configs/jsdoc.ts
+++ /dev/null
@@ -1,34 +0,0 @@
-import type { Linter } from 'eslint';
-
-import { interopDefault } from '../util';
-
-export async function jsdoc(): Promise<Linter.Config[]> {
-  const [pluginJsdoc] = await Promise.all([
-    interopDefault(import('eslint-plugin-jsdoc')),
-  ] as const);
-
-  return [
-    {
-      plugins: {
-        jsdoc: pluginJsdoc,
-      },
-      rules: {
-        'jsdoc/check-access': 'warn',
-        'jsdoc/check-param-names': 'warn',
-        'jsdoc/check-property-names': 'warn',
-        'jsdoc/check-types': 'warn',
-        'jsdoc/empty-tags': 'warn',
-        'jsdoc/implements-on-classes': 'warn',
-        'jsdoc/no-defaults': 'warn',
-        'jsdoc/no-multi-asterisks': 'warn',
-        'jsdoc/require-param-name': 'warn',
-        'jsdoc/require-property': 'warn',
-        'jsdoc/require-property-description': 'warn',
-        'jsdoc/require-property-name': 'warn',
-        'jsdoc/require-returns-check': 'warn',
-        'jsdoc/require-returns-description': 'warn',
-        'jsdoc/require-yields-check': 'warn',
-      },
-    },
-  ];
-}
diff --git a/internal/lint-configs/eslint-config/src/configs/jsonc.ts b/internal/lint-configs/eslint-config/src/configs/jsonc.ts
index 4072e4cd..3f33d13a 100644
--- a/internal/lint-configs/eslint-config/src/configs/jsonc.ts
+++ b/internal/lint-configs/eslint-config/src/configs/jsonc.ts
@@ -3,17 +3,12 @@ import type { Linter } from 'eslint';
 import { interopDefault } from '../util';
 
 export async function jsonc(): Promise<Linter.Config[]> {
-  const [pluginJsonc, parserJsonc] = await Promise.all([
-    interopDefault(import('eslint-plugin-jsonc')),
-    interopDefault(import('jsonc-eslint-parser')),
-  ] as const);
+  const pluginJsonc = await interopDefault(import('eslint-plugin-jsonc'));
 
   return [
     {
       files: ['**/*.json', '**/*.json5', '**/*.jsonc', '*.code-workspace'],
-      languageOptions: {
-        parser: parserJsonc as any,
-      },
+      language: 'jsonc/x',
       plugins: {
         jsonc: pluginJsonc as any,
       },
@@ -48,6 +43,7 @@ export async function jsonc(): Promise<Linter.Config[]> {
     },
     sortTsconfig(),
     sortPackageJson(),
+    sortCspellJson(),
   ];
 }
 
@@ -130,6 +126,21 @@ function sortPackageJson(): Linter.Config {
   };
 }
 
+function sortCspellJson(): Linter.Config {
+  return {
+    files: ['**/cspell.json', '**/.cspell.json'],
+    rules: {
+      'jsonc/sort-array-values': [
+        'error',
+        {
+          order: { type: 'asc' },
+          pathPattern: '^words$|^ignorePaths$',
+        },
+      ],
+    },
+  };
+}
+
 function sortTsconfig(): Linter.Config {
   return {
     files: [
diff --git a/internal/lint-configs/eslint-config/src/configs/node.ts b/internal/lint-configs/eslint-config/src/configs/node.ts
index fa960d85..a79083e4 100644
--- a/internal/lint-configs/eslint-config/src/configs/node.ts
+++ b/internal/lint-configs/eslint-config/src/configs/node.ts
@@ -13,29 +13,26 @@ export async function node(): Promise<Linter.Config[]> {
       rules: {
         'n/handle-callback-err': ['error', '^(err|error)$'],
         'n/no-deprecated-api': 'error',
-        'n/no-exports-assign': 'error',
         'n/no-extraneous-import': [
           'error',
           {
             allowModules: [
-              'unbuild',
+              'tsdown',
+              'unplugin-vue',
               '@vben/vite-config',
               'vitest',
               'vite',
               '@vue/test-utils',
-              '@vben/tailwind-config',
               '@playwright/test',
             ],
           },
         ],
-        'n/no-new-require': 'error',
-        'n/no-path-concat': 'error',
         // 'n/no-unpublished-import': 'off',
         'n/no-unsupported-features/es-syntax': [
           'error',
           {
             ignores: [],
-            version: '>=18.0.0',
+            version: '>=22.18.0',
           },
         ],
         'n/prefer-global/buffer': ['error', 'never'],
@@ -44,6 +41,33 @@ export async function node(): Promise<Linter.Config[]> {
         'n/process-exit-as-throw': 'error',
       },
     },
+    {
+      files: [
+        '**/__tests__/**/*.?([cm])[jt]s?(x)',
+        '**/*.spec.?([cm])[jt]s?(x)',
+        '**/*.test.?([cm])[jt]s?(x)',
+        '**/*.bench.?([cm])[jt]s?(x)',
+        '**/*.benchmark.?([cm])[jt]s?(x)',
+      ],
+      rules: {
+        'n/prefer-global/process': 'off',
+      },
+    },
+    {
+      files: ['apps/backend-mock/**/**', 'docs/**/**'],
+      rules: {
+        'n/no-extraneous-import': 'off',
+        'n/prefer-global/buffer': 'off',
+        'n/prefer-global/process': 'off',
+      },
+    },
+    {
+      files: ['**/**/playwright.config.ts'],
+      rules: {
+        'n/prefer-global/buffer': 'off',
+        'n/prefer-global/process': 'off',
+      },
+    },
     {
       files: [
         'scripts/**/*.?([cm])[jt]s?(x)',
diff --git a/internal/lint-configs/eslint-config/src/configs/perfectionist.ts b/internal/lint-configs/eslint-config/src/configs/perfectionist.ts
index 1b17b30f..cb8c98c3 100644
--- a/internal/lint-configs/eslint-config/src/configs/perfectionist.ts
+++ b/internal/lint-configs/eslint-config/src/configs/perfectionist.ts
@@ -1,8 +1,12 @@
 import type { Linter } from 'eslint';
 
-import perfectionistPlugin from 'eslint-plugin-perfectionist';
+import { interopDefault } from '../util';
 
 export async function perfectionist(): Promise<Linter.Config[]> {
+  const perfectionistPlugin = await interopDefault(
+    import('eslint-plugin-perfectionist'),
+  );
+
   return [
     perfectionistPlugin.configs['recommended-natural'],
     {
@@ -17,38 +21,63 @@ export async function perfectionist(): Promise<Linter.Config[]> {
         'perfectionist/sort-imports': [
           'error',
           {
-            customGroups: {
-              type: {
-                vben: 'vben',
-                vue: 'vue',
+            customGroups: [
+              {
+                selector: 'type',
+                groupName: 'vben-core-type',
+                elementNamePattern: '^@vben-core/.+',
               },
-              value: {
-                vben: ['@vben*', '@vben/**/**', '@vben-core/**/**'],
-                vue: ['vue', 'vue-*', '@vue*'],
+              {
+                selector: 'type',
+                groupName: 'vben-type',
+                elementNamePattern: '^@vben/.+',
               },
-            },
+              {
+                selector: 'type',
+                groupName: 'vue-type',
+                elementNamePattern: ['^vue$', '^vue-.+', '^@vue/.+'],
+              },
+              {
+                groupName: 'vben',
+                elementNamePattern: '^@vben/.+',
+              },
+              {
+                groupName: 'vben-core',
+                elementNamePattern: '^@vben-core/.+',
+              },
+              {
+                groupName: 'vue',
+                elementNamePattern: ['^vue$', '^vue-.+', '^@vue/.+'],
+              },
+            ],
+            environment: 'node',
             groups: [
-              ['external-type', 'builtin-type', 'type'],
-              ['parent-type', 'sibling-type', 'index-type'],
-              ['internal-type'],
-              'builtin',
+              ['type-external', 'type-builtin', 'type-import'],
+              'vue-type',
+              'vben-type',
+              'vben-core-type',
+              ['type-parent', 'type-sibling', 'type-index'],
+              ['type-internal'],
+              'value-builtin',
               'vue',
               'vben',
-              'external',
-              'internal',
-              ['parent', 'sibling', 'index'],
+              'vben-core',
+              'value-external',
+              'value-internal',
+              ['value-parent', 'value-sibling', 'value-index'],
               'side-effect',
               'side-effect-style',
               'style',
-              'object',
+              'ts-equals-import',
               'unknown',
             ],
-            internalPattern: ['#*', '#*/**'],
-            newlinesBetween: 'always',
+            internalPattern: ['^#/.+'],
+            newlinesBetween: 1,
             order: 'asc',
             type: 'natural',
           },
         ],
+        'perfectionist/sort-modules': 'off',
         'perfectionist/sort-named-exports': [
           'error',
           {
@@ -57,7 +86,7 @@ export async function perfectionist(): Promise<Linter.Config[]> {
           },
         ],
         'perfectionist/sort-objects': [
-          'error',
+          'off',
           {
             customGroups: {
               items: 'items',
@@ -67,42 +96,6 @@ export async function perfectionist(): Promise<Linter.Config[]> {
             groups: ['unknown', 'items', 'list', 'children'],
             ignorePattern: ['children'],
             order: 'asc',
-            partitionByComment: 'Part:**',
-            type: 'natural',
-          },
-        ],
-        'perfectionist/sort-vue-attributes': [
-          'error',
-          {
-            // Based on: https://vuejs.org/style-guide/rules-recommended.html#element-attribute-order
-            customGroups: {
-              /* eslint-disable perfectionist/sort-objects */
-              DEFINITION: '*(is|:is|v-is)',
-              LIST_RENDERING: 'v-for',
-              CONDITIONALS: 'v-*(else-if|if|else|show|cloak)',
-              RENDER_MODIFIERS: 'v-*(pre|once)',
-              GLOBAL: '*(:id|id)',
-              UNIQUE: '*(ref|key|:ref|:key)',
-              SLOT: '*(v-slot|slot)',
-              TWO_WAY_BINDING: '*(v-model|v-model:*)',
-              // OTHER_DIRECTIVES e.g. 'v-custom-directive'
-              EVENTS: '*(v-on|@*)',
-              CONTENT: 'v-*(html|text)',
-              /* eslint-enable perfectionist/sort-objects */
-            },
-            groups: [
-              'DEFINITION',
-              'LIST_RENDERING',
-              'CONDITIONALS',
-              'RENDER_MODIFIERS',
-              'GLOBAL',
-              'UNIQUE',
-              'SLOT',
-              'TWO_WAY_BINDING',
-              'unknown',
-              'EVENTS',
-              'CONTENT',
-            ],
             type: 'natural',
           },
         ],
diff --git a/internal/lint-configs/eslint-config/src/configs/pnpm.ts b/internal/lint-configs/eslint-config/src/configs/pnpm.ts
new file mode 100644
index 00000000..5fe5afbf
--- /dev/null
+++ b/internal/lint-configs/eslint-config/src/configs/pnpm.ts
@@ -0,0 +1,38 @@
+import type { Linter } from 'eslint';
+
+import { interopDefault } from '../util';
+
+export async function pnpm(): Promise<Linter.Config[]> {
+  const [pluginPnpm, parserPnpm] = await Promise.all([
+    interopDefault(import('eslint-plugin-pnpm')),
+    interopDefault(import('yaml-eslint-parser')),
+  ] as const);
+
+  return [
+    {
+      files: ['package.json', '**/package.json'],
+      language: 'jsonc/x',
+      plugins: {
+        pnpm: pluginPnpm,
+      },
+      rules: {
+        'pnpm/json-enforce-catalog': 'error',
+        'pnpm/json-prefer-workspace-settings': 'error',
+        'pnpm/json-valid-catalog': 'error',
+      },
+    },
+    {
+      files: ['pnpm-workspace.yaml'],
+      languageOptions: {
+        parser: parserPnpm,
+      },
+      plugins: {
+        pnpm: pluginPnpm,
+      },
+      rules: {
+        'pnpm/yaml-no-duplicate-catalog-item': 'error',
+        'pnpm/yaml-no-unused-catalog-item': 'error',
+      },
+    },
+  ];
+}
diff --git a/internal/lint-configs/eslint-config/src/configs/prettier.ts b/internal/lint-configs/eslint-config/src/configs/prettier.ts
deleted file mode 100644
index 3cd7af40..00000000
--- a/internal/lint-configs/eslint-config/src/configs/prettier.ts
+++ /dev/null
@@ -1,19 +0,0 @@
-import type { Linter } from 'eslint';
-
-import { interopDefault } from '../util';
-
-export async function prettier(): Promise<Linter.Config[]> {
-  const [pluginPrettier] = await Promise.all([
-    interopDefault(import('eslint-plugin-prettier')),
-  ] as const);
-  return [
-    {
-      plugins: {
-        prettier: pluginPrettier,
-      },
-      rules: {
-        'prettier/prettier': 'error',
-      },
-    },
-  ];
-}
diff --git a/internal/lint-configs/eslint-config/src/configs/regexp.ts b/internal/lint-configs/eslint-config/src/configs/regexp.ts
deleted file mode 100644
index c0f4c9f4..00000000
--- a/internal/lint-configs/eslint-config/src/configs/regexp.ts
+++ /dev/null
@@ -1,20 +0,0 @@
-import type { Linter } from 'eslint';
-
-import { interopDefault } from '../util';
-
-export async function regexp(): Promise<Linter.Config[]> {
-  const [pluginRegexp] = await Promise.all([
-    interopDefault(import('eslint-plugin-regexp')),
-  ] as const);
-
-  return [
-    {
-      plugins: {
-        regexp: pluginRegexp,
-      },
-      rules: {
-        ...pluginRegexp.configs.recommended.rules,
-      },
-    },
-  ];
-}
diff --git a/internal/lint-configs/eslint-config/src/configs/test.ts b/internal/lint-configs/eslint-config/src/configs/test.ts
deleted file mode 100644
index ddfde2b8..00000000
--- a/internal/lint-configs/eslint-config/src/configs/test.ts
+++ /dev/null
@@ -1,45 +0,0 @@
-import type { Linter } from 'eslint';
-
-import { interopDefault } from '../util';
-
-export async function test(): Promise<Linter.Config[]> {
-  const [pluginTest, pluginNoOnlyTests] = await Promise.all([
-    interopDefault(import('eslint-plugin-vitest')),
-    // @ts-expect-error - no types
-    interopDefault(import('eslint-plugin-no-only-tests')),
-  ] as const);
-
-  return [
-    {
-      files: [
-        `**/__tests__/**/*.?([cm])[jt]s?(x)`,
-        `**/*.spec.?([cm])[jt]s?(x)`,
-        `**/*.test.?([cm])[jt]s?(x)`,
-        `**/*.bench.?([cm])[jt]s?(x)`,
-        `**/*.benchmark.?([cm])[jt]s?(x)`,
-      ],
-      plugins: {
-        test: {
-          ...pluginTest,
-          rules: {
-            ...pluginTest.rules,
-            ...pluginNoOnlyTests.rules,
-          },
-        },
-      },
-      rules: {
-        'no-console': 'off',
-        'node/prefer-global/process': 'off',
-        'test/consistent-test-it': [
-          'error',
-          { fn: 'it', withinDescribe: 'it' },
-        ],
-        'test/no-identical-title': 'error',
-        'test/no-import-node-test': 'error',
-        'test/no-only-tests': 'error',
-        'test/prefer-hooks-in-order': 'error',
-        'test/prefer-lowercase-title': 'error',
-      },
-    },
-  ];
-}
diff --git a/internal/lint-configs/eslint-config/src/configs/turbo.ts b/internal/lint-configs/eslint-config/src/configs/turbo.ts
deleted file mode 100644
index 9f6bf75b..00000000
--- a/internal/lint-configs/eslint-config/src/configs/turbo.ts
+++ /dev/null
@@ -1,18 +0,0 @@
-import type { Linter } from 'eslint';
-
-import { interopDefault } from '../util';
-
-export async function turbo(): Promise<Linter.Config[]> {
-  const [pluginTurbo] = await Promise.all([
-    // @ts-expect-error - no types
-    interopDefault(import('eslint-config-turbo')),
-  ] as const);
-
-  return [
-    {
-      plugins: {
-        turbo: pluginTurbo,
-      },
-    },
-  ];
-}
diff --git a/internal/lint-configs/eslint-config/src/configs/typescript.ts b/internal/lint-configs/eslint-config/src/configs/typescript.ts
index cff9aa4b..2f1e2163 100644
--- a/internal/lint-configs/eslint-config/src/configs/typescript.ts
+++ b/internal/lint-configs/eslint-config/src/configs/typescript.ts
@@ -2,12 +2,17 @@ import type { Linter } from 'eslint';
 
 import { interopDefault } from '../util';
 
+/**
+ * @typescript-eslint 的规则已迁移到 oxlint（typescript 插件）。
+ * 这里仅保留 TS 解析器，供其它 eslint 插件（perfectionist、n 等）解析 TS/TSX 文件。
+ * 因不再有类型感知规则，已移除 parserOptions.project，eslint 解析更快。
+ *
+ * 注意：移除 @typescript-eslint 插件后，unused-imports/no-unused-vars 会退回核心实现，
+ * 无法识别 TS 类型签名里的形参（会误报）。故对 TS/TSX/Vue 统一关闭该规则，
+ * 未使用变量改由 oxlint 的 no-unused-vars（类型感知）负责。
+ */
 export async function typescript(): Promise<Linter.Config[]> {
-  const [pluginTs, parserTs] = await Promise.all([
-    interopDefault(import('@typescript-eslint/eslint-plugin')),
-    // @ts-expect-error missing types
-    interopDefault(import('@typescript-eslint/parser')),
-  ] as const);
+  const parserTs = await interopDefault(import('@typescript-eslint/parser'));
 
   return [
     {
@@ -15,56 +20,23 @@ export async function typescript(): Promise<Linter.Config[]> {
       languageOptions: {
         parser: parserTs,
         parserOptions: {
-          createDefaultProgram: false,
           ecmaFeatures: {
             jsx: true,
           },
           ecmaVersion: 'latest',
           extraFileExtensions: ['.vue'],
           jsxPragma: 'React',
-          project: './tsconfig.*.json',
           sourceType: 'module',
         },
       },
-      plugins: {
-        '@typescript-eslint': pluginTs,
-      },
       rules: {
-        ...pluginTs.configs['eslint-recommended'].overrides?.[0].rules,
-        ...pluginTs.configs.strict.rules,
-        '@typescript-eslint/ban-ts-comment': [
-          'error',
-          {
-            'ts-check': false,
-            'ts-expect-error': 'allow-with-description',
-            'ts-ignore': 'allow-with-description',
-            'ts-nocheck': 'allow-with-description',
-          },
-        ],
-
-        // '@typescript-eslint/consistent-type-definitions': ['warn', 'interface'],
-        '@typescript-eslint/consistent-type-definitions': 'off',
-        '@typescript-eslint/explicit-function-return-type': 'off',
-        '@typescript-eslint/explicit-module-boundary-types': 'off',
-        '@typescript-eslint/no-empty-function': [
-          'error',
-          {
-            allow: ['arrowFunctions', 'functions', 'methods'],
-          },
-        ],
-        '@typescript-eslint/no-explicit-any': 'off',
-        '@typescript-eslint/no-namespace': 'off',
-        '@typescript-eslint/no-non-null-assertion': 'error',
-        '@typescript-eslint/no-unused-expressions': 'off',
-        '@typescript-eslint/no-unused-vars': [
-          'error',
-          {
-            argsIgnorePattern: '^_',
-            varsIgnorePattern: '^_',
-          },
-        ],
-        '@typescript-eslint/no-use-before-define': 'off',
-        '@typescript-eslint/no-var-requires': 'error',
+        'unused-imports/no-unused-vars': 'off',
+      },
+    },
+    {
+      // Vue `<script>` 的未使用变量同样交给 oxlint，避免核心规则误报 TS 类型签名形参
+      files: ['**/*.vue'],
+      rules: {
         'unused-imports/no-unused-vars': 'off',
       },
     },
diff --git a/internal/lint-configs/eslint-config/src/configs/unicorn.ts b/internal/lint-configs/eslint-config/src/configs/unicorn.ts
deleted file mode 100644
index 21b19025..00000000
--- a/internal/lint-configs/eslint-config/src/configs/unicorn.ts
+++ /dev/null
@@ -1,45 +0,0 @@
-import type { Linter } from 'eslint';
-
-import { interopDefault } from '../util';
-
-export async function unicorn(): Promise<Linter.Config[]> {
-  const [pluginUnicorn] = await Promise.all([
-    interopDefault(import('eslint-plugin-unicorn')),
-  ] as const);
-
-  return [
-    {
-      plugins: {
-        unicorn: pluginUnicorn,
-      },
-      rules: {
-        ...pluginUnicorn.configs.recommended.rules,
-
-        'unicorn/better-regex': 'off',
-        'unicorn/consistent-destructuring': 'off',
-        'unicorn/consistent-function-scoping': 'off',
-        'unicorn/expiring-todo-comments': 'off',
-        'unicorn/filename-case': 'off',
-        'unicorn/import-style': 'off',
-        'unicorn/no-array-for-each': 'off',
-        'unicorn/no-null': 'off',
-        'unicorn/no-useless-undefined': 'off',
-        'unicorn/prefer-at': 'off',
-        'unicorn/prefer-dom-node-text-content': 'off',
-        'unicorn/prefer-export-from': ['error', { ignoreUsedVariables: true }],
-        'unicorn/prefer-global-this': 'off',
-        'unicorn/prefer-top-level-await': 'off',
-        'unicorn/prevent-abbreviations': 'off',
-      },
-    },
-    {
-      files: [
-        'scripts/**/*.?([cm])[jt]s?(x)',
-        'internal/**/*.?([cm])[jt]s?(x)',
-      ],
-      rules: {
-        'unicorn/no-process-exit': 'off',
-      },
-    },
-  ];
-}
diff --git a/internal/lint-configs/eslint-config/src/configs/vue.ts b/internal/lint-configs/eslint-config/src/configs/vue.ts
index d1c6521c..edd57688 100644
--- a/internal/lint-configs/eslint-config/src/configs/vue.ts
+++ b/internal/lint-configs/eslint-config/src/configs/vue.ts
@@ -6,11 +6,18 @@ export async function vue(): Promise<Linter.Config[]> {
   const [pluginVue, parserVue, parserTs] = await Promise.all([
     interopDefault(import('eslint-plugin-vue')),
     interopDefault(import('vue-eslint-parser')),
-    // @ts-expect-error missing types
     interopDefault(import('@typescript-eslint/parser')),
   ] as const);
 
+  const flatEssential = pluginVue.configs?.['flat/essential'] || [];
+  const flatStronglyRecommended =
+    pluginVue.configs?.['flat/strongly-recommended'] || [];
+  const flatRecommended = pluginVue.configs?.['flat/recommended'] || [];
+
   return [
+    ...flatEssential,
+    ...flatStronglyRecommended,
+    ...flatRecommended,
     {
       files: ['**/*.vue'],
       languageOptions: {
@@ -43,12 +50,9 @@ export async function vue(): Promise<Linter.Config[]> {
       plugins: {
         vue: pluginVue,
       },
-      processor: pluginVue.processors['.vue'],
+      processor: pluginVue.processors?.['.vue'],
       rules: {
-        ...pluginVue.configs.base.rules,
-        ...pluginVue.configs['vue3-essential'].rules,
-        ...pluginVue.configs['vue3-strongly-recommended'].rules,
-        ...pluginVue.configs['vue3-recommended'].rules,
+        ...pluginVue.configs?.base?.rules,
 
         'vue/attribute-hyphenation': [
           'error',
@@ -124,14 +128,12 @@ export async function vue(): Promise<Linter.Config[]> {
           },
         ],
         'vue/one-component-per-file': 'error',
-        'vue/prefer-import-from-vue': 'error',
         'vue/prefer-separate-static-class': 'error',
         'vue/prefer-template': 'error',
         'vue/prop-name-casing': ['error', 'camelCase'],
         'vue/require-default-prop': 'error',
         'vue/require-explicit-emits': 'error',
         'vue/require-prop-types': 'off',
-        'vue/script-setup-uses-vars': 'error',
         'vue/singleline-html-element-content-newline': 'off',
         'vue/space-infix-ops': 'error',
         'vue/space-unary-ops': ['error', { nonwords: false, words: true }],
diff --git a/internal/lint-configs/eslint-config/src/configs/yaml.ts b/internal/lint-configs/eslint-config/src/configs/yaml.ts
new file mode 100644
index 00000000..920f2149
--- /dev/null
+++ b/internal/lint-configs/eslint-config/src/configs/yaml.ts
@@ -0,0 +1,93 @@
+import type { Linter } from 'eslint';
+
+import { interopDefault } from '../util';
+
+export async function yaml(): Promise<Linter.Config[]> {
+  const [pluginYaml, parserYaml] = await Promise.all([
+    interopDefault(import('eslint-plugin-yml')),
+    interopDefault(import('yaml-eslint-parser')),
+  ] as const);
+
+  return [
+    {
+      files: ['**/*.y?(a)ml'],
+      plugins: {
+        yaml: pluginYaml,
+      },
+      languageOptions: {
+        parser: parserYaml,
+      },
+      rules: {
+        'style/spaced-comment': 'off',
+
+        'yaml/block-mapping': 'error',
+        'yaml/block-sequence': 'error',
+        'yaml/no-empty-key': 'error',
+        'yaml/no-empty-sequence-entry': 'error',
+        'yaml/no-irregular-whitespace': 'error',
+        'yaml/plain-scalar': 'error',
+
+        'yaml/vue-custom-block/no-parsing-error': 'error',
+
+        'yaml/block-mapping-question-indicator-newline': 'error',
+        'yaml/block-sequence-hyphen-indicator-newline': 'error',
+        'yaml/flow-mapping-curly-newline': 'error',
+        'yaml/flow-mapping-curly-spacing': 'error',
+        'yaml/flow-sequence-bracket-newline': 'error',
+        'yaml/flow-sequence-bracket-spacing': 'error',
+        'yaml/indent': ['error', 2],
+        'yaml/key-spacing': 'error',
+        'yaml/no-tab-indent': 'error',
+        'yaml/quotes': [
+          'error',
+          {
+            avoidEscape: true,
+            prefer: 'single',
+          },
+        ],
+        'yaml/spaced-comment': 'error',
+      },
+    },
+    {
+      files: ['pnpm-workspace.yaml'],
+      rules: {
+        'yaml/sort-keys': [
+          'error',
+          {
+            order: [
+              'packages',
+              'publicHoistPattern',
+              'strictPeerDependencies',
+              'autoInstallPeers',
+              'dedupePeerDependents',
+              'verifyDepsBeforeRun',
+              'overrides',
+              'patchedDependencies',
+              'hoistPattern',
+              'catalog',
+              'catalogs',
+
+              'allowedDeprecatedVersions',
+              'allowBuilds',
+              'allowNonAppliedPatches',
+              'configDependencies',
+              'ignoredBuiltDependencies',
+              'ignoredOptionalDependencies',
+              'neverBuiltDependencies',
+              'onlyBuiltDependencies',
+              'onlyBuiltDependenciesFile',
+              'packageExtensions',
+              'peerDependencyRules',
+              'supportedArchitectures',
+            ],
+            pathPattern: '^$',
+          },
+          {
+            order: { type: 'asc' },
+            pathPattern: '^.+$',
+          },
+        ],
+      },
+    },
+  ];
+}
diff --git a/internal/lint-configs/eslint-config/src/custom-config.ts b/internal/lint-configs/eslint-config/src/custom-config.ts
index 973df922..5e2262a5 100644
--- a/internal/lint-configs/eslint-config/src/custom-config.ts
+++ b/internal/lint-configs/eslint-config/src/custom-config.ts
@@ -1,10 +1,6 @@
 import type { Linter } from 'eslint';
 
-const restrictedImportIgnores = [
-  '**/vite.config.mts',
-  '**/tailwind.config.mjs',
-  '**/postcss.config.mjs',
-];
+const restrictedImportIgnores = ['**/vite.config.mts'];
 
 const customConfig: Linter.Config[] = [
   // shadcn-ui 内部组件是自动生成的，不做太多限制
@@ -25,7 +21,6 @@ const customConfig: Linter.Config[] = [
     ignores: restrictedImportIgnores,
     rules: {
       'perfectionist/sort-interfaces': 'off',
-      'perfectionist/sort-objects': 'off',
     },
   },
   {
@@ -60,7 +55,6 @@ const customConfig: Linter.Config[] = [
           ],
         },
       ],
-      'perfectionist/sort-interfaces': 'off',
     },
   },
   {
@@ -134,19 +128,12 @@ const customConfig: Linter.Config[] = [
   {
     files: ['apps/backend-mock/**/**', 'docs/**/**'],
     rules: {
-      '@typescript-eslint/no-extraneous-class': 'off',
-      'n/no-extraneous-import': 'off',
-      'n/prefer-global/buffer': 'off',
-      'n/prefer-global/process': 'off',
       'no-console': 'off',
-      'unicorn/prefer-module': 'off',
     },
   },
   {
     files: ['**/**/playwright.config.ts'],
     rules: {
-      'n/prefer-global/buffer': 'off',
-      'n/prefer-global/process': 'off',
       'no-console': 'off',
     },
   },
@@ -156,6 +143,12 @@ const customConfig: Linter.Config[] = [
       'no-console': 'off',
     },
   },
+  {
+    files: ['packages/@core/base/shared/src/utils/inference.ts'],
+    rules: {
+      'vue/prefer-import-from-vue': 'off',
+    },
+  },
 ];
 
 export { customConfig };
diff --git a/internal/lint-configs/eslint-config/src/index.ts b/internal/lint-configs/eslint-config/src/index.ts
index c9f08bd5..3745ada9 100644
--- a/internal/lint-configs/eslint-config/src/index.ts
+++ b/internal/lint-configs/eslint-config/src/index.ts
@@ -1,23 +1,15 @@
 import type { Linter } from 'eslint';
 
 import {
-  command,
-  comments,
-  disableds,
   ignores,
-  importPluginConfig,
   javascript,
-  jsdoc,
   jsonc,
   node,
   perfectionist,
-  prettier,
-  regexp,
-  test,
-  turbo,
+  pnpm,
   typescript,
-  unicorn,
   vue,
+  yaml,
 } from './configs';
 import { customConfig } from './custom-config';
 
@@ -34,20 +26,12 @@ async function defineConfig(config: FlatConfig[] = []) {
     vue(),
     javascript(),
     ignores(),
-    prettier(),
     typescript(),
     jsonc(),
-    disableds(),
-    importPluginConfig(),
     node(),
     perfectionist(),
-    comments(),
-    jsdoc(),
-    unicorn(),
-    test(),
-    regexp(),
-    command(),
-    turbo(),
+    yaml(),
+    pnpm(),
     ...customConfig,
     ...config,
   ];
diff --git a/internal/lint-configs/eslint-config/tsdown.config.ts b/internal/lint-configs/eslint-config/tsdown.config.ts
new file mode 100644
index 00000000..a7a8ce27
--- /dev/null
+++ b/internal/lint-configs/eslint-config/tsdown.config.ts
@@ -0,0 +1,16 @@
+import { defineConfig } from 'tsdown';
+
+export default defineConfig({
+  clean: true,
+  deps: {
+    skipNodeModulesBundle: true,
+  },
+  dts: {
+    resolver: 'tsc',
+  },
+  entry: ['src/index.ts'],
+  format: ['esm'],
+  outExtensions: () => ({
+    dts: '.d.ts',
+  }),
+});
diff --git a/internal/lint-configs/prettier-config/package.json b/internal/lint-configs/oxfmt-config/package.json
similarity index 52%
rename from internal/lint-configs/prettier-config/package.json
rename to internal/lint-configs/oxfmt-config/package.json
index 65e8b8f8..c239c026 100644
--- a/internal/lint-configs/prettier-config/package.json
+++ b/internal/lint-configs/oxfmt-config/package.json
@@ -1,28 +1,32 @@
 {
-  "name": "@vben/prettier-config",
-  "version": "5.0.0",
+  "name": "@vben/oxfmt-config",
+  "version": "5.7.0",
   "private": true,
   "homepage": "https://github.com/vbenjs/vue-vben-admin",
   "bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/vbenjs/vue-vben-admin.git",
-    "directory": "internal/lint-configs/prettier-config"
+    "directory": "internal/lint-configs/oxfmt-config"
   },
   "license": "MIT",
   "type": "module",
+  "scripts": {
+    "stub": "pnpm exec tsdown"
+  },
   "files": [
     "dist"
   ],
-  "main": "./index.mjs",
-  "module": "./index.mjs",
+  "main": "./dist/index.mjs",
+  "module": "./dist/index.mjs",
+  "types": "./dist/index.d.ts",
   "exports": {
     ".": {
-      "default": "./index.mjs"
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.mjs"
     }
   },
   "dependencies": {
-    "prettier": "catalog:",
-    "prettier-plugin-tailwindcss": "catalog:"
+    "oxfmt": "catalog:"
   }
 }
diff --git a/internal/lint-configs/oxfmt-config/src/index.ts b/internal/lint-configs/oxfmt-config/src/index.ts
new file mode 100644
index 00000000..6bf31824
--- /dev/null
+++ b/internal/lint-configs/oxfmt-config/src/index.ts
@@ -0,0 +1,135 @@
+import { defineConfig as defineOxfmtConfig } from 'oxfmt';
+
+type OxfmtConfig = Parameters<typeof defineOxfmtConfig>[0];
+
+/**
+ * oxfmt 配置文件，详见下方链接
+ * https://oxc.rs/docs/guide/usage/formatter/config-file-reference.html
+ */
+const oxfmtConfig: OxfmtConfig = defineOxfmtConfig({
+  /**
+   * 单行长度 oxfmt，适配 prettier 的 80
+   * Default：100
+   */
+  printWidth: 80,
+  /**
+   * 缩进宽度
+   * Default：2
+   */
+  tabWidth: 2,
+  /**
+   * Markdown、MDX、YAML 文件格式化包裹
+   * type: always | never | preserve
+   * Default: preserve
+   */
+  proseWrap: 'never',
+  /**
+   * 结尾添加分号
+   * Default：true
+   */
+  semi: true,
+  /**
+   * 使用单引号
+   * Default：false
+   */
+  singleQuote: true,
+  /**
+   * 对象属性添加引号
+   * Default：as-needed
+   */
+  quoteProps: 'as-needed',
+  /**
+   * 将多行元素的 > 放在最后一行的末尾，而不是单独放在下一行
+   * Default：false
+   */
+  bracketSameLine: false,
+  /**
+   * 对象字面量的大括号间添加空格
+   * Default：true
+   */
+  bracketSpacing: true,
+  /**
+   * 箭头函数参数总是使用括号
+   * type: always | avoid
+   * Default：always
+   */
+  arrowParens: 'always',
+  /**
+   * 配置 package.json 排序，但是 oxfmt 不支持 pnpm-workspace
+   * 现使用 eslint 搭配 eslint-plugin-pnpm eslint-plugin-yml 支持 package.json 和 pnpm-workspace.yaml 但排序风格不太一致
+   * Default：true
+   */
+  sortPackageJson: false,
+  /**
+   * 配置 import 排序，现在 使用 eslint-plugin-perfectionist，但是 oxfmt 不支持 export 等
+   * 并且 customGroups 不支持 ts-equals-import
+   * Default：false
+   */
+  sortImports: false,
+  /**
+   * 多行结构中的后置逗号
+   * Default：all
+   */
+  trailingComma: 'all',
+  /**
+   * 行尾换行符
+   * type: lf | crlf | cr
+   * Default: lf
+   */
+  endOfLine: 'lf',
+  /**
+   * 在文件最后插入一个换行
+   * Default：true
+   */
+  insertFinalNewline: true,
+  /**
+   * 控制格式化文件中例如，CSS-in-JS 或 JS-in-Vue 等
+   * Default：auto
+   */
+  embeddedLanguageFormatting: 'auto',
+  /**
+   * Vue/HTML/Angular/Handlebars 的空白敏感度（oxfmt 现会格式化 <template>）
+   * type: css | strict | ignore
+   * Default：css
+   */
+  htmlWhitespaceSensitivity: 'css',
+  /**
+   * 暂时关闭，改动较多，后续可以考虑开启，支持 vue 但与现有的 eslint-plugin-better-tailwindcss 格式化会冲突
+   * eslint-plugin-better-tailwindcss配置在 oxlint，在 vue文 件暂时不生效，ts等正常
+   * Default：关闭
+   */
+  // sortTailwindcss: {
+  //   functions: ['clsx', 'cn', 'cva', 'tw'],
+  //   stylesheet: './internal/tailwind-config/src/theme.css',
+  //   preserveWhitespace: true,
+  // },
+  overrides: [
+    {
+      files: [
+        '*.json',
+        '*.json5',
+        '*.jsonc',
+        '*.code-workspace',
+        '**/*.json',
+        '**/*.json5',
+        '**/*.jsonc',
+        '**/*.code-workspace',
+      ],
+      options: {
+        trailingComma: 'none',
+        quoteProps: 'preserve',
+        singleQuote: false,
+      },
+    },
+  ],
+});
+
+function defineConfig(config: OxfmtConfig = {}): OxfmtConfig {
+  return defineOxfmtConfig({
+    ...oxfmtConfig,
+    ...config,
+  });
+}
+
+export { defineConfig, oxfmtConfig };
+export type { OxfmtConfig };
diff --git a/internal/lint-configs/oxfmt-config/tsconfig.json b/internal/lint-configs/oxfmt-config/tsconfig.json
new file mode 100644
index 00000000..b2ec3b61
--- /dev/null
+++ b/internal/lint-configs/oxfmt-config/tsconfig.json
@@ -0,0 +1,6 @@
+{
+  "$schema": "https://json.schemastore.org/tsconfig",
+  "extends": "@vben/tsconfig/node.json",
+  "include": ["src"],
+  "exclude": ["node_modules"]
+}
diff --git a/internal/lint-configs/oxfmt-config/tsdown.config.ts b/internal/lint-configs/oxfmt-config/tsdown.config.ts
new file mode 100644
index 00000000..c4f51c5e
--- /dev/null
+++ b/internal/lint-configs/oxfmt-config/tsdown.config.ts
@@ -0,0 +1,11 @@
+import { defineConfig } from 'tsdown';
+
+export default defineConfig({
+  clean: true,
+  dts: true,
+  entry: ['src/index.ts'],
+  format: ['esm'],
+  outExtensions: () => ({
+    dts: '.d.ts',
+  }),
+});
diff --git a/internal/lint-configs/oxlint-config/package.json b/internal/lint-configs/oxlint-config/package.json
new file mode 100644
index 00000000..bc20762f
--- /dev/null
+++ b/internal/lint-configs/oxlint-config/package.json
@@ -0,0 +1,35 @@
+{
+  "name": "@vben/oxlint-config",
+  "version": "5.7.0",
+  "private": true,
+  "homepage": "https://github.com/vbenjs/vue-vben-admin",
+  "bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/vbenjs/vue-vben-admin.git",
+    "directory": "internal/lint-configs/oxlint-config"
+  },
+  "license": "MIT",
+  "type": "module",
+  "scripts": {
+    "stub": "pnpm exec tsdown"
+  },
+  "files": [
+    "dist"
+  ],
+  "main": "./dist/index.mjs",
+  "module": "./dist/index.mjs",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.mjs"
+    }
+  },
+  "dependencies": {
+    "@eslint-community/eslint-plugin-eslint-comments": "catalog:",
+    "eslint-plugin-better-tailwindcss": "catalog:",
+    "eslint-plugin-command": "catalog:",
+    "oxlint": "catalog:"
+  }
+}
diff --git a/internal/lint-configs/oxlint-config/src/configs/command.ts b/internal/lint-configs/oxlint-config/src/configs/command.ts
new file mode 100644
index 00000000..1a3498cb
--- /dev/null
+++ b/internal/lint-configs/oxlint-config/src/configs/command.ts
@@ -0,0 +1,15 @@
+import type { OxlintConfig } from 'oxlint';
+
+const command: OxlintConfig = {
+  jsPlugins: [
+    {
+      name: 'command',
+      specifier: 'eslint-plugin-command',
+    },
+  ],
+  rules: {
+    'command/command': 'error',
+  },
+};
+
+export { command };
diff --git a/internal/lint-configs/oxlint-config/src/configs/comments.ts b/internal/lint-configs/oxlint-config/src/configs/comments.ts
new file mode 100644
index 00000000..ca342303
--- /dev/null
+++ b/internal/lint-configs/oxlint-config/src/configs/comments.ts
@@ -0,0 +1,19 @@
+import type { OxlintConfig } from 'oxlint';
+
+const comments: OxlintConfig = {
+  jsPlugins: [
+    {
+      name: 'eslint-comments',
+      specifier: '@eslint-community/eslint-plugin-eslint-comments',
+    },
+  ],
+  rules: {
+    'eslint/no-underscore-dangle': 'off',
+    'eslint-comments/no-aggregating-enable': 'error',
+    'eslint-comments/no-duplicate-disable': 'error',
+    'eslint-comments/no-unlimited-disable': 'error',
+    'eslint-comments/no-unused-enable': 'error',
+  },
+};
+
+export { comments };
diff --git a/internal/lint-configs/oxlint-config/src/configs/ignores.ts b/internal/lint-configs/oxlint-config/src/configs/ignores.ts
new file mode 100644
index 00000000..858a3cd7
--- /dev/null
+++ b/internal/lint-configs/oxlint-config/src/configs/ignores.ts
@@ -0,0 +1,17 @@
+import type { OxlintConfig } from 'oxlint';
+
+const ignores: OxlintConfig = {
+  ignorePatterns: [
+    '**/dist/**',
+    '**/node_modules/**',
+    'docs/**',
+    'playground/public/**',
+    '**/*.json',
+    '**/*.md',
+    '**/*.svg',
+    '**/*.yaml',
+    '**/*.yml',
+  ],
+};
+
+export { ignores };
diff --git a/internal/lint-configs/oxlint-config/src/configs/import.ts b/internal/lint-configs/oxlint-config/src/configs/import.ts
new file mode 100644
index 00000000..8e719ad4
--- /dev/null
+++ b/internal/lint-configs/oxlint-config/src/configs/import.ts
@@ -0,0 +1,18 @@
+import type { OxlintConfig } from 'oxlint';
+
+const importPluginConfig: OxlintConfig = {
+  rules: {
+    'import/consistent-type-specifier-style': ['error', 'prefer-top-level'],
+    'import/first': 'error',
+    'import/no-duplicates': 'error',
+    'import/no-mutable-exports': 'error',
+    'import/no-named-as-default': 'off',
+    'import/no-named-as-default-member': 'off',
+    'import/no-named-default': 'error',
+    'import/no-self-import': 'error',
+    'import/no-unassigned-import': 'off',
+    'import/no-webpack-loader-syntax': 'error',
+  },
+};
+
+export { importPluginConfig };
diff --git a/internal/lint-configs/oxlint-config/src/configs/index.ts b/internal/lint-configs/oxlint-config/src/configs/index.ts
new file mode 100644
index 00000000..361ced9a
--- /dev/null
+++ b/internal/lint-configs/oxlint-config/src/configs/index.ts
@@ -0,0 +1,96 @@
+import type { OxlintConfig } from 'oxlint';
+
+import { defineConfig as defineOxlintConfig } from 'oxlint';
+
+import { command } from './command';
+import { comments } from './comments';
+import { ignores } from './ignores';
+import { importPluginConfig } from './import';
+import { javascript } from './javascript';
+import { node } from './node';
+import { overrides } from './overrides';
+import { plugins } from './plugins';
+import { tailwindcss } from './tailwindcss';
+import { test } from './test';
+import { typescript } from './typescript';
+import { unicorn } from './unicorn';
+import { vue } from './vue';
+
+function mergeOxlintConfigs(...configs: OxlintConfig[]): OxlintConfig {
+  const merged: OxlintConfig = {};
+
+  for (const config of configs) {
+    merged.categories =
+      merged.categories && config.categories
+        ? { ...merged.categories, ...config.categories }
+        : (config.categories ?? merged.categories);
+    merged.env =
+      merged.env && config.env
+        ? { ...merged.env, ...config.env }
+        : (config.env ?? merged.env);
+    merged.globals =
+      merged.globals && config.globals
+        ? { ...merged.globals, ...config.globals }
+        : (config.globals ?? merged.globals);
+    merged.ignorePatterns = [
+      ...(merged.ignorePatterns ?? []),
+      ...(config.ignorePatterns ?? []),
+    ];
+    merged.jsPlugins = [
+      ...new Set([...(merged.jsPlugins ?? []), ...(config.jsPlugins ?? [])]),
+    ];
+    merged.overrides = [
+      ...(merged.overrides ?? []),
+      ...(config.overrides ?? []),
+    ];
+    merged.plugins = [
+      ...new Set([...(merged.plugins ?? []), ...(config.plugins ?? [])]),
+    ];
+    merged.rules =
+      merged.rules && config.rules
+        ? { ...merged.rules, ...config.rules }
+        : (config.rules ?? merged.rules);
+    merged.settings =
+      merged.settings && config.settings
+        ? { ...merged.settings, ...config.settings }
+        : (config.settings ?? merged.settings);
+  }
+
+  return merged;
+}
+
+const oxlintConfig = defineOxlintConfig(
+  mergeOxlintConfigs(
+    javascript,
+    command,
+    comments,
+    ignores,
+    plugins,
+    importPluginConfig,
+    node,
+    overrides,
+    tailwindcss,
+    test,
+    typescript,
+    unicorn,
+    vue,
+  ),
+);
+
+export {
+  command,
+  comments,
+  ignores,
+  importPluginConfig,
+  javascript,
+  mergeOxlintConfigs,
+  node,
+  overrides,
+  oxlintConfig,
+  plugins,
+  tailwindcss,
+  test,
+  typescript,
+  unicorn,
+  vue,
+};
diff --git a/internal/lint-configs/oxlint-config/src/configs/javascript.ts b/internal/lint-configs/oxlint-config/src/configs/javascript.ts
new file mode 100644
index 00000000..2b75d9bc
--- /dev/null
+++ b/internal/lint-configs/oxlint-config/src/configs/javascript.ts
@@ -0,0 +1,141 @@
+import type { OxlintConfig } from 'oxlint';
+
+const javascript: OxlintConfig = {
+  categories: {
+    correctness: 'error',
+    suspicious: 'warn',
+  },
+  env: {
+    browser: true,
+    es2021: true,
+    node: true,
+  },
+  globals: {
+    document: 'readonly',
+    navigator: 'readonly',
+    window: 'readonly',
+  },
+  rules: {
+    'accessor-pairs': [
+      'error',
+      {
+        enforceForClassMembers: true,
+        setWithoutGet: true,
+      },
+    ],
+    'array-callback-return': 'error',
+    'block-scoped-var': 'error',
+    'default-case-last': 'error',
+    eqeqeq: ['error', 'always'],
+    'eslint/no-unreachable': 'error',
+    // 抛出嵌套三元运算格式错误，禁止使用嵌套三元运算。
+    'no-nested-ternary': 'error',
+    'new-cap': [
+      'error',
+      {
+        capIsNew: false,
+        newIsCap: true,
+        properties: true,
+      },
+    ],
+    'no-alert': 'error',
+    'no-array-constructor': 'error',
+    'no-caller': 'error',
+    'no-case-declarations': 'error',
+    'no-console': ['error', { allow: ['warn', 'error'] }],
+    'no-control-regex': 'error',
+    'no-debugger': 'error',
+    'no-empty': ['error', { allowEmptyCatch: true }],
+    'no-fallthrough': 'error',
+    'no-new-func': 'error',
+    'no-object-constructor': 'error',
+    'no-new-native-nonconstructor': 'error',
+    'no-labels': ['error', { allowLoop: false, allowSwitch: false }],
+    'no-lone-blocks': 'error',
+    'no-multi-str': 'error',
+    'no-nonoctal-decimal-escape': 'error',
+    'no-proto': 'error',
+    'no-prototype-builtins': 'error',
+    'no-redeclare': ['error', { builtinGlobals: false }],
+    'no-regex-spaces': 'error',
+    'no-self-compare': 'error',
+    'no-sequences': 'error',
+    'no-shadow': 'off',
+    'no-shadow-restricted-names': 'error',
+    'eslint/no-empty-function': [
+      'error',
+      {
+        allow: ['arrowFunctions', 'functions', 'methods'],
+      },
+    ],
+    'no-template-curly-in-string': 'error',
+    'no-throw-literal': 'error',
+    'no-unassigned-vars': 'error',
+    'no-unexpected-multiline': 'error',
+    'no-unused-expressions': [
+      'error',
+      {
+        allowShortCircuit: true,
+        allowTaggedTemplates: true,
+        allowTernary: true,
+      },
+    ],
+    'eslint/no-unused-vars': [
+      'error',
+      {
+        argsIgnorePattern: '^_',
+        varsIgnorePattern: '^_',
+      },
+    ],
+    'no-var': 'error',
+    'no-eval': 'error',
+    'no-iterator': 'error',
+    'no-new-wrappers': 'error',
+    'no-restricted-globals': [
+      'error',
+      { message: 'Use `globalThis` instead.', name: 'global' },
+      { message: 'Use `globalThis` instead.', name: 'self' },
+    ],
+    'no-useless-call': 'error',
+    'no-useless-computed-key': 'error',
+    'no-useless-constructor': 'error',
+    'no-useless-return': 'error',
+    'prefer-const': [
+      'error',
+      {
+        destructuring: 'all',
+        ignoreReadBeforeAssign: true,
+      },
+    ],
+    'prefer-exponentiation-operator': 'error',
+    'prefer-promise-reject-errors': 'error',
+    'prefer-rest-params': 'error',
+    'prefer-spread': 'error',
+    'prefer-template': 'error',
+    'preserve-caught-error': [
+      'error',
+      {
+        requireCatchParameter: false,
+      },
+    ],
+    'symbol-description': 'error',
+    'unicode-bom': ['error', 'never'],
+    'use-isnan': [
+      'error',
+      {
+        enforceForIndexOf: true,
+        enforceForSwitchCase: true,
+      },
+    ],
+    'valid-typeof': [
+      'error',
+      {
+        requireStringLiterals: true,
+      },
+    ],
+    'vars-on-top': 'error',
+    yoda: ['error', 'never'],
+  },
+};
+
+export { javascript };
diff --git a/internal/lint-configs/oxlint-config/src/configs/node.ts b/internal/lint-configs/oxlint-config/src/configs/node.ts
new file mode 100644
index 00000000..24aa08df
--- /dev/null
+++ b/internal/lint-configs/oxlint-config/src/configs/node.ts
@@ -0,0 +1,11 @@
+import type { OxlintConfig } from 'oxlint';
+
+const node: OxlintConfig = {
+  rules: {
+    'node/no-exports-assign': 'error',
+    'node/no-new-require': 'error',
+    'node/no-path-concat': 'error',
+  },
+};
+
+export { node };
diff --git a/internal/lint-configs/oxlint-config/src/configs/overrides.ts b/internal/lint-configs/oxlint-config/src/configs/overrides.ts
new file mode 100644
index 00000000..cc1b014d
--- /dev/null
+++ b/internal/lint-configs/oxlint-config/src/configs/overrides.ts
@@ -0,0 +1,107 @@
+import type { OxlintConfig } from 'oxlint';
+
+const overrides: OxlintConfig = {
+  overrides: [
+    {
+      files: ['*.d.ts', '**/*.d.ts'],
+      rules: {
+        'import/no-unassigned-import': 'off',
+        'typescript/triple-slash-reference': 'off',
+      },
+    },
+    {
+      // 这些 @typescript-eslint 规则此前不作用于 .vue（旧 eslint glob 不含 .vue）。
+      // Vue 组件惯用 `interface Props extends XxxProps {}` 声明 props，保持迁移前行为放行。
+      files: ['*.vue', '**/*.vue'],
+      rules: {
+        'typescript/no-empty-object-type': 'off',
+        'typescript/no-unsafe-function-type': 'off',
+      },
+    },
+    {
+      files: [
+        '**/__tests__/**/*.js',
+        '**/__tests__/**/*.cjs',
+        '**/__tests__/**/*.mjs',
+        '**/__tests__/**/*.jsx',
+        '**/__tests__/**/*.ts',
+        '**/__tests__/**/*.cts',
+        '**/__tests__/**/*.mts',
+        '**/__tests__/**/*.tsx',
+        '**/*.spec.js',
+        '**/*.spec.cjs',
+        '**/*.spec.mjs',
+        '**/*.spec.jsx',
+        '**/*.spec.ts',
+        '**/*.spec.cts',
+        '**/*.spec.mts',
+        '**/*.spec.tsx',
+        '**/*.test.js',
+        '**/*.test.cjs',
+        '**/*.test.mjs',
+        '**/*.test.jsx',
+        '**/*.test.ts',
+        '**/*.test.cts',
+        '**/*.test.mts',
+        '**/*.test.tsx',
+        '**/*.bench.js',
+        '**/*.bench.cjs',
+        '**/*.bench.mjs',
+        '**/*.bench.jsx',
+        '**/*.bench.ts',
+        '**/*.bench.cts',
+        '**/*.bench.mts',
+        '**/*.bench.tsx',
+        '**/*.benchmark.js',
+        '**/*.benchmark.cjs',
+        '**/*.benchmark.mjs',
+        '**/*.benchmark.jsx',
+        '**/*.benchmark.ts',
+        '**/*.benchmark.cts',
+        '**/*.benchmark.mts',
+        '**/*.benchmark.tsx',
+      ],
+      rules: {
+        'no-console': 'off',
+      },
+    },
+    {
+      files: ['packages/@core/base/shared/src/utils/inference.ts'],
+      rules: {
+        'vue/prefer-import-from-vue': 'off',
+      },
+    },
+    {
+      files: ['packages/@core/ui-kit/menu-ui/src/sub-menu.vue'],
+      rules: {
+        'import/no-self-import': 'off',
+      },
+    },
+    {
+      files: [
+        'scripts/**/*.js',
+        'scripts/**/*.cjs',
+        'scripts/**/*.mjs',
+        'scripts/**/*.jsx',
+        'scripts/**/*.ts',
+        'scripts/**/*.cts',
+        'scripts/**/*.mts',
+        'scripts/**/*.tsx',
+        'internal/**/*.js',
+        'internal/**/*.cjs',
+        'internal/**/*.mjs',
+        'internal/**/*.jsx',
+        'internal/**/*.ts',
+        'internal/**/*.cts',
+        'internal/**/*.mts',
+        'internal/**/*.tsx',
+      ],
+      rules: {
+        'no-console': 'off',
+        'unicorn/no-process-exit': 'off',
+      },
+    },
+  ],
+};
+
+export { overrides };
diff --git a/internal/lint-configs/oxlint-config/src/configs/plugins.ts b/internal/lint-configs/oxlint-config/src/configs/plugins.ts
new file mode 100644
index 00000000..15e192ae
--- /dev/null
+++ b/internal/lint-configs/oxlint-config/src/configs/plugins.ts
@@ -0,0 +1,24 @@
+import type { OxlintConfig } from 'oxlint';
+
+const plugins: OxlintConfig = {
+  /**
+   * oxlint 支持的插件，将默认开启的也显示配置
+   * type: eslint | react | unicorn | typescript | oxc |
+   * import | jsdoc | jest | vitest | jsx-a11y | nextjs |
+   * react-perf | promise | node | vue
+   *
+   * Default: eslint,typescript,unicorn,oxc
+   */
+  plugins: [
+    'eslint',
+    'import',
+    'node',
+    'oxc',
+    'typescript',
+    'unicorn',
+    'vitest',
+    'vue',
+  ],
+};
+
+export { plugins };
diff --git a/internal/lint-configs/oxlint-config/src/configs/tailwindcss.ts b/internal/lint-configs/oxlint-config/src/configs/tailwindcss.ts
new file mode 100644
index 00000000..d138d9e8
--- /dev/null
+++ b/internal/lint-configs/oxlint-config/src/configs/tailwindcss.ts
@@ -0,0 +1,56 @@
+import type { OxlintConfig } from 'oxlint';
+
+import { fileURLToPath } from 'node:url';
+
+import eslintPluginBetterTailwindcss from 'eslint-plugin-better-tailwindcss';
+import { getDefaultSelectors } from 'eslint-plugin-better-tailwindcss/defaults';
+import { SelectorKind } from 'eslint-plugin-better-tailwindcss/types';
+
+const selectors = [
+  ...getDefaultSelectors(),
+  {
+    kind: SelectorKind.Attribute,
+    match: [{ type: 'objectValues' }],
+    name: '^classNames$',
+  },
+];
+
+const entryPoint = fileURLToPath(
+  new URL('../../../../tailwind-config/src/theme.css', import.meta.url),
+);
+
+const settings = {
+  entryPoint,
+  selectors,
+};
+
+const tailwindcss: OxlintConfig = {
+  // Generated shadcn-ui internals are intentionally left unmanaged.
+  ignorePatterns: ['packages/@core/ui-kit/shadcn-ui/**/*'],
+  jsPlugins: [
+    {
+      name: 'better-tailwindcss',
+      specifier: 'eslint-plugin-better-tailwindcss',
+    },
+  ],
+  rules: {
+    ...eslintPluginBetterTailwindcss.configs.recommended.rules,
+    'better-tailwindcss/enforce-consistent-class-order': [
+      'error',
+      {
+        detectComponentClasses: true,
+        unknownClassOrder: 'asc',
+        unknownClassPosition: 'start',
+      },
+    ],
+    // Let Prettier own wrapping decisions to avoid ping-pong formatting.
+    'better-tailwindcss/enforce-consistent-line-wrapping': 'off',
+    'better-tailwindcss/no-unknown-classes': 'off',
+  },
+  settings: {
+    'better-tailwindcss': settings,
+    'eslint-plugin-better-tailwindcss': settings,
+  },
+};
+
+export { tailwindcss };
diff --git a/internal/lint-configs/oxlint-config/src/configs/test.ts b/internal/lint-configs/oxlint-config/src/configs/test.ts
new file mode 100644
index 00000000..9a5441a4
--- /dev/null
+++ b/internal/lint-configs/oxlint-config/src/configs/test.ts
@@ -0,0 +1,24 @@
+import type { OxlintConfig } from 'oxlint';
+
+const test: OxlintConfig = {
+  rules: {
+    'jest/no-conditional-expect': 'off',
+    'jest/require-to-throw-message': 'off',
+    'vitest/consistent-test-it': [
+      'error',
+      {
+        fn: 'it',
+        withinDescribe: 'it',
+      },
+    ],
+    'vitest/hoisted-apis-on-top': 'off',
+    'vitest/no-focused-tests': 'error',
+    'vitest/no-identical-title': 'error',
+    'vitest/no-import-node-test': 'error',
+    'vitest/prefer-hooks-in-order': 'error',
+    'vitest/prefer-lowercase-title': 'error',
+    'vitest/require-mock-type-parameters': 'off',
+  },
+};
+
+export { test };
diff --git a/internal/lint-configs/oxlint-config/src/configs/typescript.ts b/internal/lint-configs/oxlint-config/src/configs/typescript.ts
new file mode 100644
index 00000000..adcbb794
--- /dev/null
+++ b/internal/lint-configs/oxlint-config/src/configs/typescript.ts
@@ -0,0 +1,52 @@
+import type { OxlintConfig } from 'oxlint';
+
+const typescript: OxlintConfig = {
+  rules: {
+    // —— 从 @typescript-eslint strict 预设迁移而来（非类型感知，oxlint 原生支持）——
+    // no-array-constructor / no-useless-constructor 已由 javascript 配置以核心规则覆盖。
+    'typescript/ban-ts-comment': 'error',
+    'typescript/no-duplicate-enum-values': 'error',
+    'typescript/no-dynamic-delete': 'error',
+    'typescript/no-empty-object-type': 'error',
+    'typescript/no-extra-non-null-assertion': 'error',
+    'typescript/no-extraneous-class': 'error',
+    'typescript/no-invalid-void-type': 'error',
+    'typescript/no-misused-new': 'error',
+    'typescript/no-non-null-asserted-nullish-coalescing': 'error',
+    'typescript/no-non-null-asserted-optional-chain': 'error',
+    'typescript/no-non-null-assertion': 'error',
+    'typescript/no-require-imports': 'error',
+    'typescript/no-this-alias': 'error',
+    'typescript/no-unnecessary-type-constraint': 'error',
+    'typescript/no-unsafe-declaration-merging': 'error',
+    'typescript/no-unsafe-function-type': 'error',
+    'typescript/no-var-requires': 'error',
+    'typescript/no-wrapper-object-types': 'error',
+    'typescript/prefer-as-const': 'error',
+    'typescript/prefer-literal-enum-member': 'error',
+    'typescript/prefer-namespace-keyword': 'error',
+    'typescript/triple-slash-reference': 'error',
+    'typescript/unified-signatures': 'error',
+
+    'typescript/await-thenable': 'off',
+    'typescript/consistent-return': 'off',
+    'typescript/no-base-to-string': 'off',
+    'typescript/no-duplicate-type-constituents': 'off',
+    'typescript/no-floating-promises': 'off',
+    'typescript/no-misused-spread': 'off',
+    'typescript/no-redundant-type-constituents': 'off',
+    'typescript/no-unnecessary-boolean-literal-compare': 'off',
+    'typescript/no-unnecessary-template-expression': 'off',
+    'typescript/no-unnecessary-type-arguments': 'off',
+    'typescript/no-unnecessary-type-assertion': 'off',
+    'typescript/no-unnecessary-type-conversion': 'off',
+    'typescript/no-unnecessary-type-parameters': 'off',
+    'typescript/no-unsafe-enum-comparison': 'off',
+    'typescript/no-unsafe-type-assertion': 'off',
+    'typescript/no-useless-default-assignment': 'off',
+    'typescript/restrict-template-expressions': 'off',
+    'typescript/unbound-method': 'off',
+  },
+};
+
+export { typescript };
diff --git a/internal/lint-configs/oxlint-config/src/configs/unicorn.ts b/internal/lint-configs/oxlint-config/src/configs/unicorn.ts
new file mode 100644
index 00000000..bc141baf
--- /dev/null
+++ b/internal/lint-configs/oxlint-config/src/configs/unicorn.ts
@@ -0,0 +1,132 @@
+import type { OxlintConfig } from 'oxlint';
+
+const unicorn: OxlintConfig = {
+  rules: {
+    'unicorn/consistent-function-scoping': 'off',
+    'unicorn/no-process-exit': 'error',
+    'unicorn/no-single-promise-in-promise-methods': 'off',
+    'unicorn/no-useless-spread': 'off',
+    'unicorn/prefer-global-this': 'off',
+    'unicorn/prefer-module': 'error',
+
+    'unicorn/catch-error-name': 'error',
+    'unicorn/consistent-assert': 'error',
+    'unicorn/consistent-date-clone': 'error',
+    'unicorn/consistent-empty-array-spread': 'error',
+    'unicorn/consistent-existence-index-check': 'error',
+    'unicorn/consistent-template-literal-escape': 'error',
+    'unicorn/empty-brace-spaces': 'error',
+    'unicorn/error-message': 'error',
+    'unicorn/escape-case': 'error',
+    'unicorn/explicit-length-check': 'error',
+    'unicorn/new-for-builtins': 'error',
+    'unicorn/no-abusive-eslint-disable': 'error',
+    'unicorn/no-accessor-recursion': 'error',
+    'unicorn/no-anonymous-default-export': 'error',
+    'unicorn/no-array-callback-reference': 'error',
+    'unicorn/no-array-method-this-argument': 'error',
+    'unicorn/no-array-reduce': 'error',
+    'unicorn/no-array-reverse': 'error',
+    'unicorn/no-array-sort': 'error',
+    'unicorn/no-await-expression-member': 'error',
+    'unicorn/no-await-in-promise-methods': 'error',
+    'unicorn/no-console-spaces': 'error',
+    'unicorn/no-document-cookie': 'error',
+    'unicorn/no-empty-file': 'error',
+    'unicorn/no-hex-escape': 'error',
+    // oxlint 实现较 eslint 更严格，会误报既有代码，暂关闭
+    'unicorn/no-immediate-mutation': 'off',
+    'unicorn/no-instanceof-builtins': 'error',
+    'unicorn/no-invalid-fetch-options': 'error',
+    'unicorn/no-invalid-remove-event-listener': 'error',
+    'unicorn/no-lonely-if': 'error',
+    'unicorn/no-magic-array-flat-depth': 'error',
+    'unicorn/no-negated-condition': 'error',
+    'unicorn/no-negation-in-equality-check': 'error',
+    // 禁止通过“添加括号”自动修复嵌套三元运算
+    'unicorn/no-nested-ternary': 'off',
+    'unicorn/no-new-array': 'error',
+    'unicorn/no-new-buffer': 'error',
+    'unicorn/no-object-as-default-parameter': 'error',
+    'unicorn/no-static-only-class': 'error',
+    'unicorn/no-thenable': 'error',
+    'unicorn/no-this-assignment': 'error',
+    'unicorn/no-typeof-undefined': 'error',
+    'unicorn/no-unnecessary-array-flat-depth': 'error',
+    'unicorn/no-unnecessary-array-splice-count': 'error',
+    'unicorn/no-unnecessary-await': 'error',
+    'unicorn/no-unnecessary-slice-end': 'error',
+    'unicorn/no-unreadable-array-destructuring': 'error',
+    'unicorn/no-unreadable-iife': 'error',
+    'unicorn/no-useless-collection-argument': 'error',
+    'unicorn/no-useless-error-capture-stack-trace': 'error',
+    'unicorn/no-useless-fallback-in-spread': 'error',
+    'unicorn/no-useless-iterator-to-array': 'error',
+    'unicorn/no-useless-length-check': 'error',
+    'unicorn/no-useless-promise-resolve-reject': 'error',
+    'unicorn/no-useless-switch-case': 'error',
+    'unicorn/no-zero-fractions': 'error',
+    'unicorn/number-literal-case': 'error',
+    'unicorn/numeric-separators-style': 'error',
+    'unicorn/prefer-add-event-listener': 'error',
+    'unicorn/prefer-array-find': 'error',
+    'unicorn/prefer-array-flat': 'error',
+    'unicorn/prefer-array-flat-map': 'error',
+    'unicorn/prefer-array-index-of': 'error',
+    'unicorn/prefer-array-some': 'error',
+    'unicorn/prefer-bigint-literals': 'error',
+    'unicorn/prefer-blob-reading-methods': 'error',
+    'unicorn/prefer-class-fields': 'error',
+    'unicorn/prefer-classlist-toggle': 'error',
+    'unicorn/prefer-code-point': 'error',
+    'unicorn/prefer-date-now': 'error',
+    'unicorn/prefer-default-parameters': 'error',
+    'unicorn/prefer-dom-node-append': 'error',
+    'unicorn/prefer-dom-node-dataset': 'error',
+    'unicorn/prefer-dom-node-remove': 'error',
+    'unicorn/prefer-event-target': 'error',
+    'unicorn/prefer-export-from': ['error', { checkUsedVariables: false }],
+    'unicorn/prefer-includes': 'error',
+    'unicorn/prefer-keyboard-event-key': 'error',
+    'unicorn/prefer-logical-operator-over-ternary': 'error',
+    'unicorn/prefer-math-min-max': 'error',
+    'unicorn/prefer-math-trunc': 'error',
+    'unicorn/prefer-modern-dom-apis': 'error',
+    'unicorn/prefer-modern-math-apis': 'error',
+    'unicorn/prefer-native-coercion-functions': 'error',
+    'unicorn/prefer-negative-index': 'error',
+    'unicorn/prefer-node-protocol': 'error',
+    'unicorn/prefer-number-properties': 'error',
+    'unicorn/prefer-object-from-entries': 'error',
+    'unicorn/prefer-optional-catch-binding': 'error',
+    'unicorn/prefer-prototype-methods': 'error',
+    'unicorn/prefer-query-selector': 'error',
+    'unicorn/prefer-reflect-apply': 'error',
+    'unicorn/prefer-regexp-test': 'error',
+    'unicorn/prefer-response-static-json': 'error',
+    'unicorn/prefer-set-has': 'error',
+    'unicorn/prefer-set-size': 'error',
+    'unicorn/prefer-single-call': 'error',
+    'unicorn/prefer-spread': 'error',
+    'unicorn/prefer-string-raw': 'error',
+    'unicorn/prefer-string-replace-all': 'error',
+    'unicorn/prefer-string-slice': 'error',
+    'unicorn/prefer-string-starts-ends-with': 'error',
+    'unicorn/prefer-string-trim-start-end': 'error',
+    // oxlint 实现较 eslint 更严格（含 cloneDeep），暂关闭以保持迁移前行为
+    'unicorn/prefer-structured-clone': 'off',
+    'unicorn/prefer-ternary': 'error',
+    'unicorn/prefer-type-error': 'error',
+    'unicorn/relative-url-style': 'error',
+    'unicorn/require-array-join-separator': 'error',
+    'unicorn/require-module-attributes': 'error',
+    'unicorn/require-module-specifiers': 'error',
+    'unicorn/require-number-to-fixed-digits-argument': 'error',
+    'unicorn/switch-case-braces': 'error',
+    'unicorn/switch-case-break-position': 'error',
+    'unicorn/text-encoding-identifier-case': 'error',
+    'unicorn/throw-new-error': 'error',
+  },
+};
+
+export { unicorn };
diff --git a/internal/lint-configs/oxlint-config/src/configs/vue.ts b/internal/lint-configs/oxlint-config/src/configs/vue.ts
new file mode 100644
index 00000000..6e140b85
--- /dev/null
+++ b/internal/lint-configs/oxlint-config/src/configs/vue.ts
@@ -0,0 +1,10 @@
+import type { OxlintConfig } from 'oxlint';
+
+const vue: OxlintConfig = {
+  rules: {
+    'vue/no-reserved-component-names': 'off',
+    'vue/prefer-import-from-vue': 'error',
+  },
+};
+
+export { vue };
diff --git a/internal/lint-configs/oxlint-config/src/index.ts b/internal/lint-configs/oxlint-config/src/index.ts
new file mode 100644
index 00000000..b890cb0d
--- /dev/null
+++ b/internal/lint-configs/oxlint-config/src/index.ts
@@ -0,0 +1,21 @@
+import type { OxlintConfig } from 'oxlint';
+
+import { defineConfig as defineOxlintConfig } from 'oxlint';
+
+import { mergeOxlintConfigs, oxlintConfig } from './configs';
+
+type VbenOxlintConfig = Omit<OxlintConfig, 'extends'> & {
+  extends?: OxlintConfig[];
+};
+
+function defineConfig(config: VbenOxlintConfig = {}) {
+  const { extends: extendedConfigs = [], ...restConfig } = config;
+
+  return defineOxlintConfig(
+    mergeOxlintConfigs(oxlintConfig, ...extendedConfigs, restConfig),
+  );
+}
+
+export { defineConfig, oxlintConfig };
+export * from './configs';
+export type { OxlintConfig, VbenOxlintConfig };
diff --git a/internal/lint-configs/oxlint-config/tsconfig.json b/internal/lint-configs/oxlint-config/tsconfig.json
new file mode 100644
index 00000000..b2ec3b61
--- /dev/null
+++ b/internal/lint-configs/oxlint-config/tsconfig.json
@@ -0,0 +1,6 @@
+{
+  "$schema": "https://json.schemastore.org/tsconfig",
+  "extends": "@vben/tsconfig/node.json",
+  "include": ["src"],
+  "exclude": ["node_modules"]
+}
diff --git a/internal/lint-configs/oxlint-config/tsdown.config.ts b/internal/lint-configs/oxlint-config/tsdown.config.ts
new file mode 100644
index 00000000..c4f51c5e
--- /dev/null
+++ b/internal/lint-configs/oxlint-config/tsdown.config.ts
@@ -0,0 +1,11 @@
+import { defineConfig } from 'tsdown';
+
+export default defineConfig({
+  clean: true,
+  dts: true,
+  entry: ['src/index.ts'],
+  format: ['esm'],
+  outExtensions: () => ({
+    dts: '.d.ts',
+  }),
+});
diff --git a/internal/lint-configs/prettier-config/index.mjs b/internal/lint-configs/prettier-config/index.mjs
deleted file mode 100644
index f6a20c8b..00000000
--- a/internal/lint-configs/prettier-config/index.mjs
+++ /dev/null
@@ -1,18 +0,0 @@
-export default {
-  endOfLine: 'auto',
-  overrides: [
-    {
-      files: ['*.json5'],
-      options: {
-        quoteProps: 'preserve',
-        singleQuote: false,
-      },
-    },
-  ],
-  plugins: ['prettier-plugin-tailwindcss'],
-  printWidth: 80,
-  proseWrap: 'never',
-  semi: true,
-  singleQuote: true,
-  trailingComma: 'all',
-};
diff --git a/internal/lint-configs/stylelint-config/index.mjs b/internal/lint-configs/stylelint-config/index.mjs
index 7ef175cc..962aa2ed 100644
--- a/internal/lint-configs/stylelint-config/index.mjs
+++ b/internal/lint-configs/stylelint-config/index.mjs
@@ -36,13 +36,9 @@ export default {
       files: ['*.scss', '**/*.scss'],
     },
   ],
-  plugins: [
-    'stylelint-order',
-    '@stylistic/stylelint-plugin',
-    'stylelint-prettier',
-    'stylelint-scss',
-  ],
+  plugins: ['stylelint-order', '@stylistic/stylelint-plugin', 'stylelint-scss'],
   rules: {
+    'at-rule-no-deprecated': null,
     'at-rule-no-unknown': [
       true,
       {
@@ -66,6 +62,12 @@ export default {
           'use',
           'forward',
           'return',
+          'reference',
+          'plugin',
+          'source',
+          'theme',
+          'utility',
+          'custom-variant',
         ],
       },
     ],
@@ -74,8 +76,10 @@ export default {
     'import-notation': null,
     'media-feature-range-notation': null,
     'named-grid-areas-no-invalid': null,
+    'nesting-selector-no-missing-scoping-root': null,
     'no-descending-specificity': null,
     'no-empty-source': null,
+    'no-invalid-position-declaration': null,
     'order/order': [
       [
         'dollar-variables',
@@ -98,7 +102,6 @@ export default {
       ],
       { severity: 'error' },
     ],
-    'prettier/prettier': true,
     'rule-empty-line-before': [
       'always',
       {
@@ -128,12 +131,18 @@ export default {
           'use',
           'forward',
           'return',
+          'reference',
+          'plugin',
+          'source',
+          'theme',
+          'utility',
+          'custom-variant',
         ],
       },
     ],
     'scss/operator-no-newline-after': null,
     'selector-class-pattern':
-      '^(?:(?:o|c|u|t|s|is|has|_|js|qa)-)?[a-zA-Z0-9]+(?:-[a-zA-Z0-9]+)*(?:__[a-zA-Z0-9]+(?:-[a-zA-Z0-9]+)*)?(?:--[a-zA-Z0-9]+(?:-[a-zA-Z0-9]+)*)?(?:[.+])?$',
+      '^-?(?:(?:o|c|u|t|s|is|has|_|js|qa)-)?[a-zA-Z0-9]+(?:-[a-zA-Z0-9]+)*(?:__[a-zA-Z0-9]+(?:-[a-zA-Z0-9]+)*)?(?:--[a-zA-Z0-9]+(?:-[a-zA-Z0-9]+)*)?(?:[.+])?$',
 
     'selector-not-notation': null,
   },
diff --git a/internal/lint-configs/stylelint-config/package.json b/internal/lint-configs/stylelint-config/package.json
index 64815741..11079543 100644
--- a/internal/lint-configs/stylelint-config/package.json
+++ b/internal/lint-configs/stylelint-config/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vben/stylelint-config",
-  "version": "5.5.1",
+  "version": "5.7.0",
   "private": true,
   "homepage": "https://github.com/vbenjs/vue-vben-admin",
   "bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
@@ -31,13 +31,11 @@
     "postcss": "catalog:",
     "postcss-html": "catalog:",
     "postcss-scss": "catalog:",
-    "prettier": "catalog:",
     "stylelint": "catalog:",
     "stylelint-config-recommended": "catalog:",
     "stylelint-config-recommended-scss": "catalog:",
     "stylelint-config-recommended-vue": "catalog:",
     "stylelint-config-standard": "catalog:",
-    "stylelint-order": "catalog:",
-    "stylelint-prettier": "catalog:"
+    "stylelint-order": "catalog:"
   }
 }
diff --git a/internal/node-utils/build.config.ts b/internal/node-utils/build.config.ts
deleted file mode 100644
index 97e572c5..00000000
--- a/internal/node-utils/build.config.ts
+++ /dev/null
@@ -1,7 +0,0 @@
-import { defineBuildConfig } from 'unbuild';
-
-export default defineBuildConfig({
-  clean: true,
-  declaration: true,
-  entries: ['src/index'],
-});
diff --git a/internal/node-utils/package.json b/internal/node-utils/package.json
index 9412656a..35892a11 100644
--- a/internal/node-utils/package.json
+++ b/internal/node-utils/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vben/node-utils",
-  "version": "5.5.1",
+  "version": "5.7.0",
   "private": true,
   "homepage": "https://github.com/vbenjs/vue-vben-admin",
   "bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
@@ -12,7 +12,7 @@
   "license": "MIT",
   "type": "module",
   "scripts": {
-    "stub": "pnpm unbuild --stub"
+    "stub": "node ./scripts/build.mjs"
   },
   "files": [
     "dist"
@@ -22,7 +22,7 @@
   "types": "./dist/index.d.ts",
   "exports": {
     ".": {
-      "types": "./src/index.ts",
+      "types": "./dist/index.d.ts",
       "import": "./dist/index.mjs",
       "default": "./dist/index.mjs"
     }
@@ -37,7 +37,6 @@
     "find-up": "catalog:",
     "ora": "catalog:",
     "pkg-types": "catalog:",
-    "prettier": "catalog:",
     "rimraf": "catalog:"
   }
 }
diff --git a/internal/node-utils/scripts/build.mjs b/internal/node-utils/scripts/build.mjs
new file mode 100644
index 00000000..65a64e9c
--- /dev/null
+++ b/internal/node-utils/scripts/build.mjs
@@ -0,0 +1,40 @@
+import { spawnSync } from 'node:child_process';
+
+const pnpmCommand =
+  process.env.npm_execpath && process.env.npm_execpath.endsWith('.cjs')
+    ? [process.execPath, process.env.npm_execpath]
+    : ['pnpm'];
+
+const steps = [
+  ['exec', 'tsdown', '--no-dts'],
+  [
+    'exec',
+    'tsc',
+    '-p',
+    'tsconfig.build.json',
+    '--emitDeclarationOnly',
+    '--declaration',
+    '--outDir',
+    'dist',
+  ],
+];
+
+for (const args of steps) {
+  const [command, ...commandArgs] = pnpmCommand;
+  let cmd = command;
+  if (cmd.includes(' ')) {
+    cmd = `"${command}"`;
+  }
+  const result = spawnSync(cmd, [...commandArgs, ...args], {
+    shell: true,
+    stdio: 'inherit',
+  });
+
+  if (result.error) {
+    throw result.error;
+  }
+
+  if (result.status !== 0) {
+    process.exit(result.status ?? 1);
+  }
+}
diff --git a/internal/node-utils/src/date.ts b/internal/node-utils/src/date.ts
index d36572d9..7b11583f 100644
--- a/internal/node-utils/src/date.ts
+++ b/internal/node-utils/src/date.ts
@@ -1,6 +1,6 @@
 import dayjs from 'dayjs';
-import timezone from 'dayjs/plugin/timezone';
-import utc from 'dayjs/plugin/utc';
+import timezone from 'dayjs/plugin/timezone.js';
+import utc from 'dayjs/plugin/utc.js';
 
 dayjs.extend(utc);
 dayjs.extend(timezone);
diff --git a/internal/node-utils/src/formatter.ts b/internal/node-utils/src/formatter.ts
new file mode 100644
index 00000000..78c6be0b
--- /dev/null
+++ b/internal/node-utils/src/formatter.ts
@@ -0,0 +1,13 @@
+import fs from 'node:fs/promises';
+
+import { execa } from 'execa';
+
+async function formatFile(filepath: string) {
+  await execa('oxfmt', [filepath], {
+    stdio: 'inherit',
+  });
+
+  return await fs.readFile(filepath, 'utf8');
+}
+
+export { formatFile };
diff --git a/internal/node-utils/src/git.ts b/internal/node-utils/src/git.ts
index 88f159cc..da6dc74c 100644
--- a/internal/node-utils/src/git.ts
+++ b/internal/node-utils/src/git.ts
@@ -20,7 +20,13 @@ async function getStagedFiles(): Promise<string[]> {
       '-z',
     ]);
 
-    let changedList = stdout ? stdout.replace(/\0$/, '').split('\0') : [];
+    const nullSeparator = '\u0000';
+    const normalizedStdout = stdout.endsWith(nullSeparator)
+      ? stdout.slice(0, -1)
+      : stdout;
+    let changedList = normalizedStdout
+      ? normalizedStdout.split(nullSeparator)
+      : [];
     changedList = changedList.map((item) => path.resolve(process.cwd(), item));
     const changedSet = new Set(changedList);
     changedSet.delete('');
diff --git a/internal/node-utils/src/index.ts b/internal/node-utils/src/index.ts
index 2e39ccff..a3e419b3 100644
--- a/internal/node-utils/src/index.ts
+++ b/internal/node-utils/src/index.ts
@@ -1,12 +1,12 @@
 export * from './constants';
 export * from './date';
+export { formatFile } from './formatter';
 export * from './fs';
 export * from './git';
-export { add as gitAdd, getStagedFiles } from './git';
+export { getStagedFiles, add as gitAdd } from './git';
 export { generatorContentHash } from './hash';
 export * from './monorepo';
 export { toPosixPath } from './path';
-export { prettierFormat } from './prettier';
 export * from './spinner';
 export type { Package } from '@manypkg/get-packages';
 export { default as colors } from 'chalk';
diff --git a/internal/node-utils/src/monorepo.ts b/internal/node-utils/src/monorepo.ts
index b6373e78..33246c68 100644
--- a/internal/node-utils/src/monorepo.ts
+++ b/internal/node-utils/src/monorepo.ts
@@ -1,21 +1,31 @@
-import { dirname } from 'node:path';
+import type { Package } from '@manypkg/get-packages';
 
-import {
-  getPackages as getPackagesFunc,
-  getPackagesSync as getPackagesSyncFunc,
-} from '@manypkg/get-packages';
-import { findUpSync } from 'find-up';
+import { existsSync } from 'node:fs';
+import { dirname, join, resolve } from 'node:path';
+
+import * as manypkg from '@manypkg/get-packages';
+const { getPackages: getPackagesFunc, getPackagesSync: getPackagesSyncFunc } =
+  manypkg;
 
 /**
  * 查找大仓的根目录
  * @param cwd
  */
 function findMonorepoRoot(cwd: string = process.cwd()) {
-  const lockFile = findUpSync('pnpm-lock.yaml', {
-    cwd,
-    type: 'file',
-  });
-  return dirname(lockFile || '');
+  let currentDir = resolve(cwd);
+
+  while (true) {
+    if (existsSync(join(currentDir, 'pnpm-lock.yaml'))) {
+      return currentDir;
+    }
+
+    const parentDir = dirname(currentDir);
+    if (parentDir === currentDir) {
+      return '';
+    }
+
+    currentDir = parentDir;
+  }
 }
 
 /**
@@ -40,7 +50,7 @@ async function getPackages() {
  */
 async function getPackage(pkgName: string) {
   const { packages } = await getPackages();
-  return packages.find((pkg) => pkg.packageJson.name === pkgName);
+  return packages.find((pkg: Package) => pkg.packageJson.name === pkgName);
 }
 
 export { findMonorepoRoot, getPackage, getPackages, getPackagesSync };
diff --git a/internal/node-utils/src/prettier.ts b/internal/node-utils/src/prettier.ts
deleted file mode 100644
index 1e1525db..00000000
--- a/internal/node-utils/src/prettier.ts
+++ /dev/null
@@ -1,21 +0,0 @@
-import fs from 'node:fs/promises';
-
-import { format, getFileInfo, resolveConfig } from 'prettier';
-
-async function prettierFormat(filepath: string) {
-  const prettierOptions = await resolveConfig(filepath, {});
-
-  const fileInfo = await getFileInfo(filepath);
-
-  const input = await fs.readFile(filepath, 'utf8');
-  const output = await format(input, {
-    ...prettierOptions,
-    parser: fileInfo.inferredParser as any,
-  });
-  if (output !== input) {
-    await fs.writeFile(filepath, output, 'utf8');
-  }
-  return output;
-}
-
-export { prettierFormat };
diff --git a/internal/node-utils/src/spinner.ts b/internal/node-utils/src/spinner.ts
index f07cc256..13ad6a42 100644
--- a/internal/node-utils/src/spinner.ts
+++ b/internal/node-utils/src/spinner.ts
@@ -1,4 +1,6 @@
-import ora, { type Ora } from 'ora';
+import type { Ora } from 'ora';
+
+import ora from 'ora';
 
 interface SpinnerOptions {
   failedText?: string;
diff --git a/internal/node-utils/tsconfig.build.json b/internal/node-utils/tsconfig.build.json
new file mode 100644
index 00000000..714b1f8e
--- /dev/null
+++ b/internal/node-utils/tsconfig.build.json
@@ -0,0 +1,9 @@
+{
+  "$schema": "https://json.schemastore.org/tsconfig",
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "rootDir": "./src",
+    "noEmit": false
+  },
+  "exclude": ["node_modules", "src/__tests__"]
+}
diff --git a/internal/node-utils/tsdown.config.ts b/internal/node-utils/tsdown.config.ts
new file mode 100644
index 00000000..4a607e00
--- /dev/null
+++ b/internal/node-utils/tsdown.config.ts
@@ -0,0 +1,10 @@
+import { defineConfig } from 'tsdown';
+
+export default defineConfig({
+  clean: false,
+  deps: {
+    skipNodeModulesBundle: true,
+  },
+  entry: ['src/index.ts'],
+  format: ['esm'],
+});
diff --git a/internal/tailwind-config/build.config.ts b/internal/tailwind-config/build.config.ts
deleted file mode 100644
index 1f3c3c22..00000000
--- a/internal/tailwind-config/build.config.ts
+++ /dev/null
@@ -1,10 +0,0 @@
-import { defineBuildConfig } from 'unbuild';
-
-export default defineBuildConfig({
-  clean: true,
-  declaration: true,
-  entries: ['src/index', './src/postcss.config'],
-  rollup: {
-    emitCJS: true,
-  },
-});
diff --git a/internal/tailwind-config/package.json b/internal/tailwind-config/package.json
index 26da63b4..6701907c 100644
--- a/internal/tailwind-config/package.json
+++ b/internal/tailwind-config/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vben/tailwind-config",
-  "version": "5.5.1",
+  "version": "5.7.0",
   "private": true,
   "homepage": "https://github.com/vbenjs/vue-vben-admin",
   "bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
@@ -11,56 +11,28 @@
   },
   "license": "MIT",
   "type": "module",
-  "scripts": {
-    "stub": "pnpm unbuild"
-  },
   "files": [
-    "dist"
+    "src"
   ],
-  "main": "./dist/index.mjs",
-  "module": "./dist/index.mjs",
-  "types": "./dist/index.d.ts",
-  "typesVersions": {
-    "*": {
-      "*": [
-        "./dist/*",
-        "./*"
-      ]
-    }
-  },
+  "sideEffects": [
+    "**/*.css"
+  ],
+  "main": "./src/index.ts",
+  "module": "./src/index.ts",
+  "types": "./src/index.ts",
   "exports": {
     ".": {
       "types": "./src/index.ts",
-      "import": "./dist/index.mjs",
-      "require": "./dist/index.cjs"
+      "default": "./src/index.ts"
     },
-    "./postcss": {
-      "types": "./src/postcss.config.ts",
-      "import": "./dist/postcss.config.mjs",
-      "require": "./dist/postcss.config.cjs",
-      "default": "./dist/postcss.config.mjs"
-    },
-    "./*": "./*"
-  },
-  "peerDependencies": {
-    "tailwindcss": "^3.4.3"
+    "./theme": {
+      "default": "./src/theme.css"
+    }
   },
   "dependencies": {
-    "@iconify/json": "catalog:",
-    "@iconify/tailwind": "catalog:",
-    "@manypkg/get-packages": "catalog:",
-    "@tailwindcss/nesting": "catalog:",
+    "@iconify/tailwind4": "catalog:",
     "@tailwindcss/typography": "catalog:",
-    "autoprefixer": "catalog:",
-    "cssnano": "catalog:",
-    "postcss": "catalog:",
-    "postcss-antd-fixes": "catalog:",
-    "postcss-import": "catalog:",
-    "postcss-preset-env": "catalog:",
     "tailwindcss": "catalog:",
-    "tailwindcss-animate": "catalog:"
-  },
-  "devDependencies": {
-    "@types/postcss-import": "catalog:"
+    "tw-animate-css": "catalog:"
   }
 }
diff --git a/internal/tailwind-config/src/index.ts b/internal/tailwind-config/src/index.ts
index dafaaf91..5b1d5b4c 100644
--- a/internal/tailwind-config/src/index.ts
+++ b/internal/tailwind-config/src/index.ts
@@ -1,266 +1 @@
-import type { Config } from 'tailwindcss';
-
-import path from 'node:path';
-
-import { addDynamicIconSelectors } from '@iconify/tailwind';
-import { getPackagesSync } from '@manypkg/get-packages';
-import typographyPlugin from '@tailwindcss/typography';
-import animate from 'tailwindcss-animate';
-
-import { enterAnimationPlugin } from './plugins/entry';
-
-// import defaultTheme from 'tailwindcss/defaultTheme';
-
-const { packages } = getPackagesSync(process.cwd());
-
-const tailwindPackages: string[] = [];
-
-packages.forEach((pkg) => {
-  // apps目录下和 @vben-core/tailwind-ui 包需要使用到 tailwindcss ui
-  // if (fs.existsSync(path.join(pkg.dir, 'tailwind.config.mjs'))) {
-  tailwindPackages.push(pkg.dir);
-  // }
-});
-
-const shadcnUiColors = {
-  accent: {
-    DEFAULT: 'hsl(var(--accent))',
-    foreground: 'hsl(var(--accent-foreground))',
-    hover: 'hsl(var(--accent-hover))',
-    lighter: 'has(val(--accent-lighter))',
-  },
-  background: {
-    deep: 'hsl(var(--background-deep))',
-    DEFAULT: 'hsl(var(--background))',
-  },
-  border: {
-    DEFAULT: 'hsl(var(--border))',
-  },
-  card: {
-    DEFAULT: 'hsl(var(--card))',
-    foreground: 'hsl(var(--card-foreground))',
-  },
-  destructive: {
-    ...createColorsPalette('destructive'),
-    DEFAULT: 'hsl(var(--destructive))',
-  },
-
-  foreground: {
-    DEFAULT: 'hsl(var(--foreground))',
-  },
-
-  input: {
-    background: 'hsl(var(--input-background))',
-    DEFAULT: 'hsl(var(--input))',
-  },
-  muted: {
-    DEFAULT: 'hsl(var(--muted))',
-    foreground: 'hsl(var(--muted-foreground))',
-  },
-  popover: {
-    DEFAULT: 'hsl(var(--popover))',
-    foreground: 'hsl(var(--popover-foreground))',
-  },
-  primary: {
-    ...createColorsPalette('primary'),
-    DEFAULT: 'hsl(var(--primary))',
-  },
-
-  ring: 'hsl(var(--ring))',
-  secondary: {
-    DEFAULT: 'hsl(var(--secondary))',
-    desc: 'hsl(var(--secondary-desc))',
-    foreground: 'hsl(var(--secondary-foreground))',
-  },
-};
-
-const customColors = {
-  green: {
-    ...createColorsPalette('green'),
-    foreground: 'hsl(var(--success-foreground))',
-  },
-  header: {
-    DEFAULT: 'hsl(var(--header))',
-  },
-  heavy: {
-    DEFAULT: 'hsl(var(--heavy))',
-    foreground: 'hsl(var(--heavy-foreground))',
-  },
-  main: {
-    DEFAULT: 'hsl(var(--main))',
-  },
-  overlay: {
-    content: 'hsl(var(--overlay-content))',
-    DEFAULT: 'hsl(var(--overlay))',
-  },
-  red: {
-    ...createColorsPalette('red'),
-    foreground: 'hsl(var(--destructive-foreground))',
-  },
-  sidebar: {
-    deep: 'hsl(var(--sidebar-deep))',
-    DEFAULT: 'hsl(var(--sidebar))',
-  },
-  success: {
-    ...createColorsPalette('success'),
-    DEFAULT: 'hsl(var(--success))',
-  },
-  warning: {
-    ...createColorsPalette('warning'),
-    DEFAULT: 'hsl(var(--warning))',
-  },
-  yellow: {
-    ...createColorsPalette('yellow'),
-    foreground: 'hsl(var(--warning-foreground))',
-  },
-};
-
-export default {
-  content: [
-    './index.html',
-    ...tailwindPackages.map((item) =>
-      path.join(item, 'src/**/*.{vue,js,ts,jsx,tsx,svelte,astro,html}'),
-    ),
-  ],
-  darkMode: 'selector',
-  plugins: [
-    animate,
-    typographyPlugin,
-    addDynamicIconSelectors(),
-    enterAnimationPlugin,
-  ],
-  prefix: '',
-  safelist: ['dark'],
-  theme: {
-    container: {
-      center: true,
-      padding: '2rem',
-      screens: {
-        '2xl': '1400px',
-      },
-    },
-    extend: {
-      animation: {
-        'accordion-down': 'accordion-down 0.2s ease-out',
-        'accordion-up': 'accordion-up 0.2s ease-out',
-        'collapsible-down': 'collapsible-down 0.2s ease-in-out',
-        'collapsible-up': 'collapsible-up 0.2s ease-in-out',
-        float: 'float 5s linear 0ms infinite',
-      },
-
-      animationDuration: {
-        '2000': '2000ms',
-        '3000': '3000ms',
-      },
-      borderRadius: {
-        lg: 'var(--radius)',
-        md: 'calc(var(--radius) - 2px)',
-        sm: 'calc(var(--radius) - 4px)',
-        xl: 'calc(var(--radius) + 4px)',
-      },
-      boxShadow: {
-        float: `0 6px 16px 0 rgb(0 0 0 / 8%),
-          0 3px 6px -4px rgb(0 0 0 / 12%),
-          0 9px 28px 8px rgb(0 0 0 / 5%)`,
-      },
-      colors: {
-        ...customColors,
-        ...shadcnUiColors,
-      },
-      fontFamily: {
-        sans: [
-          'var(--font-family)',
-          //  ...defaultTheme.fontFamily.sans
-        ],
-      },
-      keyframes: {
-        'accordion-down': {
-          from: { height: '0' },
-          to: { height: 'var(--radix-accordion-content-height)' },
-        },
-        'accordion-up': {
-          from: { height: 'var(--radix-accordion-content-height)' },
-          to: { height: '0' },
-        },
-        'collapsible-down': {
-          from: { height: '0' },
-          to: { height: 'var(--radix-collapsible-content-height)' },
-        },
-        'collapsible-up': {
-          from: { height: 'var(--radix-collapsible-content-height)' },
-          to: { height: '0' },
-        },
-        float: {
-          '0%': { transform: 'translateY(0)' },
-          '50%': { transform: 'translateY(-20px)' },
-          '100%': { transform: 'translateY(0)' },
-        },
-      },
-      zIndex: {
-        '100': '100',
-        '1000': '1000',
-      },
-    },
-  },
-} as Config;
-
-function createColorsPalette(name: string) {
-  // backgroundLightest: '#EFF6FF', // Tailwind CSS 默认的 `blue-50`
-  //         backgroundLighter: '#DBEAFE',  // Tailwind CSS 默认的 `blue-100`
-  //         backgroundLight: '#BFDBFE',    // Tailwind CSS 默认的 `blue-200`
-  //         borderLight: '#93C5FD',        // Tailwind CSS 默认的 `blue-300`
-  //         border: '#60A5FA',             // Tailwind CSS 默认的 `blue-400`
-  //         main: '#3B82F6',               // Tailwind CSS 默认的 `blue-500`
-  //         hover: '#2563EB',              // Tailwind CSS 默认的 `blue-600`
-  //         active: '#1D4ED8',             // Tailwind CSS 默认的 `blue-700`
-  //         backgroundDark: '#1E40AF',     // Tailwind CSS 默认的 `blue-800`
-  //         backgroundDarker: '#1E3A8A',   // Tailwind CSS 默认的 `blue-900`
-  //         backgroundDarkest: '#172554',  // Tailwind CSS 默认的 `blue-950`
-
-  // •	backgroundLightest (#EFF6FF): 适用于最浅的背景色，可能用于非常轻微的阴影或卡片的背景。
-  // •	backgroundLighter (#DBEAFE): 适用于略浅的背景色，通常用于次要背景或略浅的区域。
-  // •	backgroundLight (#BFDBFE): 适用于浅色背景，可能用于输入框或表单区域的背景。
-  // •	borderLight (#93C5FD): 适用于浅色边框，可能用于输入框或卡片的边框。
-  // •	border (#60A5FA): 适用于普通边框，可能用于按钮或卡片的边框。
-  // •	main (#3B82F6): 适用于主要的主题色，通常用于按钮、链接或主要的强调色。
-  // •	hover (#2563EB): 适用于鼠标悬停状态下的颜色，例如按钮悬停时的背景色或边框色。
-  // •	active (#1D4ED8): 适用于激活状态下的颜色，例如按钮按下时的背景色或边框色。
-  // •	backgroundDark (#1E40AF): 适用于深色背景，可能用于主要按钮或深色卡片背景。
-  // •	backgroundDarker (#1E3A8A): 适用于更深的背景，通常用于头部导航栏或页脚。
-  // •	backgroundDarkest (#172554): 适用于最深的背景，可能用于非常深色的区域或极端对比色。
-
-  return {
-    50: `hsl(var(--${name}-50))`,
-    100: `hsl(var(--${name}-100))`,
-    200: `hsl(var(--${name}-200))`,
-    300: `hsl(var(--${name}-300))`,
-    400: `hsl(var(--${name}-400))`,
-    500: `hsl(var(--${name}-500))`,
-    600: `hsl(var(--${name}-600))`,
-    700: `hsl(var(--${name}-700))`,
-    // 800: `hsl(var(--${name}-800))`,
-    // 900: `hsl(var(--${name}-900))`,
-    // 950: `hsl(var(--${name}-950))`,
-    // 激活状态下的颜色，适用于按钮按下时的背景色或边框色。
-    active: `hsl(var(--${name}-700))`,
-    // 浅色背景，适用于输入框或表单区域的背景。
-    'background-light': `hsl(var(--${name}-200))`,
-    // 适用于略浅的背景色，通常用于次要背景或略浅的区域。
-    'background-lighter': `hsl(var(--${name}-100))`,
-    // 最浅的背景色，适用于非常轻微的阴影或卡片的背景。
-    'background-lightest': `hsl(var(--${name}-50))`,
-    // 适用于普通边框，可能用于按钮或卡片的边框。
-    border: `hsl(var(--${name}-400))`,
-    // 浅色边框，适用于输入框或卡片的边框。
-    'border-light': `hsl(var(--${name}-300))`,
-    foreground: `hsl(var(--${name}-foreground))`,
-    // 鼠标悬停状态下的颜色，适用于按钮悬停时的背景色或边框色。
-    hover: `hsl(var(--${name}-600))`,
-    // 主色文本
-    text: `hsl(var(--${name}-500))`,
-    // 主色文本激活态
-    'text-active': `hsl(var(--${name}-700))`,
-    // 主色文本悬浮态
-    'text-hover': `hsl(var(--${name}-600))`,
-  };
-}
+import './theme.css';
diff --git a/internal/tailwind-config/src/module.d.ts b/internal/tailwind-config/src/module.d.ts
deleted file mode 100644
index a3996533..00000000
--- a/internal/tailwind-config/src/module.d.ts
+++ /dev/null
@@ -1,3 +0,0 @@
-declare module '@tailwindcss/nesting' {
-  export default any;
-}
diff --git a/internal/tailwind-config/src/plugins/entry.ts b/internal/tailwind-config/src/plugins/entry.ts
deleted file mode 100644
index 0d8e8ec8..00000000
--- a/internal/tailwind-config/src/plugins/entry.ts
+++ /dev/null
@@ -1,53 +0,0 @@
-import plugin from 'tailwindcss/plugin.js';
-
-const enterAnimationPlugin = plugin(({ addUtilities }) => {
-  const maxChild = 5;
-  const utilities: Record<string, any> = {};
-  for (let i = 1; i <= maxChild; i++) {
-    const baseDelay = 0.1;
-    const delay = `${baseDelay * i}s`;
-
-    utilities[`.enter-x:nth-child(${i})`] = {
-      animation: `enter-x-animation 0.3s ease-in-out ${delay} forwards`,
-      opacity: '0',
-      transform: `translateX(50px)`,
-    };
-
-    utilities[`.enter-y:nth-child(${i})`] = {
-      animation: `enter-y-animation 0.3s ease-in-out ${delay} forwards`,
-      opacity: '0',
-      transform: `translateY(50px)`,
-    };
-
-    utilities[`.-enter-x:nth-child(${i})`] = {
-      animation: `enter-x-animation 0.3s ease-in-out ${delay} forwards`,
-      opacity: '0',
-      transform: `translateX(-50px)`,
-    };
-
-    utilities[`.-enter-y:nth-child(${i})`] = {
-      animation: `enter-y-animation 0.3s ease-in-out ${delay} forwards`,
-      opacity: '0',
-      transform: `translateY(-50px)`,
-    };
-  }
-
-  // 添加动画关键帧
-  addUtilities(utilities);
-  addUtilities({
-    '@keyframes enter-x-animation': {
-      to: {
-        opacity: '1',
-        transform: 'translateX(0)',
-      },
-    },
-    '@keyframes enter-y-animation': {
-      to: {
-        opacity: '1',
-        transform: 'translateY(0)',
-      },
-    },
-  });
-});
-
-export { enterAnimationPlugin };
diff --git a/internal/tailwind-config/src/postcss.config.ts b/internal/tailwind-config/src/postcss.config.ts
deleted file mode 100644
index 43b30b35..00000000
--- a/internal/tailwind-config/src/postcss.config.ts
+++ /dev/null
@@ -1,15 +0,0 @@
-import config from '.';
-
-export default {
-  plugins: {
-    ...(process.env.NODE_ENV === 'production' ? { cssnano: {} } : {}),
-    // Specifying the config is not necessary in most cases, but it is included
-    autoprefixer: {},
-    // 修复 element-plus 和 ant-design-vue 的样式和tailwindcss冲突问题
-    'postcss-antd-fixes': { prefixes: ['ant', 'el'] },
-    'postcss-import': {},
-    'postcss-preset-env': {},
-    tailwindcss: { config },
-    'tailwindcss/nesting': {},
-  },
-};
diff --git a/internal/tailwind-config/src/theme.css b/internal/tailwind-config/src/theme.css
new file mode 100644
index 00000000..2bf31bbe
--- /dev/null
+++ b/internal/tailwind-config/src/theme.css
@@ -0,0 +1,588 @@
+/*
+ * 级联层顺序声明（必须先于 @import 'tailwindcss' 首次出现）：
+ * preflight(base) < UI 库组件样式(antd / el / td) < Tailwind 工具类，
+ * 使组件库样式（antdv-next 经 StyleProvider layer 注入 @layer antd；
+ * element-plus / tdesign 经各自应用的 vite css-layer 插件包入对应层）
+ * 能被工具类覆盖
+ */
+@layer theme, base, ant, antd, el, td, components, utilities;
+
+@import 'tailwindcss';
+@import 'tw-animate-css';
+
+@plugin '@tailwindcss/typography';
+@plugin '@iconify/tailwind4';
+
+/* Monorepo source detection: scan all packages and apps for utility classes */
+@source '../../../packages/';
+@source '../../../apps/';
+@source '../../../docs/';
+@source '../../../playground/';
+
+/* Dark mode uses .dark class selector, not prefers-color-scheme */
+@custom-variant dark (&:is(.dark *));
+
+/* Explicitly pin Tailwind v4 dynamic spacing for classes like w-150/h-55. */
+@theme {
+  --spacing: 0.25rem;
+}
+
+@theme inline {
+  /* Font */
+  --font-sans: var(--font-family);
+
+  /* Border Radius */
+  --radius-sm: calc(var(--radius) - 4px);
+  --radius-md: calc(var(--radius) - 2px);
+  --radius-lg: var(--radius);
+  --radius-xl: calc(var(--radius) + 4px);
+
+  /* Box Shadow */
+  --shadow-float:
+    0 6px 16px 0 rgb(0 0 0 / 8%), 0 3px 6px -4px rgb(0 0 0 / 12%),
+    0 9px 28px 8px rgb(0 0 0 / 5%);
+
+  /* Animations */
+  --animate-accordion-down: accordion-down 0.2s ease-out;
+  --animate-accordion-up: accordion-up 0.2s ease-out;
+  --animate-collapsible-down: collapsible-down 0.2s ease-in-out;
+  --animate-collapsible-up: collapsible-up 0.2s ease-in-out;
+  --animate-float: float 5s linear 0ms infinite;
+
+  /* ===== Semantic Colors (shadcn-ui) ===== */
+
+  --color-background: hsl(var(--background));
+  --color-background-deep: hsl(var(--background-deep));
+  --color-foreground: hsl(var(--foreground));
+  --color-card: hsl(var(--card));
+  --color-card-foreground: hsl(var(--card-foreground));
+  --color-popover: hsl(var(--popover));
+  --color-popover-foreground: hsl(var(--popover-foreground));
+  --color-muted: hsl(var(--muted));
+  --color-muted-foreground: hsl(var(--muted-foreground));
+  --color-accent: hsl(var(--accent));
+  --color-accent-foreground: hsl(var(--accent-foreground));
+  --color-accent-hover: hsl(var(--accent-hover));
+  --color-accent-lighter: hsl(var(--accent-lighter));
+  --color-border: hsl(var(--border));
+  --color-input: hsl(var(--input));
+  --color-input-background: hsl(var(--input-background));
+  --color-ring: hsl(var(--ring));
+  --color-secondary: hsl(var(--secondary));
+  --color-secondary-desc: hsl(var(--secondary-desc));
+  --color-secondary-foreground: hsl(var(--secondary-foreground));
+
+  /* ===== Custom Semantic Colors ===== */
+
+  --color-header: hsl(var(--header));
+  --color-heavy: hsl(var(--heavy));
+  --color-heavy-foreground: hsl(var(--heavy-foreground));
+  --color-main: hsl(var(--main));
+  --color-overlay: hsl(var(--overlay));
+  --color-overlay-content: hsl(var(--overlay-content));
+  --color-sidebar: hsl(var(--sidebar));
+  --color-sidebar-deep: hsl(var(--sidebar-deep));
+
+  /* ===== Primary Palette ===== */
+
+  --color-primary: hsl(var(--primary));
+  --color-primary-foreground: hsl(var(--primary-foreground));
+  --color-primary-50: hsl(var(--primary-50));
+  --color-primary-100: hsl(var(--primary-100));
+  --color-primary-200: hsl(var(--primary-200));
+  --color-primary-300: hsl(var(--primary-300));
+  --color-primary-400: hsl(var(--primary-400));
+  --color-primary-500: hsl(var(--primary-500));
+  --color-primary-600: hsl(var(--primary-600));
+  --color-primary-700: hsl(var(--primary-700));
+  --color-primary-active: hsl(var(--primary-700));
+  --color-primary-background-light: hsl(var(--primary-200));
+  --color-primary-background-lighter: hsl(var(--primary-100));
+  --color-primary-background-lightest: hsl(var(--primary-50));
+  --color-primary-border: hsl(var(--primary-400));
+  --color-primary-border-light: hsl(var(--primary-300));
+  --color-primary-hover: hsl(var(--primary-600));
+  --color-primary-text: hsl(var(--primary-500));
+  --color-primary-text-active: hsl(var(--primary-700));
+  --color-primary-text-hover: hsl(var(--primary-600));
+
+  /* ===== Destructive Palette ===== */
+
+  --color-destructive: hsl(var(--destructive));
+  --color-destructive-foreground: hsl(var(--destructive-foreground));
+  --color-destructive-50: hsl(var(--destructive-50));
+  --color-destructive-100: hsl(var(--destructive-100));
+  --color-destructive-200: hsl(var(--destructive-200));
+  --color-destructive-300: hsl(var(--destructive-300));
+  --color-destructive-400: hsl(var(--destructive-400));
+  --color-destructive-500: hsl(var(--destructive-500));
+  --color-destructive-600: hsl(var(--destructive-600));
+  --color-destructive-700: hsl(var(--destructive-700));
+  --color-destructive-active: hsl(var(--destructive-700));
+  --color-destructive-background-light: hsl(var(--destructive-200));
+  --color-destructive-background-lighter: hsl(var(--destructive-100));
+  --color-destructive-background-lightest: hsl(var(--destructive-50));
+  --color-destructive-border: hsl(var(--destructive-400));
+  --color-destructive-border-light: hsl(var(--destructive-300));
+  --color-destructive-hover: hsl(var(--destructive-600));
+  --color-destructive-text: hsl(var(--destructive-500));
+  --color-destructive-text-active: hsl(var(--destructive-700));
+  --color-destructive-text-hover: hsl(var(--destructive-600));
+
+  /* ===== Success Palette ===== */
+
+  --color-success: hsl(var(--success));
+  --color-success-foreground: hsl(var(--success-foreground));
+  --color-success-50: hsl(var(--success-50));
+  --color-success-100: hsl(var(--success-100));
+  --color-success-200: hsl(var(--success-200));
+  --color-success-300: hsl(var(--success-300));
+  --color-success-400: hsl(var(--success-400));
+  --color-success-500: hsl(var(--success-500));
+  --color-success-600: hsl(var(--success-600));
+  --color-success-700: hsl(var(--success-700));
+  --color-success-active: hsl(var(--success-700));
+  --color-success-background-light: hsl(var(--success-200));
+  --color-success-background-lighter: hsl(var(--success-100));
+  --color-success-background-lightest: hsl(var(--success-50));
+  --color-success-border: hsl(var(--success-400));
+  --color-success-border-light: hsl(var(--success-300));
+  --color-success-hover: hsl(var(--success-600));
+  --color-success-text: hsl(var(--success-500));
+  --color-success-text-active: hsl(var(--success-700));
+  --color-success-text-hover: hsl(var(--success-600));
+
+  /* ===== Warning Palette ===== */
+
+  --color-warning: hsl(var(--warning));
+  --color-warning-foreground: hsl(var(--warning-foreground));
+  --color-warning-50: hsl(var(--warning-50));
+  --color-warning-100: hsl(var(--warning-100));
+  --color-warning-200: hsl(var(--warning-200));
+  --color-warning-300: hsl(var(--warning-300));
+  --color-warning-400: hsl(var(--warning-400));
+  --color-warning-500: hsl(var(--warning-500));
+  --color-warning-600: hsl(var(--warning-600));
+  --color-warning-700: hsl(var(--warning-700));
+  --color-warning-active: hsl(var(--warning-700));
+  --color-warning-background-light: hsl(var(--warning-200));
+  --color-warning-background-lighter: hsl(var(--warning-100));
+  --color-warning-background-lightest: hsl(var(--warning-50));
+  --color-warning-border: hsl(var(--warning-400));
+  --color-warning-border-light: hsl(var(--warning-300));
+  --color-warning-hover: hsl(var(--warning-600));
+  --color-warning-text: hsl(var(--warning-500));
+  --color-warning-text-active: hsl(var(--warning-700));
+  --color-warning-text-hover: hsl(var(--warning-600));
+
+  /* ===== Green Palette (alias for success shades) ===== */
+
+  --color-green-50: hsl(var(--green-50));
+  --color-green-100: hsl(var(--green-100));
+  --color-green-200: hsl(var(--green-200));
+  --color-green-300: hsl(var(--green-300));
+  --color-green-400: hsl(var(--green-400));
+  --color-green-500: hsl(var(--green-500));
+  --color-green-600: hsl(var(--green-600));
+  --color-green-700: hsl(var(--green-700));
+  --color-green-active: hsl(var(--green-700));
+  --color-green-background-light: hsl(var(--green-200));
+  --color-green-background-lighter: hsl(var(--green-100));
+  --color-green-background-lightest: hsl(var(--green-50));
+  --color-green-border: hsl(var(--green-400));
+  --color-green-border-light: hsl(var(--green-300));
+  --color-green-foreground: hsl(var(--success-foreground));
+  --color-green-hover: hsl(var(--green-600));
+  --color-green-text: hsl(var(--green-500));
+  --color-green-text-active: hsl(var(--green-700));
+  --color-green-text-hover: hsl(var(--green-600));
+
+  /* ===== Red Palette (alias for destructive shades) ===== */
+
+  --color-red-50: hsl(var(--red-50));
+  --color-red-100: hsl(var(--red-100));
+  --color-red-200: hsl(var(--red-200));
+  --color-red-300: hsl(var(--red-300));
+  --color-red-400: hsl(var(--red-400));
+  --color-red-500: hsl(var(--red-500));
+  --color-red-600: hsl(var(--red-600));
+  --color-red-700: hsl(var(--red-700));
+  --color-red-active: hsl(var(--red-700));
+  --color-red-background-light: hsl(var(--red-200));
+  --color-red-background-lighter: hsl(var(--red-100));
+  --color-red-background-lightest: hsl(var(--red-50));
+  --color-red-border: hsl(var(--red-400));
+  --color-red-border-light: hsl(var(--red-300));
+  --color-red-foreground: hsl(var(--destructive-foreground));
+  --color-red-hover: hsl(var(--red-600));
+  --color-red-text: hsl(var(--red-500));
+  --color-red-text-active: hsl(var(--red-700));
+  --color-red-text-hover: hsl(var(--red-600));
+
+  /* ===== Yellow Palette (alias for warning shades) ===== */
+
+  --color-yellow-50: hsl(var(--yellow-50));
+  --color-yellow-100: hsl(var(--yellow-100));
+  --color-yellow-200: hsl(var(--yellow-200));
+  --color-yellow-300: hsl(var(--yellow-300));
+  --color-yellow-400: hsl(var(--yellow-400));
+  --color-yellow-500: hsl(var(--yellow-500));
+  --color-yellow-600: hsl(var(--yellow-600));
+  --color-yellow-700: hsl(var(--yellow-700));
+  --color-yellow-active: hsl(var(--yellow-700));
+  --color-yellow-background-light: hsl(var(--yellow-200));
+  --color-yellow-background-lighter: hsl(var(--yellow-100));
+  --color-yellow-background-lightest: hsl(var(--yellow-50));
+  --color-yellow-border: hsl(var(--yellow-400));
+  --color-yellow-border-light: hsl(var(--yellow-300));
+  --color-yellow-foreground: hsl(var(--warning-foreground));
+  --color-yellow-hover: hsl(var(--yellow-600));
+  --color-yellow-text: hsl(var(--yellow-500));
+  --color-yellow-text-active: hsl(var(--yellow-700));
+  --color-yellow-text-hover: hsl(var(--yellow-600));
+}
+
+/* Keyframes */
+@keyframes accordion-down {
+  from {
+    height: 0;
+  }
+
+  to {
+    height: var(--reka-accordion-content-height);
+  }
+}
+
+@keyframes accordion-up {
+  from {
+    height: var(--reka-accordion-content-height);
+  }
+
+  to {
+    height: 0;
+  }
+}
+
+@keyframes collapsible-down {
+  from {
+    height: 0;
+  }
+
+  to {
+    height: var(--reka-collapsible-content-height);
+  }
+}
+
+@keyframes collapsible-up {
+  from {
+    height: var(--reka-collapsible-content-height);
+  }
+
+  to {
+    height: 0;
+  }
+}
+
+@keyframes float {
+  0% {
+    transform: translateY(0);
+  }
+
+  50% {
+    transform: translateY(-20px);
+  }
+
+  100% {
+    transform: translateY(0);
+  }
+}
+
+/* Base styles */
+@layer base {
+  *,
+  ::after,
+  ::before {
+    @apply border-border outline-ring/50;
+
+    box-sizing: border-box;
+    border-style: solid;
+    border-width: 0;
+  }
+
+  html {
+    @apply bg-background font-sans text-foreground;
+
+    scroll-behavior: smooth;
+    font-size: var(--font-size-base, 16px);
+    font-variation-settings: normal;
+    font-synthesis-weight: none;
+    line-height: 1.15;
+    text-rendering: optimizelegibility;
+    text-size-adjust: 100%;
+    -webkit-tap-highlight-color: transparent;
+  }
+
+  #app,
+  body,
+  html {
+    @apply size-full;
+  }
+
+  body {
+    min-height: 100vh;
+  }
+
+  a,
+  a:active,
+  a:hover,
+  a:link,
+  a:visited {
+    @apply no-underline;
+  }
+
+  ::view-transition-new(root),
+  ::view-transition-old(root) {
+    @apply animate-none mix-blend-normal;
+  }
+
+  ::view-transition-old(root) {
+    @apply z-1;
+  }
+
+  ::view-transition-new(root) {
+    @apply z-2147483646;
+  }
+
+  html.dark::view-transition-old(root) {
+    @apply z-2147483646;
+  }
+
+  html.dark::view-transition-new(root) {
+    @apply z-1;
+  }
+
+  input::placeholder,
+  textarea::placeholder {
+    @apply opacity-100;
+  }
+
+  input[type='number']::-webkit-inner-spin-button,
+  input[type='number']::-webkit-outer-spin-button {
+    @apply m-0 appearance-none;
+  }
+
+  /* Only adjust scrollbar for non-macOS */
+  html:not([data-platform='macOs']) {
+    ::-webkit-scrollbar {
+      @apply h-2.5 w-2.5;
+    }
+
+    ::-webkit-scrollbar-thumb {
+      @apply rounded-sm border-none bg-border;
+    }
+
+    ::-webkit-scrollbar-track {
+      @apply rounded-sm border-none bg-transparent shadow-none;
+    }
+
+    ::-webkit-scrollbar-button {
+      @apply hidden;
+    }
+  }
+
+  /* Tailwind v4 Preflight 不再为 button 默认设置 pointer；见官方升级说明：
+   * https://tailwindcss.com/docs/upgrade-guide#buttons-use-the-default-cursor */
+  button:not(:disabled),
+  [role='button']:not(:disabled) {
+    @apply cursor-pointer;
+  }
+}
+
+/* Custom utilities (v4 @utility syntax) */
+@utility flex-center {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+@utility flex-col-center {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+}
+
+/* Tailwind v4 的 utilities 在 @layer 内；组件样式若留在 layer 外，会按层叠规则压过 py-4 等工具类。
+ * 见：https://tailwindcss.com/docs/adding-custom-styles#using-css-and-layering */
+@layer components {
+  .outline-box {
+    @apply relative cursor-pointer rounded-md p-1 outline-1 outline-border;
+  }
+
+  .outline-box::after {
+    @apply absolute top-1/2 left-1/2 z-20 h-0 w-px rounded-sm opacity-0 outline-2 outline-transparent transition-all duration-300 content-[""];
+  }
+
+  .outline-box.outline-box-active {
+    @apply outline-2 outline-primary;
+  }
+
+  .outline-box.outline-box-active::after {
+    display: none;
+  }
+
+  .outline-box:not(.outline-box-active):hover::after {
+    @apply top-0 left-0 h-full w-full p-1 opacity-100 outline-primary;
+  }
+
+  .vben-link {
+    @apply cursor-pointer text-primary hover:text-primary-hover active:text-primary-active;
+  }
+
+  .card-box {
+    @apply rounded-xl border border-border bg-card text-card-foreground;
+  }
+}
+
+/* Enter animations (converted from enterAnimationPlugin) */
+@keyframes enter-x-animation {
+  to {
+    opacity: 1;
+    transform: translateX(0);
+  }
+}
+
+@keyframes enter-y-animation {
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
+}
+
+.enter-x:nth-child(1) {
+  opacity: 0;
+  transform: translateX(50px);
+  animation: enter-x-animation 0.3s ease-in-out 0.1s forwards;
+}
+
+.enter-x:nth-child(2) {
+  opacity: 0;
+  transform: translateX(50px);
+  animation: enter-x-animation 0.3s ease-in-out 0.2s forwards;
+}
+
+.enter-x:nth-child(3) {
+  opacity: 0;
+  transform: translateX(50px);
+  animation: enter-x-animation 0.3s ease-in-out 0.3s forwards;
+}
+
+.enter-x:nth-child(4) {
+  opacity: 0;
+  transform: translateX(50px);
+  animation: enter-x-animation 0.3s ease-in-out 0.4s forwards;
+}
+
+.enter-x:nth-child(5) {
+  opacity: 0;
+  transform: translateX(50px);
+  animation: enter-x-animation 0.3s ease-in-out 0.5s forwards;
+}
+
+.enter-y:nth-child(1) {
+  opacity: 0;
+  transform: translateY(50px);
+  animation: enter-y-animation 0.3s ease-in-out 0.1s forwards;
+}
+
+.enter-y:nth-child(2) {
+  opacity: 0;
+  transform: translateY(50px);
+  animation: enter-y-animation 0.3s ease-in-out 0.2s forwards;
+}
+
+.enter-y:nth-child(3) {
+  opacity: 0;
+  transform: translateY(50px);
+  animation: enter-y-animation 0.3s ease-in-out 0.3s forwards;
+}
+
+.enter-y:nth-child(4) {
+  opacity: 0;
+  transform: translateY(50px);
+  animation: enter-y-animation 0.3s ease-in-out 0.4s forwards;
+}
+
+.enter-y:nth-child(5) {
+  opacity: 0;
+  transform: translateY(50px);
+  animation: enter-y-animation 0.3s ease-in-out 0.5s forwards;
+}
+
+.-enter-x:nth-child(1) {
+  opacity: 0;
+  transform: translateX(-50px);
+  animation: enter-x-animation 0.3s ease-in-out 0.1s forwards;
+}
+
+.-enter-x:nth-child(2) {
+  opacity: 0;
+  transform: translateX(-50px);
+  animation: enter-x-animation 0.3s ease-in-out 0.2s forwards;
+}
+
+.-enter-x:nth-child(3) {
+  opacity: 0;
+  transform: translateX(-50px);
+  animation: enter-x-animation 0.3s ease-in-out 0.3s forwards;
+}
+
+.-enter-x:nth-child(4) {
+  opacity: 0;
+  transform: translateX(-50px);
+  animation: enter-x-animation 0.3s ease-in-out 0.4s forwards;
+}
+
+.-enter-x:nth-child(5) {
+  opacity: 0;
+  transform: translateX(-50px);
+  animation: enter-x-animation 0.3s ease-in-out 0.5s forwards;
+}
+
+.-enter-y:nth-child(1) {
+  opacity: 0;
+  transform: translateY(-50px);
+  animation: enter-y-animation 0.3s ease-in-out 0.1s forwards;
+}
+
+.-enter-y:nth-child(2) {
+  opacity: 0;
+  transform: translateY(-50px);
+  animation: enter-y-animation 0.3s ease-in-out 0.2s forwards;
+}
+
+.-enter-y:nth-child(3) {
+  opacity: 0;
+  transform: translateY(-50px);
+  animation: enter-y-animation 0.3s ease-in-out 0.3s forwards;
+}
+
+.-enter-y:nth-child(4) {
+  opacity: 0;
+  transform: translateY(-50px);
+  animation: enter-y-animation 0.3s ease-in-out 0.4s forwards;
+}
+
+.-enter-y:nth-child(5) {
+  opacity: 0;
+  transform: translateY(-50px);
+  animation: enter-y-animation 0.3s ease-in-out 0.5s forwards;
+}
+
+html.invert-mode {
+  @apply invert;
+}
+
+html.grayscale-mode {
+  @apply grayscale;
+}
diff --git a/internal/tailwind-config/tsconfig.json b/internal/tailwind-config/tsconfig.json
index b2ec3b61..ce1a891f 100644
--- a/internal/tailwind-config/tsconfig.json
+++ b/internal/tailwind-config/tsconfig.json
@@ -1,6 +1,6 @@
 {
   "$schema": "https://json.schemastore.org/tsconfig",
-  "extends": "@vben/tsconfig/node.json",
+  "extends": "@vben/tsconfig/web.json",
   "include": ["src"],
   "exclude": ["node_modules"]
 }
diff --git a/internal/tsconfig/base.json b/internal/tsconfig/base.json
index 1e45a784..132806b5 100644
--- a/internal/tsconfig/base.json
+++ b/internal/tsconfig/base.json
@@ -8,7 +8,6 @@
     "moduleDetection": "force",
     "experimentalDecorators": true,
 
-    "baseUrl": ".",
     "module": "ESNext",
 
     "moduleResolution": "node",
diff --git a/internal/tsconfig/node.json b/internal/tsconfig/node.json
index 31ce8f18..409dd726 100644
--- a/internal/tsconfig/node.json
+++ b/internal/tsconfig/node.json
@@ -5,7 +5,7 @@
   "compilerOptions": {
     "composite": false,
     "lib": ["ESNext"],
-    "baseUrl": "./",
+    "moduleResolution": "bundler",
     "types": ["node"],
     "noImplicitAny": true
   }
diff --git a/internal/tsconfig/package.json b/internal/tsconfig/package.json
index d935b671..6370b3aa 100644
--- a/internal/tsconfig/package.json
+++ b/internal/tsconfig/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vben/tsconfig",
-  "version": "5.5.1",
+  "version": "5.7.0",
   "private": true,
   "homepage": "https://github.com/vbenjs/vue-vben-admin",
   "bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
diff --git a/internal/vite-config/build.config.ts b/internal/vite-config/build.config.ts
deleted file mode 100644
index 97e572c5..00000000
--- a/internal/vite-config/build.config.ts
+++ /dev/null
@@ -1,7 +0,0 @@
-import { defineBuildConfig } from 'unbuild';
-
-export default defineBuildConfig({
-  clean: true,
-  declaration: true,
-  entries: ['src/index'],
-});
diff --git a/internal/vite-config/package.json b/internal/vite-config/package.json
index 60955a1d..b2abcad7 100644
--- a/internal/vite-config/package.json
+++ b/internal/vite-config/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vben/vite-config",
-  "version": "5.5.1",
+  "version": "5.7.0",
   "private": true,
   "homepage": "https://github.com/vbenjs/vue-vben-admin",
   "bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
@@ -12,7 +12,7 @@
   "license": "MIT",
   "type": "module",
   "scripts": {
-    "stub": "pnpm unbuild --stub"
+    "stub": "pnpm exec tsdown"
   },
   "files": [
     "dist"
@@ -29,6 +29,8 @@
   "dependencies": {
     "@intlify/unplugin-vue-i18n": "catalog:",
     "@jspm/generator": "catalog:",
+    "@tailwindcss/vite": "catalog:",
+    "@vben/node-utils": "workspace:*",
     "archiver": "catalog:",
     "cheerio": "catalog:",
     "get-port": "catalog:",
@@ -42,18 +44,16 @@
     "@pnpm/workspace.read-manifest": "catalog:",
     "@types/archiver": "catalog:",
     "@types/html-minifier-terser": "catalog:",
-    "@vben/node-utils": "workspace:*",
     "@vitejs/plugin-vue": "catalog:",
     "@vitejs/plugin-vue-jsx": "catalog:",
     "dayjs": "catalog:",
     "dotenv": "catalog:",
-    "rollup": "catalog:",
     "rollup-plugin-visualizer": "catalog:",
     "sass": "catalog:",
+    "sass-embedded": "catalog:",
+    "unplugin-dts": "catalog:",
     "vite": "catalog:",
     "vite-plugin-compression": "catalog:",
-    "vite-plugin-dts": "catalog:",
-    "vite-plugin-html": "catalog:",
     "vite-plugin-lazy-import": "catalog:"
   }
 }
diff --git a/internal/vite-config/src/config/application.ts b/internal/vite-config/src/config/application.ts
index f9808cc7..f8c22646 100644
--- a/internal/vite-config/src/config/application.ts
+++ b/internal/vite-config/src/config/application.ts
@@ -6,7 +6,7 @@ import path, { relative } from 'node:path';
 
 import { findMonorepoRoot } from '@vben/node-utils';
 
-import { NodePackageImporter } from 'sass';
+import { NodePackageImporter } from 'sass-embedded';
 import { defineConfig, loadEnv, mergeConfig } from 'vite';
 
 import { defaultImportmapOptions, getDefaultPwaOptions } from '../options';
@@ -58,25 +58,23 @@ function defineApplicationConfig(userConfigPromise?: DefineApplicationOptions) {
     const applicationConfig: UserConfig = {
       base,
       build: {
-        rollupOptions: {
+        rolldownOptions: {
           output: {
             assetFileNames: '[ext]/[name]-[hash].[ext]',
             chunkFileNames: 'js/[name]-[hash].js',
             entryFileNames: 'jse/index-[name]-[hash].js',
+            minify: isBuild
+              ? {
+                  compress: {
+                    dropDebugger: true,
+                  },
+                }
+              : false,
           },
         },
         target: 'es2015',
       },
       css: createCssOptions(injectGlobalScss),
-      esbuild: {
-        drop: isBuild
-          ? [
-              // 'console',
-              'debugger',
-            ]
-          : [],
-        legalComments: 'none',
-      },
       plugins,
       server: {
         host: true,
@@ -114,7 +112,7 @@ function createCssOptions(injectGlobalScss = true): CSSOptions {
               }
               return content;
             },
-            api: 'modern',
+            // api: 'modern',
             importers: [new NodePackageImporter()],
           },
         }
diff --git a/internal/vite-config/src/config/index.ts b/internal/vite-config/src/config/index.ts
index d04a84a8..b8c770a9 100644
--- a/internal/vite-config/src/config/index.ts
+++ b/internal/vite-config/src/config/index.ts
@@ -1,4 +1,4 @@
-import type { DefineConfig } from '../typing';
+import type { DefineConfig, VbenViteConfig } from '../typing';
 
 import { existsSync } from 'node:fs';
 import { join } from 'node:path';
@@ -12,7 +12,7 @@ export * from './library';
 function defineConfig(
   userConfigPromise?: DefineConfig,
   type: 'application' | 'auto' | 'library' = 'auto',
-) {
+): VbenViteConfig {
   let projectType = type;
 
   // 根据包是否存在 index.html,自动判断类型
diff --git a/internal/vite-config/src/config/library.ts b/internal/vite-config/src/config/library.ts
index 08b81352..623229fc 100644
--- a/internal/vite-config/src/config/library.ts
+++ b/internal/vite-config/src/config/library.ts
@@ -40,7 +40,7 @@ function defineLibraryConfig(userConfigPromise?: DefineLibraryOptions) {
           fileName: () => 'index.mjs',
           formats: ['es'],
         },
-        rollupOptions: {
+        rolldownOptions: {
           external: (id) => {
             return externalPackages.some(
               (pkg) => id === pkg || id.startsWith(`${pkg}/`),
diff --git a/internal/vite-config/src/index.ts b/internal/vite-config/src/index.ts
index 352a3235..c9c2b20d 100644
--- a/internal/vite-config/src/index.ts
+++ b/internal/vite-config/src/index.ts
@@ -1,4 +1,5 @@
 export * from './config';
 export * from './options';
 export * from './plugins';
+export type * from './typing';
 export { loadAndConvertEnv } from './utils/env';
diff --git a/internal/vite-config/src/plugins/archiver.ts b/internal/vite-config/src/plugins/archiver.ts
index 8eec8a0e..7e932920 100644
--- a/internal/vite-config/src/plugins/archiver.ts
+++ b/internal/vite-config/src/plugins/archiver.ts
@@ -6,7 +6,7 @@ import fs from 'node:fs';
 import fsp from 'node:fs/promises';
 import { join } from 'node:path';
 
-import archiver from 'archiver';
+import { ZipArchive } from 'archiver';
 
 export const viteArchiverPlugin = (
   options: ArchiverPluginOptions = {},
@@ -49,7 +49,8 @@ async function zipFolder(
 ): Promise<void> {
   return new Promise((resolve, reject) => {
     const output = fs.createWriteStream(outputPath);
-    const archive = archiver('zip', {
+
+    const archive = new ZipArchive({
       zlib: { level: 9 }, // 设置压缩级别为 9 以实现最高压缩率
     });
 
diff --git a/internal/vite-config/src/plugins/css-layer.ts b/internal/vite-config/src/plugins/css-layer.ts
new file mode 100644
index 00000000..d12e60cb
--- /dev/null
+++ b/internal/vite-config/src/plugins/css-layer.ts
@@ -0,0 +1,45 @@
+import type { Plugin } from 'vite';
+
+interface CssLayerRule {
+  /** 层名，需在 css 中先于 @import 'tailwindcss' 声明层顺序（见 internal/tailwind-config/theme.css） */
+  layerName: string;
+  /** 需要包层的包名（匹配该包在 node_modules 下的 css 模块 id） */
+  packageName: string;
+}
+
+function escapeRegExp(value: string): string {
+  return value.replaceAll(/[.*+?^${}()|[\]\\]/g, String.raw`\$&`);
+}
+
+/**
+ * 把指定包内的 css 包进 @layer：
+ * 组件库的 css 是无层样式，无层样式在级联中永远压过 @layer 内的 Tailwind 工具类；
+ * 包层后由 theme.css 的层声明决定顺序（utilities 排在组件库层之后），
+ * 使 Tailwind 工具类可以覆盖组件库样式。
+ *
+ * @example
+ * ```ts
+ * plugins: [viteCssLayerPlugin({ packageName: 'element-plus', layerName: 'el' })]
+ * ```
+ */
+export function viteCssLayerPlugin(
+  rules: CssLayerRule | CssLayerRule[],
+): Plugin {
+  const list = Array.isArray(rules) ? rules : [rules];
+  const matchers = list.map(({ layerName, packageName }) => ({
+    layerName,
+    regex: new RegExp(`${escapeRegExp(packageName)}[\\\\/].+\\.css$`, 'i'),
+  }));
+  return {
+    name: 'vite-plugin-css-layer',
+    enforce: 'pre',
+    transform(code, id) {
+      const [file] = id.split('?', 1);
+      if (!file) return;
+      const matched = matchers.find((m) => m.regex.test(file));
+      if (matched) {
+        return { code: `@layer ${matched.layerName} {\n${code}\n}`, map: null };
+      }
+    },
+  };
+}
diff --git a/internal/vite-config/src/plugins/dayjs.ts b/internal/vite-config/src/plugins/dayjs.ts
new file mode 100644
index 00000000..24bd17a0
--- /dev/null
+++ b/internal/vite-config/src/plugins/dayjs.ts
@@ -0,0 +1,70 @@
+import type { Plugin } from 'vite';
+
+function viteDayjsPlugin(): Plugin {
+  return {
+    name: 'vite-dayjs-plugin',
+    enforce: 'pre',
+    async resolveId(source, importer, options) {
+      // 1) 已经使用了 dayjs/esm 的不处理
+      if (source.startsWith('dayjs/esm')) return null;
+
+      // 2) 根入口：dayjs -> dayjs/esm
+      if (source === 'dayjs') {
+        return await this.resolve('dayjs/esm', importer, {
+          skipSelf: true,
+          ...options,
+        });
+      }
+
+      // 3) 插件入口的多种写法
+      //    - dayjs/plugin/xxx.js           -> dayjs/esm/plugin/xxx/index.js
+      //    - dayjs/plugin/xxx              -> dayjs/esm/plugin/xxx
+      const pluginWithJs = source.match(/^dayjs\/plugin\/([^/]+)\.js$/);
+      if (pluginWithJs) {
+        const target = `dayjs/esm/plugin/${pluginWithJs[1]}/index.js`;
+        return await this.resolve(target, importer, {
+          skipSelf: true,
+          ...options,
+        });
+      }
+
+      const pluginBare = source.match(/^dayjs\/plugin\/([^/]+)$/);
+      if (pluginBare) {
+        const target = `dayjs/esm/plugin/${pluginBare[1]}`;
+        return await this.resolve(target, importer, {
+          skipSelf: true,
+          ...options,
+        });
+      }
+
+      // 4) 处理多语言包
+      //    - dayjs/locale/xxx.js          -> dayjs/esm/locale/xxx.js
+      const localeWithJs = source.match(/^dayjs\/locale\/([^/]+)\.js$/);
+      if (localeWithJs) {
+        const target = `dayjs/esm/locale/${localeWithJs[1]}.js`;
+        return await this.resolve(target, importer, {
+          skipSelf: true,
+          ...options,
+        });
+      }
+      const localeBare = source.match(/^dayjs\/locale\/([^/]+)$/);
+      if (localeBare) {
+        const target = `dayjs/esm/locale/${localeBare[1]}`;
+        return await this.resolve(target, importer, {
+          skipSelf: true,
+          ...options,
+        });
+      }
+
+      return null;
+    },
+    config() {
+      return {
+        optimizeDeps: {
+          exclude: ['dayjs'],
+        },
+      };
+    },
+  };
+}
+export { viteDayjsPlugin };
diff --git a/internal/vite-config/src/plugins/extra-app-config.ts b/internal/vite-config/src/plugins/extra-app-config.ts
index 813819bb..903aa6fd 100644
--- a/internal/vite-config/src/plugins/extra-app-config.ts
+++ b/internal/vite-config/src/plugins/extra-app-config.ts
@@ -13,7 +13,7 @@ interface PluginOptions {
   root: string;
 }
 
-const GLOBAL_CONFIG_FILE_NAME = '_app.config.js';
+const GLOBAL_CONFIG_FILE_NAME = '_app-config';
 const VBEN_ADMIN_PRO_APP_CONF = '_VBEN_ADMIN_PRO_APP_CONF_';
 
 /**
@@ -27,6 +27,7 @@ async function viteExtraAppConfigPlugin({
 }: PluginOptions): Promise<PluginOption | undefined> {
   let publicPath: string;
   let source: string;
+  let hash: string;
 
   if (!isBuild) {
     return;
@@ -38,11 +39,12 @@ async function viteExtraAppConfigPlugin({
     async configResolved(config) {
       publicPath = ensureTrailingSlash(config.base);
       source = await getConfigSource();
+      hash = generatorContentHash(source, 8);
     },
     async generateBundle() {
       try {
         this.emitFile({
-          fileName: GLOBAL_CONFIG_FILE_NAME,
+          fileName: `${GLOBAL_CONFIG_FILE_NAME}-${version}-${hash}.js`,
           source,
           type: 'asset',
         });
@@ -58,9 +60,7 @@ async function viteExtraAppConfigPlugin({
     },
     name: 'vite:extra-app-config',
     async transformIndexHtml(html) {
-      const hash = `v=${version}-${generatorContentHash(source, 8)}`;
-
-      const appConfigSrc = `${publicPath}${GLOBAL_CONFIG_FILE_NAME}?${hash}`;
+      const appConfigSrc = `${publicPath}${GLOBAL_CONFIG_FILE_NAME}-${version}-${hash}.js`;
 
       return {
         html,
diff --git a/internal/vite-config/src/plugins/form-field-slot-migration-warning.test.ts b/internal/vite-config/src/plugins/form-field-slot-migration-warning.test.ts
new file mode 100644
index 00000000..6a58cb10
--- /dev/null
+++ b/internal/vite-config/src/plugins/form-field-slot-migration-warning.test.ts
@@ -0,0 +1,43 @@
+import type { ResolvedConfig } from 'vite';
+
+import { describe, expect, it, vi } from 'vitest';
+
+import {
+  FORM_FIELD_SLOT_MIGRATION_WARNING,
+  viteFormFieldSlotMigrationWarningPlugin,
+} from './form-field-slot-migration-warning';
+
+describe('form field slot migration warning plugin', () => {
+  it('warns in serve mode and injects the same browser message', () => {
+    const plugin = viteFormFieldSlotMigrationWarningPlugin();
+    const warning = vi.fn();
+
+    expect(plugin.apply).toBe('serve');
+    expect(plugin.configResolved).toBeTypeOf('function');
+    if (typeof plugin.configResolved !== 'function') return;
+
+    plugin.configResolved({ logger: { warn: warning } } as ResolvedConfig);
+
+    expect(warning).toHaveBeenCalledOnce();
+    expect(warning).toHaveBeenCalledWith(FORM_FIELD_SLOT_MIGRATION_WARNING);
+    expect(plugin.transformIndexHtml).toBeTypeOf('function');
+    if (typeof plugin.transformIndexHtml !== 'function') return;
+
+    const result = plugin.transformIndexHtml('', {} as never);
+
+    expect(result).toEqual([
+      {
+        attrs: {
+          'data-vben-form-field-slot-migration-warning': '',
+        },
+        children: `console.warn(${JSON.stringify(FORM_FIELD_SLOT_MIGRATION_WARNING)});`,
+        injectTo: 'body',
+        tag: 'script',
+      },
+    ]);
+    expect(FORM_FIELD_SLOT_MIGRATION_WARNING).toContain('`v-bind="slotProps"`');
+    expect(FORM_FIELD_SLOT_MIGRATION_WARNING).toContain(
+      '`v-bind="slotProps.componentProps"`',
+    );
+  });
+});
diff --git a/internal/vite-config/src/plugins/form-field-slot-migration-warning.ts b/internal/vite-config/src/plugins/form-field-slot-migration-warning.ts
new file mode 100644
index 00000000..535ef5d9
--- /dev/null
+++ b/internal/vite-config/src/plugins/form-field-slot-migration-warning.ts
@@ -0,0 +1,31 @@
+import type { Plugin } from 'vite';
+
+const FORM_FIELD_SLOT_MIGRATION_WARNING =
+  '[Vben Form] BREAKING CHANGE: Named field slot control bindings moved to `slotProps.componentProps`. Replace `v-bind="slotProps"` with `v-bind="slotProps.componentProps"`. See https://doc.vben.pro/components/common-ui/vben-form.html';
+
+function viteFormFieldSlotMigrationWarningPlugin(): Plugin {
+  return {
+    apply: 'serve',
+    configResolved(config) {
+      config.logger.warn(FORM_FIELD_SLOT_MIGRATION_WARNING);
+    },
+    name: 'vite:form-field-slot-migration-warning',
+    transformIndexHtml() {
+      return [
+        {
+          attrs: {
+            'data-vben-form-field-slot-migration-warning': '',
+          },
+          children: `console.warn(${JSON.stringify(FORM_FIELD_SLOT_MIGRATION_WARNING)});`,
+          injectTo: 'body',
+          tag: 'script',
+        },
+      ];
+    },
+  };
+}
+
+export {
+  FORM_FIELD_SLOT_MIGRATION_WARNING,
+  viteFormFieldSlotMigrationWarningPlugin,
+};
diff --git a/internal/vite-config/src/plugins/html.ts b/internal/vite-config/src/plugins/html.ts
new file mode 100644
index 00000000..42eb8a6a
--- /dev/null
+++ b/internal/vite-config/src/plugins/html.ts
@@ -0,0 +1,35 @@
+import type { Options as HtmlMinifierOptions } from 'html-minifier-terser';
+import type { PluginOption } from 'vite';
+
+import { minify } from 'html-minifier-terser';
+
+const HTML_MINIFY_OPTIONS = {
+  collapseWhitespace: true,
+  minifyCSS: true,
+  minifyJS: true,
+  removeComments: true,
+  removeRedundantAttributes: true,
+  removeScriptTypeAttributes: true,
+  removeStyleLinkTypeAttributes: true,
+  useShortDoctype: true,
+} as const;
+
+function viteHtmlPlugin(options: HtmlMinifierOptions = {}): PluginOption {
+  return {
+    name: 'vben-native-html',
+    transformIndexHtml: {
+      order: 'post',
+      async handler(html, ctx) {
+        if (!ctx.bundle) {
+          return html;
+        }
+        return await minify(html, {
+          ...HTML_MINIFY_OPTIONS,
+          ...options,
+        });
+      },
+    },
+  };
+}
+
+export { viteHtmlPlugin };
diff --git a/internal/vite-config/src/plugins/importmap.ts b/internal/vite-config/src/plugins/importmap.ts
index c6154c9e..0ccda99f 100644
--- a/internal/vite-config/src/plugins/importmap.ts
+++ b/internal/vite-config/src/plugins/importmap.ts
@@ -10,11 +10,11 @@ import { minify } from 'html-minifier-terser';
 
 const DEFAULT_PROVIDER = 'jspm.io';
 
-type pluginOptions = {
+type pluginOptions = GeneratorOptions & {
   debug?: boolean;
   defaultProvider?: 'esm.sh' | 'jsdelivr' | 'jspm.io';
   importmap?: Array<{ name: string; range?: string }>;
-} & GeneratorOptions;
+};
 
 // async function getLatestVersionOfShims() {
 //   const result = await fetch('https://ga.jspm.io/npm:es-module-shims');
diff --git a/internal/vite-config/src/plugins/index.ts b/internal/vite-config/src/plugins/index.ts
index da08db4b..d6a14784 100644
--- a/internal/vite-config/src/plugins/index.ts
+++ b/internal/vite-config/src/plugins/index.ts
@@ -8,23 +8,27 @@ import type {
 } from '../typing';
 
 import viteVueI18nPlugin from '@intlify/unplugin-vue-i18n/vite';
+import tailwindcss from '@tailwindcss/vite';
 import viteVue from '@vitejs/plugin-vue';
 import viteVueJsx from '@vitejs/plugin-vue-jsx';
 import { visualizer as viteVisualizerPlugin } from 'rollup-plugin-visualizer';
+import viteDtsPlugin from 'unplugin-dts/vite';
 import viteCompressPlugin from 'vite-plugin-compression';
-import viteDtsPlugin from 'vite-plugin-dts';
-import { createHtmlPlugin as viteHtmlPlugin } from 'vite-plugin-html';
 import { VitePWA } from 'vite-plugin-pwa';
 import viteVueDevTools from 'vite-plugin-vue-devtools';
 
 import { viteArchiverPlugin } from './archiver';
+import { viteDayjsPlugin } from './dayjs';
 import { viteExtraAppConfigPlugin } from './extra-app-config';
+import { viteFormFieldSlotMigrationWarningPlugin } from './form-field-slot-migration-warning';
+import { viteHtmlPlugin } from './html';
 import { viteImportMapPlugin } from './importmap';
 import { viteInjectAppLoadingPlugin } from './inject-app-loading';
 import { viteMetadataPlugin } from './inject-metadata';
 import { viteLicensePlugin } from './license';
 import { viteNitroMockPlugin } from './nitro-mock';
 import { vitePrintPlugin } from './print';
+import { viteTailwindReferencePlugin } from './tailwind-reference';
 import { viteVxeTableImportsPlugin } from './vxe-table';
 
 /**
@@ -60,6 +64,8 @@ async function loadCommonPlugins(
           },
         }),
         viteVueJsx(),
+        viteTailwindReferencePlugin(),
+        tailwindcss(),
       ],
     },
 
@@ -73,11 +79,13 @@ async function loadCommonPlugins(
     },
     {
       condition: isBuild && !!visualizer,
-      plugins: () => [<PluginOption>viteVisualizerPlugin({
+      plugins: () => [
+        viteVisualizerPlugin({
           filename: './node_modules/.cache/visualizer/stats.html',
           gzipSize: true,
           open: true,
-        })],
+        }) as PluginOption,
+      ],
     },
   ];
 }
@@ -99,6 +107,7 @@ async function loadApplicationPlugins(
     compressTypes,
     extraAppConfig,
     html,
+    dayjs,
     i18n,
     importmap,
     importmapOptions,
@@ -136,6 +145,10 @@ async function loadApplicationPlugins(
         return [await vitePrintPlugin({ infoMap: printInfoMap })];
       },
     },
+    {
+      condition: !isBuild,
+      plugins: () => [viteFormFieldSlotMigrationWarningPlugin()],
+    },
     {
       condition: vxeTableLazyImport,
       plugins: async () => {
@@ -193,7 +206,7 @@ async function loadApplicationPlugins(
     },
     {
       condition: !!html,
-      plugins: () => [viteHtmlPlugin({ minify: true })],
+      plugins: () => [viteHtmlPlugin(typeof html === 'object' ? html : {})],
     },
     {
       condition: isBuild && importmap,
@@ -213,6 +226,10 @@ async function loadApplicationPlugins(
         return [await viteArchiverPlugin(archiverPluginOptions)];
       },
     },
+    {
+      condition: dayjs,
+      plugins: () => [viteDayjsPlugin()],
+    },
   ]);
 }
 
@@ -225,21 +242,25 @@ async function loadLibraryPlugins(
   // 单独取，否则commonOptions拿不到
   const isBuild = options.isBuild;
   const { dts, ...commonOptions } = options;
+  const dtsOptions = typeof dts === 'object' ? dts : undefined;
   const commonPlugins = await loadCommonPlugins(commonOptions);
   return await loadConditionPlugins([
     ...commonPlugins,
     {
       condition: isBuild && !!dts,
-      plugins: () => [viteDtsPlugin({ logLevel: 'error' })],
+      plugins: () => [viteDtsPlugin(dtsOptions)],
     },
   ]);
 }
 
+export { viteCssLayerPlugin } from './css-layer';
+
 export {
   loadApplicationPlugins,
   loadLibraryPlugins,
   viteArchiverPlugin,
   viteCompressPlugin,
+  viteDayjsPlugin,
   viteDtsPlugin,
   viteHtmlPlugin,
   viteVisualizerPlugin,
diff --git a/internal/vite-config/src/plugins/inject-app-loading/default-loading-antd.html b/internal/vite-config/src/plugins/inject-app-loading/default-loading-antd.html
index 20a21fb7..4908af6f 100644
--- a/internal/vite-config/src/plugins/inject-app-loading/default-loading-antd.html
+++ b/internal/vite-config/src/plugins/inject-app-loading/default-loading-antd.html
@@ -103,5 +103,5 @@
 </style>
 <div class="loading" id="__app-loading__">
   <span class="dot"><i></i><i></i><i></i><i></i></span>
-  <div class="title"><%= VITE_APP_TITLE %></div>
+  <div class="title">%VITE_APP_TITLE%</div>
 </div>
diff --git a/internal/vite-config/src/plugins/inject-app-loading/default-loading.html b/internal/vite-config/src/plugins/inject-app-loading/default-loading.html
index 28957058..e49ca55b 100644
--- a/internal/vite-config/src/plugins/inject-app-loading/default-loading.html
+++ b/internal/vite-config/src/plugins/inject-app-loading/default-loading.html
@@ -22,8 +22,8 @@
   }
 
   .loading.hidden {
-    pointer-events: none;
     visibility: hidden;
+    pointer-events: none;
     opacity: 0;
     transition: all 0.8s ease-out;
   }
@@ -109,5 +109,5 @@
 </style>
 <div class="loading" id="__app-loading__">
   <div class="loader"></div>
-  <div class="title"><%= VITE_APP_TITLE %></div>
+  <div class="title">%VITE_APP_TITLE%</div>
 </div>
diff --git a/internal/vite-config/src/plugins/inject-app-loading/index.ts b/internal/vite-config/src/plugins/inject-app-loading/index.ts
index 9f6e2a5c..c6a79830 100644
--- a/internal/vite-config/src/plugins/inject-app-loading/index.ts
+++ b/internal/vite-config/src/plugins/inject-app-loading/index.ts
@@ -1,3 +1,5 @@
+import type { PluginOption } from 'vite';
+
 import fs from 'node:fs';
 import fsp from 'node:fs/promises';
 import { join } from 'node:path';
@@ -5,8 +7,6 @@ import { fileURLToPath } from 'node:url';
 
 import { readPackageJSON } from '@vben/node-utils';
 
-import { type PluginOption } from 'vite';
-
 /**
  * 用于生成将loading样式注入到项目中
  * 为多app提供loading样式，无需在每个 app -> index.html单独引入
diff --git a/internal/vite-config/src/plugins/license.ts b/internal/vite-config/src/plugins/license.ts
index 81fc4ff0..7733288b 100644
--- a/internal/vite-config/src/plugins/license.ts
+++ b/internal/vite-config/src/plugins/license.ts
@@ -1,8 +1,3 @@
-import type {
-  NormalizedOutputOptions,
-  OutputBundle,
-  OutputChunk,
-} from 'rollup';
 import type { PluginOption } from 'vite';
 
 import { EOL } from 'node:os';
@@ -13,7 +8,6 @@ import { dateUtil, readPackageJSON } from '@vben/node-utils';
  * 用于注入版权信息
  * @returns
  */
-
 async function viteLicensePlugin(
   root = process.cwd(),
 ): Promise<PluginOption | undefined> {
@@ -27,7 +21,7 @@ async function viteLicensePlugin(
     apply: 'build',
     enforce: 'post',
     generateBundle: {
-      handler: (_options: NormalizedOutputOptions, bundle: OutputBundle) => {
+      handler(_options, bundle) {
         const date = dateUtil().format('YYYY-MM-DD ');
         const copyrightText = `/*!
   * Vben Admin
@@ -44,13 +38,11 @@ async function viteLicensePlugin(
 
         for (const [, fileContent] of Object.entries(bundle)) {
           if (fileContent.type === 'chunk' && fileContent.isEntry) {
-            const chunkContent = fileContent as OutputChunk;
             // 插入版权信息
-            const content = chunkContent.code;
+            const content = fileContent.code;
             const updatedContent = `${copyrightText}${EOL}${content}`;
-
             // 更新bundle
-            (fileContent as OutputChunk).code = updatedContent;
+            fileContent.code = updatedContent;
           }
         }
       },
diff --git a/internal/vite-config/src/plugins/tailwind-reference.ts b/internal/vite-config/src/plugins/tailwind-reference.ts
new file mode 100644
index 00000000..86460494
--- /dev/null
+++ b/internal/vite-config/src/plugins/tailwind-reference.ts
@@ -0,0 +1,40 @@
+import type { Plugin } from 'vite';
+
+const REFERENCE_LINE = '@reference "@vben/tailwind-config/theme";\n';
+
+/**
+ * Auto-inject @reference into Vue SFC <style> blocks that use @apply.
+ *
+ * In Tailwind CSS v4, each Vue SFC <style scoped> block is processed as an
+ * independent CSS module. If a style block uses @apply with custom theme
+ * utilities (e.g. bg-primary, text-foreground), it needs access to the
+ * @theme definition via @reference. This plugin auto-injects it so
+ * individual components don't need to add it manually.
+ */
+export function viteTailwindReferencePlugin(): Plugin {
+  return {
+    enforce: 'pre',
+    name: 'vite:tailwind-reference',
+    transform(code, id) {
+      // Only process Vue SFC style blocks
+      if (!id.includes('.vue')) {
+        return null;
+      }
+      if (!id.includes('type=style')) {
+        return null;
+      }
+      // Skip if already has @reference
+      if (code.includes('@reference')) {
+        return null;
+      }
+      // Only inject if the style block uses @apply
+      if (!code.includes('@apply')) {
+        return null;
+      }
+      return {
+        code: REFERENCE_LINE + code,
+        map: null,
+      };
+    },
+  };
+}
diff --git a/internal/vite-config/src/typing.ts b/internal/vite-config/src/typing.ts
index 31683cc7..a04d0745 100644
--- a/internal/vite-config/src/typing.ts
+++ b/internal/vite-config/src/typing.ts
@@ -1,153 +1,351 @@
+import type { Options as HtmlMinifierOptions } from 'html-minifier-terser';
 import type { PluginVisualizerOptions } from 'rollup-plugin-visualizer';
-import type { ConfigEnv, PluginOption, UserConfig } from 'vite';
-import type { PluginOptions } from 'vite-plugin-dts';
+import type { PluginOptions } from 'unplugin-dts';
+import type {
+  ConfigEnv,
+  PluginOption,
+  UserConfig,
+  UserConfigFnPromise,
+} from 'vite';
 import type { Options as PwaPluginOptions } from 'vite-plugin-pwa';
 
+/**
+ * ImportMap 配置接口
+ * @description 用于配置模块导入映射，支持自定义导入路径和范围
+ * @example
+ * ```typescript
+ * {
+ *   imports: {
+ *     'vue': 'https://unpkg.com/vue@3.2.47/dist/vue.esm-browser.js'
+ *   },
+ *   scopes: {
+ *     'https://site.com/': {
+ *       'vue': 'https://unpkg.com/vue@3.2.47/dist/vue.esm-browser.js'
+ *     }
+ *   }
+ * }
+ * ```
+ */
 interface IImportMap {
+  /** 模块导入映射 */
   imports?: Record<string, string>;
+  /** 作用域特定的导入映射 */
   scopes?: {
     [scope: string]: Record<string, string>;
   };
 }
+
+/**
+ * 打印插件配置选项
+ * @description 用于配置控制台打印信息
+ */
 interface PrintPluginOptions {
   /**
-   * 打印的数据
+   * 打印的数据映射
+   * @description 键值对形式的数据，将在控制台打印
+   * @example
+   * ```typescript
+   * {
+   *   'App Version': '1.0.0',
+   *   'Build Time': '2024-01-01'
+   * }
+   * ```
    */
   infoMap?: Record<string, string | undefined>;
 }
 
+/**
+ * Nitro Mock 插件配置选项
+ * @description 用于配置 Nitro Mock 服务器的行为
+ */
 interface NitroMockPluginOptions {
   /**
-   * mock server 包名
+   * Mock 服务器包名
+   * @default '@vbenjs/nitro-mock'
    */
   mockServerPackage?: string;
 
   /**
-   * mock 服务端口
+   * Mock 服务端口
+   * @default 3000
    */
   port?: number;
 
   /**
-   * mock 日志是否打印
+   * 是否打印 Mock 日志
+   * @default false
    */
   verbose?: boolean;
 }
 
+/**
+ * 归档插件配置选项
+ * @description 用于配置构建产物的压缩归档
+ */
 interface ArchiverPluginOptions {
   /**
    * 输出文件名
-   * @default dist
+   * @default 'dist'
    */
   name?: string;
   /**
    * 输出目录
-   * @default .
+   * @default '.'
    */
   outputDir?: string;
 }
 
 /**
- * importmap 插件配置
+ * HTML 插件配置
+ * @description 用于配置基于 transformIndexHtml 的 HTML 压缩行为
+ */
+type HtmlPluginOptions = HtmlMinifierOptions;
+
+/**
+ * ImportMap 插件配置
+ * @description 用于配置模块的 CDN 导入
  */
 interface ImportmapPluginOptions {
   /**
    * CDN 供应商
-   * @default jspm.io
+   * @default 'jspm.io'
+   * @description 支持 esm.sh 和 jspm.io 两种 CDN 供应商
    */
   defaultProvider?: 'esm.sh' | 'jspm.io';
-  /** importmap 配置 */
+  /**
+   * ImportMap 配置数组
+   * @description 配置需要从 CDN 导入的包
+   * @example
+   * ```typescript
+   * [
+   *   { name: 'vue' },
+   *   { name: 'pinia', range: '^2.0.0' }
+   * ]
+   * ```
+   */
   importmap?: Array<{ name: string; range?: string }>;
-  /** 手动配置importmap */
+  /**
+   * 手动配置 ImportMap
+   * @description 自定义 ImportMap 配置
+   */
   inputMap?: IImportMap;
 }
 
 /**
- * 用于判断是否需要加载插件
+ * 条件插件配置
+ * @description 用于根据条件动态加载插件
  */
 interface ConditionPlugin {
-  // 判断条件
+  /**
+   * 判断条件
+   * @description 当条件为 true 时加载插件
+   */
   condition?: boolean;
-  // 插件对象
+  /**
+   * 插件对象
+   * @description 返回插件数组或 Promise
+   */
   plugins: () => PluginOption[] | PromiseLike<PluginOption[]>;
 }
 
+/**
+ * 通用插件配置选项
+ * @description 所有插件共用的基础配置
+ */
 interface CommonPluginOptions {
-  /** 是否开启devtools */
+  /**
+   * 是否开启开发工具
+   * @default false
+   */
   devtools?: boolean;
-  /** 环境变量 */
+  /**
+   * 环境变量
+   * @description 自定义环境变量
+   */
   env?: Record<string, any>;
-  /** 是否注入metadata */
+  /**
+   * 是否注入元数据
+   * @default true
+   */
   injectMetadata?: boolean;
-  /** 是否构建模式 */
+  /**
+   * 是否为构建模式
+   * @default false
+   */
   isBuild?: boolean;
-  /** 构建模式 */
+  /**
+   * 构建模式
+   * @default 'development'
+   */
   mode?: string;
-  /** 开启依赖分析 */
+  /**
+   * 是否开启依赖分析
+   * @default false
+   * @description 使用 rollup-plugin-visualizer 分析依赖
+   */
   visualizer?: boolean | PluginVisualizerOptions;
 }
 
+/**
+ * 应用插件配置选项
+ * @description 用于配置应用构建时的插件选项
+ */
 interface ApplicationPluginOptions extends CommonPluginOptions {
-  /** 开启后，会在打包dist同级生成dist.zip */
+  /**
+   * 是否开启压缩归档
+   * @default false
+   * @description 开启后会在打包目录生成 zip 文件
+   */
   archiver?: boolean;
-  /** 压缩归档插件配置 */
+  /**
+   * 压缩归档插件配置
+   * @description 配置压缩归档的行为
+   */
   archiverPluginOptions?: ArchiverPluginOptions;
-  /** 开启 gzip|brotli 压缩 */
+  /**
+   * 是否开启压缩
+   * @default false
+   * @description 支持 gzip 和 brotli 压缩
+   */
   compress?: boolean;
-  /** 压缩类型 */
+  /**
+   * 压缩类型
+   * @default ['gzip']
+   * @description 可选的压缩类型
+   */
   compressTypes?: ('brotli' | 'gzip')[];
-  /** 在构建的时候抽离配置文件 */
+  /**
+   * 是否开启 dayjs 插件
+   * @default true
+   */
+  dayjs?: boolean;
+  /**
+   * 是否抽离配置文件
+   * @default false
+   * @description 在构建时抽离配置文件
+   */
   extraAppConfig?: boolean;
-  /** 是否开启html插件  */
-  html?: boolean;
-  /** 是否开启i18n */
+  /**
+   * 是否开启 HTML 插件
+   * @default true
+   */
+  html?: boolean | HtmlPluginOptions;
+  /**
+   * 是否开启国际化
+   * @default false
+   */
   i18n?: boolean;
-  /** 是否开启 importmap CDN  */
+  /**
+   * 是否开启 ImportMap CDN
+   * @default false
+   */
   importmap?: boolean;
-  /** importmap 插件配置 */
+  /**
+   * ImportMap 插件配置
+   */
   importmapOptions?: ImportmapPluginOptions;
-  /** 是否注入app loading */
+  /**
+   * 是否注入应用加载动画
+   * @default true
+   */
   injectAppLoading?: boolean;
-  /** 是否注入全局scss */
+  /**
+   * 是否注入全局 SCSS
+   * @default true
+   */
   injectGlobalScss?: boolean;
-  /** 是否注入版权信息 */
+  /**
+   * 是否注入版权信息
+   * @default true
+   */
   license?: boolean;
-  /** 是否开启nitro mock */
+  /**
+   * 是否开启 Nitro Mock
+   * @default false
+   */
   nitroMock?: boolean;
-  /** nitro mock 插件配置 */
+  /**
+   * Nitro Mock 插件配置
+   */
   nitroMockOptions?: NitroMockPluginOptions;
-  /** 开启控制台自定义打印 */
+  /**
+   * 是否开启控制台打印
+   * @default false
+   */
   print?: boolean;
-  /** 打印插件配置 */
+  /**
+   * 打印插件配置
+   */
   printInfoMap?: PrintPluginOptions['infoMap'];
-  /** 是否开启pwa */
+  /**
+   * 是否开启 PWA
+   * @default false
+   */
   pwa?: boolean;
-  /** pwa 插件配置 */
+  /**
+   * PWA 插件配置
+   */
   pwaOptions?: Partial<PwaPluginOptions>;
-  /** 是否开启vxe-table懒加载 */
+  /**
+   * 是否开启 VXE Table 懒加载
+   * @default false
+   */
   vxeTableLazyImport?: boolean;
 }
 
+/**
+ * 库插件配置选项
+ * @description 用于配置库构建时的插件选项
+ */
 interface LibraryPluginOptions extends CommonPluginOptions {
-  /** 开启 dts 输出 */
+  /**
+   * 是否开启 DTS 输出
+   * @default true
+   * @description 生成 TypeScript 类型声明文件
+   */
   dts?: boolean | PluginOptions;
 }
 
+/**
+ * 应用配置选项类型
+ */
 type ApplicationOptions = ApplicationPluginOptions;
 
+/**
+ * 库配置选项类型
+ */
 type LibraryOptions = LibraryPluginOptions;
 
+/**
+ * 应用配置定义函数类型
+ * @description 用于定义应用构建配置
+ */
 type DefineApplicationOptions = (config?: ConfigEnv) => Promise<{
+  /** 应用插件配置 */
   application?: ApplicationOptions;
+  /** Vite 配置 */
   vite?: UserConfig;
 }>;
 
+/**
+ * 库配置定义函数类型
+ * @description 用于定义库构建配置
+ */
 type DefineLibraryOptions = (config?: ConfigEnv) => Promise<{
+  /** 库插件配置 */
   library?: LibraryOptions;
+  /** Vite 配置 */
   vite?: UserConfig;
 }>;
 
+/**
+ * 配置定义类型
+ * @description 应用或库的配置定义
+ */
 type DefineConfig = DefineApplicationOptions | DefineLibraryOptions;
 
+type VbenViteConfig = Promise<UserConfig> | UserConfig | UserConfigFnPromise;
+
 export type {
   ApplicationPluginOptions,
   ArchiverPluginOptions,
@@ -156,9 +354,11 @@ export type {
   DefineApplicationOptions,
   DefineConfig,
   DefineLibraryOptions,
+  HtmlPluginOptions,
   IImportMap,
   ImportmapPluginOptions,
   LibraryPluginOptions,
   NitroMockPluginOptions,
   PrintPluginOptions,
+  VbenViteConfig,
 };
diff --git a/internal/vite-config/src/utils/env.ts b/internal/vite-config/src/utils/env.ts
index 3a042fe8..f3422161 100644
--- a/internal/vite-config/src/utils/env.ts
+++ b/internal/vite-config/src/utils/env.ts
@@ -67,11 +67,11 @@ async function loadAndConvertEnv(
   match = 'VITE_',
   confFiles = getConfFiles(),
 ): Promise<
-  {
+  Partial<ApplicationPluginOptions> & {
     appTitle: string;
     base: string;
     port: number;
-  } & Partial<ApplicationPluginOptions>
+  }
 > {
   const envConfig = await loadEnv(match, confFiles);
 
diff --git a/internal/vite-config/tsconfig.json b/internal/vite-config/tsconfig.json
index b2ec3b61..379af182 100644
--- a/internal/vite-config/tsconfig.json
+++ b/internal/vite-config/tsconfig.json
@@ -1,6 +1,6 @@
 {
   "$schema": "https://json.schemastore.org/tsconfig",
   "extends": "@vben/tsconfig/node.json",
-  "include": ["src"],
+  "include": ["src", "tsdown.config.ts"],
   "exclude": ["node_modules"]
 }
diff --git a/internal/vite-config/tsdown.config.ts b/internal/vite-config/tsdown.config.ts
new file mode 100644
index 00000000..de7727b0
--- /dev/null
+++ b/internal/vite-config/tsdown.config.ts
@@ -0,0 +1,41 @@
+import { cp, mkdir } from 'node:fs/promises';
+import { dirname, join } from 'node:path';
+import { fileURLToPath } from 'node:url';
+
+import { defineConfig } from 'tsdown';
+
+const rootDir = dirname(fileURLToPath(import.meta.url));
+const loadingAssets = ['default-loading-antd.html', 'default-loading.html'];
+
+export default defineConfig({
+  clean: true,
+  deps: {
+    neverBundle: ['@vben/node-utils'],
+    skipNodeModulesBundle: true,
+  },
+  dts: {
+    resolver: 'tsc',
+  },
+  entry: ['src/index.ts'],
+  format: ['esm'],
+  hooks: {
+    'build:done': async (context) => {
+      const outDir = context.options.outDir;
+      if (!outDir) {
+        return;
+      }
+
+      await mkdir(outDir, { recursive: true });
+
+      for (const file of loadingAssets) {
+        await cp(
+          join(rootDir, 'src/plugins/inject-app-loading', file),
+          join(outDir, file),
+        );
+      }
+    },
+  },
+  outExtensions: () => ({
+    dts: '.d.ts',
+  }),
+});
diff --git a/lefthook.yml b/lefthook.yml
new file mode 100644
index 00000000..14b58220
--- /dev/null
+++ b/lefthook.yml
@@ -0,0 +1,75 @@
+# EXAMPLE USAGE:
+#
+#   Refer for explanation to following link:
+#   https://lefthook.dev/configuration/
+#
+# pre-push:
+#   jobs:
+#     - name: packages audit
+#       tags:
+#         - frontend
+#         - security
+#       run: yarn audit
+#
+#     - name: gems audit
+#       tags:
+#         - backend
+#         - security
+#       run: bundle audit
+#
+# pre-commit:
+#   parallel: true
+#   jobs:
+#     - run: yarn eslint {staged_files}
+#       glob: "*.{js,ts,jsx,tsx}"
+#
+#     - name: rubocop
+#       glob: "*.rb"
+#       exclude:
+#         - config/application.rb
+#         - config/routes.rb
+#       run: bundle exec rubocop --force-exclusion {all_files}
+#
+#     - name: govet
+#       files: git ls-files -m
+#       glob: "*.go"
+#       run: go vet {files}
+#
+#     - script: "hello.js"
+#       runner: node
+#
+#     - script: "hello.go"
+#       runner: go run
+
+pre-commit:
+  # 串行执行（不设 parallel），避免与 check:type 同时运行导致低配机内存/CPU 瞬时飙升。
+  # lint 仅检查暂存文件并自动修复后回填，大幅降低负载；check:type 仍需全量。
+  jobs:
+    - name: oxlint
+      glob: '*.{js,jsx,ts,tsx,vue,cjs,mjs,cts,mts}'
+      run: pnpm exec oxlint --fix --type-aware --threads=4 --no-error-on-unmatched-pattern {staged_files}
+      stage_fixed: true
+    - name: oxfmt
+      glob: '*.{js,jsx,ts,tsx,vue,cjs,mjs,cts,mts,json,jsonc}'
+      run: pnpm exec oxfmt --threads=4 --no-error-on-unmatched-pattern {staged_files}
+      stage_fixed: true
+    - name: eslint
+      glob: '*.{js,jsx,ts,tsx,vue,cjs,mjs,cts,mts}'
+      run: pnpm exec eslint --fix {staged_files}
+      stage_fixed: true
+    - name: stylelint
+      glob: '*.{vue,css,less,scss}'
+      run: pnpm exec stylelint --fix {staged_files}
+      stage_fixed: true
+    - name: checkType
+      run: pnpm check:type
+
+post-merge:
+  commands:
+    install:
+      run: pnpm install
+
+commit-msg:
+  commands:
+    commitlint:
+      run: pnpm exec commitlint --edit $1
diff --git a/oxfmt.config.ts b/oxfmt.config.ts
new file mode 100644
index 00000000..9ad7fe1b
--- /dev/null
+++ b/oxfmt.config.ts
@@ -0,0 +1,26 @@
+import { defineConfig } from '@vben/oxfmt-config';
+
+export default defineConfig({
+  ignorePatterns: [
+    'dist',
+    'dev-dist',
+    '.local',
+    '.claude',
+    '.agent',
+    '.agents',
+    '.codex',
+    '.output.js',
+    'node_modules',
+    '.nvmrc',
+    'coverage',
+    'CODEOWNERS',
+    '.nitro',
+    '.output',
+    '**/*.svg',
+    '**/*.sh',
+    'public',
+    '.npmrc',
+    '*-lock.yaml',
+    'skills-lock.json',
+  ],
+});
diff --git a/oxlint.config.ts b/oxlint.config.ts
new file mode 100644
index 00000000..230ddd98
--- /dev/null
+++ b/oxlint.config.ts
@@ -0,0 +1,5 @@
+import { oxlintConfig } from '@vben/oxlint-config';
+
+import { defineConfig } from 'oxlint';
+
+export default defineConfig(oxlintConfig);
diff --git a/package.json b/package.json
index a714a6ee..96130a10 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "vben-admin-monorepo",
-  "version": "5.5.1",
+  "version": "5.7.0",
   "private": true,
   "keywords": [
     "monorepo",
@@ -25,40 +25,61 @@
   },
   "type": "module",
   "scripts": {
+    "bootstrap": "pnpm install",
     "build": "cross-env NODE_OPTIONS=--max-old-space-size=8192 turbo build",
     "build:analyze": "turbo build:analyze",
     "build:antd": "pnpm run build --filter=@vben/web-antd",
+    "build:desktop": "pnpm run build --filter=@vben/desktop && pnpm -F @vben/desktop run pack",
+    "build:docker": "./scripts/deploy/build-local-docker-image.sh",
+    "build:docs": "pnpm run build --filter=@vben/docs",
+    "build:ele": "pnpm run build --filter=@vben/web-ele",
+    "build:naive": "pnpm run build --filter=@vben/web-naive",
+    "build:tdesign": "pnpm run build --filter=@vben/web-tdesign",
+    "build:play": "pnpm run build --filter=@vben/playground",
     "changeset": "pnpm exec changeset",
     "check": "pnpm run check:circular && pnpm run check:dep && pnpm run check:type && pnpm check:cspell",
     "check:circular": "vsh check-circular",
-    "check:cspell": "cspell lint **/*.ts **/README.md .changeset/*.md --no-progress",
+    "check:cspell": "cspell lint \"**/*.ts\" \"**/README.md\" \".changeset/*.md\" --no-progress",
     "check:dep": "vsh check-dep",
     "check:type": "turbo run typecheck",
     "clean": "node ./scripts/clean.mjs",
     "commit": "czg",
     "dev": "pnpm -F @vben/web-antd run dev",
+    "dev:antd": "pnpm -F @vben/web-antd run dev",
+    "dev:desktop": "turbo run dev --filter=@vben/web-antd --filter=@vben/desktop",
+    "dev:antdv-next": "pnpm -F @vben/web-antdv-next run dev",
+    "dev:docs": "pnpm -F @vben/docs run dev",
+    "dev:ele": "pnpm -F @vben/web-ele run dev",
+    "dev:naive": "pnpm -F @vben/web-naive run dev",
+    "dev:tdesign": "pnpm -F @vben/web-tdesign run dev",
     "dev:play": "pnpm -F @vben/playground run dev",
     "format": "vsh lint --format",
     "lint": "vsh lint",
-    "postinstall": "pnpm -r run stub --if-present",
+    "postinstall": "pnpm -r run --if-present stub",
     "preinstall": "npx only-allow pnpm",
-    "prepare": "is-ci || husky",
+    "prepare": "is-ci || pnpm exec lefthook install",
     "preview": "turbo-run preview",
     "publint": "vsh publint",
-    "reinstall": "pnpm clean --del-lock && pnpm install",
+    "reinstall": "pnpm run clean -- --del-lock && pnpm install",
+    "test:benchmark": "vitest bench --run",
     "test:unit": "vitest run --dom",
     "test:e2e": "turbo run test:e2e",
     "update:deps": "npx taze -r -w",
-    "version": "pnpm exec changeset version && pnpm install --no-frozen-lockfile"
+    "version": "pnpm exec changeset version && pnpm install --no-frozen-lockfile",
+    "catalog": "pnpm dlx codemod pnpm/catalog"
+  },
+  "dependencies": {
+    "sortablejs": "catalog:"
   },
   "devDependencies": {
     "@changesets/changelog-github": "catalog:",
     "@changesets/cli": "catalog:",
-    "@playwright/test": "catalog:",
+    "@tsdown/css": "catalog:",
     "@types/node": "catalog:",
     "@vben/commitlint-config": "workspace:*",
     "@vben/eslint-config": "workspace:*",
-    "@vben/prettier-config": "workspace:*",
+    "@vben/oxfmt-config": "workspace:*",
+    "@vben/oxlint-config": "workspace:*",
     "@vben/stylelint-config": "workspace:*",
     "@vben/tailwind-config": "workspace:*",
     "@vben/tsconfig": "workspace:*",
@@ -71,13 +92,18 @@
     "autoprefixer": "catalog:",
     "cross-env": "catalog:",
     "cspell": "catalog:",
+    "eslint": "catalog:",
     "happy-dom": "catalog:",
     "husky": "catalog:",
     "is-ci": "catalog:",
-    "lint-staged": "catalog:",
+    "lefthook": "catalog:",
+    "oxfmt": "catalog:",
+    "oxlint": "catalog:",
+    "oxlint-tsgolint": "catalog:",
     "playwright": "catalog:",
     "rimraf": "catalog:",
     "tailwindcss": "catalog:",
+    "tsdown": "catalog:",
     "turbo": "catalog:",
     "typescript": "catalog:",
     "unbuild": "catalog:",
@@ -90,35 +116,5 @@
     "node": ">=20.10.0",
     "pnpm": ">=9.12.0"
   },
-  "packageManager": "pnpm@10.2.0",
-  "pnpm": {
-    "peerDependencyRules": {
-      "allowedVersions": {
-        "eslint": "*"
-      }
-    },
-    "overrides": {
-      "@ast-grep/napi": "catalog:",
-      "@ctrl/tinycolor": "catalog:",
-      "clsx": "catalog:",
-      "esbuild": "0.24.0",
-      "pinia": "catalog:",
-      "vue": "catalog:"
-    },
-    "neverBuiltDependencies": [
-      "canvas",
-      "node-gyp"
-    ]
-  },
-  "dependencies": {
-    "@fortawesome/fontawesome-free": "^6.7.2",
-    "@vueup/vue-quill": "^1.2.0",
-    "axios": "^1.10.0",
-    "html2canvas": "^1.4.1",
-    "js-base64": "^3.7.7",
-    "lodash-es": "^4.17.21",
-    "lucide-vue-next": "^0.487.0",
-    "md-editor-v3": "^5.4.5",
-    "xgplayer": "^3.0.24"
-  }
+  "packageManager": "pnpm@11.16.0"
 }
diff --git a/packages/@core/base/design/package.json b/packages/@core/base/design/package.json
index 7b46ddd7..0709849e 100644
--- a/packages/@core/base/design/package.json
+++ b/packages/@core/base/design/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vben-core/design",
-  "version": "5.5.1",
+  "version": "5.7.0",
   "homepage": "https://github.com/vbenjs/vue-vben-admin",
   "bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
   "repository": {
@@ -23,11 +23,16 @@
   "exports": {
     "./bem": {
       "development": "./src/scss-bem/bem.scss",
+      "production": "./src/scss-bem/bem.scss",
       "default": "./dist/bem.scss"
     },
+    "./theme": {
+      "default": "./src/css/global.css"
+    },
     ".": {
       "types": "./src/index.ts",
       "development": "./src/index.ts",
+      "production": "./src/index.ts",
       "default": "./dist/design.css"
     }
   },
@@ -37,5 +42,8 @@
         "default": "./dist/index.mjs"
       }
     }
+  },
+  "dependencies": {
+    "@iconify/json": "catalog:"
   }
 }
diff --git a/packages/@core/base/design/src/css/global.css b/packages/@core/base/design/src/css/global.css
index d1999098..29819410 100644
--- a/packages/@core/base/design/src/css/global.css
+++ b/packages/@core/base/design/src/css/global.css
@@ -1,160 +1 @@
-@tailwind base;
-@tailwind components;
-@tailwind utilities;
-
-@layer base {
-  *,
-  ::after,
-  ::before {
-    @apply border-border;
-
-    box-sizing: border-box;
-    border-style: solid;
-    border-width: 0;
-  }
-
-  html {
-    @apply text-foreground bg-background font-sans text-[100%];
-
-    font-variation-settings: normal;
-    line-height: 1.15;
-    text-size-adjust: 100%;
-    font-synthesis-weight: none;
-    scroll-behavior: smooth;
-    text-rendering: optimizelegibility;
-    -webkit-tap-highlight-color: transparent;
-
-    /* -webkit-font-smoothing: antialiased;
-    -moz-osx-font-smoothing: grayscale; */
-  }
-
-  #app,
-  body,
-  html {
-    @apply size-full;
-
-    /* scrollbar-gutter: stable; */
-  }
-
-  body {
-    min-height: 100vh;
-
-    /* pointer-events: auto !important; */
-
-    /* overflow: overlay; */
-
-    /* -webkit-font-smoothing: antialiased; */
-
-    /* -moz-osx-font-smoothing: grayscale; */
-  }
-
-  a,
-  a:active,
-  a:hover,
-  a:link,
-  a:visited {
-    @apply no-underline;
-  }
-
-  ::view-transition-new(root),
-  ::view-transition-old(root) {
-    @apply animate-none mix-blend-normal;
-  }
-
-  ::view-transition-old(root) {
-    @apply z-[1];
-  }
-
-  ::view-transition-new(root) {
-    @apply z-[2147483646];
-  }
-
-  html.dark::view-transition-old(root) {
-    @apply z-[2147483646];
-  }
-
-  html.dark::view-transition-new(root) {
-    @apply z-[1];
-  }
-
-  input::placeholder,
-  textarea::placeholder {
-    @apply opacity-100;
-  }
-
-  /* input:-webkit-autofill {
-    @apply border-none;
-
-    box-shadow: 0 0 0 1000px transparent inset;
-  } */
-
-  input[type='number']::-webkit-inner-spin-button,
-  input[type='number']::-webkit-outer-spin-button {
-    @apply m-0 appearance-none;
-  }
-
-  /* 只有非mac下才进行调整，mac下使用默认滚动条 */
-  html:not([data-platform='macOs']) {
-    ::-webkit-scrollbar {
-      @apply h-[10px] w-[10px];
-    }
-
-    ::-webkit-scrollbar-thumb {
-      @apply bg-border rounded-sm border-none;
-    }
-
-    ::-webkit-scrollbar-track {
-      @apply rounded-sm border-none bg-transparent shadow-none;
-    }
-
-    ::-webkit-scrollbar-button {
-      @apply hidden;
-    }
-  }
-}
-
-@layer components {
-  .flex-center {
-    @apply flex items-center justify-center;
-  }
-
-  .flex-col-center {
-    @apply flex flex-col items-center justify-center;
-  }
-
-  .outline-box {
-    @apply outline-border relative cursor-pointer rounded-md p-1 outline outline-1;
-  }
-
-  .outline-box::after {
-    @apply absolute left-1/2 top-1/2 z-20 h-0 w-[1px] rounded-sm opacity-0 outline outline-2 outline-transparent transition-all duration-300 content-[""];
-  }
-
-  .outline-box.outline-box-active {
-    @apply outline-primary outline outline-2;
-  }
-
-  .outline-box.outline-box-active::after {
-    display: none;
-  }
-
-  .outline-box:not(.outline-box-active):hover::after {
-    @apply outline-primary left-0 top-0 h-full w-full p-1 opacity-100;
-  }
-
-  .vben-link {
-    @apply text-primary hover:text-primary-hover active:text-primary-active cursor-pointer;
-  }
-
-  .card-box {
-    @apply bg-card text-card-foreground border-border rounded-xl border;
-  }
-}
-
-html.invert-mode {
-  @apply invert;
-}
-
-html.grayscale-mode {
-  @apply grayscale;
-}
+@import '@vben/tailwind-config/theme';
diff --git a/packages/@core/base/design/src/css/nprogress.css b/packages/@core/base/design/src/css/nprogress.css
index 3503dab2..0dd2288a 100644
--- a/packages/@core/base/design/src/css/nprogress.css
+++ b/packages/@core/base/design/src/css/nprogress.css
@@ -1,15 +1,17 @@
+@reference "@vben/tailwind-config/theme";
+
 /* Make clicks pass-through */
 #nprogress {
   @apply pointer-events-none;
 }
 
 #nprogress .bar {
-  @apply bg-primary fixed left-0 top-0 z-[1031] h-[2px] w-full;
+  @apply bg-primary fixed top-0 left-0 z-1031 h-0.5 w-full;
 }
 
 /* Fancy blur effect */
 #nprogress .peg {
-  @apply absolute right-0 block h-full w-[100px];
+  @apply absolute right-0 block h-full w-25;
 
   box-shadow:
     0 0 10px hsl(var(--primary)),
@@ -20,11 +22,11 @@
 
 /* Remove these to get rid of the spinner */
 #nprogress .spinner {
-  @apply fixed right-4 top-4 z-[1031] block;
+  @apply fixed top-4 right-4 z-1031 block;
 }
 
 #nprogress .spinner-icon {
-  @apply border-t-primary border-l-primary size-4 rounded-full border-[2px] border-solid border-transparent;
+  @apply border-t-primary border-l-primary size-4 rounded-full border-2 border-solid border-transparent;
 
   animation: nprogress-spinner 400ms linear infinite;
 }
diff --git a/packages/@core/base/design/src/css/transition.css b/packages/@core/base/design/src/css/transition.css
index c1cb0e48..77ae0bd7 100644
--- a/packages/@core/base/design/src/css/transition.css
+++ b/packages/@core/base/design/src/css/transition.css
@@ -80,7 +80,9 @@
 
 .fade-slide-leave-active,
 .fade-slide-enter-active {
-  transition: all 0.3s;
+  transition:
+    opacity 0.3s,
+    transform 0.3s;
 }
 
 .fade-slide-enter-from {
diff --git a/packages/@core/base/design/src/css/ui.css b/packages/@core/base/design/src/css/ui.css
index 3a002f2a..a1bf0242 100644
--- a/packages/@core/base/design/src/css/ui.css
+++ b/packages/@core/base/design/src/css/ui.css
@@ -1,5 +1,5 @@
 .side-content {
-  animation-duration: 0.2s;
+  animation-duration: 0.3s;
   animation-timing-function: cubic-bezier(0.16, 1, 0.3, 1);
 }
 
@@ -37,7 +37,7 @@
 @keyframes slide-down {
   from {
     opacity: 0;
-    transform: translateY(-10px);
+    transform: translateY(50px);
   }
 
   to {
@@ -49,7 +49,7 @@
 @keyframes slide-left {
   from {
     opacity: 0;
-    transform: translateX(-10px);
+    transform: translateX(-50px);
   }
 
   to {
@@ -61,7 +61,7 @@
 @keyframes slide-right {
   from {
     opacity: 0;
-    transform: translateX(-10px);
+    transform: translateX(50px);
   }
 
   to {
@@ -73,7 +73,7 @@
 @keyframes slide-up {
   from {
     opacity: 0;
-    transform: translateY(10px);
+    transform: translateY(-50px);
   }
 
   to {
@@ -81,3 +81,21 @@
     transform: translateY(0);
   }
 }
+
+.z-popup {
+  z-index: var(--popup-z-index);
+}
+
+@keyframes shrink {
+  0% {
+    transform: scale(1);
+  }
+
+  50% {
+    transform: scale(0.9);
+  }
+
+  100% {
+    transform: scale(1);
+  }
+}
diff --git a/packages/@core/base/design/src/design-tokens/dark.css b/packages/@core/base/design/src/design-tokens/dark.css
index 2a1d052f..38810415 100644
--- a/packages/@core/base/design/src/design-tokens/dark.css
+++ b/packages/@core/base/design/src/design-tokens/dark.css
@@ -15,7 +15,11 @@
   --card-foreground: 210 40% 98%;
 
   /* Background color for popovers such as <DropdownMenu />, <HoverCard />, <Popover /> */
-  --popover: 222.82deg 8.43% 12.27%;
+
+  /* --popover: 222.82deg 8.43% 12.27%; */
+
+  /* 弹出层的背景色与主题区域背景色太过接近  */
+  --popover: 0 0% 14.2%;
   --popover-foreground: 210 40% 98%;
 
   /* Muted backgrounds such as <TabsList />, <Skeleton /> and <Switch /> */
diff --git a/packages/@core/base/design/src/design-tokens/default.css b/packages/@core/base/design/src/design-tokens/default.css
index c81ace7e..cf7dc28f 100644
--- a/packages/@core/base/design/src/design-tokens/default.css
+++ b/packages/@core/base/design/src/design-tokens/default.css
@@ -1,7 +1,10 @@
 :root {
-  --font-family: -apple-system, blinkmacsystemfont, 'Segoe UI', roboto,
-    'Helvetica Neue', arial, 'Noto Sans', sans-serif, 'Apple Color Emoji',
-    'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
+  /** 弹出层的基础层级 **/
+  --popup-z-index: 2000;
+  --font-family:
+    -apple-system, blinkmacsystemfont, 'Segoe UI', roboto, 'Helvetica Neue',
+    arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji',
+    'Segoe UI Symbol', 'Noto Color Emoji';
 
   /* Default background color of <body />...etc */
   --background: 0 0% 100%;
@@ -90,6 +93,7 @@
 
   /* 基本文字大小 */
   --font-size-base: 16px;
+  --menu-font-size: calc(var(--font-size-base) * 0.875);
 
   /* =============component & UI============= */
 
@@ -105,6 +109,90 @@
   color-scheme: light;
 }
 
+.light,
+.light[data-theme='custom'],
+.light[data-theme='default'] {
+  /* Default background color of <body />...etc */
+  --background: 0 0% 100%;
+
+  /* 主体区域背景色 */
+  --background-deep: 216 20.11% 95.47%;
+  --foreground: 210 6% 21%;
+
+  /* Background color for <Card /> */
+  --card: 0 0% 100%;
+  --card-foreground: 222.2 84% 4.9%;
+
+  /* Background color for popovers such as <DropdownMenu />, <HoverCard />, <Popover /> */
+  --popover: 0 0% 100%;
+  --popover-foreground: 222.2 84% 4.9%;
+
+  /* Muted backgrounds such as <TabsList />, <Skeleton /> and <Switch /> */
+  --muted: 240 4.8% 95.9%;
+  --muted-foreground: 240 3.8% 46.1%;
+
+  /* 主题颜色 */
+  --primary-foreground: 0 0% 98%;
+
+  /* Used for destructive actions such as <Button variant="destructive"> */
+  --destructive-foreground: 0 0% 98%;
+
+  /* Used for success actions such as <message> */
+  --info-foreground: 220, 4%, 58%;
+  --success-foreground: 0 0% 98%;
+
+  /* Used for warning actions such as <message> */
+  --warning-foreground: 0 0% 98%;
+
+  /* Secondary colors for <Button /> */
+  --secondary: 240 5% 96%;
+  --secondary-foreground: 240 6% 10%;
+
+  /* Used for accents such as hover effects on <DropdownMenuItem>, <SelectItem>...etc */
+  --accent: 240 5% 96%;
+  --accent-dark: 216 14% 93%;
+  --accent-darker: 216 11% 91%;
+  --accent-lighter: 240 0% 98%;
+  --accent-hover: 200deg 10% 90%;
+  --accent-foreground: 240 6% 10%;
+
+  /* Darker color */
+  --heavy: 192deg 9.43% 89.61%;
+  --heavy-foreground: var(--accent-foreground);
+
+  /* Default border color */
+  --border: 240 5.9% 90%;
+
+  /* Border color for inputs such as <Input />, <Select />, <Textarea /> */
+  --input: 240deg 5.88% 90%;
+  --input-placeholder: 217 10.6% 65%;
+  --input-background: 0 0% 100%;
+
+  /* Used for focus ring */
+  --ring: 222.2 84% 4.9%;
+
+  /* ============= custom ============= */
+
+  /* 遮罩颜色 */
+  --overlay: 0 0% 0% / 45%;
+  --overlay-content: 0 0% 95% / 45%;
+
+  /* =============component & UI============= */
+
+  /* menu */
+  --sidebar: 0 0% 100%;
+  --sidebar-deep: 0 0% 100%;
+  --menu: var(--sidebar);
+
+  /* header */
+  --header: 0 0% 100%;
+
+  accent-color: var(--primary);
+  color-scheme: light;
+}
+
+.light[data-theme='violet'],
+[data-theme='violet'] .light,
 [data-theme='violet'] {
   /* --background: 0 0% 100%; */
   --foreground: 224 71.4% 4.1%;
@@ -126,6 +214,8 @@
   --ring: 262.1 83.3% 57.8%;
 }
 
+.light[data-theme='pink'],
+[data-theme='pink'] .light,
 [data-theme='pink'] {
   /* --background: 0 0% 100%; */
   --foreground: 240 10% 3.9%;
@@ -147,6 +237,8 @@
   --ring: 346.8 77.2% 49.8%;
 }
 
+.light[data-theme='rose'],
+[data-theme='rose'] .light,
 [data-theme='rose'] {
   /* --background: 0 0% 100%; */
   --foreground: 240 10% 3.9%;
@@ -168,6 +260,8 @@
   --ring: 346.8 77.2% 49.8%;
 }
 
+.light[data-theme='sky-blue'],
+[data-theme='sky-blue'] .light,
 [data-theme='sky-blue'] {
   /* --background: 0 0% 100%; */
   --foreground: 222.2 84% 4.9%;
@@ -189,6 +283,8 @@
   --ring: 221.2 83.2% 53.3%;
 }
 
+.light[data-theme='deep-blue'],
+[data-theme='deep-blue'] .light,
 [data-theme='deep-blue'] {
   /* --background: 0 0% 100%; */
   --foreground: 222.2 84% 4.9%;
@@ -210,6 +306,8 @@
   --ring: 221.2 83.2% 53.3%;
 }
 
+.light[data-theme='green'],
+[data-theme='green'] .light,
 [data-theme='green'] {
   /* --background: 0 0% 100%; */
   --foreground: 240 10% 3.9%;
@@ -231,6 +329,8 @@
   --ring: 142.1 76.2% 36.3%;
 }
 
+.light[data-theme='deep-green'],
+[data-theme='deep-green'] .light,
 [data-theme='deep-green'] {
   /* --background: 0 0% 100%; */
   --foreground: 240 10% 3.9%;
@@ -252,6 +352,8 @@
   --ring: 142.1 76.2% 36.3%;
 }
 
+.light[data-theme='orange'],
+[data-theme='orange'] .light,
 [data-theme='orange'] {
   /* --background: 0 0% 100%; */
   --foreground: 20 14.3% 4.1%;
@@ -273,6 +375,8 @@
   --ring: 24.6 95% 53.1%;
 }
 
+.light[data-theme='yellow'],
+[data-theme='yellow'] .light,
 [data-theme='yellow'] {
   /* --background: 0 0% 100%; */
   --foreground: 20 14.3% 4.1%;
@@ -294,6 +398,8 @@
   --ring: 20 14.3% 4.1%;
 }
 
+.light[data-theme='zinc'],
+[data-theme='zinc'] .light,
 [data-theme='zinc'] {
   /* --background: 0 0% 100%; */
   --foreground: 240 10% 3.9%;
@@ -315,6 +421,8 @@
   --ring: 240 5.9% 10%;
 }
 
+.light[data-theme='neutral'],
+[data-theme='neutral'] .light,
 [data-theme='neutral'] {
   /* --background: 0 0% 100%; */
   --foreground: 0 0% 3.9%;
@@ -336,6 +444,8 @@
   --ring: 0 0% 3.9%;
 }
 
+.light[data-theme='slate'],
+[data-theme='slate'] .light,
 [data-theme='slate'] {
   /* --background: 0 0% 100%; */
   --foreground: 222.2 84% 4.9%;
@@ -357,6 +467,8 @@
   --ring: 222.2 84% 4.9%;
 }
 
+.light[data-theme='gray'],
+[data-theme='gray'] .light,
 [data-theme='gray'] {
   /* --background: 0 0% 100%; */
   --foreground: 224 71.4% 4.1%;
diff --git a/packages/@core/base/design/src/design-tokens/index.ts b/packages/@core/base/design/src/design-tokens/index.ts
index 2d031d81..4bf1467d 100644
--- a/packages/@core/base/design/src/design-tokens/index.ts
+++ b/packages/@core/base/design/src/design-tokens/index.ts
@@ -1,4 +1,2 @@
 import './default.css';
 import './dark.css';
-
-export {};
diff --git a/packages/@core/base/design/src/index.ts b/packages/@core/base/design/src/index.ts
index d7c05340..952caef7 100644
--- a/packages/@core/base/design/src/index.ts
+++ b/packages/@core/base/design/src/index.ts
@@ -4,5 +4,3 @@ import './css/global.css';
 import './css/transition.css';
 import './css/nprogress.css';
 import './css/ui.css';
-
-export {};
diff --git a/packages/@core/base/design/vite.config.mts b/packages/@core/base/design/vite.config.ts
similarity index 76%
rename from packages/@core/base/design/vite.config.mts
rename to packages/@core/base/design/vite.config.ts
index 935929d8..0d4591af 100644
--- a/packages/@core/base/design/vite.config.mts
+++ b/packages/@core/base/design/vite.config.ts
@@ -1,3 +1,4 @@
+// eslint-disable-next-line no-restricted-imports
 import { defineConfig } from '@vben/vite-config';
 
 export default defineConfig(async () => {
diff --git a/packages/@core/base/icons/build.config.ts b/packages/@core/base/icons/build.config.ts
deleted file mode 100644
index 97e572c5..00000000
--- a/packages/@core/base/icons/build.config.ts
+++ /dev/null
@@ -1,7 +0,0 @@
-import { defineBuildConfig } from 'unbuild';
-
-export default defineBuildConfig({
-  clean: true,
-  declaration: true,
-  entries: ['src/index'],
-});
diff --git a/packages/@core/base/icons/package.json b/packages/@core/base/icons/package.json
index 754b7450..23504aca 100644
--- a/packages/@core/base/icons/package.json
+++ b/packages/@core/base/icons/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vben-core/icons",
-  "version": "5.5.1",
+  "version": "5.7.0",
   "homepage": "https://github.com/vbenjs/vue-vben-admin",
   "bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
   "repository": {
@@ -11,7 +11,7 @@
   "license": "MIT",
   "type": "module",
   "scripts": {
-    "build": "pnpm unbuild"
+    "build": "pnpm exec tsdown"
   },
   "files": [
     "dist"
@@ -22,6 +22,7 @@
     ".": {
       "types": "./src/index.ts",
       "development": "./src/index.ts",
+      "production": "./src/index.ts",
       "default": "./dist/index.mjs"
     }
   },
@@ -35,7 +36,7 @@
   },
   "dependencies": {
     "@iconify/vue": "catalog:",
-    "lucide-vue-next": "catalog:",
+    "@lucide/vue": "catalog:",
     "vue": "catalog:"
   }
 }
diff --git a/packages/@core/base/icons/src/lucide.ts b/packages/@core/base/icons/src/lucide.ts
index 21a1beff..7edabcb6 100644
--- a/packages/@core/base/icons/src/lucide.ts
+++ b/packages/@core/base/icons/src/lucide.ts
@@ -1,60 +1,95 @@
 export {
+  TextAlignCenter as AlignCenter,
+  TextAlignStart as AlignLeft,
+  TextAlignEnd as AlignRight,
   ArrowDown,
   ArrowLeft,
-  ArrowLeftFromLine as MdiMenuOpen,
   ArrowLeftToLine,
-  ArrowRightFromLine as MdiMenuClose,
   ArrowRightLeft,
   ArrowRightToLine,
   ArrowUp,
   ArrowUpToLine,
   Bell,
+  Bold,
   BookOpenText,
   Check,
   ChevronDown,
   ChevronLeft,
   ChevronRight,
+  ChevronsDown,
   ChevronsLeft,
   ChevronsRight,
+  Circle,
+  CircleAlert,
+  CircleCheckBig,
   CircleHelp,
+  CircleX,
   Copy,
   CornerDownLeft,
+  Download,
   Ellipsis,
+  Eraser,
   Expand,
   ExternalLink,
   Eye,
   EyeOff,
   FoldHorizontal,
   Fullscreen,
-  Github,
+  Grid,
   Grip,
   GripVertical,
+  Heading1,
+  Heading2,
+  Highlighter,
+  Menu as IconDefault,
+  ImagePlus,
+  Inbox,
   Info,
   InspectionPanel,
+  Italic,
   Languages,
+  LayoutGrid,
+  Link2,
+  List,
+  ListOrdered,
   LoaderCircle,
   LockKeyhole,
   LogOut,
   MailCheck,
   Maximize,
-  Menu as IconDefault,
+  ArrowRightFromLine as MdiMenuClose,
+  ArrowLeftFromLine as MdiMenuOpen,
   Menu,
+  MessageSquareCode,
   Minimize,
   Minimize2,
   MoonStar,
+  Paintbrush,
   Palette,
   PanelLeft,
   PanelRight,
   Pin,
   PinOff,
+  Plus,
+  Redo2,
+  RemoveFormatting,
   RotateCw,
   Search,
   SearchX,
   Settings,
   Shrink,
+  Square,
+  SquareCheckBig,
+  SquareCode,
+  SquareMinus,
+  Strikethrough,
   Sun,
   SunMoon,
   SwatchBook,
+  TextQuote,
+  Underline,
+  Undo2,
+  Unlink2,
   UserRoundPen,
   X,
-} from 'lucide-vue-next';
+} from '@lucide/vue';
diff --git a/packages/@core/base/icons/tsdown.config.ts b/packages/@core/base/icons/tsdown.config.ts
new file mode 100644
index 00000000..c4f51c5e
--- /dev/null
+++ b/packages/@core/base/icons/tsdown.config.ts
@@ -0,0 +1,11 @@
+import { defineConfig } from 'tsdown';
+
+export default defineConfig({
+  clean: true,
+  dts: true,
+  entry: ['src/index.ts'],
+  format: ['esm'],
+  outExtensions: () => ({
+    dts: '.d.ts',
+  }),
+});
diff --git a/packages/@core/base/shared/build.config.ts b/packages/@core/base/shared/build.config.ts
deleted file mode 100644
index 98e2209f..00000000
--- a/packages/@core/base/shared/build.config.ts
+++ /dev/null
@@ -1,14 +0,0 @@
-import { defineBuildConfig } from 'unbuild';
-
-export default defineBuildConfig({
-  clean: true,
-  declaration: true,
-  entries: [
-    'src/store',
-    'src/constants/index',
-    'src/utils/index',
-    'src/color/index',
-    'src/cache/index',
-    'src/global-state',
-  ],
-});
diff --git a/packages/@core/base/shared/package.json b/packages/@core/base/shared/package.json
index 20eeea45..61fa032d 100644
--- a/packages/@core/base/shared/package.json
+++ b/packages/@core/base/shared/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vben-core/shared",
-  "version": "5.5.1",
+  "version": "5.7.0",
   "homepage": "https://github.com/vbenjs/vue-vben-admin",
   "bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
   "repository": {
@@ -11,8 +11,8 @@
   "license": "MIT",
   "type": "module",
   "scripts": {
-    "build": "pnpm unbuild",
-    "stub": "pnpm unbuild --stub"
+    "build": "pnpm exec tsdown",
+    "stub": "pnpm run build"
   },
   "files": [
     "dist"
@@ -22,31 +22,37 @@
     "./constants": {
       "types": "./src/constants/index.ts",
       "development": "./src/constants/index.ts",
+      "production": "./src/constants/index.ts",
       "default": "./dist/constants/index.mjs"
     },
     "./utils": {
       "types": "./src/utils/index.ts",
       "development": "./src/utils/index.ts",
+      "production": "./src/utils/index.ts",
       "default": "./dist/utils/index.mjs"
     },
     "./color": {
       "types": "./src/color/index.ts",
       "development": "./src/color/index.ts",
+      "production": "./src/color/index.ts",
       "default": "./dist/color/index.mjs"
     },
     "./cache": {
       "types": "./src/cache/index.ts",
       "development": "./src/cache/index.ts",
+      "production": "./src/cache/index.ts",
       "default": "./dist/cache/index.mjs"
     },
     "./store": {
       "types": "./src/store.ts",
       "development": "./src/store.ts",
+      "production": "./src/store.ts",
       "default": "./dist/store.mjs"
     },
     "./global-state": {
-      "types": "./dist/global-state.d.ts",
+      "types": "./src/global-state.ts",
       "development": "./src/global-state.ts",
+      "production": "./src/global-state.ts",
       "default": "./dist/global-state.mjs"
     }
   },
@@ -85,17 +91,14 @@
     "clsx": "catalog:",
     "dayjs": "catalog:",
     "defu": "catalog:",
+    "es-toolkit": "catalog:",
     "lodash.clonedeep": "catalog:",
-    "lodash.get": "catalog:",
-    "lodash.isequal": "catalog:",
     "nprogress": "catalog:",
     "tailwind-merge": "catalog:",
     "theme-colors": "catalog:"
   },
   "devDependencies": {
     "@types/lodash.clonedeep": "catalog:",
-    "@types/lodash.get": "catalog:",
-    "@types/lodash.isequal": "catalog:",
     "@types/nprogress": "catalog:"
   }
 }
diff --git a/packages/@core/base/shared/src/cache/README.md b/packages/@core/base/shared/src/cache/README.md
new file mode 100644
index 00000000..00e4aa50
--- /dev/null
+++ b/packages/@core/base/shared/src/cache/README.md
@@ -0,0 +1,418 @@
+# Cache 模块
+
+基于**策略模式**的异步存储管理方案，支持多种存储后端（localStorage、IndexedDB、Memory），提供统一的 API 接口。
+
+## 架构设计
+
+```shell
+┌───────────────────────────────────────────────┐
+│             StorageManager                    │
+│  ┌─────────────┐  ┌───────────────────────┐   │
+│  │ Prefix 隔离 │   │   TTL 过期管理        │   │
+│  └─────────────┘  └───────────────────────┘   │
+├───────────────────────────────────────────────┤
+│             IStorageDriver                    │
+├──────────┬─────────────────┬──────────────────┤
+│  Local   │   IndexedDB     │     Memory       │
+│  Storage │   Driver        │     Driver       │
+│  Driver  │                 │                  │
+└──────────┴─────────────────┴──────────────────┘
+```
+
+**分层职责：**
+
+| 层级             | 职责                                         |
+| ---------------- | -------------------------------------------- |
+| `StorageManager` | 命名空间前缀隔离、TTL 过期检查、统一对外 API |
+| `IStorageDriver` | 纯粹的 KV 存取抽象接口                       |
+| 各 Driver 实现   | 对接具体存储引擎，不感知前缀和 TTL           |
+
+---
+
+## 快速开始
+
+### 基本使用（默认 localStorage）
+
+```typescript
+import { StorageManager } from '@vben-core/shared/cache';
+
+const cache = new StorageManager({ prefix: 'myapp' });
+// 使用 IndexedDB
+//new StorageManager({ driver: new IndexedDBDriver(), prefix: 'app' });
+
+// 使用 sessionStorage
+//new StorageManager({ driver: new LocalStorageDriver({ storageType: 'sessionStorage' }), prefix: 'app' });
+
+// 测试环境
+//new StorageManager({ driver: new MemoryStorageDriver(), prefix: 'test' });
+
+// 存储数据
+await cache.setItem('user', { name: '张三', age: 28 });
+
+// 读取数据
+const user = await cache.getItem('user');
+// => { name: '张三', age: 28 }
+
+// 带默认值读取
+const settings = await cache.getItem('settings', { theme: 'light' });
+// 如果不存在，返回 { theme: 'light' }
+
+// 删除数据
+await cache.removeItem('user');
+
+// 清除当前前缀下所有数据
+await cache.clear();
+```
+
+### 带 TTL 过期
+
+```typescript
+const cache = new StorageManager({ prefix: 'session' });
+
+// 设置 5 分钟后过期（TTL 单位为毫秒）
+await cache.setItem('token', 'abc123', 5 * 60 * 1000);
+
+// 5 分钟内可以正常读取
+const token = await cache.getItem('token');
+// => 'abc123'
+
+// 5 分钟后自动返回 null（惰性删除）
+const expiredToken = await cache.getItem('token');
+// => null
+
+// 主动清理所有过期项
+await cache.clearExpiredItems();
+```
+
+---
+
+## 存储驱动
+
+### LocalStorageDriver（默认）
+
+基于浏览器 `localStorage` 或 `sessionStorage`，数据持久化存储。
+
+```typescript
+import { LocalStorageDriver, StorageManager } from '@vben-core/shared/cache';
+
+// 使用 localStorage（默认）
+const cache = new StorageManager({
+  driver: new LocalStorageDriver(),
+  prefix: 'app',
+});
+
+// 使用 sessionStorage
+const sessionCache = new StorageManager({
+  driver: new LocalStorageDriver({ storageType: 'sessionStorage' }),
+  prefix: 'app',
+});
+```
+
+**特点：**
+
+- 同步 API 用 async 包装，保持接口统一
+- 自动处理 JSON 序列化/反序列化
+- 数据损坏时自动清除并返回 null
+- 存储上限约 5-10MB（视浏览器而定）
+
+**适用场景：** 用户偏好设置、小型配置数据、Token 存储
+
+---
+
+### IndexedDBDriver
+
+基于浏览器 IndexedDB，支持大容量结构化数据存储。
+
+```typescript
+import {IndexedDBDriver, StorageManager} from '@vben-core/shared/cache';
+
+const cache = new StorageManager({
+  driver: new IndexedDBDriver({
+    dbName: 'my-app-db',     // 数据库名称，默认 'vben-storage'
+    dbVersion: 1,            // 数据库版本，默认 1
+    storeName: 'cache-store', // 对象存储名称，默认 'kv-store'
+  }),
+  prefix: 'data',
+});
+
+// 存储大量数据
+await cache.setItem('table-data', largeDataArray);
+
+// 存储二进制友好的结构（IndexedDB 原生支持）
+await cache.setItem('config', {
+  columns: [...],
+  filters: [...],
+  pagination: {page: 1, size: 20},
+});
+```
+
+**特点：**
+
+- 懒初始化：首次操作时自动打开数据库，无需手动调用 `init()`
+- 存储容量大（通常数百 MB 到 GB 级别）
+- 支持结构化克隆（可存储 Date、RegExp、Blob 等复杂类型）
+- 天然异步，不阻塞主线程
+
+**适用场景：** 离线数据缓存、大型表格数据、文件/图片缓存、复杂业务数据
+
+---
+
+### MemoryStorageDriver
+
+基于内存 Map，数据不持久化，页面刷新即丢失。
+
+```typescript
+import { MemoryStorageDriver, StorageManager } from '@vben-core/shared/cache';
+
+const cache = new StorageManager({
+  driver: new MemoryStorageDriver(),
+  prefix: 'test',
+});
+```
+
+**特点：**
+
+- 读写速度最快
+- 无浏览器 API 依赖
+- 数据随页面生命周期销毁
+
+**适用场景：** 单元测试、SSR 服务端渲染、临时运行时缓存
+
+---
+
+## API 参考
+
+### StorageManager
+
+#### 构造函数
+
+```typescript
+new StorageManager(options?: StorageManagerOptions)
+```
+
+| 参数 | 类型 | 默认值 | 说明 |
+| --- | --- | --- | --- |
+| `driver` | `IStorageDriver` | `new LocalStorageDriver()` | 存储驱动实例 |
+| `prefix` | `string` | `''` | 键前缀，用于命名空间隔离 |
+
+#### 方法
+
+| 方法 | 签名 | 说明 |
+| --- | --- | --- |
+| `getItem` | `getItem<T>(key: string, defaultValue?: T \| null): Promise<T \| null>` | 获取存储项，过期或不存在返回默认值 |
+| `setItem` | `setItem<T>(key: string, value: T, ttl?: number): Promise<void>` | 设置存储项，可选 TTL（毫秒） |
+| `removeItem` | `removeItem(key: string): Promise<void>` | 删除指定存储项 |
+| `clear` | `clear(): Promise<void>` | 清除当前前缀下所有存储项 |
+| `clearExpiredItems` | `clearExpiredItems(): Promise<void>` | 主动清理所有过期项 |
+
+---
+
+### IStorageDriver 接口
+
+自定义驱动需要实现此接口：
+
+```typescript
+interface IStorageDriver {
+  clear(): Promise<void>;
+
+  getItem<T>(key: string): Promise<null | T>;
+
+  keys(): Promise<string[]>;
+
+  removeItem(key: string): Promise<void>;
+
+  setItem<T>(key: string, value: T): Promise<void>;
+}
+```
+
+---
+
+## 高级用法
+
+### 自定义 Driver
+
+```typescript
+import type { IStorageDriver } from '@vben-core/shared/cache';
+
+class CookieStorageDriver implements IStorageDriver {
+  async getItem<T>(key: string): Promise<null | T> {
+    const value = getCookie(key);
+    return value ? JSON.parse(value) : null;
+  }
+
+  async setItem<T>(key: string, value: T): Promise<void> {
+    setCookie(key, JSON.stringify(value));
+  }
+
+  async removeItem(key: string): Promise<void> {
+    deleteCookie(key);
+  }
+
+  async clear(): Promise<void> {
+    clearAllCookies();
+  }
+
+  async keys(): Promise<string[]> {
+    return getAllCookieNames();
+  }
+}
+
+// 使用自定义 Driver
+const cache = new StorageManager({
+  driver: new CookieStorageDriver(),
+  prefix: 'ck',
+});
+```
+
+### 根据环境动态选择 Driver
+
+```typescript
+import {
+  IndexedDBDriver,
+  LocalStorageDriver,
+  MemoryStorageDriver,
+  StorageManager,
+} from '@vben-core/shared/cache';
+
+function createStorageManager(prefix: string) {
+  // SSR 环境使用内存驱动
+  if (typeof window === 'undefined') {
+    return new StorageManager({
+      driver: new MemoryStorageDriver(),
+      prefix,
+    });
+  }
+
+  // 大数据场景使用 IndexedDB
+  if (needsLargeStorage()) {
+    return new StorageManager({
+      driver: new IndexedDBDriver({ dbName: `${prefix}-db` }),
+      prefix,
+    });
+  }
+
+  // 默认使用 localStorage
+  return new StorageManager({ prefix });
+}
+```
+
+### 命名空间隔离
+
+```typescript
+// 不同模块使用不同前缀，互不干扰
+const userCache = new StorageManager({ prefix: 'user' });
+const configCache = new StorageManager({ prefix: 'config' });
+
+await userCache.setItem('profile', { name: '张三' });
+await configCache.setItem('profile', { theme: 'dark' });
+
+// 各自独立
+await userCache.getItem('profile'); // => { name: '张三' }
+await configCache.getItem('profile'); // => { theme: 'dark' }
+
+// 只清除 user 前缀的数据
+await userCache.clear();
+await configCache.getItem('profile'); // => { theme: 'dark' }（不受影响）
+```
+
+### 定时清理过期数据
+
+```typescript
+const cache = new StorageManager({ prefix: 'app' });
+
+// 应用启动时清理一次
+await cache.clearExpiredItems();
+
+// 或者定时清理（每 10 分钟）
+setInterval(
+  async () => {
+    await cache.clearExpiredItems();
+  },
+  10 * 60 * 1000,
+);
+```
+
+---
+
+## 数据存储格式
+
+`StorageManager` 在 Driver 层存储的数据结构为：
+
+```typescript
+interface StorageItem<T> {
+  expiry?: number; // 过期时间戳（毫秒），undefined 表示永不过期
+  value: T; // 实际业务数据
+}
+```
+
+实际存储的 key 格式为：`{prefix}-{key}`
+
+例如 `prefix = 'app'`，`key = 'user'`，则实际存储键为 `app-user`。
+
+---
+
+## 过期策略
+
+采用**惰性删除 + 主动清理**双重策略：
+
+| 策略 | 触发时机 | 说明 |
+| --- | --- | --- |
+| 惰性删除 | 调用 `getItem` 时 | 读取时检查过期，过期则删除并返回默认值 |
+| 主动清理 | 调用 `clearExpiredItems` 时 | 遍历所有带前缀的 key，删除已过期项 |
+
+---
+
+## 各 Driver 对比
+
+| 特性       | LocalStorageDriver  | IndexedDBDriver  | MemoryStorageDriver |
+| ---------- | ------------------- | ---------------- | ------------------- |
+| 持久化     | ✅                  | ✅               | ❌                  |
+| 容量       | 5-10 MB             | 数百 MB+         | 受内存限制          |
+| 速度       | 快（同步）          | 中等（异步 I/O） | 最快                |
+| 数据类型   | 仅 JSON 可序列化    | 结构化克隆       | 任意 JS 对象        |
+| 浏览器支持 | 所有现代浏览器      | 所有现代浏览器   | 任意环境            |
+| 阻塞主线程 | 是                  | 否               | 否                  |
+| 适用场景   | 配置、Token、小数据 | 离线缓存、大数据 | 测试、SSR           |
+
+---
+
+## 在项目中的使用
+
+本项目中 `StorageManager` 主要被 `PreferenceManager` 消费，用于持久化用户偏好设置：
+
+```typescript
+// packages/@core/preferences/src/preferences.ts
+class PreferenceManager {
+  private cache: StorageManager;
+
+  constructor() {
+    this.cache = new StorageManager();
+    this.state = reactive<Preferences>({ ...defaultPreferences });
+  }
+
+  initPreferences = async ({ namespace }) => {
+    // 用应用命名空间重新初始化
+    this.cache = new StorageManager({ prefix: namespace });
+
+    // 从缓存加载偏好设置
+    const cached = await this.cache.getItem<Preferences>('preferences');
+    // ...
+  };
+}
+```
+
+---
+
+## 注意事项
+
+1. **所有方法都是异步的** — 即使底层是同步的 localStorage，API 也返回 Promise，确保切换 Driver 时无需改动调用方。
+
+2. **TTL 单位是毫秒** — `setItem('key', value, 60000)` 表示 60 秒后过期。
+
+3. **IndexedDB 懒初始化** — 不需要手动调用 `init()` 或 `open()`，首次操作时自动打开数据库连接并复用。
+
+4. **前缀隔离是逻辑隔离** — `clear()` 只清除当前前缀下的数据，不影响其他前缀或无前缀的数据。
+
+5. **错误处理** — LocalStorageDriver 在 JSON 解析失败时自动清除损坏数据； `PreferenceManager.saveToCache` 内部 try-catch 防止未捕获异常。
+
+6. **IndexedDB 版本升级** — 如果需要修改 objectStore 结构，需要递增 `dbVersion`。当前实现在 `upgradeneeded` 事件中自动创建 objectStore。
diff --git a/packages/@core/base/shared/src/cache/__tests__/storage-manager.test.ts b/packages/@core/base/shared/src/cache/__tests__/storage-manager.test.ts
index a5abe5a7..dfd3fa65 100644
--- a/packages/@core/base/shared/src/cache/__tests__/storage-manager.test.ts
+++ b/packages/@core/base/shared/src/cache/__tests__/storage-manager.test.ts
@@ -1,5 +1,6 @@
 import { beforeEach, describe, expect, it, vi } from 'vitest';
 
+import { MemoryStorageDriver } from '../memory-storage-driver';
 import { StorageManager } from '../storage-manager';
 
 describe('storageManager', () => {
@@ -7,123 +8,115 @@ describe('storageManager', () => {
 
   beforeEach(() => {
     vi.useFakeTimers();
-    localStorage.clear();
     storageManager = new StorageManager({
+      driver: new MemoryStorageDriver(),
       prefix: 'test_',
     });
   });
 
-  it('should set and get an item', () => {
-    storageManager.setItem('user', { age: 30, name: 'John Doe' });
-    const user = storageManager.getItem('user');
+  it('should set and get an item', async () => {
+    await storageManager.setItem('user', { age: 30, name: 'John Doe' });
+    const user = await storageManager.getItem('user');
     expect(user).toEqual({ age: 30, name: 'John Doe' });
   });
 
-  it('should return default value if item does not exist', () => {
-    const user = storageManager.getItem('nonexistent', {
+  it('should return default value if item does not exist', async () => {
+    const user = await storageManager.getItem('nonexistent', {
       age: 0,
       name: 'Default User',
     });
     expect(user).toEqual({ age: 0, name: 'Default User' });
   });
 
-  it('should remove an item', () => {
-    storageManager.setItem('user', { age: 30, name: 'John Doe' });
-    storageManager.removeItem('user');
-    const user = storageManager.getItem('user');
+  it('should remove an item', async () => {
+    await storageManager.setItem('user', { age: 30, name: 'John Doe' });
+    await storageManager.removeItem('user');
+    const user = await storageManager.getItem('user');
     expect(user).toBeNull();
   });
 
-  it('should clear all items with the prefix', () => {
-    storageManager.setItem('user1', { age: 30, name: 'John Doe' });
-    storageManager.setItem('user2', { age: 25, name: 'Jane Doe' });
-    storageManager.clear();
-    expect(storageManager.getItem('user1')).toBeNull();
-    expect(storageManager.getItem('user2')).toBeNull();
+  it('should clear all items with the prefix', async () => {
+    await storageManager.setItem('user1', { age: 30, name: 'John Doe' });
+    await storageManager.setItem('user2', { age: 25, name: 'Jane Doe' });
+    await storageManager.clear();
+    expect(await storageManager.getItem('user1')).toBeNull();
+    expect(await storageManager.getItem('user2')).toBeNull();
   });
 
-  it('should clear expired items', () => {
-    storageManager.setItem('user', { age: 30, name: 'John Doe' }, 1000); // 1秒过期
+  it('should clear expired items', async () => {
+    await storageManager.setItem('user', { age: 30, name: 'John Doe' }, 1000); // 1秒过期
     vi.advanceTimersByTime(1001); // 快进时间
-    storageManager.clearExpiredItems();
-    const user = storageManager.getItem('user');
+    await storageManager.clearExpiredItems();
+    const user = await storageManager.getItem('user');
     expect(user).toBeNull();
   });
 
-  it('should not clear non-expired items', () => {
-    storageManager.setItem('user', { age: 30, name: 'John Doe' }, 10_000); // 10秒过期
+  it('should not clear non-expired items', async () => {
+    await storageManager.setItem('user', { age: 30, name: 'John Doe' }, 10_000); // 10秒过期
     vi.advanceTimersByTime(5000); // 快进时间
-    storageManager.clearExpiredItems();
-    const user = storageManager.getItem('user');
+    await storageManager.clearExpiredItems();
+    const user = await storageManager.getItem('user');
     expect(user).toEqual({ age: 30, name: 'John Doe' });
   });
 
-  it('should handle JSON parse errors gracefully', () => {
-    localStorage.setItem('test_user', '{ invalid JSON }');
-    const user = storageManager.getItem('user', {
-      age: 0,
-      name: 'Default User',
-    });
-    expect(user).toEqual({ age: 0, name: 'Default User' });
-  });
-  it('should return null for non-existent items without default value', () => {
-    const user = storageManager.getItem('nonexistent');
+  it('should return null for non-existent items without default value', async () => {
+    const user = await storageManager.getItem('nonexistent');
     expect(user).toBeNull();
   });
 
-  it('should overwrite existing items', () => {
-    storageManager.setItem('user', { age: 30, name: 'John Doe' });
-    storageManager.setItem('user', { age: 25, name: 'Jane Doe' });
-    const user = storageManager.getItem('user');
+  it('should overwrite existing items', async () => {
+    await storageManager.setItem('user', { age: 30, name: 'John Doe' });
+    await storageManager.setItem('user', { age: 25, name: 'Jane Doe' });
+    const user = await storageManager.getItem('user');
     expect(user).toEqual({ age: 25, name: 'Jane Doe' });
   });
 
-  it('should handle items without expiry correctly', () => {
-    storageManager.setItem('user', { age: 30, name: 'John Doe' });
+  it('should handle items without expiry correctly', async () => {
+    await storageManager.setItem('user', { age: 30, name: 'John Doe' });
     vi.advanceTimersByTime(5000);
-    const user = storageManager.getItem('user');
+    const user = await storageManager.getItem('user');
     expect(user).toEqual({ age: 30, name: 'John Doe' });
   });
 
-  it('should remove expired items when accessed', () => {
-    storageManager.setItem('user', { age: 30, name: 'John Doe' }, 1000); // 1秒过期
+  it('should remove expired items when accessed', async () => {
+    await storageManager.setItem('user', { age: 30, name: 'John Doe' }, 1000); // 1秒过期
     vi.advanceTimersByTime(1001); // 快进时间
-    const user = storageManager.getItem('user');
+    const user = await storageManager.getItem('user');
     expect(user).toBeNull();
   });
 
-  it('should not remove non-expired items when accessed', () => {
-    storageManager.setItem('user', { age: 30, name: 'John Doe' }, 10_000); // 10秒过期
+  it('should not remove non-expired items when accessed', async () => {
+    await storageManager.setItem('user', { age: 30, name: 'John Doe' }, 10_000); // 10秒过期
     vi.advanceTimersByTime(5000); // 快进时间
-    const user = storageManager.getItem('user');
+    const user = await storageManager.getItem('user');
     expect(user).toEqual({ age: 30, name: 'John Doe' });
   });
 
-  it('should handle multiple items with different expiry times', () => {
-    storageManager.setItem('user1', { age: 30, name: 'John Doe' }, 1000); // 1秒过期
-    storageManager.setItem('user2', { age: 25, name: 'Jane Doe' }, 2000); // 2秒过期
+  it('should handle multiple items with different expiry times', async () => {
+    await storageManager.setItem('user1', { age: 30, name: 'John Doe' }, 1000); // 1秒过期
+    await storageManager.setItem('user2', { age: 25, name: 'Jane Doe' }, 2000); // 2秒过期
     vi.advanceTimersByTime(1500); // 快进时间
-    storageManager.clearExpiredItems();
-    const user1 = storageManager.getItem('user1');
-    const user2 = storageManager.getItem('user2');
+    await storageManager.clearExpiredItems();
+    const user1 = await storageManager.getItem('user1');
+    const user2 = await storageManager.getItem('user2');
     expect(user1).toBeNull();
     expect(user2).toEqual({ age: 25, name: 'Jane Doe' });
   });
 
-  it('should handle items with no expiry', () => {
-    storageManager.setItem('user', { age: 30, name: 'John Doe' });
+  it('should handle items with no expiry', async () => {
+    await storageManager.setItem('user', { age: 30, name: 'John Doe' });
     vi.advanceTimersByTime(10_000); // 快进时间
-    storageManager.clearExpiredItems();
-    const user = storageManager.getItem('user');
+    await storageManager.clearExpiredItems();
+    const user = await storageManager.getItem('user');
     expect(user).toEqual({ age: 30, name: 'John Doe' });
   });
 
-  it('should clear all items correctly', () => {
-    storageManager.setItem('user1', { age: 30, name: 'John Doe' });
-    storageManager.setItem('user2', { age: 25, name: 'Jane Doe' });
-    storageManager.clear();
-    const user1 = storageManager.getItem('user1');
-    const user2 = storageManager.getItem('user2');
+  it('should clear all items correctly', async () => {
+    await storageManager.setItem('user1', { age: 30, name: 'John Doe' });
+    await storageManager.setItem('user2', { age: 25, name: 'Jane Doe' });
+    await storageManager.clear();
+    const user1 = await storageManager.getItem('user1');
+    const user2 = await storageManager.getItem('user2');
     expect(user1).toBeNull();
     expect(user2).toBeNull();
   });
diff --git a/packages/@core/base/shared/src/cache/index.ts b/packages/@core/base/shared/src/cache/index.ts
index 8c44d7f1..e1d5c6e8 100644
--- a/packages/@core/base/shared/src/cache/index.ts
+++ b/packages/@core/base/shared/src/cache/index.ts
@@ -1 +1,5 @@
+export * from './indexeddb-driver';
+export * from './local-storage-driver';
+export * from './memory-storage-driver';
 export * from './storage-manager';
+export type * from './types';
diff --git a/packages/@core/base/shared/src/cache/indexeddb-driver.ts b/packages/@core/base/shared/src/cache/indexeddb-driver.ts
new file mode 100644
index 00000000..2b6cdcbc
--- /dev/null
+++ b/packages/@core/base/shared/src/cache/indexeddb-driver.ts
@@ -0,0 +1,137 @@
+import type { IStorageDriver } from './types';
+
+interface IndexedDBDriverOptions {
+  /** 数据库名称 */
+  dbName?: string;
+  /** 数据库版本 */
+  dbVersion?: number;
+  /** 对象存储名称 */
+  storeName?: string;
+}
+
+/**
+ * IndexedDB 驱动
+ * 采用懒初始化模式，首次操作时自动打开数据库
+ */
+class IndexedDBDriver implements IStorageDriver {
+  private dbName: string;
+  private dbPromise: null | Promise<IDBDatabase> = null;
+  private dbVersion: number;
+  private storeName: string;
+
+  constructor({
+    dbName = 'vben-storage',
+    dbVersion = 1,
+    storeName = 'kv-store',
+  }: IndexedDBDriverOptions = {}) {
+    this.dbName = dbName;
+    this.dbVersion = dbVersion;
+    this.storeName = storeName;
+  }
+
+  async clear(): Promise<void> {
+    const db = await this.getDB();
+    return new Promise((resolve, reject) => {
+      const tx = db.transaction(this.storeName, 'readwrite');
+      const store = tx.objectStore(this.storeName);
+      store.clear();
+
+      tx.addEventListener('complete', () => resolve());
+      tx.addEventListener('error', () => reject(tx.error));
+      tx.addEventListener('abort', () =>
+        reject(tx.error ?? new Error('Transaction aborted')),
+      );
+    });
+  }
+
+  async getItem<T>(key: string): Promise<null | T> {
+    const db = await this.getDB();
+    return new Promise((resolve, reject) => {
+      const tx = db.transaction(this.storeName, 'readonly');
+      const store = tx.objectStore(this.storeName);
+      const request = store.get(key);
+
+      request.addEventListener('success', () =>
+        resolve(request.result ?? null),
+      );
+      request.addEventListener('error', () => reject(request.error));
+    });
+  }
+
+  async keys(): Promise<string[]> {
+    const db = await this.getDB();
+    return new Promise((resolve, reject) => {
+      const tx = db.transaction(this.storeName, 'readonly');
+      const store = tx.objectStore(this.storeName);
+      const request = store.getAllKeys();
+
+      request.addEventListener('success', () =>
+        resolve(request.result.map(String)),
+      );
+      request.addEventListener('error', () => reject(request.error));
+    });
+  }
+
+  async removeItem(key: string): Promise<void> {
+    const db = await this.getDB();
+    return new Promise((resolve, reject) => {
+      const tx = db.transaction(this.storeName, 'readwrite');
+      const store = tx.objectStore(this.storeName);
+      store.delete(key);
+
+      tx.addEventListener('complete', () => resolve());
+      tx.addEventListener('error', () => reject(tx.error));
+      tx.addEventListener('abort', () =>
+        reject(tx.error ?? new Error('Transaction aborted')),
+      );
+    });
+  }
+
+  async setItem(key: string, value: unknown): Promise<void> {
+    const db = await this.getDB();
+    return new Promise((resolve, reject) => {
+      const tx = db.transaction(this.storeName, 'readwrite');
+      const store = tx.objectStore(this.storeName);
+      store.put(value, key);
+
+      tx.addEventListener('complete', () => resolve());
+      tx.addEventListener('error', () => reject(tx.error));
+      tx.addEventListener('abort', () =>
+        reject(tx.error ?? new Error('Transaction aborted')),
+      );
+    });
+  }
+
+  /**
+   * 懒初始化：首次调用时打开数据库，后续复用同一个 Promise
+   */
+  private getDB(): Promise<IDBDatabase> {
+    if (!this.dbPromise) {
+      this.dbPromise = this.openDB().catch((error) => {
+        // allow retry on next call
+        this.dbPromise = null;
+        throw error;
+      });
+    }
+    return this.dbPromise;
+  }
+
+  private openDB(): Promise<IDBDatabase> {
+    return new Promise((resolve, reject) => {
+      const request = indexedDB.open(this.dbName, this.dbVersion);
+
+      request.addEventListener('upgradeneeded', () => {
+        const db = request.result;
+        if (!db.objectStoreNames.contains(this.storeName)) {
+          db.createObjectStore(this.storeName);
+        }
+      });
+
+      request.addEventListener('success', () => resolve(request.result));
+      request.addEventListener('error', () => reject(request.error));
+    });
+  }
+}
+
+export { IndexedDBDriver };
+export type { IndexedDBDriverOptions };
diff --git a/packages/@core/base/shared/src/cache/local-storage-driver.ts b/packages/@core/base/shared/src/cache/local-storage-driver.ts
new file mode 100644
index 00000000..c1d04d6d
--- /dev/null
+++ b/packages/@core/base/shared/src/cache/local-storage-driver.ts
@@ -0,0 +1,70 @@
+import type { IStorageDriver } from './types';
+
+type StorageType = 'localStorage' | 'sessionStorage';
+
+interface LocalStorageDriverOptions {
+  /** 使用 localStorage 还是 sessionStorage */
+  storageType?: StorageType;
+}
+
+/**
+ * LocalStorage / SessionStorage 驱动
+ * 用 async 包装同步 API，保持接口统一
+ */
+class LocalStorageDriver implements IStorageDriver {
+  private storage: Storage;
+
+  constructor({
+    storageType = 'localStorage',
+  }: LocalStorageDriverOptions = {}) {
+    if (typeof window === 'undefined') {
+      throw new TypeError(
+        'LocalStorageDriver is not available in non-browser environments. Use MemoryStorageDriver instead.',
+      );
+    }
+    this.storage =
+      storageType === 'localStorage'
+        ? window.localStorage
+        : window.sessionStorage;
+  }
+
+  async clear(): Promise<void> {
+    this.storage.clear();
+  }
+
+  async getItem<T>(key: string): Promise<null | T> {
+    const raw = this.storage.getItem(key);
+    if (raw === null) {
+      return null;
+    }
+    try {
+      return JSON.parse(raw) as T;
+    } catch {
+      // 数据损坏，清除并返回 null
+      this.storage.removeItem(key);
+      return null;
+    }
+  }
+
+  async keys(): Promise<string[]> {
+    const result: string[] = [];
+    for (let i = 0; i < this.storage.length; i++) {
+      const key = this.storage.key(i);
+      if (key !== null) {
+        result.push(key);
+      }
+    }
+    return result;
+  }
+
+  async removeItem(key: string): Promise<void> {
+    this.storage.removeItem(key);
+  }
+
+  async setItem(key: string, value: unknown): Promise<void> {
+    this.storage.setItem(key, JSON.stringify(value));
+  }
+}
+
+export { LocalStorageDriver };
+export type { LocalStorageDriverOptions };
diff --git a/packages/@core/base/shared/src/cache/memory-storage-driver.ts b/packages/@core/base/shared/src/cache/memory-storage-driver.ts
new file mode 100644
index 00000000..be38d237
--- /dev/null
+++ b/packages/@core/base/shared/src/cache/memory-storage-driver.ts
@@ -0,0 +1,32 @@
+import type { IStorageDriver } from './types';
+
+/**
+ * 内存存储驱动
+ * 适用于测试环境和 SSR 场景，数据不持久化
+ */
+class MemoryStorageDriver implements IStorageDriver {
+  private store = new Map<string, unknown>();
+
+  async clear(): Promise<void> {
+    this.store.clear();
+  }
+
+  async getItem<T>(key: string): Promise<null | T> {
+    const value = this.store.get(key);
+    return (value as T) ?? null;
+  }
+
+  async keys(): Promise<string[]> {
+    return [...this.store.keys()];
+  }
+
+  async removeItem(key: string): Promise<void> {
+    this.store.delete(key);
+  }
+
+  async setItem(key: string, value: unknown): Promise<void> {
+    this.store.set(key, value);
+  }
+}
+
+export { MemoryStorageDriver };
diff --git a/packages/@core/base/shared/src/cache/storage-manager.ts b/packages/@core/base/shared/src/cache/storage-manager.ts
index 611cdb83..ce0bc350 100644
--- a/packages/@core/base/shared/src/cache/storage-manager.ts
+++ b/packages/@core/base/shared/src/cache/storage-manager.ts
@@ -1,62 +1,54 @@
-type StorageType = 'localStorage' | 'sessionStorage';
+import type {
+  IStorageDriver,
+  StorageItem,
+  StorageManagerOptions,
+} from './types';
 
-interface StorageManagerOptions {
-  prefix?: string;
-  storageType?: StorageType;
-}
-
-interface StorageItem<T> {
-  expiry?: number;
-  value: T;
-}
+import { LocalStorageDriver } from './local-storage-driver';
+import { MemoryStorageDriver } from './memory-storage-driver';
 
+/**
+ * 存储管理器（策略模式）
+ * - prefix（命名空间隔离）在此层处理
+ * - TTL（过期机制）在此层处理
+ * - Driver 只负责纯粹的 KV 存取
+ */
 class StorageManager {
+  private driver: IStorageDriver;
   private prefix: string;
-  private storage: Storage;
 
-  constructor({
-    prefix = '',
-    storageType = 'localStorage',
-  }: StorageManagerOptions = {}) {
+  constructor({ driver, prefix = '' }: StorageManagerOptions = {}) {
+    this.driver = driver || this.createDefaultDriver();
     this.prefix = prefix;
-    this.storage =
-      storageType === 'localStorage'
-        ? window.localStorage
-        : window.sessionStorage;
-  }
-
-  /**
-   * 获取完整的存储键
-   * @param key 原始键
-   * @returns 带前缀的完整键
-   */
-  private getFullKey(key: string): string {
-    return `${this.prefix}-${key}`;
+    if (!this.prefix && this.driver instanceof LocalStorageDriver) {
+      console.warn(
+        '[StorageManager] empty prefix combined with LocalStorageDriver — clear()/keys() will affect every localStorage entry.',
+      );
+    }
   }
 
   /**
    * 清除所有带前缀的存储项
    */
-  clear(): void {
-    const keysToRemove: string[] = [];
-    for (let i = 0; i < this.storage.length; i++) {
-      const key = this.storage.key(i);
-      if (key && key.startsWith(this.prefix)) {
-        keysToRemove.push(key);
-      }
-    }
-    keysToRemove.forEach((key) => this.storage.removeItem(key));
+  async clear(): Promise<void> {
+    const allKeys = await this.driver.keys();
+    const fullPrefix = this.prefix ? `${this.prefix}-` : '';
+    const prefixedKeys = allKeys.filter((key) => key.startsWith(fullPrefix));
+    await Promise.all(prefixedKeys.map((key) => this.driver.removeItem(key)));
   }
 
   /**
    * 清除所有过期的存储项
    */
-  clearExpiredItems(): void {
-    for (let i = 0; i < this.storage.length; i++) {
-      const key = this.storage.key(i);
-      if (key && key.startsWith(this.prefix)) {
-        const shortKey = key.replace(this.prefix, '');
-        this.getItem(shortKey); // 调用 getItem 方法检查并移除过期项
+  async clearExpiredItems(): Promise<void> {
+    const allKeys = await this.driver.keys();
+    const fullPrefix = this.prefix ? `${this.prefix}-` : '';
+    const prefixedKeys = allKeys.filter((key) => key.startsWith(fullPrefix));
+
+    for (const fullKey of prefixedKeys) {
+      const raw = await this.driver.getItem<StorageItem<unknown>>(fullKey);
+      if (raw && raw.expiry && Date.now() > raw.expiry) {
+        await this.driver.removeItem(fullKey);
       }
     }
   }
@@ -65,36 +57,47 @@ class StorageManager {
    * 获取存储项
    * @param key 键
    * @param defaultValue 当项不存在或已过期时返回的默认值
-   * @returns 值，如果项已过期或解析错误则返回默认值
+   * @returns 值，如果项已过期则返回默认值
    */
-  getItem<T>(key: string, defaultValue: null | T = null): null | T {
+  async getItem<T>(
+    key: string,
+    defaultValue: null | T = null,
+  ): Promise<null | T> {
     const fullKey = this.getFullKey(key);
-    const itemStr = this.storage.getItem(fullKey);
-    if (!itemStr) {
+    const raw = await this.driver.getItem<StorageItem<T>>(fullKey);
+
+    if (!raw) {
       return defaultValue;
     }
 
-    try {
-      const item: StorageItem<T> = JSON.parse(itemStr);
-      if (item.expiry && Date.now() > item.expiry) {
-        this.storage.removeItem(fullKey);
-        return defaultValue;
-      }
-      return item.value;
-    } catch (error) {
-      console.error(`Error parsing item with key "${fullKey}":`, error);
-      this.storage.removeItem(fullKey); // 如果解析失败，删除该项
+    // TTL 检查
+    if (raw.expiry && Date.now() > raw.expiry) {
+      await this.driver.removeItem(fullKey);
       return defaultValue;
     }
+
+    return raw.value;
+  }
+
+  /**
+   * 获取当前前缀下的所有存储键（已去除前缀部分）
+   */
+  async keys(): Promise<string[]> {
+    const allKeys = await this.driver.keys();
+    const fullPrefix = this.prefix ? `${this.prefix}-` : '';
+    if (!fullPrefix) return allKeys;
+    return allKeys
+      .filter((key) => key.startsWith(fullPrefix))
+      .map((key) => key.slice(fullPrefix.length));
   }
 
   /**
    * 移除存储项
    * @param key 键
    */
-  removeItem(key: string): void {
+  async removeItem(key: string): Promise<void> {
     const fullKey = this.getFullKey(key);
-    this.storage.removeItem(fullKey);
+    await this.driver.removeItem(fullKey);
   }
 
   /**
@@ -103,15 +106,40 @@ class StorageManager {
    * @param value 值
    * @param ttl 存活时间（毫秒）
    */
-  setItem<T>(key: string, value: T, ttl?: number): void {
+  async setItem(key: string, value: unknown, ttl?: number): Promise<void> {
     const fullKey = this.getFullKey(key);
     const expiry = ttl ? Date.now() + ttl : undefined;
-    const item: StorageItem<T> = { expiry, value };
+    const item: StorageItem<unknown> = { expiry, value };
+    await this.driver.setItem(fullKey, item);
+  }
+
+  /**
+   * 根据运行环境创建默认驱动：
+   * - 浏览器环境（window.localStorage 可用）→ LocalStorageDriver
+   * - SSR / Node 环境 → MemoryStorageDriver
+   */
+  private createDefaultDriver(): IStorageDriver {
     try {
-      this.storage.setItem(fullKey, JSON.stringify(item));
+      if (typeof window !== 'undefined' && window.localStorage) {
+        return new LocalStorageDriver();
+      }
     } catch (error) {
-      console.error(`Error setting item with key "${fullKey}":`, error);
+      // localStorage access denied (e.g. Safari private mode)
+      console.warn(
+        'localStorage is not accessible, falling back to MemoryStorageDriver:',
+        error,
+      );
     }
+    return new MemoryStorageDriver();
+  }
+
+  /**
+   * 获取完整的存储键（带前缀）
+   * @param key 原始键
+   * @returns 带前缀的完整键
+   */
+  private getFullKey(key: string): string {
+    return this.prefix ? `${this.prefix}-${key}` : key;
   }
 }
 
diff --git a/packages/@core/base/shared/src/cache/types.ts b/packages/@core/base/shared/src/cache/types.ts
index d8939208..fba35b96 100644
--- a/packages/@core/base/shared/src/cache/types.ts
+++ b/packages/@core/base/shared/src/cache/types.ts
@@ -1,17 +1,39 @@
-type StorageType = 'localStorage' | 'sessionStorage';
+/**
+ * 存储驱动接口（策略模式核心抽象）
+ * 所有存储实现（localStorage、IndexedDB、Memory 等）都需要实现此接口
+ * Driver 层只负责纯粹的 KV 存取，不感知 TTL 和前缀
+ */
+interface IStorageDriver {
+  /** 清除所有存储项 */
+  clear(): Promise<void>;
 
-interface StorageValue<T> {
-  data: T;
-  expiry: null | number;
+  /** 获取存储项 */
+  getItem<T>(key: string): Promise<null | T>;
+
+  /** 获取所有 key */
+  keys(): Promise<string[]>;
+
+  /** 移除存储项 */
+  removeItem(key: string): Promise<void>;
+
+  /** 设置存储项 */
+  setItem(key: string, value: unknown): Promise<void>;
 }
 
-interface IStorageCache {
-  clear(): void;
-  getItem<T>(key: string): null | T;
-  key(index: number): null | string;
-  length(): number;
-  removeItem(key: string): void;
-  setItem<T>(key: string, value: T, expiryInMinutes?: number): void;
+/**
+ * 带 TTL 的存储项包装结构
+ * TTL 逻辑由 StorageManager 统一管理，Driver 层不感知
+ */
+interface StorageItem<T> {
+  expiry?: number;
+  value: T;
 }
 
-export type { IStorageCache, StorageType, StorageValue };
+interface StorageManagerOptions {
+  /** 存储驱动实例 */
+  driver?: IStorageDriver;
+  /** 键前缀，用于命名空间隔离 */
+  prefix?: string;
+}
+
+export type { IStorageDriver, StorageItem, StorageManagerOptions };
diff --git a/packages/@core/base/shared/src/constants/globals.ts b/packages/@core/base/shared/src/constants/globals.ts
index 3c699570..b86c45cd 100644
--- a/packages/@core/base/shared/src/constants/globals.ts
+++ b/packages/@core/base/shared/src/constants/globals.ts
@@ -9,6 +9,8 @@ export const CSS_VARIABLE_LAYOUT_FOOTER_HEIGHT = `--vben-footer-height`;
 
 /** 内容区域的组件ID */
 export const ELEMENT_ID_MAIN_CONTENT = `__vben_main_content`;
+/** layout 滚动容器ID */
+export const ELEMENT_ID_LAYOUT_SCROLL = `__vben_layout_scroll`;
 
 /**
  * @zh_CN 默认命名空间
diff --git a/packages/@core/base/shared/src/constants/vben.ts b/packages/@core/base/shared/src/constants/vben.ts
index 0f6cbbe1..37b8cd09 100644
--- a/packages/@core/base/shared/src/constants/vben.ts
+++ b/packages/@core/base/shared/src/constants/vben.ts
@@ -19,8 +19,12 @@ export const VBEN_LOGO_URL =
  */
 export const VBEN_PREVIEW_URL = 'https://www.vben.pro';
 
+export const VBEN_ANTDV_NEXT_PREVIEW_URL = 'https://antdv-next.vben.pro';
+
 export const VBEN_ELE_PREVIEW_URL = 'https://ele.vben.pro';
 
 export const VBEN_NAIVE_PREVIEW_URL = 'https://naive.vben.pro';
 
 export const VBEN_ANT_PREVIEW_URL = 'https://ant.vben.pro';
+
+export const VBEN_TD_PREVIEW_URL = 'https://tdesign.vben.pro';
diff --git a/packages/@core/base/shared/src/utils/__tests__/date.test.ts b/packages/@core/base/shared/src/utils/__tests__/date.test.ts
new file mode 100644
index 00000000..dc8a9e88
--- /dev/null
+++ b/packages/@core/base/shared/src/utils/__tests__/date.test.ts
@@ -0,0 +1,143 @@
+import dayjs from 'dayjs';
+import timezone from 'dayjs/plugin/timezone.js';
+import utc from 'dayjs/plugin/utc.js';
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
+
+import {
+  formatDate,
+  formatDateTime,
+  getCurrentTimezone,
+  getSystemTimezone,
+  isDate,
+  isDayjsObject,
+  setCurrentTimezone,
+} from '../date';
+
+dayjs.extend(utc);
+dayjs.extend(timezone);
+
+describe('dateUtils', () => {
+  const sampleISO = '2024-10-30T12:34:56Z';
+  const sampleTimestamp = Date.parse(sampleISO);
+
+  beforeEach(() => {
+    // 重置时区
+    dayjs.tz.setDefault();
+    setCurrentTimezone(); // 重置为系统默认
+  });
+
+  afterEach(() => {
+    vi.restoreAllMocks();
+  });
+
+  // ===============================
+  // formatDate
+  // ===============================
+  describe('formatDate', () => {
+    it('should format a valid ISO date string', () => {
+      const formatted = formatDate(sampleISO, 'YYYY/MM/DD');
+      expect(formatted).toMatch(/2024\/10\/30/);
+    });
+
+    it('should format a timestamp correctly', () => {
+      const formatted = formatDate(sampleTimestamp);
+      expect(formatted).toMatch(/2024-10-30/);
+    });
+
+    it('should format a Date object', () => {
+      const formatted = formatDate(new Date(sampleISO));
+      expect(formatted).toMatch(/2024-10-30/);
+    });
+
+    it('should format a dayjs object', () => {
+      const formatted = formatDate(dayjs(sampleISO));
+      expect(formatted).toMatch(/2024-10-30/);
+    });
+
+    it('should return original input if date is invalid', () => {
+      const invalid = 'not-a-date';
+      const spy = vi.spyOn(console, 'error').mockImplementation(() => {});
+      const formatted = formatDate(invalid);
+      expect(formatted).toBe(invalid);
+      expect(spy).toHaveBeenCalledOnce();
+    });
+
+    it('should apply given format', () => {
+      const formatted = formatDate(sampleISO, 'YYYY-MM-DD HH:mm');
+      expect(formatted).toMatch(/\d{4}-\d{2}-\d{2} \d{2}:\d{2}/);
+    });
+  });
+
+  // ===============================
+  // formatDateTime
+  // ===============================
+  describe('formatDateTime', () => {
+    it('should format date into full datetime', () => {
+      const result = formatDateTime(sampleISO);
+      expect(result).toMatch(/2024-10-30 \d{2}:\d{2}:\d{2}/);
+    });
+  });
+
+  // ===============================
+  // isDate
+  // ===============================
+  describe('isDate', () => {
+    it('should return true for Date instances', () => {
+      expect(isDate(new Date())).toBe(true);
+    });
+
+    it('should return false for non-Date values', () => {
+      expect(isDate('2024-10-30')).toBe(false);
+      expect(isDate(null)).toBe(false);
+      expect(isDate(undefined)).toBe(false);
+    });
+  });
+
+  // ===============================
+  // isDayjsObject
+  // ===============================
+  describe('isDayjsObject', () => {
+    it('should return true for dayjs objects', () => {
+      expect(isDayjsObject(dayjs())).toBe(true);
+    });
+
+    it('should return false for other values', () => {
+      expect(isDayjsObject(new Date())).toBe(false);
+      expect(isDayjsObject('string')).toBe(false);
+    });
+  });
+
+  // ===============================
+  // getSystemTimezone
+  // ===============================
+  describe('getSystemTimezone', () => {
+    it('should return a valid IANA timezone string', () => {
+      const tz = getSystemTimezone();
+      expect(typeof tz).toBe('string');
+      expect(tz).toMatch(/^[A-Z]+\/[A-Z_]+/i);
+    });
+  });
+
+  // ===============================
+  // setCurrentTimezone / getCurrentTimezone
+  // ===============================
+  describe('setCurrentTimezone & getCurrentTimezone', () => {
+    it('should set and retrieve the current timezone', () => {
+      setCurrentTimezone('Asia/Shanghai');
+      expect(getCurrentTimezone()).toBe('Asia/Shanghai');
+    });
+
+    it('should reset to system timezone when called with no args', () => {
+      const guessed = getSystemTimezone();
+      setCurrentTimezone();
+      expect(getCurrentTimezone()).toBe(guessed);
+    });
+
+    it('should update dayjs default timezone', () => {
+      setCurrentTimezone('America/New_York');
+      const d = dayjs('2024-01-01T00:00:00Z');
+      // 校验时区转换生效（小时变化）
+      expect(d.tz().format('HH')).not.toBe('00');
+    });
+  });
+});
diff --git a/packages/@core/base/shared/src/utils/__tests__/diff.test.ts b/packages/@core/base/shared/src/utils/__tests__/diff.test.ts
index cb3227b5..edcaa050 100644
--- a/packages/@core/base/shared/src/utils/__tests__/diff.test.ts
+++ b/packages/@core/base/shared/src/utils/__tests__/diff.test.ts
@@ -1,6 +1,6 @@
 import { describe, expect, it } from 'vitest';
 
-import { diff } from '../diff';
+import { diff, diffStrict } from '../diff';
 
 describe('diff function', () => {
   it('should return an empty object when comparing identical objects', () => {
@@ -27,6 +27,12 @@ describe('diff function', () => {
     expect(diff(obj1, obj2)).toEqual({ a: [1, 2, 4] });
   });
 
+  it('should ignore array order changes', () => {
+    const obj1 = { a: [1, 2, 3] };
+    const obj2 = { a: [3, 2, 1] };
+    expect(diff(obj1, obj2)).toEqual(undefined);
+  });
+
   it('should handle added keys', () => {
     const obj1 = { a: 1 };
     const obj2 = { a: 1, b: 2 };
@@ -51,3 +57,31 @@ describe('diff function', () => {
     expect(diff(obj1, obj2)).toEqual({ a: 1 });
   });
 });
+
+describe('diffStrict function', () => {
+  it('should return undefined when comparing identical objects', () => {
+    const obj1 = { a: 1, b: { c: 2 }, d: [1, 2, 3] };
+    const obj2 = { a: 1, b: { c: 2 }, d: [1, 2, 3] };
+    expect(diffStrict(obj1, obj2)).toEqual(undefined);
+  });
+
+  it('should detect array order changes', () => {
+    const obj1 = { a: ['search', 'theme', 'logout'] };
+    const obj2 = { a: ['logout', 'theme', 'search'] };
+    expect(diffStrict(obj1, obj2)).toEqual({
+      a: ['logout', 'theme', 'search'],
+    });
+  });
+
+  it('should detect array element changes', () => {
+    const obj1 = { a: [1, 2, 3] };
+    const obj2 = { a: [1, 2, 4] };
+    expect(diffStrict(obj1, obj2)).toEqual({ a: [1, 2, 4] });
+  });
+
+  it('should detect nested object changes', () => {
+    const obj1 = { a: 1, b: { c: 2, d: 4 } };
+    const obj2 = { a: 1, b: { c: 3, d: 4 } };
+    expect(diffStrict(obj1, obj2)).toEqual({ b: { c: 3 } });
+  });
+});
diff --git a/packages/@core/base/shared/src/utils/__tests__/dom.test.ts b/packages/@core/base/shared/src/utils/__tests__/dom.test.ts
index df51268a..33df4d50 100644
--- a/packages/@core/base/shared/src/utils/__tests__/dom.test.ts
+++ b/packages/@core/base/shared/src/utils/__tests__/dom.test.ts
@@ -1,6 +1,11 @@
-import { beforeEach, describe, expect, it, vi } from 'vitest';
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
 
-import { getElementVisibleRect } from '../dom';
+import { ELEMENT_ID_LAYOUT_SCROLL } from '../../constants';
+import {
+  getElementVisibleRect,
+  getLayoutScrollElement,
+  needsScrollbar,
+} from '../dom';
 
 describe('getElementVisibleRect', () => {
   // 设置浏览器视口尺寸的 mock
@@ -15,6 +20,10 @@ describe('getElementVisibleRect', () => {
     vi.spyOn(window, 'innerWidth', 'get').mockReturnValue(1000);
   });
 
+  afterEach(() => {
+    vi.restoreAllMocks();
+  });
+
   it('should return default rect if element is undefined', () => {
     expect(getElementVisibleRect()).toEqual({
       bottom: 0,
@@ -116,12 +125,84 @@ describe('getElementVisibleRect', () => {
     } as HTMLElement;
 
     expect(getElementVisibleRect(element)).toEqual({
-      bottom: 800,
+      bottom: 0,
       height: 0,
-      left: 1100,
-      right: 1000,
-      top: 900,
+      left: 0,
+      right: 0,
+      top: 0,
       width: 0,
     });
   });
 });
+
+describe('getLayoutScrollElement', () => {
+  afterEach(() => {
+    document.body.innerHTML = '';
+  });
+
+  it('should return the layout scroll element', () => {
+    const element = document.createElement('div');
+    element.id = ELEMENT_ID_LAYOUT_SCROLL;
+    document.body.append(element);
+
+    expect(getLayoutScrollElement()).toBe(element);
+  });
+
+  it('should return null when the layout scroll element is missing', () => {
+    expect(getLayoutScrollElement()).toBeNull();
+  });
+});
+
+describe('needsScrollbar', () => {
+  afterEach(() => {
+    vi.restoreAllMocks();
+  });
+
+  it('should check scrollbar state from target element', () => {
+    const element = document.createElement('div');
+    vi.spyOn(element, 'clientHeight', 'get').mockReturnValue(100);
+    vi.spyOn(element, 'scrollHeight', 'get').mockReturnValue(120);
+    vi.spyOn(window, 'getComputedStyle').mockReturnValue({
+      overflowY: 'auto',
+    } as CSSStyleDeclaration);
+
+    expect(needsScrollbar(element)).toBe(true);
+  });
+
+  it('should return false when target content does not overflow', () => {
+    const element = document.createElement('div');
+    vi.spyOn(element, 'clientHeight', 'get').mockReturnValue(100);
+    vi.spyOn(element, 'scrollHeight', 'get').mockReturnValue(100);
+    vi.spyOn(window, 'getComputedStyle').mockReturnValue({
+      overflowY: 'auto',
+    } as CSSStyleDeclaration);
+
+    expect(needsScrollbar(element)).toBe(false);
+  });
+
+  it.each(['clip', 'hidden'])(
+    'should ignore %s overflow targets',
+    (overflowY) => {
+      const element = document.createElement('div');
+      vi.spyOn(element, 'clientHeight', 'get').mockReturnValue(100);
+      vi.spyOn(element, 'scrollHeight', 'get').mockReturnValue(120);
+      vi.spyOn(window, 'getComputedStyle').mockReturnValue({
+        overflowY,
+      } as CSSStyleDeclaration);
+
+      expect(needsScrollbar(element)).toBe(false);
+    },
+  );
+
+  it('should fall back to document scrollbar state', () => {
+    vi.spyOn(document.documentElement, 'scrollHeight', 'get').mockReturnValue(
+      120,
+    );
+    vi.spyOn(window, 'innerHeight', 'get').mockReturnValue(100);
+    vi.spyOn(window, 'getComputedStyle').mockReturnValue({
+      overflowY: 'auto',
+    } as CSSStyleDeclaration);
+
+    expect(needsScrollbar()).toBe(true);
+  });
+});
diff --git a/packages/@core/base/shared/src/utils/__tests__/resources.test.ts b/packages/@core/base/shared/src/utils/__tests__/resources.test.ts
new file mode 100644
index 00000000..6fb2db55
--- /dev/null
+++ b/packages/@core/base/shared/src/utils/__tests__/resources.test.ts
@@ -0,0 +1,82 @@
+import { beforeEach, describe, expect, it, vi } from 'vitest';
+
+import { loadScript } from '../resources';
+
+describe('loadScript', () => {
+  beforeEach(() => {
+    // 每个测试前清空 head，保证环境干净
+    document.head.innerHTML = '';
+  });
+
+  it('should resolve when the script loads successfully', async () => {
+    // happy-dom v20+ auto-fires 'load' via handleDisabledFileLoadingAsSuccess
+    const promise = loadScript('/test-script.js');
+
+    const script = document.querySelector(
+      'script[src="/test-script.js"]',
+    ) as HTMLScriptElement;
+    expect(script).toBeTruthy();
+
+    await expect(promise).resolves.toBeUndefined();
+  });
+
+  it('should not insert duplicate script and resolve immediately if already loaded', async () => {
+    // 先手动插入一个相同 src 的 script
+    const existing = document.createElement('script');
+    existing.src = 'bar.js';
+    document.head.append(existing);
+
+    // 再次调用
+    const promise = loadScript('bar.js');
+
+    // 立即 resolve
+    await expect(promise).resolves.toBeUndefined();
+
+    // head 中只保留一个
+    const scripts = document.head.querySelectorAll('script[src="bar.js"]');
+    expect(scripts).toHaveLength(1);
+  });
+
+  it('should reject when the script fails to load', async () => {
+    let capturedScript: HTMLScriptElement | null = null;
+
+    // 拦截 append，捕获 script 元素但不插入 DOM，
+    // 防止 happy-dom v20+ 自动触发 load 事件
+    const appendSpy = vi
+      .spyOn(document.head, 'append')
+      .mockImplementation((...nodes) => {
+        for (const node of nodes) {
+          if (node instanceof HTMLScriptElement) {
+            capturedScript = node;
+          }
+        }
+      });
+
+    const promise = loadScript('error.js');
+
+    appendSpy.mockRestore();
+
+    expect(capturedScript).toBeTruthy();
+    if (!capturedScript) {
+      throw new Error('Expected the captured script element to exist');
+    }
+    capturedScript.dispatchEvent(new Event('error'));
+
+    await expect(promise).rejects.toThrow('Failed to load script: error.js');
+  });
+
+  it('should handle multiple concurrent calls and only insert one script tag', async () => {
+    const p1 = loadScript('/test-script.js');
+    const p2 = loadScript('/test-script.js');
+
+    // happy-dom v20+ auto-fires 'load'，两个 promise 都应该 resolve
+    await expect(p1).resolves.toBeUndefined();
+    await expect(p2).resolves.toBeUndefined();
+
+    // 只插入一次
+    const scripts = document.head.querySelectorAll(
+      'script[src="/test-script.js"]',
+    );
+    expect(scripts).toHaveLength(1);
+  });
+});
diff --git a/packages/@core/base/shared/src/utils/__tests__/stack.test.ts b/packages/@core/base/shared/src/utils/__tests__/stack.test.ts
new file mode 100644
index 00000000..2803ef24
--- /dev/null
+++ b/packages/@core/base/shared/src/utils/__tests__/stack.test.ts
@@ -0,0 +1,107 @@
+import { beforeEach, describe, expect, it } from 'vitest';
+
+import { createStack, Stack } from '../stack';
+
+describe('stack', () => {
+  let stack: Stack<number>;
+
+  beforeEach(() => {
+    stack = new Stack<number>();
+  });
+
+  it('push & size should work', () => {
+    stack.push(1, 2);
+
+    expect(stack.size).toBe(2);
+  });
+
+  it('peek should return top element without removing it', () => {
+    stack.push(1, 2);
+
+    expect(stack.peek()).toBe(2);
+    expect(stack.size).toBe(2);
+  });
+
+  it('pop should remove and return top element', () => {
+    stack.push(1, 2);
+
+    expect(stack.pop()).toBe(2);
+    expect(stack.size).toBe(1);
+    expect(stack.peek()).toBe(1);
+  });
+
+  it('pop on empty stack should return undefined', () => {
+    expect(stack.pop()).toBeUndefined();
+    expect(stack.peek()).toBeUndefined();
+  });
+
+  it('clear should remove all elements', () => {
+    stack.push(1, 2);
+
+    stack.clear();
+
+    expect(stack.size).toBe(0);
+    expect(stack.peek()).toBeUndefined();
+  });
+
+  it('toArray should return a shallow copy', () => {
+    stack.push(1, 2);
+
+    const arr = stack.toArray();
+    arr.push(3);
+
+    expect(stack.size).toBe(2);
+    expect(stack.toArray()).toEqual([1, 2]);
+  });
+
+  it('dedup should remove existing item before push', () => {
+    stack.push(1, 2, 1);
+
+    expect(stack.toArray()).toEqual([2, 1]);
+    expect(stack.size).toBe(2);
+  });
+
+  it('dedup = false should allow duplicate items', () => {
+    const s = new Stack<number>(false);
+
+    s.push(1, 1, 1);
+
+    expect(s.toArray()).toEqual([1, 1, 1]);
+    expect(s.size).toBe(3);
+  });
+
+  it('remove should delete all matching items', () => {
+    stack.push(1, 2, 1);
+
+    stack.remove(1);
+
+    expect(stack.toArray()).toEqual([2]);
+    expect(stack.size).toBe(1);
+  });
+
+  it('maxSize should limit stack capacity', () => {
+    const s = new Stack<number>(true, 3);
+
+    s.push(1, 2, 3, 4);
+
+    expect(s.toArray()).toEqual([2, 3, 4]);
+    expect(s.size).toBe(3);
+  });
+
+  it('dedup + maxSize should work together', () => {
+    const s = new Stack<number>(true, 3);
+
+    s.push(1, 2, 3, 2); // 去重并重新入栈
+
+    expect(s.toArray()).toEqual([1, 3, 2]);
+    expect(s.size).toBe(3);
+  });
+
+  it('createStack should create a stack instance', () => {
+    const s = createStack<number>(true, 2);
+
+    s.push(1, 2, 3);
+
+    expect(s.toArray()).toEqual([2, 3]);
+  });
+});
diff --git a/packages/@core/base/shared/src/utils/__tests__/state-handler.test.ts b/packages/@core/base/shared/src/utils/__tests__/state-handler.test.ts
index d11be068..94844c20 100644
--- a/packages/@core/base/shared/src/utils/__tests__/state-handler.test.ts
+++ b/packages/@core/base/shared/src/utils/__tests__/state-handler.test.ts
@@ -34,7 +34,9 @@ describe('stateHandler', () => {
     }, 10);
 
     // 等待过程中，期望 Promise 被 reject
-    await expect(handler.waitForCondition()).rejects.toThrow();
+    await expect(handler.waitForCondition()).rejects.toThrow(
+      'Condition was set to false',
+    );
     expect(handler.isConditionTrue()).toBe(false);
   });
 
diff --git a/packages/@core/base/shared/src/utils/__tests__/update-css-variables.test.ts b/packages/@core/base/shared/src/utils/__tests__/update-css-variables.test.ts
index 4a9cdadc..3d1113c0 100644
--- a/packages/@core/base/shared/src/utils/__tests__/update-css-variables.test.ts
+++ b/packages/@core/base/shared/src/utils/__tests__/update-css-variables.test.ts
@@ -28,3 +28,21 @@ it('updateCSSVariables should update CSS variables in :root selector', () => {
       updatedStyleContent?.includes('fontSize: 16px;'),
   ).toBe(true);
 });
+
+it('updateCSSVariables should support a custom selector', () => {
+  document.head.innerHTML = `<style id="tdesign-styles"></style>`;
+
+  // 使用自定义选择器（如 TDesign 的 theme-mode 选择器）更新 CSS 变量
+  updateCSSVariables(
+    { '--td-brand-color': 'rgb(0, 82, 217)' },
+    'tdesign-styles',
+    ":root[theme-mode='dark']",
+  );
+
+  const styleElement = document.querySelector('#tdesign-styles');
+  const content = styleElement?.textContent ?? '';
+
+  // 选择器与变量都应正确写入
+  expect(content.startsWith(":root[theme-mode='dark'] {")).toBe(true);
+  expect(content.includes('--td-brand-color: rgb(0, 82, 217);')).toBe(true);
+});
diff --git a/packages/@core/base/shared/src/utils/__tests__/util.test.ts b/packages/@core/base/shared/src/utils/__tests__/util.test.ts
index 0d87b318..ccdeb969 100644
--- a/packages/@core/base/shared/src/utils/__tests__/util.test.ts
+++ b/packages/@core/base/shared/src/utils/__tests__/util.test.ts
@@ -56,12 +56,6 @@ describe('bindMethods', () => {
 
   it('should not bind getter/setter properties', () => {
     class TestWithGetterSetter {
-      private _value: string = 'test';
-
-      constructor() {
-        bindMethods(this);
-      }
-
       get value() {
         return this._value;
       }
@@ -69,6 +63,12 @@ describe('bindMethods', () => {
       set value(newValue: string) {
         this._value = newValue;
       }
+
+      private _value: string = 'test';
+
+      constructor() {
+        bindMethods(this);
+      }
     }
 
     const instance = new TestWithGetterSetter();
@@ -138,8 +138,10 @@ describe('getNestedValue', () => {
     expect(result).toBe(2);
   });
 
-  it('should return the entire object if path is empty', () => {
-    expect(() => getNestedValue(data, '')()).toThrow();
+  it('should throw if path is empty', () => {
+    expect(() => getNestedValue(data, '')).toThrow(
+      'Path must be a non-empty string',
+    );
   });
 
   it('should handle paths with array indexes', () => {
diff --git a/packages/@core/base/shared/src/utils/cn.ts b/packages/@core/base/shared/src/utils/cn.ts
index 5503cc58..3a2f9773 100644
--- a/packages/@core/base/shared/src/utils/cn.ts
+++ b/packages/@core/base/shared/src/utils/cn.ts
@@ -1,4 +1,6 @@
-import { type ClassValue, clsx } from 'clsx';
+import type { ClassValue } from 'clsx';
+
+import { clsx } from 'clsx';
 import { twMerge } from 'tailwind-merge';
 
 function cn(...inputs: ClassValue[]) {
diff --git a/packages/@core/base/shared/src/utils/date.ts b/packages/@core/base/shared/src/utils/date.ts
index 3736b9ad..784b9778 100644
--- a/packages/@core/base/shared/src/utils/date.ts
+++ b/packages/@core/base/shared/src/utils/date.ts
@@ -1,19 +1,41 @@
 import dayjs from 'dayjs';
+import timezone from 'dayjs/plugin/timezone.js';
+import utc from 'dayjs/plugin/utc.js';
 
-export function formatDate(time: number | string, format = 'YYYY-MM-DD') {
+dayjs.extend(utc);
+dayjs.extend(timezone);
+
+type FormatDate = Date | dayjs.Dayjs | number | string;
+
+type Format =
+  | 'HH'
+  | 'HH:mm'
+  | 'HH:mm:ss'
+  | 'YYYY'
+  | 'YYYY-MM'
+  | 'YYYY-MM-DD'
+  | 'YYYY-MM-DD HH'
+  | 'YYYY-MM-DD HH:mm'
+  | 'YYYY-MM-DD HH:mm:ss'
+  | (string & {});
+
+export function formatDate(time?: FormatDate, format: Format = 'YYYY-MM-DD') {
+  if (time === undefined || time === null || time === '') {
+    return '';
+  }
   try {
-    const date = dayjs(time);
+    const date = dayjs.isDayjs(time) ? time : dayjs(time);
     if (!date.isValid()) {
       throw new Error('Invalid date');
     }
-    return date.format(format);
+    return date.tz().format(format);
   } catch (error) {
     console.error(`Error formatting date: ${error}`);
-    return time;
+    return String(time ?? '');
   }
 }
 
-export function formatDateTime(time: number | string) {
+export function formatDateTime(time?: FormatDate) {
   return formatDate(time, 'YYYY-MM-DD HH:mm:ss');
 }
 
@@ -24,3 +46,33 @@ export function isDate(value: any): value is Date {
 export function isDayjsObject(value: any): value is dayjs.Dayjs {
   return dayjs.isDayjs(value);
 }
+
+/**
+ * 获取当前时区
+ * @returns 当前时区
+ */
+export const getSystemTimezone = () => {
+  return dayjs.tz.guess();
+};
+
+/**
+ * 自定义设置的时区
+ */
+let currentTimezone = getSystemTimezone();
+
+/**
+ * 设置默认时区
+ * @param timezone
+ */
+export const setCurrentTimezone = (timezone?: string) => {
+  currentTimezone = timezone || getSystemTimezone();
+  dayjs.tz.setDefault(currentTimezone);
+};
+
+/**
+ * 获取设置的时区
+ * @returns 设置的时区
+ */
+export const getCurrentTimezone = () => {
+  return currentTimezone;
+};
diff --git a/packages/@core/base/shared/src/utils/diff.ts b/packages/@core/base/shared/src/utils/diff.ts
index 449214d7..1b1c8b2c 100644
--- a/packages/@core/base/shared/src/utils/diff.ts
+++ b/packages/@core/base/shared/src/utils/diff.ts
@@ -1,6 +1,6 @@
 // type Diff<T = any> = T;
 
-// 比较两个数组是否相等
+// 比较两个数组是否相等（忽略顺序）
 
 function arraysEqual<T>(a: T[], b: T[]): boolean {
   if (a.length !== b.length) return false;
@@ -18,6 +18,11 @@ function arraysEqual<T>(a: T[], b: T[]): boolean {
   return true;
 }
 
+// 比较两个数组是否相等（顺序敏感）
+function arraysStrictEqual<T>(a: T[], b: T[]): boolean {
+  return a.length === b.length && a.every((value, index) => value === b[index]);
+}
+
 // 深度对比两个值
 // function deepEqual<T>(oldVal: T, newVal: T): boolean {
 //   if (
@@ -59,38 +64,51 @@ type DiffResult<T> = Partial<{
   [K in keyof T]: T[K] extends object ? DiffResult<T[K]> : T[K];
 }>;
 
-function diff<T extends Record<string, any>>(obj1: T, obj2: T): DiffResult<T> {
-  function findDifferences(o1: any, o2: any): any {
-    if (Array.isArray(o1) && Array.isArray(o2)) {
-      if (!arraysEqual(o1, o2)) {
-        return o2;
-      }
-      return undefined;
-    }
+type ArrayComparator = (a: any[], b: any[]) => boolean;
 
-    if (
-      typeof o1 === 'object' &&
-      typeof o2 === 'object' &&
-      o1 !== null &&
-      o2 !== null
-    ) {
-      const diffResult: any = {};
-
-      const keys = new Set([...Object.keys(o1), ...Object.keys(o2)]);
-      keys.forEach((key) => {
-        const valueDiff = findDifferences(o1[key], o2[key]);
-        if (valueDiff !== undefined) {
-          diffResult[key] = valueDiff;
+function createDiff(arrayEquals: ArrayComparator) {
+  return function <T extends Record<string, any>>(
+    obj1: T,
+    obj2: T,
+  ): DiffResult<T> {
+    function findDifferences(o1: any, o2: any): any {
+      if (Array.isArray(o1) && Array.isArray(o2)) {
+        if (!arrayEquals(o1, o2)) {
+          return o2;
         }
-      });
+        return undefined;
+      }
 
-      return Object.keys(diffResult).length > 0 ? diffResult : undefined;
+      if (
+        typeof o1 === 'object' &&
+        typeof o2 === 'object' &&
+        o1 !== null &&
+        o2 !== null
+      ) {
+        const diffResult: any = {};
+
+        const keys = new Set([...Object.keys(o1), ...Object.keys(o2)]);
+        keys.forEach((key) => {
+          const valueDiff = findDifferences(o1[key], o2[key]);
+          if (valueDiff !== undefined) {
+            diffResult[key] = valueDiff;
+          }
+        });
+
+        return Object.keys(diffResult).length > 0 ? diffResult : undefined;
+      }
+
+      return o1 === o2 ? undefined : o2;
     }
 
-    return o1 === o2 ? undefined : o2;
-  }
-
-  return findDifferences(obj1, obj2);
+    return findDifferences(obj1, obj2);
+  };
 }
 
-export { arraysEqual, diff };
+// 数组比较（不含顺序）
+const diff = createDiff(arraysEqual);
+
+// 数组比较（含顺序）
+const diffStrict = createDiff(arraysStrictEqual);
+
+export { arraysEqual, arraysStrictEqual, diff, diffStrict };
diff --git a/packages/@core/base/shared/src/utils/dom.ts b/packages/@core/base/shared/src/utils/dom.ts
index 69617176..7c9af078 100644
--- a/packages/@core/base/shared/src/utils/dom.ts
+++ b/packages/@core/base/shared/src/utils/dom.ts
@@ -1,3 +1,5 @@
+import { ELEMENT_ID_LAYOUT_SCROLL } from '../constants/globals';
+
 export interface VisibleDomRect {
   bottom: number;
   height: number;
@@ -41,6 +43,18 @@ export function getElementVisibleRect(
   const left = Math.max(rect.left, 0);
   const right = Math.min(rect.right, viewWidth);
 
+  // 如果元素完全不可见，则返回一个空的矩形
+  if (top >= viewHeight || bottom <= 0 || left >= viewWidth || right <= 0) {
+    return {
+      bottom: 0,
+      height: 0,
+      left: 0,
+      right: 0,
+      top: 0,
+      width: 0,
+    };
+  }
+
   return {
     bottom,
     height: Math.max(0, bottom - top),
@@ -70,7 +84,24 @@ export function getScrollbarWidth() {
   return scrollbarWidth;
 }
 
-export function needsScrollbar() {
+export function getLayoutScrollElement() {
+  return document.querySelector<HTMLElement>(`#${ELEMENT_ID_LAYOUT_SCROLL}`);
+}
+
+function elementNeedsScrollbar(element: HTMLElement) {
+  const overflowY = window.getComputedStyle(element).overflowY;
+  if (overflowY === 'hidden' || overflowY === 'clip') {
+    return false;
+  }
+
+  return element.scrollHeight > element.clientHeight;
+}
+
+export function needsScrollbar(target?: HTMLElement | null) {
+  if (target) {
+    return elementNeedsScrollbar(target);
+  }
+
   const doc = document.documentElement;
   const body = document.body;
 
diff --git a/packages/@core/base/shared/src/utils/download.ts b/packages/@core/base/shared/src/utils/download.ts
index 3e708d3c..6f38ee5b 100644
--- a/packages/@core/base/shared/src/utils/download.ts
+++ b/packages/@core/base/shared/src/utils/download.ts
@@ -31,6 +31,7 @@ export async function downloadFileFromUrl({
 
   if (isChrome || isSafari) {
     triggerDownload(source, resolveFileName(source, fileName));
+    return;
   }
   if (!source.includes('?')) {
     source += '?download';
diff --git a/packages/@core/base/shared/src/utils/index.ts b/packages/@core/base/shared/src/utils/index.ts
index 1bf09c71..991b7419 100644
--- a/packages/@core/base/shared/src/utils/index.ts
+++ b/packages/@core/base/shared/src/utils/index.ts
@@ -7,6 +7,8 @@ export * from './inference';
 export * from './letter';
 export * from './merge';
 export * from './nprogress';
+export * from './resources';
+export * from './stack';
 export * from './state-handler';
 export * from './to';
 export * from './tree';
@@ -14,6 +16,6 @@ export * from './unique';
 export * from './update-css-variables';
 export * from './util';
 export * from './window';
+export { debounce, get, isEqual, set } from 'es-toolkit/compat';
+// export { cloneDeep } from 'es-toolkit/object';
 export { default as cloneDeep } from 'lodash.clonedeep';
-export { default as get } from 'lodash.get';
-export { default as isEqual } from 'lodash.isequal';
diff --git a/packages/@core/base/shared/src/utils/resources.ts b/packages/@core/base/shared/src/utils/resources.ts
new file mode 100644
index 00000000..c5afa7f1
--- /dev/null
+++ b/packages/@core/base/shared/src/utils/resources.ts
@@ -0,0 +1,21 @@
+/**
+ * 加载js文件
+ * @param src js文件地址
+ */
+function loadScript(src: string) {
+  return new Promise<void>((resolve, reject) => {
+    if (document.querySelector(`script[src="${src}"]`)) {
+      // 如果已经加载过，直接 resolve
+      return resolve();
+    }
+    const script = document.createElement('script');
+    script.src = src;
+    script.addEventListener('load', () => resolve());
+    script.addEventListener('error', () =>
+      reject(new Error(`Failed to load script: ${src}`)),
+    );
+    document.head.append(script);
+  });
+}
+
+export { loadScript };
diff --git a/packages/@core/base/shared/src/utils/stack.ts b/packages/@core/base/shared/src/utils/stack.ts
new file mode 100644
index 00000000..d8f5d4af
--- /dev/null
+++ b/packages/@core/base/shared/src/utils/stack.ts
@@ -0,0 +1,103 @@
+/**
+ * @zh_CN 栈数据结构
+ */
+export class Stack<T> {
+  /**
+   * @zh_CN 栈内元素数量
+   */
+  get size() {
+    return this.items.length;
+  }
+  /**
+   * @zh_CN 是否去重
+   */
+  private readonly dedup: boolean;
+  /**
+   * @zh_CN 栈内元素
+   */
+  private items: T[] = [];
+
+  /**
+   * @zh_CN 栈的最大容量
+   */
+  private readonly maxSize?: number;
+
+  constructor(dedup = true, maxSize?: number) {
+    this.maxSize = maxSize;
+    this.dedup = dedup;
+  }
+
+  /**
+   * @zh_CN 清空栈内元素
+   */
+  clear() {
+    this.items.length = 0;
+  }
+
+  /**
+   * @zh_CN 查看栈顶元素
+   * @returns 栈顶元素
+   */
+  peek(): T | undefined {
+    return this.items[this.items.length - 1];
+  }
+
+  /**
+   * @zh_CN 出栈
+   * @returns 栈顶元素
+   */
+  pop(): T | undefined {
+    return this.items.pop();
+  }
+
+  /**
+   * @zh_CN 入栈
+   * @param items 要入栈的元素
+   */
+  push(...items: T[]) {
+    items.forEach((item) => {
+      // 去重
+      if (this.dedup) {
+        const index = this.items.indexOf(item);
+        if (index !== -1) {
+          this.items.splice(index, 1);
+        }
+      }
+      this.items.push(item);
+      if (this.maxSize && this.items.length > this.maxSize) {
+        this.items.splice(0, this.items.length - this.maxSize);
+      }
+    });
+  }
+  /**
+   * @zh_CN 移除栈内元素
+   * @param itemList 要移除的元素列表
+   */
+  remove(...itemList: T[]) {
+    this.items = this.items.filter((i) => !itemList.includes(i));
+  }
+  /**
+   * @zh_CN 保留栈内元素
+   * @param itemList 要保留的元素列表
+   */
+  retain(itemList: T[]) {
+    this.items = this.items.filter((i) => itemList.includes(i));
+  }
+
+  /**
+   * @zh_CN 转换为数组
+   * @returns 栈内元素数组
+   */
+  toArray(): T[] {
+    return [...this.items];
+  }
+}
+
+/**
+ * @zh_CN 创建一个栈实例
+ * @param dedup 是否去重
+ * @param maxSize 栈的最大容量
+ * @returns 栈实例
+ */
+export const createStack = <T>(dedup = true, maxSize?: number) =>
+  new Stack<T>(dedup, maxSize);
diff --git a/packages/@core/base/shared/src/utils/state-handler.ts b/packages/@core/base/shared/src/utils/state-handler.ts
index cef1bd8f..a8bbe4f8 100644
--- a/packages/@core/base/shared/src/utils/state-handler.ts
+++ b/packages/@core/base/shared/src/utils/state-handler.ts
@@ -1,14 +1,8 @@
 export class StateHandler {
   private condition: boolean = false;
-  private rejectCondition: (() => void) | null = null;
+  private rejectCondition: ((reason?: Error) => void) | null = null;
   private resolveCondition: (() => void) | null = null;
 
-  // 清理 resolve/reject 函数
-  private clearPromises() {
-    this.resolveCondition = null;
-    this.rejectCondition = null;
-  }
-
   isConditionTrue(): boolean {
     return this.condition;
   }
@@ -22,7 +16,7 @@ export class StateHandler {
   setConditionFalse() {
     this.condition = false;
     if (this.rejectCondition) {
-      this.rejectCondition();
+      this.rejectCondition(new Error('Condition was set to false'));
       this.clearPromises();
     }
   }
@@ -47,4 +41,10 @@ export class StateHandler {
       }
     });
   }
+
+  // 清理 resolve/reject 函数
+  private clearPromises() {
+    this.resolveCondition = null;
+    this.rejectCondition = null;
+  }
 }
diff --git a/packages/@core/base/shared/src/utils/tree.ts b/packages/@core/base/shared/src/utils/tree.ts
index 09a9481c..1a8a2eca 100644
--- a/packages/@core/base/shared/src/utils/tree.ts
+++ b/packages/@core/base/shared/src/utils/tree.ts
@@ -79,19 +79,53 @@ function filterTree<T extends Record<string, any>>(
  */
 function mapTree<T, V extends Record<string, any>>(
   tree: T[],
-  mapper: (node: T) => V,
+  mapper: (node: T, parent: null | V) => V,
   options?: TreeConfigOptions,
+  parent: null | V = null,
 ): V[] {
   const { childProps } = options || {
     childProps: 'children',
   };
   return tree.map((node) => {
-    const mapperNode: Record<string, any> = mapper(node);
+    const mapperNode: Record<string, any> = mapper(node, parent as null | V);
     if (mapperNode[childProps]) {
-      mapperNode[childProps] = mapTree(mapperNode[childProps], mapper, options);
+      mapperNode[childProps] = mapTree(
+        mapperNode[childProps],
+        mapper,
+        options,
+        mapperNode as V,
+      );
     }
     return mapperNode as V;
   });
 }
 
-export { filterTree, mapTree, traverseTreeValues };
+/**
+ * 对树形结构数据进行递归排序
+ * @param treeData - 树形数据数组
+ * @param sortFunction - 排序函数，用于定义排序规则
+ * @param options - 配置选项，包括子节点属性名
+ * @returns 排序后的树形数据
+ */
+function sortTree<T extends Record<string, any>>(
+  treeData: T[],
+  sortFunction: (a: T, b: T) => number,
+  options?: TreeConfigOptions,
+): T[] {
+  const { childProps } = options || {
+    childProps: 'children',
+  };
+
+  return treeData.toSorted(sortFunction).map((item) => {
+    const children = item[childProps];
+    if (children && Array.isArray(children) && children.length > 0) {
+      return {
+        ...item,
+        [childProps]: sortTree(children, sortFunction, options),
+      };
+    }
+    return item;
+  });
+}
+
+export { filterTree, mapTree, sortTree, traverseTreeValues };
diff --git a/packages/@core/base/shared/src/utils/update-css-variables.ts b/packages/@core/base/shared/src/utils/update-css-variables.ts
index 657deaa7..296e2e57 100644
--- a/packages/@core/base/shared/src/utils/update-css-variables.ts
+++ b/packages/@core/base/shared/src/utils/update-css-variables.ts
@@ -1,10 +1,15 @@
 /**
  * 更新 CSS 变量的函数
  * @param variables 要更新的 CSS 变量与其新值的映射
+ * @param id 内联样式表的 id，便于复用与覆盖
+ * @param selector CSS 变量挂载的选择器，默认 `:root`。
+ *  对于像 TDesign 这种将变量定义在 `:root[theme-mode='dark']` 等更高优先级选择器下的组件库，
+ *  需要传入相同（或更高）优先级的选择器才能正确覆盖。
  */
 function updateCSSVariables(
   variables: { [key: string]: string },
   id = '__vben-styles__',
+  selector = ':root',
 ): void {
   // 获取或创建内联样式表元素
   const styleElement =
@@ -13,7 +18,7 @@ function updateCSSVariables(
   styleElement.id = id;
 
   // 构建要更新的 CSS 变量的样式文本
-  let cssText = ':root {';
+  let cssText = `${selector} {`;
   for (const key in variables) {
     if (Object.prototype.hasOwnProperty.call(variables, key)) {
       cssText += `${key}: ${variables[key]};`;
diff --git a/packages/@core/base/shared/src/utils/window.ts b/packages/@core/base/shared/src/utils/window.ts
index 4608f4be..2d8697de 100644
--- a/packages/@core/base/shared/src/utils/window.ts
+++ b/packages/@core/base/shared/src/utils/window.ts
@@ -30,7 +30,7 @@ function openWindow(url: string, options: OpenWindowOptions = {}): void {
 function openRouteInNewWindow(path: string) {
   const { hash, origin } = location;
   const fullPath = path.startsWith('/') ? path : `/${path}`;
-  const url = `${origin}${hash ? '/#' : ''}${fullPath}`;
+  const url = `${origin}${hash && !fullPath.startsWith('/#') ? '/#' : ''}${fullPath}`;
   openWindow(url, { target: '_blank' });
 }
 
diff --git a/packages/@core/base/shared/tsdown.config.ts b/packages/@core/base/shared/tsdown.config.ts
new file mode 100644
index 00000000..62be7793
--- /dev/null
+++ b/packages/@core/base/shared/tsdown.config.ts
@@ -0,0 +1,18 @@
+import { defineConfig } from 'tsdown';
+
+export default defineConfig({
+  clean: true,
+  dts: true,
+  entry: {
+    'cache/index': 'src/cache/index.ts',
+    'color/index': 'src/color/index.ts',
+    'constants/index': 'src/constants/index.ts',
+    'global-state': 'src/global-state.ts',
+    store: 'src/store.ts',
+    'utils/index': 'src/utils/index.ts',
+  },
+  format: ['esm'],
+  outExtensions: () => ({
+    dts: '.d.ts',
+  }),
+});
diff --git a/packages/@core/base/typings/build.config.ts b/packages/@core/base/typings/build.config.ts
deleted file mode 100644
index 97e572c5..00000000
--- a/packages/@core/base/typings/build.config.ts
+++ /dev/null
@@ -1,7 +0,0 @@
-import { defineBuildConfig } from 'unbuild';
-
-export default defineBuildConfig({
-  clean: true,
-  declaration: true,
-  entries: ['src/index'],
-});
diff --git a/packages/@core/base/typings/package.json b/packages/@core/base/typings/package.json
index 504e53ed..b90f3df2 100644
--- a/packages/@core/base/typings/package.json
+++ b/packages/@core/base/typings/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vben-core/typings",
-  "version": "5.5.1",
+  "version": "5.7.0",
   "homepage": "https://github.com/vbenjs/vue-vben-admin",
   "bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
   "repository": {
@@ -11,10 +11,11 @@
   "license": "MIT",
   "type": "module",
   "scripts": {
-    "build": "pnpm unbuild"
+    "build": "pnpm exec tsdown"
   },
   "files": [
-    "dist"
+    "dist",
+    "vue-router.d.ts"
   ],
   "main": "./dist/index.mjs",
   "module": "./dist/index.mjs",
@@ -23,6 +24,7 @@
     ".": {
       "types": "./src/index.ts",
       "development": "./src/index.ts",
+      "production": "./src/index.ts",
       "default": "./dist/index.mjs"
     },
     "./vue-router": {
diff --git a/packages/@core/base/typings/src/app.d.ts b/packages/@core/base/typings/src/app.d.ts
index e49a8657..420ca800 100644
--- a/packages/@core/base/typings/src/app.d.ts
+++ b/packages/@core/base/typings/src/app.d.ts
@@ -1,6 +1,8 @@
 type LayoutType =
   | 'full-content'
+  | 'header-mixed-nav'
   | 'header-nav'
+  | 'header-sidebar-nav'
   | 'mixed-nav'
   | 'sidebar-mixed-nav'
   | 'sidebar-nav';
@@ -9,11 +11,18 @@ type ThemeModeType = 'auto' | 'dark' | 'light';
 
 /**
  * 偏好设置按钮位置
- * fixed 固定在右侧
+ * auto 自动（按布局上下文在 header/fixed 间切换）
+ * fixed 固定在屏幕右边缘
  * header 顶栏
- * auto 自动
+ * user-dropdown 用户的下拉弹出框中
+ * none 不显示
  */
-type PreferencesButtonPositionType = 'auto' | 'fixed' | 'header';
+type PreferencesButtonPositionType =
+  | 'auto'
+  | 'fixed'
+  | 'header'
+  | 'none'
+  | 'user-dropdown';
 
 type BuiltinThemeType =
   | 'custom'
@@ -38,6 +47,7 @@ type BuiltinThemeType =
 type ContentCompactType = 'compact' | 'wide';
 
 type LayoutHeaderModeType = 'auto' | 'auto-scroll' | 'fixed' | 'static';
+type LayoutHeaderMenuAlignType = 'center' | 'end' | 'start';
 
 /**
  * 登录过期模式
@@ -57,8 +67,9 @@ type BreadcrumbStyleType = 'background' | 'normal';
  * 权限模式
  * backend 后端权限模式
  * frontend 前端权限模式
+ * mixed 混合权限模式
  */
-type AccessModeType = 'backend' | 'frontend';
+type AccessModeType = 'backend' | 'frontend' | 'mixed';
 
 /**
  * 导航风格
@@ -89,12 +100,22 @@ type PageTransitionType = 'fade' | 'fade-down' | 'fade-slide' | 'fade-up';
  */
 type AuthPageLayoutType = 'panel-center' | 'panel-left' | 'panel-right';
 
+/**
+ * 时区选项
+ */
+interface TimezoneOption {
+  label: string;
+  offset: number;
+  timezone: string;
+}
+
 export type {
   AccessModeType,
   AuthPageLayoutType,
   BreadcrumbStyleType,
   BuiltinThemeType,
   ContentCompactType,
+  LayoutHeaderMenuAlignType,
   LayoutHeaderModeType,
   LayoutType,
   LoginExpiredModeType,
@@ -103,4 +124,5 @@ export type {
   PreferencesButtonPositionType,
   TabsStyleType,
   ThemeModeType,
+  TimezoneOption,
 };
diff --git a/packages/@core/base/typings/src/basic.d.ts b/packages/@core/base/typings/src/basic.d.ts
index fff10e3d..ca7ed972 100644
--- a/packages/@core/base/typings/src/basic.d.ts
+++ b/packages/@core/base/typings/src/basic.d.ts
@@ -8,6 +8,7 @@ type SelectOption = BasicOption;
 type TabOption = BasicOption;
 
 interface BasicUserInfo {
+  [key: string]: any;
   /**
    * 头像
    */
@@ -30,6 +31,12 @@ interface BasicUserInfo {
   username: string;
 }
 
-type ClassType = Array<object | string> | object | string;
+type ClassType =
+  | Array<ClassType>
+  | boolean
+  | null
+  | object
+  | string
+  | undefined;
 
 export type { BasicOption, BasicUserInfo, ClassType, SelectOption, TabOption };
diff --git a/packages/@core/base/typings/src/helper.d.ts b/packages/@core/base/typings/src/helper.d.ts
index 8a6385b4..737b6157 100644
--- a/packages/@core/base/typings/src/helper.d.ts
+++ b/packages/@core/base/typings/src/helper.d.ts
@@ -1,20 +1,38 @@
-import { type ComputedRef, type MaybeRef } from 'vue';
+import type { ComputedRef, MaybeRef } from 'vue';
 
+/**
+ * 类型级递归中增加深度计数
+ */
+type Increment<A extends unknown[]> = [...A, unknown];
 /**
  * 深层递归所有属性为可选
  */
-type DeepPartial<T> = T extends object
-  ? {
-      [P in keyof T]?: DeepPartial<T[P]>;
-    }
-  : T;
+type DeepPartial<
+  T,
+  D extends number = 10,
+  C extends unknown[] = [],
+> = C['length'] extends D
+  ? T
+  : T extends object
+    ? {
+        [P in keyof T]?: DeepPartial<T[P], D, Increment<C>>;
+      }
+    : T;
 
 /**
  * 深层递归所有属性为只读
  */
-type DeepReadonly<T> = {
-  readonly [P in keyof T]: T[P] extends object ? DeepReadonly<T[P]> : T[P];
-};
+type DeepReadonly<
+  T,
+  D extends number = 10,
+  C extends unknown[] = [],
+> = C['length'] extends D
+  ? T
+  : T extends object
+    ? {
+        readonly [P in keyof T]: DeepReadonly<T[P], D, Increment<C>>;
+      }
+    : T;
 
 /**
  * 任意类型的异步函数
@@ -109,6 +127,8 @@ type MergeAll<
 
 type EmitType = (name: Name, ...args: any[]) => void;
 
+type MaybePromise<T> = Promise<T> | T;
+
 export type {
   AnyFunction,
   AnyNormalFunction,
@@ -118,6 +138,7 @@ export type {
   EmitType,
   IntervalHandle,
   MaybeComputedRef,
+  MaybePromise,
   MaybeReadonlyRef,
   Merge,
   MergeAll,
diff --git a/packages/@core/base/typings/src/menu-record.ts b/packages/@core/base/typings/src/menu-record.ts
index 9cb18dcc..8c450995 100644
--- a/packages/@core/base/typings/src/menu-record.ts
+++ b/packages/@core/base/typings/src/menu-record.ts
@@ -1,15 +1,16 @@
+import type { Component } from 'vue';
 import type { RouteRecordRaw } from 'vue-router';
 
-import type { Component } from 'vue';
+import type { Recordable } from './helper';
 
 /**
  * 扩展路由原始对象
  */
-type ExRouteRecordRaw = {
+type ExRouteRecordRaw = RouteRecordRaw & {
   parent?: string;
   parents?: string[];
   path?: any;
-} & RouteRecordRaw;
+};
 
 interface MenuRecordBadgeRaw {
   /**
@@ -67,6 +68,10 @@ interface MenuRecordRaw extends MenuRecordBadgeRaw {
    * 菜单路径，唯一，可当作key
    */
   path: string;
+  /**
+   * 菜单参数
+   */
+  query?: Recordable<any>;
   /**
    * 是否显示菜单
    * @default true
diff --git a/packages/@core/base/typings/src/tabs.ts b/packages/@core/base/typings/src/tabs.ts
index c78a90c5..58f7d264 100644
--- a/packages/@core/base/typings/src/tabs.ts
+++ b/packages/@core/base/typings/src/tabs.ts
@@ -1,3 +1,8 @@
 import type { RouteLocationNormalized } from 'vue-router';
 
-export type TabDefinition = RouteLocationNormalized;
+export interface TabDefinition extends RouteLocationNormalized {
+  /**
+   * 标签页的key
+   */
+  key?: string;
+}
diff --git a/packages/@core/base/typings/src/vue-router.d.ts b/packages/@core/base/typings/src/vue-router.d.ts
index b95bb33b..d7a80fe4 100644
--- a/packages/@core/base/typings/src/vue-router.d.ts
+++ b/packages/@core/base/typings/src/vue-router.d.ts
@@ -1,6 +1,5 @@
-import type { Router, RouteRecordRaw } from 'vue-router';
-
 import type { Component } from 'vue';
+import type { Router, RouteRecordRaw } from 'vue-router';
 
 interface RouteMeta {
   /**
@@ -44,6 +43,14 @@ interface RouteMeta {
     | 'success'
     | 'warning'
     | string;
+  /**
+   * 路由对应dom是否缓存起来
+   */
+  domCached?: boolean;
+  /**
+   * 路由的完整路径作为key（默认true）
+   */
+  fullPathKey?: boolean;
   /**
    * 当前路由的子级在菜单中不展现
    * @default false
@@ -98,6 +105,10 @@ interface RouteMeta {
    * 菜单可以看到，但是访问会被重定向到403
    */
   menuVisibleWithForbidden?: boolean;
+  /**
+   * 不使用基础布局（仅在顶级生效）
+   */
+  noBasicLayout?: boolean;
   /**
    * 在新窗口打开
    */
@@ -117,10 +128,13 @@ interface RouteMeta {
 }
 
 // 定义递归类型以将 RouteRecordRaw 的 component 属性更改为 string
-type RouteRecordStringComponent<T = string> = {
+type RouteRecordStringComponent<T = string> = Omit<
+  RouteRecordRaw,
+  'children' | 'component'
+> & {
   children?: RouteRecordStringComponent<T>[];
   component: T;
-} & Omit<RouteRecordRaw, 'children' | 'component'>;
+};
 
 type ComponentRecordType = Record<string, () => Promise<Component>>;
 
diff --git a/packages/@core/base/typings/tsdown.config.ts b/packages/@core/base/typings/tsdown.config.ts
new file mode 100644
index 00000000..c4f51c5e
--- /dev/null
+++ b/packages/@core/base/typings/tsdown.config.ts
@@ -0,0 +1,11 @@
+import { defineConfig } from 'tsdown';
+
+export default defineConfig({
+  clean: true,
+  dts: true,
+  entry: ['src/index.ts'],
+  format: ['esm'],
+  outExtensions: () => ({
+    dts: '.d.ts',
+  }),
+});
diff --git a/packages/@core/base/typings/vue-router.d.ts b/packages/@core/base/typings/vue-router.d.ts
index 4874bcd7..fc7baa3c 100644
--- a/packages/@core/base/typings/vue-router.d.ts
+++ b/packages/@core/base/typings/vue-router.d.ts
@@ -1,9 +1,8 @@
-/* eslint-disable no-restricted-imports */
-import type { RouteMeta as IRouteMeta } from '@vben-core/typings';
+import type { RouteMeta as IRouteMeta } from './dist/index.d.mts';
 
 import 'vue-router';
 
 declare module 'vue-router' {
-  // eslint-disable-next-line @typescript-eslint/no-empty-object-type
+  // oxlint-disable-next-line typescript/no-empty-object-type
   interface RouteMeta extends IRouteMeta {}
 }
diff --git a/packages/@core/composables/build.config.ts b/packages/@core/composables/build.config.ts
deleted file mode 100644
index 97e572c5..00000000
--- a/packages/@core/composables/build.config.ts
+++ /dev/null
@@ -1,7 +0,0 @@
-import { defineBuildConfig } from 'unbuild';
-
-export default defineBuildConfig({
-  clean: true,
-  declaration: true,
-  entries: ['src/index'],
-});
diff --git a/packages/@core/composables/package.json b/packages/@core/composables/package.json
index 736feefa..de58e59f 100644
--- a/packages/@core/composables/package.json
+++ b/packages/@core/composables/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vben-core/composables",
-  "version": "5.5.1",
+  "version": "5.7.0",
   "homepage": "https://github.com/vbenjs/vue-vben-admin",
   "bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
   "repository": {
@@ -11,7 +11,7 @@
   "license": "MIT",
   "type": "module",
   "scripts": {
-    "build": "pnpm unbuild"
+    "build": "pnpm exec tsdown"
   },
   "files": [
     "dist"
@@ -23,6 +23,7 @@
     ".": {
       "types": "./src/index.ts",
       "development": "./src/index.ts",
+      "production": "./src/index.ts",
       "default": "./dist/index.mjs"
     }
   },
@@ -37,7 +38,7 @@
   "dependencies": {
     "@vben-core/shared": "workspace:*",
     "@vueuse/core": "catalog:",
-    "radix-vue": "catalog:",
+    "reka-ui": "catalog:",
     "sortablejs": "catalog:",
     "vue": "catalog:"
   },
diff --git a/packages/@core/composables/src/__tests__/use-scroll-lock.test.ts b/packages/@core/composables/src/__tests__/use-scroll-lock.test.ts
new file mode 100644
index 00000000..4e30ef9a
--- /dev/null
+++ b/packages/@core/composables/src/__tests__/use-scroll-lock.test.ts
@@ -0,0 +1,129 @@
+import type { App, WritableComputedRef } from 'vue';
+
+import { createApp, nextTick } from 'vue';
+
+import { ELEMENT_ID_LAYOUT_SCROLL } from '@vben-core/shared/constants';
+
+import { afterEach, describe, expect, it, vi } from 'vitest';
+
+import { SCROLL_FIXED_CLASS, useScrollLock } from '../use-scroll-lock';
+
+let activeApp: App | undefined;
+
+function createScrollableElement(id?: string) {
+  const element = document.createElement('div');
+  if (id) {
+    element.id = id;
+  }
+  element.style.overflow = 'auto';
+  Object.defineProperties(element, {
+    clientHeight: { configurable: true, value: 100 },
+    scrollHeight: { configurable: true, value: 120 },
+  });
+  document.body.append(element);
+  return element;
+}
+
+function mountScrollLock(options?: { immediate?: boolean }) {
+  let scrollLock: undefined | WritableComputedRef<boolean>;
+  const host = document.createElement('div');
+  document.body.append(host);
+
+  activeApp = createApp({
+    setup() {
+      scrollLock = useScrollLock(options);
+      return () => null;
+    },
+  });
+  activeApp.mount(host);
+
+  if (!scrollLock) {
+    throw new Error('useScrollLock was not initialized');
+  }
+  return scrollLock;
+}
+
+async function flushMountedLock() {
+  await nextTick();
+  await nextTick();
+}
+
+afterEach(() => {
+  activeApp?.unmount();
+  activeApp = undefined;
+  document.body.innerHTML = '';
+  document.body.style.cssText = '';
+  vi.restoreAllMocks();
+});
+
+describe('useScrollLock', () => {
+  it('should lock the layout scroll element first', async () => {
+    const element = createScrollableElement(ELEMENT_ID_LAYOUT_SCROLL);
+    element.style.setProperty('scrollbar-gutter', 'auto');
+    const scrollLock = mountScrollLock();
+
+    await flushMountedLock();
+
+    expect(scrollLock.value).toBe(true);
+    expect(element.style.overflow).toBe('hidden');
+    expect(element.style.getPropertyValue('scrollbar-gutter')).toBe('stable');
+    expect(document.body.style.overflow).not.toBe('hidden');
+
+    activeApp?.unmount();
+    activeApp = undefined;
+
+    expect(element.style.overflow).toBe('auto');
+    expect(element.style.getPropertyValue('scrollbar-gutter')).toBe('auto');
+  });
+
+  it('should support manual locking', async () => {
+    const element = createScrollableElement(ELEMENT_ID_LAYOUT_SCROLL);
+    const scrollLock = mountScrollLock({ immediate: false });
+
+    await flushMountedLock();
+    expect(scrollLock.value).toBe(false);
+
+    scrollLock.value = true;
+    expect(element.style.overflow).toBe('hidden');
+    expect(element.style.getPropertyValue('scrollbar-gutter')).toBe('stable');
+
+    scrollLock.value = false;
+    expect(element.style.overflow).toBe('auto');
+    expect(element.style.getPropertyValue('scrollbar-gutter')).toBe('');
+  });
+
+  it('should fall back to body and compensate fixed nodes', async () => {
+    document.body.style.overflow = 'auto';
+    Object.defineProperties(document.body, {
+      clientHeight: { configurable: true, value: 100 },
+      scrollHeight: { configurable: true, value: 120 },
+    });
+    vi.spyOn(document.documentElement, 'scrollHeight', 'get').mockReturnValue(
+      120,
+    );
+    vi.spyOn(window, 'innerHeight', 'get').mockReturnValue(100);
+    vi.spyOn(window, 'getComputedStyle').mockReturnValue({
+      overflowY: 'auto',
+    } as CSSStyleDeclaration);
+
+    const fixedNode = document.createElement('div');
+    fixedNode.className = SCROLL_FIXED_CLASS;
+    fixedNode.style.transition = 'opacity 200ms';
+    document.body.append(fixedNode);
+    const scrollLock = mountScrollLock();
+
+    await flushMountedLock();
+
+    expect(scrollLock.value).toBe(true);
+    expect(document.body.style.overflow).toBe('hidden');
+    expect(document.body.style.paddingRight).toBe('0px');
+    expect(fixedNode.style.paddingRight).toBe('0px');
+
+    activeApp?.unmount();
+    activeApp = undefined;
+
+    expect(document.body.style.overflow).toBe('auto');
+    expect(document.body.style.paddingRight).toBe('');
+    expect(fixedNode.style.paddingRight).toBe('');
+  });
+});
diff --git a/packages/@core/composables/src/__tests__/use-sortable.test.ts b/packages/@core/composables/src/__tests__/use-sortable.test.ts
index e7ba1f13..3524143a 100644
--- a/packages/@core/composables/src/__tests__/use-sortable.test.ts
+++ b/packages/@core/composables/src/__tests__/use-sortable.test.ts
@@ -29,9 +29,9 @@ describe('useSortable', () => {
     await initializeSortable();
 
     // Import sortablejs to access the mocked create function
-    const Sortable = await import(
-      'sortablejs/modular/sortable.complete.esm.js'
-    );
+    const Sortable =
+      // @ts-expect-error - This is a dynamic import
+      await import('sortablejs/modular/sortable.complete.esm.js');
 
     // Verify that Sortable.create was called with the correct parameters
     expect(Sortable.default.create).toHaveBeenCalledTimes(1);
diff --git a/packages/@core/composables/src/index.ts b/packages/@core/composables/src/index.ts
index 146ff005..2dbd4b80 100644
--- a/packages/@core/composables/src/index.ts
+++ b/packages/@core/composables/src/index.ts
@@ -10,4 +10,4 @@ export {
   useForwardExpose,
   useForwardProps,
   useForwardPropsEmits,
-} from 'radix-vue';
+} from 'reka-ui';
diff --git a/packages/@core/composables/src/use-layout-style.ts b/packages/@core/composables/src/use-layout-style.ts
index ac599c4f..395e9e5a 100644
--- a/packages/@core/composables/src/use-layout-style.ts
+++ b/packages/@core/composables/src/use-layout-style.ts
@@ -1,4 +1,7 @@
 import type { CSSProperties } from 'vue';
+
+import type { VisibleDomRect } from '@vben-core/shared/utils';
+
 import { computed, onMounted, onUnmounted, ref } from 'vue';
 
 import {
@@ -7,10 +10,7 @@ import {
   CSS_VARIABLE_LAYOUT_FOOTER_HEIGHT,
   CSS_VARIABLE_LAYOUT_HEADER_HEIGHT,
 } from '@vben-core/shared/constants';
-import {
-  getElementVisibleRect,
-  type VisibleDomRect,
-} from '@vben-core/shared/utils';
+import { getElementVisibleRect } from '@vben-core/shared/utils';
 
 import { useCssVar, useDebounceFn } from '@vueuse/core';
 
diff --git a/packages/@core/composables/src/use-namespace.ts b/packages/@core/composables/src/use-namespace.ts
index b22cf036..eb06a701 100644
--- a/packages/@core/composables/src/use-namespace.ts
+++ b/packages/@core/composables/src/use-namespace.ts
@@ -28,7 +28,7 @@ const _bem = (
 
 const is: {
   (name: string): string;
-  // eslint-disable-next-line @typescript-eslint/unified-signatures
+  // oxlint-disable-next-line typescript/unified-signatures
   (name: string, state: boolean | undefined): string;
 } = (name: string, ...args: [] | [boolean | undefined]) => {
   const state = args.length > 0 ? args[0] : true;
diff --git a/packages/@core/composables/src/use-priority-value.ts b/packages/@core/composables/src/use-priority-value.ts
index d29e894e..74b5b5bf 100644
--- a/packages/@core/composables/src/use-priority-value.ts
+++ b/packages/@core/composables/src/use-priority-value.ts
@@ -1,4 +1,5 @@
 import type { ComputedRef, Ref } from 'vue';
+
 import { computed, getCurrentInstance, unref, useAttrs, useSlots } from 'vue';
 
 import {
diff --git a/packages/@core/composables/src/use-scroll-lock.ts b/packages/@core/composables/src/use-scroll-lock.ts
index d1c14975..1e176f53 100644
--- a/packages/@core/composables/src/use-scroll-lock.ts
+++ b/packages/@core/composables/src/use-scroll-lock.ts
@@ -1,4 +1,10 @@
-import { getScrollbarWidth, needsScrollbar } from '@vben-core/shared/utils';
+import { computed, nextTick, shallowRef } from 'vue';
+
+import {
+  getLayoutScrollElement,
+  getScrollbarWidth,
+  needsScrollbar,
+} from '@vben-core/shared/utils';
 
 import {
   useScrollLock as _useScrollLock,
@@ -8,20 +14,60 @@ import {
 
 export const SCROLL_FIXED_CLASS = `_scroll__fixed_`;
 
-export function useScrollLock() {
-  const isLocked = _useScrollLock(document.body);
-  const scrollbarWidth = getScrollbarWidth();
+interface ScrollLockOptions {
+  immediate?: boolean;
+}
 
-  tryOnMounted(() => {
-    if (!needsScrollbar()) {
+function getScrollLockTarget() {
+  return getLayoutScrollElement() ?? document.body;
+}
+
+function getLayoutFixedNodes() {
+  return [...document.querySelectorAll<HTMLElement>(`.${SCROLL_FIXED_CLASS}`)];
+}
+
+export function useScrollLock(options: ScrollLockOptions = {}) {
+  const { immediate = true } = options;
+  const lockTarget = shallowRef<HTMLElement | null>(null);
+  const isTargetLocked = _useScrollLock(lockTarget);
+  const scrollbarWidth = getScrollbarWidth();
+  let hasScrollbarCompensation = false;
+  let hasScrollbarGutter = false;
+
+  function applyScrollbarGutter(target: HTMLElement) {
+    if (target === document.body) {
       return;
     }
-    document.body.style.paddingRight = `${scrollbarWidth}px`;
 
-    const layoutFixedNodes = document.querySelectorAll<HTMLElement>(
-      `.${SCROLL_FIXED_CLASS}`,
-    );
-    const nodes = [...layoutFixedNodes];
+    target.dataset.scrollbarGutter =
+      target.style.getPropertyValue('scrollbar-gutter');
+    target.style.setProperty('scrollbar-gutter', 'stable');
+    hasScrollbarGutter = true;
+  }
+
+  function resetScrollbarGutter(target: HTMLElement) {
+    if (!hasScrollbarGutter) {
+      return;
+    }
+
+    const scrollbarGutter = target.dataset.scrollbarGutter;
+    if (scrollbarGutter) {
+      target.style.setProperty('scrollbar-gutter', scrollbarGutter);
+    } else {
+      target.style.removeProperty('scrollbar-gutter');
+    }
+    delete target.dataset.scrollbarGutter;
+    hasScrollbarGutter = false;
+  }
+
+  function applyScrollbarCompensation(target: HTMLElement) {
+    if (target !== document.body || !needsScrollbar()) {
+      return;
+    }
+
+    target.style.paddingRight = `${scrollbarWidth}px`;
+
+    const nodes = getLayoutFixedNodes();
     if (nodes.length > 0) {
       nodes.forEach((node) => {
         node.dataset.transition = node.style.transition;
@@ -29,18 +75,15 @@ export function useScrollLock() {
         node.style.paddingRight = `${scrollbarWidth}px`;
       });
     }
-    isLocked.value = true;
-  });
+    hasScrollbarCompensation = true;
+  }
 
-  tryOnBeforeUnmount(() => {
-    if (!needsScrollbar()) {
+  function resetScrollbarCompensation(target: HTMLElement) {
+    if (!hasScrollbarCompensation) {
       return;
     }
-    isLocked.value = false;
-    const layoutFixedNodes = document.querySelectorAll<HTMLElement>(
-      `.${SCROLL_FIXED_CLASS}`,
-    );
-    const nodes = [...layoutFixedNodes];
+
+    const nodes = getLayoutFixedNodes();
     if (nodes.length > 0) {
       nodes.forEach((node) => {
         node.style.paddingRight = '';
@@ -49,6 +92,49 @@ export function useScrollLock() {
         });
       });
     }
-    document.body.style.paddingRight = '';
+    target.style.paddingRight = '';
+    hasScrollbarCompensation = false;
+  }
+
+  const isLocked = computed({
+    get() {
+      return isTargetLocked.value;
+    },
+    set(value: boolean) {
+      const target = lockTarget.value ?? getScrollLockTarget();
+      lockTarget.value = target;
+
+      if (value) {
+        if (isTargetLocked.value) {
+          return;
+        }
+        if (needsScrollbar(target)) {
+          applyScrollbarGutter(target);
+          applyScrollbarCompensation(target);
+        }
+        isTargetLocked.value = true;
+        return;
+      }
+
+      isTargetLocked.value = false;
+      resetScrollbarCompensation(target);
+      resetScrollbarGutter(target);
+    },
   });
+
+  tryOnMounted(async () => {
+    const target = getScrollLockTarget();
+    lockTarget.value = target;
+    await nextTick();
+
+    if (immediate && needsScrollbar(target)) {
+      isLocked.value = true;
+    }
+  });
+
+  tryOnBeforeUnmount(() => {
+    isLocked.value = false;
+  });
+
+  return isLocked;
 }
diff --git a/packages/@core/composables/src/use-simple-locale/index.ts b/packages/@core/composables/src/use-simple-locale/index.ts
index 1c3015bb..67b8173e 100644
--- a/packages/@core/composables/src/use-simple-locale/index.ts
+++ b/packages/@core/composables/src/use-simple-locale/index.ts
@@ -1,8 +1,10 @@
+import type { Locale } from './messages';
+
 import { computed, ref } from 'vue';
 
 import { createSharedComposable } from '@vueuse/core';
 
-import { getMessages, type Locale } from './messages';
+import { getMessages } from './messages';
 
 export const useSimpleLocale = createSharedComposable(() => {
   const currentLocale = ref<Locale>('zh-CN');
diff --git a/packages/@core/composables/src/use-simple-locale/messages.ts b/packages/@core/composables/src/use-simple-locale/messages.ts
index 4b1eca29..671ae33c 100644
--- a/packages/@core/composables/src/use-simple-locale/messages.ts
+++ b/packages/@core/composables/src/use-simple-locale/messages.ts
@@ -6,16 +6,20 @@ export const messages: Record<Locale, Record<string, string>> = {
     collapse: 'Collapse',
     confirm: 'Confirm',
     expand: 'Expand',
+    prompt: 'Prompt',
     reset: 'Reset',
     submit: 'Submit',
+    confirmTitle: 'Please Confirm',
   },
   'zh-CN': {
     cancel: '取消',
     collapse: '收起',
     confirm: '确认',
     expand: '展开',
+    prompt: '提示',
     reset: '重置',
     submit: '提交',
+    confirmTitle: '请确认',
   },
 };
 
diff --git a/packages/@core/composables/tsdown.config.ts b/packages/@core/composables/tsdown.config.ts
new file mode 100644
index 00000000..c4f51c5e
--- /dev/null
+++ b/packages/@core/composables/tsdown.config.ts
@@ -0,0 +1,11 @@
+import { defineConfig } from 'tsdown';
+
+export default defineConfig({
+  clean: true,
+  dts: true,
+  entry: ['src/index.ts'],
+  format: ['esm'],
+  outExtensions: () => ({
+    dts: '.d.ts',
+  }),
+});
diff --git a/packages/@core/preferences/__tests__/__snapshots__/config.test.ts.snap b/packages/@core/preferences/__tests__/__snapshots__/config.test.ts.snap
index f05a96dc..4a7ff7a0 100644
--- a/packages/@core/preferences/__tests__/__snapshots__/config.test.ts.snap
+++ b/packages/@core/preferences/__tests__/__snapshots__/config.test.ts.snap
@@ -10,18 +10,30 @@ exports[`defaultPreferences immutability test > should not modify the config obj
     "colorWeakMode": false,
     "compact": false,
     "contentCompact": "wide",
+    "contentCompactWidth": 1200,
+    "contentPadding": 0,
+    "contentPaddingBottom": 0,
+    "contentPaddingLeft": 0,
+    "contentPaddingRight": 0,
+    "contentPaddingTop": 0,
     "defaultAvatar": "https://unpkg.com/@vbenjs/static-source@0.1.7/source/avatar-v1.webp",
+    "defaultHomePath": "/dashboard",
     "dynamicTitle": true,
     "enableCheckUpdates": true,
+    "enableCopyPreferences": true,
     "enablePreferences": true,
     "enableRefreshToken": false,
+    "enableStickyPreferencesNavigationBar": true,
     "isMobile": false,
     "layout": "sidebar-nav",
     "locale": "zh-CN",
     "loginExpiredMode": "page",
     "name": "Vben Admin",
     "preferencesButtonPosition": "auto",
+    "timezone": "Asia/Shanghai",
     "watermark": false,
+    "watermarkContent": "",
+    "zIndex": 200,
   },
   "breadcrumb": {
     "enable": true,
@@ -35,21 +47,27 @@ exports[`defaultPreferences immutability test > should not modify the config obj
     "companySiteLink": "https://www.vben.pro",
     "date": "2024",
     "enable": true,
-    "icp": "",
-    "icpLink": "",
+    "icp": "闽ICP备19024351号",
+    "icpLink": "https://beian.miit.gov.cn/",
     "settingShow": true,
   },
   "footer": {
     "enable": false,
     "fixed": false,
+    "height": 32,
   },
   "header": {
     "enable": true,
+    "height": 50,
     "hidden": false,
+    "menuAlign": "start",
     "mode": "fixed",
   },
   "logo": {
     "enable": true,
+    "fit": "contain",
+    "logoMode": "icon",
+    "showText": true,
     "source": "https://unpkg.com/@vbenjs/static-source@0.1.7/source/logo-v1.webp",
   },
   "navigation": {
@@ -59,6 +77,7 @@ exports[`defaultPreferences immutability test > should not modify the config obj
   },
   "shortcutKeys": {
     "enable": true,
+    "globalEscape": false,
     "globalLockScreen": true,
     "globalLogout": true,
     "globalPreferences": true,
@@ -66,12 +85,18 @@ exports[`defaultPreferences immutability test > should not modify the config obj
   },
   "sidebar": {
     "autoActivateChild": false,
+    "collapseWidth": 60,
     "collapsed": false,
+    "collapsedButton": true,
     "collapsedShowTitle": false,
+    "draggable": true,
     "enable": true,
     "expandOnHover": true,
-    "extraCollapse": true,
+    "extraCollapse": false,
+    "extraCollapsedWidth": 60,
+    "fixedButton": true,
     "hidden": false,
+    "mixedWidth": 80,
     "width": 224,
   },
   "tabbar": {
@@ -79,11 +104,15 @@ exports[`defaultPreferences immutability test > should not modify the config obj
     "enable": true,
     "height": 38,
     "keepAlive": true,
+    "maxCount": 0,
+    "middleClickToClose": false,
     "persist": true,
     "showIcon": true,
     "showMaximize": true,
     "showMore": true,
+    "showRefresh": true,
     "styleType": "chrome",
+    "visitHistory": true,
     "wheelable": true,
   },
   "theme": {
@@ -92,10 +121,12 @@ exports[`defaultPreferences immutability test > should not modify the config obj
     "colorPrimary": "hsl(212 100% 45%)",
     "colorSuccess": "hsl(144 57% 58%)",
     "colorWarning": "hsl(42 84% 61%)",
+    "fontSize": 16,
     "mode": "dark",
     "radius": "0.5",
     "semiDarkHeader": false,
     "semiDarkSidebar": false,
+    "semiDarkSidebarSub": false,
   },
   "transition": {
     "enable": true,
@@ -105,13 +136,35 @@ exports[`defaultPreferences immutability test > should not modify the config obj
   },
   "widget": {
     "fullscreen": true,
+    "fullscreenButtonPosition": "header",
     "globalSearch": true,
+    "globalSearchButtonPosition": "header",
     "languageToggle": true,
+    "languageToggleButtonPosition": "header",
     "lockScreen": true,
+    "lockScreenButtonPosition": "header",
+    "logoutButtonPosition": "header",
     "notification": true,
+    "notificationButtonPosition": "header",
+    "order": [
+      "globalSearch",
+      "preferences",
+      "themeToggle",
+      "languageToggle",
+      "timezone",
+      "fullscreen",
+      "refresh",
+      "notification",
+      "lockScreenBtn",
+      "logoutBtn",
+    ],
     "refresh": true,
+    "refreshButtonPosition": "header",
     "sidebarToggle": true,
     "themeToggle": true,
+    "themeToggleButtonPosition": "header",
+    "timezone": true,
+    "timezoneButtonPosition": "header",
   },
 }
 `;
diff --git a/packages/@core/preferences/__tests__/preferences.test.ts b/packages/@core/preferences/__tests__/preferences.test.ts
index 37657d89..6afdb218 100644
--- a/packages/@core/preferences/__tests__/preferences.test.ts
+++ b/packages/@core/preferences/__tests__/preferences.test.ts
@@ -1,11 +1,13 @@
-import { beforeEach, describe, expect, it, vi } from 'vitest';
+import { beforeAll, beforeEach, describe, expect, it, vi } from 'vitest';
 
 import { defaultPreferences } from '../src/config';
-import { PreferenceManager } from '../src/preferences';
 import { isDarkTheme } from '../src/update-css-variables';
 
 describe('preferences', () => {
-  let preferenceManager: PreferenceManager;
+  let PreferenceManager: typeof import('../src/preferences').PreferenceManager;
+  let preferenceManager: InstanceType<
+    typeof import('../src/preferences').PreferenceManager
+  >;
 
   // 模拟 window.matchMedia 方法
   vi.stubGlobal(
@@ -21,7 +23,36 @@ describe('preferences', () => {
       removeListener: vi.fn(), // Deprecated
     })),
   );
+
+  vi.stubGlobal('localStorage', {
+    clear: vi.fn(),
+    getItem: vi.fn(() => null),
+    key: vi.fn(() => null),
+    length: 0,
+    removeItem: vi.fn(),
+    setItem: vi.fn(),
+  });
+
+  vi.stubGlobal('sessionStorage', {
+    clear: vi.fn(),
+    getItem: vi.fn(() => null),
+    key: vi.fn(() => null),
+    length: 0,
+    removeItem: vi.fn(),
+    setItem: vi.fn(),
+  });
+
+  beforeAll(async () => {
+    ({ PreferenceManager } = await import('../src/preferences'));
+  });
+
   beforeEach(() => {
+    vi.mocked(localStorage.getItem).mockImplementation(() => null);
+    vi.mocked(localStorage.removeItem).mockReset();
+    vi.mocked(localStorage.setItem).mockReset();
+    vi.mocked(sessionStorage.getItem).mockImplementation(() => null);
+    vi.mocked(sessionStorage.removeItem).mockReset();
+    vi.mocked(sessionStorage.setItem).mockReset();
     preferenceManager = new PreferenceManager();
   });
 
@@ -74,7 +105,7 @@ describe('preferences', () => {
     expect(preferenceManager.getPreferences().app.colorWeakMode).toBe(true);
   });
 
-  it('resets preferences to default', () => {
+  it('resets preferences to default', async () => {
     // 先更新一些偏好设置
     preferenceManager.updatePreferences({
       theme: {
@@ -83,7 +114,7 @@ describe('preferences', () => {
     });
 
     // 然后重置偏好设置
-    preferenceManager.resetPreferences();
+    await preferenceManager.resetPreferences();
 
     expect(preferenceManager.getPreferences()).toEqual(defaultPreferences);
   });
@@ -143,7 +174,7 @@ describe('preferences', () => {
     );
   });
 
-  it('resets preferences to default correctly', () => {
+  it('resets preferences to default correctly', async () => {
     // 先更新一些偏好设置
     preferenceManager.updatePreferences({
       app: { locale: 'en-US' },
@@ -154,7 +185,7 @@ describe('preferences', () => {
     });
 
     // 然后重置偏好设置
-    preferenceManager.resetPreferences();
+    await preferenceManager.resetPreferences();
 
     expect(preferenceManager.getPreferences()).toEqual(defaultPreferences);
   });
@@ -214,7 +245,10 @@ describe('preferences', () => {
       },
     };
 
-    await preferenceManager.initPreferences(overrides);
+    await preferenceManager.initPreferences({
+      namespace: 'apply-updates',
+      overrides,
+    });
 
     preferenceManager.updatePreferences({
       theme: { mode: 'light' },
@@ -222,6 +256,265 @@ describe('preferences', () => {
 
     expect(preferenceManager.getPreferences().theme.mode).toBe('light');
   });
+
+  it('initializes custom preferences extension with default values', async () => {
+    const extension = {
+      fields: [
+        {
+          component: 'switch',
+          defaultValue: true,
+          key: 'enableWorkbench',
+          label: '启用工作台',
+        },
+        {
+          component: 'select',
+          defaultValue: 'single',
+          key: 'tenantMode',
+          label: '租户模式',
+          options: [
+            { label: '单租户', value: 'single' },
+            { label: '多租户', value: 'multi' },
+          ],
+        },
+      ],
+      tabLabel: '扩展',
+      title: '业务偏好',
+    } as const;
+
+    await preferenceManager.initPreferences({
+      extension,
+      namespace: 'custom-defaults',
+    });
+
+    expect(preferenceManager.getPreferencesExtension()).toEqual(extension);
+    expect(preferenceManager.getCustomPreferences()).toEqual({
+      enableWorkbench: true,
+      tenantMode: 'single',
+    });
+  });
+
+  it('does not expose mutable custom preference baselines or extension schema', async () => {
+    const extension = {
+      fields: [
+        {
+          component: 'number',
+          componentProps: {
+            max: 10,
+            min: 2,
+            step: 2,
+          },
+          defaultValue: 4,
+          key: 'pageSize',
+          label: '分页大小',
+        },
+      ],
+      tabLabel: '扩展',
+      title: '业务偏好',
+    } as const;
+
+    await preferenceManager.initPreferences({
+      extension,
+      namespace: 'custom-readonly',
+    });
+
+    const initialCustomPreferences =
+      preferenceManager.getInitialCustomPreferences<{
+        pageSize: number;
+      }>() as { pageSize: number };
+    const preferencesExtension = preferenceManager.getPreferencesExtension<{
+      pageSize: number;
+    }>() as {
+      fields: Array<{ componentProps?: { max?: number }; label: string }>;
+    };
+    const [firstField] = preferencesExtension.fields;
+
+    initialCustomPreferences.pageSize = 8;
+    expect(firstField).toBeDefined();
+    expect(firstField?.componentProps).toBeDefined();
+
+    if (!firstField || !firstField.componentProps) {
+      return;
+    }
+
+    firstField.label = '已修改';
+    firstField.componentProps.max = 20;
+
+    expect(preferenceManager.getInitialCustomPreferences()).toEqual({
+      pageSize: 4,
+    });
+    expect(preferenceManager.getPreferencesExtension()).toEqual(extension);
+  });
+
+  it('updates and resets custom preferences correctly', async () => {
+    await preferenceManager.initPreferences({
+      extension: {
+        fields: [
+          {
+            component: 'number',
+            defaultValue: 20,
+            key: 'pageSize',
+            label: '分页大小',
+          },
+          {
+            component: 'input',
+            defaultValue: '日报',
+            key: 'reportTitle',
+            label: '报表标题',
+          },
+        ],
+        tabLabel: '扩展',
+      },
+      namespace: 'custom-reset',
+    });
+
+    preferenceManager.updateCustomPreferences({
+      pageSize: 50,
+      reportTitle: '月报',
+    });
+
+    expect(preferenceManager.getCustomPreferences()).toEqual({
+      pageSize: 50,
+      reportTitle: '月报',
+    });
+
+    await preferenceManager.resetPreferences();
+
+    expect(preferenceManager.getCustomPreferences()).toEqual({
+      pageSize: 20,
+      reportTitle: '日报',
+    });
+  });
+
+  it('ignores invalid custom preferences updates', async () => {
+    await preferenceManager.initPreferences({
+      extension: {
+        fields: [
+          {
+            component: 'switch',
+            defaultValue: true,
+            key: 'enableWorkbench',
+            label: '启用工作台',
+          },
+          {
+            component: 'select',
+            defaultValue: 'single',
+            key: 'tenantMode',
+            label: '租户模式',
+            options: [
+              { label: '单租户', value: 'single' },
+              { label: '多租户', value: 'multi' },
+            ],
+          },
+        ],
+        tabLabel: '扩展',
+      },
+      namespace: 'custom-invalid',
+    });
+
+    const originalCustomPreferences = preferenceManager.getCustomPreferences();
+
+    preferenceManager.updateCustomPreferences({
+      enableWorkbench: 'true' as unknown as boolean,
+      tenantMode: 'unknown',
+      unknownField: 'value',
+    } as any);
+
+    expect(preferenceManager.getCustomPreferences()).toEqual(
+      originalCustomPreferences,
+    );
+  });
+
+  it('enforces custom number field min max and step constraints', async () => {
+    await preferenceManager.initPreferences({
+      extension: {
+        fields: [
+          {
+            component: 'number',
+            componentProps: {
+              max: 10,
+              min: 2,
+              step: 2,
+            },
+            defaultValue: 4,
+            key: 'pageSize',
+            label: '分页大小',
+          },
+        ],
+        tabLabel: '扩展',
+      },
+      namespace: 'custom-number-constraints',
+    });
+
+    preferenceManager.updateCustomPreferences({
+      pageSize: 8,
+    });
+
+    expect(preferenceManager.getCustomPreferences()).toEqual({
+      pageSize: 8,
+    });
+
+    preferenceManager.updateCustomPreferences({
+      pageSize: 1,
+    });
+
+    expect(preferenceManager.getCustomPreferences()).toEqual({
+      pageSize: 8,
+    });
+
+    preferenceManager.updateCustomPreferences({
+      pageSize: 12,
+    });
+
+    expect(preferenceManager.getCustomPreferences()).toEqual({
+      pageSize: 8,
+    });
+
+    preferenceManager.updateCustomPreferences({
+      pageSize: 5,
+    });
+
+    expect(preferenceManager.getCustomPreferences()).toEqual({
+      pageSize: 8,
+    });
+  });
+
+  it('filters cached custom number values that violate field constraints', async () => {
+    vi.mocked(localStorage.getItem).mockImplementation((key) => {
+      if (key.endsWith('cache-preferences-custom')) {
+        return JSON.stringify({
+          value: {
+            pageSize: 5,
+          },
+        });
+      }
+
+      return null;
+    });
+
+    await preferenceManager.initPreferences({
+      extension: {
+        fields: [
+          {
+            component: 'number',
+            componentProps: {
+              max: 10,
+              min: 2,
+              step: 2,
+            },
+            defaultValue: 4,
+            key: 'pageSize',
+            label: '分页大小',
+          },
+        ],
+        tabLabel: '扩展',
+      },
+      namespace: 'custom-number-cache',
+    });
+
+    expect(preferenceManager.getCustomPreferences()).toEqual({
+      pageSize: 4,
+    });
+  });
 });
 
 describe('isDarkTheme', () => {
diff --git a/packages/@core/preferences/build.config.ts b/packages/@core/preferences/build.config.ts
deleted file mode 100644
index 97e572c5..00000000
--- a/packages/@core/preferences/build.config.ts
+++ /dev/null
@@ -1,7 +0,0 @@
-import { defineBuildConfig } from 'unbuild';
-
-export default defineBuildConfig({
-  clean: true,
-  declaration: true,
-  entries: ['src/index'],
-});
diff --git a/packages/@core/preferences/package.json b/packages/@core/preferences/package.json
index 24b522e2..3a92f926 100644
--- a/packages/@core/preferences/package.json
+++ b/packages/@core/preferences/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vben-core/preferences",
-  "version": "5.5.1",
+  "version": "5.7.0",
   "homepage": "https://github.com/vbenjs/vue-vben-admin",
   "bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
   "repository": {
@@ -11,7 +11,7 @@
   "license": "MIT",
   "type": "module",
   "scripts": {
-    "#build": "pnpm unbuild"
+    "#build": "pnpm exec tsdown"
   },
   "files": [
     "dist",
@@ -20,12 +20,23 @@
   "sideEffects": [
     "**/*.css"
   ],
+  "main": "./dist/index.mjs",
+  "module": "./dist/index.mjs",
+  "types": "./dist/index.d.ts",
   "exports": {
     ".": {
       "types": "./src/index.ts",
       "development": "./src/index.ts",
-      "default": "./src/index.ts",
-      "#default": "./dist/index.mjs"
+      "production": "./src/index.ts",
+      "default": "./dist/index.mjs"
+    }
+  },
+  "publishConfig": {
+    "exports": {
+      ".": {
+        "types": "./dist/index.d.ts",
+        "default": "./dist/index.mjs"
+      }
     }
   },
   "dependencies": {
diff --git a/packages/@core/preferences/src/config.ts b/packages/@core/preferences/src/config.ts
index c4dce039..ededeb7e 100644
--- a/packages/@core/preferences/src/config.ts
+++ b/packages/@core/preferences/src/config.ts
@@ -9,19 +9,31 @@ const defaultPreferences: Preferences = {
     colorWeakMode: false,
     compact: false,
     contentCompact: 'wide',
+    contentCompactWidth: 1200,
+    contentPadding: 0,
+    contentPaddingBottom: 0,
+    contentPaddingLeft: 0,
+    contentPaddingRight: 0,
+    contentPaddingTop: 0,
     defaultAvatar:
       'https://unpkg.com/@vbenjs/static-source@0.1.7/source/avatar-v1.webp',
+    defaultHomePath: '/dashboard',
     dynamicTitle: true,
     enableCheckUpdates: true,
+    enableCopyPreferences: true,
     enablePreferences: true,
     enableRefreshToken: false,
+    enableStickyPreferencesNavigationBar: true,
     isMobile: false,
     layout: 'sidebar-nav',
     locale: 'zh-CN',
     loginExpiredMode: 'page',
     name: 'Vben Admin',
     preferencesButtonPosition: 'auto',
+    timezone: 'Asia/Shanghai',
     watermark: false,
+    watermarkContent: '',
+    zIndex: 200,
   },
   breadcrumb: {
     enable: true,
@@ -35,22 +47,29 @@ const defaultPreferences: Preferences = {
     companySiteLink: 'https://www.vben.pro',
     date: '2024',
     enable: true,
-    icp: '',
-    icpLink: '',
+    icp: '闽ICP备19024351号',
+    icpLink: 'https://beian.miit.gov.cn/',
     settingShow: true,
   },
   footer: {
     enable: false,
     fixed: false,
+    height: 32,
   },
   header: {
     enable: true,
+    height: 50,
     hidden: false,
+    menuAlign: 'start',
     mode: 'fixed',
   },
+
   logo: {
     enable: true,
+    fit: 'contain',
     source: 'https://unpkg.com/@vbenjs/static-source@0.1.7/source/logo-v1.webp',
+    showText: true,
+    logoMode: 'icon',
   },
   navigation: {
     accordion: true,
@@ -59,6 +78,7 @@ const defaultPreferences: Preferences = {
   },
   shortcutKeys: {
     enable: true,
+    globalEscape: false,
     globalLockScreen: true,
     globalLogout: true,
     globalPreferences: true,
@@ -67,11 +87,17 @@ const defaultPreferences: Preferences = {
   sidebar: {
     autoActivateChild: false,
     collapsed: false,
+    collapsedButton: true,
     collapsedShowTitle: false,
+    collapseWidth: 60,
+    draggable: true,
     enable: true,
     expandOnHover: true,
-    extraCollapse: true,
+    extraCollapse: false,
+    extraCollapsedWidth: 60,
+    fixedButton: true,
     hidden: false,
+    mixedWidth: 80,
     width: 224,
   },
   tabbar: {
@@ -79,11 +105,15 @@ const defaultPreferences: Preferences = {
     enable: true,
     height: 38,
     keepAlive: true,
+    maxCount: 0,
+    middleClickToClose: false,
     persist: true,
     showIcon: true,
     showMaximize: true,
     showMore: true,
+    showRefresh: true,
     styleType: 'chrome',
+    visitHistory: true,
     wheelable: true,
   },
   theme: {
@@ -94,8 +124,10 @@ const defaultPreferences: Preferences = {
     colorWarning: 'hsl(42 84% 61%)',
     mode: 'dark',
     radius: '0.5',
+    fontSize: 16,
     semiDarkHeader: false,
     semiDarkSidebar: false,
+    semiDarkSidebarSub: false,
   },
   transition: {
     enable: true,
@@ -105,13 +137,35 @@ const defaultPreferences: Preferences = {
   },
   widget: {
     fullscreen: true,
+    fullscreenButtonPosition: 'header',
     globalSearch: true,
+    globalSearchButtonPosition: 'header',
     languageToggle: true,
+    languageToggleButtonPosition: 'header',
     lockScreen: true,
+    lockScreenButtonPosition: 'header',
+    logoutButtonPosition: 'header',
     notification: true,
+    notificationButtonPosition: 'header',
     refresh: true,
+    refreshButtonPosition: 'header',
     sidebarToggle: true,
     themeToggle: true,
+    themeToggleButtonPosition: 'header',
+    timezone: true,
+    timezoneButtonPosition: 'header',
+    order: [
+      'globalSearch',
+      'preferences',
+      'themeToggle',
+      'languageToggle',
+      'timezone',
+      'fullscreen',
+      'refresh',
+      'notification',
+      'lockScreenBtn',
+      'logoutBtn',
+    ],
   },
 };
 
diff --git a/packages/@core/preferences/src/constants.ts b/packages/@core/preferences/src/constants.ts
index 430ee3b0..562a7afa 100644
--- a/packages/@core/preferences/src/constants.ts
+++ b/packages/@core/preferences/src/constants.ts
@@ -1,4 +1,4 @@
-import type { BuiltinThemeType } from '@vben-core/typings';
+import type { BuiltinThemeType, TimezoneOption } from '@vben-core/typings';
 
 interface BuiltinThemePreset {
   color: string;
@@ -38,12 +38,10 @@ const BUILT_IN_THEME_PRESETS: BuiltinThemePreset[] = [
     primaryColor: 'hsl(240 5.9% 10%)',
     type: 'zinc',
   },
-
   {
     color: 'hsl(181 84% 32%)',
     type: 'deep-green',
   },
-
   {
     color: 'hsl(211 91% 39%)',
     type: 'deep-blue',
@@ -56,7 +54,6 @@ const BUILT_IN_THEME_PRESETS: BuiltinThemePreset[] = [
     color: 'hsl(0 75% 42%)',
     type: 'rose',
   },
-
   {
     color: 'hsl(0 0% 25%)',
     darkPrimaryColor: 'hsl(0 0% 98%)',
@@ -81,8 +78,39 @@ const BUILT_IN_THEME_PRESETS: BuiltinThemePreset[] = [
   },
 ];
 
+/**
+ * 时区选项
+ */
+const DEFAULT_TIME_ZONE_OPTIONS: TimezoneOption[] = [
+  {
+    offset: -5,
+    timezone: 'America/New_York',
+    label: 'America/New_York(GMT-5)',
+  },
+  {
+    offset: 0,
+    timezone: 'Europe/London',
+    label: 'Europe/London(GMT0)',
+  },
+  {
+    offset: 8,
+    timezone: 'Asia/Shanghai',
+    label: 'Asia/Shanghai(GMT+8)',
+  },
+  {
+    offset: 9,
+    timezone: 'Asia/Tokyo',
+    label: 'Asia/Tokyo(GMT+9)',
+  },
+  {
+    offset: 9,
+    timezone: 'Asia/Seoul',
+    label: 'Asia/Seoul(GMT+9)',
+  },
+];
+
 export const COLOR_PRESETS = [...BUILT_IN_THEME_PRESETS].slice(0, 7);
 
-export { BUILT_IN_THEME_PRESETS };
+export { BUILT_IN_THEME_PRESETS, DEFAULT_TIME_ZONE_OPTIONS };
 
 export type { BuiltinThemePreset };
diff --git a/packages/@core/preferences/src/index.ts b/packages/@core/preferences/src/index.ts
index 33444e13..91eb1061 100644
--- a/packages/@core/preferences/src/index.ts
+++ b/packages/@core/preferences/src/index.ts
@@ -1,34 +1,23 @@
+/* oxlint-disable unicorn/prefer-export-from */
 import type { Preferences } from './types';
 
 import { preferencesManager } from './preferences';
 
-// 偏好设置（带有层级关系）
-const preferences: Preferences =
-  preferencesManager.getPreferences.apply(preferencesManager);
-
-// 更新偏好设置
-const updatePreferences =
-  preferencesManager.updatePreferences.bind(preferencesManager);
-
-// 重置偏好设置
-const resetPreferences =
-  preferencesManager.resetPreferences.bind(preferencesManager);
-
-const clearPreferencesCache =
-  preferencesManager.clearCache.bind(preferencesManager);
-
-// 初始化偏好设置
-const initPreferences =
-  preferencesManager.initPreferences.bind(preferencesManager);
-
-export {
-  clearPreferencesCache,
-  initPreferences,
-  preferences,
-  preferencesManager,
-  resetPreferences,
+export const {
+  getPreferences,
+  getCustomPreferences,
+  getInitialCustomPreferences,
+  getPreferencesExtension,
   updatePreferences,
-};
+  updateCustomPreferences,
+  resetPreferences,
+  clearCache,
+  initPreferences,
+} = preferencesManager;
+
+export const preferences: Preferences = getPreferences();
+
+export { preferencesManager };
 
 export * from './constants';
 export type * from './types';
diff --git a/packages/@core/preferences/src/preferences.ts b/packages/@core/preferences/src/preferences.ts
index 7851fdbc..80677da0 100644
--- a/packages/@core/preferences/src/preferences.ts
+++ b/packages/@core/preferences/src/preferences.ts
@@ -1,11 +1,21 @@
 import type { DeepPartial } from '@vben-core/typings';
 
-import type { InitialOptions, Preferences } from './types';
+import type {
+  CustomPreferencesField,
+  CustomPreferencesRecord,
+  InitialOptions,
+  Preferences,
+  PreferencesExtension,
+} from './types';
 
 import { markRaw, reactive, readonly, watch } from 'vue';
 
 import { StorageManager } from '@vben-core/shared/cache';
-import { isMacOs, merge } from '@vben-core/shared/utils';
+import {
+  isMacOs,
+  merge,
+  mergeWithArrayOverride,
+} from '@vben-core/shared/utils';
 
 import {
   breakpointsTailwind,
@@ -16,81 +26,425 @@ import {
 import { defaultPreferences } from './config';
 import { updateCSSVariables } from './update-css-variables';
 
-const STORAGE_KEY = 'preferences';
-const STORAGE_KEY_LOCALE = `${STORAGE_KEY}-locale`;
-const STORAGE_KEY_THEME = `${STORAGE_KEY}-theme`;
+const STORAGE_KEYS = {
+  CUSTOM: 'preferences-custom',
+  MAIN: 'preferences',
+  LOCALE: 'preferences-locale',
+  THEME: 'preferences-theme',
+} as const;
 
 class PreferenceManager {
-  private cache: null | StorageManager = null;
-  // private flattenedState: Flatten<Preferences>;
+  private cache: StorageManager;
+  private customPreferencesExtension: null | PreferencesExtension<any> = null;
+  private customState = reactive<CustomPreferencesRecord>({});
+  private debouncedSave: () => void;
+  private initialCustomPreferences: CustomPreferencesRecord = {};
   private initialPreferences: Preferences = defaultPreferences;
-  private isInitialized: boolean = false;
-  private savePreferences: (preference: Preferences) => void;
-  private state: Preferences = reactive<Preferences>({
-    ...this.loadPreferences(),
-  });
+  private isInitialized = false;
+  private state: Preferences;
+
   constructor() {
     this.cache = new StorageManager();
-
-    // 避免频繁的操作缓存
-    this.savePreferences = useDebounceFn(
-      (preference: Preferences) => this._savePreferences(preference),
-      150,
-    );
+    // 构造函数不再同步读取缓存，使用默认值初始化
+    // 真正的缓存加载在 initPreferences 中完成（已经是 async）
+    this.state = reactive<Preferences>({ ...defaultPreferences });
+    this.debouncedSave = useDebounceFn(() => this.saveToCache(), 150);
   }
 
   /**
-   * 保存偏好设置
-   * @param {Preferences} preference - 需要保存的偏好设置
+   * 清除所有缓存的偏好设置
    */
-  private _savePreferences(preference: Preferences) {
-    this.cache?.setItem(STORAGE_KEY, preference);
-    this.cache?.setItem(STORAGE_KEY_LOCALE, preference.app.locale);
-    this.cache?.setItem(STORAGE_KEY_THEME, preference.theme.mode);
+  clearCache = async () => {
+    await Promise.all(
+      Object.values(STORAGE_KEYS).map((key) => this.cache.removeItem(key)),
+    );
+  };
+
+  /**
+   * 获取扩展偏好设置
+   */
+  getCustomPreferences = <
+    TCustomPreferences extends object = CustomPreferencesRecord,
+  >() => {
+    return readonly(this.customState) as Readonly<TCustomPreferences>;
+  };
+
+  /**
+   * 获取初始化扩展偏好设置
+   */
+  getInitialCustomPreferences = <
+    TCustomPreferences extends object = CustomPreferencesRecord,
+  >() => {
+    return this.cloneValue(
+      this.initialCustomPreferences,
+    ) as Readonly<TCustomPreferences>;
+  };
+
+  /**
+   * 获取初始化偏好设置
+   */
+  getInitialPreferences = () => {
+    return this.initialPreferences;
+  };
+
+  /**
+   * 获取当前偏好设置（只读）
+   */
+  getPreferences = () => {
+    return readonly(this.state);
+  };
+
+  /**
+   * 获取扩展偏好设置配置
+   */
+  getPreferencesExtension = <
+    TCustomPreferences extends object = CustomPreferencesRecord,
+  >() => {
+    return this.customPreferencesExtension
+      ? (this.cloneValue(this.customPreferencesExtension) as Readonly<
+          PreferencesExtension<TCustomPreferences>
+        >)
+      : null;
+  };
+
+  /**
+   * 初始化偏好设置
+   * @param options - 初始化配置项
+   * @param options.namespace - 命名空间，用于隔离不同应用的配置
+   * @param options.overrides - 要覆盖的偏好设置
+   */
+  initPreferences = async <
+    TCustomPreferences extends object = CustomPreferencesRecord,
+  >({
+    namespace,
+    overrides,
+    extension,
+  }: InitialOptions<TCustomPreferences>) => {
+    // 防止重复初始化
+    if (this.isInitialized) {
+      return;
+    }
+
+    // 使用命名空间初始化存储管理器
+    this.cache = new StorageManager({ prefix: namespace });
+
+    // 合并初始偏好设置：前面的对象优先，后面的对象仅补齐缺失字段
+    this.initialPreferences = merge({}, overrides, defaultPreferences);
+    this.customPreferencesExtension = extension ?? null;
+    this.initialCustomPreferences = this.resolveCustomPreferencesDefaults(
+      this.customPreferencesExtension,
+    );
+
+    // 加载缓存的偏好设置，并仅用缓存补齐初始化配置中未显式设置的字段
+    const cachedPreferences = (await this.loadFromCache()) || {};
+    // 修复历史脏数据：早期版本用 defu(merge) 合并数组，导致 widget.order
+    // 在每次 updatePreferences 时被 concat 追加，膨胀到几十/上百条重复 key。
+    // 这里在加载缓存后做一次去重，保留首次出现的 key。
+    this.sanitizeCachedArray(cachedPreferences, 'widget', 'order');
+    const mergedPreference = mergeWithArrayOverride(
+      {},
+      cachedPreferences, // 用户缓存的设置优先
+      this.initialPreferences, // 初始设置仅补齐缺失字段
+    );
+
+    // 更新偏好设置
+    this.updatePreferences(mergedPreference);
+
+    const cachedCustom = (await this.loadCustomFromCache()) || {};
+    this.replaceCustomPreferences(
+      mergeWithArrayOverride(
+        {},
+        this.sanitizeCustomPreferences(cachedCustom),
+        this.initialCustomPreferences,
+      ),
+    );
+    await this.saveToCache();
+
+    // 设置监听器
+    this.setupWatcher();
+
+    // 初始化平台标识
+    this.initPlatform();
+
+    this.isInitialized = true;
+  };
+
+  /**
+   * 重置偏好设置到初始状态
+   */
+  resetPreferences = async () => {
+    // 将状态重置为初始偏好设置
+    Object.assign(this.state, this.initialPreferences);
+    this.replaceCustomPreferences(this.initialCustomPreferences);
+
+    // 保存偏好设置至缓存
+    await this.saveToCache();
+
+    // 直接触发 UI 更新
+    this.handleUpdates(this.state);
+  };
+
+  /**
+   * 更新扩展偏好设置
+   * @param updates - 要更新的扩展偏好设置
+   */
+  updateCustomPreferences = (updates: DeepPartial<object>) => {
+    if (!this.customPreferencesExtension) {
+      return;
+    }
+
+    const sanitizedUpdates = this.sanitizeCustomPreferences(
+      updates as DeepPartial<CustomPreferencesRecord>,
+    );
+
+    if (Object.keys(sanitizedUpdates).length === 0) {
+      return;
+    }
+
+    this.replaceCustomPreferences(
+      mergeWithArrayOverride({}, sanitizedUpdates, markRaw(this.customState)),
+    );
+    this.debouncedSave();
+  };
+
+  /**
+   * 更新偏好设置
+   * @param updates - 要更新的偏好设置
+   */
+  updatePreferences = (updates: DeepPartial<Preferences>) => {
+    // 深度合并更新内容和当前状态
+    // 注意：必须用 mergeWithArrayOverride 而不是 merge。
+    // defu(merge) 对数组的语义是 concat 追加，会导致 widget.order 等
+    // 数组字段在每次 updatePreferences 时被重复追加，指数级膨胀。
+    const mergedState = mergeWithArrayOverride(
+      {},
+      updates,
+      markRaw(this.state),
+    );
+    Object.assign(this.state, mergedState);
+
+    // 根据更新的值执行更新
+    this.handleUpdates(updates);
+
+    // 保存到缓存（fire-and-forget，通过 debounce 控制频率）
+    this.debouncedSave();
+  };
+
+  private cloneValue<T>(value: T): T {
+    if (Array.isArray(value)) {
+      return value.map((item) => this.cloneValue(item)) as T;
+    }
+
+    if (value && typeof value === 'object') {
+      return Object.fromEntries(
+        Object.entries(value as Record<string, unknown>).map(
+          ([key, nestedValue]) => [key, this.cloneValue(nestedValue)],
+        ),
+      ) as T;
+    }
+
+    return value;
   }
 
   /**
-   * 处理更新的键值
-   * 根据更新的键值执行相应的操作。
-   * @param {DeepPartial<Preferences>} updates - 部分更新的偏好设置
+   * 处理更新
+   * @param updates - 更新的偏好设置
    */
   private handleUpdates(updates: DeepPartial<Preferences>) {
-    const themeUpdates = updates.theme || {};
-    const appUpdates = updates.app || {};
-    if (themeUpdates && Object.keys(themeUpdates).length > 0) {
+    const { theme, app } = updates;
+
+    if (
+      theme &&
+      (Object.keys(theme).length > 0 || Reflect.has(theme, 'fontSize'))
+    ) {
       updateCSSVariables(this.state);
     }
 
     if (
-      Reflect.has(appUpdates, 'colorGrayMode') ||
-      Reflect.has(appUpdates, 'colorWeakMode')
+      app &&
+      (Reflect.has(app, 'colorGrayMode') || Reflect.has(app, 'colorWeakMode'))
     ) {
       this.updateColorMode(this.state);
     }
   }
 
+  /**
+   * 初始化平台标识
+   */
   private initPlatform() {
-    const dom = document.documentElement;
-    dom.dataset.platform = isMacOs() ? 'macOs' : 'window';
+    document.documentElement.dataset.platform = isMacOs() ? 'macOs' : 'window';
+  }
+
+  private isAlmostInteger(value: number, epsilon = Number.EPSILON * 10) {
+    return Math.abs(value - Math.round(value)) < epsilon;
+  }
+
+  private isValidCustomPreferenceValue(
+    field: CustomPreferencesField,
+    value: unknown,
+  ) {
+    switch (field.component) {
+      case 'number': {
+        if (typeof value !== 'number' || !Number.isFinite(value)) {
+          return false;
+        }
+
+        const max = this.resolveNumericConstraint(field.componentProps?.max);
+        const min = this.resolveNumericConstraint(field.componentProps?.min);
+        const step = this.resolveNumericConstraint(field.componentProps?.step);
+
+        if (min !== undefined && value < min) {
+          return false;
+        }
+
+        if (max !== undefined && value > max) {
+          return false;
+        }
+
+        if (step !== undefined) {
+          if (step <= 0) {
+            return false;
+          }
+
+          const stepBase = min ?? 0;
+          const stepCount = (value - stepBase) / step;
+
+          if (!this.isAlmostInteger(stepCount)) {
+            return false;
+          }
+        }
+
+        return true;
+      }
+      case 'select': {
+        return (
+          typeof value === 'string' &&
+          field.options.some((option) => option.value === value)
+        );
+      }
+      case 'switch': {
+        return typeof value === 'boolean';
+      }
+      default: {
+        return typeof value === 'string';
+      }
+    }
   }
 
   /**
-   *  从缓存中加载偏好设置。如果缓存中没有找到对应的偏好设置，则返回默认偏好设置。
+   * 从缓存加载扩展偏好设置
+   * @returns 缓存的扩展偏好设置，如果不存在则返回 null
    */
-  private loadCachedPreferences() {
-    return this.cache?.getItem<Preferences>(STORAGE_KEY);
+  private async loadCustomFromCache(): Promise<CustomPreferencesRecord | null> {
+    return this.cache.getItem<CustomPreferencesRecord>(STORAGE_KEYS.CUSTOM);
   }
 
   /**
-   * 加载偏好设置
-   * @returns {Preferences} 加载的偏好设置
+   * 从缓存加载偏好设置
+   * @returns 缓存的偏好设置，如果不存在则返回 null
    */
-  private loadPreferences(): Preferences {
-    return this.loadCachedPreferences() || { ...defaultPreferences };
+  private async loadFromCache(): Promise<null | Preferences> {
+    return this.cache.getItem<Preferences>(STORAGE_KEYS.MAIN);
+  }
+
+  private replaceCustomPreferences(preferences: CustomPreferencesRecord) {
+    Object.keys(this.customState).forEach((key) => {
+      Reflect.deleteProperty(this.customState, key);
+    });
+    Object.assign(this.customState, preferences);
+  }
+
+  private resolveCustomPreferencesDefaults(
+    extension: null | PreferencesExtension<any>,
+  ) {
+    if (!extension) {
+      return {};
+    }
+
+    const result: CustomPreferencesRecord = {};
+
+    for (const field of extension.fields) {
+      result[field.key] = field.defaultValue;
+    }
+
+    return result;
+  }
+
+  private resolveNumericConstraint(value: unknown) {
+    return typeof value === 'number' && Number.isFinite(value)
+      ? value
+      : undefined;
   }
 
   /**
-   * 监听状态和系统偏好设置的变化。
+   * 清理缓存中膨胀的数组字段（保留首次出现的元素）
+   * 用于修复早期版本 defu 合并数组时 concat 追加导致的脏数据
+   */
+  private sanitizeCachedArray(
+    cached: Record<string, any>,
+    group: string,
+    field: string,
+  ) {
+    const node = cached?.[group]?.[field];
+    if (!Array.isArray(node) || node.length <= 1) return;
+    const seen = new Set<unknown>();
+    const deduped = node.filter((item) => {
+      if (seen.has(item)) return false;
+      seen.add(item);
+      return true;
+    });
+    if (deduped.length !== node.length) {
+      cached[group][field] = deduped;
+    }
+  }
+
+  private sanitizeCustomPreferences(
+    updates: DeepPartial<CustomPreferencesRecord>,
+  ) {
+    if (!this.customPreferencesExtension) {
+      return {};
+    }
+
+    const result: CustomPreferencesRecord = {};
+
+    for (const field of this.customPreferencesExtension.fields) {
+      const value = updates[field.key];
+
+      if (
+        value !== undefined &&
+        this.isValidCustomPreferenceValue(field, value)
+      ) {
+        result[field.key] = value;
+      }
+    }
+
+    return result;
+  }
+
+  /**
+   * 保存偏好设置到缓存
+   */
+  private async saveToCache() {
+    try {
+      await this.cache.setItem(STORAGE_KEYS.MAIN, this.state);
+      await this.cache.setItem(STORAGE_KEYS.LOCALE, this.state.app.locale);
+      await this.cache.setItem(STORAGE_KEYS.THEME, this.state.theme.mode);
+
+      if (this.customPreferencesExtension) {
+        await this.cache.setItem(STORAGE_KEYS.CUSTOM, {
+          ...this.customState,
+        });
+        return;
+      }
+
+      await this.cache.removeItem(STORAGE_KEYS.CUSTOM);
+    } catch (error) {
+      console.error('Failed to save preferences to cache:', error);
+    }
+  }
+
+  /**
+   * 监听状态和系统偏好设置的变化
    */
   private setupWatcher() {
     if (this.isInitialized) {
@@ -100,6 +454,7 @@ class PreferenceManager {
     // 监听断点，判断是否移动端
     const breakpoints = useBreakpoints(breakpointsTailwind);
     const isMobile = breakpoints.smaller('md');
+
     watch(
       () => isMobile.value,
       (val) => {
@@ -114,115 +469,33 @@ class PreferenceManager {
     window
       .matchMedia('(prefers-color-scheme: dark)')
       .addEventListener('change', ({ matches: isDark }) => {
-        this.updatePreferences({
-          theme: { mode: isDark ? 'dark' : 'light' },
-        });
+        // 仅在自动模式下跟随系统主题
+        if (this.state.theme.mode === 'auto') {
+          // 先应用实际的主题
+          this.updatePreferences({
+            theme: { mode: isDark ? 'dark' : 'light' },
+          });
+          // 再恢复为 auto 模式，保持跟随系统的状态
+          this.updatePreferences({
+            theme: { mode: 'auto' },
+          });
+        }
       });
   }
 
   /**
    * 更新页面颜色模式（灰色、色弱）
-   * @param preference
+   * @param preference - 偏好设置
    */
   private updateColorMode(preference: Preferences) {
-    if (preference.app) {
-      const { colorGrayMode, colorWeakMode } = preference.app;
-      const dom = document.documentElement;
-      const COLOR_WEAK = 'invert-mode';
-      const COLOR_GRAY = 'grayscale-mode';
-      colorWeakMode
-        ? dom.classList.add(COLOR_WEAK)
-        : dom.classList.remove(COLOR_WEAK);
-      colorGrayMode
-        ? dom.classList.add(COLOR_GRAY)
-        : dom.classList.remove(COLOR_GRAY);
-    }
-  }
+    const { colorGrayMode, colorWeakMode } = preference.app;
+    const dom = document.documentElement;
 
-  clearCache() {
-    [STORAGE_KEY, STORAGE_KEY_LOCALE, STORAGE_KEY_THEME].forEach((key) => {
-      this.cache?.removeItem(key);
-    });
-  }
-
-  public getInitialPreferences() {
-    return this.initialPreferences;
-  }
-
-  public getPreferences() {
-    return readonly(this.state);
-  }
-
-  /**
-   * 覆盖偏好设置
-   * overrides  要覆盖的偏好设置
-   * namespace  命名空间
-   */
-  public async initPreferences({ namespace, overrides }: InitialOptions) {
-    // 是否初始化过
-    if (this.isInitialized) {
-      return;
-    }
-    // 初始化存储管理器
-    this.cache = new StorageManager({ prefix: namespace });
-    // 合并初始偏好设置
-    this.initialPreferences = merge({}, overrides, defaultPreferences);
-
-    // 加载并合并当前存储的偏好设置
-    const mergedPreference = merge(
-      {},
-      // overrides,
-      this.loadCachedPreferences() || {},
-      this.initialPreferences,
-    );
-
-    // 更新偏好设置
-    this.updatePreferences(mergedPreference);
-
-    this.setupWatcher();
-
-    this.initPlatform();
-    // 标记为已初始化
-    this.isInitialized = true;
-  }
-
-  /**
-   * 重置偏好设置
-   * 偏好设置将被重置为初始值，并从 localStorage 中移除。
-   *
-   * @example
-   * 假设 initialPreferences 为 { theme: 'light', language: 'en' }
-   * 当前 state 为 { theme: 'dark', language: 'fr' }
-   * this.resetPreferences();
-   * 调用后，state 将被重置为 { theme: 'light', language: 'en' }
-   * 并且 localStorage 中的对应项将被移除
-   */
-  resetPreferences() {
-    // 将状态重置为初始偏好设置
-    Object.assign(this.state, this.initialPreferences);
-    // 保存重置后的偏好设置
-    this.savePreferences(this.state);
-    // 从存储中移除偏好设置项
-    [STORAGE_KEY, STORAGE_KEY_THEME, STORAGE_KEY_LOCALE].forEach((key) => {
-      this.cache?.removeItem(key);
-    });
-    this.updatePreferences(this.state);
-  }
-
-  /**
-   * 更新偏好设置
-   * @param updates - 要更新的偏好设置
-   */
-  public updatePreferences(updates: DeepPartial<Preferences>) {
-    const mergedState = merge({}, updates, markRaw(this.state));
-
-    Object.assign(this.state, mergedState);
-
-    // 根据更新的键值执行相应的操作
-    this.handleUpdates(updates);
-    this.savePreferences(this.state);
+    dom.classList.toggle('invert-mode', colorWeakMode);
+    dom.classList.toggle('grayscale-mode', colorGrayMode);
   }
 }
 
 const preferencesManager = new PreferenceManager();
+
 export { PreferenceManager, preferencesManager };
diff --git a/packages/@core/preferences/src/types.ts b/packages/@core/preferences/src/types.ts
index 5fe6bf0c..5509d488 100644
--- a/packages/@core/preferences/src/types.ts
+++ b/packages/@core/preferences/src/types.ts
@@ -5,6 +5,7 @@ import type {
   BuiltinThemeType,
   ContentCompactType,
   DeepPartial,
+  LayoutHeaderMenuAlignType,
   LayoutHeaderModeType,
   LayoutType,
   LoginExpiredModeType,
@@ -16,6 +17,84 @@ import type {
 } from '@vben-core/typings';
 
 type SupportedLanguagesType = 'en-US' | 'zh-CN';
+type CustomPreferencesValue = boolean | number | string;
+
+interface CustomPreferencesOption<TValue extends string = string> {
+  label: string;
+  value: TValue;
+}
+
+interface BaseCustomPreferencesField<
+  TKey extends string = string,
+  TValue extends CustomPreferencesValue = CustomPreferencesValue,
+> {
+  componentProps?: Record<string, any>;
+  defaultValue: TValue;
+  disabled?: boolean;
+  key: TKey;
+  label: string;
+  placeholder?: string;
+  tip?: string;
+}
+
+interface CustomPreferencesInputField<
+  TKey extends string = string,
+> extends BaseCustomPreferencesField<TKey, string> {
+  component: 'input';
+}
+
+interface CustomPreferencesNumberField<
+  TKey extends string = string,
+> extends BaseCustomPreferencesField<TKey, number> {
+  component: 'number';
+}
+
+interface CustomPreferencesSelectField<
+  TKey extends string = string,
+> extends BaseCustomPreferencesField<TKey, string> {
+  component: 'select';
+  options: CustomPreferencesOption[];
+}
+
+interface CustomPreferencesSwitchField<
+  TKey extends string = string,
+> extends BaseCustomPreferencesField<TKey, boolean> {
+  component: 'switch';
+}
+
+type CustomPreferencesRecord = Record<string, CustomPreferencesValue>;
+
+type AnyCustomPreferencesField =
+  | CustomPreferencesInputField
+  | CustomPreferencesNumberField
+  | CustomPreferencesSelectField
+  | CustomPreferencesSwitchField;
+
+type CustomPreferencesField<
+  TCustomPreferences extends object = CustomPreferencesRecord,
+> =
+  string extends Extract<keyof TCustomPreferences, string>
+    ? AnyCustomPreferencesField
+    : {
+        [K in Extract<
+          keyof TCustomPreferences,
+          string
+        >]: TCustomPreferences[K] extends boolean
+          ? CustomPreferencesSwitchField<K>
+          : TCustomPreferences[K] extends number
+            ? CustomPreferencesNumberField<K>
+            : TCustomPreferences[K] extends string
+              ? CustomPreferencesInputField<K> | CustomPreferencesSelectField<K>
+              : never;
+      }[Extract<keyof TCustomPreferences, string>];
+
+interface PreferencesExtension<
+  TCustomPreferences extends object = CustomPreferencesRecord,
+> {
+  fields: Array<CustomPreferencesField<TCustomPreferences>>;
+  tabLabel: string;
+  title?: string;
+}
 
 interface AppPreferences {
   /** 权限模式 */
@@ -32,18 +111,38 @@ interface AppPreferences {
   compact: boolean;
   /** 是否开启内容紧凑模式 */
   contentCompact: ContentCompactType;
-  // /** 应用默认头像 */
+  /** 内容紧凑宽度 */
+  contentCompactWidth: number;
+  /** 内容内边距 */
+  contentPadding: number;
+  /** 内容底部内边距 */
+  contentPaddingBottom: number;
+  /** 内容左侧内边距 */
+  contentPaddingLeft: number;
+  /** 内容右侧内边距 */
+  contentPaddingRight: number;
+  /** 内容顶部内边距 */
+  contentPaddingTop: number;
+  /** 应用默认头像 */
   defaultAvatar: string;
-  // /** 开启动态标题 */
+  /** 默认首页地址 */
+  defaultHomePath: string;
+  /** 开启动态标题 */
   dynamicTitle: boolean;
   /** 是否开启检查更新 */
   enableCheckUpdates: boolean;
+  /** 是否显示复制偏好设置按钮 */
+  enableCopyPreferences: boolean;
   /** 是否显示偏好设置 */
   enablePreferences: boolean;
   /**
    * @zh_CN 是否开启refreshToken
    */
   enableRefreshToken: boolean;
+  /**
+   * @zh_CN 是否开启首选项导航栏吸顶效果
+   */
+  enableStickyPreferencesNavigationBar: boolean;
   /** 是否移动端 */
   isMobile: boolean;
   /** 布局方式 */
@@ -58,10 +157,20 @@ interface AppPreferences {
   preferencesButtonPosition: PreferencesButtonPositionType;
   /** 版本信息 */
   version: string;
+  /**
+   * @zh_CN 应用时区
+   */
+  timezone: string;
   /**
    * @zh_CN 是否开启水印
    */
   watermark: boolean;
+  /**
+   * @zh_CN 水印文案
+   */
+  watermarkContent: string;
+  /** z-index */
+  zIndex: number;
 }
 
 interface BreadcrumbPreferences {
@@ -99,13 +208,19 @@ interface FooterPreferences {
   enable: boolean;
   /** 底栏是否固定 */
   fixed: boolean;
+  /** 底栏高度 */
+  height: number;
 }
 
 interface HeaderPreferences {
   /** 顶栏是否启用 */
   enable: boolean;
+  /** 顶栏高度 */
+  height: number;
   /** 顶栏是否隐藏,css-隐藏 */
   hidden: boolean;
+  /** 顶栏菜单位置 */
+  menuAlign: LayoutHeaderMenuAlignType;
   /** header显示模式 */
   mode: LayoutHeaderModeType;
 }
@@ -113,8 +228,18 @@ interface HeaderPreferences {
 interface LogoPreferences {
   /** logo是否可见 */
   enable: boolean;
+  /** logo图片适应方式 */
+  fit: 'contain' | 'cover' | 'fill' | 'none' | 'scale-down';
+  /** logo高度， 只在 logoMode=full时生效 */
+  fullLogoHeight?: number | string;
+  /** logo 展示类型，icon 图标模式， full 铺满logo区域 */
+  logoMode: 'full' | 'icon';
+  /** logo text是否展示 */
+  showText: boolean;
   /** logo地址 */
   source: string;
+  /** 暗色主题logo地址 (可选，若不设置则使用 source) */
+  sourceDark?: string;
 }
 
 interface NavigationPreferences {
@@ -131,16 +256,28 @@ interface SidebarPreferences {
   autoActivateChild: boolean;
   /** 侧边栏是否折叠 */
   collapsed: boolean;
+  /** 侧边栏折叠按钮是否可见 */
+  collapsedButton: boolean;
   /** 侧边栏折叠时，是否显示title */
   collapsedShowTitle: boolean;
+  /** 侧边栏折叠宽度 */
+  collapseWidth: number;
+  /** 侧边栏菜单拖拽 */
+  draggable: boolean;
   /** 侧边栏是否可见 */
   enable: boolean;
   /** 菜单自动展开状态 */
   expandOnHover: boolean;
   /** 侧边栏扩展区域是否折叠 */
   extraCollapse: boolean;
+  /** 侧边栏扩展区域折叠宽度 */
+  extraCollapsedWidth: number;
+  /** 侧边栏固定按钮是否可见 */
+  fixedButton: boolean;
   /** 侧边栏是否隐藏 - css */
   hidden: boolean;
+  /** 混合侧边栏宽度 */
+  mixedWidth: number;
   /** 侧边栏宽度 */
   width: number;
 }
@@ -148,6 +285,8 @@ interface SidebarPreferences {
 interface ShortcutKeyPreferences {
   /** 是否启用快捷键-全局 */
   enable: boolean;
+  /** 是否启用全局关闭窗口快捷键 */
+  globalEscape: boolean;
   /** 是否启用全局锁屏快捷键 */
   globalLockScreen: boolean;
   /** 是否启用全局注销快捷键 */
@@ -167,6 +306,10 @@ interface TabbarPreferences {
   height: number;
   /** 开启标签页缓存功能 */
   keepAlive: boolean;
+  /** 限制最大数量 */
+  maxCount: number;
+  /** 是否点击中键时关闭标签 */
+  middleClickToClose: boolean;
   /** 是否持久化标签 */
   persist: boolean;
   /** 是否开启多标签页图标 */
@@ -175,8 +318,12 @@ interface TabbarPreferences {
   showMaximize: boolean;
   /** 显示更多按钮 */
   showMore: boolean;
+  /** 显示刷新按钮 */
+  showRefresh: boolean;
   /** 标签页风格 */
   styleType: TabsStyleType;
+  /** 是否开启访问历史记录 */
+  visitHistory: boolean;
   /** 是否开启鼠标滚轮响应 */
   wheelable: boolean;
 }
@@ -192,6 +339,8 @@ interface ThemePreferences {
   colorSuccess: string;
   /** 警告色 */
   colorWarning: string;
+  /** 字体大小（单位：px） */
+  fontSize: number;
   /** 当前主题 */
   mode: ThemeModeType;
   /** 圆角 */
@@ -200,6 +349,8 @@ interface ThemePreferences {
   semiDarkHeader: boolean;
   /** 是否开启半深色菜单（只在theme='light'时生效） */
   semiDarkSidebar: boolean;
+  /** 是否开启半深色子菜单（只在theme='light'时生效） */
+  semiDarkSidebarSub: boolean;
 }
 
 interface TransitionPreferences {
@@ -216,20 +367,42 @@ interface TransitionPreferences {
 interface WidgetPreferences {
   /** 是否启用全屏部件 */
   fullscreen: boolean;
+  /** 全屏按钮位置 */
+  fullscreenButtonPosition: 'header' | 'none' | 'user-dropdown';
   /** 是否启用全局搜索部件 */
   globalSearch: boolean;
+  /** 全局搜索按钮位置 */
+  globalSearchButtonPosition: 'header' | 'none' | 'user-dropdown';
   /** 是否启用语言切换部件 */
   languageToggle: boolean;
+  /** 语言切换按钮位置 */
+  languageToggleButtonPosition: 'header' | 'none' | 'user-dropdown';
   /** 是否开启锁屏功能 */
   lockScreen: boolean;
+  /** 锁屏按钮位置 */
+  lockScreenButtonPosition: 'header' | 'none' | 'user-dropdown';
+  /** 退出登录按钮位置 */
+  logoutButtonPosition: 'header' | 'none' | 'user-dropdown';
   /** 是否显示通知部件 */
   notification: boolean;
+  /** 通知按钮位置 */
+  notificationButtonPosition: 'header' | 'none' | 'user-dropdown';
+  /** 小部件排序 */
+  order: readonly string[];
   /** 显示刷新按钮 */
   refresh: boolean;
+  /** 刷新按钮位置 */
+  refreshButtonPosition: 'header' | 'none' | 'user-dropdown';
   /** 是否显示侧边栏显示/隐藏部件 */
   sidebarToggle: boolean;
   /** 是否显示主题切换部件 */
   themeToggle: boolean;
+  /** 主题切换按钮位置 */
+  themeToggleButtonPosition: 'header' | 'none' | 'user-dropdown';
+  /** 是否显示时区部件 */
+  timezone: boolean;
+  /** 时区按钮位置 */
+  timezoneButtonPosition: 'header' | 'none' | 'user-dropdown';
 }
 
 interface Preferences {
@@ -263,19 +436,33 @@ interface Preferences {
 
 type PreferencesKeys = keyof Preferences;
 
-interface InitialOptions {
+interface InitialOptions<
+  TCustomPreferences extends object = CustomPreferencesRecord,
+> {
+  extension?: PreferencesExtension<TCustomPreferences>;
   namespace: string;
   overrides?: DeepPartial<Preferences>;
 }
 export type {
+  AnyCustomPreferencesField,
   AppPreferences,
+  BaseCustomPreferencesField,
   BreadcrumbPreferences,
+  CustomPreferencesField,
+  CustomPreferencesInputField,
+  CustomPreferencesNumberField,
+  CustomPreferencesOption,
+  CustomPreferencesRecord,
+  CustomPreferencesSelectField,
+  CustomPreferencesSwitchField,
+  CustomPreferencesValue,
   FooterPreferences,
   HeaderPreferences,
   InitialOptions,
   LogoPreferences,
   NavigationPreferences,
   Preferences,
+  PreferencesExtension,
   PreferencesKeys,
   ShortcutKeyPreferences,
   SidebarPreferences,
diff --git a/packages/@core/preferences/src/update-css-variables.ts b/packages/@core/preferences/src/update-css-variables.ts
index 0d3466a0..6ee5f748 100644
--- a/packages/@core/preferences/src/update-css-variables.ts
+++ b/packages/@core/preferences/src/update-css-variables.ts
@@ -66,6 +66,19 @@ function updateCSSVariables(preferences: Preferences) {
   if (Reflect.has(theme, 'radius')) {
     document.documentElement.style.setProperty('--radius', `${radius}rem`);
   }
+
+  // 更新字体大小
+  if (Reflect.has(theme, 'fontSize')) {
+    const fontSize = theme.fontSize;
+    document.documentElement.style.setProperty(
+      '--font-size-base',
+      `${fontSize}px`,
+    );
+    document.documentElement.style.setProperty(
+      '--menu-font-size',
+      `calc(${fontSize}px * 0.875)`,
+    );
+  }
 }
 
 /**
diff --git a/packages/@core/preferences/src/use-preferences.ts b/packages/@core/preferences/src/use-preferences.ts
index fc1e2de5..1231efa1 100644
--- a/packages/@core/preferences/src/use-preferences.ts
+++ b/packages/@core/preferences/src/use-preferences.ts
@@ -1,18 +1,29 @@
 import { computed } from 'vue';
 
-import { diff } from '@vben-core/shared/utils';
+import { diff, diffStrict } from '@vben-core/shared/utils';
 
 import { preferencesManager } from './preferences';
 import { isDarkTheme } from './update-css-variables';
 
 function usePreferences() {
   const preferences = preferencesManager.getPreferences();
+  const customPreferences = preferencesManager.getCustomPreferences();
   const initialPreferences = preferencesManager.getInitialPreferences();
+  const initialCustomPreferences =
+    preferencesManager.getInitialCustomPreferences();
+  const preferencesExtension = computed(() =>
+    preferencesManager.getPreferencesExtension(),
+  );
   /**
    * @zh_CN 计算偏好设置的变化
+   * @zh_CN 使用 diffStrict：图标排序等数组字段需顺序敏感比较
    */
   const diffPreference = computed(() => {
-    return diff(initialPreferences, preferences);
+    return diffStrict(initialPreferences, preferences);
+  });
+
+  const diffCustomPreference = computed(() => {
+    return diff(initialCustomPreferences, customPreferences);
   });
 
   const appPreferences = computed(() => preferences.app);
@@ -29,7 +40,7 @@ function usePreferences() {
   });
 
   const locale = computed(() => {
-    return preferences.app.locale;
+    return appPreferences.value.locale;
   });
 
   const isMobile = computed(() => {
@@ -82,6 +93,20 @@ function usePreferences() {
     () => appPreferences.value.layout === 'header-nav',
   );
 
+  /**
+   * @zh_CN 是否为头部混合导航模式
+   */
+  const isHeaderMixedNav = computed(
+    () => appPreferences.value.layout === 'header-mixed-nav',
+  );
+
+  /**
+   * @zh_CN 是否为顶部通栏+侧边导航模式
+   */
+  const isHeaderSidebarNav = computed(
+    () => appPreferences.value.layout === 'header-sidebar-nav',
+  );
+
   /**
    * @zh_CN 是否为混合导航模式
    */
@@ -93,7 +118,13 @@ function usePreferences() {
    * @zh_CN 是否包含侧边导航模式
    */
   const isSideMode = computed(() => {
-    return isMixedNav.value || isSideMixedNav.value || isSideNav.value;
+    return (
+      isMixedNav.value ||
+      isSideMixedNav.value ||
+      isSideNav.value ||
+      isHeaderMixedNav.value ||
+      isHeaderSidebarNav.value
+    );
   });
 
   const sidebarCollapsed = computed(() => {
@@ -116,7 +147,7 @@ function usePreferences() {
   });
 
   /**
-   * @zh_CN 登录注册页面布局是否为左侧
+   * @zh_CN 登录注册页面布局是否为右侧
    */
   const authPanelRight = computed(() => {
     return appPreferences.value.authPageLayout === 'panel-right';
@@ -155,6 +186,14 @@ function usePreferences() {
     return enable && globalLogout;
   });
 
+  /**
+   * @zh_CN 是否启用全局注销快捷键
+   */
+  const globalEscapeShortcutKey = computed(() => {
+    const { enable, globalEscape } = shortcutKeysPreferences.value;
+    return enable && globalEscape;
+  });
+
   const globalLockScreenShortcutKey = computed(() => {
     const { enable, globalLockScreen } = shortcutKeysPreferences.value;
     return enable && globalLockScreen;
@@ -165,12 +204,12 @@ function usePreferences() {
    */
   const preferencesButtonPosition = computed(() => {
     const { enablePreferences, preferencesButtonPosition } = preferences.app;
-
     // 如果没有启用偏好设置按钮
     if (!enablePreferences) {
       return {
         fixed: false,
         header: false,
+        userDropdown: false,
       };
     }
 
@@ -181,12 +220,15 @@ function usePreferences() {
     const contentIsMaximize = headerHidden && sidebarHidden;
 
     const isHeaderPosition = preferencesButtonPosition === 'header';
+    const isUserDropdownPosition =
+      preferencesButtonPosition === 'user-dropdown';
 
     // 如果设置了固定位置
     if (preferencesButtonPosition !== 'auto') {
       return {
         fixed: preferencesButtonPosition === 'fixed',
         header: isHeaderPosition,
+        userDropdown: isUserDropdownPosition,
       };
     }
 
@@ -200,6 +242,7 @@ function usePreferences() {
     return {
       fixed,
       header: !fixed,
+      userDropdown: !fixed && isUserDropdownPosition,
     };
   });
 
@@ -208,13 +251,18 @@ function usePreferences() {
     authPanelLeft,
     authPanelRight,
     contentIsMaximize,
+    customPreferences,
     diffPreference,
+    diffCustomPreference,
     globalLockScreenShortcutKey,
     globalLogoutShortcutKey,
+    globalEscapeShortcutKey,
     globalSearchShortcutKey,
     isDark,
     isFullContent,
+    isHeaderMixedNav,
     isHeaderNav,
+    isHeaderSidebarNav,
     isMixedNav,
     isMobile,
     isSideMixedNav,
@@ -223,9 +271,11 @@ function usePreferences() {
     keepAlive,
     layout,
     locale,
+    preferencesExtension,
     preferencesButtonPosition,
     sidebarCollapsed,
     theme,
+    app: appPreferences.value,
   };
 }
 
diff --git a/packages/@core/preferences/tsdown.config.ts b/packages/@core/preferences/tsdown.config.ts
new file mode 100644
index 00000000..c4f51c5e
--- /dev/null
+++ b/packages/@core/preferences/tsdown.config.ts
@@ -0,0 +1,11 @@
+import { defineConfig } from 'tsdown';
+
+export default defineConfig({
+  clean: true,
+  dts: true,
+  entry: ['src/index.ts'],
+  format: ['esm'],
+  outExtensions: () => ({
+    dts: '.d.ts',
+  }),
+});
diff --git a/packages/@core/ui-kit/form-ui/__tests__/benchmark-fixtures.ts b/packages/@core/ui-kit/form-ui/__tests__/benchmark-fixtures.ts
new file mode 100644
index 00000000..a6e9f004
--- /dev/null
+++ b/packages/@core/ui-kit/form-ui/__tests__/benchmark-fixtures.ts
@@ -0,0 +1,21 @@
+import { defineComponent, h } from 'vue';
+
+export const TestInput = defineComponent({
+  inheritAttrs: false,
+  emits: ['update:modelValue'],
+  setup(_props, { attrs, emit }) {
+    function handleInput(event: Event) {
+      const target = event.target;
+      if (target instanceof HTMLInputElement) {
+        emit('update:modelValue', target.value);
+      }
+    }
+
+    return () =>
+      h('input', {
+        ...attrs,
+        onInput: handleInput,
+        value: attrs.modelValue ?? '',
+      });
+  },
+});
diff --git a/packages/@core/ui-kit/form-ui/__tests__/form-api.test.ts b/packages/@core/ui-kit/form-ui/__tests__/form-api.test.ts
index 31aa3554..afa44b85 100644
--- a/packages/@core/ui-kit/form-ui/__tests__/form-api.test.ts
+++ b/packages/@core/ui-kit/form-ui/__tests__/form-api.test.ts
@@ -1,6 +1,9 @@
+import type { BaseFormComponentType } from '../src/types';
+
 import { beforeEach, describe, expect, it, vi } from 'vitest';
 
 import { FormApi } from '../src/form-api';
+import { FormCodecError } from '../src/form-codec';
 
 describe('formApi', () => {
   let formApi: FormApi;
@@ -44,6 +47,7 @@ describe('formApi', () => {
     await formApi.mount(formActions);
     expect(formApi.isMounted).toBe(true);
     expect(formApi.form).toEqual(formActions);
+    expect(formApi.getFieldComponentRef('name')).toBeUndefined();
   });
 
   it('should get values from form', async () => {
@@ -52,11 +56,272 @@ describe('formApi', () => {
       values: { name: 'test' },
     };
 
-    await formApi.mount(formActions);
+    await formApi.mount(formActions, new Map());
     const values = await formApi.getValues();
     expect(values).toEqual({ name: 'test' });
   });
 
+  it('should set a field error through the public api', async () => {
+    const setFieldError = vi.fn();
+    const formActions: any = {
+      meta: {},
+      setFieldError,
+      values: {},
+    };
+
+    formApi.mount(formActions, new Map());
+    await formApi.setFieldError('password', 'Invalid password');
+
+    expect(setFieldError).toHaveBeenCalledWith('password', 'Invalid password');
+  });
+
+  it('should format schema values when getting values', async () => {
+    formApi.setState({
+      schema: [
+        {
+          component: 'range-picker',
+          fieldName: 'filters.range',
+          valueFormat: (value, setValue) => {
+            setValue('filters.startTime', value?.[0]);
+            setValue('filters.endTime', value?.[1]);
+          },
+        },
+      ],
+    });
+
+    const formActions: any = {
+      meta: {},
+      values: {
+        filters: {
+          range: [1_710_000_000_000, 1_720_000_000_000],
+        },
+      },
+    };
+    const originalValuesSnapshot = structuredClone(formActions.values);
+
+    await formApi.mount(formActions, new Map());
+
+    expect(formApi.getLatestSubmissionValues()).toEqual({
+      filters: {
+        endTime: 1_720_000_000_000,
+        startTime: 1_710_000_000_000,
+      },
+    });
+
+    const values = await formApi.getValues();
+    expect(values).toEqual({
+      filters: {
+        endTime: 1_720_000_000_000,
+        startTime: 1_710_000_000_000,
+      },
+    });
+    expect(await formApi.getRawValues()).toEqual(originalValuesSnapshot);
+    expect(await formApi.getValueSnapshot()).toEqual({
+      rawValues: originalValuesSnapshot,
+      values,
+    });
+    expect(formActions.values).toEqual(originalValuesSnapshot);
+  });
+
+  it('should encode submissions and decode complete values with a codec', async () => {
+    interface FilterFormValues {
+      period: [number, number];
+      tags: string[];
+    }
+
+    interface FilterSubmitValues {
+      endTime: number;
+      startTime: number;
+      tags: string;
+    }
+
+    const setValues = vi.fn();
+    const codecFormApi = new FormApi<
+      FilterFormValues,
+      BaseFormComponentType,
+      Record<never, never>,
+      FilterSubmitValues
+    >({
+      codec: {
+        decode(values) {
+          return {
+            period: [values.startTime, values.endTime],
+            tags: values.tags.split(','),
+          };
+        },
+        encode(values) {
+          return {
+            endTime: values.period[1],
+            startTime: values.period[0],
+            tags: values.tags.join(','),
+          };
+        },
+      },
+    });
+    const formActions: any = {
+      meta: {},
+      setValues,
+      values: { period: [1, 2], tags: ['admin', 'user'] },
+    };
+
+    await codecFormApi.mount(formActions, new Map());
+
+    expect(await codecFormApi.getValues()).toEqual({
+      endTime: 2,
+      startTime: 1,
+      tags: 'admin,user',
+    });
+    expect(await codecFormApi.getValueSnapshot()).toEqual({
+      rawValues: { period: [1, 2], tags: ['admin', 'user'] },
+      values: { endTime: 2, startTime: 1, tags: 'admin,user' },
+    });
+
+    await codecFormApi.setSubmitValues(
+      { endTime: 4, startTime: 3, tags: 'editor' },
+      false,
+    );
+    expect(setValues).toHaveBeenCalledWith(
+      { period: [3, 4], tags: ['editor'] },
+      false,
+    );
+  });
+
+  it('should isolate codec results from live form values', async () => {
+    interface ProfileFormValues {
+      profile: { name: string };
+      tags: string[];
+    }
+
+    const values: ProfileFormValues = {
+      profile: { name: 'Ada' },
+      tags: ['admin'],
+    };
+    const codecFormApi = new FormApi<ProfileFormValues>({
+      codec: {
+        decode: (submitValues) => submitValues,
+        encode: (formValues) => ({
+          profile: formValues.profile,
+          tags: formValues.tags,
+        }),
+      },
+    });
+    const formActions: any = { meta: {}, values };
+
+    codecFormApi.mount(formActions, new Map());
+    const initialSubmissionValues = codecFormApi.getLatestSubmissionValues();
+    values.profile.name = 'Grace';
+    values.tags.push('user');
+
+    expect(initialSubmissionValues).toEqual({
+      profile: { name: 'Ada' },
+      tags: ['admin'],
+    });
+    const submissionValues = await codecFormApi.getValues();
+    expect(submissionValues.profile).not.toBe(values.profile);
+    expect(submissionValues.tags).not.toBe(values.tags);
+  });
+
+  it('should fall back to raw values when the initial codec encode fails', async () => {
+    const warning = vi.spyOn(console, 'warn').mockImplementation(() => {});
+    const codecFormApi = new FormApi<
+      { name?: string },
+      BaseFormComponentType,
+      Record<never, never>,
+      { normalizedName: string }
+    >({
+      codec: {
+        decode: (values) => ({ name: values.normalizedName }),
+        encode() {
+          throw new Error('incomplete initial values');
+        },
+      },
+    });
+    const formActions: any = { meta: {}, values: { name: 'Ada' } };
+
+    expect(() => codecFormApi.mount(formActions, new Map())).not.toThrow();
+
+    expect(codecFormApi.isMounted).toBe(true);
+    expect(codecFormApi.getLatestSubmissionValues()).toEqual({ name: 'Ada' });
+    expect(warning).toHaveBeenCalledWith(
+      '[Vben Form] Failed to encode initial values. Falling back to raw form values.',
+      expect.objectContaining({ phase: 'encode' }),
+    );
+    await expect(codecFormApi.getValues()).rejects.toBeInstanceOf(
+      FormCodecError,
+    );
+  });
+
+  it('should scan deprecated schema transforms once for unchanged state', async () => {
+    const getChildren = vi.fn(() => []);
+    const schema = {
+      component: 'text',
+      fieldName: 'name',
+      get children() {
+        return getChildren();
+      },
+    } as any;
+    const codecFormApi = new FormApi({
+      codec: {
+        decode: (values) => values,
+        encode: (values) => values,
+      },
+      schema: [schema],
+    });
+    const formActions: any = {
+      meta: {},
+      values: { name: 'Ada' },
+    };
+
+    await codecFormApi.mount(formActions, new Map());
+    expect(getChildren).toHaveBeenCalledTimes(1);
+
+    await codecFormApi.getValues();
+    await codecFormApi.getValues();
+
+    expect(getChildren).toHaveBeenCalledTimes(1);
+  });
+
+  it('should format child schema values inside array fields', async () => {
+    formApi.setState({
+      schema: [
+        {
+          children: [
+            {
+              component: 'text',
+              fieldName: 'name',
+              valueFormat: (
+                value: any,
+                setValue: any,
+                _values: any,
+                ctx: any,
+              ) => {
+                setValue('normalizedName', value?.trim());
+                setValue('$root.firstRow', ctx?.rowIndex);
+              },
+            },
+          ],
+          fieldName: 'contacts',
+          type: 'array',
+        } as any,
+      ],
+    });
+
+    const formActions: any = {
+      meta: {},
+      values: {
+        contacts: [{ name: ' Ada ' }, { name: ' Grace ' }],
+      },
+    };
+
+    await formApi.mount(formActions, new Map());
+
+    const values = await formApi.getValues();
+    expect(values).toEqual({
+      contacts: [{ normalizedName: 'Ada' }, { normalizedName: 'Grace' }],
+      firstRow: 1,
+    });
+  });
+
   it('should set field value', async () => {
     const setFieldValueMock = vi.fn();
     const formActions: any = {
@@ -65,7 +330,7 @@ describe('formApi', () => {
       values: { name: 'test' },
     };
 
-    await formApi.mount(formActions);
+    await formApi.mount(formActions, new Map());
     await formApi.setFieldValue('name', 'new value');
     expect(setFieldValueMock).toHaveBeenCalledWith(
       'name',
@@ -74,24 +339,59 @@ describe('formApi', () => {
     );
   });
 
-  it('should reset form', async () => {
-    const resetFormMock = vi.fn();
+  it('should set only known fields without losing provided values', async () => {
+    const setValuesMock = vi.fn();
+    formApi.setState({
+      schema: [
+        { component: 'text', fieldName: 'name' },
+        { component: 'text', fieldName: 'profile.email' },
+      ],
+    });
     const formActions: any = {
       meta: {},
-      resetForm: resetFormMock,
+      setValues: setValuesMock,
+      values: {},
+    };
+
+    await formApi.mount(formActions, new Map());
+    await formApi.setValues({
+      name: 'Ada',
+      profile: {
+        email: 'ada@example.com',
+        ignored: true,
+      },
+      unknown: 'ignored',
+    });
+
+    expect(setValuesMock).toHaveBeenCalledWith(
+      {
+        name: 'Ada',
+        profile: {
+          email: 'ada@example.com',
+        },
+      },
+      false,
+    );
+  });
+
+  it('should reset form', async () => {
+    const resetMock = vi.fn();
+    const formActions: any = {
+      meta: {},
+      reset: resetMock,
       values: { name: 'test' },
     };
 
-    await formApi.mount(formActions);
-    await formApi.resetForm();
-    expect(resetFormMock).toHaveBeenCalled();
+    await formApi.mount(formActions, new Map());
+    await formApi.reset();
+    expect(resetMock).toHaveBeenCalled();
   });
 
   it('should call handleSubmit on submit', async () => {
     const handleSubmitMock = vi.fn();
     const formActions: any = {
       meta: {},
-      submitForm: vi.fn().mockResolvedValue(true),
+      submit: vi.fn().mockResolvedValue(true),
       values: { name: 'test' },
     };
 
@@ -100,11 +400,14 @@ describe('formApi', () => {
     };
 
     formApi.setState(state);
-    await formApi.mount(formActions);
+    await formApi.mount(formActions, new Map());
 
-    const result = await formApi.submitForm();
-    expect(formActions.submitForm).toHaveBeenCalled();
-    expect(handleSubmitMock).toHaveBeenCalledWith({ name: 'test' });
+    const result = await formApi.submit();
+    expect(formActions.submit).toHaveBeenCalled();
+    expect(handleSubmitMock).toHaveBeenCalledWith(
+      { name: 'test' },
+      { name: 'test' },
+    );
     expect(result).toEqual({ name: 'test' });
   });
 
@@ -113,6 +416,39 @@ describe('formApi', () => {
     expect(formApi.isMounted).toBe(false);
   });
 
+  it('should clear component refs on unmount before mounting again', async () => {
+    const formActions: any = {
+      meta: {},
+      resetForm: vi.fn(),
+      values: { name: 'test' },
+    };
+    const staleMap = new Map<string, unknown>([
+      [
+        'name',
+        {
+          $: {
+            type: { name: 'MockComponent' },
+          },
+          $el: {},
+        },
+      ],
+    ]);
+
+    await formApi.mount(formActions, staleMap);
+    expect(formApi.getFieldComponentRef('name')).toEqual({
+      $: {
+        type: { name: 'MockComponent' },
+      },
+      $el: {},
+    });
+
+    formApi.unmount();
+    expect(formApi.getFieldComponentRef('name')).toBeUndefined();
+
+    await formApi.mount(formActions);
+    expect(formApi.getFieldComponentRef('name')).toBeUndefined();
+  });
+
   it('should validate form', async () => {
     const validateMock = vi.fn().mockResolvedValue(true);
     const formActions: any = {
@@ -120,11 +456,53 @@ describe('formApi', () => {
       validate: validateMock,
     };
 
-    await formApi.mount(formActions);
+    await formApi.mount(formActions, new Map());
     const isValid = await formApi.validate();
     expect(validateMock).toHaveBeenCalled();
     expect(isValid).toBe(true);
   });
+
+  it('should validate only once before submitting valid values', async () => {
+    const handleSubmit = vi.fn();
+    const formActions: any = {
+      meta: {},
+      submit: vi.fn(),
+      validate: vi.fn().mockResolvedValue({ errors: {}, valid: true }),
+      values: { name: 'Ada' },
+    };
+
+    formApi.setState({ handleSubmit });
+    await formApi.mount(formActions, new Map());
+
+    await expect(formApi.validateAndSubmit()).resolves.toEqual({ name: 'Ada' });
+    expect(formActions.validate).toHaveBeenCalledOnce();
+    expect(formActions.submit).not.toHaveBeenCalled();
+    expect(handleSubmit).toHaveBeenCalledOnce();
+  });
+
+  it('should not submit invalid values', async () => {
+    const handleSubmit = vi.fn();
+    const errors = { name: 'Name is required' };
+    const formActions: any = {
+      meta: {},
+      submit: vi.fn(),
+      validate: vi.fn().mockResolvedValue({ errors, valid: false }),
+      values: { name: '' },
+    };
+    const scrollToFirstError = vi
+      .spyOn(formApi as any, 'scrollToFirstError')
+      .mockImplementation(() => {});
+
+    formApi.setState({ handleSubmit, scrollToFirstError: true });
+    await formApi.mount(formActions, new Map());
+
+    await expect(formApi.validateAndSubmit()).resolves.toBeUndefined();
+    expect(formActions.validate).toHaveBeenCalledOnce();
+    expect(formActions.submit).not.toHaveBeenCalled();
+    expect(handleSubmit).not.toHaveBeenCalled();
+    expect(scrollToFirstError).toHaveBeenCalledOnce();
+    expect(scrollToFirstError).toHaveBeenCalledWith(errors);
+  });
 });
 
 describe('updateSchema', () => {
@@ -152,6 +530,35 @@ describe('updateSchema', () => {
     expect(instance.state?.schema?.[1]?.label).toBe('Age');
   });
 
+  it('should update child schema by parent path', () => {
+    instance.state = {
+      schema: [
+        {
+          children: [
+            { component: 'text', fieldName: 'name', label: 'Name' },
+            { component: 'text', fieldName: 'phone', label: 'Phone' },
+          ],
+          fieldName: 'contacts',
+          type: 'array',
+        } as any,
+      ],
+    };
+
+    instance.updateSchema([
+      {
+        fieldName: 'contacts.name',
+        label: 'Full Name',
+      },
+    ]);
+
+    expect((instance.state?.schema?.[0] as any)?.children?.[0]?.label).toBe(
+      'Full Name',
+    );
+    expect((instance.state?.schema?.[0] as any)?.children?.[1]?.label).toBe(
+      'Phone',
+    );
+  });
+
   it('should log an error if fieldName is missing in some items', () => {
     const newSchema: any[] = [
       { component: 'textarea', fieldName: 'name' },
diff --git a/packages/@core/ui-kit/form-ui/__tests__/form-codec.test.ts b/packages/@core/ui-kit/form-ui/__tests__/form-codec.test.ts
new file mode 100644
index 00000000..4c5a60cc
--- /dev/null
+++ b/packages/@core/ui-kit/form-ui/__tests__/form-codec.test.ts
@@ -0,0 +1,81 @@
+import type { FormCodec } from '../src/types';
+
+import { describe, expect, expectTypeOf, it } from 'vitest';
+
+import {
+  decodeFormValues,
+  encodeFormValues,
+  FormCodecError,
+} from '../src/form-codec';
+
+interface FilterFormValues {
+  period: [number, number];
+  tags: string[];
+}
+
+interface FilterSubmitValues {
+  endTime: number;
+  startTime: number;
+  tags: string;
+}
+
+const filterCodec: FormCodec<FilterFormValues, FilterSubmitValues> = {
+  decode(values) {
+    return {
+      period: [values.startTime, values.endTime],
+      tags: values.tags ? values.tags.split(',') : [],
+    };
+  },
+  encode(values) {
+    return {
+      endTime: values.period[1],
+      startTime: values.period[0],
+      tags: values.tags.join(','),
+    };
+  },
+};
+
+describe('form codec', () => {
+  it('encodes and decodes complete form values', () => {
+    const submitValues = encodeFormValues(filterCodec, {
+      period: [1, 2],
+      tags: ['admin', 'user'],
+    });
+
+    expect(submitValues).toEqual({
+      endTime: 2,
+      startTime: 1,
+      tags: 'admin,user',
+    });
+    expect(decodeFormValues(filterCodec, submitValues)).toEqual({
+      period: [1, 2],
+      tags: ['admin', 'user'],
+    });
+    expectTypeOf(submitValues).toEqualTypeOf<FilterSubmitValues>();
+  });
+
+  it('reports the failed codec phase without mutating inputs', () => {
+    const values = Object.freeze({ period: [1, 2], tags: ['admin'] }) as {
+      period: [number, number];
+      tags: string[];
+    };
+    const codec: FormCodec<FilterFormValues, FilterSubmitValues> = {
+      decode: filterCodec.decode,
+      encode() {
+        throw new Error('broken encoder');
+      },
+    };
+
+    expect(() => encodeFormValues(codec, values)).toThrowError(FormCodecError);
+
+    let codecError: unknown;
+    try {
+      encodeFormValues(codec, values);
+    } catch (error) {
+      codecError = error;
+    }
+    expect(codecError).toBeInstanceOf(FormCodecError);
+    expect(codecError).toMatchObject({ phase: 'encode' });
+    expect(values).toEqual({ period: [1, 2], tags: ['admin'] });
+  });
+});
diff --git a/packages/@core/ui-kit/form-ui/__tests__/form-compatibility.test.ts b/packages/@core/ui-kit/form-ui/__tests__/form-compatibility.test.ts
new file mode 100644
index 00000000..de96d5c8
--- /dev/null
+++ b/packages/@core/ui-kit/form-ui/__tests__/form-compatibility.test.ts
@@ -0,0 +1,180 @@
+import type { BaseFormComponentType } from '../src/types';
+
+import { afterEach, describe, expect, it, vi } from 'vitest';
+
+import { setupVbenForm } from '../src/config';
+import {
+  resetDeprecationWarnings,
+  warnDeprecatedOnce,
+} from '../src/deprecation';
+import { FormApi } from '../src/form-api';
+import { getFormRule } from '../src/rule-registry';
+
+afterEach(() => {
+  resetDeprecationWarnings();
+  vi.restoreAllMocks();
+});
+
+describe('form api compatibility', () => {
+  it('keeps deprecated value transforms and warns once per API', async () => {
+    const warning = vi.spyOn(console, 'warn').mockImplementation(() => {});
+    const formApi = new FormApi({
+      arrayToStringFields: ['tags'],
+      fieldMappingTime: [['period', ['startTime', 'endTime'], null]],
+      schema: [
+        {
+          component: 'input',
+          fieldName: 'name',
+          valueFormat: (value: string) => value.trim(),
+        },
+      ],
+    });
+    const form = {
+      meta: {},
+      values: {
+        name: ' Ada ',
+        period: [1, 2],
+        tags: ['admin', 'user'],
+      },
+    } as any;
+
+    formApi.mount(form);
+
+    expect(await formApi.getValues()).toEqual({
+      endTime: 2,
+      name: 'Ada',
+      startTime: 1,
+      tags: 'admin,user',
+    });
+    expect(warning).toHaveBeenCalledTimes(3);
+    expect(warning).toHaveBeenCalledWith(
+      '[Vben Form] `schema.valueFormat` is deprecated. Use the form-level `codec` instead.',
+    );
+    expect(warning).toHaveBeenCalledWith(
+      '[Vben Form] `fieldMappingTime` is deprecated. Use the form-level `codec` instead.',
+    );
+    expect(warning).toHaveBeenCalledWith(
+      '[Vben Form] `arrayToStringFields` is deprecated. Use the form-level `codec` instead.',
+    );
+  });
+
+  it('prefers the codec when deprecated transforms are also configured', async () => {
+    const warning = vi.spyOn(console, 'warn').mockImplementation(() => {});
+    const formApi = new FormApi<
+      { name: string },
+      BaseFormComponentType,
+      Record<never, never>,
+      { normalizedName: string }
+    >({
+      codec: {
+        decode(values) {
+          return { name: values.normalizedName };
+        },
+        encode(values) {
+          return { normalizedName: values.name.toUpperCase() };
+        },
+      },
+      schema: [
+        {
+          component: 'input',
+          fieldName: 'name',
+          valueFormat: () => 'legacy',
+        },
+      ],
+    });
+    const form = { meta: {}, values: { name: 'Ada' } } as any;
+
+    formApi.mount(form);
+
+    expect(await formApi.getValues()).toEqual({ normalizedName: 'ADA' });
+    expect(warning).toHaveBeenCalledOnce();
+    expect(warning).toHaveBeenCalledWith(
+      '[Vben Form] The form `codec` takes precedence over deprecated `valueFormat`, `fieldMappingTime`, and `arrayToStringFields` options.',
+    );
+  });
+
+  it('forwards defineRules and warns only once in development', async () => {
+    const warning = vi.spyOn(console, 'warn').mockImplementation(() => {});
+    const legacyRule = () => 'legacy error';
+
+    setupVbenForm({ defineRules: { legacy: legacyRule } });
+    setupVbenForm({ defineRules: { legacy: legacyRule } });
+
+    expect(warning).toHaveBeenCalledOnce();
+    expect(warning).toHaveBeenCalledWith(
+      '[Vben Form] `setupVbenForm({ defineRules })` is deprecated. Use `setupVbenForm({ rules })` instead.',
+    );
+    const registeredRule = getFormRule('legacy');
+    expect(registeredRule).toBeDefined();
+    if (!registeredRule) return;
+    expect(
+      await registeredRule('', [], {
+        field: { name: 'legacy' },
+        name: 'legacy',
+      }),
+    ).toBe('legacy error');
+  });
+
+  it('prefers the new rules option when both APIs define the same rule', async () => {
+    vi.spyOn(console, 'warn').mockImplementation(() => {});
+    setupVbenForm({
+      defineRules: { required: () => 'legacy error' },
+      rules: { required: () => 'new error' },
+    });
+
+    const registeredRule = getFormRule('required');
+    expect(registeredRule).toBeDefined();
+    if (!registeredRule) return;
+    expect(
+      await registeredRule('', [], {
+        field: { name: 'required' },
+        name: 'required',
+      }),
+    ).toBe('new error');
+  });
+
+  it('does not emit deprecation warnings in production', () => {
+    const warning = vi.spyOn(console, 'warn').mockImplementation(() => {});
+
+    warnDeprecatedOnce('legacy-api', 'deprecated', { production: true });
+
+    expect(warning).not.toHaveBeenCalled();
+  });
+
+  it('keeps legacy form methods and warns once for each name', async () => {
+    const warning = vi.spyOn(console, 'warn').mockImplementation(() => {});
+    const formApi = new FormApi();
+    const form = {
+      clearValidation: vi.fn(),
+      meta: {},
+      reset: vi.fn(),
+      submit: vi.fn(),
+      validate: vi.fn().mockResolvedValue({ errors: {}, valid: true }),
+      values: { name: 'Ada' },
+    } as any;
+    formApi.mount(form);
+
+    await formApi.resetForm();
+    await formApi.resetForm();
+    await formApi.resetValidate();
+    await formApi.submitForm();
+    await formApi.validateAndSubmitForm();
+
+    expect(form.reset).toHaveBeenCalledTimes(2);
+    expect(form.clearValidation).toHaveBeenCalledOnce();
+    expect(form.submit).toHaveBeenCalledOnce();
+    expect(warning).toHaveBeenCalledTimes(4);
+    expect(warning).toHaveBeenCalledWith(
+      '[Vben Form] `formApi.resetForm()` is deprecated. Use `formApi.reset()` instead.',
+    );
+    expect(warning).toHaveBeenCalledWith(
+      '[Vben Form] `formApi.resetValidate()` is deprecated. Use `formApi.clearValidation()` instead.',
+    );
+    expect(warning).toHaveBeenCalledWith(
+      '[Vben Form] `formApi.submitForm()` is deprecated. Use `formApi.submit()` instead.',
+    );
+    expect(warning).toHaveBeenCalledWith(
+      '[Vben Form] `formApi.validateAndSubmitForm()` is deprecated. Use `formApi.validateAndSubmit()` instead.',
+    );
+  });
+});
diff --git a/packages/@core/ui-kit/form-ui/__tests__/form-component-performance.benchmark.ts b/packages/@core/ui-kit/form-ui/__tests__/form-component-performance.benchmark.ts
new file mode 100644
index 00000000..e11fb006
--- /dev/null
+++ b/packages/@core/ui-kit/form-ui/__tests__/form-component-performance.benchmark.ts
@@ -0,0 +1,190 @@
+import type { FormSchema } from '../src/types';
+
+import { flushPromises, mount } from '@vue/test-utils';
+import { nextTick } from 'vue';
+
+import { afterAll, bench, describe } from 'vitest';
+import { z } from 'zod';
+
+import { setupVbenForm } from '../src/config';
+import { useVbenForm } from '../src/use-vben-form';
+import { TestInput } from './benchmark-fixtures';
+
+const BENCHMARK_OPTIONS = { time: 750, warmupTime: 150 } as const;
+const FIELD_COUNT = 100;
+const MOUNT_FIELD_COUNT = 50;
+
+function createFlatSchema(
+  fieldCount: number,
+  withRules: boolean = false,
+): FormSchema[] {
+  const rule = withRules ? z.string().min(1) : undefined;
+  return Array.from({ length: fieldCount }, (_, index) => ({
+    component: TestInput,
+    defaultValue: `Value ${index}`,
+    fieldName: `field${index}`,
+    label: `Field ${index}`,
+    rules: rule,
+  }));
+}
+
+function createFlatValues(prefix: string) {
+  return Object.fromEntries(
+    Array.from({ length: FIELD_COUNT }, (_, index) => [
+      `field${index}`,
+      `${prefix} ${index}`,
+    ]),
+  );
+}
+
+setupVbenForm({ config: {}, rules: {} });
+
+const flatSchema = createFlatSchema(FIELD_COUNT);
+const [FlatForm, flatFormApi] = useVbenForm<Record<string, string>>({
+  schema: flatSchema,
+  showDefaultActions: false,
+});
+const flatWrapper = mount(FlatForm);
+
+const [ValidationForm, validationFormApi] = useVbenForm<Record<string, string>>(
+  {
+    schema: createFlatSchema(FIELD_COUNT, true),
+    showDefaultActions: false,
+  },
+);
+const validationWrapper = mount(ValidationForm);
+
+const dependencySchema: FormSchema[] = [
+  {
+    component: TestInput,
+    defaultValue: 'editable',
+    fieldName: 'mode',
+    label: 'Mode',
+  },
+  ...Array.from({ length: 50 }, (_, index) => ({
+    component: TestInput,
+    defaultValue: `Value ${index}`,
+    dependencies: {
+      resolve: ({ values }: { values: Record<string, string> }) => ({
+        disabled: values.mode === 'locked',
+      }),
+      triggerFields: ['mode'],
+    },
+    fieldName: `dependent${index}`,
+    label: `Dependent ${index}`,
+  })),
+];
+const [DependencyForm, dependencyFormApi] = useVbenForm<Record<string, string>>(
+  {
+    schema: dependencySchema,
+    showDefaultActions: false,
+  },
+);
+const dependencyWrapper = mount(DependencyForm);
+
+await flushPromises();
+
+const batchValues = [createFlatValues('Alpha'), createFlatValues('Beta')];
+const schemaPatches = [false, true].map((disabled) =>
+  Array.from({ length: FIELD_COUNT }, (_, index) => ({
+    componentProps: { disabled },
+    fieldName: `field${index}`,
+  })),
+);
+let batchIteration = 0;
+let dependencyIteration = 0;
+let fieldIteration = 0;
+let resetIteration = 0;
+let schemaIteration = 0;
+
+afterAll(() => {
+  dependencyWrapper.unmount();
+  flatWrapper.unmount();
+  validationWrapper.unmount();
+});
+
+describe('form render performance', () => {
+  bench(
+    'initialize, mount, and unmount 50 fields',
+    async () => {
+      const [Form] = useVbenForm<Record<string, string>>({
+        schema: createFlatSchema(MOUNT_FIELD_COUNT),
+        showDefaultActions: false,
+      });
+      const wrapper = mount(Form);
+      await flushPromises();
+      wrapper.unmount();
+    },
+    BENCHMARK_OPTIONS,
+  );
+});
+
+describe('form value performance', () => {
+  bench(
+    'update one field in a 100-field form',
+    async () => {
+      fieldIteration += 1;
+      await flatFormApi.setFieldValue('field50', `Value ${fieldIteration}`);
+      await nextTick();
+    },
+    BENCHMARK_OPTIONS,
+  );
+
+  bench(
+    'set 100 fields in one batch',
+    async () => {
+      batchIteration += 1;
+      await flatFormApi.setValues(batchValues[batchIteration % 2] ?? {});
+      await nextTick();
+    },
+    BENCHMARK_OPTIONS,
+  );
+
+  bench(
+    'reset 100 fields to alternate values',
+    async () => {
+      resetIteration += 1;
+      await flatFormApi.reset(
+        { values: batchValues[resetIteration % 2] ?? {} },
+        { force: true },
+      );
+      await nextTick();
+    },
+    BENCHMARK_OPTIONS,
+  );
+});
+
+describe('form validation performance', () => {
+  bench(
+    'validate 100 fields with zod rules',
+    async () => {
+      await validationFormApi.validate();
+    },
+    BENCHMARK_OPTIONS,
+  );
+});
+
+describe('form schema performance', () => {
+  bench(
+    'update 100 schema entries',
+    async () => {
+      schemaIteration += 1;
+      flatFormApi.updateSchema(schemaPatches[schemaIteration % 2] ?? []);
+      await nextTick();
+    },
+    BENCHMARK_OPTIONS,
+  );
+
+  bench(
+    'resolve 50 dependencies from one trigger',
+    async () => {
+      dependencyIteration += 1;
+      await dependencyFormApi.setFieldValue(
+        'mode',
+        dependencyIteration % 2 === 0 ? 'editable' : 'locked',
+      );
+      await flushPromises();
+    },
+    BENCHMARK_OPTIONS,
+  );
+});
diff --git a/packages/@core/ui-kit/form-ui/__tests__/form-integration.test.ts b/packages/@core/ui-kit/form-ui/__tests__/form-integration.test.ts
new file mode 100644
index 00000000..fba7d18e
--- /dev/null
+++ b/packages/@core/ui-kit/form-ui/__tests__/form-integration.test.ts
@@ -0,0 +1,1137 @@
+import type { VueWrapper } from '@vue/test-utils';
+
+import type { FormSchemaRuleType, VbenFormFieldSlotProps } from '../src/types';
+
+import { flushPromises, mount } from '@vue/test-utils';
+import { defineComponent, h, nextTick } from 'vue';
+
+import { afterEach, beforeAll, describe, expect, it, vi } from 'vitest';
+import { z } from 'zod';
+
+import { setupVbenForm } from '../src/config';
+import { resetDeprecationWarnings } from '../src/deprecation';
+import { useVbenForm } from '../src/use-vben-form';
+
+const wrappers: VueWrapper[] = [];
+
+function createDeferred<T>() {
+  let resolvePromise: (value: T) => void = () => {};
+  const promise = new Promise<T>((resolve) => {
+    resolvePromise = resolve;
+  });
+  return { promise, resolve: resolvePromise };
+}
+
+const TestInput = defineComponent({
+  inheritAttrs: false,
+  props: {
+    eventMode: {
+      default: 'model-value',
+      type: String,
+    },
+  },
+  emits: ['change', 'update:modelValue', 'update:value'],
+  setup(props, { attrs, emit }) {
+    function handleInput(event: Event) {
+      const target = event.target;
+      if (!(target instanceof HTMLInputElement)) {
+        return;
+      }
+      if (props.eventMode === 'change-only') {
+        emit('change', event);
+        return;
+      }
+      if (props.eventMode === 'value-and-change') {
+        emit('update:value', target.value);
+        emit('change', event);
+        return;
+      }
+      emit('update:modelValue', target.value);
+    }
+
+    return () =>
+      h('input', {
+        ...attrs,
+        onInput: handleInput,
+        value: attrs.modelValue ?? '',
+      });
+  },
+});
+
+beforeAll(() => {
+  setupVbenForm({
+    config: {},
+    rules: {
+      required(value, _params, context) {
+        return value ? true : `${context.label} is required`;
+      },
+    },
+  });
+});
+
+afterEach(() => {
+  for (const wrapper of wrappers.splice(0)) {
+    wrapper.unmount();
+  }
+  vi.useRealTimers();
+  vi.restoreAllMocks();
+});
+
+describe('useVbenForm integration', () => {
+  it('uses model updates as the primary channel and preserves empty strings', async () => {
+    const validateValue = vi.fn();
+    const [Form, formApi] = useVbenForm({
+      schema: [
+        {
+          component: TestInput,
+          componentProps: { eventMode: 'value-and-change' },
+          defaultValue: 'initial',
+          fieldName: 'name',
+          modelPropName: 'value',
+          rules: z.string().superRefine((value) => validateValue(value)),
+        },
+      ],
+    });
+    const wrapper = mount(Form);
+    wrappers.push(wrapper);
+    await flushPromises();
+    const initialValidationCount = validateValue.mock.calls.length;
+
+    await wrapper.get('input').setValue('');
+    await flushPromises();
+
+    expect(await formApi.getValues()).toEqual({ name: '' });
+    expect(validateValue).toHaveBeenCalledTimes(initialValidationCount + 1);
+  });
+
+  it('keeps only the active model protocol in field slot componentProps', async () => {
+    interface ModelProtocolValues {
+      defaultField: string;
+      valueField: string;
+    }
+
+    const staleDefaultBlur = vi.fn();
+    const staleDefaultUpdate = vi.fn();
+    const staleValueUpdate = vi.fn();
+    let defaultSlotProps: Record<string, any> | undefined;
+    let valueSlotProps: Record<string, any> | undefined;
+    const [Form, formApi] = useVbenForm<ModelProtocolValues>({
+      schema: [
+        {
+          component: TestInput,
+          componentProps: {
+            modelValue: 'stale-default-value',
+            name: 'stale-default-name',
+            onBlur: staleDefaultBlur,
+            'onUpdate:modelValue': staleDefaultUpdate,
+          },
+          defaultValue: 'default-initial',
+          fieldName: 'defaultField',
+        },
+        {
+          component: TestInput,
+          componentProps: {
+            eventMode: 'value-and-change',
+            modelValue: 'stale-model-value',
+            'onUpdate:value': staleValueUpdate,
+            value: 'stale-value',
+          },
+          defaultValue: 'value-initial',
+          fieldName: 'valueField',
+          modelPropName: 'value',
+        },
+      ],
+    });
+    const wrapper = mount(Form, {
+      slots: {
+        defaultField(slotProps: Record<string, any>) {
+          defaultSlotProps = slotProps;
+          return h(TestInput, {
+            ...slotProps.componentProps,
+            class: 'default-protocol-input',
+          });
+        },
+        valueField(slotProps: Record<string, any>) {
+          valueSlotProps = slotProps;
+          return h(TestInput, {
+            ...slotProps.componentProps,
+            class: 'value-protocol-input',
+          });
+        },
+      },
+    });
+    wrappers.push(wrapper);
+    await flushPromises();
+
+    expect(defaultSlotProps).toBeDefined();
+    expect(valueSlotProps).toBeDefined();
+    if (!defaultSlotProps || !valueSlotProps) return;
+
+    expect(defaultSlotProps.componentProps.disabled).toBe(false);
+    expect(defaultSlotProps.componentProps.modelValue).toBe('default-initial');
+    expect(defaultSlotProps.componentProps.name).toBe('defaultField');
+    expect(defaultSlotProps.componentProps).toHaveProperty(
+      'onUpdate:modelValue',
+    );
+    expect(defaultSlotProps.componentProps).not.toHaveProperty('value');
+
+    expect(valueSlotProps.componentProps.disabled).toBe(false);
+    expect(valueSlotProps.componentProps.value).toBe('value-initial');
+    expect(valueSlotProps.componentProps).toHaveProperty('onUpdate:value');
+    expect(valueSlotProps.componentProps).not.toHaveProperty('modelValue');
+    expect(valueSlotProps.componentProps).not.toHaveProperty(
+      'onUpdate:modelValue',
+    );
+
+    await wrapper.get('.default-protocol-input').trigger('blur');
+    await wrapper.get('.default-protocol-input').setValue('default-updated');
+    await wrapper.get('.value-protocol-input').setValue('value-updated');
+    await flushPromises();
+
+    expect(defaultSlotProps.field.state.meta.isTouched).toBe(true);
+    expect(staleDefaultBlur).not.toHaveBeenCalled();
+    expect(staleDefaultUpdate).not.toHaveBeenCalled();
+    expect(staleValueUpdate).not.toHaveBeenCalled();
+    expect(await formApi.getValues()).toEqual({
+      defaultField: 'default-updated',
+      valueField: 'value-updated',
+    });
+  });
+
+  it('keeps values reactive when exposed through the default slot', async () => {
+    const [Form, formApi] = useVbenForm({
+      schema: [
+        {
+          component: TestInput,
+          defaultValue: 'Ada',
+          fieldName: 'name',
+        },
+      ],
+      showDefaultActions: false,
+    });
+    const wrapper = mount(Form, {
+      slots: {
+        default: ({ values }: { values: Record<string, any> }) =>
+          h('span', { class: 'slot-value' }, values.name),
+      },
+    });
+    wrappers.push(wrapper);
+    await flushPromises();
+
+    expect(wrapper.get('.slot-value').text()).toBe('Ada');
+
+    await formApi.setFieldValue('name', 'Grace');
+    await flushPromises();
+
+    expect(wrapper.get('.slot-value').text()).toBe('Grace');
+  });
+
+  it('groups control bindings in field slot componentProps', async () => {
+    interface SlotFormValues {
+      name: string;
+    }
+
+    let latestSlotProps:
+      | undefined
+      | VbenFormFieldSlotProps<SlotFormValues, 'name'>;
+    const [Form, formApi] = useVbenForm<SlotFormValues>({
+      schema: [
+        {
+          component: TestInput,
+          defaultValue: 'Ada',
+          fieldName: 'name',
+        },
+      ],
+    });
+    const wrapper = mount(Form, {
+      slots: {
+        name(slotProps: VbenFormFieldSlotProps<SlotFormValues, 'name'>) {
+          latestSlotProps = slotProps;
+          return h(TestInput, {
+            ...slotProps.componentProps,
+            class: 'slot-component',
+          });
+        },
+      },
+    });
+    wrappers.push(wrapper);
+    await flushPromises();
+
+    expect(latestSlotProps).toBeDefined();
+    if (!latestSlotProps) return;
+    expect(latestSlotProps.formApi).toBe(formApi);
+    expect(latestSlotProps.values).toEqual({ name: 'Ada' });
+    expect(latestSlotProps.modelValue).toBe('Ada');
+    expect(latestSlotProps.componentProps.modelValue).toBe('Ada');
+    expect(latestSlotProps.componentProps.disabled).toBe(false);
+    expect(latestSlotProps.componentProps).toHaveProperty(
+      'onUpdate:modelValue',
+    );
+    expect(latestSlotProps.componentProps).not.toHaveProperty('formApi');
+    expect(latestSlotProps.componentProps).not.toHaveProperty('values');
+    expect(latestSlotProps).not.toHaveProperty('onUpdate:modelValue');
+
+    await wrapper.get('.slot-component').setValue('Grace');
+    await flushPromises();
+
+    expect(latestSlotProps.modelValue).toBe('Grace');
+    expect(latestSlotProps.values.name).toBe('Grace');
+  });
+
+  it('normalizes disabled state in field slot componentProps', async () => {
+    interface DisabledFormValues {
+      commonDisabled: string;
+      dependencyDisabled: string;
+    }
+
+    const fieldSlotProps: Record<string, Record<string, any>> = {};
+    const [Form] = useVbenForm<DisabledFormValues>({
+      commonConfig: { disabled: true },
+      schema: [
+        {
+          component: TestInput,
+          componentProps: { disabled: false },
+          fieldName: 'commonDisabled',
+        },
+        {
+          component: TestInput,
+          componentProps: { disabled: false },
+          dependencies: {
+            resolve: () => ({ disabled: true }),
+            triggerFields: [],
+          },
+          fieldName: 'dependencyDisabled',
+        },
+      ],
+    });
+    const wrapper = mount(Form, {
+      slots: {
+        commonDisabled(slotProps: Record<string, any>) {
+          fieldSlotProps.commonDisabled = slotProps;
+          return h(TestInput, slotProps.componentProps);
+        },
+        dependencyDisabled(slotProps: Record<string, any>) {
+          fieldSlotProps.dependencyDisabled = slotProps;
+          return h(TestInput, slotProps.componentProps);
+        },
+      },
+    });
+    wrappers.push(wrapper);
+    await flushPromises();
+
+    expect(fieldSlotProps.commonDisabled).toBeDefined();
+    expect(fieldSlotProps.dependencyDisabled).toBeDefined();
+    expect(fieldSlotProps.commonDisabled?.disabled).toBe(true);
+    expect(fieldSlotProps.commonDisabled?.componentProps.disabled).toBe(true);
+    expect(fieldSlotProps.dependencyDisabled?.disabled).toBe(true);
+    expect(fieldSlotProps.dependencyDisabled?.componentProps.disabled).toBe(
+      true,
+    );
+  });
+
+  it('supports a field-level change event fallback for legacy components', async () => {
+    const [Form, formApi] = useVbenForm({
+      schema: [
+        {
+          component: TestInput,
+          componentProps: { eventMode: 'change-only' },
+          changeEventFallback: true,
+          fieldName: 'name',
+          modelPropName: 'value',
+        },
+      ],
+    });
+    const wrapper = mount(Form);
+    wrappers.push(wrapper);
+    await flushPromises();
+
+    await wrapper.get('input').setValue('fallback');
+    await flushPromises();
+
+    expect(await formApi.getValues()).toEqual({ name: 'fallback' });
+  });
+
+  it('warns once for legacy dependency callbacks', async () => {
+    resetDeprecationWarnings();
+    const warning = vi.spyOn(console, 'warn').mockImplementation(() => {});
+    const [Form] = useVbenForm({
+      schema: [
+        {
+          component: TestInput,
+          dependencies: {
+            show: true,
+            triggerFields: ['toggle'],
+          },
+          fieldName: 'first',
+        },
+        {
+          component: TestInput,
+          dependencies: {
+            disabled: false,
+            triggerFields: ['toggle'],
+          },
+          fieldName: 'second',
+        },
+      ],
+    });
+    const wrapper = mount(Form);
+    wrappers.push(wrapper);
+    await flushPromises();
+
+    expect(warning).toHaveBeenCalledOnce();
+    expect(warning).toHaveBeenCalledWith(
+      '[Vben Form] Legacy dependency callbacks are deprecated. Use `dependencies.resolve(context)` instead.',
+    );
+  });
+
+  it('binds fields, renders accessible errors, and submits valid values', async () => {
+    const consoleError = vi
+      .spyOn(console, 'error')
+      .mockImplementation(() => {});
+    const handleSubmit = vi.fn();
+    const [Form, formApi] = useVbenForm({
+      handleSubmit,
+      schema: [
+        {
+          component: TestInput,
+          fieldName: 'name',
+          label: 'Name',
+          rules: z.string().min(1, 'Name is required'),
+          valueFormat: (value) => value.trim(),
+        },
+        {
+          component: TestInput,
+          fieldName: 'alias',
+          label: 'Alias',
+          rules: 'required',
+        },
+      ],
+    });
+    const wrapper = mount(Form, { attachTo: document.body });
+    wrappers.push(wrapper);
+    await flushPromises();
+
+    expect(await formApi.validate()).toEqual({
+      errors: {
+        alias: 'Alias is required',
+        name: 'Name is required',
+      },
+      valid: false,
+    });
+    await flushPromises();
+
+    const inputs = wrapper.findAll('input');
+    expect(inputs).toHaveLength(2);
+    expect(inputs[0]?.attributes('aria-invalid')).toBe('true');
+    expect(wrapper.text()).toContain('Name is required');
+    expect(wrapper.text()).toContain('Alias is required');
+
+    await inputs[0]?.setValue('Ada');
+    await formApi.setFieldValue('alias', 'Countess', true);
+    await flushPromises();
+    expect(wrapper.text()).not.toContain('Name is required');
+
+    expect(await formApi.validateField('name')).toEqual({
+      errors: {},
+      valid: true,
+    });
+    expect(await formApi.validateAndSubmit()).toEqual({
+      alias: 'Countess',
+      name: 'Ada',
+    });
+    expect(handleSubmit).toHaveBeenCalledOnce();
+    expect(handleSubmit).toHaveBeenCalledWith(
+      {
+        alias: 'Countess',
+        name: 'Ada',
+      },
+      {
+        alias: 'Countess',
+        name: 'Ada',
+      },
+    );
+    expect(consoleError).not.toHaveBeenCalled();
+  });
+
+  it('recomputes dependencies only from declared trigger fields', async () => {
+    const dependency = vi.fn((values: Record<string, any>) => {
+      return values.toggle === 'show';
+    });
+    const [Form, formApi] = useVbenForm({
+      schema: [
+        {
+          component: TestInput,
+          fieldName: 'toggle',
+          label: 'Toggle',
+        },
+        {
+          component: TestInput,
+          dependencies: {
+            if: dependency,
+            triggerFields: ['toggle'],
+          },
+          fieldName: 'details',
+          label: 'Details',
+        },
+      ],
+    });
+    const wrapper = mount(Form);
+    wrappers.push(wrapper);
+    await flushPromises();
+
+    expect(wrapper.find('input[name="details"]').exists()).toBe(false);
+    const initialCalls = dependency.mock.calls.length;
+
+    await formApi.setFieldValue('unrelated', 'value');
+    await flushPromises();
+    expect(dependency).toHaveBeenCalledTimes(initialCalls);
+
+    await formApi.setFieldValue('toggle', 'show');
+    await flushPromises();
+    expect(wrapper.find('input[name="details"]').exists()).toBe(true);
+    expect(dependency.mock.calls.length).toBeGreaterThan(initialCalls);
+  });
+
+  it('resolves dependency patches atomically from declared fields', async () => {
+    const pendingPatch = createDeferred<{
+      componentProps: { placeholder: string };
+      if: boolean;
+    }>();
+    const resolve = vi.fn(({ values }: { values: Record<string, any> }) => {
+      if (values.toggle === 'pending') {
+        return pendingPatch.promise;
+      }
+      return {
+        componentProps: { placeholder: 'initial' },
+        if: false,
+      };
+    });
+    const [Form, formApi] = useVbenForm({
+      schema: [
+        {
+          component: TestInput,
+          fieldName: 'toggle',
+          label: 'Toggle',
+        },
+        {
+          component: TestInput,
+          dependencies: {
+            resolve,
+            triggerFields: ['toggle'],
+          },
+          fieldName: 'details',
+          label: 'Details',
+        },
+      ],
+    });
+    const wrapper = mount(Form);
+    wrappers.push(wrapper);
+    await flushPromises();
+
+    expect(wrapper.find('input[name="details"]').exists()).toBe(false);
+    const initialCalls = resolve.mock.calls.length;
+
+    await formApi.setFieldValue('unrelated', 'value');
+    await flushPromises();
+    expect(resolve).toHaveBeenCalledTimes(initialCalls);
+
+    await formApi.setFieldValue('toggle', 'pending');
+    await flushPromises();
+    expect(wrapper.find('input[name="details"]').exists()).toBe(false);
+
+    pendingPatch.resolve({
+      componentProps: { placeholder: 'resolved' },
+      if: true,
+    });
+    await flushPromises();
+
+    const details = wrapper.find('input[name="details"]');
+    expect(details.exists()).toBe(true);
+    expect(details.attributes('placeholder')).toBe('resolved');
+  });
+
+  it('applies required rules enabled by dependencies after mount', async () => {
+    const [Form, formApi] = useVbenForm({
+      schema: [
+        {
+          component: TestInput,
+          fieldName: 'toggle',
+          label: 'Toggle',
+        },
+        {
+          component: TestInput,
+          dependencies: {
+            required(values) {
+              return values.toggle === true;
+            },
+            triggerFields: ['toggle'],
+          },
+          fieldName: 'details',
+          label: 'Details',
+        },
+      ],
+    });
+    const wrapper = mount(Form);
+    wrappers.push(wrapper);
+    await flushPromises();
+
+    expect(await formApi.validate()).toEqual({ errors: {}, valid: true });
+
+    await formApi.setFieldValue('toggle', true);
+    await flushPromises();
+    expect(await formApi.validate()).toEqual({
+      errors: { details: 'Details is required' },
+      valid: false,
+    });
+
+    await formApi.setFieldValue('details', 'ready');
+    expect(await formApi.validate()).toEqual({ errors: {}, valid: true });
+  });
+
+  it('allows dependencies to disable static rules with null', async () => {
+    const [Form, formApi] = useVbenForm({
+      schema: [
+        {
+          component: TestInput,
+          fieldName: 'toggle',
+          label: 'Toggle',
+        },
+        {
+          component: TestInput,
+          dependencies: {
+            rules(values) {
+              return values.toggle === true
+                ? z.string().min(1, 'Details is required')
+                : null;
+            },
+            triggerFields: ['toggle'],
+          },
+          fieldName: 'details',
+          label: 'Details',
+          rules: z.string().min(1, 'Static details rule'),
+        },
+      ],
+    });
+    const wrapper = mount(Form);
+    wrappers.push(wrapper);
+    await flushPromises();
+
+    expect(await formApi.validate()).toEqual({ errors: {}, valid: true });
+
+    await formApi.setFieldValue('toggle', true);
+    await flushPromises();
+    expect(await formApi.validate()).toEqual({
+      errors: { details: 'Details is required' },
+      valid: false,
+    });
+  });
+
+  it('ignores stale async dependency rule results', async () => {
+    const requiredRules = createDeferred<FormSchemaRuleType>();
+    const optionalRules = createDeferred<FormSchemaRuleType>();
+    const [Form, formApi] = useVbenForm({
+      schema: [
+        {
+          component: TestInput,
+          fieldName: 'mode',
+          label: 'Mode',
+        },
+        {
+          component: TestInput,
+          dependencies: {
+            rules(values) {
+              if (values.mode === 'required') {
+                return requiredRules.promise;
+              }
+              if (values.mode === 'optional') {
+                return optionalRules.promise;
+              }
+              return null;
+            },
+            triggerFields: ['mode'],
+          },
+          fieldName: 'details',
+          label: 'Details',
+        },
+      ],
+    });
+    const wrapper = mount(Form);
+    wrappers.push(wrapper);
+    await flushPromises();
+
+    await formApi.setFieldValue('mode', 'required');
+    await flushPromises();
+    await formApi.setFieldValue('mode', 'optional');
+    await flushPromises();
+
+    optionalRules.resolve(null);
+    await flushPromises();
+    requiredRules.resolve(z.string().min(1, 'Stale required rule'));
+    await flushPromises();
+
+    expect(await formApi.validate()).toEqual({ errors: {}, valid: true });
+  });
+
+  it('keeps array values and rendered rows aligned after mutations', async () => {
+    const [Form, formApi] = useVbenForm({
+      schema: [
+        {
+          children: [
+            {
+              component: TestInput,
+              fieldName: 'name',
+              label: 'Name',
+              rules: z.string().min(1, 'Name is required'),
+            },
+          ],
+          defaultValue: [{ name: 'Ada' }],
+          fieldName: 'contacts',
+          type: 'array',
+        },
+      ],
+    });
+    const wrapper = mount(Form);
+    wrappers.push(wrapper);
+    await flushPromises();
+
+    expect(wrapper.findAll('input')).toHaveLength(1);
+    formApi.form.pushFieldValue('contacts', { name: 'Grace' });
+    await flushPromises();
+    expect(wrapper.findAll('input')).toHaveLength(2);
+    expect(await formApi.getValues()).toEqual({
+      contacts: [{ name: 'Ada' }, { name: 'Grace' }],
+    });
+
+    await formApi.form.removeFieldValue('contacts', 0);
+    await flushPromises();
+    expect(wrapper.findAll('input')).toHaveLength(1);
+    expect(await formApi.getValues()).toEqual({
+      contacts: [{ name: 'Grace' }],
+    });
+  });
+
+  it('preserves array row inputs and focus while editing', async () => {
+    const [Form] = useVbenForm({
+      schema: [
+        {
+          children: [
+            {
+              component: TestInput,
+              fieldName: 'name',
+              label: 'Name',
+            },
+          ],
+          defaultValue: [{ name: 'Ada' }],
+          fieldName: 'contacts',
+          type: 'array',
+        },
+      ],
+    });
+    const wrapper = mount(Form, { attachTo: document.body });
+    wrappers.push(wrapper);
+    await flushPromises();
+    const input = wrapper.get('input');
+    const inputElement = input.element;
+    inputElement.focus();
+
+    await input.setValue('Ada Lovelace');
+    await flushPromises();
+
+    expect(wrapper.get('input').element).toBe(inputElement);
+    expect((input.element as HTMLInputElement).value).toBe('Ada Lovelace');
+    expect(document.activeElement).toBe(inputElement);
+  });
+
+  it('updates optimized array rows when values and schemas change', async () => {
+    const [Form, formApi] = useVbenForm({
+      schema: [
+        {
+          children: [
+            {
+              component: TestInput,
+              fieldName: 'name',
+              label: 'Name',
+            },
+          ],
+          defaultValue: [{ name: 'Ada' }, { name: 'Grace' }],
+          fieldName: 'contacts',
+          type: 'array',
+        },
+      ],
+    });
+    const wrapper = mount(Form);
+    wrappers.push(wrapper);
+    await flushPromises();
+    const firstInput = wrapper.get('input[name="contacts[0].name"]');
+    const firstInputElement = firstInput.element;
+
+    await formApi.setFieldValue('contacts[0].name', 'Ada Lovelace');
+    await flushPromises();
+
+    expect(wrapper.get('input[name="contacts[0].name"]').element).toBe(
+      firstInputElement,
+    );
+    expect(firstInput.element.getAttribute('value')).toBe('Ada Lovelace');
+
+    formApi.updateSchema([
+      {
+        componentProps: { disabled: true },
+        fieldName: 'contacts.name',
+      },
+    ]);
+    await flushPromises();
+
+    expect(
+      wrapper.get('input[name="contacts[0].name"]').attributes(),
+    ).toHaveProperty('disabled');
+    expect(
+      wrapper.get('input[name="contacts[1].name"]').attributes(),
+    ).toHaveProperty('disabled');
+  });
+
+  it('scopes resolve dependencies to array rows', async () => {
+    const resolve = vi.fn(({ schema }: Record<string, any>) => ({
+      componentProps: {
+        disabled: schema.row?.role === 'viewer',
+      },
+    }));
+    const [Form] = useVbenForm({
+      schema: [
+        {
+          children: [
+            {
+              component: TestInput,
+              fieldName: 'role',
+              label: 'Role',
+            },
+            {
+              component: TestInput,
+              dependencies: {
+                resolve,
+                triggerFields: ['role'],
+              },
+              fieldName: 'phone',
+              label: 'Phone',
+            },
+          ],
+          defaultValue: [{ phone: '', role: 'viewer' }],
+          fieldName: 'contacts',
+          type: 'array',
+        },
+      ],
+    });
+    const wrapper = mount(Form);
+    wrappers.push(wrapper);
+    await flushPromises();
+
+    expect(resolve).toHaveBeenCalledWith(
+      expect.objectContaining({
+        schema: expect.objectContaining({
+          fieldName: 'contacts[0].phone',
+          row: { phone: '', role: 'viewer' },
+          rowIndex: 0,
+          rowPath: 'contacts[0]',
+        }),
+      }),
+    );
+    expect(
+      wrapper.get('input[name="contacts[0].phone"]').attributes('disabled'),
+    ).toBeDefined();
+  });
+
+  it('reports changed fields and submits valid changes', async () => {
+    vi.useFakeTimers();
+    const handleSubmit = vi.fn();
+    const handleValuesChange = vi.fn();
+    const [Form, formApi] = useVbenForm({
+      changeDebouncedTime: 0,
+      handleSubmit,
+      handleValuesChange,
+      schema: [
+        {
+          component: TestInput,
+          fieldName: 'name',
+          label: 'Name',
+          rules: z.string().min(1, 'Name is required'),
+          valueFormat: (value) => value.trim(),
+        },
+      ],
+      submitOnChange: true,
+    });
+    const wrapper = mount(Form);
+    wrappers.push(wrapper);
+    await flushPromises();
+
+    await formApi.setFieldValue('name', ' Ada ');
+    await nextTick();
+    await vi.runAllTimersAsync();
+    await flushPromises();
+
+    expect(handleValuesChange).toHaveBeenCalledWith(
+      { name: ' Ada ' },
+      ['name'],
+      expect.any(Function),
+    );
+    const valuesChangeCall = handleValuesChange.mock.calls.at(0);
+    expect(valuesChangeCall).toBeDefined();
+    if (!valuesChangeCall) return;
+    expect(valuesChangeCall[2]()).toEqual({ name: 'Ada' });
+    expect(handleSubmit).toHaveBeenCalledWith(
+      { name: 'Ada' },
+      { name: ' Ada ' },
+    );
+  });
+
+  it('respects blur and change validation triggers', async () => {
+    const [Form] = useVbenForm({
+      schema: [
+        {
+          component: TestInput,
+          defaultValue: 'valid',
+          fieldName: 'name',
+          formFieldProps: {
+            validateOn: ['blur'],
+          },
+          label: 'Name',
+          rules: z.string().min(1, 'Name is required'),
+        },
+      ],
+    });
+    const wrapper = mount(Form);
+    wrappers.push(wrapper);
+    await flushPromises();
+    const input = wrapper.get('input');
+
+    await input.setValue('');
+    await flushPromises();
+    expect(wrapper.text()).not.toContain('Name is required');
+
+    await input.trigger('blur');
+    await flushPromises();
+    expect(wrapper.text()).toContain('Name is required');
+
+    await input.setValue('Ada');
+    await flushPromises();
+    expect(wrapper.text()).not.toContain('Name is required');
+
+    await input.trigger('blur');
+    await flushPromises();
+    expect(wrapper.text()).not.toContain('Name is required');
+  });
+
+  it('ignores stale asynchronous validation results', async () => {
+    let resolveTaken: (() => void) | undefined;
+    const usernameRule = z.string().refine(async (value) => {
+      if (value === 'taken') {
+        await new Promise<void>((resolve) => {
+          resolveTaken = resolve;
+        });
+      }
+      return value !== 'taken';
+    }, 'Username is already taken');
+    const [Form, formApi] = useVbenForm({
+      schema: [
+        {
+          component: TestInput,
+          fieldName: 'username',
+          label: 'Username',
+          rules: usernameRule,
+        },
+      ],
+    });
+    const wrapper = mount(Form);
+    wrappers.push(wrapper);
+    await flushPromises();
+    const input = wrapper.get('input');
+
+    await input.setValue('taken');
+    await vi.waitFor(() => {
+      expect(resolveTaken).toBeDefined();
+    });
+    if (!resolveTaken) return;
+
+    await input.setValue('available');
+    await flushPromises();
+    resolveTaken();
+    await flushPromises();
+
+    expect(formApi.form.getFieldError('username')).toBeUndefined();
+  });
+
+  it('passes formatted values and raw values to handleSubmit callback', async () => {
+    const handleSubmit = vi.fn();
+    const [Form, formApi] = useVbenForm({
+      codec: {
+        decode(values: Readonly<{ normalizedName: string }>) {
+          return { name: values.normalizedName };
+        },
+        encode(values: Readonly<{ name: string }>) {
+          return { normalizedName: values.name.trim().toUpperCase() };
+        },
+      },
+      handleSubmit,
+      schema: [
+        {
+          component: TestInput,
+          defaultValue: '',
+          fieldName: 'name',
+          rules: 'required',
+        },
+      ],
+    });
+    const wrapper = mount(Form);
+    wrappers.push(wrapper);
+    await flushPromises();
+
+    await formApi.setFieldValue('name', ' test ');
+    await formApi.validateAndSubmit();
+    await flushPromises();
+
+    expect(handleSubmit).toHaveBeenCalledOnce();
+    expect(handleSubmit).toHaveBeenCalledWith(
+      { normalizedName: 'TEST' },
+      { name: ' test ' },
+    );
+  });
+
+  it('does not expose raw values through native form submit events', async () => {
+    const onSubmit = vi.fn();
+    const [Form, formApi] = useVbenForm({
+      schema: [
+        {
+          component: TestInput,
+          defaultValue: '',
+          fieldName: 'name',
+          rules: 'required',
+          valueFormat: (value) => value.trim().toUpperCase(),
+        },
+      ],
+    });
+    const wrapper = mount(Form, { attrs: { onSubmit } });
+    wrappers.push(wrapper);
+    await flushPromises();
+
+    await formApi.setFieldValue('name', ' raw ');
+    await wrapper.get('form').trigger('submit');
+    await flushPromises();
+
+    expect(onSubmit).toHaveBeenCalledOnce();
+    expect(onSubmit).toHaveBeenCalledWith(undefined);
+  });
+
+  it('calls handleReset with formatted values on reset button click', async () => {
+    const handleReset = vi.fn();
+    const [Form, formApi] = useVbenForm({
+      codec: {
+        decode(values: Readonly<{ normalizedName: string }>) {
+          return { name: values.normalizedName };
+        },
+        encode(values: Readonly<{ name: string }>) {
+          return { normalizedName: values.name.toUpperCase() };
+        },
+      },
+      handleReset,
+      schema: [
+        {
+          component: TestInput,
+          defaultValue: 'hello',
+          fieldName: 'name',
+        },
+      ],
+    });
+    const wrapper = mount(Form);
+    wrappers.push(wrapper);
+    await flushPromises();
+
+    expect(await formApi.getValues()).toEqual({ normalizedName: 'HELLO' });
+    const resetButton = wrapper.findAll('button')[0];
+    expect(resetButton).toBeDefined();
+    if (!resetButton) return;
+    await resetButton.trigger('click');
+    await flushPromises();
+
+    expect(handleReset).toHaveBeenCalledOnce();
+    expect(handleReset).toHaveBeenCalledWith({ normalizedName: 'HELLO' });
+  });
+
+  it('setValues with multiple fields emits only the final values', async () => {
+    const handleValuesChange = vi.fn();
+    const [Form, formApi] = useVbenForm({
+      handleValuesChange,
+      schema: [
+        { component: TestInput, fieldName: 'first' },
+        { component: TestInput, fieldName: 'second' },
+        { component: TestInput, fieldName: 'third' },
+      ],
+    });
+    const wrapper = mount(Form);
+    wrappers.push(wrapper);
+    await flushPromises();
+    const initialCallCount = handleValuesChange.mock.calls.length;
+
+    await formApi.setValues({ first: 'a', second: 'b', third: 'c' });
+    await flushPromises();
+
+    const calls = handleValuesChange.mock.calls.slice(initialCallCount);
+    expect(calls).toHaveLength(1);
+    expect(calls[0]?.[0]).toEqual({
+      first: 'a',
+      second: 'b',
+      third: 'c',
+    });
+  });
+
+  it('retains initial values for unspecified fields on partial reset', async () => {
+    const [Form, formApi] = useVbenForm({
+      schema: [
+        { component: TestInput, defaultValue: 'original', fieldName: 'name' },
+        { component: TestInput, defaultValue: 'keep', fieldName: 'alias' },
+      ],
+    });
+    const wrapper = mount(Form);
+    wrappers.push(wrapper);
+    await flushPromises();
+
+    await formApi.setValues({ alias: 'changed', name: 'changed' });
+    await formApi.reset({ values: { name: 'reset' } });
+    await flushPromises();
+
+    expect(await formApi.getValues()).toEqual({
+      alias: 'keep',
+      name: 'reset',
+    });
+  });
+
+  it('applies valueFormat consistently across value APIs', async () => {
+    const handleSubmit = vi.fn();
+    const [Form, formApi] = useVbenForm({
+      handleSubmit,
+      schema: [
+        {
+          component: TestInput,
+          fieldName: 'name',
+          valueFormat: (value) => (value ? value.trim().toUpperCase() : ''),
+        },
+      ],
+    });
+    const wrapper = mount(Form);
+    wrappers.push(wrapper);
+    await flushPromises();
+
+    await formApi.setFieldValue('name', ' hello ');
+    await flushPromises();
+
+    expect(await formApi.getValues()).toEqual({ name: 'HELLO' });
+    expect(await formApi.getValueSnapshot()).toEqual({
+      rawValues: { name: ' hello ' },
+      values: { name: 'HELLO' },
+    });
+
+    await formApi.validateAndSubmit();
+    await flushPromises();
+    expect(handleSubmit).toHaveBeenCalledWith(
+      { name: 'HELLO' },
+      { name: ' hello ' },
+    );
+  });
+});
diff --git a/packages/@core/ui-kit/form-ui/__tests__/form-performance.benchmark.ts b/packages/@core/ui-kit/form-ui/__tests__/form-performance.benchmark.ts
new file mode 100644
index 00000000..0da730bf
--- /dev/null
+++ b/packages/@core/ui-kit/form-ui/__tests__/form-performance.benchmark.ts
@@ -0,0 +1,177 @@
+import { flushPromises, mount } from '@vue/test-utils';
+import { nextTick } from 'vue';
+
+import { afterAll, bench, describe } from 'vitest';
+
+import { setupVbenForm } from '../src/config';
+import { encodeFormValues } from '../src/form-codec';
+import { useVbenForm } from '../src/use-vben-form';
+import { TestInput } from './benchmark-fixtures';
+
+interface ContactValues {
+  enabled: boolean;
+  metadata: {
+    permissions: string[];
+    team: string;
+  };
+  name: string;
+  phone: string;
+  tags: string[];
+}
+
+interface PerformanceFormValues extends Record<string, unknown> {
+  contacts: ContactValues[];
+  settings: {
+    alerts: boolean;
+    locale: string;
+    sections: string[];
+  };
+}
+
+const ROW_COUNT = 100;
+
+function createFormValues(): PerformanceFormValues {
+  return {
+    contacts: Array.from({ length: ROW_COUNT }, (_, index) => ({
+      enabled: index % 2 === 0,
+      metadata: {
+        permissions: ['read', 'write', 'review'],
+        team: `team-${index % 10}`,
+      },
+      name: ` Contact ${index} `,
+      phone: `10086-${index}`,
+      tags: ['primary', 'on-call', `group-${index % 5}`],
+    })),
+    settings: {
+      alerts: true,
+      locale: 'zh-CN',
+      sections: ['profile', 'security', 'notifications'],
+    },
+  };
+}
+
+const codec = {
+  decode: (values: Readonly<PerformanceFormValues>) => ({ ...values }),
+  encode: (values: Readonly<PerformanceFormValues>) => ({
+    ...values,
+    contacts: values.contacts.map((contact) => ({
+      ...contact,
+      name: contact.name.trim(),
+    })),
+  }),
+};
+
+const formValues = createFormValues();
+setupVbenForm({ config: {}, rules: {} });
+const [CodecForm, codecFormApi] = useVbenForm<PerformanceFormValues>({
+  codec,
+  schema: [
+    {
+      component: TestInput,
+      defaultValue: formValues.contacts,
+      fieldName: 'contacts',
+    },
+    {
+      component: TestInput,
+      defaultValue: formValues.settings,
+      fieldName: 'settings',
+    },
+  ],
+  showDefaultActions: false,
+});
+const codecWrapper = mount(CodecForm);
+const [ArrayForm, arrayFormApi] = useVbenForm({
+  schema: [
+    {
+      children: [
+        {
+          component: TestInput,
+          fieldName: 'name',
+          label: 'Name',
+        },
+      ],
+      defaultValue: Array.from({ length: ROW_COUNT }, (_, index) => ({
+        name: `Contact ${index}`,
+      })),
+      fieldName: 'contacts',
+      type: 'array',
+    },
+  ],
+});
+const arrayWrapper = mount(ArrayForm);
+await flushPromises();
+const arraySchemaPatches = [false, true].map((disabled) => ({
+  componentProps: { disabled },
+  fieldName: 'contacts.name',
+}));
+let arrayEditIteration = 0;
+let arraySchemaIteration = 0;
+
+afterAll(() => {
+  arrayWrapper.unmount();
+  codecWrapper.unmount();
+});
+
+describe('form codec performance', () => {
+  bench(
+    'encode 100 nested rows without isolation',
+    () => {
+      encodeFormValues(codec, formValues);
+    },
+    { time: 1000, warmupTime: 200 },
+  );
+
+  bench(
+    'encode 100 nested rows with isolated input',
+    () => {
+      codecFormApi.formatValues(formValues);
+    },
+    { time: 1000, warmupTime: 200 },
+  );
+
+  bench(
+    'create submit snapshot for 100 nested rows',
+    async () => {
+      await codecFormApi.getValueSnapshot();
+    },
+    { time: 1000, warmupTime: 200 },
+  );
+});
+
+describe('form array performance', () => {
+  bench(
+    'edit one field in a 100-row array',
+    async () => {
+      arrayEditIteration += 1;
+      await arrayFormApi.setFieldValue(
+        'contacts[50].name',
+        `Contact ${arrayEditIteration}`,
+      );
+      await nextTick();
+    },
+    { time: 1000, warmupTime: 200 },
+  );
+
+  bench(
+    'append and remove one row from a 100-row array',
+    async () => {
+      arrayFormApi.form.pushFieldValue('contacts', { name: 'Temporary' });
+      await nextTick();
+      await arrayFormApi.form.removeFieldValue('contacts', ROW_COUNT);
+      await nextTick();
+    },
+    { time: 1000, warmupTime: 200 },
+  );
+
+  bench(
+    'update one child schema across 100 rows',
+    async () => {
+      arraySchemaIteration += 1;
+      arrayFormApi.updateSchema([
+        arraySchemaPatches[arraySchemaIteration % 2] ?? {},
+      ]);
+      await nextTick();
+    },
+    { time: 1000, warmupTime: 200 },
+  );
+});
diff --git a/packages/@core/ui-kit/form-ui/__tests__/form-runtime.test.ts b/packages/@core/ui-kit/form-ui/__tests__/form-runtime.test.ts
new file mode 100644
index 00000000..e32c9f33
--- /dev/null
+++ b/packages/@core/ui-kit/form-ui/__tests__/form-runtime.test.ts
@@ -0,0 +1,236 @@
+import type { FormActions } from '../src/types';
+
+import { flushPromises, mount } from '@vue/test-utils';
+import { defineComponent, h, nextTick, watch } from 'vue';
+
+import { afterEach, describe, expect, it, vi } from 'vitest';
+
+import { useFormRuntime } from '../src/form-runtime';
+
+const wrappers: ReturnType<typeof mount>[] = [];
+
+function mountRuntime(
+  defaultValues: Record<string, any>,
+  validator?: (input: { value: any }) => Promise<string | undefined>,
+) {
+  let form: FormActions | undefined;
+  const RuntimeHarness = defineComponent({
+    setup() {
+      const runtime = useFormRuntime(defaultValues);
+      form = runtime;
+      return () => {
+        if (!validator) {
+          return h('div');
+        }
+        return h(
+          runtime.fieldComponent,
+          {
+            name: 'name',
+            validators: {
+              onSubmitAsync: validator,
+            },
+          },
+          {
+            default: ({ field }: Record<string, any>) =>
+              h('input', {
+                name: 'name',
+                onBlur: field.handleBlur,
+                onInput: (event: Event) => {
+                  const target = event.target;
+                  if (target instanceof HTMLInputElement) {
+                    field.handleChange(target.value);
+                  }
+                },
+                value: field.state.value,
+              }),
+          },
+        );
+      };
+    },
+  });
+  const wrapper = mount(RuntimeHarness);
+  wrappers.push(wrapper);
+  return { form, wrapper };
+}
+
+afterEach(() => {
+  for (const wrapper of wrappers.splice(0)) {
+    wrapper.unmount();
+  }
+});
+
+describe('form runtime', () => {
+  it('updates values and resets to defaults', async () => {
+    const { form } = mountRuntime({ name: 'initial' });
+    expect(form).toBeDefined();
+    if (!form) return;
+
+    await form.setFieldValue('name', 'updated');
+    await nextTick();
+    expect(form.values).toEqual({ name: 'updated' });
+
+    await form.reset();
+    await nextTick();
+    expect(form.values).toEqual({ name: 'initial' });
+  });
+
+  it('preserves empty string field updates', async () => {
+    const { form, wrapper } = mountRuntime(
+      { name: 'initial' },
+      async () => undefined,
+    );
+    expect(form).toBeDefined();
+    if (!form) return;
+
+    await wrapper.find('input').setValue('');
+    await nextTick();
+
+    expect(form.values).toEqual({ name: '' });
+  });
+
+  it('exposes reactive selectors', async () => {
+    const { form } = mountRuntime({ name: 'initial' });
+    expect(form).toBeDefined();
+    if (!form) return;
+    const name = form.useSelector((state) => state.values.name);
+
+    await form.setFieldValue('name', 'updated');
+    await nextTick();
+    expect(name.value).toBe('updated');
+  });
+
+  it('updates only changed field value selectors', async () => {
+    const { form } = mountRuntime({ email: '', name: 'initial' });
+    expect(form).toBeDefined();
+    if (!form) return;
+    const name = form.useFieldValue('name');
+    const selectedValues = form.useFieldValues(['name'] as const);
+    const onNameChange = vi.fn();
+    const stop = watch(name, onNameChange);
+
+    await form.setFieldValue('email', 'ada@example.com');
+    await nextTick();
+    expect(onNameChange).not.toHaveBeenCalled();
+    expect(selectedValues.value).toEqual(['initial']);
+
+    await form.setFieldValue('name', 'Ada');
+    await nextTick();
+    expect(onNameChange).toHaveBeenCalledOnce();
+    expect(name.value).toBe('Ada');
+    expect(selectedValues.value).toEqual(['Ada']);
+    stop();
+  });
+
+  it('exposes reactive field error selectors', async () => {
+    const { form } = mountRuntime({ email: '', name: '' });
+    expect(form).toBeDefined();
+    if (!form) return;
+    const nameError = form.useFieldError('name');
+    const onNameErrorChange = vi.fn();
+    const stop = watch(nameError, onNameErrorChange);
+
+    form.setFieldError('email', 'Email error');
+    await nextTick();
+    expect(onNameErrorChange).not.toHaveBeenCalled();
+
+    form.setFieldError('name', 'Name error');
+    await nextTick();
+    expect(nameError.value).toBe('Name error');
+    expect(onNameErrorChange).toHaveBeenCalledOnce();
+    stop();
+  });
+
+  it('validates mounted fields and clears stale errors', async () => {
+    const { form } = mountRuntime({ name: '' }, async ({ value }) => {
+      return value ? undefined : 'Name is required';
+    });
+    expect(form).toBeDefined();
+    if (!form) return;
+
+    expect(await form.validate()).toEqual({
+      errors: { name: 'Name is required' },
+      valid: false,
+    });
+
+    await form.setFieldValue('name', 'Ada');
+    await flushPromises();
+    expect(await form.validateField('name')).toEqual({
+      errors: {},
+      valid: true,
+    });
+    expect(form.isFieldValid('name')).toBe(true);
+  });
+
+  it('sets and clears manual field errors', async () => {
+    const { form } = mountRuntime({ name: '' }, async () => undefined);
+    expect(form).toBeDefined();
+    if (!form) return;
+
+    form.setFieldError('name', 'Server error');
+    await nextTick();
+    expect(form.getFieldError('name')).toBe('Server error');
+    expect(form.meta.valid).toBe(false);
+
+    form.setFieldError('name');
+    await nextTick();
+    expect(form.getFieldError('name')).toBeUndefined();
+    expect(form.meta.valid).toBe(true);
+  });
+
+  it('clears manual errors when resetting the form', async () => {
+    const { form } = mountRuntime({ name: '' });
+    expect(form).toBeDefined();
+    if (!form) return;
+
+    form.setFieldError('name', 'Server error');
+    await nextTick();
+    expect(form.errors).toEqual({ name: 'Server error' });
+
+    await form.reset();
+    await nextTick();
+    expect(form.errors).toEqual({});
+    expect(form.meta.valid).toBe(true);
+  });
+
+  it('invalidates in-flight async validation when clearing validation', async () => {
+    let resolveValidation: ((error: string | undefined) => void) | undefined;
+    let notifyValidationStarted: (() => void) | undefined;
+    const validationStarted = new Promise<void>((resolve) => {
+      notifyValidationStarted = resolve;
+    });
+    const validator = vi.fn(() => {
+      notifyValidationStarted?.();
+      return new Promise<string | undefined>((resolve) => {
+        resolveValidation = resolve;
+      });
+    });
+    const { form } = mountRuntime({ name: '' }, validator);
+    expect(form).toBeDefined();
+    if (!form) return;
+
+    const pendingValidation = form.validateField('name');
+    await validationStarted;
+    form.clearValidation();
+    resolveValidation?.('Name is already used');
+    await pendingValidation;
+    await flushPromises();
+
+    expect(form.errors).toEqual({});
+    expect(form.meta.validating).toBe(false);
+  });
+
+  it('clears only the requested field validation state', async () => {
+    const { form } = mountRuntime({ email: '', name: '' });
+    expect(form).toBeDefined();
+    if (!form) return;
+
+    form.setFieldError('name', 'Name error');
+    form.setFieldError('email', 'Email error');
+    await nextTick();
+
+    form.clearValidation('name');
+    await nextTick();
+
+    expect(form.errors).toEqual({ email: 'Email error' });
+  });
+});
diff --git a/packages/@core/ui-kit/form-ui/__tests__/form-schema.test.ts b/packages/@core/ui-kit/form-ui/__tests__/form-schema.test.ts
new file mode 100644
index 00000000..b4294ef2
--- /dev/null
+++ b/packages/@core/ui-kit/form-ui/__tests__/form-schema.test.ts
@@ -0,0 +1,73 @@
+import { describe, expect, it, vi } from 'vitest';
+
+import {
+  createArrayChildSchema,
+  createFormFieldSchema,
+} from '../src/form-render/schema';
+
+describe('form schema normalization', () => {
+  it('resolves common component props with the field context', () => {
+    const componentProps = vi.fn(({ fieldName }) => ({
+      placeholder: `Enter ${fieldName}`,
+    }));
+
+    const schema = createFormFieldSchema(
+      { component: 'VbenInput', fieldName: 'name' },
+      { commonConfig: { componentProps } },
+    );
+
+    expect(componentProps).toHaveBeenCalledWith({ fieldName: 'name' });
+    expect(schema.commonComponentProps).toEqual({
+      placeholder: 'Enter name',
+    });
+  });
+
+  it('preserves common component props objects', () => {
+    const schema = createFormFieldSchema(
+      { component: 'VbenInput', fieldName: 'name' },
+      { commonConfig: { componentProps: { placeholder: 'Enter a name' } } },
+    );
+
+    expect(schema.commonComponentProps).toEqual({
+      placeholder: 'Enter a name',
+    });
+  });
+
+  it('resolves global common component props functions', () => {
+    const componentProps = vi.fn(({ fieldName }) => ({
+      title: `Global ${fieldName}`,
+    }));
+
+    const schema = createFormFieldSchema(
+      { component: 'VbenInput', fieldName: 'email' },
+      { globalCommonConfig: { componentProps } },
+    );
+
+    expect(componentProps).toHaveBeenCalledWith({ fieldName: 'email' });
+    expect(schema.commonComponentProps).toEqual({ title: 'Global email' });
+  });
+
+  it('resolves array common props with the row context', () => {
+    const componentProps = vi.fn(() => ({ placeholder: 'Contact name' }));
+
+    const schema = createArrayChildSchema(
+      { component: 'VbenInput', fieldName: 'name' },
+      {
+        arrayField: 'contacts',
+        commonConfig: { componentProps },
+        index: 1,
+      },
+    );
+
+    expect(componentProps).toHaveBeenCalledWith({
+      arrayField: 'contacts',
+      fieldName: 'contacts[1].name',
+      originalFieldName: 'name',
+      rowIndex: 1,
+      rowPath: 'contacts[1]',
+    });
+    expect(schema.commonComponentProps).toEqual({
+      placeholder: 'Contact name',
+    });
+  });
+});
diff --git a/packages/@core/ui-kit/form-ui/__tests__/form-types.test.ts b/packages/@core/ui-kit/form-ui/__tests__/form-types.test.ts
new file mode 100644
index 00000000..23a4a49c
--- /dev/null
+++ b/packages/@core/ui-kit/form-ui/__tests__/form-types.test.ts
@@ -0,0 +1,275 @@
+import type {
+  BaseFormComponentType,
+  ExtendedFormApi,
+  FormActions,
+  FormContextApi,
+  FormFieldOptions,
+  FormItemDependencies,
+  FormValidationResult,
+  FormValueSnapshot,
+  VbenFormAdapterOptions,
+  VbenFormProps,
+} from '../src/types';
+
+import { describe, expectTypeOf, it } from 'vitest';
+
+import { useVbenForm } from '../src/use-vben-form';
+
+interface AccountFormValues {
+  email: string;
+  profile: {
+    nickname: string;
+  };
+  roles: string[];
+}
+
+interface AccountSubmitValues {
+  email: string;
+  nickname: string;
+  roles: string;
+}
+
+describe('form public types', () => {
+  it('keeps the compatibility alias and stable method signatures', () => {
+    expectTypeOf<FormActions>().toEqualTypeOf<FormContextApi>();
+    expectTypeOf<FormActions['setFieldValue']>()
+      .parameter(0)
+      .toMatchTypeOf<string>();
+    expectTypeOf<
+      FormActions['validate']
+    >().returns.resolves.toEqualTypeOf<FormValidationResult>();
+    expectTypeOf<Parameters<FormActions['validate']>>().toEqualTypeOf<[]>();
+    expectTypeOf<Parameters<FormActions['validateField']>>().toEqualTypeOf<
+      [fieldName: string]
+    >();
+  });
+
+  it('accepts both new and deprecated rule registration options', () => {
+    expectTypeOf<VbenFormAdapterOptions>().toMatchTypeOf<{
+      defineRules?: Record<string, unknown>;
+      rules?: Record<string, unknown>;
+    }>();
+  });
+
+  it('supports resolve and legacy dependency contracts', () => {
+    const resolveDependencies: FormItemDependencies<AccountFormValues> = {
+      resolve({ actions, controller, schema, values }) {
+        expectTypeOf(values).toEqualTypeOf<Readonly<AccountFormValues>>();
+        expectTypeOf(actions).toEqualTypeOf<FormActions<AccountFormValues>>();
+        expectTypeOf(controller).toEqualTypeOf<
+          ExtendedFormApi<AccountFormValues>
+        >();
+        expectTypeOf(schema.fieldName).toEqualTypeOf<string | undefined>();
+        return { disabled: !values.email, rules: null };
+      },
+      triggerFields: ['email'],
+    };
+    const legacyDependencies: FormItemDependencies<AccountFormValues> = {
+      show(values) {
+        expectTypeOf(values).toEqualTypeOf<Partial<AccountFormValues>>();
+        return Boolean(values.email);
+      },
+      triggerFields: ['email'],
+    };
+    const fieldOptions: FormFieldOptions = {
+      asyncDebounceMs: 200,
+      validateOn: ['blur', 'change'],
+    };
+
+    expectTypeOf(resolveDependencies).toMatchTypeOf<
+      FormItemDependencies<AccountFormValues>
+    >();
+    expectTypeOf(legacyDependencies).toMatchTypeOf<
+      FormItemDependencies<AccountFormValues>
+    >();
+    expectTypeOf(fieldOptions).toMatchTypeOf<FormFieldOptions>();
+  });
+
+  it('propagates form value types through public APIs and callbacks', () => {
+    const options: VbenFormProps<
+      BaseFormComponentType,
+      Record<never, never>,
+      AccountFormValues
+    > = {
+      handleSubmit(values, rawValues) {
+        expectTypeOf(values).toEqualTypeOf<AccountFormValues>();
+        expectTypeOf(rawValues).toEqualTypeOf<Readonly<AccountFormValues>>();
+      },
+      handleValuesChange(values, _fieldsChanged, getFormattedValues) {
+        expectTypeOf(values).toEqualTypeOf<Readonly<AccountFormValues>>();
+        expectTypeOf(getFormattedValues()).toEqualTypeOf<AccountFormValues>();
+      },
+      schema: [],
+    };
+    const [Form, formApi] = useVbenForm<AccountFormValues>(options);
+
+    expectTypeOf(formApi).toEqualTypeOf<ExtendedFormApi<AccountFormValues>>();
+
+    function assertContextApi(
+      contextApi: FormContextApi<AccountFormValues>,
+      typedFormApi: ExtendedFormApi<AccountFormValues>,
+    ) {
+      expectTypeOf(
+        typedFormApi.getValues(),
+      ).resolves.toEqualTypeOf<AccountFormValues>();
+      expectTypeOf(
+        typedFormApi.getRawValues(),
+      ).resolves.toEqualTypeOf<AccountFormValues>();
+      expectTypeOf(typedFormApi.getValueSnapshot()).resolves.toEqualTypeOf<{
+        rawValues: Readonly<AccountFormValues>;
+        values: AccountFormValues;
+      }>();
+      expectTypeOf(typedFormApi.setValues)
+        .parameter(0)
+        .toEqualTypeOf<Partial<AccountFormValues>>();
+      expectTypeOf(typedFormApi.form.values).toEqualTypeOf<AccountFormValues>();
+      expectTypeOf(contextApi.getFieldValue('email')).toEqualTypeOf<string>();
+      expectTypeOf(
+        contextApi.useSelector((state) => state.values.profile.nickname),
+      ).toEqualTypeOf<Readonly<import('vue').Ref<string>>>();
+    }
+
+    expectTypeOf(assertContextApi).toBeFunction();
+
+    type FormSlots = InstanceType<typeof Form>['$slots'];
+    type EmailSlot = NonNullable<FormSlots['email']>;
+    type EmailSlotProps = Parameters<EmailSlot>[0];
+    type DefaultSlot = NonNullable<FormSlots['default']>;
+    type DefaultSlotProps = Parameters<DefaultSlot>[0];
+
+    expectTypeOf<
+      EmailSlotProps['field']['state']['value']
+    >().toEqualTypeOf<string>();
+    expectTypeOf<EmailSlotProps['values']>().toEqualTypeOf<AccountFormValues>();
+    expectTypeOf<
+      EmailSlotProps['componentProps']['modelValue']
+    >().toEqualTypeOf<string | undefined>();
+    expectTypeOf<EmailSlotProps['formApi']>().toEqualTypeOf<
+      ExtendedFormApi<AccountFormValues>
+    >();
+    expectTypeOf<
+      DefaultSlotProps['values']
+    >().toEqualTypeOf<AccountFormValues>();
+
+    const [WideForm] = useVbenForm<Record<string, unknown>>({ schema: [] });
+    type WideFormSlots = InstanceType<typeof WideForm>['$slots'];
+    type WideFieldSlot = NonNullable<WideFormSlots['dynamic-field']>;
+    type WideFieldSlotProps = Parameters<WideFieldSlot>[0];
+
+    expectTypeOf<WideFieldSlotProps>().not.toBeAny();
+    expectTypeOf<WideFieldSlotProps['modelValue']>().toEqualTypeOf<unknown>();
+    expectTypeOf<
+      WideFieldSlotProps['field']['state']['value']
+    >().toEqualTypeOf<unknown>();
+    expectTypeOf<
+      WideFieldSlotProps['componentField']['modelValue']
+    >().toEqualTypeOf<unknown>();
+    expectTypeOf<WideFieldSlotProps['name']>().toBeString();
+    expectTypeOf<WideFieldSlotProps['values']>().toEqualTypeOf<
+      Record<string, unknown>
+    >();
+  });
+
+  it('keeps form and submit values distinct with a codec', () => {
+    const options: VbenFormProps<
+      BaseFormComponentType,
+      Record<never, never>,
+      AccountFormValues,
+      AccountSubmitValues
+    > = {
+      codec: {
+        decode(values) {
+          return {
+            email: values.email,
+            profile: { nickname: values.nickname },
+            roles: values.roles.split(','),
+          };
+        },
+        encode(values) {
+          return {
+            email: values.email,
+            nickname: values.profile.nickname,
+            roles: values.roles.join(','),
+          };
+        },
+      },
+      handleSubmit(values, rawValues) {
+        expectTypeOf(values).toEqualTypeOf<AccountSubmitValues>();
+        expectTypeOf(rawValues).toEqualTypeOf<Readonly<AccountFormValues>>();
+      },
+      handleReset(values) {
+        expectTypeOf(values).toEqualTypeOf<AccountSubmitValues>();
+      },
+      handleValuesChange(values, _fieldsChanged, getFormattedValues) {
+        expectTypeOf(values).toEqualTypeOf<Readonly<AccountFormValues>>();
+        expectTypeOf(getFormattedValues()).toEqualTypeOf<AccountSubmitValues>();
+      },
+      schema: [],
+    };
+    const [, formApi] = useVbenForm<
+      AccountFormValues,
+      BaseFormComponentType,
+      Record<never, never>,
+      AccountSubmitValues
+    >(options);
+
+    expectTypeOf(
+      formApi.getValues(),
+    ).resolves.toEqualTypeOf<AccountSubmitValues>();
+    expectTypeOf(
+      formApi.getRawValues(),
+    ).resolves.toEqualTypeOf<AccountFormValues>();
+    expectTypeOf(formApi.getValueSnapshot()).resolves.toEqualTypeOf<
+      FormValueSnapshot<AccountFormValues, AccountSubmitValues>
+    >();
+    expectTypeOf(formApi.setSubmitValues)
+      .parameter(0)
+      .toEqualTypeOf<AccountSubmitValues>();
+  });
+
+  it('infers submit values from an inline codec', () => {
+    const [, formApi] = useVbenForm({
+      codec: {
+        decode(values) {
+          expectTypeOf(values).toEqualTypeOf<Readonly<AccountSubmitValues>>();
+          return {
+            email: values.email,
+            profile: { nickname: values.nickname },
+            roles: values.roles.split(','),
+          };
+        },
+        encode(values: Readonly<AccountFormValues>) {
+          return {
+            email: values.email,
+            nickname: values.profile.nickname,
+            roles: values.roles.join(','),
+          };
+        },
+      },
+      handleReset(values) {
+        expectTypeOf(values).toEqualTypeOf<AccountSubmitValues>();
+      },
+      handleSubmit(values, rawValues) {
+        expectTypeOf(values).toEqualTypeOf<AccountSubmitValues>();
+        expectTypeOf(rawValues).toEqualTypeOf<Readonly<AccountFormValues>>();
+      },
+      schema: [],
+    });
+
+    expectTypeOf(
+      formApi.getValues(),
+    ).resolves.toEqualTypeOf<AccountSubmitValues>();
+    expectTypeOf(
+      formApi.getRawValues(),
+    ).resolves.toEqualTypeOf<AccountFormValues>();
+  });
+
+  it('exposes canonical names alongside deprecated aliases', () => {
+    expectTypeOf<FormContextApi['reset']>().toEqualTypeOf<
+      FormContextApi['resetForm']
+    >();
+    expectTypeOf<FormContextApi['submit']>().toEqualTypeOf<
+      FormContextApi['submitForm']
+    >();
+  });
+});
diff --git a/packages/@core/ui-kit/form-ui/__tests__/form-value-transform.test.ts b/packages/@core/ui-kit/form-ui/__tests__/form-value-transform.test.ts
new file mode 100644
index 00000000..463a19e2
--- /dev/null
+++ b/packages/@core/ui-kit/form-ui/__tests__/form-value-transform.test.ts
@@ -0,0 +1,90 @@
+import { describe, expect, it } from 'vitest';
+
+import {
+  applyFormValueFormats,
+  formatFormValues,
+  transformRangeTimeValues,
+} from '../src/form-value-transform';
+
+describe('form value transforms', () => {
+  it('maps array and range fields without mutating input values', () => {
+    const input = {
+      period: [1_710_000_000_000, 1_720_000_000_000],
+      tags: ['admin', 'editor'],
+    };
+
+    const result = transformRangeTimeValues(
+      input,
+      [['period', ['startTime', 'endTime'], null]],
+      ['tags'],
+    );
+
+    expect(result).toEqual({
+      endTime: 1_720_000_000_000,
+      startTime: 1_710_000_000_000,
+      tags: 'admin,editor',
+    });
+    expect(input).toEqual({
+      period: [1_710_000_000_000, 1_720_000_000_000],
+      tags: ['admin', 'editor'],
+    });
+  });
+
+  it('formats array children with row and root paths', () => {
+    const values = {
+      contacts: [{ name: ' Ada ' }, { name: ' Grace ' }],
+    };
+    const schema = [
+      {
+        children: [
+          {
+            component: 'text',
+            fieldName: 'name',
+            valueFormat(value: string, setValue: any, _values: any, ctx: any) {
+              setValue('$row.normalizedName', value.trim());
+              setValue('$root.lastRow', ctx.rowIndex);
+            },
+          },
+        ],
+        fieldName: 'contacts',
+        type: 'array',
+      },
+    ] as any;
+
+    const result = applyFormValueFormats(values, schema);
+
+    expect(result).toEqual({
+      contacts: [{ normalizedName: 'Ada' }, { normalizedName: 'Grace' }],
+      lastRow: 1,
+    });
+    expect(values).toEqual({
+      contacts: [{ name: ' Ada ' }, { name: ' Grace ' }],
+    });
+  });
+
+  it('runs the unified formatting pipeline in a stable order', () => {
+    const result = formatFormValues(
+      {
+        period: [1, 2],
+        tags: ['admin', 'editor'],
+        title: ' Ada ',
+      },
+      [
+        {
+          component: 'text',
+          fieldName: 'title',
+          valueFormat: (value: string) => value.trim(),
+        },
+      ],
+      [['period', ['startTime', 'endTime'], null]],
+      ['tags'],
+    );
+
+    expect(result).toEqual({
+      endTime: 2,
+      startTime: 1,
+      tags: 'admin,editor',
+      title: 'Ada',
+    });
+  });
+});
diff --git a/packages/@core/ui-kit/form-ui/__tests__/zod-v4-schema.test.ts b/packages/@core/ui-kit/form-ui/__tests__/zod-v4-schema.test.ts
new file mode 100644
index 00000000..133bf57e
--- /dev/null
+++ b/packages/@core/ui-kit/form-ui/__tests__/zod-v4-schema.test.ts
@@ -0,0 +1,69 @@
+import { describe, expect, it } from 'vitest';
+import { z, ZodString } from 'zod';
+import { getDefaultsForSchema } from 'zod-defaults';
+
+import {
+  getBaseRules,
+  getDefaultValueInZodStack,
+} from '../src/form-render/helper';
+
+describe('zod v4 schema helpers', () => {
+  it('unwraps optional and default schemas with public APIs', () => {
+    const schema = z.string().default('default value').optional();
+
+    expect(getBaseRules(schema)).toBeInstanceOf(ZodString);
+    expect(getDefaultValueInZodStack(schema)).toBe('default value');
+  });
+
+  it('unwraps the input side of a transform pipe', () => {
+    const schema = z.string().transform((value) => value.length);
+
+    expect(getBaseRules(schema)).toBeInstanceOf(ZodString);
+  });
+
+  it('returns undefined when a schema rejects undefined', () => {
+    expect(getDefaultValueInZodStack(z.string())).toBeUndefined();
+  });
+
+  it('does not throw for an asynchronous default pipeline', () => {
+    const schema = z
+      .string()
+      .default('default value')
+      .transform(async (value) => value.toUpperCase());
+
+    expect(getDefaultValueInZodStack(schema)).toBeUndefined();
+  });
+
+  it('uses zod v4 error callbacks for required and invalid inputs', () => {
+    const schema = z.number({
+      error: (issue) =>
+        issue.input === undefined ? 'required' : 'invalid number',
+    });
+
+    expect(schema.safeParse(undefined).error?.issues[0]?.message).toBe(
+      'required',
+    );
+    expect(schema.safeParse('1').error?.issues[0]?.message).toBe(
+      'invalid number',
+    );
+  });
+
+  it('extracts defaults from intersections without private schema access', () => {
+    const schema = z.intersection(
+      z.object({ enabled: z.boolean().default(true), name: z.string() }),
+      z.object({ count: z.number(), note: z.string().default('note') }),
+    );
+
+    expect(getDefaultsForSchema(schema)).toEqual({
+      count: 0,
+      enabled: true,
+      name: '',
+      note: 'note',
+    });
+  });
+
+  it('keeps nullable and coerce input semantics explicit', () => {
+    expect(z.string().nullable().safeParse(undefined).success).toBe(false);
+    expect(z.coerce.number().parse('42')).toBe(42);
+  });
+});
diff --git a/packages/@core/ui-kit/form-ui/build.config.ts b/packages/@core/ui-kit/form-ui/build.config.ts
deleted file mode 100644
index 18eaa604..00000000
--- a/packages/@core/ui-kit/form-ui/build.config.ts
+++ /dev/null
@@ -1,21 +0,0 @@
-import { defineBuildConfig } from 'unbuild';
-
-export default defineBuildConfig({
-  clean: true,
-  declaration: true,
-  entries: [
-    {
-      builder: 'mkdist',
-      input: './src',
-      loaders: ['vue'],
-      pattern: ['**/*.vue'],
-    },
-    {
-      builder: 'mkdist',
-      format: 'esm',
-      input: './src',
-      loaders: ['js'],
-      pattern: ['**/*.ts'],
-    },
-  ],
-});
diff --git a/packages/@core/ui-kit/form-ui/package.json b/packages/@core/ui-kit/form-ui/package.json
index 944fd49e..cc54a078 100644
--- a/packages/@core/ui-kit/form-ui/package.json
+++ b/packages/@core/ui-kit/form-ui/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vben-core/form-ui",
-  "version": "5.5.1",
+  "version": "5.7.0",
   "homepage": "https://github.com/vbenjs/vue-vben-admin",
   "bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
   "repository": {
@@ -11,7 +11,7 @@
   "license": "MIT",
   "type": "module",
   "scripts": {
-    "build": "pnpm unbuild",
+    "build": "pnpm exec tsdown",
     "prepublishOnly": "npm run build"
   },
   "files": [
@@ -22,30 +22,38 @@
   ],
   "main": "./dist/index.mjs",
   "module": "./dist/index.mjs",
+  "types": "./dist/index.d.ts",
   "exports": {
     ".": {
       "types": "./src/index.ts",
       "development": "./src/index.ts",
+      "production": "./src/index.ts",
       "default": "./dist/index.mjs"
     }
   },
   "publishConfig": {
     "exports": {
       ".": {
+        "types": "./dist/index.d.ts",
         "default": "./dist/index.mjs"
       }
     }
   },
   "dependencies": {
+    "@tanstack/store": "catalog:",
+    "@tanstack/vue-form": "catalog:",
     "@vben-core/composables": "workspace:*",
+    "@vben-core/icons": "workspace:*",
     "@vben-core/shadcn-ui": "workspace:*",
     "@vben-core/shared": "workspace:*",
     "@vben-core/typings": "workspace:*",
-    "@vee-validate/zod": "catalog:",
     "@vueuse/core": "catalog:",
-    "vee-validate": "catalog:",
     "vue": "catalog:",
     "zod": "catalog:",
     "zod-defaults": "catalog:"
+  },
+  "devDependencies": {
+    "@vue/test-utils": "catalog:",
+    "unplugin-vue": "catalog:"
   }
 }
diff --git a/packages/@core/ui-kit/form-ui/postcss.config.mjs b/packages/@core/ui-kit/form-ui/postcss.config.mjs
deleted file mode 100644
index 3d807045..00000000
--- a/packages/@core/ui-kit/form-ui/postcss.config.mjs
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from '@vben/tailwind-config/postcss';
diff --git a/packages/@core/ui-kit/form-ui/src/components/form-actions.vue b/packages/@core/ui-kit/form-ui/src/components/form-actions.vue
index b9a878e8..1fd5e748 100644
--- a/packages/@core/ui-kit/form-ui/src/components/form-actions.vue
+++ b/packages/@core/ui-kit/form-ui/src/components/form-actions.vue
@@ -3,12 +3,7 @@ import { computed, toRaw, unref, watch } from 'vue';
 
 import { useSimpleLocale } from '@vben-core/composables';
 import { VbenExpandableArrow } from '@vben-core/shadcn-ui';
-import {
-  cn,
-  formatDate,
-  isFunction,
-  triggerWindowResize,
-} from '@vben-core/shared/utils';
+import { cn, isFunction, triggerWindowResize } from '@vben-core/shared/utils';
 
 import { COMPONENT_MAP } from '../config';
 import { injectFormProps } from '../use-form-context';
@@ -35,31 +30,15 @@ const submitButtonOptions = computed(() => {
   };
 });
 
-// const isQueryForm = computed(() => {
-//   return !!unref(rootProps).showCollapseButton;
-// });
-
-const queryFormStyle = computed(() => {
-  if (!unref(rootProps).actionWrapperClass) {
-    return {
-      'grid-column': `-2 / -1`,
-      marginLeft: 'auto',
-    };
-  }
-
-  return {};
-});
-
 async function handleSubmit(e: Event) {
   e?.preventDefault();
   e?.stopPropagation();
-  const { valid } = await form.validate();
-  if (!valid) {
+  const props = unref(rootProps);
+  if (!props.formApi) {
     return;
   }
 
-  const values = handleRangeTimeValue(toRaw(form.values));
-  await unref(rootProps).handleSubmit?.(values);
+  await props.formApi.validateAndSubmit();
 }
 
 async function handleReset(e: Event) {
@@ -67,59 +46,15 @@ async function handleReset(e: Event) {
   e?.stopPropagation();
   const props = unref(rootProps);
 
-  const values = toRaw(form.values);
-  // 清理时间字段
-  props.fieldMappingTime &&
-    props.fieldMappingTime.forEach(([_, [startTimeKey, endTimeKey]]) => {
-      delete values[startTimeKey];
-      delete values[endTimeKey];
-    });
+  const values = toRaw(await props.formApi?.getValues()) ?? {};
 
   if (isFunction(props.handleReset)) {
     await props.handleReset?.(values);
   } else {
-    form.resetForm();
+    form.reset();
   }
 }
 
-function handleRangeTimeValue(values: Record<string, any>) {
-  const fieldMappingTime = unref(rootProps).fieldMappingTime;
-
-  if (!fieldMappingTime || !Array.isArray(fieldMappingTime)) {
-    return values;
-  }
-
-  fieldMappingTime.forEach(
-    ([field, [startTimeKey, endTimeKey], format = 'YYYY-MM-DD']) => {
-      if (startTimeKey && endTimeKey && values[field] === null) {
-        delete values[startTimeKey];
-        delete values[endTimeKey];
-      }
-
-      if (!values[field]) {
-        delete values[field];
-        return;
-      }
-
-      const [startTime, endTime] = values[field];
-      const [startTimeFormat, endTimeFormat] = Array.isArray(format)
-        ? format
-        : [format, format];
-
-      values[startTimeKey] = startTime
-        ? formatDate(startTime, startTimeFormat)
-        : undefined;
-      values[endTimeKey] = endTime
-        ? formatDate(endTime, endTimeFormat)
-        : undefined;
-
-      delete values[field];
-    },
-  );
-
-  return values;
-}
-
 watch(
   () => collapsed.value,
   () => {
@@ -130,22 +65,59 @@ watch(
   },
 );
 
+const actionWrapperClass = computed(() => {
+  const props = unref(rootProps);
+  const actionLayout = props.actionLayout || 'rowEnd';
+  const actionPosition = props.actionPosition || 'right';
+
+  const cls = [
+    'flex',
+    'items-center',
+    'gap-3',
+    props.compact ? 'pb-2' : 'pb-4',
+    props.layout === 'vertical' ? 'self-end' : 'self-center',
+    props.layout === 'inline' ? '' : 'w-full',
+    props.actionWrapperClass,
+  ];
+
+  switch (actionLayout) {
+    case 'newLine': {
+      cls.push('col-span-full');
+      break;
+    }
+    case 'rowEnd': {
+      cls.push('col-[-2/-1]');
+      break;
+    }
+    // 'inline' 不需要额外类名，保持默认
+  }
+
+  switch (actionPosition) {
+    case 'center': {
+      cls.push('justify-center');
+      break;
+    }
+    case 'left': {
+      cls.push('justify-start');
+      break;
+    }
+    default: {
+      // case 'right': 默认右对齐
+      cls.push('justify-end');
+      break;
+    }
+  }
+
+  return cls.join(' ');
+});
+
 defineExpose({
   handleReset,
   handleSubmit,
 });
 </script>
 <template>
-  <div
-    :class="
-      cn(
-        'col-span-full w-full text-right',
-        rootProps.compact ? 'pb-2' : 'pb-6',
-        rootProps.actionWrapperClass,
-      )
-    "
-    :style="queryFormStyle"
-  >
+  <div :class="cn(actionWrapperClass)">
     <template v-if="rootProps.actionButtonsReverse">
       <!-- 提交按钮前 -->
       <slot name="submit-before"></slot>
@@ -153,7 +125,6 @@ defineExpose({
       <component
         :is="COMPONENT_MAP.PrimaryButton"
         v-if="submitButtonOptions.show"
-        class="ml-3"
         type="button"
         @click="handleSubmit"
         v-bind="submitButtonOptions"
@@ -168,7 +139,6 @@ defineExpose({
     <component
       :is="COMPONENT_MAP.DefaultButton"
       v-if="resetButtonOptions.show"
-      class="ml-3"
       type="button"
       @click="handleReset"
       v-bind="resetButtonOptions"
@@ -183,7 +153,6 @@ defineExpose({
       <component
         :is="COMPONENT_MAP.PrimaryButton"
         v-if="submitButtonOptions.show"
-        class="ml-3"
         type="button"
         @click="handleSubmit"
         v-bind="submitButtonOptions"
@@ -196,9 +165,9 @@ defineExpose({
     <slot name="expand-before"></slot>
 
     <VbenExpandableArrow
+      class="ml-[-0.3em]"
       v-if="rootProps.showCollapseButton"
       v-model:model-value="collapsed"
-      class="ml-2"
     >
       <span>{{ collapsed ? $t('expand') : $t('collapse') }}</span>
     </VbenExpandableArrow>
diff --git a/packages/@core/ui-kit/form-ui/src/components/form-field-array.vue b/packages/@core/ui-kit/form-ui/src/components/form-field-array.vue
new file mode 100644
index 00000000..9f22067e
--- /dev/null
+++ b/packages/@core/ui-kit/form-ui/src/components/form-field-array.vue
@@ -0,0 +1,234 @@
+<script setup lang="ts">
+// oxlint-disable unicorn/no-nested-ternary
+import type { FormCommonConfig, FormSchema } from '../types';
+
+import { computed } from 'vue';
+
+import { Plus, X } from '@vben-core/icons';
+import {
+  VbenButton,
+  VbenIconButton,
+  VbenRenderContent,
+} from '@vben-core/shadcn-ui';
+import { cn, get, set } from '@vben-core/shared/utils';
+
+import { injectRenderFormProps } from '../form-render/context';
+import FormField from '../form-render/form-field.vue';
+import { createArrayChildSchema } from '../form-render/schema';
+
+defineOptions({ name: 'VbenFormFieldArray', inheritAttrs: false });
+
+const props = withDefaults(
+  defineProps<{
+    /** 操作列表头文案 */
+    actionText?: string;
+    /** 「添加」按钮文案 */
+    addButtonText?: string;
+    /** 子字段通用配置 */
+    commonConfig?: FormCommonConfig;
+    /**
+     * 新增一行时生成的默认数据；缺省时按 schema 的 fieldName 生成空对象
+     */
+    createRow?: () => Record<string, any>;
+    disabled?: boolean;
+    /** 空数据文案 */
+    emptyText?: string;
+    /** 子字段全局通用配置 */
+    globalCommonConfig?: FormCommonConfig;
+    /** 最多行数 */
+    max?: number;
+    /** 最少行数 */
+    min?: number;
+    /** 字段路径，由外层 FormField 通过 componentField 透传 */
+    name?: string;
+    /**
+     * 列定义，每一列就是一个子字段（复用 FormSchema）
+     */
+    schema?: FormSchema[];
+    /** 是否显示序号列 */
+    showIndex?: boolean;
+  }>(),
+  {
+    actionText: '操作',
+    addButtonText: '添加一行',
+    createRow: undefined,
+    disabled: false,
+    emptyText: '暂无数据',
+    commonConfig: () => ({}),
+    globalCommonConfig: () => ({}),
+    max: Number.POSITIVE_INFINITY,
+    min: 0,
+    name: '',
+    schema: () => [],
+    showIndex: true,
+  },
+);
+
+const arrayPath = computed(() => props.name);
+const formRenderProps = injectRenderFormProps();
+const form = formRenderProps.form;
+if (!form) {
+  throw new Error('Form api is required in <VbenFormFieldArray />');
+}
+const formActions = form;
+const arrayLength = formActions.useSelector((state) => {
+  const value = get(state.values, props.name);
+  return Array.isArray(value) ? value.length : 0;
+});
+const rowIndexes = computed(() =>
+  Array.from({ length: arrayLength.value }, (_, index) => index),
+);
+
+const canAdd = computed(() => arrayLength.value < props.max);
+const canRemove = computed(() => arrayLength.value > props.min);
+const gridStyle = computed(() => {
+  const columns = [
+    ...(props.showIndex ? ['3rem'] : []),
+    ...props.schema.map(() => 'minmax(0, 1fr)'),
+    '4rem',
+  ];
+  return {
+    gridTemplateColumns: columns.join(' '),
+  };
+});
+
+function buildDefaultRow(): Record<string, any> {
+  if (props.createRow) {
+    return props.createRow();
+  }
+
+  const row: Record<string, any> = {};
+  props.schema.forEach((col) => {
+    let value: any = null;
+    if (Reflect.has(col, 'defaultValue') && col.defaultValue !== undefined) {
+      value = col.defaultValue;
+    } else if ('type' in col && col.type === 'array') {
+      value = [];
+    }
+    set(row, col.fieldName, value);
+  });
+  return row;
+}
+
+function addRow() {
+  if (props.disabled || !canAdd.value) {
+    return;
+  }
+  formActions.pushFieldValue(arrayPath.value, buildDefaultRow());
+}
+
+function removeRow(index: number) {
+  if (props.disabled || !canRemove.value) {
+    return;
+  }
+  void formActions.removeFieldValue(arrayPath.value, index);
+}
+
+function rowSchemas(index: number) {
+  return props.schema.map((col) =>
+    createArrayChildSchema(col as never, {
+      arrayField: arrayPath.value,
+      commonConfig: props.commonConfig,
+      disabled: props.disabled,
+      globalCommonConfig: props.globalCommonConfig,
+      index,
+    }),
+  );
+}
+
+const normalizedRowSchemas = computed(() =>
+  Array.from({ length: arrayLength.value }, (_, index) => rowSchemas(index)),
+);
+</script>
+
+<template>
+  <div :class="cn('w-full', $attrs.class as string)">
+    <div class="border-border/70 overflow-hidden rounded-md border">
+      <div
+        class="bg-muted/30 border-border hidden border-b px-2 sm:grid"
+        :style="gridStyle"
+      >
+        <div
+          v-if="showIndex"
+          class="text-muted-foreground px-2 py-2 text-left text-sm font-normal"
+        >
+          #
+        </div>
+        <div
+          v-for="col in schema"
+          :key="col.fieldName"
+          class="text-muted-foreground px-2 py-2 text-left text-sm font-normal"
+        >
+          <VbenRenderContent :content="col.label" />
+        </div>
+        <div
+          class="text-muted-foreground px-2 py-2 text-left text-sm font-normal"
+        >
+          {{ actionText }}
+        </div>
+      </div>
+
+      <div
+        v-for="index in rowIndexes"
+        :key="`${arrayPath}-${index}`"
+        class="border-border/60 border-b p-3 last:border-b-0 sm:grid sm:p-0"
+        :style="gridStyle"
+      >
+        <div
+          v-if="showIndex"
+          class="text-muted-foreground mb-2 text-sm sm:mb-0 sm:px-4 sm:py-3"
+        >
+          <span class="sm:hidden">#</span>
+          {{ index + 1 }}
+        </div>
+
+        <template
+          v-for="(childSchema, childIndex) in normalizedRowSchemas[index]"
+          :key="childSchema.fieldName"
+        >
+          <div class="min-w-0 py-2 sm:px-2">
+            <div
+              class="text-muted-foreground mb-1 text-xs font-medium sm:hidden"
+            >
+              <VbenRenderContent :content="schema?.[childIndex]?.label" />
+            </div>
+            <FormField
+              v-bind="childSchema"
+              :class="childSchema.formItemClass"
+            />
+          </div>
+        </template>
+
+        <div class="flex justify-end pt-1 sm:block sm:px-2 sm:py-3">
+          <VbenIconButton
+            type="button"
+            :disabled="disabled || !canRemove"
+            :on-click="() => removeRow(index)"
+            class="text-muted-foreground hover:text-destructive"
+          >
+            <X class="size-4" />
+          </VbenIconButton>
+        </div>
+      </div>
+
+      <div
+        v-if="arrayLength === 0"
+        class="text-muted-foreground py-6 text-center text-sm"
+      >
+        {{ emptyText }}
+      </div>
+    </div>
+
+    <VbenButton
+      variant="outline"
+      size="sm"
+      type="button"
+      :disabled="disabled || !canAdd"
+      class="mt-3 w-full border-dashed"
+      @click="addRow"
+    >
+      <Plus class="mr-1 size-4" />
+      {{ addButtonText }}
+    </VbenButton>
+  </div>
+</template>
diff --git a/packages/@core/ui-kit/form-ui/src/config.ts b/packages/@core/ui-kit/form-ui/src/config.ts
index 9e82cffe..350fe319 100644
--- a/packages/@core/ui-kit/form-ui/src/config.ts
+++ b/packages/@core/ui-kit/form-ui/src/config.ts
@@ -1,10 +1,11 @@
+import type { Component } from 'vue';
+
 import type {
   BaseFormComponentType,
   FormCommonConfig,
   VbenFormAdapterOptions,
 } from './types';
 
-import type { Component } from 'vue';
 import { h } from 'vue';
 
 import {
@@ -17,7 +18,9 @@ import {
 } from '@vben-core/shadcn-ui';
 import { globalShareState } from '@vben-core/shared/global-state';
 
-import { defineRule } from 'vee-validate';
+import VbenFormFieldArray from './components/form-field-array.vue';
+import { warnDeprecatedOnce } from './deprecation';
+import { registerFormRules } from './rule-registry';
 
 const DEFAULT_MODEL_PROP_NAME = 'modelValue';
 
@@ -27,6 +30,7 @@ export const COMPONENT_MAP: Record<BaseFormComponentType, Component> = {
   DefaultButton: h(VbenButton, { size: 'sm', variant: 'outline' }),
   PrimaryButton: h(VbenButton, { size: 'sm', variant: 'default' }),
   VbenCheckbox,
+  VbenFormFieldArray,
   VbenInput,
   VbenInputPassword,
   VbenPinInput,
@@ -42,24 +46,25 @@ export const COMPONENT_BIND_EVENT_MAP: Partial<
 export function setupVbenForm<
   T extends BaseFormComponentType = BaseFormComponentType,
 >(options: VbenFormAdapterOptions<T>) {
-  const { config, defineRules } = options;
+  const { config, defineRules, rules } = options;
 
-  const {
-    disabledOnChangeListener = true,
-    disabledOnInputListener = true,
-    emptyStateValue = undefined,
-  } = (config || {}) as FormCommonConfig;
+  const { changeEventFallback = false, emptyStateValue = undefined } =
+    (config || {}) as FormCommonConfig;
 
   Object.assign(DEFAULT_FORM_COMMON_CONFIG, {
-    disabledOnChangeListener,
-    disabledOnInputListener,
+    changeEventFallback,
     emptyStateValue,
   });
 
   if (defineRules) {
-    for (const key of Object.keys(defineRules)) {
-      defineRule(key, defineRules[key as never]);
-    }
+    warnDeprecatedOnce(
+      'setup-vben-form-define-rules',
+      '[Vben Form] `setupVbenForm({ defineRules })` is deprecated. Use `setupVbenForm({ rules })` instead.',
+    );
+    registerFormRules(defineRules);
+  }
+  if (rules) {
+    registerFormRules(rules);
   }
 
   const baseModelPropName =
diff --git a/packages/@core/ui-kit/form-ui/src/deprecation.ts b/packages/@core/ui-kit/form-ui/src/deprecation.ts
new file mode 100644
index 00000000..ed848ceb
--- /dev/null
+++ b/packages/@core/ui-kit/form-ui/src/deprecation.ts
@@ -0,0 +1,18 @@
+const warnedDeprecations = new Set<string>();
+
+export function resetDeprecationWarnings() {
+  warnedDeprecations.clear();
+}
+
+export function warnDeprecatedOnce(
+  key: string,
+  message: string,
+  options: { production?: boolean } = {},
+) {
+  const production = options.production ?? import.meta.env.PROD;
+  if (production || warnedDeprecations.has(key)) {
+    return;
+  }
+  warnedDeprecations.add(key);
+  console.warn(message);
+}
diff --git a/packages/@core/ui-kit/form-ui/src/field-name.ts b/packages/@core/ui-kit/form-ui/src/field-name.ts
new file mode 100644
index 00000000..c6d92909
--- /dev/null
+++ b/packages/@core/ui-kit/form-ui/src/field-name.ts
@@ -0,0 +1,106 @@
+import { get, isObject, set } from '@vben-core/shared/utils';
+
+export function deleteValueByFieldName(
+  values: Record<string, any>,
+  fieldName: string,
+) {
+  const { pathSegments, rawKey } = resolveFieldNamePath(fieldName);
+  if (rawKey) {
+    Reflect.deleteProperty(values, rawKey);
+    return;
+  }
+
+  if (pathSegments.length === 0) {
+    Reflect.deleteProperty(values, fieldName);
+    return;
+  }
+
+  let target: Record<string, any> | undefined = values;
+  for (const segment of pathSegments.slice(0, -1)) {
+    if (!target || !isObject(target)) {
+      return;
+    }
+    target = target[segment];
+  }
+
+  const lastPathSegment = pathSegments.at(-1);
+  if (!target || !isObject(target) || !lastPathSegment) {
+    return;
+  }
+  Reflect.deleteProperty(target, lastPathSegment);
+}
+
+export function getValueByFieldName(
+  values: Record<string, any>,
+  fieldName: string,
+) {
+  const { rawKey } = resolveFieldNamePath(fieldName);
+  return rawKey ? values[rawKey] : get(values, fieldName);
+}
+
+export function resolveChildUpdateFieldName(
+  parentFieldName: string,
+  fieldName: string,
+) {
+  if (fieldName.startsWith(`${parentFieldName}.`)) {
+    return fieldName.slice(parentFieldName.length + 1);
+  }
+
+  const indexedPrefix = `${parentFieldName}[`;
+  if (!fieldName.startsWith(indexedPrefix)) {
+    return;
+  }
+
+  const closeIndex = fieldName.indexOf(']', indexedPrefix.length);
+  if (closeIndex === -1 || fieldName[closeIndex + 1] !== '.') {
+    return;
+  }
+  return fieldName.slice(closeIndex + 2);
+}
+
+export function resolveFieldNamePath(fieldName: string) {
+  if (fieldName.startsWith('[') && fieldName.endsWith(']')) {
+    const rawKey = fieldName.slice(1, -1);
+    return {
+      pathSegments: [rawKey],
+      rawKey,
+    };
+  }
+
+  return {
+    pathSegments: fieldName.match(/[^.[\]]+/g) ?? [],
+    rawKey: undefined,
+  };
+}
+
+export function resolveValueFormatFieldName(
+  fieldName: string,
+  parentPath?: string,
+) {
+  if (!parentPath) {
+    return fieldName;
+  }
+  if (fieldName.startsWith('$root.')) {
+    return fieldName.slice('$root.'.length);
+  }
+  if (fieldName.startsWith('$row.')) {
+    return `${parentPath}.${fieldName.slice('$row.'.length)}`;
+  }
+  if (fieldName === parentPath || fieldName.startsWith(`${parentPath}.`)) {
+    return fieldName;
+  }
+  return `${parentPath}.${fieldName}`;
+}
+
+export function setValueByFieldName(
+  values: Record<string, any>,
+  fieldName: string,
+  value: any,
+) {
+  const { rawKey } = resolveFieldNamePath(fieldName);
+  if (rawKey) {
+    values[rawKey] = value;
+    return;
+  }
+  set(values, fieldName, value);
+}
diff --git a/packages/@core/ui-kit/form-ui/src/form-api.ts b/packages/@core/ui-kit/form-ui/src/form-api.ts
index 8de5c405..2f371e02 100644
--- a/packages/@core/ui-kit/form-ui/src/form-api.ts
+++ b/packages/@core/ui-kit/form-ui/src/form-api.ts
@@ -1,19 +1,24 @@
-import type { Recordable } from '@vben-core/typings';
+import type { ComponentPublicInstance } from 'vue';
+
 import type {
-  FormState,
-  GenericObject,
-  ResetFormOpts,
-  ValidationOptions,
-} from 'vee-validate';
+  BaseFormComponentType,
+  FormActions,
+  FormFieldName,
+  FormFieldValue,
+  FormResetOptions,
+  FormResetState,
+  FormSchema,
+  FormValues,
+  FormValueSnapshot,
+  VbenFormProps,
+} from './types';
 
-import type { FormActions, FormSchema, VbenFormProps } from './types';
-
-import { toRaw } from 'vue';
+import { isRef, toRaw } from 'vue';
 
 import { Store } from '@vben-core/shared/store';
 import {
   bindMethods,
-  createMerge,
+  cloneDeep,
   isDate,
   isDayjsObject,
   isFunction,
@@ -22,7 +27,31 @@ import {
   StateHandler,
 } from '@vben-core/shared/utils';
 
-function getDefaultState(): VbenFormProps {
+import { warnDeprecatedOnce } from './deprecation';
+import { resolveFieldNamePath } from './field-name';
+import { decodeFormValues, encodeFormValues } from './form-codec';
+import { updateFormSchemaList } from './form-render/schema';
+import { formatFormValues } from './form-value-transform';
+
+type FormApiProps<
+  TFormValues extends FormValues,
+  T extends BaseFormComponentType,
+  P extends Record<string, any>,
+  TSubmitValues extends FormValues,
+> = VbenFormProps<T, P, TFormValues, TSubmitValues>;
+
+type FormApiSchema<
+  TValues extends FormValues,
+  T extends BaseFormComponentType,
+  P extends Record<string, any>,
+> = FormSchema<T, P, TValues>;
+
+function getDefaultState<
+  TFormValues extends FormValues,
+  T extends BaseFormComponentType,
+  P extends Record<string, any>,
+  TSubmitValues extends FormValues,
+>(): FormApiProps<TFormValues, T, P, TSubmitValues> {
   return {
     actionWrapperClass: '',
     collapsed: false,
@@ -32,9 +61,11 @@ function getDefaultState(): VbenFormProps {
     handleReset: undefined,
     handleSubmit: undefined,
     handleValuesChange: undefined,
+    handleCollapsedChange: undefined,
     layout: 'horizontal',
     resetButtonOptions: {},
     schema: [],
+    scrollToFirstError: false,
     showCollapseButton: false,
     showDefaultActions: true,
     submitButtonOptions: {},
@@ -44,103 +75,193 @@ function getDefaultState(): VbenFormProps {
   };
 }
 
-export class FormApi {
-  // 最后一次点击提交时的表单值
-  private latestSubmissionValues: null | Recordable<any> = null;
-  private prevState: null | VbenFormProps = null;
-
+export class FormApi<
+  TFormValues extends FormValues = FormValues,
+  T extends BaseFormComponentType = BaseFormComponentType,
+  P extends Record<string, any> = Record<never, never>,
+  TSubmitValues extends FormValues = TFormValues,
+> {
   // private api: Pick<VbenFormProps, 'handleReset' | 'handleSubmit'>;
-  public form = {} as FormActions;
+  public form = {} as FormActions<TFormValues>;
   isMounted = false;
 
-  public state: null | VbenFormProps = null;
-
+  public state: FormApiProps<TFormValues, T, P, TSubmitValues> | null = null;
   stateHandler: StateHandler;
 
-  public store: Store<VbenFormProps>;
+  public store: Store<FormApiProps<TFormValues, T, P, TSubmitValues>>;
 
-  constructor(options: VbenFormProps = {}) {
+  /**
+   * 组件实例映射
+   */
+  private componentRefMap: Map<string, unknown> = new Map();
+
+  // 最后一次点击提交时的表单值
+  private latestSubmissionValues: null | Partial<TSubmitValues> = null;
+
+  private legacyTransformWarningState: null | Pick<
+    FormApiProps<TFormValues, T, P, TSubmitValues>,
+    'arrayToStringFields' | 'codec' | 'fieldMappingTime' | 'schema'
+  > = null;
+
+  private prevState: FormApiProps<TFormValues, T, P, TSubmitValues> | null =
+    null;
+
+  constructor(options: FormApiProps<TFormValues, T, P, TSubmitValues> = {}) {
     const { ...storeState } = options;
 
-    const defaultState = getDefaultState();
+    const defaultState = getDefaultState<TFormValues, T, P, TSubmitValues>();
 
-    this.store = new Store<VbenFormProps>(
-      {
-        ...defaultState,
-        ...storeState,
-      },
-      {
-        onUpdate: () => {
-          this.prevState = this.state;
-          this.state = this.store.state;
-          this.updateState();
-        },
-      },
-    );
+    this.store = new Store<FormApiProps<TFormValues, T, P, TSubmitValues>>({
+      ...defaultState,
+      ...storeState,
+    });
+
+    this.store.subscribe((state) => {
+      this.prevState = this.state;
+      this.state = state;
+      this.updateState();
+    });
 
     this.state = this.store.state;
     this.stateHandler = new StateHandler();
     bindMethods(this);
   }
 
-  private async getForm() {
-    if (!this.isMounted) {
-      // 等待form挂载
-      await this.stateHandler.waitForCondition();
-    }
-    if (!this.form?.meta) {
-      throw new Error('<VbenForm /> is not mounted');
-    }
-    return this.form;
+  async clearValidation(
+    fieldNames?: FormFieldName<TFormValues> | FormFieldName<TFormValues>[],
+  ) {
+    const form = await this.getForm();
+    form.clearValidation(fieldNames);
   }
 
-  private updateState() {
-    const currentSchema = this.state?.schema ?? [];
-    const prevSchema = this.prevState?.schema ?? [];
-    // 进行了删除schema操作
-    if (currentSchema.length < prevSchema.length) {
-      const currentFields = new Set(
-        currentSchema.map((item) => item.fieldName),
-      );
-      const deletedSchema = prevSchema.filter(
-        (item) => !currentFields.has(item.fieldName),
+  formatValues(rawValues: Readonly<TFormValues>): TSubmitValues;
+  /** @deprecated Declare the submit type on `useVbenForm` instead. */
+  formatValues<TResult extends FormValues>(
+    rawValues: Readonly<FormValues>,
+  ): TResult;
+  formatValues(rawValues: Readonly<FormValues>): FormValues {
+    this.warnLegacyValueTransforms();
+    if (this.state?.codec) {
+      return encodeFormValues(
+        this.state.codec,
+        cloneDeep(toRaw(rawValues)) as Readonly<TFormValues>,
       );
+    }
+    return formatFormValues(
+      toRaw(rawValues),
+      this.state?.schema ?? [],
+      this.state?.fieldMappingTime,
+      this.state?.arrayToStringFields,
+    );
+  }
 
-      for (const schema of deletedSchema) {
-        this.form?.setFieldValue(schema.fieldName, undefined);
+  /**
+   * 获取字段组件实例
+   * @param fieldName 字段名
+   * @returns 组件实例
+   */
+  getFieldComponentRef<T = ComponentPublicInstance>(
+    fieldName: string,
+  ): T | undefined {
+    let target = this.componentRefMap.has(fieldName)
+      ? (this.componentRefMap.get(fieldName) as ComponentPublicInstance)
+      : undefined;
+    if (
+      target &&
+      target.$.type.name === 'AsyncComponentWrapper' &&
+      target.$.subTree.ref
+    ) {
+      if (Array.isArray(target.$.subTree.ref)) {
+        if (
+          target.$.subTree.ref.length > 0 &&
+          isRef(target.$.subTree.ref[0]?.r)
+        ) {
+          target = target.$.subTree.ref[0]?.r.value as ComponentPublicInstance;
+        }
+      } else if (isRef(target.$.subTree.ref.r)) {
+        target = target.$.subTree.ref.r.value as ComponentPublicInstance;
       }
     }
+    return target as T;
   }
 
-  // 如果需要多次更新状态，可以使用 batch 方法
-  batchStore(cb: () => void) {
-    this.store.batch(cb);
+  /**
+   * 获取当前聚焦的字段，如果没有聚焦的字段则返回undefined
+   */
+  getFocusedField() {
+    for (const fieldName of this.componentRefMap.keys()) {
+      const ref = this.getFieldComponentRef(fieldName);
+      if (ref) {
+        let el: HTMLElement | null = null;
+        if (ref instanceof HTMLElement) {
+          el = ref;
+        } else if (ref.$el instanceof HTMLElement) {
+          el = ref.$el;
+        }
+        if (!el) {
+          continue;
+        }
+        if (
+          el === document.activeElement ||
+          el.contains(document.activeElement)
+        ) {
+          return fieldName;
+        }
+      }
+    }
+    return undefined;
   }
 
   getLatestSubmissionValues() {
     return this.latestSubmissionValues || {};
   }
 
+  async getRawValues(): Promise<TFormValues>;
+  /** @deprecated Declare the form value type on `useVbenForm` instead. */
+  async getRawValues<TResult extends FormValues>(): Promise<TResult>;
+  async getRawValues(): Promise<FormValues> {
+    const form = await this.getForm();
+    return cloneDeep(toRaw(form.values ?? {}));
+  }
+
   getState() {
     return this.state;
   }
 
-  async getValues() {
+  async getValues(): Promise<TSubmitValues>;
+  /** @deprecated Declare the submit type on `useVbenForm` instead. */
+  async getValues<TResult extends FormValues>(): Promise<TResult>;
+  async getValues(): Promise<FormValues> {
     const form = await this.getForm();
-    return form.values;
+    return this.formatValues(toRaw(form.values ?? {}));
   }
 
-  async isFieldValid(fieldName: string) {
+  async getValueSnapshot(): Promise<
+    FormValueSnapshot<TFormValues, TSubmitValues>
+  >;
+  /** @deprecated Declare form and submit value types on `useVbenForm`. */
+  async getValueSnapshot<TResult extends FormValues>(): Promise<
+    FormValueSnapshot<TResult>
+  >;
+  async getValueSnapshot(): Promise<FormValueSnapshot> {
+    const rawValues = await this.getRawValues();
+    return {
+      rawValues,
+      values: this.formatValues(rawValues),
+    };
+  }
+
+  async isFieldValid(fieldName: FormFieldName<TFormValues>) {
     const form = await this.getForm();
     return form.isFieldValid(fieldName);
   }
 
-  merge(formApi: FormApi) {
+  merge(formApi: FormApi<any, any, any, any>) {
     const chain = [this, formApi];
     const proxy = new Proxy(formApi, {
       get(target: any, prop: any) {
         if (prop === 'merge') {
-          return (nextFormApi: FormApi) => {
+          return (nextFormApi: FormApi<any, any, any, any>) => {
             chain.push(nextFormApi);
             return proxy;
           };
@@ -150,12 +271,11 @@ export class FormApi {
             try {
               const results = await Promise.all(
                 chain.map(async (api) => {
-                  const form = await api.getForm();
                   const validateResult = await api.validate();
                   if (!validateResult.valid) {
                     return;
                   }
-                  const rawValues = toRaw(form.values || {});
+                  const rawValues = toRaw((await api.getValues()) || {});
                   return rawValues;
                 }),
               );
@@ -176,11 +296,32 @@ export class FormApi {
     return proxy;
   }
 
-  mount(formActions: FormActions) {
+  mount(
+    formActions: FormActions<TFormValues>,
+    componentRefMap?: Map<string, unknown>,
+  ) {
     if (!this.isMounted) {
-      Object.assign(this.form, formActions);
+      this.form = formActions;
       this.stateHandler.setConditionTrue();
-      this.setLatestSubmissionValues({ ...toRaw(this.form.values) });
+      let initialValues: FormValues = {};
+      if (this.form.values) {
+        const rawInitialValues = toRaw(this.form.values);
+        try {
+          initialValues = this.formatValues(rawInitialValues);
+        } catch (error) {
+          if (!this.state?.codec) {
+            throw error;
+          }
+          console.warn(
+            '[Vben Form] Failed to encode initial values. Falling back to raw form values.',
+            error,
+          );
+          initialValues = cloneDeep(rawInitialValues);
+        }
+      }
+      this.setLatestSubmissionValues(initialValues as Partial<TSubmitValues>);
+      this.componentRefMap =
+        componentRefMap ?? this.componentRefMap ?? new Map();
       this.isMounted = true;
     }
   }
@@ -203,35 +344,92 @@ export class FormApi {
   /**
    * 重置表单
    */
+  async reset(state?: FormResetState<TFormValues>, opts?: FormResetOptions) {
+    const form = await this.getForm();
+    return form.reset(state, opts);
+  }
+
+  /** @deprecated Use `reset` instead. */
   async resetForm(
-    state?: Partial<FormState<GenericObject>> | undefined,
-    opts?: Partial<ResetFormOpts>,
+    state?: FormResetState<TFormValues>,
+    opts?: FormResetOptions,
+  ) {
+    warnDeprecatedOnce(
+      'form-api-reset-form',
+      '[Vben Form] `formApi.resetForm()` is deprecated. Use `formApi.reset()` instead.',
+    );
+    return this.reset(state, opts);
+  }
+
+  /** @deprecated Use `clearValidation` instead. */
+  async resetValidate() {
+    warnDeprecatedOnce(
+      'form-api-reset-validate',
+      '[Vben Form] `formApi.resetValidate()` is deprecated. Use `formApi.clearValidation()` instead.',
+    );
+    return this.clearValidation();
+  }
+
+  /**
+   * 滚动到第一个错误字段
+   * @param errors 验证错误对象
+   */
+  scrollToFirstError(errors: Record<string, any> | string) {
+    const firstErrorFieldName =
+      typeof errors === 'string' ? errors : Object.keys(errors)[0];
+
+    if (!firstErrorFieldName) {
+      return;
+    }
+
+    let el = document.querySelector(
+      `[name="${firstErrorFieldName}"]`,
+    ) as HTMLElement;
+
+    // 如果通过 name 属性找不到，尝试通过组件引用查找
+    if (!el) {
+      const componentRef = this.getFieldComponentRef(firstErrorFieldName);
+      if (componentRef && componentRef.$el instanceof HTMLElement) {
+        el = componentRef.$el;
+      }
+    }
+
+    if (el) {
+      // 滚动到错误字段，添加一些偏移量以确保字段完全可见
+      el.scrollIntoView({
+        behavior: 'smooth',
+        block: 'center',
+        inline: 'nearest',
+      });
+    }
+  }
+
+  async setFieldError(fieldName: FormFieldName<TFormValues>, error?: string) {
+    const form = await this.getForm();
+    form.setFieldError(fieldName, error);
+  }
+
+  async setFieldValue<TFieldName extends FormFieldName<TFormValues>>(
+    field: TFieldName,
+    value: FormFieldValue<TFormValues, NoInfer<TFieldName>>,
+    shouldValidate?: boolean,
   ) {
     const form = await this.getForm();
-    return form.resetForm(state, opts);
+    await form.setFieldValue(field, value, shouldValidate);
   }
 
-  async resetValidate() {
-    const form = await this.getForm();
-    const fields = Object.keys(form.errors.value);
-    fields.forEach((field) => {
-      form.setFieldError(field, undefined);
-    });
-  }
-
-  async setFieldValue(field: string, value: any, shouldValidate?: boolean) {
-    const form = await this.getForm();
-    form.setFieldValue(field, value, shouldValidate);
-  }
-
-  setLatestSubmissionValues(values: null | Recordable<any>) {
-    this.latestSubmissionValues = { ...toRaw(values) };
+  setLatestSubmissionValues(values: null | Partial<TSubmitValues>) {
+    this.latestSubmissionValues = {
+      ...toRaw(values),
+    } as Partial<TSubmitValues>;
   }
 
   setState(
     stateOrFn:
-      | ((prev: VbenFormProps) => Partial<VbenFormProps>)
-      | Partial<VbenFormProps>,
+      | ((
+          prev: FormApiProps<TFormValues, T, P, TSubmitValues>,
+        ) => Partial<FormApiProps<TFormValues, T, P, TSubmitValues>>)
+      | Partial<FormApiProps<TFormValues, T, P, TSubmitValues>>,
   ) {
     if (isFunction(stateOrFn)) {
       this.store.setState((prev) => {
@@ -242,6 +440,21 @@ export class FormApi {
     }
   }
 
+  async setSubmitValues(
+    values: TSubmitValues,
+    filterFields: boolean = true,
+    shouldValidate: boolean = false,
+  ) {
+    const codec = this.state?.codec;
+    if (!codec) {
+      throw new Error(
+        '[Vben Form] `setSubmitValues()` requires a form `codec`.',
+      );
+    }
+    const formValues = decodeFormValues(codec, values);
+    await this.setValues(formValues, filterFields, shouldValidate);
+  }
+
   /**
    * 设置表单值
    * @param fields record
@@ -249,7 +462,7 @@ export class FormApi {
    * @param shouldValidate
    */
   async setValues(
-    fields: Record<string, any>,
+    fields: Partial<TFormValues>,
     filterFields: boolean = true,
     shouldValidate: boolean = false,
   ) {
@@ -259,49 +472,76 @@ export class FormApi {
       return;
     }
 
-    /**
-     * 合并算法有待改进，目前的算法不支持object类型的值。
-     * antd的日期时间相关组件的值类型为dayjs对象
-     * element-plus的日期时间相关组件的值类型可能为Date对象
-     * 以上两种类型需要排除深度合并
-     */
-    const fieldMergeFn = createMerge((obj, key, value) => {
-      if (key in obj) {
-        obj[key] =
-          !Array.isArray(obj[key]) &&
-          isObject(obj[key]) &&
-          !isDayjsObject(obj[key]) &&
-          !isDate(obj[key])
-            ? fieldMergeFn(obj[key], value)
-            : value;
+    const schemaFieldPaths = (this.state?.schema ?? []).map(
+      (schema) => resolveFieldNamePath(schema.fieldName).pathSegments,
+    );
+    const filterValue = (
+      value: unknown,
+      parentPath: string[] = [],
+    ): unknown => {
+      if (
+        !isObject(value) ||
+        Array.isArray(value) ||
+        isDate(value) ||
+        isDayjsObject(value)
+      ) {
+        return value;
       }
-      return true;
-    });
-    const filteredFields = fieldMergeFn(fields, form.values);
-    form.setValues(filteredFields, shouldValidate);
+
+      const result: Record<string, unknown> = {};
+      for (const [key, currentValue] of Object.entries(value)) {
+        const currentPath = [...parentPath, key];
+        const matchingPaths = schemaFieldPaths.filter(
+          (schemaPath) =>
+            schemaPath.length >= currentPath.length &&
+            currentPath.every(
+              (pathSegment, index) => schemaPath[index] === pathSegment,
+            ),
+        );
+        if (matchingPaths.length === 0) {
+          continue;
+        }
+
+        result[key] = matchingPaths.some(
+          (schemaPath) => schemaPath.length === currentPath.length,
+        )
+          ? currentValue
+          : filterValue(currentValue, currentPath);
+      }
+      return result;
+    };
+    const filteredFields = filterValue(fields) as Partial<TFormValues>;
+    form.setValues(filteredFields as Partial<TFormValues>, shouldValidate);
   }
 
-  async submitForm(e?: Event) {
+  async submit(e?: Event) {
     e?.preventDefault();
     e?.stopPropagation();
     const form = await this.getForm();
-    await form.submitForm();
-    const rawValues = toRaw(form.values || {});
-    await this.state?.handleSubmit?.(rawValues);
+    await form.submit();
+    return this.submitValues();
+  }
 
-    return rawValues;
+  /** @deprecated Use `submit` instead. */
+  async submitForm(e?: Event) {
+    warnDeprecatedOnce(
+      'form-api-submit-form',
+      '[Vben Form] `formApi.submitForm()` is deprecated. Use `formApi.submit()` instead.',
+    );
+    return this.submit(e);
   }
 
   unmount() {
-    this.form?.resetForm?.();
+    this.form?.reset?.();
     // this.state = null;
+    this.componentRefMap = new Map();
     this.latestSubmissionValues = null;
     this.isMounted = false;
     this.stateHandler.reset();
   }
 
-  updateSchema(schema: Partial<FormSchema>[]) {
-    const updated: Partial<FormSchema>[] = [...schema];
+  updateSchema(schema: Partial<FormApiSchema<TFormValues, T, P>>[]) {
+    const updated: Partial<FormApiSchema<TFormValues, T, P>>[] = [...schema];
     const hasField = updated.every(
       (item) => Reflect.has(item, 'fieldName') && item.fieldName,
     );
@@ -312,55 +552,155 @@ export class FormApi {
       );
       return;
     }
-    const currentSchema = [...(this.state?.schema ?? [])];
-
-    const updatedMap: Record<string, any> = {};
-
-    updated.forEach((item) => {
-      if (item.fieldName) {
-        updatedMap[item.fieldName] = item;
-      }
-    });
-
-    currentSchema.forEach((schema, index) => {
-      const updatedData = updatedMap[schema.fieldName];
-      if (updatedData) {
-        currentSchema[index] = mergeWithArrayOverride(
-          updatedData,
-          schema,
-        ) as FormSchema;
-      }
-    });
+    const currentSchema = updateFormSchemaList(
+      [...(this.state?.schema ?? [])],
+      updated,
+    );
     this.setState({ schema: currentSchema });
   }
 
-  async validate(opts?: Partial<ValidationOptions>) {
+  async validate() {
     const form = await this.getForm();
 
-    const validateResult = await form.validate(opts);
+    const validateResult = await form.validate();
 
-    if (Object.keys(validateResult?.errors ?? {}).length > 0) {
-      console.error('validate error', validateResult?.errors);
+    if (
+      Object.keys(validateResult?.errors ?? {}).length > 0 &&
+      this.state?.scrollToFirstError
+    ) {
+      this.scrollToFirstError(validateResult.errors);
     }
     return validateResult;
   }
 
+  async validateAndSubmit() {
+    const { valid } = await this.validate();
+    if (!valid) return;
+    return this.submitValues();
+  }
+
+  /** @deprecated Use `validateAndSubmit` instead. */
   async validateAndSubmitForm() {
+    warnDeprecatedOnce(
+      'form-api-validate-and-submit-form',
+      '[Vben Form] `formApi.validateAndSubmitForm()` is deprecated. Use `formApi.validateAndSubmit()` instead.',
+    );
+    return this.validateAndSubmit();
+  }
+
+  async validateField(fieldName: FormFieldName<TFormValues>) {
     const form = await this.getForm();
-    const { valid } = await form.validate();
-    if (!valid) {
+    const validateResult = await form.validateField(fieldName);
+
+    if (
+      Object.keys(validateResult?.errors ?? {}).length > 0 &&
+      this.state?.scrollToFirstError
+    ) {
+      this.scrollToFirstError(fieldName);
+    }
+    return validateResult;
+  }
+
+  private async getForm() {
+    if (!this.isMounted) {
+      // 等待form挂载
+      await this.stateHandler.waitForCondition();
+    }
+    if (!this.form?.meta) {
+      throw new Error('<VbenForm /> is not mounted');
+    }
+    return this.form;
+  }
+
+  private async submitValues() {
+    const { rawValues, values } = await this.getValueSnapshot();
+    this.setLatestSubmissionValues(values);
+    await this.state?.handleSubmit?.(values, rawValues);
+    return values;
+  }
+
+  private updateState() {
+    const currentSchema = this.state?.schema ?? [];
+    const prevSchema = this.prevState?.schema ?? [];
+    // 进行了删除schema操作
+    if (currentSchema.length < prevSchema.length) {
+      const currentFields = new Set(
+        currentSchema.map((item) => item.fieldName),
+      );
+      const deletedSchema = prevSchema.filter(
+        (item) => !currentFields.has(item.fieldName),
+      );
+      for (const schema of deletedSchema) {
+        this.form?.setFieldValue?.(
+          schema.fieldName,
+          undefined as FormFieldValue<TFormValues, string>,
+        );
+      }
+    }
+  }
+
+  private warnLegacyValueTransforms() {
+    const warningState = {
+      arrayToStringFields: this.state?.arrayToStringFields,
+      codec: this.state?.codec,
+      fieldMappingTime: this.state?.fieldMappingTime,
+      schema: this.state?.schema ?? [],
+    };
+    const previousState = this.legacyTransformWarningState;
+    if (
+      previousState &&
+      previousState.arrayToStringFields === warningState.arrayToStringFields &&
+      previousState.codec === warningState.codec &&
+      previousState.fieldMappingTime === warningState.fieldMappingTime &&
+      previousState.schema === warningState.schema
+    ) {
       return;
     }
-    return await this.submitForm();
-  }
+    this.legacyTransformWarningState = warningState;
 
-  async validateField(fieldName: string, opts?: Partial<ValidationOptions>) {
-    const form = await this.getForm();
-    const validateResult = await form.validateField(fieldName, opts);
+    const hasValueFormat = (
+      items: FormApiSchema<TFormValues, T, P>[],
+    ): boolean => {
+      return items.some((schema) => {
+        if (schema.valueFormat) {
+          return true;
+        }
+        const children = 'children' in schema ? schema.children : undefined;
+        return Array.isArray(children) && hasValueFormat(children);
+      });
+    };
+    const usesValueFormat = hasValueFormat(warningState.schema);
+    const usesFieldMappingTime =
+      (warningState.fieldMappingTime?.length ?? 0) > 0;
+    const usesArrayToStringFields =
+      (warningState.arrayToStringFields?.length ?? 0) > 0;
+    const usesLegacyTransform =
+      usesValueFormat || usesFieldMappingTime || usesArrayToStringFields;
 
-    if (Object.keys(validateResult?.errors ?? {}).length > 0) {
-      console.error('validate error', validateResult?.errors);
+    if (warningState.codec && usesLegacyTransform) {
+      warnDeprecatedOnce(
+        'form-codec-legacy-transform-conflict',
+        '[Vben Form] The form `codec` takes precedence over deprecated `valueFormat`, `fieldMappingTime`, and `arrayToStringFields` options.',
+      );
+      return;
+    }
+    if (usesValueFormat) {
+      warnDeprecatedOnce(
+        'form-schema-value-format',
+        '[Vben Form] `schema.valueFormat` is deprecated. Use the form-level `codec` instead.',
+      );
+    }
+    if (usesFieldMappingTime) {
+      warnDeprecatedOnce(
+        'form-field-mapping-time',
+        '[Vben Form] `fieldMappingTime` is deprecated. Use the form-level `codec` instead.',
+      );
+    }
+    if (usesArrayToStringFields) {
+      warnDeprecatedOnce(
+        'form-array-to-string-fields',
+        '[Vben Form] `arrayToStringFields` is deprecated. Use the form-level `codec` instead.',
+      );
     }
-    return validateResult;
   }
 }
diff --git a/packages/@core/ui-kit/form-ui/src/form-codec.ts b/packages/@core/ui-kit/form-ui/src/form-codec.ts
new file mode 100644
index 00000000..7dade129
--- /dev/null
+++ b/packages/@core/ui-kit/form-ui/src/form-codec.ts
@@ -0,0 +1,40 @@
+import type { FormCodec, FormValues } from './types';
+
+export type FormCodecPhase = 'decode' | 'encode';
+
+export class FormCodecError extends Error {
+  override readonly cause: unknown;
+  readonly phase: FormCodecPhase;
+
+  constructor(phase: FormCodecPhase, cause: unknown) {
+    super(`[Vben Form] Failed to ${phase} form values.`);
+    this.name = 'FormCodecError';
+    this.cause = cause;
+    this.phase = phase;
+  }
+}
+
+export function decodeFormValues<
+  TFormValues extends FormValues,
+  TSubmitValues extends FormValues,
+>(
+  codec: FormCodec<TFormValues, TSubmitValues>,
+  values: Readonly<TSubmitValues>,
+) {
+  try {
+    return codec.decode(values);
+  } catch (error) {
+    throw new FormCodecError('decode', error);
+  }
+}
+
+export function encodeFormValues<
+  TFormValues extends FormValues,
+  TSubmitValues extends FormValues,
+>(codec: FormCodec<TFormValues, TSubmitValues>, values: Readonly<TFormValues>) {
+  try {
+    return codec.encode(values);
+  } catch (error) {
+    throw new FormCodecError('encode', error);
+  }
+}
diff --git a/packages/@core/ui-kit/form-ui/src/form-render/dependencies.ts b/packages/@core/ui-kit/form-ui/src/form-render/dependencies.ts
index 9881db14..a19aafc6 100644
--- a/packages/@core/ui-kit/form-ui/src/form-render/dependencies.ts
+++ b/packages/@core/ui-kit/form-ui/src/form-render/dependencies.ts
@@ -1,124 +1,297 @@
 import type {
+  ExtendedFormApi,
+  FormDependenciesResolveContext,
+  FormDependenciesResolvedState,
   FormItemDependencies,
+  FormItemDependenciesLegacy,
+  FormItemDependenciesResolve,
+  FormSchemaContext,
   FormSchemaRuleType,
   MaybeComponentProps,
 } from '../types';
 
-import { computed, ref, watch } from 'vue';
+import { computed, isRef, onScopeDispose, shallowRef, watch } from 'vue';
 
-import { isBoolean, isFunction } from '@vben-core/shared/utils';
-
-import { useFormValues } from 'vee-validate';
+import {
+  cloneDeep,
+  get,
+  isBoolean,
+  isEqual,
+  isFunction,
+} from '@vben-core/shared/utils';
 
+import { warnDeprecatedOnce } from '../deprecation';
+import { resolveFieldNamePath } from '../field-name';
+import { injectFormProps } from '../use-form-context';
 import { injectRenderFormProps } from './context';
 
+interface DependencyState {
+  dynamicComponentProps: MaybeComponentProps;
+  dynamicHelp: FormDependenciesResolvedState['help'];
+  dynamicHelpResolved: boolean;
+  dynamicRenderComponentContent: FormDependenciesResolvedState['renderComponentContent'];
+  dynamicRenderComponentContentResolved: boolean;
+  dynamicRules: FormSchemaRuleType | undefined;
+  dynamicRulesResolved: boolean;
+  isDisabled: boolean;
+  isIf: boolean;
+  isRequired: boolean;
+  isShow: boolean;
+}
+
+const legacyDependencyKeys = [
+  'componentProps',
+  'disabled',
+  'if',
+  'required',
+  'rules',
+  'show',
+  'trigger',
+] as const;
+
+const mixedDependenciesWarnings = new WeakSet<object>();
+
+/**
+ * 解析Nested Objects对应的字段值
+ * @param values 表单值
+ * @param fieldName 字段名
+ */
+function resolveValueByFieldName(
+  values: Record<string, any>,
+  fieldName: string,
+) {
+  // [] 表示禁用嵌套
+  const { rawKey } = resolveFieldNamePath(fieldName);
+  if (rawKey) {
+    return values[rawKey];
+  }
+
+  return get(values, fieldName);
+}
+
+function createDependencyState(
+  patch: FormDependenciesResolvedState = {},
+): DependencyState {
+  return {
+    dynamicComponentProps: patch.componentProps ?? {},
+    dynamicHelp: patch.help,
+    dynamicHelpResolved: Reflect.has(patch, 'help'),
+    dynamicRenderComponentContent: patch.renderComponentContent,
+    dynamicRenderComponentContentResolved: Reflect.has(
+      patch,
+      'renderComponentContent',
+    ),
+    dynamicRules: patch.rules,
+    dynamicRulesResolved: Reflect.has(patch, 'rules'),
+    isDisabled: patch.disabled ?? false,
+    isIf: patch.if ?? true,
+    isRequired: patch.required ?? false,
+    isShow: patch.show ?? true,
+  };
+}
+
+function isResolveDependencies(
+  dependencies: FormItemDependencies,
+): dependencies is FormItemDependenciesResolve {
+  return isFunction(dependencies.resolve);
+}
+
+function warnMixedDependencies(dependencies: FormItemDependenciesResolve) {
+  if (
+    import.meta.env.PROD ||
+    mixedDependenciesWarnings.has(dependencies) ||
+    !legacyDependencyKeys.some(
+      (key) => Reflect.get(dependencies, key) !== undefined,
+    )
+  ) {
+    return;
+  }
+  mixedDependenciesWarnings.add(dependencies);
+  console.warn(
+    '[Vben Form] `dependencies.resolve` cannot be combined with legacy dependency callbacks. `resolve` takes precedence.',
+  );
+}
+
+async function resolveLegacyDependencies(
+  dependencies: FormItemDependenciesLegacy,
+  context: FormDependenciesResolveContext,
+): Promise<FormDependenciesResolvedState> {
+  const patch: FormDependenciesResolvedState = {};
+  const { actions, controller, values } = context;
+  const {
+    componentProps,
+    disabled,
+    if: whenIf,
+    required,
+    rules,
+    show,
+    trigger,
+  } = dependencies;
+
+  if (isFunction(whenIf)) {
+    patch.if = !!(await whenIf(values, actions, controller));
+  } else if (isBoolean(whenIf)) {
+    patch.if = whenIf;
+  }
+  if (patch.if === false) {
+    return patch;
+  }
+
+  if (isFunction(show)) {
+    patch.show = !!(await show(values, actions, controller));
+  } else if (isBoolean(show)) {
+    patch.show = show;
+  }
+
+  if (isFunction(componentProps)) {
+    patch.componentProps = await componentProps(values, actions, controller);
+  }
+  if (isFunction(rules)) {
+    patch.rules = await rules(values, actions, controller);
+  }
+  if (isFunction(disabled)) {
+    patch.disabled = !!(await disabled(values, actions, controller));
+  } else if (isBoolean(disabled)) {
+    patch.disabled = disabled;
+  }
+  if (isFunction(required)) {
+    patch.required = !!(await required(values, actions, controller));
+  }
+  if (isFunction(trigger)) {
+    await trigger(values, actions, controller);
+  }
+
+  return patch;
+}
+
 export default function useDependencies(
   getDependencies: () => FormItemDependencies | undefined,
+  getSchemaContext: () => FormSchemaContext = () => ({}),
 ) {
-  const values = useFormValues();
-
+  const [extendApi] = injectFormProps();
   const formRenderProps = injectRenderFormProps();
 
-  // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-  const formApi = formRenderProps.form!;
+  const formApi = formRenderProps.form;
 
-  if (!values) {
-    throw new Error('useDependencies should be used within <VbenForm>');
+  if (!formApi) {
+    throw new Error('Form api is required in useDependencies');
   }
 
-  const isIf = ref(true);
-  const isDisabled = ref(false);
-  const isShow = ref(true);
-  const isRequired = ref(false);
-  const dynamicComponentProps = ref<MaybeComponentProps>({});
-  const dynamicRules = ref<FormSchemaRuleType>();
+  const values = formApi.useValues();
+  const initialTriggerFields = getDependencies()?.triggerFields ?? [];
+  const initialTriggerValues = formApi.useFieldValues(initialTriggerFields);
+
+  // 在 dependencies 里提供访问extendApi的能力
+  function getController(): ExtendedFormApi {
+    const controller = isRef(extendApi)
+      ? extendApi.value.formApi
+      : extendApi.formApi;
+
+    if (!controller) {
+      throw new Error('formApi is required in useDependencies');
+    }
+
+    return controller as unknown as ExtendedFormApi;
+  }
+
+  const dependencyState = shallowRef(createDependencyState());
+  let previousDependencies: FormItemDependencies | undefined;
+  let previousTriggerValues: any[] | undefined;
+  let dependencyEvaluationId = 0;
 
   const triggerFieldValues = computed(() => {
     // 该字段可能会被多个字段触发
     const triggerFields = getDependencies()?.triggerFields ?? [];
+    const usesInitialTriggerFields =
+      triggerFields.length === initialTriggerFields.length &&
+      triggerFields.every(
+        (fieldName, index) => fieldName === initialTriggerFields[index],
+      );
+    if (usesInitialTriggerFields) {
+      return initialTriggerValues.value;
+    }
     return triggerFields.map((dep) => {
-      return values.value[dep];
+      return resolveValueByFieldName(values.value, dep);
     });
   });
 
-  const resetConditionState = () => {
-    isDisabled.value = false;
-    isIf.value = true;
-    isShow.value = true;
-    isRequired.value = false;
-    dynamicRules.value = undefined;
-    dynamicComponentProps.value = {};
-  };
+  function resetConditionState() {
+    dependencyState.value = createDependencyState();
+  }
 
   watch(
     [triggerFieldValues, getDependencies],
-    async ([_values, dependencies]) => {
+    async ([currentTriggerValues, dependencies]) => {
       if (!dependencies || !dependencies?.triggerFields?.length) {
+        dependencyEvaluationId += 1;
+        previousDependencies = dependencies;
+        previousTriggerValues = undefined;
+        resetConditionState();
         return;
       }
-      resetConditionState();
-      const {
-        componentProps,
-        disabled,
-        if: whenIf,
-        required,
-        rules,
-        show,
-        trigger,
-      } = dependencies;
-
-      // 1. 优先判断if，如果if为false，则不渲染dom，后续判断也不再执行
-      const formValues = values.value;
-
-      if (isFunction(whenIf)) {
-        isIf.value = !!(await whenIf(formValues, formApi));
-        // 不渲染
-        if (!isIf.value) return;
-      } else if (isBoolean(whenIf)) {
-        isIf.value = whenIf;
-        if (!isIf.value) return;
+      if (
+        dependencies === previousDependencies &&
+        previousTriggerValues &&
+        isEqual(currentTriggerValues, previousTriggerValues)
+      ) {
+        return;
       }
-
-      // 2. 判断show，如果show为false，则隐藏
-      if (isFunction(show)) {
-        isShow.value = !!(await show(formValues, formApi));
-        if (!isShow.value) return;
-      } else if (isBoolean(show)) {
-        isShow.value = show;
-        if (!isShow.value) return;
+      previousDependencies = dependencies;
+      previousTriggerValues = cloneDeep(currentTriggerValues);
+      const currentEvaluationId = ++dependencyEvaluationId;
+      const context: FormDependenciesResolveContext = {
+        actions: formApi,
+        controller: getController(),
+        schema: {
+          ...getSchemaContext(),
+          rootValues: values.value,
+        },
+        values: values.value,
+      };
+      let patch: FormDependenciesResolvedState | undefined;
+      if (isResolveDependencies(dependencies)) {
+        warnMixedDependencies(dependencies);
+        patch = await dependencies.resolve(context);
+      } else {
+        warnDeprecatedOnce(
+          'form-dependencies-legacy-callbacks',
+          '[Vben Form] Legacy dependency callbacks are deprecated. Use `dependencies.resolve(context)` instead.',
+        );
+        patch = await resolveLegacyDependencies(dependencies, context);
       }
-
-      if (isFunction(componentProps)) {
-        dynamicComponentProps.value = await componentProps(formValues, formApi);
-      }
-
-      if (isFunction(rules)) {
-        dynamicRules.value = await rules(formValues, formApi);
-      }
-
-      if (isFunction(disabled)) {
-        isDisabled.value = !!(await disabled(formValues, formApi));
-      } else if (isBoolean(disabled)) {
-        isDisabled.value = disabled;
-      }
-
-      if (isFunction(required)) {
-        isRequired.value = !!(await required(formValues, formApi));
-      }
-
-      if (isFunction(trigger)) {
-        await trigger(formValues, formApi);
+      if (currentEvaluationId !== dependencyEvaluationId) {
+        return;
       }
+      dependencyState.value = createDependencyState(patch);
     },
-    { deep: true, immediate: true },
+    { immediate: true },
   );
 
+  onScopeDispose(() => {
+    dependencyEvaluationId += 1;
+  });
+
   return {
-    dynamicComponentProps,
-    dynamicRules,
-    isDisabled,
-    isIf,
-    isRequired,
-    isShow,
+    dynamicComponentProps: computed(
+      () => dependencyState.value.dynamicComponentProps,
+    ),
+    dynamicHelp: computed(() => dependencyState.value.dynamicHelp),
+    dynamicHelpResolved: computed(
+      () => dependencyState.value.dynamicHelpResolved,
+    ),
+    dynamicRenderComponentContent: computed(
+      () => dependencyState.value.dynamicRenderComponentContent,
+    ),
+    dynamicRenderComponentContentResolved: computed(
+      () => dependencyState.value.dynamicRenderComponentContentResolved,
+    ),
+    dynamicRules: computed(() => dependencyState.value.dynamicRules),
+    dynamicRulesResolved: computed(
+      () => dependencyState.value.dynamicRulesResolved,
+    ),
+    isDisabled: computed(() => dependencyState.value.isDisabled),
+    isIf: computed(() => dependencyState.value.isIf),
+    isRequired: computed(() => dependencyState.value.isRequired),
+    isShow: computed(() => dependencyState.value.isShow),
   };
 }
diff --git a/packages/@core/ui-kit/form-ui/src/form-render/expandable.ts b/packages/@core/ui-kit/form-ui/src/form-render/expandable.ts
index a7b8ef41..9383064c 100644
--- a/packages/@core/ui-kit/form-ui/src/form-render/expandable.ts
+++ b/packages/@core/ui-kit/form-ui/src/form-render/expandable.ts
@@ -2,13 +2,18 @@ import type { FormRenderProps } from '../types';
 
 import { computed, nextTick, onMounted, ref, useTemplateRef, watch } from 'vue';
 
-import { breakpointsTailwind, useBreakpoints } from '@vueuse/core';
+import {
+  breakpointsTailwind,
+  useBreakpoints,
+  useElementVisibility,
+} from '@vueuse/core';
 
 /**
  * 动态计算行数
  */
 export function useExpandable(props: FormRenderProps) {
   const wrapperRef = useTemplateRef<HTMLElement>('wrapperRef');
+  const isVisible = useElementVisibility(wrapperRef);
   const rowMapping = ref<Record<number, number>>({});
   // 是否已经计算过一次
   const isCalculated = ref(false);
@@ -31,6 +36,7 @@ export function useExpandable(props: FormRenderProps) {
       () => props.showCollapseButton,
       () => breakpoints.active().value,
       () => props.schema?.length,
+      () => isVisible.value,
     ],
     async ([val]) => {
       if (val) {
diff --git a/packages/@core/ui-kit/form-ui/src/form-render/form-field.vue b/packages/@core/ui-kit/form-ui/src/form-render/form-field.vue
index 50c9c17d..64566192 100644
--- a/packages/@core/ui-kit/form-ui/src/form-render/form-field.vue
+++ b/packages/@core/ui-kit/form-ui/src/form-render/form-field.vue
@@ -1,31 +1,54 @@
 <script setup lang="ts">
 import type { ZodType } from 'zod';
 
-import type { FormSchema, MaybeComponentProps } from '../types';
-
-import { computed, nextTick, useTemplateRef, watch } from 'vue';
+import type {
+  FormActions,
+  FormFieldProps,
+  FormRuleContext,
+  FormRuntimeField,
+  MaybeComponentProps,
+} from '../types';
 
 import {
+  computed,
+  markRaw,
+  nextTick,
+  onUnmounted,
+  ref,
+  toRaw,
+  useTemplateRef,
+  watch,
+} from 'vue';
+
+import { ChevronsDown, CircleAlert } from '@vben-core/icons';
+import {
+  Button,
   FormControl,
   FormDescription,
   FormField,
   FormItem,
   FormMessage,
+  VbenCollapsible,
   VbenRenderContent,
+  VbenTooltip,
 } from '@vben-core/shadcn-ui';
 import { cn, isFunction, isObject, isString } from '@vben-core/shared/utils';
 
-import { toTypedSchema } from '@vee-validate/zod';
-import { useFieldError, useFormValues } from 'vee-validate';
-
+import { getFormRule } from '../rule-registry';
+import { injectComponentRefMap } from '../use-form-context';
 import { injectRenderFormProps, useFormContext } from './context';
 import useDependencies from './dependencies';
 import FormLabel from './form-label.vue';
-import { isEventObjectLike } from './helper';
+import { getBaseRules, isEventObjectLike } from './helper';
 
-interface Props extends FormSchema {}
+interface Props extends FormFieldProps {}
+
+interface RuntimeFieldSlotProps {
+  field: FormRuntimeField<any>;
+}
 
 const {
+  changeEventFallback,
   colon,
   commonComponentProps,
   component,
@@ -33,30 +56,48 @@ const {
   dependencies,
   description,
   disabled,
-  disabledOnChangeListener,
-  disabledOnInputListener,
   emptyStateValue,
   fieldName,
   formFieldProps,
+  hide,
   label,
   labelClass,
   labelWidth,
+  modelPropName,
   renderComponentContent,
   rules,
+  help,
+  collapsible,
+  defaultCollapsed = false,
 } = defineProps<
-  {
+  Props & {
     commonComponentProps: MaybeComponentProps;
-  } & Props
+  }
 >();
 
 const { componentBindEventMap, componentMap, isVertical } = useFormContext();
 const formRenderProps = injectRenderFormProps();
-const values = useFormValues();
-const errors = useFieldError(fieldName);
 const fieldComponentRef = useTemplateRef<HTMLInputElement>('fieldComponentRef');
 const formApi = formRenderProps.form;
-const compact = formRenderProps.compact;
-const isInValid = computed(() => errors.value?.length > 0);
+if (!formApi) {
+  throw new Error('Form api is required in <FormField />');
+}
+const error = formApi.useFieldError(fieldName);
+const fieldValue = formApi.useFieldValue(fieldName);
+const compact = computed(() => formRenderProps.compact);
+const isInValid = computed(() => Boolean(error.value));
+const shouldApplyInvalidStyle = computed(() => {
+  return isInValid.value && component !== 'VbenFormFieldArray';
+});
+const collapseOpen = ref(!defaultCollapsed);
+
+function getFormApi(): FormActions {
+  if (!formApi) {
+    throw new Error('Form api is required in <FormField />');
+  }
+
+  return formApi;
+}
 
 const FieldComponent = computed(() => {
   const finalComponent = isString(component)
@@ -66,17 +107,25 @@ const FieldComponent = computed(() => {
     // 组件未注册
     console.warn(`Component ${component} is not registered`);
   }
-  return finalComponent;
+  return finalComponent ? markRaw(toRaw(finalComponent)) : finalComponent;
 });
 
 const {
   dynamicComponentProps,
+  dynamicHelp,
+  dynamicHelpResolved,
+  dynamicRenderComponentContent,
+  dynamicRenderComponentContentResolved,
   dynamicRules,
+  dynamicRulesResolved,
   isDisabled,
   isIf,
   isRequired,
   isShow,
-} = useDependencies(() => dependencies);
+} = useDependencies(
+  () => dependencies,
+  () => ({ fieldName }),
+);
 
 const labelStyle = computed(() => {
   return labelClass?.includes('w-') || isVertical.value
@@ -87,11 +136,14 @@ const labelStyle = computed(() => {
 });
 
 const currentRules = computed(() => {
-  return dynamicRules.value || rules;
+  const currentRule = dynamicRulesResolved.value ? dynamicRules.value : rules;
+  return currentRule && !isString(currentRule)
+    ? toRaw(currentRule)
+    : currentRule;
 });
 
 const visible = computed(() => {
-  return isIf.value && isShow.value;
+  return !hide && isIf.value && isShow.value;
 });
 
 const shouldRequired = computed(() => {
@@ -111,18 +163,7 @@ const shouldRequired = computed(() => {
     return ['required', 'selectRequired'].includes(currentRules.value);
   }
 
-  let isOptional = currentRules?.value?.isOptional?.();
-
-  // 如果有设置默认值，则不是必填，需要特殊处理
-  const typeName = currentRules?.value?._def?.typeName;
-  if (typeName === 'ZodDefault') {
-    const innerType = currentRules?.value?._def.innerType;
-    if (innerType) {
-      isOptional = innerType.isOptional?.();
-    }
-  }
-
-  return !isOptional;
+  return !currentRules.value.isOptional();
 });
 
 const fieldRules = computed(() => {
@@ -141,17 +182,56 @@ const fieldRules = computed(() => {
 
   const isOptional = !shouldRequired.value;
   if (!isOptional) {
-    const unwrappedRules = (rules as any)?.unwrap?.();
-    if (unwrappedRules) {
-      rules = unwrappedRules;
-    }
+    rules = getBaseRules(rules) ?? rules;
   }
-  return toTypedSchema(rules as ZodType);
+  return rules as ZodType;
+});
+
+async function validateFieldValue({ value }: { value: any }) {
+  const activeRules = fieldRules.value;
+  if (!activeRules) {
+    return;
+  }
+
+  if (isString(activeRules)) {
+    const validator = getFormRule(activeRules);
+    if (!validator) {
+      console.warn(`Form rule ${activeRules} is not registered`);
+      return;
+    }
+    const ruleContext: FormRuleContext = {
+      field: {
+        label: isString(label) ? label : undefined,
+        name: fieldName,
+      },
+      label: isString(label) ? label : undefined,
+      name: fieldName,
+    };
+    const result = await validator(value, [], ruleContext);
+    return result === true ? undefined : result;
+  }
+
+  const result = await activeRules.safeParseAsync(value);
+  return result.success ? undefined : result.error.issues[0]?.message;
+}
+
+const fieldValidators = computed(() => {
+  const validators: Record<string, typeof validateFieldValue> = {
+    onSubmitAsync: validateFieldValue,
+  };
+  const validateOn = new Set(formFieldProps?.validateOn ?? ['blur', 'change']);
+  if (validateOn.has('blur')) {
+    validators.onBlurAsync = validateFieldValue;
+  }
+  if (validateOn.has('change')) {
+    validators.onChangeAsync = validateFieldValue;
+  }
+  return validators;
 });
 
 const computedProps = computed(() => {
   const finalComponentProps = isFunction(componentProps)
-    ? componentProps(values.value, formApi!)
+    ? componentProps({ fieldName })
     : componentProps;
 
   return {
@@ -161,6 +241,16 @@ const computedProps = computed(() => {
   };
 });
 
+// 自定义帮助信息
+const computedHelp = computed(() => {
+  const helpContent = dynamicHelpResolved.value ? dynamicHelp.value : help;
+  if (!helpContent) {
+    return undefined;
+  }
+  return () =>
+    isFunction(helpContent) ? helpContent({ fieldName }) : helpContent;
+});
+
 watch(
   () => computedProps.value?.autofocus,
   (value) => {
@@ -174,14 +264,17 @@ watch(
 );
 
 const shouldDisabled = computed(() => {
-  return isDisabled.value || disabled || computedProps.value?.disabled;
+  return Boolean(isDisabled.value || disabled || computedProps.value?.disabled);
 });
 
 const customContentRender = computed(() => {
+  if (dynamicRenderComponentContentResolved.value) {
+    return dynamicRenderComponentContent.value ?? {};
+  }
   if (!isFunction(renderComponentContent)) {
     return {};
   }
-  return renderComponentContent(values.value, formApi!);
+  return renderComponentContent({ fieldName });
 });
 
 const renderContentKey = computed(() => {
@@ -189,22 +282,44 @@ const renderContentKey = computed(() => {
 });
 
 const fieldProps = computed(() => {
-  const rules = fieldRules.value;
   return {
-    keepValue: true,
-    label,
-    ...(rules ? { rules } : {}),
-    ...(formFieldProps as Record<string, any>),
+    asyncDebounceMs: formFieldProps?.asyncDebounceMs,
+    validators: fieldValidators.value,
   };
 });
 
-function fieldBindEvent(slotProps: Record<string, any>) {
-  const modelValue = slotProps.componentField.modelValue;
-  const handler = slotProps.componentField['onUpdate:modelValue'];
+function createFieldSlotProps(slotProps: RuntimeFieldSlotProps) {
+  const { field } = slotProps;
+  function handleChange(value: any) {
+    getFormApi().setFieldError(fieldName);
+    field.handleChange(value);
+  }
+  return {
+    ...slotProps,
+    componentField: {
+      name: fieldName,
+      modelValue: fieldValue.value,
+      onBlur: field.handleBlur,
+      onChange: handleChange,
+      onInput: handleChange,
+      'onUpdate:modelValue': handleChange,
+    },
+  };
+}
 
-  const bindEventField = isString(component)
-    ? componentBindEventMap.value?.[component]
-    : null;
+function resolveModelPropName() {
+  return (
+    modelPropName ||
+    (isString(component) ? componentBindEventMap.value?.[component] : null)
+  );
+}
+
+function fieldBindEvent(
+  componentField: Record<string, any>,
+  bindEventField: null | string | undefined,
+) {
+  const modelValue = componentField.modelValue;
+  const handler = componentField['onUpdate:modelValue'];
 
   let value = modelValue;
   // antd design 的一些组件会传递一个 event 对象
@@ -215,36 +330,41 @@ function fieldBindEvent(slotProps: Record<string, any>) {
   }
 
   if (bindEventField) {
-    return {
-      [`onUpdate:${bindEventField}`]: handler,
-      [bindEventField]: value === undefined ? emptyStateValue : value,
-      onChange: disabledOnChangeListener
-        ? undefined
-        : (e: Record<string, any>) => {
-            const shouldUnwrap = isEventObjectLike(e);
-            const onChange = slotProps?.componentField?.onChange;
-            if (!shouldUnwrap) {
-              return onChange?.(e);
-            }
+    const eventField = bindEventField;
 
-            return onChange?.(e?.target?.[bindEventField] ?? e);
-          },
-      ...(disabledOnInputListener ? { onInput: undefined } : {}),
+    function handleChangeEvent(event: Record<string, any>) {
+      const value = isEventObjectLike(event)
+        ? (event?.target?.[eventField] ?? event)
+        : event;
+      return handler?.(value);
+    }
+
+    return {
+      [`onUpdate:${eventField}`]: handler,
+      [eventField]: value === undefined ? emptyStateValue : value,
+      onChange: changeEventFallback ? handleChangeEvent : undefined,
+      onInput: undefined,
     };
   }
   return {
-    ...(disabledOnInputListener ? { onInput: undefined } : {}),
-    ...(disabledOnChangeListener ? { onChange: undefined } : {}),
+    onChange: changeEventFallback ? componentField.onChange : undefined,
+    onInput: undefined,
   };
 }
 
-function createComponentProps(slotProps: Record<string, any>) {
-  const bindEvents = fieldBindEvent(slotProps);
+function createComponentProps(slotProps: RuntimeFieldSlotProps) {
+  const normalizedSlotProps = createFieldSlotProps(slotProps);
+  const bindEventField = resolveModelPropName();
+  const bindEvents = fieldBindEvent(
+    normalizedSlotProps.componentField,
+    bindEventField,
+  );
 
   const binds = {
-    ...slotProps.componentField,
     ...computedProps.value,
+    ...normalizedSlotProps.componentField,
     ...bindEvents,
+    disabled: shouldDisabled.value,
     ...(Reflect.has(computedProps.value, 'onChange')
       ? { onChange: computedProps.value.onChange }
       : {}),
@@ -252,10 +372,25 @@ function createComponentProps(slotProps: Record<string, any>) {
       ? { onInput: computedProps.value.onInput }
       : {}),
   };
+  if (bindEventField && bindEventField !== 'modelValue') {
+    Reflect.deleteProperty(binds, 'modelValue');
+    Reflect.deleteProperty(binds, 'onUpdate:modelValue');
+  }
 
   return binds;
 }
 
+function createFieldSlotScope(slotProps: RuntimeFieldSlotProps) {
+  return {
+    ...createFieldSlotProps(slotProps),
+    componentProps: createComponentProps(slotProps),
+    disabled: shouldDisabled.value,
+    isInValid: isInValid.value,
+    modelValue: fieldValue.value,
+    name: fieldName,
+  };
+}
+
 function autofocus() {
   if (
     fieldComponentRef.value &&
@@ -266,91 +401,163 @@ function autofocus() {
     fieldComponentRef.value?.focus?.();
   }
 }
+
+const shouldCollapsible = computed(() => {
+  return collapsible; /* && isVertical.value; */
+});
+
+function toggleCollapsed() {
+  collapseOpen.value = !collapseOpen.value;
+}
+
+const componentRefMap = injectComponentRefMap();
+watch(fieldComponentRef, (componentRef) => {
+  componentRefMap?.set(fieldName, componentRef);
+});
+onUnmounted(() => {
+  if (componentRefMap?.has(fieldName)) {
+    componentRefMap.delete(fieldName);
+  }
+});
 </script>
 
 <template>
-  <FormField
-    v-if="isIf"
+  <component
+    v-if="!hide && isIf"
+    :is="formApi.fieldComponent"
     v-bind="fieldProps"
     v-slot="slotProps"
     :name="fieldName"
   >
-    <FormItem
-      v-show="isShow"
-      :class="{
-        'form-valid-error': isInValid,
-        'flex-col': isVertical,
-        'flex-row items-center': !isVertical,
-        'pb-6': !compact,
-        'pb-2': compact,
-      }"
-      class="flex"
-      v-bind="$attrs"
+    <FormField
+      :dirty="slotProps.field.state.meta.isDirty"
+      :error="error"
+      :name="fieldName"
+      :touched="slotProps.field.state.meta.isTouched"
+      :valid="slotProps.field.state.meta.isValid"
     >
-      <FormLabel
-        v-if="!hideLabel"
-        :class="
-          cn(
-            'flex leading-6',
-            {
-              'mr-2 flex-shrink-0 justify-end': !isVertical,
-              'mb-1 flex-row': isVertical,
-            },
-            labelClass,
-          )
-        "
-        :help="help"
-        :required="shouldRequired && !hideRequiredMark"
-        :style="labelStyle"
+      <FormItem
+        v-show="isShow"
+        :class="{
+          'form-valid-error': shouldApplyInvalidStyle,
+          'form-is-required': shouldRequired,
+          'flex-col': isVertical,
+          'flex-row items-center': !isVertical,
+          'pb-4': !compact,
+          'pb-2': compact,
+        }"
+        class="relative flex"
+        v-bind="$attrs"
       >
-        <template v-if="label">
-          <span>{{ label }}</span>
-          <span v-if="colon" class="ml-[2px]">:</span>
-        </template>
-      </FormLabel>
-      <div :class="cn('relative flex w-full items-center', wrapperClass)">
-        <FormControl :class="cn(controlClass)">
-          <slot
-            v-bind="{
-              ...slotProps,
-              ...createComponentProps(slotProps),
-              disabled: shouldDisabled,
-              isInValid,
-            }"
-          >
-            <component
-              :is="FieldComponent"
-              ref="fieldComponentRef"
-              :class="{
-                'border-destructive focus:border-destructive hover:border-destructive/80 focus:shadow-[0_0_0_2px_rgba(255,38,5,0.06)]':
-                  isInValid,
-              }"
-              v-bind="createComponentProps(slotProps)"
-              :disabled="shouldDisabled"
+        <FormLabel
+          v-if="!hideLabel"
+          :class="
+            cn(
+              'flex leading-6',
+              {
+                'mr-2 shrink-0 justify-end': !isVertical,
+                'mb-1 flex-row': isVertical,
+                'self-start': shouldCollapsible && !isVertical,
+              },
+              labelClass,
+            )
+          "
+          :help="computedHelp"
+          :colon="colon"
+          :label="label"
+          :required="shouldRequired && !hideRequiredMark"
+          :style="labelStyle"
+        >
+          <template v-if="label">
+            <VbenRenderContent :content="label" />
+          </template>
+          <template #extra>
+            <Button
+              class="ml-0.5"
+              variant="icon"
+              size="icon"
+              @click.prevent="toggleCollapsed"
+              v-if="shouldCollapsible"
             >
-              <template v-for="name in renderContentKey" :key="name" #[name]>
-                <VbenRenderContent
-                  :content="customContentRender[name]"
-                  v-bind="slotProps"
-                />
-              </template>
-              <!-- <slot></slot> -->
-            </component>
-          </slot>
-        </FormControl>
-        <!-- 自定义后缀 -->
-        <div v-if="suffix" class="ml-1">
-          <VbenRenderContent :content="suffix" />
+              <ChevronsDown
+                :size="16"
+                class="transition-transform"
+                :class="{
+                  'rotate-180': !collapseOpen,
+                }"
+              />
+            </Button>
+          </template>
+        </FormLabel>
+        <div class="flex-auto overflow-hidden p-px">
+          <VbenCollapsible :show-trigger="false" v-model:open="collapseOpen">
+            <template #collapsibleContent>
+              <div
+                :class="cn('relative flex w-full items-center', wrapperClass)"
+              >
+                <FormControl :class="cn(controlClass)">
+                  <slot v-bind="createFieldSlotScope(slotProps)">
+                    <component
+                      :is="FieldComponent"
+                      ref="fieldComponentRef"
+                      :class="{
+                        'border-destructive hover:border-destructive/80 focus:border-destructive focus:shadow-[0_0_0_2px_rgba(255,38,5,0.06)]':
+                          shouldApplyInvalidStyle,
+                      }"
+                      v-bind="createComponentProps(slotProps)"
+                    >
+                      <template
+                        v-for="name in renderContentKey"
+                        :key="name"
+                        #[name]="renderSlotProps"
+                      >
+                        <VbenRenderContent
+                          :content="customContentRender[name]"
+                          v-bind="{
+                            ...renderSlotProps,
+                            formContext: createFieldSlotProps(slotProps),
+                          }"
+                        />
+                      </template>
+                      <!-- <slot></slot> -->
+                    </component>
+                    <VbenTooltip
+                      v-if="compact && isInValid"
+                      :delay-duration="300"
+                      side="left"
+                    >
+                      <template #trigger>
+                        <slot name="trigger">
+                          <CircleAlert
+                            :class="
+                              cn(
+                                'inline-flex size-5 cursor-pointer text-foreground/80 hover:text-foreground',
+                              )
+                            "
+                          />
+                        </slot>
+                      </template>
+                      <FormMessage />
+                    </VbenTooltip>
+                  </slot>
+                </FormControl>
+                <!-- 自定义后缀 -->
+                <div v-if="suffix" class="ml-1">
+                  <VbenRenderContent :content="suffix" />
+                </div>
+              </div>
+            </template>
+          </VbenCollapsible>
+
+          <FormDescription v-if="description" class="text-xs">
+            <VbenRenderContent :content="description" />
+          </FormDescription>
+
+          <Transition name="slide-up" v-if="!compact">
+            <FormMessage class="absolute" />
+          </Transition>
         </div>
-
-        <FormDescription v-if="description">
-          <VbenRenderContent :content="description" />
-        </FormDescription>
-
-        <Transition name="slide-up">
-          <FormMessage class="absolute -bottom-[22px]" />
-        </Transition>
-      </div>
-    </FormItem>
-  </FormField>
+      </FormItem>
+    </FormField>
+  </component>
 </template>
diff --git a/packages/@core/ui-kit/form-ui/src/form-render/form-label.vue b/packages/@core/ui-kit/form-ui/src/form-render/form-label.vue
index 459d5ee5..71a3d8c5 100644
--- a/packages/@core/ui-kit/form-ui/src/form-render/form-label.vue
+++ b/packages/@core/ui-kit/form-ui/src/form-render/form-label.vue
@@ -1,10 +1,18 @@
 <script setup lang="ts">
-import { FormLabel, VbenHelpTooltip } from '@vben-core/shadcn-ui';
+import type { CustomRenderType } from '../types';
+
+import {
+  FormLabel,
+  VbenHelpTooltip,
+  VbenRenderContent,
+} from '@vben-core/shadcn-ui';
 import { cn } from '@vben-core/shared/utils';
 
 interface Props {
   class?: string;
-  help?: string;
+  colon?: boolean;
+  help?: CustomRenderType;
+  label?: CustomRenderType;
   required?: boolean;
 }
 
@@ -13,10 +21,12 @@ const props = defineProps<Props>();
 
 <template>
   <FormLabel :class="cn('flex items-center', props.class)">
-    <span v-if="required" class="text-destructive mr-[2px]">*</span>
+    <span v-if="required" class="mr-0.5 text-destructive">*</span>
     <slot></slot>
     <VbenHelpTooltip v-if="help" trigger-class="size-3.5 ml-1">
-      {{ help }}
+      <VbenRenderContent :content="help" />
     </VbenHelpTooltip>
+    <slot name="extra"></slot>
+    <span v-if="colon && label" class="ml-0.5">:</span>
   </FormLabel>
 </template>
diff --git a/packages/@core/ui-kit/form-ui/src/form-render/form.vue b/packages/@core/ui-kit/form-ui/src/form-render/form.vue
index 7c04540d..70452c71 100644
--- a/packages/@core/ui-kit/form-ui/src/form-render/form.vue
+++ b/packages/@core/ui-kit/form-ui/src/form-render/form.vue
@@ -1,29 +1,23 @@
 <script setup lang="ts">
-import type { ZodTypeAny } from 'zod';
+import type { ZodType } from 'zod';
 
-import type {
-  FormCommonConfig,
-  FormRenderProps,
-  FormSchema,
-  FormShape,
-} from '../types';
+import type { FormCommonConfig, FormRenderProps, FormShape } from '../types';
+import type { NormalizedFormFieldSchema } from './schema';
 
-import { computed } from 'vue';
+import { computed, toRaw } from 'vue';
 
-import { Form } from '@vben-core/shadcn-ui';
-import { cn, isString, mergeWithArrayOverride } from '@vben-core/shared/utils';
-
-import { type GenericObject } from 'vee-validate';
+import { cn, isString } from '@vben-core/shared/utils';
 
 import { provideFormRenderProps } from './context';
 import { useExpandable } from './expandable';
 import FormField from './form-field.vue';
 import { getBaseRules, getDefaultValueInZodStack } from './helper';
+import { createFormFieldSchema } from './schema';
 
 interface Props extends FormRenderProps {}
 
 const props = withDefaults(
-  defineProps<{ globalCommonConfig?: FormCommonConfig } & Props>(),
+  defineProps<Props & { globalCommonConfig?: FormCommonConfig }>(),
   {
     collapsedRows: 1,
     commonConfig: () => ({}),
@@ -37,42 +31,51 @@ const emits = defineEmits<{
   submit: [event: any];
 }>();
 
+const wrapperClass = computed(() => {
+  const cls = ['flex'];
+  if (props.layout === 'inline') {
+    cls.push('flex-wrap gap-x-2');
+  } else {
+    cls.push(props.compact ? 'gap-x-2' : 'gap-x-4', 'flex-col grid');
+  }
+  return cn(...cls, props.wrapperClass);
+});
+
 provideFormRenderProps(props);
 
+// @ts-expect-error unused
 const { isCalculated, keepFormItemIndex, wrapperRef } = useExpandable(props);
 
 const shapes = computed(() => {
   const resultShapes: FormShape[] = [];
   props.schema?.forEach((schema) => {
     const { fieldName } = schema;
-    const rules = schema.rules as ZodTypeAny;
+    const rules = toRaw(schema.rules) as ZodType;
 
-    let typeName = '';
-    if (rules && !isString(rules)) {
-      typeName = rules._def.typeName;
-    }
-
-    const baseRules = getBaseRules(rules) as ZodTypeAny;
+    const baseRules = getBaseRules(rules) as ZodType;
 
     resultShapes.push({
       default: getDefaultValueInZodStack(rules),
       fieldName,
-      required: !['ZodNullable', 'ZodOptional'].includes(typeName),
+      required: Boolean(rules && !isString(rules) && !rules.isOptional()),
       rules: baseRules,
     });
   });
   return resultShapes;
 });
 
-const formComponent = computed(() => (props.form ? 'form' : Form));
+const formComponent = 'form';
 
 const formComponentProps = computed(() => {
   return props.form
     ? {
-        onSubmit: props.form.handleSubmit((val) => emits('submit', val)),
+        onSubmit: props.form.handleSubmit(() => emits('submit', undefined)),
       }
     : {
-        onSubmit: (val: GenericObject) => emits('submit', val),
+        onSubmit: (event: Event) => {
+          event.preventDefault();
+          emits('submit', event);
+        },
       };
 });
 
@@ -80,70 +83,28 @@ const formCollapsed = computed(() => {
   return props.collapsed && isCalculated.value;
 });
 
-const computedSchema = computed(
-  (): ({
-    commonComponentProps: Record<string, any>;
-    formFieldProps: Record<string, any>;
-  } & Omit<FormSchema, 'formFieldProps'>)[] => {
-    const {
-      colon = false,
-      componentProps = {},
-      controlClass = '',
-      disabled,
-      disabledOnChangeListener = true,
-      disabledOnInputListener = true,
-      emptyStateValue = undefined,
-      formFieldProps = {},
-      formItemClass = '',
-      hideLabel = false,
-      hideRequiredMark = false,
-      labelClass = '',
-      labelWidth = 100,
-      wrapperClass = '',
-    } = mergeWithArrayOverride(props.commonConfig, props.globalCommonConfig);
-    return (props.schema || []).map((schema, index) => {
-      const keepIndex = keepFormItemIndex.value;
+const computedSchema = computed((): NormalizedFormFieldSchema[] => {
+  return (props.schema || []).map((schema, index) => {
+    const keepIndex = keepFormItemIndex.value;
 
-      const hidden =
-        // 折叠状态 & 显示折叠按钮 & 当前索引大于保留索引
-        props.showCollapseButton && !!formCollapsed.value && keepIndex
-          ? keepIndex <= index
-          : false;
+    const hidden =
+      // 折叠状态 & 显示折叠按钮 & 当前索引大于保留索引
+      props.showCollapseButton && !!formCollapsed.value && keepIndex
+        ? keepIndex <= index
+        : false;
 
-      return {
-        colon,
-        disabled,
-        disabledOnChangeListener,
-        disabledOnInputListener,
-        emptyStateValue,
-        hideLabel,
-        hideRequiredMark,
-        labelWidth,
-        wrapperClass,
-        ...schema,
-        commonComponentProps: componentProps,
-        componentProps: schema.componentProps,
-        controlClass: cn(controlClass, schema.controlClass),
-        formFieldProps: {
-          ...formFieldProps,
-          ...schema.formFieldProps,
-        },
-        formItemClass: cn(
-          'flex-shrink-0',
-          { hidden },
-          formItemClass,
-          schema.formItemClass,
-        ),
-        labelClass: cn(labelClass, schema.labelClass),
-      };
+    return createFormFieldSchema(schema as never, {
+      commonConfig: props.commonConfig,
+      globalCommonConfig: props.globalCommonConfig,
+      hidden,
     });
-  },
-);
+  });
+});
 </script>
 
 <template>
   <component :is="formComponent" v-bind="formComponentProps">
-    <div ref="wrapperRef" :class="wrapperClass" class="grid">
+    <div ref="wrapperRef" :class="wrapperClass">
       <template v-for="cSchema in computedSchema" :key="cSchema.fieldName">
         <!-- <div v-if="$slots[cSchema.fieldName]" :class="cSchema.formItemClass">
           <slot :definition="cSchema" :name="cSchema.fieldName"> </slot>
diff --git a/packages/@core/ui-kit/form-ui/src/form-render/helper.ts b/packages/@core/ui-kit/form-ui/src/form-render/helper.ts
index cdb3999f..926f09ea 100644
--- a/packages/@core/ui-kit/form-ui/src/form-render/helper.ts
+++ b/packages/@core/ui-kit/form-ui/src/form-render/helper.ts
@@ -1,55 +1,60 @@
-import type {
-  AnyZodObject,
-  ZodDefault,
-  ZodEffects,
-  ZodNumber,
-  ZodString,
-  ZodTypeAny,
-} from 'zod';
+import type { ZodType } from 'zod';
+
+import { toRaw } from 'vue';
 
 import { isObject, isString } from '@vben-core/shared/utils';
 
+import { ZodPipe } from 'zod';
+
+type UnwrappableZodType = ZodType & {
+  unwrap?: () => ZodType;
+};
+
 /**
  * Get the lowest level Zod type.
  * This will unpack optionals, refinements, etc.
  */
-export function getBaseRules<
-  ChildType extends AnyZodObject | ZodTypeAny = ZodTypeAny,
->(schema: ChildType | ZodEffects<ChildType>): ChildType | null {
+export function getBaseRules(schema?: null | string | ZodType): null | ZodType {
   if (!schema || isString(schema)) return null;
-  if ('innerType' in schema._def)
-    return getBaseRules(schema._def.innerType as ChildType);
+  const rawSchema = toRaw(schema);
 
-  if ('schema' in schema._def)
-    return getBaseRules(schema._def.schema as ChildType);
+  if (rawSchema instanceof ZodPipe) {
+    return getBaseRules(rawSchema.in as ZodType);
+  }
 
-  return schema as ChildType;
+  // In zod v4, ZodArray also has an unwrap() that returns its element type
+  // (not an outer wrapper). We must not unwrap it, otherwise z.array(T) loses
+  // its array shell and array values fail validation.
+  const defType = (rawSchema as unknown as { _zod?: { def: { type: string } } })
+    ._zod?.def?.type;
+  if (defType === 'array') {
+    return rawSchema;
+  }
+
+  const unwrappedSchema = (rawSchema as UnwrappableZodType).unwrap?.();
+  if (unwrappedSchema && unwrappedSchema !== rawSchema) {
+    return getBaseRules(unwrappedSchema);
+  }
+
+  return rawSchema;
 }
 
 /**
  * Search for a "ZodDefault" in the Zod stack and return its value.
  */
-export function getDefaultValueInZodStack(schema: ZodTypeAny): any {
+export function getDefaultValueInZodStack(
+  schema?: null | string | ZodType,
+): any {
   if (!schema || isString(schema)) {
     return;
   }
-  const typedSchema = schema as unknown as ZodDefault<ZodNumber | ZodString>;
 
-  if (typedSchema._def.typeName === 'ZodDefault')
-    return typedSchema._def.defaultValue();
-
-  if ('innerType' in typedSchema._def) {
-    return getDefaultValueInZodStack(
-      typedSchema._def.innerType as unknown as ZodTypeAny,
-    );
+  try {
+    const result = toRaw(schema).safeParse(undefined);
+    return result.success ? result.data : undefined;
+  } catch {
+    return undefined;
   }
-  if ('schema' in typedSchema._def) {
-    return getDefaultValueInZodStack(
-      (typedSchema._def as any).schema as ZodTypeAny,
-    );
-  }
-
-  return undefined;
 }
 
 export function isEventObjectLike(obj: any) {
diff --git a/packages/@core/ui-kit/form-ui/src/form-render/index.ts b/packages/@core/ui-kit/form-ui/src/form-render/index.ts
index 7fc17065..f90e8599 100644
--- a/packages/@core/ui-kit/form-ui/src/form-render/index.ts
+++ b/packages/@core/ui-kit/form-ui/src/form-render/index.ts
@@ -1,3 +1,3 @@
-export { default as Form } from './form.vue';
 export { default as FormField } from './form-field.vue';
 export { default as FormLabel } from './form-label.vue';
+export { default as Form } from './form.vue';
diff --git a/packages/@core/ui-kit/form-ui/src/form-render/schema.ts b/packages/@core/ui-kit/form-ui/src/form-render/schema.ts
new file mode 100644
index 00000000..6c40394e
--- /dev/null
+++ b/packages/@core/ui-kit/form-ui/src/form-render/schema.ts
@@ -0,0 +1,455 @@
+import type {
+  BaseFormComponentType,
+  FormActions,
+  FormCommonConfig,
+  FormDependenciesResolveContext,
+  FormFieldProps,
+  FormItemDependencies,
+  FormItemDependenciesLegacy,
+  FormSchema,
+  FormSchemaContext,
+  MaybeComponentProps,
+} from '../types';
+
+import {
+  get,
+  isFunction,
+  mergeWithArrayOverride,
+} from '@vben-core/shared/utils';
+
+import { resolveChildUpdateFieldName } from '../field-name';
+
+type AnyFormSchema = FormSchema<BaseFormComponentType, Record<string, any>>;
+
+export type NormalizedFormFieldSchema = FormFieldProps & {
+  commonComponentProps: MaybeComponentProps;
+  formFieldProps: Record<string, any>;
+  formItemClass: string;
+};
+
+interface CreateFormFieldSchemaOptions {
+  commonConfig?: FormCommonConfig;
+  disabled?: boolean;
+  forceHideLabel?: boolean;
+  globalCommonConfig?: FormCommonConfig;
+  hidden?: boolean;
+}
+
+interface CreateArrayChildSchemaOptions extends CreateFormFieldSchemaOptions {
+  arrayField: string;
+  index: number;
+}
+
+function createSchemaContext(
+  baseContext: FormSchemaContext,
+  values?: Partial<Record<string, any>>,
+): FormSchemaContext {
+  const rootValues = values as Record<string, any> | undefined;
+  return {
+    ...baseContext,
+    rootValues,
+    row:
+      baseContext.rowPath && rootValues
+        ? get(rootValues, baseContext.rowPath)
+        : undefined,
+  };
+}
+
+function scopeRowFieldName(rowPath: string, fieldName: string) {
+  if (!fieldName) {
+    return fieldName;
+  }
+
+  if (fieldName.startsWith('$root.')) {
+    return fieldName.slice('$root.'.length);
+  }
+
+  if (fieldName.startsWith('$row.')) {
+    return `${rowPath}.${fieldName.slice('$row.'.length)}`;
+  }
+
+  if (fieldName === rowPath || fieldName.startsWith(`${rowPath}.`)) {
+    return fieldName;
+  }
+
+  return `${rowPath}.${fieldName}`;
+}
+
+function wrapComponentProps(
+  componentProps: AnyFormSchema['componentProps'],
+  baseContext: FormSchemaContext,
+) {
+  if (!isFunction(componentProps)) {
+    return componentProps;
+  }
+
+  return () => componentProps(baseContext);
+}
+
+function wrapCommonConfig(
+  commonConfig: FormCommonConfig | undefined,
+  baseContext: FormSchemaContext,
+) {
+  if (!commonConfig || !isFunction(commonConfig.componentProps)) {
+    return commonConfig;
+  }
+
+  return {
+    ...commonConfig,
+    componentProps: wrapComponentProps(
+      commonConfig.componentProps,
+      baseContext,
+    ),
+  };
+}
+
+function wrapCustomParamsRender(
+  render: AnyFormSchema['help'],
+  baseContext: FormSchemaContext,
+) {
+  if (!isFunction(render)) {
+    return render;
+  }
+
+  return () => render(baseContext);
+}
+
+function wrapRenderComponentContent(
+  render: AnyFormSchema['renderComponentContent'],
+  baseContext: FormSchemaContext,
+) {
+  if (!isFunction(render)) {
+    return render;
+  }
+
+  return () => render(baseContext);
+}
+
+function wrapDependencyFn<T>(handler: T, baseContext: FormSchemaContext): T {
+  if (!isFunction(handler)) {
+    return handler;
+  }
+
+  return ((
+    values: Partial<Record<string, any>>,
+    actions: FormActions,
+    controller: any,
+  ) =>
+    handler(
+      values,
+      actions,
+      controller,
+      createSchemaContext(baseContext, values),
+    )) as T;
+}
+
+function scopeDependencies(
+  dependencies: FormItemDependencies | undefined,
+  baseContext: FormSchemaContext,
+): FormItemDependencies | undefined {
+  if (!dependencies) {
+    return dependencies;
+  }
+
+  const rowPath = baseContext.rowPath;
+  if (!rowPath) {
+    return dependencies;
+  }
+
+  const triggerFields =
+    dependencies.triggerFields?.map((fieldName) =>
+      scopeRowFieldName(rowPath, fieldName),
+    ) ?? [];
+  if (isFunction(dependencies.resolve)) {
+    const resolve = dependencies.resolve;
+    return {
+      resolve(context: FormDependenciesResolveContext) {
+        return resolve({
+          ...context,
+          schema: createSchemaContext(
+            baseContext,
+            context.values as Partial<Record<string, any>>,
+          ),
+        });
+      },
+      triggerFields,
+    };
+  }
+
+  const legacyDependencies = dependencies as FormItemDependenciesLegacy;
+
+  return {
+    ...legacyDependencies,
+    componentProps: wrapDependencyFn(
+      legacyDependencies.componentProps,
+      baseContext,
+    ),
+    disabled: wrapDependencyFn(legacyDependencies.disabled, baseContext),
+    if: wrapDependencyFn(legacyDependencies.if, baseContext),
+    required: wrapDependencyFn(legacyDependencies.required, baseContext),
+    rules: wrapDependencyFn(legacyDependencies.rules, baseContext),
+    show: wrapDependencyFn(legacyDependencies.show, baseContext),
+    trigger: wrapDependencyFn(legacyDependencies.trigger, baseContext),
+    triggerFields,
+  };
+}
+
+function createArrayComponentProps(
+  schema: AnyFormSchema,
+  options: CreateFormFieldSchemaOptions,
+) {
+  const componentProps = schema.componentProps;
+  const arrayProps = 'arrayProps' in schema ? schema.arrayProps : undefined;
+  const children = getFormArraySchemaChildren(schema);
+  const commonConfig = options.commonConfig;
+  const globalCommonConfig = options.globalCommonConfig;
+  const schemaProps = children.length > 0 ? { schema: children } : {};
+
+  if (isFunction(componentProps)) {
+    return () => ({
+      ...arrayProps,
+      ...componentProps({ fieldName: schema.fieldName }),
+      commonConfig,
+      globalCommonConfig,
+      ...schemaProps,
+    });
+  }
+
+  return {
+    ...arrayProps,
+    ...componentProps,
+    commonConfig,
+    globalCommonConfig,
+    ...schemaProps,
+  };
+}
+
+function createArrayFieldSchema(
+  schema: AnyFormSchema,
+  options: CreateFormFieldSchemaOptions,
+) {
+  const restSchema = { ...(schema as AnyFormSchema & Record<string, any>) };
+  Reflect.deleteProperty(restSchema, 'arrayProps');
+  Reflect.deleteProperty(restSchema, 'children');
+  Reflect.deleteProperty(restSchema, 'type');
+
+  return {
+    ...restSchema,
+    component: 'VbenFormFieldArray',
+    componentProps: createArrayComponentProps(schema, options),
+  };
+}
+
+interface FormArraySchemaLike {
+  children?: unknown;
+  componentProps?: unknown;
+}
+
+interface UpdatableFormSchemaLike extends FormArraySchemaLike {
+  fieldName: string;
+}
+
+function setSchemaChildren<TSchema extends UpdatableFormSchemaLike>(
+  schema: TSchema,
+  children: TSchema[],
+) {
+  if ('children' in schema && Array.isArray(schema.children)) {
+    return {
+      ...schema,
+      children,
+    } as TSchema;
+  }
+
+  if (
+    !isFunction(schema.componentProps) &&
+    schema.componentProps &&
+    Array.isArray((schema.componentProps as Record<string, any>).schema)
+  ) {
+    return {
+      ...schema,
+      componentProps: {
+        ...(schema.componentProps as Record<string, any>),
+        schema: children,
+      },
+    } as TSchema;
+  }
+  return schema;
+}
+
+export function getFormArraySchemaChildren<TSchema = FormSchema>(
+  schema: FormArraySchemaLike,
+): TSchema[] {
+  if ('children' in schema && Array.isArray(schema.children)) {
+    return schema.children as TSchema[];
+  }
+
+  const componentProps = schema.componentProps;
+  if (
+    !isFunction(componentProps) &&
+    componentProps &&
+    Array.isArray((componentProps as Record<string, any>).schema)
+  ) {
+    return (componentProps as Record<string, any>).schema as TSchema[];
+  }
+
+  return [];
+}
+
+export function isFormArraySchema(schema: Partial<AnyFormSchema>) {
+  return (
+    ('type' in schema && schema.type === 'array') ||
+    schema.component === 'VbenFormFieldArray' ||
+    getFormArraySchemaChildren(schema).length > 0
+  );
+}
+
+export function resolveArrayChildFieldName(rowPath: string, fieldName: string) {
+  return scopeRowFieldName(rowPath, fieldName);
+}
+
+export function updateFormSchemaList<TSchema extends UpdatableFormSchemaLike>(
+  currentSchema: TSchema[],
+  updated: Partial<TSchema>[],
+): TSchema[] {
+  return currentSchema.map((schema) => {
+    const exactUpdatedData = updated.find(
+      (item) => item.fieldName === schema.fieldName,
+    );
+    if (exactUpdatedData) {
+      return mergeWithArrayOverride(exactUpdatedData, schema) as TSchema;
+    }
+
+    const children = getFormArraySchemaChildren<TSchema>(schema);
+    if (children.length === 0) {
+      return schema;
+    }
+    const childUpdates = updated.flatMap((item) => {
+      const fieldName = item.fieldName
+        ? resolveChildUpdateFieldName(schema.fieldName, item.fieldName)
+        : undefined;
+      return fieldName ? [{ ...item, fieldName } as Partial<TSchema>] : [];
+    });
+    if (childUpdates.length === 0) {
+      return schema;
+    }
+    return setSchemaChildren(
+      schema,
+      updateFormSchemaList(children, childUpdates),
+    );
+  });
+}
+
+export function createFormFieldSchema(
+  schema: AnyFormSchema,
+  options: CreateFormFieldSchemaOptions = {},
+): NormalizedFormFieldSchema {
+  const commonConfig = mergeWithArrayOverride(
+    options.commonConfig ?? {},
+    options.globalCommonConfig ?? {},
+  );
+  const {
+    changeEventFallback = false,
+    colon = false,
+    componentProps = {},
+    controlClass = '',
+    disabled,
+    emptyStateValue = undefined,
+    formFieldProps = {},
+    formItemClass = '',
+    hideLabel = false,
+    hideRequiredMark = false,
+    labelClass = '',
+    labelWidth = 100,
+    modelPropName = '',
+    wrapperClass = '',
+  } = commonConfig;
+
+  const normalizedSchema = isFormArraySchema(schema)
+    ? createArrayFieldSchema(schema, options)
+    : schema;
+  const commonComponentProps = isFunction(componentProps)
+    ? componentProps({ fieldName: normalizedSchema.fieldName })
+    : componentProps;
+
+  let resolvedSchemaFormItemClass = normalizedSchema.formItemClass;
+  if (isFunction(normalizedSchema.formItemClass)) {
+    try {
+      resolvedSchemaFormItemClass = normalizedSchema.formItemClass();
+    } catch (error) {
+      console.error('Error calling formItemClass function:', error);
+      resolvedSchemaFormItemClass = '';
+    }
+  }
+
+  return {
+    changeEventFallback,
+    colon,
+    emptyStateValue,
+    hideRequiredMark,
+    labelWidth,
+    modelPropName,
+    wrapperClass,
+    ...normalizedSchema,
+    commonComponentProps,
+    componentProps: normalizedSchema.componentProps,
+    controlClass: [controlClass, normalizedSchema.controlClass]
+      .filter(Boolean)
+      .join(' '),
+    formFieldProps: {
+      ...formFieldProps,
+      ...normalizedSchema.formFieldProps,
+    },
+    formItemClass: [
+      'shrink-0',
+      options.hidden ? 'hidden' : '',
+      formItemClass,
+      resolvedSchemaFormItemClass,
+    ]
+      .filter(Boolean)
+      .join(' '),
+    labelClass: [labelClass, normalizedSchema.labelClass]
+      .filter(Boolean)
+      .join(' '),
+    disabled: options.disabled ?? normalizedSchema.disabled ?? disabled,
+    hideLabel:
+      options.forceHideLabel ?? normalizedSchema.hideLabel ?? hideLabel,
+  } as NormalizedFormFieldSchema;
+}
+
+export function createArrayChildSchema(
+  schema: AnyFormSchema,
+  options: CreateArrayChildSchemaOptions,
+): NormalizedFormFieldSchema {
+  const rowPath = `${options.arrayField}[${options.index}]`;
+  const fieldName = resolveArrayChildFieldName(rowPath, schema.fieldName);
+  const baseContext: FormSchemaContext = {
+    arrayField: options.arrayField,
+    fieldName,
+    originalFieldName: schema.fieldName,
+    rowIndex: options.index,
+    rowPath,
+  };
+
+  return createFormFieldSchema(
+    {
+      ...schema,
+      componentProps: wrapComponentProps(schema.componentProps, baseContext),
+      dependencies: scopeDependencies(schema.dependencies, baseContext),
+      fieldName,
+      help: wrapCustomParamsRender(schema.help, baseContext),
+      renderComponentContent: wrapRenderComponentContent(
+        schema.renderComponentContent,
+        baseContext,
+      ),
+    },
+    {
+      commonConfig: wrapCommonConfig(options.commonConfig, baseContext),
+      disabled: options.disabled || schema.disabled,
+      forceHideLabel: true,
+      globalCommonConfig: wrapCommonConfig(
+        options.globalCommonConfig,
+        baseContext,
+      ),
+    },
+  );
+}
diff --git a/packages/@core/ui-kit/form-ui/src/form-runtime-field.ts b/packages/@core/ui-kit/form-ui/src/form-runtime-field.ts
new file mode 100644
index 00000000..1376ecac
--- /dev/null
+++ b/packages/@core/ui-kit/form-ui/src/form-runtime-field.ts
@@ -0,0 +1,77 @@
+import type { Component } from 'vue';
+
+import { defineComponent, h, markRaw, onUnmounted } from 'vue';
+
+type AsyncFieldValidator = (...args: any[]) => Promise<unknown> | unknown;
+
+export type FieldValidationInvalidator = () => void;
+
+const asyncValidatorKeys = [
+  'onBlurAsync',
+  'onChangeAsync',
+  'onDynamicAsync',
+  'onSubmitAsync',
+] as const;
+
+export function createRuntimeFieldComponent(
+  fieldComponent: Component,
+  registerInvalidator: (
+    fieldName: string,
+    invalidator: FieldValidationInvalidator,
+  ) => () => void,
+) {
+  return markRaw(
+    defineComponent({
+      inheritAttrs: false,
+      setup(_, { attrs, slots }) {
+        const fieldName = String(attrs.name ?? '');
+        let validationRunId = 0;
+        let cachedValidators: Record<string, any> | undefined;
+        let cachedWrappedValidators: Record<string, any> | undefined;
+        const unregisterInvalidator = registerInvalidator(fieldName, () => {
+          validationRunId += 1;
+        });
+        onUnmounted(unregisterInvalidator);
+
+        function wrapValidators(validators: Record<string, any>) {
+          if (validators === cachedValidators && cachedWrappedValidators) {
+            return cachedWrappedValidators;
+          }
+          const wrappedValidators = { ...validators };
+          for (const key of asyncValidatorKeys) {
+            const validator = validators[key] as
+              | AsyncFieldValidator
+              | undefined;
+            if (!validator) {
+              continue;
+            }
+            wrappedValidators[key] = async (...args: any[]) => {
+              const currentValidationRunId = ++validationRunId;
+              const result = await validator(...args);
+              return currentValidationRunId === validationRunId
+                ? result
+                : undefined;
+            };
+          }
+          cachedValidators = validators;
+          cachedWrappedValidators = wrappedValidators;
+          return wrappedValidators;
+        }
+
+        return () => {
+          const validators = attrs.validators as
+            | Record<string, any>
+            | undefined;
+          return h(
+            fieldComponent,
+            {
+              ...attrs,
+              ...(validators ? { validators: wrapValidators(validators) } : {}),
+            },
+            slots,
+          );
+        };
+      },
+    }),
+  );
+}
diff --git a/packages/@core/ui-kit/form-ui/src/form-runtime.ts b/packages/@core/ui-kit/form-ui/src/form-runtime.ts
new file mode 100644
index 00000000..8f20dabd
--- /dev/null
+++ b/packages/@core/ui-kit/form-ui/src/form-runtime.ts
@@ -0,0 +1,320 @@
+import type { FieldValidationInvalidator } from './form-runtime-field';
+import type {
+  FormActions,
+  FormFieldName,
+  FormFieldValue,
+  FormResetOptions,
+  FormRuntimeState,
+  FormValues,
+} from './types';
+
+import { computed, shallowRef } from 'vue';
+
+import { mergeWithArrayOverride } from '@vben-core/shared/utils';
+
+import { batch } from '@tanstack/store';
+import { useForm } from '@tanstack/vue-form';
+
+import { createRuntimeFieldComponent } from './form-runtime-field';
+
+function normalizeError(error: unknown): string | undefined {
+  if (typeof error === 'string') {
+    return error;
+  }
+  if (error && typeof error === 'object' && 'message' in error) {
+    const message = Reflect.get(error, 'message');
+    return typeof message === 'string' ? message : undefined;
+  }
+  return error === undefined || error === null ? undefined : String(error);
+}
+
+function normalizeFieldMetaError(meta: unknown) {
+  if (!meta || typeof meta !== 'object' || !('errors' in meta)) {
+    return undefined;
+  }
+  const errors = Reflect.get(meta, 'errors');
+  return normalizeError(Array.isArray(errors) ? errors[0] : undefined);
+}
+
+export function useFormRuntime<TValues extends FormValues>(
+  defaultValues: TValues,
+): FormActions<TValues> {
+  const rawForm = useForm({
+    defaultValues,
+    onSubmit: () => {},
+  });
+  const values = rawForm.useSelector((formState) => formState.values);
+  const fieldMeta = rawForm.useSelector((formState) => formState.fieldMeta);
+  const isDirty = rawForm.useSelector((formState) => formState.isDirty);
+  const isSubmitting = rawForm.useSelector(
+    (formState) => formState.isSubmitting,
+  );
+  const isValid = rawForm.useSelector((formState) => formState.isValid);
+  const isValidating = rawForm.useSelector(
+    (formState) => formState.isValidating,
+  );
+  const manualErrors = shallowRef(new Map<string, string>());
+  const validationInvalidators = new Map<
+    string,
+    Set<FieldValidationInvalidator>
+  >();
+
+  function registerValidationInvalidator(
+    fieldName: string,
+    invalidator: FieldValidationInvalidator,
+  ) {
+    let fieldInvalidators = validationInvalidators.get(fieldName);
+    if (!fieldInvalidators) {
+      fieldInvalidators = new Set();
+      validationInvalidators.set(fieldName, fieldInvalidators);
+    }
+    fieldInvalidators.add(invalidator);
+    return () => {
+      invalidator();
+      fieldInvalidators.delete(invalidator);
+      if (fieldInvalidators.size === 0) {
+        validationInvalidators.delete(fieldName);
+      }
+    };
+  }
+
+  function invalidateFieldValidation(fieldName: string) {
+    for (const invalidator of validationInvalidators.get(fieldName) ?? []) {
+      invalidator();
+    }
+  }
+
+  const RuntimeField = createRuntimeFieldComponent(
+    rawForm.Field,
+    registerValidationInvalidator,
+  );
+
+  function getErrors() {
+    const result: Record<string, string> = {};
+    for (const [fieldName, meta] of Object.entries(fieldMeta.value)) {
+      const error = normalizeFieldMetaError(meta);
+      if (error) {
+        result[fieldName] = error;
+      }
+    }
+    for (const [fieldName, error] of manualErrors.value) {
+      result[fieldName] = error;
+    }
+    return result;
+  }
+
+  const errors = computed(getErrors);
+  const meta = computed(() => ({
+    dirty: isDirty.value,
+    submitting: isSubmitting.value,
+    valid: isValid.value && manualErrors.value.size === 0,
+    validating: isValidating.value,
+  }));
+  const runtimeState = computed<FormRuntimeState<TValues>>(() => ({
+    errors: errors.value,
+    meta: meta.value,
+    values: values.value,
+  }));
+
+  function getFieldError(fieldName: string) {
+    return (
+      manualErrors.value.get(fieldName) ??
+      normalizeFieldMetaError(Reflect.get(fieldMeta.value, fieldName))
+    );
+  }
+
+  function useFieldError(fieldName: string) {
+    const schemaError = rawForm.useSelector((formState) =>
+      normalizeFieldMetaError(Reflect.get(formState.fieldMeta, fieldName)),
+    );
+    return computed(
+      () => manualErrors.value.get(fieldName) ?? schemaError.value,
+    );
+  }
+
+  function useFieldValue<TFieldName extends FormFieldName<TValues>>(
+    fieldName: TFieldName,
+  ) {
+    return rawForm.useSelector(
+      () =>
+        rawForm.getFieldValue(fieldName as never) as FormFieldValue<
+          TValues,
+          TFieldName
+        >,
+    );
+  }
+
+  function useFieldValues<TFieldName extends FormFieldName<TValues>>(
+    fieldNames: readonly TFieldName[],
+  ) {
+    const selectedValues = fieldNames.map((fieldName) =>
+      useFieldValue(fieldName),
+    );
+    return computed(() => selectedValues.map((value) => value.value));
+  }
+
+  async function validateField(fieldName: string) {
+    await rawForm.validateField(fieldName as never, 'submit');
+    const error = getFieldError(fieldName);
+    return {
+      errors: error ? { [fieldName]: error } : {},
+      valid: !error,
+    };
+  }
+
+  async function validate() {
+    await rawForm.validateAllFields('submit');
+    const errors = getErrors();
+    return {
+      errors,
+      valid: Object.keys(errors).length === 0,
+    };
+  }
+
+  function setFieldError(fieldName: string, error?: string) {
+    invalidateFieldValidation(fieldName);
+
+    const nextManualErrors = new Map(manualErrors.value);
+    if (error) {
+      nextManualErrors.set(fieldName, error);
+    } else {
+      nextManualErrors.delete(fieldName);
+    }
+    manualErrors.value = nextManualErrors;
+
+    if (error || !rawForm.getFieldMeta(fieldName as never)) {
+      return;
+    }
+    rawForm.setFieldMeta(fieldName as never, (meta) => ({
+      ...meta,
+      errorMap: {},
+    }));
+  }
+
+  function clearValidation(
+    fieldNames?: FormFieldName<TValues> | FormFieldName<TValues>[],
+  ) {
+    let requestedFieldNames: FormFieldName<TValues>[] | undefined;
+    if (Array.isArray(fieldNames)) {
+      requestedFieldNames = fieldNames;
+    } else if (fieldNames) {
+      requestedFieldNames = [fieldNames];
+    }
+    const targetFieldNames = requestedFieldNames ?? [
+      ...new Set([
+        ...validationInvalidators.keys(),
+        ...Object.keys(rawForm.getAllErrors().fields),
+        ...manualErrors.value.keys(),
+      ]),
+    ];
+
+    for (const fieldName of targetFieldNames) {
+      setFieldError(fieldName, undefined);
+    }
+  }
+
+  async function reset(
+    resetState?: { values?: Partial<TValues> },
+    options?: FormResetOptions,
+  ) {
+    for (const fieldName of validationInvalidators.keys()) {
+      invalidateFieldValidation(fieldName);
+    }
+    manualErrors.value = new Map();
+    const partialValues = resetState?.values;
+    let resetValues: TValues | undefined;
+    if (partialValues) {
+      resetValues = options?.force
+        ? (partialValues as TValues)
+        : (mergeWithArrayOverride(
+            partialValues,
+            rawForm.options.defaultValues ?? defaultValues,
+          ) as TValues);
+    }
+    rawForm.reset(resetValues, {
+      keepDefaultValues: options?.keepDefaultValues,
+    });
+  }
+
+  async function submit() {
+    await rawForm.handleSubmit();
+  }
+
+  const actions: FormActions<TValues> = {
+    clearValidation,
+    get errors() {
+      return errors.value;
+    },
+    fieldComponent: RuntimeField,
+    get meta() {
+      return meta.value;
+    },
+    get values() {
+      return values.value;
+    },
+    getFieldError,
+    getFieldValue(fieldName) {
+      return rawForm.getFieldValue(fieldName as never) as FormFieldValue<
+        TValues,
+        typeof fieldName
+      >;
+    },
+    handleSubmit(callback?) {
+      return async (event?: Event) => {
+        event?.preventDefault();
+        event?.stopPropagation();
+        const result = await validate();
+        if (result.valid) {
+          await callback?.(values.value as TValues);
+        }
+      };
+    },
+    isFieldValid(fieldName) {
+      return !getFieldError(fieldName);
+    },
+    pushFieldValue(fieldName, value) {
+      rawForm.pushFieldValue(fieldName as never, value as never);
+    },
+    async removeFieldValue(fieldName, index) {
+      await rawForm.removeFieldValue(fieldName as never, index);
+    },
+    reset,
+    resetForm: reset,
+    setFieldError,
+    async setFieldValue(fieldName, value, shouldValidate) {
+      rawForm.setFieldValue(fieldName as never, value as never, {
+        dontValidate: !shouldValidate,
+      });
+      if (shouldValidate) {
+        await validateField(fieldName);
+      }
+    },
+    async setValues(values, shouldValidate) {
+      batch(() => {
+        for (const [fieldName, value] of Object.entries(values)) {
+          rawForm.setFieldValue(fieldName as never, value as never, {
+            dontValidate: !shouldValidate,
+          });
+        }
+      });
+      if (shouldValidate) {
+        await validate();
+      }
+    },
+    submit,
+    submitForm: submit,
+    useSelector(selector) {
+      return computed(() => selector(runtimeState.value));
+    },
+    useFieldError,
+    useFieldValue,
+    useFieldValues,
+    useValues() {
+      return values;
+    },
+    validate,
+    validateField,
+  };
+
+  return actions;
+}
diff --git a/packages/@core/ui-kit/form-ui/src/form-value-transform.ts b/packages/@core/ui-kit/form-ui/src/form-value-transform.ts
new file mode 100644
index 00000000..1fa172cc
--- /dev/null
+++ b/packages/@core/ui-kit/form-ui/src/form-value-transform.ts
@@ -0,0 +1,226 @@
+import type {
+  ArrayToStringFields,
+  BaseFormComponentType,
+  FieldMappingTime,
+  FormSchema,
+  FormSchemaContext,
+  FormValues,
+} from './types';
+
+import { cloneDeep, formatDate, isFunction } from '@vben-core/shared/utils';
+
+import {
+  deleteValueByFieldName,
+  getValueByFieldName,
+  resolveValueFormatFieldName,
+  setValueByFieldName,
+} from './field-name';
+import {
+  getFormArraySchemaChildren,
+  resolveArrayChildFieldName,
+} from './form-render/schema';
+
+type AnyFormSchema<TValues extends FormValues> = FormSchema<
+  BaseFormComponentType,
+  Record<string, any>,
+  TValues
+>;
+
+function processFields(
+  fields: string[],
+  separator: string,
+  values: Record<string, any>,
+) {
+  for (const field of fields) {
+    const value = values[field];
+    if (value === undefined || value === null) {
+      continue;
+    }
+    if (Array.isArray(value)) {
+      values[field] = value.join(separator);
+      continue;
+    }
+    if (typeof value !== 'string') {
+      continue;
+    }
+    if (value === '') {
+      values[field] = [];
+      continue;
+    }
+    const escapedSeparator = separator.replaceAll(
+      /[.*+?^${}()|[\]\\]/g,
+      String.raw`\$&`,
+    );
+    values[field] = value.split(new RegExp(escapedSeparator));
+  }
+}
+
+function applyArrayToStringFields(
+  values: Record<string, any>,
+  arrayToStringFields?: ArrayToStringFields,
+) {
+  if (!arrayToStringFields || !Array.isArray(arrayToStringFields)) {
+    return;
+  }
+
+  if (arrayToStringFields.every((item) => typeof item === 'string')) {
+    const fieldsConfig = arrayToStringFields as string[];
+    const lastItem = fieldsConfig.at(-1) ?? '';
+    const hasSeparator = lastItem.length === 1;
+    const fields = hasSeparator ? fieldsConfig.slice(0, -1) : fieldsConfig;
+    processFields(fields, hasSeparator ? lastItem : ',', values);
+    return;
+  }
+
+  for (const fieldConfig of arrayToStringFields) {
+    if (!Array.isArray(fieldConfig)) {
+      continue;
+    }
+    const [fields, separator = ','] = fieldConfig;
+    if (!Array.isArray(fields)) {
+      console.warn(
+        `Invalid field configuration: fields should be an array of strings, got ${typeof fields}`,
+      );
+      continue;
+    }
+    processFields(fields, separator, values);
+  }
+}
+
+function applyRangeTimeFields(
+  values: Record<string, any>,
+  fieldMappingTime?: FieldMappingTime,
+) {
+  if (!fieldMappingTime || !Array.isArray(fieldMappingTime)) {
+    return;
+  }
+
+  for (const [
+    field,
+    [startTimeKey, endTimeKey],
+    format = 'YYYY-MM-DD',
+  ] of fieldMappingTime) {
+    if (startTimeKey && endTimeKey && values[field] === null) {
+      Reflect.deleteProperty(values, startTimeKey);
+      Reflect.deleteProperty(values, endTimeKey);
+    }
+    if (!values[field]) {
+      Reflect.deleteProperty(values, field);
+      continue;
+    }
+
+    const [startTime, endTime] = values[field];
+    if (format === null) {
+      values[startTimeKey] = startTime;
+      values[endTimeKey] = endTime;
+    } else if (isFunction(format)) {
+      values[startTimeKey] = format(startTime, startTimeKey);
+      values[endTimeKey] = format(endTime, endTimeKey);
+    } else {
+      const [startTimeFormat, endTimeFormat] = Array.isArray(format)
+        ? format
+        : [format, format];
+      values[startTimeKey] = startTime
+        ? formatDate(startTime, startTimeFormat)
+        : undefined;
+      values[endTimeKey] = endTime
+        ? formatDate(endTime, endTimeFormat)
+        : undefined;
+    }
+    Reflect.deleteProperty(values, field);
+  }
+}
+
+function applyValueFormatBySchemas<TValues extends FormValues>(
+  schemas: AnyFormSchema<TValues>[],
+  values: Record<string, any>,
+  parentPath?: string,
+  parentContext?: FormSchemaContext<TValues>,
+) {
+  for (const schema of schemas) {
+    const fieldName = parentPath
+      ? resolveArrayChildFieldName(parentPath, schema.fieldName)
+      : schema.fieldName;
+    const row =
+      parentPath && parentContext?.rowPath
+        ? getValueByFieldName(values, parentContext.rowPath)
+        : parentContext?.row;
+    const schemaContext: FormSchemaContext<TValues> = {
+      ...parentContext,
+      fieldName,
+      originalFieldName: schema.fieldName,
+      rootValues: values as TValues,
+      row,
+    };
+
+    const children = getFormArraySchemaChildren<AnyFormSchema<TValues>>(schema);
+    if (children.length > 0) {
+      const arrayValue = getValueByFieldName(values, fieldName);
+      if (Array.isArray(arrayValue)) {
+        arrayValue.forEach((rowValue, index) => {
+          const rowPath = `${fieldName}[${index}]`;
+          applyValueFormatBySchemas(children, values, rowPath, {
+            arrayField: fieldName,
+            row: rowValue,
+            rowIndex: index,
+            rowPath,
+          });
+        });
+      }
+    }
+
+    if (!schema.valueFormat) {
+      continue;
+    }
+    const value = getValueByFieldName(values, fieldName);
+    deleteValueByFieldName(values, fieldName);
+    const formattedValue = schema.valueFormat(
+      value,
+      (key, nextValue) => {
+        setValueByFieldName(
+          values,
+          resolveValueFormatFieldName(key, parentPath),
+          nextValue,
+        );
+      },
+      values as TValues,
+      schemaContext,
+    );
+    if (formattedValue !== undefined) {
+      setValueByFieldName(values, fieldName, formattedValue);
+    }
+  }
+}
+
+export function applyFormValueFormats<TValues extends FormValues>(
+  originValues: Record<string, any>,
+  schemas: AnyFormSchema<TValues>[],
+) {
+  const values = cloneDeep(originValues);
+  applyValueFormatBySchemas(schemas, values);
+  return values;
+}
+
+export function formatFormValues<TValues extends FormValues>(
+  originValues: Readonly<Record<string, any>>,
+  schemas: AnyFormSchema<TValues>[],
+  fieldMappingTime?: FieldMappingTime,
+  arrayToStringFields?: ArrayToStringFields,
+) {
+  const values = cloneDeep(originValues);
+  applyArrayToStringFields(values, arrayToStringFields);
+  applyRangeTimeFields(values, fieldMappingTime);
+  applyValueFormatBySchemas(schemas, values);
+  return values;
+}
+
+export function transformRangeTimeValues(
+  originValues: Record<string, any>,
+  fieldMappingTime?: FieldMappingTime,
+  arrayToStringFields?: ArrayToStringFields,
+) {
+  const values = cloneDeep(originValues);
+  applyArrayToStringFields(values, arrayToStringFields);
+  applyRangeTimeFields(values, fieldMappingTime);
+  return values;
+}
diff --git a/packages/@core/ui-kit/form-ui/src/index.ts b/packages/@core/ui-kit/form-ui/src/index.ts
index 67ed4a50..db7b7e9d 100644
--- a/packages/@core/ui-kit/form-ui/src/index.ts
+++ b/packages/@core/ui-kit/form-ui/src/index.ts
@@ -1,10 +1,27 @@
 export { setupVbenForm } from './config';
+export { FormCodecError } from './form-codec';
+
+export type { FormCodecPhase } from './form-codec';
 
 export type {
   BaseFormComponentType,
   ExtendedFormApi,
-  FormSchema as VbenFormSchema,
+  FormActions,
+  FormCodec,
+  FormContextApi,
+  FormLayout,
+  FormSchemaContext,
+  FormValues,
+  FormValueSnapshot,
+  VbenFormActionSlotProps,
+  VbenFormComponent,
+  VbenFormDefaultSlotProps,
+  VbenFormFieldArrayProps,
+  VbenFormFieldSlotProps,
   VbenFormProps,
+  VbenFormResolvedComponentProps,
+  FormSchema as VbenFormSchema,
+  VbenFormSlots,
 } from './types';
 
 export * from './use-vben-form';
diff --git a/packages/@core/ui-kit/form-ui/src/rule-registry.ts b/packages/@core/ui-kit/form-ui/src/rule-registry.ts
new file mode 100644
index 00000000..f85854e2
--- /dev/null
+++ b/packages/@core/ui-kit/form-ui/src/rule-registry.ts
@@ -0,0 +1,17 @@
+import type { FormRuleValidator } from './types';
+
+const FORM_RULES = new Map<string, FormRuleValidator>();
+
+export function getFormRule(name: string) {
+  return FORM_RULES.get(name);
+}
+
+export function registerFormRules(
+  rules: Partial<Record<string, FormRuleValidator>>,
+) {
+  for (const [name, validator] of Object.entries(rules)) {
+    if (validator) {
+      FORM_RULES.set(name, validator);
+    }
+  }
+}
diff --git a/packages/@core/ui-kit/form-ui/src/types.ts b/packages/@core/ui-kit/form-ui/src/types.ts
index f3ba3eba..6272435b 100644
--- a/packages/@core/ui-kit/form-ui/src/types.ts
+++ b/packages/@core/ui-kit/form-ui/src/types.ts
@@ -1,25 +1,47 @@
-import type { VbenButtonProps } from '@vben-core/shadcn-ui';
-import type { ClassType } from '@vben-core/typings';
-import type { FieldOptions, FormContext, GenericObject } from 'vee-validate';
-import type { ZodTypeAny } from 'zod';
-
-import type { FormApi } from './form-api';
+import type { ZodType } from 'zod';
 
 import type { Component, HtmlHTMLAttributes, Ref } from 'vue';
 
-export type FormLayout = 'horizontal' | 'vertical';
+import type { VbenButtonProps } from '@vben-core/shadcn-ui';
+import type { ClassType, MaybeComputedRef } from '@vben-core/typings';
+
+import type { FormApi } from './form-api';
+
+export type FormValues = Record<string, any>;
+
+export interface FormCodec<
+  TFormValues extends FormValues = FormValues,
+  TSubmitValues extends FormValues = TFormValues,
+> {
+  /** 将提交值转换为表单组件值。 */
+  decode: (values: Readonly<TSubmitValues>) => TFormValues;
+  /** 将表单组件值转换为提交值。 */
+  encode: (values: Readonly<TFormValues>) => TSubmitValues;
+}
+
+export type FormFieldName<TValues extends FormValues = FormValues> =
+  | Extract<keyof TValues, string>
+  | (Record<never, never> & string);
+
+export type FormFieldValue<
+  TValues extends FormValues,
+  TFieldName extends string,
+> = TFieldName extends keyof TValues ? TValues[TFieldName] : unknown;
+
+export type FormLayout = 'horizontal' | 'inline' | 'vertical';
 
 export type BaseFormComponentType =
   | 'DefaultButton'
   | 'PrimaryButton'
   | 'VbenCheckbox'
+  | 'VbenFormFieldArray'
   | 'VbenInput'
   | 'VbenInputPassword'
   | 'VbenPinInput'
   | 'VbenSelect'
   | (Record<never, never> & string);
 
-type Breakpoints = '' | '2xl:' | '3xl:' | 'lg:' | 'md:' | 'sm:' | 'xl:';
+type Breakpoints = '2xl:' | '3xl:' | '' | 'lg:' | 'md:' | 'sm:' | 'xl:';
 
 type GridCols = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13;
 
@@ -34,14 +56,12 @@ export type FormItemClassType =
   | (Record<never, never> & string)
   | WrapperClassType;
 
-export type FormFieldOptions = Partial<
-  {
-    validateOnBlur?: boolean;
-    validateOnChange?: boolean;
-    validateOnInput?: boolean;
-    validateOnModelUpdate?: boolean;
-  } & FieldOptions
->;
+export interface FormFieldOptions {
+  asyncDebounceMs?: number;
+  validateOn?: readonly FormValidationTrigger[];
+}
+
+export type FormValidationTrigger = 'blur' | 'change';
 
 export interface FormShape {
   /** 默认值 */
@@ -50,7 +70,33 @@ export interface FormShape {
   fieldName: string;
   /** 是否必填 */
   required?: boolean;
-  rules?: ZodTypeAny;
+  rules?: ZodType;
+}
+
+export interface FormRuntimeField<TValue = unknown> {
+  handleBlur: () => void;
+  handleChange: (value: TValue) => void;
+  state: {
+    meta: {
+      errors: unknown[];
+      isDirty: boolean;
+      isTouched: boolean;
+      isValid: boolean;
+    };
+    value: TValue;
+  };
+}
+
+export interface FormComponentField<
+  TValue = unknown,
+  TFieldName extends string = string,
+> {
+  modelValue: TValue;
+  name: TFieldName;
+  onBlur: () => void;
+  onChange: (value: TValue) => void;
+  onInput: (value: TValue) => void;
+  'onUpdate:modelValue': (value: TValue) => void;
 }
 
 export type MaybeComponentPropKey =
@@ -62,80 +108,394 @@ export type MaybeComponentPropKey =
 
 export type MaybeComponentProps = { [K in MaybeComponentPropKey]?: any };
 
-export type FormActions = FormContext<GenericObject>;
+export interface FormMeta {
+  dirty: boolean;
+  submitting: boolean;
+  valid: boolean;
+  validating: boolean;
+}
+
+export interface FormRuntimeState<TValues extends FormValues = FormValues> {
+  errors: Record<string, string>;
+  meta: FormMeta;
+  values: TValues;
+}
+
+export interface FormValidationResult {
+  errors: Record<string, string>;
+  valid: boolean;
+}
+
+export interface FormValueSnapshot<
+  TFormValues extends FormValues = FormValues,
+  TSubmitValues extends FormValues = TFormValues,
+> {
+  rawValues: Readonly<TFormValues>;
+  values: TSubmitValues;
+}
+
+export interface FormResetState<TValues extends FormValues = FormValues> {
+  values?: Partial<TValues>;
+}
+
+export interface FormResetOptions {
+  force?: boolean;
+  keepDefaultValues?: boolean;
+}
+
+export interface FormContextApi<TValues extends FormValues = FormValues> {
+  clearValidation: (
+    fieldNames?: FormFieldName<TValues> | FormFieldName<TValues>[],
+  ) => void;
+  readonly errors: Record<string, string>;
+  readonly fieldComponent: Component;
+  getFieldError: (fieldName: string) => string | undefined;
+  getFieldValue: <TFieldName extends FormFieldName<TValues>>(
+    fieldName: TFieldName,
+  ) => FormFieldValue<TValues, TFieldName>;
+  handleSubmit: (
+    callback?: (values: TValues) => Promise<void> | void,
+  ) => (event?: Event) => Promise<void>;
+  isFieldValid: (fieldName: string) => boolean;
+  readonly meta: FormMeta;
+  pushFieldValue: (fieldName: string, value: any) => void;
+  removeFieldValue: (fieldName: string, index: number) => Promise<void>;
+  reset: (
+    state?: FormResetState<TValues>,
+    options?: FormResetOptions,
+  ) => Promise<void>;
+  /** @deprecated Use `reset` instead. */
+  resetForm: (
+    state?: FormResetState<TValues>,
+    options?: FormResetOptions,
+  ) => Promise<void>;
+  setFieldError: (fieldName: string, error?: string) => void;
+  setFieldValue: <TFieldName extends FormFieldName<TValues>>(
+    fieldName: TFieldName,
+    value: FormFieldValue<TValues, NoInfer<TFieldName>>,
+    shouldValidate?: boolean,
+  ) => Promise<void>;
+  setValues: (
+    values: Partial<TValues>,
+    shouldValidate?: boolean,
+  ) => Promise<void>;
+  submit: () => Promise<void>;
+  /** @deprecated Use `submit` instead. */
+  submitForm: () => Promise<void>;
+  useFieldError: (fieldName: string) => Readonly<Ref<string | undefined>>;
+  useFieldValue: <TFieldName extends FormFieldName<TValues>>(
+    fieldName: TFieldName,
+  ) => Readonly<Ref<FormFieldValue<TValues, TFieldName>>>;
+  useFieldValues: <TFieldName extends FormFieldName<TValues>>(
+    fieldNames: readonly TFieldName[],
+  ) => Readonly<Ref<FormFieldValue<TValues, TFieldName>[]>>;
+  useSelector: <T>(
+    selector: (state: FormRuntimeState<TValues>) => T,
+  ) => Readonly<Ref<T>>;
+  useValues: () => Readonly<Ref<TValues>>;
+  validate: () => Promise<FormValidationResult>;
+  validateField: (fieldName: string) => Promise<FormValidationResult>;
+  readonly values: TValues;
+}
+
+/** @deprecated Use `FormContextApi` instead. */
+export type FormActions<TValues extends FormValues = FormValues> =
+  FormContextApi<TValues>;
+
+type ReservedFormSlotName =
+  | 'default'
+  | 'expand-after'
+  | 'expand-before'
+  | 'reset-before'
+  | 'submit-before';
+
+type KnownFormFieldName<TValues extends FormValues> =
+  string extends Extract<keyof TValues, string>
+    ? never
+    : Exclude<Extract<keyof TValues, string>, ReservedFormSlotName>;
+
+export interface VbenFormActionSlotProps<
+  TValues extends FormValues = FormValues,
+  T extends BaseFormComponentType = BaseFormComponentType,
+  P extends Record<string, any> = Record<never, never>,
+  TSubmitValues extends FormValues = TValues,
+> {
+  formApi: ExtendedFormApi<TValues, T, P, TSubmitValues>;
+  values: TValues;
+}
+
+export interface VbenFormDefaultSlotProps<
+  TValues extends FormValues = FormValues,
+  T extends BaseFormComponentType = BaseFormComponentType,
+  P extends Record<string, any> = Record<never, never>,
+  TSubmitValues extends FormValues = TValues,
+> extends VbenFormActionSlotProps<TValues, T, P, TSubmitValues> {
+  shapes: FormShape[];
+}
+
+export interface VbenFormFieldSlotProps<
+  TValues extends FormValues = FormValues,
+  TFieldName extends FormFieldName<TValues> = FormFieldName<TValues>,
+  T extends BaseFormComponentType = BaseFormComponentType,
+  P extends Record<string, any> = Record<never, never>,
+  TSubmitValues extends FormValues = TValues,
+> extends VbenFormActionSlotProps<TValues, T, P, TSubmitValues> {
+  componentField: FormComponentField<
+    FormFieldValue<TValues, TFieldName>,
+    TFieldName
+  >;
+  componentProps: VbenFormResolvedComponentProps<
+    FormFieldValue<TValues, TFieldName>,
+    TFieldName
+  >;
+  disabled: boolean;
+  field: FormRuntimeField<FormFieldValue<TValues, TFieldName>>;
+  isInValid: boolean;
+  modelValue: FormFieldValue<TValues, TFieldName>;
+  name: TFieldName;
+}
+
+export type VbenFormResolvedComponentProps<
+  TValue = unknown,
+  TFieldName extends string = string,
+> = MaybeComponentProps & {
+  disabled: boolean;
+  modelValue?: TValue;
+  name: TFieldName;
+  'onUpdate:modelValue'?: (value: TValue) => void;
+};
+
+type VbenFormFieldSlots<
+  TValues extends FormValues,
+  T extends BaseFormComponentType,
+  P extends Record<string, any>,
+  TSubmitValues extends FormValues,
+> =
+  string extends Extract<keyof TValues, string>
+    ? Record<
+        string,
+        | ((
+            props: VbenFormFieldSlotProps<
+              TValues,
+              FormFieldName<TValues>,
+              T,
+              P,
+              TSubmitValues
+            >,
+          ) => any)
+        | undefined
+      >
+    : {
+        [TFieldName in KnownFormFieldName<TValues>]?: (
+          props: VbenFormFieldSlotProps<
+            TValues,
+            TFieldName,
+            T,
+            P,
+            TSubmitValues
+          >,
+        ) => any;
+      };
+
+export type VbenFormSlots<
+  TValues extends FormValues = FormValues,
+  T extends BaseFormComponentType = BaseFormComponentType,
+  P extends Record<string, any> = Record<never, never>,
+  TSubmitValues extends FormValues = TValues,
+> = VbenFormFieldSlots<TValues, T, P, TSubmitValues> & {
+  default?: (
+    props: VbenFormDefaultSlotProps<TValues, T, P, TSubmitValues>,
+  ) => any;
+  'expand-after'?: (
+    props: VbenFormActionSlotProps<TValues, T, P, TSubmitValues>,
+  ) => any;
+  'expand-before'?: (
+    props: VbenFormActionSlotProps<TValues, T, P, TSubmitValues>,
+  ) => any;
+  'reset-before'?: (
+    props: VbenFormActionSlotProps<TValues, T, P, TSubmitValues>,
+  ) => any;
+  'submit-before'?: (
+    props: VbenFormActionSlotProps<TValues, T, P, TSubmitValues>,
+  ) => any;
+};
+
+export type VbenFormComponent<
+  TValues extends FormValues = FormValues,
+  T extends BaseFormComponentType = BaseFormComponentType,
+  P extends Record<string, any> = Record<never, never>,
+  TSubmitValues extends FormValues = TValues,
+> = new () => {
+  $props: VbenFormProps<T, P, TValues, TSubmitValues>;
+  $slots: VbenFormSlots<TValues, T, P, TSubmitValues>;
+};
+
+export interface FormSchemaContext<TValues extends FormValues = FormValues> {
+  /** 数组字段名，例如 contacts */
+  arrayField?: string;
+  /** 当前真实字段名，例如 contacts[0].name */
+  fieldName?: string;
+  /** 原始 schema 字段名，例如 name */
+  originalFieldName?: string;
+  /** 表单完整值 */
+  rootValues?: TValues;
+  /** 当前行数据 */
+  row?: Record<string, any>;
+  /** 当前行索引 */
+  rowIndex?: number;
+  /** 当前行路径，例如 contacts[0] */
+  rowPath?: string;
+}
 
 export type CustomRenderType = (() => Component | string) | string;
 
+// 动态渲染参数
+export type CustomParamsRenderType<TValues extends FormValues = FormValues> =
+  | ((ctx: FormSchemaContext<TValues>) => Component | string)
+  | string;
+
 export type FormSchemaRuleType =
   | 'required'
   | 'selectRequired'
   | null
   | (Record<never, never> & string)
-  | ZodTypeAny;
+  | ZodType;
 
-type FormItemDependenciesCondition<T = boolean | PromiseLike<boolean>> = (
-  value: Partial<Record<string, any>>,
-  actions: FormActions,
-) => T;
+type FormItemDependenciesCondition<
+  TValues extends FormValues,
+  TResult = boolean | PromiseLike<boolean>,
+> = (
+  value: Partial<TValues>,
+  actions: FormActions<TValues>,
+  controller: ExtendedFormApi<TValues>, // 在 dependencies 里提供访问extendApi的能力
+  ctx?: FormSchemaContext<TValues>,
+) => TResult;
 
-type FormItemDependenciesConditionWithRules = (
-  value: Partial<Record<string, any>>,
-  actions: FormActions,
+type FormItemDependenciesConditionWithRules<TValues extends FormValues> = (
+  value: Partial<TValues>,
+  actions: FormActions<TValues>,
+  controller: ExtendedFormApi<TValues>, // 在 dependencies 里提供访问extendApi的能力
+  ctx?: FormSchemaContext<TValues>,
 ) => FormSchemaRuleType | PromiseLike<FormSchemaRuleType>;
 
-type FormItemDependenciesConditionWithProps = (
-  value: Partial<Record<string, any>>,
-  actions: FormActions,
+type FormItemDependenciesConditionWithProps<TValues extends FormValues> = (
+  value: Partial<TValues>,
+  actions: FormActions<TValues>,
+  controller: ExtendedFormApi<TValues>, // 在 dependencies 里提供访问extendApi的能力
+  ctx?: FormSchemaContext<TValues>,
 ) => MaybeComponentProps | PromiseLike<MaybeComponentProps>;
 
-export interface FormItemDependencies {
-  /**
-   * 组件参数
-   * @returns 组件参数
-   */
-  componentProps?: FormItemDependenciesConditionWithProps;
-  /**
-   * 是否禁用
-   * @returns 是否禁用
-   */
-  disabled?: boolean | FormItemDependenciesCondition;
-  /**
-   * 是否渲染（删除dom）
-   * @returns 是否渲染
-   */
-  if?: boolean | FormItemDependenciesCondition;
-  /**
-   * 是否必填
-   * @returns 是否必填
-   */
-  required?: FormItemDependenciesCondition;
-  /**
-   * 字段规则
-   */
-  rules?: FormItemDependenciesConditionWithRules;
-  /**
-   * 是否隐藏(Css)
-   * @returns 是否隐藏
-   */
-  show?: boolean | FormItemDependenciesCondition;
-  /**
-   * 任意触发都会执行
-   */
-  trigger?: FormItemDependenciesCondition<void>;
+interface FormItemDependenciesBase {
   /**
    * 触发字段
    */
   triggerFields: string[];
 }
 
-type ComponentProps =
-  | ((
-      value: Partial<Record<string, any>>,
-      actions: FormActions,
-    ) => MaybeComponentProps)
+export interface FormDependenciesResolveContext<
+  TValues extends FormValues = FormValues,
+> {
+  actions: FormActions<TValues>;
+  controller: ExtendedFormApi<TValues>;
+  schema: FormSchemaContext<TValues>;
+  values: Readonly<TValues>;
+}
+
+export interface FormDependenciesResolvedState {
+  componentProps?: MaybeComponentProps;
+  disabled?: boolean;
+  help?: CustomRenderType;
+  if?: boolean;
+  renderComponentContent?: Record<string, any>;
+  required?: boolean;
+  rules?: FormSchemaRuleType;
+  show?: boolean;
+}
+
+export interface FormItemDependenciesLegacy<
+  TValues extends FormValues = FormValues,
+> extends FormItemDependenciesBase {
+  /**
+   * 组件参数
+   * @returns 组件参数
+   * @deprecated Use `dependencies.resolve` instead.
+   */
+  componentProps?: FormItemDependenciesConditionWithProps<TValues>;
+  /**
+   * 是否禁用
+   * @returns 是否禁用
+   * @deprecated Use `dependencies.resolve` instead.
+   */
+  disabled?: boolean | FormItemDependenciesCondition<TValues>;
+  /**
+   * 是否渲染（删除dom）
+   * @returns 是否渲染
+   * @deprecated Use `dependencies.resolve` instead.
+   */
+  if?: boolean | FormItemDependenciesCondition<TValues>;
+  /**
+   * 是否必填
+   * @returns 是否必填
+   * @deprecated Use `dependencies.resolve` instead.
+   */
+  required?: FormItemDependenciesCondition<TValues>;
+  resolve?: never;
+  /**
+   * 字段规则
+   * @deprecated Use `dependencies.resolve` instead.
+   */
+  rules?: FormItemDependenciesConditionWithRules<TValues>;
+  /**
+   * 是否隐藏(Css)
+   * @returns 是否隐藏
+   * @deprecated Use `dependencies.resolve` instead.
+   */
+  show?: boolean | FormItemDependenciesCondition<TValues>;
+  /**
+   * 任意触发都会执行
+   * @deprecated Use `dependencies.resolve` instead.
+   */
+  trigger?: FormItemDependenciesCondition<TValues, void>;
+}
+
+export interface FormItemDependenciesResolve<
+  TValues extends FormValues = FormValues,
+> extends FormItemDependenciesBase {
+  componentProps?: never;
+  disabled?: never;
+  if?: never;
+  required?: never;
+  resolve: (
+    context: FormDependenciesResolveContext<TValues>,
+  ) =>
+    | FormDependenciesResolvedState
+    | PromiseLike<FormDependenciesResolvedState | undefined>
+    | undefined;
+  rules?: never;
+  show?: never;
+  trigger?: never;
+}
+
+export type FormItemDependencies<TValues extends FormValues = FormValues> =
+  | FormItemDependenciesLegacy<TValues>
+  | FormItemDependenciesResolve<TValues>;
+
+type ComponentProps<TValues extends FormValues = FormValues> =
+  | ((ctx: FormSchemaContext<TValues>) => MaybeComponentProps)
   | MaybeComponentProps;
 
-export interface FormCommonConfig {
+export interface FormCommonConfig<TValues extends FormValues = FormValues> {
+  /**
+   * 是否启用 change 事件兼容回退。
+   * 仅当组件不发送 update:*、只发送 change 时启用。
+   * @default false
+   */
+  changeEventFallback?: boolean;
+  /**
+   * 是否可折叠的
+   * @default false
+   */
+  collapsible?: boolean;
   /**
    * 在Label后显示一个冒号
    */
@@ -143,26 +503,21 @@ export interface FormCommonConfig {
   /**
    * 所有表单项的props
    */
-  componentProps?: ComponentProps;
+  componentProps?: ComponentProps<TValues>;
   /**
    * 所有表单项的控件样式
    */
   controlClass?: string;
+  /**
+   * 默认折叠
+   * @default false
+   */
+  defaultCollapsed?: boolean;
   /**
    * 所有表单项的禁用状态
    * @default false
    */
   disabled?: boolean;
-  /**
-   * 是否禁用所有表单项的change事件监听
-   * @default true
-   */
-  disabledOnChangeListener?: boolean;
-  /**
-   * 是否禁用所有表单项的input事件监听
-   * @default true
-   */
-  disabledOnInputListener?: boolean;
   /**
    * 所有表单项的空状态值,默认都是undefined，naive-ui的空状态值是null
    */
@@ -173,10 +528,10 @@ export interface FormCommonConfig {
    */
   formFieldProps?: FormFieldOptions;
   /**
-   * 所有表单项的栅格布局
+   * 所有表单项的栅格布局，支持函数形式
    * @default ""
    */
-  formItemClass?: string;
+  formItemClass?: (() => string) | string;
   /**
    * 隐藏所有表单项label
    * @default false
@@ -196,67 +551,215 @@ export interface FormCommonConfig {
    * 所有表单项的label宽度
    */
   labelWidth?: number;
+  /**
+   * 所有表单项的model属性名
+   * @default "modelValue"
+   */
+  modelPropName?: string;
   /**
    * 所有表单项的wrapper样式
    */
   wrapperClass?: string;
 }
 
-type RenderComponentContentType = (
-  value: Partial<Record<string, any>>,
-  api: FormActions,
+type RenderComponentContentType<TValues extends FormValues = FormValues> = (
+  ctx: FormSchemaContext<TValues>,
 ) => Record<string, any>;
 
-export type HandleSubmitFn = (
-  values: Record<string, any>,
-) => Promise<void> | void;
+type MappedComponentProps<P, TValues extends FormValues = FormValues> =
+  | ((ctx: FormSchemaContext<TValues>) => P & Record<string, any>)
+  | (P & Record<string, any>);
 
-export type HandleResetFn = (
-  values: Record<string, any>,
-) => Promise<void> | void;
+/**
+ * 格式化 `getValues()` 输出中的当前字段值。
+ * - 返回 `undefined`：保留当前字段已被移除的状态，通常配合 `setValue(key, nextValue)`
+ *   把一个字段拆分写入到其他字段，例如 `startTime` / `endTime`
+ * - 返回其他值：会将当前字段恢复/写回为该返回值
+ * - `setValue` 回调签名为 `(key, nextValue) => void`
+ * @deprecated Use the form-level `codec` instead.
+ */
+export type FormValueFormat<TValues extends FormValues = FormValues> = (
+  value: any,
+  setValue: (fieldName: string, value: any) => void,
+  values: TValues,
+  ctx?: FormSchemaContext<TValues>,
+) => any;
 
-export type FieldMappingTime = [
-  string,
-  [string, string],
-  ([string, string] | string)?,
-][];
-
-export interface FormSchema<
-  T extends BaseFormComponentType = BaseFormComponentType,
-> extends FormCommonConfig {
-  /** 组件 */
-  component: Component | T;
-  /** 组件参数 */
-  componentProps?: ComponentProps;
+interface FormSchemaBody<TValues extends FormValues = FormValues> extends Omit<
+  FormCommonConfig<TValues>,
+  'componentProps'
+> {
   /** 默认值 */
   defaultValue?: any;
   /** 依赖 */
-  dependencies?: FormItemDependencies;
+  dependencies?: FormItemDependencies<TValues>;
   /** 描述 */
-  description?: string;
+  description?: CustomRenderType;
   /** 字段名 */
   fieldName: string;
   /** 帮助信息 */
-  help?: string;
+  help?: CustomParamsRenderType<TValues>;
+  /** 是否隐藏表单项 */
+  hide?: boolean;
   /** 表单项 */
-  label?: string;
+  label?: CustomRenderType;
   // 自定义组件内部渲染
-  renderComponentContent?: RenderComponentContentType;
+  renderComponentContent?: RenderComponentContentType<TValues>;
   /** 字段规则 */
   rules?: FormSchemaRuleType;
   /** 后缀 */
   suffix?: CustomRenderType;
+  /**
+   * 获取表单值时格式化当前字段。
+   * - 返回值不为 `undefined` 时，会回写到当前 fieldName
+   * - 返回值为 `undefined` 时，可通过 setValue 写入一个或多个目标字段
+   * @deprecated Use the form-level `codec` instead.
+   */
+  valueFormat?: FormValueFormat<TValues>;
 }
 
-export interface FormFieldProps extends FormSchema {
-  required?: boolean;
+type FormSchemaDiscriminated<
+  T extends BaseFormComponentType,
+  P extends Record<string, any>,
+  TValues extends FormValues,
+> = {
+  [K in Extract<keyof P, T>]: {
+    /** 组件 */
+    component: K;
+    /** 组件参数 */
+    componentProps?: MappedComponentProps<P[K], TValues>;
+  } & FormSchemaBody<TValues>;
+}[Extract<keyof P, T>];
+
+type FormSchemaFallback<
+  T extends BaseFormComponentType,
+  TValues extends FormValues,
+> = {
+  /** 组件 */
+  component: Component | T;
+  /** 组件参数 */
+  componentProps?: ComponentProps<TValues>;
+} & FormSchemaBody<TValues>;
+
+type FormArraySchema<
+  T extends BaseFormComponentType,
+  P extends Record<string, any>,
+  TValues extends FormValues,
+> = {
+  /** 内置数组编辑器参数 */
+  arrayProps?: Omit<
+    VbenFormFieldArrayProps<T, P, TValues>,
+    'disabled' | 'globalCommonConfig' | 'name' | 'schema'
+  >;
+  /** 数组子字段定义 */
+  children: FormSchema<T, P, TValues>[];
+  /** 兼容显式指定内置数组编辑器 */
+  component?: Component | T;
+  /** 兼容通过 componentProps 传递数组编辑器参数 */
+  componentProps?: ComponentProps<TValues>;
+  /** 数组字段标记 */
+  type: 'array';
+} & FormSchemaBody<TValues>;
+
+export type FormSchema<
+  T extends BaseFormComponentType = BaseFormComponentType,
+  P extends Record<string, any> = Record<never, never>,
+  TValues extends FormValues = FormValues,
+> =
+  | FormArraySchema<T, P, TValues>
+  | FormSchemaDiscriminated<T, P, TValues>
+  | FormSchemaFallback<T, TValues>;
+
+/**
+ * 数组编辑器（VbenFormFieldArray）的组件参数
+ */
+export interface VbenFormFieldArrayProps<
+  T extends BaseFormComponentType = BaseFormComponentType,
+  P extends Record<string, any> = Record<never, never>,
+  TValues extends FormValues = FormValues,
+> {
+  /** 操作列表头文案 */
+  actionText?: string;
+  /** 「添加」按钮文案 */
+  addButtonText?: string;
+  /** 子字段通用配置 */
+  commonConfig?: FormCommonConfig<TValues>;
+  /** 新增一行时生成的默认数据；缺省时按列定义的 fieldName 生成空对象 */
+  createRow?: () => Record<string, any>;
+  disabled?: boolean;
+  /** 空数据文案 */
+  emptyText?: string;
+  /** 子字段全局通用配置 */
+  globalCommonConfig?: FormCommonConfig<TValues>;
+  /** 最多行数 */
+  max?: number;
+  /** 最少行数 */
+  min?: number;
+  /** 数组字段路径，由外层 FormField 透传 */
+  name?: string;
+  /** 列定义，每一列是一个子字段（复用 FormSchema） */
+  schema?: FormSchema<T, P, TValues>[];
+  /** 是否显示序号列 */
+  showIndex?: boolean;
+}
+
+export type HandleSubmitFn<
+  TFormValues extends FormValues = FormValues,
+  TSubmitValues extends FormValues = TFormValues,
+> = (
+  values: NoInfer<TSubmitValues>,
+  rawValues: Readonly<TFormValues>,
+) => Promise<void> | void;
+
+export type HandleResetFn<TSubmitValues extends FormValues = FormValues> = (
+  values: TSubmitValues,
+) => Promise<void> | void;
+
+/** @deprecated Use the form-level `codec` instead. */
+export type FieldMappingTimeItem = [
+  string,
+  [string, string],
+  (
+    | ((value: any, fieldName: string) => any)
+    | [string, string]
+    | null
+    | string
+  )?,
+];
+
+/** @deprecated Use the form-level `codec` instead. */
+export type FieldMappingTime = FieldMappingTimeItem[];
+
+/** @deprecated Use the form-level `codec` instead. */
+export type ArrayToStringFields = Array<
+  | [string[], string?] // 嵌套数组格式，可选分隔符
+  | string // 单个字段，使用默认分隔符
+  | string[] // 简单数组格式，最后一个元素可以是分隔符
+>;
+
+export interface FormFieldProps<
+  T extends BaseFormComponentType = BaseFormComponentType,
+  TValues extends FormValues = FormValues,
+> extends FormSchemaBody<TValues> {
+  /** 组件 */
+  component: Component | T;
+  /** 组件参数 */
+  componentProps?: ComponentProps<TValues>;
 }
 
 export interface FormRenderProps<
   T extends BaseFormComponentType = BaseFormComponentType,
+  P extends Record<string, any> = Record<never, never>,
+  TValues extends FormValues = FormValues,
 > {
   /**
-   * 是否展开，在showCollapseButton=true下生效
+   * 表单字段数组映射字符串配置 默认使用","
+   * @deprecated Use the form-level `codec` instead.
+   */
+  arrayToStringFields?: ArrayToStringFields;
+  /**
+   * 是否折叠，在showCollapseButton=true下生效
+   * true:折叠 false:展开
    */
   collapsed?: boolean;
   /**
@@ -272,7 +775,7 @@ export interface FormRenderProps<
   /**
    * 表单项通用后备配置，当子项目没配置时使用这里的配置，子项目配置优先级高于此配置
    */
-  commonConfig?: FormCommonConfig;
+  commonConfig?: FormCommonConfig<TValues>;
   /**
    * 紧凑模式（移除表单每一项底部为校验信息预留的空间）
    */
@@ -285,10 +788,15 @@ export interface FormRenderProps<
    * 组件集合
    */
   componentMap: Record<BaseFormComponentType, Component>;
+  /**
+   * 表单字段映射到时间格式
+   * @deprecated Use the form-level `codec` instead.
+   */
+  fieldMappingTime?: FieldMappingTime;
   /**
    * 表单实例
    */
-  form?: FormContext<GenericObject>;
+  form?: FormActions<TValues>;
   /**
    * 表单项布局
    */
@@ -296,11 +804,16 @@ export interface FormRenderProps<
   /**
    * 表单定义
    */
-  schema?: FormSchema<T>[];
+  schema?: FormSchema<T, P, TValues>[];
+
   /**
    * 是否显示展开/折叠
    */
   showCollapseButton?: boolean;
+  /**
+   * 格式化日期
+   */
+
   /**
    * 表单栅格布局
    * @default "grid-cols-1"
@@ -310,44 +823,85 @@ export interface FormRenderProps<
 
 export interface ActionButtonOptions extends VbenButtonProps {
   [key: string]: any;
-  content?: string;
+  content?: MaybeComputedRef<string>;
   show?: boolean;
 }
 
 export interface VbenFormProps<
   T extends BaseFormComponentType = BaseFormComponentType,
+  P extends Record<string, any> = Record<never, never>,
+  TValues extends FormValues = FormValues,
+  TSubmitValues extends FormValues = TValues,
 > extends Omit<
-    FormRenderProps<T>,
-    'componentBindEventMap' | 'componentMap' | 'form'
-  > {
+  FormRenderProps<T, P, TValues>,
+  'componentBindEventMap' | 'componentMap' | 'form'
+> {
   /**
    * 操作按钮是否反转（提交按钮前置）
    */
   actionButtonsReverse?: boolean;
+  /**
+   * 操作按钮组的样式
+   * newLine: 在新行显示。rowEnd: 在行内显示，靠右对齐（默认）。inline: 使用grid默认样式
+   */
+  actionLayout?: 'inline' | 'newLine' | 'rowEnd';
+  /**
+   * 操作按钮组显示位置，默认靠右显示
+   */
+  actionPosition?: 'center' | 'left' | 'right';
   /**
    * 表单操作区域class
    */
   actionWrapperClass?: ClassType;
   /**
-   * 表单字段映射成时间格式
+   * 表单字段数组映射字符串配置 默认使用","
+   * @deprecated Use the form-level `codec` instead.
+   */
+  arrayToStringFields?: ArrayToStringFields;
+
+  /**
+   * submitOnChange改变时防抖时间 | 默认300ms
+   */
+  changeDebouncedTime?: number;
+  /** 表单组件值与提交值之间的双向编解码器。 */
+  codec?: FormCodec<TValues, TSubmitValues>;
+  /**
+   * 表单字段映射
+   * @deprecated Use the form-level `codec` instead.
    */
   fieldMappingTime?: FieldMappingTime;
+  /**
+   * 表单收起展开状态变化回调
+   */
+  handleCollapsedChange?: (collapsed: boolean) => void;
   /**
    * 表单重置回调
    */
-  handleReset?: HandleResetFn;
+  handleReset?: HandleResetFn<NoInfer<TSubmitValues>>;
   /**
    * 表单提交回调
    */
-  handleSubmit?: HandleSubmitFn;
+  handleSubmit?: HandleSubmitFn<TValues, TSubmitValues>;
   /**
    * 表单值变化回调
    */
-  handleValuesChange?: (values: Record<string, any>) => void;
+  handleValuesChange?: (
+    values: Readonly<TValues>,
+    fieldsChanged: string[],
+    getFormattedValues: () => TSubmitValues,
+  ) => void;
+
   /**
    * 重置按钮参数
    */
   resetButtonOptions?: ActionButtonOptions;
+
+  /**
+   * 验证失败时是否自动滚动到第一个错误字段
+   * @default false
+   */
+  scrollToFirstError?: boolean;
+
   /**
    * 是否显示默认操作按钮
    * @default true
@@ -372,32 +926,49 @@ export interface VbenFormProps<
   submitOnEnter?: boolean;
 }
 
-export type ExtendedFormApi = {
-  useStore: <T = NoInfer<VbenFormProps>>(
-    selector?: (state: NoInfer<VbenFormProps>) => T,
-  ) => Readonly<Ref<T>>;
-} & FormApi;
+export type ExtendedFormApi<
+  TValues extends FormValues = FormValues,
+  T extends BaseFormComponentType = BaseFormComponentType,
+  P extends Record<string, any> = Record<never, never>,
+  TSubmitValues extends FormValues = TValues,
+> = FormApi<TValues, T, P, TSubmitValues> & {
+  useStore: <TResult = NoInfer<VbenFormProps<T, P, TValues, TSubmitValues>>>(
+    selector?: (
+      state: NoInfer<VbenFormProps<T, P, TValues, TSubmitValues>>,
+    ) => TResult,
+  ) => Readonly<Ref<TResult>>;
+};
 
 export interface VbenFormAdapterOptions<
   T extends BaseFormComponentType = BaseFormComponentType,
 > {
   config?: {
     baseModelPropName?: string;
-    disabledOnChangeListener?: boolean;
-    disabledOnInputListener?: boolean;
+    /**
+     * 是否启用 change 事件兼容回退。
+     * 仅用于只发送 change 的兼容组件。
+     * @default false
+     */
+    changeEventFallback?: boolean;
     emptyStateValue?: null | undefined;
     modelPropNameMap?: Partial<Record<T, string>>;
   };
-  defineRules?: {
-    required?: (
-      value: any,
-      params: any,
-      ctx: Record<string, any>,
-    ) => boolean | string;
-    selectRequired?: (
-      value: any,
-      params: any,
-      ctx: Record<string, any>,
-    ) => boolean | string;
-  };
+  /** @deprecated Use `rules` instead. */
+  defineRules?: Partial<Record<string, FormRuleValidator>>;
+  rules?: Partial<Record<string, FormRuleValidator>>;
 }
+
+export interface FormRuleContext {
+  field: {
+    label?: string;
+    name: string;
+  };
+  label?: string;
+  name: string;
+}
+
+export type FormRuleValidator = (
+  value: any,
+  params: any,
+  context: FormRuleContext,
+) => boolean | Promise<boolean | string> | string;
diff --git a/packages/@core/ui-kit/form-ui/src/use-form-context.ts b/packages/@core/ui-kit/form-ui/src/use-form-context.ts
index 05838fc3..ae3d69f9 100644
--- a/packages/@core/ui-kit/form-ui/src/use-form-context.ts
+++ b/packages/@core/ui-kit/form-ui/src/use-form-context.ts
@@ -1,28 +1,38 @@
-import type { FormActions, VbenFormProps } from './types';
+import type { ZodType } from 'zod';
 
-import { computed, type ComputedRef, unref, useSlots } from 'vue';
+import type { ComputedRef } from 'vue';
+
+import type { ExtendedFormApi, FormActions, VbenFormProps } from './types';
+
+import { computed, toRaw, unref, useSlots } from 'vue';
 
 import { createContext } from '@vben-core/shadcn-ui';
-import { isString } from '@vben-core/shared/utils';
+import { isString, mergeWithArrayOverride, set } from '@vben-core/shared/utils';
 
-import { useForm } from 'vee-validate';
-import { object, type ZodRawShape } from 'zod';
+import { object, ZodIntersection, ZodNumber, ZodObject, ZodString } from 'zod';
 import { getDefaultsForSchema } from 'zod-defaults';
 
+import { useFormRuntime } from './form-runtime';
+
+type ExtendFormProps = VbenFormProps & {
+  formApi?: ExtendedFormApi<any, any, any>;
+};
+
 export const [injectFormProps, provideFormProps] =
-  createContext<[ComputedRef<VbenFormProps> | VbenFormProps, FormActions]>(
+  createContext<[ComputedRef<ExtendFormProps> | ExtendFormProps, FormActions]>(
     'VbenFormProps',
   );
 
+export const [injectComponentRefMap, provideComponentRefMap] =
+  createContext<Map<string, unknown>>('ComponentRefMap');
+
 export function useFormInitial(
   props: ComputedRef<VbenFormProps> | VbenFormProps,
 ) {
   const slots = useSlots();
   const initialValues = generateInitialValues();
 
-  const form = useForm({
-    ...(Object.keys(initialValues)?.length ? { initialValues } : {}),
-  });
+  const form = useFormRuntime(initialValues);
 
   const delegatedSlots = computed(() => {
     const resultSlots: string[] = [];
@@ -38,18 +48,48 @@ export function useFormInitial(
   function generateInitialValues() {
     const initialValues: Record<string, any> = {};
 
-    const zodObject: ZodRawShape = {};
+    const zodObject: Record<string, ZodType> = {};
     (unref(props).schema || []).forEach((item) => {
       if (Reflect.has(item, 'defaultValue')) {
-        initialValues[item.fieldName] = item.defaultValue;
+        set(initialValues, item.fieldName, item.defaultValue);
       } else if (item.rules && !isString(item.rules)) {
-        zodObject[item.fieldName] = item.rules;
+        // 检查规则是否适合提取默认值
+        const rawRules = toRaw(item.rules);
+        const customDefaultValue = getCustomDefaultValue(rawRules);
+        zodObject[item.fieldName] = rawRules;
+        if (customDefaultValue !== undefined) {
+          initialValues[item.fieldName] = customDefaultValue;
+        }
       }
     });
 
     const schemaInitialValues = getDefaultsForSchema(object(zodObject));
 
-    return { ...initialValues, ...schemaInitialValues };
+    const zodDefaults: Record<string, any> = {};
+    for (const key in schemaInitialValues) {
+      set(zodDefaults, key, schemaInitialValues[key]);
+    }
+    return mergeWithArrayOverride(initialValues, zodDefaults);
+  }
+  // 自定义默认值提取逻辑
+  function getCustomDefaultValue(rule: any): any {
+    rule = toRaw(rule);
+    if (rule instanceof ZodString) {
+      return ''; // 默认为空字符串
+    } else if (rule instanceof ZodNumber) {
+      return null; // 默认为 null（避免显示 0）
+    } else if (rule instanceof ZodObject) {
+      // 递归提取嵌套对象的默认值
+      const defaultValues: Record<string, any> = {};
+      for (const [key, valueSchema] of Object.entries(rule.shape)) {
+        defaultValues[key] = getCustomDefaultValue(valueSchema);
+      }
+      return defaultValues;
+    } else if (rule instanceof ZodIntersection) {
+      return getDefaultsForSchema(rule);
+    } else {
+      return undefined; // 其他类型不提供默认值
+    }
   }
 
   return {
diff --git a/packages/@core/ui-kit/form-ui/src/use-vben-form.ts b/packages/@core/ui-kit/form-ui/src/use-vben-form.ts
index f5d07b9e..e9383ae1 100644
--- a/packages/@core/ui-kit/form-ui/src/use-vben-form.ts
+++ b/packages/@core/ui-kit/form-ui/src/use-vben-form.ts
@@ -1,24 +1,50 @@
 import type {
   BaseFormComponentType,
   ExtendedFormApi,
+  FormValues,
+  VbenFormComponent,
   VbenFormProps,
 } from './types';
 
 import { defineComponent, h, isReactive, onBeforeUnmount, watch } from 'vue';
 
-import { useStore } from '@vben-core/shared/store';
+import { useSelector } from '@vben-core/shared/store';
 
 import { FormApi } from './form-api';
 import VbenUseForm from './vben-use-form.vue';
 
+type UseVbenFormReturn<
+  TValues extends FormValues,
+  T extends BaseFormComponentType,
+  P extends Record<string, any>,
+  TSubmitValues extends FormValues = TValues,
+> = readonly [
+  VbenFormComponent<TValues, T, P, TSubmitValues>,
+  ExtendedFormApi<TValues, T, P, TSubmitValues>,
+];
+
 export function useVbenForm<
   T extends BaseFormComponentType = BaseFormComponentType,
->(options: VbenFormProps<T>) {
+  P extends Record<string, any> = Record<never, never>,
+>(options: VbenFormProps<T, P>): UseVbenFormReturn<FormValues, T, P>;
+
+export function useVbenForm<
+  TValues extends FormValues,
+  T extends BaseFormComponentType = BaseFormComponentType,
+  P extends Record<string, any> = Record<never, never>,
+  TSubmitValues extends FormValues = TValues,
+>(
+  options: VbenFormProps<T, P, TValues, TSubmitValues>,
+): UseVbenFormReturn<TValues, T, P, TSubmitValues>;
+
+export function useVbenForm(
+  options: VbenFormProps<any, any, any, any>,
+): UseVbenFormReturn<any, any, any, any> {
   const IS_REACTIVE = isReactive(options);
-  const api = new FormApi(options);
-  const extendedApi: ExtendedFormApi = api as never;
-  extendedApi.useStore = (selector) => {
-    return useStore(api.store, selector);
+  const api = new FormApi<any, any, any, any>(options);
+  const extendedApi = api as ExtendedFormApi<any, any, any, any>;
+  extendedApi.useStore = (selector: any) => {
+    return useSelector(api.store, selector);
   };
 
   const Form = defineComponent(
@@ -31,8 +57,8 @@ export function useVbenForm<
         h(VbenUseForm, { ...props, ...attrs, formApi: extendedApi }, slots);
     },
     {
-      inheritAttrs: false,
       name: 'VbenUseForm',
+      inheritAttrs: false,
     },
   );
   // Add reactivity support
@@ -46,5 +72,10 @@ export function useVbenForm<
     );
   }
 
-  return [Form, extendedApi] as const;
+  return [Form, extendedApi] as unknown as UseVbenFormReturn<
+    any,
+    any,
+    any,
+    any
+  >;
 }
diff --git a/packages/@core/ui-kit/form-ui/src/vben-form.vue b/packages/@core/ui-kit/form-ui/src/vben-form.vue
index 260e75cd..f3ba37f0 100644
--- a/packages/@core/ui-kit/form-ui/src/vben-form.vue
+++ b/packages/@core/ui-kit/form-ui/src/vben-form.vue
@@ -40,7 +40,9 @@ const { delegatedSlots, form } = useFormInitial(props);
 provideFormProps([props, form]);
 
 const handleUpdateCollapsed = (value: boolean) => {
-  currentCollapsed.value = !!value;
+  currentCollapsed.value = value;
+  // 触发收起展开状态变化回调
+  props.handleCollapsedChange?.(value);
 };
 
 watchEffect(() => {
diff --git a/packages/@core/ui-kit/form-ui/src/vben-use-form.vue b/packages/@core/ui-kit/form-ui/src/vben-use-form.vue
index 9908e85d..69021efe 100644
--- a/packages/@core/ui-kit/form-ui/src/vben-use-form.vue
+++ b/packages/@core/ui-kit/form-ui/src/vben-use-form.vue
@@ -1,14 +1,10 @@
 <script setup lang="ts">
-import type { ExtendedFormApi, VbenFormProps } from './types';
+import type { ExtendedFormApi, VbenFormProps, VbenFormSlots } from './types';
 
-// import { toRaw, watch } from 'vue';
+import { nextTick, onMounted, readonly, watch } from 'vue';
 
 import { useForwardPriorityValues } from '@vben-core/composables';
-// import { isFunction } from '@vben-core/shared/utils';
-
-import { nextTick, onMounted, watch } from 'vue';
-
-import { cloneDeep } from '@vben-core/shared/utils';
+import { get, isEqual } from '@vben-core/shared/utils';
 
 import { useDebounceFn } from '@vueuse/core';
 
@@ -19,30 +15,54 @@ import {
   DEFAULT_FORM_COMMON_CONFIG,
 } from './config';
 import { Form } from './form-render';
-import { provideFormProps, useFormInitial } from './use-form-context';
+import {
+  provideComponentRefMap,
+  provideFormProps,
+  useFormInitial,
+} from './use-form-context';
+
 // 通过 extends 会导致热更新卡死，所以重复写了一遍
 interface Props extends VbenFormProps {
-  formApi: ExtendedFormApi;
+  formApi?: ExtendedFormApi<any, any, any, any>;
 }
 
 const props = defineProps<Props>();
+defineSlots<
+  Record<string, ((props: Record<string, any>) => any) | undefined> &
+    VbenFormSlots<any, any, any>
+>();
 
-const state = props.formApi?.useStore?.();
+const formApi = props.formApi;
+if (!formApi) {
+  throw new Error('Form api is required in <VbenUseForm />');
+}
+
+const state = formApi.useStore();
 
 const forward = useForwardPriorityValues(props, state);
 
+const componentRefMap = new Map<string, unknown>();
+
 const { delegatedSlots, form } = useFormInitial(forward);
+const values = form.useValues();
 
 provideFormProps([forward, form]);
+provideComponentRefMap(componentRefMap);
 
-props.formApi?.mount?.(form);
+formApi.mount(form, componentRefMap);
 
-const handleUpdateCollapsed = (value: boolean) => {
-  props.formApi?.setState({ collapsed: !!value });
-};
+function handleUpdateCollapsed(value: boolean) {
+  props.formApi?.setState({ collapsed: value });
+  // 触发收起展开状态变化回调
+  forward.value.handleCollapsedChange?.(value);
+}
 
 function handleKeyDownEnter(event: KeyboardEvent) {
-  if (!state.value.submitOnEnter || !forward.value.formApi?.isMounted) {
+  if (!state?.value.submitOnEnter || !forward.value.formApi?.isMounted) {
+    return;
+  }
+  // 输入法组合态（打中文选词）的回车是「确认候选词」，不是提交意图
+  if (event.isComposing) {
     return;
   }
   // 如果是 textarea 不阻止默认行为，否则会导致无法换行。
@@ -50,20 +70,84 @@ function handleKeyDownEnter(event: KeyboardEvent) {
   if (event.target instanceof HTMLTextAreaElement) {
     return;
   }
+  const target = event.target instanceof Element ? event.target : null;
+  // 焦点在按钮上（如重置/展开）时交给原生行为：回车本就会触发该按钮 click，
+  // 若在这里拦截成提交，会出现「聚焦重置按钮按回车却执行了查询」的错乱
+  if (target?.closest('button')) {
+    return;
+  }
+  // 下拉面板打开时回车是「选中选项」（keydown 冒泡是同步的，open class 尚未被
+  // Vue 异步渲染移除，此刻仍可命中），跳过提交；面板关闭后的下一次回车才提交，
+  // 即「下拉需要第二次回车才搜索」
+  if (target?.closest('.ant-select-open')) {
+    return;
+  }
+  // 日期/时间选择器：与 Select 一致的两段式语义——
+  // 面板打开时回车是「确认日期选择」（keydown 同步阶段面板 DOM 尚未被异步移除，仍可命中），跳过提交；
+  // 面板关闭后的下一次回车才提交，即「选完日期第二次回车即搜索」
+  if (target?.closest('.ant-picker')) {
+    const openPickerPanel = document.querySelector(
+      '.ant-picker-dropdown:not(.ant-picker-dropdown-hidden)',
+    );
+    if (openPickerPanel) {
+      return;
+    }
+    // 面板关闭态：rc-picker 的回车会重新打开面板，提交的同时主动失焦收面板，
+    // 避免搜索结果被日期面板挡住
+    event.preventDefault();
+    if (target instanceof HTMLElement) {
+      target.blur();
+    }
+    forward.value.formApi?.validateAndSubmit();
+    return;
+  }
   event.preventDefault();
-
-  forward.value.formApi.validateAndSubmitForm();
+  // 关闭态 Select 的回车会同步重新打开面板（rc-select 行为），提交的同时主动
+  // 失焦收起面板，避免搜索结果被下拉挡住
+  if (target instanceof HTMLElement && target.closest('.ant-select')) {
+    target.blur();
+  }
+  forward.value.formApi?.validateAndSubmit();
 }
 
-const handleValuesChangeDebounced = useDebounceFn((newVal) => {
-  forward.value.handleValuesChange?.(cloneDeep(newVal));
-  state.value.submitOnChange && forward.value.formApi?.validateAndSubmitForm();
-}, 300);
+const handleValuesChangeDebounced = useDebounceFn(async () => {
+  state?.value.submitOnChange && forward.value.formApi?.validateAndSubmit();
+}, state?.value?.changeDebouncedTime ?? 300);
+
+let valuesChangeReady = false;
 
 onMounted(async () => {
   // 只在挂载后开始监听，form.values会有一个初始化的过程
   await nextTick();
-  watch(() => form.values, handleValuesChangeDebounced, { deep: true });
+  valuesChangeReady = true;
+});
+
+watch(values, (currentValues, previousValues) => {
+  if (!valuesChangeReady) {
+    return;
+  }
+  const handleValuesChange = forward.value.handleValuesChange;
+  const submitOnChange = state?.value.submitOnChange;
+  if (!handleValuesChange && !submitOnChange) {
+    return;
+  }
+  const fields = state?.value.schema?.map((item) => item.fieldName) ?? [];
+  if (handleValuesChange && fields.length > 0) {
+    const changedFields = fields.filter((field) => {
+      return !isEqual(
+        get(currentValues, field),
+        get(previousValues ?? {}, field),
+      );
+    });
+    if (changedFields.length > 0) {
+      handleValuesChange(readonly(currentValues), changedFields, () =>
+        formApi.formatValues(currentValues),
+      );
+    }
+  }
+  if (submitOnChange) {
+    handleValuesChangeDebounced();
+  }
 });
 </script>
 
@@ -71,7 +155,7 @@ onMounted(async () => {
   <Form
     @keydown.enter="handleKeyDownEnter"
     v-bind="forward"
-    :collapsed="state.collapsed"
+    :collapsed="state?.collapsed"
     :component-bind-event-map="COMPONENT_BIND_EVENT_MAP"
     :component-map="COMPONENT_MAP"
     :form="form"
@@ -82,29 +166,58 @@ onMounted(async () => {
       :key="slotName"
       #[slotName]="slotProps"
     >
-      <slot :name="slotName" v-bind="slotProps"></slot>
+      <slot
+        :name="slotName"
+        v-bind="slotProps"
+        :form-api="formApi"
+        :values="form.values"
+      ></slot>
     </template>
     <template #default="slotProps">
-      <slot v-bind="slotProps">
-        <FormActions
-          v-if="forward.showDefaultActions"
-          :model-value="state.collapsed"
-          @update:model-value="handleUpdateCollapsed"
-        >
-          <template #reset-before="resetSlotProps">
-            <slot name="reset-before" v-bind="resetSlotProps"></slot>
-          </template>
-          <template #submit-before="submitSlotProps">
-            <slot name="submit-before" v-bind="submitSlotProps"></slot>
-          </template>
-          <template #expand-before="expandBeforeSlotProps">
-            <slot name="expand-before" v-bind="expandBeforeSlotProps"></slot>
-          </template>
-          <template #expand-after="expandAfterSlotProps">
-            <slot name="expand-after" v-bind="expandAfterSlotProps"></slot>
-          </template>
-        </FormActions>
-      </slot>
+      <slot
+        v-if="$slots.default"
+        v-bind="slotProps"
+        :form-api="formApi"
+        :values="form.values"
+      ></slot>
+      <FormActions
+        v-else-if="forward.showDefaultActions"
+        :model-value="state?.collapsed"
+        @update:model-value="handleUpdateCollapsed"
+      >
+        <template #reset-before="resetSlotProps">
+          <slot
+            name="reset-before"
+            v-bind="resetSlotProps"
+            :form-api="formApi"
+            :values="form.values"
+          ></slot>
+        </template>
+        <template #submit-before="submitSlotProps">
+          <slot
+            name="submit-before"
+            v-bind="submitSlotProps"
+            :form-api="formApi"
+            :values="form.values"
+          ></slot>
+        </template>
+        <template #expand-before="expandBeforeSlotProps">
+          <slot
+            name="expand-before"
+            v-bind="expandBeforeSlotProps"
+            :form-api="formApi"
+            :values="form.values"
+          ></slot>
+        </template>
+        <template #expand-after="expandAfterSlotProps">
+          <slot
+            name="expand-after"
+            v-bind="expandAfterSlotProps"
+            :form-api="formApi"
+            :values="form.values"
+          ></slot>
+        </template>
+      </FormActions>
     </template>
   </Form>
 </template>
diff --git a/packages/@core/ui-kit/form-ui/tailwind.config.mjs b/packages/@core/ui-kit/form-ui/tailwind.config.mjs
deleted file mode 100644
index f17f556f..00000000
--- a/packages/@core/ui-kit/form-ui/tailwind.config.mjs
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from '@vben/tailwind-config';
diff --git a/packages/@core/ui-kit/form-ui/tsdown.config.ts b/packages/@core/ui-kit/form-ui/tsdown.config.ts
new file mode 100644
index 00000000..43e8cf1c
--- /dev/null
+++ b/packages/@core/ui-kit/form-ui/tsdown.config.ts
@@ -0,0 +1,21 @@
+import { defineConfig } from 'tsdown';
+import Vue from 'unplugin-vue/rolldown';
+
+export default defineConfig({
+  clean: true,
+  deps: {
+    skipNodeModulesBundle: true,
+  },
+  dts: {
+    vue: true,
+  },
+  entry: ['src/index.ts'],
+  format: ['esm'],
+  outExtensions: () => ({
+    dts: '.d.ts',
+    js: '.mjs',
+  }),
+  platform: 'neutral',
+  plugins: [Vue({ isProduction: true })],
+  unbundle: true,
+});
diff --git a/packages/@core/ui-kit/layout-ui/build.config.ts b/packages/@core/ui-kit/layout-ui/build.config.ts
deleted file mode 100644
index 18eaa604..00000000
--- a/packages/@core/ui-kit/layout-ui/build.config.ts
+++ /dev/null
@@ -1,21 +0,0 @@
-import { defineBuildConfig } from 'unbuild';
-
-export default defineBuildConfig({
-  clean: true,
-  declaration: true,
-  entries: [
-    {
-      builder: 'mkdist',
-      input: './src',
-      loaders: ['vue'],
-      pattern: ['**/*.vue'],
-    },
-    {
-      builder: 'mkdist',
-      format: 'esm',
-      input: './src',
-      loaders: ['js'],
-      pattern: ['**/*.ts'],
-    },
-  ],
-});
diff --git a/packages/@core/ui-kit/layout-ui/package.json b/packages/@core/ui-kit/layout-ui/package.json
index 7aa4a35b..e579303d 100644
--- a/packages/@core/ui-kit/layout-ui/package.json
+++ b/packages/@core/ui-kit/layout-ui/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vben-core/layout-ui",
-  "version": "5.5.1",
+  "version": "5.7.0",
   "homepage": "https://github.com/vbenjs/vue-vben-admin",
   "bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
   "repository": {
@@ -11,7 +11,7 @@
   "license": "MIT",
   "type": "module",
   "scripts": {
-    "build": "pnpm unbuild",
+    "build": "pnpm exec tsdown",
     "prepublishOnly": "npm run build"
   },
   "files": [
@@ -22,16 +22,19 @@
   ],
   "main": "./dist/index.mjs",
   "module": "./dist/index.mjs",
+  "types": "./dist/index.d.ts",
   "exports": {
     ".": {
       "types": "./src/index.ts",
       "development": "./src/index.ts",
+      "production": "./src/index.ts",
       "default": "./dist/index.mjs"
     }
   },
   "publishConfig": {
     "exports": {
       ".": {
+        "types": "./dist/index.d.ts",
         "default": "./dist/index.mjs"
       }
     }
@@ -44,5 +47,8 @@
     "@vben-core/typings": "workspace:*",
     "@vueuse/core": "catalog:",
     "vue": "catalog:"
+  },
+  "devDependencies": {
+    "unplugin-vue": "catalog:"
   }
 }
diff --git a/packages/@core/ui-kit/layout-ui/postcss.config.mjs b/packages/@core/ui-kit/layout-ui/postcss.config.mjs
deleted file mode 100644
index 3d807045..00000000
--- a/packages/@core/ui-kit/layout-ui/postcss.config.mjs
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from '@vben/tailwind-config/postcss';
diff --git a/packages/@core/ui-kit/layout-ui/src/__tests__/header-scroll-state.test.ts b/packages/@core/ui-kit/layout-ui/src/__tests__/header-scroll-state.test.ts
new file mode 100644
index 00000000..180d0f03
--- /dev/null
+++ b/packages/@core/ui-kit/layout-ui/src/__tests__/header-scroll-state.test.ts
@@ -0,0 +1,62 @@
+import { describe, expect, it } from 'vitest';
+
+import { resolveHeaderHiddenOnScroll } from '../header-scroll-state';
+
+const baseOptions = {
+  arrivedTop: false,
+  currentHidden: false,
+  directionDown: false,
+  directionUp: false,
+  headerHeight: 90,
+  scrollTop: 120,
+};
+
+describe('resolveHeaderHiddenOnScroll', () => {
+  it('should show the header near the top', () => {
+    expect(
+      resolveHeaderHiddenOnScroll({
+        ...baseOptions,
+        directionDown: true,
+        scrollTop: 89,
+      }),
+    ).toBe(false);
+  });
+
+  it('should show the header when the top is reached', () => {
+    expect(
+      resolveHeaderHiddenOnScroll({
+        ...baseOptions,
+        arrivedTop: true,
+        currentHidden: true,
+      }),
+    ).toBe(false);
+  });
+
+  it('should show the header while scrolling up', () => {
+    expect(
+      resolveHeaderHiddenOnScroll({
+        ...baseOptions,
+        currentHidden: true,
+        directionUp: true,
+      }),
+    ).toBe(false);
+  });
+
+  it('should hide the header while scrolling down', () => {
+    expect(
+      resolveHeaderHiddenOnScroll({
+        ...baseOptions,
+        directionDown: true,
+      }),
+    ).toBe(true);
+  });
+
+  it('should preserve the current state without a direction', () => {
+    expect(
+      resolveHeaderHiddenOnScroll({
+        ...baseOptions,
+        currentHidden: true,
+      }),
+    ).toBe(true);
+  });
+});
diff --git a/packages/@core/ui-kit/layout-ui/src/components/layout-content.vue b/packages/@core/ui-kit/layout-ui/src/components/layout-content.vue
index 926e621b..26fbfd39 100644
--- a/packages/@core/ui-kit/layout-ui/src/components/layout-content.vue
+++ b/packages/@core/ui-kit/layout-ui/src/components/layout-content.vue
@@ -1,7 +1,8 @@
 <script setup lang="ts">
+import type { CSSProperties } from 'vue';
+
 import type { ContentCompactType } from '@vben-core/typings';
 
-import type { CSSProperties } from 'vue';
 import { computed } from 'vue';
 
 import { useLayoutContentStyle } from '@vben-core/composables';
@@ -25,6 +26,7 @@ interface Props {
 
 const props = withDefaults(defineProps<Props>(), {});
 
+// @ts-expect-error - unused
 const { contentElement, overlayStyle } = useLayoutContentStyle();
 
 const style = computed((): CSSProperties => {
@@ -54,7 +56,7 @@ const style = computed((): CSSProperties => {
 </script>
 
 <template>
-  <main ref="contentElement" :style="style" class="bg-background-deep relative">
+  <main ref="contentElement" :style="style" class="relative bg-background-deep">
     <Slot :style="overlayStyle">
       <slot name="overlay"></slot>
     </Slot>
diff --git a/packages/@core/ui-kit/layout-ui/src/components/layout-footer.vue b/packages/@core/ui-kit/layout-ui/src/components/layout-footer.vue
index d4fb16f3..1089facd 100644
--- a/packages/@core/ui-kit/layout-ui/src/components/layout-footer.vue
+++ b/packages/@core/ui-kit/layout-ui/src/components/layout-footer.vue
@@ -1,5 +1,6 @@
 <script setup lang="ts">
 import type { CSSProperties } from 'vue';
+
 import { computed } from 'vue';
 
 interface Props {
@@ -27,6 +28,7 @@ const style = computed((): CSSProperties => {
     height: `${height}px`,
     marginBottom: show ? '0' : `-${height}px`,
     position: fixed ? 'fixed' : 'static',
+    transform: show ? 'translateY(0)' : 'translateY(100%)',
     width,
     zIndex,
   };
@@ -36,7 +38,7 @@ const style = computed((): CSSProperties => {
 <template>
   <footer
     :style="style"
-    class="bg-background-deep bottom-0 w-full transition-all duration-200"
+    class="bottom-0 w-full shrink-0 bg-background-deep transition-all duration-200"
   >
     <slot></slot>
   </footer>
diff --git a/packages/@core/ui-kit/layout-ui/src/components/layout-header.vue b/packages/@core/ui-kit/layout-ui/src/components/layout-header.vue
index 792c8d88..0f980b38 100644
--- a/packages/@core/ui-kit/layout-ui/src/components/layout-header.vue
+++ b/packages/@core/ui-kit/layout-ui/src/components/layout-header.vue
@@ -1,5 +1,6 @@
 <script setup lang="ts">
 import type { CSSProperties } from 'vue';
+
 import { computed, useSlots } from 'vue';
 
 interface Props {
@@ -15,6 +16,10 @@ interface Props {
    * 是否移动端
    */
   isMobile: boolean;
+  /**
+   * logo是否显示
+   */
+  logoVisible?: boolean;
   /**
    * 是否显示
    */
@@ -37,7 +42,9 @@ interface Props {
   zIndex: number;
 }
 
-const props = withDefaults(defineProps<Props>(), {});
+const props = withDefaults(defineProps<Props>(), {
+  logoVisible: true,
+});
 
 const slots = useSlots();
 
@@ -53,6 +60,12 @@ const style = computed((): CSSProperties => {
 });
 
 const logoStyle = computed((): CSSProperties => {
+  if (!props.logoVisible) {
+    return {
+      minWidth: '12px',
+    };
+  }
+
   return {
     minWidth: `${props.isMobile ? 40 : props.sidebarWidth}px`,
   };
@@ -63,9 +76,9 @@ const logoStyle = computed((): CSSProperties => {
   <header
     :class="theme"
     :style="style"
-    class="border-border bg-header top-0 flex w-full flex-[0_0_auto] items-center border-b pl-2 transition-[margin-top] duration-200"
+    class="top-0 flex w-full flex-[0_0_auto] items-center border-b border-border bg-header pl-2 transition-[margin-top] duration-200"
   >
-    <div v-if="slots.logo" :style="logoStyle">
+    <div v-if="slots.logo || (!logoVisible && !isMobile)" :style="logoStyle">
       <slot name="logo"></slot>
     </div>
 
diff --git a/packages/@core/ui-kit/layout-ui/src/components/layout-sidebar.vue b/packages/@core/ui-kit/layout-ui/src/components/layout-sidebar.vue
index 3d868190..fd036c1c 100644
--- a/packages/@core/ui-kit/layout-ui/src/components/layout-sidebar.vue
+++ b/packages/@core/ui-kit/layout-ui/src/components/layout-sidebar.vue
@@ -1,11 +1,12 @@
 <script setup lang="ts">
 import type { CSSProperties } from 'vue';
-import { computed, shallowRef, useSlots, watchEffect } from 'vue';
 
+import { computed, onUnmounted, shallowRef, useSlots, watchEffect } from 'vue';
+
+import { useScrollLock } from '@vben-core/composables';
 import { VbenScrollbar } from '@vben-core/shadcn-ui';
 
-import { useScrollLock } from '@vueuse/core';
-
+import { useSidebarDrag } from '../hooks/use-sidebar-drag';
 import { SidebarCollapseButton, SidebarFixedButton } from './widgets';
 
 interface Props {
@@ -24,6 +25,10 @@ interface Props {
    * @default true
    */
   domVisible?: boolean;
+  /**
+   * 扩展区域extra-title的高度
+   */
+  extraTitleHeight?: number;
   /**
    * 扩展区域宽度
    */
@@ -64,14 +69,22 @@ interface Props {
   show?: boolean;
   /**
    * 显示折叠按钮
-   * @default false
+   * @default true
    */
   showCollapseButton?: boolean;
+  /**
+   * 显示固定按钮
+   * @default true
+   */
+  showFixedButton?: boolean;
   /**
    * 主题
    */
   theme: string;
-
+  /**
+   * 子主题
+   */
+  themeSub: string;
   /**
    * 宽度
    */
@@ -87,6 +100,7 @@ const props = withDefaults(defineProps<Props>(), {
   collapseHeight: 42,
   collapseWidth: 48,
   domVisible: true,
+  extraTitleHeight: undefined,
   fixedExtra: false,
   isSidebarMixed: false,
   marginTop: 0,
@@ -94,20 +108,23 @@ const props = withDefaults(defineProps<Props>(), {
   paddingTop: 0,
   show: true,
   showCollapseButton: true,
+  showFixedButton: true,
   zIndex: 0,
 });
 
-const emit = defineEmits<{ leave: [] }>();
+const emit = defineEmits<{ leave: []; 'update:width': [value: number] }>();
+const draggable = defineModel<boolean>('draggable');
 const collapse = defineModel<boolean>('collapse');
 const extraCollapse = defineModel<boolean>('extraCollapse');
 const expandOnHovering = defineModel<boolean>('expandOnHovering');
 const expandOnHover = defineModel<boolean>('expandOnHover');
 const extraVisible = defineModel<boolean>('extraVisible');
 
-const isLocked = useScrollLock(document.body);
+const isLocked = useScrollLock({ immediate: false });
 const slots = useSlots();
 
-const asideRef = shallowRef<HTMLDivElement | null>();
+const asideRef = shallowRef<HTMLElement | null>(null);
+const dragBarRef = shallowRef<HTMLElement | null>(null);
 
 const hiddenSideStyle = computed((): CSSProperties => calcMenuWidthStyle(true));
 
@@ -136,17 +153,17 @@ const extraStyle = computed((): CSSProperties => {
 });
 
 const extraTitleStyle = computed((): CSSProperties => {
-  const { headerHeight } = props;
+  const { extraTitleHeight, headerHeight } = props;
 
   return {
-    height: `${headerHeight - 1}px`,
+    height: `${extraTitleHeight ?? headerHeight - 1}px`,
   };
 });
 
 const contentWidthStyle = computed((): CSSProperties => {
-  const { collapseWidth, fixedExtra, isSidebarMixed, mixedWidth } = props;
+  const { fixedExtra, isSidebarMixed, mixedWidth } = props;
   if (isSidebarMixed && fixedExtra) {
-    return { width: `${collapse.value ? collapseWidth : mixedWidth}px` };
+    return { width: `${mixedWidth}px` };
   }
   return {};
 });
@@ -172,9 +189,10 @@ const headerStyle = computed((): CSSProperties => {
 });
 
 const extraContentStyle = computed((): CSSProperties => {
-  const { collapseHeight, headerHeight } = props;
+  const { collapseHeight, extraTitleHeight, headerHeight } = props;
+  const titleHeight = extraTitleHeight ?? headerHeight;
   return {
-    height: `calc(100% - ${headerHeight + collapseHeight}px)`,
+    height: `calc(100% - ${titleHeight + collapseHeight}px)`,
   };
 });
 
@@ -189,19 +207,24 @@ watchEffect(() => {
 });
 
 function calcMenuWidthStyle(isHiddenDom: boolean): CSSProperties {
-  const { extraWidth, fixedExtra, isSidebarMixed, show, width } = props;
+  const {
+    collapseWidth,
+    extraWidth,
+    mixedWidth,
+    fixedExtra,
+    isSidebarMixed,
+    show,
+    width,
+  } = props;
 
   let widthValue =
     width === 0
       ? '0px'
       : `${width + (isSidebarMixed && fixedExtra && extraVisible.value ? extraWidth : 0)}px`;
 
-  const { collapseWidth } = props;
-
   if (isHiddenDom && expandOnHovering.value && !expandOnHover.value) {
-    widthValue = `${collapseWidth}px`;
+    widthValue = isSidebarMixed ? `${mixedWidth}px` : `${collapseWidth}px`;
   }
-
   return {
     ...(widthValue === '0px' ? { overflow: 'hidden' } : {}),
     flex: `0 0 ${widthValue}`,
@@ -243,6 +266,40 @@ function handleMouseleave() {
   collapse.value = true;
   extraVisible.value = false;
 }
+
+const { startDrag, endDrag } = useSidebarDrag();
+
+const handleDragSidebar = (e: MouseEvent) => {
+  const { isSidebarMixed, collapseWidth, width } = props;
+  const minLimit = isSidebarMixed ? width + collapseWidth : collapseWidth;
+  const maxLimit = isSidebarMixed ? width + 320 : 320;
+
+  startDrag(
+    e,
+    {
+      min: minLimit,
+      max: maxLimit,
+    },
+    {
+      target: asideRef.value,
+      dragBar: dragBarRef.value,
+    },
+    (newWidth) => {
+      if (isSidebarMixed) {
+        emit('update:width', newWidth - width);
+        extraCollapse.value = collapse.value =
+          newWidth - width <= collapseWidth;
+      } else {
+        emit('update:width', newWidth);
+        collapse.value = extraCollapse.value = newWidth <= collapseWidth;
+      }
+    },
+  );
+};
+
+onUnmounted(() => {
+  endDrag();
+});
 </script>
 
 <template>
@@ -253,42 +310,50 @@ function handleMouseleave() {
     class="h-full transition-all duration-150"
   ></div>
   <aside
-    :class="[
-      theme,
-      {
-        'bg-sidebar-deep': isSidebarMixed,
-        'bg-sidebar border-border border-r': !isSidebarMixed,
-      },
-    ]"
+    ref="asideRef"
     :style="style"
     class="fixed left-0 top-0 h-full transition-all duration-150"
+    :class="theme"
     @mouseenter="handleMouseenter"
     @mouseleave="handleMouseleave"
   >
-    <SidebarFixedButton
-      v-if="!collapse && !isSidebarMixed"
-      v-model:expand-on-hover="expandOnHover"
-    />
-    <div v-if="slots.logo" :style="headerStyle">
-      <slot name="logo"></slot>
-    </div>
-    <VbenScrollbar :style="contentStyle" shadow shadow-border>
-      <slot></slot>
-    </VbenScrollbar>
+    <div
+      class="h-full"
+      :class="[
+        {
+          'bg-sidebar-deep': isSidebarMixed,
+          'border-r border-border bg-sidebar': !isSidebarMixed,
+        },
+      ]"
+      :style="{ width: `${width}px` }"
+    >
+      <SidebarFixedButton
+        v-if="!collapse && !isSidebarMixed && showFixedButton"
+        v-model:expand-on-hover="expandOnHover"
+      />
+      <div v-if="slots.logo" :style="headerStyle">
+        <slot name="logo"></slot>
+      </div>
+      <VbenScrollbar :style="contentStyle" shadow shadow-border>
+        <slot></slot>
+      </VbenScrollbar>
 
-    <div :style="collapseStyle"></div>
-    <SidebarCollapseButton
-      v-if="showCollapseButton && !isSidebarMixed"
-      v-model:collapsed="collapse"
-    />
+      <div :style="collapseStyle"></div>
+      <SidebarCollapseButton
+        v-if="showCollapseButton && !isSidebarMixed"
+        v-model:collapsed="collapse"
+      />
+    </div>
     <div
       v-if="isSidebarMixed"
-      ref="asideRef"
-      :class="{
-        'border-l': extraVisible,
-      }"
+      :class="[
+        themeSub,
+        {
+          'border-l': extraVisible,
+        },
+      ]"
       :style="extraStyle"
-      class="border-border bg-sidebar fixed top-0 h-full overflow-hidden border-r transition-all duration-200"
+      class="fixed top-0 h-full overflow-hidden border-r border-border bg-sidebar transition-all duration-200"
     >
       <SidebarCollapseButton
         v-if="isSidebarMixed && expandOnHover"
@@ -311,5 +376,11 @@ function handleMouseleave() {
         <slot name="extra"></slot>
       </VbenScrollbar>
     </div>
+    <div
+      v-if="draggable"
+      ref="dragBarRef"
+      class="absolute inset-y-0 -right-px z-1000 w-0.5 cursor-col-resize hover:bg-primary"
+      @mousedown="handleDragSidebar"
+    ></div>
   </aside>
 </template>
diff --git a/packages/@core/ui-kit/layout-ui/src/components/layout-tabbar.vue b/packages/@core/ui-kit/layout-ui/src/components/layout-tabbar.vue
index 2a2cfd9c..148600e1 100644
--- a/packages/@core/ui-kit/layout-ui/src/components/layout-tabbar.vue
+++ b/packages/@core/ui-kit/layout-ui/src/components/layout-tabbar.vue
@@ -1,5 +1,6 @@
 <script setup lang="ts">
 import type { CSSProperties } from 'vue';
+
 import { computed } from 'vue';
 
 interface Props {
@@ -22,7 +23,7 @@ const style = computed((): CSSProperties => {
 <template>
   <section
     :style="style"
-    class="border-border bg-background flex w-full border-b transition-all"
+    class="flex w-full border-b border-border bg-background transition-all"
   >
     <slot></slot>
   </section>
diff --git a/packages/@core/ui-kit/layout-ui/src/components/widgets/sidebar-collapse-button.vue b/packages/@core/ui-kit/layout-ui/src/components/widgets/sidebar-collapse-button.vue
index 8092c0d1..9a16cbec 100644
--- a/packages/@core/ui-kit/layout-ui/src/components/widgets/sidebar-collapse-button.vue
+++ b/packages/@core/ui-kit/layout-ui/src/components/widgets/sidebar-collapse-button.vue
@@ -10,7 +10,7 @@ function handleCollapsed() {
 
 <template>
   <div
-    class="flex-center hover:text-foreground text-foreground/60 hover:bg-accent-hover bg-accent absolute bottom-2 left-3 z-10 cursor-pointer rounded-sm p-1"
+    class="absolute bottom-2 left-3 z-10 flex-center cursor-pointer rounded-sm bg-accent p-1 text-foreground/60 hover:bg-accent-hover hover:text-foreground"
     @click.stop="handleCollapsed"
   >
     <ChevronsRight v-if="collapsed" class="size-4" />
diff --git a/packages/@core/ui-kit/layout-ui/src/components/widgets/sidebar-fixed-button.vue b/packages/@core/ui-kit/layout-ui/src/components/widgets/sidebar-fixed-button.vue
index ce839f5c..44dec1d9 100644
--- a/packages/@core/ui-kit/layout-ui/src/components/widgets/sidebar-fixed-button.vue
+++ b/packages/@core/ui-kit/layout-ui/src/components/widgets/sidebar-fixed-button.vue
@@ -10,7 +10,7 @@ function toggleFixed() {
 
 <template>
   <div
-    class="flex-center hover:text-foreground text-foreground/60 hover:bg-accent-hover bg-accent absolute bottom-2 right-3 z-10 cursor-pointer rounded-sm p-[5px] transition-all duration-300"
+    class="absolute right-3 bottom-2 z-10 flex-center cursor-pointer rounded-sm bg-accent p-1.25 text-foreground/60 transition-all duration-300 hover:bg-accent-hover hover:text-foreground"
     @click="toggleFixed"
   >
     <PinOff v-if="!expandOnHover" class="size-3.5" />
diff --git a/packages/@core/ui-kit/layout-ui/src/header-scroll-state.ts b/packages/@core/ui-kit/layout-ui/src/header-scroll-state.ts
new file mode 100644
index 00000000..9b56f3a2
--- /dev/null
+++ b/packages/@core/ui-kit/layout-ui/src/header-scroll-state.ts
@@ -0,0 +1,28 @@
+interface HeaderScrollStateOptions {
+  arrivedTop: boolean;
+  currentHidden: boolean;
+  directionDown: boolean;
+  directionUp: boolean;
+  headerHeight: number;
+  scrollTop: number;
+}
+
+export function resolveHeaderHiddenOnScroll({
+  arrivedTop,
+  currentHidden,
+  directionDown,
+  directionUp,
+  headerHeight,
+  scrollTop,
+}: HeaderScrollStateOptions) {
+  if (arrivedTop || scrollTop < headerHeight) {
+    return false;
+  }
+  if (directionUp) {
+    return false;
+  }
+  if (directionDown) {
+    return true;
+  }
+  return currentHidden;
+}
diff --git a/packages/@core/ui-kit/layout-ui/src/hooks/use-layout.ts b/packages/@core/ui-kit/layout-ui/src/hooks/use-layout.ts
index 354fcb44..2f2b82bb 100644
--- a/packages/@core/ui-kit/layout-ui/src/hooks/use-layout.ts
+++ b/packages/@core/ui-kit/layout-ui/src/hooks/use-layout.ts
@@ -29,11 +29,23 @@ export function useLayout(props: VbenLayoutProps) {
   /**
    * 是否为混合导航模式
    */
-  const isMixedNav = computed(() => currentLayout.value === 'mixed-nav');
+  const isMixedNav = computed(
+    () =>
+      currentLayout.value === 'mixed-nav' ||
+      currentLayout.value === 'header-sidebar-nav',
+  );
+
+  /**
+   * 是否为头部混合模式
+   */
+  const isHeaderMixedNav = computed(
+    () => currentLayout.value === 'header-mixed-nav',
+  );
 
   return {
     currentLayout,
     isFullContent,
+    isHeaderMixedNav,
     isHeaderNav,
     isMixedNav,
     isSidebarMixedNav,
diff --git a/packages/@core/ui-kit/layout-ui/src/hooks/use-sidebar-drag.ts b/packages/@core/ui-kit/layout-ui/src/hooks/use-sidebar-drag.ts
new file mode 100644
index 00000000..2138877c
--- /dev/null
+++ b/packages/@core/ui-kit/layout-ui/src/hooks/use-sidebar-drag.ts
@@ -0,0 +1,152 @@
+import { ref } from 'vue';
+
+interface DragOptions {
+  max: number;
+  min: number;
+}
+
+interface DragElements {
+  dragBar: HTMLElement | null;
+  target: HTMLElement | null;
+}
+
+type DragCallback = (newWidth: number) => void;
+
+export function useSidebarDrag() {
+  const isDragging = ref(false);
+  let cleanup: (() => void) | null = null;
+  let dragOverlay: HTMLElement | null = null;
+
+  const startDrag = (
+    e: MouseEvent,
+    options: DragOptions,
+    elements: DragElements,
+    onDrag: DragCallback,
+  ) => {
+    const { min, max } = options;
+    const { dragBar, target } = elements;
+
+    if (isDragging.value || !dragBar || !target) return;
+
+    e.preventDefault();
+    e.stopPropagation();
+
+    isDragging.value = true;
+
+    const startX = e.clientX;
+    const startWidth = target.getBoundingClientRect().width;
+    const startLeft = dragBar.offsetLeft;
+
+    dragBar.classList.add('bg-primary');
+    dragBar.classList.remove('bg-primary/30');
+
+    const dragBarTransition = dragBar.style.transition;
+    const targetTransition = target.style.transition;
+
+    dragBar.style.transition = 'none';
+    target.style.transition = 'none';
+
+    dragOverlay = document.createElement('div');
+    dragOverlay.style.position = 'fixed';
+    dragOverlay.style.inset = '0';
+    dragOverlay.style.zIndex = '9999';
+    dragOverlay.style.cursor = 'col-resize';
+    dragOverlay.style.userSelect = 'none';
+    dragOverlay.style.outline = 'none';
+    dragOverlay.tabIndex = -1;
+    dragOverlay.style.background = 'rgba(0,0,0,0)';
+    document.body.append(dragOverlay);
+
+    const onMouseMove = (moveEvent: MouseEvent) => {
+      if (!isDragging.value || !dragBar || !target) {
+        endDrag();
+        return;
+      }
+
+      const deltaX = moveEvent.clientX - startX;
+      let currentWidth = startWidth + deltaX;
+
+      const isOutOfMin = currentWidth < min;
+      const isOutOfMax = currentWidth > max;
+      const isOutOfBounds = isOutOfMin || isOutOfMax;
+
+      if (isOutOfMin) currentWidth = min;
+      if (isOutOfMax) currentWidth = max;
+
+      const newLeft = startLeft + (currentWidth - startWidth);
+
+      if (dragOverlay)
+        dragOverlay.style.cursor = isOutOfBounds ? 'not-allowed' : 'col-resize';
+
+      dragBar.style.left = `${newLeft}px`;
+
+      if (isOutOfBounds) {
+        dragBar.classList.add('bg-primary/30');
+        dragBar.classList.remove('bg-primary');
+      } else {
+        dragBar.classList.add('bg-primary');
+        dragBar.classList.remove('bg-primary/30');
+      }
+    };
+
+    const onMouseUp = (upEvent: MouseEvent) => {
+      if (!isDragging.value || !dragBar || !target) {
+        endDrag();
+        return;
+      }
+
+      const deltaX = upEvent.clientX - startX;
+      let newWidth = startWidth + deltaX;
+
+      newWidth = Math.min(max, Math.max(min, newWidth));
+
+      dragBar.classList.remove('bg-primary', 'bg-primary/30');
+
+      try {
+        onDrag?.(Math.round(newWidth));
+      } finally {
+        endDrag();
+      }
+    };
+
+    document.addEventListener('mousemove', onMouseMove);
+    document.addEventListener('mouseup', onMouseUp);
+
+    cleanup = () => {
+      if (!cleanup) return;
+
+      document.removeEventListener('mousemove', onMouseMove);
+      document.removeEventListener('mouseup', onMouseUp);
+
+      if (dragBar) {
+        dragBar.style.transition = dragBarTransition;
+        dragBar.style.left = '';
+        dragBar.classList.remove('bg-primary', 'bg-primary/30');
+      }
+
+      if (target) {
+        target.style.transition = targetTransition;
+      }
+
+      if (dragOverlay) {
+        dragOverlay.remove();
+        dragOverlay = null;
+      }
+
+      isDragging.value = false;
+      cleanup = null;
+    };
+  };
+
+  const endDrag = () => {
+    cleanup?.();
+  };
+
+  return {
+    startDrag,
+    endDrag,
+    get isDragging() {
+      return isDragging.value;
+    },
+  };
+}
diff --git a/packages/@core/ui-kit/layout-ui/src/vben-layout.ts b/packages/@core/ui-kit/layout-ui/src/vben-layout.ts
index f7dd39cd..6cbe54f5 100644
--- a/packages/@core/ui-kit/layout-ui/src/vben-layout.ts
+++ b/packages/@core/ui-kit/layout-ui/src/vben-layout.ts
@@ -106,6 +106,11 @@ interface VbenLayoutProps {
    * @default false
    */
   sidebarCollapse?: boolean;
+  /**
+   * 侧边菜单折叠按钮
+   * @default true
+   */
+  sidebarCollapsedButton?: boolean;
   /**
    * 侧边菜单是否折叠时，是否显示title
    * @default true
@@ -121,11 +126,24 @@ interface VbenLayoutProps {
    * @default 48
    */
   sidebarExtraCollapsedWidth?: number;
+  /**
+   * 扩展区域extra-title的高度
+   */
+  sidebarExtraTitleHeight?: number;
+  /**
+   * 侧边菜单折叠按钮是否固定
+   * @default true
+   */
+  sidebarFixedButton?: boolean;
   /**
    * 侧边栏是否隐藏
    * @default false
    */
   sidebarHidden?: boolean;
+  /**
+   * 侧边栏 Logo 区域是否显示
+   */
+  sidebarLogoVisible: boolean;
   /**
    * 混合侧边栏宽度
    * @default 80
@@ -136,6 +154,11 @@ interface VbenLayoutProps {
    * @default dark
    */
   sidebarTheme?: ThemeModeType;
+  /**
+   * 侧边栏子栏
+   * @default dark
+   */
+  sidebarThemeSub?: ThemeModeType;
   /**
    * 侧边栏宽度
    * @default 210
diff --git a/packages/@core/ui-kit/layout-ui/src/vben-layout.vue b/packages/@core/ui-kit/layout-ui/src/vben-layout.vue
index fe9b1d85..cb91b8a1 100644
--- a/packages/@core/ui-kit/layout-ui/src/vben-layout.vue
+++ b/packages/@core/ui-kit/layout-ui/src/vben-layout.vue
@@ -1,7 +1,8 @@
 <script setup lang="ts">
+import type { CSSProperties } from 'vue';
+
 import type { VbenLayoutProps } from './vben-layout';
 
-import type { CSSProperties } from 'vue';
 import { computed, ref, watch } from 'vue';
 
 import {
@@ -9,11 +10,14 @@ import {
   useLayoutFooterStyle,
   useLayoutHeaderStyle,
 } from '@vben-core/composables';
-import { Menu } from '@vben-core/icons';
+import { IconifyIcon } from '@vben-core/icons';
 import { VbenIconButton } from '@vben-core/shadcn-ui';
-import { ELEMENT_ID_MAIN_CONTENT } from '@vben-core/shared/constants';
+import {
+  ELEMENT_ID_LAYOUT_SCROLL,
+  ELEMENT_ID_MAIN_CONTENT,
+} from '@vben-core/shared/constants';
 
-import { useMouse, useScroll, useThrottleFn } from '@vueuse/core';
+import { useEventListener, useScroll } from '@vueuse/core';
 
 import {
   LayoutContent,
@@ -22,6 +26,7 @@ import {
   LayoutSidebar,
   LayoutTabbar,
 } from './components';
+import { resolveHeaderHiddenOnScroll } from './header-scroll-state';
 import { useLayout } from './hooks/use-layout';
 
 interface Props extends VbenLayoutProps {}
@@ -48,11 +53,14 @@ const props = withDefaults(defineProps<Props>(), {
   headerVisible: true,
   isMobile: false,
   layout: 'sidebar-nav',
+  sidebarCollapsedButton: true,
   sidebarCollapseShowTitle: false,
   sidebarExtraCollapsedWidth: 60,
+  sidebarFixedButton: true,
   sidebarHidden: false,
   sidebarMixedWidth: 80,
   sidebarTheme: 'dark',
+  sidebarThemeSub: 'dark',
   sidebarWidth: 180,
   sideCollapseWidth: 60,
   tabbarEnable: true,
@@ -60,33 +68,50 @@ const props = withDefaults(defineProps<Props>(), {
   zIndex: 200,
 });
 
-const emit = defineEmits<{ sideMouseLeave: []; toggleSidebar: [] }>();
-const sidebarCollapse = defineModel<boolean>('sidebarCollapse');
+const emit = defineEmits<{
+  sideMouseLeave: [];
+  toggleSidebar: [];
+  'update:sidebarWidth': [value: number];
+}>();
+const sidebarDraggable = defineModel<boolean>('sidebarDraggable', {
+  default: true,
+});
+const sidebarCollapse = defineModel<boolean>('sidebarCollapse', {
+  default: false,
+});
 const sidebarExtraVisible = defineModel<boolean>('sidebarExtraVisible');
-const sidebarExtraCollapse = defineModel<boolean>('sidebarExtraCollapse');
-const sidebarExpandOnHover = defineModel<boolean>('sidebarExpandOnHover');
+const sidebarExtraCollapse = defineModel<boolean>('sidebarExtraCollapse', {
+  default: false,
+});
+const sidebarExpandOnHover = defineModel<boolean>('sidebarExpandOnHover', {
+  default: false,
+});
 const sidebarEnable = defineModel<boolean>('sidebarEnable', { default: true });
 
+const HEADER_TRIGGER_DISTANCE = 12;
+
 // side是否处于hover状态展开菜单中
 const sidebarExpandOnHovering = ref(false);
 const headerIsHidden = ref(false);
-const contentRef = ref();
+const mainRef = ref<HTMLElement | null>(null);
+const contentRef = ref<HTMLElement | null>(null);
+let lastMouseY: null | number = null;
 
 const {
   arrivedState,
   directions,
-  isScrolling,
   y: scrollY,
-} = useScroll(document);
+} = useScroll(contentRef, {
+  onScroll: handleLayoutScroll,
+});
 
 const { setLayoutHeaderHeight } = useLayoutHeaderStyle();
 const { setLayoutFooterHeight } = useLayoutFooterStyle();
 
-const { y: mouseY } = useMouse({ target: contentRef, type: 'client' });
-
 const {
   currentLayout,
   isFullContent,
+  isHeaderMixedNav,
   isHeaderNav,
   isMixedNav,
   isSidebarMixedNav,
@@ -95,7 +120,19 @@ const {
 /**
  * 顶栏是否自动隐藏
  */
-const isHeaderAutoMode = computed(() => props.headerMode === 'auto');
+const isHeaderAutoActive = computed(
+  () =>
+    props.headerMode === 'auto' && !isMixedNav.value && !isFullContent.value,
+);
+
+const isHeaderOverlayModeActive = computed(
+  () =>
+    (props.headerMode === 'auto' || props.headerMode === 'auto-scroll') &&
+    !isMixedNav.value &&
+    !isFullContent.value,
+);
+
+const headerHasShadow = computed(() => scrollY.value > 20);
 
 const headerWrapperHeight = computed(() => {
   let height = 0;
@@ -109,11 +146,16 @@ const headerWrapperHeight = computed(() => {
 });
 
 const getSideCollapseWidth = computed(() => {
-  const { sidebarCollapseShowTitle, sidebarMixedWidth, sideCollapseWidth } =
-    props;
+  const {
+    sidebarCollapseShowTitle,
+    sidebarExtraCollapsedWidth,
+    sideCollapseWidth,
+  } = props;
 
-  return sidebarCollapseShowTitle || isSidebarMixedNav.value
-    ? sidebarMixedWidth
+  return sidebarCollapseShowTitle ||
+    isSidebarMixedNav.value ||
+    isHeaderMixedNav.value
+    ? sidebarExtraCollapsedWidth
     : sideCollapseWidth;
 });
 
@@ -145,12 +187,15 @@ const getSidebarWidth = computed(() => {
 
   if (
     !sidebarEnableState.value ||
-    (sidebarHidden && !isSidebarMixedNav.value && !isMixedNav.value)
+    (sidebarHidden &&
+      !isSidebarMixedNav.value &&
+      !isMixedNav.value &&
+      !isHeaderMixedNav.value)
   ) {
     return width;
   }
 
-  if (isSidebarMixedNav.value && !isMobile) {
+  if ((isHeaderMixedNav.value || isSidebarMixedNav.value) && !isMobile) {
     width = sidebarMixedWidth;
   } else if (sidebarCollapse.value) {
     width = isMobile ? 0 : getSideCollapseWidth.value;
@@ -176,7 +221,9 @@ const isSideMode = computed(
   () =>
     currentLayout.value === 'mixed-nav' ||
     currentLayout.value === 'sidebar-mixed-nav' ||
-    currentLayout.value === 'sidebar-nav',
+    currentLayout.value === 'sidebar-nav' ||
+    currentLayout.value === 'header-mixed-nav' ||
+    currentLayout.value === 'header-sidebar-nav',
 );
 
 /**
@@ -208,19 +255,18 @@ const mainStyle = computed(() => {
     headerFixed.value &&
     currentLayout.value !== 'header-nav' &&
     currentLayout.value !== 'mixed-nav' &&
+    currentLayout.value !== 'header-sidebar-nav' &&
     showSidebar.value &&
     !props.isMobile
   ) {
     // fixed模式下生效
     const isSideNavEffective =
-      isSidebarMixedNav.value &&
+      (isSidebarMixedNav.value || isHeaderMixedNav.value) &&
       sidebarExpandOnHover.value &&
       sidebarExtraVisible.value;
 
     if (isSideNavEffective) {
-      const sideCollapseWidth = sidebarCollapse.value
-        ? getSideCollapseWidth.value
-        : props.sidebarMixedWidth;
+      const sideCollapseWidth = props.sidebarMixedWidth;
       const sideWidth = sidebarExtraCollapse.value
         ? props.sidebarExtraCollapsedWidth
         : props.sidebarWidth;
@@ -229,10 +275,14 @@ const mainStyle = computed(() => {
       sidebarAndExtraWidth = `${sideCollapseWidth + sideWidth}px`;
       width = `calc(100% - ${sidebarAndExtraWidth})`;
     } else {
-      sidebarAndExtraWidth =
-        sidebarExpandOnHovering.value && !sidebarExpandOnHover.value
-          ? `${getSideCollapseWidth.value}px`
-          : `${getSidebarWidth.value}px`;
+      let sidebarWidth = getSidebarWidth.value;
+      if (sidebarExpandOnHovering.value && !sidebarExpandOnHover.value) {
+        sidebarWidth =
+          isSidebarMixedNav.value || isHeaderMixedNav.value
+            ? props.sidebarMixedWidth
+            : getSideCollapseWidth.value;
+      }
+      sidebarAndExtraWidth = `${sidebarWidth}px`;
       width = `calc(100% - ${sidebarAndExtraWidth})`;
     }
   }
@@ -244,7 +294,7 @@ const mainStyle = computed(() => {
 
 // 计算 tabbar 的样式
 const tabbarStyle = computed((): CSSProperties => {
-  let width = '';
+  let width: string;
   let marginLeft = 0;
 
   // 如果不是混合导航，tabbar 的宽度为 100%
@@ -274,18 +324,38 @@ const tabbarStyle = computed((): CSSProperties => {
   };
 });
 
-const contentStyle = computed((): CSSProperties => {
+const layoutScrollStyle = computed((): CSSProperties => {
   const fixed = headerFixed.value;
 
-  const { footerEnable, footerFixed, footerHeight } = props;
+  if (!fixed) {
+    return {
+      marginTop: 0,
+      paddingTop: 0,
+    };
+  }
+
+  if (isHeaderOverlayModeActive.value) {
+    return {
+      marginTop: 0,
+      paddingTop: isFullContent.value ? 0 : `${headerWrapperHeight.value}px`,
+    };
+  }
+
   return {
     marginTop:
       fixed &&
       !isFullContent.value &&
       !headerIsHidden.value &&
-      (!isHeaderAutoMode.value || scrollY.value < headerWrapperHeight.value)
+      (!isHeaderAutoActive.value || scrollY.value < headerWrapperHeight.value)
         ? `${headerWrapperHeight.value}px`
         : 0,
+    paddingTop: 0,
+  };
+});
+
+const contentStyle = computed((): CSSProperties => {
+  const { footerEnable, footerFixed, footerHeight } = props;
+  return {
     paddingBottom: `${footerEnable && footerFixed ? footerHeight : 0}px`,
   };
 });
@@ -298,15 +368,19 @@ const headerZIndex = computed(() => {
 
 const headerWrapperStyle = computed((): CSSProperties => {
   const fixed = headerFixed.value;
+  const hidden = headerIsHidden.value || isFullContent.value;
+
   return {
     height: isFullContent.value ? '0' : `${headerWrapperHeight.value}px`,
     left: isMixedNav.value ? 0 : mainStyle.value.sidebarAndExtraWidth,
     position: fixed ? 'fixed' : 'static',
-    top:
-      headerIsHidden.value || isFullContent.value
-        ? `-${headerWrapperHeight.value}px`
-        : 0,
+    top: 0,
+    transform: fixed
+      ? `translate3d(0, ${hidden ? '-100%' : '0'}, 0)`
+      : undefined,
+    transitionDuration: fixed ? undefined : '0ms',
     width: mainStyle.value.width,
+    willChange: fixed ? 'transform' : undefined,
     'z-index': headerZIndex.value,
   };
 });
@@ -337,6 +411,17 @@ const maskStyle = computed((): CSSProperties => {
   return { zIndex: props.zIndex };
 });
 
+/**
+ * 侧边栏 Logo 区域是否显示
+ */
+const sidebarHeaderHeight = computed(() => {
+  if (isMixedNav.value || !props.sidebarLogoVisible) {
+    return 0;
+  }
+
+  return props.headerHeight;
+});
+
 const showHeaderToggleButton = computed(() => {
   return (
     props.isMobile ||
@@ -384,67 +469,76 @@ watch(
   },
 );
 
-{
-  const mouseMove = () => {
-    mouseY.value > headerWrapperHeight.value
-      ? (headerIsHidden.value = true)
-      : (headerIsHidden.value = false);
-  };
-  watch(
-    [() => props.headerMode, () => mouseY.value],
-    () => {
-      if (!isHeaderAutoMode.value || isMixedNav.value || isFullContent.value) {
-        if (props.headerMode !== 'auto-scroll') {
-          headerIsHidden.value = false;
-        }
-        return;
-      }
-      headerIsHidden.value = true;
-      mouseMove();
-    },
-    {
-      immediate: true,
-    },
-  );
+watch(
+  [() => props.headerMode, () => isMixedNav.value, () => isFullContent.value],
+  () => {
+    headerIsHidden.value = false;
+  },
+);
+
+useEventListener(mainRef, 'mousemove', handleHeaderMouseMove, {
+  passive: true,
+});
+useEventListener(mainRef, 'wheel', handleLayoutWheel, {
+  passive: true,
+});
+
+function handleLayoutWheel(event: WheelEvent) {
+  lastMouseY = event.clientY;
 }
 
-{
-  const checkHeaderIsHidden = useThrottleFn((top, bottom, topArrived) => {
-    if (scrollY.value < headerWrapperHeight.value) {
-      headerIsHidden.value = false;
-      return;
-    }
-    if (topArrived) {
-      headerIsHidden.value = false;
-      return;
-    }
+function handleHeaderMouseMove(event: MouseEvent) {
+  lastMouseY = event.clientY;
 
-    if (top) {
-      headerIsHidden.value = false;
-    } else if (bottom) {
-      headerIsHidden.value = true;
-    }
-  }, 300);
+  if (!isHeaderAutoActive.value) {
+    return;
+  }
 
-  watch(
-    () => scrollY.value,
-    () => {
-      if (
-        props.headerMode !== 'auto-scroll' ||
-        isMixedNav.value ||
-        isFullContent.value
-      ) {
-        return;
-      }
-      if (isScrolling.value) {
-        checkHeaderIsHidden(
-          directions.top,
-          directions.bottom,
-          arrivedState.top,
-        );
-      }
-    },
-  );
+  updateHeaderVisibilityFromMouse(lastMouseY);
+}
+
+function updateHeaderVisibilityFromMouse(mouseY: null | number) {
+  if (arrivedState.top || scrollY.value < headerWrapperHeight.value) {
+    headerIsHidden.value = false;
+    return;
+  }
+
+  if (mouseY === null) {
+    return;
+  }
+
+  const isInTriggerZone = mouseY <= HEADER_TRIGGER_DISTANCE;
+  const isInHeaderZone =
+    !headerIsHidden.value && mouseY <= headerWrapperHeight.value;
+
+  headerIsHidden.value = !(isInTriggerZone || isInHeaderZone);
+}
+
+function handleLayoutScroll() {
+  if (isHeaderAutoActive.value) {
+    updateHeaderVisibilityFromMouse(lastMouseY);
+    return;
+  }
+
+  if (
+    props.headerMode !== 'auto-scroll' ||
+    isMixedNav.value ||
+    isFullContent.value
+  ) {
+    return;
+  }
+  resolveHeaderVisibilityOnScroll();
+}
+
+function resolveHeaderVisibilityOnScroll() {
+  headerIsHidden.value = resolveHeaderHiddenOnScroll({
+    arrivedTop: arrivedState.top,
+    currentHidden: headerIsHidden.value,
+    directionDown: directions.bottom,
+    directionUp: directions.top,
+    headerHeight: headerWrapperHeight.value,
+    scrollTop: scrollY.value,
+  });
 }
 
 function handleClickMask() {
@@ -460,36 +554,47 @@ function handleHeaderToggle() {
 }
 
 const idMainContent = ELEMENT_ID_MAIN_CONTENT;
+const idLayoutScroll = ELEMENT_ID_LAYOUT_SCROLL;
+const idLayoutStaticHeader = `${ELEMENT_ID_LAYOUT_SCROLL}__static_header`;
+const layoutStaticHeaderTarget = `#${idLayoutStaticHeader}`;
 </script>
 
 <template>
-  <div class="relative flex min-h-full w-full">
+  <div class="relative flex h-full min-h-0 w-full overflow-hidden">
     <LayoutSidebar
       v-if="sidebarEnableState"
+      v-model:draggable="sidebarDraggable"
       v-model:collapse="sidebarCollapse"
       v-model:expand-on-hover="sidebarExpandOnHover"
       v-model:expand-on-hovering="sidebarExpandOnHovering"
       v-model:extra-collapse="sidebarExtraCollapse"
       v-model:extra-visible="sidebarExtraVisible"
+      :show-collapse-button="sidebarCollapsedButton"
+      :show-fixed-button="sidebarFixedButton"
       :collapse-width="getSideCollapseWidth"
       :dom-visible="!isMobile"
       :extra-width="sidebarExtraWidth"
       :fixed-extra="sidebarExpandOnHover"
-      :header-height="isMixedNav ? 0 : headerHeight"
-      :is-sidebar-mixed="isSidebarMixedNav"
+      :header-height="sidebarHeaderHeight"
+      :extra-title-height="
+        isSidebarMixedNav || isHeaderMixedNav ? sidebarExtraTitleHeight : 0
+      "
+      :is-sidebar-mixed="isSidebarMixedNav || isHeaderMixedNav"
       :margin-top="sidebarMarginTop"
       :mixed-width="sidebarMixedWidth"
       :show="showSidebar"
       :theme="sidebarTheme"
+      :theme-sub="sidebarThemeSub"
       :width="getSidebarWidth"
       :z-index="sidebarZIndex"
       @leave="() => emit('sideMouseLeave')"
+      @update:width="(val) => emit('update:sidebarWidth', val)"
     >
-      <template v-if="isSideMode && !isMixedNav" #logo>
+      <template v-if="isSideMode && !isMixedNav && sidebarLogoVisible" #logo>
         <slot name="logo"></slot>
       </template>
 
-      <template v-if="isSidebarMixedNav">
+      <template v-if="isSidebarMixedNav || isHeaderMixedNav">
         <slot name="mixed-menu"></slot>
       </template>
       <template v-else>
@@ -505,91 +610,102 @@ const idMainContent = ELEMENT_ID_MAIN_CONTENT;
     </LayoutSidebar>
 
     <div
-      ref="contentRef"
-      class="flex flex-1 flex-col overflow-hidden transition-all duration-300 ease-in"
+      ref="mainRef"
+      class="relative flex min-h-0 flex-1 flex-col overflow-hidden transition-all duration-300 ease-in"
     >
+      <Teleport defer :disabled="headerFixed" :to="layoutStaticHeaderTarget">
+        <div
+          :class="[
+            {
+              'shadow-[0_16px_24px_hsl(var(--background))]': headerHasShadow,
+            },
+            SCROLL_FIXED_CLASS,
+          ]"
+          :style="headerWrapperStyle"
+          class="shrink-0 overflow-hidden transition-[transform,left,width] duration-200"
+        >
+          <LayoutHeader
+            v-if="headerVisible"
+            :full-width="!isSideMode"
+            :height="headerHeight"
+            :is-mobile="isMobile"
+            :show="!isFullContent && !headerHidden"
+            :sidebar-width="sidebarWidth"
+            :theme="headerTheme"
+            :width="mainStyle.width"
+            :z-index="headerZIndex"
+            :logo-visible="sidebarLogoVisible"
+          >
+            <template v-if="showHeaderLogo" #logo>
+              <slot name="logo"></slot>
+            </template>
+
+            <template #toggle-button>
+              <VbenIconButton
+                v-if="showHeaderToggleButton"
+                class="my-0 mr-1 rounded-md"
+                @click="handleHeaderToggle"
+              >
+                <IconifyIcon v-if="showSidebar" icon="ep:fold" />
+                <IconifyIcon v-else icon="ep:expand" />
+              </VbenIconButton>
+            </template>
+            <slot name="header"></slot>
+          </LayoutHeader>
+
+          <LayoutTabbar
+            v-if="tabbarEnable"
+            :height="tabbarHeight"
+            :style="tabbarStyle"
+          >
+            <slot name="tabbar"></slot>
+          </LayoutTabbar>
+        </div>
+      </Teleport>
+
       <div
-        :class="[
-          {
-            'shadow-[0_16px_24px_hsl(var(--background))]': scrollY > 20,
-          },
-          SCROLL_FIXED_CLASS,
-        ]"
-        :style="headerWrapperStyle"
-        class="overflow-hidden transition-all duration-200"
+        :id="idLayoutScroll"
+        ref="contentRef"
+        :style="layoutScrollStyle"
+        class="flex min-h-0 flex-1 flex-col overflow-x-hidden overflow-y-auto"
       >
-        <LayoutHeader
-          v-if="headerVisible"
-          :full-width="!isSideMode"
-          :height="headerHeight"
-          :is-mobile="isMobile"
-          :show="!isFullContent && !headerHidden"
-          :sidebar-width="sidebarWidth"
-          :theme="headerTheme"
-          :width="mainStyle.width"
-          :z-index="headerZIndex"
-        >
-          <template v-if="showHeaderLogo" #logo>
-            <slot name="logo"></slot>
-          </template>
+        <div :id="idLayoutStaticHeader" class="contents"></div>
 
-          <template #toggle-button>
-            <VbenIconButton
-              v-if="showHeaderToggleButton"
-              class="my-0 mr-1 rounded-md"
-              @click="handleHeaderToggle"
-            >
-              <Menu class="size-4" />
-            </VbenIconButton>
-          </template>
-          <slot name="header"></slot>
-        </LayoutHeader>
-
-        <LayoutTabbar
-          v-if="tabbarEnable"
-          :height="tabbarHeight"
-          :style="tabbarStyle"
+        <LayoutContent
+          :id="idMainContent"
+          :content-compact="contentCompact"
+          :content-compact-width="contentCompactWidth"
+          :padding="contentPadding"
+          :padding-bottom="contentPaddingBottom"
+          :padding-left="contentPaddingLeft"
+          :padding-right="contentPaddingRight"
+          :padding-top="contentPaddingTop"
+          :style="contentStyle"
         >
-          <slot name="tabbar"></slot>
-        </LayoutTabbar>
+          <slot name="content"></slot>
+
+          <template #overlay>
+            <slot name="content-overlay"></slot>
+          </template>
+        </LayoutContent>
+
+        <LayoutFooter
+          v-if="footerEnable"
+          :fixed="footerFixed"
+          :height="footerHeight"
+          :show="!isFullContent"
+          :width="footerWidth"
+          :z-index="zIndex"
+        >
+          <slot name="footer"></slot>
+        </LayoutFooter>
       </div>
-
-      <!-- </div> -->
-      <LayoutContent
-        :id="idMainContent"
-        :content-compact="contentCompact"
-        :content-compact-width="contentCompactWidth"
-        :padding="contentPadding"
-        :padding-bottom="contentPaddingBottom"
-        :padding-left="contentPaddingLeft"
-        :padding-right="contentPaddingRight"
-        :padding-top="contentPaddingTop"
-        :style="contentStyle"
-        class="transition-[margin-top] duration-200"
-      >
-        <slot name="content"></slot>
-
-        <template #overlay>
-          <slot name="content-overlay"></slot>
-        </template>
-      </LayoutContent>
-
-      <LayoutFooter
-        v-if="footerEnable"
-        :fixed="footerFixed"
-        :height="footerHeight"
-        :show="!isFullContent"
-        :width="footerWidth"
-        :z-index="zIndex"
-      >
-        <slot name="footer"></slot>
-      </LayoutFooter>
     </div>
     <slot name="extra"></slot>
     <div
       v-if="maskVisible"
       :style="maskStyle"
-      class="bg-overlay fixed left-0 top-0 h-full w-full transition-[background-color] duration-200"
+      class="fixed top-0 left-0 size-full bg-overlay transition-[background-color] duration-200"
       @click="handleClickMask"
     ></div>
   </div>
diff --git a/packages/@core/ui-kit/layout-ui/tailwind.config.mjs b/packages/@core/ui-kit/layout-ui/tailwind.config.mjs
deleted file mode 100644
index f17f556f..00000000
--- a/packages/@core/ui-kit/layout-ui/tailwind.config.mjs
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from '@vben/tailwind-config';
diff --git a/packages/@core/ui-kit/layout-ui/tsdown.config.ts b/packages/@core/ui-kit/layout-ui/tsdown.config.ts
new file mode 100644
index 00000000..43e8cf1c
--- /dev/null
+++ b/packages/@core/ui-kit/layout-ui/tsdown.config.ts
@@ -0,0 +1,21 @@
+import { defineConfig } from 'tsdown';
+import Vue from 'unplugin-vue/rolldown';
+
+export default defineConfig({
+  clean: true,
+  deps: {
+    skipNodeModulesBundle: true,
+  },
+  dts: {
+    vue: true,
+  },
+  entry: ['src/index.ts'],
+  format: ['esm'],
+  outExtensions: () => ({
+    dts: '.d.ts',
+    js: '.mjs',
+  }),
+  platform: 'neutral',
+  plugins: [Vue({ isProduction: true })],
+  unbundle: true,
+});
diff --git a/packages/@core/ui-kit/menu-ui/build.config.ts b/packages/@core/ui-kit/menu-ui/build.config.ts
deleted file mode 100644
index 1ff78fab..00000000
--- a/packages/@core/ui-kit/menu-ui/build.config.ts
+++ /dev/null
@@ -1,26 +0,0 @@
-import { defineBuildConfig } from 'unbuild';
-
-export default defineBuildConfig({
-  clean: true,
-  declaration: true,
-  entries: [
-    {
-      builder: 'mkdist',
-      input: './src',
-      pattern: ['**/*'],
-    },
-    {
-      builder: 'mkdist',
-      input: './src',
-      loaders: ['vue'],
-      pattern: ['**/*.vue'],
-    },
-    {
-      builder: 'mkdist',
-      format: 'esm',
-      input: './src',
-      loaders: ['js'],
-      pattern: ['**/*.ts'],
-    },
-  ],
-});
diff --git a/packages/@core/ui-kit/menu-ui/package.json b/packages/@core/ui-kit/menu-ui/package.json
index 4c833cb8..5290fb1a 100644
--- a/packages/@core/ui-kit/menu-ui/package.json
+++ b/packages/@core/ui-kit/menu-ui/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vben-core/menu-ui",
-  "version": "5.5.1",
+  "version": "5.7.0",
   "homepage": "https://github.com/vbenjs/vue-vben-admin",
   "bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
   "repository": {
@@ -11,7 +11,7 @@
   "license": "MIT",
   "type": "module",
   "scripts": {
-    "build": "pnpm unbuild",
+    "build": "pnpm exec tsdown",
     "prepublishOnly": "npm run build"
   },
   "files": [
@@ -22,27 +22,36 @@
   ],
   "main": "./dist/index.mjs",
   "module": "./dist/index.mjs",
+  "types": "./dist/index.d.ts",
   "exports": {
     ".": {
       "types": "./src/index.ts",
       "development": "./src/index.ts",
+      "production": "./src/index.ts",
       "default": "./dist/index.mjs"
     }
   },
   "publishConfig": {
     "exports": {
       ".": {
+        "types": "./dist/index.d.ts",
         "default": "./dist/index.mjs"
       }
     }
   },
   "dependencies": {
     "@vben-core/composables": "workspace:*",
+    "@vben-core/design": "workspace:*",
     "@vben-core/icons": "workspace:*",
     "@vben-core/shadcn-ui": "workspace:*",
     "@vben-core/shared": "workspace:*",
     "@vben-core/typings": "workspace:*",
     "@vueuse/core": "catalog:",
+    "qs": "catalog:",
     "vue": "catalog:"
+  },
+  "devDependencies": {
+    "@types/qs": "catalog:",
+    "unplugin-vue": "catalog:"
   }
 }
diff --git a/packages/@core/ui-kit/menu-ui/postcss.config.mjs b/packages/@core/ui-kit/menu-ui/postcss.config.mjs
deleted file mode 100644
index 3d807045..00000000
--- a/packages/@core/ui-kit/menu-ui/postcss.config.mjs
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from '@vben/tailwind-config/postcss';
diff --git a/packages/@core/ui-kit/menu-ui/src/components/index.ts b/packages/@core/ui-kit/menu-ui/src/components/index.ts
index 7c697dc1..ce06710b 100644
--- a/packages/@core/ui-kit/menu-ui/src/components/index.ts
+++ b/packages/@core/ui-kit/menu-ui/src/components/index.ts
@@ -1,4 +1,4 @@
-export { default as Menu } from './menu.vue';
 export { default as MenuBadge } from './menu-badge.vue';
 export { default as MenuItem } from './menu-item.vue';
+export { default as Menu } from './menu.vue';
 export { default as SubMenu } from './sub-menu.vue';
diff --git a/packages/@core/ui-kit/menu-ui/src/components/menu-badge-dot.vue b/packages/@core/ui-kit/menu-ui/src/components/menu-badge-dot.vue
index 823cbd74..baf056a9 100644
--- a/packages/@core/ui-kit/menu-ui/src/components/menu-badge-dot.vue
+++ b/packages/@core/ui-kit/menu-ui/src/components/menu-badge-dot.vue
@@ -16,7 +16,7 @@ withDefaults(defineProps<Props>(), {
     <span
       :class="dotClass"
       :style="dotStyle"
-      class="absolute inline-flex h-full w-full animate-ping rounded-full opacity-75"
+      class="absolute inline-flex size-full animate-ping rounded-full opacity-75"
     >
     </span>
     <span
diff --git a/packages/@core/ui-kit/menu-ui/src/components/menu-badge.vue b/packages/@core/ui-kit/menu-ui/src/components/menu-badge.vue
index b1dd94c2..9a329c50 100644
--- a/packages/@core/ui-kit/menu-ui/src/components/menu-badge.vue
+++ b/packages/@core/ui-kit/menu-ui/src/components/menu-badge.vue
@@ -49,7 +49,7 @@ const badgeStyle = computed(() => {
       v-else
       :class="badgeClass"
       :style="badgeStyle"
-      class="text-primary-foreground flex-center rounded-xl px-1.5 py-0.5 text-[10px]"
+      class="flex-center rounded-xl px-1.5 py-0.5 text-[10px] text-primary-foreground"
     >
       {{ badge }}
     </div>
diff --git a/packages/@core/ui-kit/menu-ui/src/components/menu-item.vue b/packages/@core/ui-kit/menu-ui/src/components/menu-item.vue
index 691c25cd..01702642 100644
--- a/packages/@core/ui-kit/menu-ui/src/components/menu-item.vue
+++ b/packages/@core/ui-kit/menu-ui/src/components/menu-item.vue
@@ -5,6 +5,9 @@ import { computed, onBeforeUnmount, onMounted, reactive, useSlots } from 'vue';
 
 import { useNamespace } from '@vben-core/composables';
 import { VbenIcon, VbenTooltip } from '@vben-core/shadcn-ui';
+import { isHttpUrl } from '@vben-core/shared/utils';
+
+import qs from 'qs';
 
 import { MenuBadge } from '../components';
 import { useMenu, useMenuContext, useSubMenuContext } from '../hooks';
@@ -31,8 +34,10 @@ const menuIcon = computed(() =>
   active.value ? props.activeIcon || props.icon : props.icon,
 );
 
+const isHttp = computed(() => isHttpUrl(item.parentPaths.at(-1)));
+
 const isTopLevelMenuItem = computed(
-  () => parentMenu.value?.type.name === 'Menu',
+  () => parentMenu.value?.type.name === 'MenuUI',
 );
 
 const collapseShowTitle = computed(
@@ -54,6 +59,7 @@ const item: MenuItemRegistered = reactive({
   active,
   parentPaths: parentPaths.value,
   path: props.path || '',
+  query: props.query,
 });
 
 /**
@@ -81,42 +87,52 @@ onBeforeUnmount(() => {
 });
 </script>
 <template>
-  <li
-    :class="[
-      rootMenu.theme,
-      b(),
-      is('active', active),
-      is('disabled', disabled),
-      is('collapse-show-title', collapseShowTitle),
-    ]"
-    role="menuitem"
-    @click.stop="handleClick"
+  <router-link
+    v-slot="{ href }"
+    custom
+    :to="
+      (item.parentPaths.at(-1) ?? '') +
+      (item?.query ? `?${qs.stringify(item?.query)}` : '')
+    "
   >
-    <VbenTooltip
-      v-if="showTooltip"
-      :content-class="[rootMenu.theme]"
-      side="right"
+    <a
+      :href="isHttp ? item.parentPaths.at(-1) : href"
+      :class="[
+        rootMenu.theme,
+        b(),
+        is('active', active),
+        is('disabled', disabled),
+        is('collapse-show-title', collapseShowTitle),
+      ]"
+      role="menuitem"
+      @click.prevent.stop="handleClick"
     >
-      <template #trigger>
-        <div :class="[nsMenu.be('tooltip', 'trigger')]">
-          <VbenIcon :class="nsMenu.e('icon')" :icon="menuIcon" fallback />
-          <slot></slot>
-          <span v-if="collapseShowTitle" :class="nsMenu.e('name')">
-            <slot name="title"></slot>
-          </span>
-        </div>
-      </template>
-      <slot name="title"></slot>
-    </VbenTooltip>
-    <div v-show="!showTooltip" :class="[e('content')]">
-      <MenuBadge
-        v-if="rootMenu.props.mode !== 'horizontal'"
-        class="right-2"
-        v-bind="props"
-      />
-      <VbenIcon :class="nsMenu.e('icon')" :icon="menuIcon" />
-      <slot></slot>
-      <slot name="title"></slot>
-    </div>
-  </li>
+      <VbenTooltip
+        v-if="showTooltip"
+        :content-class="[rootMenu.theme]"
+        side="right"
+      >
+        <template #trigger>
+          <div :class="[nsMenu.be('tooltip', 'trigger')]">
+            <VbenIcon :class="nsMenu.e('icon')" :icon="menuIcon" fallback />
+            <slot></slot>
+            <span v-if="collapseShowTitle" :class="nsMenu.e('name')">
+              <slot name="title"></slot>
+            </span>
+          </div>
+        </template>
+        <slot name="title"></slot>
+      </VbenTooltip>
+      <div v-show="!showTooltip" :class="[e('content')]">
+        <MenuBadge
+          v-if="rootMenu.props.mode !== 'horizontal'"
+          class="right-2"
+          v-bind="props"
+        />
+        <VbenIcon :class="nsMenu.e('icon')" :icon="menuIcon" />
+        <slot></slot>
+        <slot name="title"></slot>
+      </div>
+    </a>
+  </router-link>
 </template>
diff --git a/packages/@core/ui-kit/menu-ui/src/components/menu.vue b/packages/@core/ui-kit/menu-ui/src/components/menu.vue
index ea7a14c0..5d9f5780 100644
--- a/packages/@core/ui-kit/menu-ui/src/components/menu.vue
+++ b/packages/@core/ui-kit/menu-ui/src/components/menu.vue
@@ -1,6 +1,8 @@
 <script lang="ts" setup>
 import type { UseResizeObserverReturn } from '@vueuse/core';
 
+import type { SetupContext, VNodeArrayChildren } from 'vue';
+
 import type {
   MenuItemClicked,
   MenuItemRegistered,
@@ -15,14 +17,12 @@ import {
   ref,
   toRef,
   useSlots,
-  type VNodeArrayChildren,
   watch,
   watchEffect,
 } from 'vue';
 
 import { useNamespace } from '@vben-core/composables';
 import { Ellipsis } from '@vben-core/icons';
-import { isHttpUrl } from '@vben-core/shared/utils';
 
 import { useResizeObserver } from '@vueuse/core';
 
@@ -31,12 +31,13 @@ import {
   createSubMenuContext,
   useMenuStyle,
 } from '../hooks';
+import { useMenuScroll } from '../hooks/use-menu-scroll';
 import { flattedChildren } from '../utils';
 import SubMenu from './sub-menu.vue';
 
 interface Props extends MenuProps {}
 
-defineOptions({ name: 'Menu' });
+defineOptions({ name: 'MenuUI' });
 
 const props = withDefaults(defineProps<Props>(), {
   accordion: true,
@@ -44,6 +45,7 @@ const props = withDefaults(defineProps<Props>(), {
   mode: 'vertical',
   rounded: true,
   theme: 'dark',
+  scrollToActive: false,
 });
 
 const emit = defineEmits<{
@@ -54,7 +56,7 @@ const emit = defineEmits<{
 
 const { b, is } = useNamespace('menu');
 const menuStyle = useMenuStyle();
-const slots = useSlots();
+const slots: SetupContext['slots'] = useSlots();
 const menu = ref<HTMLUListElement>();
 const sliceIndex = ref(-1);
 const openedMenus = ref<MenuProvider['openedMenus']>(
@@ -206,15 +208,19 @@ function handleResize() {
   isFirstTimeRender = false;
 }
 
-function getActivePaths() {
-  const activeItem = activePath.value && items.value[activePath.value];
+const enableScroll = computed(
+  () => props.scrollToActive && props.mode === 'vertical' && !props.collapse,
+);
 
-  if (!activeItem || props.mode === 'horizontal' || props.collapse) {
-    return [];
-  }
+useMenuScroll(activePath, {
+  enable: enableScroll,
+  delay: 320,
+});
 
-  return activeItem.parentPaths;
-}
+// 监听 activePath 变化，自动滚动到激活项
+// watch(activePath, () => {
+//   scrollToActiveItem();
+// });
 
 // 默认展开菜单
 function initMenu() {
@@ -247,9 +253,6 @@ function handleMenuItemClick(data: MenuItemClicked) {
   if (!path || !parentPaths) {
     return;
   }
-  if (!isHttpUrl(path)) {
-    activePath.value = path;
-  }
 
   emit('select', path, parentPaths);
 }
@@ -321,6 +324,16 @@ function removeSubMenu(subMenu: MenuItemRegistered) {
 function removeMenuItem(item: MenuItemRegistered) {
   Reflect.deleteProperty(items.value, item.path);
 }
+
+function getActivePaths() {
+  const activeItem = activePath.value && items.value[activePath.value];
+
+  if (!activeItem || props.mode === 'horizontal' || props.collapse) {
+    return [];
+  }
+
+  return activeItem.parentPaths;
+}
 </script>
 <template>
   <ul
@@ -332,19 +345,20 @@ function removeMenuItem(item: MenuItemRegistered) {
       is(theme, true),
       is('rounded', rounded),
       is('collapse', collapse),
+      is('menu-align', mode === 'horizontal'),
     ]"
     :style="menuStyle"
     role="menu"
   >
     <template v-if="mode === 'horizontal' && getSlot.showSlotMore">
-      <template v-for="item in getSlot.slotDefault" :key="item.key">
+      <template v-for="(item, index) in getSlot.slotDefault" :key="index">
         <component :is="item" />
       </template>
       <SubMenu is-sub-menu-more path="sub-menu-more">
         <template #title>
           <Ellipsis class="size-4" />
         </template>
-        <template v-for="item in getSlot.slotMore" :key="item.key">
+        <template v-for="(item, index) in getSlot.slotMore" :key="index">
           <component :is="item" />
         </template>
       </SubMenu>
@@ -374,12 +388,12 @@ $namespace: vben;
   padding: var(--menu-item-padding-y) var(--menu-item-padding-x);
   margin: 0 var(--menu-item-margin-x) var(--menu-item-margin-y)
     var(--menu-item-margin-x);
-  font-size: var(--menu-font-size);
+  font-size: var(--menu-font-size) !important;
   color: var(--menu-item-color);
-  text-decoration: none;
   white-space: nowrap;
-  list-style: none;
+  text-decoration: none;
   cursor: pointer;
+  list-style: none;
   background: var(--menu-item-background-color);
   border: none;
   border-radius: var(--menu-item-radius);
@@ -419,14 +433,19 @@ $namespace: vben;
   max-width: var(--menu-title-width);
   overflow: hidden;
   text-overflow: ellipsis;
+  font-size: var(--menu-font-size) !important;
   white-space: nowrap;
   opacity: 1;
 }
 
+.is-menu-align {
+  justify-content: var(--menu-align, start);
+}
+
 .#{$namespace}-menu__popup-container,
 .#{$namespace}-menu {
   --menu-title-width: 140px;
-  --menu-item-icon-size: 16px;
+  --menu-item-icon-size: var(--font-size-base, 16px);
   --menu-item-height: 38px;
   --menu-item-padding-y: 21px;
   --menu-item-padding-x: 12px;
@@ -440,38 +459,37 @@ $namespace: vben;
   --menu-item-collapse-margin-x: 0px;
   --menu-item-radius: 0px;
   --menu-item-indent: 16px;
-  --menu-font-size: 14px;
 
   &.is-dark {
     --menu-background-color: hsl(var(--menu));
     // --menu-submenu-opened-background-color: hsl(var(--menu-opened-dark));
-    --menu-item-background-color: var(--menu-background-color);
     --menu-item-color: hsl(var(--foreground) / 80%);
+    --menu-item-background-color: var(--menu-background-color);
     --menu-item-hover-color: hsl(var(--accent-foreground));
     --menu-item-hover-background-color: hsl(var(--accent));
     --menu-item-active-color: hsl(var(--accent-foreground));
     --menu-item-active-background-color: hsl(var(--accent));
-    --menu-submenu-hover-color: hsl(var(--foreground));
-    --menu-submenu-hover-background-color: hsl(var(--accent));
-    --menu-submenu-active-color: hsl(var(--foreground));
-    --menu-submenu-active-background-color: transparent;
     --menu-submenu-background-color: var(--menu-background-color);
+    --menu-submenu-hover-color: hsl(var(--accent-foreground));
+    --menu-submenu-hover-background-color: hsl(var(--accent));
+    --menu-submenu-active-color: hsl(var(--accent-foreground));
+    --menu-submenu-active-background-color: transparent;
   }
 
   &.is-light {
     --menu-background-color: hsl(var(--menu));
     // --menu-submenu-opened-background-color: hsl(var(--menu-opened));
+    --menu-item-color: hsl(var(--accent-foreground));
     --menu-item-background-color: var(--menu-background-color);
-    --menu-item-color: hsl(var(--foreground));
     --menu-item-hover-color: var(--menu-item-color);
     --menu-item-hover-background-color: hsl(var(--accent));
     --menu-item-active-color: hsl(var(--primary));
     --menu-item-active-background-color: hsl(var(--primary) / 15%);
+    --menu-submenu-background-color: var(--menu-background-color);
     --menu-submenu-hover-color: hsl(var(--primary));
     --menu-submenu-hover-background-color: hsl(var(--accent));
     --menu-submenu-active-color: hsl(var(--primary));
     --menu-submenu-active-background-color: transparent;
-    --menu-submenu-background-color: var(--menu-background-color);
   }
 
   &.is-rounded {
@@ -500,25 +518,33 @@ $namespace: vben;
     --menu-background-color: transparent;
 
     &.is-dark {
+      --menu-background-color: hsl(var(--menu));
+      --menu-item-color: hsl(var(--foreground) / 80%);
+      --menu-item-background-color: var(--menu-background-color);
       --menu-item-hover-color: hsl(var(--accent-foreground));
       --menu-item-hover-background-color: hsl(var(--accent));
       --menu-item-active-color: hsl(var(--accent-foreground));
       --menu-item-active-background-color: hsl(var(--accent));
-      --menu-submenu-active-color: hsl(var(--foreground));
-      --menu-submenu-active-background-color: hsl(var(--accent));
+      --menu-submenu-background-color: var(--menu-background-color);
       --menu-submenu-hover-color: hsl(var(--accent-foreground));
       --menu-submenu-hover-background-color: hsl(var(--accent));
+      --menu-submenu-active-color: hsl(var(--accent-foreground));
+      --menu-submenu-active-background-color: hsl(var(--accent));
     }
 
     &.is-light {
+      --menu-background-color: hsl(var(--menu));
+      --menu-item-color: hsl(var(--accent-foreground));
+      --menu-item-background-color: var(--menu-background-color);
+      --menu-item-hover-color: var(--menu-item-color);
+      --menu-item-hover-background-color: hsl(var(--accent));
       --menu-item-active-color: hsl(var(--primary));
       --menu-item-active-background-color: hsl(var(--primary) / 15%);
-      --menu-item-hover-background-color: hsl(var(--accent));
-      --menu-item-hover-color: hsl(var(--primary));
-      --menu-submenu-active-color: hsl(var(--primary));
-      --menu-submenu-active-background-color: hsl(var(--primary) / 15%);
+      --menu-submenu-background-color: var(--menu-background-color);
       --menu-submenu-hover-color: hsl(var(--primary));
       --menu-submenu-hover-background-color: hsl(var(--accent));
+      --menu-submenu-active-color: hsl(var(--primary));
+      --menu-submenu-active-background-color: hsl(var(--primary) / 15%);
     }
   }
 }
@@ -699,8 +725,8 @@ $namespace: vben;
     width: var(--menu-item-icon-size);
     height: var(--menu-item-icon-size);
     margin-right: 8px;
-    text-align: center;
     vertical-align: middle;
+    text-align: center;
   }
 }
 
@@ -734,7 +760,7 @@ $namespace: vben;
     }
     .#{$namespace}-menu__icon {
       display: block;
-      font-size: 20px !important;
+      font-size: calc(var(--font-size-base, 16px) * 1.25) !important;
       transition: all 0.25s ease;
     }
 
@@ -742,7 +768,7 @@ $namespace: vben;
       display: inline-flex;
       margin-top: 8px;
       margin-bottom: 0;
-      font-size: 12px;
+      font-size: calc(var(--font-size-base, 16px) * 0.75);
       font-weight: 400;
       line-height: normal;
       transition: all 0.25s ease;
@@ -767,7 +793,7 @@ $namespace: vben;
     width: 100%;
     height: 100%;
     padding: 0 var(--menu-item-padding-x);
-    font-size: var(--menu-font-size);
+    font-size: var(--menu-font-size) !important;
     line-height: var(--menu-item-height);
   }
 }
@@ -794,9 +820,14 @@ $namespace: vben;
 
 .#{$namespace}-sub-menu-content {
   height: var(--menu-item-height);
+  font-size: var(--menu-font-size) !important;
 
   @include menu-item;
 
+  * {
+    font-size: inherit !important;
+  }
+
   &__icon-arrow {
     position: absolute;
     top: 50%;
@@ -839,9 +870,8 @@ $namespace: vben;
     padding-right: 12px !important;
   }
 
-  // &:not(.is-active):hover {
-  &:hover {
-    color: var(--menu-submenu-hover-color);
+  &:not(.is-active):hover {
+    //color: var(--menu-submenu-hover-color);
     text-decoration: none;
     cursor: pointer;
     background: var(--menu-submenu-hover-background-color) !important;
diff --git a/packages/@core/ui-kit/menu-ui/src/components/normal-menu/normal-menu.vue b/packages/@core/ui-kit/menu-ui/src/components/normal-menu/normal-menu.vue
index 7cb29e51..8a1e2a32 100644
--- a/packages/@core/ui-kit/menu-ui/src/components/normal-menu/normal-menu.vue
+++ b/packages/@core/ui-kit/menu-ui/src/components/normal-menu/normal-menu.vue
@@ -57,10 +57,10 @@ function menuIcon(menu: MenuRecordRaw) {
     </template>
   </ul>
 </template>
-<style lang="scss" scoped>
-$namespace: vben;
+<style scoped>
+@reference "@vben/tailwind-config/theme";
 
-.#{$namespace}-normal-menu {
+.vben-normal-menu {
   --menu-item-margin-y: 4px;
   --menu-item-margin-x: 0px;
   --menu-item-padding-y: 9px;
@@ -68,94 +68,95 @@ $namespace: vben;
   --menu-item-radius: 0px;
 
   height: calc(100% - 4px);
+}
 
-  &.is-rounded {
-    --menu-item-radius: 6px;
-    --menu-item-margin-x: 8px;
-  }
+.vben-normal-menu.is-rounded {
+  --menu-item-radius: 6px;
+  --menu-item-margin-x: 8px;
+}
 
-  &.is-dark {
-    .#{$namespace}-normal-menu__item {
-      @apply text-foreground/80;
-      // color: hsl(var(--foreground) / 80%);
+.vben-normal-menu.is-dark .vben-normal-menu__item {
+  @apply text-foreground/80;
+}
 
-      &:not(.is-active):hover {
-        @apply text-foreground;
-      }
+.vben-normal-menu.is-dark .vben-normal-menu__item:not(.is-active):hover {
+  @apply text-foreground;
+}
 
-      &.is-active {
-        .#{$namespace}-normal-menu__name,
-        .#{$namespace}-normal-menu__icon {
-          @apply text-foreground;
-        }
-      }
-    }
-  }
+.vben-normal-menu.is-dark
+  .vben-normal-menu__item.is-active
+  .vben-normal-menu__name,
+.vben-normal-menu.is-dark
+  .vben-normal-menu__item.is-active
+  .vben-normal-menu__icon {
+  @apply text-foreground;
+}
 
-  &.is-collapse {
-    .#{$namespace}-normal-menu__name {
-      width: 0;
-      height: 0;
-      margin-top: 0;
-      overflow: hidden;
-      opacity: 0;
-    }
+.vben-normal-menu.is-collapse .vben-normal-menu__name {
+  width: 0;
+  height: 0;
+  margin-top: 0;
+  overflow: hidden;
+  opacity: 0;
+}
 
-    .#{$namespace}-normal-menu__icon {
-      font-size: 20px;
-    }
-  }
+.vben-normal-menu.is-collapse .vben-normal-menu__icon {
+  font-size: calc(var(--font-size-base, 16px) * 1.25);
+}
 
-  &__item {
-    position: relative;
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    justify-content: center;
-    // max-width: 64px;
-    // max-height: 64px;
-    padding: var(--menu-item-padding-y) var(--menu-item-padding-x);
-    margin: var(--menu-item-margin-y) var(--menu-item-margin-x);
-    color: hsl(var(--foreground) / 90%);
-    cursor: pointer;
-    border-radius: var(--menu-item-radius);
-    transition:
-      background 0.15s ease,
-      padding 0.15s ease,
-      border-color 0.15s ease;
+.vben-normal-menu__item {
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
 
-    &.is-active {
-      @apply text-primary bg-primary dark:bg-accent;
+  /* max-width: 64px; */
 
-      .#{$namespace}-normal-menu__name,
-      .#{$namespace}-normal-menu__icon {
-        @apply text-primary-foreground font-semibold;
-      }
-    }
+  /* max-height: 64px; */
+  padding: var(--menu-item-padding-y) var(--menu-item-padding-x);
+  margin: var(--menu-item-margin-y) var(--menu-item-margin-x);
+  color: hsl(var(--foreground) / 90%);
+  cursor: pointer;
+  border-radius: var(--menu-item-radius);
+  transition:
+    background 0.15s ease,
+    padding 0.15s ease,
+    border-color 0.15s ease;
+}
 
-    &:not(.is-active):hover {
-      @apply dark:bg-accent text-primary bg-heavy dark:text-foreground;
-    }
+.vben-normal-menu__item.is-active {
+  @apply bg-primary text-primary dark:bg-accent;
+}
 
-    &:hover {
-      .#{$namespace}-normal-menu__icon {
-        transform: scale(1.2);
-      }
-    }
-  }
+.vben-normal-menu__item.is-active .vben-normal-menu__name,
+.vben-normal-menu__item.is-active .vben-normal-menu__icon {
+  @apply text-primary-foreground font-semibold;
+}
 
-  &__icon {
-    max-height: 20px;
-    font-size: 20px;
-    transition: all 0.25s ease;
-  }
+.vben-normal-menu__item:not(.is-active):hover {
+  @apply bg-heavy text-primary dark:bg-accent dark:text-foreground;
+}
 
-  &__name {
-    margin-top: 8px;
-    margin-bottom: 0;
-    font-size: 12px;
-    font-weight: 400;
-    transition: all 0.25s ease;
-  }
+.vben-normal-menu__item:hover .vben-normal-menu__icon {
+  transform: scale(1.2);
+}
+
+.vben-normal-menu__icon {
+  @apply max-h-5;
+
+  font-size: calc(var(--font-size-base, 16px) * 1.25);
+  transition: all 0.25s ease;
+}
+
+.vben-normal-menu__name {
+  @apply mt-2;
+
+  width: 100%;
+  margin-bottom: 0;
+  font-size: calc(var(--font-size-base, 16px) * 0.75);
+  font-weight: 400;
+  text-align: center;
+  transition: all 0.25s ease;
 }
 </style>
diff --git a/packages/@core/ui-kit/menu-ui/src/components/sub-menu-content.vue b/packages/@core/ui-kit/menu-ui/src/components/sub-menu-content.vue
index 31eead11..5622d413 100644
--- a/packages/@core/ui-kit/menu-ui/src/components/sub-menu-content.vue
+++ b/packages/@core/ui-kit/menu-ui/src/components/sub-menu-content.vue
@@ -10,7 +10,7 @@ import { VbenIcon } from '@vben-core/shadcn-ui';
 import { useMenuContext } from '../hooks';
 
 interface Props extends MenuItemProps {
-  isMenuMore: boolean;
+  isMenuMore?: boolean;
   isTopLevelMenuSubmenu: boolean;
   level?: number;
 }
diff --git a/packages/@core/ui-kit/menu-ui/src/components/sub-menu.vue b/packages/@core/ui-kit/menu-ui/src/components/sub-menu.vue
index 17bc1215..afc0afa1 100644
--- a/packages/@core/ui-kit/menu-ui/src/components/sub-menu.vue
+++ b/packages/@core/ui-kit/menu-ui/src/components/sub-menu.vue
@@ -54,7 +54,7 @@ const opened = computed(() => {
   return rootMenu?.openedMenus.includes(props.path);
 });
 const isTopLevelMenuSubmenu = computed(
-  () => parentMenu.value?.type.name === 'Menu',
+  () => parentMenu.value?.type.name === 'MenuUI',
 );
 const mode = computed(() => rootMenu?.props.mode ?? 'vertical');
 const rounded = computed(() => rootMenu?.props.rounded);
@@ -208,6 +208,9 @@ onBeforeUnmount(() => {
           nsMenu.e('popup-container'),
           is(rootMenu.theme, true),
           opened ? '' : 'hidden',
+          'overflow-auto',
+          'max-h-[calc(var(--reka-hover-card-content-available-height)-20px)]',
+          mode === 'horizontal' ? 'is-horizontal' : '',
         ]"
         :content-props="contentProps"
         :open="true"
diff --git a/packages/@core/ui-kit/menu-ui/src/hooks/use-menu-context.ts b/packages/@core/ui-kit/menu-ui/src/hooks/use-menu-context.ts
index 357b296b..1e3955dc 100644
--- a/packages/@core/ui-kit/menu-ui/src/hooks/use-menu-context.ts
+++ b/packages/@core/ui-kit/menu-ui/src/hooks/use-menu-context.ts
@@ -42,7 +42,7 @@ function useSubMenuContext() {
   if (!instance) {
     throw new Error('instance is required');
   }
-  const parentMenu = findComponentUpward(instance, ['Menu', 'SubMenu']);
+  const parentMenu = findComponentUpward(instance, ['MenuUI', 'SubMenu']);
   const subMenu = inject(`subMenu:${parentMenu?.uid}`) as SubMenuProvider;
   return subMenu;
 }
diff --git a/packages/@core/ui-kit/menu-ui/src/hooks/use-menu-scroll.ts b/packages/@core/ui-kit/menu-ui/src/hooks/use-menu-scroll.ts
new file mode 100644
index 00000000..e18bae75
--- /dev/null
+++ b/packages/@core/ui-kit/menu-ui/src/hooks/use-menu-scroll.ts
@@ -0,0 +1,46 @@
+import type { Ref } from 'vue';
+
+import { watch } from 'vue';
+
+import { useDebounceFn } from '@vueuse/core';
+
+interface UseMenuScrollOptions {
+  delay?: number;
+  enable?: boolean | Ref<boolean>;
+}
+
+export function useMenuScroll(
+  activePath: Ref<string | undefined>,
+  options: UseMenuScrollOptions = {},
+) {
+  const { enable = true, delay = 320 } = options;
+
+  function scrollToActiveItem() {
+    const isEnabled = typeof enable === 'boolean' ? enable : enable.value;
+    if (!isEnabled) return;
+
+    const activeElement = document.querySelector(
+      `aside a[role=menuitem].is-active`,
+    );
+    if (activeElement) {
+      activeElement.scrollIntoView({
+        behavior: 'smooth',
+        block: 'center',
+        inline: 'center',
+      });
+    }
+  }
+
+  const debouncedScroll = useDebounceFn(scrollToActiveItem, delay);
+
+  watch(activePath, () => {
+    const isEnabled = typeof enable === 'boolean' ? enable : enable.value;
+    if (!isEnabled) return;
+
+    debouncedScroll();
+  });
+
+  return {
+    scrollToActiveItem,
+  };
+}
diff --git a/packages/@core/ui-kit/menu-ui/src/hooks/use-menu.ts b/packages/@core/ui-kit/menu-ui/src/hooks/use-menu.ts
index 9207445f..0ee93fd9 100644
--- a/packages/@core/ui-kit/menu-ui/src/hooks/use-menu.ts
+++ b/packages/@core/ui-kit/menu-ui/src/hooks/use-menu.ts
@@ -16,7 +16,7 @@ function useMenu() {
   const parentPaths = computed(() => {
     let parent = instance.parent;
     const paths: string[] = [instance.props.path as string];
-    while (parent?.type.name !== 'Menu') {
+    while (parent?.type.name !== 'MenuUI') {
       if (parent?.props.path) {
         paths.unshift(parent.props.path as string);
       }
@@ -27,7 +27,7 @@ function useMenu() {
   });
 
   const parentMenu = computed(() => {
-    return findComponentUpward(instance, ['Menu', 'SubMenu']);
+    return findComponentUpward(instance, ['MenuUI', 'SubMenu']);
   });
 
   return {
diff --git a/packages/@core/ui-kit/menu-ui/src/menu.vue b/packages/@core/ui-kit/menu-ui/src/menu.vue
index 4ecf6a91..e9ac6d92 100644
--- a/packages/@core/ui-kit/menu-ui/src/menu.vue
+++ b/packages/@core/ui-kit/menu-ui/src/menu.vue
@@ -18,15 +18,9 @@ defineOptions({
 
 const props = withDefaults(defineProps<Props>(), {
   collapse: false,
-  // theme: 'dark',
 });
 
 const forward = useForwardProps(props);
-
-// const emit = defineEmits<{
-//   'update:openKeys': [key: Key[]];
-//   'update:selectedKeys': [key: Key[]];
-// }>();
 </script>
 
 <template>
diff --git a/packages/@core/ui-kit/menu-ui/src/sub-menu.vue b/packages/@core/ui-kit/menu-ui/src/sub-menu.vue
index e4d471fb..f84e5f81 100644
--- a/packages/@core/ui-kit/menu-ui/src/sub-menu.vue
+++ b/packages/@core/ui-kit/menu-ui/src/sub-menu.vue
@@ -4,7 +4,6 @@ import type { MenuRecordRaw } from '@vben-core/typings';
 import { computed } from 'vue';
 
 import { MenuBadge, MenuItem, SubMenu as SubMenuComp } from './components';
-// eslint-disable-next-line import/no-self-import
 import SubMenu from './sub-menu.vue';
 
 interface Props {
@@ -41,6 +40,7 @@ const hasChildren = computed(() => {
     :badge-variants="menu.badgeVariants"
     :icon="menu.icon"
     :path="menu.path"
+    :query="menu.query"
   >
     <template #title>
       <span>{{ menu.name }}</span>
diff --git a/packages/@core/ui-kit/menu-ui/src/types.ts b/packages/@core/ui-kit/menu-ui/src/types.ts
index 99422e8e..4654e2f5 100644
--- a/packages/@core/ui-kit/menu-ui/src/types.ts
+++ b/packages/@core/ui-kit/menu-ui/src/types.ts
@@ -1,7 +1,11 @@
-import type { MenuRecordBadgeRaw, ThemeModeType } from '@vben-core/typings';
-
 import type { Component, Ref } from 'vue';
 
+import type {
+  MenuRecordBadgeRaw,
+  Recordable,
+  ThemeModeType,
+} from '@vben-core/typings';
+
 interface MenuProps {
   /**
    * @zh_CN 是否开启手风琴模式
@@ -42,6 +46,12 @@ interface MenuProps {
    */
   rounded?: boolean;
 
+  /**
+   * @zh_CN 是否自动滚动到激活的菜单项
+   * @default false
+   */
+  scrollToActive?: boolean;
+
   /**
    * @zh_CN 菜单主题
    * @default dark
@@ -85,12 +95,17 @@ interface MenuItemProps extends MenuRecordBadgeRaw {
    * @zh_CN menuitem 名称
    */
   path: string;
+  /**
+   * @zh_CN 菜单所携带的参数
+   */
+  query?: Recordable<any>;
 }
 
 interface MenuItemRegistered {
   active: boolean;
   parentPaths: string[];
   path: string;
+  query?: Recordable<any>;
 }
 
 interface MenuItemClicked {
diff --git a/packages/@core/ui-kit/menu-ui/src/utils/index.ts b/packages/@core/ui-kit/menu-ui/src/utils/index.ts
index dd6a85cc..23a1b154 100644
--- a/packages/@core/ui-kit/menu-ui/src/utils/index.ts
+++ b/packages/@core/ui-kit/menu-ui/src/utils/index.ts
@@ -4,6 +4,7 @@ import type {
   VNodeChild,
   VNodeNormalizedChildren,
 } from 'vue';
+
 import { isVNode } from 'vue';
 
 type VNodeChildAtom = Exclude<VNodeChild, Array<any>>;
diff --git a/packages/@core/ui-kit/menu-ui/tailwind.config.mjs b/packages/@core/ui-kit/menu-ui/tailwind.config.mjs
deleted file mode 100644
index f17f556f..00000000
--- a/packages/@core/ui-kit/menu-ui/tailwind.config.mjs
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from '@vben/tailwind-config';
diff --git a/packages/@core/ui-kit/menu-ui/tsdown.config.ts b/packages/@core/ui-kit/menu-ui/tsdown.config.ts
new file mode 100644
index 00000000..43e8cf1c
--- /dev/null
+++ b/packages/@core/ui-kit/menu-ui/tsdown.config.ts
@@ -0,0 +1,21 @@
+import { defineConfig } from 'tsdown';
+import Vue from 'unplugin-vue/rolldown';
+
+export default defineConfig({
+  clean: true,
+  deps: {
+    skipNodeModulesBundle: true,
+  },
+  dts: {
+    vue: true,
+  },
+  entry: ['src/index.ts'],
+  format: ['esm'],
+  outExtensions: () => ({
+    dts: '.d.ts',
+    js: '.mjs',
+  }),
+  platform: 'neutral',
+  plugins: [Vue({ isProduction: true })],
+  unbundle: true,
+});
diff --git a/packages/@core/ui-kit/popup-ui/build.config.ts b/packages/@core/ui-kit/popup-ui/build.config.ts
deleted file mode 100644
index 18eaa604..00000000
--- a/packages/@core/ui-kit/popup-ui/build.config.ts
+++ /dev/null
@@ -1,21 +0,0 @@
-import { defineBuildConfig } from 'unbuild';
-
-export default defineBuildConfig({
-  clean: true,
-  declaration: true,
-  entries: [
-    {
-      builder: 'mkdist',
-      input: './src',
-      loaders: ['vue'],
-      pattern: ['**/*.vue'],
-    },
-    {
-      builder: 'mkdist',
-      format: 'esm',
-      input: './src',
-      loaders: ['js'],
-      pattern: ['**/*.ts'],
-    },
-  ],
-});
diff --git a/packages/@core/ui-kit/popup-ui/package.json b/packages/@core/ui-kit/popup-ui/package.json
index 3ef78c72..0114a01b 100644
--- a/packages/@core/ui-kit/popup-ui/package.json
+++ b/packages/@core/ui-kit/popup-ui/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vben-core/popup-ui",
-  "version": "5.2.1",
+  "version": "5.7.0",
   "homepage": "https://github.com/vbenjs/vue-vben-admin",
   "bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
   "repository": {
@@ -11,7 +11,7 @@
   "license": "MIT",
   "type": "module",
   "scripts": {
-    "build": "pnpm unbuild",
+    "build": "pnpm exec tsdown",
     "prepublishOnly": "npm run build"
   },
   "files": [
@@ -22,16 +22,19 @@
   ],
   "main": "./dist/index.mjs",
   "module": "./dist/index.mjs",
+  "types": "./dist/index.d.ts",
   "exports": {
     ".": {
       "types": "./src/index.ts",
       "development": "./src/index.ts",
+      "production": "./src/index.ts",
       "default": "./dist/index.mjs"
     }
   },
   "publishConfig": {
     "exports": {
       ".": {
+        "types": "./dist/index.d.ts",
         "default": "./dist/index.mjs"
       }
     }
@@ -39,10 +42,14 @@
   "dependencies": {
     "@vben-core/composables": "workspace:*",
     "@vben-core/icons": "workspace:*",
+    "@vben-core/preferences": "workspace:*",
     "@vben-core/shadcn-ui": "workspace:*",
     "@vben-core/shared": "workspace:*",
     "@vben-core/typings": "workspace:*",
     "@vueuse/core": "catalog:",
     "vue": "catalog:"
+  },
+  "devDependencies": {
+    "unplugin-vue": "catalog:"
   }
 }
diff --git a/packages/@core/ui-kit/popup-ui/postcss.config.mjs b/packages/@core/ui-kit/popup-ui/postcss.config.mjs
deleted file mode 100644
index 3d807045..00000000
--- a/packages/@core/ui-kit/popup-ui/postcss.config.mjs
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from '@vben/tailwind-config/postcss';
diff --git a/packages/@core/ui-kit/popup-ui/src/alert/AlertBuilder.ts b/packages/@core/ui-kit/popup-ui/src/alert/AlertBuilder.ts
new file mode 100644
index 00000000..910a4611
--- /dev/null
+++ b/packages/@core/ui-kit/popup-ui/src/alert/AlertBuilder.ts
@@ -0,0 +1,246 @@
+import type { Component, VNode } from 'vue';
+
+import type { Recordable } from '@vben-core/typings';
+
+import type { AlertProps, BeforeCloseScope, PromptProps } from './alert';
+
+import { h, nextTick, ref, render } from 'vue';
+
+import { useSimpleLocale } from '@vben-core/composables';
+import { Input, VbenRenderContent } from '@vben-core/shadcn-ui';
+import { isFunction, isString } from '@vben-core/shared/utils';
+
+import Alert from './alert.vue';
+
+const alerts = ref<Array<{ container: HTMLElement; instance: Component }>>([]);
+
+const { $t } = useSimpleLocale();
+
+export function vbenAlert(options: AlertProps): Promise<void>;
+export function vbenAlert(
+  message: string,
+  options?: Partial<AlertProps>,
+): Promise<void>;
+export function vbenAlert(
+  message: string,
+  title?: string,
+  options?: Partial<AlertProps>,
+): Promise<void>;
+
+export function vbenAlert(
+  arg0: AlertProps | string,
+  arg1?: Partial<AlertProps> | string,
+  arg2?: Partial<AlertProps>,
+): Promise<void> {
+  return new Promise((resolve, reject) => {
+    const options: AlertProps = isString(arg0)
+      ? {
+          content: arg0,
+        }
+      : { ...arg0 };
+    if (arg1) {
+      if (isString(arg1)) {
+        options.title = arg1;
+      } else if (!isString(arg1)) {
+        // 如果第二个参数是对象，则合并到选项中
+        Object.assign(options, arg1);
+      }
+    }
+
+    if (arg2 && !isString(arg2)) {
+      Object.assign(options, arg2);
+    }
+    // 创建容器元素
+    const container = document.createElement('div');
+    document.body.append(container);
+
+    // 创建一个引用，用于在回调中访问实例
+    const alertRef = { container, instance: null as any };
+
+    const props: AlertProps & Recordable<any> = {
+      onClosed: (isConfirm: boolean) => {
+        // 移除组件实例以及创建的所有dom（恢复页面到打开前的状态）
+        // 从alerts数组中移除该实例
+        alerts.value = alerts.value.filter((item) => item !== alertRef);
+
+        // 从DOM中移除容器
+        render(null, container);
+        if (container.parentNode) {
+          container.remove();
+        }
+
+        // 解析 Promise，传递用户操作结果
+        if (isConfirm) {
+          resolve();
+        } else {
+          reject(new Error('dialog cancelled'));
+        }
+      },
+      ...options,
+      open: true,
+      title: options.title ?? $t.value('prompt'),
+    };
+
+    // 创建Alert组件的VNode
+    const vnode = h(Alert, props);
+
+    // 渲染组件到容器
+    render(vnode, container);
+
+    // 保存组件实例引用
+    alertRef.instance = vnode.component?.proxy as Component;
+
+    // 将实例和容器添加到alerts数组中
+    alerts.value.push(alertRef);
+  });
+}
+
+export function vbenConfirm(options: AlertProps): Promise<void>;
+export function vbenConfirm(
+  message: string,
+  options?: Partial<AlertProps>,
+): Promise<void>;
+export function vbenConfirm(
+  message: string,
+  title?: string,
+  options?: Partial<AlertProps>,
+): Promise<void>;
+
+export function vbenConfirm(
+  arg0: AlertProps | string,
+  arg1?: Partial<AlertProps> | string,
+  arg2?: Partial<AlertProps>,
+): Promise<void> {
+  const defaultProps: Partial<AlertProps> = {
+    showCancel: true,
+  };
+  if (!arg1) {
+    return isString(arg0)
+      ? vbenAlert(arg0, defaultProps)
+      : vbenAlert({ ...defaultProps, ...arg0 });
+  } else if (!arg2) {
+    return isString(arg1)
+      ? vbenAlert(arg0 as string, arg1, defaultProps)
+      : vbenAlert(arg0 as string, { ...defaultProps, ...arg1 });
+  }
+  return vbenAlert(arg0 as string, arg1 as string, {
+    ...defaultProps,
+    ...arg2,
+  });
+}
+
+export async function vbenPrompt<T = any>(
+  options: PromptProps<T>,
+): Promise<T | undefined> {
+  const {
+    component: _component,
+    componentProps: _componentProps,
+    componentSlots,
+    content,
+    defaultValue,
+    modelPropName: _modelPropName,
+    ...delegated
+  } = options;
+
+  const modelValue = ref<T | undefined>(defaultValue);
+  const inputComponentRef = ref<null | VNode>(null);
+  const staticContents: Component[] = [
+    h(VbenRenderContent, { content, renderBr: true }),
+  ];
+
+  const modelPropName = _modelPropName || 'modelValue';
+  const componentProps = { ..._componentProps };
+
+  // 每次渲染时都会重新计算的内容函数
+  const contentRenderer = () => {
+    const currentProps = {
+      ...componentProps,
+      [modelPropName]: modelValue.value,
+      [`onUpdate:${modelPropName}`]: (val: T) => {
+        modelValue.value = val;
+      },
+    };
+
+    // 设置当前值
+
+    // 设置更新处理函数
+
+    // 创建输入组件
+    inputComponentRef.value = h(
+      _component || Input,
+      currentProps,
+      componentSlots,
+    );
+
+    // 返回包含静态内容和输入组件的数组
+    return h(
+      'div',
+      { class: 'flex flex-col gap-2' },
+      { default: () => [...staticContents, inputComponentRef.value] },
+    );
+  };
+
+  const props: AlertProps & Recordable<any> = {
+    ...delegated,
+    async beforeClose(scope: BeforeCloseScope) {
+      if (delegated.beforeClose) {
+        return await delegated.beforeClose({
+          ...scope,
+          value: modelValue.value,
+        });
+      }
+    },
+    // 使用函数形式，每次渲染都会重新计算内容
+    content: contentRenderer,
+    contentMasking: true,
+    async onOpened() {
+      await nextTick();
+      const componentRef: null | VNode = inputComponentRef.value;
+      if (componentRef) {
+        if (
+          componentRef.component?.exposed &&
+          isFunction(componentRef.component.exposed.focus)
+        ) {
+          componentRef.component.exposed.focus();
+        } else {
+          if (componentRef.el) {
+            if (
+              isFunction(componentRef.el.focus) &&
+              ['BUTTON', 'INPUT', 'SELECT', 'TEXTAREA'].includes(
+                componentRef.el.tagName,
+              )
+            ) {
+              componentRef.el.focus();
+            } else if (isFunction(componentRef.el.querySelector)) {
+              const focusableElement = componentRef.el.querySelector(
+                'input, select, textarea, button',
+              );
+              if (focusableElement && isFunction(focusableElement.focus)) {
+                focusableElement.focus();
+              }
+            } else if (
+              componentRef.el.nextElementSibling &&
+              isFunction(componentRef.el.nextElementSibling.focus)
+            ) {
+              componentRef.el.nextElementSibling.focus();
+            }
+          }
+        }
+      }
+    },
+  };
+
+  await vbenConfirm(props);
+  return modelValue.value;
+}
+
+export function clearAllAlerts() {
+  alerts.value.forEach((alert) => {
+    // 从DOM中移除容器
+    render(null, alert.container);
+    if (alert.container.parentNode) {
+      alert.container.remove();
+    }
+  });
+  alerts.value = [];
+}
diff --git a/packages/@core/ui-kit/popup-ui/src/alert/alert.ts b/packages/@core/ui-kit/popup-ui/src/alert/alert.ts
new file mode 100644
index 00000000..ff19830e
--- /dev/null
+++ b/packages/@core/ui-kit/popup-ui/src/alert/alert.ts
@@ -0,0 +1,101 @@
+import type { Component, VNode, VNodeArrayChildren } from 'vue';
+
+import type { Recordable } from '@vben-core/typings';
+
+import { createContext } from '@vben-core/shadcn-ui';
+
+export type IconType = 'error' | 'info' | 'question' | 'success' | 'warning';
+
+export type BeforeCloseScope = {
+  isConfirm: boolean;
+};
+
+export type AlertProps = {
+  /** 关闭前的回调，如果返回false，则终止关闭 */
+  beforeClose?: (
+    scope: BeforeCloseScope,
+  ) => boolean | Promise<boolean | undefined> | undefined;
+  /** 边框 */
+  bordered?: boolean;
+  /**
+   * 按钮对齐方式
+   * @default 'end'
+   */
+  buttonAlign?: 'center' | 'end' | 'start';
+  /** 取消按钮的标题 */
+  cancelText?: string;
+  /** 是否居中显示 */
+  centered?: boolean;
+  /** 确认按钮的标题 */
+  confirmText?: string;
+  /** 弹窗容器的额外样式 */
+  containerClass?: string;
+  /** 弹窗提示内容 */
+  content: Component | string;
+  /** 弹窗内容的额外样式 */
+  contentClass?: string;
+  /** 执行beforeClose回调期间，在内容区域显示一个loading遮罩*/
+  contentMasking?: boolean;
+  /** 按下Esc时是否关闭弹窗 */
+  escapeKeyClose?: boolean;
+  /** 弹窗底部内容（与按钮在同一个容器中） */
+  footer?: Component | string;
+  /** 弹窗的图标（在标题的前面） */
+  icon?: Component | IconType;
+  /**
+   * 弹窗遮罩模糊效果
+   */
+  overlayBlur?: number;
+  /** 是否显示取消按钮 */
+  showCancel?: boolean;
+  /** 弹窗标题 */
+  title?: string;
+};
+
+/** Prompt属性 */
+export type PromptProps<T = any> = {
+  /** 关闭前的回调，如果返回false，则终止关闭 */
+  beforeClose?: (scope: {
+    isConfirm: boolean;
+    value: T | undefined;
+  }) => boolean | Promise<boolean | undefined> | undefined;
+  /** 用于接受用户输入的组件 */
+  component?: Component;
+  /** 输入组件的属性 */
+  componentProps?: Recordable<any>;
+  /** 输入组件的插槽 */
+  componentSlots?:
+    | (() => any)
+    | Recordable<unknown>
+    | VNode
+    | VNodeArrayChildren;
+  /** 默认值 */
+  defaultValue?: T;
+  /** 输入组件的值属性名 */
+  modelPropName?: string;
+} & Omit<AlertProps, 'beforeClose'>;
+
+/**
+ * Alert上下文
+ */
+export type AlertContext = {
+  /** 执行取消操作 */
+  doCancel: () => void;
+  /** 执行确认操作 */
+  doConfirm: () => void;
+};
+
+export const [injectAlertContext, provideAlertContext] =
+  createContext<AlertContext>('VbenAlertContext');
+
+/**
+ * 获取Alert上下文
+ * @returns AlertContext
+ */
+export function useAlertContext() {
+  const context = injectAlertContext();
+  if (!context) {
+    throw new Error('useAlertContext must be used within an AlertProvider');
+  }
+  return context;
+}
diff --git a/packages/@core/ui-kit/popup-ui/src/alert/alert.vue b/packages/@core/ui-kit/popup-ui/src/alert/alert.vue
new file mode 100644
index 00000000..8e8a23fb
--- /dev/null
+++ b/packages/@core/ui-kit/popup-ui/src/alert/alert.vue
@@ -0,0 +1,220 @@
+<script lang="ts" setup>
+import type { Component } from 'vue';
+
+import type { AlertProps } from './alert';
+
+import { computed, h, nextTick, ref } from 'vue';
+
+import { useSimpleLocale } from '@vben-core/composables';
+import {
+  CircleAlert,
+  CircleCheckBig,
+  CircleHelp,
+  CircleX,
+  Info,
+  X,
+} from '@vben-core/icons';
+import { usePreferences } from '@vben-core/preferences';
+import {
+  AlertDialog,
+  AlertDialogAction,
+  AlertDialogCancel,
+  AlertDialogContent,
+  AlertDialogDescription,
+  AlertDialogTitle,
+  VbenButton,
+  VbenLoading,
+  VbenRenderContent,
+} from '@vben-core/shadcn-ui';
+import { globalShareState } from '@vben-core/shared/global-state';
+import { cn } from '@vben-core/shared/utils';
+
+import { provideAlertContext } from './alert';
+
+const props = withDefaults(defineProps<AlertProps>(), {
+  bordered: true,
+  buttonAlign: 'end',
+  centered: true,
+  escapeKeyClose: true,
+});
+const emits = defineEmits(['closed', 'confirm', 'opened']);
+const { globalEscapeShortcutKey } = usePreferences();
+const open = defineModel<boolean>('open', { default: false });
+const { $t } = useSimpleLocale();
+const components = globalShareState.getComponents();
+const isConfirm = ref(false);
+
+function onAlertClosed() {
+  emits('closed', isConfirm.value);
+  isConfirm.value = false;
+}
+
+function onEscapeKeyDown(e: KeyboardEvent) {
+  // 先标记是按 Esc 触发的（用于后续 isConfirm 判断等）
+  isConfirm.value = false;
+
+  // 只有当组件参数和全局配置都为false时才阻止关闭，其任意一个为true都需要让esc生效
+  if (!props.escapeKeyClose && !globalEscapeShortcutKey.value) {
+    e.preventDefault();
+  }
+}
+
+const getIconRender = computed(() => {
+  let iconRender: Component | null = null;
+  if (props.icon) {
+    if (typeof props.icon === 'string') {
+      switch (props.icon) {
+        case 'error': {
+          iconRender = h(CircleX, {
+            style: { color: 'hsl(var(--destructive))' },
+          });
+          break;
+        }
+        case 'info': {
+          iconRender = h(Info, { style: { color: 'hsl(var(--info))' } });
+          break;
+        }
+        case 'question': {
+          iconRender = CircleHelp;
+          break;
+        }
+        case 'success': {
+          iconRender = h(CircleCheckBig, {
+            style: { color: 'hsl(var(--success))' },
+          });
+          break;
+        }
+        case 'warning': {
+          iconRender = h(CircleAlert, {
+            style: { color: 'hsl(var(--warning))' },
+          });
+          break;
+        }
+        default: {
+          iconRender = null;
+          break;
+        }
+      }
+    }
+  } else {
+    iconRender = props.icon ?? null;
+  }
+  return iconRender;
+});
+
+function doCancel() {
+  handleCancel();
+  handleOpenChange(false);
+}
+
+function doConfirm() {
+  handleConfirm();
+  handleOpenChange(false);
+}
+
+provideAlertContext({
+  doCancel,
+  doConfirm,
+});
+
+function handleConfirm() {
+  isConfirm.value = true;
+  emits('confirm');
+}
+
+function handleCancel() {
+  isConfirm.value = false;
+}
+
+const loading = ref(false);
+async function handleOpenChange(val: boolean) {
+  await nextTick(); // 等待标记isConfirm状态
+  if (!val && props.beforeClose) {
+    loading.value = true;
+    try {
+      const res = await props.beforeClose({ isConfirm: isConfirm.value });
+      if (res !== false) {
+        open.value = false;
+      }
+    } finally {
+      loading.value = false;
+    }
+  } else {
+    open.value = val;
+  }
+}
+</script>
+<template>
+  <AlertDialog :modal="false" :open="open" @update:open="handleOpenChange">
+    <AlertDialogContent
+      :open="open"
+      :centered="centered"
+      :overlay-blur="overlayBlur"
+      @opened="emits('opened')"
+      @closed="onAlertClosed"
+      @escape-key-down="onEscapeKeyDown($event)"
+      @close="handleOpenChange(false)"
+      :class="
+        cn(
+          containerClass,
+          'flex max-h-[80%] flex-col p-0 duration-300 sm:w-130 sm:max-w-[80%] sm:rounded-(--radius)',
+          {
+            'border border-border': bordered,
+            'shadow-3xl': !bordered,
+          },
+        )
+      "
+    >
+      <div :class="cn('relative flex-1 overflow-y-auto p-3', contentClass)">
+        <AlertDialogTitle v-if="title">
+          <div class="flex items-center">
+            <component :is="getIconRender" class="mr-2" />
+            <span class="flex-auto">{{ $t(title) }}</span>
+            <AlertDialogCancel v-if="showCancel" as-child>
+              <VbenButton
+                variant="ghost"
+                size="icon"
+                class="rounded-full"
+                :disabled="loading"
+                @click="handleCancel"
+              >
+                <X class="size-4 text-muted-foreground" />
+              </VbenButton>
+            </AlertDialogCancel>
+          </div>
+        </AlertDialogTitle>
+        <AlertDialogDescription>
+          <div class="m-4 min-h-7.5">
+            <VbenRenderContent :content="content" render-br />
+          </div>
+          <VbenLoading v-if="loading && contentMasking" :spinning="loading" />
+        </AlertDialogDescription>
+        <div
+          class="flex items-center justify-end gap-x-2"
+          :class="`justify-${buttonAlign}`"
+        >
+          <VbenRenderContent :content="footer" />
+          <AlertDialogCancel v-if="showCancel" as-child>
+            <component
+              :is="components.DefaultButton || VbenButton"
+              :disabled="loading"
+              variant="outline"
+              @click="handleCancel"
+            >
+              {{ cancelText || $t('cancel') }}
+            </component>
+          </AlertDialogCancel>
+          <AlertDialogAction as-child>
+            <component
+              :is="components.PrimaryButton || VbenButton"
+              :loading="loading"
+              @click="handleConfirm"
+            >
+              {{ confirmText || $t('confirm') }}
+            </component>
+          </AlertDialogAction>
+        </div>
+      </div>
+    </AlertDialogContent>
+  </AlertDialog>
+</template>
diff --git a/packages/@core/ui-kit/popup-ui/src/alert/index.ts b/packages/@core/ui-kit/popup-ui/src/alert/index.ts
new file mode 100644
index 00000000..8419b5b8
--- /dev/null
+++ b/packages/@core/ui-kit/popup-ui/src/alert/index.ts
@@ -0,0 +1,14 @@
+export type {
+  AlertProps,
+  BeforeCloseScope,
+  IconType,
+  PromptProps,
+} from './alert';
+export { useAlertContext } from './alert';
+export { default as Alert } from './alert.vue';
+export {
+  vbenAlert as alert,
+  clearAllAlerts,
+  vbenConfirm as confirm,
+  vbenPrompt as prompt,
+} from './AlertBuilder';
diff --git a/packages/@core/ui-kit/popup-ui/src/drawer/__tests__/drawer-api.test.ts b/packages/@core/ui-kit/popup-ui/src/drawer/__tests__/drawer-api.test.ts
index 8d715ff8..b1b9636a 100644
--- a/packages/@core/ui-kit/popup-ui/src/drawer/__tests__/drawer-api.test.ts
+++ b/packages/@core/ui-kit/popup-ui/src/drawer/__tests__/drawer-api.test.ts
@@ -9,25 +9,24 @@ vi.mock('@vben-core/shared/store', () => {
   return {
     isFunction: (fn: any) => typeof fn === 'function',
     Store: class {
-      private _state: DrawerState;
-      private options: any;
-
-      constructor(initialState: DrawerState, options: any) {
-        this._state = initialState;
-        this.options = options;
+      get state() {
+        return this._state;
       }
+      private _state: DrawerState;
+      private subscribers: Array<(state: DrawerState) => void> = [];
 
-      batch(cb: () => void) {
-        cb();
+      constructor(initialState: DrawerState) {
+        this._state = initialState;
       }
 
       setState(fn: (prev: DrawerState) => DrawerState) {
         this._state = fn(this._state);
-        this.options.onUpdate();
+        this.subscribers.forEach((sub) => sub(this._state));
       }
 
-      get state() {
-        return this._state;
+      subscribe(fn: (state: DrawerState) => void) {
+        this.subscribers.push(fn);
+        return { unsubscribe: () => {} };
       }
     },
   };
@@ -54,7 +53,6 @@ describe('drawerApi', () => {
   });
 
   it('should close the drawer if onBeforeClose allows it', () => {
-    drawerApi.open();
     drawerApi.close();
     expect(drawerApi.store.state.isOpen).toBe(false);
   });
@@ -83,6 +81,16 @@ describe('drawerApi', () => {
     expect(drawerApi.getData()).toEqual(testData);
   });
 
+  it('should return undefined before shared data is set', () => {
+    expect(drawerApi.getData()).toBeUndefined();
+  });
+
+  it('should preserve null shared data', () => {
+    const nullableDrawerApi = new DrawerApi<null | Record<string, unknown>>();
+    nullableDrawerApi.setData(null);
+    expect(nullableDrawerApi.getData()).toBeNull();
+  });
+
   it('should set state correctly using an object', () => {
     drawerApi.setState({ title: 'New Title' });
     expect(drawerApi.store.state.title).toBe('New Title');
@@ -100,14 +108,18 @@ describe('drawerApi', () => {
     expect(onOpenChange).toHaveBeenCalledWith(true);
   });
 
-  it('should batch state updates', () => {
-    const batchSpy = vi.spyOn(drawerApi.store, 'batch');
-    drawerApi.batchStore(() => {
-      drawerApi.setState({ title: 'Batch Title' });
-      drawerApi.setState({ confirmText: 'Batch Confirm' });
-    });
-    expect(batchSpy).toHaveBeenCalled();
-    expect(drawerApi.store.state.title).toBe('Batch Title');
-    expect(drawerApi.store.state.confirmText).toBe('Batch Confirm');
+  it('should call onClosed callback when provided', () => {
+    const onClosed = vi.fn();
+    const drawerApiWithHook = new DrawerApi({ onClosed });
+    drawerApiWithHook.onClosed();
+    expect(onClosed).toHaveBeenCalled();
+  });
+
+  it('should call onOpened callback when provided', () => {
+    const onOpened = vi.fn();
+    const drawerApiWithHook = new DrawerApi({ onOpened });
+    drawerApiWithHook.open();
+    drawerApiWithHook.onOpened();
+    expect(onOpened).toHaveBeenCalled();
   });
 });
diff --git a/packages/@core/ui-kit/popup-ui/src/drawer/__tests__/drawer-types.test.ts b/packages/@core/ui-kit/popup-ui/src/drawer/__tests__/drawer-types.test.ts
new file mode 100644
index 00000000..c0606776
--- /dev/null
+++ b/packages/@core/ui-kit/popup-ui/src/drawer/__tests__/drawer-types.test.ts
@@ -0,0 +1,59 @@
+import type { ExtendedDrawerApi, InferDrawerData } from '../drawer';
+import type { createVbenDrawer, useVbenDrawer } from '../use-drawer';
+import type TypedDrawer from './fixtures/typed-drawer.vue';
+
+import { describe, expectTypeOf, it } from 'vitest';
+
+interface TypedDrawerData {
+  id: number;
+  mode: 'edit' | 'view';
+}
+
+type DrawerData = null | TypedDrawerData;
+
+declare const createDrawer: typeof createVbenDrawer;
+declare const useDrawer: typeof useVbenDrawer;
+
+describe('drawer public data types', () => {
+  it('infers data from the connected component exposed api', () => {
+    function assertInferredData(connectedComponent: typeof TypedDrawer) {
+      const [, drawerApi] = useDrawer({ connectedComponent });
+
+      expectTypeOf(drawerApi).toEqualTypeOf<ExtendedDrawerApi<DrawerData>>();
+      expectTypeOf(drawerApi.getData()).toEqualTypeOf<DrawerData | undefined>();
+      expectTypeOf(drawerApi.setData).parameter(0).toEqualTypeOf<DrawerData>();
+      expectTypeOf(drawerApi.setData(null).open()).toBeVoid();
+      // @ts-expect-error invalid payload type
+      drawerApi.setData({ id: '1', mode: 'edit' });
+    }
+
+    expectTypeOf<
+      InferDrawerData<typeof TypedDrawer>
+    >().toEqualTypeOf<DrawerData>();
+    expectTypeOf(assertInferredData).toBeFunction();
+  });
+
+  it('supports explicit and pre-bound data contracts', () => {
+    function assertExplicitData() {
+      const [, explicitApi] = useDrawer<DrawerData>();
+      const useTypedDrawer = createDrawer<DrawerData>();
+      const [, preBoundApi] = useTypedDrawer();
+
+      expectTypeOf(explicitApi).toEqualTypeOf<ExtendedDrawerApi<DrawerData>>();
+      expectTypeOf(preBoundApi).toEqualTypeOf<ExtendedDrawerApi<DrawerData>>();
+    }
+
+    expectTypeOf(assertExplicitData).toBeFunction();
+  });
+
+  it('falls back to unknown without a data contract', () => {
+    function assertUnknownData() {
+      const [, drawerApi] = useDrawer();
+
+      expectTypeOf(drawerApi).toEqualTypeOf<ExtendedDrawerApi<unknown>>();
+      expectTypeOf(drawerApi.getData()).toBeUnknown();
+    }
+
+    expectTypeOf(assertUnknownData).toBeFunction();
+  });
+});
diff --git a/packages/@core/ui-kit/popup-ui/src/drawer/__tests__/drawer.test.ts b/packages/@core/ui-kit/popup-ui/src/drawer/__tests__/drawer.test.ts
new file mode 100644
index 00000000..2a7a230d
--- /dev/null
+++ b/packages/@core/ui-kit/popup-ui/src/drawer/__tests__/drawer.test.ts
@@ -0,0 +1,65 @@
+import type { App } from 'vue';
+
+import { createApp, defineComponent, h, nextTick } from 'vue';
+
+import { ELEMENT_ID_MAIN_CONTENT } from '@vben-core/shared/constants';
+
+import { afterEach, describe, expect, it, vi } from 'vitest';
+
+import { useVbenDrawer } from '../use-drawer';
+
+vi.mock('@vben-core/preferences', () => ({
+  usePreferences: () => ({
+    globalEscapeShortcutKey: { value: true },
+  }),
+}));
+
+let activeApp: App | undefined;
+
+async function mountPreopenedDrawer() {
+  const mainContent = document.createElement('main');
+  mainContent.id = ELEMENT_ID_MAIN_CONTENT;
+  mainContent.innerHTML = '<div><div></div></div>';
+  document.body.append(mainContent);
+
+  const Consumer = defineComponent(() => {
+    const [Drawer, drawerApi] = useVbenDrawer({ appendToMain: true });
+    drawerApi.open();
+    return () => h(Drawer);
+  });
+  const host = document.createElement('div');
+  document.body.append(host);
+
+  activeApp = createApp(() => h(Consumer));
+  activeApp.mount(host);
+  await nextTick();
+
+  return mainContent;
+}
+
+afterEach(() => {
+  activeApp?.unmount();
+  activeApp = undefined;
+  document.body.innerHTML = '';
+  vi.restoreAllMocks();
+});
+
+describe('vben drawer', () => {
+  it('mounts an initially open drawer directly in the main content', async () => {
+    const mainContent = await mountPreopenedDrawer();
+    const dialog = document.querySelector('[role="dialog"]');
+
+    expect(dialog).toBeInstanceOf(HTMLElement);
+    if (!(dialog instanceof HTMLElement)) return;
+    expect(dialog.parentElement).toBe(mainContent);
+  });
+
+  it('shows a drawer that is opened before mounting', async () => {
+    await mountPreopenedDrawer();
+    const dialog = document.querySelector('[role="dialog"]');
+
+    expect(dialog).toBeInstanceOf(HTMLElement);
+    if (!(dialog instanceof HTMLElement)) return;
+    expect(dialog.classList.contains('hidden')).toBe(false);
+  });
+});
diff --git a/packages/@core/ui-kit/popup-ui/src/drawer/__tests__/fixtures/typed-drawer.vue b/packages/@core/ui-kit/popup-ui/src/drawer/__tests__/fixtures/typed-drawer.vue
new file mode 100644
index 00000000..6bc2ba62
--- /dev/null
+++ b/packages/@core/ui-kit/popup-ui/src/drawer/__tests__/fixtures/typed-drawer.vue
@@ -0,0 +1,16 @@
+<script setup lang="ts">
+import { useVbenDrawer } from '../../use-drawer';
+
+interface TypedDrawerData {
+  id: number;
+  mode: 'edit' | 'view';
+}
+
+const [, drawerApi] = useVbenDrawer<TypedDrawerData | null>();
+
+defineExpose({ drawerApi });
+</script>
+
+<template>
+  <div />
+</template>
diff --git a/packages/@core/ui-kit/popup-ui/src/drawer/__tests__/use-drawer.test.ts b/packages/@core/ui-kit/popup-ui/src/drawer/__tests__/use-drawer.test.ts
new file mode 100644
index 00000000..64d4f99b
--- /dev/null
+++ b/packages/@core/ui-kit/popup-ui/src/drawer/__tests__/use-drawer.test.ts
@@ -0,0 +1,106 @@
+import type { App, Ref } from 'vue';
+
+import type { ExtendedDrawerApi } from '../drawer';
+
+import { createApp, defineComponent, h, nextTick, ref } from 'vue';
+
+import { afterEach, describe, expect, it, vi } from 'vitest';
+
+import { useVbenDrawer } from '../use-drawer';
+
+vi.mock('@vben-core/preferences', () => ({
+  usePreferences: () => ({
+    globalEscapeShortcutKey: { value: true },
+  }),
+}));
+
+vi.mock('../drawer.vue', () => ({
+  default: {
+    name: 'VbenDrawerStub',
+    render: () => null,
+  },
+}));
+
+let activeApp: App | undefined;
+
+async function mountRebindingHarness() {
+  const consumerKey = ref(0);
+  let currentApi: ExtendedDrawerApi | undefined;
+  const onOpenChange = vi.fn();
+
+  const Consumer = defineComponent(() => {
+    const [Drawer, drawerApi] = useVbenDrawer();
+    currentApi = drawerApi;
+    return () => h(Drawer);
+  });
+
+  const ConnectedDrawer = defineComponent(() => {
+    return () => h(Consumer, { key: consumerKey.value });
+  });
+
+  const [ParentDrawer, parentApi] = useVbenDrawer({
+    connectedComponent: ConnectedDrawer,
+    onOpenChange,
+    title: 'Parent drawer title',
+  });
+  const host = document.createElement('div');
+  document.body.append(host);
+
+  activeApp = createApp(() => h(ParentDrawer));
+  activeApp.mount(host);
+  await nextTick();
+
+  return {
+    consumerKey,
+    getCurrentApi: () => currentApi,
+    onOpenChange,
+    parentApi,
+  };
+}
+
+async function remountConsumer(consumerKey: Ref<number>) {
+  consumerKey.value += 1;
+  await nextTick();
+}
+
+afterEach(() => {
+  activeApp?.unmount();
+  activeApp = undefined;
+  document.body.innerHTML = '';
+  vi.restoreAllMocks();
+});
+
+describe('useVbenDrawer', () => {
+  it('rebinds the parent api when the consumer is recreated', async () => {
+    const { consumerKey, getCurrentApi, onOpenChange, parentApi } =
+      await mountRebindingHarness();
+    const initialApi = getCurrentApi();
+
+    expect(initialApi).toBeDefined();
+    if (!initialApi) return;
+    expect(parentApi.store).toBe(initialApi.store);
+    const initialData = { id: 1 };
+    parentApi.setData(initialData);
+    expect(initialApi.getData()).toBe(initialData);
+
+    await remountConsumer(consumerKey);
+    const recreatedApi = getCurrentApi();
+
+    expect(recreatedApi).toBeDefined();
+    if (!recreatedApi) return;
+    expect(recreatedApi).not.toBe(initialApi);
+    expect(recreatedApi.store.state.title).toBe('Parent drawer title');
+    expect(parentApi.store).toBe(recreatedApi.store);
+    const recreatedData = { id: 2 };
+    parentApi.setData(recreatedData);
+    expect(recreatedApi.getData()).toBe(recreatedData);
+
+    parentApi.open();
+    expect(onOpenChange).toHaveBeenCalledWith(true);
+    expect(recreatedApi.store.state.isOpen).toBe(true);
+    expect(initialApi.store.state.isOpen).toBe(false);
+
+    await parentApi.close();
+    expect(recreatedApi.store.state.isOpen).toBe(false);
+  });
+});
diff --git a/packages/@core/ui-kit/popup-ui/src/drawer/drawer-api.ts b/packages/@core/ui-kit/popup-ui/src/drawer/drawer-api.ts
index 6ceee088..31c4aaf3 100644
--- a/packages/@core/ui-kit/popup-ui/src/drawer/drawer-api.ts
+++ b/packages/@core/ui-kit/popup-ui/src/drawer/drawer-api.ts
@@ -3,34 +3,42 @@ import type { DrawerApiOptions, DrawerState } from './drawer';
 import { Store } from '@vben-core/shared/store';
 import { bindMethods, isFunction } from '@vben-core/shared/utils';
 
-export class DrawerApi {
+export class DrawerApi<TData = unknown> {
+  // 共享数据
+  public sharedData: Record<'payload', TData | undefined> = {
+    payload: undefined,
+  };
+  public store: Store<DrawerState>;
+
   private api: Pick<
     DrawerApiOptions,
-    'onBeforeClose' | 'onCancel' | 'onConfirm' | 'onOpenChange'
+    | 'onBeforeClose'
+    | 'onCancel'
+    | 'onClosed'
+    | 'onConfirm'
+    | 'onOpenChange'
+    | 'onOpened'
   >;
+
   // private prevState!: DrawerState;
   private state!: DrawerState;
 
-  // 共享数据
-  public sharedData: Record<'payload', any> = {
-    payload: {},
-  };
-
-  public store: Store<DrawerState>;
-
   constructor(options: DrawerApiOptions = {}) {
     const {
       connectedComponent: _,
       onBeforeClose,
       onCancel,
+      onClosed,
       onConfirm,
       onOpenChange,
+      onOpened,
       ...storeState
     } = options;
 
     const defaultState: DrawerState = {
       class: '',
       closable: true,
+      closeIconPlacement: 'right',
       closeOnClickModal: true,
       closeOnPressEscape: true,
       confirmLoading: false,
@@ -44,55 +52,62 @@ export class DrawerApi {
       placement: 'right',
       showCancelButton: true,
       showConfirmButton: true,
+      submitting: false,
       title: '',
     };
 
-    this.store = new Store<DrawerState>(
-      {
-        ...defaultState,
-        ...storeState,
-      },
-      {
-        onUpdate: () => {
-          const state = this.store.state;
-          if (state?.isOpen === this.state?.isOpen) {
-            this.state = state;
-          } else {
-            this.state = state;
-            this.api.onOpenChange?.(!!state?.isOpen);
-          }
-        },
-      },
-    );
+    this.store = new Store<DrawerState>({
+      ...defaultState,
+      ...storeState,
+    });
+
+    this.store.subscribe((state) => {
+      const prevIsOpen = this.state?.isOpen;
+      this.state = state;
+      if (state?.isOpen !== prevIsOpen) {
+        this.api.onOpenChange?.(!!state?.isOpen);
+      }
+    });
     this.state = this.store.state;
     this.api = {
       onBeforeClose,
       onCancel,
+      onClosed,
       onConfirm,
       onOpenChange,
+      onOpened,
     };
     bindMethods(this);
   }
 
-  // 如果需要多次更新状态，可以使用 batch 方法
-  batchStore(cb: () => void) {
-    this.store.batch(cb);
-  }
-
   /**
-   * 关闭弹窗
+   * 关闭抽屉
+   * @description 关闭抽屉时会调用 onBeforeClose 钩子函数，如果 onBeforeClose 返回 false，则不关闭弹窗
    */
-  close() {
+  async close() {
     // 通过 onBeforeClose 钩子函数来判断是否允许关闭弹窗
     // 如果 onBeforeClose 返回 false，则不关闭弹窗
-    const allowClose = this.api.onBeforeClose?.() ?? true;
+    const allowClose = (await this.api.onBeforeClose?.()) ?? true;
     if (allowClose) {
-      this.store.setState((prev) => ({ ...prev, isOpen: false }));
+      this.store.setState((prev) => ({
+        ...prev,
+        isOpen: false,
+        submitting: false,
+      }));
     }
   }
 
-  getData<T extends object = Record<string, any>>() {
-    return (this.sharedData?.payload ?? {}) as T;
+  getData(): TData | undefined {
+    return this.sharedData.payload;
+  }
+
+  /**
+   * 锁定抽屉状态（用于提交过程中的等待状态）
+   * @description 锁定状态将禁用默认的取消按钮，使用spinner覆盖抽屉内容，隐藏关闭按钮，阻止手动关闭弹窗，将默认的提交按钮标记为loading状态
+   * @param isLocked 是否锁定
+   */
+  lock(isLocked: boolean = true) {
+    return this.setState({ submitting: isLocked });
   }
 
   /**
@@ -106,6 +121,15 @@ export class DrawerApi {
     }
   }
 
+  /**
+   * 弹窗关闭动画播放完毕后的回调
+   */
+  onClosed() {
+    if (!this.state.isOpen) {
+      this.api.onClosed?.();
+    }
+  }
+
   /**
    * 确认操作
    */
@@ -113,12 +137,22 @@ export class DrawerApi {
     this.api.onConfirm?.();
   }
 
+  /**
+   * 弹窗打开动画播放完毕后的回调
+   */
+  onOpened() {
+    if (this.state.isOpen) {
+      this.api.onOpened?.();
+    }
+  }
+
   open() {
     this.store.setState((prev) => ({ ...prev, isOpen: true }));
   }
 
-  setData<T>(payload: T) {
+  setData(payload: TData) {
     this.sharedData.payload = payload;
+    return this;
   }
 
   setState(
@@ -131,5 +165,14 @@ export class DrawerApi {
     } else {
       this.store.setState((prev) => ({ ...prev, ...stateOrFn }));
     }
+    return this;
+  }
+
+  /**
+   * 解除抽屉的锁定状态
+   * @description 解除由lock方法设置的锁定状态，是lock(false)的别名
+   */
+  unlock() {
+    return this.lock(false);
   }
 }
diff --git a/packages/@core/ui-kit/popup-ui/src/drawer/drawer.ts b/packages/@core/ui-kit/popup-ui/src/drawer/drawer.ts
index f75ee50c..4124ee31 100644
--- a/packages/@core/ui-kit/popup-ui/src/drawer/drawer.ts
+++ b/packages/@core/ui-kit/popup-ui/src/drawer/drawer.ts
@@ -1,11 +1,13 @@
-import type { ClassType } from '@vben-core/typings';
+import type { Component, Ref } from 'vue';
+
+import type { ClassType, MaybePromise } from '@vben-core/typings';
 
 import type { DrawerApi } from './drawer-api';
 
-import type { Component, Ref } from 'vue';
-
 export type DrawerPlacement = 'bottom' | 'left' | 'right' | 'top';
 
+export type CloseIconPlacement = 'left' | 'right';
+
 export interface DrawerProps {
   /**
    * 是否挂载到内容区域
@@ -18,10 +20,14 @@ export interface DrawerProps {
   cancelText?: string;
   class?: ClassType;
   /**
-   * 是否显示右上角的关闭按钮
+   * 是否显示关闭按钮
    * @default true
    */
   closable?: boolean;
+  /**
+   * 关闭按钮的位置
+   */
+  closeIconPlacement?: CloseIconPlacement;
   /**
    * 点击弹窗遮罩是否关闭弹窗
    * @default true
@@ -46,6 +52,10 @@ export interface DrawerProps {
    * 弹窗描述
    */
   description?: string;
+  /**
+   * 在关闭时销毁抽屉
+   */
+  destroyOnClose?: boolean;
   /**
    * 是否显示底部
    * @default true
@@ -65,20 +75,24 @@ export interface DrawerProps {
    */
   headerClass?: ClassType;
   /**
-   * 弹窗是否显示
+   * 抽屉加载状态
    * @default false
    */
   loading?: boolean;
-
   /**
    * 是否显示遮罩
    * @default true
    */
   modal?: boolean;
+
   /**
    * 是否自动聚焦
    */
   openAutoFocus?: boolean;
+  /**
+   * 弹窗遮罩模糊效果
+   */
+  overlayBlur?: number;
   /**
    * 抽屉位置
    * @default right
@@ -95,6 +109,10 @@ export interface DrawerProps {
    * @default true
    */
   showConfirmButton?: boolean;
+  /**
+   * 提交中（锁定抽屉状态）
+   */
+  submitting?: boolean;
   /**
    * 弹窗标题
    */
@@ -112,32 +130,50 @@ export interface DrawerProps {
 export interface DrawerState extends DrawerProps {
   /** 弹窗打开状态 */
   isOpen?: boolean;
-  /**
-   * 共享数据
-   */
-  sharedData?: Record<string, any>;
 }
 
-export type ExtendedDrawerApi = {
+export type ExtendedDrawerApi<TData = unknown> = DrawerApi<TData> & {
   useStore: <T = NoInfer<DrawerState>>(
     selector?: (state: NoInfer<DrawerState>) => T,
   ) => Readonly<Ref<T>>;
-} & DrawerApi;
+};
 
-export interface DrawerApiOptions extends DrawerState {
+type DrawerComponentInstance<TComponent extends Component> =
+  TComponent extends abstract new (...args: any[]) => infer TInstance
+    ? TInstance
+    : never;
+
+export type InferDrawerData<TComponent extends Component> = [
+  DrawerComponentInstance<TComponent>,
+] extends [never]
+  ? unknown
+  : DrawerComponentInstance<TComponent> extends {
+        drawerApi: ExtendedDrawerApi<infer TData>;
+      }
+    ? TData
+    : unknown;
+
+export interface DrawerApiOptions<
+  TConnectedComponent extends Component = Component,
+> extends DrawerState {
   /**
-   * 独立的弹窗组件
+   * 独立的抽屉组件
    */
-  connectedComponent?: Component;
+  connectedComponent?: TConnectedComponent;
   /**
    * 关闭前的回调，返回 false 可以阻止关闭
    * @returns
    */
-  onBeforeClose?: () => void;
+  onBeforeClose?: () => MaybePromise<boolean | undefined>;
   /**
    * 点击取消按钮的回调
    */
   onCancel?: () => void;
+  /**
+   * 弹窗关闭动画结束的回调
+   * @returns
+   */
+  onClosed?: () => void;
   /**
    * 点击确定按钮的回调
    */
@@ -148,4 +184,9 @@ export interface DrawerApiOptions extends DrawerState {
    * @returns
    */
   onOpenChange?: (isOpen: boolean) => void;
+  /**
+   * 弹窗打开动画结束的回调
+   * @returns
+   */
+  onOpened?: () => void;
 }
diff --git a/packages/@core/ui-kit/popup-ui/src/drawer/drawer.vue b/packages/@core/ui-kit/popup-ui/src/drawer/drawer.vue
index 31a40988..b2107277 100644
--- a/packages/@core/ui-kit/popup-ui/src/drawer/drawer.vue
+++ b/packages/@core/ui-kit/popup-ui/src/drawer/drawer.vue
@@ -1,7 +1,15 @@
 <script lang="ts" setup>
 import type { DrawerProps, ExtendedDrawerApi } from './drawer';
 
-import { computed, provide, ref, useId, watch } from 'vue';
+import {
+  computed,
+  onDeactivated,
+  provide,
+  ref,
+  unref,
+  useId,
+  watch,
+} from 'vue';
 
 import {
   useIsMobile,
@@ -10,6 +18,7 @@ import {
 } from '@vben-core/composables';
 import { X } from '@vben-core/icons';
 import {
+  Separator,
   Sheet,
   SheetClose,
   SheetContent,
@@ -33,7 +42,10 @@ interface Props extends DrawerProps {
 
 const props = withDefaults(defineProps<Props>(), {
   appendToMain: false,
+  closeIconPlacement: 'right',
+  destroyOnClose: false,
   drawerApi: undefined,
+  submitting: false,
   zIndex: 1000,
 });
 
@@ -42,6 +54,7 @@ const components = globalShareState.getComponents();
 const id = useId();
 provide('DISMISSABLE_DRAWER_ID', id);
 
+// @ts-expect-error unused
 const wrapperRef = ref<HTMLElement>();
 const { $t } = useSimpleLocale();
 const { isMobile } = useIsMobile();
@@ -53,12 +66,14 @@ const {
   cancelText,
   class: drawerClass,
   closable,
+  closeIconPlacement,
   closeOnClickModal,
   closeOnPressEscape,
   confirmLoading,
   confirmText,
   contentClass,
   description,
+  destroyOnClose,
   footer: showFooter,
   footerClass,
   header: showHeader,
@@ -66,33 +81,45 @@ const {
   loading: showLoading,
   modal,
   openAutoFocus,
+  overlayBlur,
   placement,
   showCancelButton,
   showConfirmButton,
+  submitting,
   title,
   titleTooltip,
   zIndex,
 } = usePriorityValues(props, state);
 
-watch(
-  () => showLoading.value,
-  (v) => {
-    if (v && wrapperRef.value) {
-      wrapperRef.value.scrollTo({
-        // behavior: 'smooth',
-        top: 0,
-      });
-    }
-  },
-);
+// watch(
+//   () => showLoading.value,
+//   (v) => {
+//     if (v && wrapperRef.value) {
+//       wrapperRef.value.scrollTo({
+//         // behavior: 'smooth',
+//         top: 0,
+//       });
+//     }
+//   },
+// );
+
+/**
+ * 在开启keepAlive情况下 直接通过浏览器按钮/手势等返回 不会关闭弹窗
+ */
+onDeactivated(() => {
+  // 如果弹窗没有被挂载到内容区域，则关闭弹窗
+  if (!appendToMain.value) {
+    props.drawerApi?.close();
+  }
+});
 
 function interactOutside(e: Event) {
-  if (!closeOnClickModal.value) {
+  if (!closeOnClickModal.value || submitting.value) {
     e.preventDefault();
   }
 }
 function escapeKeyDown(e: KeyboardEvent) {
-  if (!closeOnPressEscape.value) {
+  if (!closeOnPressEscape.value || submitting.value) {
     e.preventDefault();
   }
 }
@@ -100,7 +127,11 @@ function escapeKeyDown(e: KeyboardEvent) {
 function pointerDownOutside(e: Event) {
   const target = e.target as HTMLElement;
   const dismissableDrawer = target?.dataset.dismissableDrawer;
-  if (!closeOnClickModal.value || dismissableDrawer !== id) {
+  if (
+    submitting.value ||
+    !closeOnClickModal.value ||
+    dismissableDrawer !== id
+  ) {
     e.preventDefault();
   }
 }
@@ -119,6 +150,30 @@ function handleFocusOutside(e: Event) {
 const getAppendTo = computed(() => {
   return appendToMain.value ? `#${ELEMENT_ID_MAIN_CONTENT}` : undefined;
 });
+
+/**
+ * destroyOnClose功能完善
+ */
+// 是否打开过
+const hasOpened = ref(false);
+const isClosed = ref(true);
+watch(
+  () => state?.value?.isOpen,
+  (value) => {
+    isClosed.value = false;
+    if (value && !unref(hasOpened)) {
+      hasOpened.value = true;
+    }
+  },
+  { immediate: true },
+);
+function handleClosed() {
+  isClosed.value = true;
+  props.drawerApi?.onClosed();
+}
+const getForceMount = computed(() => {
+  return !unref(destroyOnClose) && unref(hasOpened);
+});
 </script>
 <template>
   <Sheet
@@ -129,35 +184,64 @@ const getAppendTo = computed(() => {
     <SheetContent
       :append-to="getAppendTo"
       :class="
-        cn('flex w-[520px] flex-col', drawerClass, {
-          '!w-full': isMobile || placement === 'bottom' || placement === 'top',
-          'max-h-[100vh]': placement === 'bottom' || placement === 'top',
-        })
+        cn(
+          'flex w-130 flex-col',
+          {
+            'w-full!':
+              isMobile || placement === 'bottom' || placement === 'top',
+            'max-h-screen': placement === 'bottom' || placement === 'top',
+            hidden: isClosed,
+          },
+          drawerClass,
+        )
       "
       :modal="modal"
       :open="state?.isOpen"
       :side="placement"
       :z-index="zIndex"
+      :force-mount="getForceMount"
+      :overlay-blur="overlayBlur"
       @close-auto-focus="handleFocusOutside"
+      @closed="handleClosed"
       @escape-key-down="escapeKeyDown"
       @focus-outside="handleFocusOutside"
       @interact-outside="interactOutside"
       @open-auto-focus="handerOpenAutoFocus"
+      @opened="() => drawerApi?.onOpened()"
       @pointer-down-outside="pointerDownOutside"
     >
       <SheetHeader
         v-if="showHeader"
         :class="
           cn(
-            '!flex flex-row items-center justify-between border-b px-6 py-5',
+            'flex! flex-row items-center justify-between border-b px-6 py-5',
             headerClass,
             {
               'px-4 py-3': closable,
+              'pl-2': closable && closeIconPlacement === 'left',
             },
           )
         "
       >
-        <div>
+        <div class="flex items-center">
+          <SheetClose
+            v-if="closable && closeIconPlacement === 'left'"
+            as-child
+            :disabled="submitting"
+            class="ml-0.5 cursor-pointer rounded-full opacity-80 transition-opacity hover:opacity-100 focus:outline-hidden disabled:pointer-events-none data-[state=open]:bg-secondary"
+          >
+            <slot name="close-icon">
+              <VbenIconButton>
+                <X class="size-4" />
+              </VbenIconButton>
+            </slot>
+          </SheetClose>
+          <Separator
+            v-if="closable && closeIconPlacement === 'left'"
+            class="mr-2 ml-1 h-8"
+            decorative
+            orientation="vertical"
+          />
           <SheetTitle v-if="title" class="text-left">
             <slot name="title">
               {{ title }}
@@ -182,13 +266,16 @@ const getAppendTo = computed(() => {
         <div class="flex-center">
           <slot name="extra"></slot>
           <SheetClose
-            v-if="closable"
+            v-if="closable && closeIconPlacement === 'right'"
             as-child
-            class="data-[state=open]:bg-secondary ml-[2px] cursor-pointer rounded-full opacity-80 transition-opacity hover:opacity-100 focus:outline-none disabled:pointer-events-none"
+            :disabled="submitting"
+            class="ml-0.5 cursor-pointer rounded-full opacity-80 transition-opacity hover:opacity-100 focus:outline-hidden disabled:pointer-events-none data-[state=open]:bg-secondary"
           >
-            <VbenIconButton>
-              <X class="size-4" />
-            </VbenIconButton>
+            <slot name="close-icon">
+              <VbenIconButton>
+                <X class="size-4" />
+              </VbenIconButton>
+            </slot>
           </SheetClose>
         </div>
       </SheetHeader>
@@ -202,15 +289,13 @@ const getAppendTo = computed(() => {
         ref="wrapperRef"
         :class="
           cn('relative flex-1 overflow-y-auto p-3', contentClass, {
-            'overflow-hidden': showLoading,
+            'pointer-events-none': showLoading || submitting,
           })
         "
       >
-        <VbenLoading v-if="showLoading" class="size-full" spinning />
-
         <slot></slot>
       </div>
-
+      <VbenLoading v-if="showLoading || submitting" spinning />
       <SheetFooter
         v-if="showFooter"
         :class="
@@ -226,17 +311,18 @@ const getAppendTo = computed(() => {
             :is="components.DefaultButton || VbenButton"
             v-if="showCancelButton"
             variant="ghost"
+            :disabled="submitting"
             @click="() => drawerApi?.onCancel()"
           >
             <slot name="cancelText">
               {{ cancelText || $t('cancel') }}
             </slot>
           </component>
-
+          <slot name="center-footer"></slot>
           <component
             :is="components.PrimaryButton || VbenButton"
             v-if="showConfirmButton"
-            :loading="confirmLoading"
+            :loading="confirmLoading || submitting"
             @click="() => drawerApi?.onConfirm()"
           >
             <slot name="confirmText">
diff --git a/packages/@core/ui-kit/popup-ui/src/drawer/index.ts b/packages/@core/ui-kit/popup-ui/src/drawer/index.ts
index f2dd8396..bf099a08 100644
--- a/packages/@core/ui-kit/popup-ui/src/drawer/index.ts
+++ b/packages/@core/ui-kit/popup-ui/src/drawer/index.ts
@@ -1,3 +1,7 @@
 export type * from './drawer';
 export { default as VbenDrawer } from './drawer.vue';
-export { useVbenDrawer } from './use-drawer';
+export {
+  createVbenDrawer,
+  setDefaultDrawerProps,
+  useVbenDrawer,
+} from './use-drawer';
diff --git a/packages/@core/ui-kit/popup-ui/src/drawer/use-drawer.ts b/packages/@core/ui-kit/popup-ui/src/drawer/use-drawer.ts
index c3ff263b..53e80372 100644
--- a/packages/@core/ui-kit/popup-ui/src/drawer/use-drawer.ts
+++ b/packages/@core/ui-kit/popup-ui/src/drawer/use-drawer.ts
@@ -1,69 +1,162 @@
+import type { Component } from 'vue';
+
 import type {
   DrawerApiOptions,
   DrawerProps,
   ExtendedDrawerApi,
+  InferDrawerData,
 } from './drawer';
 
-import { defineComponent, h, inject, nextTick, provide, reactive } from 'vue';
+import {
+  defineComponent,
+  h,
+  inject,
+  markRaw,
+  nextTick,
+  onBeforeUnmount,
+  provide,
+  ref,
+  shallowReactive,
+} from 'vue';
 
-import { useStore } from '@vben-core/shared/store';
+import { usePreferences } from '@vben-core/preferences';
+import { useSelector } from '@vben-core/shared/store';
 
-import VbenDrawer from './drawer.vue';
 import { DrawerApi } from './drawer-api';
+import VbenDrawer from './drawer.vue';
 
 const USER_DRAWER_INJECT_KEY = Symbol('VBEN_DRAWER_INJECT');
 
+declare const DRAWER_DATA_NOT_PROVIDED: unique symbol;
+
+type DrawerDataNotProvided = {
+  readonly [DRAWER_DATA_NOT_PROVIDED]: true;
+};
+
+type ResolvedDrawerData<
+  TData,
+  TConnectedComponent extends Component,
+> = TData extends DrawerDataNotProvided
+  ? InferDrawerData<TConnectedComponent>
+  : TData;
+
+interface DrawerInjectData<TData> {
+  consumed?: boolean;
+  extendApi?: (api: ExtendedDrawerApi<TData>) => void;
+  options?: DrawerApiOptions;
+  reCreateDrawer?: () => Promise<void>;
+}
+
+const { globalEscapeShortcutKey } = usePreferences();
+
+/**
+ * 默认配置
+ */
+const DEFAULT_DRAWER_PROPS: Partial<DrawerProps> = {};
+
+export function setDefaultDrawerProps(props: Partial<DrawerProps>) {
+  Object.assign(DEFAULT_DRAWER_PROPS, props);
+}
+
 export function useVbenDrawer<
-  TParentDrawerProps extends DrawerProps = DrawerProps,
->(options: DrawerApiOptions = {}) {
+  TData = DrawerDataNotProvided,
+  TConnectedComponent extends Component = Component,
+>(options: DrawerApiOptions<TConnectedComponent> = {}) {
+  type TResolvedData = ResolvedDrawerData<TData, TConnectedComponent>;
+
   // Drawer一般会抽离出来，所以如果有传入 connectedComponent，则表示为外部调用，与内部组件进行连接
   // 外部的Drawer通过provide/inject传递api
 
+  const defaultOptions = {
+    closeOnPressEscape: globalEscapeShortcutKey.value, // 全局Esc快捷键配置
+    ...options,
+  };
   const { connectedComponent } = options;
   if (connectedComponent) {
-    const extendedApi = reactive({});
+    const extendedApi = shallowReactive({}) as ExtendedDrawerApi<TResolvedData>;
+    const isDrawerReady = ref(true);
     const Drawer = defineComponent(
-      (props: TParentDrawerProps, { attrs, slots }) => {
+      (props: DrawerProps, { attrs, slots }) => {
+        function rebindApi(api: ExtendedDrawerApi<TResolvedData>) {
+          Object.setPrototypeOf(extendedApi, markRaw(api));
+        }
+
         provide(USER_DRAWER_INJECT_KEY, {
-          extendApi(api: ExtendedDrawerApi) {
-            // 不能直接给 reactive 赋值，会丢失响应
-            // 不能用 Object.assign,会丢失 api 的原型函数
-            Object.setPrototypeOf(extendedApi, api);
+          extendApi: rebindApi,
+          consumed: false,
+          options: defaultOptions,
+          async reCreateDrawer() {
+            isDrawerReady.value = false;
+            await nextTick();
+            isDrawerReady.value = true;
           },
-          options,
         });
-        checkProps(extendedApi as ExtendedDrawerApi, {
+        checkProps(extendedApi, {
           ...props,
           ...attrs,
           ...slots,
         });
-        return () => h(connectedComponent, { ...props, ...attrs }, slots);
+        return () =>
+          h(
+            isDrawerReady.value ? connectedComponent : 'div',
+            { ...props, ...attrs },
+            slots,
+          );
       },
+      // eslint-disable-next-line vue/one-component-per-file
       {
-        inheritAttrs: false,
         name: 'VbenParentDrawer',
+        inheritAttrs: false,
       },
     );
-    return [Drawer, extendedApi as ExtendedDrawerApi] as const;
+
+    return [Drawer, extendedApi] as const;
   }
 
-  const injectData = inject<any>(USER_DRAWER_INJECT_KEY, {});
+  const injectData = inject<DrawerInjectData<TResolvedData>>(
+    USER_DRAWER_INJECT_KEY,
+    {},
+  );
+  const isConsumed = injectData.consumed;
+  const effectiveOptions = isConsumed ? {} : injectData.options;
+  if (!isConsumed && injectData.consumed !== undefined) {
+    injectData.consumed = true;
+  }
+  onBeforeUnmount(() => {
+    if (!isConsumed && injectData.consumed !== undefined) {
+      injectData.consumed = false;
+    }
+  });
 
   const mergedOptions = {
-    ...injectData.options,
-    ...options,
+    ...DEFAULT_DRAWER_PROPS,
+    ...effectiveOptions,
+    ...defaultOptions,
   } as DrawerApiOptions;
 
   mergedOptions.onOpenChange = (isOpen: boolean) => {
     options.onOpenChange?.(isOpen);
-    injectData.options?.onOpenChange?.(isOpen);
+    if (!isConsumed) {
+      injectData.options?.onOpenChange?.(isOpen);
+    }
   };
-  const api = new DrawerApi(mergedOptions);
 
-  const extendedApi: ExtendedDrawerApi = api as never;
+  const onClosed = mergedOptions.onClosed;
+  mergedOptions.onClosed = () => {
+    onClosed?.();
+    if (mergedOptions.destroyOnClose && !isConsumed) {
+      if (injectData.consumed !== undefined) {
+        injectData.consumed = false;
+      }
+      injectData.reCreateDrawer?.();
+    }
+  };
+  const api = new DrawerApi<TResolvedData>(mergedOptions);
+
+  const extendedApi = api as ExtendedDrawerApi<TResolvedData>;
 
   extendedApi.useStore = (selector) => {
-    return useStore(api.store, selector);
+    return useSelector(api.store, selector);
   };
 
   const Drawer = defineComponent(
@@ -71,16 +164,28 @@ export function useVbenDrawer<
       return () =>
         h(VbenDrawer, { ...props, ...attrs, drawerApi: extendedApi }, slots);
     },
+    // eslint-disable-next-line vue/one-component-per-file
     {
-      inheritAttrs: false,
       name: 'VbenDrawer',
+      inheritAttrs: false,
     },
   );
   injectData.extendApi?.(extendedApi);
   return [Drawer, extendedApi] as const;
 }
 
-async function checkProps(api: ExtendedDrawerApi, attrs: Record<string, any>) {
+export function createVbenDrawer<TData = unknown>() {
+  return function useTypedVbenDrawer<
+    TConnectedComponent extends Component = Component,
+  >(options: DrawerApiOptions<TConnectedComponent> = {}) {
+    return useVbenDrawer<TData, TConnectedComponent>(options);
+  };
+}
+
+async function checkProps<TData>(
+  api: ExtendedDrawerApi<TData>,
+  attrs: Record<string, any>,
+) {
   if (!attrs || Object.keys(attrs).length === 0) {
     return;
   }
diff --git a/packages/@core/ui-kit/popup-ui/src/index.ts b/packages/@core/ui-kit/popup-ui/src/index.ts
index 56e7ade5..7b9c47f4 100644
--- a/packages/@core/ui-kit/popup-ui/src/index.ts
+++ b/packages/@core/ui-kit/popup-ui/src/index.ts
@@ -1,2 +1,3 @@
+export * from './alert';
 export * from './drawer';
 export * from './modal';
diff --git a/packages/@core/ui-kit/popup-ui/src/modal/__tests__/fixtures/typed-modal.vue b/packages/@core/ui-kit/popup-ui/src/modal/__tests__/fixtures/typed-modal.vue
new file mode 100644
index 00000000..5adb21fa
--- /dev/null
+++ b/packages/@core/ui-kit/popup-ui/src/modal/__tests__/fixtures/typed-modal.vue
@@ -0,0 +1,16 @@
+<script setup lang="ts">
+import { useVbenModal } from '../../use-modal';
+
+interface TypedModalData {
+  id: number;
+  mode: 'edit' | 'view';
+}
+
+const [, modalApi] = useVbenModal<TypedModalData | null>();
+
+defineExpose({ modalApi });
+</script>
+
+<template>
+  <div />
+</template>
diff --git a/packages/@core/ui-kit/popup-ui/src/modal/__tests__/modal-api.test.ts b/packages/@core/ui-kit/popup-ui/src/modal/__tests__/modal-api.test.ts
index 9c2ef200..dae99a64 100644
--- a/packages/@core/ui-kit/popup-ui/src/modal/__tests__/modal-api.test.ts
+++ b/packages/@core/ui-kit/popup-ui/src/modal/__tests__/modal-api.test.ts
@@ -8,25 +8,24 @@ vi.mock('@vben-core/shared/store', () => {
   return {
     isFunction: (fn: any) => typeof fn === 'function',
     Store: class {
-      private _state: ModalState;
-      private options: any;
-
-      constructor(initialState: ModalState, options: any) {
-        this._state = initialState;
-        this.options = options;
+      get state() {
+        return this._state;
       }
+      private _state: ModalState;
+      private subscribers: Array<(state: ModalState) => void> = [];
 
-      batch(cb: () => void) {
-        cb();
+      constructor(initialState: ModalState) {
+        this._state = initialState;
       }
 
       setState(fn: (prev: ModalState) => ModalState) {
         this._state = fn(this._state);
-        this.options.onUpdate();
+        this.subscribers.forEach((sub) => sub(this._state));
       }
 
-      get state() {
-        return this._state;
+      subscribe(fn: (state: ModalState) => void) {
+        this.subscribers.push(fn);
+        return { unsubscribe: () => {} };
       }
     },
   };
@@ -83,6 +82,16 @@ describe('modalApi', () => {
     expect(modalApi.getData()).toEqual(testData);
   });
 
+  it('should return undefined before shared data is set', () => {
+    expect(modalApi.getData()).toBeUndefined();
+  });
+
+  it('should preserve null shared data', () => {
+    const nullableModalApi = new ModalApi<null | Record<string, unknown>>();
+    nullableModalApi.setData(null);
+    expect(nullableModalApi.getData()).toBeNull();
+  });
+
   it('should set state correctly using an object', () => {
     modalApi.setState({ title: 'New Title' });
     expect(modalApi.store.state.title).toBe('New Title');
@@ -100,17 +109,6 @@ describe('modalApi', () => {
     expect(onOpenChange).toHaveBeenCalledWith(true);
   });
 
-  it('should batch state updates', () => {
-    const batchSpy = vi.spyOn(modalApi.store, 'batch');
-    modalApi.batchStore(() => {
-      modalApi.setState({ title: 'Batch Title' });
-      modalApi.setState({ confirmText: 'Batch Confirm' });
-    });
-    expect(batchSpy).toHaveBeenCalled();
-    expect(modalApi.store.state.title).toBe('Batch Title');
-    expect(modalApi.store.state.confirmText).toBe('Batch Confirm');
-  });
-
   it('should call onClosed callback when provided', () => {
     const onClosed = vi.fn();
     const modalApiWithHook = new ModalApi({ onClosed });
diff --git a/packages/@core/ui-kit/popup-ui/src/modal/__tests__/modal-types.test.ts b/packages/@core/ui-kit/popup-ui/src/modal/__tests__/modal-types.test.ts
new file mode 100644
index 00000000..d91d5393
--- /dev/null
+++ b/packages/@core/ui-kit/popup-ui/src/modal/__tests__/modal-types.test.ts
@@ -0,0 +1,59 @@
+import type { ExtendedModalApi, InferModalData } from '../modal';
+import type { createVbenModal, useVbenModal } from '../use-modal';
+import type TypedModal from './fixtures/typed-modal.vue';
+
+import { describe, expectTypeOf, it } from 'vitest';
+
+interface TypedModalData {
+  id: number;
+  mode: 'edit' | 'view';
+}
+
+type ModalData = null | TypedModalData;
+
+declare const createModal: typeof createVbenModal;
+declare const useModal: typeof useVbenModal;
+
+describe('modal public data types', () => {
+  it('infers data from the connected component exposed api', () => {
+    function assertInferredData(connectedComponent: typeof TypedModal) {
+      const [, modalApi] = useModal({ connectedComponent });
+
+      expectTypeOf(modalApi).toEqualTypeOf<ExtendedModalApi<ModalData>>();
+      expectTypeOf(modalApi.getData()).toEqualTypeOf<ModalData | undefined>();
+      expectTypeOf(modalApi.setData).parameter(0).toEqualTypeOf<ModalData>();
+      expectTypeOf(modalApi.setData(null).open()).toBeVoid();
+      // @ts-expect-error invalid payload type
+      modalApi.setData({ id: '1', mode: 'edit' });
+    }
+
+    expectTypeOf<
+      InferModalData<typeof TypedModal>
+    >().toEqualTypeOf<ModalData>();
+    expectTypeOf(assertInferredData).toBeFunction();
+  });
+
+  it('supports explicit and pre-bound data contracts', () => {
+    function assertExplicitData() {
+      const [, explicitApi] = useModal<ModalData>();
+      const useTypedModal = createModal<ModalData>();
+      const [, preBoundApi] = useTypedModal();
+
+      expectTypeOf(explicitApi).toEqualTypeOf<ExtendedModalApi<ModalData>>();
+      expectTypeOf(preBoundApi).toEqualTypeOf<ExtendedModalApi<ModalData>>();
+    }
+
+    expectTypeOf(assertExplicitData).toBeFunction();
+  });
+
+  it('falls back to unknown without a data contract', () => {
+    function assertUnknownData() {
+      const [, modalApi] = useModal();
+
+      expectTypeOf(modalApi).toEqualTypeOf<ExtendedModalApi<unknown>>();
+      expectTypeOf(modalApi.getData()).toBeUnknown();
+    }
+
+    expectTypeOf(assertUnknownData).toBeFunction();
+  });
+});
diff --git a/packages/@core/ui-kit/popup-ui/src/modal/__tests__/modal.test.ts b/packages/@core/ui-kit/popup-ui/src/modal/__tests__/modal.test.ts
new file mode 100644
index 00000000..15ec0403
--- /dev/null
+++ b/packages/@core/ui-kit/popup-ui/src/modal/__tests__/modal.test.ts
@@ -0,0 +1,102 @@
+import type { App } from 'vue';
+
+import { createApp, defineComponent, h, nextTick, onMounted } from 'vue';
+
+import { ELEMENT_ID_MAIN_CONTENT } from '@vben-core/shared/constants';
+
+import { afterEach, describe, expect, it, vi } from 'vitest';
+
+import { useVbenModal } from '../use-modal';
+
+vi.mock('@vben-core/preferences', () => ({
+  usePreferences: () => ({
+    globalEscapeShortcutKey: { value: true },
+  }),
+}));
+
+let activeApp: App | undefined;
+
+async function mountModal() {
+  const mainContent = document.createElement('main');
+  mainContent.id = ELEMENT_ID_MAIN_CONTENT;
+  mainContent.innerHTML = '<div><div></div></div>';
+  document.body.append(mainContent);
+
+  const Consumer = defineComponent(() => {
+    const [Modal, modalApi] = useVbenModal({
+      appendToMain: true,
+      draggable: true,
+      title: 'Draggable modal',
+    });
+    onMounted(() => {
+      modalApi.open();
+    });
+    return () => h(Modal);
+  });
+  const host = document.createElement('div');
+  document.body.append(host);
+
+  activeApp = createApp(() => h(Consumer));
+  activeApp.mount(host);
+  await nextTick();
+  await nextTick();
+
+  return mainContent;
+}
+
+afterEach(() => {
+  activeApp?.unmount();
+  activeApp = undefined;
+  document.body.innerHTML = '';
+  vi.restoreAllMocks();
+});
+
+describe('vben modal', () => {
+  it('mounts an open modal directly in the main content', async () => {
+    const mainContent = await mountModal();
+    const dialog = document.querySelector('[role="dialog"]');
+    const overlay = document.querySelector('[data-dismissable-modal]');
+
+    expect(dialog).toBeInstanceOf(HTMLElement);
+    if (!(dialog instanceof HTMLElement)) return;
+    expect(overlay).toBeInstanceOf(HTMLElement);
+    if (!(overlay instanceof HTMLElement)) return;
+    expect(dialog.parentElement).toBe(mainContent);
+    expect(overlay.parentElement).toBe(mainContent);
+  });
+
+  it('constrains dragging to the main content', async () => {
+    const mainContent = await mountModal();
+    const dialog = document.querySelector('[role="dialog"]');
+    const header = document.querySelector('.cursor-move');
+
+    expect(dialog).toBeInstanceOf(HTMLElement);
+    if (!(dialog instanceof HTMLElement)) return;
+    expect(header).toBeInstanceOf(HTMLElement);
+    if (!(header instanceof HTMLElement)) return;
+
+    vi.spyOn(mainContent, 'getBoundingClientRect').mockReturnValue(
+      new DOMRect(100, 100, 800, 600),
+    );
+    vi.spyOn(dialog, 'getBoundingClientRect').mockReturnValue(
+      new DOMRect(300, 200, 400, 300),
+    );
+
+    header.dispatchEvent(
+      new MouseEvent('mousedown', {
+        bubbles: true,
+        clientX: 400,
+        clientY: 300,
+      }),
+    );
+    document.dispatchEvent(
+      new MouseEvent('mousemove', {
+        clientX: 1400,
+        clientY: 1300,
+      }),
+    );
+
+    expect(dialog.style.transform).toBe('translate(200px, 200px)');
+    document.dispatchEvent(new MouseEvent('mouseup'));
+  });
+});
diff --git a/packages/@core/ui-kit/popup-ui/src/modal/__tests__/use-modal.test.ts b/packages/@core/ui-kit/popup-ui/src/modal/__tests__/use-modal.test.ts
new file mode 100644
index 00000000..3fb726a3
--- /dev/null
+++ b/packages/@core/ui-kit/popup-ui/src/modal/__tests__/use-modal.test.ts
@@ -0,0 +1,106 @@
+import type { App, Ref } from 'vue';
+
+import type { ExtendedModalApi } from '../modal';
+
+import { createApp, defineComponent, h, nextTick, ref, toRaw } from 'vue';
+
+import { afterEach, describe, expect, it, vi } from 'vitest';
+
+import { useVbenModal } from '../use-modal';
+
+vi.mock('@vben-core/preferences', () => ({
+  usePreferences: () => ({
+    globalEscapeShortcutKey: { value: true },
+  }),
+}));
+
+vi.mock('../modal.vue', () => ({
+  default: {
+    name: 'VbenModalStub',
+    render: () => null,
+  },
+}));
+
+let activeApp: App | undefined;
+
+async function mountRebindingHarness() {
+  const consumerKey = ref(0);
+  let currentApi: ExtendedModalApi | undefined;
+  const onOpenChange = vi.fn();
+
+  const Consumer = defineComponent(() => {
+    const [Modal, modalApi] = useVbenModal();
+    currentApi = modalApi;
+    return () => h(Modal);
+  });
+
+  const ConnectedModal = defineComponent(() => {
+    return () => h(Consumer, { key: consumerKey.value });
+  });
+
+  const [ParentModal, parentApi] = useVbenModal({
+    connectedComponent: ConnectedModal,
+    onOpenChange,
+    title: 'Parent modal title',
+  });
+  const host = document.createElement('div');
+  document.body.append(host);
+
+  activeApp = createApp(() => h(ParentModal));
+  activeApp.mount(host);
+  await nextTick();
+
+  return {
+    consumerKey,
+    getCurrentApi: () => currentApi,
+    onOpenChange,
+    parentApi,
+  };
+}
+
+async function remountConsumer(consumerKey: Ref<number>) {
+  consumerKey.value += 1;
+  await nextTick();
+}
+
+afterEach(() => {
+  activeApp?.unmount();
+  activeApp = undefined;
+  document.body.innerHTML = '';
+  vi.restoreAllMocks();
+});
+
+describe('useVbenModal', () => {
+  it('rebinds the parent api when the consumer is recreated', async () => {
+    const { consumerKey, getCurrentApi, onOpenChange, parentApi } =
+      await mountRebindingHarness();
+    const initialApi = getCurrentApi();
+
+    expect(initialApi).toBeDefined();
+    if (!initialApi) return;
+    expect(toRaw(parentApi.store)).toBe(initialApi.store);
+    const initialData = { id: 1 };
+    parentApi.setData(initialData);
+    expect(initialApi.getData()).toBe(initialData);
+
+    await remountConsumer(consumerKey);
+    const recreatedApi = getCurrentApi();
+
+    expect(recreatedApi).toBeDefined();
+    if (!recreatedApi) return;
+    expect(recreatedApi).not.toBe(initialApi);
+    expect(recreatedApi.store.state.title).toBe('Parent modal title');
+    expect(toRaw(parentApi.store)).toBe(recreatedApi.store);
+    const recreatedData = { id: 2 };
+    parentApi.setData(recreatedData);
+    expect(recreatedApi.getData()).toBe(recreatedData);
+
+    parentApi.open();
+    expect(onOpenChange).toHaveBeenCalledWith(true);
+    expect(recreatedApi.store.state.isOpen).toBe(true);
+    expect(initialApi.store.state.isOpen).toBe(false);
+
+    await parentApi.close();
+    expect(recreatedApi.store.state.isOpen).toBe(false);
+  });
+});
diff --git a/packages/@core/ui-kit/popup-ui/src/modal/index.ts b/packages/@core/ui-kit/popup-ui/src/modal/index.ts
index c8d3498c..cbf3c52f 100644
--- a/packages/@core/ui-kit/popup-ui/src/modal/index.ts
+++ b/packages/@core/ui-kit/popup-ui/src/modal/index.ts
@@ -1,3 +1,7 @@
 export type * from './modal';
 export { default as VbenModal } from './modal.vue';
-export { useVbenModal } from './use-modal';
+export {
+  createVbenModal,
+  setDefaultModalProps,
+  useVbenModal,
+} from './use-modal';
diff --git a/packages/@core/ui-kit/popup-ui/src/modal/modal-api.ts b/packages/@core/ui-kit/popup-ui/src/modal/modal-api.ts
index cf54dcec..560b9ade 100644
--- a/packages/@core/ui-kit/popup-ui/src/modal/modal-api.ts
+++ b/packages/@core/ui-kit/popup-ui/src/modal/modal-api.ts
@@ -3,7 +3,13 @@ import type { ModalApiOptions, ModalState } from './modal';
 import { Store } from '@vben-core/shared/store';
 import { bindMethods, isFunction } from '@vben-core/shared/utils';
 
-export class ModalApi {
+export class ModalApi<TData = unknown> {
+  // 共享数据
+  public sharedData: Record<'payload', TData | undefined> = {
+    payload: undefined,
+  };
+  public store: Store<ModalState>;
+
   private api: Pick<
     ModalApiOptions,
     | 'onBeforeClose'
@@ -13,16 +19,10 @@ export class ModalApi {
     | 'onOpenChange'
     | 'onOpened'
   >;
+
   // private prevState!: ModalState;
   private state!: ModalState;
 
-  // 共享数据
-  public sharedData: Record<'payload', any> = {
-    payload: {},
-  };
-
-  public store: Store<ModalState>;
-
   constructor(options: ModalApiOptions = {}) {
     const {
       connectedComponent: _,
@@ -44,7 +44,9 @@ export class ModalApi {
       confirmDisabled: false,
       confirmLoading: false,
       contentClass: '',
+      destroyOnClose: true,
       draggable: false,
+      overflow: false,
       footer: true,
       footerClass: '',
       fullscreen: false,
@@ -58,27 +60,22 @@ export class ModalApi {
       showCancelButton: true,
       showConfirmButton: true,
       title: '',
+      animationType: 'slide',
     };
 
-    this.store = new Store<ModalState>(
-      {
-        ...defaultState,
-        ...storeState,
-      },
-      {
-        onUpdate: () => {
-          const state = this.store.state;
+    this.store = new Store<ModalState>({
+      ...defaultState,
+      ...storeState,
+    });
 
-          // 每次更新状态时，都会调用 onOpenChange 回调函数
-          if (state?.isOpen === this.state?.isOpen) {
-            this.state = state;
-          } else {
-            this.state = state;
-            this.api.onOpenChange?.(!!state?.isOpen);
-          }
-        },
-      },
-    );
+    this.store.subscribe((state) => {
+      // 每次更新状态时，都会调用 onOpenChange 回调函数
+      const prevIsOpen = this.state?.isOpen;
+      this.state = state;
+      if (state?.isOpen !== prevIsOpen) {
+        this.api.onOpenChange?.(!!state?.isOpen);
+      }
+    });
 
     this.state = this.store.state;
 
@@ -93,25 +90,33 @@ export class ModalApi {
     bindMethods(this);
   }
 
-  // 如果需要多次更新状态，可以使用 batch 方法
-  batchStore(cb: () => void) {
-    this.store.batch(cb);
-  }
-
   /**
    * 关闭弹窗
+   * @description 关闭弹窗时会调用 onBeforeClose 钩子函数，如果 onBeforeClose 返回 false，则不关闭弹窗
    */
-  close() {
+  async close() {
     // 通过 onBeforeClose 钩子函数来判断是否允许关闭弹窗
     // 如果 onBeforeClose 返回 false，则不关闭弹窗
-    const allowClose = this.api.onBeforeClose?.() ?? true;
+    const allowClose = (await this.api.onBeforeClose?.()) ?? true;
     if (allowClose) {
-      this.store.setState((prev) => ({ ...prev, isOpen: false }));
+      this.store.setState((prev) => ({
+        ...prev,
+        isOpen: false,
+      }));
     }
   }
 
-  getData<T extends object = Record<string, any>>() {
-    return (this.sharedData?.payload ?? {}) as T;
+  getData(): TData | undefined {
+    return this.sharedData.payload;
+  }
+
+  /**
+   * 锁定弹窗状态（用于提交过程中的等待状态）
+   * @description 锁定状态将禁用默认的取消按钮，使用spinner覆盖弹窗内容，隐藏关闭按钮，阻止手动关闭弹窗，将默认的提交按钮标记为loading状态
+   * @param isLocked 是否锁定
+   */
+  lock(isLocked = true) {
+    return this.setState({ submitting: isLocked });
   }
 
   /**
@@ -151,11 +156,16 @@ export class ModalApi {
   }
 
   open() {
-    this.store.setState((prev) => ({ ...prev, isOpen: true }));
+    this.store.setState((prev) => ({
+      ...prev,
+      isOpen: true,
+      submitting: false,
+    }));
   }
 
-  setData<T>(payload: T) {
+  setData(payload: TData) {
     this.sharedData.payload = payload;
+    return this;
   }
 
   setState(
@@ -168,5 +178,14 @@ export class ModalApi {
     } else {
       this.store.setState((prev) => ({ ...prev, ...stateOrFn }));
     }
+    return this;
+  }
+
+  /**
+   * 解除弹窗的锁定状态
+   * @description 解除由lock方法设置的锁定状态，是lock(false)的别名
+   */
+  unlock() {
+    return this.lock(false);
   }
 }
diff --git a/packages/@core/ui-kit/popup-ui/src/modal/modal.ts b/packages/@core/ui-kit/popup-ui/src/modal/modal.ts
index 5508d004..d84dcadd 100644
--- a/packages/@core/ui-kit/popup-ui/src/modal/modal.ts
+++ b/packages/@core/ui-kit/popup-ui/src/modal/modal.ts
@@ -1,8 +1,15 @@
-import type { ModalApi } from './modal-api';
-
 import type { Component, Ref } from 'vue';
 
+import type { ClassType, MaybePromise } from '@vben-core/typings';
+
+import type { ModalApi } from './modal-api';
+
 export interface ModalProps {
+  /**
+   * 动画类型
+   * @default 'slide'
+   */
+  animationType?: 'scale' | 'slide';
   /**
    * 是否要挂载到内容区域
    * @default false
@@ -23,7 +30,7 @@ export interface ModalProps {
    */
   centered?: boolean;
 
-  class?: string;
+  class?: ClassType;
 
   /**
    * 是否显示右上角的关闭按钮
@@ -53,11 +60,15 @@ export interface ModalProps {
    * 确定按钮文字
    */
   confirmText?: string;
-  contentClass?: string;
+  contentClass?: ClassType;
   /**
    * 弹窗描述
    */
   description?: string;
+  /**
+   * 在关闭时销毁弹窗
+   */
+  destroyOnClose?: boolean;
   /**
    * 是否可拖拽
    * @default false
@@ -68,7 +79,7 @@ export interface ModalProps {
    * @default true
    */
   footer?: boolean;
-  footerClass?: string;
+  footerClass?: ClassType;
   /**
    * 是否全屏
    * @default false
@@ -84,9 +95,9 @@ export interface ModalProps {
    * @default true
    */
   header?: boolean;
-  headerClass?: string;
+  headerClass?: ClassType;
   /**
-   * 弹窗是否显示
+   * 弹窗加载状态
    * @default false
    */
   loading?: boolean;
@@ -99,6 +110,15 @@ export interface ModalProps {
    * 是否自动聚焦
    */
   openAutoFocus?: boolean;
+  /**
+   * 拖动范围是否可以超出可视区
+   * @default false
+   */
+  overflow?: boolean;
+  /**
+   * 弹窗遮罩模糊效果
+   */
+  overlayBlur?: number;
   /**
    * 是否显示取消按钮
    * @default true
@@ -109,6 +129,10 @@ export interface ModalProps {
    * @default true
    */
   showConfirmButton?: boolean;
+  /**
+   * 提交中（锁定弹窗状态）
+   */
+  submitting?: boolean;
   /**
    * 弹窗标题
    */
@@ -126,28 +150,41 @@ export interface ModalProps {
 export interface ModalState extends ModalProps {
   /** 弹窗打开状态 */
   isOpen?: boolean;
-  /**
-   * 共享数据
-   */
-  sharedData?: Record<string, any>;
 }
 
-export type ExtendedModalApi = {
+export type ExtendedModalApi<TData = unknown> = ModalApi<TData> & {
   useStore: <T = NoInfer<ModalState>>(
     selector?: (state: NoInfer<ModalState>) => T,
   ) => Readonly<Ref<T>>;
-} & ModalApi;
+};
 
-export interface ModalApiOptions extends ModalState {
+type ModalComponentInstance<TComponent extends Component> =
+  TComponent extends abstract new (...args: any[]) => infer TInstance
+    ? TInstance
+    : never;
+
+export type InferModalData<TComponent extends Component> = [
+  ModalComponentInstance<TComponent>,
+] extends [never]
+  ? unknown
+  : ModalComponentInstance<TComponent> extends {
+        modalApi: ExtendedModalApi<infer TData>;
+      }
+    ? TData
+    : unknown;
+
+export interface ModalApiOptions<
+  TConnectedComponent extends Component = Component,
+> extends ModalState {
   /**
    * 独立的弹窗组件
    */
-  connectedComponent?: Component;
+  connectedComponent?: TConnectedComponent;
   /**
    * 关闭前的回调，返回 false 可以阻止关闭
    * @returns
    */
-  onBeforeClose?: () => void;
+  onBeforeClose?: () => MaybePromise<boolean | undefined>;
   /**
    * 点击取消按钮的回调
    */
diff --git a/packages/@core/ui-kit/popup-ui/src/modal/modal.vue b/packages/@core/ui-kit/popup-ui/src/modal/modal.vue
index 4e7d7ca7..4a3e4453 100644
--- a/packages/@core/ui-kit/popup-ui/src/modal/modal.vue
+++ b/packages/@core/ui-kit/popup-ui/src/modal/modal.vue
@@ -1,13 +1,18 @@
 <script lang="ts" setup>
 import type { ExtendedModalApi, ModalProps } from './modal';
 
-import { computed, nextTick, provide, ref, useId, watch } from 'vue';
-
 import {
-  useIsMobile,
-  usePriorityValues,
-  useSimpleLocale,
-} from '@vben-core/composables';
+  computed,
+  nextTick,
+  onDeactivated,
+  provide,
+  ref,
+  unref,
+  useId,
+  watch,
+} from 'vue';
+
+import { usePriorityValues, useSimpleLocale } from '@vben-core/composables';
 import { Expand, Shrink } from '@vben-core/icons';
 import {
   Dialog,
@@ -34,25 +39,27 @@ interface Props extends ModalProps {
 
 const props = withDefaults(defineProps<Props>(), {
   appendToMain: false,
+  destroyOnClose: false,
   modalApi: undefined,
 });
 
 const components = globalShareState.getComponents();
 
 const contentRef = ref();
+// @ts-expect-error unused
 const wrapperRef = ref<HTMLElement>();
 const dialogRef = ref();
 const headerRef = ref();
+// @ts-expect-error unused
 const footerRef = ref();
 
-const id = useId();
-
-provide('DISMISSABLE_MODAL_ID', id);
-
 const { $t } = useSimpleLocale();
-const { isMobile } = useIsMobile();
 const state = props.modalApi?.useStore?.();
 
+const id = useId();
+// 遮罩层通过该 id 标记，仅当点击发生在当前 Modal 的遮罩上时才允许关闭
+provide('DISMISSABLE_MODAL_ID', id);
+
 const {
   appendToMain,
   bordered,
@@ -67,7 +74,9 @@ const {
   confirmText,
   contentClass,
   description,
+  destroyOnClose,
   draggable,
+  overflow,
   footer: showFooter,
   footerClass,
   fullscreen,
@@ -77,53 +86,83 @@ const {
   loading: showLoading,
   modal,
   openAutoFocus,
+  overlayBlur,
   showCancelButton,
   showConfirmButton,
+  submitting,
   title,
   titleTooltip,
+  animationType,
   zIndex,
 } = usePriorityValues(props, state);
 
-const shouldFullscreen = computed(
-  () => (fullscreen.value && header.value) || isMobile.value,
-);
+const shouldFullscreen = computed(() => fullscreen.value);
 
 const shouldDraggable = computed(
   () => draggable.value && !shouldFullscreen.value && header.value,
 );
 
+const shouldCentered = computed(
+  () => centered.value && !shouldFullscreen.value,
+);
+
+const getAppendTo = computed(() => {
+  return appendToMain.value ? `#${ELEMENT_ID_MAIN_CONTENT}` : undefined;
+});
+
 const { dragging, transform } = useModalDraggable(
   dialogRef,
   headerRef,
   shouldDraggable,
+  getAppendTo,
+  shouldCentered,
+  overflow,
 );
 
+const firstOpened = ref(false);
+const isClosed = ref(true);
+
 watch(
   () => state?.value?.isOpen,
   async (v) => {
     if (v) {
+      isClosed.value = false;
+      if (!firstOpened.value) firstOpened.value = true;
       await nextTick();
       if (!contentRef.value) return;
       const innerContentRef = contentRef.value.getContentRef();
       dialogRef.value = innerContentRef.$el;
       // reopen modal reassign value
       const { offsetX, offsetY } = transform;
-      dialogRef.value.style.transform = `translate(${offsetX}px, ${offsetY}px)`;
+      dialogRef.value.style.transform = shouldCentered.value
+        ? `translate(${offsetX}px, calc(-50% + ${offsetY}px))`
+        : `translate(${offsetX}px, ${offsetY}px)`;
     }
   },
+  { immediate: true },
 );
 
-watch(
-  () => showLoading.value,
-  (v) => {
-    if (v && wrapperRef.value) {
-      wrapperRef.value.scrollTo({
-        // behavior: 'smooth',
-        top: 0,
-      });
-    }
-  },
-);
+// watch(
+//   () => [showLoading.value, submitting.value],
+//   ([l, s]) => {
+//     if ((s || l) && wrapperRef.value) {
+//       wrapperRef.value.scrollTo({
+//         // behavior: 'smooth',
+//         top: 0,
+//       });
+//     }
+//   },
+// );
+
+/**
+ * 在开启keepAlive情况下 直接通过浏览器按钮/手势等返回 不会关闭弹窗
+ */
+onDeactivated(() => {
+  // 如果弹窗没有被挂载到内容区域，则关闭弹窗
+  if (!appendToMain.value) {
+    props.modalApi?.close();
+  }
+});
 
 function handleFullscreen() {
   props.modalApi?.setState((prev) => {
@@ -134,18 +173,18 @@ function handleFullscreen() {
   });
 }
 function interactOutside(e: Event) {
-  if (!closeOnClickModal.value) {
+  if (!closeOnClickModal.value || submitting.value) {
     e.preventDefault();
     e.stopPropagation();
   }
 }
 function escapeKeyDown(e: KeyboardEvent) {
-  if (!closeOnPressEscape.value) {
+  if (!closeOnPressEscape.value || submitting.value) {
     e.preventDefault();
   }
 }
 
-function handerOpenAutoFocus(e: Event) {
+function handleOpenAutoFocus(e: Event) {
   if (!openAutoFocus.value) {
     e?.preventDefault();
   }
@@ -155,7 +194,11 @@ function handerOpenAutoFocus(e: Event) {
 function pointerDownOutside(e: Event) {
   const target = e.target as HTMLElement;
   const isDismissableModal = target?.dataset.dismissableModal;
-  if (!closeOnClickModal.value || isDismissableModal !== id) {
+  if (
+    !closeOnClickModal.value ||
+    isDismissableModal !== id ||
+    submitting.value
+  ) {
     e.preventDefault();
     e.stopPropagation();
   }
@@ -165,45 +208,69 @@ function handleFocusOutside(e: Event) {
   e.preventDefault();
   e.stopPropagation();
 }
-const getAppendTo = computed(() => {
-  return appendToMain.value ? `#${ELEMENT_ID_MAIN_CONTENT}` : undefined;
+
+function handleCloseAutoFocus(_e: Event) {
+  // allow reka-ui to return focus to the trigger element on close
+}
+
+const getForceMount = computed(() => {
+  return !unref(destroyOnClose) && unref(firstOpened);
 });
+
+const handleOpened = () => {
+  requestAnimationFrame(() => {
+    props.modalApi?.onOpened();
+  });
+};
+
+function handleClosed() {
+  isClosed.value = true;
+  props.modalApi?.onClosed();
+}
 </script>
 <template>
   <Dialog
     :modal="false"
     :open="state?.isOpen"
-    @update:open="() => modalApi?.close()"
+    @update:open="() => (!submitting ? modalApi?.close() : undefined)"
   >
     <DialogContent
       ref="contentRef"
       :append-to="getAppendTo"
       :class="
         cn(
-          'left-0 right-0 top-[10vh] mx-auto flex max-h-[80%] w-[520px] flex-col p-0 sm:rounded-[var(--radius)]',
-          modalClass,
+          'inset-x-0 top-[10vh] mx-auto flex w-130 flex-col p-0',
+          shouldFullscreen ? 'rounded-none' : 'rounded-(--radius)',
           {
-            'border-border border': bordered,
+            'border border-border': bordered,
             'shadow-3xl': !bordered,
-            'left-0 top-0 size-full max-h-full !translate-x-0 !translate-y-0':
+            'max-h-[min(80%,calc(100dvh-20px))] max-w-[calc(100vw-20px)]':
+              !shouldFullscreen,
+            'top-0 left-0 size-full! max-h-full! max-w-full! transform-[translate(0,0)]!':
               shouldFullscreen,
-            'top-1/2 !-translate-y-1/2': centered && !shouldFullscreen,
+            'top-1/2': centered && !shouldFullscreen,
             'duration-300': !dragging,
+            hidden: isClosed,
           },
+          modalClass,
         )
       "
+      :force-mount="getForceMount"
       :modal="modal"
       :open="state?.isOpen"
-      :show-close="closable"
+      :show-close-button="closable"
+      :animation-type="animationType"
       :z-index="zIndex"
+      :overlay-blur="overlayBlur"
       close-class="top-3"
-      @close-auto-focus="handleFocusOutside"
-      @closed="() => modalApi?.onClosed()"
+      @close-auto-focus="handleCloseAutoFocus"
+      @closed="handleClosed"
+      :close-disabled="submitting"
       @escape-key-down="escapeKeyDown"
       @focus-outside="handleFocusOutside"
       @interact-outside="interactOutside"
-      @open-auto-focus="handerOpenAutoFocus"
-      @opened="() => modalApi?.onOpened()"
+      @open-auto-focus="handleOpenAutoFocus"
+      @opened="handleOpened"
       @pointer-down-outside="pointerDownOutside"
     >
       <DialogHeader
@@ -245,21 +312,16 @@ const getAppendTo = computed(() => {
         ref="wrapperRef"
         :class="
           cn('relative min-h-40 flex-1 overflow-y-auto p-3', contentClass, {
-            'pointer-events-none overflow-hidden': showLoading,
+            'pointer-events-none': showLoading || submitting,
           })
         "
       >
-        <VbenLoading
-          v-if="showLoading"
-          class="size-full h-auto min-h-full"
-          spinning
-        />
         <slot></slot>
       </div>
-
+      <VbenLoading v-if="showLoading || submitting" spinning />
       <VbenIconButton
         v-if="fullscreenButton"
-        class="hover:bg-accent hover:text-accent-foreground text-foreground/80 flex-center absolute right-10 top-3 hidden size-6 rounded-full px-1 text-lg opacity-70 transition-opacity hover:opacity-100 focus:outline-none disabled:pointer-events-none sm:block"
+        class="absolute top-3 right-10 flex-center size-6 rounded-full px-1 text-lg text-foreground/80 opacity-70 transition-opacity hover:bg-accent hover:text-accent-foreground hover:opacity-100 focus:outline-hidden disabled:pointer-events-none"
         @click="handleFullscreen"
       >
         <Shrink v-if="fullscreen" class="size-3.5" />
@@ -267,8 +329,8 @@ const getAppendTo = computed(() => {
       </VbenIconButton>
 
       <DialogFooter
-        v-if="showFooter"
         ref="footerRef"
+        v-if="showFooter"
         :class="
           cn(
             'flex-row items-center justify-end p-2',
@@ -284,19 +346,20 @@ const getAppendTo = computed(() => {
           <component
             :is="components.DefaultButton || VbenButton"
             v-if="showCancelButton"
-            variant="ghost"
+            variant="outline"
+            :disabled="submitting"
             @click="() => modalApi?.onCancel()"
           >
             <slot name="cancelText">
               {{ cancelText || $t('cancel') }}
             </slot>
           </component>
-
+          <slot name="center-footer"></slot>
           <component
             :is="components.PrimaryButton || VbenButton"
             v-if="showConfirmButton"
             :disabled="confirmDisabled"
-            :loading="confirmLoading"
+            :loading="confirmLoading || submitting"
             @click="() => modalApi?.onConfirm()"
           >
             <slot name="confirmText">
diff --git a/packages/@core/ui-kit/popup-ui/src/modal/use-modal-draggable.ts b/packages/@core/ui-kit/popup-ui/src/modal/use-modal-draggable.ts
index 218f6bb4..a7bcba55 100644
--- a/packages/@core/ui-kit/popup-ui/src/modal/use-modal-draggable.ts
+++ b/packages/@core/ui-kit/popup-ui/src/modal/use-modal-draggable.ts
@@ -3,15 +3,19 @@
  * 调整部分细节
  */
 
-import { onBeforeUnmount, onMounted, reactive, ref, watchEffect } from 'vue';
 import type { ComputedRef, Ref } from 'vue';
 
+import { onBeforeUnmount, onMounted, reactive, ref, watchEffect } from 'vue';
+
 import { unrefElement } from '@vueuse/core';
 
 export function useModalDraggable(
   targetRef: Ref<HTMLElement | undefined>,
   dragRef: Ref<HTMLElement | undefined>,
   draggable: ComputedRef<boolean>,
+  containerSelector?: ComputedRef<string | undefined>,
+  centered?: ComputedRef<boolean>,
+  overflow?: ComputedRef<boolean>,
 ) {
   const transform = reactive({
     offsetX: 0,
@@ -29,33 +33,54 @@ export function useModalDraggable(
     }
 
     const targetRect = targetRef.value.getBoundingClientRect();
-
     const { offsetX, offsetY } = transform;
     const targetLeft = targetRect.left;
     const targetTop = targetRect.top;
     const targetWidth = targetRect.width;
     const targetHeight = targetRect.height;
-    const docElement = document.documentElement;
-    const clientWidth = docElement.clientWidth;
-    const clientHeight = docElement.clientHeight;
 
-    const minLeft = -targetLeft + offsetX;
-    const minTop = -targetTop + offsetY;
-    const maxLeft = clientWidth - targetLeft - targetWidth + offsetX;
-    const maxTop = clientHeight - targetTop - targetHeight + offsetY;
+    let containerRect: DOMRect | null = null;
+
+    if (containerSelector?.value) {
+      const container = document.querySelector(containerSelector.value);
+      if (container) {
+        containerRect = container.getBoundingClientRect();
+      }
+    }
+
+    let maxLeft, maxTop, minLeft, minTop;
+    if (containerRect) {
+      minLeft = containerRect.left - targetLeft + offsetX;
+      maxLeft = containerRect.right - targetLeft - targetWidth + offsetX;
+      minTop = containerRect.top - targetTop + offsetY;
+      maxTop = containerRect.bottom - targetTop - targetHeight + offsetY;
+    } else {
+      const docElement = document.documentElement;
+      const clientWidth = docElement.clientWidth;
+      const clientHeight = docElement.clientHeight;
+      minLeft = -targetLeft + offsetX;
+      minTop = -targetTop + offsetY;
+      maxLeft = clientWidth - targetLeft - targetWidth + offsetX;
+      maxTop = clientHeight - targetTop - targetHeight + offsetY;
+    }
 
     const onMousemove = (e: MouseEvent) => {
       let moveX = offsetX + e.clientX - downX;
       let moveY = offsetY + e.clientY - downY;
 
-      moveX = Math.min(Math.max(moveX, minLeft), maxLeft);
-      moveY = Math.min(Math.max(moveY, minTop), maxTop);
+      if (!overflow?.value) {
+        moveX = Math.min(Math.max(moveX, minLeft), maxLeft);
+        moveY = Math.min(Math.max(moveY, minTop), maxTop);
+      }
 
       transform.offsetX = moveX;
       transform.offsetY = moveY;
 
       if (targetRef.value) {
-        targetRef.value.style.transform = `translate(${moveX}px, ${moveY}px)`;
+        const isCentered = centered?.value;
+        targetRef.value.style.transform = isCentered
+          ? `translate(${moveX}px, calc(-50% + ${moveY}px))`
+          : `translate(${moveX}px, ${moveY}px)`;
         dragging.value = true;
       }
     };
@@ -90,7 +115,7 @@ export function useModalDraggable(
 
     const target = unrefElement(targetRef);
     if (target) {
-      target.style.transform = 'none';
+      target.style.transform = '';
     }
   };
 
diff --git a/packages/@core/ui-kit/popup-ui/src/modal/use-modal.ts b/packages/@core/ui-kit/popup-ui/src/modal/use-modal.ts
index f972530d..45fd5517 100644
--- a/packages/@core/ui-kit/popup-ui/src/modal/use-modal.ts
+++ b/packages/@core/ui-kit/popup-ui/src/modal/use-modal.ts
@@ -1,41 +1,103 @@
-import type { ExtendedModalApi, ModalApiOptions, ModalProps } from './modal';
+import type { Component } from 'vue';
 
-import { defineComponent, h, inject, nextTick, provide, reactive } from 'vue';
+import type {
+  ExtendedModalApi,
+  InferModalData,
+  ModalApiOptions,
+  ModalProps,
+} from './modal';
 
-import { useStore } from '@vben-core/shared/store';
+import {
+  defineComponent,
+  h,
+  inject,
+  markRaw,
+  nextTick,
+  onBeforeUnmount,
+  provide,
+  ref,
+  shallowReactive,
+} from 'vue';
+
+import { usePreferences } from '@vben-core/preferences';
+import { useSelector } from '@vben-core/shared/store';
 
-import VbenModal from './modal.vue';
 import { ModalApi } from './modal-api';
+import VbenModal from './modal.vue';
 
 const USER_MODAL_INJECT_KEY = Symbol('VBEN_MODAL_INJECT');
 
-export function useVbenModal<TParentModalProps extends ModalProps = ModalProps>(
-  options: ModalApiOptions = {},
-) {
+declare const MODAL_DATA_NOT_PROVIDED: unique symbol;
+
+type ModalDataNotProvided = {
+  readonly [MODAL_DATA_NOT_PROVIDED]: true;
+};
+
+type ResolvedModalData<
+  TData,
+  TConnectedComponent extends Component,
+> = TData extends ModalDataNotProvided
+  ? InferModalData<TConnectedComponent>
+  : TData;
+
+interface ModalInjectData<TData> {
+  consumed?: boolean;
+  extendApi?: (api: ExtendedModalApi<TData>) => void;
+  options?: ModalApiOptions;
+  reCreateModal?: () => Promise<void>;
+}
+
+const { globalEscapeShortcutKey } = usePreferences();
+/**
+ * 默认配置
+ */
+const DEFAULT_MODAL_PROPS: Partial<ModalProps> = {};
+
+export function setDefaultModalProps(props: Partial<ModalProps>) {
+  Object.assign(DEFAULT_MODAL_PROPS, props);
+}
+
+export function useVbenModal<
+  TData = ModalDataNotProvided,
+  TConnectedComponent extends Component = Component,
+>(options: ModalApiOptions<TConnectedComponent> = {}) {
+  type TResolvedData = ResolvedModalData<TData, TConnectedComponent>;
+
   // Modal一般会抽离出来，所以如果有传入 connectedComponent，则表示为外部调用，与内部组件进行连接
   // 外部的Modal通过provide/inject传递api
 
+  const defaultOptions = {
+    closeOnPressEscape: globalEscapeShortcutKey.value, // 全局Esc快捷键配置
+    ...options,
+  };
   const { connectedComponent } = options;
   if (connectedComponent) {
-    const extendedApi = reactive({});
+    const extendedApi = shallowReactive({}) as ExtendedModalApi<TResolvedData>;
+    const isModalReady = ref(true);
     const Modal = defineComponent(
-      (props: TParentModalProps, { attrs, slots }) => {
+      (props: ModalProps, { attrs, slots }) => {
+        function rebindApi(api: ExtendedModalApi<TResolvedData>) {
+          Object.setPrototypeOf(extendedApi, markRaw(api));
+        }
+
         provide(USER_MODAL_INJECT_KEY, {
-          extendApi(api: ExtendedModalApi) {
-            // 不能直接给 reactive 赋值，会丢失响应
-            // 不能用 Object.assign,会丢失 api 的原型函数
-            Object.setPrototypeOf(extendedApi, api);
+          extendApi: rebindApi,
+          consumed: false,
+          options: defaultOptions,
+          async reCreateModal() {
+            isModalReady.value = false;
+            await nextTick();
+            isModalReady.value = true;
           },
-          options,
         });
-        checkProps(extendedApi as ExtendedModalApi, {
+        checkProps(extendedApi, {
           ...props,
           ...attrs,
           ...slots,
         });
         return () =>
           h(
-            connectedComponent,
+            isModalReady.value ? connectedComponent : 'div',
             {
               ...props,
               ...attrs,
@@ -43,31 +105,61 @@ export function useVbenModal<TParentModalProps extends ModalProps = ModalProps>(
             slots,
           );
       },
+      // eslint-disable-next-line vue/one-component-per-file
       {
-        inheritAttrs: false,
         name: 'VbenParentModal',
+        inheritAttrs: false,
       },
     );
-    return [Modal, extendedApi as ExtendedModalApi] as const;
+
+    return [Modal, extendedApi] as const;
   }
 
-  const injectData = inject<any>(USER_MODAL_INJECT_KEY, {});
+  const injectData = inject<ModalInjectData<TResolvedData>>(
+    USER_MODAL_INJECT_KEY,
+    {},
+  );
+  const isConsumed = injectData.consumed;
+  const effectiveOptions = isConsumed ? {} : injectData.options;
+  if (!isConsumed && injectData.consumed !== undefined) {
+    injectData.consumed = true;
+  }
+  onBeforeUnmount(() => {
+    if (!isConsumed && injectData.consumed !== undefined) {
+      injectData.consumed = false;
+    }
+  });
 
   const mergedOptions = {
-    ...injectData.options,
-    ...options,
+    ...DEFAULT_MODAL_PROPS,
+    ...effectiveOptions,
+    ...defaultOptions,
   } as ModalApiOptions;
 
   mergedOptions.onOpenChange = (isOpen: boolean) => {
     options.onOpenChange?.(isOpen);
-    injectData.options?.onOpenChange?.(isOpen);
+    if (!isConsumed) {
+      injectData.options?.onOpenChange?.(isOpen);
+    }
   };
-  const api = new ModalApi(mergedOptions);
 
-  const extendedApi: ExtendedModalApi = api as never;
+  const onClosed = mergedOptions.onClosed;
+  mergedOptions.onClosed = () => {
+    onClosed?.();
+    if (mergedOptions.destroyOnClose && !isConsumed) {
+      if (injectData.consumed !== undefined) {
+        injectData.consumed = false;
+      }
+      injectData.reCreateModal?.();
+    }
+  };
+
+  const api = new ModalApi<TResolvedData>(mergedOptions);
+
+  const extendedApi = api as ExtendedModalApi<TResolvedData>;
 
   extendedApi.useStore = (selector) => {
-    return useStore(api.store, selector);
+    return useSelector(api.store, selector);
   };
 
   const Modal = defineComponent(
@@ -83,16 +175,29 @@ export function useVbenModal<TParentModalProps extends ModalProps = ModalProps>(
           slots,
         );
     },
+    // eslint-disable-next-line vue/one-component-per-file
     {
-      inheritAttrs: false,
       name: 'VbenModal',
+      inheritAttrs: false,
     },
   );
   injectData.extendApi?.(extendedApi);
+
   return [Modal, extendedApi] as const;
 }
 
-async function checkProps(api: ExtendedModalApi, attrs: Record<string, any>) {
+export function createVbenModal<TData = unknown>() {
+  return function useTypedVbenModal<
+    TConnectedComponent extends Component = Component,
+  >(options: ModalApiOptions<TConnectedComponent> = {}) {
+    return useVbenModal<TData, TConnectedComponent>(options);
+  };
+}
+
+async function checkProps<TData>(
+  api: ExtendedModalApi<TData>,
+  attrs: Record<string, any>,
+) {
   if (!attrs || Object.keys(attrs).length === 0) {
     return;
   }
diff --git a/packages/@core/ui-kit/popup-ui/tailwind.config.mjs b/packages/@core/ui-kit/popup-ui/tailwind.config.mjs
deleted file mode 100644
index f17f556f..00000000
--- a/packages/@core/ui-kit/popup-ui/tailwind.config.mjs
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from '@vben/tailwind-config';
diff --git a/packages/@core/ui-kit/popup-ui/tsdown.config.ts b/packages/@core/ui-kit/popup-ui/tsdown.config.ts
new file mode 100644
index 00000000..43e8cf1c
--- /dev/null
+++ b/packages/@core/ui-kit/popup-ui/tsdown.config.ts
@@ -0,0 +1,21 @@
+import { defineConfig } from 'tsdown';
+import Vue from 'unplugin-vue/rolldown';
+
+export default defineConfig({
+  clean: true,
+  deps: {
+    skipNodeModulesBundle: true,
+  },
+  dts: {
+    vue: true,
+  },
+  entry: ['src/index.ts'],
+  format: ['esm'],
+  outExtensions: () => ({
+    dts: '.d.ts',
+    js: '.mjs',
+  }),
+  platform: 'neutral',
+  plugins: [Vue({ isProduction: true })],
+  unbundle: true,
+});
diff --git a/packages/@core/ui-kit/shadcn-ui/build.config.ts b/packages/@core/ui-kit/shadcn-ui/build.config.ts
deleted file mode 100644
index aec93408..00000000
--- a/packages/@core/ui-kit/shadcn-ui/build.config.ts
+++ /dev/null
@@ -1,27 +0,0 @@
-import { defineBuildConfig } from 'unbuild';
-
-export default defineBuildConfig({
-  clean: true,
-  declaration: true,
-  entries: [
-    {
-      builder: 'mkdist',
-      input: './src',
-
-      pattern: ['**/*'],
-    },
-    {
-      builder: 'mkdist',
-      input: './src',
-      loaders: ['vue'],
-      pattern: ['**/*.vue'],
-    },
-    {
-      builder: 'mkdist',
-      format: 'esm',
-      input: './src',
-      loaders: ['js'],
-      pattern: ['**/*.ts'],
-    },
-  ],
-});
diff --git a/packages/@core/ui-kit/shadcn-ui/components.json b/packages/@core/ui-kit/shadcn-ui/components.json
index b497f43c..dcb1940f 100644
--- a/packages/@core/ui-kit/shadcn-ui/components.json
+++ b/packages/@core/ui-kit/shadcn-ui/components.json
@@ -3,12 +3,11 @@
   "style": "new-york",
   "typescript": true,
   "tailwind": {
-    "config": "tailwind.config.mjs",
+    "config": "",
     "css": "src/assets/index.css",
     "baseColor": "slate",
     "cssVariables": true
   },
-  "framework": "vite",
   "aliases": {
     "components": "@vben-core/shadcn-ui/components",
     "utils": "@vben-core/shared/utils"
diff --git a/packages/@core/ui-kit/shadcn-ui/package.json b/packages/@core/ui-kit/shadcn-ui/package.json
index cccaa690..22bcddce 100644
--- a/packages/@core/ui-kit/shadcn-ui/package.json
+++ b/packages/@core/ui-kit/shadcn-ui/package.json
@@ -1,8 +1,6 @@
 {
   "name": "@vben-core/shadcn-ui",
-  "version": "5.5.1",
-  "#main": "./dist/index.mjs",
-  "#module": "./dist/index.mjs",
+  "version": "5.7.0",
   "homepage": "https://github.com/vbenjs/vue-vben-admin",
   "bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
   "repository": {
@@ -12,43 +10,42 @@
   },
   "license": "MIT",
   "type": "module",
-  "scripts": {
-    "#build": "pnpm unbuild",
-    "#prepublishOnly": "npm run build"
-  },
   "files": [
-    "dist"
+    "components.json",
+    "src"
   ],
   "sideEffects": [
     "**/*.css"
   ],
   "main": "./src/index.ts",
   "module": "./src/index.ts",
+  "types": "./src/index.ts",
   "exports": {
     ".": {
       "types": "./src/index.ts",
       "development": "./src/index.ts",
-      "default": "./src/index.ts",
-      "//default": "./dist/index.mjs"
+      "default": "./src/index.ts"
     }
   },
   "publishConfig": {
     "exports": {
       ".": {
+        "types": "./src/index.ts",
+        "development": "./src/index.ts",
         "default": "./src/index.ts"
       }
     }
   },
   "dependencies": {
+    "@lucide/vue": "catalog:",
     "@vben-core/composables": "workspace:*",
+    "@vben-core/design": "workspace:*",
     "@vben-core/icons": "workspace:*",
     "@vben-core/shared": "workspace:*",
     "@vben-core/typings": "workspace:*",
     "@vueuse/core": "catalog:",
     "class-variance-authority": "catalog:",
-    "lucide-vue-next": "catalog:",
-    "radix-vue": "catalog:",
-    "vee-validate": "catalog:",
+    "reka-ui": "catalog:",
     "vue": "catalog:"
   }
 }
diff --git a/packages/@core/ui-kit/shadcn-ui/postcss.config.mjs b/packages/@core/ui-kit/shadcn-ui/postcss.config.mjs
deleted file mode 100644
index 3d807045..00000000
--- a/packages/@core/ui-kit/shadcn-ui/postcss.config.mjs
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from '@vben/tailwind-config/postcss';
diff --git a/packages/@core/ui-kit/shadcn-ui/src/assets/index.css b/packages/@core/ui-kit/shadcn-ui/src/assets/index.css
new file mode 100644
index 00000000..cbd9be68
--- /dev/null
+++ b/packages/@core/ui-kit/shadcn-ui/src/assets/index.css
@@ -0,0 +1 @@
+@reference "@vben/tailwind-config/theme";
diff --git a/packages/@core/ui-kit/shadcn-ui/src/components/avatar/avatar.vue b/packages/@core/ui-kit/shadcn-ui/src/components/avatar/avatar.vue
index 1006db46..1db522bc 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/components/avatar/avatar.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/components/avatar/avatar.vue
@@ -1,20 +1,25 @@
 <script setup lang="ts">
-import type { ClassType } from '@vben-core/typings';
 import type {
   AvatarFallbackProps,
   AvatarImageProps,
   AvatarRootProps,
-} from 'radix-vue';
+} from 'reka-ui';
+
+import type { CSSProperties } from 'vue';
+
+import type { ClassType } from '@vben-core/typings';
 
 import { computed } from 'vue';
 
 import { Avatar, AvatarFallback, AvatarImage } from '../../ui';
 
-interface Props extends AvatarRootProps, AvatarFallbackProps, AvatarImageProps {
+interface Props extends AvatarFallbackProps, AvatarImageProps, AvatarRootProps {
   alt?: string;
   class?: ClassType;
   dot?: boolean;
   dotClass?: ClassType;
+  fit?: 'contain' | 'cover' | 'fill' | 'none' | 'scale-down';
+  size?: number;
 }
 
 defineOptions({
@@ -26,23 +31,45 @@ const props = withDefaults(defineProps<Props>(), {
   as: 'button',
   dot: false,
   dotClass: 'bg-green-500',
+  fit: 'cover',
+});
+
+const imageStyle = computed<CSSProperties>(() => {
+  const { fit } = props;
+  if (fit) {
+    return { objectFit: fit };
+  }
+  return {};
 });
 
 const text = computed(() => {
   return props.alt.slice(-2).toUpperCase();
 });
+
+const rootStyle = computed(() => {
+  return props.size !== undefined && props.size > 0
+    ? {
+        height: `${props.size}px`,
+        width: `${props.size}px`,
+      }
+    : {};
+});
 </script>
 
 <template>
-  <div :class="props.class" class="relative flex flex-shrink-0 items-center">
+  <div
+    :class="props.class"
+    :style="rootStyle"
+    class="relative flex shrink-0 items-center"
+  >
     <Avatar :class="props.class" class="size-full">
-      <AvatarImage :alt="alt" :src="src" />
+      <AvatarImage :alt="alt" :src="src" :style="imageStyle" />
       <AvatarFallback>{{ text }}</AvatarFallback>
     </Avatar>
     <span
       v-if="dot"
       :class="dotClass"
-      class="border-background absolute bottom-0 right-0 size-3 rounded-full border-2"
+      class="border-background absolute right-0 bottom-0 size-3 rounded-full border-2"
     >
     </span>
   </div>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/components/back-top/back-top.vue b/packages/@core/ui-kit/shadcn-ui/src/components/back-top/back-top.vue
index 115b5b3a..4dc05e4e 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/components/back-top/back-top.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/components/back-top/back-top.vue
@@ -32,9 +32,9 @@ const { handleClick, visible } = useBackTop(props);
     <VbenButton
       v-if="visible"
       :style="backTopStyle"
-      class="dark:bg-accent dark:hover:bg-heavy bg-background hover:bg-heavy data shadow-float fixed bottom-10 z-[1000] size-10 rounded-full duration-500"
+      class="data z-popup bg-background shadow-float hover:bg-heavy dark:bg-accent dark:hover:bg-heavy fixed bottom-10 size-10 rounded-full duration-500"
       size="icon"
-      variant="icon"
+      variant="ghost"
       @click="handleClick"
     >
       <ArrowUpToLine class="size-4" />
diff --git a/packages/@core/ui-kit/shadcn-ui/src/components/breadcrumb/breadcrumb-background.vue b/packages/@core/ui-kit/shadcn-ui/src/components/breadcrumb/breadcrumb-background.vue
index cfed25b3..b8c560c2 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/components/breadcrumb/breadcrumb-background.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/components/breadcrumb/breadcrumb-background.vue
@@ -33,7 +33,7 @@ function handleClick(index: number, path?: string) {
               <VbenIcon
                 v-if="showIcon"
                 :icon="item.icon"
-                class="mr-1 size-4 flex-shrink-0"
+                class="mr-1 size-4 shrink-0"
               />
               <span
                 :class="{
@@ -50,12 +50,14 @@ function handleClick(index: number, path?: string) {
   </ul>
 </template>
 <style scoped>
+@reference "@vben/tailwind-config/theme";
+
 li {
   @apply h-7;
 }
 
 li a {
-  @apply text-muted-foreground bg-accent relative mr-9 flex h-7 items-center py-0 pl-[5px] pr-2 text-[13px];
+  @apply bg-accent text-muted-foreground relative mr-9 flex h-7 items-center py-0 pr-2 pl-1.25 text-[13px];
 }
 
 li a > span {
@@ -67,7 +69,7 @@ li:first-child a > span {
 }
 
 li:first-child a {
-  @apply rounded-[4px_0_0_4px] pl-[15px];
+  @apply rounded-l-sm pl-3.75;
 }
 
 li:first-child a::before {
@@ -75,7 +77,7 @@ li:first-child a::before {
 }
 
 li:last-child a {
-  @apply rounded-[0_4px_4px_0] pr-[15px];
+  @apply rounded-r-sm pr-3.75;
 }
 
 li:last-child a::after {
@@ -84,7 +86,7 @@ li:last-child a::after {
 
 li a::before,
 li a::after {
-  @apply border-accent absolute top-0 h-0 w-0 border-[.875rem] border-solid content-[''];
+  @apply border-accent absolute top-0 h-0 w-0 border-14 border-solid content-[''];
 }
 
 li a::before {
diff --git a/packages/@core/ui-kit/shadcn-ui/src/components/breadcrumb/breadcrumb-view.vue b/packages/@core/ui-kit/shadcn-ui/src/components/breadcrumb/breadcrumb-view.vue
index 88ee9fd0..3e73343c 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/components/breadcrumb/breadcrumb-view.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/components/breadcrumb/breadcrumb-view.vue
@@ -1,10 +1,10 @@
 <script lang="ts" setup>
 import type { BreadcrumbProps } from './types';
 
-import { useForwardPropsEmits } from 'radix-vue';
+import { useForwardPropsEmits } from 'reka-ui';
 
-import Breadcrumb from './breadcrumb.vue';
 import BreadcrumbBackground from './breadcrumb-background.vue';
+import Breadcrumb from './breadcrumb.vue';
 
 interface Props extends BreadcrumbProps {
   class?: any;
@@ -17,6 +17,23 @@ const emit = defineEmits<{ select: [string] }>();
 const forward = useForwardPropsEmits(props, emit);
 </script>
 <template>
-  <Breadcrumb v-if="styleType === 'normal'" v-bind="forward" />
-  <BreadcrumbBackground v-if="styleType === 'background'" v-bind="forward" />
+  <Breadcrumb
+    v-if="styleType === 'normal'"
+    v-bind="forward"
+    class="vben-breadcrumb"
+  />
+  <BreadcrumbBackground
+    v-if="styleType === 'background'"
+    v-bind="forward"
+    class="vben-breadcrumb"
+  />
 </template>
+<style lang="scss" scoped>
+/** 修复全局引入Antd时，ol和ul的默认样式会被修改的问题 */
+.vben-breadcrumb {
+  :deep(ol),
+  :deep(ul) {
+    margin-bottom: 0;
+  }
+}
+</style>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/components/breadcrumb/types.ts b/packages/@core/ui-kit/shadcn-ui/src/components/breadcrumb/types.ts
index fbf251c2..0080f23b 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/components/breadcrumb/types.ts
+++ b/packages/@core/ui-kit/shadcn-ui/src/components/breadcrumb/types.ts
@@ -1,7 +1,7 @@
-import type { BreadcrumbStyleType } from '@vben-core/typings';
-
 import type { Component } from 'vue';
 
+import type { BreadcrumbStyleType } from '@vben-core/typings';
+
 export interface IBreadcrumb {
   icon?: Component | string;
   isHome?: boolean;
diff --git a/packages/@core/ui-kit/shadcn-ui/src/components/button/button-group.vue b/packages/@core/ui-kit/shadcn-ui/src/components/button/button-group.vue
new file mode 100644
index 00000000..035e88c4
--- /dev/null
+++ b/packages/@core/ui-kit/shadcn-ui/src/components/button/button-group.vue
@@ -0,0 +1,98 @@
+<script lang="ts" setup>
+import { cn } from '@vben-core/shared/utils';
+
+defineOptions({ name: 'VbenButtonGroup' });
+
+withDefaults(
+  defineProps<{
+    border?: boolean;
+    gap?: number;
+    size?: 'large' | 'middle' | 'small';
+  }>(),
+  { border: false, gap: 0, size: 'middle' },
+);
+</script>
+<template>
+  <div
+    :class="
+      cn(
+        'vben-button-group rounded-md',
+        `size-${size}`,
+        gap ? 'with-gap' : 'no-gap',
+        $attrs.class as string,
+      )
+    "
+    :style="{ gap: gap ? `${gap}px` : '0px' }"
+  >
+    <slot></slot>
+  </div>
+</template>
+
+<style lang="scss" scoped>
+.vben-button-group {
+  display: inline-flex;
+
+  &.size-large :deep(button) {
+    height: 2.25rem;
+    padding: 0.5rem 0.75rem;
+    font-size: 0.875rem;
+    line-height: 1.25rem;
+
+    .icon-wrapper {
+      margin-right: 0.4rem;
+
+      svg {
+        width: 1rem;
+        height: 1rem;
+      }
+    }
+  }
+
+  &.size-middle :deep(button) {
+    height: 2rem;
+    padding: 0.25rem 0.5rem;
+    font-size: 0.75rem;
+    line-height: 1rem;
+
+    .icon-wrapper {
+      margin-right: 0.2rem;
+
+      svg {
+        width: 0.75rem;
+        height: 0.75rem;
+      }
+    }
+  }
+
+  &.size-small :deep(button) {
+    height: 1.75rem;
+    padding: 0.2rem 0.4rem;
+    font-size: 0.65rem;
+    line-height: 0.75rem;
+
+    .icon-wrapper {
+      margin-right: 0.1rem;
+
+      svg {
+        width: 0.65rem;
+        height: 0.65rem;
+      }
+    }
+  }
+
+  &.no-gap > :deep(button):nth-of-type(1) {
+    border-radius: calc(var(--radius) - 2px) 0 0 calc(var(--radius) - 2px);
+  }
+
+  &.no-gap > :deep(button):last-of-type {
+    border-radius: 0 calc(var(--radius) - 2px) calc(var(--radius) - 2px) 0;
+  }
+
+  &.no-gap {
+    :deep(button + button) {
+      border-left-width: 0;
+      border-radius: 0;
+    }
+  }
+}
+</style>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/components/button/button.ts b/packages/@core/ui-kit/shadcn-ui/src/components/button/button.ts
index 88397423..75769d34 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/components/button/button.ts
+++ b/packages/@core/ui-kit/shadcn-ui/src/components/button/button.ts
@@ -1,9 +1,9 @@
-import type { AsTag } from 'radix-vue';
-
-import type { ButtonVariants, ButtonVariantSize } from '../../ui';
+import type { AsTag } from 'reka-ui';
 
 import type { Component } from 'vue';
 
+import type { ButtonVariants } from '../../ui';
+
 export interface VbenButtonProps {
   /**
    * The element or component this component should render as. Can be overwrite by `asChild`
@@ -13,12 +13,43 @@ export interface VbenButtonProps {
   /**
    * Change the default rendered element for the one passed as a child, merging their props and behavior.
    *
-   * Read our [Composition](https://www.radix-vue.com/guides/composition.html) guide for more details.
+   * Read our [Composition](https://www.reka-ui.com/docs/guides/composition) guide for more details.
    */
   asChild?: boolean;
   class?: any;
   disabled?: boolean;
   loading?: boolean;
-  size?: ButtonVariantSize;
-  variant?: ButtonVariants;
+  size?: ButtonVariants['size'];
+  variant?: ButtonVariants['variant'];
+}
+
+export type CustomRenderType = (() => Component | string) | string;
+
+export type ValueType = boolean | number | string;
+
+export interface VbenButtonGroupProps extends Pick<
+  VbenButtonProps,
+  'disabled'
+> {
+  /** 单选模式下允许清除选中 */
+  allowClear?: boolean;
+  /** 值改变前的回调 */
+  beforeChange?: (
+    value: ValueType,
+    isChecked: boolean,
+  ) => boolean | PromiseLike<boolean | undefined> | undefined;
+  /** 按钮样式 */
+  btnClass?: any;
+  /** 按钮间隔距离 */
+  gap?: number;
+  /** 多选模式下限制最多选择的数量。0表示不限制 */
+  maxCount?: number;
+  /** 是否允许多选 */
+  multiple?: boolean;
+  /** 选项 */
+  options?: { [key: string]: any; label: CustomRenderType; value: ValueType }[];
+  /** 显示图标 */
+  showIcon?: boolean;
+  /** 尺寸 */
+  size?: 'large' | 'middle' | 'small';
 }
diff --git a/packages/@core/ui-kit/shadcn-ui/src/components/button/button.vue b/packages/@core/ui-kit/shadcn-ui/src/components/button/button.vue
index cb9b3e57..baf6d358 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/components/button/button.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/components/button/button.vue
@@ -6,7 +6,7 @@ import { computed } from 'vue';
 import { LoaderCircle } from '@vben-core/icons';
 import { cn } from '@vben-core/shared/utils';
 
-import { Primitive } from 'radix-vue';
+import { Primitive } from 'reka-ui';
 
 import { buttonVariants } from '../../ui';
 
@@ -35,7 +35,7 @@ const isDisabled = computed(() => {
   >
     <LoaderCircle
       v-if="loading"
-      class="text-md mr-2 size-4 flex-shrink-0 animate-spin"
+      class="text-md mr-2 size-4 shrink-0 animate-spin"
     />
     <slot></slot>
   </Primitive>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/components/button/check-button-group.vue b/packages/@core/ui-kit/shadcn-ui/src/components/button/check-button-group.vue
new file mode 100644
index 00000000..4172d82b
--- /dev/null
+++ b/packages/@core/ui-kit/shadcn-ui/src/components/button/check-button-group.vue
@@ -0,0 +1,196 @@
+<script lang="ts" setup>
+import type { Arrayable } from '@vueuse/core';
+
+import type { ValueType, VbenButtonGroupProps } from './button';
+
+import { computed, ref, watch } from 'vue';
+
+import { Circle, CircleCheckBig, LoaderCircle } from '@vben-core/icons';
+import { cn, isFunction } from '@vben-core/shared/utils';
+
+import { objectOmit } from '@vueuse/core';
+
+import { VbenRenderContent } from '../render-content';
+import VbenButtonGroup from './button-group.vue';
+import Button from './button.vue';
+
+const props = withDefaults(defineProps<VbenButtonGroupProps>(), {
+  gap: 0,
+  multiple: false,
+  showIcon: true,
+  size: 'middle',
+  allowClear: false,
+  maxCount: 0,
+});
+const emit = defineEmits(['btnClick']);
+const btnDefaultProps = computed(() => {
+  return {
+    ...objectOmit(props, ['options', 'btnClass', 'size', 'disabled']),
+    class: cn(props.btnClass),
+  };
+});
+const modelValue = defineModel<Arrayable<ValueType> | undefined>();
+
+const innerValue = ref<Array<ValueType>>([]);
+const loadingValues = ref<Array<ValueType>>([]);
+watch(
+  () => props.multiple,
+  (val) => {
+    if (val) {
+      modelValue.value = innerValue.value;
+    } else {
+      modelValue.value =
+        innerValue.value.length > 0 ? innerValue.value[0] : undefined;
+    }
+  },
+);
+
+watch(
+  () => modelValue.value,
+  (val) => {
+    if (Array.isArray(val)) {
+      const arrVal = val.filter((v) => v !== undefined);
+      if (arrVal.length > 0) {
+        innerValue.value = props.multiple
+          ? [...arrVal]
+          : [arrVal[0] as ValueType];
+      } else {
+        innerValue.value = [];
+      }
+    } else {
+      innerValue.value = val === undefined ? [] : [val as ValueType];
+    }
+  },
+  { deep: true, immediate: true },
+);
+
+async function onBtnClick(value: ValueType) {
+  if (props.beforeChange && isFunction(props.beforeChange)) {
+    try {
+      loadingValues.value.push(value);
+      const canChange = await props.beforeChange(
+        value,
+        !innerValue.value.includes(value),
+      );
+      if (canChange === false) {
+        return;
+      }
+    } finally {
+      loadingValues.value.splice(loadingValues.value.indexOf(value), 1);
+    }
+  }
+
+  if (props.multiple) {
+    if (innerValue.value.includes(value)) {
+      innerValue.value = innerValue.value.filter((item) => item !== value);
+    } else {
+      if (props.maxCount > 0 && innerValue.value.length >= props.maxCount) {
+        innerValue.value = innerValue.value.slice(0, props.maxCount - 1);
+      }
+      innerValue.value.push(value);
+    }
+    modelValue.value = innerValue.value;
+  } else {
+    if (props.allowClear && innerValue.value.includes(value)) {
+      innerValue.value = [];
+      modelValue.value = undefined;
+      emit('btnClick', undefined);
+      return;
+    } else {
+      innerValue.value = [value];
+      modelValue.value = value;
+    }
+  }
+  emit('btnClick', value);
+}
+</script>
+<template>
+  <VbenButtonGroup
+    :size="props.size"
+    :gap="props.gap"
+    class="vben-check-button-group"
+  >
+    <Button
+      v-for="(btn, index) in props.options"
+      :key="index"
+      :class="cn('border', props.btnClass)"
+      :disabled="
+        props.disabled ||
+        loadingValues.includes(btn.value) ||
+        (!props.multiple && loadingValues.length > 0)
+      "
+      v-bind="btnDefaultProps"
+      :variant="innerValue.includes(btn.value) ? 'default' : 'outline'"
+      @click="onBtnClick(btn.value)"
+      type="button"
+    >
+      <div class="icon-wrapper" v-if="props.showIcon">
+        <slot
+          name="icon"
+          :loading="loadingValues.includes(btn.value)"
+          :checked="innerValue.includes(btn.value)"
+        >
+          <LoaderCircle
+            class="animate-spin"
+            v-if="loadingValues.includes(btn.value)"
+          />
+          <CircleCheckBig v-else-if="innerValue.includes(btn.value)" />
+          <Circle v-else />
+        </slot>
+      </div>
+      <slot name="option" :label="btn.label" :value="btn.value" :data="btn">
+        <VbenRenderContent :content="btn.label" />
+      </slot>
+    </Button>
+  </VbenButtonGroup>
+</template>
+<style lang="scss" scoped>
+.vben-check-button-group {
+  display: flex;
+  flex-wrap: wrap;
+
+  &:deep(.size-large) button {
+    .icon-wrapper {
+      margin-right: 0.3rem;
+
+      svg {
+        width: 1rem;
+        height: 1rem;
+      }
+    }
+  }
+
+  &:deep(.size-middle) button {
+    .icon-wrapper {
+      margin-right: 0.2rem;
+
+      svg {
+        width: 0.75rem;
+        height: 0.75rem;
+      }
+    }
+  }
+
+  &:deep(.size-small) button {
+    .icon-wrapper {
+      margin-right: 0.1rem;
+
+      svg {
+        width: 0.65rem;
+        height: 0.65rem;
+      }
+    }
+  }
+
+  &.no-gap > :deep(button):nth-of-type(1) {
+    border-right-width: 0;
+  }
+
+  &.no-gap {
+    :deep(button + button) {
+      margin-right: -1px;
+      border-left-width: 1px;
+    }
+  }
+}
+</style>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/components/button/icon-button.vue b/packages/@core/ui-kit/shadcn-ui/src/components/button/icon-button.vue
index ac626c1b..46a3006e 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/components/button/icon-button.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/components/button/icon-button.vue
@@ -12,11 +12,11 @@ import VbenButton from './button.vue';
 interface Props extends VbenButtonProps {
   class?: any;
   disabled?: boolean;
-  onClick?: () => void;
+  onClick?: ((e?: MouseEvent) => void)[] | ((e?: MouseEvent) => void);
   tooltip?: string;
   tooltipDelayDuration?: number;
   tooltipSide?: 'bottom' | 'left' | 'right' | 'top';
-  variant?: ButtonVariants;
+  variant?: ButtonVariants['variant'];
 }
 
 const props = withDefaults(defineProps<Props>(), {
@@ -24,12 +24,22 @@ const props = withDefaults(defineProps<Props>(), {
   onClick: () => {},
   tooltipDelayDuration: 200,
   tooltipSide: 'bottom',
-  variant: 'icon',
+  variant: 'ghost',
 });
 
 const slots = useSlots();
 
 const showTooltip = computed(() => !!slots.tooltip || !!props.tooltip);
+
+function handleClick(e: MouseEvent) {
+  if (Array.isArray(props.onClick)) {
+    for (const fn of props.onClick) {
+      fn?.(e);
+    }
+  } else {
+    props.onClick?.(e);
+  }
+}
 </script>
 
 <template>
@@ -39,7 +49,7 @@ const showTooltip = computed(() => !!slots.tooltip || !!props.tooltip);
     :disabled="disabled"
     :variant="variant"
     size="icon"
-    @click="onClick"
+    @click="handleClick"
   >
     <slot></slot>
   </VbenButton>
@@ -55,7 +65,7 @@ const showTooltip = computed(() => !!slots.tooltip || !!props.tooltip);
         :disabled="disabled"
         :variant="variant"
         size="icon"
-        @click="onClick"
+        @click="handleClick"
       >
         <slot></slot>
       </VbenButton>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/components/button/index.ts b/packages/@core/ui-kit/shadcn-ui/src/components/button/index.ts
index 4afd1c25..aa3d9ef8 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/components/button/index.ts
+++ b/packages/@core/ui-kit/shadcn-ui/src/components/button/index.ts
@@ -1,3 +1,5 @@
 export type * from './button';
+export { default as VbenButtonGroup } from './button-group.vue';
 export { default as VbenButton } from './button.vue';
+export { default as VbenCheckButtonGroup } from './check-button-group.vue';
 export { default as VbenIconButton } from './icon-button.vue';
diff --git a/packages/@core/ui-kit/shadcn-ui/src/components/checkbox/checkbox.vue b/packages/@core/ui-kit/shadcn-ui/src/components/checkbox/checkbox.vue
index 3c2e9da2..bceaa205 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/components/checkbox/checkbox.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/components/checkbox/checkbox.vue
@@ -1,17 +1,17 @@
 <script setup lang="ts">
-import type { CheckboxRootEmits, CheckboxRootProps } from 'radix-vue';
+import type { CheckboxRootEmits, CheckboxRootProps } from 'reka-ui';
 
 import { useId } from 'vue';
 
-import { useForwardPropsEmits } from 'radix-vue';
+import { useForwardPropsEmits } from 'reka-ui';
 
 import { Checkbox } from '../../ui/checkbox';
 
-const props = defineProps<CheckboxRootProps>();
+const props = defineProps<CheckboxRootProps & { indeterminate?: boolean }>();
 
 const emits = defineEmits<CheckboxRootEmits>();
 
-const checked = defineModel<boolean>('checked');
+const checked = defineModel<boolean>();
 
 const forwarded = useForwardPropsEmits(props, emits);
 
@@ -20,7 +20,7 @@ const id = useId();
 
 <template>
   <div class="flex items-center">
-    <Checkbox v-bind="forwarded" :id="id" v-model:checked="checked" />
+    <Checkbox v-bind="forwarded" :id="id" v-model="checked" />
     <label :for="id" class="ml-2 cursor-pointer text-sm"> <slot></slot> </label>
   </div>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/components/collapsible/collapsible-params-item.vue b/packages/@core/ui-kit/shadcn-ui/src/components/collapsible/collapsible-params-item.vue
new file mode 100644
index 00000000..85b01971
--- /dev/null
+++ b/packages/@core/ui-kit/shadcn-ui/src/components/collapsible/collapsible-params-item.vue
@@ -0,0 +1,123 @@
+<script setup lang="ts">
+import type { CollapsibleParamSchema } from './type';
+
+import { computed } from 'vue';
+
+import { globalShareState } from '@vben-core/shared/global-state';
+
+interface Props {
+  data: CollapsibleParamSchema;
+}
+const props = defineProps<Props>();
+
+const modelValue = defineModel('value');
+
+const finalOption = computed(() => {
+  const { type, ...otherOption } = props.data.option;
+
+  if (type === 'number' || type === 'exponential') {
+    return {
+      step: props.data.option.step ?? 1,
+      min: props.data.option.min,
+      max: props.data.option.max,
+      precision: props.data.option.precision,
+      ...otherOption,
+    };
+  }
+
+  return otherOption;
+});
+
+const components = globalShareState.getComponents();
+
+const FieldComponent = computed(() => {
+  switch (props.data.option.type) {
+    case 'exponential':
+    case 'number': {
+      return components.InputNumber;
+    }
+    case 'select': {
+      return components.Select;
+    }
+    case 'string': {
+      return components.Input;
+    }
+
+    default: {
+      return components.InputNumber;
+    }
+  }
+});
+
+const limitDisplay = computed(() => {
+  if (
+    props.data.option.min !== null &&
+    props.data.option.min !== undefined &&
+    props.data.option.max !== null &&
+    props.data.option.max !== undefined
+  ) {
+    return `[${props.data.option.min},${props.data.option.max}]`;
+  }
+
+  if (props.data.option.min !== null && props.data.option.min !== undefined) {
+    return `min:${props.data.option.min}`;
+  }
+
+  if (props.data.option.max !== null && props.data.option.max !== undefined) {
+    return `max:${props.data.option.max}`;
+  }
+
+  return '';
+});
+
+function reset() {
+  modelValue.value = props.data.defaultValue;
+}
+
+defineExpose({
+  reset,
+});
+</script>
+
+<template>
+  <div
+    class="body-row flex items-center w-full flex-nowrap not-last-of-type:border-b"
+  >
+    <div
+      class="body-cell pt-2 pb-2 px-5 leading-[1.5rem] flex items-center flex-nowrap"
+    >
+      {{ data.key }}
+    </div>
+    <div
+      class="body-cell pt-2 pb-2 px-5 leading-[1.5rem] flex items-center flex-nowrap"
+    >
+      <div class="flex-auto w-full">
+        <component
+          :is="FieldComponent"
+          v-bind="finalOption"
+          v-model:value="modelValue"
+        />
+      </div>
+      <div class="flex items-center flex-none text-muted-foreground pl-2 gap-2">
+        <span v-if="limitDisplay">
+          {{ limitDisplay }}
+        </span>
+        <span v-if="data.option.step && data.option.step !== 1">
+          step:{{ data.option.step }}
+        </span>
+      </div>
+    </div>
+    <div
+      class="body-cell pt-2 pb-2 px-5 leading-[1.5rem] flex items-center flex-nowrap w-full"
+    >
+      <p
+        class="line-clamp-2"
+        v-tippy="{
+          content: data.description,
+        }"
+      >
+        {{ data.description }}
+      </p>
+    </div>
+  </div>
+</template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/components/collapsible/collapsible-params.vue b/packages/@core/ui-kit/shadcn-ui/src/components/collapsible/collapsible-params.vue
new file mode 100644
index 00000000..921dcfb6
--- /dev/null
+++ b/packages/@core/ui-kit/shadcn-ui/src/components/collapsible/collapsible-params.vue
@@ -0,0 +1,264 @@
+<script setup lang="ts">
+import type { Recordable } from '@vben-core/typings';
+
+import type { CollapsibleParamSchema } from './type';
+
+import { computed, nextTick, ref, useTemplateRef, watch } from 'vue';
+
+import { useNamespace } from '@vben-core/composables';
+
+import { ChevronsDown } from '@lucide/vue';
+import {
+  CollapsibleContent,
+  CollapsibleRoot,
+  CollapsibleTrigger,
+} from 'reka-ui';
+
+import CollapsibleParamsItem from './collapsible-params-item.vue';
+
+interface Props {
+  defaultOpen?: boolean;
+  maxHeight?: number | string;
+  params: CollapsibleParamSchema[];
+  visibleCount?: number;
+}
+
+const props = withDefaults(defineProps<Props>(), {
+  visibleCount: 3,
+  defaultOpen: false,
+  maxHeight: undefined,
+});
+
+const emits = defineEmits<{ 'update:value': [any, string] }>();
+
+const modelValue = defineModel<
+  Recordable<CollapsibleParamSchema['defaultValue']>
+>('value', {
+  default: () => ({}),
+});
+
+const visibleRefs = useTemplateRef('visibleRefs');
+const collapsibleRefs = useTemplateRef('collapsibleRefs');
+
+const { b } = useNamespace('collapsible-params');
+
+const open = ref(props.defaultOpen);
+
+// 最小可见为1
+const finalVisibleCount = computed(() =>
+  Math.max(1, Math.floor(props.visibleCount)),
+);
+
+const visibleRows = computed(() => {
+  return props.params.slice(0, finalVisibleCount.value);
+});
+
+const collapsibleRows = computed(() => {
+  return props.params.slice(finalVisibleCount.value);
+});
+
+const bodyStyle = computed(() => {
+  if (!open.value || props.maxHeight == null) {
+    return undefined;
+  }
+
+  return {
+    maxHeight:
+      typeof props.maxHeight === 'number'
+        ? `${props.maxHeight}px`
+        : props.maxHeight,
+  };
+});
+
+function init(force = false) {
+  const nextValue: Recordable<CollapsibleParamSchema['defaultValue']> = {
+    ...modelValue.value,
+  };
+
+  for (const param of props.params) {
+    if (force || nextValue[param.key] === undefined) {
+      nextValue[param.key] = param.defaultValue ?? undefined;
+    }
+  }
+
+  modelValue.value = nextValue;
+}
+
+function toggleCollapsed() {
+  open.value = !open.value;
+}
+
+async function onParamValueChange(_: any, key: string) {
+  await nextTick();
+  emits('update:value', modelValue.value, key);
+}
+
+function resetValues() {
+  if (visibleRefs.value)
+    for (const rowRef of visibleRefs.value) {
+      rowRef?.reset();
+    }
+
+  if (collapsibleRefs.value)
+    for (const rowRef of collapsibleRefs.value) {
+      rowRef?.reset();
+    }
+
+  init(true);
+}
+
+function updateValues(
+  values: Recordable<CollapsibleParamSchema['defaultValue']>,
+) {
+  const allowedKeys = new Set(props.params.map((param) => param.key));
+  const patch = {} as Recordable<CollapsibleParamSchema['defaultValue']>;
+
+  for (const key in values) {
+    if (!Object.hasOwn(values, key)) continue;
+    if (!allowedKeys.has(key)) continue;
+
+    patch[key] = values[key];
+  }
+
+  modelValue.value = { ...modelValue.value, ...patch };
+}
+
+watch(
+  () => props.params,
+  () => init(),
+  { immediate: true, deep: true },
+);
+
+defineExpose({
+  toggleCollapsed,
+  resetValues,
+  updateValues,
+});
+</script>
+
+<template>
+  <CollapsibleRoot
+    v-model:open="open"
+    class="border rounded-[0.5rem] flex flex-col w-full overflow-hidden"
+    :class="[b()]"
+    :unmount-on-hide="false"
+  >
+    <div class="wrapper w-full relative flex flex-col overflow-x-auto">
+      <div class="w-full min-w-fit">
+        <div
+          class="header bg-accent w-full flex-none flex items-center rounded-t-[0.5rem] border-b"
+        >
+          <div
+            class="header-cell pt-2 pb-2 px-5 leading-[1.5rem] flex items-center flex-nowrap"
+          >
+            Name
+          </div>
+          <div
+            class="header-cell pt-2 pb-2 px-5 leading-[1.5rem] flex items-center flex-nowrap"
+          >
+            Value
+          </div>
+          <div
+            class="header-cell pt-2 pb-2 px-5 leading-[1.5rem] flex items-center flex-nowrap"
+          >
+            Description
+          </div>
+        </div>
+
+        <div
+          class="body w-full flex-none flex flex-col overflow-x-hidden"
+          :class="[
+            open && !!props.maxHeight ? 'overflow-y-auto' : 'overflow-y-hidden',
+          ]"
+          :style="bodyStyle"
+        >
+          <CollapsibleParamsItem
+            :data="row"
+            v-for="row in visibleRows"
+            :key="row.key"
+            ref="visibleRefs"
+            v-model:value="modelValue[row.key]"
+            @update:value="(v) => onParamValueChange(v, row.key)"
+          />
+          <CollapsibleContent
+            class="data-[state=open]:animate-collapsible-down data-[state=closed]:animate-collapsible-up"
+          >
+            <CollapsibleParamsItem
+              :data="row"
+              v-for="row in collapsibleRows"
+              :key="row.key"
+              ref="collapsibleRefs"
+              v-model:value="modelValue[row.key]"
+              @update:value="(v) => onParamValueChange(v, row.key)"
+            />
+          </CollapsibleContent>
+        </div>
+      </div>
+    </div>
+    <div
+      class="gutter h-[1.5rem]"
+      v-if="!open && collapsibleRows.length > 0"
+    ></div>
+    <div
+      class="trigger-bar flex min-h-[2rem] border-t px-5 pt-1 pb-1 rounded-b-[0.5rem] z-1"
+      :class="{
+        'collapsed absolute bottom-px left-px right-px border-t-0 pt-6': !open,
+      }"
+      v-if="collapsibleRows.length > 0"
+    >
+      <CollapsibleTrigger
+        class="cursor-pointer h-[2rem] flex items-center gap-2"
+      >
+        <ChevronsDown
+          class="transition-transform"
+          :size="16"
+          :class="{
+            'rotate-180': open,
+          }"
+        />
+        {{ open ? 'Fold' : 'Unfold' }}
+      </CollapsibleTrigger>
+    </div>
+  </CollapsibleRoot>
+</template>
+<style>
+.vben-collapsible-params {
+  .wrapper {
+    --column1: 11.25rem;
+    --column2: 18.25rem;
+    --column3: 27.5rem;
+
+    .header-cell,
+    .body-cell {
+      &:nth-of-type(1) {
+        flex: 0 0 var(--column1);
+
+        /* min-width: var(--column1); */
+      }
+
+      &:nth-of-type(2) {
+        flex: 0 0 var(--column2);
+
+        /* min-width: var(--column2); */
+      }
+
+      &:nth-of-type(3) {
+        flex: 1 1 var(--column3);
+        min-width: var(--column3);
+      }
+    }
+  }
+
+  .trigger-bar {
+    &.collapsed {
+      background-image: linear-gradient(
+        hsl(var(--foreground) / 0%) 0%,
+        hsl(var(--foreground) / 12%) 31.76%,
+        var(--color-border) 31.76%,
+        var(--color-border) 33.43%,
+        var(--color-background) 31.76%
+      );
+    }
+  }
+}
+</style>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/components/collapsible/collapsible.vue b/packages/@core/ui-kit/shadcn-ui/src/components/collapsible/collapsible.vue
new file mode 100755
index 00000000..d17d6ba7
--- /dev/null
+++ b/packages/@core/ui-kit/shadcn-ui/src/components/collapsible/collapsible.vue
@@ -0,0 +1,79 @@
+<script setup lang="ts">
+import type { CollapsibleRootEmits, CollapsibleRootProps } from 'reka-ui';
+
+import type { ClassType } from '@vben-core/typings';
+
+import { computed } from 'vue';
+
+import { ChevronsDown } from '@lucide/vue';
+import {
+  CollapsibleContent,
+  CollapsibleRoot,
+  CollapsibleTrigger,
+  useForwardPropsEmits,
+} from 'reka-ui';
+
+const props = defineProps<
+  CollapsibleRootProps & {
+    class?: ClassType;
+    showTrigger?: boolean;
+  }
+>();
+
+const emits = defineEmits<CollapsibleRootEmits>();
+
+const delegatedProps = computed(() => {
+  const { class: _cls, ...delegated } = props;
+
+  return delegated;
+});
+
+const forwarded = useForwardPropsEmits(delegatedProps, emits);
+
+const open = defineModel<boolean>('open', { default: true });
+
+function toggle() {
+  open.value = !open.value;
+}
+
+defineExpose({
+  toggle,
+});
+</script>
+
+<template>
+  <CollapsibleRoot
+    v-bind="forwarded"
+    v-model:open="open"
+    class="flex flex-col"
+    :unmount-on-hide="false"
+  >
+    <div
+      class="flex items-center justify-between"
+      v-if="$slots.label || showTrigger"
+    >
+      <slot name="label" v-if="$slots.label"> </slot>
+      <CollapsibleTrigger
+        v-if="showTrigger"
+        class="cursor-pointer rounded-full h-[25px] w-[25px] inline-flex items-center justify-center outline-none data-[state=closed]:bg-white data-[state=open]:bg-primary/20 hover:bg-primary/20 text-primary"
+      >
+        <slot name="trigger" :open>
+          <ChevronsDown
+            class="h-3.5 w-3.5 transition-transform"
+            :class="{
+              'rotate-180': open,
+            }"
+          />
+        </slot>
+      </CollapsibleTrigger>
+    </div>
+
+    <slot name="visibleContent" :open></slot>
+
+    <CollapsibleContent
+      class="data-[state=open]:animate-collapsible-down data-[state=closed]:animate-collapsible-up overflow-hidden justify-start"
+    >
+      <slot name="collapsibleContent" :open></slot>
+    </CollapsibleContent>
+  </CollapsibleRoot>
+</template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/components/collapsible/index.ts b/packages/@core/ui-kit/shadcn-ui/src/components/collapsible/index.ts
new file mode 100755
index 00000000..8563a7e5
--- /dev/null
+++ b/packages/@core/ui-kit/shadcn-ui/src/components/collapsible/index.ts
@@ -0,0 +1,4 @@
+export { default as VbenCollapsibleParams } from './collapsible-params.vue';
+export { default as VbenCollapsible } from './collapsible.vue';
+
+export * from './type';
diff --git a/packages/@core/ui-kit/shadcn-ui/src/components/collapsible/type.ts b/packages/@core/ui-kit/shadcn-ui/src/components/collapsible/type.ts
new file mode 100644
index 00000000..f2fcffdf
--- /dev/null
+++ b/packages/@core/ui-kit/shadcn-ui/src/components/collapsible/type.ts
@@ -0,0 +1,22 @@
+export interface CollapsibleParamsProps {
+  defaultOpen?: boolean;
+  maxHeight?: number | string;
+  params: CollapsibleParamSchema[];
+  visibleCount?: number;
+}
+
+export interface CollapsibleParamOption {
+  [key: string]: any;
+  max?: number;
+  min?: number;
+  precision?: number;
+  step?: number;
+  type?: 'exponential' | 'number' | 'select' | 'string';
+}
+
+export interface CollapsibleParamSchema {
+  defaultValue?: number | number[] | string | string[];
+  description: string;
+  key: string;
+  option: CollapsibleParamOption;
+}
diff --git a/packages/@core/ui-kit/shadcn-ui/src/components/context-menu/context-menu.vue b/packages/@core/ui-kit/shadcn-ui/src/components/context-menu/context-menu.vue
index 4cc4119a..c36fd4cf 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/components/context-menu/context-menu.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/components/context-menu/context-menu.vue
@@ -1,16 +1,17 @@
 <script setup lang="ts">
-import type { ClassType } from '@vben-core/typings';
 import type {
   ContextMenuContentProps,
   ContextMenuRootEmits,
   ContextMenuRootProps,
-} from 'radix-vue';
+} from 'reka-ui';
+
+import type { ClassType } from '@vben-core/typings';
 
 import type { IContextMenuItem } from './interface';
 
-import { computed } from 'vue';
+import { computed, onMounted, onUnmounted, ref } from 'vue';
 
-import { useForwardPropsEmits } from 'radix-vue';
+import { useForwardPropsEmits } from 'reka-ui';
 
 import {
   ContextMenu,
@@ -22,18 +23,26 @@ import {
 } from '../../ui/context-menu';
 
 const props = defineProps<
-  {
+  ContextMenuRootProps & {
     class?: ClassType;
     contentClass?: ClassType;
     contentProps?: ContextMenuContentProps;
     handlerData?: Record<string, any>;
     itemClass?: ClassType;
     menus: (data: any) => IContextMenuItem[];
-  } & ContextMenuRootProps
+  }
 >();
 
 const emits = defineEmits<ContextMenuRootEmits>();
 
+const NATIVE_CONTEXT_SELECTORS = [
+  'input',
+  'textarea',
+  'select',
+  '[contenteditable]:not([contenteditable="false"])',
+  '.allow-native-context',
+].join(', ');
+
 const delegatedProps = computed(() => {
   const {
     class: _cls,
@@ -58,20 +67,43 @@ function handleClick(menu: IContextMenuItem) {
   }
   menu?.handler?.(props.handlerData);
 }
+
+const triggerRef = ref<HTMLElement | null>(null);
+
+function onContextMenuCapture(e: MouseEvent) {
+  if ((e.target as HTMLElement).closest(NATIVE_CONTEXT_SELECTORS)) {
+    e.stopPropagation();
+  }
+}
+
+onMounted(() => {
+  triggerRef.value?.addEventListener('contextmenu', onContextMenuCapture, {
+    capture: true,
+  });
+});
+
+onUnmounted(() => {
+  triggerRef.value?.removeEventListener('contextmenu', onContextMenuCapture, {
+    capture: true,
+  });
+});
 </script>
 
 <template>
   <ContextMenu v-bind="forwarded">
     <ContextMenuTrigger as-child>
-      <slot></slot>
+      <div ref="triggerRef" class="contents">
+        <slot></slot>
+      </div>
     </ContextMenuTrigger>
     <ContextMenuContent
       :class="contentClass"
       v-bind="contentProps"
-      class="side-content z-[1000]"
+      class="side-content z-popup"
     >
       <template v-for="menu in menusView" :key="menu.key">
         <ContextMenuItem
+          v-if="!menu.hidden"
           :class="itemClass"
           :disabled="menu.disabled"
           :inset="menu.inset || !menu.icon"
diff --git a/packages/@core/ui-kit/shadcn-ui/src/components/context-menu/interface.ts b/packages/@core/ui-kit/shadcn-ui/src/components/context-menu/interface.ts
index 0af653fd..4aa41106 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/components/context-menu/interface.ts
+++ b/packages/@core/ui-kit/shadcn-ui/src/components/context-menu/interface.ts
@@ -10,6 +10,10 @@ interface IContextMenuItem {
    * @param data
    */
   handler?: (data: any) => void;
+  /**
+   * @zh_CN 是否隐藏
+   */
+  hidden?: boolean;
   /**
    * @zh_CN 图标
    */
diff --git a/packages/@core/ui-kit/shadcn-ui/src/components/count-to-animator/count-to-animator.vue b/packages/@core/ui-kit/shadcn-ui/src/components/count-to-animator/count-to-animator.vue
index f252049c..50fece66 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/components/count-to-animator/count-to-animator.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/components/count-to-animator/count-to-animator.vue
@@ -37,7 +37,18 @@ const props = withDefaults(defineProps<Props>(), {
   useEasing: true,
 });
 
-const emit = defineEmits(['onStarted', 'onFinished']);
+const emit = defineEmits<{
+  finished: [];
+  /**
+   * @deprecated 请使用{@link finished}事件
+   */
+  onFinished: [];
+  /**
+   * @deprecated 请使用{@link started}事件
+   */
+  onStarted: [];
+  started: [];
+}>();
 
 const source = ref(props.startVal);
 const disabled = ref(false);
@@ -73,8 +84,14 @@ function run() {
   outputValue = useTransition(source, {
     disabled,
     duration: props.duration,
-    onFinished: () => emit('onFinished'),
-    onStarted: () => emit('onStarted'),
+    onFinished: () => {
+      emit('finished');
+      emit('onFinished');
+    },
+    onStarted: () => {
+      emit('started');
+      emit('onStarted');
+    },
     ...(props.useEasing
       ? { transition: TransitionPresets[props.transition] }
       : {}),
diff --git a/packages/@core/ui-kit/shadcn-ui/src/components/descriptions/descriptions-cell.vue b/packages/@core/ui-kit/shadcn-ui/src/components/descriptions/descriptions-cell.vue
new file mode 100644
index 00000000..a67f606d
--- /dev/null
+++ b/packages/@core/ui-kit/shadcn-ui/src/components/descriptions/descriptions-cell.vue
@@ -0,0 +1,129 @@
+<script setup lang="ts">
+import type { CSSProperties } from 'vue';
+
+import type { DescriptionsRenderNode, DescriptionsSize } from './types';
+
+import { computed } from 'vue';
+
+import { cn } from '@vben-core/shared/utils';
+
+import { VbenRenderContent } from '../render-content';
+
+interface Props {
+  /** 是否边框模式 */
+  bordered?: boolean;
+  /** 是否显示冒号（仅非边框模式生效） */
+  colon?: boolean;
+  /** 内容 */
+  content?: DescriptionsRenderNode | null;
+  /** 内容样式 */
+  contentStyle?: CSSProperties;
+  /** 单项自定义类名 */
+  itemClass?: string;
+  /** 标签 */
+  label?: DescriptionsRenderNode | null;
+  /** 标签样式 */
+  labelStyle?: CSSProperties;
+  /** 尺寸 */
+  size?: DescriptionsSize;
+  /** 跨列数 */
+  span?: number;
+  /** 渲染标签 th 还是 td */
+  tag: 'td' | 'th';
+  /** 单元格类型 */
+  type: 'content' | 'item' | 'label';
+}
+
+const props = withDefaults(defineProps<Props>(), {
+  bordered: false,
+  colon: true,
+  content: null,
+  contentStyle: undefined,
+  itemClass: undefined,
+  label: null,
+  labelStyle: undefined,
+  size: 'middle',
+  span: 1,
+});
+
+const BORDERED_PADDING: Record<DescriptionsSize, string> = {
+  large: 'px-6 py-4',
+  middle: 'px-4 py-2.5',
+  small: 'px-3 py-2',
+};
+
+const PLAIN_PADDING: Record<DescriptionsSize, string> = {
+  large: 'pb-6',
+  middle: 'pb-4',
+  small: 'pb-2',
+};
+
+// 冒号通过伪元素追加，避免标签为渲染函数时无法拼接
+const COLON_CLASS = "after:content-[':']";
+
+const hasLabel = computed(
+  () => props.label !== null && props.label !== undefined,
+);
+const hasContent = computed(
+  () => props.content !== null && props.content !== undefined,
+);
+
+// 数字 0 会被 VbenRenderContent 当作 falsy 隐藏，这里转为字符串保证展示；
+// 同时将 null 归一为 undefined，匹配 VbenRenderContent 的 content 类型
+const displayLabel = computed(() => {
+  if (props.label === null || props.label === undefined) return undefined;
+  return typeof props.label === 'number' ? String(props.label) : props.label;
+});
+const displayContent = computed(() => {
+  if (props.content === null || props.content === undefined) return undefined;
+  return typeof props.content === 'number'
+    ? String(props.content)
+    : props.content;
+});
+
+const cellClass = computed(() => {
+  if (props.bordered) {
+    return cn(
+      'border border-border align-top break-words',
+      BORDERED_PADDING[props.size],
+      props.type === 'label'
+        ? 'bg-muted/50 text-start font-normal text-foreground'
+        : 'text-foreground',
+      props.itemClass,
+    );
+  }
+  return cn('align-top', PLAIN_PADDING[props.size], props.itemClass);
+});
+
+const labelClass = computed(() =>
+  cn('mr-2 shrink-0 text-muted-foreground', props.colon && COLON_CLASS),
+);
+</script>
+
+<template>
+  <component :is="tag" :class="cellClass" :colspan="span">
+    <!-- 边框模式：每个单元格仅承载 label 或 content -->
+    <template v-if="bordered">
+      <span v-if="hasLabel" :style="labelStyle">
+        <VbenRenderContent :content="displayLabel" />
+      </span>
+      <span v-if="hasContent" :style="contentStyle">
+        <VbenRenderContent :content="displayContent" />
+      </span>
+    </template>
+
+    <!-- 非边框模式：label + content 容器 -->
+    <div v-else class="flex">
+      <span v-if="hasLabel" :class="labelClass" :style="labelStyle">
+        <VbenRenderContent :content="displayLabel" />
+      </span>
+      <span
+        v-if="hasContent"
+        class="break-words text-foreground"
+        :style="contentStyle"
+      >
+        <VbenRenderContent :content="displayContent" />
+      </span>
+    </div>
+  </component>
+</template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/components/descriptions/descriptions-item.vue b/packages/@core/ui-kit/shadcn-ui/src/components/descriptions/descriptions-item.vue
new file mode 100644
index 00000000..677bb16c
--- /dev/null
+++ b/packages/@core/ui-kit/shadcn-ui/src/components/descriptions/descriptions-item.vue
@@ -0,0 +1,57 @@
+<script lang="ts">
+import type { PropType } from 'vue';
+
+import type { DescriptionsItemSpan, DescriptionsRenderNode } from './types';
+
+import { defineComponent } from 'vue';
+
+import { DESCRIPTIONS_ITEM_NAME } from './use-descriptions';
+
+/**
+ * 子节点用法的标记组件，本身不渲染任何内容。
+ * 其 props 与默认插槽会被父级 VbenDescriptions 收集为列表项。
+ */
+const VbenDescriptionsItem = defineComponent({
+  name: DESCRIPTIONS_ITEM_NAME,
+  props: {
+    content: {
+      default: undefined,
+      type: [
+        String,
+        Number,
+        Function,
+        Object,
+      ] as PropType<DescriptionsRenderNode>,
+    },
+    contentStyle: {
+      default: undefined,
+      type: Object,
+    },
+    label: {
+      default: undefined,
+      type: [
+        String,
+        Number,
+        Function,
+        Object,
+      ] as PropType<DescriptionsRenderNode>,
+    },
+    labelStyle: {
+      default: undefined,
+      type: Object,
+    },
+    span: {
+      default: undefined,
+      type: [Number, String, Object] as PropType<DescriptionsItemSpan>,
+    },
+  },
+  setup() {
+    return () => null;
+  },
+});
+
+// 额外标记，便于在 vnode 中稳健识别
+(VbenDescriptionsItem as Record<string, any>).__isDescriptionsItem = true;
+
+export default VbenDescriptionsItem;
+</script>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/components/descriptions/descriptions-row.vue b/packages/@core/ui-kit/shadcn-ui/src/components/descriptions/descriptions-row.vue
new file mode 100644
index 00000000..645d2f3b
--- /dev/null
+++ b/packages/@core/ui-kit/shadcn-ui/src/components/descriptions/descriptions-row.vue
@@ -0,0 +1,112 @@
+<script setup lang="ts">
+import type { CSSProperties } from 'vue';
+
+import type { DescriptionsSize, InternalDescriptionsItem } from './types';
+
+import DescriptionsCell from './descriptions-cell.vue';
+
+interface Props {
+  bordered?: boolean;
+  colon?: boolean;
+  contentStyle?: CSSProperties;
+  labelStyle?: CSSProperties;
+  row: InternalDescriptionsItem[];
+  size?: DescriptionsSize;
+  vertical?: boolean;
+}
+
+withDefaults(defineProps<Props>(), {
+  bordered: false,
+  colon: true,
+  contentStyle: undefined,
+  labelStyle: undefined,
+  size: 'middle',
+  vertical: false,
+});
+
+function mergeStyle(
+  base?: CSSProperties,
+  override?: CSSProperties,
+): CSSProperties | undefined {
+  if (!base && !override) return undefined;
+  return { ...base, ...override };
+}
+</script>
+
+<template>
+  <!-- 垂直布局：标签独占一行，内容独占一行 -->
+  <template v-if="vertical">
+    <tr>
+      <DescriptionsCell
+        v-for="(item, index) in row"
+        :key="`label-${item.key ?? index}`"
+        tag="th"
+        type="label"
+        :span="item.span ?? 1"
+        :bordered="bordered"
+        :colon="colon"
+        :size="size"
+        :label="item.label ?? null"
+        :item-class="item.class"
+        :label-style="mergeStyle(labelStyle, item.labelStyle)"
+      />
+    </tr>
+    <tr>
+      <DescriptionsCell
+        v-for="(item, index) in row"
+        :key="`content-${item.key ?? index}`"
+        tag="td"
+        type="content"
+        :span="item.span ?? 1"
+        :bordered="bordered"
+        :size="size"
+        :content="item.content ?? null"
+        :item-class="item.class"
+        :content-style="mergeStyle(contentStyle, item.contentStyle)"
+      />
+    </tr>
+  </template>
+
+  <!-- 水平 + 边框：每项拆分为 label(th) 与 content(td) -->
+  <tr v-else-if="bordered">
+    <template v-for="(item, index) in row" :key="item.key ?? index">
+      <DescriptionsCell
+        tag="th"
+        type="label"
+        :span="1"
+        :bordered="true"
+        :size="size"
+        :label="item.label ?? null"
+        :item-class="item.class"
+        :label-style="mergeStyle(labelStyle, item.labelStyle)"
+      />
+      <DescriptionsCell
+        tag="td"
+        type="content"
+        :span="(item.span ?? 1) * 2 - 1"
+        :bordered="true"
+        :size="size"
+        :content="item.content ?? null"
+        :content-style="mergeStyle(contentStyle, item.contentStyle)"
+      />
+    </template>
+  </tr>
+
+  <!-- 水平 + 非边框：每项一个单元格，label 与 content 同列 -->
+  <tr v-else>
+    <DescriptionsCell
+      v-for="(item, index) in row"
+      :key="item.key ?? index"
+      tag="td"
+      type="item"
+      :span="item.span ?? 1"
+      :colon="colon"
+      :size="size"
+      :label="item.label ?? null"
+      :content="item.content ?? null"
+      :item-class="item.class"
+      :label-style="mergeStyle(labelStyle, item.labelStyle)"
+      :content-style="mergeStyle(contentStyle, item.contentStyle)"
+    />
+  </tr>
+</template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/components/descriptions/descriptions.vue b/packages/@core/ui-kit/shadcn-ui/src/components/descriptions/descriptions.vue
new file mode 100644
index 00000000..a170b505
--- /dev/null
+++ b/packages/@core/ui-kit/shadcn-ui/src/components/descriptions/descriptions.vue
@@ -0,0 +1,91 @@
+<script setup lang="ts">
+import type { VNode } from 'vue';
+
+import type { DescriptionsItemType, DescriptionsProps } from './types';
+
+import { computed, useSlots } from 'vue';
+
+import { cn } from '@vben-core/shared/utils';
+
+import DescriptionsRow from './descriptions-row.vue';
+import {
+  calcRows,
+  normalizeItems,
+  parseItemsFromSlot,
+  resolveColumn,
+  useScreens,
+} from './use-descriptions';
+
+defineOptions({ name: 'VbenDescriptions' });
+
+const props = withDefaults(defineProps<DescriptionsProps>(), {
+  bordered: false,
+  class: undefined,
+  colon: true,
+  column: undefined,
+  contentStyle: undefined,
+  extra: undefined,
+  items: undefined,
+  labelStyle: undefined,
+  layout: 'horizontal',
+  size: 'middle',
+  title: undefined,
+});
+
+const slots = useSlots();
+const screens = useScreens();
+
+// 优先使用 items；否则从默认插槽中解析 VbenDescriptionsItem
+const resolvedItems = computed<DescriptionsItemType[]>(() => {
+  if (props.items && props.items.length > 0) return props.items;
+  const nodes = (slots.default?.() ?? []) as VNode[];
+  return parseItemsFromSlot(nodes);
+});
+
+const mergedColumn = computed(() => resolveColumn(props.column, screens.value));
+const mergedItems = computed(() =>
+  normalizeItems(resolvedItems.value, screens.value),
+);
+const rows = computed(() => calcRows(mergedItems.value, mergedColumn.value));
+
+const hasHeader = computed(
+  () => !!props.title || !!props.extra || !!slots.title || !!slots.extra,
+);
+
+const tableClass = computed(() =>
+  cn(
+    'w-full table-auto border-collapse text-sm',
+    // 非边框模式下，去掉最后一行的底部间距
+    !props.bordered && '[&>tbody>tr:last-child>td]:pb-0',
+  ),
+);
+</script>
+
+<template>
+  <div :class="cn('w-full', props.class)">
+    <div v-if="hasHeader" class="mb-5 flex items-center justify-between gap-4">
+      <div class="text-base font-semibold text-foreground">
+        <slot name="title">{{ title }}</slot>
+      </div>
+      <div class="text-foreground">
+        <slot name="extra">{{ extra }}</slot>
+      </div>
+    </div>
+
+    <table :class="tableClass">
+      <tbody>
+        <DescriptionsRow
+          v-for="(row, index) in rows"
+          :key="index"
+          :row="row"
+          :vertical="layout === 'vertical'"
+          :bordered="bordered"
+          :colon="colon"
+          :size="size"
+          :label-style="labelStyle"
+          :content-style="contentStyle"
+        />
+      </tbody>
+    </table>
+  </div>
+</template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/components/descriptions/index.ts b/packages/@core/ui-kit/shadcn-ui/src/components/descriptions/index.ts
new file mode 100644
index 00000000..1003a73a
--- /dev/null
+++ b/packages/@core/ui-kit/shadcn-ui/src/components/descriptions/index.ts
@@ -0,0 +1,4 @@
+export { default as VbenDescriptionsItem } from './descriptions-item.vue';
+export { default as VbenDescriptions } from './descriptions.vue';
+
+export * from './types';
diff --git a/packages/@core/ui-kit/shadcn-ui/src/components/descriptions/types.ts b/packages/@core/ui-kit/shadcn-ui/src/components/descriptions/types.ts
new file mode 100644
index 00000000..0dd11c69
--- /dev/null
+++ b/packages/@core/ui-kit/shadcn-ui/src/components/descriptions/types.ts
@@ -0,0 +1,93 @@
+import type { Component, CSSProperties } from 'vue';
+
+/** 响应式断点，与 antdv-next 保持一致 */
+export type DescriptionsBreakpoint =
+  | 'lg'
+  | 'md'
+  | 'sm'
+  | 'xl'
+  | 'xs'
+  | 'xxl'
+  | 'xxxl';
+
+/** 当前命中的断点集合 */
+export type ScreenMap = Partial<Record<DescriptionsBreakpoint, boolean>>;
+
+export type DescriptionsLayout = 'horizontal' | 'vertical';
+
+export type DescriptionsSize = 'large' | 'middle' | 'small';
+
+/** 列数，可为固定数字或按断点配置 */
+export type DescriptionsColumn =
+  | number
+  | Partial<Record<DescriptionsBreakpoint, number>>;
+
+/** 单项跨列，支持固定数字、'filled'（占满当前行剩余）或按断点配置 */
+export type DescriptionsItemSpan =
+  | 'filled'
+  | number
+  | Partial<Record<DescriptionsBreakpoint, number>>;
+
+/** 可渲染内容：字符串/数字/渲染函数/组件 */
+export type DescriptionsRenderNode = (() => any) | Component | number | string;
+
+export interface DescriptionsItemType {
+  /** 内容 */
+  content?: DescriptionsRenderNode;
+  /** 内容样式 */
+  contentStyle?: CSSProperties;
+  /** 唯一 key */
+  key?: number | string;
+  /** 标签 */
+  label?: DescriptionsRenderNode;
+  /** 标签样式 */
+  labelStyle?: CSSProperties;
+  /** 跨列 */
+  span?: DescriptionsItemSpan;
+}
+
+export interface DescriptionsProps {
+  /** 是否展示边框 */
+  bordered?: boolean;
+  class?: any;
+  /** 是否显示冒号（仅非 bordered 的水平布局生效） */
+  colon?: boolean;
+  /** 一行的列数 */
+  column?: DescriptionsColumn;
+  /** 统一的内容样式 */
+  contentStyle?: CSSProperties;
+  /** 操作区域，位于标题右侧 */
+  extra?: string;
+  /** 数据驱动的列表项；不传则读取默认插槽中的 VbenDescriptionsItem */
+  items?: DescriptionsItemType[];
+  /** 统一的标签样式 */
+  labelStyle?: CSSProperties;
+  /** 布局方式 */
+  layout?: DescriptionsLayout;
+  /** 尺寸 */
+  size?: DescriptionsSize;
+  /** 标题 */
+  title?: string;
+}
+
+export interface DescriptionsItemProps {
+  content?: DescriptionsRenderNode;
+  contentStyle?: CSSProperties;
+  label?: DescriptionsRenderNode;
+  labelStyle?: CSSProperties;
+  span?: DescriptionsItemSpan;
+}
+
+/** 归一化后的内部项，span 已解析为数字 */
+export interface InternalDescriptionsItem {
+  _index?: number;
+  class?: string;
+  content?: DescriptionsRenderNode;
+  contentStyle?: CSSProperties;
+  filled?: boolean;
+  key?: number | string;
+  label?: DescriptionsRenderNode;
+  labelStyle?: CSSProperties;
+  span?: number;
+  style?: CSSProperties;
+}
diff --git a/packages/@core/ui-kit/shadcn-ui/src/components/descriptions/use-descriptions.ts b/packages/@core/ui-kit/shadcn-ui/src/components/descriptions/use-descriptions.ts
new file mode 100644
index 00000000..2c1f04f4
--- /dev/null
+++ b/packages/@core/ui-kit/shadcn-ui/src/components/descriptions/use-descriptions.ts
@@ -0,0 +1,216 @@
+import type { VNode } from 'vue';
+
+import type {
+  DescriptionsBreakpoint,
+  DescriptionsColumn,
+  DescriptionsItemType,
+  InternalDescriptionsItem,
+  ScreenMap,
+} from './types';
+
+import { Comment, computed, Fragment } from 'vue';
+
+import { useBreakpoints } from '@vueuse/core';
+
+/** 默认列数映射 */
+export const DEFAULT_COLUMN_MAP: Record<DescriptionsBreakpoint, number> = {
+  lg: 3,
+  md: 3,
+  sm: 2,
+  xl: 3,
+  xs: 1,
+  xxl: 3,
+  xxxl: 4,
+};
+
+/** 由大到小的断点顺序，matchScreen 按此顺序取第一个命中的值 */
+const RESPONSIVE_ARRAY: DescriptionsBreakpoint[] = [
+  'xxxl',
+  'xxl',
+  'xl',
+  'lg',
+  'md',
+  'sm',
+  'xs',
+];
+
+/** 断点像素值 */
+const BREAKPOINT_PX = {
+  sm: 576,
+  md: 768,
+  lg: 992,
+  xl: 1200,
+  xxl: 1600,
+  xxxl: 2000,
+};
+
+/**
+ * 在给定的断点配置中，按由大到小的顺序取第一个命中的值
+ */
+export function matchScreen(
+  screens: ScreenMap,
+  screenSizes?: Partial<Record<DescriptionsBreakpoint, number>>,
+): number | undefined {
+  if (!screenSizes) return undefined;
+  for (const breakpoint of RESPONSIVE_ARRAY) {
+    if (screens[breakpoint] && screenSizes[breakpoint] !== undefined) {
+      return screenSizes[breakpoint];
+    }
+  }
+  return undefined;
+}
+
+/**
+ * 监听视口宽度，返回当前命中的断点集合
+ */
+export function useScreens() {
+  const breakpoints = useBreakpoints(BREAKPOINT_PX);
+  return computed<ScreenMap>(() => ({
+    lg: breakpoints.lg.value,
+    md: breakpoints.md.value,
+    sm: breakpoints.sm.value,
+    xl: breakpoints.xl.value,
+    xs: !breakpoints.sm.value,
+    xxl: breakpoints.xxl.value,
+    xxxl: breakpoints.xxxl.value,
+  }));
+}
+
+/**
+ * 计算最终列数：固定数字直接返回，否则按断点解析
+ */
+export function resolveColumn(
+  column: DescriptionsColumn | undefined,
+  screens: ScreenMap,
+): number {
+  if (typeof column === 'number') return column;
+  return matchScreen(screens, { ...DEFAULT_COLUMN_MAP, ...column }) ?? 3;
+}
+
+/**
+ * 归一化列表项：将 span 解析为数字，'filled' 标记为 filled
+ */
+export function normalizeItems(
+  items: DescriptionsItemType[],
+  screens: ScreenMap,
+): InternalDescriptionsItem[] {
+  return items.map((item, index) => {
+    const { span, ...rest } = item;
+    if (span === 'filled') {
+      return { ...rest, _index: index, filled: true };
+    }
+    return {
+      ...rest,
+      _index: index,
+      span: typeof span === 'number' ? span : matchScreen(screens, span),
+    };
+  });
+}
+
+/**
+ * 行装箱算法：根据列数与各项 span 将列表项拆分为多行，
+ * 并补齐每行最后一项以占满列数。移植自 antdv-next useRow。
+ */
+export function calcRows(
+  items: InternalDescriptionsItem[],
+  column: number,
+): InternalDescriptionsItem[][] {
+  let rows: InternalDescriptionsItem[][] = [];
+  let tmpRow: InternalDescriptionsItem[] = [];
+  let count = 0;
+
+  items.filter(Boolean).forEach((item) => {
+    const { filled, ...rest } = item;
+    // filled：占满当前行剩余，并立即换行
+    if (filled) {
+      tmpRow.push(rest);
+      rows.push(tmpRow);
+      tmpRow = [];
+      count = 0;
+      return;
+    }
+
+    const restSpan = column - count;
+    count += item.span || 1;
+
+    if (count >= column) {
+      // 超出列数时，将当前项 span 收敛为剩余列数，避免溢出
+      tmpRow.push(count > column ? { ...rest, span: restSpan } : rest);
+      rows.push(tmpRow);
+      tmpRow = [];
+      count = 0;
+    } else {
+      tmpRow.push(rest);
+    }
+  });
+
+  if (tmpRow.length > 0) rows.push(tmpRow);
+
+  // 补齐：若一行总 span 不足列数，扩展最后一项
+  rows = rows.map((row) => {
+    const total = row.reduce((acc, item) => acc + (item.span || 1), 0);
+    if (total < column) {
+      const last = row[row.length - 1];
+      if (last) {
+        last.span = column - (total - (last.span || 1));
+      }
+    }
+    return row;
+  });
+
+  return rows;
+}
+
+/** 标记组件类型为 DescriptionsItem，便于从插槽 vnode 中识别 */
+export const DESCRIPTIONS_ITEM_NAME = 'VbenDescriptionsItem';
+
+function isItemVNode(node: VNode): boolean {
+  const type = node.type as any;
+  return (
+    !!type &&
+    (type.__isDescriptionsItem === true || type.name === DESCRIPTIONS_ITEM_NAME)
+  );
+}
+
+function flattenVNodes(nodes: VNode[]): VNode[] {
+  const result: VNode[] = [];
+  for (const node of nodes) {
+    if (node.type === Fragment && Array.isArray(node.children)) {
+      result.push(...flattenVNodes(node.children as VNode[]));
+    } else if (node.type !== Comment) {
+      result.push(node);
+    }
+  }
+  return result;
+}
+
+/**
+ * 从默认插槽的 vnode 中解析出列表项，支持
+ * <VbenDescriptionsItem label="..." :span="2">content</VbenDescriptionsItem> 写法
+ */
+export function parseItemsFromSlot(nodes: VNode[]): DescriptionsItemType[] {
+  return flattenVNodes(nodes)
+    .filter((node) => isItemVNode(node))
+    .map((node) => {
+      const props = (node.props ?? {}) as Record<string, any>;
+      const children = (node.children ?? {}) as Record<string, any>;
+      const labelSlot =
+        typeof children.label === 'function' ? children.label : undefined;
+      const contentDefaultSlot =
+        typeof children.default === 'function' ? children.default : undefined;
+      const contentSlot =
+        typeof children.content === 'function'
+          ? children.content
+          : contentDefaultSlot;
+      return {
+        class: props.class,
+        content: contentSlot ?? props.content,
+        contentStyle: props.contentStyle ?? props['content-style'],
+        key: node.key ?? undefined,
+        label: labelSlot ?? props.label,
+        labelStyle: props.labelStyle ?? props['label-style'],
+        span: props.span,
+        style: props.style,
+      } as DescriptionsItemType;
+    });
+}
diff --git a/packages/@core/ui-kit/shadcn-ui/src/components/dropdown-menu/dropdown-menu.vue b/packages/@core/ui-kit/shadcn-ui/src/components/dropdown-menu/dropdown-menu.vue
index f1bbdee9..1eea1e3e 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/components/dropdown-menu/dropdown-menu.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/components/dropdown-menu/dropdown-menu.vue
@@ -35,7 +35,7 @@ function handleItemClick(menu: IDropdownMenuItem) {
         <template v-for="menu in menus" :key="menu.value">
           <DropdownMenuItem
             :disabled="menu.disabled"
-            class="data-[state=checked]:bg-accent data-[state=checked]:text-accent-foreground text-foreground/80 mb-1 cursor-pointer"
+            class="text-foreground/80 data-[state=checked]:bg-accent data-[state=checked]:text-accent-foreground mb-1 cursor-pointer"
             @click="handleItemClick(menu)"
           >
             <component :is="menu.icon" v-if="menu.icon" class="mr-2 size-4" />
diff --git a/packages/@core/ui-kit/shadcn-ui/src/components/dropdown-menu/dropdown-radio-menu.vue b/packages/@core/ui-kit/shadcn-ui/src/components/dropdown-menu/dropdown-radio-menu.vue
index c0e23c87..172e6944 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/components/dropdown-menu/dropdown-radio-menu.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/components/dropdown-menu/dropdown-radio-menu.vue
@@ -27,14 +27,14 @@ function handleItemClick(value: string) {
     </DropdownMenuTrigger>
     <DropdownMenuContent align="start">
       <DropdownMenuGroup>
-        <template v-for="menu in menus" :key="menu.key">
+        <template v-for="menu in menus" :key="menu.value">
           <DropdownMenuItem
             :class="
               menu.value === modelValue
                 ? 'bg-accent text-accent-foreground'
                 : ''
             "
-            class="data-[state=checked]:bg-accent data-[state=checked]:text-accent-foreground text-foreground/80 mb-1 cursor-pointer"
+            class="text-foreground/80 data-[state=checked]:bg-accent data-[state=checked]:text-accent-foreground mb-1 cursor-pointer"
             @click="handleItemClick(menu.value)"
           >
             <component :is="menu.icon" v-if="menu.icon" class="mr-2 size-4" />
diff --git a/packages/@core/ui-kit/shadcn-ui/src/components/expandable-arrow/expandable-arrow.vue b/packages/@core/ui-kit/shadcn-ui/src/components/expandable-arrow/expandable-arrow.vue
index 5cdf619a..cabfa4af 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/components/expandable-arrow/expandable-arrow.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/components/expandable-arrow/expandable-arrow.vue
@@ -7,7 +7,7 @@ const props = defineProps<{
 }>();
 
 // 控制箭头展开/收起状态
-const collapsed = defineModel({ default: false });
+const collapsed = defineModel<boolean>({ default: false });
 </script>
 
 <template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/components/full-screen/full-screen.vue b/packages/@core/ui-kit/shadcn-ui/src/components/full-screen/full-screen.vue
index 59f28978..5c8de146 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/components/full-screen/full-screen.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/components/full-screen/full-screen.vue
@@ -7,21 +7,34 @@ import { VbenIconButton } from '../button';
 
 defineOptions({ name: 'FullScreen' });
 
+withDefaults(
+  defineProps<{
+    tooltip?: string;
+  }>(),
+  {
+    tooltip: '',
+  },
+);
+
 const { isFullscreen, toggle } = useFullscreen();
 
 // 重新检查全屏状态
 isFullscreen.value = !!(
   document.fullscreenElement ||
-  // @ts-ignore
+  // @ts-expect-error - vendor fullscreen APIs are not included in the standard DOM typings
   document.webkitFullscreenElement ||
-  // @ts-ignore
+  // @ts-expect-error - vendor fullscreen APIs are not included in the standard DOM typings
   document.mozFullScreenElement ||
-  // @ts-ignore
+  // @ts-expect-error - vendor fullscreen APIs are not included in the standard DOM typings
   document.msFullscreenElement
 );
 </script>
 <template>
-  <VbenIconButton @click="toggle">
+  <VbenIconButton
+    :tooltip="tooltip || undefined"
+    class="hover:animate-[shrink_0.3s_ease-in-out]"
+    @click="toggle"
+  >
     <Minimize v-if="isFullscreen" class="text-foreground size-4" />
     <Maximize v-else class="text-foreground size-4" />
   </VbenIconButton>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/components/hover-card/hover-card.vue b/packages/@core/ui-kit/shadcn-ui/src/components/hover-card/hover-card.vue
index f528d61c..47ddad84 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/components/hover-card/hover-card.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/components/hover-card/hover-card.vue
@@ -1,14 +1,15 @@
 <script setup lang="ts">
-import type { ClassType } from '@vben-core/typings';
 import type {
   HoverCardContentProps,
   HoverCardRootEmits,
   HoverCardRootProps,
-} from 'radix-vue';
+} from 'reka-ui';
+
+import type { ClassType } from '@vben-core/typings';
 
 import { computed } from 'vue';
 
-import { useForwardPropsEmits } from 'radix-vue';
+import { useForwardPropsEmits } from 'reka-ui';
 
 import { HoverCard, HoverCardContent, HoverCardTrigger } from '../../ui';
 
@@ -46,7 +47,7 @@ const forwarded = useForwardPropsEmits(delegatedProps, emits);
     <HoverCardContent
       :class="contentClass"
       v-bind="contentProps"
-      class="side-content z-[1000]"
+      class="side-content z-popup"
     >
       <slot></slot>
     </HoverCardContent>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/components/hover-card/index.ts b/packages/@core/ui-kit/shadcn-ui/src/components/hover-card/index.ts
index 44a75808..3582521c 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/components/hover-card/index.ts
+++ b/packages/@core/ui-kit/shadcn-ui/src/components/hover-card/index.ts
@@ -1,2 +1,2 @@
 export { default as VbenHoverCard } from './hover-card.vue';
-export type { HoverCardContentProps } from 'radix-vue';
+export type { HoverCardContentProps } from 'reka-ui';
diff --git a/packages/@core/ui-kit/shadcn-ui/src/components/icon/icon.vue b/packages/@core/ui-kit/shadcn-ui/src/components/icon/icon.vue
index bb3d3a5b..80de0d70 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/components/icon/icon.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/components/icon/icon.vue
@@ -1,5 +1,7 @@
 <script setup lang="ts">
-import { type Component, computed } from 'vue';
+import type { Component } from 'vue';
+
+import { computed } from 'vue';
 
 import { IconDefault, IconifyIcon } from '@vben-core/icons';
 import {
diff --git a/packages/@core/ui-kit/shadcn-ui/src/components/index.ts b/packages/@core/ui-kit/shadcn-ui/src/components/index.ts
index 6b2c7fc1..7e90a2b3 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/components/index.ts
+++ b/packages/@core/ui-kit/shadcn-ui/src/components/index.ts
@@ -3,8 +3,10 @@ export * from './back-top';
 export * from './breadcrumb';
 export * from './button';
 export * from './checkbox';
+export * from './collapsible';
 export * from './context-menu';
 export * from './count-to-animator';
+export * from './descriptions';
 export * from './dropdown-menu';
 export * from './expandable-arrow';
 export * from './full-screen';
@@ -20,4 +22,5 @@ export * from './segmented';
 export * from './select';
 export * from './spine-text';
 export * from './spinner';
+export * from './table-action';
 export * from './tooltip';
diff --git a/packages/@core/ui-kit/shadcn-ui/src/components/input-password/input-password.vue b/packages/@core/ui-kit/shadcn-ui/src/components/input-password/input-password.vue
index be79862a..c32d3f6d 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/components/input-password/input-password.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/components/input-password/input-password.vue
@@ -47,7 +47,7 @@ const show = ref(false);
         'top-3': !!passwordStrength,
         'top-1/2 -translate-y-1/2 items-center': !passwordStrength,
       }"
-      class="hover:text-foreground text-foreground/60 absolute inset-y-0 right-0 flex cursor-pointer pr-3 text-lg leading-5"
+      class="text-foreground/60 hover:text-foreground absolute inset-y-0 right-0 flex cursor-pointer pr-3 text-lg leading-5"
       @click="show = !show"
     >
       <Eye v-if="show" class="size-4" />
diff --git a/packages/@core/ui-kit/shadcn-ui/src/components/input-password/password-strength.vue b/packages/@core/ui-kit/shadcn-ui/src/components/input-password/password-strength.vue
index dae90efa..e6586424 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/components/input-password/password-strength.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/components/input-password/password-strength.vue
@@ -51,7 +51,7 @@ function checkPasswordStrength(password: string) {
   <div class="relative mt-2 flex items-center justify-between">
     <template v-for="index in 5" :key="index">
       <div
-        class="dark:bg-input-background bg-heavy relative mr-1 h-1.5 w-1/5 rounded-sm last:mr-0"
+        class="bg-heavy dark:bg-input-background relative mr-1 h-1.5 w-1/5 rounded-sm last:mr-0"
       >
         <span
           :style="{
diff --git a/packages/@core/ui-kit/shadcn-ui/src/components/logo/logo.vue b/packages/@core/ui-kit/shadcn-ui/src/components/logo/logo.vue
index abb6eb8e..3ab408c0 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/components/logo/logo.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/components/logo/logo.vue
@@ -1,27 +1,51 @@
 <script setup lang="ts">
+import { computed } from 'vue';
+
 import { VbenAvatar } from '../avatar';
 
 interface Props {
   /**
-   * @zh_CN 是否收起文本
+   * @zh_CN 是否收起文本；布局状态，侧边栏收起时隐藏文字。
    */
   collapsed?: boolean;
+  /**
+   * @zh_CN Logo 图片适应方式
+   */
+  fit?: 'contain' | 'cover' | 'fill' | 'none' | 'scale-down';
+  /**
+   * @zh_CN logo高度， 只在 logoMode=full时生效
+   */
+  fullLogoHeight?: number | string;
   /**
    * @zh_CN Logo 跳转地址
    */
   href?: string;
+  /**
+   * @zh_CN logo 展示类型，icon 图标模式， full 铺满logo区域
+   */
+  logoMode?: 'full' | 'icon';
   /**
    * @zh_CN Logo 图片大小
    */
   logoSize?: number;
+  /**
+   * @zh_CN Logo 是否展示文本
+   */
+  showText?: boolean;
   /**
    * @zh_CN Logo 图标
    */
   src?: string;
+  /**
+   * @zh_CN 暗色主题 Logo 图标 (可选，若不设置则使用 src)
+   */
+  srcDark?: string;
+
   /**
    * @zh_CN Logo 文本
    */
   text: string;
+
   /**
    * @zh_CN Logo 主题
    */
@@ -36,37 +60,100 @@ defineOptions({
   name: 'VbenLogo',
 });
 
-withDefaults(defineProps<Props>(), {
+const props = withDefaults(defineProps<Props>(), {
   collapsed: false,
   href: 'javascript:void 0',
+  logoMode: 'icon',
   logoSize: 32,
+  fullLogoHeight: 42,
   src: '',
+  srcDark: '',
   theme: 'light',
+  fit: 'cover',
+  showText: true,
 });
+
+/**
+ * @zh_CN 根据主题选择合适的 logo 图标
+ */
+const logoSrc = computed(() => {
+  // 如果是暗色主题且提供了 srcDark，则使用暗色主题的 logo
+  if (props.theme === 'dark' && props.srcDark) {
+    return props.srcDark;
+  }
+  // 否则使用默认的 src
+  return props.src;
+});
+
+/**
+ * @zh_CN 是否铺满容器显示log
+ */
+const shouldUseFullLogo = computed(() => {
+  return props.logoMode === 'full' && !props.collapsed;
+});
+
+/**
+ * @zh_CN 根据配置展示 logo text
+ */
+const shouldShowText = computed(() => {
+  return (
+    props.showText &&
+    !props.collapsed &&
+    !shouldUseFullLogo.value &&
+    !!props.text
+  );
+});
+
+/**
+ * @zh_CN full 模式下logo的样式
+ */
+const fullLogoStyle = computed(() => ({
+  height:
+    typeof props.fullLogoHeight === 'number'
+      ? `${props.fullLogoHeight}px`
+      : props.fullLogoHeight,
+  objectFit: props.fit,
+}));
 </script>
 
 <template>
   <div :class="theme" class="flex h-full items-center text-lg">
     <a
-      :class="$attrs.class"
+      :class="[
+        $attrs.class,
+        shouldShowText
+          ? 'gap-2 px-3 justify-start'
+          : 'w-full p-0 justify-center',
+      ]"
       :href="href"
-      class="flex h-full items-center gap-2 overflow-hidden px-3 text-lg leading-normal transition-all duration-500"
+      class="flex h-full items-center overflow-hidden text-lg leading-normal transition-all duration-500"
     >
-      <VbenAvatar
-        v-if="src"
+      <img
+        v-if="logoSrc && shouldUseFullLogo"
         :alt="text"
-        :src="src"
-        class="relative w-8 rounded-none bg-transparent"
+        :src="logoSrc"
+        :style="fullLogoStyle"
+        class="w-full"
       />
-      <span
-        v-if="!collapsed"
-        class="app-version text-foreground truncate text-nowrap font-semibold"
-      >
-        {{ text }}
-<!--        <b>-->
-<!--          <i>V {{ version }}</i>-->
-<!--        </b>-->
-      </span>
+
+      <VbenAvatar
+        v-else-if="logoSrc"
+        :alt="text"
+        :src="logoSrc"
+        :size="logoSize"
+        :fit="fit"
+        class="relative rounded-none bg-transparent"
+      />
+      <template v-if="shouldShowText">
+        <slot name="text">
+          <span class="text-foreground truncate font-semibold text-nowrap">
+            {{ text }}
+            <!--        <b>-->
+            <!--          <i>V {{ version }}</i>-->
+            <!--        </b>-->
+          </span>
+        </slot>
+      </template>
     </a>
   </div>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/components/pin-input/input.vue b/packages/@core/ui-kit/shadcn-ui/src/components/pin-input/input.vue
index 941198d1..e64e6557 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/components/pin-input/input.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/components/pin-input/input.vue
@@ -3,7 +3,7 @@ import type { PinInputProps } from './types';
 
 import { computed, onBeforeUnmount, ref, useId, watch } from 'vue';
 
-import { PinInput, PinInputGroup, PinInputInput } from '../../ui';
+import { PinInput, PinInputGroup, PinInputSlot } from '../../ui';
 import { VbenButton } from '../button';
 
 defineOptions({
@@ -84,6 +84,8 @@ onBeforeUnmount(() => {
 });
 
 const id = useId();
+
+const pinType = 'text' as const;
 </script>
 
 <template>
@@ -94,12 +96,12 @@ const id = useId();
     class="flex w-full justify-between"
     otp
     placeholder="○"
-    type="number"
+    :type="pinType"
     @complete="handleComplete"
   >
     <div class="relative flex w-full">
       <PinInputGroup class="mr-2">
-        <PinInputInput
+        <PinInputSlot
           v-for="(item, index) in codeLength"
           :key="item"
           :index="index"
@@ -108,7 +110,7 @@ const id = useId();
       <VbenButton
         :disabled="disabled"
         :loading="btnLoading"
-        class="flex-grow"
+        class="grow"
         size="lg"
         variant="outline"
         @click="handleSend"
diff --git a/packages/@core/ui-kit/shadcn-ui/src/components/popover/popover.vue b/packages/@core/ui-kit/shadcn-ui/src/components/popover/popover.vue
index b38e0b42..9552a203 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/components/popover/popover.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/components/popover/popover.vue
@@ -1,14 +1,15 @@
 <script setup lang="ts">
-import type { ClassType } from '@vben-core/typings';
 import type {
   PopoverContentProps,
   PopoverRootEmits,
   PopoverRootProps,
-} from 'radix-vue';
+} from 'reka-ui';
+
+import type { ClassType } from '@vben-core/typings';
 
 import { computed } from 'vue';
 
-import { useForwardPropsEmits } from 'radix-vue';
+import { useForwardPropsEmits } from 'reka-ui';
 
 import {
   PopoverContent,
@@ -20,6 +21,7 @@ interface Props extends PopoverRootProps {
   class?: ClassType;
   contentClass?: ClassType;
   contentProps?: PopoverContentProps;
+  triggerClass?: ClassType;
 }
 
 const props = withDefaults(defineProps<Props>(), {});
@@ -31,6 +33,7 @@ const delegatedProps = computed(() => {
     class: _cls,
     contentClass: _,
     contentProps: _cProps,
+    triggerClass: _tClass,
     ...delegated
   } = props;
 
@@ -42,12 +45,12 @@ const forwarded = useForwardPropsEmits(delegatedProps, emits);
 
 <template>
   <PopoverRoot v-bind="forwarded">
-    <PopoverTrigger>
+    <PopoverTrigger as="span" :class="triggerClass">
       <slot name="trigger"></slot>
 
       <PopoverContent
         :class="contentClass"
-        class="side-content z-[1000]"
+        class="side-content z-popup"
         v-bind="contentProps"
       >
         <slot></slot>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/components/render-content/render-content.vue b/packages/@core/ui-kit/shadcn-ui/src/components/render-content/render-content.vue
index 8476d7a8..47086623 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/components/render-content/render-content.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/components/render-content/render-content.vue
@@ -1,8 +1,9 @@
 <script lang="ts">
 import type { Component, PropType } from 'vue';
+
 import { defineComponent, h } from 'vue';
 
-import { isFunction, isObject } from '@vben-core/shared/utils';
+import { isFunction, isObject, isString } from '@vben-core/shared/utils';
 
 export default defineComponent({
   name: 'RenderContent',
@@ -13,6 +14,10 @@ export default defineComponent({
         | undefined,
       type: [Object, String, Function],
     },
+    renderBr: {
+      default: false,
+      type: Boolean,
+    },
   },
   setup(props, { attrs, slots }) {
     return () => {
@@ -23,16 +28,31 @@ export default defineComponent({
         (isObject(props.content) || isFunction(props.content)) &&
         props.content !== null;
       if (!isComponent) {
-        return props.content;
+        if (props.renderBr && isString(props.content)) {
+          const lines = props.content.split('\n');
+          const result = [];
+          for (const [i, line] of lines.entries()) {
+            result.push(h('p', { key: i }, line));
+            // if (i < lines.length - 1) {
+            //   result.push(h('br'));
+            // }
+          }
+          return result;
+        } else {
+          return props.content;
+        }
       }
-      return h(props.content as never, {
-        ...attrs,
-        props: {
-          ...props,
+      return h(
+        props.content as never,
+        {
           ...attrs,
+          props: {
+            ...props,
+            ...attrs,
+          },
         },
         slots,
-      });
+      );
     };
   },
 });
diff --git a/packages/@core/ui-kit/shadcn-ui/src/components/scrollbar/scrollbar.vue b/packages/@core/ui-kit/shadcn-ui/src/components/scrollbar/scrollbar.vue
index f066b91a..d1d394d4 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/components/scrollbar/scrollbar.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/components/scrollbar/scrollbar.vue
@@ -39,6 +39,14 @@ const isAtRight = ref(false);
 const isAtBottom = ref(false);
 const isAtLeft = ref(true);
 
+/**
+ * We have to check if the scroll amount is close enough to some threshold in order to
+ * more accurately calculate arrivedState. This is because scrollTop/scrollLeft are non-rounded
+ * numbers, while scrollHeight/scrollWidth and clientHeight/clientWidth are rounded.
+ * https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollHeight#determine_if_an_element_has_been_totally_scrolled
+ */
+const ARRIVED_STATE_THRESHOLD_PIXELS = 1;
+
 const showShadowTop = computed(() => props.shadow && props.shadowTop);
 const showShadowBottom = computed(() => props.shadow && props.shadowBottom);
 const showShadowLeft = computed(() => props.shadow && props.shadowLeft);
@@ -60,14 +68,18 @@ function handleScroll(event: Event) {
   const target = event.target as HTMLElement;
   const scrollTop = target?.scrollTop ?? 0;
   const scrollLeft = target?.scrollLeft ?? 0;
-  const offsetHeight = target?.offsetHeight ?? 0;
-  const offsetWidth = target?.offsetWidth ?? 0;
+  const clientHeight = target?.clientHeight ?? 0;
+  const clientWidth = target?.clientWidth ?? 0;
   const scrollHeight = target?.scrollHeight ?? 0;
   const scrollWidth = target?.scrollWidth ?? 0;
   isAtTop.value = scrollTop <= 0;
   isAtLeft.value = scrollLeft <= 0;
-  isAtBottom.value = scrollTop + offsetHeight >= scrollHeight;
-  isAtRight.value = scrollLeft + offsetWidth >= scrollWidth;
+  isAtBottom.value =
+    Math.abs(scrollTop) + clientHeight >=
+    scrollHeight - ARRIVED_STATE_THRESHOLD_PIXELS;
+  isAtRight.value =
+    Math.abs(scrollLeft) + clientWidth >=
+    scrollWidth - ARRIVED_STATE_THRESHOLD_PIXELS;
 
   emit('scrollAt', {
     bottom: isAtBottom.value,
@@ -103,7 +115,7 @@ function handleScroll(event: Event) {
     ></div>
     <ScrollBar
       v-if="horizontal"
-      :class="scrollBarClass"
+      :class="cn(scrollBarClass)"
       orientation="horizontal"
     />
   </ScrollArea>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/components/segmented/segmented.vue b/packages/@core/ui-kit/shadcn-ui/src/components/segmented/segmented.vue
index f1a8e570..b1fa9ac3 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/components/segmented/segmented.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/components/segmented/segmented.vue
@@ -3,14 +3,15 @@ import type { SegmentedItem } from './types';
 
 import { computed } from 'vue';
 
-import { TabsTrigger } from 'radix-vue';
+import { TabsTrigger } from 'reka-ui';
 
 import { Tabs, TabsContent, TabsList } from '../../ui';
+import { VbenTooltip } from '../tooltip';
 import TabsIndicator from './tabs-indicator.vue';
 
 interface Props {
   defaultValue?: string;
-  tabs: SegmentedItem[];
+  tabs?: SegmentedItem[];
 }
 
 const props = withDefaults(defineProps<Props>(), {
@@ -35,18 +36,33 @@ const tabsIndicatorStyle = computed(() => {
     width: `${(100 / props.tabs.length).toFixed(0)}%`,
   };
 });
+
+function activeClass(tab: string): string[] {
+  return tab === activeTab.value ? ['font-bold!', 'text-primary'] : [];
+}
 </script>
 
 <template>
   <Tabs v-model="activeTab" :default-value="getDefaultValue">
-    <TabsList :style="tabsStyle" class="bg-accent relative grid w-full">
+    <TabsList
+      :style="tabsStyle"
+      class="bg-accent outline-heavy! relative grid w-full outline-2!"
+    >
       <TabsIndicator :style="tabsIndicatorStyle" />
       <template v-for="tab in tabs" :key="tab.value">
         <TabsTrigger
           :value="tab.value"
-          class="z-20 inline-flex items-center justify-center whitespace-nowrap rounded-md px-3 py-1 text-sm font-medium disabled:pointer-events-none disabled:opacity-50"
+          :class="activeClass(tab.value)"
+          class="hover:text-primary z-20 size-full inline-flex items-center justify-center rounded-md text-sm font-medium whitespace-nowrap disabled:pointer-events-none disabled:opacity-50"
         >
-          {{ tab.label }}
+          <VbenTooltip :delay-duration="300" side="bottom">
+            <template #trigger>
+              <div class="whitespace-nowrap overflow-hidden text-ellipsis px-1">
+                {{ tab.label }}
+              </div>
+            </template>
+            {{ tab.label }}
+          </VbenTooltip>
         </TabsTrigger>
       </template>
     </TabsList>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/components/segmented/tabs-indicator.vue b/packages/@core/ui-kit/shadcn-ui/src/components/segmented/tabs-indicator.vue
index 886eb6d2..7d4cda1a 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/components/segmented/tabs-indicator.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/components/segmented/tabs-indicator.vue
@@ -1,13 +1,13 @@
 <script setup lang="ts">
-import type { TabsIndicatorProps } from 'radix-vue';
+import type { TabsIndicatorProps } from 'reka-ui';
 
 import { computed } from 'vue';
 
 import { cn } from '@vben-core/shared/utils';
 
-import { TabsIndicator, useForwardProps } from 'radix-vue';
+import { TabsIndicator, useForwardProps } from 'reka-ui';
 
-const props = defineProps<{ class?: any } & TabsIndicatorProps>();
+const props = defineProps<TabsIndicatorProps & { class?: any }>();
 
 const delegatedProps = computed(() => {
   const { class: _, ...delegated } = props;
@@ -23,13 +23,13 @@ const forwardedProps = useForwardProps(delegatedProps);
     v-bind="forwardedProps"
     :class="
       cn(
-        'absolute bottom-0 left-0 z-10 h-full w-1/2 translate-x-[--radix-tabs-indicator-position] rounded-full px-0 py-1 pr-1 transition-[width,transform] duration-300',
+        'absolute bottom-0 left-0 z-10 size-full translate-x-(--reka-tabs-indicator-position) rounded-full py-1 transition-[width,transform] duration-300',
         props.class,
       )
     "
   >
     <div
-      class="bg-background text-foreground inline-flex h-full w-full items-center justify-center whitespace-nowrap rounded-md px-3 py-1 text-sm font-medium focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50"
+      class="bg-background text-foreground inline-flex size-full items-center justify-center rounded-md text-sm font-medium whitespace-nowrap focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-hidden disabled:pointer-events-none disabled:opacity-50"
     >
       <slot></slot>
     </div>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/components/select/select.vue b/packages/@core/ui-kit/shadcn-ui/src/components/select/select.vue
index e19836be..24b8ea2a 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/components/select/select.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/components/select/select.vue
@@ -1,4 +1,6 @@
 <script lang="ts" setup>
+import { CircleX } from '@vben-core/icons';
+
 import {
   Select,
   SelectContent,
@@ -8,17 +10,33 @@ import {
 } from '../../ui';
 
 interface Props {
+  allowClear?: boolean;
   class?: any;
   options?: Array<{ label: string; value: string }>;
   placeholder?: string;
 }
 
-const props = defineProps<Props>();
+const props = withDefaults(defineProps<Props>(), {
+  allowClear: false,
+});
+
+const modelValue = defineModel<string>();
+
+function handleClear() {
+  modelValue.value = undefined;
+}
 </script>
 <template>
-  <Select>
-    <SelectTrigger :class="props.class">
-      <SelectValue :placeholder="placeholder" />
+  <Select v-model="modelValue">
+    <SelectTrigger :class="props.class" class="flex w-full items-center">
+      <SelectValue class="flex-auto text-left" :placeholder="placeholder" />
+      <CircleX
+        @pointerdown.stop
+        @click.stop.prevent="handleClear"
+        v-if="allowClear && modelValue"
+        data-clear-button
+        class="mr-1 size-4 cursor-pointer opacity-50 hover:opacity-100"
+      />
     </SelectTrigger>
     <SelectContent>
       <template v-for="item in options" :key="item.value">
@@ -27,3 +45,13 @@ const props = defineProps<Props>();
     </SelectContent>
   </Select>
 </template>
+
+<style lang="scss" scoped>
+button[role='combobox'][data-placeholder] {
+  color: hsl(var(--muted-foreground));
+}
+
+button {
+  --ring: var(--primary);
+}
+</style>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/components/spine-text/spine-text.vue b/packages/@core/ui-kit/shadcn-ui/src/components/spine-text/spine-text.vue
index 238a9f42..dfc63d4f 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/components/spine-text/spine-text.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/components/spine-text/spine-text.vue
@@ -16,7 +16,7 @@ const style = computed(() => {
 });
 </script>
 <template>
-  <div :style="style" class="vben-spine-text !bg-clip-text text-transparent">
+  <div :style="style" class="vben-spine-text bg-clip-text! text-transparent">
     <slot></slot>
   </div>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/components/spinner/loading.vue b/packages/@core/ui-kit/shadcn-ui/src/components/spinner/loading.vue
index 756fa0fd..d9588c93 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/components/spinner/loading.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/components/spinner/loading.vue
@@ -31,20 +31,20 @@ const props = withDefaults(defineProps<Props>(), {
 });
 // const startTime = ref(0);
 const showSpinner = ref(false);
-const renderSpinner = ref(true);
-const timer = ref<ReturnType<typeof setTimeout>>();
+const renderSpinner = ref(false);
+let timer: ReturnType<typeof setTimeout> | undefined;
 
 watch(
   () => props.spinning,
   (show) => {
     if (!show) {
       showSpinner.value = false;
-      clearTimeout(timer.value);
+      timer && clearTimeout(timer);
       return;
     }
 
     // startTime.value = performance.now();
-    timer.value = setTimeout(() => {
+    timer = setTimeout(() => {
       // const loadingTime = performance.now() - startTime.value;
 
       showSpinner.value = true;
@@ -69,7 +69,7 @@ function onTransitionEnd() {
   <div
     :class="
       cn(
-        'z-100 dark:bg-overlay bg-overlay-content pointer-events-none absolute left-0 top-0 flex size-full flex-col items-center justify-center transition-all duration-500',
+        'bg-overlay-content dark:bg-overlay absolute top-0 left-0 z-100 flex size-full flex-col items-center justify-center transition-all duration-500',
         {
           'invisible opacity-0': !showSpinner,
         },
@@ -78,15 +78,18 @@ function onTransitionEnd() {
     "
     @transitionend="onTransitionEnd"
   >
-    <span class="dot relative inline-block size-9 text-3xl">
-      <i
-        v-for="index in 4"
-        :key="index"
-        class="bg-primary absolute block size-4 origin-[50%_50%] scale-75 rounded-full opacity-30"
-      ></i>
-    </span>
+    <slot name="icon" v-if="renderSpinner">
+      <span class="dot relative inline-block size-9 text-3xl">
+        <i
+          v-for="index in 4"
+          :key="index"
+          class="bg-primary absolute block size-4 origin-[50%_50%] scale-75 rounded-full opacity-30"
+        ></i>
+      </span>
+    </slot>
 
-    <div v-if="text" class="mt-4 text-xs">{{ text }}</div>
+    <div v-if="text" class="text-primary mt-4 text-xs">{{ text }}</div>
+    <slot></slot>
   </div>
 </template>
 
diff --git a/packages/@core/ui-kit/shadcn-ui/src/components/spinner/spinner.vue b/packages/@core/ui-kit/shadcn-ui/src/components/spinner/spinner.vue
index a72ed49f..2bc50353 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/components/spinner/spinner.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/components/spinner/spinner.vue
@@ -25,7 +25,7 @@ const props = withDefaults(defineProps<Props>(), {
 });
 // const startTime = ref(0);
 const showSpinner = ref(false);
-const renderSpinner = ref(true);
+const renderSpinner = ref(false);
 const timer = ref<ReturnType<typeof setTimeout>>();
 
 watch(
@@ -63,7 +63,7 @@ function onTransitionEnd() {
   <div
     :class="
       cn(
-        'flex-center z-100 bg-overlay-content absolute left-0 top-0 size-full backdrop-blur-sm transition-all duration-500',
+        'flex-center bg-overlay-content absolute top-0 left-0 z-100 size-full backdrop-blur-xs transition-all duration-500',
         {
           'invisible opacity-0': !showSpinner,
         },
@@ -73,12 +73,24 @@ function onTransitionEnd() {
     @transitionend="onTransitionEnd"
   >
     <div
-      class="loader before:bg-primary/50 after:bg-primary relative size-12 before:absolute before:left-0 before:top-[60px] before:h-[5px] before:w-12 before:rounded-[50%] before:content-[''] after:absolute after:left-0 after:top-0 after:h-full after:w-full after:rounded after:content-['']"
+      :class="{ paused: !renderSpinner }"
+      v-if="renderSpinner"
+      class="loader before:bg-primary/50 after:bg-primary relative size-12 before:absolute before:top-15 before:left-0 before:h-1.25 before:w-12 before:rounded-full before:content-[''] after:absolute after:top-0 after:left-0 after:h-full after:w-full after:rounded after:content-['']"
     ></div>
   </div>
 </template>
 
 <style scoped>
+.paused {
+  &::before {
+    animation-play-state: paused !important;
+  }
+
+  &::after {
+    animation-play-state: paused !important;
+  }
+}
+
 .loader {
   &::before {
     animation: loader-shadow-ani 0.5s linear infinite;
diff --git a/packages/@core/ui-kit/shadcn-ui/src/components/table-action/action-dropdown-item.vue b/packages/@core/ui-kit/shadcn-ui/src/components/table-action/action-dropdown-item.vue
new file mode 100644
index 00000000..b75ef333
--- /dev/null
+++ b/packages/@core/ui-kit/shadcn-ui/src/components/table-action/action-dropdown-item.vue
@@ -0,0 +1,116 @@
+<script setup lang="ts">
+import type { ActionItem } from './types';
+
+import { computed, ref } from 'vue';
+
+import { useSimpleLocale } from '@vben-core/composables';
+import { cn } from '@vben-core/shared/utils';
+
+import {
+  DropdownMenuItem,
+  Popover,
+  PopoverContent,
+  PopoverTrigger,
+} from '../../ui';
+import { VbenButton } from '../button';
+import { VbenIcon } from '../icon';
+
+const props = defineProps<{ action: ActionItem }>();
+const emit = defineEmits<{ confirm: [] }>();
+const { $t } = useSimpleLocale();
+const open = ref(false);
+
+const itemClass = computed(() =>
+  cn(
+    'cursor-pointer gap-2',
+    props.action.danger && 'text-destructive focus:text-destructive',
+  ),
+);
+
+/**
+ * 阻止 reka-ui 事件的默认行为，用于：
+ * - @select：阻止点击菜单项后自动关闭菜单，以便弹出气泡确认框；
+ * - @open-auto-focus：阻止弹层抢占焦点（避免与菜单的焦点陷阱冲突）；
+ * - @focus-outside：阻止因菜单夺回焦点而被误判为「焦点移出」从而关闭弹层。
+ */
+function preventDefault(event: Event) {
+  event.preventDefault();
+}
+
+function onClick() {
+  if (props.action.disabled) return;
+  props.action.onClick?.();
+}
+
+function onConfirm() {
+  open.value = false;
+  const pc = props.action.popConfirm;
+  if (pc?.confirm) {
+    pc.confirm();
+  } else {
+    props.action.onClick?.();
+  }
+  // 确认后关闭整个下拉菜单
+  emit('confirm');
+}
+
+function onCancel() {
+  open.value = false;
+}
+</script>
+
+<template>
+  <!--
+    气泡确认：菜单项同时作为 Popover 触发器。
+    通过双重 as-child（DropdownMenuItem + PopoverTrigger 均合并到同一个叶子元素），
+    使该元素既是菜单项又是弹层触发器；@select 阻止点击后菜单自动关闭。
+  -->
+  <Popover v-if="action.popConfirm" v-model:open="open">
+    <PopoverTrigger as-child>
+      <DropdownMenuItem
+        as-child
+        :class="itemClass"
+        :disabled="action.disabled"
+        @select="preventDefault"
+      >
+        <div>
+          <VbenIcon v-if="action.icon" :icon="action.icon" class="size-4" />
+          {{ action.text }}
+        </div>
+      </DropdownMenuItem>
+    </PopoverTrigger>
+    <PopoverContent
+      class="z-popup w-60"
+      side="left"
+      @focus-outside="preventDefault"
+      @open-auto-focus="preventDefault"
+    >
+      <div class="text-foreground mb-3 text-sm">
+        {{ action.popConfirm.title ?? $t('confirmTitle') }}
+      </div>
+      <div class="flex justify-end gap-2">
+        <VbenButton size="sm" variant="outline" @click="onCancel">
+          {{ action.popConfirm.cancelText ?? $t('cancel') }}
+        </VbenButton>
+        <VbenButton
+          :variant="action.danger ? 'destructive' : 'default'"
+          size="sm"
+          @click="onConfirm"
+        >
+          {{ action.popConfirm.okText ?? $t('confirm') }}
+        </VbenButton>
+      </div>
+    </PopoverContent>
+  </Popover>
+
+  <!-- 普通下拉项 -->
+  <DropdownMenuItem
+    v-else
+    :class="itemClass"
+    :disabled="action.disabled"
+    @click="onClick"
+  >
+    <VbenIcon v-if="action.icon" :icon="action.icon" class="size-4" />
+    {{ action.text }}
+  </DropdownMenuItem>
+</template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/components/table-action/action-item.vue b/packages/@core/ui-kit/shadcn-ui/src/components/table-action/action-item.vue
new file mode 100644
index 00000000..4d927f60
--- /dev/null
+++ b/packages/@core/ui-kit/shadcn-ui/src/components/table-action/action-item.vue
@@ -0,0 +1,97 @@
+<script setup lang="ts">
+import type { ActionItem } from './types';
+
+import { computed, ref } from 'vue';
+
+import { cn } from '@vben-core/shared/utils';
+
+import { Popover, PopoverContent, PopoverTrigger } from '../../ui';
+import { VbenButton } from '../button';
+import { VbenIcon } from '../icon';
+
+const props = defineProps<{ action: ActionItem }>();
+
+const open = ref(false);
+
+const buttonClass = computed(() =>
+  cn(
+    'gap-1',
+    props.action.danger && 'text-destructive hover:text-destructive',
+    props.action.class,
+  ),
+);
+
+const variant = computed(() => props.action.variant ?? 'link');
+const size = computed(() => props.action.size ?? 'default');
+
+function onClick() {
+  if (props.action.disabled || props.action.loading) return;
+  props.action.onClick?.();
+}
+
+function onConfirm() {
+  open.value = false;
+  const pc = props.action.popConfirm;
+  if (pc?.confirm) {
+    pc.confirm();
+  } else {
+    props.action.onClick?.();
+  }
+}
+
+function onCancel() {
+  open.value = false;
+}
+</script>
+
+<template>
+  <!-- 气泡确认 -->
+  <Popover v-if="action.popConfirm" v-model:open="open">
+    <PopoverTrigger as-child>
+      <VbenButton
+        :class="buttonClass"
+        :disabled="action.disabled"
+        :loading="action.loading"
+        :size="size"
+        class="p-2"
+        :variant="variant"
+      >
+        <VbenIcon :icon="action.icon" v-if="action.icon" class="size-4" />
+        <span v-if="action.text">{{ action.text }}</span>
+      </VbenButton>
+    </PopoverTrigger>
+    <PopoverContent class="z-popup w-60" side="top">
+      <div class="text-foreground mb-3 text-sm">
+        {{ action.popConfirm.title ?? 'Are you sure?' }}
+      </div>
+      <div class="flex justify-end gap-2">
+        <VbenButton size="default" variant="outline" @click="onCancel">
+          {{ action.popConfirm.cancelText ?? 'Cancel' }}
+        </VbenButton>
+        <VbenButton
+          :variant="action.danger ? 'destructive' : 'default'"
+          size="default"
+          class="p-2"
+          @click="onConfirm"
+        >
+          {{ action.popConfirm.okText ?? 'OK' }}
+        </VbenButton>
+      </div>
+    </PopoverContent>
+  </Popover>
+
+  <!-- 普通按钮 -->
+  <VbenButton
+    v-else
+    :class="buttonClass"
+    :disabled="action.disabled"
+    :loading="action.loading"
+    :size="size"
+    class="p-2"
+    :variant="variant"
+    @click="onClick"
+  >
+    <VbenIcon :icon="action.icon" v-if="action.icon" class="size-4" />
+    <span v-if="action.text">{{ action.text }}</span>
+  </VbenButton>
+</template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/components/table-action/index.ts b/packages/@core/ui-kit/shadcn-ui/src/components/table-action/index.ts
new file mode 100644
index 00000000..bf895029
--- /dev/null
+++ b/packages/@core/ui-kit/shadcn-ui/src/components/table-action/index.ts
@@ -0,0 +1,3 @@
+export { default as VbenTableAction } from './table-action.vue';
+
+export type * from './types';
diff --git a/packages/@core/ui-kit/shadcn-ui/src/components/table-action/table-action.vue b/packages/@core/ui-kit/shadcn-ui/src/components/table-action/table-action.vue
new file mode 100644
index 00000000..d5541eaa
--- /dev/null
+++ b/packages/@core/ui-kit/shadcn-ui/src/components/table-action/table-action.vue
@@ -0,0 +1,216 @@
+<script setup lang="ts">
+import type { ActionItem, TableActionProps } from './types';
+
+import { computed, ref } from 'vue';
+
+import { Ellipsis } from '@vben-core/icons';
+import { cn } from '@vben-core/shared/utils';
+
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuSeparator,
+  DropdownMenuTrigger,
+  Separator,
+  Tooltip,
+  TooltipContent,
+  TooltipProvider,
+  TooltipTrigger,
+} from '../../ui';
+import { VbenButton } from '../button';
+import { VbenIcon } from '../icon';
+import ActionDropdownItemComp from './action-dropdown-item.vue';
+import ActionItemComp from './action-item.vue';
+
+defineOptions({ name: 'VbenTableAction' });
+
+const props = withDefaults(defineProps<TableActionProps>(), {
+  actions: () => [],
+  align: 'end',
+  class: undefined,
+  divider: false,
+  dropdownActions: () => [],
+  hasPermission: undefined,
+  moreText: undefined,
+});
+
+function checkVisible(item: ActionItem): boolean {
+  // 权限
+  if (item.auth && props.hasPermission && !props.hasPermission(item.auth)) {
+    return false;
+  }
+  // ifShow
+  if (typeof item.ifShow === 'boolean') return item.ifShow;
+  if (typeof item.ifShow === 'function') return item.ifShow();
+  return true;
+}
+
+const visibleActions = computed(() =>
+  (props.actions ?? []).filter((item) => checkVisible(item)),
+);
+const visibleDropdownActions = computed(() =>
+  (props.dropdownActions ?? []).filter((item) => checkVisible(item)),
+);
+
+const alignClass = computed(
+  () =>
+    ({ center: 'justify-center', end: 'justify-end', start: 'justify-start' })[
+      props.align
+    ],
+);
+
+// 缓存根节点类名，避免每次渲染都执行 cn()（内部 tailwind-merge 解析开销较大）
+const wrapperClass = computed(() =>
+  cn('flex items-center gap-1', alignClass.value, props.class),
+);
+
+function tooltipSide(action: ActionItem) {
+  return typeof action.tooltip === 'object'
+    ? (action.tooltip.side ?? 'top')
+    : 'top';
+}
+function tooltipContent(action: ActionItem) {
+  return typeof action.tooltip === 'object'
+    ? action.tooltip.content
+    : action.tooltip;
+}
+
+/**
+ * 预计算每个主操作的渲染视图模型：
+ * - 普通按钮在本组件内直接渲染，不再为每个操作多包一层子组件，
+ *   表格大量行时可显著减少组件实例数；
+ * - 仅 popConfirm 操作仍交由子组件维护独立弹层状态；
+ * - 类名等在此一次性计算并缓存，避免模板每次渲染都执行 cn()。
+ */
+const renderedActions = computed(() => {
+  const list = visibleActions.value;
+  return list.map((action, index) => {
+    const hasTooltip = !!action.tooltip && !action.popConfirm;
+    return {
+      action,
+      buttonClass: cn(
+        'gap-1 p-2',
+        action.danger && 'text-destructive hover:text-destructive',
+        action.class,
+      ),
+      hasTooltip,
+      isConfirm: !!action.popConfirm,
+      key: action.key ?? index,
+      showDivider: props.divider && index < list.length - 1,
+      size: action.size ?? 'default',
+      tooltipContent: hasTooltip ? tooltipContent(action) : undefined,
+      tooltipSide: hasTooltip ? tooltipSide(action) : 'top',
+      variant: action.variant ?? 'link',
+    };
+  });
+});
+
+const dropdownOpen = ref(false);
+
+function onActionClick(action: ActionItem) {
+  if (action.disabled || action.loading) return;
+  action.onClick?.();
+}
+
+/**
+ * 当与气泡确认（Popover）交互时，避免误关闭整个下拉菜单。
+ * Popover 内容被 Portal 渲染到菜单之外，默认会被判定为「点击外部」而关闭菜单。
+ */
+function onContentInteractOutside(event: Event) {
+  const target = (event as CustomEvent).detail?.originalEvent?.target as
+    | HTMLElement
+    | null
+    | undefined;
+  if (target?.closest('[data-slot="popover-content"]')) {
+    event.preventDefault();
+  }
+}
+</script>
+
+<template>
+  <div :class="wrapperClass">
+    <!-- 所有主操作共享同一个 TooltipProvider，避免每个 tooltip 各建一个 provider -->
+    <TooltipProvider v-if="renderedActions.length > 0" :delay-duration="0">
+      <template v-for="item in renderedActions" :key="item.key">
+        <!-- 气泡确认：需独立弹层状态，交由子组件维护 -->
+        <ActionItemComp v-if="item.isConfirm" :action="item.action" />
+
+        <!-- 带提示的普通按钮 -->
+        <Tooltip v-else-if="item.hasTooltip">
+          <TooltipTrigger as-child tabindex="-1">
+            <VbenButton
+              :class="item.buttonClass"
+              :disabled="item.action.disabled"
+              :loading="item.action.loading"
+              :size="item.size"
+              :variant="item.variant"
+              @click="onActionClick(item.action)"
+            >
+              <VbenIcon
+                v-if="item.action.icon"
+                :icon="item.action.icon"
+                class="size-4"
+              />
+              <span v-if="item.action.text">{{ item.action.text }}</span>
+            </VbenButton>
+          </TooltipTrigger>
+          <TooltipContent
+            :side="item.tooltipSide"
+            class="side-content bg-accent text-popover-foreground rounded-md"
+          >
+            {{ item.tooltipContent }}
+          </TooltipContent>
+        </Tooltip>
+
+        <!-- 普通按钮 -->
+        <VbenButton
+          v-else
+          :class="item.buttonClass"
+          :disabled="item.action.disabled"
+          :loading="item.action.loading"
+          :size="item.size"
+          :variant="item.variant"
+          @click="onActionClick(item.action)"
+        >
+          <VbenIcon
+            v-if="item.action.icon"
+            :icon="item.action.icon"
+            class="size-4"
+          />
+          <span v-if="item.action.text">{{ item.action.text }}</span>
+        </VbenButton>
+
+        <Separator v-if="item.showDivider" orientation="vertical" class="h-4" />
+      </template>
+    </TooltipProvider>
+
+    <DropdownMenu
+      v-if="visibleDropdownActions.length > 0"
+      v-model:open="dropdownOpen"
+    >
+      <DropdownMenuTrigger as-child>
+        <VbenButton class="gap-1 p-2" variant="link">
+          <Ellipsis class="size-4" />
+          <span v-if="moreText">{{ moreText }}</span>
+        </VbenButton>
+      </DropdownMenuTrigger>
+      <DropdownMenuContent
+        align="end"
+        @interact-outside="onContentInteractOutside"
+      >
+        <template
+          v-for="(item, index) in visibleDropdownActions"
+          :key="item.key ?? index"
+        >
+          <ActionDropdownItemComp
+            :action="item"
+            @confirm="dropdownOpen = false"
+          />
+          <DropdownMenuSeparator
+            v-if="divider && index < visibleDropdownActions.length - 1"
+          />
+        </template>
+      </DropdownMenuContent>
+    </DropdownMenu>
+  </div>
+</template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/components/table-action/types.ts b/packages/@core/ui-kit/shadcn-ui/src/components/table-action/types.ts
new file mode 100644
index 00000000..428961c8
--- /dev/null
+++ b/packages/@core/ui-kit/shadcn-ui/src/components/table-action/types.ts
@@ -0,0 +1,75 @@
+import type { ButtonVariants } from '../../ui';
+
+import { VbenIcon } from '../icon';
+
+/** 权限码：单个或多个，配合注入的 hasPermission 判断 */
+export type TableActionAuth = string | string[];
+
+/** 操作按钮提示 */
+export interface TableActionTooltip {
+  content: string;
+  side?: 'bottom' | 'left' | 'right' | 'top';
+}
+
+/** 气泡确认框配置 */
+export interface TableActionPopConfirm {
+  /** 取消按钮文案 */
+  cancelText?: string;
+  /** 确认回调；未提供时回退到 action.onClick */
+  confirm?: () => void;
+  /** 确认按钮文案 */
+  okText?: string;
+  /** 提示标题 */
+  title?: string;
+}
+
+export interface ActionItem {
+  /** 权限码，配合注入的 hasPermission 过滤 */
+  auth?: TableActionAuth;
+  /** 自定义类名 */
+  class?: any;
+  /** 危险操作（红色文字） */
+  danger?: boolean;
+  /** 是否禁用 */
+  disabled?: boolean;
+  /** 图标组件 */
+  icon?: typeof VbenIcon.icon;
+  /** 是否显示：布尔或返回布尔的函数 */
+  ifShow?: (() => boolean) | boolean;
+  /** 唯一标识，点击回调可据此区分 */
+  key?: number | string;
+  /** 加载状态 */
+  loading?: boolean;
+  /** 点击回调 */
+  onClick?: () => void;
+  /** 气泡确认框 */
+  popConfirm?: TableActionPopConfirm;
+  /** 尺寸 */
+  size?: ButtonVariants['size'];
+  /** 文本 */
+  text?: string;
+  /** 提示：字符串或配置对象 */
+  tooltip?: string | TableActionTooltip;
+  /** 按钮样式变体 */
+  variant?: ButtonVariants['variant'];
+}
+
+export interface TableActionProps {
+  /** 主操作按钮 */
+  actions?: ActionItem[];
+  /** 对齐方式 */
+  align?: 'center' | 'end' | 'start';
+  /** 自定义类名 */
+  class?: any;
+  /** 按钮之间是否显示分割线 */
+  divider?: boolean;
+  /** “更多”下拉中的操作 */
+  dropdownActions?: ActionItem[];
+  /**
+   * 权限判断函数，返回 false 则隐藏对应 auth 的操作。
+   * 核心组件不依赖业务，由使用方注入（如 useAccess().hasAccessByCodes）。
+   */
+  hasPermission?: (auth?: TableActionAuth) => boolean;
+  /** “更多”按钮文案（提供时显示在图标右侧） */
+  moreText?: string;
+}
diff --git a/packages/@core/ui-kit/shadcn-ui/src/components/tooltip/help-tooltip.vue b/packages/@core/ui-kit/shadcn-ui/src/components/tooltip/help-tooltip.vue
index 47017472..3c82a1a1 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/components/tooltip/help-tooltip.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/components/tooltip/help-tooltip.vue
@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import { cn } from '@vben-core/shared/utils';
 
-import { CircleHelp } from 'lucide-vue-next';
+import { CircleHelp } from '@lucide/vue';
 
 import Tooltip from './tooltip.vue';
 
diff --git a/packages/@core/ui-kit/shadcn-ui/src/components/tooltip/tooltip.vue b/packages/@core/ui-kit/shadcn-ui/src/components/tooltip/tooltip.vue
index ae5f5e45..7b3d9069 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/components/tooltip/tooltip.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/components/tooltip/tooltip.vue
@@ -1,9 +1,10 @@
 <script setup lang="ts">
-import type { ClassType } from '@vben-core/typings';
-import type { TooltipContentProps } from 'radix-vue';
+import type { TooltipContentProps } from 'reka-ui';
 
 import type { StyleValue } from 'vue';
 
+import type { ClassType } from '@vben-core/typings';
+
 import {
   Tooltip,
   TooltipContent,
@@ -34,7 +35,7 @@ withDefaults(defineProps<Props>(), {
         :class="contentClass"
         :side="side"
         :style="contentStyle"
-        class="side-content text-popover-foreground bg-accent rounded-md"
+        class="side-content bg-accent text-popover-foreground rounded-md"
       >
         <slot></slot>
       </TooltipContent>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/index.ts b/packages/@core/ui-kit/shadcn-ui/src/index.ts
index 00e1b990..a7c9ee4a 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/index.ts
+++ b/packages/@core/ui-kit/shadcn-ui/src/index.ts
@@ -1,3 +1,3 @@
 export * from './components';
 export * from './ui';
-export { createContext, Slot, VisuallyHidden } from 'radix-vue';
+export { createContext, Slot, VisuallyHidden } from 'reka-ui';
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/accordion/Accordion.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/accordion/Accordion.vue
index fb8f05cc..1cc7e85b 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/accordion/Accordion.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/accordion/Accordion.vue
@@ -1,10 +1,7 @@
 <script setup lang="ts">
-import {
-  AccordionRoot,
-  type AccordionRootEmits,
-  type AccordionRootProps,
-  useForwardPropsEmits,
-} from 'radix-vue';
+import type { AccordionRootEmits, AccordionRootProps } from 'reka-ui';
+
+import { AccordionRoot, useForwardPropsEmits } from 'reka-ui';
 
 const props = defineProps<AccordionRootProps>();
 const emits = defineEmits<AccordionRootEmits>();
@@ -13,7 +10,7 @@ const forwarded = useForwardPropsEmits(props, emits);
 </script>
 
 <template>
-  <AccordionRoot v-bind="forwarded">
-    <slot></slot>
+  <AccordionRoot v-slot="slotProps" data-slot="accordion" v-bind="forwarded">
+    <slot v-bind="slotProps"></slot>
   </AccordionRoot>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/accordion/AccordionContent.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/accordion/AccordionContent.vue
index 5183a5be..08a5c6d4 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/accordion/AccordionContent.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/accordion/AccordionContent.vue
@@ -1,25 +1,27 @@
 <script setup lang="ts">
-import { computed } from 'vue';
+import type { AccordionContentProps } from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
 
 import { cn } from '@vben-core/shared/utils';
 
-import { AccordionContent, type AccordionContentProps } from 'radix-vue';
+import { reactiveOmit } from '@vueuse/core';
+import { AccordionContent } from 'reka-ui';
 
-const props = defineProps<{ class?: any } & AccordionContentProps>();
+const props = defineProps<
+  AccordionContentProps & { class?: HTMLAttributes['class'] }
+>();
 
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-
-  return delegated;
-});
+const delegatedProps = reactiveOmit(props, 'class');
 </script>
 
 <template>
   <AccordionContent
+    data-slot="accordion-content"
     v-bind="delegatedProps"
     class="data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down overflow-hidden text-sm"
   >
-    <div :class="cn('pb-4 pt-0', props.class)">
+    <div :class="cn('pt-0 pb-4', props.class)">
       <slot></slot>
     </div>
   </AccordionContent>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/accordion/AccordionItem.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/accordion/AccordionItem.vue
index 189d0c25..2d9d0871 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/accordion/AccordionItem.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/accordion/AccordionItem.vue
@@ -1,27 +1,29 @@
 <script setup lang="ts">
-import { computed } from 'vue';
+import type { AccordionItemProps } from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
 
 import { cn } from '@vben-core/shared/utils';
 
-import {
-  AccordionItem,
-  type AccordionItemProps,
-  useForwardProps,
-} from 'radix-vue';
+import { reactiveOmit } from '@vueuse/core';
+import { AccordionItem, useForwardProps } from 'reka-ui';
 
-const props = defineProps<{ class?: any } & AccordionItemProps>();
+const props = defineProps<
+  AccordionItemProps & { class?: HTMLAttributes['class'] }
+>();
 
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-
-  return delegated;
-});
+const delegatedProps = reactiveOmit(props, 'class');
 
 const forwardedProps = useForwardProps(delegatedProps);
 </script>
 
 <template>
-  <AccordionItem v-bind="forwardedProps" :class="cn('border-b', props.class)">
-    <slot></slot>
+  <AccordionItem
+    v-slot="slotProps"
+    data-slot="accordion-item"
+    v-bind="forwardedProps"
+    :class="cn('border-b last:border-b-0', props.class)"
+  >
+    <slot v-bind="slotProps"></slot>
   </AccordionItem>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/accordion/AccordionTrigger.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/accordion/AccordionTrigger.vue
index 48d65e6f..b911eff7 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/accordion/AccordionTrigger.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/accordion/AccordionTrigger.vue
@@ -1,31 +1,29 @@
 <script setup lang="ts">
-import { computed } from 'vue';
+import type { AccordionTriggerProps } from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
 
 import { cn } from '@vben-core/shared/utils';
 
-import { ChevronDown } from 'lucide-vue-next';
-import {
-  AccordionHeader,
-  AccordionTrigger,
-  type AccordionTriggerProps,
-} from 'radix-vue';
+import { ChevronDown } from '@lucide/vue';
+import { reactiveOmit } from '@vueuse/core';
+import { AccordionHeader, AccordionTrigger } from 'reka-ui';
 
-const props = defineProps<{ class?: any } & AccordionTriggerProps>();
+const props = defineProps<
+  AccordionTriggerProps & { class?: HTMLAttributes['class'] }
+>();
 
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-
-  return delegated;
-});
+const delegatedProps = reactiveOmit(props, 'class');
 </script>
 
 <template>
   <AccordionHeader class="flex">
     <AccordionTrigger
+      data-slot="accordion-trigger"
       v-bind="delegatedProps"
       :class="
         cn(
-          'flex flex-1 items-center justify-between py-4 text-sm font-medium transition-all hover:underline [&[data-state=open]>svg]:rotate-180',
+          'focus-visible:border-ring focus-visible:ring-ring/50 flex flex-1 items-start justify-between gap-4 rounded-md py-4 text-left text-sm font-medium transition-all outline-none hover:underline focus-visible:ring-3 disabled:pointer-events-none disabled:opacity-50 [&[data-state=open]>svg]:rotate-180',
           props.class,
         )
       "
@@ -33,7 +31,7 @@ const delegatedProps = computed(() => {
       <slot></slot>
       <slot name="icon">
         <ChevronDown
-          class="text-muted-foreground h-4 w-4 shrink-0 transition-transform duration-200"
+          class="text-muted-foreground pointer-events-none size-4 shrink-0 translate-y-0.5 transition-transform duration-200"
         />
       </slot>
     </AccordionTrigger>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/alert-dialog/AlertDialog.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/alert-dialog/AlertDialog.vue
new file mode 100644
index 00000000..41534952
--- /dev/null
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/alert-dialog/AlertDialog.vue
@@ -0,0 +1,20 @@
+<script setup lang="ts">
+import type { AlertDialogEmits, AlertDialogProps } from 'reka-ui';
+
+import { AlertDialogRoot, useForwardPropsEmits } from 'reka-ui';
+
+const props = defineProps<AlertDialogProps>();
+const emits = defineEmits<AlertDialogEmits>();
+
+const forwarded = useForwardPropsEmits(props, emits);
+</script>
+
+<template>
+  <AlertDialogRoot
+    v-slot="slotProps"
+    data-slot="alert-dialog"
+    v-bind="forwarded"
+  >
+    <slot v-bind="slotProps"></slot>
+  </AlertDialogRoot>
+</template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/alert-dialog/AlertDialogAction.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/alert-dialog/AlertDialogAction.vue
new file mode 100644
index 00000000..d5da3f00
--- /dev/null
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/alert-dialog/AlertDialogAction.vue
@@ -0,0 +1,13 @@
+<script setup lang="ts">
+import type { AlertDialogActionProps } from 'reka-ui';
+
+import { AlertDialogAction } from 'reka-ui';
+
+const props = defineProps<AlertDialogActionProps>();
+</script>
+
+<template>
+  <AlertDialogAction v-bind="props">
+    <slot></slot>
+  </AlertDialogAction>
+</template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/alert-dialog/AlertDialogCancel.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/alert-dialog/AlertDialogCancel.vue
new file mode 100644
index 00000000..2b6f62ac
--- /dev/null
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/alert-dialog/AlertDialogCancel.vue
@@ -0,0 +1,13 @@
+<script setup lang="ts">
+import type { AlertDialogCancelProps } from 'reka-ui';
+
+import { AlertDialogCancel } from 'reka-ui';
+
+const props = defineProps<AlertDialogCancelProps>();
+</script>
+
+<template>
+  <AlertDialogCancel v-bind="props">
+    <slot></slot>
+  </AlertDialogCancel>
+</template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/alert-dialog/AlertDialogContent.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/alert-dialog/AlertDialogContent.vue
new file mode 100644
index 00000000..c0775f40
--- /dev/null
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/alert-dialog/AlertDialogContent.vue
@@ -0,0 +1,101 @@
+<script setup lang="ts">
+import type { AlertDialogContentEmits, AlertDialogContentProps } from 'reka-ui';
+
+import type { ClassType } from '@vben-core/typings';
+
+import { ref } from 'vue';
+
+import { cn } from '@vben-core/shared/utils';
+
+import { reactiveOmit } from '@vueuse/core';
+import {
+  AlertDialogContent,
+  AlertDialogPortal,
+  useForwardPropsEmits,
+} from 'reka-ui';
+
+import AlertDialogOverlay from './AlertDialogOverlay.vue';
+
+defineOptions({
+  inheritAttrs: false,
+});
+
+const props = withDefaults(
+  defineProps<
+    AlertDialogContentProps & {
+      centered?: boolean;
+      class?: ClassType;
+      modal?: boolean;
+      open?: boolean;
+      overlayBlur?: number;
+      zIndex?: number;
+    }
+  >(),
+  { modal: true },
+);
+const emits = defineEmits<
+  AlertDialogContentEmits & { close: []; closed: []; opened: [] }
+>();
+
+// reka-ui 的 AlertDialog 在 modal=true 时会将 body 设置 pointer-events:none，
+// 弹出层（如 Select 下拉框）会因此无法点击。这里通过在上层传入 :modal="false" 来
+// 避免该问题，同时通过 AlertDialogOverlay 组件自行渲染遮罩并锁定滚动。
+// AlertDialogOverlay 通过 v-if 控制挂载/卸载，其内部的 useScrollLock 会在组件
+// 卸载时自动解锁滚动。
+
+const delegatedProps = reactiveOmit(props, 'class');
+
+const forwarded = useForwardPropsEmits(delegatedProps, emits);
+
+const contentRef = ref<InstanceType<typeof AlertDialogContent> | null>(null);
+function onAnimationEnd(event: AnimationEvent) {
+  // 只有在 contentRef 的动画结束时才触发 opened/closed 事件
+  if (event.target === contentRef.value?.$el) {
+    if (props.open) {
+      emits('opened');
+    } else {
+      emits('closed');
+    }
+  }
+}
+defineExpose({
+  getContentRef: () => contentRef.value,
+});
+</script>
+
+<template>
+  <AlertDialogPortal>
+    <Transition name="fade" appear>
+      <AlertDialogOverlay
+        v-if="open && modal"
+        :overlay-blur="overlayBlur"
+        position="fixed"
+        :z-index="zIndex"
+        @click="() => emits('close')"
+      />
+    </Transition>
+    <AlertDialogContent
+      data-slot="alert-dialog-content"
+      ref="contentRef"
+      :style="{ ...(zIndex ? { zIndex } : {}), position: 'fixed' }"
+      @animationend="onAnimationEnd"
+      v-bind="{ ...$attrs, ...forwarded }"
+      :class="
+        cn(
+          'z-popup bg-background data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 fixed left-[50%] w-full max-w-[calc(100%-2rem)] translate-x-[-50%] rounded-lg border p-6 shadow-lg duration-200 sm:max-w-lg',
+          {
+            'data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-top-[48%]':
+              !centered,
+            'data-[state=closed]:slide-out-to-top-[148%] data-[state=open]:slide-in-from-top-[98%]':
+              centered,
+            'top-[10vh]': !centered,
+            'top-1/2 -translate-y-1/2': centered,
+          },
+          props.class,
+        )
+      "
+    >
+      <slot></slot>
+    </AlertDialogContent>
+  </AlertDialogPortal>
+</template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/alert-dialog/AlertDialogDescription.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/alert-dialog/AlertDialogDescription.vue
new file mode 100644
index 00000000..25ffa56a
--- /dev/null
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/alert-dialog/AlertDialogDescription.vue
@@ -0,0 +1,28 @@
+<script setup lang="ts">
+import type { AlertDialogDescriptionProps } from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
+
+import { cn } from '@vben-core/shared/utils';
+
+import { reactiveOmit } from '@vueuse/core';
+import { AlertDialogDescription, useForwardProps } from 'reka-ui';
+
+const props = defineProps<
+  AlertDialogDescriptionProps & { class?: HTMLAttributes['class'] }
+>();
+
+const delegatedProps = reactiveOmit(props, 'class');
+
+const forwardedProps = useForwardProps(delegatedProps);
+</script>
+
+<template>
+  <AlertDialogDescription
+    data-slot="alert-dialog-description"
+    v-bind="forwardedProps"
+    :class="cn('text-muted-foreground text-sm', props.class)"
+  >
+    <slot></slot>
+  </AlertDialogDescription>
+</template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/alert-dialog/AlertDialogFooter.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/alert-dialog/AlertDialogFooter.vue
new file mode 100644
index 00000000..f6852cd7
--- /dev/null
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/alert-dialog/AlertDialogFooter.vue
@@ -0,0 +1,20 @@
+<script setup lang="ts">
+import type { HTMLAttributes } from 'vue';
+
+import { cn } from '@vben-core/shared/utils';
+
+const props = defineProps<{
+  class?: HTMLAttributes['class'];
+}>();
+</script>
+
+<template>
+  <div
+    data-slot="alert-dialog-footer"
+    :class="
+      cn('flex flex-col-reverse gap-2 sm:flex-row sm:justify-end', props.class)
+    "
+  >
+    <slot></slot>
+  </div>
+</template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/alert-dialog/AlertDialogHeader.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/alert-dialog/AlertDialogHeader.vue
new file mode 100644
index 00000000..3c3dea82
--- /dev/null
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/alert-dialog/AlertDialogHeader.vue
@@ -0,0 +1,18 @@
+<script setup lang="ts">
+import type { HTMLAttributes } from 'vue';
+
+import { cn } from '@vben-core/shared/utils';
+
+const props = defineProps<{
+  class?: HTMLAttributes['class'];
+}>();
+</script>
+
+<template>
+  <div
+    data-slot="alert-dialog-header"
+    :class="cn('flex flex-col gap-2 text-center sm:text-left', props.class)"
+  >
+    <slot></slot>
+  </div>
+</template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/alert-dialog/AlertDialogOverlay.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/alert-dialog/AlertDialogOverlay.vue
new file mode 100644
index 00000000..0c721c77
--- /dev/null
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/alert-dialog/AlertDialogOverlay.vue
@@ -0,0 +1,31 @@
+<script setup lang="ts">
+import { useScrollLock } from '@vben-core/composables';
+import { cn } from '@vben-core/shared/utils';
+
+const props = withDefaults(
+  defineProps<{
+    class?: any;
+    overlayBlur?: number;
+    position?: 'absolute' | 'fixed';
+    zIndex?: number;
+  }>(),
+  {
+    position: 'fixed',
+  },
+);
+
+// 通过 v-if 控制挂载/卸载，组件卸载时 useScrollLock 自动解锁滚动
+useScrollLock();
+</script>
+
+<template>
+  <div
+    :style="{
+      ...(zIndex ? { zIndex } : {}),
+      position,
+      backdropFilter:
+        overlayBlur && overlayBlur > 0 ? `blur(${overlayBlur}px)` : 'none',
+    }"
+    :class="cn('z-popup bg-overlay inset-0 fixed', props.class)"
+  ></div>
+</template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/alert-dialog/AlertDialogTitle.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/alert-dialog/AlertDialogTitle.vue
new file mode 100644
index 00000000..7b24f9ea
--- /dev/null
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/alert-dialog/AlertDialogTitle.vue
@@ -0,0 +1,26 @@
+<script setup lang="ts">
+import type { AlertDialogTitleProps } from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
+
+import { cn } from '@vben-core/shared/utils';
+
+import { reactiveOmit } from '@vueuse/core';
+import { AlertDialogTitle } from 'reka-ui';
+
+const props = defineProps<
+  AlertDialogTitleProps & { class?: HTMLAttributes['class'] }
+>();
+
+const delegatedProps = reactiveOmit(props, 'class');
+</script>
+
+<template>
+  <AlertDialogTitle
+    data-slot="alert-dialog-title"
+    v-bind="delegatedProps"
+    :class="cn('text-lg font-semibold', props.class)"
+  >
+    <slot></slot>
+  </AlertDialogTitle>
+</template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/alert-dialog/AlertDialogTrigger.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/alert-dialog/AlertDialogTrigger.vue
new file mode 100644
index 00000000..fd535bfd
--- /dev/null
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/alert-dialog/AlertDialogTrigger.vue
@@ -0,0 +1,13 @@
+<script setup lang="ts">
+import type { AlertDialogTriggerProps } from 'reka-ui';
+
+import { AlertDialogTrigger } from 'reka-ui';
+
+const props = defineProps<AlertDialogTriggerProps>();
+</script>
+
+<template>
+  <AlertDialogTrigger data-slot="alert-dialog-trigger" v-bind="props">
+    <slot></slot>
+  </AlertDialogTrigger>
+</template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/alert-dialog/index.ts b/packages/@core/ui-kit/shadcn-ui/src/ui/alert-dialog/index.ts
new file mode 100644
index 00000000..88770f1e
--- /dev/null
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/alert-dialog/index.ts
@@ -0,0 +1,9 @@
+export { default as AlertDialog } from './AlertDialog.vue';
+export { default as AlertDialogAction } from './AlertDialogAction.vue';
+export { default as AlertDialogCancel } from './AlertDialogCancel.vue';
+export { default as AlertDialogContent } from './AlertDialogContent.vue';
+export { default as AlertDialogDescription } from './AlertDialogDescription.vue';
+export { default as AlertDialogFooter } from './AlertDialogFooter.vue';
+export { default as AlertDialogHeader } from './AlertDialogHeader.vue';
+export { default as AlertDialogTitle } from './AlertDialogTitle.vue';
+export { default as AlertDialogTrigger } from './AlertDialogTrigger.vue';
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/avatar/Avatar.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/avatar/Avatar.vue
index d3eeb4f0..0f65c9c6 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/avatar/Avatar.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/avatar/Avatar.vue
@@ -1,25 +1,25 @@
 <script setup lang="ts">
+import type { HTMLAttributes } from 'vue';
+
 import { cn } from '@vben-core/shared/utils';
 
-import { AvatarRoot } from 'radix-vue';
+import { AvatarRoot } from 'reka-ui';
 
-import { avatarVariant, type AvatarVariants } from './avatar';
-
-const props = withDefaults(
-  defineProps<{
-    class?: any;
-    shape?: AvatarVariants['shape'];
-    size?: AvatarVariants['size'];
-  }>(),
-  {
-    shape: 'circle',
-    size: 'sm',
-  },
-);
+const props = defineProps<{
+  class?: HTMLAttributes['class'];
+}>();
 </script>
 
 <template>
-  <AvatarRoot :class="cn(avatarVariant({ size, shape }), props.class)">
+  <AvatarRoot
+    data-slot="avatar"
+    :class="
+      cn(
+        'relative flex size-8 shrink-0 overflow-hidden rounded-full',
+        props.class,
+      )
+    "
+  >
     <slot></slot>
   </AvatarRoot>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/avatar/AvatarFallback.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/avatar/AvatarFallback.vue
index fb115ed4..1ae83363 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/avatar/AvatarFallback.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/avatar/AvatarFallback.vue
@@ -1,11 +1,31 @@
 <script setup lang="ts">
-import { AvatarFallback, type AvatarFallbackProps } from 'radix-vue';
+import type { AvatarFallbackProps } from 'reka-ui';
 
-const props = defineProps<AvatarFallbackProps>();
+import type { HTMLAttributes } from 'vue';
+
+import { cn } from '@vben-core/shared/utils';
+
+import { reactiveOmit } from '@vueuse/core';
+import { AvatarFallback } from 'reka-ui';
+
+const props = defineProps<
+  AvatarFallbackProps & { class?: HTMLAttributes['class'] }
+>();
+
+const delegatedProps = reactiveOmit(props, 'class');
 </script>
 
 <template>
-  <AvatarFallback v-bind="props">
+  <AvatarFallback
+    data-slot="avatar-fallback"
+    v-bind="delegatedProps"
+    :class="
+      cn(
+        'bg-muted flex size-full items-center justify-center rounded-full',
+        props.class,
+      )
+    "
+  >
     <slot></slot>
   </AvatarFallback>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/avatar/AvatarImage.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/avatar/AvatarImage.vue
index bac84a5c..56b49b6c 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/avatar/AvatarImage.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/avatar/AvatarImage.vue
@@ -1,9 +1,17 @@
 <script setup lang="ts">
-import { AvatarImage, type AvatarImageProps } from 'radix-vue';
+import type { AvatarImageProps } from 'reka-ui';
+
+import { AvatarImage } from 'reka-ui';
 
 const props = defineProps<AvatarImageProps>();
 </script>
 
 <template>
-  <AvatarImage v-bind="props" class="h-full w-full object-cover" />
+  <AvatarImage
+    data-slot="avatar-image"
+    v-bind="props"
+    class="aspect-square size-full"
+  >
+    <slot></slot>
+  </AvatarImage>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/avatar/avatar.ts b/packages/@core/ui-kit/shadcn-ui/src/ui/avatar/avatar.ts
deleted file mode 100644
index b9964155..00000000
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/avatar/avatar.ts
+++ /dev/null
@@ -1,20 +0,0 @@
-import { cva, type VariantProps } from 'class-variance-authority';
-
-export const avatarVariant = cva(
-  'inline-flex items-center justify-center font-normal text-foreground select-none shrink-0 bg-secondary overflow-hidden',
-  {
-    variants: {
-      shape: {
-        circle: 'rounded-full',
-        square: 'rounded-md',
-      },
-      size: {
-        base: 'h-16 w-16 text-2xl',
-        lg: 'h-32 w-32 text-5xl',
-        sm: 'h-10 w-10 text-xs',
-      },
-    },
-  },
-);
-
-export type AvatarVariants = VariantProps<typeof avatarVariant>;
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/avatar/index.ts b/packages/@core/ui-kit/shadcn-ui/src/ui/avatar/index.ts
index fef6b019..16705adc 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/avatar/index.ts
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/avatar/index.ts
@@ -1,4 +1,3 @@
-export * from './avatar';
 export { default as Avatar } from './Avatar.vue';
 export { default as AvatarFallback } from './AvatarFallback.vue';
 export { default as AvatarImage } from './AvatarImage.vue';
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/badge/Badge.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/badge/Badge.vue
index 729dc9dc..47822662 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/badge/Badge.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/badge/Badge.vue
@@ -1,16 +1,33 @@
 <script setup lang="ts">
+import type { PrimitiveProps } from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
+
+import type { BadgeVariants } from '.';
+
 import { cn } from '@vben-core/shared/utils';
 
-import { type BadgeVariants, badgeVariants } from './badge';
+import { reactiveOmit } from '@vueuse/core';
+import { Primitive } from 'reka-ui';
 
-const props = defineProps<{
-  class?: any;
-  variant?: BadgeVariants['variant'];
-}>();
+import { badgeVariants } from '.';
+
+const props = defineProps<
+  PrimitiveProps & {
+    class?: HTMLAttributes['class'];
+    variant?: BadgeVariants['variant'];
+  }
+>();
+
+const delegatedProps = reactiveOmit(props, 'class');
 </script>
 
 <template>
-  <div :class="cn(badgeVariants({ variant }), props.class)">
+  <Primitive
+    data-slot="badge"
+    :class="cn(badgeVariants({ variant }), props.class)"
+    v-bind="delegatedProps"
+  >
     <slot></slot>
-  </div>
+  </Primitive>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/badge/badge.ts b/packages/@core/ui-kit/shadcn-ui/src/ui/badge/badge.ts
index dd6b2274..db437fe8 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/badge/badge.ts
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/badge/badge.ts
@@ -1,23 +1,25 @@
-import { cva, type VariantProps } from 'class-variance-authority';
+import type { VariantProps } from 'class-variance-authority';
+
+import { cva } from 'class-variance-authority';
 
 export const badgeVariants = cva(
-  'inline-flex items-center rounded-md border border-border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2',
+  'inline-flex items-center justify-center rounded-full border px-2 py-0.5 text-xs font-medium w-fit whitespace-nowrap shrink-0 [&>svg]:size-3 gap-1 [&>svg]:pointer-events-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-3 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive transition-[color,box-shadow] overflow-hidden',
   {
-    defaultVariants: {
-      variant: 'default',
-    },
     variants: {
       variant: {
         default:
-          'border-transparent bg-accent hover:bg-accent text-primary-foreground shadow',
-        destructive:
-          'border-transparent bg-destructive text-destructive-foreground shadow hover:bg-destructive-hover',
-        outline: 'text-foreground',
+          'border-transparent bg-primary text-primary-foreground [a&]:hover:bg-primary/90',
         secondary:
-          'border-transparent bg-secondary text-secondary-foreground hover:bg-secondary/80',
+          'border-transparent bg-secondary text-secondary-foreground [a&]:hover:bg-secondary/90',
+        destructive:
+          'border-transparent bg-destructive text-white [a&]:hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60',
+        outline:
+          'text-foreground [a&]:hover:bg-accent [a&]:hover:text-accent-foreground',
       },
     },
+    defaultVariants: {
+      variant: 'default',
+    },
   },
 );
-
 export type BadgeVariants = VariantProps<typeof badgeVariants>;
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/breadcrumb/Breadcrumb.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/breadcrumb/Breadcrumb.vue
index eb065de9..a018dde1 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/breadcrumb/Breadcrumb.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/breadcrumb/Breadcrumb.vue
@@ -1,11 +1,13 @@
 <script lang="ts" setup>
+import type { HTMLAttributes } from 'vue';
+
 const props = defineProps<{
-  class?: any;
+  class?: HTMLAttributes['class'];
 }>();
 </script>
 
 <template>
-  <nav :class="props.class" aria-label="breadcrumb" role="navigation">
+  <nav aria-label="breadcrumb" data-slot="breadcrumb" :class="props.class">
     <slot></slot>
   </nav>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/breadcrumb/BreadcrumbEllipsis.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/breadcrumb/BreadcrumbEllipsis.vue
index b98f99e8..3bd314ec 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/breadcrumb/BreadcrumbEllipsis.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/breadcrumb/BreadcrumbEllipsis.vue
@@ -1,21 +1,24 @@
 <script lang="ts" setup>
+import type { HTMLAttributes } from 'vue';
+
 import { cn } from '@vben-core/shared/utils';
 
-import { MoreHorizontal } from 'lucide-vue-next';
+import { MoreHorizontal } from '@lucide/vue';
 
 const props = defineProps<{
-  class?: any;
+  class?: HTMLAttributes['class'];
 }>();
 </script>
 
 <template>
   <span
-    :class="cn('flex h-9 w-9 items-center justify-center', props.class)"
-    aria-hidden="true"
+    data-slot="breadcrumb-ellipsis"
     role="presentation"
+    aria-hidden="true"
+    :class="cn('flex size-9 items-center justify-center', props.class)"
   >
     <slot>
-      <MoreHorizontal class="h-4 w-4" />
+      <MoreHorizontal class="size-4" />
     </slot>
     <span class="sr-only">More</span>
   </span>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/breadcrumb/BreadcrumbItem.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/breadcrumb/BreadcrumbItem.vue
index 0ceb3eb3..3c5157f3 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/breadcrumb/BreadcrumbItem.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/breadcrumb/BreadcrumbItem.vue
@@ -1,16 +1,17 @@
 <script lang="ts" setup>
+import type { HTMLAttributes } from 'vue';
+
 import { cn } from '@vben-core/shared/utils';
 
 const props = defineProps<{
-  class?: any;
+  class?: HTMLAttributes['class'];
 }>();
 </script>
 
 <template>
   <li
-    :class="
-      cn('hover:text-foreground inline-flex items-center gap-1.5', props.class)
-    "
+    data-slot="breadcrumb-item"
+    :class="cn('inline-flex items-center gap-1.5', props.class)"
   >
     <slot></slot>
   </li>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/breadcrumb/BreadcrumbLink.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/breadcrumb/BreadcrumbLink.vue
index c0b95c7e..24f8d909 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/breadcrumb/BreadcrumbLink.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/breadcrumb/BreadcrumbLink.vue
@@ -1,15 +1,23 @@
 <script lang="ts" setup>
+import type { PrimitiveProps } from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
+
 import { cn } from '@vben-core/shared/utils';
 
-import { Primitive, type PrimitiveProps } from 'radix-vue';
+import { Primitive } from 'reka-ui';
 
-const props = withDefaults(defineProps<{ class?: any } & PrimitiveProps>(), {
-  as: 'a',
-});
+const props = withDefaults(
+  defineProps<PrimitiveProps & { class?: HTMLAttributes['class'] }>(),
+  {
+    as: 'a',
+  },
+);
 </script>
 
 <template>
   <Primitive
+    data-slot="breadcrumb-link"
     :as="as"
     :as-child="asChild"
     :class="cn('hover:text-foreground transition-colors', props.class)"
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/breadcrumb/BreadcrumbList.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/breadcrumb/BreadcrumbList.vue
index 94600a9b..4ae58b96 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/breadcrumb/BreadcrumbList.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/breadcrumb/BreadcrumbList.vue
@@ -1,16 +1,19 @@
 <script lang="ts" setup>
+import type { HTMLAttributes } from 'vue';
+
 import { cn } from '@vben-core/shared/utils';
 
 const props = defineProps<{
-  class?: any;
+  class?: HTMLAttributes['class'];
 }>();
 </script>
 
 <template>
   <ol
+    data-slot="breadcrumb-list"
     :class="
       cn(
-        'text-muted-foreground flex flex-wrap items-center gap-1.5 break-words text-sm sm:gap-2.5',
+        'text-muted-foreground flex flex-wrap items-center gap-1.5 text-sm break-words sm:gap-2.5',
         props.class,
       )
     "
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/breadcrumb/BreadcrumbPage.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/breadcrumb/BreadcrumbPage.vue
index 948aa471..d8f53f0b 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/breadcrumb/BreadcrumbPage.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/breadcrumb/BreadcrumbPage.vue
@@ -1,17 +1,20 @@
 <script lang="ts" setup>
+import type { HTMLAttributes } from 'vue';
+
 import { cn } from '@vben-core/shared/utils';
 
 const props = defineProps<{
-  class?: any;
+  class?: HTMLAttributes['class'];
 }>();
 </script>
 
 <template>
   <span
-    :class="cn('text-foreground font-normal', props.class)"
-    aria-current="page"
-    aria-disabled="true"
+    data-slot="breadcrumb-page"
     role="link"
+    aria-disabled="true"
+    aria-current="page"
+    :class="cn('text-foreground font-normal', props.class)"
   >
     <slot></slot>
   </span>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/breadcrumb/BreadcrumbSeparator.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/breadcrumb/BreadcrumbSeparator.vue
index bf058518..e2c92a2f 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/breadcrumb/BreadcrumbSeparator.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/breadcrumb/BreadcrumbSeparator.vue
@@ -1,18 +1,21 @@
 <script lang="ts" setup>
+import type { HTMLAttributes } from 'vue';
+
 import { cn } from '@vben-core/shared/utils';
 
-import { ChevronRight } from 'lucide-vue-next';
+import { ChevronRight } from '@lucide/vue';
 
 const props = defineProps<{
-  class?: any;
+  class?: HTMLAttributes['class'];
 }>();
 </script>
 
 <template>
   <li
-    :class="cn('[&>svg]:size-3.5', props.class)"
-    aria-hidden="true"
+    data-slot="breadcrumb-separator"
     role="presentation"
+    aria-hidden="true"
+    :class="cn('[&>svg]:size-3.5', props.class)"
   >
     <slot>
       <ChevronRight />
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/button/Button.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/button/Button.vue
index 7895d010..4c8090e7 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/button/Button.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/button/Button.vue
@@ -1,26 +1,32 @@
 <script setup lang="ts">
-import type { ButtonVariants, ButtonVariantSize } from './types';
+import type { PrimitiveProps } from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
+
+import type { ButtonVariants } from './button';
 
 import { cn } from '@vben-core/shared/utils';
 
-import { Primitive, type PrimitiveProps } from 'radix-vue';
+import { Primitive } from 'reka-ui';
 
 import { buttonVariants } from './button';
 
 interface Props extends PrimitiveProps {
-  class?: any;
-  size?: ButtonVariantSize;
-  variant?: ButtonVariants;
+  class?: HTMLAttributes['class'];
+  size?: ButtonVariants['size'];
+  variant?: ButtonVariants['variant'];
 }
 
 const props = withDefaults(defineProps<Props>(), {
   as: 'button',
-  class: '',
 });
 </script>
 
 <template>
   <Primitive
+    data-slot="button"
+    :data-variant="variant"
+    :data-size="size"
     :as="as"
     :as-child="asChild"
     :class="cn(buttonVariants({ variant, size }), props.class)"
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/button/button.ts b/packages/@core/ui-kit/shadcn-ui/src/ui/button/button.ts
index d0287751..17239093 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/button/button.ts
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/button/button.ts
@@ -1,7 +1,7 @@
-import { cva } from 'class-variance-authority';
+import { cva, type VariantProps } from 'class-variance-authority';
 
 export const buttonVariants = cva(
-  'inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:cursor-not-allowed  disabled:opacity-50',
+  'inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50',
   {
     defaultVariants: {
       size: 'default',
@@ -32,3 +32,4 @@ export const buttonVariants = cva(
     },
   },
 );
+export type ButtonVariants = VariantProps<typeof buttonVariants>;
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/button/index.ts b/packages/@core/ui-kit/shadcn-ui/src/ui/button/index.ts
index 4a575f94..4b244d96 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/button/index.ts
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/button/index.ts
@@ -1,5 +1,3 @@
 export * from './button';
 
 export { default as Button } from './Button.vue';
-
-export type * from './types';
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/button/types.ts b/packages/@core/ui-kit/shadcn-ui/src/ui/button/types.ts
deleted file mode 100644
index cc5e174f..00000000
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/button/types.ts
+++ /dev/null
@@ -1,20 +0,0 @@
-export type ButtonVariantSize =
-  | 'default'
-  | 'icon'
-  | 'lg'
-  | 'sm'
-  | 'xs'
-  | null
-  | undefined;
-
-export type ButtonVariants =
-  | 'default'
-  | 'destructive'
-  | 'ghost'
-  | 'heavy'
-  | 'icon'
-  | 'link'
-  | 'outline'
-  | 'secondary'
-  | null
-  | undefined;
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/card/Card.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/card/Card.vue
index 8f396a6a..8aafcbf3 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/card/Card.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/card/Card.vue
@@ -1,16 +1,19 @@
 <script setup lang="ts">
+import type { HTMLAttributes } from 'vue';
+
 import { cn } from '@vben-core/shared/utils';
 
 const props = defineProps<{
-  class?: any;
+  class?: HTMLAttributes['class'];
 }>();
 </script>
 
 <template>
   <div
+    data-slot="card"
     :class="
       cn(
-        'bg-card text-card-foreground border-border rounded-xl border',
+        'bg-card text-card-foreground flex flex-col gap-6 rounded-xl border py-6 shadow-sm',
         props.class,
       )
     "
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/card/CardAction.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/card/CardAction.vue
new file mode 100644
index 00000000..d98e8b3d
--- /dev/null
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/card/CardAction.vue
@@ -0,0 +1,23 @@
+<script setup lang="ts">
+import type { HTMLAttributes } from 'vue';
+
+import { cn } from '@vben-core/shared/utils';
+
+const props = defineProps<{
+  class?: HTMLAttributes['class'];
+}>();
+</script>
+
+<template>
+  <div
+    data-slot="card-action"
+    :class="
+      cn(
+        'col-start-2 row-span-2 row-start-1 self-start justify-self-end',
+        props.class,
+      )
+    "
+  >
+    <slot></slot>
+  </div>
+</template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/card/CardContent.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/card/CardContent.vue
index 8e8fe506..d8699b3b 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/card/CardContent.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/card/CardContent.vue
@@ -1,13 +1,15 @@
 <script setup lang="ts">
+import type { HTMLAttributes } from 'vue';
+
 import { cn } from '@vben-core/shared/utils';
 
 const props = defineProps<{
-  class?: any;
+  class?: HTMLAttributes['class'];
 }>();
 </script>
 
 <template>
-  <div :class="cn('p-6 pt-0', props.class)">
+  <div data-slot="card-content" :class="cn('px-6', props.class)">
     <slot></slot>
   </div>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/card/CardDescription.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/card/CardDescription.vue
index 7797c367..c7583ae9 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/card/CardDescription.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/card/CardDescription.vue
@@ -1,13 +1,18 @@
 <script setup lang="ts">
+import type { HTMLAttributes } from 'vue';
+
 import { cn } from '@vben-core/shared/utils';
 
 const props = defineProps<{
-  class?: any;
+  class?: HTMLAttributes['class'];
 }>();
 </script>
 
 <template>
-  <p :class="cn('text-muted-foreground text-sm', props.class)">
+  <p
+    data-slot="card-description"
+    :class="cn('text-muted-foreground text-sm', props.class)"
+  >
     <slot></slot>
   </p>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/card/CardFooter.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/card/CardFooter.vue
index 01af357c..cff06ede 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/card/CardFooter.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/card/CardFooter.vue
@@ -1,13 +1,18 @@
 <script setup lang="ts">
+import type { HTMLAttributes } from 'vue';
+
 import { cn } from '@vben-core/shared/utils';
 
 const props = defineProps<{
-  class?: any;
+  class?: HTMLAttributes['class'];
 }>();
 </script>
 
 <template>
-  <div :class="cn('flex items-center p-6 pt-0', props.class)">
+  <div
+    data-slot="card-footer"
+    :class="cn('flex items-center px-6 [.border-t]:pt-6', props.class)"
+  >
     <slot></slot>
   </div>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/card/CardHeader.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/card/CardHeader.vue
index ced1e8b1..f3357448 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/card/CardHeader.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/card/CardHeader.vue
@@ -1,13 +1,23 @@
 <script setup lang="ts">
+import type { HTMLAttributes } from 'vue';
+
 import { cn } from '@vben-core/shared/utils';
 
 const props = defineProps<{
-  class?: any;
+  class?: HTMLAttributes['class'];
 }>();
 </script>
 
 <template>
-  <div :class="cn('flex flex-col gap-y-1.5 p-5', props.class)">
+  <div
+    data-slot="card-header"
+    :class="
+      cn(
+        '@container/card-header grid auto-rows-min grid-rows-[auto_auto] items-start gap-1.5 px-6 has-data-[slot=card-action]:grid-cols-[1fr_auto] [.border-b]:pb-6',
+        props.class,
+      )
+    "
+  >
     <slot></slot>
   </div>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/card/CardTitle.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/card/CardTitle.vue
index e357cdc4..6a4b8fa6 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/card/CardTitle.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/card/CardTitle.vue
@@ -1,13 +1,18 @@
 <script setup lang="ts">
+import type { HTMLAttributes } from 'vue';
+
 import { cn } from '@vben-core/shared/utils';
 
 const props = defineProps<{
-  class?: any;
+  class?: HTMLAttributes['class'];
 }>();
 </script>
 
 <template>
-  <h3 :class="cn('font-semibold leading-none tracking-tight', props.class)">
+  <h3
+    data-slot="card-title"
+    :class="cn('leading-none font-semibold', props.class)"
+  >
     <slot></slot>
   </h3>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/card/index.ts b/packages/@core/ui-kit/shadcn-ui/src/ui/card/index.ts
index d652969f..a71b2f6a 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/card/index.ts
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/card/index.ts
@@ -1,4 +1,5 @@
 export { default as Card } from './Card.vue';
+export { default as CardAction } from './CardAction.vue';
 export { default as CardContent } from './CardContent.vue';
 export { default as CardDescription } from './CardDescription.vue';
 export { default as CardFooter } from './CardFooter.vue';
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/checkbox/Checkbox.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/checkbox/Checkbox.vue
index a0462e6e..00d5aa52 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/checkbox/Checkbox.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/checkbox/Checkbox.vue
@@ -1,44 +1,48 @@
 <script setup lang="ts">
-import type { CheckboxRootEmits, CheckboxRootProps } from 'radix-vue';
+import type { CheckboxRootEmits, CheckboxRootProps } from 'reka-ui';
 
-import { computed } from 'vue';
+import type { HTMLAttributes } from 'vue';
 
 import { cn } from '@vben-core/shared/utils';
 
-import { Check } from 'lucide-vue-next';
-import {
-  CheckboxIndicator,
-  CheckboxRoot,
-  useForwardPropsEmits,
-} from 'radix-vue';
+import { Check, Minus } from '@lucide/vue';
+import { reactiveOmit } from '@vueuse/core';
+import { CheckboxIndicator, CheckboxRoot, useForwardPropsEmits } from 'reka-ui';
 
-const props = defineProps<{ class?: any } & CheckboxRootProps>();
+const props = defineProps<
+  CheckboxRootProps & {
+    class?: HTMLAttributes['class'];
+    indeterminate?: boolean;
+  }
+>();
 const emits = defineEmits<CheckboxRootEmits>();
 
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-
-  return delegated;
-});
+const delegatedProps = reactiveOmit(props, 'class', 'indeterminate');
 
 const forwarded = useForwardPropsEmits(delegatedProps, emits);
 </script>
 
 <template>
   <CheckboxRoot
+    v-slot="slotProps"
+    data-slot="checkbox"
     v-bind="forwarded"
     :class="
       cn(
-        'focus-visible:ring-ring data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground border-border peer h-4 w-4 shrink-0 rounded-sm border focus-visible:outline-none focus-visible:ring-1 disabled:cursor-not-allowed disabled:opacity-50',
+        'peer border-input data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground data-[state=checked]:border-primary focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive size-4 shrink-0 rounded-sm border shadow-xs transition-shadow outline-none focus-visible:ring-3 disabled:cursor-not-allowed disabled:opacity-50',
+        indeterminate && 'bg-primary text-primary-foreground border-primary',
         props.class,
       )
     "
   >
     <CheckboxIndicator
-      class="flex h-full w-full items-center justify-center text-current"
+      data-slot="checkbox-indicator"
+      class="grid place-content-center text-current transition-none"
+      :force-mount="indeterminate ? true : undefined"
     >
-      <slot>
-        <Check class="h-4 w-4" />
+      <slot v-bind="slotProps">
+        <Minus v-if="indeterminate" class="size-3.5" />
+        <Check v-else class="size-3.5" />
       </slot>
     </CheckboxIndicator>
   </CheckboxRoot>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenu.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenu.vue
index 082636a3..e43ad00b 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenu.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenu.vue
@@ -1,7 +1,7 @@
 <script setup lang="ts">
-import type { ContextMenuRootEmits, ContextMenuRootProps } from 'radix-vue';
+import type { ContextMenuRootEmits, ContextMenuRootProps } from 'reka-ui';
 
-import { ContextMenuRoot, useForwardPropsEmits } from 'radix-vue';
+import { ContextMenuRoot, useForwardPropsEmits } from 'reka-ui';
 
 const props = withDefaults(defineProps<ContextMenuRootProps>(), {
   modal: false,
@@ -12,7 +12,7 @@ const forwarded = useForwardPropsEmits(props, emits);
 </script>
 
 <template>
-  <ContextMenuRoot v-bind="forwarded">
+  <ContextMenuRoot data-slot="context-menu" v-bind="forwarded">
     <slot></slot>
   </ContextMenuRoot>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenuCheckboxItem.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenuCheckboxItem.vue
index 5a787564..b2cafcc9 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenuCheckboxItem.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenuCheckboxItem.vue
@@ -1,42 +1,49 @@
 <script setup lang="ts">
-import { computed } from 'vue';
+import type {
+  ContextMenuCheckboxItemEmits,
+  ContextMenuCheckboxItemProps,
+} from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
 
 import { cn } from '@vben-core/shared/utils';
 
-import { Check } from 'lucide-vue-next';
+import { Check } from '@lucide/vue';
+import { reactiveOmit } from '@vueuse/core';
 import {
   ContextMenuCheckboxItem,
-  type ContextMenuCheckboxItemEmits,
-  type ContextMenuCheckboxItemProps,
   ContextMenuItemIndicator,
   useForwardPropsEmits,
-} from 'radix-vue';
+} from 'reka-ui';
 
-const props = defineProps<{ class?: any } & ContextMenuCheckboxItemProps>();
+const props = defineProps<
+  ContextMenuCheckboxItemProps & { class?: HTMLAttributes['class'] }
+>();
 const emits = defineEmits<ContextMenuCheckboxItemEmits>();
 
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-
-  return delegated;
-});
+const delegatedProps = reactiveOmit(props, 'class');
 
 const forwarded = useForwardPropsEmits(delegatedProps, emits);
 </script>
 
 <template>
   <ContextMenuCheckboxItem
+    data-slot="context-menu-checkbox-item"
     v-bind="forwarded"
     :class="
       cn(
-        'focus:bg-accent focus:text-accent-foreground relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50',
+        'focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=\'size-\'])]:size-4',
         props.class,
       )
     "
   >
-    <span class="absolute left-2 flex h-3.5 w-3.5 items-center justify-center">
+    <span
+      class="pointer-events-none absolute left-2 flex size-3.5 items-center justify-center"
+    >
       <ContextMenuItemIndicator>
-        <Check class="h-4 w-4" />
+        <slot name="indicator-icon">
+          <Check class="size-4" />
+        </slot>
       </ContextMenuItemIndicator>
     </span>
     <slot></slot>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenuContent.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenuContent.vue
index 87796a11..5c15b59a 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenuContent.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenuContent.vue
@@ -1,24 +1,27 @@
 <script setup lang="ts">
-import { computed } from 'vue';
+import type { ContextMenuContentEmits, ContextMenuContentProps } from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
 
 import { cn } from '@vben-core/shared/utils';
 
+import { reactiveOmit } from '@vueuse/core';
 import {
   ContextMenuContent,
-  type ContextMenuContentEmits,
-  type ContextMenuContentProps,
   ContextMenuPortal,
   useForwardPropsEmits,
-} from 'radix-vue';
+} from 'reka-ui';
 
-const props = defineProps<{ class?: any } & ContextMenuContentProps>();
+defineOptions({
+  inheritAttrs: false,
+});
+
+const props = defineProps<
+  ContextMenuContentProps & { class?: HTMLAttributes['class'] }
+>();
 const emits = defineEmits<ContextMenuContentEmits>();
 
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-
-  return delegated;
-});
+const delegatedProps = reactiveOmit(props, 'class');
 
 const forwarded = useForwardPropsEmits(delegatedProps, emits);
 </script>
@@ -26,10 +29,11 @@ const forwarded = useForwardPropsEmits(delegatedProps, emits);
 <template>
   <ContextMenuPortal>
     <ContextMenuContent
-      v-bind="forwarded"
+      data-slot="context-menu-content"
+      v-bind="{ ...$attrs, ...forwarded }"
       :class="
         cn(
-          'bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 border-border z-[1000] min-w-32 overflow-hidden rounded-md border p-1 shadow-md',
+          'z-popup bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 max-h-(--reka-context-menu-content-available-height) min-w-[8rem] overflow-x-hidden overflow-y-auto rounded-md border p-1 shadow-md',
           props.class,
         )
       "
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenuGroup.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenuGroup.vue
index d1d58042..e21d7ae3 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenuGroup.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenuGroup.vue
@@ -1,11 +1,13 @@
 <script setup lang="ts">
-import { ContextMenuGroup, type ContextMenuGroupProps } from 'radix-vue';
+import type { ContextMenuGroupProps } from 'reka-ui';
+
+import { ContextMenuGroup } from 'reka-ui';
 
 const props = defineProps<ContextMenuGroupProps>();
 </script>
 
 <template>
-  <ContextMenuGroup v-bind="props">
+  <ContextMenuGroup data-slot="context-menu-group" v-bind="props">
     <slot></slot>
   </ContextMenuGroup>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenuItem.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenuItem.vue
index ed11878d..d6f10c58 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenuItem.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenuItem.vue
@@ -1,36 +1,41 @@
 <script setup lang="ts">
-import { computed } from 'vue';
+import type { ContextMenuItemEmits, ContextMenuItemProps } from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
 
 import { cn } from '@vben-core/shared/utils';
 
-import {
-  ContextMenuItem,
-  type ContextMenuItemEmits,
-  type ContextMenuItemProps,
-  useForwardPropsEmits,
-} from 'radix-vue';
+import { reactiveOmit } from '@vueuse/core';
+import { ContextMenuItem, useForwardPropsEmits } from 'reka-ui';
 
-const props = defineProps<
-  { class?: any; inset?: boolean } & ContextMenuItemProps
->();
+const props = withDefaults(
+  defineProps<
+    ContextMenuItemProps & {
+      class?: HTMLAttributes['class'];
+      inset?: boolean;
+      variant?: 'default' | 'destructive';
+    }
+  >(),
+  {
+    variant: 'default',
+  },
+);
 const emits = defineEmits<ContextMenuItemEmits>();
 
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-
-  return delegated;
-});
+const delegatedProps = reactiveOmit(props, 'class');
 
 const forwarded = useForwardPropsEmits(delegatedProps, emits);
 </script>
 
 <template>
   <ContextMenuItem
+    data-slot="context-menu-item"
+    :data-inset="inset ? '' : undefined"
+    :data-variant="variant"
     v-bind="forwarded"
     :class="
       cn(
-        'focus:bg-accent focus:text-accent-foreground relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50',
-        inset && 'pl-8',
+        'focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive-foreground data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/40 data-[variant=destructive]:focus:text-destructive-foreground data-[variant=destructive]:*:[svg]:!text-destructive-foreground [&_svg:not([class*=\'text-\'])]:text-muted-foreground relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=\'size-\'])]:size-4',
         props.class,
       )
     "
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenuLabel.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenuLabel.vue
index eff8fe4c..af08207c 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenuLabel.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenuLabel.vue
@@ -1,28 +1,28 @@
 <script setup lang="ts">
-import { computed } from 'vue';
+import type { ContextMenuLabelProps } from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
 
 import { cn } from '@vben-core/shared/utils';
 
-import { ContextMenuLabel, type ContextMenuLabelProps } from 'radix-vue';
+import { reactiveOmit } from '@vueuse/core';
+import { ContextMenuLabel } from 'reka-ui';
 
 const props = defineProps<
-  { class?: any; inset?: boolean } & ContextMenuLabelProps
+  ContextMenuLabelProps & { class?: HTMLAttributes['class']; inset?: boolean }
 >();
 
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-
-  return delegated;
-});
+const delegatedProps = reactiveOmit(props, 'class');
 </script>
 
 <template>
   <ContextMenuLabel
+    data-slot="context-menu-label"
+    :data-inset="inset ? '' : undefined"
     v-bind="delegatedProps"
     :class="
       cn(
-        'text-foreground px-2 py-1.5 text-sm font-semibold',
-        inset && 'pl-8',
+        'text-foreground px-2 py-1.5 text-sm font-medium data-[inset]:pl-8',
         props.class,
       )
     "
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenuPortal.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenuPortal.vue
index bcd95ed0..80736872 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenuPortal.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenuPortal.vue
@@ -1,11 +1,13 @@
 <script setup lang="ts">
-import { ContextMenuPortal, type ContextMenuPortalProps } from 'radix-vue';
+import type { ContextMenuPortalProps } from 'reka-ui';
+
+import { ContextMenuPortal } from 'reka-ui';
 
 const props = defineProps<ContextMenuPortalProps>();
 </script>
 
 <template>
-  <ContextMenuPortal v-bind="props">
+  <ContextMenuPortal data-slot="context-menu-portal" v-bind="props">
     <slot></slot>
   </ContextMenuPortal>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenuRadioGroup.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenuRadioGroup.vue
index bfed356d..e338694f 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenuRadioGroup.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenuRadioGroup.vue
@@ -1,10 +1,10 @@
 <script setup lang="ts">
-import {
-  ContextMenuRadioGroup,
-  type ContextMenuRadioGroupEmits,
-  type ContextMenuRadioGroupProps,
-  useForwardPropsEmits,
-} from 'radix-vue';
+import type {
+  ContextMenuRadioGroupEmits,
+  ContextMenuRadioGroupProps,
+} from 'reka-ui';
+
+import { ContextMenuRadioGroup, useForwardPropsEmits } from 'reka-ui';
 
 const props = defineProps<ContextMenuRadioGroupProps>();
 const emits = defineEmits<ContextMenuRadioGroupEmits>();
@@ -13,7 +13,10 @@ const forwarded = useForwardPropsEmits(props, emits);
 </script>
 
 <template>
-  <ContextMenuRadioGroup v-bind="forwarded">
+  <ContextMenuRadioGroup
+    data-slot="context-menu-radio-group"
+    v-bind="forwarded"
+  >
     <slot></slot>
   </ContextMenuRadioGroup>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenuRadioItem.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenuRadioItem.vue
index 05d7a492..8e5577e8 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenuRadioItem.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenuRadioItem.vue
@@ -1,42 +1,49 @@
 <script setup lang="ts">
-import { computed } from 'vue';
+import type {
+  ContextMenuRadioItemEmits,
+  ContextMenuRadioItemProps,
+} from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
 
 import { cn } from '@vben-core/shared/utils';
 
-import { Circle } from 'lucide-vue-next';
+import { Circle } from '@lucide/vue';
+import { reactiveOmit } from '@vueuse/core';
 import {
   ContextMenuItemIndicator,
   ContextMenuRadioItem,
-  type ContextMenuRadioItemEmits,
-  type ContextMenuRadioItemProps,
   useForwardPropsEmits,
-} from 'radix-vue';
+} from 'reka-ui';
 
-const props = defineProps<{ class?: any } & ContextMenuRadioItemProps>();
+const props = defineProps<
+  ContextMenuRadioItemProps & { class?: HTMLAttributes['class'] }
+>();
 const emits = defineEmits<ContextMenuRadioItemEmits>();
 
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-
-  return delegated;
-});
+const delegatedProps = reactiveOmit(props, 'class');
 
 const forwarded = useForwardPropsEmits(delegatedProps, emits);
 </script>
 
 <template>
   <ContextMenuRadioItem
+    data-slot="context-menu-radio-item"
     v-bind="forwarded"
     :class="
       cn(
-        'focus:bg-accent focus:text-accent-foreground relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50',
+        'focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=\'size-\'])]:size-4',
         props.class,
       )
     "
   >
-    <span class="absolute left-2 flex h-3.5 w-3.5 items-center justify-center">
+    <span
+      class="pointer-events-none absolute left-2 flex size-3.5 items-center justify-center"
+    >
       <ContextMenuItemIndicator>
-        <Circle class="h-2 w-2 fill-current" />
+        <slot name="indicator-icon">
+          <Circle class="size-2 fill-current" />
+        </slot>
       </ContextMenuItemIndicator>
     </span>
     <slot></slot>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenuSeparator.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenuSeparator.vue
index 56231e00..06be942f 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenuSeparator.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenuSeparator.vue
@@ -1,24 +1,23 @@
 <script setup lang="ts">
-import { computed } from 'vue';
+import type { ContextMenuSeparatorProps } from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
 
 import { cn } from '@vben-core/shared/utils';
 
-import {
-  ContextMenuSeparator,
-  type ContextMenuSeparatorProps,
-} from 'radix-vue';
+import { reactiveOmit } from '@vueuse/core';
+import { ContextMenuSeparator } from 'reka-ui';
 
-const props = defineProps<{ class?: any } & ContextMenuSeparatorProps>();
+const props = defineProps<
+  ContextMenuSeparatorProps & { class?: HTMLAttributes['class'] }
+>();
 
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-
-  return delegated;
-});
+const delegatedProps = reactiveOmit(props, 'class');
 </script>
 
 <template>
   <ContextMenuSeparator
+    data-slot="context-menu-separator"
     v-bind="delegatedProps"
     :class="cn('bg-border -mx-1 my-1 h-px', props.class)"
   />
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenuShortcut.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenuShortcut.vue
index 21d0f9b2..8b736ebe 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenuShortcut.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenuShortcut.vue
@@ -1,13 +1,16 @@
 <script setup lang="ts">
+import type { HTMLAttributes } from 'vue';
+
 import { cn } from '@vben-core/shared/utils';
 
 const props = defineProps<{
-  class?: any;
+  class?: HTMLAttributes['class'];
 }>();
 </script>
 
 <template>
   <span
+    data-slot="context-menu-shortcut"
     :class="
       cn('text-muted-foreground ml-auto text-xs tracking-widest', props.class)
     "
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenuSub.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenuSub.vue
index a3747fe5..f61500ef 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenuSub.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenuSub.vue
@@ -1,10 +1,7 @@
 <script setup lang="ts">
-import {
-  ContextMenuSub,
-  type ContextMenuSubEmits,
-  type ContextMenuSubProps,
-  useForwardPropsEmits,
-} from 'radix-vue';
+import type { ContextMenuSubEmits, ContextMenuSubProps } from 'reka-ui';
+
+import { ContextMenuSub, useForwardPropsEmits } from 'reka-ui';
 
 const props = defineProps<ContextMenuSubProps>();
 const emits = defineEmits<ContextMenuSubEmits>();
@@ -13,7 +10,7 @@ const forwarded = useForwardPropsEmits(props, emits);
 </script>
 
 <template>
-  <ContextMenuSub v-bind="forwarded">
+  <ContextMenuSub data-slot="context-menu-sub" v-bind="forwarded">
     <slot></slot>
   </ContextMenuSub>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenuSubContent.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenuSubContent.vue
index 7e781286..fe476484 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenuSubContent.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenuSubContent.vue
@@ -1,33 +1,33 @@
 <script setup lang="ts">
-import { computed } from 'vue';
+import type {
+  DropdownMenuSubContentEmits,
+  DropdownMenuSubContentProps,
+} from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
 
 import { cn } from '@vben-core/shared/utils';
 
-import {
-  ContextMenuSubContent,
-  type DropdownMenuSubContentEmits,
-  type DropdownMenuSubContentProps,
-  useForwardPropsEmits,
-} from 'radix-vue';
+import { reactiveOmit } from '@vueuse/core';
+import { ContextMenuSubContent, useForwardPropsEmits } from 'reka-ui';
 
-const props = defineProps<{ class?: any } & DropdownMenuSubContentProps>();
+const props = defineProps<
+  DropdownMenuSubContentProps & { class?: HTMLAttributes['class'] }
+>();
 const emits = defineEmits<DropdownMenuSubContentEmits>();
 
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-
-  return delegated;
-});
+const delegatedProps = reactiveOmit(props, 'class');
 
 const forwarded = useForwardPropsEmits(delegatedProps, emits);
 </script>
 
 <template>
   <ContextMenuSubContent
+    data-slot="context-menu-sub-content"
     v-bind="forwarded"
     :class="
       cn(
-        'bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 border-border z-50 min-w-32 overflow-hidden rounded-md border p-1 shadow-lg',
+        'bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 min-w-[8rem] origin-(--reka-context-menu-content-transform-origin) overflow-hidden rounded-md border p-1 shadow-lg',
         props.class,
       )
     "
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenuSubTrigger.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenuSubTrigger.vue
index fbf6fe1d..8e1fa381 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenuSubTrigger.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenuSubTrigger.vue
@@ -1,43 +1,39 @@
 <script setup lang="ts">
-import { computed } from 'vue';
+import type { ContextMenuSubTriggerProps } from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
 
 import { cn } from '@vben-core/shared/utils';
 
-import { ChevronRight } from 'lucide-vue-next';
-import {
-  ContextMenuSubTrigger,
-  type ContextMenuSubTriggerProps,
-  useForwardProps,
-} from 'radix-vue';
+import { ChevronRight } from '@lucide/vue';
+import { reactiveOmit } from '@vueuse/core';
+import { ContextMenuSubTrigger, useForwardProps } from 'reka-ui';
 
 const props = defineProps<
-  {
-    class?: any;
+  ContextMenuSubTriggerProps & {
+    class?: HTMLAttributes['class'];
     inset?: boolean;
-  } & ContextMenuSubTriggerProps
+  }
 >();
 
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-
-  return delegated;
-});
+const delegatedProps = reactiveOmit(props, 'class');
 
 const forwardedProps = useForwardProps(delegatedProps);
 </script>
 
 <template>
   <ContextMenuSubTrigger
+    data-slot="context-menu-sub-trigger"
+    :data-inset="inset ? '' : undefined"
     v-bind="forwardedProps"
     :class="
       cn(
-        'focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none',
-        inset && 'pl-8',
+        'focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground flex cursor-default items-center rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=\'size-\'])]:size-4',
         props.class,
       )
     "
   >
     <slot></slot>
-    <ChevronRight class="ml-auto h-4 w-4" />
+    <ChevronRight class="ml-auto size-4" />
   </ContextMenuSubTrigger>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenuTrigger.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenuTrigger.vue
index 41446d02..eee5052d 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenuTrigger.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/context-menu/ContextMenuTrigger.vue
@@ -1,9 +1,7 @@
 <script setup lang="ts">
-import {
-  ContextMenuTrigger,
-  type ContextMenuTriggerProps,
-  useForwardProps,
-} from 'radix-vue';
+import type { ContextMenuTriggerProps } from 'reka-ui';
+
+import { ContextMenuTrigger, useForwardProps } from 'reka-ui';
 
 const props = defineProps<ContextMenuTriggerProps>();
 
@@ -11,7 +9,7 @@ const forwardedProps = useForwardProps(props);
 </script>
 
 <template>
-  <ContextMenuTrigger v-bind="forwardedProps">
+  <ContextMenuTrigger data-slot="context-menu-trigger" v-bind="forwardedProps">
     <slot></slot>
   </ContextMenuTrigger>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/dialog/Dialog.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/dialog/Dialog.vue
index 36e4227c..fe497d2b 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/dialog/Dialog.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/dialog/Dialog.vue
@@ -1,10 +1,7 @@
 <script setup lang="ts">
-import {
-  DialogRoot,
-  type DialogRootEmits,
-  type DialogRootProps,
-  useForwardPropsEmits,
-} from 'radix-vue';
+import type { DialogRootEmits, DialogRootProps } from 'reka-ui';
+
+import { DialogRoot, useForwardPropsEmits } from 'reka-ui';
 
 const props = defineProps<DialogRootProps>();
 const emits = defineEmits<DialogRootEmits>();
@@ -13,7 +10,7 @@ const forwarded = useForwardPropsEmits(props, emits);
 </script>
 
 <template>
-  <DialogRoot v-bind="forwarded">
-    <slot></slot>
+  <DialogRoot v-slot="slotProps" data-slot="dialog" v-bind="forwarded">
+    <slot v-bind="slotProps"></slot>
   </DialogRoot>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/dialog/DialogClose.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/dialog/DialogClose.vue
index b168349c..52481720 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/dialog/DialogClose.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/dialog/DialogClose.vue
@@ -1,11 +1,13 @@
 <script setup lang="ts">
-import { DialogClose, type DialogCloseProps } from 'radix-vue';
+import type { DialogCloseProps } from 'reka-ui';
+
+import { DialogClose } from 'reka-ui';
 
 const props = defineProps<DialogCloseProps>();
 </script>
 
 <template>
-  <DialogClose v-bind="props">
+  <DialogClose data-slot="dialog-close" v-bind="props">
     <slot></slot>
   </DialogClose>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/dialog/DialogContent.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/dialog/DialogContent.vue
index 9a8d7396..fbfa93c7 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/dialog/DialogContent.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/dialog/DialogContent.vue
@@ -1,38 +1,52 @@
 <script setup lang="ts">
+import type { DialogContentEmits, DialogContentProps } from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
+
 import type { ClassType } from '@vben-core/typings';
 
 import { computed, ref } from 'vue';
 
 import { cn } from '@vben-core/shared/utils';
 
-import { X } from 'lucide-vue-next';
+import { X } from '@lucide/vue';
 import {
   DialogClose,
   DialogContent,
-  type DialogContentEmits,
-  type DialogContentProps,
   DialogPortal,
   useForwardPropsEmits,
-} from 'radix-vue';
+} from 'reka-ui';
 
 import DialogOverlay from './DialogOverlay.vue';
 
+defineOptions({
+  inheritAttrs: false,
+});
+
 const props = withDefaults(
   defineProps<
-    {
+    DialogContentProps & {
+      animationType?: 'scale' | 'slide';
       appendTo?: HTMLElement | string;
-      class?: ClassType;
+      class?: HTMLAttributes['class'];
       closeClass?: ClassType;
+      closeDisabled?: boolean;
       modal?: boolean;
       open?: boolean;
-      showClose?: boolean;
+      overlayBlur?: number;
+      showCloseButton?: boolean;
       zIndex?: number;
-    } & DialogContentProps
+    }
   >(),
-  { appendTo: 'body', showClose: true, zIndex: 1000 },
+  {
+    appendTo: 'body',
+    animationType: 'slide',
+    closeDisabled: false,
+    showCloseButton: true,
+  },
 );
 const emits = defineEmits<
-  { close: []; closed: []; opened: [] } & DialogContentEmits
+  DialogContentEmits & { close: []; closed: []; opened: [] }
 >();
 
 const delegatedProps = computed(() => {
@@ -40,7 +54,8 @@ const delegatedProps = computed(() => {
     class: _,
     modal: _modal,
     open: _open,
-    showClose: __,
+    showCloseButton: __,
+    animationType: ___,
     ...delegated
   } = props;
 
@@ -59,6 +74,10 @@ const position = computed(() => {
   return isAppendToBody() ? 'fixed' : 'absolute';
 });
 
+// reka-ui 的 Dialog 在 modal=false 时不会渲染遮罩，这里通过 DialogOverlay 组件自行渲染遮罩层并锁定滚动。
+// DialogOverlay 组件通过 v-if 控制挂载/卸载，其内部的 useScrollLock 会在组件卸载时自动解锁滚动，
+// 避免 modal=true 时 body 被设置 pointer-events:none 导致弹出层（如 Select 下拉框）无法点击的问题。
+
 const forwarded = useForwardPropsEmits(delegatedProps, emits);
 
 const contentRef = ref<InstanceType<typeof DialogContent> | null>(null);
@@ -82,18 +101,25 @@ defineExpose({
     <Transition name="fade">
       <DialogOverlay
         v-if="open && modal"
-        :style="{ zIndex, position }"
+        :overlay-blur="overlayBlur"
+        :position="position"
+        :z-index="zIndex"
         @click="() => emits('close')"
       />
     </Transition>
     <DialogContent
       ref="contentRef"
-      :style="{ zIndex, position }"
+      :style="{ ...(zIndex ? { zIndex } : {}), position }"
+      data-slot="dialog-content"
       @animationend="onAnimationEnd"
       v-bind="forwarded"
       :class="
         cn(
-          'bg-background data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-top-[48%] w-full p-6 shadow-lg outline-none sm:rounded-xl',
+          'z-popup bg-background data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 w-full p-6 shadow-lg outline-hidden sm:rounded-xl',
+          {
+            'data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-top-[48%]':
+              animationType === 'slide',
+          },
           props.class,
         )
       "
@@ -101,16 +127,18 @@ defineExpose({
       <slot></slot>
 
       <DialogClose
-        v-if="showClose"
+        v-if="showCloseButton"
+        :disabled="closeDisabled"
+        data-slot="dialog-close"
         :class="
           cn(
-            'data-[state=open]:bg-accent data-[state=open]:text-muted-foreground hover:bg-accent hover:text-accent-foreground text-foreground/80 flex-center absolute right-3 top-3 h-6 w-6 rounded-full px-1 text-lg opacity-70 transition-opacity hover:opacity-100 focus:outline-none disabled:pointer-events-none',
+            'flex-center text-foreground/80 hover:bg-accent hover:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-muted-foreground absolute top-3 right-3 h-6 w-6 rounded-full px-1 text-lg opacity-70 transition-opacity hover:opacity-100 focus:outline-hidden disabled:pointer-events-none',
             props.closeClass,
           )
         "
         @click="() => emits('close')"
       >
-        <X class="h-4 w-4" />
+        <X class="size-4" />
       </DialogClose>
     </DialogContent>
   </DialogPortal>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/dialog/DialogDescription.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/dialog/DialogDescription.vue
index 5ca8694e..34641790 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/dialog/DialogDescription.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/dialog/DialogDescription.vue
@@ -1,27 +1,25 @@
 <script setup lang="ts">
-import { computed } from 'vue';
+import type { DialogDescriptionProps } from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
 
 import { cn } from '@vben-core/shared/utils';
 
-import {
-  DialogDescription,
-  type DialogDescriptionProps,
-  useForwardProps,
-} from 'radix-vue';
+import { reactiveOmit } from '@vueuse/core';
+import { DialogDescription, useForwardProps } from 'reka-ui';
 
-const props = defineProps<{ class?: any } & DialogDescriptionProps>();
+const props = defineProps<
+  DialogDescriptionProps & { class?: HTMLAttributes['class'] }
+>();
 
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-
-  return delegated;
-});
+const delegatedProps = reactiveOmit(props, 'class');
 
 const forwardedProps = useForwardProps(delegatedProps);
 </script>
 
 <template>
   <DialogDescription
+    data-slot="dialog-description"
     v-bind="forwardedProps"
     :class="cn('text-muted-foreground text-sm', props.class)"
   >
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/dialog/DialogFooter.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/dialog/DialogFooter.vue
index 09460b90..38ccfc9d 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/dialog/DialogFooter.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/dialog/DialogFooter.vue
@@ -1,15 +1,33 @@
 <script setup lang="ts">
+import type { HTMLAttributes } from 'vue';
+
 import { cn } from '@vben-core/shared/utils';
 
-const props = defineProps<{ class?: any }>();
+import { DialogClose } from 'reka-ui';
+
+import { Button } from '../button';
+
+const props = withDefaults(
+  defineProps<{
+    class?: HTMLAttributes['class'];
+    showCloseButton?: boolean;
+  }>(),
+  {
+    showCloseButton: false,
+  },
+);
 </script>
 
 <template>
   <div
+    data-slot="dialog-footer"
     :class="
-      cn('flex flex-row flex-col-reverse justify-end gap-x-2', props.class)
+      cn('flex flex-col-reverse gap-2 sm:flex-row sm:justify-end', props.class)
     "
   >
     <slot></slot>
+    <DialogClose v-if="showCloseButton" as-child>
+      <Button variant="outline"> Close </Button>
+    </DialogClose>
   </div>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/dialog/DialogHeader.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/dialog/DialogHeader.vue
index 3632b2ad..0f24e6e9 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/dialog/DialogHeader.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/dialog/DialogHeader.vue
@@ -1,14 +1,17 @@
 <script setup lang="ts">
+import type { HTMLAttributes } from 'vue';
+
 import { cn } from '@vben-core/shared/utils';
 
 const props = defineProps<{
-  class?: any;
+  class?: HTMLAttributes['class'];
 }>();
 </script>
 
 <template>
   <div
-    :class="cn('flex flex-col gap-y-1.5 text-center sm:text-left', props.class)"
+    data-slot="dialog-header"
+    :class="cn('flex flex-col gap-2 text-center sm:text-left', props.class)"
   >
     <slot></slot>
   </div>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/dialog/DialogOverlay.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/dialog/DialogOverlay.vue
index f2142ac6..ac353ac0 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/dialog/DialogOverlay.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/dialog/DialogOverlay.vue
@@ -2,10 +2,33 @@
 import { inject } from 'vue';
 
 import { useScrollLock } from '@vben-core/composables';
+import { cn } from '@vben-core/shared/utils';
+
+const props = withDefaults(
+  defineProps<{
+    class?: any;
+    overlayBlur?: number;
+    position?: 'absolute' | 'fixed';
+    zIndex?: number;
+  }>(),
+  {
+    position: 'fixed',
+  },
+);
 
 useScrollLock();
-const id = inject('DISMISSABLE_MODAL_ID');
+const dismissableModalId = inject('DISMISSABLE_MODAL_ID', undefined);
 </script>
+
 <template>
-  <div :data-dismissable-modal="id" class="bg-overlay inset-0"></div>
+  <div
+    :data-dismissable-modal="dismissableModalId"
+    :style="{
+      ...(zIndex ? { zIndex } : {}),
+      position,
+      backdropFilter:
+        overlayBlur && overlayBlur > 0 ? `blur(${overlayBlur}px)` : 'none',
+    }"
+    :class="cn('z-popup bg-overlay inset-0 fixed', props.class)"
+  ></div>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/dialog/DialogScrollContent.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/dialog/DialogScrollContent.vue
index 99ab7b11..c480c758 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/dialog/DialogScrollContent.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/dialog/DialogScrollContent.vue
@@ -1,30 +1,29 @@
 <script setup lang="ts">
-import { computed } from 'vue';
+import type { DialogContentEmits, DialogContentProps } from 'reka-ui';
 
 import { cn } from '@vben-core/shared/utils';
 
-import { X } from 'lucide-vue-next';
+import { X } from '@lucide/vue';
+import { reactiveOmit } from '@vueuse/core';
 import {
   DialogClose,
   DialogContent,
-  type DialogContentEmits,
-  type DialogContentProps,
   DialogOverlay,
   DialogPortal,
   useForwardPropsEmits,
-} from 'radix-vue';
+} from 'reka-ui';
+
+defineOptions({
+  inheritAttrs: false,
+});
 
 const props = withDefaults(
-  defineProps<{ class?: any; zIndex?: number } & DialogContentProps>(),
+  defineProps<DialogContentProps & { class?: any; zIndex?: number }>(),
   { zIndex: 1000 },
 );
 const emits = defineEmits<DialogContentEmits>();
 
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-
-  return delegated;
-});
+const delegatedProps = reactiveOmit(props, 'class');
 
 const forwarded = useForwardPropsEmits(delegatedProps, emits);
 </script>
@@ -33,17 +32,16 @@ const forwarded = useForwardPropsEmits(delegatedProps, emits);
   <DialogPortal>
     <DialogOverlay
       :style="{ zIndex }"
-      class="data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 border-border absolute inset-0 grid place-items-center overflow-y-auto border bg-black/80"
+      class="fixed inset-0 grid place-items-center overflow-y-auto bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0"
     >
       <DialogContent
         :class="
           cn(
-            'border-border bg-background relative z-50 my-8 grid w-full max-w-lg gap-4 border p-6 shadow-lg duration-200 sm:rounded-lg md:w-full',
+            'relative z-50 grid w-full max-w-lg my-8 gap-4 border border-border bg-background p-6 shadow-lg duration-200 sm:rounded-lg md:w-full',
             props.class,
           )
         "
-        :style="{ zIndex }"
-        v-bind="forwarded"
+        v-bind="{ ...$attrs, ...forwarded }"
         @pointer-down-outside="
           (event) => {
             const originalEvent = event.detail.originalEvent;
@@ -60,9 +58,9 @@ const forwarded = useForwardPropsEmits(delegatedProps, emits);
         <slot></slot>
 
         <DialogClose
-          class="hover:bg-secondary absolute right-4 top-4 rounded-md p-0.5 transition-colors"
+          class="absolute top-4 right-4 p-0.5 transition-colors rounded-md hover:bg-secondary"
         >
-          <X class="h-4 w-4" />
+          <X class="size-4" />
           <span class="sr-only">Close</span>
         </DialogClose>
       </DialogContent>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/dialog/DialogTitle.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/dialog/DialogTitle.vue
index 1776c01e..50dc73f6 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/dialog/DialogTitle.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/dialog/DialogTitle.vue
@@ -1,27 +1,27 @@
 <script setup lang="ts">
-import { computed } from 'vue';
+import type { DialogTitleProps } from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
 
 import { cn } from '@vben-core/shared/utils';
 
-import { DialogTitle, type DialogTitleProps, useForwardProps } from 'radix-vue';
+import { reactiveOmit } from '@vueuse/core';
+import { DialogTitle, useForwardProps } from 'reka-ui';
 
-const props = defineProps<{ class?: any } & DialogTitleProps>();
+const props = defineProps<
+  DialogTitleProps & { class?: HTMLAttributes['class'] }
+>();
 
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-
-  return delegated;
-});
+const delegatedProps = reactiveOmit(props, 'class');
 
 const forwardedProps = useForwardProps(delegatedProps);
 </script>
 
 <template>
   <DialogTitle
+    data-slot="dialog-title"
     v-bind="forwardedProps"
-    :class="
-      cn('text-lg font-semibold leading-none tracking-tight', props.class)
-    "
+    :class="cn('text-lg leading-none font-semibold', props.class)"
   >
     <slot></slot>
   </DialogTitle>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/dialog/DialogTrigger.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/dialog/DialogTrigger.vue
index 8ae4c336..9edfd3a2 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/dialog/DialogTrigger.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/dialog/DialogTrigger.vue
@@ -1,11 +1,13 @@
 <script setup lang="ts">
-import { DialogTrigger, type DialogTriggerProps } from 'radix-vue';
+import type { DialogTriggerProps } from 'reka-ui';
+
+import { DialogTrigger } from 'reka-ui';
 
 const props = defineProps<DialogTriggerProps>();
 </script>
 
 <template>
-  <DialogTrigger v-bind="props">
+  <DialogTrigger data-slot="dialog-trigger" v-bind="props">
     <slot></slot>
   </DialogTrigger>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/dialog/index.ts b/packages/@core/ui-kit/shadcn-ui/src/ui/dialog/index.ts
index e924dd4b..4f9dab8a 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/dialog/index.ts
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/dialog/index.ts
@@ -4,6 +4,7 @@ export { default as DialogContent } from './DialogContent.vue';
 export { default as DialogDescription } from './DialogDescription.vue';
 export { default as DialogFooter } from './DialogFooter.vue';
 export { default as DialogHeader } from './DialogHeader.vue';
+export { default as DialogOverlay } from './DialogOverlay.vue';
 export { default as DialogScrollContent } from './DialogScrollContent.vue';
 export { default as DialogTitle } from './DialogTitle.vue';
 export { default as DialogTrigger } from './DialogTrigger.vue';
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/DropdownMenu.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/DropdownMenu.vue
index 6a4328e6..5e94fb19 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/DropdownMenu.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/DropdownMenu.vue
@@ -1,21 +1,20 @@
 <script setup lang="ts">
-import {
-  DropdownMenuRoot,
-  type DropdownMenuRootEmits,
-  type DropdownMenuRootProps,
-  useForwardPropsEmits,
-} from 'radix-vue';
+import type { DropdownMenuRootEmits, DropdownMenuRootProps } from 'reka-ui';
 
-const props = withDefaults(defineProps<DropdownMenuRootProps>(), {
-  modal: false,
-});
+import { DropdownMenuRoot, useForwardPropsEmits } from 'reka-ui';
+
+const props = defineProps<DropdownMenuRootProps>();
 const emits = defineEmits<DropdownMenuRootEmits>();
 
 const forwarded = useForwardPropsEmits(props, emits);
 </script>
 
 <template>
-  <DropdownMenuRoot v-bind="forwarded">
-    <slot></slot>
+  <DropdownMenuRoot
+    v-slot="slotProps"
+    data-slot="dropdown-menu"
+    v-bind="forwarded"
+  >
+    <slot v-bind="slotProps"></slot>
   </DropdownMenuRoot>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/DropdownMenuCheckboxItem.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/DropdownMenuCheckboxItem.vue
index 508218cc..2e30c2e0 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/DropdownMenuCheckboxItem.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/DropdownMenuCheckboxItem.vue
@@ -1,42 +1,49 @@
 <script setup lang="ts">
-import { computed } from 'vue';
+import type {
+  DropdownMenuCheckboxItemEmits,
+  DropdownMenuCheckboxItemProps,
+} from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
 
 import { cn } from '@vben-core/shared/utils';
 
-import { Check } from 'lucide-vue-next';
+import { Check } from '@lucide/vue';
+import { reactiveOmit } from '@vueuse/core';
 import {
   DropdownMenuCheckboxItem,
-  type DropdownMenuCheckboxItemEmits,
-  type DropdownMenuCheckboxItemProps,
   DropdownMenuItemIndicator,
   useForwardPropsEmits,
-} from 'radix-vue';
+} from 'reka-ui';
 
-const props = defineProps<{ class?: any } & DropdownMenuCheckboxItemProps>();
+const props = defineProps<
+  DropdownMenuCheckboxItemProps & { class?: HTMLAttributes['class'] }
+>();
 const emits = defineEmits<DropdownMenuCheckboxItemEmits>();
 
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-
-  return delegated;
-});
+const delegatedProps = reactiveOmit(props, 'class');
 
 const forwarded = useForwardPropsEmits(delegatedProps, emits);
 </script>
 
 <template>
   <DropdownMenuCheckboxItem
+    data-slot="dropdown-menu-checkbox-item"
     v-bind="forwarded"
     :class="
       cn(
-        'focus:bg-accent focus:text-accent-foreground relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none transition-colors data-[disabled]:pointer-events-none data-[disabled]:opacity-50',
+        'focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=\'size-\'])]:size-4',
         props.class,
       )
     "
   >
-    <span class="absolute left-2 flex h-3.5 w-3.5 items-center justify-center">
+    <span
+      class="pointer-events-none absolute left-2 flex size-3.5 items-center justify-center"
+    >
       <DropdownMenuItemIndicator>
-        <Check class="h-4 w-4" />
+        <slot name="indicator-icon">
+          <Check class="size-4" />
+        </slot>
       </DropdownMenuItemIndicator>
     </span>
     <slot></slot>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/DropdownMenuContent.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/DropdownMenuContent.vue
index 9800a90d..55293e78 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/DropdownMenuContent.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/DropdownMenuContent.vue
@@ -1,29 +1,33 @@
 <script setup lang="ts">
-import { computed } from 'vue';
+import type {
+  DropdownMenuContentEmits,
+  DropdownMenuContentProps,
+} from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
 
 import { cn } from '@vben-core/shared/utils';
 
+import { reactiveOmit } from '@vueuse/core';
 import {
   DropdownMenuContent,
-  type DropdownMenuContentEmits,
-  type DropdownMenuContentProps,
   DropdownMenuPortal,
   useForwardPropsEmits,
-} from 'radix-vue';
+} from 'reka-ui';
+
+defineOptions({
+  inheritAttrs: false,
+});
 
 const props = withDefaults(
-  defineProps<{ class?: any } & DropdownMenuContentProps>(),
+  defineProps<DropdownMenuContentProps & { class?: HTMLAttributes['class'] }>(),
   {
     sideOffset: 4,
   },
 );
 const emits = defineEmits<DropdownMenuContentEmits>();
 
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-
-  return delegated;
-});
+const delegatedProps = reactiveOmit(props, 'class');
 
 const forwarded = useForwardPropsEmits(delegatedProps, emits);
 </script>
@@ -31,10 +35,11 @@ const forwarded = useForwardPropsEmits(delegatedProps, emits);
 <template>
   <DropdownMenuPortal>
     <DropdownMenuContent
-      v-bind="forwarded"
+      data-slot="dropdown-menu-content"
+      v-bind="{ ...$attrs, ...forwarded }"
       :class="
         cn(
-          'bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 border-border z-[1000] min-w-32 overflow-hidden rounded-md border p-1 shadow-md',
+          'z-popup bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 max-h-(--reka-dropdown-menu-content-available-height) min-w-[8rem] origin-(--reka-dropdown-menu-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border p-1 shadow-md',
           props.class,
         )
       "
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/DropdownMenuGroup.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/DropdownMenuGroup.vue
index f1e2305f..1d2d718f 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/DropdownMenuGroup.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/DropdownMenuGroup.vue
@@ -1,11 +1,13 @@
 <script setup lang="ts">
-import { DropdownMenuGroup, type DropdownMenuGroupProps } from 'radix-vue';
+import type { DropdownMenuGroupProps } from 'reka-ui';
+
+import { DropdownMenuGroup } from 'reka-ui';
 
 const props = defineProps<DropdownMenuGroupProps>();
 </script>
 
 <template>
-  <DropdownMenuGroup v-bind="props">
+  <DropdownMenuGroup data-slot="dropdown-menu-group" v-bind="props">
     <slot></slot>
   </DropdownMenuGroup>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/DropdownMenuItem.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/DropdownMenuItem.vue
index 3aac6678..a2014e4f 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/DropdownMenuItem.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/DropdownMenuItem.vue
@@ -1,34 +1,40 @@
 <script setup lang="ts">
-import { computed } from 'vue';
+import type { DropdownMenuItemProps } from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
 
 import { cn } from '@vben-core/shared/utils';
 
-import {
-  DropdownMenuItem,
-  type DropdownMenuItemProps,
-  useForwardProps,
-} from 'radix-vue';
+import { reactiveOmit } from '@vueuse/core';
+import { DropdownMenuItem, useForwardProps } from 'reka-ui';
 
-const props = defineProps<
-  { class?: any; inset?: boolean } & DropdownMenuItemProps
->();
+const props = withDefaults(
+  defineProps<
+    DropdownMenuItemProps & {
+      class?: HTMLAttributes['class'];
+      inset?: boolean;
+      variant?: 'default' | 'destructive';
+    }
+  >(),
+  {
+    variant: 'default',
+  },
+);
 
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-
-  return delegated;
-});
+const delegatedProps = reactiveOmit(props, 'inset', 'variant', 'class');
 
 const forwardedProps = useForwardProps(delegatedProps);
 </script>
 
 <template>
   <DropdownMenuItem
+    data-slot="dropdown-menu-item"
+    :data-inset="inset ? '' : undefined"
+    :data-variant="variant"
     v-bind="forwardedProps"
     :class="
       cn(
-        'focus:bg-accent focus:text-accent-foreground relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none transition-colors data-[disabled]:pointer-events-none data-[disabled]:opacity-50',
-        inset && 'pl-8',
+        'focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:!text-destructive [&_svg:not([class*=\'text-\'])]:text-muted-foreground relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=\'size-\'])]:size-4',
         props.class,
       )
     "
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/DropdownMenuLabel.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/DropdownMenuLabel.vue
index decd5d2b..029bb844 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/DropdownMenuLabel.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/DropdownMenuLabel.vue
@@ -1,32 +1,28 @@
 <script setup lang="ts">
-import { computed } from 'vue';
+import type { DropdownMenuLabelProps } from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
 
 import { cn } from '@vben-core/shared/utils';
 
-import {
-  DropdownMenuLabel,
-  type DropdownMenuLabelProps,
-  useForwardProps,
-} from 'radix-vue';
+import { reactiveOmit } from '@vueuse/core';
+import { DropdownMenuLabel, useForwardProps } from 'reka-ui';
 
 const props = defineProps<
-  { class?: any; inset?: boolean } & DropdownMenuLabelProps
+  DropdownMenuLabelProps & { class?: HTMLAttributes['class']; inset?: boolean }
 >();
 
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-
-  return delegated;
-});
-
+const delegatedProps = reactiveOmit(props, 'class', 'inset');
 const forwardedProps = useForwardProps(delegatedProps);
 </script>
 
 <template>
   <DropdownMenuLabel
+    data-slot="dropdown-menu-label"
+    :data-inset="inset ? '' : undefined"
     v-bind="forwardedProps"
     :class="
-      cn('px-2 py-1.5 text-sm font-semibold', inset && 'pl-8', props.class)
+      cn('px-2 py-1.5 text-sm font-medium data-[inset]:pl-8', props.class)
     "
   >
     <slot></slot>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/DropdownMenuRadioGroup.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/DropdownMenuRadioGroup.vue
index 9c28706c..bff97bf0 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/DropdownMenuRadioGroup.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/DropdownMenuRadioGroup.vue
@@ -1,10 +1,10 @@
 <script setup lang="ts">
-import {
-  DropdownMenuRadioGroup,
-  type DropdownMenuRadioGroupEmits,
-  type DropdownMenuRadioGroupProps,
-  useForwardPropsEmits,
-} from 'radix-vue';
+import type {
+  DropdownMenuRadioGroupEmits,
+  DropdownMenuRadioGroupProps,
+} from 'reka-ui';
+
+import { DropdownMenuRadioGroup, useForwardPropsEmits } from 'reka-ui';
 
 const props = defineProps<DropdownMenuRadioGroupProps>();
 const emits = defineEmits<DropdownMenuRadioGroupEmits>();
@@ -13,7 +13,10 @@ const forwarded = useForwardPropsEmits(props, emits);
 </script>
 
 <template>
-  <DropdownMenuRadioGroup v-bind="forwarded">
+  <DropdownMenuRadioGroup
+    data-slot="dropdown-menu-radio-group"
+    v-bind="forwarded"
+  >
     <slot></slot>
   </DropdownMenuRadioGroup>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/DropdownMenuRadioItem.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/DropdownMenuRadioItem.vue
index 54bcee37..ddd96351 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/DropdownMenuRadioItem.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/DropdownMenuRadioItem.vue
@@ -1,43 +1,50 @@
 <script setup lang="ts">
-import { computed } from 'vue';
+import type {
+  DropdownMenuRadioItemEmits,
+  DropdownMenuRadioItemProps,
+} from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
 
 import { cn } from '@vben-core/shared/utils';
 
-import { Circle } from 'lucide-vue-next';
+import { Circle } from '@lucide/vue';
+import { reactiveOmit } from '@vueuse/core';
 import {
   DropdownMenuItemIndicator,
   DropdownMenuRadioItem,
-  type DropdownMenuRadioItemEmits,
-  type DropdownMenuRadioItemProps,
   useForwardPropsEmits,
-} from 'radix-vue';
+} from 'reka-ui';
 
-const props = defineProps<{ class?: any } & DropdownMenuRadioItemProps>();
+const props = defineProps<
+  DropdownMenuRadioItemProps & { class?: HTMLAttributes['class'] }
+>();
 
 const emits = defineEmits<DropdownMenuRadioItemEmits>();
 
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-
-  return delegated;
-});
+const delegatedProps = reactiveOmit(props, 'class');
 
 const forwarded = useForwardPropsEmits(delegatedProps, emits);
 </script>
 
 <template>
   <DropdownMenuRadioItem
+    data-slot="dropdown-menu-radio-item"
     v-bind="forwarded"
     :class="
       cn(
-        'focus:bg-accent focus:text-accent-foreground relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none transition-colors data-[disabled]:pointer-events-none data-[disabled]:opacity-50',
+        'focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=\'size-\'])]:size-4',
         props.class,
       )
     "
   >
-    <span class="absolute left-2 flex h-3.5 w-3.5 items-center justify-center">
+    <span
+      class="pointer-events-none absolute left-2 flex size-3.5 items-center justify-center"
+    >
       <DropdownMenuItemIndicator>
-        <Circle class="h-2 w-2 fill-current" />
+        <slot name="indicator-icon">
+          <Circle class="size-2 fill-current" />
+        </slot>
       </DropdownMenuItemIndicator>
     </span>
     <slot></slot>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/DropdownMenuSeparator.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/DropdownMenuSeparator.vue
index f18fc798..92096a8d 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/DropdownMenuSeparator.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/DropdownMenuSeparator.vue
@@ -1,28 +1,25 @@
 <script setup lang="ts">
-import { computed } from 'vue';
+import type { DropdownMenuSeparatorProps } from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
 
 import { cn } from '@vben-core/shared/utils';
 
-import {
-  DropdownMenuSeparator,
-  type DropdownMenuSeparatorProps,
-} from 'radix-vue';
+import { reactiveOmit } from '@vueuse/core';
+import { DropdownMenuSeparator } from 'reka-ui';
 
 const props = defineProps<
-  {
-    class?: any;
-  } & DropdownMenuSeparatorProps
+  DropdownMenuSeparatorProps & {
+    class?: HTMLAttributes['class'];
+  }
 >();
 
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-
-  return delegated;
-});
+const delegatedProps = reactiveOmit(props, 'class');
 </script>
 
 <template>
   <DropdownMenuSeparator
+    data-slot="dropdown-menu-separator"
     v-bind="delegatedProps"
     :class="cn('bg-border -mx-1 my-1 h-px', props.class)"
   />
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/DropdownMenuShortcut.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/DropdownMenuShortcut.vue
index 39f5963b..76227c2d 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/DropdownMenuShortcut.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/DropdownMenuShortcut.vue
@@ -1,13 +1,20 @@
 <script setup lang="ts">
+import type { HTMLAttributes } from 'vue';
+
 import { cn } from '@vben-core/shared/utils';
 
 const props = defineProps<{
-  class?: any;
+  class?: HTMLAttributes['class'];
 }>();
 </script>
 
 <template>
-  <span :class="cn('ml-auto text-xs tracking-widest opacity-60', props.class)">
+  <span
+    data-slot="dropdown-menu-shortcut"
+    :class="
+      cn('text-muted-foreground ml-auto text-xs tracking-widest', props.class)
+    "
+  >
     <slot></slot>
   </span>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/DropdownMenuSub.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/DropdownMenuSub.vue
index 088f87d3..c6b1cbaf 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/DropdownMenuSub.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/DropdownMenuSub.vue
@@ -1,10 +1,7 @@
 <script setup lang="ts">
-import {
-  DropdownMenuSub,
-  type DropdownMenuSubEmits,
-  type DropdownMenuSubProps,
-  useForwardPropsEmits,
-} from 'radix-vue';
+import type { DropdownMenuSubEmits, DropdownMenuSubProps } from 'reka-ui';
+
+import { DropdownMenuSub, useForwardPropsEmits } from 'reka-ui';
 
 const props = defineProps<DropdownMenuSubProps>();
 const emits = defineEmits<DropdownMenuSubEmits>();
@@ -13,7 +10,11 @@ const forwarded = useForwardPropsEmits(props, emits);
 </script>
 
 <template>
-  <DropdownMenuSub v-bind="forwarded">
-    <slot></slot>
+  <DropdownMenuSub
+    v-slot="slotProps"
+    data-slot="dropdown-menu-sub"
+    v-bind="forwarded"
+  >
+    <slot v-bind="slotProps"></slot>
   </DropdownMenuSub>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/DropdownMenuSubContent.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/DropdownMenuSubContent.vue
index a3689212..7ef0b478 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/DropdownMenuSubContent.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/DropdownMenuSubContent.vue
@@ -1,33 +1,33 @@
 <script setup lang="ts">
-import { computed } from 'vue';
+import type {
+  DropdownMenuSubContentEmits,
+  DropdownMenuSubContentProps,
+} from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
 
 import { cn } from '@vben-core/shared/utils';
 
-import {
-  DropdownMenuSubContent,
-  type DropdownMenuSubContentEmits,
-  type DropdownMenuSubContentProps,
-  useForwardPropsEmits,
-} from 'radix-vue';
+import { reactiveOmit } from '@vueuse/core';
+import { DropdownMenuSubContent, useForwardPropsEmits } from 'reka-ui';
 
-const props = defineProps<{ class?: any } & DropdownMenuSubContentProps>();
+const props = defineProps<
+  DropdownMenuSubContentProps & { class?: HTMLAttributes['class'] }
+>();
 const emits = defineEmits<DropdownMenuSubContentEmits>();
 
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-
-  return delegated;
-});
+const delegatedProps = reactiveOmit(props, 'class');
 
 const forwarded = useForwardPropsEmits(delegatedProps, emits);
 </script>
 
 <template>
   <DropdownMenuSubContent
+    data-slot="dropdown-menu-sub-content"
     v-bind="forwarded"
     :class="
       cn(
-        'bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 border-border z-50 min-w-32 overflow-hidden rounded-md border p-1 shadow-lg',
+        'bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 min-w-[8rem] max-w-(--reka-dropdown-menu-content-available-width) origin-(--reka-dropdown-menu-content-transform-origin) overflow-hidden rounded-md border p-1 shadow-lg',
         props.class,
       )
     "
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/DropdownMenuSubTrigger.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/DropdownMenuSubTrigger.vue
index 5efdbf6d..1cf2d91f 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/DropdownMenuSubTrigger.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/DropdownMenuSubTrigger.vue
@@ -1,37 +1,38 @@
 <script setup lang="ts">
-import { computed } from 'vue';
+import type { DropdownMenuSubTriggerProps } from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
 
 import { cn } from '@vben-core/shared/utils';
 
-import { ChevronRight } from 'lucide-vue-next';
-import {
-  DropdownMenuSubTrigger,
-  type DropdownMenuSubTriggerProps,
-  useForwardProps,
-} from 'radix-vue';
+import { ChevronRight } from '@lucide/vue';
+import { reactiveOmit } from '@vueuse/core';
+import { DropdownMenuSubTrigger, useForwardProps } from 'reka-ui';
 
-const props = defineProps<{ class?: any } & DropdownMenuSubTriggerProps>();
-
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-
-  return delegated;
-});
+const props = defineProps<
+  DropdownMenuSubTriggerProps & {
+    class?: HTMLAttributes['class'];
+    inset?: boolean;
+  }
+>();
 
+const delegatedProps = reactiveOmit(props, 'class', 'inset');
 const forwardedProps = useForwardProps(delegatedProps);
 </script>
 
 <template>
   <DropdownMenuSubTrigger
+    data-slot="dropdown-menu-sub-trigger"
     v-bind="forwardedProps"
+    :data-inset="inset ? '' : undefined"
     :class="
       cn(
-        'focus:bg-accent data-[state=open]:bg-accent flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none',
+        'focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=\'size-\'])]:size-4 data-[variant=destructive]:*:[svg]:!text-destructive [&_svg:not([class*=\'text-\'])]:text-muted-foreground',
         props.class,
       )
     "
   >
     <slot></slot>
-    <ChevronRight class="ml-auto h-4 w-4" />
+    <ChevronRight class="ml-auto size-4" />
   </DropdownMenuSubTrigger>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/DropdownMenuTrigger.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/DropdownMenuTrigger.vue
index 3cf6fa17..9eaa7957 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/DropdownMenuTrigger.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/DropdownMenuTrigger.vue
@@ -1,9 +1,7 @@
 <script setup lang="ts">
-import {
-  DropdownMenuTrigger,
-  type DropdownMenuTriggerProps,
-  useForwardProps,
-} from 'radix-vue';
+import type { DropdownMenuTriggerProps } from 'reka-ui';
+
+import { DropdownMenuTrigger, useForwardProps } from 'reka-ui';
 
 const props = defineProps<DropdownMenuTriggerProps>();
 
@@ -11,7 +9,10 @@ const forwardedProps = useForwardProps(props);
 </script>
 
 <template>
-  <DropdownMenuTrigger class="outline-none" v-bind="forwardedProps">
+  <DropdownMenuTrigger
+    data-slot="dropdown-menu-trigger"
+    v-bind="forwardedProps"
+  >
     <slot></slot>
   </DropdownMenuTrigger>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/index.ts b/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/index.ts
index c99f3196..bde907bf 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/index.ts
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/dropdown-menu/index.ts
@@ -13,4 +13,4 @@ export { default as DropdownMenuSub } from './DropdownMenuSub.vue';
 export { default as DropdownMenuSubContent } from './DropdownMenuSubContent.vue';
 export { default as DropdownMenuSubTrigger } from './DropdownMenuSubTrigger.vue';
 export { default as DropdownMenuTrigger } from './DropdownMenuTrigger.vue';
-export { DropdownMenuPortal } from 'radix-vue';
+export { DropdownMenuPortal } from 'reka-ui';
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/form/FormControl.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/form/FormControl.vue
index bd9ed859..2d08cb12 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/form/FormControl.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/form/FormControl.vue
@@ -1,14 +1,15 @@
 <script lang="ts" setup>
-import { Slot } from 'radix-vue';
+import { Slot } from 'reka-ui';
 
 import { useFormField } from './useFormField';
 
-const { error, formDescriptionId, formItemId, formMessageId } = useFormField();
+const { error, formItemId, formDescriptionId, formMessageId } = useFormField();
 </script>
 
 <template>
   <Slot
     :id="formItemId"
+    data-slot="form-control"
     :aria-describedby="
       !error ? `${formDescriptionId}` : `${formDescriptionId} ${formMessageId}`
     "
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/form/FormDescription.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/form/FormDescription.vue
index 871ba301..49df6a9a 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/form/FormDescription.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/form/FormDescription.vue
@@ -1,10 +1,12 @@
 <script lang="ts" setup>
+import type { HTMLAttributes } from 'vue';
+
 import { cn } from '@vben-core/shared/utils';
 
 import { useFormField } from './useFormField';
 
 const props = defineProps<{
-  class?: any;
+  class?: HTMLAttributes['class'];
 }>();
 
 const { formDescriptionId } = useFormField();
@@ -13,6 +15,7 @@ const { formDescriptionId } = useFormField();
 <template>
   <p
     :id="formDescriptionId"
+    data-slot="form-description"
     :class="cn('text-muted-foreground text-sm', props.class)"
   >
     <slot></slot>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/form/FormField.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/form/FormField.vue
new file mode 100644
index 00000000..11cfe635
--- /dev/null
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/form/FormField.vue
@@ -0,0 +1,35 @@
+<script setup lang="ts">
+import { provide, toRefs } from 'vue';
+
+import { FORM_FIELD_INJECTION_KEY } from './injectionKeys';
+
+const props = withDefaults(
+  defineProps<{
+    dirty?: boolean;
+    error?: string;
+    name: string;
+    touched?: boolean;
+    valid?: boolean;
+  }>(),
+  {
+    dirty: false,
+    error: undefined,
+    touched: false,
+    valid: true,
+  },
+);
+
+const { dirty, error, name, touched, valid } = toRefs(props);
+
+provide(FORM_FIELD_INJECTION_KEY, {
+  dirty,
+  error,
+  name,
+  touched,
+  valid,
+});
+</script>
+
+<template>
+  <slot></slot>
+</template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/form/FormItem.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/form/FormItem.vue
index 165c992b..e82a42eb 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/form/FormItem.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/form/FormItem.vue
@@ -1,20 +1,24 @@
 <script lang="ts" setup>
-import { provide, useId } from 'vue';
+import type { HTMLAttributes } from 'vue';
+
+import { provide } from 'vue';
 
 import { cn } from '@vben-core/shared/utils';
 
+import { useId } from 'reka-ui';
+
 import { FORM_ITEM_INJECTION_KEY } from './injectionKeys';
 
 const props = defineProps<{
-  class?: any;
+  class?: HTMLAttributes['class'];
 }>();
 
-const id = useId() as string;
+const id = useId();
 provide(FORM_ITEM_INJECTION_KEY, id);
 </script>
 
 <template>
-  <div :class="cn(props.class)">
+  <div data-slot="form-item" :class="cn(props.class)">
     <slot></slot>
   </div>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/form/FormLabel.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/form/FormLabel.vue
index 797d6e23..a875f1ca 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/form/FormLabel.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/form/FormLabel.vue
@@ -1,18 +1,25 @@
 <script lang="ts" setup>
-import type { LabelProps } from 'radix-vue';
+import type { LabelProps } from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
 
 import { cn } from '@vben-core/shared/utils';
 
 import { Label } from '../label';
 import { useFormField } from './useFormField';
 
-const props = defineProps<{ class?: any } & LabelProps>();
+const props = defineProps<LabelProps & { class?: HTMLAttributes['class'] }>();
 
-const { formItemId } = useFormField();
+const { error, formItemId } = useFormField();
 </script>
 
 <template>
-  <Label :class="cn(props.class)" :for="formItemId">
+  <Label
+    data-slot="form-label"
+    :data-error="!!error"
+    :class="cn(props.class)"
+    :for="formItemId"
+  >
     <slot></slot>
   </Label>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/form/FormMessage.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/form/FormMessage.vue
index fb8a8b91..121867d4 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/form/FormMessage.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/form/FormMessage.vue
@@ -1,18 +1,24 @@
 <script lang="ts" setup>
-import { toValue } from 'vue';
+import type { HTMLAttributes } from 'vue';
 
-import { ErrorMessage } from 'vee-validate';
+import { cn } from '@vben-core/shared/utils';
 
 import { useFormField } from './useFormField';
 
-const { formMessageId, name } = useFormField();
+const props = defineProps<{
+  class?: HTMLAttributes['class'];
+}>();
+
+const { error, formMessageId } = useFormField();
 </script>
 
 <template>
-  <ErrorMessage
+  <p
+    v-if="error"
     :id="formMessageId"
-    :name="toValue(name)"
-    as="p"
-    class="text-destructive text-[0.8rem]"
-  />
+    data-slot="form-message"
+    :class="cn('text-destructive text-sm', props.class)"
+  >
+    {{ error }}
+  </p>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/form/index.ts b/packages/@core/ui-kit/shadcn-ui/src/ui/form/index.ts
index 3e8467b2..a4fe518a 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/form/index.ts
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/form/index.ts
@@ -1,11 +1,10 @@
 export { default as FormControl } from './FormControl.vue';
 export { default as FormDescription } from './FormDescription.vue';
+export { default as FormField } from './FormField.vue';
 export { default as FormItem } from './FormItem.vue';
 export { default as FormLabel } from './FormLabel.vue';
 export { default as FormMessage } from './FormMessage.vue';
-export { FORM_ITEM_INJECTION_KEY } from './injectionKeys';
 export {
-  Field as FormField,
-  FieldArray as FormFieldArray,
-  Form,
-} from 'vee-validate';
+  FORM_FIELD_INJECTION_KEY,
+  FORM_ITEM_INJECTION_KEY,
+} from './injectionKeys';
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/form/injectionKeys.ts b/packages/@core/ui-kit/shadcn-ui/src/ui/form/injectionKeys.ts
index 3c86caa4..ea30d28e 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/form/injectionKeys.ts
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/form/injectionKeys.ts
@@ -1,4 +1,16 @@
-import type { InjectionKey } from 'vue';
+import type { InjectionKey, Ref } from 'vue';
 
-// eslint-disable-next-line symbol-description
-export const FORM_ITEM_INJECTION_KEY = Symbol() as InjectionKey<string>;
+export interface FormFieldContext {
+  dirty: Readonly<Ref<boolean>>;
+  error: Readonly<Ref<string | undefined>>;
+  name: Readonly<Ref<string>>;
+  touched: Readonly<Ref<boolean>>;
+  valid: Readonly<Ref<boolean>>;
+}
+
+export const FORM_ITEM_INJECTION_KEY = Symbol(
+  'FORM_ITEM_INJECTION_KEY',
+) as InjectionKey<string>;
+export const FORM_FIELD_INJECTION_KEY = Symbol(
+  'FORM_FIELD_INJECTION_KEY',
+) as InjectionKey<FormFieldContext>;
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/form/useFormField.ts b/packages/@core/ui-kit/shadcn-ui/src/ui/form/useFormField.ts
index dfb8d4c6..e426e1f8 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/form/useFormField.ts
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/form/useFormField.ts
@@ -1,38 +1,35 @@
-import { inject } from 'vue';
+import { computed, inject } from 'vue';
 
 import {
-  FieldContextKey,
-  useFieldError,
-  useIsFieldDirty,
-  useIsFieldTouched,
-  useIsFieldValid,
-} from 'vee-validate';
-
-import { FORM_ITEM_INJECTION_KEY } from './injectionKeys';
+  FORM_FIELD_INJECTION_KEY,
+  FORM_ITEM_INJECTION_KEY,
+} from './injectionKeys';
 
 export function useFormField() {
-  const fieldContext = inject(FieldContextKey);
+  const fieldContext = inject(FORM_FIELD_INJECTION_KEY);
   const fieldItemContext = inject(FORM_ITEM_INJECTION_KEY);
 
   if (!fieldContext)
     throw new Error('useFormField should be used within <FormField>');
+  if (!fieldItemContext)
+    throw new Error('useFormField should be used within <FormItem>');
 
-  const { name } = fieldContext;
+  const { dirty, error, name, touched, valid } = fieldContext;
   const id = fieldItemContext;
 
   const fieldState = {
-    error: useFieldError(name),
-    isDirty: useIsFieldDirty(name),
-    isTouched: useIsFieldTouched(name),
-    valid: useIsFieldValid(name),
+    valid: computed(() => valid.value),
+    isDirty: computed(() => dirty.value),
+    isTouched: computed(() => touched.value),
+    error,
   };
 
   return {
-    formDescriptionId: `${id}-form-item-description`,
-    formItemId: `${id}-form-item`,
-    formMessageId: `${id}-form-item-message`,
     id,
     name,
+    formItemId: `${id}-form-item`,
+    formDescriptionId: `${id}-form-item-description`,
+    formMessageId: `${id}-form-item-message`,
     ...fieldState,
   };
 }
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/hover-card/HoverCard.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/hover-card/HoverCard.vue
index 6c4ac04f..74355509 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/hover-card/HoverCard.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/hover-card/HoverCard.vue
@@ -1,10 +1,7 @@
 <script setup lang="ts">
-import {
-  HoverCardRoot,
-  type HoverCardRootEmits,
-  type HoverCardRootProps,
-  useForwardPropsEmits,
-} from 'radix-vue';
+import type { HoverCardRootEmits, HoverCardRootProps } from 'reka-ui';
+
+import { HoverCardRoot, useForwardPropsEmits } from 'reka-ui';
 
 const props = defineProps<HoverCardRootProps>();
 const emits = defineEmits<HoverCardRootEmits>();
@@ -13,7 +10,7 @@ const forwarded = useForwardPropsEmits(props, emits);
 </script>
 
 <template>
-  <HoverCardRoot v-bind="forwarded">
-    <slot></slot>
+  <HoverCardRoot v-slot="slotProps" data-slot="hover-card" v-bind="forwarded">
+    <slot v-bind="slotProps"></slot>
   </HoverCardRoot>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/hover-card/HoverCardContent.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/hover-card/HoverCardContent.vue
index 444a182c..6b21c61a 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/hover-card/HoverCardContent.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/hover-card/HoverCardContent.vue
@@ -1,27 +1,25 @@
 <script setup lang="ts">
-import { computed } from 'vue';
+import type { HoverCardContentProps } from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
 
 import { cn } from '@vben-core/shared/utils';
 
-import {
-  HoverCardContent,
-  type HoverCardContentProps,
-  HoverCardPortal,
-  useForwardProps,
-} from 'radix-vue';
+import { reactiveOmit } from '@vueuse/core';
+import { HoverCardContent, HoverCardPortal, useForwardProps } from 'reka-ui';
+
+defineOptions({
+  inheritAttrs: false,
+});
 
 const props = withDefaults(
-  defineProps<{ class?: any } & HoverCardContentProps>(),
+  defineProps<HoverCardContentProps & { class?: HTMLAttributes['class'] }>(),
   {
     sideOffset: 4,
   },
 );
 
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-
-  return delegated;
-});
+const delegatedProps = reactiveOmit(props, 'class');
 
 const forwardedProps = useForwardProps(delegatedProps);
 </script>
@@ -29,10 +27,11 @@ const forwardedProps = useForwardProps(delegatedProps);
 <template>
   <HoverCardPortal>
     <HoverCardContent
-      v-bind="forwardedProps"
+      data-slot="hover-card-content"
+      v-bind="{ ...$attrs, ...forwardedProps }"
       :class="
         cn(
-          'bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 border-border z-[1000] w-64 rounded-md border p-4 shadow-md outline-none',
+          'z-popup bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 w-64 rounded-md border p-4 shadow-md outline-hidden',
           props.class,
         )
       "
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/hover-card/HoverCardTrigger.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/hover-card/HoverCardTrigger.vue
index fe6893a2..d5dd38b5 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/hover-card/HoverCardTrigger.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/hover-card/HoverCardTrigger.vue
@@ -1,11 +1,13 @@
 <script setup lang="ts">
-import { HoverCardTrigger, type HoverCardTriggerProps } from 'radix-vue';
+import type { HoverCardTriggerProps } from 'reka-ui';
+
+import { HoverCardTrigger } from 'reka-ui';
 
 const props = defineProps<HoverCardTriggerProps>();
 </script>
 
 <template>
-  <HoverCardTrigger v-bind="props">
+  <HoverCardTrigger data-slot="hover-card-trigger" v-bind="props">
     <slot></slot>
   </HoverCardTrigger>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/index.ts b/packages/@core/ui-kit/shadcn-ui/src/ui/index.ts
index 02e76145..1be71f86 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/index.ts
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/index.ts
@@ -1,4 +1,5 @@
 export * from './accordion';
+export * from './alert-dialog';
 export * from './avatar';
 export * from './badge';
 export * from './breadcrumb';
@@ -27,3 +28,4 @@ export * from './textarea';
 export * from './toggle';
 export * from './toggle-group';
 export * from './tooltip';
+export * from './tree';
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/input/Input.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/input/Input.vue
index 68b90db2..99ea4f44 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/input/Input.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/input/Input.vue
@@ -1,10 +1,12 @@
 <script setup lang="ts">
+import type { HTMLAttributes } from 'vue';
+
 import { cn } from '@vben-core/shared/utils';
 
 import { useVModel } from '@vueuse/core';
 
 const props = defineProps<{
-  class?: any;
+  class?: HTMLAttributes['class'];
   defaultValue?: number | string;
   modelValue?: number | string;
 }>();
@@ -24,9 +26,29 @@ const modelValue = useVModel(props, 'modelValue', emits, {
     v-model="modelValue"
     :class="
       cn(
-        'border-input bg-background ring-offset-background placeholder:text-muted-foreground focus-visible:ring-ring flex h-10 w-full rounded-md border px-3 py-2 text-sm file:border-0 file:bg-transparent file:text-sm file:font-medium focus-visible:outline-none focus-visible:ring-1 disabled:cursor-not-allowed disabled:opacity-50',
+        'border-input bg-background ring-offset-background placeholder:text-muted-foreground/50 focus-visible:outline-none flex h-10 w-full rounded-md border px-3 py-2 text-sm file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:cursor-not-allowed disabled:opacity-50',
         props.class,
       )
     "
   />
 </template>
+<style lang="scss" scoped>
+input {
+  --ring: var(--primary);
+
+  &:focus-visible {
+    box-shadow: inset 0 0 0 1px hsl(var(--ring));
+  }
+
+  &::-ms-reveal,
+  &::-ms-clear {
+    display: none;
+  }
+
+  &::-webkit-credentials-auto-fill-button,
+  &::-webkit-inner-spin-button,
+  &::-webkit-outer-spin-button {
+    display: none;
+  }
+}
+</style>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/label/Label.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/label/Label.vue
index a4169355..e1f4256c 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/label/Label.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/label/Label.vue
@@ -1,25 +1,25 @@
 <script setup lang="ts">
-import { computed } from 'vue';
+import type { LabelProps } from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
 
 import { cn } from '@vben-core/shared/utils';
 
-import { Label, type LabelProps } from 'radix-vue';
+import { reactiveOmit } from '@vueuse/core';
+import { Label } from 'reka-ui';
 
-const props = defineProps<{ class?: any } & LabelProps>();
+const props = defineProps<LabelProps & { class?: HTMLAttributes['class'] }>();
 
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-
-  return delegated;
-});
+const delegatedProps = reactiveOmit(props, 'class');
 </script>
 
 <template>
   <Label
+    data-slot="label"
     v-bind="delegatedProps"
     :class="
       cn(
-        'text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70',
+        'flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50',
         props.class,
       )
     "
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/number-field/NumberField.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/number-field/NumberField.vue
index 4d01c6ab..e8533fc3 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/number-field/NumberField.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/number-field/NumberField.vue
@@ -1,26 +1,29 @@
 <script setup lang="ts">
-import type { NumberFieldRootEmits, NumberFieldRootProps } from 'radix-vue';
+import type { NumberFieldRootEmits, NumberFieldRootProps } from 'reka-ui';
 
-import { computed } from 'vue';
+import type { HTMLAttributes } from 'vue';
 
 import { cn } from '@vben-core/shared/utils';
 
-import { NumberFieldRoot, useForwardPropsEmits } from 'radix-vue';
+import { reactiveOmit } from '@vueuse/core';
+import { NumberFieldRoot, useForwardPropsEmits } from 'reka-ui';
 
-const props = defineProps<{ class?: any } & NumberFieldRootProps>();
+const props = defineProps<
+  NumberFieldRootProps & { class?: HTMLAttributes['class'] }
+>();
 const emits = defineEmits<NumberFieldRootEmits>();
 
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-
-  return delegated;
-});
+const delegatedProps = reactiveOmit(props, 'class');
 
 const forwarded = useForwardPropsEmits(delegatedProps, emits);
 </script>
 
 <template>
-  <NumberFieldRoot v-bind="forwarded" :class="cn('grid gap-1.5', props.class)">
-    <slot></slot>
+  <NumberFieldRoot
+    v-slot="slotProps"
+    v-bind="forwarded"
+    :class="cn('grid gap-1.5', props.class)"
+  >
+    <slot v-bind="slotProps"></slot>
   </NumberFieldRoot>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/number-field/NumberFieldContent.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/number-field/NumberFieldContent.vue
index f6d1b920..c1dd593e 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/number-field/NumberFieldContent.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/number-field/NumberFieldContent.vue
@@ -1,8 +1,10 @@
 <script setup lang="ts">
+import type { HTMLAttributes } from 'vue';
+
 import { cn } from '@vben-core/shared/utils';
 
 const props = defineProps<{
-  class?: any;
+  class?: HTMLAttributes['class'];
 }>();
 </script>
 
@@ -10,7 +12,7 @@ const props = defineProps<{
   <div
     :class="
       cn(
-        'relative [&>[data-slot=input]]:has-[[data-slot=decrement]]:pl-5 [&>[data-slot=input]]:has-[[data-slot=increment]]:pr-5',
+        'relative [&>[data-slot=input]]:has-[[data-slot=increment]]:pr-5 [&>[data-slot=input]]:has-[[data-slot=decrement]]:pl-5',
         props.class,
       )
     "
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/number-field/NumberFieldDecrement.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/number-field/NumberFieldDecrement.vue
index 9f40db90..f92888ab 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/number-field/NumberFieldDecrement.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/number-field/NumberFieldDecrement.vue
@@ -1,20 +1,19 @@
 <script setup lang="ts">
-import type { NumberFieldDecrementProps } from 'radix-vue';
+import type { NumberFieldDecrementProps } from 'reka-ui';
 
-import { computed } from 'vue';
+import type { HTMLAttributes } from 'vue';
 
 import { cn } from '@vben-core/shared/utils';
 
-import { Minus } from 'lucide-vue-next';
-import { NumberFieldDecrement, useForwardProps } from 'radix-vue';
+import { Minus } from '@lucide/vue';
+import { reactiveOmit } from '@vueuse/core';
+import { NumberFieldDecrement, useForwardProps } from 'reka-ui';
 
-const props = defineProps<{ class?: any } & NumberFieldDecrementProps>();
+const props = defineProps<
+  NumberFieldDecrementProps & { class?: HTMLAttributes['class'] }
+>();
 
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-
-  return delegated;
-});
+const delegatedProps = reactiveOmit(props, 'class');
 
 const forwarded = useForwardProps(delegatedProps);
 </script>
@@ -25,13 +24,13 @@ const forwarded = useForwardProps(delegatedProps);
     v-bind="forwarded"
     :class="
       cn(
-        'absolute left-0 top-1/2 -translate-y-1/2 p-3 disabled:cursor-not-allowed disabled:opacity-20',
+        'absolute top-1/2 -translate-y-1/2 left-0 p-3 disabled:cursor-not-allowed disabled:opacity-20',
         props.class,
       )
     "
   >
     <slot>
-      <Minus class="h-4 w-4" />
+      <Minus class="size-4" />
     </slot>
   </NumberFieldDecrement>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/number-field/NumberFieldIncrement.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/number-field/NumberFieldIncrement.vue
index bfdb0bfe..7bb27847 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/number-field/NumberFieldIncrement.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/number-field/NumberFieldIncrement.vue
@@ -1,20 +1,19 @@
 <script setup lang="ts">
-import type { NumberFieldIncrementProps } from 'radix-vue';
+import type { NumberFieldIncrementProps } from 'reka-ui';
 
-import { computed } from 'vue';
+import type { HTMLAttributes } from 'vue';
 
 import { cn } from '@vben-core/shared/utils';
 
-import { Plus } from 'lucide-vue-next';
-import { NumberFieldIncrement, useForwardProps } from 'radix-vue';
+import { Plus } from '@lucide/vue';
+import { reactiveOmit } from '@vueuse/core';
+import { NumberFieldIncrement, useForwardProps } from 'reka-ui';
 
-const props = defineProps<{ class?: any } & NumberFieldIncrementProps>();
+const props = defineProps<
+  NumberFieldIncrementProps & { class?: HTMLAttributes['class'] }
+>();
 
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-
-  return delegated;
-});
+const delegatedProps = reactiveOmit(props, 'class');
 
 const forwarded = useForwardProps(delegatedProps);
 </script>
@@ -25,7 +24,7 @@ const forwarded = useForwardProps(delegatedProps);
     v-bind="forwarded"
     :class="
       cn(
-        'absolute right-0 top-1/2 -translate-y-1/2 p-3 disabled:cursor-not-allowed disabled:opacity-20',
+        'absolute top-1/2 -translate-y-1/2 right-0 disabled:cursor-not-allowed disabled:opacity-20 p-3',
         props.class,
       )
     "
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/number-field/NumberFieldInput.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/number-field/NumberFieldInput.vue
index 48e621ee..ef2d167b 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/number-field/NumberFieldInput.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/number-field/NumberFieldInput.vue
@@ -1,16 +1,23 @@
 <script setup lang="ts">
+import type { HTMLAttributes } from 'vue';
+
 import { cn } from '@vben-core/shared/utils';
 
-import { NumberFieldInput } from 'radix-vue';
+import { NumberFieldInput } from 'reka-ui';
+
+const props = defineProps<{
+  class?: HTMLAttributes['class'];
+}>();
 </script>
 
 <template>
   <NumberFieldInput
+    data-slot="input"
     :class="
       cn(
-        'border-input placeholder:text-muted-foreground focus-visible:ring-ring flex h-9 w-full rounded-md border bg-transparent py-1 text-center text-sm shadow-sm transition-colors focus-visible:outline-none focus-visible:ring-1 disabled:cursor-not-allowed disabled:opacity-50',
+        'flex h-9 w-full rounded-md border border-input bg-transparent py-1 text-sm text-center shadow-sm transition-colors placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50',
+        props.class,
       )
     "
-    data-slot="input"
   />
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/pagination/Pagination.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/pagination/Pagination.vue
new file mode 100644
index 00000000..6ac4ba6a
--- /dev/null
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/pagination/Pagination.vue
@@ -0,0 +1,31 @@
+<script setup lang="ts">
+import type { PaginationRootEmits, PaginationRootProps } from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
+
+import { cn } from '@vben-core/shared/utils';
+
+import { reactiveOmit } from '@vueuse/core';
+import { PaginationRoot, useForwardPropsEmits } from 'reka-ui';
+
+const props = defineProps<
+  PaginationRootProps & {
+    class?: HTMLAttributes['class'];
+  }
+>();
+const emits = defineEmits<PaginationRootEmits>();
+
+const delegatedProps = reactiveOmit(props, 'class');
+const forwarded = useForwardPropsEmits(delegatedProps, emits);
+</script>
+
+<template>
+  <PaginationRoot
+    v-slot="slotProps"
+    data-slot="pagination"
+    v-bind="forwarded"
+    :class="cn('mx-auto flex w-full justify-center', props.class)"
+  >
+    <slot v-bind="slotProps"></slot>
+  </PaginationRoot>
+</template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/pagination/PaginationContent.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/pagination/PaginationContent.vue
new file mode 100644
index 00000000..e2c7b75d
--- /dev/null
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/pagination/PaginationContent.vue
@@ -0,0 +1,27 @@
+<script setup lang="ts">
+import type { PaginationListProps } from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
+
+import { cn } from '@vben-core/shared/utils';
+
+import { reactiveOmit } from '@vueuse/core';
+import { PaginationList } from 'reka-ui';
+
+const props = defineProps<
+  PaginationListProps & { class?: HTMLAttributes['class'] }
+>();
+
+const delegatedProps = reactiveOmit(props, 'class');
+</script>
+
+<template>
+  <PaginationList
+    v-slot="slotProps"
+    data-slot="pagination-content"
+    v-bind="delegatedProps"
+    :class="cn('flex flex-row items-center gap-1', props.class)"
+  >
+    <slot v-bind="slotProps"></slot>
+  </PaginationList>
+</template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/pagination/PaginationEllipsis.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/pagination/PaginationEllipsis.vue
index a05beb8a..34e6f2df 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/pagination/PaginationEllipsis.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/pagination/PaginationEllipsis.vue
@@ -1,22 +1,24 @@
 <script setup lang="ts">
-import { computed } from 'vue';
+import type { PaginationEllipsisProps } from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
 
 import { cn } from '@vben-core/shared/utils';
 
-import { MoreHorizontal } from 'lucide-vue-next';
-import { PaginationEllipsis, type PaginationEllipsisProps } from 'radix-vue';
+import { MoreHorizontal } from '@lucide/vue';
+import { reactiveOmit } from '@vueuse/core';
+import { PaginationEllipsis } from 'reka-ui';
 
-const props = defineProps<{ class?: any } & PaginationEllipsisProps>();
+const props = defineProps<
+  PaginationEllipsisProps & { class?: HTMLAttributes['class'] }
+>();
 
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-
-  return delegated;
-});
+const delegatedProps = reactiveOmit(props, 'class');
 </script>
 
 <template>
   <PaginationEllipsis
+    data-slot="pagination-ellipsis"
     v-bind="delegatedProps"
     :class="cn('flex size-8 items-center justify-center', props.class)"
   >
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/pagination/PaginationFirst.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/pagination/PaginationFirst.vue
index ea5ca42d..8c461475 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/pagination/PaginationFirst.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/pagination/PaginationFirst.vue
@@ -1,29 +1,46 @@
 <script setup lang="ts">
-import { computed } from 'vue';
+import type { PaginationFirstProps } from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
+
+import type { ButtonVariants } from '../button';
 
 import { cn } from '@vben-core/shared/utils';
 
-import { ChevronsLeft } from 'lucide-vue-next';
-import { PaginationFirst, type PaginationFirstProps } from 'radix-vue';
+import { ChevronsLeft } from '@lucide/vue';
+import { reactiveOmit } from '@vueuse/core';
+import { PaginationFirst, useForwardProps } from 'reka-ui';
 
-import { Button } from '../button';
+import { Button, buttonVariants } from '../button';
 
 const props = withDefaults(
-  defineProps<{ class?: any } & PaginationFirstProps>(),
+  defineProps<
+    PaginationFirstProps & {
+      class?: HTMLAttributes['class'];
+      size?: ButtonVariants['size'];
+    }
+  >(),
   {
-    asChild: true,
+    size: 'default',
   },
 );
 
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-
-  return delegated;
-});
+const delegatedProps = reactiveOmit(props, 'class', 'size');
+const forwarded = useForwardProps(delegatedProps);
 </script>
 
 <template>
-  <PaginationFirst v-bind="delegatedProps">
+  <PaginationFirst
+    data-slot="pagination-first"
+    :class="
+      cn(
+        buttonVariants({ variant: 'ghost', size }),
+        'gap-1 px-2.5 sm:pr-2.5',
+        props.class,
+      )
+    "
+    v-bind="forwarded"
+  >
     <Button :class="cn('size-8 p-0', props.class)" variant="outline">
       <slot>
         <ChevronsLeft class="size-4" />
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/pagination/PaginationItem.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/pagination/PaginationItem.vue
new file mode 100644
index 00000000..b7aaf61e
--- /dev/null
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/pagination/PaginationItem.vue
@@ -0,0 +1,47 @@
+<script setup lang="ts">
+import type { PaginationListItemProps } from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
+
+import type { ButtonVariants } from '../button';
+
+import { cn } from '@vben-core/shared/utils';
+
+import { reactiveOmit } from '@vueuse/core';
+import { PaginationListItem } from 'reka-ui';
+
+import { buttonVariants } from '../button';
+
+const props = withDefaults(
+  defineProps<
+    PaginationListItemProps & {
+      class?: HTMLAttributes['class'];
+      isActive?: boolean;
+      size?: ButtonVariants['size'];
+    }
+  >(),
+  {
+    size: 'icon',
+  },
+);
+
+const delegatedProps = reactiveOmit(props, 'class', 'size', 'isActive');
+</script>
+
+<template>
+  <PaginationListItem
+    data-slot="pagination-item"
+    v-bind="delegatedProps"
+    :class="
+      cn(
+        buttonVariants({
+          variant: isActive ? 'outline' : 'ghost',
+          size,
+        }),
+        props.class,
+      )
+    "
+  >
+    <slot></slot>
+  </PaginationListItem>
+</template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/pagination/PaginationLast.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/pagination/PaginationLast.vue
index d6b24fd8..b6c35122 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/pagination/PaginationLast.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/pagination/PaginationLast.vue
@@ -1,29 +1,46 @@
 <script setup lang="ts">
-import { computed } from 'vue';
+import type { PaginationLastProps } from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
+
+import type { ButtonVariants } from '../button';
 
 import { cn } from '@vben-core/shared/utils';
 
-import { ChevronsRight } from 'lucide-vue-next';
-import { PaginationLast, type PaginationLastProps } from 'radix-vue';
+import { ChevronsRight } from '@lucide/vue';
+import { reactiveOmit } from '@vueuse/core';
+import { PaginationLast, useForwardProps } from 'reka-ui';
 
-import { Button } from '../button';
+import { Button, buttonVariants } from '../button';
 
 const props = withDefaults(
-  defineProps<{ class?: any } & PaginationLastProps>(),
+  defineProps<
+    PaginationLastProps & {
+      class?: HTMLAttributes['class'];
+      size?: ButtonVariants['size'];
+    }
+  >(),
   {
-    asChild: true,
+    size: 'default',
   },
 );
 
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-
-  return delegated;
-});
+const delegatedProps = reactiveOmit(props, 'class', 'size');
+const forwarded = useForwardProps(delegatedProps);
 </script>
 
 <template>
-  <PaginationLast v-bind="delegatedProps">
+  <PaginationLast
+    data-slot="pagination-last"
+    :class="
+      cn(
+        buttonVariants({ variant: 'ghost', size }),
+        'gap-1 px-2.5 sm:pr-2.5',
+        props.class,
+      )
+    "
+    v-bind="forwarded"
+  >
     <Button :class="cn('size-8 p-0', props.class)" variant="outline">
       <slot>
         <ChevronsRight class="size-4" />
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/pagination/PaginationNext.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/pagination/PaginationNext.vue
index cc675963..781628cc 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/pagination/PaginationNext.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/pagination/PaginationNext.vue
@@ -1,32 +1,49 @@
 <script setup lang="ts">
-import { computed } from 'vue';
+import type { PaginationNextProps } from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
+
+import type { ButtonVariants } from '../button';
 
 import { cn } from '@vben-core/shared/utils';
 
-import { ChevronRight } from 'lucide-vue-next';
-import { PaginationNext, type PaginationNextProps } from 'radix-vue';
+import { ChevronRightIcon } from '@lucide/vue';
+import { reactiveOmit } from '@vueuse/core';
+import { PaginationNext, useForwardProps } from 'reka-ui';
 
-import { Button } from '../button';
+import { Button, buttonVariants } from '../button';
 
 const props = withDefaults(
-  defineProps<{ class?: any } & PaginationNextProps>(),
+  defineProps<
+    PaginationNextProps & {
+      class?: HTMLAttributes['class'];
+      size?: ButtonVariants['size'];
+    }
+  >(),
   {
-    asChild: true,
+    size: 'default',
   },
 );
 
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-
-  return delegated;
-});
+const delegatedProps = reactiveOmit(props, 'class', 'size');
+const forwarded = useForwardProps(delegatedProps);
 </script>
 
 <template>
-  <PaginationNext v-bind="delegatedProps">
+  <PaginationNext
+    data-slot="pagination-next"
+    :class="
+      cn(
+        buttonVariants({ variant: 'ghost', size }),
+        'gap-1 px-2.5 sm:pr-2.5',
+        props.class,
+      )
+    "
+    v-bind="forwarded"
+  >
     <Button :class="cn('size-8 p-0', props.class)" variant="outline">
       <slot>
-        <ChevronRight class="size-4" />
+        <ChevronRightIcon class="size-4" />
       </slot>
     </Button>
   </PaginationNext>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/pagination/PaginationPrev.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/pagination/PaginationPrev.vue
deleted file mode 100644
index 4996e687..00000000
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/pagination/PaginationPrev.vue
+++ /dev/null
@@ -1,33 +0,0 @@
-<script setup lang="ts">
-import { computed } from 'vue';
-
-import { cn } from '@vben-core/shared/utils';
-
-import { ChevronLeft } from 'lucide-vue-next';
-import { PaginationPrev, type PaginationPrevProps } from 'radix-vue';
-
-import { Button } from '../button';
-
-const props = withDefaults(
-  defineProps<{ class?: any } & PaginationPrevProps>(),
-  {
-    asChild: true,
-  },
-);
-
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-
-  return delegated;
-});
-</script>
-
-<template>
-  <PaginationPrev v-bind="delegatedProps">
-    <Button :class="cn('size-8 p-0', props.class)" variant="outline">
-      <slot>
-        <ChevronLeft class="size-4" />
-      </slot>
-    </Button>
-  </PaginationPrev>
-</template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/pagination/PaginationPrevious.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/pagination/PaginationPrevious.vue
new file mode 100644
index 00000000..e17faa82
--- /dev/null
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/pagination/PaginationPrevious.vue
@@ -0,0 +1,50 @@
+<script setup lang="ts">
+import type { PaginationPrevProps } from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
+
+import type { ButtonVariants } from '../button';
+
+import { cn } from '@vben-core/shared/utils';
+
+import { ChevronLeft } from '@lucide/vue';
+import { reactiveOmit } from '@vueuse/core';
+import { PaginationPrev, useForwardProps } from 'reka-ui';
+
+import { Button, buttonVariants } from '../button';
+
+const props = withDefaults(
+  defineProps<
+    PaginationPrevProps & {
+      class?: HTMLAttributes['class'];
+      size?: ButtonVariants['size'];
+    }
+  >(),
+  {
+    size: 'default',
+  },
+);
+
+const delegatedProps = reactiveOmit(props, 'class', 'size');
+const forwarded = useForwardProps(delegatedProps);
+</script>
+
+<template>
+  <PaginationPrev
+    data-slot="pagination-previous"
+    :class="
+      cn(
+        buttonVariants({ variant: 'ghost', size }),
+        'gap-1 px-2.5 sm:pr-2.5',
+        props.class,
+      )
+    "
+    v-bind="forwarded"
+  >
+    <Button :class="cn('size-8 p-0', props.class)" variant="outline">
+      <slot>
+        <ChevronLeft class="size-4" />
+      </slot>
+    </Button>
+  </PaginationPrev>
+</template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/pagination/index.ts b/packages/@core/ui-kit/shadcn-ui/src/ui/pagination/index.ts
index ce93dc4e..cb7efbf9 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/pagination/index.ts
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/pagination/index.ts
@@ -1,10 +1,8 @@
+export { default as Pagination } from './Pagination.vue';
+export { default as PaginationContent } from './PaginationContent.vue';
 export { default as PaginationEllipsis } from './PaginationEllipsis.vue';
 export { default as PaginationFirst } from './PaginationFirst.vue';
+export { default as PaginationItem } from './PaginationItem.vue';
 export { default as PaginationLast } from './PaginationLast.vue';
 export { default as PaginationNext } from './PaginationNext.vue';
-export { default as PaginationPrev } from './PaginationPrev.vue';
-export {
-  PaginationList,
-  PaginationListItem,
-  PaginationRoot as Pagination,
-} from 'radix-vue';
+export { default as PaginationPrevious } from './PaginationPrevious.vue';
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/pin-input/PinInput.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/pin-input/PinInput.vue
index 298753b3..aee4f178 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/pin-input/PinInput.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/pin-input/PinInput.vue
@@ -1,30 +1,37 @@
-<script setup lang="ts">
-import { computed } from 'vue';
+<script setup lang="ts" generic="Type extends 'text' | 'number' = 'text'">
+import type { PinInputRootEmits, PinInputRootProps } from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
 
 import { cn } from '@vben-core/shared/utils';
 
-import {
-  PinInputRoot,
-  type PinInputRootEmits,
-  type PinInputRootProps,
-  useForwardPropsEmits,
-} from 'radix-vue';
+import { reactiveOmit } from '@vueuse/core';
+import { PinInputRoot, useForwardPropsEmits } from 'reka-ui';
 
-const props = defineProps<{ class?: any } & PinInputRootProps>();
-const emits = defineEmits<PinInputRootEmits>();
+const props = withDefaults(
+  defineProps<PinInputRootProps<Type> & { class?: HTMLAttributes['class'] }>(),
+  {
+    otp: true,
+  },
+);
+const emits = defineEmits<PinInputRootEmits<Type>>();
 
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-  return delegated;
-});
+const delegatedProps = reactiveOmit(props, 'class');
 
 const forwarded = useForwardPropsEmits(delegatedProps, emits);
 </script>
 
 <template>
   <PinInputRoot
+    :otp="props.otp"
+    data-slot="pin-input"
     v-bind="forwarded"
-    :class="cn('flex items-center gap-2', props.class)"
+    :class="
+      cn(
+        'flex items-center gap-2 has-disabled:opacity-50 disabled:cursor-not-allowed',
+        props.class,
+      )
+    "
   >
     <slot></slot>
   </PinInputRoot>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/pin-input/PinInputGroup.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/pin-input/PinInputGroup.vue
index 393273db..c43c33f5 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/pin-input/PinInputGroup.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/pin-input/PinInputGroup.vue
@@ -1,20 +1,23 @@
 <script setup lang="ts">
-import { computed } from 'vue';
+import type { PrimitiveProps } from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
 
 import { cn } from '@vben-core/shared/utils';
 
-import { Primitive, type PrimitiveProps, useForwardProps } from 'radix-vue';
+import { reactiveOmit } from '@vueuse/core';
+import { Primitive, useForwardProps } from 'reka-ui';
 
-const props = defineProps<{ class?: any } & PrimitiveProps>();
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-  return delegated;
-});
+const props = defineProps<
+  PrimitiveProps & { class?: HTMLAttributes['class'] }
+>();
+const delegatedProps = reactiveOmit(props, 'class');
 const forwardedProps = useForwardProps(delegatedProps);
 </script>
 
 <template>
   <Primitive
+    data-slot="pin-input-group"
     v-bind="forwardedProps"
     :class="cn('flex items-center', props.class)"
   >
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/pin-input/PinInputInput.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/pin-input/PinInputInput.vue
deleted file mode 100644
index ee74d768..00000000
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/pin-input/PinInputInput.vue
+++ /dev/null
@@ -1,32 +0,0 @@
-<script setup lang="ts">
-import { computed } from 'vue';
-
-import { cn } from '@vben-core/shared/utils';
-
-import {
-  PinInputInput,
-  type PinInputInputProps,
-  useForwardProps,
-} from 'radix-vue';
-
-const props = defineProps<{ class?: any } & PinInputInputProps>();
-
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-  return delegated;
-});
-
-const forwardedProps = useForwardProps(delegatedProps);
-</script>
-
-<template>
-  <PinInputInput
-    v-bind="forwardedProps"
-    :class="
-      cn(
-        'border-input bg-background relative flex h-10 w-8 items-center justify-center border-y border-r text-center text-sm transition-all first:rounded-l-md first:border-l last:rounded-r-md focus:relative focus:z-10 focus:outline-none focus:ring-2 md:w-10',
-        props.class,
-      )
-    "
-  />
-</template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/pin-input/PinInputSeparator.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/pin-input/PinInputSeparator.vue
index d6b867a7..09b8ce3e 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/pin-input/PinInputSeparator.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/pin-input/PinInputSeparator.vue
@@ -1,15 +1,17 @@
 <script setup lang="ts">
-import { Dot } from 'lucide-vue-next';
-import { Primitive, type PrimitiveProps, useForwardProps } from 'radix-vue';
+import type { PrimitiveProps } from 'reka-ui';
+
+import { Minus } from '@lucide/vue';
+import { Primitive, useForwardProps } from 'reka-ui';
 
 const props = defineProps<PrimitiveProps>();
 const forwardedProps = useForwardProps(props);
 </script>
 
 <template>
-  <Primitive v-bind="forwardedProps">
+  <Primitive data-slot="pin-input-separator" v-bind="forwardedProps">
     <slot>
-      <Dot />
+      <Minus />
     </slot>
   </Primitive>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/pin-input/PinInputSlot.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/pin-input/PinInputSlot.vue
new file mode 100644
index 00000000..f103bb70
--- /dev/null
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/pin-input/PinInputSlot.vue
@@ -0,0 +1,31 @@
+<script setup lang="ts">
+import type { PinInputInputProps } from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
+
+import { cn } from '@vben-core/shared/utils';
+
+import { reactiveOmit } from '@vueuse/core';
+import { PinInputInput, useForwardProps } from 'reka-ui';
+
+const props = defineProps<
+  PinInputInputProps & { class?: HTMLAttributes['class'] }
+>();
+
+const delegatedProps = reactiveOmit(props, 'class');
+
+const forwardedProps = useForwardProps(delegatedProps);
+</script>
+
+<template>
+  <PinInputInput
+    data-slot="pin-input-slot"
+    v-bind="forwardedProps"
+    :class="
+      cn(
+        'border-input focus:border-ring focus:ring-ring/50 focus:aria-invalid:ring-destructive/20 dark:bg-input/30 dark:focus:aria-invalid:ring-destructive/40 aria-invalid:border-destructive focus:aria-invalid:border-destructive relative flex h-9 w-9 items-center justify-center border-y border-r text-sm shadow-xs transition-all outline-none text-center first:rounded-l-md first:border-l last:rounded-r-md focus:z-10 focus:ring-3',
+        props.class,
+      )
+    "
+  />
+</template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/pin-input/index.ts b/packages/@core/ui-kit/shadcn-ui/src/ui/pin-input/index.ts
index 585c0d66..41b38f0a 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/pin-input/index.ts
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/pin-input/index.ts
@@ -1,4 +1,4 @@
 export { default as PinInput } from './PinInput.vue';
 export { default as PinInputGroup } from './PinInputGroup.vue';
-export { default as PinInputInput } from './PinInputInput.vue';
 export { default as PinInputSeparator } from './PinInputSeparator.vue';
+export { default as PinInputSlot } from './PinInputSlot.vue';
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/popover/Popover.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/popover/Popover.vue
index c4ae6955..08612daa 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/popover/Popover.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/popover/Popover.vue
@@ -1,7 +1,7 @@
 <script setup lang="ts">
-import type { PopoverRootEmits, PopoverRootProps } from 'radix-vue';
+import type { PopoverRootEmits, PopoverRootProps } from 'reka-ui';
 
-import { PopoverRoot, useForwardPropsEmits } from 'radix-vue';
+import { PopoverRoot, useForwardPropsEmits } from 'reka-ui';
 
 const props = defineProps<PopoverRootProps>();
 const emits = defineEmits<PopoverRootEmits>();
@@ -10,7 +10,7 @@ const forwarded = useForwardPropsEmits(props, emits);
 </script>
 
 <template>
-  <PopoverRoot v-bind="forwarded">
-    <slot></slot>
+  <PopoverRoot v-slot="slotProps" data-slot="popover" v-bind="forwarded">
+    <slot v-bind="slotProps"></slot>
   </PopoverRoot>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/popover/PopoverAnchor.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/popover/PopoverAnchor.vue
new file mode 100644
index 00000000..21eafc9a
--- /dev/null
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/popover/PopoverAnchor.vue
@@ -0,0 +1,13 @@
+<script setup lang="ts">
+import type { PopoverAnchorProps } from 'reka-ui';
+
+import { PopoverAnchor } from 'reka-ui';
+
+const props = defineProps<PopoverAnchorProps>();
+</script>
+
+<template>
+  <PopoverAnchor data-slot="popover-anchor" v-bind="props">
+    <slot></slot>
+  </PopoverAnchor>
+</template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/popover/PopoverContent.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/popover/PopoverContent.vue
index 9d1799b7..53185777 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/popover/PopoverContent.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/popover/PopoverContent.vue
@@ -1,22 +1,19 @@
 <script setup lang="ts">
-import { computed } from 'vue';
+import type { PopoverContentEmits, PopoverContentProps } from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
 
 import { cn } from '@vben-core/shared/utils';
 
-import {
-  PopoverContent,
-  type PopoverContentEmits,
-  type PopoverContentProps,
-  PopoverPortal,
-  useForwardPropsEmits,
-} from 'radix-vue';
+import { reactiveOmit } from '@vueuse/core';
+import { PopoverContent, PopoverPortal, useForwardPropsEmits } from 'reka-ui';
 
 defineOptions({
   inheritAttrs: false,
 });
 
 const props = withDefaults(
-  defineProps<{ class?: any } & PopoverContentProps>(),
+  defineProps<PopoverContentProps & { class?: HTMLAttributes['class'] }>(),
   {
     align: 'center',
     sideOffset: 4,
@@ -24,11 +21,7 @@ const props = withDefaults(
 );
 const emits = defineEmits<PopoverContentEmits>();
 
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-
-  return delegated;
-});
+const delegatedProps = reactiveOmit(props, 'class');
 
 const forwarded = useForwardPropsEmits(delegatedProps, emits);
 </script>
@@ -36,10 +29,11 @@ const forwarded = useForwardPropsEmits(delegatedProps, emits);
 <template>
   <PopoverPortal>
     <PopoverContent
-      v-bind="{ ...forwarded, ...$attrs }"
+      data-slot="popover-content"
+      v-bind="{ ...$attrs, ...forwarded }"
       :class="
         cn(
-          'bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 border-border w-72 rounded-md border p-4 shadow-md outline-none',
+          'bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-72 rounded-md border p-4 shadow-md origin-(--reka-popover-content-transform-origin) outline-hidden',
           props.class,
         )
       "
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/popover/PopoverTrigger.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/popover/PopoverTrigger.vue
index ca395078..ecf418d2 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/popover/PopoverTrigger.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/popover/PopoverTrigger.vue
@@ -1,11 +1,13 @@
 <script setup lang="ts">
-import { PopoverTrigger, type PopoverTriggerProps } from 'radix-vue';
+import type { PopoverTriggerProps } from 'reka-ui';
+
+import { PopoverTrigger } from 'reka-ui';
 
 const props = defineProps<PopoverTriggerProps>();
 </script>
 
 <template>
-  <PopoverTrigger v-bind="props">
+  <PopoverTrigger data-slot="popover-trigger" v-bind="props">
     <slot></slot>
   </PopoverTrigger>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/popover/index.ts b/packages/@core/ui-kit/shadcn-ui/src/ui/popover/index.ts
index dbe007b0..4f8d5292 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/popover/index.ts
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/popover/index.ts
@@ -1,4 +1,4 @@
 export { default as Popover } from './Popover.vue';
+export { default as PopoverAnchor } from './PopoverAnchor.vue';
 export { default as PopoverContent } from './PopoverContent.vue';
 export { default as PopoverTrigger } from './PopoverTrigger.vue';
-export { PopoverAnchor } from 'radix-vue';
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/radio-group/RadioGroup.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/radio-group/RadioGroup.vue
index 35c48701..3e33529b 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/radio-group/RadioGroup.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/radio-group/RadioGroup.vue
@@ -1,29 +1,30 @@
 <script setup lang="ts">
-import { computed } from 'vue';
+import type { RadioGroupRootEmits, RadioGroupRootProps } from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
 
 import { cn } from '@vben-core/shared/utils';
 
-import {
-  RadioGroupRoot,
-  type RadioGroupRootEmits,
-  type RadioGroupRootProps,
-  useForwardPropsEmits,
-} from 'radix-vue';
+import { reactiveOmit } from '@vueuse/core';
+import { RadioGroupRoot, useForwardPropsEmits } from 'reka-ui';
 
-const props = defineProps<{ class?: any } & RadioGroupRootProps>();
+const props = defineProps<
+  RadioGroupRootProps & { class?: HTMLAttributes['class'] }
+>();
 const emits = defineEmits<RadioGroupRootEmits>();
 
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-
-  return delegated;
-});
+const delegatedProps = reactiveOmit(props, 'class');
 
 const forwarded = useForwardPropsEmits(delegatedProps, emits);
 </script>
 
 <template>
-  <RadioGroupRoot :class="cn('grid gap-2', props.class)" v-bind="forwarded">
-    <slot></slot>
+  <RadioGroupRoot
+    v-slot="slotProps"
+    data-slot="radio-group"
+    :class="cn('grid gap-3', props.class)"
+    v-bind="forwarded"
+  >
+    <slot v-bind="slotProps"></slot>
   </RadioGroupRoot>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/radio-group/RadioGroupItem.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/radio-group/RadioGroupItem.vue
index 23468138..3d1f4f6e 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/radio-group/RadioGroupItem.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/radio-group/RadioGroupItem.vue
@@ -1,39 +1,43 @@
 <script setup lang="ts">
-import { computed } from 'vue';
+import type { RadioGroupItemProps } from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
 
 import { cn } from '@vben-core/shared/utils';
 
-import { Circle } from 'lucide-vue-next';
-import {
-  RadioGroupIndicator,
-  RadioGroupItem,
-  type RadioGroupItemProps,
-  useForwardProps,
-} from 'radix-vue';
+import { CircleIcon } from '@lucide/vue';
+import { reactiveOmit } from '@vueuse/core';
+import { RadioGroupIndicator, RadioGroupItem, useForwardProps } from 'reka-ui';
 
-const props = defineProps<{ class?: any } & RadioGroupItemProps>();
+const props = defineProps<
+  RadioGroupItemProps & { class?: HTMLAttributes['class'] }
+>();
 
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-
-  return delegated;
-});
+const delegatedProps = reactiveOmit(props, 'class');
 
 const forwardedProps = useForwardProps(delegatedProps);
 </script>
 
 <template>
   <RadioGroupItem
+    data-slot="radio-group-item"
     v-bind="forwardedProps"
     :class="
       cn(
-        'border-primary text-primary focus-visible:ring-ring aspect-square h-4 w-4 rounded-full border shadow focus:outline-none focus-visible:ring-1 disabled:cursor-not-allowed disabled:opacity-50',
+        'border-input text-primary focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:bg-input/30 aspect-square size-4 shrink-0 rounded-full border shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-3 disabled:cursor-not-allowed disabled:opacity-50',
         props.class,
       )
     "
   >
-    <RadioGroupIndicator class="flex items-center justify-center">
-      <Circle class="h-2.5 w-2.5 fill-current text-current" />
+    <RadioGroupIndicator
+      data-slot="radio-group-indicator"
+      class="relative flex items-center justify-center"
+    >
+      <slot>
+        <CircleIcon
+          class="fill-primary absolute top-1/2 left-1/2 size-2 -translate-x-1/2 -translate-y-1/2"
+        />
+      </slot>
     </RadioGroupIndicator>
   </RadioGroupItem>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/resizable/ResizableHandle.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/resizable/ResizableHandle.vue
index 81dc3fb4..ec2965bc 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/resizable/ResizableHandle.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/resizable/ResizableHandle.vue
@@ -1,47 +1,47 @@
 <script setup lang="ts">
-import { computed, type HTMLAttributes } from 'vue';
+import type {
+  SplitterResizeHandleEmits,
+  SplitterResizeHandleProps,
+} from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
 
-import { GripVertical } from '@vben-core/icons';
 import { cn } from '@vben-core/shared/utils';
 
-import {
-  SplitterResizeHandle,
-  type SplitterResizeHandleEmits,
-  type SplitterResizeHandleProps,
-  useForwardPropsEmits,
-} from 'radix-vue';
+import { GripVertical } from '@lucide/vue';
+import { reactiveOmit } from '@vueuse/core';
+import { SplitterResizeHandle, useForwardPropsEmits } from 'reka-ui';
 
 const props = defineProps<
-  {
+  SplitterResizeHandleProps & {
     class?: HTMLAttributes['class'];
     withHandle?: boolean;
-  } & SplitterResizeHandleProps
+  }
 >();
 const emits = defineEmits<SplitterResizeHandleEmits>();
 
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-  return delegated;
-});
-
+const delegatedProps = reactiveOmit(props, 'class', 'withHandle');
 const forwarded = useForwardPropsEmits(delegatedProps, emits);
 </script>
 
 <template>
   <SplitterResizeHandle
+    data-slot="resizable-handle"
     v-bind="forwarded"
     :class="
       cn(
-        'bg-border focus-visible:ring-ring relative flex w-px items-center justify-center after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-offset-1 [&[data-orientation=vertical]>div]:rotate-90 [&[data-orientation=vertical]]:h-px [&[data-orientation=vertical]]:w-full [&[data-orientation=vertical]]:after:left-0 [&[data-orientation=vertical]]:after:h-1 [&[data-orientation=vertical]]:after:w-full [&[data-orientation=vertical]]:after:-translate-y-1/2 [&[data-orientation=vertical]]:after:translate-x-0',
+        'bg-border focus-visible:ring-ring relative flex w-px items-center justify-center after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:ring-1 focus-visible:ring-offset-1 focus-visible:outline-hidden data-[orientation=vertical]:h-px data-[orientation=vertical]:w-full data-[orientation=vertical]:after:left-0 data-[orientation=vertical]:after:h-1 data-[orientation=vertical]:after:w-full data-[orientation=vertical]:after:-translate-y-1/2 data-[orientation=vertical]:after:translate-x-0 [&[data-orientation=vertical]>div]:rotate-90',
         props.class,
       )
     "
   >
     <template v-if="props.withHandle">
       <div
-        class="bg-border z-10 flex h-4 w-3 items-center justify-center rounded-sm border"
+        class="bg-border z-10 flex h-4 w-3 items-center justify-center rounded-xs border"
       >
-        <GripVertical class="h-2.5 w-2.5" />
+        <slot>
+          <GripVertical class="size-2.5" />
+        </slot>
       </div>
     </template>
   </SplitterResizeHandle>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/resizable/ResizablePanel.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/resizable/ResizablePanel.vue
new file mode 100644
index 00000000..9be81941
--- /dev/null
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/resizable/ResizablePanel.vue
@@ -0,0 +1,32 @@
+<script setup lang="ts">
+import type { SplitterPanelEmits, SplitterPanelProps } from 'reka-ui';
+
+import { ref } from 'vue';
+
+import { SplitterPanel, useForwardPropsEmits } from 'reka-ui';
+
+const props = defineProps<SplitterPanelProps>();
+const emits = defineEmits<SplitterPanelEmits>();
+
+const forwarded = useForwardPropsEmits(props, emits);
+
+const panelRef = ref<InstanceType<typeof SplitterPanel>>();
+
+defineExpose({
+  collapse: () => panelRef.value?.collapse(),
+  expand: () => panelRef.value?.expand(),
+  getSize: () => panelRef.value?.getSize(),
+  resize: (size: number) => panelRef.value?.resize(size),
+});
+</script>
+
+<template>
+  <SplitterPanel
+    ref="panelRef"
+    v-slot="slotProps"
+    data-slot="resizable-panel"
+    v-bind="forwarded"
+  >
+    <slot v-bind="slotProps"></slot>
+  </SplitterPanel>
+</template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/resizable/ResizablePanelGroup.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/resizable/ResizablePanelGroup.vue
index 8ea15f99..7e68f78c 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/resizable/ResizablePanelGroup.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/resizable/ResizablePanelGroup.vue
@@ -1,38 +1,32 @@
 <script setup lang="ts">
-import { computed, type HTMLAttributes } from 'vue';
+import type { SplitterGroupEmits, SplitterGroupProps } from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
 
 import { cn } from '@vben-core/shared/utils';
 
-import {
-  SplitterGroup,
-  type SplitterGroupEmits,
-  type SplitterGroupProps,
-  useForwardPropsEmits,
-} from 'radix-vue';
+import { reactiveOmit } from '@vueuse/core';
+import { SplitterGroup, useForwardPropsEmits } from 'reka-ui';
 
 const props = defineProps<
-  { class?: HTMLAttributes['class'] } & SplitterGroupProps
+  SplitterGroupProps & { class?: HTMLAttributes['class'] }
 >();
 const emits = defineEmits<SplitterGroupEmits>();
 
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-  return delegated;
-});
+const delegatedProps = reactiveOmit(props, 'class');
 
 const forwarded = useForwardPropsEmits(delegatedProps, emits);
 </script>
 
 <template>
   <SplitterGroup
+    v-slot="slotProps"
+    data-slot="resizable-panel-group"
     v-bind="forwarded"
     :class="
-      cn(
-        'flex h-full w-full data-[panel-group-direction=vertical]:flex-col',
-        props.class,
-      )
+      cn('flex h-full w-full data-[orientation=vertical]:flex-col', props.class)
     "
   >
-    <slot></slot>
+    <slot v-bind="slotProps"></slot>
   </SplitterGroup>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/resizable/index.ts b/packages/@core/ui-kit/shadcn-ui/src/ui/resizable/index.ts
index 75c05d58..cffefef9 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/resizable/index.ts
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/resizable/index.ts
@@ -1,3 +1,3 @@
 export { default as ResizableHandle } from './ResizableHandle.vue';
+export { default as ResizablePanel } from './ResizablePanel.vue';
 export { default as ResizablePanelGroup } from './ResizablePanelGroup.vue';
-export { SplitterPanel as ResizablePanel } from 'radix-vue';
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/scroll-area/ScrollArea.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/scroll-area/ScrollArea.vue
index 88538489..b7dc6a1b 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/scroll-area/ScrollArea.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/scroll-area/ScrollArea.vue
@@ -1,45 +1,36 @@
 <script setup lang="ts">
-import { computed } from 'vue';
+import type { ScrollAreaRootProps } from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
 
 import { cn } from '@vben-core/shared/utils';
 
-import {
-  ScrollAreaCorner,
-  ScrollAreaRoot,
-  type ScrollAreaRootProps,
-  ScrollAreaViewport,
-} from 'radix-vue';
+import { reactiveOmit } from '@vueuse/core';
+import { ScrollAreaCorner, ScrollAreaRoot, ScrollAreaViewport } from 'reka-ui';
 
 import ScrollBar from './ScrollBar.vue';
 
-const props = withDefaults(
-  defineProps<
-    {
-      class?: any;
-      onScroll?: (event: Event) => void;
-      viewportProps?: { onScroll: (event: Event) => void };
-    } & ScrollAreaRootProps
-  >(),
-  {
-    onScroll: () => {},
-  },
-);
+const props = defineProps<
+  ScrollAreaRootProps & {
+    class?: HTMLAttributes['class'];
+    onScroll?: (event: Event) => void;
+  }
+>();
 
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-  return delegated;
-});
+const delegatedProps = reactiveOmit(props, 'class', 'onScroll');
 </script>
 
 <template>
   <ScrollAreaRoot
+    data-slot="scroll-area"
     v-bind="delegatedProps"
     :class="cn('relative overflow-hidden', props.class)"
   >
     <ScrollAreaViewport
       as-child
-      class="h-full w-full rounded-[inherit] focus:outline-none"
-      @scroll="onScroll"
+      data-slot="scroll-area-viewport"
+      class="h-full w-full rounded-[inherit] focus:outline-hidden"
+      @scroll="props.onScroll"
     >
       <slot></slot>
     </ScrollAreaViewport>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/scroll-area/ScrollBar.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/scroll-area/ScrollBar.vue
index f79ff240..64a1ad08 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/scroll-area/ScrollBar.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/scroll-area/ScrollBar.vue
@@ -1,42 +1,41 @@
 <script setup lang="ts">
-import { computed } from 'vue';
+import type { ScrollAreaScrollbarProps } from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
 
 import { cn } from '@vben-core/shared/utils';
 
-import {
-  ScrollAreaScrollbar,
-  type ScrollAreaScrollbarProps,
-  ScrollAreaThumb,
-} from 'radix-vue';
+import { reactiveOmit } from '@vueuse/core';
+import { ScrollAreaScrollbar, ScrollAreaThumb } from 'reka-ui';
 
 const props = withDefaults(
-  defineProps<{ class?: any } & ScrollAreaScrollbarProps>(),
+  defineProps<ScrollAreaScrollbarProps & { class?: HTMLAttributes['class'] }>(),
   {
     orientation: 'vertical',
   },
 );
 
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-
-  return delegated;
-});
+const delegatedProps = reactiveOmit(props, 'class');
 </script>
 
 <template>
   <ScrollAreaScrollbar
+    data-slot="scroll-area-scrollbar"
     v-bind="delegatedProps"
     :class="
       cn(
-        'flex touch-none select-none transition-colors',
+        'flex touch-none p-px transition-colors select-none',
         orientation === 'vertical' &&
-          'h-full w-2.5 border-l border-l-transparent p-px',
+          'h-full w-2.5 border-l border-l-transparent',
         orientation === 'horizontal' &&
-          'h-2.5 flex-col border-t border-t-transparent p-px',
+          'h-2.5 flex-col border-t border-t-transparent',
         props.class,
       )
     "
   >
-    <ScrollAreaThumb class="bg-border relative flex-1 rounded-full" />
+    <ScrollAreaThumb
+      data-slot="scroll-area-thumb"
+      class="bg-border relative flex-1 rounded-full"
+    />
   </ScrollAreaScrollbar>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/select/Select.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/select/Select.vue
index f4aebbf4..efd46eaa 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/select/Select.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/select/Select.vue
@@ -1,7 +1,7 @@
 <script setup lang="ts">
-import type { SelectRootEmits, SelectRootProps } from 'radix-vue';
+import type { SelectRootEmits, SelectRootProps } from 'reka-ui';
 
-import { SelectRoot, useForwardPropsEmits } from 'radix-vue';
+import { SelectRoot, useForwardPropsEmits } from 'reka-ui';
 
 const props = defineProps<SelectRootProps>();
 const emits = defineEmits<SelectRootEmits>();
@@ -10,7 +10,7 @@ const forwarded = useForwardPropsEmits(props, emits);
 </script>
 
 <template>
-  <SelectRoot v-bind="forwarded">
-    <slot></slot>
+  <SelectRoot v-slot="slotProps" data-slot="select" v-bind="forwarded">
+    <slot v-bind="slotProps"></slot>
   </SelectRoot>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/select/SelectContent.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/select/SelectContent.vue
index 568a280f..9d2a96c6 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/select/SelectContent.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/select/SelectContent.vue
@@ -1,37 +1,33 @@
 <script setup lang="ts">
-import { computed } from 'vue';
+import type { SelectContentEmits, SelectContentProps } from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
 
 import { cn } from '@vben-core/shared/utils';
 
+import { reactiveOmit } from '@vueuse/core';
 import {
   SelectContent,
-  type SelectContentEmits,
-  type SelectContentProps,
   SelectPortal,
   SelectViewport,
   useForwardPropsEmits,
-} from 'radix-vue';
+} from 'reka-ui';
 
-import SelectScrollDownButton from './SelectScrollDownButton.vue';
-import SelectScrollUpButton from './SelectScrollUpButton.vue';
+import { SelectScrollDownButton, SelectScrollUpButton } from '.';
 
 defineOptions({
   inheritAttrs: false,
 });
 
 const props = withDefaults(
-  defineProps<{ class?: any } & SelectContentProps>(),
+  defineProps<SelectContentProps & { class?: HTMLAttributes['class'] }>(),
   {
     position: 'popper',
   },
 );
 const emits = defineEmits<SelectContentEmits>();
 
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-
-  return delegated;
-});
+const delegatedProps = reactiveOmit(props, 'class');
 
 const forwarded = useForwardPropsEmits(delegatedProps, emits);
 </script>
@@ -39,10 +35,11 @@ const forwarded = useForwardPropsEmits(delegatedProps, emits);
 <template>
   <SelectPortal>
     <SelectContent
-      v-bind="{ ...forwarded, ...$attrs }"
+      data-slot="select-content"
+      v-bind="{ ...$attrs, ...forwarded }"
       :class="
         cn(
-          'bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 border-border relative z-[1000] max-h-96 min-w-32 overflow-hidden rounded-md border shadow-md',
+          'z-popup bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 relative max-h-(--reka-select-content-available-height) min-w-[8rem] overflow-x-hidden overflow-y-auto rounded-md border shadow-md',
           position === 'popper' &&
             'data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1',
           props.class,
@@ -55,7 +52,7 @@ const forwarded = useForwardPropsEmits(delegatedProps, emits);
           cn(
             'p-1',
             position === 'popper' &&
-              'h-[--radix-select-trigger-height] w-full min-w-[--radix-select-trigger-width]',
+              'h-(--reka-select-trigger-height) w-full min-w-(--reka-select-trigger-width) scroll-my-1',
           )
         "
       >
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/select/SelectGroup.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/select/SelectGroup.vue
index df2296c1..95a63a27 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/select/SelectGroup.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/select/SelectGroup.vue
@@ -1,21 +1,13 @@
 <script setup lang="ts">
-import { computed } from 'vue';
+import type { SelectGroupProps } from 'reka-ui';
 
-import { cn } from '@vben-core/shared/utils';
+import { SelectGroup } from 'reka-ui';
 
-import { SelectGroup, type SelectGroupProps } from 'radix-vue';
-
-const props = defineProps<{ class?: any } & SelectGroupProps>();
-
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-
-  return delegated;
-});
+const props = defineProps<SelectGroupProps>();
 </script>
 
 <template>
-  <SelectGroup :class="cn('w-full p-1', props.class)" v-bind="delegatedProps">
+  <SelectGroup data-slot="select-group" v-bind="props">
     <slot></slot>
   </SelectGroup>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/select/SelectItem.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/select/SelectItem.vue
index ea96e10f..770e3dfb 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/select/SelectItem.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/select/SelectItem.vue
@@ -1,41 +1,44 @@
 <script setup lang="ts">
-import { computed } from 'vue';
+import type { SelectItemProps } from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
 
 import { cn } from '@vben-core/shared/utils';
 
-import { Check } from 'lucide-vue-next';
+import { Check } from '@lucide/vue';
+import { reactiveOmit } from '@vueuse/core';
 import {
   SelectItem,
   SelectItemIndicator,
-  type SelectItemProps,
   SelectItemText,
   useForwardProps,
-} from 'radix-vue';
+} from 'reka-ui';
 
-const props = defineProps<{ class?: any } & SelectItemProps>();
+const props = defineProps<
+  SelectItemProps & { class?: HTMLAttributes['class'] }
+>();
 
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-
-  return delegated;
-});
+const delegatedProps = reactiveOmit(props, 'class');
 
 const forwardedProps = useForwardProps(delegatedProps);
 </script>
 
 <template>
   <SelectItem
+    data-slot="select-item"
     v-bind="forwardedProps"
     :class="
       cn(
-        'focus:bg-accent focus:text-accent-foreground relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 pl-2 pr-8 text-sm outline-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50',
+        'focus:bg-accent focus:text-accent-foreground [&_svg:not([class*=\'text-\'])]:text-muted-foreground relative flex w-full cursor-default items-center gap-2 rounded-sm py-1.5 pr-8 pl-2 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=\'size-\'])]:size-4 *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2',
         props.class,
       )
     "
   >
-    <span class="absolute right-2 flex h-3.5 w-3.5 items-center justify-center">
+    <span class="absolute right-2 flex size-3.5 items-center justify-center">
       <SelectItemIndicator>
-        <Check class="h-4 w-4" />
+        <slot name="indicator-icon">
+          <Check class="size-4" />
+        </slot>
       </SelectItemIndicator>
     </span>
 
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/select/SelectItemText.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/select/SelectItemText.vue
index ec6ca07b..025de87d 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/select/SelectItemText.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/select/SelectItemText.vue
@@ -1,11 +1,13 @@
 <script setup lang="ts">
-import { SelectItemText, type SelectItemTextProps } from 'radix-vue';
+import type { SelectItemTextProps } from 'reka-ui';
+
+import { SelectItemText } from 'reka-ui';
 
 const props = defineProps<SelectItemTextProps>();
 </script>
 
 <template>
-  <SelectItemText v-bind="props">
+  <SelectItemText data-slot="select-item-text" v-bind="props">
     <slot></slot>
   </SelectItemText>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/select/SelectLabel.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/select/SelectLabel.vue
index 59842686..b583dee1 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/select/SelectLabel.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/select/SelectLabel.vue
@@ -1,13 +1,22 @@
 <script setup lang="ts">
+import type { SelectLabelProps } from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
+
 import { cn } from '@vben-core/shared/utils';
 
-import { SelectLabel, type SelectLabelProps } from 'radix-vue';
+import { SelectLabel } from 'reka-ui';
 
-const props = defineProps<{ class?: any } & SelectLabelProps>();
+const props = defineProps<
+  SelectLabelProps & { class?: HTMLAttributes['class'] }
+>();
 </script>
 
 <template>
-  <SelectLabel :class="cn('px-2 py-1.5 text-sm font-semibold', props.class)">
+  <SelectLabel
+    data-slot="select-label"
+    :class="cn('text-muted-foreground px-2 py-1.5 text-xs', props.class)"
+  >
     <slot></slot>
   </SelectLabel>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/select/SelectScrollDownButton.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/select/SelectScrollDownButton.vue
index 9aa28b08..a73ce5c8 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/select/SelectScrollDownButton.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/select/SelectScrollDownButton.vue
@@ -1,35 +1,33 @@
 <script setup lang="ts">
-import { computed } from 'vue';
+import type { SelectScrollDownButtonProps } from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
 
 import { cn } from '@vben-core/shared/utils';
 
-import { ChevronDown } from 'lucide-vue-next';
-import {
-  SelectScrollDownButton,
-  type SelectScrollDownButtonProps,
-  useForwardProps,
-} from 'radix-vue';
+import { ChevronDown } from '@lucide/vue';
+import { reactiveOmit } from '@vueuse/core';
+import { SelectScrollDownButton, useForwardProps } from 'reka-ui';
 
-const props = defineProps<{ class?: any } & SelectScrollDownButtonProps>();
+const props = defineProps<
+  SelectScrollDownButtonProps & { class?: HTMLAttributes['class'] }
+>();
 
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-
-  return delegated;
-});
+const delegatedProps = reactiveOmit(props, 'class');
 
 const forwardedProps = useForwardProps(delegatedProps);
 </script>
 
 <template>
   <SelectScrollDownButton
+    data-slot="select-scroll-down-button"
     v-bind="forwardedProps"
     :class="
       cn('flex cursor-default items-center justify-center py-1', props.class)
     "
   >
     <slot>
-      <ChevronDown class="h-4 w-4" />
+      <ChevronDown class="size-4" />
     </slot>
   </SelectScrollDownButton>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/select/SelectScrollUpButton.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/select/SelectScrollUpButton.vue
index c1b23bb3..80c211f6 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/select/SelectScrollUpButton.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/select/SelectScrollUpButton.vue
@@ -1,35 +1,33 @@
 <script setup lang="ts">
-import { computed } from 'vue';
+import type { SelectScrollUpButtonProps } from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
 
 import { cn } from '@vben-core/shared/utils';
 
-import { ChevronUp } from 'lucide-vue-next';
-import {
-  SelectScrollUpButton,
-  type SelectScrollUpButtonProps,
-  useForwardProps,
-} from 'radix-vue';
+import { ChevronUp } from '@lucide/vue';
+import { reactiveOmit } from '@vueuse/core';
+import { SelectScrollUpButton, useForwardProps } from 'reka-ui';
 
-const props = defineProps<{ class?: any } & SelectScrollUpButtonProps>();
+const props = defineProps<
+  SelectScrollUpButtonProps & { class?: HTMLAttributes['class'] }
+>();
 
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-
-  return delegated;
-});
+const delegatedProps = reactiveOmit(props, 'class');
 
 const forwardedProps = useForwardProps(delegatedProps);
 </script>
 
 <template>
   <SelectScrollUpButton
+    data-slot="select-scroll-up-button"
     v-bind="forwardedProps"
     :class="
       cn('flex cursor-default items-center justify-center py-1', props.class)
     "
   >
     <slot>
-      <ChevronUp class="h-4 w-4" />
+      <ChevronUp class="size-4" />
     </slot>
   </SelectScrollUpButton>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/select/SelectSeparator.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/select/SelectSeparator.vue
index f93a7d1c..4a5d956b 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/select/SelectSeparator.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/select/SelectSeparator.vue
@@ -1,22 +1,24 @@
 <script setup lang="ts">
-import { computed } from 'vue';
+import type { SelectSeparatorProps } from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
 
 import { cn } from '@vben-core/shared/utils';
 
-import { SelectSeparator, type SelectSeparatorProps } from 'radix-vue';
+import { reactiveOmit } from '@vueuse/core';
+import { SelectSeparator } from 'reka-ui';
 
-const props = defineProps<{ class?: any } & SelectSeparatorProps>();
+const props = defineProps<
+  SelectSeparatorProps & { class?: HTMLAttributes['class'] }
+>();
 
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-
-  return delegated;
-});
+const delegatedProps = reactiveOmit(props, 'class');
 </script>
 
 <template>
   <SelectSeparator
+    data-slot="select-separator"
     v-bind="delegatedProps"
-    :class="cn('bg-muted -mx-1 my-1 h-px', props.class)"
+    :class="cn('bg-border pointer-events-none -mx-1 my-1 h-px', props.class)"
   />
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/select/SelectTrigger.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/select/SelectTrigger.vue
index 9cb34f0f..fde89684 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/select/SelectTrigger.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/select/SelectTrigger.vue
@@ -1,40 +1,43 @@
 <script setup lang="ts">
-import { computed } from 'vue';
+import type { SelectTriggerProps } from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
 
 import { cn } from '@vben-core/shared/utils';
 
-import { ChevronDown } from 'lucide-vue-next';
-import {
-  SelectIcon,
-  SelectTrigger,
-  type SelectTriggerProps,
-  useForwardProps,
-} from 'radix-vue';
+import { ChevronDown } from '@lucide/vue';
+import { reactiveOmit } from '@vueuse/core';
+import { SelectIcon, SelectTrigger, useForwardProps } from 'reka-ui';
 
-const props = defineProps<{ class?: any } & SelectTriggerProps>();
-
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-
-  return delegated;
-});
+const props = withDefaults(
+  defineProps<
+    SelectTriggerProps & {
+      class?: HTMLAttributes['class'];
+      size?: 'default' | 'sm';
+    }
+  >(),
+  { size: 'default' },
+);
 
+const delegatedProps = reactiveOmit(props, 'class', 'size');
 const forwardedProps = useForwardProps(delegatedProps);
 </script>
 
 <template>
   <SelectTrigger
+    data-slot="select-trigger"
+    :data-size="size"
     v-bind="forwardedProps"
     :class="
       cn(
-        'border-input ring-offset-background placeholder:text-muted-foreground focus:ring-ring flex h-10 w-full items-center justify-between whitespace-nowrap rounded-md border bg-transparent px-3 py-2 text-sm shadow-sm focus:outline-none focus:ring-1 disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1',
+        'border-input data-[placeholder]:text-muted-foreground [&_svg:not([class*=\'text-\'])]:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:bg-input/30 dark:hover:bg-input/50 flex w-fit items-center justify-between gap-2 rounded-md border bg-transparent px-3 py-2 text-sm whitespace-nowrap shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-3 disabled:cursor-not-allowed disabled:opacity-50 data-[size=default]:h-9 data-[size=sm]:h-8 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-2 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=\'size-\'])]:size-4',
         props.class,
       )
     "
   >
     <slot></slot>
     <SelectIcon as-child>
-      <ChevronDown class="h-4 w-4 opacity-50" />
+      <ChevronDown class="size-4 opacity-50" />
     </SelectIcon>
   </SelectTrigger>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/select/SelectValue.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/select/SelectValue.vue
index 197579a3..cdf084d1 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/select/SelectValue.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/select/SelectValue.vue
@@ -1,11 +1,13 @@
 <script setup lang="ts">
-import { SelectValue, type SelectValueProps } from 'radix-vue';
+import type { SelectValueProps } from 'reka-ui';
+
+import { SelectValue } from 'reka-ui';
 
 const props = defineProps<SelectValueProps>();
 </script>
 
 <template>
-  <SelectValue v-bind="props">
+  <SelectValue data-slot="select-value" v-bind="props">
     <slot></slot>
   </SelectValue>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/separator/Separator.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/separator/Separator.vue
index cf6ca4a7..f9ea347f 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/separator/Separator.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/separator/Separator.vue
@@ -1,42 +1,33 @@
 <script setup lang="ts">
-import { computed } from 'vue';
+import type { SeparatorProps } from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
 
 import { cn } from '@vben-core/shared/utils';
 
-import { Separator, type SeparatorProps } from 'radix-vue';
+import { reactiveOmit } from '@vueuse/core';
+import { Separator } from 'reka-ui';
 
-const props = defineProps<{ class?: any; label?: string } & SeparatorProps>();
+const props = withDefaults(
+  defineProps<SeparatorProps & { class?: HTMLAttributes['class'] }>(),
+  {
+    orientation: 'horizontal',
+    decorative: true,
+  },
+);
 
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-
-  return delegated;
-});
+const delegatedProps = reactiveOmit(props, 'class');
 </script>
 
 <template>
   <Separator
+    data-slot="separator"
     v-bind="delegatedProps"
     :class="
       cn(
-        'bg-border relative shrink-0',
-        props.orientation === 'vertical' ? 'h-full w-px' : 'h-px w-full',
+        'bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px',
         props.class,
       )
     "
-  >
-    <span
-      v-if="props.label"
-      :class="
-        cn(
-          'text-muted-foreground bg-background absolute left-1/2 top-1/2 flex -translate-x-1/2 -translate-y-1/2 items-center justify-center text-xs',
-          props.orientation === 'vertical'
-            ? 'w-[1px] px-1 py-2'
-            : 'h-[1px] px-2 py-1',
-        )
-      "
-    >
-      {{ props.label }}
-    </span>
-  </Separator>
+  />
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/sheet/Sheet.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/sheet/Sheet.vue
index 36e4227c..07281df4 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/sheet/Sheet.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/sheet/Sheet.vue
@@ -1,10 +1,7 @@
 <script setup lang="ts">
-import {
-  DialogRoot,
-  type DialogRootEmits,
-  type DialogRootProps,
-  useForwardPropsEmits,
-} from 'radix-vue';
+import type { DialogRootEmits, DialogRootProps } from 'reka-ui';
+
+import { DialogRoot, useForwardPropsEmits } from 'reka-ui';
 
 const props = defineProps<DialogRootProps>();
 const emits = defineEmits<DialogRootEmits>();
@@ -13,7 +10,7 @@ const forwarded = useForwardPropsEmits(props, emits);
 </script>
 
 <template>
-  <DialogRoot v-bind="forwarded">
-    <slot></slot>
+  <DialogRoot v-slot="slotProps" data-slot="sheet" v-bind="forwarded">
+    <slot v-bind="slotProps"></slot>
   </DialogRoot>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/sheet/SheetClose.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/sheet/SheetClose.vue
index b168349c..495a6d77 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/sheet/SheetClose.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/sheet/SheetClose.vue
@@ -1,11 +1,13 @@
 <script setup lang="ts">
-import { DialogClose, type DialogCloseProps } from 'radix-vue';
+import type { DialogCloseProps } from 'reka-ui';
+
+import { DialogClose } from 'reka-ui';
 
 const props = defineProps<DialogCloseProps>();
 </script>
 
 <template>
-  <DialogClose v-bind="props">
+  <DialogClose data-slot="sheet-close" v-bind="props">
     <slot></slot>
   </DialogClose>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/sheet/SheetContent.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/sheet/SheetContent.vue
index 5b09675c..49074b0d 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/sheet/SheetContent.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/sheet/SheetContent.vue
@@ -1,17 +1,15 @@
 <script setup lang="ts">
-import { computed } from 'vue';
+import type { DialogContentEmits, DialogContentProps } from 'reka-ui';
+
+import type { SheetVariants } from './sheet';
+
+import { computed, ref } from 'vue';
 
 import { cn } from '@vben-core/shared/utils';
 
-import {
-  DialogContent,
-  type DialogContentEmits,
-  type DialogContentProps,
-  DialogPortal,
-  useForwardPropsEmits,
-} from 'radix-vue';
+import { DialogContent, useForwardPropsEmits } from 'reka-ui';
 
-import { type SheetVariants, sheetVariants } from './sheet';
+import { sheetVariants } from './sheet';
 import SheetOverlay from './SheetOverlay.vue';
 
 interface SheetContentProps extends DialogContentProps {
@@ -19,6 +17,7 @@ interface SheetContentProps extends DialogContentProps {
   class?: any;
   modal?: boolean;
   open?: boolean;
+  overlayBlur?: number;
   side?: SheetVariants['side'];
   zIndex?: number;
 }
@@ -29,10 +28,11 @@ defineOptions({
 
 const props = withDefaults(defineProps<SheetContentProps>(), {
   appendTo: 'body',
-  zIndex: 1000,
 });
 
-const emits = defineEmits<DialogContentEmits>();
+const emits = defineEmits<
+  DialogContentEmits & { close: []; closed: []; opened: [] }
+>();
 
 const delegatedProps = computed(() => {
   const {
@@ -59,25 +59,49 @@ const position = computed(() => {
 });
 
 const forwarded = useForwardPropsEmits(delegatedProps, emits);
+const contentRef = ref<InstanceType<typeof DialogContent> | null>(null);
+function onAnimationEnd(event: AnimationEvent) {
+  // 只有在 contentRef 的动画结束时才触发 opened/closed 事件
+  if (event.target === contentRef.value?.$el) {
+    if (props.open) {
+      emits('opened');
+    } else {
+      emits('closed');
+    }
+  }
+}
 </script>
 
 <template>
-  <DialogPortal :to="appendTo">
+  <Teleport defer :to="appendTo">
     <Transition name="fade">
-      <SheetOverlay v-if="open && modal" :style="{ zIndex, position }" />
+      <SheetOverlay
+        v-if="open && modal"
+        :style="{
+          ...(zIndex ? { zIndex } : {}),
+          position,
+          backdropFilter:
+            overlayBlur && overlayBlur > 0 ? `blur(${overlayBlur}px)` : 'none',
+        }"
+      />
     </Transition>
     <DialogContent
-      :class="cn(sheetVariants({ side }), props.class)"
-      :style="{ zIndex, position }"
+      ref="contentRef"
+      :class="cn('z-popup', sheetVariants({ side }), props.class)"
+      :style="{
+        ...(zIndex ? { zIndex } : {}),
+        position,
+      }"
+      @animationend="onAnimationEnd"
       v-bind="{ ...forwarded, ...$attrs }"
     >
       <slot></slot>
 
       <!-- <DialogClose
-        class="data-[state=open]:bg-secondary absolute right-4 top-4 rounded-sm opacity-70 transition-opacity hover:opacity-100 focus:outline-none disabled:pointer-events-none"
+        class="data-[state=open]:bg-secondary absolute right-4 top-4 rounded-sm opacity-70 transition-opacity hover:opacity-100 focus:outline-hidden disabled:pointer-events-none"
       >
         <Cross2Icon class="h-5 w-" />
       </DialogClose> -->
     </DialogContent>
-  </DialogPortal>
+  </Teleport>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/sheet/SheetDescription.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/sheet/SheetDescription.vue
index 2e90656c..a5573ab0 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/sheet/SheetDescription.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/sheet/SheetDescription.vue
@@ -1,21 +1,23 @@
 <script setup lang="ts">
-import { computed } from 'vue';
+import type { DialogDescriptionProps } from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
 
 import { cn } from '@vben-core/shared/utils';
 
-import { DialogDescription, type DialogDescriptionProps } from 'radix-vue';
+import { reactiveOmit } from '@vueuse/core';
+import { DialogDescription } from 'reka-ui';
 
-const props = defineProps<{ class?: any } & DialogDescriptionProps>();
+const props = defineProps<
+  DialogDescriptionProps & { class?: HTMLAttributes['class'] }
+>();
 
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-
-  return delegated;
-});
+const delegatedProps = reactiveOmit(props, 'class');
 </script>
 
 <template>
   <DialogDescription
+    data-slot="sheet-description"
     :class="cn('text-muted-foreground text-sm', props.class)"
     v-bind="delegatedProps"
   >
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/sheet/SheetFooter.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/sheet/SheetFooter.vue
index 09460b90..00ff5a32 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/sheet/SheetFooter.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/sheet/SheetFooter.vue
@@ -1,14 +1,15 @@
 <script setup lang="ts">
+import type { HTMLAttributes } from 'vue';
+
 import { cn } from '@vben-core/shared/utils';
 
-const props = defineProps<{ class?: any }>();
+const props = defineProps<{ class?: HTMLAttributes['class'] }>();
 </script>
 
 <template>
   <div
-    :class="
-      cn('flex flex-row flex-col-reverse justify-end gap-x-2', props.class)
-    "
+    data-slot="sheet-footer"
+    :class="cn('flex flex-row justify-end gap-x-2', props.class)"
   >
     <slot></slot>
   </div>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/sheet/SheetHeader.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/sheet/SheetHeader.vue
index c6cc25ca..3a6720a4 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/sheet/SheetHeader.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/sheet/SheetHeader.vue
@@ -1,11 +1,16 @@
 <script setup lang="ts">
+import type { HTMLAttributes } from 'vue';
+
 import { cn } from '@vben-core/shared/utils';
 
-const props = defineProps<{ class?: any }>();
+const props = defineProps<{ class?: HTMLAttributes['class'] }>();
 </script>
 
 <template>
-  <div :class="cn('flex flex-col text-center sm:text-left', props.class)">
+  <div
+    data-slot="sheet-header"
+    :class="cn('flex flex-col gap-1.5 p-4', props.class)"
+  >
     <slot></slot>
   </div>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/sheet/SheetOverlay.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/sheet/SheetOverlay.vue
index c9e96862..08a7c5a9 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/sheet/SheetOverlay.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/sheet/SheetOverlay.vue
@@ -7,5 +7,5 @@ useScrollLock();
 const id = inject('DISMISSABLE_DRAWER_ID');
 </script>
 <template>
-  <div :data-dismissable-drawer="id" class="bg-overlay inset-0"></div>
+  <div :data-dismissable-drawer="id" class="z-popup bg-overlay inset-0"></div>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/sheet/SheetTitle.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/sheet/SheetTitle.vue
index 95c8eacf..61b4d1db 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/sheet/SheetTitle.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/sheet/SheetTitle.vue
@@ -1,21 +1,23 @@
 <script setup lang="ts">
-import { computed } from 'vue';
+import type { DialogTitleProps } from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
 
 import { cn } from '@vben-core/shared/utils';
 
-import { DialogTitle, type DialogTitleProps } from 'radix-vue';
+import { reactiveOmit } from '@vueuse/core';
+import { DialogTitle } from 'reka-ui';
 
-const props = defineProps<{ class?: any } & DialogTitleProps>();
+const props = defineProps<
+  DialogTitleProps & { class?: HTMLAttributes['class'] }
+>();
 
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-
-  return delegated;
-});
+const delegatedProps = reactiveOmit(props, 'class');
 </script>
 
 <template>
   <DialogTitle
+    data-slot="sheet-title"
     :class="cn('text-foreground font-medium', props.class)"
     v-bind="delegatedProps"
   >
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/sheet/SheetTrigger.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/sheet/SheetTrigger.vue
index 8ae4c336..fb2f2edc 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/sheet/SheetTrigger.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/sheet/SheetTrigger.vue
@@ -1,11 +1,13 @@
 <script setup lang="ts">
-import { DialogTrigger, type DialogTriggerProps } from 'radix-vue';
+import type { DialogTriggerProps } from 'reka-ui';
+
+import { DialogTrigger } from 'reka-ui';
 
 const props = defineProps<DialogTriggerProps>();
 </script>
 
 <template>
-  <DialogTrigger v-bind="props">
+  <DialogTrigger data-slot="sheet-trigger" v-bind="props">
     <slot></slot>
   </DialogTrigger>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/sheet/sheet.ts b/packages/@core/ui-kit/shadcn-ui/src/ui/sheet/sheet.ts
index 5fd114fd..badf3114 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/sheet/sheet.ts
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/sheet/sheet.ts
@@ -1,4 +1,6 @@
-import { cva, type VariantProps } from 'class-variance-authority';
+import type { VariantProps } from 'class-variance-authority';
+
+import { cva } from 'class-variance-authority';
 
 export const sheetVariants = cva(
   'bg-background shadow-lg transition ease-in-out data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:duration-300 data-[state=open]:duration-500 border-border',
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/switch/Switch.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/switch/Switch.vue
index 6a28899d..41105d13 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/switch/Switch.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/switch/Switch.vue
@@ -1,45 +1,45 @@
 <script setup lang="ts">
-import { computed } from 'vue';
+import type { SwitchRootEmits, SwitchRootProps } from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
 
 import { cn } from '@vben-core/shared/utils';
 
-import {
-  SwitchRoot,
-  type SwitchRootEmits,
-  type SwitchRootProps,
-  SwitchThumb,
-  useForwardPropsEmits,
-} from 'radix-vue';
+import { reactiveOmit } from '@vueuse/core';
+import { SwitchRoot, SwitchThumb, useForwardPropsEmits } from 'reka-ui';
 
-const props = defineProps<{ class?: any } & SwitchRootProps>();
+const props = defineProps<
+  SwitchRootProps & { class?: HTMLAttributes['class'] }
+>();
 
 const emits = defineEmits<SwitchRootEmits>();
 
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-
-  return delegated;
-});
+const delegatedProps = reactiveOmit(props, 'class');
 
 const forwarded = useForwardPropsEmits(delegatedProps, emits);
 </script>
 
 <template>
   <SwitchRoot
+    v-slot="slotProps"
+    data-slot="switch"
     v-bind="forwarded"
     :class="
       cn(
-        'focus-visible:ring-ring focus-visible:ring-offset-background data-[state=checked]:bg-primary data-[state=unchecked]:bg-input peer inline-flex h-5 w-9 shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent shadow-sm transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50',
+        'peer data-[state=checked]:bg-primary data-[state=unchecked]:bg-input focus-visible:border-ring focus-visible:ring-ring/50 dark:data-[state=unchecked]:bg-input/80 inline-flex h-[1.15rem] w-8 shrink-0 items-center rounded-full border border-transparent shadow-xs transition-all outline-none focus-visible:ring-3 disabled:cursor-not-allowed disabled:opacity-50',
         props.class,
       )
     "
   >
     <SwitchThumb
+      data-slot="switch-thumb"
       :class="
         cn(
-          'bg-background pointer-events-none block h-4 w-4 rounded-full shadow-lg ring-0 transition-transform data-[state=checked]:translate-x-4 data-[state=unchecked]:translate-x-0',
+          'bg-background dark:data-[state=unchecked]:bg-foreground dark:data-[state=checked]:bg-primary-foreground pointer-events-none block size-4 rounded-full ring-0 transition-transform data-[state=checked]:translate-x-[calc(100%-2px)] data-[state=unchecked]:translate-x-0',
         )
       "
-    />
+    >
+      <slot name="thumb" v-bind="slotProps"></slot>
+    </SwitchThumb>
   </SwitchRoot>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/tabs/Tabs.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/tabs/Tabs.vue
index b21d780f..f67aae39 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/tabs/Tabs.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/tabs/Tabs.vue
@@ -1,16 +1,29 @@
 <script setup lang="ts">
-import type { TabsRootEmits, TabsRootProps } from 'radix-vue';
+import type { TabsRootEmits, TabsRootProps } from 'reka-ui';
 
-import { TabsRoot, useForwardPropsEmits } from 'radix-vue';
+import type { HTMLAttributes } from 'vue';
 
-const props = defineProps<TabsRootProps>();
+import { cn } from '@vben-core/shared/utils';
+
+import { reactiveOmit } from '@vueuse/core';
+import { TabsRoot, useForwardPropsEmits } from 'reka-ui';
+
+const props = defineProps<
+  TabsRootProps & { class?: HTMLAttributes['class'] }
+>();
 const emits = defineEmits<TabsRootEmits>();
 
-const forwarded = useForwardPropsEmits(props, emits);
+const delegatedProps = reactiveOmit(props, 'class');
+const forwarded = useForwardPropsEmits(delegatedProps, emits);
 </script>
 
 <template>
-  <TabsRoot v-bind="forwarded">
-    <slot></slot>
+  <TabsRoot
+    v-slot="slotProps"
+    data-slot="tabs"
+    v-bind="forwarded"
+    :class="cn('flex flex-col gap-2', props.class)"
+  >
+    <slot v-bind="slotProps"></slot>
   </TabsRoot>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/tabs/TabsContent.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/tabs/TabsContent.vue
index 0e3d9c5d..c833d64c 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/tabs/TabsContent.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/tabs/TabsContent.vue
@@ -1,27 +1,24 @@
 <script setup lang="ts">
-import { computed } from 'vue';
+import type { TabsContentProps } from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
 
 import { cn } from '@vben-core/shared/utils';
 
-import { TabsContent, type TabsContentProps } from 'radix-vue';
+import { reactiveOmit } from '@vueuse/core';
+import { TabsContent } from 'reka-ui';
 
-const props = defineProps<{ class?: any } & TabsContentProps>();
+const props = defineProps<
+  TabsContentProps & { class?: HTMLAttributes['class'] }
+>();
 
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-
-  return delegated;
-});
+const delegatedProps = reactiveOmit(props, 'class');
 </script>
 
 <template>
   <TabsContent
-    :class="
-      cn(
-        'ring-offset-background focus-visible:ring-ring mt-2 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2',
-        props.class,
-      )
-    "
+    data-slot="tabs-content"
+    :class="cn('flex-1 outline-none', props.class)"
     v-bind="delegatedProps"
   >
     <slot></slot>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/tabs/TabsList.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/tabs/TabsList.vue
index 756df6dd..9f639986 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/tabs/TabsList.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/tabs/TabsList.vue
@@ -1,25 +1,27 @@
 <script setup lang="ts">
-import { computed } from 'vue';
+import type { TabsListProps } from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
 
 import { cn } from '@vben-core/shared/utils';
 
-import { TabsList, type TabsListProps } from 'radix-vue';
+import { reactiveOmit } from '@vueuse/core';
+import { TabsList } from 'reka-ui';
 
-const props = defineProps<{ class?: any } & TabsListProps>();
+const props = defineProps<
+  TabsListProps & { class?: HTMLAttributes['class'] }
+>();
 
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-
-  return delegated;
-});
+const delegatedProps = reactiveOmit(props, 'class');
 </script>
 
 <template>
   <TabsList
+    data-slot="tabs-list"
     v-bind="delegatedProps"
     :class="
       cn(
-        'bg-muted text-muted-foreground inline-flex h-9 items-center justify-center rounded-lg p-1',
+        'bg-muted text-muted-foreground inline-flex h-9 w-fit items-center justify-center rounded-md p-1',
         props.class,
       )
     "
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/tabs/TabsTrigger.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/tabs/TabsTrigger.vue
index 1bec624a..237732d8 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/tabs/TabsTrigger.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/tabs/TabsTrigger.vue
@@ -1,30 +1,32 @@
 <script setup lang="ts">
-import { computed } from 'vue';
+import type { TabsTriggerProps } from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
 
 import { cn } from '@vben-core/shared/utils';
 
-import { TabsTrigger, type TabsTriggerProps, useForwardProps } from 'radix-vue';
+import { reactiveOmit } from '@vueuse/core';
+import { TabsTrigger, useForwardProps } from 'reka-ui';
 
-const props = defineProps<{ class?: any } & TabsTriggerProps>();
+const props = defineProps<
+  TabsTriggerProps & { class?: HTMLAttributes['class'] }
+>();
 
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-
-  return delegated;
-});
+const delegatedProps = reactiveOmit(props, 'class');
 
 const forwardedProps = useForwardProps(delegatedProps);
 </script>
 
 <template>
   <TabsTrigger
-    v-bind="forwardedProps"
+    data-slot="tabs-trigger"
     :class="
       cn(
-        'ring-offset-background focus-visible:ring-ring data-[state=active]:bg-background data-[state=active]:text-foreground inline-flex items-center justify-center whitespace-nowrap rounded-md px-3 py-1 text-sm font-medium transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:shadow',
+        'data-[state=active]:bg-background dark:data-[state=active]:text-foreground focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:outline-ring dark:data-[state=active]:border-input dark:data-[state=active]:bg-input/30 text-foreground dark:text-muted-foreground inline-flex h-[calc(100%-1px)] flex-1 items-center justify-center gap-1.5 rounded-md border border-transparent px-2 py-1 text-sm font-medium whitespace-nowrap transition-[color,box-shadow] focus-visible:ring-3 focus-visible:outline-1 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:shadow-sm [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=\'size-\'])]:size-4',
         props.class,
       )
     "
+    v-bind="forwardedProps"
   >
     <slot></slot>
   </TabsTrigger>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/tabs/index.ts b/packages/@core/ui-kit/shadcn-ui/src/ui/tabs/index.ts
index 571950c6..7e98cfb7 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/tabs/index.ts
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/tabs/index.ts
@@ -2,4 +2,4 @@ export { default as Tabs } from './Tabs.vue';
 export { default as TabsContent } from './TabsContent.vue';
 export { default as TabsList } from './TabsList.vue';
 export { default as TabsTrigger } from './TabsTrigger.vue';
-export { TabsIndicator } from 'radix-vue';
+export { TabsIndicator } from 'reka-ui';
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/textarea/Textarea.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/textarea/Textarea.vue
index 24251679..43389fbc 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/textarea/Textarea.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/textarea/Textarea.vue
@@ -1,10 +1,12 @@
 <script setup lang="ts">
+import type { HTMLAttributes } from 'vue';
+
 import { cn } from '@vben-core/shared/utils';
 
 import { useVModel } from '@vueuse/core';
 
 const props = defineProps<{
-  class?: any;
+  class?: HTMLAttributes['class'];
   defaultValue?: number | string;
   modelValue?: number | string;
 }>();
@@ -14,17 +16,18 @@ const emits = defineEmits<{
 }>();
 
 const modelValue = useVModel(props, 'modelValue', emits, {
-  defaultValue: props.defaultValue,
   passive: true,
+  defaultValue: props.defaultValue,
 });
 </script>
 
 <template>
   <textarea
     v-model="modelValue"
+    data-slot="textarea"
     :class="
       cn(
-        'border-input placeholder:text-muted-foreground focus-visible:ring-ring flex min-h-[60px] w-full rounded-md border bg-transparent px-3 py-2 text-sm shadow-sm focus-visible:outline-none focus-visible:ring-1 disabled:cursor-not-allowed disabled:opacity-50',
+        'border-input placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:bg-input/30 flex field-sizing-content min-h-16 w-full rounded-md border bg-transparent px-3 py-2 text-base shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-3 disabled:cursor-not-allowed disabled:opacity-50 md:text-sm',
         props.class,
       )
     "
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/toggle-group/ToggleGroup.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/toggle-group/ToggleGroup.vue
index 66b3562c..405f2112 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/toggle-group/ToggleGroup.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/toggle-group/ToggleGroup.vue
@@ -1,48 +1,64 @@
 <script setup lang="ts">
 import type { VariantProps } from 'class-variance-authority';
+import type { ToggleGroupRootEmits, ToggleGroupRootProps } from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
 
 import type { toggleVariants } from '../toggle';
 
-import { computed, provide } from 'vue';
+import { provide } from 'vue';
 
 import { cn } from '@vben-core/shared/utils';
 
-import {
-  ToggleGroupRoot,
-  type ToggleGroupRootEmits,
-  type ToggleGroupRootProps,
-  useForwardPropsEmits,
-} from 'radix-vue';
+import { reactiveOmit } from '@vueuse/core';
+import { ToggleGroupRoot, useForwardPropsEmits } from 'reka-ui';
 
 type ToggleGroupVariants = VariantProps<typeof toggleVariants>;
 
-const props = defineProps<
+const props = withDefaults(
+  defineProps<
+    ToggleGroupRootProps & {
+      class?: HTMLAttributes['class'];
+      size?: ToggleGroupVariants['size'];
+      spacing?: number;
+      variant?: ToggleGroupVariants['variant'];
+    }
+  >(),
   {
-    class?: any;
-    size?: ToggleGroupVariants['size'];
-    variant?: ToggleGroupVariants['variant'];
-  } & ToggleGroupRootProps
->();
+    spacing: 0,
+  },
+);
+
 const emits = defineEmits<ToggleGroupRootEmits>();
 
 provide('toggleGroup', {
-  size: props.size,
   variant: props.variant,
+  size: props.size,
+  spacing: props.spacing,
 });
 
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-  return delegated;
-});
-
+const delegatedProps = reactiveOmit(props, 'class', 'size', 'variant');
 const forwarded = useForwardPropsEmits(delegatedProps, emits);
 </script>
 
 <template>
   <ToggleGroupRoot
+    v-slot="slotProps"
+    data-slot="toggle-group"
+    :data-size="size"
+    :data-variant="variant"
+    :data-spacing="spacing"
+    :style="{
+      '--gap': spacing,
+    }"
     v-bind="forwarded"
-    :class="cn('flex items-center justify-center gap-1', props.class)"
+    :class="
+      cn(
+        'group/toggle-group flex w-fit items-center gap-[--spacing(var(--gap))] rounded-md data-[spacing=default]:data-[variant=outline]:shadow-xs',
+        props.class,
+      )
+    "
   >
-    <slot></slot>
+    <slot v-bind="slotProps"></slot>
   </ToggleGroupRoot>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/toggle-group/ToggleGroupItem.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/toggle-group/ToggleGroupItem.vue
index abf918f3..11e4a6c3 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/toggle-group/ToggleGroupItem.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/toggle-group/ToggleGroupItem.vue
@@ -1,40 +1,43 @@
 <script setup lang="ts">
 import type { VariantProps } from 'class-variance-authority';
+import type { ToggleGroupItemProps } from 'reka-ui';
 
-import { computed, inject } from 'vue';
+import type { HTMLAttributes } from 'vue';
+
+import { inject } from 'vue';
 
 import { cn } from '@vben-core/shared/utils';
 
-import {
-  ToggleGroupItem,
-  type ToggleGroupItemProps,
-  useForwardProps,
-} from 'radix-vue';
+import { reactiveOmit } from '@vueuse/core';
+import { ToggleGroupItem, useForwardProps } from 'reka-ui';
 
 import { toggleVariants } from '../toggle';
 
-type ToggleGroupVariants = VariantProps<typeof toggleVariants>;
+type ToggleGroupVariants = VariantProps<typeof toggleVariants> & {
+  spacing?: number;
+};
 
 const props = defineProps<
-  {
-    class?: any;
+  ToggleGroupItemProps & {
+    class?: HTMLAttributes['class'];
     size?: ToggleGroupVariants['size'];
     variant?: ToggleGroupVariants['variant'];
-  } & ToggleGroupItemProps
+  }
 >();
 
 const context = inject<ToggleGroupVariants>('toggleGroup');
 
-const delegatedProps = computed(() => {
-  const { class: _, size: _size, variant: _variant, ...delegated } = props;
-  return delegated;
-});
-
+const delegatedProps = reactiveOmit(props, 'class', 'size', 'variant');
 const forwardedProps = useForwardProps(delegatedProps);
 </script>
 
 <template>
   <ToggleGroupItem
+    v-slot="slotProps"
+    data-slot="toggle-group-item"
+    :data-variant="context?.variant || variant"
+    :data-size="context?.size || size"
+    :data-spacing="context?.spacing"
     v-bind="forwardedProps"
     :class="
       cn(
@@ -42,10 +45,12 @@ const forwardedProps = useForwardProps(delegatedProps);
           variant: context?.variant || variant,
           size: context?.size || size,
         }),
+        'w-auto min-w-0 shrink-0 px-3 focus:z-10 focus-visible:z-10',
+        'data-[spacing=0]:rounded-none data-[spacing=0]:shadow-none data-[spacing=0]:first:rounded-l-md data-[spacing=0]:last:rounded-r-md data-[variant=outline]:[&:not(:first-child)]:-ml-px data-[spacing=0]:data-[variant=outline]:first:border-l',
         props.class,
       )
     "
   >
-    <slot></slot>
+    <slot v-bind="slotProps"></slot>
   </ToggleGroupItem>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/toggle/Toggle.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/toggle/Toggle.vue
index 4517b9c6..e89ece72 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/toggle/Toggle.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/toggle/Toggle.vue
@@ -1,48 +1,45 @@
 <script setup lang="ts">
-import { computed } from 'vue';
+import type { ToggleEmits, ToggleProps } from 'reka-ui';
+
+import type { HTMLAttributes } from 'vue';
+
+import type { ToggleVariants } from '.';
 
 import { cn } from '@vben-core/shared/utils';
 
-import {
-  Toggle,
-  type ToggleEmits,
-  type ToggleProps,
-  useForwardPropsEmits,
-} from 'radix-vue';
+import { reactiveOmit } from '@vueuse/core';
+import { Toggle, useForwardPropsEmits } from 'reka-ui';
 
-import { type ToggleVariants, toggleVariants } from './toggle';
+import { toggleVariants } from '.';
 
 const props = withDefaults(
   defineProps<
-    {
-      class?: any;
+    ToggleProps & {
+      class?: HTMLAttributes['class'];
       size?: ToggleVariants['size'];
       variant?: ToggleVariants['variant'];
-    } & ToggleProps
+    }
   >(),
   {
-    disabled: false,
-    size: 'default',
     variant: 'default',
+    size: 'default',
+    disabled: false,
   },
 );
 
 const emits = defineEmits<ToggleEmits>();
 
-const delegatedProps = computed(() => {
-  const { class: _, size: _size, variant: _variant, ...delegated } = props;
-
-  return delegated;
-});
-
+const delegatedProps = reactiveOmit(props, 'class', 'size', 'variant');
 const forwarded = useForwardPropsEmits(delegatedProps, emits);
 </script>
 
 <template>
   <Toggle
+    v-slot="slotProps"
+    data-slot="toggle"
     v-bind="forwarded"
     :class="cn(toggleVariants({ variant, size }), props.class)"
   >
-    <slot></slot>
+    <slot v-bind="slotProps"></slot>
   </Toggle>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/toggle/toggle.ts b/packages/@core/ui-kit/shadcn-ui/src/ui/toggle/toggle.ts
index 150eaa52..a672fe1d 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/toggle/toggle.ts
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/toggle/toggle.ts
@@ -1,23 +1,25 @@
-import { cva, type VariantProps } from 'class-variance-authority';
+import type { VariantProps } from 'class-variance-authority';
+
+import { cva } from 'class-variance-authority';
 
 export const toggleVariants = cva(
-  'inline-flex items-center justify-center rounded-md text-sm font-medium transition-colors hover:bg-muted hover:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 data-[state=on]:bg-accent data-[state=on]:text-accent-foreground',
+  "inline-flex items-center justify-center gap-2 rounded-md text-sm font-medium hover:bg-muted hover:text-muted-foreground disabled:pointer-events-none disabled:opacity-50 data-[state=on]:bg-accent data-[state=on]:text-accent-foreground [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 [&_svg]:shrink-0 focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-3 outline-none transition-[color,box-shadow] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive whitespace-nowrap",
   {
-    defaultVariants: {
-      size: 'default',
-      variant: 'default',
-    },
     variants: {
-      size: {
-        default: 'h-9 px-3',
-        lg: 'h-10 px-3',
-        sm: 'h-8 px-2',
-      },
       variant: {
         default: 'bg-transparent',
         outline:
-          'border border-input bg-transparent shadow-sm hover:bg-accent hover:text-accent-foreground',
+          'border border-input bg-transparent shadow-xs hover:bg-accent hover:text-accent-foreground',
       },
+      size: {
+        default: 'h-9 px-2 min-w-9',
+        sm: 'h-8 px-1.5 min-w-8',
+        lg: 'h-10 px-2.5 min-w-10',
+      },
+    },
+    defaultVariants: {
+      variant: 'default',
+      size: 'default',
     },
   },
 );
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/tooltip/Tooltip.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/tooltip/Tooltip.vue
index 13cca041..129d625b 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/tooltip/Tooltip.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/tooltip/Tooltip.vue
@@ -1,10 +1,7 @@
 <script setup lang="ts">
-import {
-  TooltipRoot,
-  type TooltipRootEmits,
-  type TooltipRootProps,
-  useForwardPropsEmits,
-} from 'radix-vue';
+import type { TooltipRootEmits, TooltipRootProps } from 'reka-ui';
+
+import { TooltipRoot, useForwardPropsEmits } from 'reka-ui';
 
 const props = defineProps<TooltipRootProps>();
 const emits = defineEmits<TooltipRootEmits>();
@@ -13,7 +10,7 @@ const forwarded = useForwardPropsEmits(props, emits);
 </script>
 
 <template>
-  <TooltipRoot v-bind="forwarded">
-    <slot></slot>
+  <TooltipRoot v-slot="slotProps" data-slot="tooltip" v-bind="forwarded">
+    <slot v-bind="slotProps"></slot>
   </TooltipRoot>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/tooltip/TooltipContent.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/tooltip/TooltipContent.vue
index 81b951e8..7b20c0a8 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/tooltip/TooltipContent.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/tooltip/TooltipContent.vue
@@ -1,22 +1,23 @@
 <script setup lang="ts">
+import type { TooltipContentEmits, TooltipContentProps } from 'reka-ui';
+
 import { computed } from 'vue';
 
 import { cn } from '@vben-core/shared/utils';
 
 import {
+  TooltipArrow,
   TooltipContent,
-  type TooltipContentEmits,
-  type TooltipContentProps,
   TooltipPortal,
   useForwardPropsEmits,
-} from 'radix-vue';
+} from 'reka-ui';
 
 defineOptions({
   inheritAttrs: false,
 });
 
 const props = withDefaults(
-  defineProps<{ class?: any } & TooltipContentProps>(),
+  defineProps<TooltipContentProps & { class?: any }>(),
   {
     class: '',
     side: 'right',
@@ -39,14 +40,16 @@ const forwarded = useForwardPropsEmits(delegatedProps, emits);
   <TooltipPortal>
     <TooltipContent
       v-bind="{ ...forwarded, ...$attrs }"
+      data-slot="tooltip-content"
       :class="
         cn(
-          'bg-accent text-accent-foreground animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 border-border shadow-float z-[1000] overflow-hidden rounded-sm border px-4 py-2 text-xs',
+          'bg-primary text-primary-foreground animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-popup w-fit origin-(--reka-tooltip-content-transform-origin) rounded-md px-3 py-1.5 text-xs text-balance border border-border',
           props.class,
         )
       "
     >
       <slot></slot>
+      <TooltipArrow class="fill-accent stroke-gray-200" />
     </TooltipContent>
   </TooltipPortal>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/tooltip/TooltipProvider.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/tooltip/TooltipProvider.vue
index b13a457a..f56db296 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/tooltip/TooltipProvider.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/tooltip/TooltipProvider.vue
@@ -1,11 +1,13 @@
 <script setup lang="ts">
-import { TooltipProvider, type TooltipProviderProps } from 'radix-vue';
+import type { TooltipProviderProps } from 'reka-ui';
+
+import { TooltipProvider } from 'reka-ui';
 
 const props = defineProps<TooltipProviderProps>();
 </script>
 
 <template>
-  <TooltipProvider v-bind="props">
+  <TooltipProvider v-bind="props" data-slot="tooltip-provider">
     <slot></slot>
   </TooltipProvider>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/tooltip/TooltipTrigger.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/tooltip/TooltipTrigger.vue
index 2aa3794f..b0d7d406 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/ui/tooltip/TooltipTrigger.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/tooltip/TooltipTrigger.vue
@@ -1,11 +1,13 @@
 <script setup lang="ts">
-import { TooltipTrigger, type TooltipTriggerProps } from 'radix-vue';
+import type { TooltipTriggerProps } from 'reka-ui';
+
+import { TooltipTrigger } from 'reka-ui';
 
 const props = defineProps<TooltipTriggerProps>();
 </script>
 
 <template>
-  <TooltipTrigger v-bind="props">
+  <TooltipTrigger v-bind="props" data-slot="tooltip-trigger">
     <slot></slot>
   </TooltipTrigger>
 </template>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/tree/index.ts b/packages/@core/ui-kit/shadcn-ui/src/ui/tree/index.ts
new file mode 100644
index 00000000..d390f636
--- /dev/null
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/tree/index.ts
@@ -0,0 +1,4 @@
+export { default as VbenTree } from './tree.vue';
+export type { TreeProps } from './types';
+export { treePropsDefaults } from './types';
+export type { FlattenedItem } from 'reka-ui';
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/tree/tree.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/tree/tree.vue
new file mode 100644
index 00000000..0a6e8806
--- /dev/null
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/tree/tree.vue
@@ -0,0 +1,524 @@
+<script lang="ts" setup>
+import type { Arrayable } from '@vueuse/core';
+import type { FlattenedItem } from 'reka-ui';
+
+import type { ClassType, Recordable } from '@vben-core/typings';
+
+import type { TreeProps } from './types';
+
+import { computed, onMounted, ref, watchEffect } from 'vue';
+
+import { ChevronRight, IconifyIcon } from '@vben-core/icons';
+import { cn, get } from '@vben-core/shared/utils';
+
+import { TreeItem, TreeRoot } from 'reka-ui';
+
+import { Checkbox } from '../checkbox';
+import { treePropsDefaults } from './types';
+
+const props = withDefaults(defineProps<TreeProps>(), treePropsDefaults());
+
+const emits = defineEmits<{
+  expand: [value: FlattenedItem<Recordable<any>>];
+  select: [value: FlattenedItem<Recordable<any>>];
+}>();
+
+interface InnerFlattenItem<T = Recordable<any>, P = number | string> {
+  hasChildren: boolean;
+  id: P;
+  level: number;
+  parentId: null | P;
+  parents: P[];
+  value: T;
+}
+
+function flatten<T = Recordable<any>, P = number | string>(
+  items: T[],
+  childrenField: string = 'children',
+  level = 0,
+  parentId: null | P = null,
+  parents: P[] = [],
+): InnerFlattenItem<T, P>[] {
+  const result: InnerFlattenItem<T, P>[] = [];
+  items.forEach((item) => {
+    const children = get(item, childrenField) as Array<T>;
+    const id = get(item, props.valueField) as P;
+    const val: InnerFlattenItem<T, P> = {
+      hasChildren: Array.isArray(children) && children.length > 0,
+      id,
+      level,
+      parentId,
+      parents: [...parents],
+      value: item,
+    };
+    result.push(val);
+    if (val.hasChildren)
+      result.push(
+        ...flatten(children, childrenField, level + 1, id, [...parents, id]),
+      );
+  });
+  return result;
+}
+
+const flattenData = ref<Array<InnerFlattenItem>>([]);
+const modelValue = defineModel<Arrayable<number | string>>();
+const expanded = ref<Array<number | string>>(props.defaultExpandedKeys ?? []);
+
+const treeValue = ref();
+let lastTreeData: any = null;
+
+onMounted(() => {
+  watchEffect(() => {
+    flattenData.value = flatten(props.treeData, props.childrenField);
+    if (flattenData.value.length > 0) {
+      updateTreeValue();
+    }
+
+    // 只在 treeData 变化时执行展开
+    const currentTreeData = JSON.stringify(props.treeData);
+    if (lastTreeData !== currentTreeData) {
+      lastTreeData = currentTreeData;
+      if (
+        props.defaultExpandedLevel !== undefined &&
+        props.defaultExpandedLevel > 0
+      ) {
+        expandToLevel(props.defaultExpandedLevel);
+      }
+    }
+  });
+});
+
+function getItemByValue(value: number | string) {
+  return flattenData.value.find(
+    (item) => get(item.value, props.valueField) === value,
+  )?.value;
+}
+
+function updateTreeValue() {
+  const val = modelValue.value;
+  if (val === undefined) {
+    treeValue.value = props.multiple ? [] : undefined;
+  } else if (Array.isArray(val)) {
+    if (val.length === 0) {
+      treeValue.value = [];
+    } else {
+      const filteredValues = val.filter((v) => {
+        const item = getItemByValue(v);
+        return item && !get(item, props.disabledField);
+      });
+      treeValue.value = filteredValues.map((v) => getItemByValue(v));
+
+      if (filteredValues.length !== val.length) {
+        modelValue.value = filteredValues;
+      }
+    }
+  } else {
+    const item = getItemByValue(val);
+    if (item && !get(item, props.disabledField)) {
+      treeValue.value = item;
+    } else {
+      treeValue.value = props.multiple ? [] : undefined;
+      modelValue.value = props.multiple ? [] : undefined;
+    }
+  }
+}
+
+function updateModelValue(val: Arrayable<Recordable<any>>) {
+  if (Array.isArray(val)) {
+    const filteredVal = val.filter((v) => !get(v, props.disabledField));
+    modelValue.value = filteredVal.map((v) => get(v, props.valueField));
+  } else {
+    if (val && !get(val, props.disabledField)) {
+      modelValue.value = get(val, props.valueField);
+    }
+  }
+}
+
+function expandToLevel(level: number) {
+  const keys: string[] = [];
+  flattenData.value.forEach((item) => {
+    if (item.level <= level - 1) {
+      keys.push(get(item.value, props.valueField));
+    }
+  });
+  expanded.value = keys;
+}
+
+function collapseNodes(value: Arrayable<number | string>) {
+  const keys = new Set(Array.isArray(value) ? value : [value]);
+  expanded.value = expanded.value.filter((key) => !keys.has(key));
+}
+
+function expandNodes(value: Arrayable<number | string>) {
+  const keys = [...(Array.isArray(value) ? value : [value])];
+  keys.forEach((key) => {
+    if (expanded.value.includes(key)) return;
+    const item = getItemByValue(key);
+    if (item) {
+      expanded.value.push(key);
+    }
+  });
+}
+
+function expandAll() {
+  expanded.value = flattenData.value
+    .filter((item) => item.hasChildren)
+    .map((item) => get(item.value, props.valueField));
+}
+
+function collapseAll() {
+  expanded.value = [];
+}
+
+function checkAll() {
+  if (!props.multiple) return;
+  modelValue.value = [
+    ...new Set(
+      flattenData.value
+        .filter((item) => !get(item.value, props.disabledField))
+        .map((item) => get(item.value, props.valueField)),
+    ),
+  ];
+  updateTreeValue();
+}
+
+function unCheckAll() {
+  if (!props.multiple) return;
+  modelValue.value = [];
+  updateTreeValue();
+}
+
+function isNodeDisabled(item: FlattenedItem<Recordable<any>>) {
+  return props.disabled || get(item.value, props.disabledField);
+}
+
+// 计算全选/半选状态
+const selectAllStatus = computed<'indeterminate' | boolean>(() => {
+  if (!props.multiple) return false;
+  if (!modelValue.value || !Array.isArray(modelValue.value)) return false;
+
+  const allValues = flattenData.value
+    .filter((item) => !get(item.value, props.disabledField))
+    .map((item) => get(item.value, props.valueField));
+
+  const selectedCount = allValues.filter((v) =>
+    (modelValue.value as (number | string)[]).includes(v),
+  ).length;
+
+  if (selectedCount === 0) return false;
+  if (selectedCount === allValues.length) return true;
+  return 'indeterminate';
+});
+
+function onSelectAllChange(checked: 'indeterminate' | boolean) {
+  if (checked === true) {
+    checkAll();
+  } else {
+    unCheckAll();
+  }
+}
+
+function onToggle(item: FlattenedItem<Recordable<any>>) {
+  emits('expand', item);
+}
+function onSelect(item: FlattenedItem<Recordable<any>>, isSelected: boolean) {
+  if (isNodeDisabled(item)) {
+    return;
+  }
+
+  if (
+    props.checkStrictly &&
+    props.multiple &&
+    props.autoCheckParent &&
+    isSelected
+  ) {
+    flattenData.value
+      .find((i) => {
+        return (
+          get(i.value, props.valueField) === get(item.value, props.valueField)
+        );
+      })
+      ?.parents?.filter((item) => !get(item, props.disabledField))
+      ?.forEach((p) => {
+        if (Array.isArray(modelValue.value) && !modelValue.value.includes(p)) {
+          modelValue.value.push(p);
+        }
+      });
+  }
+  if (
+    props.checkStrictly &&
+    props.multiple &&
+    props.autoCheckParent &&
+    !isSelected
+  ) {
+    flattenData.value
+      .find((i) => {
+        return (
+          get(i.value, props.valueField) === get(item.value, props.valueField)
+        );
+      })
+      ?.parents?.filter((item) => !get(item, props.disabledField))
+      ?.toReversed()
+      .forEach((p) => {
+        const children = flattenData.value.filter((i) => {
+          return (
+            i.parents.length > 0 &&
+            i.parents.includes(p) &&
+            i.id !== item._id &&
+            i.parentId === p
+          );
+        });
+        if (Array.isArray(modelValue.value)) {
+          const hasSelectedChild = children.some((child) =>
+            (modelValue.value as unknown[]).includes(
+              get(child.value, props.valueField),
+            ),
+          );
+          if (!hasSelectedChild) {
+            const index = modelValue.value.indexOf(p);
+            if (index !== -1) {
+              modelValue.value.splice(index, 1);
+            }
+          }
+        }
+      });
+  }
+  updateTreeValue();
+  emits('select', item);
+}
+
+defineExpose({
+  collapseAll,
+  collapseNodes,
+  expandAll,
+  expandNodes,
+  checkAll,
+  unCheckAll,
+  expandToLevel,
+  getItemByValue,
+});
+</script>
+<template>
+  <TreeRoot
+    :get-key="(item) => get(item, valueField)"
+    :get-children="(item) => get(item, childrenField)"
+    :items="treeData"
+    :model-value="treeValue"
+    v-model:expanded="expanded as string[]"
+    :default-expanded="defaultExpandedKeys as string[]"
+    :propagate-select="!checkStrictly"
+    :bubble-select="!checkStrictly"
+    :multiple="multiple"
+    :disabled="disabled"
+    :selection-behavior="allowClear || multiple ? 'toggle' : 'replace'"
+    @update:model-value="updateModelValue"
+    v-slot="{ flattenItems }"
+    :class="
+      cn(
+        'text-blackA11 container list-none rounded-lg text-sm font-medium select-none',
+        $attrs.class as unknown as ClassType,
+        bordered ? 'border' : '',
+      )
+    "
+  >
+    <div
+      :class="
+        cn('my-0.5 flex w-full items-center p-1', bordered ? 'border-b' : '')
+      "
+      v-if="$slots.header"
+    >
+      <slot name="header"> </slot>
+    </div>
+    <div
+      :class="
+        cn('my-0.5 flex w-full items-center p-1', bordered ? 'border-b' : '')
+      "
+      v-if="treeData.length > 0"
+    >
+      <div
+        class="flex size-5 flex-1 cursor-pointer items-center"
+        @click="() => (expanded?.length > 0 ? collapseAll() : expandAll())"
+      >
+        <ChevronRight
+          :class="{ 'rotate-90': expanded?.length > 0 }"
+          class="text-foreground/80 hover:text-foreground size-4 cursor-pointer transition"
+        />
+        <div class="flex items-center gap-1 item-all-checkbox">
+          <Checkbox
+            v-if="multiple"
+            :model-value="selectAllStatus"
+            :indeterminate="selectAllStatus === 'indeterminate'"
+            @click.stop
+            @update:model-value="onSelectAllChange"
+          />
+          <span v-if="selectAllLabel">{{ selectAllLabel }}</span>
+        </div>
+      </div>
+    </div>
+    <TransitionGroup :name="transition ? 'fade' : ''">
+      <TreeItem
+        v-for="item in flattenItems"
+        v-slot="{
+          isExpanded,
+          isSelected,
+          isIndeterminate,
+          handleSelect,
+          handleToggle,
+        }"
+        :key="item._id"
+        :style="{ 'margin-left': `${item.level - 1}rem` }"
+        :class="
+          cn('cursor-pointer', getNodeClass?.(item), {
+            'data-[selected]:bg-accent': !multiple,
+            'text-foreground/50 cursor-not-allowed': isNodeDisabled(item),
+          })
+        "
+        v-bind="
+          Object.assign(item.bind, {
+            onfocus: isNodeDisabled(item) ? 'this.blur()' : undefined,
+            disabled: isNodeDisabled(item),
+          })
+        "
+        @select="
+          (event: any) => {
+            if (isNodeDisabled(item)) {
+              event.preventDefault();
+              event.stopPropagation();
+              return;
+            }
+            if (event.detail.originalEvent.type === 'click') {
+              event.preventDefault();
+            }
+            onSelect(item, event.detail.isSelected);
+          }
+        "
+        @toggle="
+          (event: any) => {
+            if (event.detail.originalEvent.type === 'click') {
+              event.preventDefault();
+            }
+            !isNodeDisabled(item) && onToggle(item);
+          }
+        "
+        class="tree-node focus:ring-grass8 my-0.5 flex items-center rounded p-1 outline-hidden"
+      >
+        <!-- class="hover:ring-2" 鼠标移动上去时2px的圆环边框 -->
+        <ChevronRight
+          v-if="
+            item.hasChildren &&
+            Array.isArray(item.value[childrenField]) &&
+            item.value[childrenField].length > 0
+          "
+          class="text-foreground/80 hover:text-foreground size-4 cursor-pointer transition"
+          :class="{ 'rotate-90': isExpanded }"
+          @click.stop="
+            () => {
+              handleToggle();
+              onToggle(item);
+            }
+          "
+        />
+        <div v-else class="h-4 w-4"></div>
+        <div class="flex items-center gap-1 item-checkbox">
+          <Checkbox
+            v-if="multiple"
+            :model-value="isSelected && !isNodeDisabled(item)"
+            :disabled="isNodeDisabled(item)"
+            :indeterminate="isIndeterminate && !isNodeDisabled(item)"
+            @click="
+              (event: MouseEvent) => {
+                if (isNodeDisabled(item)) {
+                  event.preventDefault();
+                  event.stopPropagation();
+                  return;
+                }
+                handleSelect();
+              }
+            "
+          />
+          <div
+            class="flex items-center gap-1 item-checkbox"
+            :title="get(item.value, labelField)"
+            @click="
+              (event: MouseEvent) => {
+                if (isNodeDisabled(item)) {
+                  event.preventDefault();
+                  event.stopPropagation();
+                  return;
+                }
+                handleSelect();
+              }
+            "
+          >
+            <slot name="node" v-bind="item">
+              <IconifyIcon
+                class="size-4"
+                v-if="showIcon && get(item.value, iconField)"
+                :icon="get(item.value, iconField)"
+              />
+              {{ get(item.value, labelField) }}
+            </slot>
+          </div>
+        </div>
+        <div class="h-4 w-4"></div>
+      </TreeItem>
+    </TransitionGroup>
+    <div
+      :class="
+        cn('my-0.5 flex w-full items-center p-1', bordered ? 'border-t' : '')
+      "
+      v-if="$slots.footer"
+    >
+      <slot name="footer"> </slot>
+    </div>
+  </TreeRoot>
+</template>
+<style lang="scss" scoped>
+.container {
+  position: relative;
+  padding: 0;
+  list-style-type: none;
+}
+
+.item {
+  box-sizing: border-box;
+  width: 100%;
+  height: 30px;
+  background-color: #f3f3f3;
+  border: 1px solid #666;
+}
+
+.item-checkbox {
+  width: 100%;
+  overflow: hidden;
+}
+
+.item-all-checkbox {
+  width: 100%;
+  overflow: hidden;
+
+  .text-label {
+    margin-left: 8px;
+  }
+}
+
+/* 1. 声明过渡效果 */
+.fade-move,
+.fade-enter-active,
+.fade-leave-active {
+  transition: all 0.5s cubic-bezier(0.55, 0, 0.1, 1);
+}
+
+/* 2. 声明进入和离开的状态 */
+.fade-enter-from,
+.fade-leave-to {
+  opacity: 0;
+  transform: scaleY(0.01) translate(30px, 0);
+}
+
+/* 3. 确保离开的项目被移除出了布局流
+      以便正确地计算移动时的动画效果。 */
+.fade-leave-active {
+  position: absolute;
+}
+</style>
diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/tree/types.ts b/packages/@core/ui-kit/shadcn-ui/src/ui/tree/types.ts
new file mode 100644
index 00000000..b962a7ee
--- /dev/null
+++ b/packages/@core/ui-kit/shadcn-ui/src/ui/tree/types.ts
@@ -0,0 +1,64 @@
+import type { Arrayable } from '@vueuse/core';
+import type { FlattenedItem } from 'reka-ui';
+
+import type { Recordable } from '@vben-core/typings';
+
+export interface TreeProps {
+  /** 单选时允许取消已有选项 */
+  allowClear?: boolean;
+  /** 非关联选择时，自动选中上级节点 */
+  autoCheckParent?: boolean;
+  /** 显示边框 */
+  bordered?: boolean;
+  /** 取消父子关联选择 */
+  checkStrictly?: boolean;
+  /** 子级字段名 */
+  childrenField?: string;
+  /** 默认展开的键 */
+  defaultExpandedKeys?: Array<number | string>;
+  /** 默认展开的级别（优先级高于defaultExpandedKeys） */
+  defaultExpandedLevel?: number;
+  /** 默认值 */
+  defaultValue?: Arrayable<number | string>;
+  /** 禁用 */
+  disabled?: boolean;
+  /** 禁用字段名 */
+  disabledField?: string;
+  /** 自定义节点类名 */
+  getNodeClass?: (item: FlattenedItem<Recordable<any>>) => string;
+  iconField?: string;
+  /** label字段 */
+  labelField?: string;
+  /** 是否多选 */
+  multiple?: boolean;
+  /** 选择全部时的文字 */
+  selectAllLabel?: string;
+  /** 显示由iconField指定的图标 */
+  showIcon?: boolean;
+  /** 启用展开收缩动画 */
+  transition?: boolean;
+  /** 树数据 */
+  treeData: Recordable<any>[];
+  /** 值字段 */
+  valueField?: string;
+}
+
+export function treePropsDefaults() {
+  return {
+    allowClear: false,
+    autoCheckParent: true,
+    bordered: false,
+    checkStrictly: false,
+    defaultExpandedKeys: () => [],
+    defaultExpandedLevel: 0,
+    disabled: false,
+    disabledField: 'disabled',
+    iconField: 'icon',
+    labelField: 'label',
+    multiple: false,
+    showIcon: true,
+    transition: true,
+    valueField: 'value',
+    childrenField: 'children',
+  };
+}
diff --git a/packages/@core/ui-kit/shadcn-ui/tailwind.config.mjs b/packages/@core/ui-kit/shadcn-ui/tailwind.config.mjs
deleted file mode 100644
index f17f556f..00000000
--- a/packages/@core/ui-kit/shadcn-ui/tailwind.config.mjs
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from '@vben/tailwind-config';
diff --git a/packages/@core/ui-kit/shadcn-ui/tsconfig.json b/packages/@core/ui-kit/shadcn-ui/tsconfig.json
index 0a46bc57..db13af04 100644
--- a/packages/@core/ui-kit/shadcn-ui/tsconfig.json
+++ b/packages/@core/ui-kit/shadcn-ui/tsconfig.json
@@ -2,7 +2,6 @@
   "$schema": "https://json.schemastore.org/tsconfig",
   "extends": "@vben/tsconfig/web.json",
   "compilerOptions": {
-    "baseUrl": ".",
     "paths": {
       "@vben-core/shadcn-ui/*": ["./src/*"]
     }
diff --git a/packages/@core/ui-kit/tabs-ui/build.config.ts b/packages/@core/ui-kit/tabs-ui/build.config.ts
deleted file mode 100644
index 18eaa604..00000000
--- a/packages/@core/ui-kit/tabs-ui/build.config.ts
+++ /dev/null
@@ -1,21 +0,0 @@
-import { defineBuildConfig } from 'unbuild';
-
-export default defineBuildConfig({
-  clean: true,
-  declaration: true,
-  entries: [
-    {
-      builder: 'mkdist',
-      input: './src',
-      loaders: ['vue'],
-      pattern: ['**/*.vue'],
-    },
-    {
-      builder: 'mkdist',
-      format: 'esm',
-      input: './src',
-      loaders: ['js'],
-      pattern: ['**/*.ts'],
-    },
-  ],
-});
diff --git a/packages/@core/ui-kit/tabs-ui/package.json b/packages/@core/ui-kit/tabs-ui/package.json
index 7e98a842..75d0fd85 100644
--- a/packages/@core/ui-kit/tabs-ui/package.json
+++ b/packages/@core/ui-kit/tabs-ui/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vben-core/tabs-ui",
-  "version": "5.5.1",
+  "version": "5.7.0",
   "homepage": "https://github.com/vbenjs/vue-vben-admin",
   "bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
   "repository": {
@@ -11,7 +11,7 @@
   "license": "MIT",
   "type": "module",
   "scripts": {
-    "build": "pnpm unbuild",
+    "build": "pnpm exec tsdown",
     "prepublishOnly": "npm run build"
   },
   "files": [
@@ -22,26 +22,33 @@
   ],
   "main": "./dist/index.mjs",
   "module": "./dist/index.mjs",
+  "types": "./dist/index.d.ts",
   "exports": {
     ".": {
       "types": "./src/index.ts",
       "development": "./src/index.ts",
+      "production": "./src/index.ts",
       "default": "./dist/index.mjs"
     }
   },
   "publishConfig": {
     "exports": {
       ".": {
+        "types": "./dist/index.d.ts",
         "default": "./dist/index.mjs"
       }
     }
   },
   "dependencies": {
     "@vben-core/composables": "workspace:*",
+    "@vben-core/design": "workspace:*",
     "@vben-core/icons": "workspace:*",
     "@vben-core/shadcn-ui": "workspace:*",
     "@vben-core/typings": "workspace:*",
     "@vueuse/core": "catalog:",
     "vue": "catalog:"
+  },
+  "devDependencies": {
+    "unplugin-vue": "catalog:"
   }
 }
diff --git a/packages/@core/ui-kit/tabs-ui/postcss.config.mjs b/packages/@core/ui-kit/tabs-ui/postcss.config.mjs
deleted file mode 100644
index 3d807045..00000000
--- a/packages/@core/ui-kit/tabs-ui/postcss.config.mjs
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from '@vben/tailwind-config/postcss';
diff --git a/packages/@core/ui-kit/tabs-ui/src/components/index.ts b/packages/@core/ui-kit/tabs-ui/src/components/index.ts
index 3c28c946..eafeaa6e 100644
--- a/packages/@core/ui-kit/tabs-ui/src/components/index.ts
+++ b/packages/@core/ui-kit/tabs-ui/src/components/index.ts
@@ -1,2 +1,2 @@
-export { default as Tabs } from './tabs/tabs.vue';
 export { default as TabsChrome } from './tabs-chrome/tabs.vue';
+export { default as Tabs } from './tabs/tabs.vue';
diff --git a/packages/@core/ui-kit/tabs-ui/src/components/tabs-chrome/tabs.vue b/packages/@core/ui-kit/tabs-ui/src/components/tabs-chrome/tabs.vue
index 7ab875a7..afec30a7 100644
--- a/packages/@core/ui-kit/tabs-ui/src/components/tabs-chrome/tabs.vue
+++ b/packages/@core/ui-kit/tabs-ui/src/components/tabs-chrome/tabs.vue
@@ -12,7 +12,6 @@ interface Props extends TabsProps {}
 
 defineOptions({
   name: 'VbenTabsChrome',
-  // eslint-disable-next-line perfectionist/sort-objects
   inheritAttrs: false,
 });
 
@@ -29,7 +28,9 @@ const emit = defineEmits<{
 }>();
 const active = defineModel<string>('active');
 
+// @ts-expect-error - unused
 const contentRef = ref();
+// @ts-expect-error - unused
 const tabRef = ref();
 
 const style = computed(() => {
@@ -41,14 +42,14 @@ const style = computed(() => {
 
 const tabsView = computed(() => {
   return props.tabs.map((tab) => {
-    const { fullPath, meta, name, path } = tab || {};
+    const { fullPath, meta, name, path, key } = tab || {};
     const { affixTab, icon, newTabTitle, tabClosable, title } = meta || {};
     return {
       affixTab: !!affixTab,
       closable: Reflect.has(meta, 'tabClosable') ? !!tabClosable : true,
       fullPath,
       icon: icon as string,
-      key: fullPath || path,
+      key,
       meta,
       name,
       path,
@@ -56,6 +57,20 @@ const tabsView = computed(() => {
     } as TabConfig;
   });
 });
+
+function onMouseDown(e: MouseEvent, tab: TabConfig) {
+  if (
+    e.button === 1 &&
+    tab.closable &&
+    !tab.affixTab &&
+    tabsView.value.length > 1 &&
+    props.middleClickToClose
+  ) {
+    e.preventDefault();
+    e.stopPropagation();
+    emit('close', tab.key);
+  }
+}
 </script>
 
 <template>
@@ -63,7 +78,7 @@ const tabsView = computed(() => {
     ref="contentRef"
     :class="contentClass"
     :style="style"
-    class="tabs-chrome !flex h-full w-max overflow-y-hidden pr-6"
+    class="tabs-chrome flex! h-full w-max overflow-y-hidden pr-6"
   >
     <TransitionGroup name="slide-left">
       <div
@@ -79,9 +94,10 @@ const tabsView = computed(() => {
         ]"
         :data-active-tab="active"
         :data-index="i"
-        class="tabs-chrome__item draggable translate-all group relative -mr-3 flex h-full select-none items-center"
+        class="draggable group tabs-chrome__item translate-all relative -mr-3 flex h-full items-center select-none"
         data-tab-item="true"
         @click="active = tab.key"
+        @mousedown="onMouseDown($event, tab)"
       >
         <VbenContextMenu
           :handler-data="tab"
@@ -93,24 +109,24 @@ const tabsView = computed(() => {
             <!-- divider -->
             <div
               v-if="i !== 0 && tab.key !== active"
-              class="tabs-chrome__divider bg-border absolute left-[var(--gap)] top-1/2 z-0 h-4 w-[1px] translate-y-[-50%] transition-all"
+              class="tabs-chrome__divider absolute top-1/2 left-(--gap) z-0 h-4 w-px translate-y-[-50%] bg-border transition-all"
             ></div>
             <!-- background -->
             <div
               class="tabs-chrome__background absolute z-[-1] size-full px-[calc(var(--gap)-1px)] py-0 transition-opacity duration-150"
             >
               <div
-                class="tabs-chrome__background-content group-[.is-active]:bg-primary/15 dark:group-[.is-active]:bg-accent h-full rounded-tl-[var(--gap)] rounded-tr-[var(--gap)] duration-150"
+                class="tabs-chrome__background-content h-full rounded-tl-(--gap) rounded-tr-(--gap) duration-150 group-[.is-active]:bg-primary/15 group-[.is-active]:dark:bg-accent"
               ></div>
               <svg
-                class="tabs-chrome__background-before group-[.is-active]:fill-primary/15 dark:group-[.is-active]:fill-accent absolute bottom-0 left-[-1px] fill-transparent transition-all duration-150"
+                class="tabs-chrome__background-before absolute bottom-0 -left-px fill-transparent transition-all duration-150 group-[.is-active]:fill-primary/15 group-[.is-active]:dark:fill-accent"
                 height="7"
                 width="7"
               >
                 <path d="M 0 7 A 7 7 0 0 0 7 0 L 7 7 Z" />
               </svg>
               <svg
-                class="tabs-chrome__background-after group-[.is-active]:fill-primary/15 dark:group-[.is-active]:fill-accent absolute bottom-0 right-[-1px] fill-transparent transition-all duration-150"
+                class="tabs-chrome__background-after absolute -right-px bottom-0 fill-transparent transition-all duration-150 group-[.is-active]:fill-primary/15 group-[.is-active]:dark:fill-accent"
                 height="7"
                 width="7"
               >
@@ -120,32 +136,32 @@ const tabsView = computed(() => {
 
             <!-- extra -->
             <div
-              class="tabs-chrome__extra absolute right-[var(--gap)] top-1/2 z-[3] size-4 translate-y-[-50%]"
+              class="tabs-chrome__extra absolute top-1/2 right-(--gap) z-3 size-4 translate-y-[-50%]"
             >
               <!-- close-icon -->
               <X
                 v-show="!tab.affixTab && tabsView.length > 1 && tab.closable"
-                class="hover:bg-accent stroke-accent-foreground/80 hover:stroke-accent-foreground text-accent-foreground/80 group-[.is-active]:text-accent-foreground mt-[2px] size-3 cursor-pointer rounded-full transition-all"
+                class="mt-0.5 size-3 cursor-pointer rounded-full stroke-accent-foreground/80 text-accent-foreground/80 transition-all group-[.is-active]:text-accent-foreground hover:bg-accent hover:stroke-accent-foreground"
                 @click.stop="() => emit('close', tab.key)"
               />
               <Pin
                 v-show="tab.affixTab && tabsView.length > 1 && tab.closable"
-                class="hover:text-accent-foreground text-accent-foreground/80 group-[.is-active]:text-accent-foreground mt-[1px] size-3.5 cursor-pointer rounded-full transition-all"
+                class="mt-px size-3.5 cursor-pointer rounded-full text-accent-foreground/80 transition-all group-[.is-active]:text-accent-foreground hover:text-accent-foreground"
                 @click.stop="() => emit('unpin', tab)"
               />
             </div>
 
             <!-- tab-item-main -->
             <div
-              class="tabs-chrome__item-main group-[.is-active]:text-primary dark:group-[.is-active]:text-accent-foreground text-accent-foreground z-[2] mx-[calc(var(--gap)*2)] my-0 flex h-full items-center overflow-hidden rounded-tl-[5px] rounded-tr-[5px] pl-2 pr-4 duration-150"
+              class="tabs-chrome__item-main z-2 mx-[calc(var(--gap)*2)] my-0 flex h-full items-center overflow-hidden rounded-tl-[5px] rounded-tr-[5px] pr-4 pl-2 text-accent-foreground duration-150 group-[.is-active]:text-primary group-[.is-active]:dark:text-accent-foreground"
             >
               <VbenIcon
                 v-if="showIcon"
                 :icon="tab.icon"
-                class="mr-1 flex size-4 items-center overflow-hidden"
+                class="mr-1 flex size-4 items-center overflow-hidden group-hover:animate-[shrink_0.3s_ease-in-out]"
               />
 
-              <span class="flex-1 overflow-hidden whitespace-nowrap text-sm">
+              <span class="flex-1 overflow-hidden text-sm whitespace-nowrap">
                 {{ tab.title }}
               </span>
             </div>
@@ -157,39 +173,39 @@ const tabsView = computed(() => {
 </template>
 
 <style scoped>
-.tabs-chrome {
-  &__item:not(.dragging) {
-    @apply cursor-pointer;
+@reference "@vben/tailwind-config/theme";
 
-    &:hover:not(.is-active) {
-      & + .tabs-chrome__item {
-        .tabs-chrome__divider {
-          @apply opacity-0;
-        }
-      }
+.tabs-chrome__item:not(.dragging) {
+  @apply cursor-pointer;
+}
 
-      .tabs-chrome__divider {
-        @apply opacity-0;
-      }
+.tabs-chrome__item:not(.dragging):hover:not(.is-active)
+  + .tabs-chrome__item
+  .tabs-chrome__divider {
+  @apply opacity-0;
+}
 
-      .tabs-chrome__background {
-        @apply pb-[2px];
+.tabs-chrome__item:not(.dragging):hover:not(.is-active) .tabs-chrome__divider {
+  @apply opacity-0;
+}
 
-        &-content {
-          @apply bg-accent mx-[2px] rounded-md;
-        }
-      }
-    }
+.tabs-chrome__item:not(.dragging):hover:not(.is-active)
+  .tabs-chrome__background {
+  @apply pb-0.5;
+}
 
-    &.is-active {
-      @apply z-[2];
+.tabs-chrome__item:not(.dragging):hover:not(.is-active)
+  .tabs-chrome__background-content {
+  @apply bg-accent mx-0.5 rounded-md;
+}
 
-      & + .tabs-chrome__item {
-        .tabs-chrome__divider {
-          @apply opacity-0 !important;
-        }
-      }
-    }
-  }
+.tabs-chrome__item:not(.dragging).is-active {
+  @apply z-[2];
+}
+
+.tabs-chrome__item:not(.dragging).is-active
+  + .tabs-chrome__item
+  .tabs-chrome__divider {
+  @apply opacity-0!;
 }
 </style>
diff --git a/packages/@core/ui-kit/tabs-ui/src/components/tabs/tabs.vue b/packages/@core/ui-kit/tabs-ui/src/components/tabs/tabs.vue
index ba77aabe..1c921897 100644
--- a/packages/@core/ui-kit/tabs-ui/src/components/tabs/tabs.vue
+++ b/packages/@core/ui-kit/tabs-ui/src/components/tabs/tabs.vue
@@ -12,7 +12,7 @@ interface Props extends TabsProps {}
 
 defineOptions({
   name: 'VbenTabs',
-  // eslint-disable-next-line perfectionist/sort-objects
+
   inheritAttrs: false,
 });
 const props = withDefaults(defineProps<Props>(), {
@@ -30,7 +30,7 @@ const active = defineModel<string>('active');
 const typeWithClass = computed(() => {
   const typeClasses: Record<string, { content: string }> = {
     brisk: {
-      content: `h-full after:content-['']  after:absolute after:bottom-0 after:left-0 after:w-full after:h-[1.5px] after:bg-primary after:scale-x-0 after:transition-[transform] after:ease-out after:duration-300 hover:after:scale-x-100 after:origin-left [&.is-active]:after:scale-x-100 [&:not(:first-child)]:border-l last:border-r last:border-r border-border`,
+      content: `h-full after:content-[''] after:absolute after:bottom-0 after:left-0 after:w-full after:h-[1.5px] after:bg-primary after:scale-x-0 after:transition-[transform] after:ease-out after:duration-300 hover:after:scale-x-100 after:origin-left [&.is-active]:after:scale-x-100 [&:not(:first-child)]:border-l last:border-r last:border-r border-border`,
     },
     card: {
       content:
@@ -47,14 +47,14 @@ const typeWithClass = computed(() => {
 
 const tabsView = computed(() => {
   return props.tabs.map((tab) => {
-    const { fullPath, meta, name, path } = tab || {};
+    const { fullPath, meta, name, path, key } = tab || {};
     const { affixTab, icon, newTabTitle, tabClosable, title } = meta || {};
     return {
       affixTab: !!affixTab,
       closable: Reflect.has(meta, 'tabClosable') ? !!tabClosable : true,
       fullPath,
       icon: icon as string,
-      key: fullPath || path,
+      key,
       meta,
       name,
       path,
@@ -62,12 +62,26 @@ const tabsView = computed(() => {
     } as TabConfig;
   });
 });
+
+function onMouseDown(e: MouseEvent, tab: TabConfig) {
+  if (
+    e.button === 1 &&
+    tab.closable &&
+    !tab.affixTab &&
+    tabsView.value.length > 1 &&
+    props.middleClickToClose
+  ) {
+    e.preventDefault();
+    e.stopPropagation();
+    emit('close', tab.key);
+  }
+}
 </script>
 
 <template>
   <div
     :class="contentClass"
-    class="relative !flex h-full w-max items-center overflow-hidden pr-6"
+    class="relative flex! h-full w-max items-center overflow-hidden pr-6"
   >
     <TransitionGroup name="slide-left">
       <div
@@ -75,16 +89,17 @@ const tabsView = computed(() => {
         :key="tab.key"
         :class="[
           {
-            'is-active dark:bg-accent bg-primary/15': tab.key === active,
+            'is-active bg-primary/15 dark:bg-accent': tab.key === active,
             draggable: !tab.affixTab,
             'affix-tab': tab.affixTab,
           },
           typeWithClass.content,
         ]"
         :data-index="i"
-        class="tab-item [&:not(.is-active)]:hover:bg-accent translate-all group relative flex cursor-pointer select-none"
+        class="group tab-item translate-all relative flex cursor-pointer select-none [&:not(.is-active)]:hover:bg-accent"
         data-tab-item="true"
         @click="active = tab.key"
+        @mousedown="onMouseDown($event, tab)"
       >
         <VbenContextMenu
           :handler-data="tab"
@@ -95,33 +110,33 @@ const tabsView = computed(() => {
           <div class="relative flex size-full items-center">
             <!-- extra -->
             <div
-              class="absolute right-1.5 top-1/2 z-[3] translate-y-[-50%] overflow-hidden"
+              class="absolute top-1/2 right-1.5 z-3 translate-y-[-50%] overflow-hidden"
             >
               <!-- close-icon -->
               <X
                 v-show="!tab.affixTab && tabsView.length > 1 && tab.closable"
-                class="hover:bg-accent stroke-accent-foreground/80 hover:stroke-accent-foreground dark:group-[.is-active]:text-accent-foreground group-[.is-active]:text-primary size-3 cursor-pointer rounded-full transition-all"
+                class="size-3 cursor-pointer rounded-full stroke-accent-foreground/80 transition-all group-[.is-active]:text-primary hover:bg-accent hover:stroke-accent-foreground group-[.is-active]:dark:text-accent-foreground"
                 @click.stop="() => emit('close', tab.key)"
               />
               <Pin
                 v-show="tab.affixTab && tabsView.length > 1 && tab.closable"
-                class="hover:bg-accent hover:stroke-accent-foreground group-[.is-active]:text-primary dark:group-[.is-active]:text-accent-foreground mt-[1px] size-3.5 cursor-pointer rounded-full transition-all"
+                class="mt-px size-3.5 cursor-pointer rounded-full transition-all group-[.is-active]:text-primary hover:bg-accent hover:stroke-accent-foreground group-[.is-active]:dark:text-accent-foreground"
                 @click.stop="() => emit('unpin', tab)"
               />
             </div>
 
             <!-- tab-item-main -->
             <div
-              class="text-accent-foreground group-[.is-active]:text-primary dark:group-[.is-active]:text-accent-foreground mx-3 mr-4 flex h-full items-center overflow-hidden rounded-tl-[5px] rounded-tr-[5px] pr-3 transition-all duration-300"
+              class="mx-3 mr-4 flex h-full items-center overflow-hidden rounded-tl-[5px] rounded-tr-[5px] pr-3 text-accent-foreground transition-all duration-300 group-[.is-active]:text-primary group-[.is-active]:dark:text-accent-foreground"
             >
               <VbenIcon
                 v-if="showIcon"
                 :icon="tab.icon"
-                class="mr-2 flex size-4 items-center overflow-hidden"
+                class="mr-2 flex size-4 items-center overflow-hidden group-hover:animate-[shrink_0.3s_ease-in-out]"
                 fallback
               />
 
-              <span class="flex-1 overflow-hidden whitespace-nowrap text-sm">
+              <span class="flex-1 overflow-hidden text-sm whitespace-nowrap">
                 {{ tab.title }}
               </span>
             </div>
diff --git a/packages/@core/ui-kit/tabs-ui/src/components/widgets/index.ts b/packages/@core/ui-kit/tabs-ui/src/components/widgets/index.ts
index a26899ef..f7634ce8 100644
--- a/packages/@core/ui-kit/tabs-ui/src/components/widgets/index.ts
+++ b/packages/@core/ui-kit/tabs-ui/src/components/widgets/index.ts
@@ -1,2 +1,3 @@
 export { default as TabsToolMore } from './tool-more.vue';
+export { default as TabsToolRefresh } from './tool-refresh.vue';
 export { default as TabsToolScreen } from './tool-screen.vue';
diff --git a/packages/@core/ui-kit/tabs-ui/src/components/widgets/tool-more.vue b/packages/@core/ui-kit/tabs-ui/src/components/widgets/tool-more.vue
index 0cbfc73a..045a670b 100644
--- a/packages/@core/ui-kit/tabs-ui/src/components/widgets/tool-more.vue
+++ b/packages/@core/ui-kit/tabs-ui/src/components/widgets/tool-more.vue
@@ -1,7 +1,7 @@
 <script lang="ts" setup>
 import type { DropdownMenuProps } from '@vben-core/shadcn-ui';
 
-import { ChevronDown } from '@vben-core/icons';
+import { LayoutGrid } from '@vben-core/icons';
 import { VbenDropdownMenu } from '@vben-core/shadcn-ui';
 
 defineProps<DropdownMenuProps>();
@@ -10,9 +10,9 @@ defineProps<DropdownMenuProps>();
 <template>
   <VbenDropdownMenu :menus="menus" :modal="false">
     <div
-      class="flex-center hover:bg-muted hover:text-foreground text-muted-foreground border-border h-full cursor-pointer border-l px-2 text-lg font-semibold"
+      class="flex-center h-full cursor-pointer border-l border-border px-2 text-lg font-semibold text-muted-foreground hover:bg-muted hover:text-foreground"
     >
-      <ChevronDown class="size-4" />
+      <LayoutGrid class="size-4" />
     </div>
   </VbenDropdownMenu>
 </template>
diff --git a/packages/@core/ui-kit/tabs-ui/src/components/widgets/tool-refresh.vue b/packages/@core/ui-kit/tabs-ui/src/components/widgets/tool-refresh.vue
new file mode 100644
index 00000000..beb88dee
--- /dev/null
+++ b/packages/@core/ui-kit/tabs-ui/src/components/widgets/tool-refresh.vue
@@ -0,0 +1,18 @@
+<script lang="ts" setup>
+import { RotateCw } from '@vben-core/icons';
+
+const emit = defineEmits(['refresh']);
+
+const handleRefresh = () => {
+  emit('refresh');
+};
+</script>
+
+<template>
+  <div
+    class="flex-center h-full cursor-pointer border-l border-border px-2 text-lg font-semibold text-muted-foreground hover:bg-muted hover:text-foreground"
+    @click="handleRefresh"
+  >
+    <RotateCw class="size-4" />
+  </div>
+</template>
diff --git a/packages/@core/ui-kit/tabs-ui/src/components/widgets/tool-screen.vue b/packages/@core/ui-kit/tabs-ui/src/components/widgets/tool-screen.vue
index 01837190..acbf14e6 100644
--- a/packages/@core/ui-kit/tabs-ui/src/components/widgets/tool-screen.vue
+++ b/packages/@core/ui-kit/tabs-ui/src/components/widgets/tool-screen.vue
@@ -10,7 +10,7 @@ function toggleScreen() {
 
 <template>
   <div
-    class="flex-center hover:bg-muted hover:text-foreground text-muted-foreground border-border h-full cursor-pointer border-l px-2 text-lg font-semibold"
+    class="flex-center h-full cursor-pointer border-l border-border px-2 text-lg font-semibold text-muted-foreground hover:bg-muted hover:text-foreground"
     @click="toggleScreen"
   >
     <Minimize2 v-if="screen" class="size-4" />
diff --git a/packages/@core/ui-kit/tabs-ui/src/tabs-view.vue b/packages/@core/ui-kit/tabs-ui/src/tabs-view.vue
index daf9f77d..0f97f3b8 100644
--- a/packages/@core/ui-kit/tabs-ui/src/tabs-view.vue
+++ b/packages/@core/ui-kit/tabs-ui/src/tabs-view.vue
@@ -2,7 +2,7 @@
 import type { TabsEmits, TabsProps } from './types';
 
 import { useForwardPropsEmits } from '@vben-core/composables';
-import { ChevronLeft, ChevronRight } from '@vben-core/icons';
+import { ChevronsLeft, ChevronsRight } from '@vben-core/icons';
 import { VbenScrollbar } from '@vben-core/shadcn-ui';
 
 import { Tabs, TabsChrome } from './components';
@@ -29,6 +29,7 @@ const forward = useForwardPropsEmits(props, emit);
 const {
   handleScrollAt,
   handleWheel,
+  // @ts-expect-error unused
   scrollbarRef,
   scrollDirection,
   scrollIsAtLeft,
@@ -53,18 +54,18 @@ useTabsDrag(props, emit);
     <span
       v-show="showScrollButton"
       :class="{
-        'hover:bg-muted text-muted-foreground cursor-pointer': !scrollIsAtLeft,
+        'cursor-pointer text-muted-foreground hover:bg-muted': !scrollIsAtLeft,
         'pointer-events-none opacity-30': scrollIsAtLeft,
       }"
       class="border-r px-2"
       @click="scrollDirection('left')"
     >
-      <ChevronLeft class="size-4 h-full" />
+      <ChevronsLeft class="size-4 h-full" />
     </span>
 
     <div
       :class="{
-        'pt-[3px]': styleType === 'chrome',
+        'pt-0.75': styleType === 'chrome',
       }"
       class="size-full flex-1 overflow-hidden"
     >
@@ -94,13 +95,13 @@ useTabsDrag(props, emit);
     <span
       v-show="showScrollButton"
       :class="{
-        'hover:bg-muted text-muted-foreground cursor-pointer': !scrollIsAtRight,
+        'cursor-pointer text-muted-foreground hover:bg-muted': !scrollIsAtRight,
         'pointer-events-none opacity-30': scrollIsAtRight,
       }"
-      class="hover:bg-muted text-muted-foreground cursor-pointer border-l px-2"
+      class="cursor-pointer border-l px-2 text-muted-foreground hover:bg-muted"
       @click="scrollDirection('right')"
     >
-      <ChevronRight class="size-4 h-full" />
+      <ChevronsRight class="size-4 h-full" />
     </span>
   </div>
 </template>
diff --git a/packages/@core/ui-kit/tabs-ui/src/types.ts b/packages/@core/ui-kit/tabs-ui/src/types.ts
index 842fd42c..19ecf03a 100644
--- a/packages/@core/ui-kit/tabs-ui/src/types.ts
+++ b/packages/@core/ui-kit/tabs-ui/src/types.ts
@@ -33,6 +33,11 @@ export interface TabsProps {
    * 仅限 tabs-chrome
    */
   maxWidth?: number;
+  /**
+   * @zh_CN 点击中键时关闭Tab
+   */
+  middleClickToClose?: boolean;
+
   /**
    * @zh_CN tab最小宽度
    * 仅限 tabs-chrome
@@ -43,11 +48,11 @@ export interface TabsProps {
    * @zh_CN 是否显示图标
    */
   showIcon?: boolean;
-
   /**
    * @zh_CN 标签页风格
    */
   styleType?: TabsStyleType;
+
   /**
    * @zh_CN 选项卡数据
    */
diff --git a/packages/@core/ui-kit/tabs-ui/src/use-tabs-drag.ts b/packages/@core/ui-kit/tabs-ui/src/use-tabs-drag.ts
index db4b7ce8..b9c2e8a0 100644
--- a/packages/@core/ui-kit/tabs-ui/src/use-tabs-drag.ts
+++ b/packages/@core/ui-kit/tabs-ui/src/use-tabs-drag.ts
@@ -1,14 +1,11 @@
+import type { Sortable } from '@vben-core/composables';
 import type { EmitType } from '@vben-core/typings';
 
 import type { TabsProps } from './types';
 
 import { nextTick, onMounted, onUnmounted, ref, watch } from 'vue';
 
-import {
-  type Sortable,
-  useIsMobile,
-  useSortable,
-} from '@vben-core/composables';
+import { useIsMobile, useSortable } from '@vben-core/composables';
 
 // 可能会找到拖拽的子元素，这里需要确保拖拽的dom时tab元素
 function findParentElement(element: HTMLElement) {
diff --git a/packages/@core/ui-kit/tabs-ui/src/use-tabs-view-scroll.ts b/packages/@core/ui-kit/tabs-ui/src/use-tabs-view-scroll.ts
index 5d5b846d..aef32dfa 100644
--- a/packages/@core/ui-kit/tabs-ui/src/use-tabs-view-scroll.ts
+++ b/packages/@core/ui-kit/tabs-ui/src/use-tabs-view-scroll.ts
@@ -59,7 +59,7 @@ export function useTabsViewScroll(props: TabsProps) {
     }
 
     const viewportEl = scrollbarEl?.querySelector(
-      'div[data-radix-scroll-area-viewport]',
+      'div[data-reka-scroll-area-viewport]',
     );
 
     scrollViewportEl.value = viewportEl;
@@ -144,7 +144,7 @@ export function useTabsViewScroll(props: TabsProps) {
 
   function handleWheel({ deltaY }: WheelEvent) {
     scrollViewportEl.value?.scrollBy({
-      behavior: 'smooth',
+      // behavior: 'smooth',
       left: deltaY * 3,
     });
   }
diff --git a/packages/@core/ui-kit/tabs-ui/tailwind.config.mjs b/packages/@core/ui-kit/tabs-ui/tailwind.config.mjs
deleted file mode 100644
index f17f556f..00000000
--- a/packages/@core/ui-kit/tabs-ui/tailwind.config.mjs
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from '@vben/tailwind-config';
diff --git a/packages/@core/ui-kit/tabs-ui/tsdown.config.ts b/packages/@core/ui-kit/tabs-ui/tsdown.config.ts
new file mode 100644
index 00000000..43e8cf1c
--- /dev/null
+++ b/packages/@core/ui-kit/tabs-ui/tsdown.config.ts
@@ -0,0 +1,21 @@
+import { defineConfig } from 'tsdown';
+import Vue from 'unplugin-vue/rolldown';
+
+export default defineConfig({
+  clean: true,
+  deps: {
+    skipNodeModulesBundle: true,
+  },
+  dts: {
+    vue: true,
+  },
+  entry: ['src/index.ts'],
+  format: ['esm'],
+  outExtensions: () => ({
+    dts: '.d.ts',
+    js: '.mjs',
+  }),
+  platform: 'neutral',
+  plugins: [Vue({ isProduction: true })],
+  unbundle: true,
+});
diff --git a/packages/constants/README.md b/packages/constants/README.md
index 1fae490b..67936a64 100644
--- a/packages/constants/README.md
+++ b/packages/constants/README.md
@@ -15,5 +15,5 @@ pnpm add @vben/constants
 ### 使用
 
 ```ts
-import { DEFAULT_HOME_PATH } from '@vben/constants';
+import { LOGIN_PATH } from '@vben/constants';
 ```
diff --git a/packages/constants/package.json b/packages/constants/package.json
index aeb73387..edf5533d 100644
--- a/packages/constants/package.json
+++ b/packages/constants/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vben/constants",
-  "version": "5.5.1",
+  "version": "5.7.0",
   "homepage": "https://github.com/vbenjs/vue-vben-admin",
   "bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
   "repository": {
diff --git a/packages/effects/access/package.json b/packages/effects/access/package.json
index ca991275..248a03b8 100644
--- a/packages/effects/access/package.json
+++ b/packages/effects/access/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vben/access",
-  "version": "5.5.1",
+  "version": "5.7.0",
   "homepage": "https://github.com/vbenjs/vue-vben-admin",
   "bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
   "repository": {
diff --git a/packages/effects/access/src/__tests__/accessible.test.ts b/packages/effects/access/src/__tests__/accessible.test.ts
new file mode 100644
index 00000000..f059ff10
--- /dev/null
+++ b/packages/effects/access/src/__tests__/accessible.test.ts
@@ -0,0 +1,240 @@
+import type { RouteRecordRaw } from '@vben/types';
+
+import { describe, expect, it } from 'vitest';
+
+import { generateAccessible } from '../accessible';
+
+// generateAccessible 会操作传入的 router 实例。这里用最小 stub 覆盖它实际调用的方法：
+// - getRoutes(): 返回 [] -> 不存在根路由 '/', 走 router.addRoute 分支
+// - addRoute/removeRoute: 空实现
+// 我们只断言返回的 accessibleRoutes 上自动生成的 redirect。
+function createRouterStub() {
+  return {
+    addRoute: () => {},
+    getRoutes: () => [],
+    removeRoute: () => {},
+  } as any;
+}
+
+async function generate(routes: RouteRecordRaw[]) {
+  const { accessibleRoutes } = await generateAccessible('frontend', {
+    router: createRouterStub(),
+    routes,
+  });
+  return accessibleRoutes;
+}
+
+function findByName(
+  routes: RouteRecordRaw[],
+  name: string,
+): RouteRecordRaw | undefined {
+  for (const route of routes) {
+    if (route.name === name) {
+      return route;
+    }
+    if (route.children) {
+      const found = findByName(route.children as RouteRecordRaw[], name);
+      if (found) {
+        return found;
+      }
+    }
+  }
+  return undefined;
+}
+
+describe('generateAccessible - redirect normalization', () => {
+  it('不为动态参数(:id)首子路由的父级生成 redirect', async () => {
+    const routes = [
+      {
+        name: 'DyeSets',
+        path: 'dye-sets',
+        children: [
+          {
+            name: 'DyeSetDetail',
+            path: ':id',
+            meta: { hideInMenu: true, title: 'detail' },
+          },
+        ],
+        meta: { title: 'dye-sets' },
+      },
+    ] as unknown as RouteRecordRaw[];
+
+    const result = await generate(routes);
+    expect(findByName(result, 'DyeSets')?.redirect).toBeUndefined();
+  });
+
+  it('父级为对象 redirect({name}) 且含 :id 子路由时不抛异常且不生成 redirect', async () => {
+    const routes = [
+      {
+        name: 'Production',
+        path: '/production',
+        redirect: { name: 'ProductionTasks' },
+        children: [
+          {
+            name: 'ProductionTasks',
+            path: 'production-tasks',
+            children: [
+              {
+                name: 'ProductionTaskDetail',
+                path: ':id',
+                meta: { hideInMenu: true, title: 'detail' },
+              },
+              {
+                name: 'ProductionTaskMatch',
+                path: ':id/match',
+                meta: { hideInMenu: true, title: 'match' },
+              },
+            ],
+            meta: { title: 'tasks' },
+          },
+        ],
+        meta: { title: 'production' },
+      },
+    ] as unknown as RouteRecordRaw[];
+
+    const result = await generate(routes);
+    // 顶级对象 redirect 保持不变
+    expect(findByName(result, 'Production')?.redirect).toEqual({
+      name: 'ProductionTasks',
+    });
+    // :id 首子路由的父级不生成 redirect
+    expect(findByName(result, 'ProductionTasks')?.redirect).toBeUndefined();
+  });
+
+  it('父级为对象 redirect 时，普通相对首子路由回退用 parent.path 拼接', async () => {
+    const routes = [
+      {
+        name: 'Setting',
+        path: '/setting',
+        redirect: { name: 'SettingService' },
+        children: [
+          {
+            name: 'SettingGroup',
+            path: 'group',
+            children: [
+              {
+                name: 'SettingService',
+                path: 'service',
+                meta: { title: 'service' },
+              },
+            ],
+            meta: { title: 'group' },
+          },
+        ],
+        meta: { title: 'setting' },
+      },
+    ] as unknown as RouteRecordRaw[];
+
+    const result = await generate(routes);
+    expect(findByName(result, 'SettingGroup')?.redirect).toBe(
+      '/setting/group/service',
+    );
+  });
+
+  it('深层嵌套(上游风格)相对路径逐级生成正确的累计绝对 redirect', async () => {
+    const routes = [
+      {
+        name: 'Demos',
+        path: '/demos',
+        children: [
+          {
+            name: 'NestedDemos',
+            path: 'nested',
+            children: [
+              {
+                name: 'Menu1Demo',
+                path: 'menu1',
+                meta: { title: 'menu1' },
+              },
+              {
+                name: 'Menu2Demo',
+                path: 'menu2',
+                children: [
+                  {
+                    name: 'Menu21Demo',
+                    path: 'menu2-1',
+                    meta: { title: 'menu2-1' },
+                  },
+                ],
+                meta: { title: 'menu2' },
+              },
+            ],
+            meta: { title: 'nested' },
+          },
+        ],
+        meta: { title: 'demos' },
+      },
+    ] as unknown as RouteRecordRaw[];
+
+    const result = await generate(routes);
+    // Demos 重定向到第一级子路由，子路由继续级联到叶子
+    expect(findByName(result, 'Demos')?.redirect).toBe('/demos/nested');
+    expect(findByName(result, 'NestedDemos')?.redirect).toBe(
+      '/demos/nested/menu1',
+    );
+    expect(findByName(result, 'Menu2Demo')?.redirect).toBe(
+      '/demos/nested/menu2/menu2-1',
+    );
+  });
+
+  it('首子路由为绝对路径(/foo)时不生成 redirect', async () => {
+    const routes = [
+      {
+        name: 'Dashboard',
+        path: '/dashboard',
+        children: [
+          {
+            name: 'Analytics',
+            path: '/analytics',
+            meta: { title: 'analytics' },
+          },
+        ],
+        meta: { title: 'dashboard' },
+      },
+    ] as unknown as RouteRecordRaw[];
+
+    const result = await generate(routes);
+    expect(findByName(result, 'Dashboard')?.redirect).toBeUndefined();
+  });
+
+  it('首子路由为空 path 时不生成 redirect', async () => {
+    const routes = [
+      {
+        name: 'HideChildrenParent',
+        path: 'hide-menu-children',
+        children: [
+          {
+            name: 'HideChildren',
+            path: '',
+            meta: { title: 'hide' },
+          },
+        ],
+        meta: { title: 'parent' },
+      },
+    ] as unknown as RouteRecordRaw[];
+
+    const result = await generate(routes);
+    expect(findByName(result, 'HideChildrenParent')?.redirect).toBeUndefined();
+  });
+
+  it('已存在的 redirect 保持不变', async () => {
+    const routes = [
+      {
+        name: 'Custom',
+        path: '/custom',
+        redirect: '/custom/keep',
+        children: [
+          {
+            name: 'CustomChild',
+            path: 'child',
+            meta: { title: 'child' },
+          },
+        ],
+        meta: { title: 'custom' },
+      },
+    ] as unknown as RouteRecordRaw[];
+
+    const result = await generate(routes);
+    expect(findByName(result, 'Custom')?.redirect).toBe('/custom/keep');
+  });
+});
diff --git a/packages/effects/access/src/accessible.ts b/packages/effects/access/src/accessible.ts
index c951d92a..f3d19fd8 100644
--- a/packages/effects/access/src/accessible.ts
+++ b/packages/effects/access/src/accessible.ts
@@ -1,14 +1,20 @@
+import type { Component, DefineComponent } from 'vue';
+
 import type {
   AccessModeType,
   GenerateMenuAndRoutesOptions,
   RouteRecordRaw,
 } from '@vben/types';
 
+import { defineComponent, h } from 'vue';
+
 import {
   cloneDeep,
   generateMenus,
   generateRoutesByBackend,
   generateRoutesByFrontend,
+  isFunction,
+  isString,
   mapTree,
 } from '@vben/utils';
 
@@ -19,16 +25,49 @@ async function generateAccessible(
   const { router } = options;
 
   options.routes = cloneDeep(options.routes);
+
   // 生成路由
   const accessibleRoutes = await generateRoutes(mode, options);
 
+  const root = router.getRoutes().find((item) => item.path === '/');
+
+  // 获取已有的路由名称列表
+  const names = root?.children?.map((item) => item.name) ?? [];
+
   // 动态添加到router实例内
   accessibleRoutes.forEach((route) => {
-    router.addRoute(route);
+    if (root && !route.meta?.noBasicLayout) {
+      // 为了兼容之前的版本用法，如果包含子路由，则将component移除，以免出现多层BasicLayout
+      // 如果你的项目已经跟进了本次修改，移除了所有自定义菜单首级的BasicLayout，可以将这段if代码删除
+      if (route.children && route.children.length > 0) {
+        delete route.component;
+      }
+      // 根据router name判断，如果路由已经存在，则不再添加
+      if (names?.includes(route.name)) {
+        // 找到已存在的路由索引并更新，不更新会造成切换用户时，一级目录未更新，homePath 在二级目录导致的404问题
+        const index = root.children?.findIndex(
+          (item) => item.name === route.name,
+        );
+        if (index !== undefined && index !== -1 && root.children) {
+          root.children[index] = route;
+        }
+      } else {
+        root.children?.push(route);
+      }
+    } else {
+      router.addRoute(route);
+    }
   });
 
+  if (root) {
+    if (root.name) {
+      router.removeRoute(root.name);
+    }
+    router.addRoute(root);
+  }
+
   // 生成菜单
-  const accessibleMenus = await generateMenus(accessibleRoutes, options.router);
+  const accessibleMenus = generateMenus(accessibleRoutes, options.router);
 
   return { accessibleMenus, accessibleRoutes };
 }
@@ -58,29 +97,144 @@ async function generateRoutes(
       );
       break;
     }
+    case 'mixed': {
+      const [frontend_resultRoutes, backend_resultRoutes] = await Promise.all([
+        generateRoutesByFrontend(routes, roles || [], forbiddenComponent),
+        generateRoutesByBackend(options),
+      ]);
+      resultRoutes = mergeRoutesByName(
+        backend_resultRoutes,
+        frontend_resultRoutes,
+      );
+      break;
+    }
   }
 
   /**
    * 调整路由树，做以下处理：
    * 1. 对未添加redirect的路由添加redirect
+   * 2. 将懒加载的组件名称修改为当前路由的名称（如果启用了keep-alive的话）
    */
-  resultRoutes = mapTree(resultRoutes, (route) => {
+  resultRoutes = mapTree(resultRoutes, (route, parent) => {
+    // 重新包装component，使用与路由名称相同的name以支持keep-alive的条件缓存。
+    if (
+      route.meta?.keepAlive &&
+      isFunction(route.component) &&
+      route.name &&
+      isString(route.name)
+    ) {
+      const originalComponent = route.component as () => Promise<{
+        default: Component | DefineComponent;
+      }>;
+      route.component = async () => {
+        const component = await originalComponent();
+        if (!component.default) return component;
+        return defineComponent({
+          name: route.name as string,
+          setup(props, { attrs, slots }) {
+            return () => h(component.default, { ...props, ...attrs }, slots);
+          },
+        });
+      };
+    }
+
     // 如果有redirect或者没有子路由，则直接返回
     if (route.redirect || !route.children || route.children.length === 0) {
       return route;
     }
     const firstChild = route.children[0];
 
-    // 如果子路由不是以/开头，则直接返回,这种情况需要计算全部父级的path才能得出正确的path，这里不做处理
-    if (!firstChild?.path || !firstChild.path.startsWith('/')) {
+    if (!firstChild?.path || firstChild.path.startsWith('/')) {
       return route;
     }
 
-    route.redirect = firstChild.path;
+    // fork 定制：如果第一个子路由是动态路由（如 :id），说明当前路由本身是一个
+    // “列表+详情”页面（渲染自身组件），不应自动重定向到未填充的动态参数，
+    // 否则地址栏会出现字面量 ":id" 或匹配失败导致 404。
+    // 详见对上游重构 commit f00a8812 的修复。
+    if (firstChild.path.startsWith(':')) {
+      return route;
+    }
+
+    // 拼接子路由的重定向绝对路径。
+    // - 当 parent.redirect 为字符串时，它已经是累计好的绝对路径，直接替换最后一段
+    //   即可正确支持任意层级的深层嵌套（如 /demos/nested/menu2/menu2-1）。
+    // - fork 定制：后端菜单可能传入对象形式的 redirect（如 { name }），无法 split，
+    //   此时回退到使用 parent.path 拼接（这类 parent 为顶级路由，path 为绝对路径）。
+    if (parent && parent.redirect && isString(parent.redirect)) {
+      const parentSplit = parent.redirect.split('/');
+      parentSplit.splice(-1, 2, route.path, firstChild.path);
+      const redirectPath = parentSplit.join('/');
+      route.redirect = redirectPath;
+    } else if (parent && parent.redirect) {
+      route.redirect = `${parent.path}/${route.path}/${firstChild.path}`;
+    } else {
+      route.redirect = `${route.path}/${firstChild.path}`;
+    }
+
     return route;
   });
 
   return resultRoutes;
 }
 
+/**
+ * 根据 name 合并前后端路由
+ * @param baseRoutes 后端路由
+ * @param extraRoutes 前端路由
+ */
+function mergeRoutesByName(
+  baseRoutes: RouteRecordRaw[],
+  extraRoutes: RouteRecordRaw[],
+): RouteRecordRaw[] {
+  const result: RouteRecordRaw[] = [];
+  const routeMap = new Map<string, RouteRecordRaw>();
+
+  for (const route of baseRoutes) {
+    const clone = { ...route } as RouteRecordRaw;
+    result.push(clone);
+    if (clone.name && isString(clone.name)) {
+      routeMap.set(clone.name as string, clone);
+    }
+  }
+
+  for (const route of extraRoutes) {
+    if (
+      route.name &&
+      isString(route.name) &&
+      routeMap.has(route.name as string)
+    ) {
+      const existing = routeMap.get(route.name as string);
+      if (!existing) {
+        continue;
+      }
+      const existingChildren = existing.children ?? [];
+      const routeChildren = route.children ?? [];
+
+      const merged = {
+        ...route,
+        ...existing, // keep backend as base
+        meta: {
+          ...route.meta,
+          ...existing.meta, // backend meta wins on conflicts
+        },
+      } as RouteRecordRaw;
+
+      if (existingChildren.length > 0 || routeChildren.length > 0) {
+        merged.children = mergeRoutesByName(existingChildren, routeChildren);
+      }
+
+      Object.assign(existing, merged);
+    } else {
+      const clone = { ...route } as RouteRecordRaw;
+      result.push(clone);
+      if (clone.name && isString(clone.name)) {
+        routeMap.set(clone.name as string, clone);
+      }
+    }
+  }
+
+  return result;
+}
+
 export { generateAccessible };
diff --git a/packages/effects/common-ui/package.json b/packages/effects/common-ui/package.json
index 5e318c63..e8168783 100644
--- a/packages/effects/common-ui/package.json
+++ b/packages/effects/common-ui/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vben/common-ui",
-  "version": "5.5.1",
+  "version": "5.7.0",
   "homepage": "https://github.com/vbenjs/vue-vben-admin",
   "bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
   "repository": {
@@ -17,9 +17,18 @@
     ".": {
       "types": "./src/index.ts",
       "default": "./src/index.ts"
+    },
+    "./es/tippy": {
+      "types": "./src/components/tippy/index.ts",
+      "default": "./src/components/tippy/index.ts"
+    },
+    "./es/loading": {
+      "types": "./src/components/loading/index.ts",
+      "default": "./src/components/loading/index.ts"
     }
   },
   "dependencies": {
+    "@vben-core/design": "workspace:*",
     "@vben-core/form-ui": "workspace:*",
     "@vben-core/popup-ui": "workspace:*",
     "@vben-core/preferences": "workspace:*",
@@ -32,11 +41,17 @@
     "@vben/types": "workspace:*",
     "@vueuse/core": "catalog:",
     "@vueuse/integrations": "catalog:",
+    "json-bigint": "catalog:",
     "qrcode": "catalog:",
+    "tippy.js": "catalog:",
     "vue": "catalog:",
-    "vue-router": "catalog:"
+    "vue-json-pretty": "catalog:",
+    "vue-router": "catalog:",
+    "vue-tippy": "catalog:"
   },
   "devDependencies": {
-    "@types/qrcode": "catalog:"
+    "@types/json-bigint": "catalog:",
+    "@types/qrcode": "catalog:",
+    "@vue/test-utils": "catalog:"
   }
 }
diff --git a/packages/effects/common-ui/src/components/api-component/api-component.vue b/packages/effects/common-ui/src/components/api-component/api-component.vue
index d1d42ad7..2c6d6931 100644
--- a/packages/effects/common-ui/src/components/api-component/api-component.vue
+++ b/packages/effects/common-ui/src/components/api-component/api-component.vue
@@ -1,63 +1,24 @@
 <script lang="ts" setup>
-import type { AnyPromiseFunction } from '@vben/types';
+import type {
+  ApiComponentProps,
+  ApiComponentOptionsItem as OptionsItem,
+} from './types';
 
-import { type Component, computed, ref, unref, useAttrs, watch } from 'vue';
+import { computed, nextTick, ref, unref, useAttrs, watch } from 'vue';
 
 import { LoaderCircle } from '@vben/icons';
-import { get, isEqual, isFunction } from '@vben-core/shared/utils';
+
+import { cloneDeep, get, isEqual, isFunction } from '@vben-core/shared/utils';
 
 import { objectOmit } from '@vueuse/core';
 
-type OptionsItem = {
-  [name: string]: any;
-  children?: OptionsItem[];
-  disabled?: boolean;
-  label?: string;
-  value?: string;
-};
-
-interface Props {
-  /** 组件 */
-  component: Component;
-  /** 是否将value从数字转为string */
-  numberToString?: boolean;
-  /** 获取options数据的函数 */
-  api?: (arg?: any) => Promise<OptionsItem[] | Record<string, any>>;
-  /** 传递给api的参数 */
-  params?: Record<string, any>;
-  /** 从api返回的结果中提取options数组的字段名 */
-  resultField?: string;
-  /** label字段名 */
-  labelField?: string;
-  /** children字段名，需要层级数据的组件可用 */
-  childrenField?: string;
-  /** value字段名 */
-  valueField?: string;
-  /** 组件接收options数据的属性名 */
-  optionsPropName?: string;
-  /** 是否立即调用api */
-  immediate?: boolean;
-  /** 每次`visibleEvent`事件发生时都重新请求数据 */
-  alwaysLoad?: boolean;
-  /** 在api请求之前的回调函数 */
-  beforeFetch?: AnyPromiseFunction<any, any>;
-  /** 在api请求之后的回调函数 */
-  afterFetch?: AnyPromiseFunction<any, any>;
-  /** 直接传入选项数据，也作为api返回空数据时的后备数据 */
-  options?: OptionsItem[];
-  /** 组件的插槽名称，用来显示一个"加载中"的图标 */
-  loadingSlot?: string;
-  /** 触发api请求的事件名 */
-  visibleEvent?: string;
-  /** 组件的v-model属性名，默认为modelValue。部分组件可能为value */
-  modelPropName?: string;
-}
-
 defineOptions({ name: 'ApiComponent', inheritAttrs: false });
 
-const props = withDefaults(defineProps<Props>(), {
+const props = withDefaults(defineProps<ApiComponentProps>(), {
   labelField: 'label',
   valueField: 'value',
+  labelFn: undefined,
+  disabledField: 'disabled',
   childrenField: '',
   optionsPropName: 'options',
   resultField: '',
@@ -68,9 +29,11 @@ const props = withDefaults(defineProps<Props>(), {
   alwaysLoad: false,
   loadingSlot: '',
   beforeFetch: undefined,
+  shouldFetch: undefined,
   afterFetch: undefined,
   modelPropName: 'modelValue',
   api: undefined,
+  autoSelect: false,
   options: () => [],
 });
 
@@ -78,37 +41,51 @@ const emit = defineEmits<{
   optionsChange: [OptionsItem[]];
 }>();
 
-const modelValue = defineModel({ default: '' });
+const modelValue = defineModel<any>({ default: undefined });
 
 const attrs = useAttrs();
-
+const innerParams = ref({});
 const refOptions = ref<OptionsItem[]>([]);
 const loading = ref(false);
 // 首次是否加载过了
 const isFirstLoaded = ref(false);
+// 标记是否有待处理的请求
+const hasPendingRequest = ref(false);
 
 const getOptions = computed(() => {
-  const { labelField, valueField, childrenField, numberToString } = props;
+  const {
+    labelField,
+    labelFn,
+    valueField,
+    disabledField,
+    childrenField,
+    numberToString,
+  } = props;
 
-  const refOptionsData = unref(refOptions);
-
-  function transformData(data: OptionsItem[]): OptionsItem[] {
+  function transformData(data: OptionsItem[] = []): OptionsItem[] {
     return data.map((item) => {
       const value = get(item, valueField);
+      const children = childrenField ? get(item, childrenField) : item.children;
       return {
-        ...objectOmit(item, [labelField, valueField, childrenField]),
-        label: get(item, labelField),
+        ...objectOmit(item, [
+          labelField,
+          valueField,
+          disabledField,
+          ...(childrenField ? [childrenField] : []),
+        ]),
+        label: labelFn ? labelFn(item) : get(item, labelField),
         value: numberToString ? `${value}` : value,
-        ...(childrenField && item[childrenField]
-          ? { children: transformData(item[childrenField]) }
+        disabled: get(item, disabledField),
+        ...(Array.isArray(children) && children.length > 0
+          ? { children: transformData(children) }
           : {}),
       };
     });
   }
 
-  const data: OptionsItem[] = transformData(refOptionsData);
+  const data = transformData(unref(refOptions));
 
-  return data.length > 0 ? data : props.options;
+  return data.length > 0 ? data : transformData(props.options);
 });
 
 const bindProps = computed(() => {
@@ -118,7 +95,7 @@ const bindProps = computed(() => {
     [`onUpdate:${props.modelPropName}`]: (val: string) => {
       modelValue.value = val;
     },
-    ...objectOmit(attrs, ['onUpdate:value']),
+    ...objectOmit(attrs, [`onUpdate:${props.modelPropName}`]),
     ...(props.visibleEvent
       ? {
           [props.visibleEvent]: handleFetchForVisible,
@@ -128,18 +105,34 @@ const bindProps = computed(() => {
 });
 
 async function fetchApi() {
-  let { api, beforeFetch, afterFetch, params, resultField } = props;
+  const { api, beforeFetch, shouldFetch, afterFetch, resultField } = props;
 
-  if (!api || !isFunction(api) || loading.value) {
+  if (!api || !isFunction(api)) {
     return;
   }
+
+  // 如果正在加载，标记有待处理的请求并返回
+  if (loading.value) {
+    hasPendingRequest.value = true;
+    return;
+  }
+
   refOptions.value = [];
   try {
     loading.value = true;
+    let finalParams = unref(mergedParams);
     if (beforeFetch && isFunction(beforeFetch)) {
-      params = (await beforeFetch(params)) || params;
+      finalParams = (await beforeFetch(cloneDeep(finalParams))) || finalParams;
     }
-    let res = await api(params);
+    // 判断是否需要控制执行中断
+    if (
+      shouldFetch &&
+      isFunction(shouldFetch) &&
+      !(await shouldFetch(finalParams))
+    ) {
+      return;
+    }
+    let res = await api(finalParams);
     if (afterFetch && isFunction(afterFetch)) {
       res = (await afterFetch(res)) || res;
     }
@@ -159,6 +152,13 @@ async function fetchApi() {
     isFirstLoaded.value = false;
   } finally {
     loading.value = false;
+    // 如果有待处理的请求，立即触发新的请求
+    if (hasPendingRequest.value) {
+      hasPendingRequest.value = false;
+      // 使用 nextTick 确保状态更新完成后再触发新请求
+      await nextTick();
+      fetchApi();
+    }
   }
 }
 
@@ -172,8 +172,15 @@ async function handleFetchForVisible(visible: boolean) {
   }
 }
 
+const mergedParams = computed(() => {
+  return {
+    ...props.params,
+    ...unref(innerParams),
+  };
+});
+
 watch(
-  () => props.params,
+  mergedParams,
   (value, oldValue) => {
     if (isEqual(value, oldValue)) {
       return;
@@ -184,22 +191,63 @@ watch(
 );
 
 function emitChange() {
+  if (
+    modelValue.value === undefined &&
+    props.autoSelect &&
+    unref(getOptions).length > 0
+  ) {
+    let firstOption;
+    if (isFunction(props.autoSelect)) {
+      firstOption = props.autoSelect(unref(getOptions));
+    } else {
+      switch (props.autoSelect) {
+        case 'first': {
+          firstOption = unref(getOptions)[0];
+          break;
+        }
+        case 'last': {
+          firstOption = unref(getOptions)[unref(getOptions).length - 1];
+          break;
+        }
+        case 'one': {
+          if (unref(getOptions).length === 1) {
+            firstOption = unref(getOptions)[0];
+          }
+          break;
+        }
+      }
+    }
+
+    if (firstOption) modelValue.value = firstOption.value;
+  }
   emit('optionsChange', unref(getOptions));
 }
+const componentRef = ref();
+defineExpose({
+  /** 获取options数据 */
+  getOptions: () => unref(getOptions),
+  /** 获取当前值 */
+  getValue: () => unref(modelValue),
+  /** 获取被包装的组件实例 */
+  getComponentRef: <T = any>() => componentRef.value as T,
+  /** 更新Api参数 */
+  updateParam(newParams: Record<string, any>) {
+    innerParams.value = newParams;
+  },
+});
 </script>
 <template>
-  <div v-bind="{ ...$attrs }">
-    <component
-      :is="component"
-      v-bind="bindProps"
-      :placeholder="$attrs.placeholder"
-    >
-      <template v-for="item in Object.keys($slots)" #[item]="data">
-        <slot :name="item" v-bind="data || {}"></slot>
-      </template>
-      <template v-if="loadingSlot && loading" #[loadingSlot]>
-        <LoaderCircle class="animate-spin" />
-      </template>
-    </component>
-  </div>
+  <component
+    :is="component"
+    v-bind="bindProps"
+    :placeholder="$attrs.placeholder"
+    ref="componentRef"
+  >
+    <template v-for="item in Object.keys($slots)" #[item]="data">
+      <slot :name="item" v-bind="data || {}"></slot>
+    </template>
+    <template v-if="loadingSlot && loading" #[loadingSlot]>
+      <LoaderCircle class="animate-spin" />
+    </template>
+  </component>
 </template>
diff --git a/packages/effects/common-ui/src/components/api-component/index.ts b/packages/effects/common-ui/src/components/api-component/index.ts
index 9815763c..173b30d1 100644
--- a/packages/effects/common-ui/src/components/api-component/index.ts
+++ b/packages/effects/common-ui/src/components/api-component/index.ts
@@ -1 +1,7 @@
 export { default as ApiComponent } from './api-component.vue';
+export type {
+  ApiComponentLabelFn,
+  ApiComponentOptionsItem,
+  ApiComponentProps,
+  ApiComponentSharedProps,
+} from './types';
diff --git a/packages/effects/common-ui/src/components/api-component/types.ts b/packages/effects/common-ui/src/components/api-component/types.ts
new file mode 100644
index 00000000..a771f78a
--- /dev/null
+++ b/packages/effects/common-ui/src/components/api-component/types.ts
@@ -0,0 +1,72 @@
+import type { Component } from 'vue';
+
+import type { AnyPromiseFunction } from '@vben/types';
+
+export type ApiComponentOptionsItem = {
+  [name: string]: any;
+  children?: ApiComponentOptionsItem[];
+  disabled?: boolean;
+  label?: string;
+  value?: number | string;
+};
+
+export type ApiComponentLabelFn = (item: ApiComponentOptionsItem) => string;
+
+export interface ApiComponentProps {
+  /** 组件 */
+  component: Component;
+  /** 是否将value从数字转为string */
+  numberToString?: boolean;
+  /** 获取options数据的函数 */
+  api?: (arg?: any) => Promise<ApiComponentOptionsItem[] | Record<string, any>>;
+  /** 传递给api的参数 */
+  params?: Record<string, any>;
+  /** 从api返回的结果中提取options数组的字段名 */
+  resultField?: string;
+  /** label字段名 */
+  labelField?: string;
+  /** 通过选项数据自定义label */
+  labelFn?: ApiComponentLabelFn;
+  /** children字段名，需要层级数据的组件可用 */
+  childrenField?: string;
+  /** value字段名 */
+  valueField?: string;
+  /** disabled字段名 */
+  disabledField?: string;
+  /** 组件接收options数据的属性名 */
+  optionsPropName?: string;
+  /** 是否立即调用api */
+  immediate?: boolean;
+  /** 每次`visibleEvent`事件发生时都重新请求数据 */
+  alwaysLoad?: boolean;
+  /** 在api请求之前的回调函数 */
+  beforeFetch?: AnyPromiseFunction<any, any>;
+  /** 在api请求之前的判断是否允许请求的回调函数 */
+  shouldFetch?: AnyPromiseFunction<any, boolean>;
+  /** 在api请求之后的回调函数 */
+  afterFetch?: AnyPromiseFunction<any, any>;
+  /** 直接传入选项数据，也作为api返回空数据时的后备数据 */
+  options?: ApiComponentOptionsItem[];
+  /** 组件的插槽名称，用来显示一个"加载中"的图标 */
+  loadingSlot?: string;
+  /** 触发api请求的事件名 */
+  visibleEvent?: string;
+  /** 组件的v-model属性名，默认为modelValue。部分组件可能为value */
+  modelPropName?: string;
+  /**
+   * 自动选择
+   * - `first`：自动选择第一个选项
+   * - `last`：自动选择最后一个选项
+   * - `one`: 当请求的结果只有一个选项时，自动选择该选项
+   * - 函数：自定义选择逻辑，函数的参数为请求的结果数组，返回值为选择的选项
+   * - false：不自动选择(默认)
+   */
+  autoSelect?:
+    | 'first'
+    | 'last'
+    | 'one'
+    | ((item: ApiComponentOptionsItem[]) => ApiComponentOptionsItem)
+    | false;
+}
+
+export type ApiComponentSharedProps = Omit<ApiComponentProps, 'component'>;
diff --git a/packages/effects/common-ui/src/components/captcha/hooks/useCaptchaPoints.ts b/packages/effects/common-ui/src/components/captcha/hooks/useCaptchaPoints.ts
index 511fb3b7..a3f61fd6 100644
--- a/packages/effects/common-ui/src/components/captcha/hooks/useCaptchaPoints.ts
+++ b/packages/effects/common-ui/src/components/captcha/hooks/useCaptchaPoints.ts
@@ -9,7 +9,7 @@ export function useCaptchaPoints() {
   }
 
   function clearPoints() {
-    points.splice(0, points.length);
+    points.splice(0);
   }
   return {
     addPoint,
diff --git a/packages/effects/common-ui/src/components/captcha/index.ts b/packages/effects/common-ui/src/components/captcha/index.ts
index 6ad68c49..13634cd4 100644
--- a/packages/effects/common-ui/src/components/captcha/index.ts
+++ b/packages/effects/common-ui/src/components/captcha/index.ts
@@ -3,4 +3,5 @@ export { default as PointSelectionCaptchaCard } from './point-selection-captcha/
 
 export { default as SliderCaptcha } from './slider-captcha/index.vue';
 export { default as SliderRotateCaptcha } from './slider-rotate-captcha/index.vue';
+export { default as SliderTranslateCaptcha } from './slider-translate-captcha/index.vue';
 export type * from './types';
diff --git a/packages/effects/common-ui/src/components/captcha/point-selection-captcha/index.vue b/packages/effects/common-ui/src/components/captcha/point-selection-captcha/index.vue
index d4b13619..c20f02fa 100644
--- a/packages/effects/common-ui/src/components/captcha/point-selection-captcha/index.vue
+++ b/packages/effects/common-ui/src/components/captcha/point-selection-captcha/index.vue
@@ -3,6 +3,7 @@ import type { CaptchaPoint, PointSelectionCaptchaProps } from '../types';
 
 import { RotateCw } from '@vben/icons';
 import { $t } from '@vben/locales';
+
 import { VbenButton, VbenIconButton } from '@vben-core/shadcn-ui';
 
 import { useCaptchaPoints } from '../hooks/useCaptchaPoints';
@@ -151,7 +152,7 @@ function handleConfirm() {
         top: `${point.y - POINT_OFFSET}px`,
         left: `${point.x - POINT_OFFSET}px`,
       }"
-      class="bg-primary text-primary-50 border-primary-50 absolute z-20 flex h-5 w-5 cursor-default items-center justify-center rounded-full border-2"
+      class="absolute z-20 flex-center size-5 cursor-default rounded-full border-2 border-primary-50 bg-primary text-primary-50"
       role="button"
       tabindex="0"
     >
@@ -162,11 +163,11 @@ function handleConfirm() {
         v-if="hintImage"
         :alt="$t('ui.captcha.alt')"
         :src="hintImage"
-        class="border-border h-10 w-full rounded border"
+        class="h-10 w-full rounded-sm border border-border"
       />
       <div
         v-else-if="hintText"
-        class="border-border flex-center h-10 w-full rounded border"
+        class="flex-center h-10 w-full rounded-sm border border-border"
       >
         {{ `${$t('ui.captcha.clickInOrder')}` + `【${hintText}】` }}
       </div>
diff --git a/packages/effects/common-ui/src/components/captcha/point-selection-captcha/point-selection-captcha-card.vue b/packages/effects/common-ui/src/components/captcha/point-selection-captcha/point-selection-captcha-card.vue
index 0ece2bf0..0593b132 100644
--- a/packages/effects/common-ui/src/components/captcha/point-selection-captcha/point-selection-captcha-card.vue
+++ b/packages/effects/common-ui/src/components/captcha/point-selection-captcha/point-selection-captcha-card.vue
@@ -4,6 +4,7 @@ import type { PointSelectionCaptchaCardProps } from '../types';
 import { computed } from 'vue';
 
 import { $t } from '@vben/locales';
+
 import {
   Card,
   CardContent,
@@ -63,7 +64,9 @@ function handleClick(e: MouseEvent) {
         </div>
       </CardTitle>
     </CardHeader>
-    <CardContent class="relative mt-2 flex w-full overflow-hidden rounded p-0">
+    <CardContent
+      class="relative mt-2 flex w-full overflow-hidden rounded-sm p-0"
+    >
       <img
         v-show="captchaImage"
         :alt="$t('ui.captcha.alt')"
diff --git a/packages/effects/common-ui/src/components/captcha/slider-captcha/index.vue b/packages/effects/common-ui/src/components/captcha/slider-captcha/index.vue
index fa43493e..df801705 100644
--- a/packages/effects/common-ui/src/components/captcha/slider-captcha/index.vue
+++ b/packages/effects/common-ui/src/components/captcha/slider-captcha/index.vue
@@ -8,6 +8,7 @@ import type {
 import { reactive, unref, useTemplateRef, watch, watchEffect } from 'vue';
 
 import { $t } from '@vben/locales';
+
 import { cn } from '@vben-core/shared/utils';
 
 import { useTimeoutFn } from '@vueuse/core';
@@ -49,9 +50,11 @@ defineExpose({
 });
 
 const wrapperRef = useTemplateRef<HTMLDivElement>('wrapperRef');
-const barRef = useTemplateRef<typeof SliderCaptchaBar>('barRef');
-const contentRef = useTemplateRef<typeof SliderCaptchaContent>('contentRef');
-const actionRef = useTemplateRef<typeof SliderCaptchaAction>('actionRef');
+const barRef = useTemplateRef<InstanceType<typeof SliderCaptchaBar>>('barRef');
+const contentRef =
+  useTemplateRef<InstanceType<typeof SliderCaptchaContent>>('contentRef');
+const actionRef =
+  useTemplateRef<InstanceType<typeof SliderCaptchaAction>>('actionRef');
 
 watch(
   () => state.isPassing,
@@ -82,20 +85,19 @@ function handleDragStart(e: MouseEvent | TouchEvent) {
   if (state.isPassing) {
     return;
   }
-  if (!actionRef.value) return;
+  const actionEl = actionRef.value;
+  const actionStyle = actionEl?.getStyle();
+  if (!actionEl || !actionStyle) return;
   emit('start', e);
 
   state.moveDistance =
     getEventPageX(e) -
-    Number.parseInt(
-      actionRef.value.getStyle().left.replace('px', '') || '0',
-      10,
-    );
+    Number.parseInt(actionStyle.left.replace('px', '') || '0', 10);
   state.startTime = Date.now();
   state.isMoving = true;
 }
 
-function getOffset(actionEl: HTMLDivElement) {
+function getOffset(actionEl?: HTMLDivElement | null) {
   const wrapperWidth = wrapperRef.value?.offsetWidth ?? 220;
   const actionWidth = actionEl?.offsetWidth ?? 40;
   const offset = wrapperWidth - actionWidth - 6;
@@ -108,7 +110,9 @@ function handleDragMoving(e: MouseEvent | TouchEvent) {
     const actionEl = unref(actionRef);
     const barEl = unref(barRef);
     if (!actionEl || !barEl) return;
-    const { actionWidth, offset, wrapperWidth } = getOffset(actionEl.getEl());
+    const actionNode = actionEl.getEl();
+    if (!actionNode) return;
+    const { actionWidth, offset, wrapperWidth } = getOffset(actionNode);
     const moveX = getEventPageX(e) - moveDistance;
 
     emit('move', {
@@ -137,14 +141,18 @@ function handleDragOver(e: MouseEvent | TouchEvent) {
     const barEl = unref(barRef);
     if (!actionEl || !barEl) return;
     const moveX = getEventPageX(e) - moveDistance;
-    const { actionWidth, offset, wrapperWidth } = getOffset(actionEl.getEl());
+    const actionNode = actionEl.getEl();
+    if (!actionNode) return;
+    const { actionWidth, offset, wrapperWidth } = getOffset(actionNode);
     if (moveX < offset) {
       if (props.isSlot) {
         setTimeout(() => {
           if (modelValue.value) {
             const contentEl = unref(contentRef);
-            if (contentEl) {
-              contentEl.getEl().style.width = `${Number.parseInt(barEl.getEl().style.width)}px`;
+            const contentNode = contentEl?.getEl();
+            const barNode = barEl.getEl();
+            if (contentNode && barNode) {
+              contentNode.style.width = `${Number.parseInt(barNode.style.width || '0', 10)}px`;
             }
           } else {
             resume();
@@ -184,7 +192,10 @@ function resume() {
   const contentEl = unref(contentRef);
   if (!actionEl || !barEl || !contentEl) return;
 
-  contentEl.getEl().style.width = '100%';
+  const contentNode = contentEl.getEl();
+  if (!contentNode) return;
+
+  contentNode.style.width = '100%';
   state.toLeft = true;
   useTimeoutFn(() => {
     state.toLeft = false;
@@ -199,7 +210,7 @@ function resume() {
     ref="wrapperRef"
     :class="
       cn(
-        'border-border bg-background-deep relative flex h-10 w-full items-center overflow-hidden rounded-md border text-center',
+        'relative flex h-10 w-full items-center overflow-hidden rounded-md border border-border bg-background-deep text-center',
         props.class,
       )
     "
diff --git a/packages/effects/common-ui/src/components/captcha/slider-captcha/slider-captcha-action.vue b/packages/effects/common-ui/src/components/captcha/slider-captcha/slider-captcha-action.vue
index fe0b5aaa..74074a17 100644
--- a/packages/effects/common-ui/src/components/captcha/slider-captcha/slider-captcha-action.vue
+++ b/packages/effects/common-ui/src/components/captcha/slider-captcha/slider-captcha-action.vue
@@ -1,8 +1,10 @@
 <script setup lang="ts">
 import type { CSSProperties } from 'vue';
+
 import { computed, ref, useTemplateRef } from 'vue';
 
 import { Check, ChevronsRight } from '@vben/icons';
+
 import { Slot } from '@vben-core/shadcn-ui';
 
 const props = defineProps<{
@@ -46,14 +48,14 @@ defineExpose({
   <div
     ref="actionRef"
     :class="{
-      'transition-width !left-0 duration-300': toLeft,
+      'transition-width left-0! duration-300': toLeft,
       'rounded-md': isDragging,
     }"
     :style="style"
-    class="bg-background dark:bg-accent absolute left-0 top-0 flex h-full cursor-move items-center justify-center px-3.5 shadow-md"
+    class="absolute top-0 left-0 flex-center h-full cursor-move bg-background px-3.5 shadow-md dark:bg-accent"
     name="captcha-action"
   >
-    <Slot :is-passing="isPassing" class="text-foreground/60 size-4">
+    <Slot :is-passing="isPassing" class="size-4 text-foreground/60">
       <slot name="icon">
         <ChevronsRight v-if="!isPassing" />
         <Check v-else />
diff --git a/packages/effects/common-ui/src/components/captcha/slider-captcha/slider-captcha-bar.vue b/packages/effects/common-ui/src/components/captcha/slider-captcha/slider-captcha-bar.vue
index eacf6842..05982f47 100644
--- a/packages/effects/common-ui/src/components/captcha/slider-captcha/slider-captcha-bar.vue
+++ b/packages/effects/common-ui/src/components/captcha/slider-captcha/slider-captcha-bar.vue
@@ -1,5 +1,7 @@
 <script setup lang="ts">
-import { computed, type CSSProperties, ref, useTemplateRef } from 'vue';
+import type { CSSProperties } from 'vue';
+
+import { computed, ref, useTemplateRef } from 'vue';
 
 const props = defineProps<{
   barStyle: CSSProperties;
@@ -31,8 +33,8 @@ defineExpose({
 <template>
   <div
     ref="barRef"
-    :class="toLeft && 'transition-width !w-0 duration-300'"
+    :class="toLeft && 'transition-width w-0! duration-300'"
     :style="style"
-    class="bg-success absolute h-full"
+    class="absolute h-full bg-success"
   ></div>
 </template>
diff --git a/packages/effects/common-ui/src/components/captcha/slider-captcha/slider-captcha-content.vue b/packages/effects/common-ui/src/components/captcha/slider-captcha/slider-captcha-content.vue
index 5c481f2e..51bc75b1 100644
--- a/packages/effects/common-ui/src/components/captcha/slider-captcha/slider-captcha-content.vue
+++ b/packages/effects/common-ui/src/components/captcha/slider-captcha/slider-captcha-content.vue
@@ -1,5 +1,6 @@
 <script setup lang="ts">
 import type { CSSProperties } from 'vue';
+
 import { computed, useTemplateRef } from 'vue';
 
 import { VbenSpineText } from '@vben-core/shadcn-ui';
@@ -35,7 +36,7 @@ defineExpose({
       [$style.success]: isPassing,
     }"
     :style="style"
-    class="absolute top-0 flex size-full select-none items-center justify-center text-xs"
+    class="absolute top-0 flex-center size-full text-xs select-none"
   >
     <slot name="text">
       <VbenSpineText class="flex h-full items-center">
diff --git a/packages/effects/common-ui/src/components/captcha/slider-rotate-captcha/index.vue b/packages/effects/common-ui/src/components/captcha/slider-rotate-captcha/index.vue
index 88945892..1e229789 100644
--- a/packages/effects/common-ui/src/components/captcha/slider-rotate-captcha/index.vue
+++ b/packages/effects/common-ui/src/components/captcha/slider-rotate-captcha/index.vue
@@ -84,12 +84,12 @@ function handleDragBarMove(data: SliderRotateVerifyPassingData) {
   state.dragging = true;
   const { imageSize, maxDegree } = props;
   const { moveX } = data;
-  const denominator = imageSize!;
+  const denominator = imageSize;
   if (denominator === 0) {
     return;
   }
   const currentRotate = Math.ceil(
-    (moveX / denominator) * 1.5 * maxDegree! * unref(getFactorRef),
+    (moveX / denominator) * 1.5 * maxDegree * unref(getFactorRef),
   );
   state.currentRotate = currentRotate;
   setImgRotate(state.randomRotate - currentRotate);
@@ -98,7 +98,7 @@ function handleDragBarMove(data: SliderRotateVerifyPassingData) {
 function handleImgOnLoad() {
   const { maxDegree, minDegree } = props;
   const ranRotate = Math.floor(
-    minDegree! + Math.random() * (maxDegree! - minDegree!),
+    minDegree + Math.random() * (maxDegree - minDegree),
   ); // 生成随机角度
   state.randomRotate = ranRotate;
   setImgRotate(ranRotate);
@@ -167,7 +167,7 @@ defineExpose({
   <div class="relative flex flex-col items-center">
     <div
       :style="getImgWrapStyleRef"
-      class="border-border relative cursor-pointer overflow-hidden rounded-full border shadow-md"
+      class="relative cursor-pointer overflow-hidden rounded-full border border-border shadow-md"
     >
       <img
         :class="imgCls"
diff --git a/packages/effects/common-ui/src/components/captcha/slider-translate-captcha/index.vue b/packages/effects/common-ui/src/components/captcha/slider-translate-captcha/index.vue
new file mode 100644
index 00000000..90c2df8b
--- /dev/null
+++ b/packages/effects/common-ui/src/components/captcha/slider-translate-captcha/index.vue
@@ -0,0 +1,311 @@
+<script setup lang="ts">
+import type {
+  CaptchaVerifyPassingData,
+  SliderCaptchaActionType,
+  SliderRotateVerifyPassingData,
+  SliderTranslateCaptchaProps,
+} from '../types';
+
+import {
+  computed,
+  onMounted,
+  reactive,
+  ref,
+  unref,
+  useTemplateRef,
+  watch,
+} from 'vue';
+
+import { $t } from '@vben/locales';
+
+import SliderCaptcha from '../slider-captcha/index.vue';
+
+const props = withDefaults(defineProps<SliderTranslateCaptchaProps>(), {
+  defaultTip: '',
+  canvasWidth: 420,
+  canvasHeight: 280,
+  squareLength: 42,
+  circleRadius: 10,
+  src: '',
+  diffDistance: 3,
+});
+
+const emit = defineEmits<{
+  success: [CaptchaVerifyPassingData];
+}>();
+
+const PI: number = Math.PI;
+const canvasOpr = {
+  clip: 'clip',
+  fill: 'fill',
+} as const;
+
+type CanvasOpr = (typeof canvasOpr)[keyof typeof canvasOpr];
+
+const modalValue = defineModel<boolean>({ default: false });
+
+const slideBarRef = useTemplateRef<SliderCaptchaActionType>('slideBarRef');
+const puzzleCanvasRef = useTemplateRef<HTMLCanvasElement>('puzzleCanvasRef');
+const pieceCanvasRef = useTemplateRef<HTMLCanvasElement>('pieceCanvasRef');
+
+const state = reactive({
+  dragging: false,
+  startTime: 0,
+  endTime: 0,
+  pieceX: 0,
+  pieceY: 0,
+  moveDistance: 0,
+  isPassing: false,
+  showTip: false,
+});
+
+const left = ref('0');
+
+const pieceStyle = computed(() => {
+  return {
+    left: left.value,
+  };
+});
+
+function setLeft(val: string) {
+  left.value = val;
+}
+
+const verifyTip = computed(() => {
+  return state.isPassing
+    ? $t('ui.captcha.sliderTranslateSuccessTip', [
+        ((state.endTime - state.startTime) / 1000).toFixed(1),
+      ])
+    : $t('ui.captcha.sliderTranslateFailTip');
+});
+function handleStart() {
+  state.startTime = Date.now();
+}
+
+function handleDragBarMove(data: SliderRotateVerifyPassingData) {
+  state.dragging = true;
+  const { moveX } = data;
+  state.moveDistance = moveX;
+  setLeft(`${moveX}px`);
+}
+
+function handleDragEnd() {
+  const { pieceX } = state;
+  const { diffDistance } = props;
+
+  if (Math.abs(pieceX - state.moveDistance) >= (diffDistance || 3)) {
+    setLeft('0');
+    state.moveDistance = 0;
+  } else {
+    checkPass();
+  }
+  state.showTip = true;
+  state.dragging = false;
+}
+
+function checkPass() {
+  state.isPassing = true;
+  state.endTime = Date.now();
+}
+
+watch(
+  () => state.isPassing,
+  (isPassing) => {
+    if (isPassing) {
+      const { endTime, startTime } = state;
+      const time = (endTime - startTime) / 1000;
+      emit('success', { isPassing, time: time.toFixed(1) });
+    }
+    modalValue.value = isPassing;
+  },
+);
+
+function resetCanvas() {
+  const { canvasWidth, canvasHeight } = props;
+  const puzzleCanvas = unref(puzzleCanvasRef);
+  const pieceCanvas = unref(pieceCanvasRef);
+  if (!puzzleCanvas || !pieceCanvas) return;
+  pieceCanvas.width = canvasWidth;
+  const puzzleCanvasCtx = puzzleCanvas.getContext('2d');
+  // Canvas2D: Multiple readback operations using getImageData
+  // are faster with the willReadFrequently attribute set to true.
+  // See: https://html.spec.whatwg.org/multipage/canvas.html#concept-canvas-will-read-frequently (anonymous)
+  const pieceCanvasCtx = pieceCanvas.getContext('2d', {
+    willReadFrequently: true,
+  });
+  if (!puzzleCanvasCtx || !pieceCanvasCtx) return;
+  puzzleCanvasCtx.clearRect(0, 0, canvasWidth, canvasHeight);
+  pieceCanvasCtx.clearRect(0, 0, canvasWidth, canvasHeight);
+}
+
+function initCanvas() {
+  const { canvasWidth, canvasHeight, squareLength, circleRadius, src } = props;
+  const puzzleCanvas = unref(puzzleCanvasRef);
+  const pieceCanvas = unref(pieceCanvasRef);
+  if (!puzzleCanvas || !pieceCanvas) return;
+  const puzzleCanvasCtx = puzzleCanvas.getContext('2d');
+  // Canvas2D: Multiple readback operations using getImageData
+  // are faster with the willReadFrequently attribute set to true.
+  // See: https://html.spec.whatwg.org/multipage/canvas.html#concept-canvas-will-read-frequently (anonymous)
+  const pieceCanvasCtx = pieceCanvas.getContext('2d', {
+    willReadFrequently: true,
+  });
+  if (!puzzleCanvasCtx || !pieceCanvasCtx) return;
+  const img = new Image();
+  // 解决跨域
+  img.crossOrigin = 'Anonymous';
+  img.src = src;
+  img.addEventListener('load', () => {
+    draw(puzzleCanvasCtx, pieceCanvasCtx);
+    puzzleCanvasCtx.drawImage(img, 0, 0, canvasWidth, canvasHeight);
+    pieceCanvasCtx.drawImage(img, 0, 0, canvasWidth, canvasHeight);
+    const pieceLength = squareLength + 2 * circleRadius + 3;
+    const sx = state.pieceX;
+    const sy = state.pieceY - 2 * circleRadius - 1;
+    const imageData = pieceCanvasCtx.getImageData(
+      sx,
+      sy,
+      pieceLength,
+      pieceLength,
+    );
+    pieceCanvas.width = pieceLength;
+    pieceCanvasCtx.putImageData(imageData, 0, sy);
+    setLeft('0');
+  });
+}
+
+function getRandomNumberByRange(start: number, end: number) {
+  return Math.round(Math.random() * (end - start) + start);
+}
+
+// 绘制拼图
+function draw(ctx1: CanvasRenderingContext2D, ctx2: CanvasRenderingContext2D) {
+  const { canvasWidth, canvasHeight, squareLength, circleRadius } = props;
+  state.pieceX = getRandomNumberByRange(
+    squareLength + 2 * circleRadius,
+    canvasWidth - (squareLength + 2 * circleRadius),
+  );
+  state.pieceY = getRandomNumberByRange(
+    3 * circleRadius,
+    canvasHeight - (squareLength + 2 * circleRadius),
+  );
+  drawPiece(ctx1, state.pieceX, state.pieceY, canvasOpr.fill);
+  drawPiece(ctx2, state.pieceX, state.pieceY, canvasOpr.clip);
+}
+
+// 绘制拼图切块
+function drawPiece(
+  ctx: CanvasRenderingContext2D,
+  x: number,
+  y: number,
+  opr: CanvasOpr,
+) {
+  const { squareLength, circleRadius } = props;
+  ctx.beginPath();
+  ctx.moveTo(x, y);
+  ctx.arc(
+    x + squareLength / 2,
+    y - circleRadius + 2,
+    circleRadius,
+    0.72 * PI,
+    2.26 * PI,
+  );
+  ctx.lineTo(x + squareLength, y);
+  ctx.arc(
+    x + squareLength + circleRadius - 2,
+    y + squareLength / 2,
+    circleRadius,
+    1.21 * PI,
+    2.78 * PI,
+  );
+  ctx.lineTo(x + squareLength, y + squareLength);
+  ctx.lineTo(x, y + squareLength);
+  ctx.arc(
+    x + circleRadius - 2,
+    y + squareLength / 2,
+    circleRadius + 0.4,
+    2.76 * PI,
+    1.24 * PI,
+    true,
+  );
+  ctx.lineTo(x, y);
+  ctx.lineWidth = 2;
+  ctx.fillStyle = 'rgba(255, 255, 255, 0.7)';
+  ctx.strokeStyle = 'rgba(255, 255, 255, 0.7)';
+  ctx.stroke();
+  opr === canvasOpr.clip ? ctx.clip() : ctx.fill();
+  ctx.globalCompositeOperation = 'destination-over';
+}
+
+function resume() {
+  state.showTip = false;
+  const basicEl = unref(slideBarRef);
+  if (!basicEl) {
+    return;
+  }
+  state.dragging = false;
+  state.isPassing = false;
+  state.pieceX = 0;
+  state.pieceY = 0;
+
+  basicEl.resume();
+  resetCanvas();
+  initCanvas();
+}
+
+onMounted(() => {
+  initCanvas();
+});
+</script>
+
+<template>
+  <div class="relative flex flex-col items-center">
+    <div
+      class="relative flex cursor-pointer overflow-hidden border border-border shadow-md"
+    >
+      <canvas
+        ref="puzzleCanvasRef"
+        :width="canvasWidth"
+        :height="canvasHeight"
+        @click="resume"
+      ></canvas>
+      <canvas
+        ref="pieceCanvasRef"
+        :width="canvasWidth"
+        :height="canvasHeight"
+        :style="pieceStyle"
+        class="absolute"
+        @click="resume"
+      ></canvas>
+      <div
+        class="absolute bottom-3 left-0 z-10 block h-15 w-full text-center text-xs leading-[30px] text-white"
+      >
+        <div
+          v-if="state.showTip"
+          :class="{
+            'bg-success/80': state.isPassing,
+            'bg-destructive/80': !state.isPassing,
+          }"
+        >
+          {{ verifyTip }}
+        </div>
+        <div v-if="!state.dragging" class="bg-black/30">
+          {{ defaultTip || $t('ui.captcha.sliderTranslateDefaultTip') }}
+        </div>
+      </div>
+    </div>
+    <SliderCaptcha
+      ref="slideBarRef"
+      v-model="modalValue"
+      class="mt-5"
+      is-slot
+      @end="handleDragEnd"
+      @move="handleDragBarMove"
+      @start="handleStart"
+    >
+      <template v-for="(_, key) in $slots" :key="key" #[key]="slotProps">
+        <slot :name="key" v-bind="slotProps"></slot>
+      </template>
+    </SliderCaptcha>
+  </div>
+</template>
diff --git a/packages/effects/common-ui/src/components/captcha/types.ts b/packages/effects/common-ui/src/components/captcha/types.ts
index ba3adc7d..f73877ee 100644
--- a/packages/effects/common-ui/src/components/captcha/types.ts
+++ b/packages/effects/common-ui/src/components/captcha/types.ts
@@ -1,7 +1,7 @@
-import type { ClassType } from '@vben/types';
-
 import type { CSSProperties } from 'vue';
 
+import type { ClassType } from '@vben/types';
+
 export interface CaptchaData {
   /**
    * x
@@ -54,8 +54,7 @@ export interface PointSelectionCaptchaCardProps {
   width?: number | string;
 }
 
-export interface PointSelectionCaptchaProps
-  extends PointSelectionCaptchaCardProps {
+export interface PointSelectionCaptchaProps extends PointSelectionCaptchaCardProps {
   /**
    * 是否展示确定按钮
    * @default false
@@ -159,6 +158,42 @@ export interface SliderRotateCaptchaProps {
   defaultTip?: string;
 }
 
+export interface SliderTranslateCaptchaProps {
+  /**
+   * @description 拼图的宽度
+   * @default 420
+   */
+  canvasWidth?: number;
+  /**
+   * @description 拼图的高度
+   * @default 280
+   */
+  canvasHeight?: number;
+  /**
+   * @description 切块上正方形的长度
+   * @default 42
+   */
+  squareLength?: number;
+  /**
+   * @description 切块上圆形的半径
+   * @default 10
+   */
+  circleRadius?: number;
+  /**
+   * @description 图片的地址
+   */
+  src?: string;
+  /**
+   * @description 允许的最大差距
+   * @default 3
+   */
+  diffDistance?: number;
+  /**
+   * @description 默认提示文本
+   */
+  defaultTip?: string;
+}
+
 export interface CaptchaVerifyPassingData {
   isPassing: boolean;
   time: number | string;
diff --git a/packages/effects/common-ui/src/components/col-page/col-page.vue b/packages/effects/common-ui/src/components/col-page/col-page.vue
index c3f9d686..73a38ca5 100644
--- a/packages/effects/common-ui/src/components/col-page/col-page.vue
+++ b/packages/effects/common-ui/src/components/col-page/col-page.vue
@@ -76,14 +76,16 @@ defineExpose({
         :min-size="leftMinWidth"
       >
         <template #default="slotProps">
-          <slot
-            name="left"
-            v-bind="{
-              ...slotProps,
-              expand: expandLeft,
-              collapse: collapseLeft,
-            }"
-          ></slot>
+          <div class="h-full pr-2">
+            <slot
+              name="left"
+              v-bind="{
+                ...slotProps,
+                expand: expandLeft,
+                collapse: collapseLeft,
+              }"
+            ></slot>
+          </div>
         </template>
       </ResizablePanel>
       <ResizableHandle
@@ -99,7 +101,9 @@ defineExpose({
         :min-size="rightMinWidth"
       >
         <template #default>
-          <slot></slot>
+          <div class="h-full pl-2">
+            <slot></slot>
+          </div>
         </template>
       </ResizablePanel>
     </ResizablePanelGroup>
diff --git a/packages/effects/common-ui/src/components/count-to/count-to.vue b/packages/effects/common-ui/src/components/count-to/count-to.vue
new file mode 100644
index 00000000..d6b0943d
--- /dev/null
+++ b/packages/effects/common-ui/src/components/count-to/count-to.vue
@@ -0,0 +1,123 @@
+<script lang="ts" setup>
+import type { CountToProps } from './types';
+
+import { computed, onMounted, ref, watch } from 'vue';
+
+import { isString } from '@vben-core/shared/utils';
+
+import { TransitionPresets, useTransition } from '@vueuse/core';
+
+const props = withDefaults(defineProps<CountToProps>(), {
+  startVal: 0,
+  duration: 2000,
+  separator: ',',
+  decimal: '.',
+  decimals: 0,
+  delay: 0,
+  transition: () => TransitionPresets.easeOutExpo,
+});
+
+const emit = defineEmits(['started', 'finished']);
+
+const lastValue = ref(props.startVal);
+
+onMounted(() => {
+  lastValue.value = props.endVal;
+});
+
+watch(
+  () => props.endVal,
+  (val) => {
+    lastValue.value = val;
+  },
+);
+
+const currentValue = useTransition(lastValue, {
+  delay: computed(() => props.delay),
+  duration: computed(() => props.duration),
+  disabled: computed(() => props.disabled),
+  transition: computed(() => {
+    return isString(props.transition)
+      ? TransitionPresets[props.transition]
+      : props.transition;
+  }),
+  onStarted() {
+    emit('started');
+  },
+  onFinished() {
+    emit('finished');
+  },
+});
+
+const numMain = computed(() => {
+  const result = currentValue.value
+    .toFixed(props.decimals)
+    .split('.')[0]
+    ?.replaceAll(/\B(?=(\d{3})+(?!\d))/g, props.separator);
+  return result;
+});
+
+const numDec = computed(() => {
+  return (
+    props.decimal + currentValue.value.toFixed(props.decimals).split('.')[1]
+  );
+});
+</script>
+<template>
+  <div class="count-to" v-bind="$attrs">
+    <slot name="prefix">
+      <div
+        class="count-to-prefix"
+        :style="prefixStyle"
+        :class="prefixClass"
+        v-if="prefix"
+      >
+        {{ prefix }}
+      </div>
+    </slot>
+    <div class="count-to-main" :class="mainClass" :style="mainStyle">
+      <span>{{ numMain }}</span>
+      <span
+        class="count-to-main-decimal"
+        v-if="decimals > 0"
+        :class="decimalClass"
+        :style="decimalStyle"
+      >
+        {{ numDec }}
+      </span>
+    </div>
+    <slot name="suffix">
+      <div
+        class="count-to-suffix"
+        :style="suffixStyle"
+        :class="suffixClass"
+        v-if="suffix"
+      >
+        {{ suffix }}
+      </div>
+    </slot>
+  </div>
+</template>
+<style lang="scss" scoped>
+.count-to {
+  display: flex;
+  align-items: baseline;
+
+  &-prefix {
+    // font-size: 1rem;
+  }
+
+  &-suffix {
+    // font-size: 1rem;
+  }
+
+  &-main {
+    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
+    // font-size: 1.5rem;
+
+    &-decimal {
+      // font-size: 0.8rem;
+    }
+  }
+}
+</style>
diff --git a/packages/effects/common-ui/src/components/count-to/index.ts b/packages/effects/common-ui/src/components/count-to/index.ts
new file mode 100644
index 00000000..d942796e
--- /dev/null
+++ b/packages/effects/common-ui/src/components/count-to/index.ts
@@ -0,0 +1,2 @@
+export { default as CountTo } from './count-to.vue';
+export * from './types';
diff --git a/packages/effects/common-ui/src/components/count-to/types.ts b/packages/effects/common-ui/src/components/count-to/types.ts
new file mode 100644
index 00000000..0b3bd82d
--- /dev/null
+++ b/packages/effects/common-ui/src/components/count-to/types.ts
@@ -0,0 +1,53 @@
+import type { CubicBezierPoints, EasingFunction } from '@vueuse/core';
+
+import type { StyleValue } from 'vue';
+
+import { TransitionPresets as TransitionPresetsData } from '@vueuse/core';
+
+export type TransitionPresets = keyof typeof TransitionPresetsData;
+
+export const TransitionPresetsKeys = Object.keys(
+  TransitionPresetsData,
+) as TransitionPresets[];
+
+export interface CountToProps {
+  /** 初始值 */
+  startVal?: number;
+  /** 当前值 */
+  endVal: number;
+  /** 是否禁用动画 */
+  disabled?: boolean;
+  /** 延迟动画开始的时间 */
+  delay?: number;
+  /** 持续时间  */
+  duration?: number;
+  /** 小数位数  */
+  decimals?: number;
+  /** 小数点  */
+  decimal?: string;
+  /** 分隔符  */
+  separator?: string;
+  /** 前缀  */
+  prefix?: string;
+  /** 后缀  */
+  suffix?: string;
+  /** 过渡效果  */
+  transition?: CubicBezierPoints | EasingFunction | TransitionPresets;
+  /** 整数部分的类名 */
+  mainClass?: string;
+  /** 小数部分的类名 */
+  decimalClass?: string;
+  /** 前缀部分的类名 */
+  prefixClass?: string;
+  /** 后缀部分的类名 */
+  suffixClass?: string;
+
+  /** 整数部分的样式 */
+  mainStyle?: StyleValue;
+  /** 小数部分的样式 */
+  decimalStyle?: StyleValue;
+  /** 前缀部分的样式 */
+  prefixStyle?: StyleValue;
+  /** 后缀部分的样式 */
+  suffixStyle?: StyleValue;
+}
diff --git a/packages/effects/common-ui/src/components/cropper/cropper.vue b/packages/effects/common-ui/src/components/cropper/cropper.vue
new file mode 100644
index 00000000..27f1ca83
--- /dev/null
+++ b/packages/effects/common-ui/src/components/cropper/cropper.vue
@@ -0,0 +1,981 @@
+<script setup lang="ts">
+import { onMounted, onUnmounted, ref, watch } from 'vue';
+
+// 定义组件参数
+const props = defineProps<{
+  /** 裁剪比例 格式如 '1:1', '16:9', '3:4' 等（非必填） */
+  aspectRatio?: string;
+  /** 容器高度（默认400） */
+  height?: number;
+  /** 图片地址 */
+  img: string;
+  /** 容器宽度（默认500） */
+  width?: number;
+}>();
+
+const CROPPER_CONSTANTS = {
+  MIN_WIDTH: 60 as const,
+  MIN_HEIGHT: 60 as const,
+  DEFAULT_WIDTH: 500 as const,
+  DEFAULT_HEIGHT: 400 as const,
+  PADDING_RATIO: 0.1 as const,
+  MAX_PADDING: 50 as const,
+} as const;
+
+type Point = [number, number]; // [clientX, clientY]
+type Dimension = [number, number, number, number]; // [top, right, bottom, left]
+
+// 拖拽点类型
+type DragAction =
+  | 'bottom'
+  | 'bottom-left'
+  | 'bottom-right'
+  | 'left'
+  | 'move'
+  | 'right'
+  | 'top'
+  | 'top-left'
+  | 'top-right';
+
+// DOM 引用
+const containerRef = ref<HTMLDivElement | null>(null);
+const bgImageRef = ref<HTMLImageElement | null>(null);
+// const maskRef = ref<HTMLDivElement | null>(null);
+const maskViewRef = ref<HTMLDivElement | null>(null);
+const cropperRef = ref<HTMLDivElement | null>(null);
+// const cropperViewRef = ref<HTMLDivElement | null>(null);
+
+// 响应式数据
+const isCropperVisible = ref<boolean>(false);
+const validAspectRatio = ref<null | number>(null); // 有效比例值（null表示无固定比例）
+const containerWidth = ref<number>(
+  props.width ?? CROPPER_CONSTANTS.DEFAULT_WIDTH,
+);
+const containerHeight = ref<number>(
+  props.height ?? CROPPER_CONSTANTS.DEFAULT_HEIGHT,
+);
+
+// 裁剪区域尺寸（top, right, bottom, left）
+const currentDimension = ref<Dimension>([50, 50, 50, 50]);
+const initDimension = ref<Dimension>([50, 50, 50, 50]);
+
+// 拖拽状态
+const dragging = ref<boolean>(false);
+const startPoint = ref<Point>([0, 0]);
+const startDimension = ref<Dimension>([0, 0, 0, 0]);
+const direction = ref<Dimension>([0, 0, 0, 0]);
+const moving = ref<boolean>(false);
+
+/**
+ * 计算图片的适配尺寸，保证完整显示且不超过最大宽高限制
+ */
+const calculateImageFitSize = () => {
+  if (!bgImageRef.value) return;
+
+  // 获取图片原始尺寸
+  const imgWidth = bgImageRef.value.naturalWidth;
+  const imgHeight = bgImageRef.value.naturalHeight;
+
+  if (imgWidth === 0 || imgHeight === 0) return;
+
+  // 计算缩放比例（使用传入的width/height，默认500/400）
+  const widthRatio =
+    (props.width ?? CROPPER_CONSTANTS.DEFAULT_WIDTH) / imgWidth;
+  const heightRatio =
+    (props.height ?? CROPPER_CONSTANTS.DEFAULT_HEIGHT) / imgHeight;
+  const scaleRatio = Math.min(widthRatio, heightRatio, 1); // 不放大图片，只缩小
+
+  // 计算适配后的容器尺寸
+  const fitWidth = Math.floor(imgWidth * scaleRatio);
+  const fitHeight = Math.floor(imgHeight * scaleRatio);
+
+  containerWidth.value = fitWidth;
+  containerHeight.value = fitHeight;
+
+  // 重置裁剪框初始尺寸（基于新的容器尺寸）
+  const padding = Math.min(
+    CROPPER_CONSTANTS.MAX_PADDING,
+    Math.floor(fitWidth * CROPPER_CONSTANTS.PADDING_RATIO),
+    Math.floor(fitHeight * CROPPER_CONSTANTS.PADDING_RATIO),
+  );
+
+  initDimension.value = [padding, padding, padding, padding];
+  currentDimension.value = [padding, padding, padding, padding];
+};
+
+/**
+ * 验证并解析比例字符串
+ * @returns {number|null} 比例值 (width/height)，解析失败返回null
+ */
+const parseAndValidateAspectRatio = (): null | number => {
+  // 如果未传入比例参数，直接返回null
+  if (!props.aspectRatio) {
+    return null;
+  }
+
+  // 验证比例格式
+  const ratioRegex = /^[1-9]\d*:[1-9]\d*$/;
+  if (!ratioRegex.test(props.aspectRatio)) {
+    console.warn('裁剪比例格式错误，应为 "数字:数字" 格式，如 "16:9"');
+    return null;
+  }
+
+  // 解析比例
+  const [width, height] = props.aspectRatio.split(':').map(Number);
+
+  // 验证解析结果有效性
+  if (Number.isNaN(width) || Number.isNaN(height) || !width || !height) {
+    console.warn('裁剪比例解析失败，宽高必须为正整数');
+    return null;
+  }
+
+  return width / height;
+};
+
+/**
+ * 设置裁剪区域尺寸
+ * @param {Dimension} dimension - [top, right, bottom, left]
+ */
+const setDimension = (dimension: Dimension) => {
+  currentDimension.value = [...dimension];
+  if (maskViewRef.value) {
+    maskViewRef.value.style.clipPath = `inset(${dimension[0]}px ${dimension[1]}px ${dimension[2]}px ${dimension[3]}px)`;
+  }
+};
+
+/**
+ * 调整裁剪区域至指定比例
+ */
+const adjustCropperToAspectRatio = () => {
+  if (!cropperRef.value) return;
+
+  // 验证并解析比例
+  validAspectRatio.value = parseAndValidateAspectRatio();
+
+  // 如果无有效比例，使用初始尺寸，不强制固定比例
+  if (validAspectRatio.value === null) {
+    setDimension(initDimension.value);
+    return;
+  }
+
+  // 有有效比例，按比例调整裁剪框
+  const ratio = validAspectRatio.value;
+  const containerWidthVal = containerWidth.value;
+  const containerHeightVal = containerHeight.value;
+
+  // 根据比例计算裁剪框尺寸
+  let newHeight: number, newWidth: number;
+
+  // 先按宽度优先计算
+  newWidth = containerWidthVal;
+  newHeight = newWidth / ratio;
+
+  // 如果高度超出容器，按高度优先计算
+  if (newHeight > containerHeightVal) {
+    newHeight = containerHeightVal;
+    newWidth = newHeight * ratio;
+  }
+
+  // 居中显示
+  const leftRight = (containerWidthVal - newWidth) / 2;
+  const topBottom = (containerHeightVal - newHeight) / 2;
+
+  const newDimension: Dimension = [topBottom, leftRight, topBottom, leftRight];
+
+  setDimension(newDimension);
+};
+
+/**
+ * 创建裁剪器
+ */
+const createCropper = () => {
+  // 计算图片适配尺寸
+  calculateImageFitSize();
+
+  isCropperVisible.value = true;
+  adjustCropperToAspectRatio();
+};
+
+/**
+ * 处理鼠标按下事件
+ * @param {MouseEvent} e - 鼠标事件
+ * @param {DragAction} action - 操作类型
+ */
+const handleMouseDown = (e: MouseEvent, action: DragAction) => {
+  dragging.value = true;
+  startPoint.value = [e.clientX, e.clientY];
+  startDimension.value = [...currentDimension.value];
+  direction.value = [0, 0, 0, 0];
+  moving.value = false;
+
+  // 处理移动
+  if (action === 'move') {
+    direction.value[0] = 1;
+    direction.value[2] = -1;
+    direction.value[3] = 1;
+    direction.value[1] = -1;
+    moving.value = true;
+    return;
+  }
+
+  // 处理拖拽方向
+  switch (action) {
+    case 'bottom': {
+      direction.value[2] = -1;
+      break;
+    }
+    case 'bottom-left': {
+      direction.value[2] = -1;
+      direction.value[3] = 1;
+      break;
+    }
+    case 'bottom-right': {
+      direction.value[2] = -1;
+      direction.value[1] = -1;
+      break;
+    }
+    case 'left': {
+      direction.value[3] = 1;
+      break;
+    }
+    case 'right': {
+      direction.value[1] = -1;
+      break;
+    }
+    case 'top': {
+      direction.value[0] = 1;
+      break;
+    }
+    case 'top-left': {
+      direction.value[0] = 1;
+      direction.value[3] = 1;
+      break;
+    }
+    case 'top-right': {
+      direction.value[0] = 1;
+      direction.value[1] = -1;
+      break;
+    }
+  }
+};
+
+/**
+ * 处理鼠标移动事件
+ * @param {MouseEvent} e - 鼠标事件
+ */
+const handleMouseMove = (e: MouseEvent) => {
+  if (!dragging.value || !cropperRef.value) return;
+
+  const { clientX, clientY } = e;
+  const diffX = clientX - startPoint.value[0];
+  const diffY = clientY - startPoint.value[1];
+
+  // 处理移动裁剪框
+  if (moving.value) {
+    handleMoveCropBox(diffX, diffY);
+    return;
+  }
+
+  // 无有效比例
+  if (validAspectRatio.value === null) {
+    handleFreeAspectResize(diffX, diffY);
+  } else {
+    handleFixedAspectResize(diffX, diffY);
+  }
+};
+
+const handleMoveCropBox = (diffX: number, diffY: number) => {
+  const newDimension = [...startDimension.value] as Dimension;
+
+  // 计算临时偏移后的位置
+  const tempTop = startDimension.value[0] + diffY;
+  const tempLeft = startDimension.value[3] + diffX;
+
+  // 计算裁剪框的固定尺寸
+  const cropWidth =
+    containerWidth.value - startDimension.value[3] - startDimension.value[1];
+  const cropHeight =
+    containerHeight.value - startDimension.value[0] - startDimension.value[2];
+
+  // 边界限制：确保裁剪框完全在容器内，且尺寸不变
+  // 顶部边界：top >= 0，且 bottom = 容器高度 - top - 裁剪高度 >= 0
+  newDimension[0] = Math.max(
+    0,
+    Math.min(tempTop, containerHeight.value - cropHeight),
+  );
+  // 底部边界：bottom = 容器高度 - top - 裁剪高度（由top推导，无需额外计算）
+  newDimension[2] = containerHeight.value - newDimension[0] - cropHeight;
+  // 左侧边界：left >= 0，且 right = 容器宽度 - left - 裁剪宽度 >= 0
+  newDimension[3] = Math.max(
+    0,
+    Math.min(tempLeft, containerWidth.value - cropWidth),
+  );
+  // 右侧边界：right = 容器宽度 - left - 裁剪宽度（由left推导，无需额外计算）
+  newDimension[1] = containerWidth.value - newDimension[3] - cropWidth;
+
+  // 强制保证尺寸不变（兜底）
+  const finalWidth = containerWidth.value - newDimension[3] - newDimension[1];
+  const finalHeight = containerHeight.value - newDimension[0] - newDimension[2];
+
+  if (finalWidth !== cropWidth) {
+    newDimension[1] = containerWidth.value - newDimension[3] - cropWidth;
+  }
+
+  if (finalHeight !== cropHeight) {
+    newDimension[2] = containerHeight.value - newDimension[0] - cropHeight;
+  }
+
+  // 更新裁剪区域（仅位置变化，尺寸/比例完全不变）
+  setDimension(newDimension);
+};
+
+const handleFreeAspectResize = (diffX: number, diffY: number) => {
+  const cropperWidth = containerWidth.value;
+  const cropperHeight = containerHeight.value;
+  const currentDimensionNew: Dimension = [0, 0, 0, 0];
+
+  // 计算新的尺寸，确保不小于最小值
+  currentDimensionNew[0] = Math.min(
+    Math.max(startDimension.value[0] + direction.value[0] * diffY, 0),
+    cropperHeight - CROPPER_CONSTANTS.MIN_HEIGHT,
+  );
+
+  currentDimensionNew[1] = Math.min(
+    Math.max(startDimension.value[1] + direction.value[1] * diffX, 0),
+    cropperWidth - CROPPER_CONSTANTS.MIN_WIDTH,
+  );
+
+  currentDimensionNew[2] = Math.min(
+    Math.max(startDimension.value[2] + direction.value[2] * diffY, 0),
+    cropperHeight - CROPPER_CONSTANTS.MIN_HEIGHT,
+  );
+
+  currentDimensionNew[3] = Math.min(
+    Math.max(startDimension.value[3] + direction.value[3] * diffX, 0),
+    cropperWidth - CROPPER_CONSTANTS.MIN_WIDTH,
+  );
+
+  // 确保裁剪区域宽度和高度不小于最小值
+  const newWidth =
+    cropperWidth - currentDimensionNew[3] - currentDimensionNew[1];
+  const newHeight =
+    cropperHeight - currentDimensionNew[0] - currentDimensionNew[2];
+
+  if (newWidth < CROPPER_CONSTANTS.MIN_WIDTH) {
+    if (direction.value[3] === 1) {
+      currentDimensionNew[3] =
+        cropperWidth - currentDimensionNew[1] - CROPPER_CONSTANTS.MIN_WIDTH;
+    } else {
+      currentDimensionNew[1] =
+        cropperWidth - currentDimensionNew[3] - CROPPER_CONSTANTS.MIN_WIDTH;
+    }
+  }
+
+  if (newHeight < CROPPER_CONSTANTS.MIN_HEIGHT) {
+    if (direction.value[0] === 1) {
+      currentDimensionNew[0] =
+        cropperHeight - currentDimensionNew[2] - CROPPER_CONSTANTS.MIN_HEIGHT;
+    } else {
+      currentDimensionNew[2] =
+        cropperHeight - currentDimensionNew[0] - CROPPER_CONSTANTS.MIN_HEIGHT;
+    }
+  }
+
+  setDimension(currentDimensionNew);
+};
+
+const handleFixedAspectResize = (diffX: number, diffY: number) => {
+  if (validAspectRatio.value === null) return;
+  const cropperWidth = containerWidth.value;
+  const cropperHeight = containerHeight.value;
+  // 有有效比例 - 固定比例裁剪
+  const ratio = validAspectRatio.value;
+  const currentWidth =
+    cropperWidth - startDimension.value[3] - startDimension.value[1];
+  const currentHeight =
+    cropperHeight - startDimension.value[0] - startDimension.value[2];
+
+  let newHeight: number, newWidth: number;
+  let widthChange = 0;
+  let heightChange = 0;
+
+  // 计算宽度/高度变化量
+  if (direction.value[3] === 1) widthChange = -diffX;
+  else if (direction.value[1] === -1) widthChange = diffX;
+
+  if (direction.value[0] === 1) heightChange = -diffY;
+  else if (direction.value[2] === -1) heightChange = diffY;
+
+  const isCornerDrag =
+    (direction.value[3] === 1 || direction.value[1] === -1) &&
+    (direction.value[0] === 1 || direction.value[2] === -1);
+
+  // 计算新尺寸
+  if (isCornerDrag) {
+    if (Math.abs(widthChange) > Math.abs(heightChange)) {
+      newWidth = Math.max(
+        CROPPER_CONSTANTS.MIN_WIDTH,
+        currentWidth + widthChange,
+      );
+      newHeight = newWidth / ratio;
+    } else {
+      newHeight = Math.max(
+        CROPPER_CONSTANTS.MIN_HEIGHT,
+        currentHeight + heightChange,
+      );
+      newWidth = newHeight * ratio;
+    }
+  } else {
+    if (direction.value[3] === 1 || direction.value[1] === -1) {
+      newWidth = Math.max(
+        CROPPER_CONSTANTS.MIN_WIDTH,
+        currentWidth + widthChange,
+      );
+      newHeight = newWidth / ratio;
+    } else {
+      newHeight = Math.max(
+        CROPPER_CONSTANTS.MIN_HEIGHT,
+        currentHeight + heightChange,
+      );
+      newWidth = newHeight * ratio;
+    }
+  }
+
+  // 限制最大尺寸
+  const maxWidth = cropperWidth;
+  const maxHeight = cropperHeight;
+
+  if (newWidth > maxWidth) {
+    newWidth = maxWidth;
+    newHeight = newWidth / ratio;
+  }
+
+  if (newHeight > maxHeight) {
+    newHeight = maxHeight;
+    newWidth = newHeight * ratio;
+  }
+
+  // 计算新的位置
+  let newLeft = startDimension.value[3];
+  let newTop = startDimension.value[0];
+  let newRight = startDimension.value[1];
+  let newBottom = startDimension.value[2];
+
+  // 根据拖拽方向调整位置
+  if (direction.value[3] === 1) {
+    newLeft = cropperWidth - newWidth - startDimension.value[1];
+  } else if (direction.value[1] === -1) {
+    newRight = cropperWidth - newWidth - startDimension.value[3];
+  } else if (!isCornerDrag) {
+    // 居中调整
+    const currentHorizontalCenter = startDimension.value[3] + currentWidth / 2;
+    newLeft = Math.max(
+      0,
+      Math.min(cropperWidth - newWidth, currentHorizontalCenter - newWidth / 2),
+    );
+    newRight = cropperWidth - newWidth - newLeft;
+  }
+
+  if (direction.value[0] === 1) {
+    newTop = cropperHeight - newHeight - startDimension.value[2];
+  } else if (direction.value[2] === -1) {
+    newBottom = cropperHeight - newHeight - startDimension.value[0];
+  } else if (!isCornerDrag) {
+    // 居中调整
+    const currentVerticalCenter = startDimension.value[0] + currentHeight / 2;
+    newTop = Math.max(
+      0,
+      Math.min(
+        cropperHeight - newHeight,
+        currentVerticalCenter - newHeight / 2,
+      ),
+    );
+    newBottom = cropperHeight - newHeight - newTop;
+  }
+
+  // 边界检查
+  newLeft = Math.max(0, newLeft);
+  newTop = Math.max(0, newTop);
+  newRight = Math.max(0, newRight);
+  newBottom = Math.max(0, newBottom);
+
+  const newDimension: Dimension = [newTop, newRight, newBottom, newLeft];
+  setDimension(newDimension);
+};
+
+/**
+ * 处理鼠标抬起事件
+ */
+const handleMouseUp = () => {
+  dragging.value = false;
+  moving.value = false;
+  direction.value = [0, 0, 0, 0];
+};
+
+/**
+ * 处理图片加载完成
+ */
+const handleImageLoad = () => {
+  createCropper();
+};
+
+/**
+ * 裁剪图片
+ * @param {'image/jpeg' | 'image/png'} format - 输出图片格式
+ * @param {number} quality - 压缩质量（0-1）
+ * @param {'blob' | 'base64'} outputType - 输出类型
+ * @param {number} targetWidth - 目标宽度（可选，不传则为原始裁剪宽度）
+ * @param {number} targetHeight - 目标高度（可选，不传则为原始裁剪高度）
+ */
+const getCropImage = async (
+  format: 'image/jpeg' | 'image/png' = 'image/png',
+  quality: number = 0.92,
+  outputType: 'base64' | 'blob' = 'blob',
+  targetWidth?: number,
+  targetHeight?: number,
+): Promise<Blob | string | undefined> => {
+  if (!props.img || !bgImageRef.value || !containerRef.value) return;
+
+  // 质量参数边界修正：强制限制在 0-1 区间，防止传入非法值报错
+  const validQuality = Math.max(0, Math.min(1, quality));
+
+  // 创建临时图片对象获取原始尺寸
+  const tempImg = new Image();
+  // 跨域图片处理：仅对非同源的网络图片设置跨域匿名
+  if (props.img.startsWith('http://') || props.img.startsWith('https://')) {
+    try {
+      const url = new URL(props.img);
+      if (url.origin !== location.origin) {
+        tempImg.crossOrigin = 'anonymous';
+      }
+    } catch {
+      // Invalid URL，跳过跨域配置，不中断执行
+    }
+  }
+
+  // 等待临时图片加载完成
+  await new Promise<void>((resolve, reject) => {
+    const timeout = setTimeout(() => {
+      tempImg.removeEventListener('load', handleLoad);
+      tempImg.removeEventListener('error', handleError);
+      reject(new Error('图片加载超时，超时时间10秒'));
+    }, 10_000);
+    const handleLoad = () => {
+      clearTimeout(timeout);
+      tempImg.removeEventListener('load', handleLoad);
+      tempImg.removeEventListener('error', handleError);
+      resolve();
+    };
+
+    const handleError = (err: ErrorEvent) => {
+      clearTimeout(timeout);
+      tempImg.removeEventListener('load', handleLoad);
+      tempImg.removeEventListener('error', handleError);
+      reject(new Error(`图片加载失败: ${err.message}`));
+    };
+
+    tempImg.addEventListener('load', handleLoad);
+    tempImg.addEventListener('error', handleError);
+    tempImg.src = props.img;
+  });
+
+  const containerRect = containerRef.value.getBoundingClientRect();
+  const imgRect = bgImageRef.value.getBoundingClientRect();
+
+  // 1. 计算图片在容器内的渲染参数
+  const containerWidth = containerRect.width;
+  const containerHeight = containerRect.height;
+  const renderedImgWidth = imgRect.width;
+  const renderedImgHeight = imgRect.height;
+  const imgOffsetX = (containerWidth - renderedImgWidth) / 2;
+  const imgOffsetY = (containerHeight - renderedImgHeight) / 2;
+
+  // 2. 计算裁剪框在容器内的实际坐标
+  const [cropTop, cropRight, cropBottom, cropLeft] = currentDimension.value;
+  const cropBoxWidth = containerWidth - cropLeft - cropRight;
+  const cropBoxHeight = containerHeight - cropTop - cropBottom;
+
+  // 3. 将裁剪框坐标转换为图片上的坐标（考虑图片偏移）
+  const cropOnImgX = cropLeft - imgOffsetX;
+  const cropOnImgY = cropTop - imgOffsetY;
+
+  // 4. 计算渲染图片到原始图片的缩放比例（保留原始像素）
+  const scaleX = tempImg.width / renderedImgWidth;
+  const scaleY = tempImg.height / renderedImgHeight;
+
+  // 5. 映射到原始图片的裁剪区域（精确到原始像素，防止越界）
+  const originalCropX = Math.max(0, Math.floor(cropOnImgX * scaleX));
+  const originalCropY = Math.max(0, Math.floor(cropOnImgY * scaleY));
+  const originalCropWidth = Math.min(
+    Math.floor(cropBoxWidth * scaleX),
+    tempImg.width - originalCropX,
+  );
+  const originalCropHeight = Math.min(
+    Math.floor(cropBoxHeight * scaleY),
+    tempImg.height - originalCropY,
+  );
+
+  // 边界校验：裁剪尺寸非法则返回
+  if (originalCropWidth <= 0 || originalCropHeight <= 0) return;
+
+  // 6. 处理高清屏适配（解决Retina屏模糊）
+  const dpr = window.devicePixelRatio || 1;
+
+  // 最终画布尺寸（优先使用传入的目标尺寸，无则用原始裁剪尺寸）
+  const finalWidth = targetWidth ? Math.max(1, targetWidth) : originalCropWidth;
+  const finalHeight = targetHeight
+    ? Math.max(1, targetHeight)
+    : originalCropHeight;
+
+  // 创建画布并获取绘制上下文
+  const canvas = document.createElement('canvas');
+  const ctx = canvas.getContext('2d');
+  if (!ctx) return;
+
+  // 画布物理尺寸（乘以设备像素比，保证高清无模糊）
+  canvas.width = finalWidth * dpr;
+  canvas.height = finalHeight * dpr;
+
+  // 画布显示尺寸（视觉尺寸，和最终展示一致）
+  canvas.style.width = `${finalWidth}px`;
+  canvas.style.height = `${finalHeight}px`;
+
+  // 缩放画布上下文，适配高清屏DPR
+  ctx.scale(dpr, dpr);
+
+  // 7. 绘制裁剪后的图片（使用原始像素绘制，保证清晰度）
+  ctx.drawImage(
+    tempImg,
+    originalCropX, // 原始图片裁剪起始X（精确像素）
+    originalCropY, // 原始图片裁剪起始Y（精确像素）
+    originalCropWidth, // 原始图片裁剪宽度（精确像素）
+    originalCropHeight, // 原始图片裁剪高度（精确像素）
+    0, // 画布绘制起始X
+    0, // 画布绘制起始Y
+    finalWidth, // 画布绘制宽度（目标尺寸）
+    finalHeight, // 画布绘制高度（目标尺寸）
+  );
+
+  try {
+    return outputType === 'base64'
+      ? canvas.toDataURL(format, validQuality)
+      : new Promise<Blob>((resolve) => {
+          canvas.toBlob(
+            (blob) => {
+              // 兜底：如果blob生成失败，返回空Blob（防止null）
+              resolve(blob || new Blob([], { type: format }));
+            },
+            format,
+            validQuality,
+          );
+        });
+  } catch (error) {
+    console.error('图片导出失败:', error);
+  }
+};
+
+// 监听比例变化，重新调整裁剪框
+watch(() => props.aspectRatio, adjustCropperToAspectRatio);
+
+// 监听width/height变化，重新计算尺寸
+watch([() => props.width, () => props.height], () => {
+  calculateImageFitSize();
+  adjustCropperToAspectRatio();
+});
+
+// 组件挂载时注册全局事件
+onMounted(() => {
+  document.addEventListener('mousemove', handleMouseMove);
+  document.addEventListener('mouseup', handleMouseUp);
+
+  // 如果图片已经加载完成，手动触发创建裁剪器
+  if (
+    bgImageRef.value &&
+    bgImageRef.value.complete &&
+    bgImageRef.value.naturalWidth > 0
+  ) {
+    createCropper();
+  }
+});
+
+// 组件卸载时清理
+onUnmounted(() => {
+  document.removeEventListener('mousemove', handleMouseMove);
+  document.removeEventListener('mouseup', handleMouseUp);
+});
+
+defineExpose({ getCropImage });
+</script>
+
+<template>
+  <div
+    :style="{
+      width: `${width || CROPPER_CONSTANTS.DEFAULT_WIDTH}px`,
+      height: `${height || CROPPER_CONSTANTS.DEFAULT_HEIGHT}px`,
+    }"
+    class="cropper-action-wrapper"
+  >
+    <div
+      ref="containerRef"
+      class="cropper-container"
+      :style="{
+        width: `${containerWidth}px`,
+        height: `${containerHeight}px`,
+      }"
+    >
+      <!-- 原图展示 - 自适应尺寸 -->
+      <img
+        ref="bgImageRef"
+        class="cropper-image"
+        :src="img"
+        @load="handleImageLoad"
+        :style="{
+          maxWidth: '100%',
+          maxHeight: '100%',
+          objectFit: 'contain',
+        }"
+        alt="裁剪原图"
+      />
+
+      <!-- 遮罩层 -->
+      <div
+        class="cropper-mask"
+        :style="{
+          display: isCropperVisible ? 'block' : 'none',
+          width: '100%',
+          height: '100%',
+        }"
+      >
+        <div
+          ref="maskViewRef"
+          class="cropper-mask-view"
+          :style="{
+            backgroundImage: `url(${img})`,
+            backgroundSize: 'contain',
+            backgroundPosition: 'center',
+            backgroundRepeat: 'no-repeat',
+            clipPath: `inset(${currentDimension[0]}px ${currentDimension[1]}px ${currentDimension[2]}px ${currentDimension[3]}px)`,
+            width: '100%',
+            height: '100%',
+          }"
+        ></div>
+      </div>
+
+      <!-- 裁剪框 -->
+      <div
+        ref="cropperRef"
+        class="cropper-box"
+        :style="{
+          display: isCropperVisible ? 'block' : 'none',
+          width: '100%',
+          height: '100%',
+        }"
+      >
+        <div
+          class="cropper-view"
+          :style="{
+            inset: `${currentDimension[0]}px ${currentDimension[1]}px ${currentDimension[2]}px ${currentDimension[3]}px`,
+          }"
+        >
+          <!-- 裁剪框辅助线-->
+          <span class="cropper-dashed-h"></span>
+          <span class="cropper-dashed-v"></span>
+
+          <!-- 裁剪框拖拽区域 -->
+          <span
+            class="cropper-move-area"
+            @mousedown="handleMouseDown($event, 'move')"
+          ></span>
+
+          <!-- 边框线 -->
+          <span class="cropper-line-e"></span>
+          <span class="cropper-line-n"></span>
+          <span class="cropper-line-w"></span>
+          <span class="cropper-line-s"></span>
+
+          <!-- 边角拖拽点 -->
+          <span
+            class="cropper-point cropper-point-ne"
+            @mousedown="handleMouseDown($event, 'top-right')"
+          >
+            <span class="cropper-point-inner"></span>
+          </span>
+          <span
+            class="cropper-point cropper-point-nw"
+            @mousedown="handleMouseDown($event, 'top-left')"
+          >
+            <span class="cropper-point-inner"></span>
+          </span>
+          <span
+            class="cropper-point cropper-point-sw"
+            @mousedown="handleMouseDown($event, 'bottom-left')"
+          >
+            <span class="cropper-point-inner"></span>
+          </span>
+          <span
+            class="cropper-point cropper-point-se"
+            @mousedown="handleMouseDown($event, 'bottom-right')"
+          >
+            <span class="cropper-point-inner"></span>
+          </span>
+
+          <!-- 边中点拖拽点 -->
+          <span
+            class="cropper-point cropper-point-e"
+            @mousedown="handleMouseDown($event, 'right')"
+          >
+            <span class="cropper-point-inner"></span>
+          </span>
+          <span
+            class="cropper-point cropper-point-n"
+            @mousedown="handleMouseDown($event, 'top')"
+          >
+            <span class="cropper-point-inner"></span>
+          </span>
+          <span
+            class="cropper-point cropper-point-w"
+            @mousedown="handleMouseDown($event, 'left')"
+          >
+            <span class="cropper-point-inner"></span>
+          </span>
+          <span
+            class="cropper-point cropper-point-s"
+            @mousedown="handleMouseDown($event, 'bottom')"
+          >
+            <span class="cropper-point-inner"></span>
+          </span>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<style scoped>
+@reference "@vben/tailwind-config/theme";
+
+.cropper-action-wrapper {
+  @apply box-border flex items-center justify-center;
+
+  background-color: transparent;
+
+  /* 马赛克背景 */
+  background-image:
+    linear-gradient(45deg, #ccc 25%, transparent 25%),
+    linear-gradient(-45deg, #ccc 25%, transparent 25%),
+    linear-gradient(45deg, transparent 75%, #ccc 75%),
+    linear-gradient(-45deg, transparent 75%, #ccc 75%);
+  background-position:
+    0 0,
+    0 10px,
+    10px -10px,
+    -10px 0;
+  background-size: 20px 20px;
+}
+
+.cropper-container {
+  @apply relative;
+}
+
+.cropper-image {
+  @apply block;
+}
+
+/* 遮罩层 */
+.cropper-mask {
+  @apply absolute top-0 left-0 bg-black/50;
+}
+
+.cropper-mask-view {
+  @apply absolute top-0 left-0;
+}
+
+/* 裁剪框 */
+.cropper-box {
+  @apply absolute top-0 left-0 z-10;
+}
+
+.cropper-view {
+  @apply absolute top-0 right-0 bottom-0 left-0 outline-1 outline-blue-500 select-none;
+}
+
+/* 裁剪框辅助线 */
+.cropper-dashed-h {
+  @apply absolute top-1/3 left-0 block h-1/3 w-full border-t border-b border-dashed border-gray-200/50;
+}
+
+.cropper-dashed-v {
+  @apply absolute top-0 left-1/3 block h-full w-1/3 border-r border-l border-dashed border-gray-200/50;
+}
+
+/* 裁剪框拖拽区域 */
+.cropper-move-area {
+  @apply absolute top-0 left-0 block h-full w-full cursor-move bg-white/10;
+}
+
+/* 边框拖拽线 */
+.cropper-line-e,
+.cropper-line-n,
+.cropper-line-w,
+.cropper-line-s {
+  @apply absolute block bg-blue-500/10;
+}
+
+.cropper-line-e {
+  @apply top-0 -right-0.75 h-full w-1;
+}
+
+.cropper-line-n {
+  @apply -top-0.75 left-0 h-1 w-full;
+}
+
+.cropper-line-w {
+  @apply top-0 -left-0.75 h-full w-1;
+}
+
+.cropper-line-s {
+  @apply -bottom-0.75 left-0 h-1 w-full;
+}
+
+/* 拖拽点 */
+.cropper-point {
+  @apply absolute flex h-2 w-2 items-center justify-center bg-blue-500;
+}
+
+.cropper-point-inner {
+  @apply block h-1.5 w-1.5 bg-white;
+}
+
+/* 边角拖拽点位置和光标 */
+.cropper-point-ne {
+  @apply -top-1.25 -right-1.25 cursor-ne-resize;
+}
+
+.cropper-point-nw {
+  @apply -top-1.25 -left-1.25 cursor-nw-resize;
+}
+
+.cropper-point-sw {
+  @apply -bottom-1.25 -left-1.25 cursor-sw-resize;
+}
+
+.cropper-point-se {
+  @apply -right-1.25 -bottom-1.25 cursor-se-resize;
+}
+
+/* 边中点拖拽点位置和光标 */
+.cropper-point-e {
+  @apply top-1/2 -right-1.25 -mt-1 cursor-e-resize;
+}
+
+.cropper-point-n {
+  @apply -top-1.25 left-1/2 -ml-1 cursor-n-resize;
+}
+
+.cropper-point-w {
+  @apply top-1/2 -left-1.25 -mt-1 cursor-w-resize;
+}
+
+.cropper-point-s {
+  @apply -bottom-1.25 left-1/2 -ml-1 cursor-s-resize;
+}
+</style>
diff --git a/packages/effects/common-ui/src/components/cropper/index.ts b/packages/effects/common-ui/src/components/cropper/index.ts
new file mode 100644
index 00000000..58a8f0ab
--- /dev/null
+++ b/packages/effects/common-ui/src/components/cropper/index.ts
@@ -0,0 +1 @@
+export { default as VCropper } from './cropper.vue';
diff --git a/packages/effects/common-ui/src/components/ellipsis-text/ellipsis-text.vue b/packages/effects/common-ui/src/components/ellipsis-text/ellipsis-text.vue
index bd4f1fd3..ed9b5572 100644
--- a/packages/effects/common-ui/src/components/ellipsis-text/ellipsis-text.vue
+++ b/packages/effects/common-ui/src/components/ellipsis-text/ellipsis-text.vue
@@ -1,8 +1,19 @@
 <script setup lang="ts">
-import { computed, type CSSProperties, ref, watchEffect } from 'vue';
+import type { CSSProperties } from 'vue';
+
+import {
+  computed,
+  onBeforeUnmount,
+  onMounted,
+  onUpdated,
+  ref,
+  watchEffect,
+} from 'vue';
 
 import { VbenTooltip } from '@vben-core/shadcn-ui';
 
+import { useElementSize } from '@vueuse/core';
+
 interface Props {
   /**
    * 是否启用点击文本展开全部
@@ -29,6 +40,16 @@ interface Props {
    * @default true
    */
   tooltip?: boolean;
+  /**
+   * 是否只在文本被截断时显示提示框
+   * @default false
+   */
+  tooltipWhenEllipsis?: boolean;
+  /**
+   * 文本截断检测的像素差异阈值，越大则判断越严格
+   * @default 3
+   */
+  ellipsisThreshold?: number;
   /**
    * 提示框背景颜色，优先级高于 overlayStyle
    */
@@ -58,12 +79,15 @@ const props = withDefaults(defineProps<Props>(), {
   maxWidth: '100%',
   placement: 'top',
   tooltip: true,
+  tooltipWhenEllipsis: false,
+  ellipsisThreshold: 3,
   tooltipBackgroundColor: '',
   tooltipColor: '',
   tooltipFontSize: 14,
   tooltipMaxWidth: undefined,
   tooltipOverlayStyle: () => ({ textAlign: 'justify' }),
 });
+
 const emit = defineEmits<{ expandChange: [boolean] }>();
 
 const textMaxWidth = computed(() => {
@@ -75,19 +99,83 @@ const textMaxWidth = computed(() => {
 const ellipsis = ref();
 const isExpand = ref(false);
 const defaultTooltipMaxWidth = ref();
+const isEllipsis = ref(false);
+
+const { width: eleWidth } = useElementSize(ellipsis);
+
+// 检测文本是否被截断
+const checkEllipsis = () => {
+  if (!ellipsis.value || !props.tooltipWhenEllipsis) return;
+
+  const element = ellipsis.value;
+
+  const originalText = element.textContent || '';
+  const originalTrimmed = originalText.trim();
+
+  // 对于空文本直接返回 false
+  if (!originalTrimmed) {
+    isEllipsis.value = false;
+    return;
+  }
+
+  const widthDiff = element.scrollWidth - element.clientWidth;
+  const heightDiff = element.scrollHeight - element.clientHeight;
+
+  // 使用足够大的差异阈值确保只有真正被截断的文本才会显示 tooltip
+  isEllipsis.value =
+    props.line === 1
+      ? widthDiff > props.ellipsisThreshold
+      : heightDiff > props.ellipsisThreshold;
+};
+
+// 使用 ResizeObserver 监听尺寸变化
+let resizeObserver: null | ResizeObserver = null;
+
+onMounted(() => {
+  if (typeof ResizeObserver !== 'undefined' && props.tooltipWhenEllipsis) {
+    resizeObserver = new ResizeObserver(() => {
+      checkEllipsis();
+    });
+
+    if (ellipsis.value) {
+      resizeObserver.observe(ellipsis.value);
+    }
+  }
+
+  // 初始检测
+  checkEllipsis();
+});
+
+// 使用onUpdated钩子检测内容变化
+onUpdated(() => {
+  if (props.tooltipWhenEllipsis) {
+    checkEllipsis();
+  }
+});
+
+onBeforeUnmount(() => {
+  if (resizeObserver) {
+    resizeObserver.disconnect();
+    resizeObserver = null;
+  }
+});
 
 watchEffect(
   () => {
-    if (props.tooltip && ellipsis.value) {
+    if (props.tooltip && eleWidth.value) {
       defaultTooltipMaxWidth.value =
-        props.tooltipMaxWidth ?? ellipsis.value.offsetWidth + 24;
+        props.tooltipMaxWidth ?? eleWidth.value + 24;
     }
   },
   { flush: 'post' },
 );
+
 function onExpand() {
   isExpand.value = !isExpand.value;
   emit('expandChange', isExpand.value);
+  if (props.tooltipWhenEllipsis) {
+    checkEllipsis();
+  }
 }
 
 function handleExpand() {
@@ -104,7 +192,9 @@ function handleExpand() {
         color: tooltipColor,
         backgroundColor: tooltipBackgroundColor,
       }"
-      :disabled="!props.tooltip || isExpand"
+      :disabled="
+        !props.tooltip || isExpand || (props.tooltipWhenEllipsis && !isEllipsis)
+      "
       :side="placement"
     >
       <slot name="tooltip">
@@ -115,7 +205,7 @@ function handleExpand() {
         <div
           ref="ellipsis"
           :class="{
-            '!cursor-pointer': expand,
+            'cursor-pointer!': expand,
             ['block truncate']: line === 1,
             [$style.ellipsisMultiLine]: line > 1,
           }"
diff --git a/packages/effects/common-ui/src/components/icon-picker/icon-picker.vue b/packages/effects/common-ui/src/components/icon-picker/icon-picker.vue
index 323ce447..e94ed004 100644
--- a/packages/effects/common-ui/src/components/icon-picker/icon-picker.vue
+++ b/packages/effects/common-ui/src/components/icon-picker/icon-picker.vue
@@ -1,67 +1,79 @@
 <script setup lang="ts">
-import { computed, h, ref, type VNode, watch, watchEffect } from 'vue';
+import type { IconPickerProps } from './types';
+
+import { computed, ref, useAttrs, watch, watchEffect } from 'vue';
 
 import { usePagination } from '@vben/hooks';
 import { EmptyIcon, Grip, listIcons } from '@vben/icons';
 import { $t } from '@vben/locales';
+
 import {
   Button,
+  Input,
   Pagination,
+  PaginationContent,
   PaginationEllipsis,
   PaginationFirst,
+  PaginationItem,
   PaginationLast,
-  PaginationList,
-  PaginationListItem,
   PaginationNext,
-  PaginationPrev,
+  PaginationPrevious,
   VbenIcon,
   VbenIconButton,
   VbenPopover,
 } from '@vben-core/shadcn-ui';
+import { isFunction } from '@vben-core/shared/utils';
 
-import { refDebounced } from '@vueuse/core';
+import { objectOmit, refDebounced, watchDebounced } from '@vueuse/core';
 
-interface Props {
-  pageSize?: number;
-  prefix?: string;
-  /**
-   * 图标列表
-   */
-  icons?: string[];
-  /** Input组件 */
-  inputComponent?: VNode;
-  /** 图标插槽名，预览图标将被渲染到此插槽中 */
-  iconSlot?: string;
-  /** input组件的值属性名称 */
-  modelValueProp?: string;
-  /** 图标样式 */
-  iconClass?: string;
-}
+import { fetchIconsData } from './icons';
 
-const props = withDefaults(defineProps<Props>(), {
+const props = withDefaults(defineProps<IconPickerProps>(), {
   prefix: 'ant-design',
   pageSize: 36,
   icons: () => [],
-  inputComponent: () => h('div'),
   iconSlot: 'default',
   iconClass: 'size-4',
-  modelValueProp: 'value',
+  autoFetchApi: true,
+  modelValueProp: 'modelValue',
+  inputComponent: undefined,
+  type: 'input',
 });
 
 const emit = defineEmits<{
   change: [string];
 }>();
 
+const attrs = useAttrs();
+
 const modelValue = defineModel({ default: '', type: String });
 
 const visible = ref(false);
 const currentSelect = ref('');
-const currentPage = ref(1);
 const keyword = ref('');
 const keywordDebounce = refDebounced(keyword, 300);
+const innerIcons = ref<string[]>([]);
+
+watchDebounced(
+  () => props.prefix,
+  async (prefix) => {
+    if (prefix && prefix !== 'svg' && props.autoFetchApi) {
+      innerIcons.value = await fetchIconsData(prefix);
+    }
+  },
+  { immediate: true, debounce: 500, maxWait: 1000 },
+);
+
 const currentList = computed(() => {
   try {
     if (props.prefix) {
+      if (
+        props.prefix !== 'svg' &&
+        props.autoFetchApi &&
+        props.icons.length === 0
+      ) {
+        return innerIcons.value;
+      }
       const icons = listIcons('', props.prefix);
       if (icons.length === 0) {
         console.warn(`No icons found for prefix: ${props.prefix}`);
@@ -82,7 +94,7 @@ const showList = computed(() => {
   );
 });
 
-const { paginationList, total, setCurrentPage } = usePagination(
+const { paginationList, total, setCurrentPage, currentPage } = usePagination(
   showList,
   props.pageSize,
 );
@@ -105,7 +117,6 @@ const handleClick = (icon: string) => {
 };
 
 const handlePageChange = (page: number) => {
-  currentPage.value = page;
   setCurrentPage(page);
 };
 
@@ -134,31 +145,90 @@ const searchInputProps = computed(() => {
   };
 });
 
+function updateCurrentSelect(v: string) {
+  currentSelect.value = v;
+  if (props.modelValueProp === 'modelValue') {
+    modelValue.value = v;
+  }
+  const eventKey = `onUpdate:${props.modelValueProp}`;
+  if (attrs[eventKey] && isFunction(attrs[eventKey])) {
+    attrs[eventKey](v);
+  }
+}
+const getBindAttrs = computed(() => {
+  return objectOmit(attrs, [`onUpdate:${props.modelValueProp}`]);
+});
+
 defineExpose({ toggleOpenState, open, close });
 </script>
 <template>
   <VbenPopover
     v-model:open="visible"
     :content-props="{ align: 'end', alignOffset: -11, sideOffset: 8 }"
-    content-class="p-0 pt-3"
+    content-class="p-0 pt-3 w-full"
+    trigger-class="w-full"
   >
     <template #trigger>
-      <component
-        :is="inputComponent"
-        :[modelValueProp]="currentSelect"
-        :placeholder="$t('ui.iconPicker.placeholder')"
-      >
-        <template #[iconSlot]>
-          <VbenIcon :icon="currentSelect || Grip" class="size-4" />
-        </template>
-      </component>
+      <template v-if="props.type === 'input'">
+        <component
+          v-if="props.inputComponent"
+          :is="inputComponent"
+          :[modelValueProp]="currentSelect"
+          :placeholder="$t('ui.iconPicker.placeholder')"
+          role="combobox"
+          :aria-label="$t('ui.iconPicker.placeholder')"
+          aria-expanded="visible"
+          :[`onUpdate:${modelValueProp}`]="updateCurrentSelect"
+          v-bind="getBindAttrs"
+        >
+          <template #[iconSlot]>
+            <VbenIcon
+              :icon="currentSelect || Grip"
+              class="size-4"
+              aria-hidden="true"
+            />
+          </template>
+        </component>
+        <div class="relative w-full" v-else>
+          <Input
+            v-bind="$attrs"
+            v-model="currentSelect"
+            :placeholder="$t('ui.iconPicker.placeholder')"
+            class="h-8 w-full pr-8"
+            role="combobox"
+            :aria-label="$t('ui.iconPicker.placeholder')"
+            aria-expanded="visible"
+          />
+          <VbenIcon
+            :icon="currentSelect || Grip"
+            class="absolute top-1 right-1 size-6"
+            aria-hidden="true"
+          />
+        </div>
+      </template>
+      <VbenIcon
+        :icon="currentSelect || Grip"
+        v-else
+        class="size-4"
+        v-bind="$attrs"
+      />
     </template>
     <div class="mb-2 flex w-full">
-      <component :is="inputComponent" v-bind="searchInputProps" />
+      <component
+        v-if="inputComponent"
+        :is="inputComponent"
+        v-bind="searchInputProps"
+      />
+      <Input
+        v-else
+        class="mx-2 h-8 w-full"
+        :placeholder="$t('ui.iconPicker.search')"
+        v-model="keyword"
+      />
     </div>
 
     <template v-if="paginationList.length > 0">
-      <div class="grid max-h-[360px] w-full grid-cols-6 justify-items-center">
+      <div class="grid max-h-90 w-full grid-cols-6 justify-items-center">
         <VbenIconButton
           v-for="(item, index) in paginationList"
           :key="index"
@@ -186,14 +256,14 @@ defineExpose({ toggleOpenState, open, close });
           size="small"
           @update:page="handlePageChange"
         >
-          <PaginationList
+          <PaginationContent
             v-slot="{ items }"
             class="flex w-full items-center gap-1"
           >
             <PaginationFirst class="size-5" />
-            <PaginationPrev class="size-5" />
+            <PaginationPrevious class="size-5" />
             <template v-for="(item, index) in items">
-              <PaginationListItem
+              <PaginationItem
                 v-if="item.type === 'page'"
                 :key="index"
                 :value="item.value"
@@ -205,7 +275,7 @@ defineExpose({ toggleOpenState, open, close });
                 >
                   {{ item.value }}
                 </Button>
-              </PaginationListItem>
+              </PaginationItem>
               <PaginationEllipsis
                 v-else
                 :key="item.type"
@@ -215,13 +285,13 @@ defineExpose({ toggleOpenState, open, close });
             </template>
             <PaginationNext class="size-5" />
             <PaginationLast class="size-5" />
-          </PaginationList>
+          </PaginationContent>
         </Pagination>
       </div>
     </template>
 
     <template v-else>
-      <div class="flex-col-center text-muted-foreground min-h-[150px] w-full">
+      <div class="flex-col-center min-h-37.5 w-full text-muted-foreground">
         <EmptyIcon class="size-10" />
         <div class="mt-1 text-sm">{{ $t('common.noData') }}</div>
       </div>
diff --git a/packages/effects/common-ui/src/components/icon-picker/icons.ts b/packages/effects/common-ui/src/components/icon-picker/icons.ts
new file mode 100644
index 00000000..694e904a
--- /dev/null
+++ b/packages/effects/common-ui/src/components/icon-picker/icons.ts
@@ -0,0 +1,56 @@
+import type { Recordable } from '@vben/types';
+
+/**
+ * 一个缓存对象，在不刷新页面时，无需重复请求远程接口
+ */
+export const ICONS_MAP: Recordable<string[]> = {};
+
+interface IconifyResponse {
+  prefix: string;
+  total: number;
+  title: string;
+  uncategorized?: string[];
+  categories?: Recordable<string[]>;
+  aliases?: Recordable<string>;
+}
+
+const PENDING_REQUESTS: Recordable<Promise<string[]>> = {};
+
+/**
+ * 通过Iconify接口获取图标集数据。
+ * 同一时间多个图标选择器同时请求同一个图标集时，实际上只会发起一次请求（所有请求共享同一份结果）。
+ * 请求结果会被缓存，刷新页面前同一个图标集不会再次请求
+ * @param prefix 图标集名称
+ * @returns 图标集中包含的所有图标名称
+ */
+export async function fetchIconsData(prefix: string): Promise<string[]> {
+  if (Reflect.has(ICONS_MAP, prefix) && ICONS_MAP[prefix]) {
+    return ICONS_MAP[prefix];
+  }
+  if (Reflect.has(PENDING_REQUESTS, prefix) && PENDING_REQUESTS[prefix]) {
+    return PENDING_REQUESTS[prefix];
+  }
+  PENDING_REQUESTS[prefix] = (async () => {
+    try {
+      const controller = new AbortController();
+      const timeoutId = setTimeout(() => controller.abort(), 1000 * 10);
+      const response: IconifyResponse = await fetch(
+        `https://api.iconify.design/collection?prefix=${prefix}`,
+        { signal: controller.signal },
+      ).then((res) => res.json());
+      clearTimeout(timeoutId);
+      const list = response.uncategorized || [];
+      if (response.categories) {
+        for (const category in response.categories) {
+          list.push(...(response.categories[category] || []));
+        }
+      }
+      ICONS_MAP[prefix] = list.map((v) => `${prefix}:${v}`);
+    } catch (error) {
+      console.error(`Failed to fetch icons for prefix ${prefix}:`, error);
+      return [] as string[];
+    }
+    return ICONS_MAP[prefix];
+  })();
+  return PENDING_REQUESTS[prefix];
+}
diff --git a/packages/effects/common-ui/src/components/icon-picker/index.ts b/packages/effects/common-ui/src/components/icon-picker/index.ts
index 3dabc86a..8d600b83 100644
--- a/packages/effects/common-ui/src/components/icon-picker/index.ts
+++ b/packages/effects/common-ui/src/components/icon-picker/index.ts
@@ -1 +1,2 @@
 export { default as IconPicker } from './icon-picker.vue';
+export type { IconPickerProps } from './types';
diff --git a/packages/effects/common-ui/src/components/icon-picker/types.ts b/packages/effects/common-ui/src/components/icon-picker/types.ts
new file mode 100644
index 00000000..7695bb55
--- /dev/null
+++ b/packages/effects/common-ui/src/components/icon-picker/types.ts
@@ -0,0 +1,22 @@
+import type { VNode } from 'vue';
+
+export interface IconPickerProps {
+  pageSize?: number;
+  /** 图标集的名字 */
+  prefix?: string;
+  /** 是否自动请求API以获得图标集的数据.提供prefix时有效 */
+  autoFetchApi?: boolean;
+  /**
+   * 图标列表
+   */
+  icons?: string[];
+  /** Input组件 */
+  inputComponent?: VNode;
+  /** 图标插槽名，预览图标将被渲染到此插槽中 */
+  iconSlot?: string;
+  /** input组件的值属性名称 */
+  modelValueProp?: string;
+  /** 图标样式 */
+  iconClass?: string;
+  type?: 'icon' | 'input';
+}
diff --git a/packages/effects/common-ui/src/components/index.ts b/packages/effects/common-ui/src/components/index.ts
index 19cd3aa2..64e50d49 100644
--- a/packages/effects/common-ui/src/components/index.ts
+++ b/packages/effects/common-ui/src/components/index.ts
@@ -1,22 +1,52 @@
 export * from './api-component';
 export * from './captcha';
 export * from './col-page';
+export * from './count-to';
+export * from './cropper';
 export * from './ellipsis-text';
 export * from './icon-picker';
+export * from './json-viewer';
+export * from './loading';
 export * from './page';
 export * from './resize';
+export * from './tippy';
+export * from './tree';
 export * from '@vben-core/form-ui';
 export * from '@vben-core/popup-ui';
 
 // 给文档用
 export {
+  VbenAvatar,
   VbenButton,
+  VbenButtonGroup,
+  VbenCheckbox,
+  VbenCheckButtonGroup,
+  VbenCollapsibleParams,
+  VbenContextMenu,
   VbenCountToAnimator,
   VbenIcon,
+  VbenDescriptions,
+  VbenDescriptionsItem,
+  VbenFullScreen,
+  VbenIconButton,
   VbenInputPassword,
   VbenLoading,
+  VbenLogo,
   VbenPinInput,
+  VbenSelect,
   VbenSpinner,
+  VbenTableAction,
 } from '@vben-core/shadcn-ui';
 
+export type {
+  ActionItem,
+  CollapsibleParamSchema,
+  CollapsibleParamsProps,
+  DescriptionsColumn,
+  DescriptionsItemType,
+  DescriptionsProps,
+  DescriptionsSize,
+  FlattenedItem,
+  TableActionProps,
+} from '@vben-core/shadcn-ui';
 export { globalShareState } from '@vben-core/shared/global-state';
diff --git a/packages/effects/common-ui/src/components/json-viewer/index.ts b/packages/effects/common-ui/src/components/json-viewer/index.ts
new file mode 100644
index 00000000..1aec78bb
--- /dev/null
+++ b/packages/effects/common-ui/src/components/json-viewer/index.ts
@@ -0,0 +1,3 @@
+export { default as JsonViewer } from './index.vue';
+
+export * from './types';
diff --git a/packages/effects/common-ui/src/components/json-viewer/index.vue b/packages/effects/common-ui/src/components/json-viewer/index.vue
new file mode 100644
index 00000000..72618f5c
--- /dev/null
+++ b/packages/effects/common-ui/src/components/json-viewer/index.vue
@@ -0,0 +1,128 @@
+<script lang="ts" setup>
+import type { SetupContext } from 'vue';
+
+import type { Recordable } from '@vben/types';
+
+import type {
+  JsonViewerAction,
+  JsonViewerProps,
+  JsonViewerToggle,
+  JsonViewerValue,
+} from './types';
+
+import { computed, ref, useAttrs } from 'vue';
+import VueJsonPretty from 'vue-json-pretty';
+import 'vue-json-pretty/lib/styles.css';
+
+import { $t } from '@vben/locales';
+
+import JsonBigint from 'json-bigint';
+
+defineOptions({ name: 'JsonViewer' });
+
+const props = withDefaults(defineProps<JsonViewerProps>(), {
+  expandDepth: 1,
+  copyable: false,
+  sort: false,
+  boxed: false,
+  theme: 'default-json-theme',
+  expanded: false,
+  previewMode: false,
+  showArrayIndex: true,
+  showDoubleQuotes: false,
+});
+
+const emit = defineEmits<{
+  click: [event: MouseEvent];
+  copied: [event: JsonViewerAction];
+  keyClick: [key: string];
+  toggle: [param: JsonViewerToggle];
+  valueClick: [value: JsonViewerValue];
+}>();
+
+const attrs: SetupContext['attrs'] = useAttrs();
+
+const copiedPath = ref<null | string>(null);
+
+const copyConfig = computed(() => {
+  return {
+    copiedText: $t('ui.jsonViewer.copied'),
+    copyText: $t('ui.jsonViewer.copy'),
+    timeout: 2000,
+  };
+});
+
+function handleCopy(node: any, defaultCopy: () => void) {
+  defaultCopy();
+  copiedPath.value = node.path;
+  emit('copied', {
+    action: 'copy',
+    text: JSON.stringify(node.content),
+    trigger: node.el ?? document.body,
+  });
+  setTimeout(() => {
+    if (copiedPath.value === node.path) {
+      copiedPath.value = null;
+    }
+  }, copyConfig.value.timeout ?? 2000);
+}
+
+// 支持显示 bigint 数据，如较长的订单号
+const jsonData = computed<Record<string, any>>(() => {
+  if (typeof props.value !== 'string') {
+    return props.value || {};
+  }
+
+  try {
+    return JsonBigint({ storeAsString: true }).parse(props.value);
+  } catch (error) {
+    console.error('JSON parse error:', error);
+    return {};
+  }
+});
+
+const bindProps = computed<Recordable<any>>(() => {
+  const prettyTheme =
+    props.theme === 'dark' || props.theme === 'dark-json-theme'
+      ? 'dark'
+      : 'light';
+
+  return {
+    ...attrs,
+    data: jsonData.value,
+    deep: props.expanded ? Infinity : props.expandDepth,
+    showDoubleQuotes: props.showDoubleQuotes,
+    showLine: props.boxed,
+    showLength: true,
+    showIcon: true,
+    theme: prettyTheme,
+    collapsedNodeLength: props.previewMode ? 0 : Infinity,
+    renderNodeActions: !!props.copyable,
+  };
+});
+</script>
+<template>
+  <div :class="[props.theme, { boxed: props.boxed }]" class="vben-json-viewer">
+    <VueJsonPretty v-bind="bindProps">
+      <template #renderNodeActions="{ node, defaultActions }">
+        <slot name="copy" :node="node" :default-actions="defaultActions">
+          <span
+            v-if="props.copyable"
+            class="vben-json-copy-btn"
+            :class="[{ 'is-copied': copiedPath === node.path }]"
+            @click.stop="handleCopy(node, defaultActions.copy)"
+          >
+            {{
+              copiedPath === node.path
+                ? copyConfig.copiedText
+                : copyConfig.copyText
+            }}
+          </span>
+        </slot>
+      </template>
+    </VueJsonPretty>
+  </div>
+</template>
+<style lang="scss">
+@use './style.scss';
+</style>
diff --git a/packages/effects/common-ui/src/components/json-viewer/style.scss b/packages/effects/common-ui/src/components/json-viewer/style.scss
new file mode 100644
index 00000000..ffbb184b
--- /dev/null
+++ b/packages/effects/common-ui/src/components/json-viewer/style.scss
@@ -0,0 +1,91 @@
+.vben-json-viewer {
+  font-family: Consolas, Menlo, Courier, monospace;
+  font-size: 14px;
+  color: hsl(var(--foreground));
+  background: hsl(var(--background));
+
+  &.boxed {
+    padding: 10px;
+    border: 1px solid hsl(var(--border));
+    border-radius: 4px;
+  }
+
+  .vjs-key {
+    color: hsl(var(--heavy-foreground));
+  }
+
+  .vjs-value-null,
+  .vjs-value-undefined {
+    color: hsl(var(--secondary-foreground));
+  }
+
+  .vjs-value-boolean {
+    color: hsl(var(--red-400));
+  }
+
+  .vjs-value-number {
+    color: hsl(var(--info-foreground));
+  }
+
+  .vjs-value-string {
+    color: hsl(var(--primary));
+    overflow-wrap: break-word;
+    white-space: normal;
+  }
+
+  .vjs-tree-brackets {
+    color: hsl(var(--heavy-foreground));
+  }
+
+  .vjs-comment {
+    color: hsl(var(--secondary-foreground));
+  }
+
+  .vjs-tree-node {
+    &.is-highlight {
+      background-color: hsl(var(--accent));
+    }
+  }
+
+  .vjs-carets {
+    cursor: pointer;
+
+    &:hover {
+      color: hsl(var(--primary));
+    }
+  }
+
+  .vjs-indent-unit {
+    &.has-line {
+      border-left: 1px solid hsl(var(--border));
+    }
+  }
+
+  .vben-json-copy-btn {
+    display: inline-block;
+    padding: 0 6px;
+    margin-left: 8px;
+    font-size: 12px;
+    line-height: 20px;
+    color: hsl(var(--primary));
+    cursor: pointer;
+    user-select: none;
+    background-color: hsl(var(--secondary));
+    border-radius: 3px;
+    opacity: 0;
+    transition: opacity 0.2s;
+
+    &:hover {
+      background-color: hsl(var(--accent));
+    }
+
+    &.is-copied {
+      color: hsl(var(--success-foreground, var(--primary)));
+      opacity: 1;
+    }
+  }
+
+  .vjs-tree-node:hover .vben-json-copy-btn {
+    opacity: 1;
+  }
+}
diff --git a/packages/effects/common-ui/src/components/json-viewer/types.ts b/packages/effects/common-ui/src/components/json-viewer/types.ts
new file mode 100644
index 00000000..8f3a206e
--- /dev/null
+++ b/packages/effects/common-ui/src/components/json-viewer/types.ts
@@ -0,0 +1,44 @@
+export interface JsonViewerProps {
+  /** 要展示的结构数据 */
+  value: any;
+  /** 展开深度 */
+  expandDepth?: number;
+  /** 是否可复制 */
+  copyable?: boolean;
+  /** 是否排序 */
+  sort?: boolean;
+  /** 显示边框 */
+  boxed?: boolean;
+  /** 主题 */
+  theme?: string;
+  /** 是否展开 */
+  expanded?: boolean;
+  /** 时间格式化函数 */
+  timeformat?: (time: Date | number | string) => string;
+  /** 预览模式 */
+  previewMode?: boolean;
+  /** 显示数组索引 */
+  showArrayIndex?: boolean;
+  /** 显示双引号 */
+  showDoubleQuotes?: boolean;
+}
+
+export interface JsonViewerAction {
+  action: string;
+  text: string;
+  trigger: HTMLElement;
+}
+
+export interface JsonViewerValue {
+  value: any;
+  path: string;
+  depth: number;
+  el: HTMLElement;
+}
+
+export interface JsonViewerToggle {
+  /** 鼠标事件 */
+  event: MouseEvent;
+  /** 当前展开状态 */
+  open: boolean;
+}
diff --git a/packages/effects/common-ui/src/components/loading/directive.ts b/packages/effects/common-ui/src/components/loading/directive.ts
new file mode 100644
index 00000000..973a605d
--- /dev/null
+++ b/packages/effects/common-ui/src/components/loading/directive.ts
@@ -0,0 +1,132 @@
+import type { App, Directive, DirectiveBinding } from 'vue';
+
+import { h, render } from 'vue';
+
+import { VbenLoading, VbenSpinner } from '@vben-core/shadcn-ui';
+import { isString } from '@vben-core/shared/utils';
+
+const LOADING_INSTANCE_KEY = Symbol('loading');
+const SPINNER_INSTANCE_KEY = Symbol('spinner');
+
+const CLASS_NAME_RELATIVE = 'spinner-parent--relative';
+
+const loadingDirective: Directive = {
+  mounted(el, binding) {
+    const instance = h(VbenLoading, getOptions(binding));
+    render(instance, el);
+
+    el.classList.add(CLASS_NAME_RELATIVE);
+    el[LOADING_INSTANCE_KEY] = instance;
+  },
+  unmounted(el) {
+    const instance = el[LOADING_INSTANCE_KEY];
+    el.classList.remove(CLASS_NAME_RELATIVE);
+    render(null, el);
+    instance.el.remove();
+
+    el[LOADING_INSTANCE_KEY] = null;
+  },
+
+  updated(el, binding) {
+    const instance = el[LOADING_INSTANCE_KEY];
+    const options = getOptions(binding);
+    if (options && instance?.component) {
+      try {
+        Object.keys(options).forEach((key) => {
+          instance.component.props[key] = options[key];
+        });
+        instance.component.update();
+      } catch (error) {
+        console.error(
+          'Failed to update loading component in directive:',
+          error,
+        );
+      }
+    }
+  },
+};
+
+function getOptions(binding: DirectiveBinding) {
+  if (binding.value === undefined) {
+    return { spinning: true };
+  } else if (typeof binding.value === 'boolean') {
+    return { spinning: binding.value };
+  } else {
+    return { ...binding.value };
+  }
+}
+
+const spinningDirective: Directive = {
+  mounted(el, binding) {
+    const instance = h(VbenSpinner, getOptions(binding));
+    render(instance, el);
+
+    el.classList.add(CLASS_NAME_RELATIVE);
+    el[SPINNER_INSTANCE_KEY] = instance;
+  },
+  unmounted(el) {
+    const instance = el[SPINNER_INSTANCE_KEY];
+    el.classList.remove(CLASS_NAME_RELATIVE);
+    render(null, el);
+    instance.el.remove();
+
+    el[SPINNER_INSTANCE_KEY] = null;
+  },
+
+  updated(el, binding) {
+    const instance = el[SPINNER_INSTANCE_KEY];
+    const options = getOptions(binding);
+    if (options && instance?.component) {
+      try {
+        Object.keys(options).forEach((key) => {
+          instance.component.props[key] = options[key];
+        });
+        instance.component.update();
+      } catch (error) {
+        console.error(
+          'Failed to update spinner component in directive:',
+          error,
+        );
+      }
+    }
+  },
+};
+
+type loadingDirectiveParams = {
+  /** 是否注册loading指令。如果提供一个string，则将指令注册为指定的名称 */
+  loading?: boolean | string;
+  /** 是否注册spinning指令。如果提供一个string，则将指令注册为指定的名称 */
+  spinning?: boolean | string;
+};
+
+/**
+ * 注册loading指令
+ * @param app
+ * @param params
+ */
+export function registerLoadingDirective(
+  app: App,
+  params?: loadingDirectiveParams,
+) {
+  // 注入一个样式供指令使用，确保容器是相对定位
+  const style = document.createElement('style');
+  style.id = CLASS_NAME_RELATIVE;
+  style.innerHTML = `
+    .${CLASS_NAME_RELATIVE} {
+      position: relative !important;
+    }
+  `;
+  document.head.append(style);
+  if (params?.loading !== false) {
+    app.directive(
+      isString(params?.loading) ? params.loading : 'loading',
+      loadingDirective,
+    );
+  }
+  if (params?.spinning !== false) {
+    app.directive(
+      isString(params?.spinning) ? params.spinning : 'spinning',
+      spinningDirective,
+    );
+  }
+}
diff --git a/packages/effects/common-ui/src/components/loading/index.ts b/packages/effects/common-ui/src/components/loading/index.ts
new file mode 100644
index 00000000..2fbfb047
--- /dev/null
+++ b/packages/effects/common-ui/src/components/loading/index.ts
@@ -0,0 +1,3 @@
+export * from './directive';
+export { default as Loading } from './loading.vue';
+export { default as Spinner } from './spinner.vue';
diff --git a/packages/effects/common-ui/src/components/loading/loading.vue b/packages/effects/common-ui/src/components/loading/loading.vue
new file mode 100644
index 00000000..faf49e60
--- /dev/null
+++ b/packages/effects/common-ui/src/components/loading/loading.vue
@@ -0,0 +1,39 @@
+<script lang="ts" setup>
+import { VbenLoading } from '@vben-core/shadcn-ui';
+import { cn } from '@vben-core/shared/utils';
+
+interface LoadingProps {
+  class?: string;
+  /**
+   * @zh_CN 最小加载时间
+   * @en_US Minimum loading time
+   */
+  minLoadingTime?: number;
+
+  /**
+   * @zh_CN loading状态开启
+   */
+  spinning?: boolean;
+  /**
+   * @zh_CN 文字
+   */
+  text?: string;
+}
+
+defineOptions({ name: 'Loading' });
+const props = defineProps<LoadingProps>();
+</script>
+<template>
+  <div :class="cn('relative min-h-20', props.class)">
+    <slot></slot>
+    <VbenLoading
+      :min-loading-time="props.minLoadingTime"
+      :spinning="props.spinning"
+      :text="props.text"
+    >
+      <template v-if="$slots.icon" #icon>
+        <slot name="icon"></slot>
+      </template>
+    </VbenLoading>
+  </div>
+</template>
diff --git a/packages/effects/common-ui/src/components/loading/spinner.vue b/packages/effects/common-ui/src/components/loading/spinner.vue
new file mode 100644
index 00000000..caee2bbc
--- /dev/null
+++ b/packages/effects/common-ui/src/components/loading/spinner.vue
@@ -0,0 +1,28 @@
+<script lang="ts" setup>
+import { VbenSpinner } from '@vben-core/shadcn-ui';
+import { cn } from '@vben-core/shared/utils';
+
+interface SpinnerProps {
+  class?: string;
+  /**
+   * @zh_CN 最小加载时间
+   * @en_US Minimum loading time
+   */
+  minLoadingTime?: number;
+  /**
+   * @zh_CN loading状态开启
+   */
+  spinning?: boolean;
+}
+defineOptions({ name: 'Spinner' });
+const props = defineProps<SpinnerProps>();
+</script>
+<template>
+  <div :class="cn('relative min-h-20', props.class)">
+    <slot></slot>
+    <VbenSpinner
+      :min-loading-time="props.minLoadingTime"
+      :spinning="props.spinning"
+    />
+  </div>
+</template>
diff --git a/packages/effects/common-ui/src/components/page/__tests__/page.test.ts b/packages/effects/common-ui/src/components/page/__tests__/page.test.ts
index 776fe6af..a89061f5 100644
--- a/packages/effects/common-ui/src/components/page/__tests__/page.test.ts
+++ b/packages/effects/common-ui/src/components/page/__tests__/page.test.ts
@@ -1,4 +1,5 @@
 import { mount } from '@vue/test-utils';
+
 import { describe, expect, it } from 'vitest';
 
 import { Page } from '..';
diff --git a/packages/effects/common-ui/src/components/page/page.vue b/packages/effects/common-ui/src/components/page/page.vue
index 3a2ca8ac..55146b93 100644
--- a/packages/effects/common-ui/src/components/page/page.vue
+++ b/packages/effects/common-ui/src/components/page/page.vue
@@ -1,14 +1,9 @@
 <script setup lang="ts">
+import type { StyleValue } from 'vue';
+
 import type { PageProps } from './types';
 
-import {
-  computed,
-  nextTick,
-  onMounted,
-  ref,
-  type StyleValue,
-  useTemplateRef,
-} from 'vue';
+import { computed, nextTick, onMounted, ref, useTemplateRef } from 'vue';
 
 import { CSS_VARIABLE_LAYOUT_CONTENT_HEIGHT } from '@vben-core/shared/constants';
 import { cn } from '@vben-core/shared/utils';
@@ -17,7 +12,11 @@ defineOptions({
   name: 'Page',
 });
 
-const { autoContentHeight = false } = defineProps<PageProps>();
+const {
+  autoContentHeight = false,
+  heightOffset = 0,
+  footerFixed = false,
+} = defineProps<PageProps>();
 
 const headerHeight = ref(0);
 const footerHeight = ref(0);
@@ -29,7 +28,7 @@ const footerRef = useTemplateRef<HTMLDivElement>('footerRef');
 const contentStyle = computed<StyleValue>(() => {
   if (autoContentHeight) {
     return {
-      height: `calc(var(${CSS_VARIABLE_LAYOUT_CONTENT_HEIGHT}) - ${headerHeight.value}px)`,
+      height: `calc(var(${CSS_VARIABLE_LAYOUT_CONTENT_HEIGHT}) - ${headerHeight.value}px - ${footerHeight.value}px - ${typeof heightOffset === 'number' ? `${heightOffset}px` : heightOffset})`,
       overflowY: shouldAutoHeight.value ? 'auto' : 'unset',
     };
   }
@@ -40,9 +39,12 @@ async function calcContentHeight() {
   if (!autoContentHeight) {
     return;
   }
+  shouldAutoHeight.value = false;
   await nextTick();
   headerHeight.value = headerRef.value?.offsetHeight || 0;
-  footerHeight.value = footerRef.value?.offsetHeight || 0;
+
+  footerHeight.value = footerFixed ? 0 : footerRef.value?.offsetHeight || 0;
+
   setTimeout(() => {
     shouldAutoHeight.value = true;
   }, 30);
@@ -54,7 +56,7 @@ onMounted(() => {
 </script>
 
 <template>
-  <div class="relative">
+  <div class="relative flex h-full flex-col">
     <div
       v-if="
         description ||
@@ -66,7 +68,7 @@ onMounted(() => {
       ref="headerRef"
       :class="
         cn(
-          'bg-card border-border relative flex items-end border-b px-6 py-4',
+          'relative flex items-end border-b border-border bg-card px-6 py-4',
           headerClass,
         )
       "
@@ -90,19 +92,16 @@ onMounted(() => {
       </div>
     </div>
 
-    <div :class="cn('h-full p-4', contentClass)" :style="contentStyle">
+    <div
+      :class="cn(autoContentHeight ? 'h-full' : 'flex-1', 'p-4', contentClass)"
+      :style="contentStyle"
+    >
       <slot></slot>
     </div>
-
     <div
       v-if="$slots.footer"
       ref="footerRef"
-      :class="
-        cn(
-          'bg-card align-center absolute bottom-0 left-0 right-0 flex px-6 py-4',
-          footerClass,
-        )
-      "
+      :class="cn('align-center flex bg-card px-6 py-4', footerClass)"
     >
       <slot name="footer"></slot>
     </div>
diff --git a/packages/effects/common-ui/src/components/page/types.ts b/packages/effects/common-ui/src/components/page/types.ts
index 5316d08d..dfebd122 100644
--- a/packages/effects/common-ui/src/components/page/types.ts
+++ b/packages/effects/common-ui/src/components/page/types.ts
@@ -8,4 +8,16 @@ export interface PageProps {
   autoContentHeight?: boolean;
   headerClass?: string;
   footerClass?: string;
+  /**
+   * Custom height offset value (in pixels) to adjust content area sizing
+   * when used with autoContentHeight
+   * @default 0
+   */
+  heightOffset?: number;
+  /**
+   * Whether the footer is position: fixed.
+   * When true, footer height is excluded from content height calculation.
+   * @default false
+   */
+  footerFixed?: boolean;
 }
diff --git a/packages/effects/common-ui/src/components/resize/resize.vue b/packages/effects/common-ui/src/components/resize/resize.vue
index aaf89eaf..18b1cf63 100644
--- a/packages/effects/common-ui/src/components/resize/resize.vue
+++ b/packages/effects/common-ui/src/components/resize/resize.vue
@@ -264,13 +264,64 @@ const currentStick = ref<null | string>(null);
 
 const parentElement = ref<HTMLElement | null>(null);
 
-const width = computed(() => parentWidth.value! - left.value! - right.value!);
+function getPointerPosition(
+  ev: Partial<{
+    pageX: number;
+    pageY: number;
+    touches: ArrayLike<{ pageX: number; pageY: number }>;
+  }>,
+): null | { pointerX: number; pointerY: number } {
+  const touch = ev.touches?.[0];
+  const pointerX = ev.pageX ?? touch?.pageX;
+  const pointerY = ev.pageY ?? touch?.pageY;
 
-const height = computed(() => parentHeight.value! - top.value! - bottom.value!);
+  if (
+    pointerX === null ||
+    pointerX === undefined ||
+    pointerY === null ||
+    pointerY === undefined
+  ) {
+    return null;
+  }
+
+  return { pointerX, pointerY };
+}
+
+const width = computed(() => {
+  const currentParentWidth = parentWidth.value;
+  const currentLeft = left.value;
+  const currentRight = right.value;
+
+  if (
+    currentParentWidth === null ||
+    currentLeft === null ||
+    currentRight === null
+  ) {
+    return 0;
+  }
+
+  return currentParentWidth - currentLeft - currentRight;
+});
+
+const height = computed(() => {
+  const currentParentHeight = parentHeight.value;
+  const currentTop = top.value;
+  const currentBottom = bottom.value;
+
+  if (
+    currentParentHeight === null ||
+    currentTop === null ||
+    currentBottom === null
+  ) {
+    return 0;
+  }
+
+  return currentParentHeight - currentTop - currentBottom;
+});
 
 const rect = computed(() => ({
-  left: Math.round(left.value!),
-  top: Math.round(top.value!),
+  left: Math.round(left.value ?? 0),
+  top: Math.round(top.value ?? 0),
   width: Math.round(width.value),
   height: Math.round(height.value),
 }));
@@ -348,36 +399,48 @@ const rectCorrectionByAspectRatio = (rect: {
   newTop: number;
 }) => {
   let { newLeft, newRight, newTop, newBottom } = rect;
-  // const { parentWidth, parentHeight, currentStick, aspectFactor, dimensionsBeforeMove } = this;
+  const currentParentWidth = parentWidth.value;
+  const currentParentHeight = parentHeight.value;
+  const stick = currentStick.value;
+  const factor = aspectFactor.value;
 
-  let newWidth = parentWidth.value! - newLeft - newRight;
-  let newHeight = parentHeight.value! - newTop - newBottom;
+  if (
+    currentParentWidth === null ||
+    currentParentHeight === null ||
+    !stick ||
+    factor === null
+  ) {
+    return { newLeft, newRight, newTop, newBottom };
+  }
 
-  if (currentStick.value![1] === 'm') {
+  let newWidth = currentParentWidth - newLeft - newRight;
+  let newHeight = currentParentHeight - newTop - newBottom;
+
+  if (stick[1] === 'm') {
     const deltaHeight = newHeight - dimensionsBeforeMove.value.height;
 
-    newLeft -= (deltaHeight * aspectFactor.value!) / 2;
-    newRight -= (deltaHeight * aspectFactor.value!) / 2;
-  } else if (currentStick.value![0] === 'm') {
+    newLeft -= (deltaHeight * factor) / 2;
+    newRight -= (deltaHeight * factor) / 2;
+  } else if (stick[0] === 'm') {
     const deltaWidth = newWidth - dimensionsBeforeMove.value.width;
 
-    newTop -= deltaWidth / aspectFactor.value! / 2;
-    newBottom -= deltaWidth / aspectFactor.value! / 2;
-  } else if (newWidth / newHeight > aspectFactor.value!) {
-    newWidth = aspectFactor.value! * newHeight;
+    newTop -= deltaWidth / factor / 2;
+    newBottom -= deltaWidth / factor / 2;
+  } else if (newWidth / newHeight > factor) {
+    newWidth = factor * newHeight;
 
-    if (currentStick.value![1] === 'l') {
-      newLeft = parentWidth.value! - newRight - newWidth;
+    if (stick[1] === 'l') {
+      newLeft = currentParentWidth - newRight - newWidth;
     } else {
-      newRight = parentWidth.value! - newLeft - newWidth;
+      newRight = currentParentWidth - newLeft - newWidth;
     }
   } else {
-    newHeight = newWidth / aspectFactor.value!;
+    newHeight = newWidth / factor;
 
-    if (currentStick.value![0] === 't') {
-      newTop = parentHeight.value! - newBottom - newHeight;
+    if (stick[0] === 't') {
+      newTop = currentParentHeight - newBottom - newHeight;
     } else {
-      newBottom = parentHeight.value! - newTop - newHeight;
+      newBottom = currentParentHeight - newTop - newHeight;
     }
   }
 
@@ -385,11 +448,17 @@ const rectCorrectionByAspectRatio = (rect: {
 };
 
 const stickMove = (delta: { x: number; y: number }) => {
+  const stick = currentStick.value;
+
+  if (!stick) {
+    return;
+  }
+
   let newTop = dimensionsBeforeMove.value.top;
   let newBottom = dimensionsBeforeMove.value.bottom;
   let newLeft = dimensionsBeforeMove.value.left;
   let newRight = dimensionsBeforeMove.value.right;
-  switch (currentStick.value![0]) {
+  switch (stick[0]) {
     case 'b': {
       newBottom = dimensionsBeforeMove.value.bottom + delta.y;
 
@@ -419,7 +488,7 @@ const stickMove = (delta: { x: number; y: number }) => {
     }
   }
 
-  switch (currentStick.value![1]) {
+  switch (stick[1]) {
     case 'l': {
       newLeft = dimensionsBeforeMove.value.left - delta.x;
 
@@ -512,89 +581,121 @@ const calcDragLimitation = () => {
 };
 
 const calcResizeLimits = () => {
-  // const { aspectFactor, width, height, bottom, top, left, right } = this;
-
   const parentLim = parentLimitation.value ? 0 : null;
+  const currentAspectFactor = aspectFactor.value;
+  const currentLeft = left.value;
+  const currentRight = right.value;
+  const currentTop = top.value;
+  const currentBottom = bottom.value;
+  const stick = currentStick.value;
 
-  if (aspectRatio.value) {
-    if (minw.value / minh.value > (aspectFactor.value as number)) {
-      minh.value = minw.value / (aspectFactor.value as number);
+  if (
+    currentLeft === null ||
+    currentRight === null ||
+    currentTop === null ||
+    currentBottom === null
+  ) {
+    return {
+      left: { min: parentLim, max: parentLim },
+      right: { min: parentLim, max: parentLim },
+      top: { min: parentLim, max: parentLim },
+      bottom: { min: parentLim, max: parentLim },
+    };
+  }
+
+  let minWidth = minw.value;
+  let minHeight = minh.value;
+
+  if (aspectRatio.value && currentAspectFactor) {
+    if (minWidth / minHeight > currentAspectFactor) {
+      minHeight = minWidth / currentAspectFactor;
     } else {
-      minw.value = ((aspectFactor.value as number) * minh.value) as number;
+      minWidth = currentAspectFactor * minHeight;
     }
   }
 
   const limits = {
     left: {
       min: parentLim,
-      max: (left.value as number) + (width.value - minw.value),
+      max: currentLeft + (width.value - minWidth),
     },
     right: {
       min: parentLim,
-      max: (right.value as number) + (width.value - minw.value),
+      max: currentRight + (width.value - minWidth),
     },
     top: {
       min: parentLim,
-      max: (top.value as number) + (height.value - minh.value),
+      max: currentTop + (height.value - minHeight),
     },
     bottom: {
       min: parentLim,
-      max: (bottom.value as number) + (height.value - minh.value),
+      max: currentBottom + (height.value - minHeight),
     },
   };
 
-  if (aspectRatio.value) {
+  if (aspectRatio.value && currentAspectFactor) {
     const aspectLimits = {
       left: {
         min:
-          left.value! -
-          Math.min(top.value!, bottom.value!) * aspectFactor.value! * 2,
+          currentLeft -
+          Math.min(currentTop, currentBottom) * currentAspectFactor * 2,
         max:
-          left.value! +
-          ((height.value - minh.value!) / 2) * aspectFactor.value! * 2,
+          currentLeft +
+          ((height.value - minHeight) / 2) * currentAspectFactor * 2,
       },
       right: {
         min:
-          right.value! -
-          Math.min(top.value!, bottom.value!) * aspectFactor.value! * 2,
+          currentRight -
+          Math.min(currentTop, currentBottom) * currentAspectFactor * 2,
         max:
-          right.value! +
-          ((height.value - minh.value!) / 2) * aspectFactor.value! * 2,
+          currentRight +
+          ((height.value - minHeight) / 2) * currentAspectFactor * 2,
       },
       top: {
         min:
-          top.value! -
-          (Math.min(left.value!, right.value!) / aspectFactor.value!) * 2,
+          currentTop -
+          (Math.min(currentLeft, currentRight) / currentAspectFactor) * 2,
         max:
-          top.value! +
-          ((width.value - minw.value) / 2 / aspectFactor.value!) * 2,
+          currentTop + ((width.value - minWidth) / 2 / currentAspectFactor) * 2,
       },
       bottom: {
         min:
-          bottom.value! -
-          (Math.min(left.value!, right.value!) / aspectFactor.value!) * 2,
+          currentBottom -
+          (Math.min(currentLeft, currentRight) / currentAspectFactor) * 2,
         max:
-          bottom.value! +
-          ((width.value - minw.value) / 2 / aspectFactor.value!) * 2,
+          currentBottom +
+          ((width.value - minWidth) / 2 / currentAspectFactor) * 2,
       },
     };
 
-    if (currentStick.value![0] === 'm') {
+    if (stick?.[0] === 'm') {
       limits.left = {
-        min: Math.max(limits.left.min!, aspectLimits.left.min),
+        min: Math.max(
+          limits.left.min ?? aspectLimits.left.min,
+          aspectLimits.left.min,
+        ),
         max: Math.min(limits.left.max, aspectLimits.left.max),
       };
       limits.right = {
-        min: Math.max(limits.right.min!, aspectLimits.right.min),
+        min: Math.max(
+          limits.right.min ?? aspectLimits.right.min,
+          aspectLimits.right.min,
+        ),
         max: Math.min(limits.right.max, aspectLimits.right.max),
       };
-    } else if (currentStick.value![1] === 'm') {
+    } else if (stick?.[1] === 'm') {
       limits.top = {
-        min: Math.max(limits.top.min!, aspectLimits.top.min),
+        min: Math.max(
+          limits.top.min ?? aspectLimits.top.min,
+          aspectLimits.top.min,
+        ),
         max: Math.min(limits.top.max, aspectLimits.top.max),
       };
       limits.bottom = {
-        min: Math.max(limits.bottom.min!, aspectLimits.bottom.min),
+        min: Math.max(
+          limits.bottom.min ?? aspectLimits.bottom.min,
+          aspectLimits.bottom.min,
+        ),
         max: Math.min(limits.bottom.max, aspectLimits.bottom.max),
       };
     }
@@ -604,9 +705,9 @@ const calcResizeLimits = () => {
 };
 
 const positionStyle = computed(() => ({
-  top: `${top.value}px`,
-  left: `${left.value}px`,
-  zIndex: zIndex.value!,
+  top: `${top.value ?? 0}px`,
+  left: `${left.value ?? 0}px`,
+  zIndex: zIndex.value ?? 'auto',
 }));
 
 const sizeStyle = computed(() => ({
@@ -618,13 +719,11 @@ const stickStyles = computed(() => (stick: string) => {
   const stickStyle = {
     width: `${stickSize.value / parentScaleX.value}px`,
     height: `${stickSize.value / parentScaleY.value}px`,
+    [styleMapping.y[stick[0] as 'b' | 'm' | 't'] as 'height' | 'width']:
+      `${stickSize.value / parentScaleX.value / -2}px`,
+    [styleMapping.x[stick[1] as 'l' | 'm' | 'r'] as 'height' | 'width']:
+      `${stickSize.value / parentScaleX.value / -2}px`,
   };
-  stickStyle[
-    styleMapping.y[stick[0] as 'b' | 'm' | 't'] as 'height' | 'width'
-  ] = `${stickSize.value / parentScaleX.value / -2}px`;
-  stickStyle[
-    styleMapping.x[stick[1] as 'l' | 'm' | 'r'] as 'height' | 'width'
-  ] = `${stickSize.value / parentScaleX.value / -2}px`;
   return stickStyle;
 });
 
@@ -719,12 +818,15 @@ const stickDown = (
     return;
   }
 
+  const pointerPosition = getPointerPosition(ev);
+
+  if (!pointerPosition) {
+    return;
+  }
+
   stickDrag.value = true;
 
-  const pointerX = ev.pageX === undefined ? ev.touches[0].pageX : ev.pageX;
-  const pointerY = ev.pageY === undefined ? ev.touches[0].pageY : ev.pageY;
-
-  saveDimensionsBeforeMove({ pointerX, pointerY });
+  saveDimensionsBeforeMove(pointerPosition);
 
   currentStick.value = stick;
 
@@ -738,13 +840,19 @@ const move = (ev: MouseEvent & TouchEvent) => {
 
   ev.stopPropagation();
 
-  // touches 兼容性代码
-  const pageX = ev.pageX === undefined ? ev.touches![0]!.pageX : ev.pageX;
-  const pageY = ev.pageY === undefined ? ev.touches![0]!.pageY : ev.pageY;
+  const pointerPosition = getPointerPosition(ev);
+
+  if (!pointerPosition) {
+    return;
+  }
 
   const delta = {
-    x: (dimensionsBeforeMove.value.pointerX - pageX) / parentScaleX.value,
-    y: (dimensionsBeforeMove.value.pointerY - pageY) / parentScaleY.value,
+    x:
+      (dimensionsBeforeMove.value.pointerX - pointerPosition.pointerX) /
+      parentScaleX.value,
+    y:
+      (dimensionsBeforeMove.value.pointerY - pointerPosition.pointerY) /
+      parentScaleY.value,
   };
 
   if (stickDrag.value) {
@@ -812,12 +920,17 @@ onMounted(() => {
 
   left.value = x.value;
   top.value = y.value;
-  right.value = (parentWidth.value -
-    (w.value === 'auto' ? container.value!.scrollWidth : (w.value as number)) -
-    left.value) as number;
-  bottom.value = (parentHeight.value -
-    (h.value === 'auto' ? container.value!.scrollHeight : (h.value as number)) -
-    top.value) as number;
+  const containerElement = container.value;
+  const contentWidth =
+    w.value === 'auto'
+      ? (containerElement?.scrollWidth ?? 0)
+      : (w.value as number);
+  const contentHeight =
+    h.value === 'auto'
+      ? (containerElement?.scrollHeight ?? 0)
+      : (h.value as number);
+  right.value = (parentWidth.value ?? 0) - contentWidth - (left.value ?? 0);
+  bottom.value = (parentHeight.value ?? 0) - contentHeight - (top.value ?? 0);
 
   addEvents(domEvents.value);
 
@@ -841,13 +954,14 @@ onMounted(() => {
     );
   }
 });
-
 onBeforeUnmount(() => {
   removeEvents(domEvents.value);
 });
 
 const bodyDown = (ev: MouseEvent & TouchEvent) => {
   const { target, button } = ev;
+  const targetElement = target instanceof HTMLElement ? target : null;
+  const uid = getCurrentInstance()?.uid.toString();
 
   if (!preventActiveBehavior.value) {
     active.value = true;
@@ -865,17 +979,13 @@ const bodyDown = (ev: MouseEvent & TouchEvent) => {
 
   if (
     dragHandle.value &&
-    (target! as HTMLElement).dataset.dragHandle !==
-      getCurrentInstance()?.uid.toString()
+    targetElement &&
+    targetElement.dataset.dragHandle !== uid
   ) {
     return;
   }
 
-  if (
-    dragCancel.value &&
-    (target! as HTMLElement).dataset.dragCancel ===
-      getCurrentInstance()?.uid.toString()
-  ) {
+  if (dragCancel.value && targetElement?.dataset.dragCancel === uid) {
     return;
   }
 
@@ -887,14 +997,17 @@ const bodyDown = (ev: MouseEvent & TouchEvent) => {
     ev.preventDefault();
   }
 
+  const pointerPosition = getPointerPosition(ev);
+
+  if (!pointerPosition) {
+    return;
+  }
+
   if (isDraggable.value) {
     bodyDrag.value = true;
   }
 
-  const pointerX = ev.pageX === undefined ? ev.touches[0]!.pageX : ev.pageX;
-  const pointerY = ev.pageY === undefined ? ev.touches[0]!.pageY : ev.pageY;
-
-  saveDimensionsBeforeMove({ pointerX, pointerY });
+  saveDimensionsBeforeMove(pointerPosition);
 
   if (parentLimitation.value) {
     limits.value = calcDragLimitation();
@@ -923,8 +1036,10 @@ watch(
 watch(
   () => z.value,
   (val) => {
-    if ((val as number) >= 0 || val === 'auto') {
-      zIndex.value = val as number;
+    if (typeof val === 'number' && val >= 0) {
+      zIndex.value = val;
+    } else if (val === 'auto') {
+      zIndex.value = null;
     }
   },
   { immediate: true },
@@ -933,13 +1048,22 @@ watch(
 watch(
   () => x.value,
   (newVal, oldVal) => {
-    if (stickDrag.value || bodyDrag.value || newVal === left.value) {
+    const currentLeft = left.value;
+    const currentTop = top.value;
+
+    if (
+      stickDrag.value ||
+      bodyDrag.value ||
+      currentLeft === null ||
+      currentTop === null ||
+      newVal === currentLeft
+    ) {
       return;
     }
 
     const delta = oldVal - newVal;
 
-    bodyDown({ pageX: left.value!, pageY: top.value! } as MouseEvent &
+    bodyDown({ pageX: currentLeft, pageY: currentTop } as MouseEvent &
       TouchEvent);
     bodyMove({ x: delta, y: 0 });
 
@@ -952,13 +1076,22 @@ watch(
 watch(
   () => y.value,
   (newVal, oldVal) => {
-    if (stickDrag.value || bodyDrag.value || newVal === top.value) {
+    const currentLeft = left.value;
+    const currentTop = top.value;
+
+    if (
+      stickDrag.value ||
+      bodyDrag.value ||
+      currentLeft === null ||
+      currentTop === null ||
+      newVal === currentTop
+    ) {
       return;
     }
 
     const delta = oldVal - newVal;
 
-    bodyDown({ pageX: left.value, pageY: top.value } as MouseEvent &
+    bodyDown({ pageX: currentLeft, pageY: currentTop } as MouseEvent &
       TouchEvent);
     bodyMove({ x: 0, y: delta });
 
@@ -971,16 +1104,23 @@ watch(
 watch(
   () => w.value,
   (newVal, oldVal) => {
+    const currentRight = right.value;
+    const currentTop = top.value;
+
     if (stickDrag.value || bodyDrag.value || newVal === width.value) {
       return;
     }
 
+    if (currentRight === null || currentTop === null) {
+      return;
+    }
+
     const stick = 'mr';
     const delta = (oldVal as number) - (newVal as number);
 
     stickDown(
       stick,
-      { pageX: right.value, pageY: top.value! + height.value / 2 },
+      { pageX: currentRight, pageY: currentTop + height.value / 2 },
       true,
     );
     stickMove({ x: delta, y: 0 });
@@ -994,16 +1134,23 @@ watch(
 watch(
   () => h.value,
   (newVal, oldVal) => {
+    const currentLeft = left.value;
+    const currentBottom = bottom.value;
+
     if (stickDrag.value || bodyDrag.value || newVal === height.value) {
       return;
     }
 
+    if (currentLeft === null || currentBottom === null) {
+      return;
+    }
+
     const stick = 'bm';
     const delta = (oldVal as number) - (newVal as number);
 
     stickDown(
       stick,
-      { pageX: left.value! + width.value / 2, pageY: bottom.value },
+      { pageX: currentLeft + width.value / 2, pageY: currentBottom },
       true,
     );
     stickMove({ x: 0, y: delta });
@@ -1017,7 +1164,7 @@ watch(
 watch(
   () => parentW.value,
   (val) => {
-    right.value = val - width.value - left.value!;
+    right.value = val - width.value - (left.value ?? 0);
     parentWidth.value = val;
   },
 );
@@ -1025,7 +1172,7 @@ watch(
 watch(
   () => parentH.value,
   (val) => {
-    bottom.value = val - height.value - top.value!;
+    bottom.value = val - height.value - (top.value ?? 0);
     parentHeight.value = val;
   },
 );
@@ -1072,8 +1219,8 @@ watch(
   box-sizing: border-box;
   width: 100%;
   height: 100%;
-  content: '';
   outline: 1px dashed #d6d6d6;
+  content: '';
 }
 
 .resize-stick {
diff --git a/packages/effects/common-ui/src/components/tippy/directive.ts b/packages/effects/common-ui/src/components/tippy/directive.ts
new file mode 100644
index 00000000..ed277d6a
--- /dev/null
+++ b/packages/effects/common-ui/src/components/tippy/directive.ts
@@ -0,0 +1,100 @@
+import type { ComputedRef, Directive } from 'vue';
+
+import { useTippy } from 'vue-tippy';
+
+export default function useTippyDirective(isDark: ComputedRef<boolean>) {
+  const directive: Directive = {
+    mounted(el, binding, vnode) {
+      const opts =
+        typeof binding.value === 'string'
+          ? { content: binding.value }
+          : binding.value || {};
+
+      const modifiers = Object.keys(binding.modifiers || {});
+      const placement = modifiers.find((modifier) => modifier !== 'arrow');
+      const withArrow = modifiers.includes('arrow');
+
+      if (placement) {
+        opts.placement = opts.placement || placement;
+      }
+
+      if (withArrow) {
+        opts.arrow = opts.arrow === undefined ? true : opts.arrow;
+      }
+
+      if (vnode.props && vnode.props.onTippyShow) {
+        opts.onShow = function (...args: any[]) {
+          return vnode.props?.onTippyShow(...args);
+        };
+      }
+
+      if (vnode.props && vnode.props.onTippyShown) {
+        opts.onShown = function (...args: any[]) {
+          return vnode.props?.onTippyShown(...args);
+        };
+      }
+
+      if (vnode.props && vnode.props.onTippyHidden) {
+        opts.onHidden = function (...args: any[]) {
+          return vnode.props?.onTippyHidden(...args);
+        };
+      }
+
+      if (vnode.props && vnode.props.onTippyHide) {
+        opts.onHide = function (...args: any[]) {
+          return vnode.props?.onTippyHide(...args);
+        };
+      }
+
+      if (vnode.props && vnode.props.onTippyMount) {
+        opts.onMount = function (...args: any[]) {
+          return vnode.props?.onTippyMount(...args);
+        };
+      }
+
+      if (el.getAttribute('title') && !opts.content) {
+        opts.content = el.getAttribute('title');
+        el.removeAttribute('title');
+      }
+
+      if (el.getAttribute('content') && !opts.content) {
+        opts.content = el.getAttribute('content');
+      }
+
+      useTippy(el, opts);
+    },
+    unmounted(el) {
+      if (el.$tippy) {
+        el.$tippy.destroy();
+      } else if (el._tippy) {
+        el._tippy.destroy();
+      }
+    },
+
+    updated(el, binding) {
+      const opts =
+        typeof binding.value === 'string'
+          ? { content: binding.value, theme: isDark.value ? '' : 'light' }
+          : Object.assign(
+              { theme: isDark.value ? '' : 'light' },
+              binding.value,
+            );
+
+      if (el.getAttribute('title') && !opts.content) {
+        opts.content = el.getAttribute('title');
+        el.removeAttribute('title');
+      }
+
+      if (el.getAttribute('content') && !opts.content) {
+        opts.content = el.getAttribute('content');
+      }
+
+      if (el.$tippy) {
+        el.$tippy.setProps(opts || {});
+      } else if (el._tippy) {
+        el._tippy.setProps(opts || {});
+      }
+    },
+  };
+  return directive;
+}
diff --git a/packages/effects/common-ui/src/components/tippy/index.ts b/packages/effects/common-ui/src/components/tippy/index.ts
new file mode 100644
index 00000000..6080e582
--- /dev/null
+++ b/packages/effects/common-ui/src/components/tippy/index.ts
@@ -0,0 +1,67 @@
+import type { DefaultProps, Props } from 'tippy.js';
+
+import type { App, SetupContext } from 'vue';
+
+import { h, watchEffect } from 'vue';
+import { setDefaultProps, Tippy as TippyComponent } from 'vue-tippy';
+
+import { usePreferences } from '@vben-core/preferences';
+
+import useTippyDirective from './directive';
+
+import 'tippy.js/dist/tippy.css';
+import 'tippy.js/dist/backdrop.css';
+import 'tippy.js/themes/light.css';
+import 'tippy.js/animations/scale.css';
+import 'tippy.js/animations/shift-toward.css';
+import 'tippy.js/animations/shift-away.css';
+import 'tippy.js/animations/perspective.css';
+
+const { isDark } = usePreferences();
+export type TippyProps = Partial<
+  Props & {
+    animation?:
+      | 'fade'
+      | 'perspective'
+      | 'scale'
+      | 'shift-away'
+      | 'shift-toward'
+      | boolean;
+    theme?: 'auto' | 'dark' | 'light';
+  }
+>;
+
+export function initTippy(app: App<Element>, options?: DefaultProps) {
+  setDefaultProps({
+    allowHTML: true,
+    delay: [500, 200],
+    theme: isDark.value ? '' : 'light',
+    ...options,
+  });
+  if (!options || !Reflect.has(options, 'theme') || options.theme === 'auto') {
+    watchEffect(() => {
+      setDefaultProps({ theme: isDark.value ? '' : 'light' });
+    });
+  }
+
+  app.directive('tippy', useTippyDirective(isDark));
+}
+
+export const Tippy = (props: any, { attrs, slots }: SetupContext) => {
+  let theme: string = (attrs.theme as string) ?? 'auto';
+  if (theme === 'auto') {
+    theme = isDark.value ? '' : 'light';
+  }
+  if (theme === 'dark') {
+    theme = '';
+  }
+  return h(
+    TippyComponent,
+    {
+      ...props,
+      ...attrs,
+      theme,
+    },
+    slots,
+  );
+};
diff --git a/packages/effects/common-ui/src/components/tree/index.ts b/packages/effects/common-ui/src/components/tree/index.ts
new file mode 100644
index 00000000..ce3bc5c6
--- /dev/null
+++ b/packages/effects/common-ui/src/components/tree/index.ts
@@ -0,0 +1 @@
+export { default as Tree } from './tree.vue';
diff --git a/packages/effects/common-ui/src/components/tree/tree.vue b/packages/effects/common-ui/src/components/tree/tree.vue
new file mode 100644
index 00000000..4f5c8b71
--- /dev/null
+++ b/packages/effects/common-ui/src/components/tree/tree.vue
@@ -0,0 +1,25 @@
+<script setup lang="ts">
+import type { TreeProps } from '@vben-core/shadcn-ui';
+
+import { Inbox } from '@vben/icons';
+import { $t } from '@vben/locales';
+
+import { treePropsDefaults, VbenTree } from '@vben-core/shadcn-ui';
+
+const props = withDefaults(defineProps<TreeProps>(), treePropsDefaults());
+</script>
+
+<template>
+  <VbenTree v-if="props.treeData?.length > 0" v-bind="props">
+    <template v-for="(_, key) in $slots" :key="key" #[key]="slotProps">
+      <slot :name="key" v-bind="slotProps"> </slot>
+    </template>
+  </VbenTree>
+  <div
+    v-else
+    class="flex-col-center cursor-pointer rounded-lg border p-10 text-sm font-medium text-muted-foreground"
+  >
+    <Inbox class="size-10" />
+    <div class="mt-1">{{ $t('common.noData') }}</div>
+  </div>
+</template>
diff --git a/packages/effects/common-ui/src/ui/about/about.vue b/packages/effects/common-ui/src/ui/about/about.vue
index 9395d704..24fccfa0 100644
--- a/packages/effects/common-ui/src/ui/about/about.vue
+++ b/packages/effects/common-ui/src/ui/about/about.vue
@@ -8,6 +8,7 @@ import {
   VBEN_GITHUB_URL,
   VBEN_PREVIEW_URL,
 } from '@vben/constants';
+
 import { VbenRenderContent } from '@vben-core/shadcn-ui';
 
 import { Page } from '../../components';
@@ -113,7 +114,7 @@ const devDependenciesItems = Object.keys(devDependencies).map((key) => ({
 <template>
   <Page :title="title">
     <template #description>
-      <p class="text-foreground mt-3 text-sm leading-6">
+      <p class="mt-3 text-sm/6 text-foreground">
         <a :href="VBEN_GITHUB_URL" class="vben-link" target="_blank">
           {{ name }}
         </a>
@@ -122,16 +123,16 @@ const devDependenciesItems = Object.keys(devDependencies).map((key) => ({
     </template>
     <div class="card-box p-5">
       <div>
-        <h5 class="text-foreground text-lg">基本信息</h5>
+        <h5 class="text-lg text-foreground">基本信息</h5>
       </div>
       <div class="mt-4">
         <dl class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4">
           <template v-for="item in vbenDescriptionItems" :key="item.title">
-            <div class="border-border border-t px-4 py-6 sm:col-span-1 sm:px-0">
-              <dt class="text-foreground text-sm font-medium leading-6">
+            <div class="border-t border-border px-4 py-6 sm:col-span-1 sm:px-0">
+              <dt class="text-sm/6 font-medium text-foreground">
                 {{ item.title }}
               </dt>
-              <dd class="text-foreground mt-1 text-sm leading-6 sm:mt-2">
+              <dd class="mt-1 text-sm/6 text-foreground sm:mt-2">
                 <VbenRenderContent :content="item.content" />
               </dd>
             </div>
@@ -142,16 +143,16 @@ const devDependenciesItems = Object.keys(devDependencies).map((key) => ({
 
     <div class="card-box mt-6 p-5">
       <div>
-        <h5 class="text-foreground text-lg">生产环境依赖</h5>
+        <h5 class="text-lg text-foreground">生产环境依赖</h5>
       </div>
       <div class="mt-4">
         <dl class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4">
           <template v-for="item in dependenciesItems" :key="item.title">
-            <div class="border-border border-t px-4 py-3 sm:col-span-1 sm:px-0">
-              <dt class="text-foreground text-sm">
+            <div class="border-t border-border px-4 py-3 sm:col-span-1 sm:px-0">
+              <dt class="text-sm text-foreground">
                 {{ item.title }}
               </dt>
-              <dd class="text-foreground/80 mt-1 text-sm sm:mt-2">
+              <dd class="mt-1 text-sm text-foreground/80 sm:mt-2">
                 <VbenRenderContent :content="item.content" />
               </dd>
             </div>
@@ -161,16 +162,16 @@ const devDependenciesItems = Object.keys(devDependencies).map((key) => ({
     </div>
     <div class="card-box mt-6 p-5">
       <div>
-        <h5 class="text-foreground text-lg">开发环境依赖</h5>
+        <h5 class="text-lg text-foreground">开发环境依赖</h5>
       </div>
       <div class="mt-4">
         <dl class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4">
           <template v-for="item in devDependenciesItems" :key="item.title">
-            <div class="border-border border-t px-4 py-3 sm:col-span-1 sm:px-0">
-              <dt class="text-foreground text-sm">
+            <div class="border-t border-border px-4 py-3 sm:col-span-1 sm:px-0">
+              <dt class="text-sm text-foreground">
                 {{ item.title }}
               </dt>
-              <dd class="text-foreground/80 mt-1 text-sm sm:mt-2">
+              <dd class="mt-1 text-sm text-foreground/80 sm:mt-2">
                 <VbenRenderContent :content="item.content" />
               </dd>
             </div>
diff --git a/packages/effects/common-ui/src/ui/authentication/auth-title.vue b/packages/effects/common-ui/src/ui/authentication/auth-title.vue
index 3ed9a6be..5b8be56f 100644
--- a/packages/effects/common-ui/src/ui/authentication/auth-title.vue
+++ b/packages/effects/common-ui/src/ui/authentication/auth-title.vue
@@ -1,12 +1,12 @@
 <template>
   <div class="mb-7 sm:mx-auto sm:w-full sm:max-w-md">
     <h2
-      class="text-foreground mb-3 text-3xl font-bold leading-9 tracking-tight lg:text-4xl"
+      class="mb-3 text-3xl/9 font-bold tracking-tight text-foreground lg:text-4xl"
     >
       <slot></slot>
     </h2>
 
-    <p class="text-muted-foreground lg:text-md text-sm">
+    <p class="lg:text-md text-sm text-muted-foreground">
       <slot name="desc"></slot>
     </p>
   </div>
diff --git a/packages/effects/common-ui/src/ui/authentication/code-login.vue b/packages/effects/common-ui/src/ui/authentication/code-login.vue
index 7de5dd3b..d7563d8f 100644
--- a/packages/effects/common-ui/src/ui/authentication/code-login.vue
+++ b/packages/effects/common-ui/src/ui/authentication/code-login.vue
@@ -1,11 +1,13 @@
 <script setup lang="ts">
 import type { Recordable } from '@vben/types';
+
 import type { VbenFormSchema } from '@vben-core/form-ui';
 
 import { computed, reactive } from 'vue';
 import { useRouter } from 'vue-router';
 
 import { $t } from '@vben/locales';
+
 import { useVbenForm } from '@vben-core/form-ui';
 import { VbenButton } from '@vben-core/shadcn-ui';
 
@@ -33,6 +35,10 @@ interface Props {
    * @zh_CN 按钮文本
    */
   submitButtonText?: string;
+  /**
+   * @zh_CN 是否显示返回按钮
+   */
+  showBack?: boolean;
 }
 
 defineOptions({
@@ -41,6 +47,7 @@ defineOptions({
 
 const props = withDefaults(defineProps<Props>(), {
   loading: false,
+  showBack: true,
   loginPath: '/auth/login',
   submitButtonText: '',
   subTitle: '',
@@ -68,10 +75,7 @@ async function handleSubmit() {
   const { valid } = await formApi.validate();
   const values = await formApi.getValues();
   if (valid) {
-    emit('submit', {
-      code: values?.code,
-      phoneNumber: values?.phoneNumber,
-    });
+    emit('submit', values);
   }
 }
 
@@ -111,7 +115,12 @@ defineExpose({
         {{ submitButtonText || $t('common.login') }}
       </slot>
     </VbenButton>
-    <VbenButton class="mt-4 w-full" variant="outline" @click="goToLogin()">
+    <VbenButton
+      v-if="showBack"
+      class="mt-4 w-full"
+      variant="outline"
+      @click="goToLogin()"
+    >
       {{ $t('common.back') }}
     </VbenButton>
   </div>
diff --git a/packages/effects/common-ui/src/ui/authentication/dingding-login.vue b/packages/effects/common-ui/src/ui/authentication/dingding-login.vue
new file mode 100644
index 00000000..5e201d8d
--- /dev/null
+++ b/packages/effects/common-ui/src/ui/authentication/dingding-login.vue
@@ -0,0 +1,113 @@
+<script setup lang="ts">
+import { useRoute } from 'vue-router';
+
+import { SvgDingDingIcon } from '@vben/icons';
+import { $t } from '@vben/locales';
+
+import { alert, useVbenModal } from '@vben-core/popup-ui';
+import { VbenIconButton } from '@vben-core/shadcn-ui';
+import { loadScript } from '@vben-core/shared/utils';
+
+interface Props {
+  clientId: string;
+  corpId: string;
+  // 登录回调地址
+  redirectUri?: string;
+  // 是否内嵌二维码登录
+  isQrCode?: boolean;
+}
+
+const props = defineProps<Props>();
+
+const route = useRoute();
+
+const [Modal, modalApi] = useVbenModal({
+  header: false,
+  footer: false,
+  fullscreenButton: false,
+  class: 'size-75.5 dingding-qrcode-login-modal',
+  onOpened() {
+    handleQrCodeLogin();
+  },
+});
+
+const getRedirectUri = () => {
+  const { redirectUri } = props;
+  if (redirectUri) {
+    return redirectUri;
+  }
+  return window.location.origin + route.fullPath;
+};
+
+/**
+ * 内嵌二维码登录
+ */
+const handleQrCodeLogin = async () => {
+  const { clientId, corpId } = props;
+  if (!(window as any).DTFrameLogin) {
+    // 二维码登录 加载资源
+    await loadScript(
+      'https://g.alicdn.com/dingding/h5-dingtalk-login/0.21.0/ddlogin.js',
+    );
+  }
+  (window as any).DTFrameLogin(
+    {
+      id: 'dingding_qrcode_login_element',
+      width: 300,
+      height: 300,
+    },
+    {
+      // 注意：redirect_uri 需为完整URL，扫码后钉钉会带code跳转到这里
+      redirect_uri: encodeURIComponent(getRedirectUri()),
+      client_id: clientId,
+      scope: 'openid corpid',
+      response_type: 'code',
+      state: '1',
+      prompt: 'consent',
+      corpId,
+    },
+    (loginResult: any) => {
+      const { redirectUrl } = loginResult;
+      // 这里可以直接进行重定向
+      window.location.href = redirectUrl;
+    },
+    (errorMsg: string) => {
+      // 这里一般需要展示登录失败的具体原因
+      alert(`Login Error: ${errorMsg}`);
+    },
+  );
+};
+
+const handleLogin = () => {
+  const { clientId, corpId, isQrCode } = props;
+  if (isQrCode) {
+    // 内嵌二维码登录
+    modalApi.open();
+  } else {
+    window.location.href = `https://login.dingtalk.com/oauth2/auth?redirect_uri=${encodeURIComponent(getRedirectUri())}&response_type=code&client_id=${clientId}&scope=openid&corpid=${corpId}&prompt=consent`;
+  }
+};
+</script>
+
+<template>
+  <div>
+    <VbenIconButton
+      @click="handleLogin"
+      :tooltip="$t('authentication.dingdingLogin')"
+      tooltip-side="top"
+    >
+      <SvgDingDingIcon />
+    </VbenIconButton>
+    <Modal>
+      <div id="dingding_qrcode_login_element"></div>
+    </Modal>
+  </div>
+</template>
+
+<style>
+.dingding-qrcode-login-modal {
+  .relative {
+    padding: 0 !important;
+  }
+}
+</style>
diff --git a/packages/effects/common-ui/src/ui/authentication/forget-password.vue b/packages/effects/common-ui/src/ui/authentication/forget-password.vue
index 7955ded6..9c82df49 100644
--- a/packages/effects/common-ui/src/ui/authentication/forget-password.vue
+++ b/packages/effects/common-ui/src/ui/authentication/forget-password.vue
@@ -5,6 +5,7 @@ import { computed, reactive } from 'vue';
 import { useRouter } from 'vue-router';
 
 import { $t } from '@vben/locales';
+
 import { useVbenForm } from '@vben-core/form-ui';
 import { VbenButton } from '@vben-core/shadcn-ui';
 
diff --git a/packages/effects/common-ui/src/ui/authentication/index.ts b/packages/effects/common-ui/src/ui/authentication/index.ts
index 95a3890f..ac5e1e01 100644
--- a/packages/effects/common-ui/src/ui/authentication/index.ts
+++ b/packages/effects/common-ui/src/ui/authentication/index.ts
@@ -1,7 +1,7 @@
 export { default as AuthenticationCodeLogin } from './code-login.vue';
 export { default as AuthenticationForgetPassword } from './forget-password.vue';
-export { default as AuthenticationLogin } from './login.vue';
 export { default as AuthenticationLoginExpiredModal } from './login-expired-modal.vue';
+export { default as AuthenticationLogin } from './login.vue';
 export { default as AuthenticationQrCodeLogin } from './qrcode-login.vue';
 export { default as AuthenticationRegister } from './register.vue';
 export type { AuthenticationProps } from './types';
diff --git a/packages/effects/common-ui/src/ui/authentication/login-expired-modal.vue b/packages/effects/common-ui/src/ui/authentication/login-expired-modal.vue
index 4b4f9b44..9500492f 100644
--- a/packages/effects/common-ui/src/ui/authentication/login-expired-modal.vue
+++ b/packages/effects/common-ui/src/ui/authentication/login-expired-modal.vue
@@ -3,6 +3,8 @@ import type { AuthenticationProps } from './types';
 
 import { computed, watch } from 'vue';
 
+import { $t } from '@vben/locales';
+
 import { useVbenModal } from '@vben-core/popup-ui';
 import { Slot, VbenAvatar } from '@vben-core/shadcn-ui';
 
@@ -35,6 +37,16 @@ const getZIndex = computed(() => {
   return props.zIndex || calcZIndex();
 });
 
+/**
+ * 排除ant-message和loading:9999的z-index
+ */
+const zIndexExcludeClass = ['ant-message', 'loading'];
+function isZIndexExcludeClass(element: Element) {
+  return zIndexExcludeClass.some((className) =>
+    element.classList.contains(className),
+  );
+}
+
 /**
  * 获取最大的zIndex值
  */
@@ -44,7 +56,11 @@ function calcZIndex() {
   [...elements].forEach((element) => {
     const style = window.getComputedStyle(element);
     const zIndex = style.getPropertyValue('z-index');
-    if (zIndex && !Number.isNaN(Number.parseInt(zIndex))) {
+    if (
+      zIndex &&
+      !Number.isNaN(Number.parseInt(zIndex)) &&
+      !isZIndexExcludeClass(element)
+    ) {
       maxZ = Math.max(maxZ, Number.parseInt(zIndex));
     }
   });
@@ -62,7 +78,7 @@ function calcZIndex() {
       :fullscreen-button="false"
       :header="false"
       :z-index="getZIndex"
-      class="border-none px-10 py-6 text-center shadow-xl sm:w-[600px] sm:rounded-2xl md:h-[unset]"
+      class="border-none px-10 py-6 text-center shadow-xl sm:w-150 sm:rounded-2xl md:h-[unset]"
     >
       <VbenAvatar :src="avatar" class="mx-auto mb-6 size-20" />
       <Slot
diff --git a/packages/effects/common-ui/src/ui/authentication/login.vue b/packages/effects/common-ui/src/ui/authentication/login.vue
index 9aa92a2f..25dacd36 100644
--- a/packages/effects/common-ui/src/ui/authentication/login.vue
+++ b/packages/effects/common-ui/src/ui/authentication/login.vue
@@ -1,5 +1,6 @@
 <script setup lang="ts">
 import type { Recordable } from '@vben/types';
+
 import type { VbenFormSchema } from '@vben-core/form-ui';
 
 import type { AuthenticationProps } from './types';
@@ -8,6 +9,7 @@ import { computed, onMounted, reactive, ref } from 'vue';
 import { useRouter } from 'vue-router';
 
 import { $t } from '@vben/locales';
+
 import { useVbenForm } from '@vben-core/form-ui';
 import { VbenButton, VbenCheckbox } from '@vben-core/shadcn-ui';
 
@@ -15,7 +17,7 @@ import Title from './auth-title.vue';
 import ThirdPartyLogin from './third-party-login.vue';
 
 interface Props extends AuthenticationProps {
-  formSchema: VbenFormSchema[];
+  formSchema?: VbenFormSchema[];
 }
 
 defineOptions({
@@ -115,7 +117,7 @@ defineExpose({
       <div class="flex-center">
         <VbenCheckbox
           v-if="showRememberMe"
-          v-model:checked="rememberMe"
+          v-model="rememberMe"
           name="rememberMe"
         >
           {{ $t('authentication.rememberMe') }}
@@ -144,7 +146,7 @@ defineExpose({
 
     <div
       v-if="showCodeLogin || showQrcodeLogin"
-      class="mb-2 mt-4 flex items-center justify-between"
+      class="mt-4 mb-2 flex items-center justify-between"
     >
       <VbenButton
         v-if="showCodeLogin"
diff --git a/packages/effects/common-ui/src/ui/authentication/qrcode-login.vue b/packages/effects/common-ui/src/ui/authentication/qrcode-login.vue
index 6e7a3320..19148752 100644
--- a/packages/effects/common-ui/src/ui/authentication/qrcode-login.vue
+++ b/packages/effects/common-ui/src/ui/authentication/qrcode-login.vue
@@ -3,6 +3,7 @@ import { ref } from 'vue';
 import { useRouter } from 'vue-router';
 
 import { $t } from '@vben/locales';
+
 import { VbenButton } from '@vben-core/shadcn-ui';
 
 import { useQRCode } from '@vueuse/integrations/useQRCode';
@@ -34,6 +35,10 @@ interface Props {
    * @zh_CN 描述
    */
   description?: string;
+  /**
+   * @zh_CN 是否显示返回按钮
+   */
+  showBack?: boolean;
 }
 
 defineOptions({
@@ -43,6 +48,7 @@ defineOptions({
 const props = withDefaults(defineProps<Props>(), {
   description: '',
   loading: false,
+  showBack: true,
   loginPath: '/auth/login',
   submitButtonText: '',
   subTitle: '',
@@ -78,16 +84,21 @@ function goToLogin() {
       </template>
     </Title>
 
-    <div class="flex-col-center mt-6">
+    <div class="mt-6 flex-col-center">
       <img :src="qrcode" alt="qrcode" class="w-1/2" />
-      <p class="text-muted-foreground mt-4 text-sm">
+      <p class="mt-4 text-sm text-muted-foreground">
         <slot name="description">
           {{ description || $t('authentication.qrcodePrompt') }}
         </slot>
       </p>
     </div>
 
-    <VbenButton class="mt-4 w-full" variant="outline" @click="goToLogin()">
+    <VbenButton
+      v-if="showBack"
+      class="mt-4 w-full"
+      variant="outline"
+      @click="goToLogin()"
+    >
       {{ $t('common.back') }}
     </VbenButton>
   </div>
diff --git a/packages/effects/common-ui/src/ui/authentication/register.vue b/packages/effects/common-ui/src/ui/authentication/register.vue
index f603a899..69a69d4a 100644
--- a/packages/effects/common-ui/src/ui/authentication/register.vue
+++ b/packages/effects/common-ui/src/ui/authentication/register.vue
@@ -1,18 +1,20 @@
 <script setup lang="ts">
 import type { Recordable } from '@vben/types';
+
 import type { VbenFormSchema } from '@vben-core/form-ui';
 
 import { computed, reactive } from 'vue';
 import { useRouter } from 'vue-router';
 
 import { $t } from '@vben/locales';
+
 import { useVbenForm } from '@vben-core/form-ui';
 import { VbenButton } from '@vben-core/shadcn-ui';
 
 import Title from './auth-title.vue';
 
 interface Props {
-  formSchema: VbenFormSchema[];
+  formSchema?: VbenFormSchema[];
   /**
    * @zh_CN 是否处于加载处理状态
    */
diff --git a/packages/effects/common-ui/src/ui/authentication/third-party-login.vue b/packages/effects/common-ui/src/ui/authentication/third-party-login.vue
index 47326796..be84f0d1 100644
--- a/packages/effects/common-ui/src/ui/authentication/third-party-login.vue
+++ b/packages/effects/common-ui/src/ui/authentication/third-party-login.vue
@@ -1,36 +1,71 @@
 <script setup lang="ts">
-import { MdiGithub, MdiGoogle, MdiQqchat, MdiWechat } from '@vben/icons';
+import { useAppConfig } from '@vben/hooks';
+import {
+  SvgGithubIcon,
+  SvgGoogleIcon,
+  SvgQQChatIcon,
+  SvgWeChatIcon,
+} from '@vben/icons';
 import { $t } from '@vben/locales';
+
 import { VbenIconButton } from '@vben-core/shadcn-ui';
 
+import DingdingLogin from './dingding-login.vue';
+
 defineOptions({
   name: 'ThirdPartyLogin',
 });
+
+const {
+  auth: { dingding: dingdingAuthConfig },
+} = useAppConfig(import.meta.env, import.meta.env.PROD);
 </script>
 
 <template>
   <div class="w-full sm:mx-auto md:max-w-md">
     <div class="mt-4 flex items-center justify-between">
-      <span class="border-input w-[35%] border-b dark:border-gray-600"></span>
-      <span class="text-muted-foreground text-center text-xs uppercase">
+      <span class="w-[35%] border-b border-input dark:border-gray-600"></span>
+      <span class="text-center text-xs text-muted-foreground uppercase">
         {{ $t('authentication.thirdPartyLogin') }}
       </span>
-      <span class="border-input w-[35%] border-b dark:border-gray-600"></span>
+      <span class="w-[35%] border-b border-input dark:border-gray-600"></span>
     </div>
 
     <div class="mt-4 flex flex-wrap justify-center">
-      <VbenIconButton class="mb-3">
-        <MdiWechat />
+      <VbenIconButton
+        :tooltip="$t('authentication.wechatLogin')"
+        tooltip-side="top"
+        class="mb-3"
+      >
+        <SvgWeChatIcon />
       </VbenIconButton>
-      <VbenIconButton class="mb-3">
-        <MdiQqchat />
+      <VbenIconButton
+        :tooltip="$t('authentication.qqLogin')"
+        tooltip-side="top"
+        class="mb-3"
+      >
+        <SvgQQChatIcon />
       </VbenIconButton>
-      <VbenIconButton class="mb-3">
-        <MdiGithub />
+      <VbenIconButton
+        :tooltip="$t('authentication.githubLogin')"
+        tooltip-side="top"
+        class="mb-3"
+      >
+        <SvgGithubIcon />
       </VbenIconButton>
-      <VbenIconButton class="mb-3">
-        <MdiGoogle />
+      <VbenIconButton
+        :tooltip="$t('authentication.googleLogin')"
+        tooltip-side="top"
+        class="mb-3"
+      >
+        <SvgGoogleIcon />
       </VbenIconButton>
+      <DingdingLogin
+        v-if="dingdingAuthConfig"
+        :corp-id="dingdingAuthConfig.corpId"
+        :client-id="dingdingAuthConfig.clientId"
+        class="mb-3"
+      />
     </div>
   </div>
 </template>
diff --git a/packages/effects/common-ui/src/ui/dashboard/analysis/analysis-charts-tabs.vue b/packages/effects/common-ui/src/ui/dashboard/analysis/analysis-charts-tabs.vue
index 9c8cf203..ab264a1e 100644
--- a/packages/effects/common-ui/src/ui/dashboard/analysis/analysis-charts-tabs.vue
+++ b/packages/effects/common-ui/src/ui/dashboard/analysis/analysis-charts-tabs.vue
@@ -6,7 +6,7 @@ import { computed } from 'vue';
 import { Tabs, TabsContent, TabsList, TabsTrigger } from '@vben-core/shadcn-ui';
 
 interface Props {
-  tabs: TabOption[];
+  tabs?: TabOption[];
 }
 
 defineOptions({
@@ -23,7 +23,7 @@ const defaultValue = computed(() => {
 </script>
 
 <template>
-  <div class="card-box w-full px-4 pb-5 pt-3">
+  <div class="card-box w-full px-4 pt-3 pb-5">
     <Tabs :default-value="defaultValue">
       <TabsList>
         <template v-for="tab in tabs" :key="tab.label">
diff --git a/packages/effects/common-ui/src/ui/dashboard/analysis/analysis-overview.vue b/packages/effects/common-ui/src/ui/dashboard/analysis/analysis-overview.vue
index 74672563..fcf2128c 100644
--- a/packages/effects/common-ui/src/ui/dashboard/analysis/analysis-overview.vue
+++ b/packages/effects/common-ui/src/ui/dashboard/analysis/analysis-overview.vue
@@ -11,11 +11,8 @@ import {
   VbenIcon,
 } from '@vben-core/shadcn-ui';
 
-import { desensitize } from '../../../../../../../apps/web-antd/src/util/tool';
-
 interface Props {
-  items: AnalysisOverviewItem[];
-  myCard: any;
+  items?: AnalysisOverviewItem[];
 }
 
 defineOptions({
@@ -29,31 +26,11 @@ withDefaults(defineProps<Props>(), {
 
 <template>
   <div class="grid grid-cols-1 gap-4 md:grid-cols-2 lg:grid-cols-4">
-    <Card v-if="myCard" class="bank-card w-full" title="我的银行卡">
-      <CardHeader>
-        <CardTitle class="text-xl">{{ myCard?.bank_name }}</CardTitle>
-      </CardHeader>
-
-      <CardContent class="card-content flex items-center justify-between">
-        <span class="card-number">
-          {{ desensitize(myCard?.bank_card, 'bankCard') }}
-        </span>
-        <VbenIcon
-          class="credit-card-icon size-8 flex-shrink-0"
-          icon="fluent-emoji-flat:credit-card"
-        />
-      </CardContent>
-      <CardFooter class="card-footer justify-between">
-        <span>{{ myCard?.bank_user_name }}</span>
-        <span>{{ myCard?.bank_account_type_txt }}</span>
-      </CardFooter>
-    </Card>
     <template v-for="item in items" :key="item.title">
       <Card :title="item.title" class="w-full">
         <CardHeader>
           <CardTitle class="text-xl">{{ item.title }}</CardTitle>
         </CardHeader>
-
         <CardContent class="flex items-center justify-between">
           <VbenCountToAnimator
             :decimals="3"
@@ -62,7 +39,7 @@ withDefaults(defineProps<Props>(), {
             class="text-xl"
             prefix=""
           />
-          <VbenIcon :icon="item.icon" class="size-8 flex-shrink-0" />
+          <VbenIcon :icon="item.icon" class="size-8 shrink-0" />
         </CardContent>
         <CardFooter class="justify-between">
           <span>{{ item.totalTitle }}</span>
@@ -77,71 +54,3 @@ withDefaults(defineProps<Props>(), {
     </template>
   </div>
 </template>
-
-<style scoped>
-.bank-card {
-  padding: 20px;
-  color: white;
-  background: linear-gradient(135deg, #6a11cb 0%, #2575fc 100%);
-  border-radius: 12px;
-  box-shadow: 0 4px 8px rgb(0 0 0 / 10%);
-  transition: transform 0.2s ease-in-out;
-}
-
-.dark .bank-card {
-  padding: 20px;
-  color: #cd853f; /* 白色文字 */
-  background: linear-gradient(
-    135deg,
-    #3f3f3f 0%,
-    #1a1a1a 100%
-  ); /* 深色渐变背景 */
-
-  border-radius: 12px;
-  box-shadow: 0 4px 8px rgb(0 0 0 / 60%); /* 更深的阴影 */
-  transition: transform 0.2s ease-in-out;
-}
-
-.bank-card:hover {
-  transform: translateY(-5px);
-}
-
-.card-content {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  padding: 16px;
-  background-color: rgb(255 255 255 / 10%);
-  border-radius: 8px;
-}
-
-.card-number {
-  font-family:
-    ui-sans-serif,
-    system-ui,
-    -apple-system,
-    BlinkMacSystemFont,
-    'Segoe UI',
-    Roboto,
-    'Helvetica Neue',
-    Arial,
-    'Noto Sans',
-    sans-serif,
-    'Apple Color Emoji',
-    'Segoe UI Emoji',
-    'Segoe UI Symbol',
-    'Noto Color Emoji' !important;
-  font-size: 24px;
-  font-weight: bold;
-}
-
-.card-footer {
-  display: flex;
-  justify-content: space-between;
-  margin-top: 16px;
-}
-
-.credit-card-icon {
-  font-size: 24px;
-}
-</style>
diff --git a/packages/effects/common-ui/src/ui/dashboard/typing.ts b/packages/effects/common-ui/src/ui/dashboard/typing.ts
index 48fc9c7b..937e02f7 100644
--- a/packages/effects/common-ui/src/ui/dashboard/typing.ts
+++ b/packages/effects/common-ui/src/ui/dashboard/typing.ts
@@ -2,13 +2,15 @@ import type { Component } from 'vue';
 
 interface AnalysisOverviewItem {
   icon: Component | string;
-  title: string;
+  title?: string;
   totalTitle: string;
   totalValue: number;
-  value: number;
+  value?: number;
 }
 
 interface WorkbenchProjectItem {
+  /** 临时字段 */
+  [key: string]: any;
   color?: string;
   content: string;
   date: string;
diff --git a/packages/effects/common-ui/src/ui/dashboard/workbench/workbench-header.vue b/packages/effects/common-ui/src/ui/dashboard/workbench/workbench-header.vue
index 95d89954..f17ba8b8 100644
--- a/packages/effects/common-ui/src/ui/dashboard/workbench/workbench-header.vue
+++ b/packages/effects/common-ui/src/ui/dashboard/workbench/workbench-header.vue
@@ -15,32 +15,34 @@ withDefaults(defineProps<Props>(), {
 </script>
 <template>
   <div class="card-box p-4 py-6 lg:flex">
-    <VbenAvatar :src="avatar" class="size-20" />
+    <VbenAvatar v-if="avatar" :src="avatar" class="size-20" />
     <div
       v-if="$slots.title || $slots.description"
-      class="flex flex-col justify-center md:ml-6 md:mt-0"
+      class="flex flex-col justify-center md:mt-0 md:ml-6"
     >
       <h1 v-if="$slots.title" class="text-md font-semibold md:text-xl">
         <slot name="title"></slot>
       </h1>
-      <span v-if="$slots.description" class="text-foreground/80 mt-1">
+      <span v-if="$slots.description" class="mt-1 text-foreground/80">
         <slot name="description"></slot>
       </span>
     </div>
 <!--    <div class="mt-4 flex flex-1 justify-end md:mt-0">-->
-<!--      <div class="flex flex-col justify-center text-right">-->
-<!--        <span class="text-foreground/80"> 待办 </span>-->
-<!--        <span class="text-2xl">2/10</span>-->
-<!--      </div>-->
+<!--      <slot name="actions">-->
+<!--        <div class="flex flex-col justify-center text-right">-->
+<!--          <span class="text-foreground/80"> 待办 </span>-->
+<!--          <span class="text-2xl">2/10</span>-->
+<!--        </div>-->
 
-<!--      <div class="mx-12 flex flex-col justify-center text-right md:mx-16">-->
-<!--        <span class="text-foreground/80"> 项目 </span>-->
-<!--        <span class="text-2xl">8</span>-->
-<!--      </div>-->
-<!--      <div class="mr-4 flex flex-col justify-center text-right md:mr-10">-->
-<!--        <span class="text-foreground/80"> 团队 </span>-->
-<!--        <span class="text-2xl">300</span>-->
-<!--      </div>-->
+<!--        <div class="mx-12 flex flex-col justify-center text-right md:mx-16">-->
+<!--          <span class="text-foreground/80"> 项目 </span>-->
+<!--          <span class="text-2xl">8</span>-->
+<!--        </div>-->
+<!--        <div class="mr-4 flex flex-col justify-center text-right md:mr-10">-->
+<!--          <span class="text-foreground/80"> 团队 </span>-->
+<!--          <span class="text-2xl">300</span>-->
+<!--        </div>-->
+<!--      </slot>-->
 <!--    </div>-->
   </div>
 </template>
diff --git a/packages/effects/common-ui/src/ui/dashboard/workbench/workbench-project.vue b/packages/effects/common-ui/src/ui/dashboard/workbench/workbench-project.vue
index a97e131e..5002bc99 100644
--- a/packages/effects/common-ui/src/ui/dashboard/workbench/workbench-project.vue
+++ b/packages/effects/common-ui/src/ui/dashboard/workbench/workbench-project.vue
@@ -10,7 +10,7 @@ import {
 } from '@vben-core/shadcn-ui';
 
 interface Props {
-  items: WorkbenchProjectItem[];
+  items?: WorkbenchProjectItem[];
   title: string;
 }
 
@@ -37,8 +37,10 @@ defineEmits(['click']);
             'border-r-0': index % 3 === 2,
             'border-b-0': index < 3,
             'pb-4': index > 2,
+            'rounded-bl-xl': index >= items.length - 3 && index % 3 === 0,
+            'rounded-br-xl': index === items.length - 1 && index % 3 === 2,
           }"
-          class="border-border group w-full cursor-pointer border-r border-t p-4 transition-all hover:shadow-xl md:w-1/2 lg:w-1/3"
+          class="border-border group w-full cursor-pointer border-b border-r border-t p-4 transition-all hover:shadow-xl md:w-1/2 lg:w-1/3"
           @click="$emit('click', item)"
         >
           <div class="flex items-center">
@@ -46,16 +48,25 @@ defineEmits(['click']);
               :color="item.color"
               :icon="item.icon"
               class="size-8 transition-all duration-300 group-hover:scale-110"
+              @click="$emit('click', item)"
             />
             <span class="ml-4 text-lg font-medium">{{ item.title }}</span>
           </div>
-          <div class="text-foreground/80 mt-4 flex h-10">
-            {{ item.content }}
-          </div>
-          <div class="text-foreground/80 flex justify-between">
-            <span>{{ item.group }}</span>
-            <span>{{ item.date }}</span>
-          </div>
+
+          <!-- 内容区域支持插槽自定义 -->
+          <slot name="content" :item="item" :index="index">
+            <div class="text-foreground/80 mt-4 flex h-10">
+              {{ item.content }}
+            </div>
+          </slot>
+
+          <!-- 底部信息区域支持插槽自定义 -->
+          <slot name="footer" :item="item" :index="index">
+            <div class="text-foreground/80 flex justify-between">
+              <span>{{ item.group }}</span>
+              <span>{{ item.date }}</span>
+            </div>
+          </slot>
         </div>
       </template>
     </CardContent>
diff --git a/packages/effects/common-ui/src/ui/dashboard/workbench/workbench-quick-nav.vue b/packages/effects/common-ui/src/ui/dashboard/workbench/workbench-quick-nav.vue
index 9eb517f9..b37e225d 100644
--- a/packages/effects/common-ui/src/ui/dashboard/workbench/workbench-quick-nav.vue
+++ b/packages/effects/common-ui/src/ui/dashboard/workbench/workbench-quick-nav.vue
@@ -10,7 +10,7 @@ import {
 } from '@vben-core/shadcn-ui';
 
 interface Props {
-  items: WorkbenchQuickNavItem[];
+  items?: WorkbenchQuickNavItem[];
   title: string;
 }
 
@@ -27,7 +27,7 @@ defineEmits(['click']);
 
 <template>
   <Card>
-    <CardHeader class="py-4">
+    <CardHeader>
       <CardTitle class="text-lg">{{ title }}</CardTitle>
     </CardHeader>
     <CardContent class="flex flex-wrap p-0">
@@ -35,10 +35,12 @@ defineEmits(['click']);
         <div
           :class="{
             'border-r-0': index % 3 === 2,
-            'pb-4': index > 2,
             'border-b-0': index < 3,
+            'pb-4': index > 2,
+            'rounded-bl-xl': index === items.length - 3,
+            'rounded-br-xl': index === items.length - 1,
           }"
-          class="flex-col-center border-border group w-1/3 cursor-pointer border-r border-t py-8 hover:shadow-xl"
+          class="group flex-col-center w-1/3 cursor-pointer border-t border-r border-border py-8 hover:shadow-xl"
           @click="$emit('click', item)"
         >
           <VbenIcon
diff --git a/packages/effects/common-ui/src/ui/dashboard/workbench/workbench-todo.vue b/packages/effects/common-ui/src/ui/dashboard/workbench/workbench-todo.vue
index 8aae81fe..aaa83e9a 100644
--- a/packages/effects/common-ui/src/ui/dashboard/workbench/workbench-todo.vue
+++ b/packages/effects/common-ui/src/ui/dashboard/workbench/workbench-todo.vue
@@ -10,7 +10,7 @@ import {
 } from '@vben-core/shadcn-ui';
 
 interface Props {
-  items: WorkbenchTodoItem[];
+  items?: WorkbenchTodoItem[];
   title: string;
 }
 
@@ -25,34 +25,34 @@ withDefaults(defineProps<Props>(), {
 
 <template>
   <Card>
-    <CardHeader class="py-4">
+    <CardHeader>
       <CardTitle class="text-lg">{{ title }}</CardTitle>
     </CardHeader>
     <CardContent class="flex flex-wrap p-5 pt-0">
-      <ul class="divide-border w-full divide-y" role="list">
+      <ul class="w-full divide-y divide-border" role="list">
         <li
           v-for="item in items"
           :key="item.title"
           :class="{
-            'select-none line-through opacity-60': item.completed,
+            'line-through opacity-60 select-none': item.completed,
           }"
           class="flex cursor-pointer justify-between gap-x-6 py-5"
         >
           <div class="flex min-w-0 items-center gap-x-4">
-            <VbenCheckbox v-model:checked="item.completed" name="completed" />
+            <VbenCheckbox v-model="item.completed" name="completed" />
             <div class="min-w-0 flex-auto">
-              <p class="text-foreground text-sm font-semibold leading-6">
+              <p class="text-sm/6 font-semibold text-foreground">
                 {{ item.title }}
               </p>
               <!-- eslint-disable vue/no-v-html -->
               <p
-                class="text-foreground/80 *:text-primary mt-1 truncate text-xs leading-5"
+                class="mt-1 truncate text-xs/5 text-foreground/80 *:text-primary"
                 v-html="item.content"
               ></p>
             </div>
           </div>
           <div class="hidden h-full shrink-0 sm:flex sm:flex-col sm:items-end">
-            <span class="text-foreground/80 mt-6 text-xs leading-6">
+            <span class="mt-6 text-xs/6 text-foreground/80">
               {{ item.date }}
             </span>
           </div>
diff --git a/packages/effects/common-ui/src/ui/dashboard/workbench/workbench-trends.vue b/packages/effects/common-ui/src/ui/dashboard/workbench/workbench-trends.vue
index 358b210f..4cc09550 100644
--- a/packages/effects/common-ui/src/ui/dashboard/workbench/workbench-trends.vue
+++ b/packages/effects/common-ui/src/ui/dashboard/workbench/workbench-trends.vue
@@ -10,7 +10,7 @@ import {
 } from '@vben-core/shadcn-ui';
 
 interface Props {
-  items: WorkbenchTrendItem[];
+  items?: WorkbenchTrendItem[];
   title: string;
 }
 
@@ -25,11 +25,11 @@ withDefaults(defineProps<Props>(), {
 
 <template>
   <Card>
-    <CardHeader class="py-4">
+    <CardHeader>
       <CardTitle class="text-lg">{{ title }}</CardTitle>
     </CardHeader>
     <CardContent class="flex flex-wrap p-5 pt-0">
-      <ul class="divide-border w-full divide-y" role="list">
+      <ul class="w-full divide-y divide-border" role="list">
         <li
           v-for="item in items"
           :key="item.title"
@@ -42,18 +42,18 @@ withDefaults(defineProps<Props>(), {
               class="size-10 flex-none rounded-full"
             />
             <div class="min-w-0 flex-auto">
-              <p class="text-foreground text-sm font-semibold leading-6">
+              <p class="text-sm/6 font-semibold text-foreground">
                 {{ item.title }}
               </p>
               <!-- eslint-disable vue/no-v-html -->
               <p
-                class="text-foreground/80 *:text-primary mt-1 truncate text-xs leading-5"
+                class="mt-1 truncate text-xs/5 text-foreground/80 *:text-primary"
                 v-html="item.content"
               ></p>
             </div>
           </div>
           <div class="hidden h-full shrink-0 sm:flex sm:flex-col sm:items-end">
-            <span class="text-foreground/80 mt-6 text-xs leading-6">
+            <span class="mt-6 text-xs/6 text-foreground/80">
               {{ item.date }}
             </span>
           </div>
diff --git a/packages/effects/common-ui/src/ui/fallback/fallback.vue b/packages/effects/common-ui/src/ui/fallback/fallback.vue
index 77bdebe3..9b95b547 100644
--- a/packages/effects/common-ui/src/ui/fallback/fallback.vue
+++ b/packages/effects/common-ui/src/ui/fallback/fallback.vue
@@ -6,6 +6,7 @@ import { useRouter } from 'vue-router';
 
 import { ArrowLeft, RotateCw } from '@vben/icons';
 import { $t } from '@vben/locales';
+
 import { VbenButton } from '@vben-core/shadcn-ui';
 
 interface Props extends FallbackProps {}
@@ -127,7 +128,7 @@ function refresh() {
 </script>
 
 <template>
-  <div class="flex size-full flex-col items-center justify-center duration-300">
+  <div class="flex-col-center size-full duration-300">
     <img v-if="image" :src="image" class="md:1/3 w-1/2 lg:w-1/4" />
     <component
       :is="fallbackIcon"
@@ -138,14 +139,14 @@ function refresh() {
       <slot v-if="$slots.title" name="title"></slot>
       <p
         v-else-if="titleText"
-        class="text-foreground mt-8 text-2xl md:text-3xl lg:text-4xl"
+        class="mt-8 text-2xl text-foreground md:text-3xl lg:text-4xl"
       >
         {{ titleText }}
       </p>
       <slot v-if="$slots.describe" name="describe"></slot>
       <p
         v-else-if="descText"
-        class="text-muted-foreground md:text-md my-4 lg:text-lg"
+        class="md:text-md my-4 text-muted-foreground lg:text-lg"
       >
         {{ descText }}
       </p>
diff --git a/packages/effects/common-ui/src/ui/index.ts b/packages/effects/common-ui/src/ui/index.ts
index fb99fdec..8b1db558 100644
--- a/packages/effects/common-ui/src/ui/index.ts
+++ b/packages/effects/common-ui/src/ui/index.ts
@@ -2,3 +2,4 @@ export * from './about';
 export * from './authentication';
 export * from './dashboard';
 export * from './fallback';
+export * from './profile';
diff --git a/packages/effects/common-ui/src/ui/profile/base-setting.vue b/packages/effects/common-ui/src/ui/profile/base-setting.vue
new file mode 100644
index 00000000..15fc97ba
--- /dev/null
+++ b/packages/effects/common-ui/src/ui/profile/base-setting.vue
@@ -0,0 +1,58 @@
+<script setup lang="ts">
+import type { Recordable } from '@vben/types';
+
+import type { VbenFormSchema } from '@vben-core/form-ui';
+
+import { computed, reactive } from 'vue';
+
+import { $t } from '@vben/locales';
+
+import { useVbenForm } from '@vben-core/form-ui';
+import { VbenButton } from '@vben-core/shadcn-ui';
+
+interface Props {
+  formSchema?: VbenFormSchema[];
+}
+
+const props = withDefaults(defineProps<Props>(), {
+  formSchema: () => [],
+});
+
+const emit = defineEmits<{
+  submit: [Recordable<any>];
+}>();
+
+const [Form, formApi] = useVbenForm(
+  reactive({
+    commonConfig: {
+      // 所有表单项
+      componentProps: {
+        class: 'w-full',
+      },
+    },
+    layout: 'horizontal',
+    schema: computed(() => props.formSchema),
+    showDefaultActions: false,
+  }),
+);
+
+async function handleSubmit() {
+  const { valid } = await formApi.validate();
+  const values = await formApi.getValues();
+  if (valid) {
+    emit('submit', values);
+  }
+}
+
+defineExpose({
+  getFormApi: () => formApi,
+});
+</script>
+<template>
+  <div @keydown.enter.prevent="handleSubmit">
+    <Form />
+    <VbenButton type="submit" class="mt-4" @click="handleSubmit">
+      {{ $t('profile.updateBasicProfile') }}
+    </VbenButton>
+  </div>
+</template>
diff --git a/packages/effects/common-ui/src/ui/profile/index.ts b/packages/effects/common-ui/src/ui/profile/index.ts
new file mode 100644
index 00000000..209a2e81
--- /dev/null
+++ b/packages/effects/common-ui/src/ui/profile/index.ts
@@ -0,0 +1,6 @@
+export { default as ProfileBaseSetting } from './base-setting.vue';
+export { default as ProfileNotificationSetting } from './notification-setting.vue';
+export { default as ProfilePasswordSetting } from './password-setting.vue';
+export { default as Profile } from './profile.vue';
+export { default as ProfileSecuritySetting } from './security-setting.vue';
+export type * from './types';
diff --git a/packages/effects/common-ui/src/ui/profile/notification-setting.vue b/packages/effects/common-ui/src/ui/profile/notification-setting.vue
new file mode 100644
index 00000000..daae2447
--- /dev/null
+++ b/packages/effects/common-ui/src/ui/profile/notification-setting.vue
@@ -0,0 +1,52 @@
+<script setup lang="ts">
+import type { Recordable } from '@vben/types';
+
+import type { SettingProps } from './types';
+
+import {
+  FormControl,
+  FormDescription,
+  FormField,
+  FormItem,
+  FormLabel,
+  Switch,
+} from '@vben-core/shadcn-ui';
+
+withDefaults(defineProps<SettingProps>(), {
+  formSchema: () => [],
+});
+
+const emit = defineEmits<{
+  change: [Recordable<any>];
+}>();
+
+function handleChange(fieldName: string, value: boolean) {
+  emit('change', { fieldName, value });
+}
+</script>
+<template>
+  <form class="space-y-8">
+    <div class="space-y-4">
+      <template v-for="item in formSchema" :key="item.fieldName">
+        <FormField type="checkbox" :name="item.fieldName">
+          <FormItem
+            class="flex flex-row items-center justify-between rounded-lg border p-4"
+          >
+            <div class="space-y-0.5">
+              <FormLabel class="text-base"> {{ item.label }} </FormLabel>
+              <FormDescription>
+                {{ item.description }}
+              </FormDescription>
+            </div>
+            <FormControl>
+              <Switch
+                :model-value="item.value"
+                @update:model-value="handleChange(item.fieldName, $event)"
+              />
+            </FormControl>
+          </FormItem>
+        </FormField>
+      </template>
+    </div>
+  </form>
+</template>
diff --git a/packages/effects/common-ui/src/ui/profile/password-setting.vue b/packages/effects/common-ui/src/ui/profile/password-setting.vue
new file mode 100644
index 00000000..06b9b3d1
--- /dev/null
+++ b/packages/effects/common-ui/src/ui/profile/password-setting.vue
@@ -0,0 +1,59 @@
+<script setup lang="ts">
+import type { Recordable } from '@vben/types';
+
+import type { VbenFormSchema } from '@vben-core/form-ui';
+
+import { computed, reactive } from 'vue';
+
+import { $t } from '@vben/locales';
+
+import { useVbenForm } from '@vben-core/form-ui';
+import { VbenButton } from '@vben-core/shadcn-ui';
+
+interface Props {
+  formSchema?: VbenFormSchema[];
+}
+
+const props = withDefaults(defineProps<Props>(), {
+  formSchema: () => [],
+});
+
+const emit = defineEmits<{
+  submit: [Recordable<any>];
+}>();
+
+const [Form, formApi] = useVbenForm(
+  reactive({
+    commonConfig: {
+      labelWidth: 130,
+      // 所有表单项
+      componentProps: {
+        class: 'w-full',
+      },
+    },
+    layout: 'horizontal',
+    schema: computed(() => props.formSchema),
+    showDefaultActions: false,
+  }),
+);
+
+async function handleSubmit() {
+  const { valid } = await formApi.validate();
+  const values = await formApi.getValues();
+  if (valid) {
+    emit('submit', values);
+  }
+}
+
+defineExpose({
+  getFormApi: () => formApi,
+});
+</script>
+<template>
+  <div>
+    <Form />
+    <VbenButton type="submit" class="mt-4" @click="handleSubmit">
+      {{ $t('profile.updatePassword') }}
+    </VbenButton>
+  </div>
+</template>
diff --git a/packages/effects/common-ui/src/ui/profile/profile.vue b/packages/effects/common-ui/src/ui/profile/profile.vue
new file mode 100644
index 00000000..1daa21a5
--- /dev/null
+++ b/packages/effects/common-ui/src/ui/profile/profile.vue
@@ -0,0 +1,62 @@
+<script setup lang="ts">
+import type { Props } from './types';
+
+import { preferences } from '@vben-core/preferences';
+import {
+  Card,
+  Separator,
+  Tabs,
+  TabsList,
+  TabsTrigger,
+  VbenAvatar,
+} from '@vben-core/shadcn-ui';
+
+import { Page } from '../../components';
+
+defineOptions({
+  name: 'ProfileUI',
+});
+
+withDefaults(defineProps<Props>(), {
+  title: '关于项目',
+  tabs: () => [],
+});
+
+const tabsValue = defineModel<string>('modelValue');
+</script>
+<template>
+  <Page auto-content-height>
+    <div class="flex size-full">
+      <Card class="w-1/6 flex-none">
+        <div class="mt-4 flex-col-center h-40 gap-4">
+          <VbenAvatar
+            :src="userInfo?.avatar ?? preferences.app.defaultAvatar"
+            class="size-20"
+          />
+          <span class="text-lg font-semibold">
+            {{ userInfo?.realName ?? '' }}
+          </span>
+          <span class="text-sm text-foreground/80">
+            {{ userInfo?.username ?? '' }}
+          </span>
+        </div>
+        <Separator class="my-4" />
+        <Tabs v-model="tabsValue" orientation="vertical" class="m-4">
+          <TabsList class="grid w-full grid-cols-1 bg-card">
+            <TabsTrigger
+              v-for="tab in tabs"
+              :key="tab.value"
+              :value="tab.value"
+              class="h-12 justify-start data-[state=active]:bg-primary data-[state=active]:text-primary-foreground"
+            >
+              {{ tab.label }}
+            </TabsTrigger>
+          </TabsList>
+        </Tabs>
+      </Card>
+      <Card class="ml-4 w-5/6 flex-auto p-8">
+        <slot name="content"></slot>
+      </Card>
+    </div>
+  </Page>
+</template>
diff --git a/packages/effects/common-ui/src/ui/profile/security-setting.vue b/packages/effects/common-ui/src/ui/profile/security-setting.vue
new file mode 100644
index 00000000..daae2447
--- /dev/null
+++ b/packages/effects/common-ui/src/ui/profile/security-setting.vue
@@ -0,0 +1,52 @@
+<script setup lang="ts">
+import type { Recordable } from '@vben/types';
+
+import type { SettingProps } from './types';
+
+import {
+  FormControl,
+  FormDescription,
+  FormField,
+  FormItem,
+  FormLabel,
+  Switch,
+} from '@vben-core/shadcn-ui';
+
+withDefaults(defineProps<SettingProps>(), {
+  formSchema: () => [],
+});
+
+const emit = defineEmits<{
+  change: [Recordable<any>];
+}>();
+
+function handleChange(fieldName: string, value: boolean) {
+  emit('change', { fieldName, value });
+}
+</script>
+<template>
+  <form class="space-y-8">
+    <div class="space-y-4">
+      <template v-for="item in formSchema" :key="item.fieldName">
+        <FormField type="checkbox" :name="item.fieldName">
+          <FormItem
+            class="flex flex-row items-center justify-between rounded-lg border p-4"
+          >
+            <div class="space-y-0.5">
+              <FormLabel class="text-base"> {{ item.label }} </FormLabel>
+              <FormDescription>
+                {{ item.description }}
+              </FormDescription>
+            </div>
+            <FormControl>
+              <Switch
+                :model-value="item.value"
+                @update:model-value="handleChange(item.fieldName, $event)"
+              />
+            </FormControl>
+          </FormItem>
+        </FormField>
+      </template>
+    </div>
+  </form>
+</template>
diff --git a/packages/effects/common-ui/src/ui/profile/types.ts b/packages/effects/common-ui/src/ui/profile/types.ts
new file mode 100644
index 00000000..e600bde8
--- /dev/null
+++ b/packages/effects/common-ui/src/ui/profile/types.ts
@@ -0,0 +1,21 @@
+import type { BasicUserInfo } from '@vben/types';
+
+export interface Props {
+  title?: string;
+  userInfo: BasicUserInfo | null;
+  tabs: {
+    label: string;
+    value: string;
+  }[];
+}
+
+export interface FormSchemaItem {
+  description: string;
+  fieldName: string;
+  label: string;
+  value: boolean;
+}
+
+export interface SettingProps {
+  formSchema: FormSchemaItem[];
+}
diff --git a/packages/effects/hooks/package.json b/packages/effects/hooks/package.json
index a531cf9c..e44e379d 100644
--- a/packages/effects/hooks/package.json
+++ b/packages/effects/hooks/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vben/hooks",
-  "version": "5.5.1",
+  "version": "5.7.0",
   "homepage": "https://github.com/vbenjs/vue-vben-admin",
   "bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
   "repository": {
diff --git a/packages/effects/hooks/src/use-app-config.ts b/packages/effects/hooks/src/use-app-config.ts
index 857ac7cb..41f383cd 100644
--- a/packages/effects/hooks/src/use-app-config.ts
+++ b/packages/effects/hooks/src/use-app-config.ts
@@ -15,9 +15,22 @@ export function useAppConfig(
     ? window._VBEN_ADMIN_PRO_APP_CONF_
     : (env as VbenAdminProAppConfigRaw);
 
-  const { VITE_GLOB_API_URL } = config;
+  const {
+    VITE_GLOB_API_URL,
+    VITE_GLOB_AUTH_DINGDING_CORP_ID,
+    VITE_GLOB_AUTH_DINGDING_CLIENT_ID,
+  } = config;
 
-  return {
+  const applicationConfig: ApplicationConfig = {
     apiURL: VITE_GLOB_API_URL,
+    auth: {},
   };
+  if (VITE_GLOB_AUTH_DINGDING_CORP_ID && VITE_GLOB_AUTH_DINGDING_CLIENT_ID) {
+    applicationConfig.auth.dingding = {
+      clientId: VITE_GLOB_AUTH_DINGDING_CLIENT_ID,
+      corpId: VITE_GLOB_AUTH_DINGDING_CORP_ID,
+    };
+  }
+
+  return applicationConfig;
 }
diff --git a/packages/effects/hooks/src/use-design-tokens.ts b/packages/effects/hooks/src/use-design-tokens.ts
index 8ee74401..535efa50 100644
--- a/packages/effects/hooks/src/use-design-tokens.ts
+++ b/packages/effects/hooks/src/use-design-tokens.ts
@@ -25,6 +25,7 @@ export function useAntdDesignTokens() {
     colorSuccess: '',
     colorTextBase: '',
     colorWarning: '',
+    zIndexPopupBase: 2000, // 调整基础弹层层级，避免下拉等组件被弹窗或者最大化状态下的表格遮挡
   });
 
   const getCssVariableValue = (variable: string, isColor: boolean = true) => {
@@ -192,67 +193,107 @@ export function useElementPlusDesignTokens() {
 
         '--el-border-radius-base': getCssVariableValue('--radius', false),
         '--el-color-danger': getCssVariableValue('--destructive-500'),
-        '--el-color-danger-dark-2': getCssVariableValue('--destructive'),
-        '--el-color-danger-light-3': getCssVariableValue('--destructive-400'),
-        '--el-color-danger-light-5': getCssVariableValue('--destructive-300'),
-        '--el-color-danger-light-7': getCssVariableValue('--destructive-200'),
+        '--el-color-danger-dark-2': isDark.value
+          ? getCssVariableValue('--destructive-400')
+          : getCssVariableValue('--destructive-600'),
+        '--el-color-danger-light-3': isDark.value
+          ? getCssVariableValue('--destructive-600')
+          : getCssVariableValue('--destructive-400'),
+        '--el-color-danger-light-5': isDark.value
+          ? getCssVariableValue('--destructive-700')
+          : getCssVariableValue('--destructive-300'),
+        '--el-color-danger-light-7': isDark.value
+          ? getCssVariableValue('--destructive-800')
+          : getCssVariableValue('--destructive-200'),
         '--el-color-danger-light-8': isDark.value
-          ? border
+          ? getCssVariableValue('--destructive-900')
           : getCssVariableValue('--destructive-100'),
         '--el-color-danger-light-9': isDark.value
-          ? accent
+          ? getCssVariableValue('--destructive-950')
           : getCssVariableValue('--destructive-50'),
 
         '--el-color-error': getCssVariableValue('--destructive-500'),
-        '--el-color-error-dark-2': getCssVariableValue('--destructive'),
-        '--el-color-error-light-3': getCssVariableValue('--destructive-400'),
-        '--el-color-error-light-5': getCssVariableValue('--destructive-300'),
-        '--el-color-error-light-7': getCssVariableValue('--destructive-200'),
+        '--el-color-error-dark-2': isDark.value
+          ? getCssVariableValue('--destructive-400')
+          : getCssVariableValue('--destructive-600'),
+        '--el-color-error-light-3': isDark.value
+          ? getCssVariableValue('--destructive-600')
+          : getCssVariableValue('--destructive-400'),
+        '--el-color-error-light-5': isDark.value
+          ? getCssVariableValue('--destructive-700')
+          : getCssVariableValue('--destructive-300'),
+        '--el-color-error-light-7': isDark.value
+          ? getCssVariableValue('--destructive-800')
+          : getCssVariableValue('--destructive-200'),
         '--el-color-error-light-8': isDark.value
-          ? border
+          ? getCssVariableValue('--destructive-900')
           : getCssVariableValue('--destructive-100'),
         '--el-color-error-light-9': isDark.value
-          ? accent
+          ? getCssVariableValue('--destructive-950')
           : getCssVariableValue('--destructive-50'),
 
+        '--el-color-info-light-5': border,
         '--el-color-info-light-8': border,
         '--el-color-info-light-9': getCssVariableValue('--info'), // getCssVariableValue('--secondary'),
+
         '--el-color-primary': getCssVariableValue('--primary-500'),
-        '--el-color-primary-dark-2': getCssVariableValue('--primary'),
-        '--el-color-primary-light-3': getCssVariableValue('--primary-400'),
-        '--el-color-primary-light-5': getCssVariableValue('--primary-300'),
+        '--el-color-primary-dark-2': isDark.value
+          ? getCssVariableValue('--primary-400')
+          : getCssVariableValue('--primary-600'),
+        '--el-color-primary-light-3': isDark.value
+          ? getCssVariableValue('--primary-600')
+          : getCssVariableValue('--primary-400'),
+        '--el-color-primary-light-5': isDark.value
+          ? getCssVariableValue('--primary-700')
+          : getCssVariableValue('--primary-300'),
         '--el-color-primary-light-7': isDark.value
-          ? border
+          ? getCssVariableValue('--primary-800')
           : getCssVariableValue('--primary-200'),
         '--el-color-primary-light-8': isDark.value
-          ? border
+          ? getCssVariableValue('--primary-900')
           : getCssVariableValue('--primary-100'),
         '--el-color-primary-light-9': isDark.value
-          ? accent
+          ? getCssVariableValue('--primary-950')
           : getCssVariableValue('--primary-50'),
 
         '--el-color-success': getCssVariableValue('--success-500'),
-        '--el-color-success-dark-2': getCssVariableValue('--success'),
-        '--el-color-success-light-3': getCssVariableValue('--success-400'),
-        '--el-color-success-light-5': getCssVariableValue('--success-300'),
-        '--el-color-success-light-7': getCssVariableValue('--success-200'),
+        '--el-color-success-dark-2': isDark.value
+          ? getCssVariableValue('--success-400')
+          : getCssVariableValue('--success-600'),
+        '--el-color-success-light-3': isDark.value
+          ? getCssVariableValue('--success-600')
+          : getCssVariableValue('--success-400'),
+        '--el-color-success-light-5': isDark.value
+          ? getCssVariableValue('--success-700')
+          : getCssVariableValue('--success-300'),
+        '--el-color-success-light-7': isDark.value
+          ? getCssVariableValue('--success-800')
+          : getCssVariableValue('--success-200'),
         '--el-color-success-light-8': isDark.value
-          ? border
+          ? getCssVariableValue('--success-900')
           : getCssVariableValue('--success-100'),
         '--el-color-success-light-9': isDark.value
-          ? accent
+          ? getCssVariableValue('--success-950')
           : getCssVariableValue('--success-50'),
 
         '--el-color-warning': getCssVariableValue('--warning-500'),
-        '--el-color-warning-dark-2': getCssVariableValue('--warning'),
-        '--el-color-warning-light-3': getCssVariableValue('--warning-400'),
-        '--el-color-warning-light-5': getCssVariableValue('--warning-300'),
-        '--el-color-warning-light-7': getCssVariableValue('--warning-200'),
+        '--el-color-warning-dark-2': isDark.value
+          ? getCssVariableValue('--warning-400')
+          : getCssVariableValue('--warning-600'),
+        '--el-color-warning-light-3': isDark.value
+          ? getCssVariableValue('--warning-600')
+          : getCssVariableValue('--warning-400'),
+        '--el-color-warning-light-5': isDark.value
+          ? getCssVariableValue('--warning-700')
+          : getCssVariableValue('--warning-300'),
+        '--el-color-warning-light-7': isDark.value
+          ? getCssVariableValue('--warning-800')
+          : getCssVariableValue('--warning-200'),
         '--el-color-warning-light-8': isDark.value
-          ? border
+          ? getCssVariableValue('--warning-900')
           : getCssVariableValue('--warning-100'),
         '--el-color-warning-light-9': isDark.value
-          ? accent
+          ? getCssVariableValue('--warning-950')
           : getCssVariableValue('--warning-50'),
 
         '--el-fill-color': getCssVariableValue('--accent'),
@@ -278,3 +319,103 @@ export function useElementPlusDesignTokens() {
     { immediate: true },
   );
 }
+
+export function useTDesignDesignTokens() {
+  const { isDark } = usePreferences();
+  const rootStyles = getComputedStyle(document.documentElement);
+
+  const getCssVariableValue = (variable: string, isColor: boolean = true) => {
+    const value = rootStyles.getPropertyValue(variable);
+    return isColor ? convertToRgb(`hsl(${value})`) : value;
+  };
+
+  /**
+   * 生成某个语义色对应的 TDesign 变量（语义变体 + 1~10 色阶）。
+   * TDesign 的色阶在亮色模式下 1 最浅、10 最深，暗色模式下方向相反，
+   * 这里根据当前模式把 Vben 的 50~900 色板映射到对应方向。
+   * @param tdName TDesign 颜色名，如 `brand`、`error`
+   * @param vbenName Vben 颜色名，如 `primary`、`destructive`
+   */
+  const getColorTokens = (tdName: string, vbenName: string) => {
+    const dark = isDark.value;
+    const getColor = (level?: number) =>
+      getCssVariableValue(
+        level === undefined ? `--${vbenName}` : `--${vbenName}-${level}`,
+      );
+
+    // 亮色模式 1 最浅、10 最深；暗色模式相反
+    const lightScale = [50, 100, 200, 300, 400, 500, 600, 700, 800, 900];
+    const scaleLevels = dark ? [...lightScale].toReversed() : lightScale;
+    const scale: Record<string, string> = {};
+    scaleLevels.forEach((level, index) => {
+      scale[`--td-${tdName}-color-${index + 1}`] = getColor(level);
+    });
+
+    return {
+      [`--td-${tdName}-color`]: getColor(),
+      [`--td-${tdName}-color-active`]: getColor(dark ? 300 : 700),
+      [`--td-${tdName}-color-disabled`]: getColor(dark ? 800 : 200),
+      [`--td-${tdName}-color-focus`]: getColor(dark ? 900 : 100),
+      [`--td-${tdName}-color-hover`]: getColor(dark ? 400 : 600),
+      [`--td-${tdName}-color-light`]: getColor(dark ? 950 : 50),
+      [`--td-${tdName}-color-light-hover`]: getColor(dark ? 900 : 100),
+      ...scale,
+    };
+  };
+
+  watch(
+    () => preferences.theme,
+    () => {
+      const variables: Record<string, string> = {
+        // 品牌色（主题色）、功能色
+        ...getColorTokens('brand', 'primary'),
+        ...getColorTokens('error', 'destructive'),
+        ...getColorTokens('warning', 'warning'),
+        ...getColorTokens('success', 'success'),
+
+        // 文字颜色
+        '--td-text-color-anti': getCssVariableValue('--primary-foreground'),
+        '--td-text-color-brand': getCssVariableValue('--primary'),
+        '--td-text-color-disabled': getCssVariableValue('--muted-foreground'),
+        '--td-text-color-link': getCssVariableValue('--primary'),
+        '--td-text-color-placeholder': getCssVariableValue(
+          '--input-placeholder',
+        ),
+        '--td-text-color-primary': getCssVariableValue('--foreground'),
+        '--td-text-color-secondary': getCssVariableValue('--muted-foreground'),
+
+        // 背景颜色
+        '--td-bg-color-component': getCssVariableValue('--accent'),
+        '--td-bg-color-component-active':
+          getCssVariableValue('--accent-darker'),
+        '--td-bg-color-component-disabled': getCssVariableValue('--muted'),
+        '--td-bg-color-component-hover': getCssVariableValue('--accent-hover'),
+        '--td-bg-color-container': getCssVariableValue('--background'),
+        '--td-bg-color-container-active':
+          getCssVariableValue('--accent-darker'),
+        '--td-bg-color-container-hover': getCssVariableValue('--accent'),
+        '--td-bg-color-container-select': getCssVariableValue('--accent'),
+        '--td-bg-color-page': getCssVariableValue('--background-deep'),
+        '--td-bg-color-secondarycontainer': getCssVariableValue('--card'),
+
+        // 边框颜色
+        '--td-border-level-1-color': getCssVariableValue('--border'),
+        '--td-border-level-2-color': getCssVariableValue('--border'),
+        '--td-component-border': getCssVariableValue('--border'),
+        '--td-component-stroke': getCssVariableValue('--border'),
+
+        // 圆角
+        '--td-radius-default': getCssVariableValue('--radius', false),
+      };
+
+      // TDesign 将亮/暗变量定义在 `:root[theme-mode='light'|'dark']` 下，
+      // 需要写入相同优先级的选择器才能覆盖默认值
+      const selector = isDark.value
+        ? `:root[theme-mode='dark']`
+        : `:root[theme-mode='light']`;
+
+      updateCSSVariables(variables, `__vben_design_tdesign_styles__`, selector);
+    },
+    { immediate: true },
+  );
+}
diff --git a/packages/effects/hooks/src/use-hover-toggle.ts b/packages/effects/hooks/src/use-hover-toggle.ts
index becb1bee..e0280daa 100644
--- a/packages/effects/hooks/src/use-hover-toggle.ts
+++ b/packages/effects/hooks/src/use-hover-toggle.ts
@@ -1,44 +1,140 @@
 import type { Arrayable, MaybeElementRef } from '@vueuse/core';
 
-import { computed, onUnmounted, ref, watch } from 'vue';
 import type { Ref } from 'vue';
 
+import { computed, effectScope, ref, unref, watch } from 'vue';
+
 import { isFunction } from '@vben/utils';
 
-import { useMouseInElement } from '@vueuse/core';
+import { tryOnScopeDispose, useElementHover } from '@vueuse/core';
+
+interface HoverDelayOptions {
+  /** 鼠标进入延迟时间 */
+  enterDelay?: (() => number) | number;
+  /** 鼠标离开延迟时间 */
+  leaveDelay?: (() => number) | number;
+}
+
+const DEFAULT_LEAVE_DELAY = 500; // 鼠标离开延迟时间，默认为 500ms
+const DEFAULT_ENTER_DELAY = 0; // 鼠标进入延迟时间，默认为 0（立即响应）
 
 /**
  * 监测鼠标是否在元素内部，如果在元素内部则返回 true，否则返回 false
- * @param refElement 所有需要检测的元素。如果提供了一个数组，那么鼠标在任何一个元素内部都会返回 true
- * @param delay 延迟更新状态的时间
+ * @param refElement 所有需要检测的元素。支持单个元素、元素数组或响应式引用的元素数组。如果鼠标在任何一个元素内部都会返回 true
+ * @param delay 延迟更新状态的时间，可以是数字或包含进入/离开延迟的配置对象
  * @returns 返回一个数组，第一个元素是一个 ref，表示鼠标是否在元素内部，第二个元素是一个控制器，可以通过 enable 和 disable 方法来控制监听器的启用和禁用
  */
 export function useHoverToggle(
-  refElement: Arrayable<MaybeElementRef>,
-  delay: (() => number) | number = 500,
+  refElement: Arrayable<MaybeElementRef> | Ref<HTMLElement[] | null>,
+  delay: (() => number) | HoverDelayOptions | number = DEFAULT_LEAVE_DELAY,
 ) {
-  const isOutsides: Array<Ref<boolean>> = [];
-  const value = ref(false);
-  const timer = ref<ReturnType<typeof setTimeout> | undefined>();
-  const refs = Array.isArray(refElement) ? refElement : [refElement];
-  refs.forEach((refEle) => {
-    const listener = useMouseInElement(refEle, { handleOutside: true });
-    isOutsides.push(listener.isOutside);
-  });
-  const isOutsideAll = computed(() => isOutsides.every((v) => v.value));
+  // 兼容旧版本API
+  const normalizedOptions: HoverDelayOptions =
+    typeof delay === 'number' || isFunction(delay)
+      ? { enterDelay: DEFAULT_ENTER_DELAY, leaveDelay: delay }
+      : {
+          enterDelay: DEFAULT_ENTER_DELAY,
+          leaveDelay: DEFAULT_LEAVE_DELAY,
+          ...delay,
+        };
 
-  function setValueDelay(val: boolean) {
-    timer.value && clearTimeout(timer.value);
-    timer.value = setTimeout(
-      () => {
-        value.value = val;
-        timer.value = undefined;
-      },
-      isFunction(delay) ? delay() : delay,
-    );
+  const value = ref(false);
+  const enterTimer = ref<ReturnType<typeof setTimeout> | undefined>();
+  const leaveTimer = ref<ReturnType<typeof setTimeout> | undefined>();
+  const hoverScopes = ref<ReturnType<typeof effectScope>[]>([]);
+
+  // 使用计算属性包装 refElement，使其响应式变化
+  const refs = computed(() => {
+    const raw = unref(refElement);
+    if (raw === null) return [];
+    return Array.isArray(raw) ? raw : [raw];
+  });
+  // 存储所有 hover 状态
+  const isHovers = ref<Array<Ref<boolean>>>([]);
+
+  // 更新 hover 监听的函数
+  function updateHovers() {
+    // 停止并清理之前的作用域
+    hoverScopes.value.forEach((scope) => scope.stop());
+    hoverScopes.value = [];
+
+    isHovers.value = refs.value.map((refEle) => {
+      if (!refEle) {
+        return ref(false);
+      }
+      const eleRef = computed(() => {
+        const ele = unref(refEle);
+        return ele instanceof Element ? ele : (ele?.$el as Element);
+      });
+
+      // 为每个元素创建独立的作用域
+      const scope = effectScope();
+      const hoverRef = scope.run(() => useElementHover(eleRef)) || ref(false);
+      hoverScopes.value.push(scope);
+
+      return hoverRef;
+    });
   }
 
-  const watcher = watch(
+  // 监听元素数量变化，避免过度执行
+  const elementsCount = computed(() => {
+    const raw = unref(refElement);
+    if (raw === null) return 0;
+    return Array.isArray(raw) ? raw.length : 1;
+  });
+
+  // 初始设置
+  updateHovers();
+
+  // 只在元素数量变化时重新设置监听器
+  const stopWatcher = watch(elementsCount, updateHovers, { deep: false });
+
+  const isOutsideAll = computed(() => isHovers.value.every((v) => !v.value));
+
+  function clearTimers() {
+    if (enterTimer.value) {
+      clearTimeout(enterTimer.value);
+      enterTimer.value = undefined;
+    }
+    if (leaveTimer.value) {
+      clearTimeout(leaveTimer.value);
+      leaveTimer.value = undefined;
+    }
+  }
+
+  function setValueDelay(val: boolean) {
+    clearTimers();
+
+    if (val) {
+      // 鼠标进入
+      const enterDelay = normalizedOptions.enterDelay ?? DEFAULT_ENTER_DELAY;
+      const delayTime = isFunction(enterDelay) ? enterDelay() : enterDelay;
+
+      if (delayTime <= 0) {
+        value.value = true;
+      } else {
+        enterTimer.value = setTimeout(() => {
+          value.value = true;
+          enterTimer.value = undefined;
+        }, delayTime);
+      }
+    } else {
+      // 鼠标离开
+      const leaveDelay = normalizedOptions.leaveDelay ?? DEFAULT_LEAVE_DELAY;
+      const delayTime = isFunction(leaveDelay) ? leaveDelay() : leaveDelay;
+
+      if (delayTime <= 0) {
+        value.value = false;
+      } else {
+        leaveTimer.value = setTimeout(() => {
+          value.value = false;
+          leaveTimer.value = undefined;
+        }, delayTime);
+      }
+    }
+  }
+
+  const hoverWatcher = watch(
     isOutsideAll,
     (val) => {
       setValueDelay(!val);
@@ -48,15 +144,19 @@ export function useHoverToggle(
 
   const controller = {
     enable() {
-      watcher.resume();
+      hoverWatcher.resume();
     },
     disable() {
-      watcher.pause();
+      hoverWatcher.pause();
     },
   };
 
-  onUnmounted(() => {
-    timer.value && clearTimeout(timer.value);
+  tryOnScopeDispose(() => {
+    clearTimers();
+    // 停止监听器
+    stopWatcher();
+    // 停止所有剩余的作用域
+    hoverScopes.value.forEach((scope) => scope.stop());
   });
 
   return [value, controller] as [typeof value, typeof controller];
diff --git a/packages/effects/hooks/src/use-pagination.ts b/packages/effects/hooks/src/use-pagination.ts
index 23b36dcd..0115606d 100644
--- a/packages/effects/hooks/src/use-pagination.ts
+++ b/packages/effects/hooks/src/use-pagination.ts
@@ -1,5 +1,6 @@
 import type { Ref } from 'vue';
-import { computed, ref, unref } from 'vue';
+
+import { computed, ref, unref, watch } from 'vue';
 
 /**
  * Paginates an array of items
@@ -21,7 +22,11 @@ function pagination<T = any>(list: T[], pageNo: number, pageSize: number): T[] {
   return ret;
 }
 
-export function usePagination<T = any>(list: Ref<T[]>, pageSize: number) {
+export function usePagination<T = any>(
+  list: Ref<T[]>,
+  pageSize: number,
+  totalChangeToFirstPage = true,
+) {
   const currentPage = ref(1);
   const pageSizeRef = ref(pageSize);
 
@@ -37,11 +42,21 @@ export function usePagination<T = any>(list: Ref<T[]>, pageSize: number) {
     return unref(list).length;
   });
 
+  if (totalChangeToFirstPage) {
+    watch(total, () => {
+      setCurrentPage(1);
+    });
+  }
+
   function setCurrentPage(page: number) {
-    if (page < 1 || page > unref(totalPages)) {
-      throw new Error('Invalid page number');
+    if (page === 1 && unref(totalPages) === 0) {
+      currentPage.value = 1;
+    } else {
+      if (page < 1 || page > unref(totalPages)) {
+        throw new Error('Invalid page number');
+      }
+      currentPage.value = page;
     }
-    currentPage.value = page;
   }
 
   function setPageSize(pageSize: number) {
@@ -53,5 +68,5 @@ export function usePagination<T = any>(list: Ref<T[]>, pageSize: number) {
     currentPage.value = 1;
   }
 
-  return { setCurrentPage, total, setPageSize, paginationList };
+  return { setCurrentPage, total, setPageSize, paginationList, currentPage };
 }
diff --git a/packages/effects/hooks/src/use-tabs.ts b/packages/effects/hooks/src/use-tabs.ts
index aa79d72f..978409ed 100644
--- a/packages/effects/hooks/src/use-tabs.ts
+++ b/packages/effects/hooks/src/use-tabs.ts
@@ -1,4 +1,7 @@
-import { type RouteLocationNormalized, useRoute, useRouter } from 'vue-router';
+import type { ComputedRef } from 'vue';
+import type { RouteLocationNormalized } from 'vue-router';
+
+import { useRoute, useRouter } from 'vue-router';
 
 import { useTabbarStore } from '@vben/stores';
 
@@ -39,19 +42,36 @@ export function useTabs() {
     await tabbarStore.toggleTabPin(tab || route);
   }
 
-  async function refreshTab() {
-    await tabbarStore.refresh(router);
+  async function refreshTab(name?: string) {
+    await tabbarStore.refresh(name || router);
   }
 
   async function openTabInNewWindow(tab?: RouteLocationNormalized) {
-    await tabbarStore.openTabInNewWindow(tab || route);
+    await tabbarStore.openTabInNewWindow(tab || route, router);
   }
 
   async function closeTabByKey(key: string) {
     await tabbarStore.closeTabByKey(key, router);
   }
 
-  async function setTabTitle(title: string) {
+  /**
+   * 设置当前标签页的标题
+   *
+   * @description 支持设置静态标题字符串或动态计算标题
+   * @description 动态标题会在每次渲染时重新计算,适用于多语言或状态相关的标题
+   *
+   * @param title - 标题内容
+   *   - 静态标题: 直接传入字符串
+   *   - 动态标题: 传入 ComputedRef
+   *
+   * @example
+   * // 静态标题
+   * setTabTitle('标签页')
+   *
+   * // 动态标题(多语言)
+   * setTabTitle(computed(() => t('page.title')))
+   */
+  async function setTabTitle(title: ComputedRef<string> | string) {
     tabbarStore.setUpdateTime();
     await tabbarStore.setTabTitle(route, title);
   }
diff --git a/packages/effects/hooks/src/use-watermark.ts b/packages/effects/hooks/src/use-watermark.ts
index 9260c4df..ba19477a 100644
--- a/packages/effects/hooks/src/use-watermark.ts
+++ b/packages/effects/hooks/src/use-watermark.ts
@@ -2,8 +2,6 @@ import type { Watermark, WatermarkOptions } from 'watermark-js-plus';
 
 import { nextTick, onUnmounted, readonly, ref } from 'vue';
 
-import { updatePreferences } from '@vben/preferences';
-
 const watermark = ref<Watermark>();
 const unmountedHooked = ref<boolean>(false);
 const cachedOptions = ref<Partial<WatermarkOptions>>({
@@ -50,7 +48,6 @@ export function useWatermark() {
     // 这里填写水印颜色
     cachedOptions.value.globalAlpha = 0.15;
     watermark.value = new Watermark(cachedOptions.value);
-    updatePreferences({ app: { watermark: true } });
     await watermark.value?.create();
   }
 
@@ -71,7 +68,6 @@ export function useWatermark() {
       watermark.value.destroy();
       watermark.value = undefined;
     }
-    updatePreferences({ app: { watermark: false } });
   }
 
   // 只在第一次调用时注册卸载钩子，防止重复注册以致于在路由切换时销毁了水印
diff --git a/packages/effects/layouts/package.json b/packages/effects/layouts/package.json
index f1eba82e..4a647f24 100644
--- a/packages/effects/layouts/package.json
+++ b/packages/effects/layouts/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vben/layouts",
-  "version": "5.5.1",
+  "version": "5.7.0",
   "homepage": "https://github.com/vbenjs/vue-vben-admin",
   "bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
   "repository": {
@@ -20,7 +20,9 @@
     }
   },
   "dependencies": {
+    "@types/sortablejs": "catalog:",
     "@vben-core/composables": "workspace:*",
+    "@vben-core/design": "workspace:*",
     "@vben-core/form-ui": "workspace:*",
     "@vben-core/layout-ui": "workspace:*",
     "@vben-core/menu-ui": "workspace:*",
@@ -37,6 +39,7 @@
     "@vben/types": "workspace:*",
     "@vben/utils": "workspace:*",
     "@vueuse/core": "catalog:",
+    "sortablejs": "catalog:",
     "vue": "catalog:",
     "vue-router": "catalog:"
   }
diff --git a/packages/effects/layouts/src/authentication/authentication.vue b/packages/effects/layouts/src/authentication/authentication.vue
index 9c1feb13..06a30458 100644
--- a/packages/effects/layouts/src/authentication/authentication.vue
+++ b/packages/effects/layouts/src/authentication/authentication.vue
@@ -1,6 +1,8 @@
 <script setup lang="ts">
 import type { ToolbarType } from './types';
 
+import { computed } from 'vue';
+
 import { preferences, usePreferences } from '@vben/preferences';
 
 import { Copyright } from '../basic/copyright';
@@ -11,6 +13,7 @@ import Toolbar from './toolbar.vue';
 interface Props {
   appName?: string;
   logo?: string;
+  logoDark?: string;
   pageTitle?: string;
   pageDescription?: string;
   sloganImage?: string;
@@ -18,28 +21,43 @@ interface Props {
   toolbar?: boolean;
   copyright?: boolean;
   toolbarList?: ToolbarType[];
+  clickLogo?: () => void;
 }
 
-withDefaults(defineProps<Props>(), {
+const props = withDefaults(defineProps<Props>(), {
   appName: '',
   copyright: true,
   logo: '',
+  logoDark: '',
   pageDescription: '',
   pageTitle: '',
   sloganImage: '',
   version: '',
   toolbar: true,
   toolbarList: () => ['color', 'language', 'layout', 'theme'],
+  clickLogo: () => {},
 });
 
 const { authPanelCenter, authPanelLeft, authPanelRight, isDark } =
   usePreferences();
+
+/**
+ * @zh_CN 根据主题选择合适的 logo 图标
+ */
+const logoSrc = computed(() => {
+  // 如果是暗色主题且提供了 logoDark，则使用暗色主题的 logo
+  if (isDark.value && props.logoDark) {
+    return props.logoDark;
+  }
+  // 否则使用默认的 logo
+  return props.logo;
+});
 </script>
 
 <template>
   <div
-    :class="[isDark]"
-    class="flex min-h-full flex-1 select-none overflow-x-hidden"
+    :class="[isDark ? 'dark' : '']"
+    class="flex min-h-full flex-1 overflow-x-hidden select-none"
   >
     <template v-if="toolbar">
       <slot name="toolbar">
@@ -50,7 +68,7 @@ const { authPanelCenter, authPanelLeft, authPanelRight, isDark } =
     <AuthenticationFormView
       v-if="authPanelLeft"
       class="min-h-full w-2/5 flex-1"
-      transition-name="slide-left"
+      data-side="left"
     >
       <template v-if="copyright" #copyright>
         <slot name="copyright">
@@ -62,40 +80,62 @@ const { authPanelCenter, authPanelLeft, authPanelRight, isDark } =
       </template>
     </AuthenticationFormView>
 
-    <!-- 头部 Logo 和应用名称 -->
-    <div v-if="logo || appName" class="absolute left-0 top-0 z-10 flex flex-1">
+    <slot name="logo">
+      <!-- 头部 Logo 和应用名称 -->
       <div
-        class="text-foreground lg:text-foreground ml-4 mt-4 flex flex-1 items-center sm:left-6 sm:top-6"
+        v-if="logoSrc || appName"
+        class="absolute top-0 left-0 z-10 flex flex-1"
+        @click="clickLogo"
       >
-        <img v-if="logo" :alt="appName" :src="logo" class="mr-2" width="42" />
-        <p v-if="appName" class="app-version text-xl font-medium">
-          {{ appName }}
-          <b>
-            <i>V {{ version }}</i>
-          </b>
-        </p>
+        <div
+          class="mt-4 ml-4 flex flex-1 items-center text-foreground sm:top-6 sm:left-6 lg:text-foreground"
+        >
+          <img
+            v-if="logoSrc"
+            :key="logoSrc"
+            :alt="appName"
+            :src="logoSrc"
+            class="mr-2"
+            width="42"
+          />
+<!--          暂时适应远程LOGO-->
+<!--          <img v-if="logo" :alt="appName" :src="logo" class="mr-2" width="42" />-->
+          <p v-if="appName" class="m-0 text-xl font-medium">
+            {{ appName }}
+            <b>
+              <i>V {{ version }}</i>
+            </b>
+          </p>
+        </div>
       </div>
-    </div>
+    </slot>
 
     <!-- 系统介绍 -->
     <div v-if="!authPanelCenter" class="relative hidden w-0 flex-1 lg:block">
       <div
-        class="bg-background-deep absolute inset-0 h-full w-full dark:bg-[#070709]"
+        class="absolute inset-0 size-full bg-background-deep dark:bg-[#070709]"
       >
-        <div class="login-background absolute left-0 top-0 size-full"></div>
-        <div class="flex-col-center -enter-x mr-20 h-full">
+        <div class="login-background absolute top-0 left-0 size-full"></div>
+        <div
+          :key="authPanelLeft ? 'left' : authPanelRight ? 'right' : 'center'"
+          class="mr-20 flex-col-center h-full"
+          :class="{
+            'enter-x': authPanelLeft,
+            '-enter-x': authPanelRight,
+          }"
+        >
           <template v-if="sloganImage">
             <img
               :alt="appName"
               :src="sloganImage"
-              class="animate-float h-64 w-2/5"
+              class="h-64 w-2/5 animate-float"
             />
           </template>
-          <SloganIcon v-else :alt="appName" class="animate-float h-64 w-2/5" />
-          <div class="text-1xl text-foreground mt-6 font-sans lg:text-2xl">
+          <SloganIcon v-else :alt="appName" class="h-64 w-2/5 animate-float" />
+          <div class="text-1xl mt-6 font-sans text-foreground lg:text-2xl">
             {{ pageTitle }}
           </div>
-          <div class="dark:text-muted-foreground mt-2">
+          <div class="mt-2 dark:text-muted-foreground">
             {{ pageDescription }}
           </div>
         </div>
@@ -103,10 +143,11 @@ const { authPanelCenter, authPanelLeft, authPanelRight, isDark } =
     </div>
 
     <!-- 中心认证面板 -->
-    <div v-if="authPanelCenter" class="flex-center relative w-full">
-      <div class="login-background absolute left-0 top-0 size-full"></div>
+    <div v-if="authPanelCenter" class="relative flex-center w-full">
+      <div class="login-background absolute top-0 left-0 size-full"></div>
       <AuthenticationFormView
-        class="md:bg-background shadow-primary/5 shadow-float w-full rounded-3xl pb-20 md:w-2/3 lg:w-1/2 xl:w-[36%]"
+        class="w-full rounded-3xl pb-20 shadow-float shadow-primary/5 md:w-2/3 md:bg-background lg:w-1/2 xl:w-[36%]"
+        data-side="bottom"
       >
         <template v-if="copyright" #copyright>
           <slot name="copyright">
@@ -122,7 +163,8 @@ const { authPanelCenter, authPanelLeft, authPanelRight, isDark } =
     <!-- 右侧认证面板 -->
     <AuthenticationFormView
       v-if="authPanelRight"
-      class="min-h-full w-[34%] flex-1"
+      class="min-h-full w-2/5 flex-1"
+      data-side="right"
     >
       <template v-if="copyright" #copyright>
         <slot name="copyright">
diff --git a/packages/effects/layouts/src/authentication/form.vue b/packages/effects/layouts/src/authentication/form.vue
index 80c90749..3a3c3339 100644
--- a/packages/effects/layouts/src/authentication/form.vue
+++ b/packages/effects/layouts/src/authentication/form.vue
@@ -2,11 +2,15 @@
 defineOptions({
   name: 'AuthenticationFormView',
 });
+
+defineProps<{
+  dataSide?: 'bottom' | 'left' | 'right' | 'top';
+}>();
 </script>
 
 <template>
   <div
-    class="flex-col-center dark:bg-background-deep bg-background relative px-6 py-10 lg:flex-initial lg:px-8"
+    class="relative flex-col-center bg-background px-6 py-10 lg:flex-initial lg:px-8 dark:bg-background-deep"
   >
     <slot></slot>
     <!-- Router View with Transition and KeepAlive -->
@@ -16,7 +20,8 @@ defineOptions({
           <component
             :is="Component"
             :key="route.fullPath"
-            class="enter-x mt-6 w-full sm:mx-auto md:max-w-md"
+            class="side-content mt-6 w-full sm:mx-auto md:max-w-md"
+            :data-side="dataSide"
           />
         </KeepAlive>
       </Transition>
@@ -25,7 +30,7 @@ defineOptions({
     <!-- Footer Copyright -->
 
     <div
-      class="text-muted-foreground absolute bottom-3 flex text-center text-xs"
+      class="absolute right-0 bottom-3 left-0 flex justify-center text-center text-xs text-muted-foreground"
     >
       <slot name="copyright"> </slot>
     </div>
diff --git a/packages/effects/layouts/src/authentication/index.ts b/packages/effects/layouts/src/authentication/index.ts
index 6c684d11..d7c1c293 100644
--- a/packages/effects/layouts/src/authentication/index.ts
+++ b/packages/effects/layouts/src/authentication/index.ts
@@ -1 +1,2 @@
 export { default as AuthPageLayout } from './authentication.vue';
+export * from './types';
diff --git a/packages/effects/layouts/src/authentication/toolbar.vue b/packages/effects/layouts/src/authentication/toolbar.vue
index 94d321ab..fefe374f 100644
--- a/packages/effects/layouts/src/authentication/toolbar.vue
+++ b/packages/effects/layouts/src/authentication/toolbar.vue
@@ -33,9 +33,9 @@ const showTheme = computed(() => props.toolbarList.includes('theme'));
 <template>
   <div
     :class="{
-      'bg-accent rounded-3xl px-3 py-1': toolbarList.length > 1,
+      'rounded-3xl bg-accent px-3 py-1': toolbarList.length > 1,
     }"
-    class="flex-center absolute right-2 top-4 z-10"
+    class="absolute top-4 right-2 z-10 flex-center"
   >
     <!-- Only show on medium and larger screens -->
     <div class="hidden md:flex">
diff --git a/packages/effects/layouts/src/basic/__tests__/use-layout-scroll.test.ts b/packages/effects/layouts/src/basic/__tests__/use-layout-scroll.test.ts
new file mode 100644
index 00000000..fdee67ee
--- /dev/null
+++ b/packages/effects/layouts/src/basic/__tests__/use-layout-scroll.test.ts
@@ -0,0 +1,176 @@
+import type { App } from 'vue';
+import type { NavigationGuard, NavigationHookAfter, Router } from 'vue-router';
+
+import { createApp } from 'vue';
+
+import { ELEMENT_ID_LAYOUT_SCROLL } from '@vben-core/shared/constants';
+
+import { afterEach, describe, expect, it, vi } from 'vitest';
+
+import { useLayoutScroll } from '../use-layout-scroll';
+
+let activeApp: App | undefined;
+
+function createRouterMock() {
+  let afterHook: NavigationHookAfter | undefined;
+  let beforeGuard: NavigationGuard | undefined;
+  const removeAfterHook = vi.fn();
+  const removeBeforeGuard = vi.fn();
+
+  const router = {
+    afterEach: vi.fn((hook: NavigationHookAfter) => {
+      afterHook = hook;
+      return removeAfterHook;
+    }),
+    beforeEach: vi.fn((guard: NavigationGuard) => {
+      beforeGuard = guard;
+      return removeBeforeGuard;
+    }),
+  } as unknown as Router;
+
+  function getHooks() {
+    if (!afterHook || !beforeGuard) {
+      throw new Error('Router hooks were not registered');
+    }
+    return { afterHook, beforeGuard };
+  }
+
+  return {
+    getHooks,
+    removeAfterHook,
+    removeBeforeGuard,
+    router,
+  };
+}
+
+function createScrollElement() {
+  const element = document.createElement('div');
+  element.id = ELEMENT_ID_LAYOUT_SCROLL;
+  element.scrollTo = vi.fn();
+  document.body.append(element);
+  return element;
+}
+
+function mountLayoutScroll(router: Router) {
+  const host = document.createElement('div');
+  document.body.append(host);
+  activeApp = createApp({
+    setup() {
+      useLayoutScroll(router);
+      return () => null;
+    },
+  });
+  activeApp.mount(host);
+}
+
+async function runBeforeGuard(guard: NavigationGuard) {
+  await guard({} as never, {} as never, vi.fn());
+}
+
+async function runAfterHook(hook: NavigationHookAfter, hash = '') {
+  await hook({ hash } as never, {} as never, undefined);
+}
+
+afterEach(() => {
+  activeApp?.unmount();
+  activeApp = undefined;
+  document.body.innerHTML = '';
+  window.history.replaceState({}, '');
+  vi.restoreAllMocks();
+});
+
+describe('useLayoutScroll', () => {
+  it('should scroll to top after a normal navigation', async () => {
+    window.history.replaceState({ position: 0 }, '');
+    const element = createScrollElement();
+    element.scrollTop = 240;
+    const routerMock = createRouterMock();
+    mountLayoutScroll(routerMock.router);
+    const { afterHook, beforeGuard } = routerMock.getHooks();
+
+    await runBeforeGuard(beforeGuard);
+    window.history.replaceState({ position: 1 }, '');
+    await runAfterHook(afterHook);
+
+    expect(element.scrollTo).toHaveBeenCalledWith({ top: 0 });
+  });
+
+  it('should scroll a hash target into view', async () => {
+    window.history.replaceState({ position: 0 }, '');
+    const element = createScrollElement();
+    const hashTarget = document.createElement('div');
+    hashTarget.id = 'section';
+    hashTarget.scrollIntoView = vi.fn();
+    element.append(hashTarget);
+    const routerMock = createRouterMock();
+    mountLayoutScroll(routerMock.router);
+    const { afterHook } = routerMock.getHooks();
+
+    window.history.replaceState({ position: 1 }, '');
+    await runAfterHook(afterHook, '#section');
+
+    expect(hashTarget.scrollIntoView).toHaveBeenCalledWith({
+      behavior: 'smooth',
+      block: 'start',
+    });
+    expect(element.scrollTo).not.toHaveBeenCalled();
+  });
+
+  it('should ignore matching hash targets outside the layout', async () => {
+    window.history.replaceState({ position: 0 }, '');
+    const hostTarget = document.createElement('div');
+    hostTarget.id = 'section';
+    hostTarget.scrollIntoView = vi.fn();
+    document.body.append(hostTarget);
+    const element = createScrollElement();
+    const layoutTarget = document.createElement('div');
+    layoutTarget.id = 'section';
+    layoutTarget.scrollIntoView = vi.fn();
+    element.append(layoutTarget);
+    const routerMock = createRouterMock();
+    mountLayoutScroll(routerMock.router);
+    const { afterHook } = routerMock.getHooks();
+
+    window.history.replaceState({ position: 1 }, '');
+    await runAfterHook(afterHook, '#section');
+
+    expect(layoutTarget.scrollIntoView).toHaveBeenCalledWith({
+      behavior: 'smooth',
+      block: 'start',
+    });
+    expect(hostTarget.scrollIntoView).not.toHaveBeenCalled();
+  });
+
+  it('should restore a saved position on history navigation', async () => {
+    window.history.replaceState({ position: 0 }, '');
+    const element = createScrollElement();
+    element.scrollTop = 240;
+    const routerMock = createRouterMock();
+    mountLayoutScroll(routerMock.router);
+    const { afterHook, beforeGuard } = routerMock.getHooks();
+
+    await runBeforeGuard(beforeGuard);
+    window.history.replaceState({ position: 1 }, '');
+    await runAfterHook(afterHook);
+
+    element.scrollTop = 80;
+    window.history.replaceState({ position: 0 }, '');
+    await runBeforeGuard(beforeGuard);
+    await runAfterHook(afterHook);
+
+    expect(element.scrollTo).toHaveBeenLastCalledWith({ top: 240 });
+  });
+
+  it('should remove router hooks when the scope is disposed', () => {
+    window.history.replaceState({ position: 0 }, '');
+    createScrollElement();
+    const routerMock = createRouterMock();
+    mountLayoutScroll(routerMock.router);
+
+    activeApp?.unmount();
+    activeApp = undefined;
+
+    expect(routerMock.removeBeforeGuard).toHaveBeenCalledOnce();
+    expect(routerMock.removeAfterHook).toHaveBeenCalledOnce();
+  });
+});
diff --git a/packages/effects/layouts/src/basic/content/content.vue b/packages/effects/layouts/src/basic/content/content.vue
index 4ce9e4db..b6080321 100644
--- a/packages/effects/layouts/src/basic/content/content.vue
+++ b/packages/effects/layouts/src/basic/content/content.vue
@@ -1,16 +1,15 @@
 <script lang="ts" setup>
-import type {
-  RouteLocationNormalizedLoaded,
-  RouteLocationNormalizedLoadedGeneric,
-} from 'vue-router';
+import type { RouteLocationNormalizedLoadedGeneric } from 'vue-router';
 
-import { type VNode } from 'vue';
+import { unref } from 'vue';
 import { RouterView } from 'vue-router';
 
-import { preferences, usePreferences } from '@vben/preferences';
-import { storeToRefs, useTabbarStore } from '@vben/stores';
+import { usePreferences } from '@vben/preferences';
+import { getTabKey, storeToRefs, useTabbarStore } from '@vben/stores';
 
+import { transformComponent, useLayoutHook } from '../../hooks';
 import { IFrameRouterView } from '../../iframe';
+import { RouteCachedPage, RouteCachedView } from '../../route-cached';
 
 defineOptions({ name: 'LayoutContent' });
 
@@ -20,77 +19,33 @@ const { keepAlive } = usePreferences();
 const { getCachedTabs, getExcludeCachedTabs, renderRouteView } =
   storeToRefs(tabbarStore);
 
-// 页面切换动画
-function getTransitionName(_route: RouteLocationNormalizedLoaded) {
-  // 如果偏好设置未设置，则不使用动画
-  const { tabbar, transition } = preferences;
-  const transitionName = transition.name;
-  if (!transitionName || !transition.enable) {
-    return;
-  }
-
-  // 标签页未启用或者未开启缓存，则使用全局配置动画
-  if (!tabbar.enable || !keepAlive) {
-    return transitionName;
-  }
-
-  // 如果页面已经加载过，则不使用动画
-  // if (route.meta.loaded) {
-  //   return;
-  // }
-  // 已经打开且已经加载过的页面不使用动画
-  // const inTabs = getCachedTabs.value.includes(route.name as string);
-
-  // return inTabs && route.meta.loaded ? undefined : transitionName;
-  return transitionName;
-}
+const { getEnabledTransition, getTransitionName } = useLayoutHook();
 
 /**
- * 转换组件，自动添加 name
- * @param component
+ * 是否显示component
+ * @param route
  */
-function transformComponent(
-  component: VNode,
-  route: RouteLocationNormalizedLoadedGeneric,
-) {
-  // 组件视图未找到，如果有设置后备视图，则返回后备视图，如果没有，则抛出错误
-  if (!component) {
-    console.error(
-      'Component view not found，please check the route configuration',
-    );
-    return undefined;
-  }
-
-  const routeName = route.name as string;
-  // 如果组件没有 name，则直接返回
-  if (!routeName) {
-    return component;
-  }
-  const componentName = (component?.type as any)?.name;
-
-  // 已经设置过 name，则直接返回
-  if (componentName) {
-    return component;
-  }
-
-  // componentName 与 routeName 一致，则直接返回
-  if (componentName === routeName) {
-    return component;
-  }
-
-  // 设置 name
-  component.type ||= {};
-  (component.type as any).name = routeName;
-
-  return component;
-}
+const showComponent = (route: RouteLocationNormalizedLoadedGeneric) => {
+  return !route.meta.domCached && unref(renderRouteView);
+};
 </script>
 
 <template>
-  <div class="relative h-full">
+  <div class="page-route-container relative h-full">
     <IFrameRouterView />
+    <RouteCachedView />
     <RouterView v-slot="{ Component, route }">
-      <Transition :name="getTransitionName(route)" appear mode="out-in">
+      <RouteCachedPage
+        :component="Component"
+        :route="route"
+        v-if="route.meta.domCached"
+      />
+      <Transition
+        v-if="getEnabledTransition"
+        :name="getTransitionName(route)"
+        appear
+        :leave-active-class="`${getTransitionName(route)}-leave-active page-route-leave-active`"
+      >
         <KeepAlive
           v-if="keepAlive"
           :exclude="getExcludeCachedTabs"
@@ -98,17 +53,60 @@ function transformComponent(
         >
           <component
             :is="transformComponent(Component, route)"
-            v-if="renderRouteView"
+            v-if="showComponent(route)"
             v-show="!route.meta.iframeSrc"
-            :key="route.fullPath"
+            :key="getTabKey(route)"
           />
         </KeepAlive>
         <component
           :is="Component"
-          v-else-if="renderRouteView"
-          :key="route.fullPath"
+          v-else-if="showComponent(route)"
+          :key="getTabKey(route)"
         />
       </Transition>
+      <template v-else>
+        <KeepAlive
+          v-if="keepAlive"
+          :exclude="getExcludeCachedTabs"
+          :include="getCachedTabs"
+        >
+          <component
+            :is="transformComponent(Component, route)"
+            v-if="showComponent(route)"
+            v-show="!route.meta.iframeSrc"
+            :key="getTabKey(route)"
+          />
+        </KeepAlive>
+        <component
+          :is="Component"
+          v-else-if="showComponent(route)"
+          :key="getTabKey(route)"
+        />
+      </template>
     </RouterView>
   </div>
 </template>
+
+<style>
+/* 优化router动画切换切换重叠问题 */
+.page-route-leave-active {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+}
+
+/* 移除动画切换的横向滚动条 translateX(-30px) */
+.page-route-container:has(> .fade-slide-enter-active),
+.page-route-container:has(> .fade-slide-leave-active) {
+  overflow-x: hidden;
+}
+
+/* 移除动画切换的纵向滚动条 */
+.page-route-container:has(> .fade-up-enter-active),
+.page-route-container:has(> .fade-up-leave-active),
+.page-route-container:has(> .fade-down-enter-active),
+.page-route-container:has(> .fade-down-leave-active) {
+  overflow-y: hidden;
+}
+</style>
diff --git a/packages/effects/layouts/src/basic/content/index.ts b/packages/effects/layouts/src/basic/content/index.ts
index 500cbcca..8372b20c 100644
--- a/packages/effects/layouts/src/basic/content/index.ts
+++ b/packages/effects/layouts/src/basic/content/index.ts
@@ -1,2 +1,2 @@
-export { default as LayoutContent } from './content.vue';
 export { default as LayoutContentSpinner } from './content-spinner.vue';
+export { default as LayoutContent } from './content.vue';
diff --git a/packages/effects/layouts/src/basic/copyright/copyright.vue b/packages/effects/layouts/src/basic/copyright/copyright.vue
index 8202076a..e8babaa5 100644
--- a/packages/effects/layouts/src/basic/copyright/copyright.vue
+++ b/packages/effects/layouts/src/basic/copyright/copyright.vue
@@ -1,8 +1,8 @@
 <script lang="ts" setup>
 interface Props {
-  companyName: string;
+  companyName?: string;
   companySiteLink?: string;
-  date: string;
+  date?: string;
   icp?: string;
   icpLink?: string;
 }
@@ -25,8 +25,9 @@ withDefaults(defineProps<Props>(), {
     <!-- ICP Link -->
     <a
       v-if="icp"
-      :href="icpLink || 'javascript:void(0)'"
-      class="hover:text-primary-hover mx-1"
+      :href="icpLink || 'https://beian.miit.gov.cn/'"
+      class="mx-1 hover:text-primary-hover"
+      rel="noopener noreferrer"
       target="_blank"
     >
       {{ icp }}
@@ -39,7 +40,7 @@ withDefaults(defineProps<Props>(), {
     <a
       v-if="companyName"
       :href="companySiteLink || 'javascript:void(0)'"
-      class="hover:text-primary-hover mx-1"
+      class="mx-1 hover:text-primary-hover"
       target="_blank"
     >
       {{ companyName }}
diff --git a/packages/effects/layouts/src/basic/footer/footer.vue b/packages/effects/layouts/src/basic/footer/footer.vue
index 6fc256d7..564c6c2b 100644
--- a/packages/effects/layouts/src/basic/footer/footer.vue
+++ b/packages/effects/layouts/src/basic/footer/footer.vue
@@ -5,7 +5,7 @@ defineOptions({
 </script>
 
 <template>
-  <div class="flex-center text-muted-foreground relative h-full w-full text-xs">
+  <div class="relative flex-center size-full text-xs text-muted-foreground">
     <slot></slot>
   </div>
 </template>
diff --git a/packages/effects/layouts/src/basic/header/header.vue b/packages/effects/layouts/src/basic/header/header.vue
index 546342bf..fac2ff95 100644
--- a/packages/effects/layouts/src/basic/header/header.vue
+++ b/packages/effects/layouts/src/basic/header/header.vue
@@ -2,23 +2,43 @@
 import { computed, useSlots } from 'vue';
 
 import { useRefresh } from '@vben/hooks';
-import { RotateCw } from '@vben/icons';
+import { LockKeyhole, LogOut, RotateCw } from '@vben/icons';
+import { $t } from '@vben/locales';
 import { preferences, usePreferences } from '@vben/preferences';
 import { useAccessStore } from '@vben/stores';
-import { VbenFullScreen, VbenIconButton } from '@vben-core/shadcn-ui';
+
+import { useVbenModal } from '@vben-core/popup-ui';
+import {
+  VbenFullScreen,
+  VbenIconButton,
+  VbenTooltip,
+} from '@vben-core/shadcn-ui';
+
+import { useMagicKeys, whenever } from '@vueuse/core';
 
 import {
   GlobalSearch,
   LanguageToggle,
+  LockScreenModal,
+  Notification,
   PreferencesButton,
   ThemeToggle,
+  TimezoneButton,
 } from '../../widgets';
 
 interface Props {
+  /**
+   * 头像
+   */
+  avatar?: string;
   /**
    * Logo 主题
    */
   theme?: string;
+  /**
+   * 用户文本
+   */
+  text?: string;
 }
 
 defineOptions({
@@ -26,92 +46,240 @@ defineOptions({
 });
 
 withDefaults(defineProps<Props>(), {
+  avatar: '',
   theme: 'light',
+  text: '',
 });
 
-const emit = defineEmits<{ clearPreferencesAndLogout: [] }>();
+const emit = defineEmits<{
+  clearPreferencesAndLogout: [];
+  logout: [];
+  openLockScreen: [];
+}>();
 
-const REFERENCE_VALUE = 50;
+const REFERENCE_VALUE = 100;
 
 const accessStore = useAccessStore();
-const { globalSearchShortcutKey, preferencesButtonPosition } = usePreferences();
+const {
+  globalLockScreenShortcutKey,
+  globalLogoutShortcutKey,
+  globalSearchShortcutKey,
+  preferencesButtonPosition,
+} = usePreferences();
 const slots = useSlots();
 const { refresh } = useRefresh();
 
+const showLockInHeader = computed(
+  () =>
+    preferences.widget.lockScreen &&
+    preferences.widget.lockScreenButtonPosition === 'header',
+);
+
+const showLogoutInHeader = computed(
+  () => preferences.widget.logoutButtonPosition === 'header',
+);
+
+const enableLockScreenShortcutKey = computed(() => {
+  return showLockInHeader.value && globalLockScreenShortcutKey.value;
+});
+
+const enableLogoutShortcutKey = computed(() => {
+  return showLogoutInHeader.value && globalLogoutShortcutKey.value;
+});
+
+const [LockModal, lockModalApi] = useVbenModal({
+  connectedComponent: LockScreenModal,
+});
+const [LogoutModal, logoutModalApi] = useVbenModal({
+  onConfirm() {
+    handleSubmitLogout();
+  },
+});
+
+function handleOpenLock() {
+  lockModalApi.open();
+}
+
+function handleSubmitLock(lockScreenPassword: string) {
+  lockModalApi.close();
+  accessStore.lockScreen(lockScreenPassword);
+}
+
+function handleLogout() {
+  logoutModalApi.open();
+}
+
+function handleSubmitLogout() {
+  emit('logout');
+  logoutModalApi.close();
+}
+
+// 快捷键
+if (preferences.shortcutKeys.enable) {
+  const keys = useMagicKeys();
+  const lockKey = keys['Alt+KeyL'];
+  const logoutKey = keys['Alt+KeyQ'];
+
+  if (lockKey) {
+    whenever(lockKey, () => {
+      if (enableLockScreenShortcutKey.value) {
+        handleOpenLock();
+      }
+    });
+  }
+
+  if (logoutKey) {
+    whenever(logoutKey, () => {
+      if (enableLogoutShortcutKey.value) {
+        handleLogout();
+      }
+    });
+  }
+}
+
+/**
+ * 插槽列表类型
+ */
+type SlotItem = { index: number; name: string };
+
 const rightSlots = computed(() => {
-  const list = [{ index: REFERENCE_VALUE + 100, name: 'user-dropdown' }];
-  if (preferences.widget.globalSearch) {
-    list.push({
-      index: REFERENCE_VALUE,
-      name: 'global-search',
-    });
-  }
-
-  if (preferencesButtonPosition.value.header) {
-    list.push({
-      index: REFERENCE_VALUE + 10,
-      name: 'preferences',
-    });
-  }
-  if (preferences.widget.themeToggle) {
-    list.push({
-      index: REFERENCE_VALUE + 20,
-      name: 'theme-toggle',
-    });
-  }
-  if (preferences.widget.languageToggle) {
-    list.push({
-      index: REFERENCE_VALUE + 30,
-      name: 'language-toggle',
-    });
-  }
-  if (preferences.widget.fullscreen) {
-    list.push({
-      index: REFERENCE_VALUE + 40,
-      name: 'fullscreen',
-    });
-  }
-  if (preferences.widget.notification) {
-    list.push({
-      index: REFERENCE_VALUE + 50,
-      name: 'notification',
-    });
+  const list: Array<SlotItem> = [];
+
+  // 按 widget.order 顺序遍历，检查每个部件是否应在 header 中显示
+  const widgetChecks: Record<string, { slotName: string; visible: boolean }> = {
+    globalSearch: {
+      visible:
+        preferences.widget.globalSearch &&
+        preferences.widget.globalSearchButtonPosition === 'header',
+      slotName: 'global-search',
+    },
+    preferences: {
+      visible: preferencesButtonPosition.value.header,
+      slotName: 'preferences',
+    },
+    themeToggle: {
+      visible:
+        preferences.widget.themeToggle &&
+        preferences.widget.themeToggleButtonPosition === 'header',
+      slotName: 'theme-toggle',
+    },
+    languageToggle: {
+      visible:
+        preferences.widget.languageToggle &&
+        preferences.widget.languageToggleButtonPosition === 'header',
+      slotName: 'language-toggle',
+    },
+    timezone: {
+      visible:
+        preferences.widget.timezone &&
+        preferences.widget.timezoneButtonPosition === 'header',
+      slotName: 'timezone',
+    },
+    fullscreen: {
+      visible:
+        preferences.widget.fullscreen &&
+        preferences.widget.fullscreenButtonPosition === 'header',
+      slotName: 'fullscreen',
+    },
+    refresh: {
+      visible:
+        preferences.widget.refresh &&
+        preferences.widget.refreshButtonPosition === 'header',
+      slotName: 'refresh',
+    },
+    notification: {
+      visible:
+        preferences.widget.notification &&
+        preferences.widget.notificationButtonPosition === 'header',
+      slotName: 'notification',
+    },
+    lockScreenBtn: {
+      visible:
+        preferences.widget.lockScreen &&
+        preferences.widget.lockScreenButtonPosition === 'header',
+      slotName: 'lock-screen-btn',
+    },
+    logoutBtn: {
+      visible: preferences.widget.logoutButtonPosition === 'header',
+      slotName: 'logout-btn',
+    },
+  };
+
+  for (const key of preferences.widget.order) {
+    const check = widgetChecks[key];
+    if (check?.visible) {
+      list.push({ index: REFERENCE_VALUE + list.length, name: check.slotName });
+    }
   }
 
+  // 用户插槽（header-right-N）追加在后面
   Object.keys(slots).forEach((key) => {
-    const name = key.split('-');
     if (key.startsWith('header-right')) {
-      list.push({ index: Number(name[2]), name: key });
+      const slotIndex = Number(key.split('-')[2]);
+      const index = Number.isNaN(slotIndex) ? nextIndex(list) : slotIndex;
+      list.push({ index, name: key });
     }
   });
-  return list.sort((a, b) => a.index - b.index);
+  // 最后追加用户下拉框，若是索引值超过1000时则固定在1000（适配用户按钮不在最后的场景）
+  const userDropdownIndex = Math.min(1000, nextIndex(list));
+  list.push({ index: userDropdownIndex, name: 'user-dropdown' });
+  // 按照索引排序，保证插槽顺序
+  return list.toSorted((a, b) => a.index - b.index);
 });
 
 const leftSlots = computed(() => {
-  const list: Array<{ index: number; name: string }> = [];
-
-  if (preferences.widget.refresh) {
-    list.push({
-      index: 0,
-      name: 'refresh',
-    });
-  }
+  const list: Array<SlotItem> = [];
 
   Object.keys(slots).forEach((key) => {
-    const name = key.split('-');
+    // 适配插槽名称，例如第一个插槽名：header-left-1
     if (key.startsWith('header-left')) {
-      list.push({ index: Number(name[2]), name: key });
+      // 取第三个占位的数字，若是第三个占位不是数字，则自动分配排序索引
+      const slotIndex = Number(key.split('-')[2]);
+      const index = Number.isNaN(slotIndex) ? nextIndex(list) : slotIndex;
+      list.push({ index, name: key });
     }
   });
-  return list.sort((a, b) => a.index - b.index);
+  // 按照索引排序，保证插槽顺序
+  return list.toSorted((a, b) => a.index - b.index);
 });
 
+/**
+ * 获取列表下一个索引值(用于排序)
+ * @param list 列表
+ */
+function nextIndex(list: Array<SlotItem>) {
+  const index =
+    list.length > 0 ? Math.max(...list.map((item) => item.index)) : 0;
+  return index + 1;
+}
+
 function clearPreferencesAndLogout() {
   emit('clearPreferencesAndLogout');
 }
 </script>
 
 <template>
+  <LockModal
+    v-if="showLockInHeader"
+    :avatar="avatar"
+    :text="text"
+    @submit="handleSubmitLock"
+  />
+
+  <LogoutModal
+    v-if="showLogoutInHeader"
+    :cancel-text="$t('common.cancel')"
+    :confirm-text="$t('common.confirm')"
+    :fullscreen-button="false"
+    :title="$t('common.prompt')"
+    centered
+    content-class="px-8 min-h-10"
+    footer-class="border-none mb-3 mr-3"
+    header-class="border-none"
+  >
+    {{ $t('ui.widgets.logoutTip') }}
+  </LogoutModal>
+
   <template
     v-for="slot in leftSlots.filter((item) => item.index < REFERENCE_VALUE)"
     :key="slot.name"
@@ -133,10 +301,13 @@ function clearPreferencesAndLogout() {
   >
     <slot :name="slot.name"></slot>
   </template>
-  <div class="flex h-full min-w-0 flex-1 items-center">
+  <div
+    :class="`menu-align-${preferences.header.menuAlign}`"
+    class="flex h-full min-w-0 flex-1 items-center"
+  >
     <slot name="menu"></slot>
   </div>
-  <div class="flex h-full min-w-0 flex-shrink-0 items-center">
+  <div class="flex h-full min-w-0 shrink-0 items-center">
     <template v-for="slot in rightSlots" :key="slot.name">
       <slot :name="slot.name">
         <template v-if="slot.name === 'global-search'">
@@ -148,21 +319,90 @@ function clearPreferencesAndLogout() {
         </template>
 
         <template v-else-if="slot.name === 'preferences'">
-          <PreferencesButton
-            class="mr-1"
-            @clear-preferences-and-logout="clearPreferencesAndLogout"
-          />
+          <VbenTooltip side="bottom">
+            <template #trigger>
+              <PreferencesButton
+                class="mr-1"
+                @clear-preferences-and-logout="clearPreferencesAndLogout"
+              />
+            </template>
+            {{ $t('preferences.title') }}
+          </VbenTooltip>
         </template>
         <template v-else-if="slot.name === 'theme-toggle'">
-          <ThemeToggle class="mr-1 mt-[2px]" />
+          <VbenTooltip side="bottom">
+            <template #trigger>
+              <ThemeToggle class="mt-0.5 mr-1" />
+            </template>
+            {{ $t('preferences.theme.title') }}
+          </VbenTooltip>
         </template>
         <template v-else-if="slot.name === 'language-toggle'">
-          <LanguageToggle class="mr-1" />
+          <VbenTooltip side="bottom">
+            <template #trigger>
+              <LanguageToggle class="mr-1" />
+            </template>
+            {{ $t('preferences.widget.languageToggle') }}
+          </VbenTooltip>
         </template>
         <template v-else-if="slot.name === 'fullscreen'">
-          <VbenFullScreen class="mr-1" />
+          <VbenFullScreen
+            class="mr-1"
+            :tooltip="$t('preferences.widget.fullscreen')"
+          />
+        </template>
+        <template v-else-if="slot.name === 'timezone'">
+          <TimezoneButton class="mt-0.5 mr-1" />
+        </template>
+        <template v-else-if="slot.name === 'lock-screen-btn'">
+          <VbenIconButton
+            class="mr-1"
+            :tooltip="$t('ui.widgets.lockScreen.title')"
+            @click="handleOpenLock"
+          >
+            <LockKeyhole class="size-4" />
+          </VbenIconButton>
+        </template>
+        <template v-else-if="slot.name === 'logout-btn'">
+          <VbenIconButton
+            class="mr-1"
+            :tooltip="$t('common.logout')"
+            @click="handleLogout"
+          >
+            <LogOut class="size-4" />
+          </VbenIconButton>
+        </template>
+        <template v-else-if="slot.name === 'notification'">
+          <VbenTooltip side="bottom">
+            <template #trigger>
+              <Notification class="mr-1" />
+            </template>
+            {{ $t('preferences.widget.notification') }}
+          </VbenTooltip>
+        </template>
+        <template v-else-if="slot.name === 'refresh'">
+          <VbenIconButton
+            class="my-0 mr-1 rounded-md"
+            :tooltip="$t('preferences.widget.refresh')"
+            @click="refresh"
+          >
+            <RotateCw class="size-4" />
+          </VbenIconButton>
         </template>
       </slot>
     </template>
   </div>
 </template>
+<style lang="scss" scoped>
+.menu-align-start {
+  --menu-align: start;
+}
+
+.menu-align-center {
+  --menu-align: center;
+}
+
+.menu-align-end {
+  --menu-align: end;
+}
+</style>
diff --git a/packages/effects/layouts/src/basic/layout.vue b/packages/effects/layouts/src/basic/layout.vue
index fa132953..cc1687ba 100644
--- a/packages/effects/layouts/src/basic/layout.vue
+++ b/packages/effects/layouts/src/basic/layout.vue
@@ -1,19 +1,25 @@
 <script lang="ts" setup>
+import type { SetupContext } from 'vue';
+import type { RouteLocationNormalizedLoaded } from 'vue-router';
+
 import type { MenuRecordRaw } from '@vben/types';
 
-import { computed, useSlots, watch } from 'vue';
+import { computed, onMounted, useSlots, watch } from 'vue';
+import { useRoute } from 'vue-router';
 
 import { useRefresh } from '@vben/hooks';
-import { $t } from '@vben/locales';
+import { $t, i18n } from '@vben/locales';
 import {
   preferences,
   updatePreferences,
   usePreferences,
 } from '@vben/preferences';
-import { useLockStore } from '@vben/stores';
+import { useAccessStore, useTabbarStore, useTimezoneStore } from '@vben/stores';
 import { cloneDeep, mapTree } from '@vben/utils';
+
 import { VbenAdminLayout } from '@vben-core/layout-ui';
 import { VbenBackTop, VbenLogo } from '@vben-core/shadcn-ui';
+import { ELEMENT_ID_LAYOUT_SCROLL } from '@vben-core/shared/constants';
 
 import { Breadcrumb, CheckUpdates, Preferences } from '../widgets';
 import { LayoutContent, LayoutContentSpinner } from './content';
@@ -28,30 +34,57 @@ import {
   useMixedMenu,
 } from './menu';
 import { LayoutTabbar } from './tabbar';
+import { useLayoutScroll } from './use-layout-scroll';
 
 defineOptions({ name: 'BasicLayout' });
 
-const emit = defineEmits<{ clearPreferencesAndLogout: [] }>();
+withDefaults(defineProps<Props>(), {
+  avatar: '',
+  text: '',
+});
+
+const emit = defineEmits<{
+  clearPreferencesAndLogout: [];
+  clickLogo: [];
+  logout: [];
+}>();
+
+interface Props {
+  avatar?: string;
+  text?: string;
+}
 
 const {
   isDark,
   isHeaderNav,
   isMixedNav,
   isMobile,
+  isSideMode,
   isSideMixedNav,
+  isHeaderMixedNav,
+  isHeaderSidebarNav,
   layout,
   preferencesButtonPosition,
   sidebarCollapsed,
   theme,
 } = usePreferences();
-const lockStore = useLockStore();
+const accessStore = useAccessStore();
+const timezoneStore = useTimezoneStore();
 const { refresh } = useRefresh();
+const layoutScrollTarget = `#${ELEMENT_ID_LAYOUT_SCROLL}`;
+
+useLayoutScroll();
 
 const sidebarTheme = computed(() => {
   const dark = isDark.value || preferences.theme.semiDarkSidebar;
   return dark ? 'dark' : 'light';
 });
 
+const sidebarThemeSub = computed(() => {
+  const dark = isDark.value || preferences.theme.semiDarkSidebarSub;
+  return dark ? 'dark' : 'light';
+});
+
 const headerTheme = computed(() => {
   const dark = isDark.value || preferences.theme.semiDarkHeader;
   return dark ? 'dark' : 'light';
@@ -80,16 +113,50 @@ const logoCollapsed = computed(() => {
   if (isMobile.value && sidebarCollapsed.value) {
     return true;
   }
-  if (isHeaderNav.value || isMixedNav.value) {
+  if (isHeaderNav.value || isMixedNav.value || isHeaderSidebarNav.value) {
     return false;
   }
-  return sidebarCollapsed.value || isSideMixedNav.value;
+  return (
+    sidebarCollapsed.value || isSideMixedNav.value || isHeaderMixedNav.value
+  );
 });
 
 const showHeaderNav = computed(() => {
-  return !isMobile.value && (isHeaderNav.value || isMixedNav.value);
+  return (
+    !isMobile.value &&
+    (isHeaderNav.value || isMixedNav.value || isHeaderMixedNav.value)
+  );
 });
 
+const logoTheme = computed(() => {
+  const showLogoInHeader =
+    !isSideMode.value ||
+    isHeaderSidebarNav.value ||
+    isMixedNav.value ||
+    isMobile.value;
+  return showLogoInHeader ? headerTheme.value : sidebarTheme.value;
+});
+
+/**
+ * layout-sidebar扩展区域插槽extra-title的高度
+ */
+const sidebarExtraTitleHeight = computed<number | undefined>(() => {
+  const showSideExtraTitle =
+    preferences.logo.enable && preferences.logo.showText;
+  return showSideExtraTitle ? undefined : 0;
+});
+
+const {
+  handleMenuSelect,
+  handleMenuOpen,
+  headerActive,
+  headerMenus,
+  sidebarActive,
+  sidebarMenus,
+  mixHeaderMenus,
+  sidebarVisible,
+} = useMixedMenu();
+
 // 侧边多列菜单
 const {
   extraActiveMenu,
@@ -99,17 +166,7 @@ const {
   handleMixedMenuSelect,
   handleSideMouseLeave,
   sidebarExtraVisible,
-} = useExtraMenu();
-
-const {
-  handleMenuSelect,
-  handleMenuOpen,
-  headerActive,
-  headerMenus,
-  sidebarActive,
-  sidebarMenus,
-  sidebarVisible,
-} = useMixedMenu();
+} = useExtraMenu(mixHeaderMenus);
 
 /**
  * 包装菜单，翻译菜单名称
@@ -138,6 +195,33 @@ function clearPreferencesAndLogout() {
   emit('clearPreferencesAndLogout');
 }
 
+function handleLogout() {
+  emit('logout');
+}
+
+function clickLogo() {
+  emit('clickLogo');
+}
+
+function autoCollapseMenuByRouteMeta(route: RouteLocationNormalizedLoaded) {
+  // 只在双列模式下生效
+  if (
+    ['header-mixed-nav', 'sidebar-mixed-nav'].includes(
+      preferences.app.layout,
+    ) &&
+    route.meta &&
+    route.meta.hideInMenu
+  ) {
+    sidebarExtraVisible.value = false;
+  }
+}
+
+const route = useRoute();
+
+onMounted(() => {
+  autoCollapseMenuByRouteMeta(route);
+});
+
 watch(
   () => preferences.app.layout,
   async (val) => {
@@ -151,10 +235,21 @@ watch(
   },
 );
 
-// 语言更新后，刷新页面
-watch(() => preferences.app.locale, refresh, { flush: 'post' });
+const tabbarStore = useTabbarStore();
 
-const slots = useSlots();
+function refreshAll() {
+  tabbarStore.cachedTabs.clear();
+  refresh();
+}
+
+// 语言更新后，刷新页面
+// i18n.global.locale会在preference.app.locale变更之后才会更新，因此watchpreference.app.locale是不合适的，刷新页面时可能语言配置尚未完全加载完成
+watch(i18n.global.locale, refreshAll, { flush: 'post' });
+
+// 时区更新后，刷新页面
+watch(() => timezoneStore.timezone, refreshAll, { flush: 'post' });
+
+const slots: SetupContext['slots'] = useSlots();
 const headerSlots = computed(() => {
   return Object.keys(slots).filter((key) => key.startsWith('header-'));
 });
@@ -164,8 +259,16 @@ const headerSlots = computed(() => {
   <VbenAdminLayout
     v-model:sidebar-extra-visible="sidebarExtraVisible"
     :content-compact="preferences.app.contentCompact"
+    :content-compact-width="preferences.app.contentCompactWidth"
+    :content-padding="preferences.app.contentPadding"
+    :content-padding-bottom="preferences.app.contentPaddingBottom"
+    :content-padding-left="preferences.app.contentPaddingLeft"
+    :content-padding-right="preferences.app.contentPaddingRight"
+    :content-padding-top="preferences.app.contentPaddingTop"
     :footer-enable="preferences.footer.enable"
     :footer-fixed="preferences.footer.fixed"
+    :footer-height="preferences.footer.height"
+    :header-height="preferences.header.height"
     :header-hidden="preferences.header.hidden"
     :header-mode="preferences.header.mode"
     :header-theme="headerTheme"
@@ -173,16 +276,26 @@ const headerSlots = computed(() => {
     :header-visible="preferences.header.enable"
     :is-mobile="preferences.app.isMobile"
     :layout="layout"
+    :sidebar-draggable="preferences.sidebar.draggable"
     :sidebar-collapse="preferences.sidebar.collapsed"
     :sidebar-collapse-show-title="preferences.sidebar.collapsedShowTitle"
     :sidebar-enable="sidebarVisible"
+    :sidebar-collapsed-button="preferences.sidebar.collapsedButton"
+    :sidebar-fixed-button="preferences.sidebar.fixedButton"
     :sidebar-expand-on-hover="preferences.sidebar.expandOnHover"
     :sidebar-extra-collapse="preferences.sidebar.extraCollapse"
+    :sidebar-extra-collapsed-width="preferences.sidebar.extraCollapsedWidth"
+    :sidebar-extra-title-height="sidebarExtraTitleHeight"
     :sidebar-hidden="preferences.sidebar.hidden"
+    :sidebar-mixed-width="preferences.sidebar.mixedWidth"
     :sidebar-theme="sidebarTheme"
+    :sidebar-theme-sub="sidebarThemeSub"
     :sidebar-width="preferences.sidebar.width"
+    :side-collapse-width="preferences.sidebar.collapseWidth"
+    :sidebar-logo-visible="preferences.logo.enable"
     :tabbar-enable="preferences.tabbar.enable"
     :tabbar-height="preferences.tabbar.height"
+    :z-index="preferences.app.zIndex"
     @side-mouse-leave="handleSideMouseLeave"
     @toggle-sidebar="toggleSidebar"
     @update:sidebar-collapse="
@@ -199,23 +312,39 @@ const headerSlots = computed(() => {
       (value: boolean) =>
         updatePreferences({ sidebar: { extraCollapse: value } })
     "
+    @update:sidebar-width="
+      (value: number) => updatePreferences({ sidebar: { width: value } })
+    "
   >
     <!-- logo -->
     <template #logo>
       <VbenLogo
         v-if="preferences.logo.enable"
+        :fit="preferences.logo.fit"
         :class="logoClass"
         :collapsed="logoCollapsed"
         :src="preferences.logo.source"
+        :src-dark="preferences.logo.sourceDark"
         :text="preferences.app.name"
-        :theme="showHeaderNav ? headerTheme : theme"
-      />
+        :show-text="preferences.logo.showText"
+        :logo-mode="preferences.logo.logoMode"
+        :full-logo-height="preferences.logo.fullLogoHeight"
+        :theme="logoTheme"
+        @click="clickLogo"
+      >
+        <template v-if="$slots['logo-text']" #text>
+          <slot name="logo-text"></slot>
+        </template>
+      </VbenLogo>
     </template>
     <!-- 头部区域 -->
     <template #header>
       <LayoutHeader
+        :avatar="avatar"
         :theme="theme"
+        :text="text"
         @clear-preferences-and-logout="clearPreferencesAndLogout"
+        @logout="handleLogout"
       >
         <template
           v-if="!showHeaderNav && preferences.breadcrumb.enable"
@@ -268,7 +397,7 @@ const headerSlots = computed(() => {
     <template #mixed-menu>
       <LayoutMixedMenu
         :active-path="extraActiveMenu"
-        :menus="wrapperMenus(headerMenus, false)"
+        :menus="wrapperMenus(mixHeaderMenus, false)"
         :rounded="isMenuRounded"
         :theme="sidebarTheme"
         @default-select="handleDefaultSelect"
@@ -283,16 +412,23 @@ const headerSlots = computed(() => {
         :collapse="preferences.sidebar.extraCollapse"
         :menus="wrapperMenus(extraMenus)"
         :rounded="isMenuRounded"
-        :theme="sidebarTheme"
+        :theme="sidebarThemeSub"
       />
     </template>
     <template #side-extra-title>
       <VbenLogo
         v-if="preferences.logo.enable"
+        :fit="preferences.logo.fit"
+        :show-text="preferences.logo.showText"
         :text="preferences.app.name"
         :theme="theme"
         :version="preferences.app.version"
-      />
+      >
+        :theme="sidebarThemeSub"
+        <template v-if="$slots['logo-text']" #text>
+          <slot name="logo-text"></slot>
+        </template>
+      </VbenLogo>
     </template>
 
     <template #tabbar>
@@ -330,16 +466,16 @@ const headerSlots = computed(() => {
       />
 
       <Transition v-if="preferences.widget.lockScreen" name="slide-up">
-        <slot v-if="lockStore.isLockScreen" name="lock-screen"></slot>
+        <slot v-if="accessStore.isLockScreen" name="lock-screen"></slot>
       </Transition>
 
       <template v-if="preferencesButtonPosition.fixed">
         <Preferences
-          class="z-100 fixed bottom-20 right-0"
+          class="fixed top-1/2 right-0 z-100 -translate-y-1/2 transform"
           @clear-preferences-and-logout="clearPreferencesAndLogout"
         />
       </template>
-      <VbenBackTop />
+      <VbenBackTop :target="layoutScrollTarget" />
     </template>
   </VbenAdminLayout>
 </template>
diff --git a/packages/effects/layouts/src/basic/menu/extra-menu.vue b/packages/effects/layouts/src/basic/menu/extra-menu.vue
index d8ccc1b4..5f194a75 100644
--- a/packages/effects/layouts/src/basic/menu/extra-menu.vue
+++ b/packages/effects/layouts/src/basic/menu/extra-menu.vue
@@ -1,5 +1,6 @@
 <script lang="ts" setup>
 import type { MenuRecordRaw } from '@vben/types';
+
 import type { MenuProps } from '@vben-core/menu-ui';
 
 import { useRoute } from 'vue-router';
@@ -10,7 +11,7 @@ import { useNavigation } from './use-navigation';
 
 interface Props extends MenuProps {
   collapse?: boolean;
-  menus: MenuRecordRaw[];
+  menus?: MenuRecordRaw[];
 }
 
 withDefaults(defineProps<Props>(), {
diff --git a/packages/effects/layouts/src/basic/menu/menu.vue b/packages/effects/layouts/src/basic/menu/menu.vue
index 812813a6..cbb5cfb5 100644
--- a/packages/effects/layouts/src/basic/menu/menu.vue
+++ b/packages/effects/layouts/src/basic/menu/menu.vue
@@ -1,11 +1,12 @@
 <script lang="ts" setup>
 import type { MenuRecordRaw } from '@vben/types';
+
 import type { MenuProps } from '@vben-core/menu-ui';
 
 import { Menu } from '@vben-core/menu-ui';
 
 interface Props extends MenuProps {
-  menus: MenuRecordRaw[];
+  menus?: MenuRecordRaw[];
 }
 
 const props = withDefaults(defineProps<Props>(), {
@@ -36,6 +37,7 @@ function handleMenuOpen(key: string, path: string[]) {
     :menus="menus"
     :mode="mode"
     :rounded="rounded"
+    scroll-to-active
     :theme="theme"
     @open="handleMenuOpen"
     @select="handleMenuSelect"
diff --git a/packages/effects/layouts/src/basic/menu/mixed-menu.vue b/packages/effects/layouts/src/basic/menu/mixed-menu.vue
index b54bc48b..ae12cc93 100644
--- a/packages/effects/layouts/src/basic/menu/mixed-menu.vue
+++ b/packages/effects/layouts/src/basic/menu/mixed-menu.vue
@@ -1,11 +1,13 @@
 <script lang="ts" setup>
 import type { MenuRecordRaw } from '@vben/types';
+
 import type { NormalMenuProps } from '@vben-core/menu-ui';
 
 import { onBeforeMount } from 'vue';
 import { useRoute } from 'vue-router';
 
 import { findMenuByPath } from '@vben/utils';
+
 import { NormalMenu } from '@vben-core/menu-ui';
 
 interface Props extends NormalMenuProps {}
diff --git a/packages/effects/layouts/src/basic/menu/use-extra-menu.ts b/packages/effects/layouts/src/basic/menu/use-extra-menu.ts
index f47a81a8..e2afb741 100644
--- a/packages/effects/layouts/src/basic/menu/use-extra-menu.ts
+++ b/packages/effects/layouts/src/basic/menu/use-extra-menu.ts
@@ -1,3 +1,5 @@
+import type { ComputedRef } from 'vue';
+
 import type { MenuRecordRaw } from '@vben/types';
 
 import { computed, ref, watch } from 'vue';
@@ -9,30 +11,37 @@ import { findRootMenuByPath } from '@vben/utils';
 
 import { useNavigation } from './use-navigation';
 
-function useExtraMenu() {
+function useExtraMenu(useRootMenus?: ComputedRef<MenuRecordRaw[]>) {
   const accessStore = useAccessStore();
-  const { navigation } = useNavigation();
+  const { navigation, willOpenedByWindow } = useNavigation();
 
-  const menus = computed(() => accessStore.accessMenus);
+  const menus = computed(() => useRootMenus?.value ?? accessStore.accessMenus);
 
   /** 记录当前顶级菜单下哪个子菜单最后激活 */
   const defaultSubMap = new Map<string, string>();
-
+  const extraRootMenus = ref<MenuRecordRaw[]>([]);
   const route = useRoute();
   const extraMenus = ref<MenuRecordRaw[]>([]);
   const sidebarExtraVisible = ref<boolean>(false);
   const extraActiveMenu = ref('');
+  const parentLevel = computed(() =>
+    preferences.app.layout === 'header-mixed-nav' ? 1 : 0,
+  );
 
   /**
    * 选择混合菜单事件
    * @param menu
    */
   const handleMixedMenuSelect = async (menu: MenuRecordRaw) => {
-    extraMenus.value = menu?.children ?? [];
-    extraActiveMenu.value = menu.parents?.[0] ?? menu.path;
-    const hasChildren = extraMenus.value.length > 0;
+    const _extraMenus = menu?.children ?? [];
+    const hasChildren = _extraMenus.length > 0;
+
+    if (!willOpenedByWindow(menu.path)) {
+      extraMenus.value = _extraMenus ?? [];
+      extraActiveMenu.value = menu.parents?.[parentLevel.value] ?? menu.path;
+      sidebarExtraVisible.value = hasChildren;
+    }
 
-    sidebarExtraVisible.value = hasChildren;
     if (!hasChildren) {
       await navigation(menu.path);
     } else if (preferences.sidebar.autoActivateChild) {
@@ -49,12 +58,12 @@ function useExtraMenu() {
    * @param menu
    * @param rootMenu
    */
-  const handleDefaultSelect = (
+  const handleDefaultSelect = async (
     menu: MenuRecordRaw,
     rootMenu?: MenuRecordRaw,
   ) => {
-    extraMenus.value = rootMenu?.children ?? [];
-    extraActiveMenu.value = menu.parents?.[0] ?? menu.path;
+    extraMenus.value = rootMenu?.children ?? extraRootMenus.value ?? [];
+    extraActiveMenu.value = menu.parents?.[parentLevel.value] ?? menu.path;
 
     if (preferences.sidebar.expandOnHover) {
       sidebarExtraVisible.value = extraMenus.value.length > 0;
@@ -68,7 +77,6 @@ function useExtraMenu() {
     if (preferences.sidebar.expandOnHover) {
       return;
     }
-    sidebarExtraVisible.value = false;
 
     const { findMenu, rootMenu, rootMenuPath } = findRootMenuByPath(
       menus.value,
@@ -82,25 +90,31 @@ function useExtraMenu() {
     if (!preferences.sidebar.expandOnHover) {
       const { findMenu } = findRootMenuByPath(menus.value, menu.path);
       extraMenus.value = findMenu?.children ?? [];
-      extraActiveMenu.value = menu.parents?.[0] ?? menu.path;
+      extraActiveMenu.value = menu.parents?.[parentLevel.value] ?? menu.path;
       sidebarExtraVisible.value = extraMenus.value.length > 0;
     }
   };
 
+  function calcExtraMenus(path: string) {
+    const currentPath = route.meta?.activePath || path;
+    const { findMenu, rootMenu, rootMenuPath } = findRootMenuByPath(
+      menus.value,
+      currentPath,
+      parentLevel.value,
+    );
+    extraRootMenus.value = rootMenu?.children ?? [];
+    if (rootMenuPath) defaultSubMap.set(rootMenuPath, currentPath);
+    extraActiveMenu.value = rootMenuPath ?? findMenu?.path ?? '';
+    extraMenus.value = rootMenu?.children ?? [];
+    if (preferences.sidebar.expandOnHover) {
+      sidebarExtraVisible.value = extraMenus.value.length > 0;
+    }
+  }
+
   watch(
-    () => route.path,
-    (path) => {
-      const currentPath = route.meta?.activePath || path;
-      // if (preferences.sidebar.expandOnHover) {
-      //   return;
-      // }
-      const { findMenu, rootMenu, rootMenuPath } = findRootMenuByPath(
-        menus.value,
-        currentPath,
-      );
-      if (rootMenuPath) defaultSubMap.set(rootMenuPath, currentPath);
-      extraActiveMenu.value = rootMenuPath ?? findMenu?.path ?? '';
-      extraMenus.value = rootMenu?.children ?? [];
+    () => [route.path, preferences.app.layout],
+    ([path]) => {
+      calcExtraMenus(path || '');
     },
     { immediate: true },
   );
diff --git a/packages/effects/layouts/src/basic/menu/use-mixed-menu.ts b/packages/effects/layouts/src/basic/menu/use-mixed-menu.ts
index 57a4df0a..ae217fbe 100644
--- a/packages/effects/layouts/src/basic/menu/use-mixed-menu.ts
+++ b/packages/effects/layouts/src/basic/menu/use-mixed-menu.ts
@@ -10,17 +10,22 @@ import { findRootMenuByPath } from '@vben/utils';
 import { useNavigation } from './use-navigation';
 
 function useMixedMenu() {
-  const { navigation } = useNavigation();
+  const { navigation, willOpenedByWindow } = useNavigation();
   const accessStore = useAccessStore();
   const route = useRoute();
   const splitSideMenus = ref<MenuRecordRaw[]>([]);
   const rootMenuPath = ref<string>('');
+  const mixedRootMenuPath = ref<string>('');
+  const mixExtraMenus = ref<MenuRecordRaw[]>([]);
   /** 记录当前顶级菜单下哪个子菜单最后激活 */
   const defaultSubMap = new Map<string, string>();
-  const { isMixedNav } = usePreferences();
+  const { isMixedNav, isHeaderMixedNav, isMobile } = usePreferences();
 
   const needSplit = computed(
-    () => preferences.navigation.split && isMixedNav.value,
+    () =>
+      !isMobile.value &&
+      ((preferences.navigation.split && isMixedNav.value) ||
+        isHeaderMixedNav.value),
   );
 
   const sidebarVisible = computed(() => {
@@ -54,6 +59,10 @@ function useMixedMenu() {
     return needSplit.value ? splitSideMenus.value : menus.value;
   });
 
+  const mixHeaderMenus = computed(() => {
+    return isHeaderMixedNav.value ? sidebarMenus.value : headerMenus.value;
+  });
+
   /**
    * 侧边菜单激活路径
    */
@@ -66,7 +75,7 @@ function useMixedMenu() {
    */
   const headerActive = computed(() => {
     if (!needSplit.value) {
-      return route.path;
+      return route.meta?.activePath ?? route.path;
     }
     return rootMenuPath.value;
   });
@@ -81,11 +90,15 @@ function useMixedMenu() {
       navigation(key);
       return;
     }
-
     const rootMenu = menus.value.find((item) => item.path === key);
-    rootMenuPath.value = rootMenu?.path ?? '';
-    splitSideMenus.value = rootMenu?.children ?? [];
-    if (splitSideMenus.value.length === 0) {
+    const _splitSideMenus = rootMenu?.children ?? [];
+
+    if (!willOpenedByWindow(key)) {
+      rootMenuPath.value = rootMenu?.path ?? '';
+      splitSideMenus.value = _splitSideMenus;
+    }
+
+    if (_splitSideMenus.length === 0) {
       navigation(key);
     } else if (rootMenu && preferences.sidebar.autoActivateChild) {
       navigation(
@@ -118,6 +131,9 @@ function useMixedMenu() {
     if (!rootMenu) {
       rootMenu = menus.value.find((item) => item.path === path);
     }
+    const result = findRootMenuByPath(rootMenu?.children || [], path, 1);
+    mixedRootMenuPath.value = result.rootMenuPath ?? '';
+    mixExtraMenus.value = result.rootMenu?.children ?? [];
     rootMenuPath.value = rootMenu?.path ?? '';
     splitSideMenus.value = rootMenu?.children ?? [];
   }
@@ -125,7 +141,10 @@ function useMixedMenu() {
   watch(
     () => route.path,
     (path) => {
-      const currentPath = (route?.meta?.activePath as string) ?? path;
+      const currentPath = route?.meta?.activePath ?? route?.meta?.link ?? path;
+      if (willOpenedByWindow(currentPath)) {
+        return;
+      }
       calcSideMenus(currentPath);
       if (rootMenuPath.value)
         defaultSubMap.set(rootMenuPath.value, currentPath);
@@ -145,6 +164,8 @@ function useMixedMenu() {
     headerMenus,
     sidebarActive,
     sidebarMenus,
+    mixHeaderMenus,
+    mixExtraMenus,
     sidebarVisible,
   };
 }
diff --git a/packages/effects/layouts/src/basic/menu/use-navigation.ts b/packages/effects/layouts/src/basic/menu/use-navigation.ts
index ace64452..daa6dc71 100644
--- a/packages/effects/layouts/src/basic/menu/use-navigation.ts
+++ b/packages/effects/layouts/src/basic/menu/use-navigation.ts
@@ -1,33 +1,74 @@
-import { type RouteRecordNormalized, useRouter } from 'vue-router';
+import type { RouteRecordNormalized } from 'vue-router';
+
+import { useRouter } from 'vue-router';
 
 import { isHttpUrl, openRouteInNewWindow, openWindow } from '@vben/utils';
 
 function useNavigation() {
   const router = useRouter();
-  const routes = router.getRoutes();
-
   const routeMetaMap = new Map<string, RouteRecordNormalized>();
 
-  routes.forEach((route) => {
-    routeMetaMap.set(route.path, route);
+  // 初始化路由映射
+  const initRouteMetaMap = () => {
+    const routes = router.getRoutes();
+    routes.forEach((route) => {
+      routeMetaMap.set(route.path, route);
+    });
+  };
+
+  initRouteMetaMap();
+
+  // 监听路由变化
+  router.afterEach(() => {
+    initRouteMetaMap();
   });
 
-  const navigation = async (path: string) => {
-    const route = routeMetaMap.get(path);
-    const { openInNewWindow = false, query = {} } = route?.meta ?? {};
+  // 检查是否应该在新窗口打开
+  const shouldOpenInNewWindow = (path: string): boolean => {
     if (isHttpUrl(path)) {
-      openWindow(path, { target: '_blank' });
-    } else if (openInNewWindow) {
-      openRouteInNewWindow(path);
-    } else {
-      await router.push({
-        path,
-        query,
-      });
+      return true;
+    }
+    const route = routeMetaMap.get(path);
+    // 如果有外链或者设置了在新窗口打开，返回 true
+    return !!(route?.meta?.link || route?.meta?.openInNewWindow);
+  };
+
+  const resolveHref = (path: string): string => {
+    return router.resolve(path).href;
+  };
+
+  const navigation = async (path: string) => {
+    try {
+      const route = routeMetaMap.get(path);
+      const { openInNewWindow = false, query = {}, link } = route?.meta ?? {};
+
+      // 检查是否有外链
+      if (link && typeof link === 'string') {
+        openWindow(link, { target: '_blank' });
+        return;
+      }
+
+      if (isHttpUrl(path)) {
+        openWindow(path, { target: '_blank' });
+      } else if (openInNewWindow) {
+        openRouteInNewWindow(resolveHref(path));
+      } else {
+        await router.push({
+          path,
+          query,
+        });
+      }
+    } catch (error) {
+      console.error('Navigation failed:', error);
+      throw error;
     }
   };
 
-  return { navigation };
+  const willOpenedByWindow = (path: string) => {
+    return shouldOpenInNewWindow(path);
+  };
+
+  return { navigation, willOpenedByWindow };
 }
 
 export { useNavigation };
diff --git a/packages/effects/layouts/src/basic/tabbar/tabbar.vue b/packages/effects/layouts/src/basic/tabbar/tabbar.vue
index 06d8f0e5..367604ea 100644
--- a/packages/effects/layouts/src/basic/tabbar/tabbar.vue
+++ b/packages/effects/layouts/src/basic/tabbar/tabbar.vue
@@ -5,7 +5,13 @@ import { useRoute } from 'vue-router';
 import { useContentMaximize, useTabs } from '@vben/hooks';
 import { preferences } from '@vben/preferences';
 import { useTabbarStore } from '@vben/stores';
-import { TabsToolMore, TabsToolScreen, TabsView } from '@vben-core/tabs-ui';
+
+import {
+  TabsToolMore,
+  TabsToolRefresh,
+  TabsToolScreen,
+  TabsView,
+} from '@vben-core/tabs-ui';
 
 import { useTabbar } from './use-tabbar';
 
@@ -18,7 +24,7 @@ defineProps<{ showIcon?: boolean; theme?: string }>();
 const route = useRoute();
 const tabbarStore = useTabbarStore();
 const { contentIsMaximize, toggleMaximize } = useContentMaximize();
-const { unpinTab } = useTabs();
+const { refreshTab, unpinTab } = useTabs();
 
 const {
   createContextMenus,
@@ -29,7 +35,7 @@ const {
 } = useTabbar();
 
 const menus = computed(() => {
-  const tab = tabbarStore.getTabByPath(currentActive.value);
+  const tab = tabbarStore.getTabByKey(currentActive.value);
   const menus = createContextMenus(tab);
   return menus.map((item) => {
     return {
@@ -56,6 +62,7 @@ if (!preferences.tabbar.persist) {
     :style-type="preferences.tabbar.styleType"
     :tabs="currentTabs"
     :wheelable="preferences.tabbar.wheelable"
+    :middle-click-to-close="preferences.tabbar.middleClickToClose"
     @close="handleClose"
     @sort-tabs="tabbarStore.sortTabs"
     @unpin="unpinTab"
@@ -63,6 +70,10 @@ if (!preferences.tabbar.persist) {
   />
   <div class="flex-center h-full">
     <TabsToolMore v-if="preferences.tabbar.showMore" :menus="menus" />
+    <TabsToolRefresh
+      v-if="preferences.tabbar.showRefresh"
+      @refresh="refreshTab"
+    />
     <TabsToolScreen
       v-if="preferences.tabbar.showMaximize"
       :screen="contentIsMaximize"
diff --git a/packages/effects/layouts/src/basic/tabbar/use-tabbar.ts b/packages/effects/layouts/src/basic/tabbar/use-tabbar.ts
index 52b32dc4..0f0ef340 100644
--- a/packages/effects/layouts/src/basic/tabbar/use-tabbar.ts
+++ b/packages/effects/layouts/src/basic/tabbar/use-tabbar.ts
@@ -1,7 +1,9 @@
-import type { TabDefinition } from '@vben/types';
-import type { IContextMenuItem } from '@vben-core/tabs-ui';
 import type { RouteLocationNormalizedGeneric } from 'vue-router';
 
+import type { TabDefinition } from '@vben/types';
+
+import type { IContextMenuItem } from '@vben-core/tabs-ui';
+
 import { computed, ref, watch } from 'vue';
 import { useRoute, useRouter } from 'vue-router';
 
@@ -20,7 +22,7 @@ import {
   X,
 } from '@vben/icons';
 import { $t, useI18n } from '@vben/locales';
-import { useAccessStore, useTabbarStore } from '@vben/stores';
+import { getTabKey, useAccessStore, useTabbarStore } from '@vben/stores';
 import { filterTree } from '@vben/utils';
 
 export function useTabbar() {
@@ -42,8 +44,11 @@ export function useTabbar() {
     toggleTabPin,
   } = useTabs();
 
+  /**
+   * 当前路径对应的tab的key
+   */
   const currentActive = computed(() => {
-    return route.fullPath;
+    return getTabKey(route);
   });
 
   const { locale } = useI18n();
@@ -71,7 +76,8 @@ export function useTabbar() {
 
   // 点击tab,跳转路由
   const handleClick = (key: string) => {
-    router.push(key);
+    const { fullPath, path } = tabbarStore.getTabByKey(key);
+    router.push(fullPath || path);
   };
 
   // 关闭tab
@@ -98,7 +104,7 @@ export function useTabbar() {
   );
 
   watch(
-    () => route.path,
+    () => route.fullPath,
     () => {
       const meta = route.matched?.[route.matched.length - 1]?.meta;
       tabbarStore.addTab({
@@ -156,7 +162,7 @@ export function useTabbar() {
       },
       {
         disabled: disabledRefresh,
-        handler: refreshTab,
+        handler: () => refreshTab(),
         icon: RotateCw,
         key: 'reload',
         text: $t('preferences.tabbar.contextMenu.reload'),
@@ -207,7 +213,8 @@ export function useTabbar() {
         text: $t('preferences.tabbar.contextMenu.closeAll'),
       },
     ];
-    return menus;
+
+    return menus.filter((item) => tabbarStore.getMenuList.includes(item.key));
   };
 
   return {
diff --git a/packages/effects/layouts/src/basic/use-layout-scroll.ts b/packages/effects/layouts/src/basic/use-layout-scroll.ts
new file mode 100644
index 00000000..9aa89aca
--- /dev/null
+++ b/packages/effects/layouts/src/basic/use-layout-scroll.ts
@@ -0,0 +1,85 @@
+import type { Router } from 'vue-router';
+
+import { nextTick, onScopeDispose } from 'vue';
+import { useRouter } from 'vue-router';
+
+import { getLayoutScrollElement } from '@vben-core/shared/utils';
+
+type LayoutScrollRouter = Pick<Router, 'afterEach' | 'beforeEach'>;
+
+function getHistoryPosition() {
+  if (typeof window === 'undefined') {
+    return undefined;
+  }
+  const position = (window.history.state as null | { position?: unknown })
+    ?.position;
+  return typeof position === 'number' ? position : undefined;
+}
+
+function getHashTarget(scrollElement: HTMLElement, hash: string) {
+  if (!hash.startsWith('#')) {
+    return null;
+  }
+
+  const id = hash.slice(1);
+  try {
+    return scrollElement.querySelector<HTMLElement>(
+      `#${CSS.escape(decodeURIComponent(id))}`,
+    );
+  } catch {
+    return scrollElement.querySelector<HTMLElement>(`#${CSS.escape(id)}`);
+  }
+}
+
+export function useLayoutScroll(router: LayoutScrollRouter = useRouter()) {
+  const scrollPositions = new Map<number, number>();
+  let currentHistoryPosition = getHistoryPosition();
+  let isHistoryNavigation = false;
+
+  const removeBeforeGuard = router.beforeEach(() => {
+    const scrollElement = getLayoutScrollElement();
+    if (scrollElement && currentHistoryPosition !== undefined) {
+      scrollPositions.set(currentHistoryPosition, scrollElement.scrollTop);
+    }
+
+    const nextHistoryPosition = getHistoryPosition();
+    isHistoryNavigation =
+      currentHistoryPosition !== undefined &&
+      nextHistoryPosition !== undefined &&
+      currentHistoryPosition !== nextHistoryPosition;
+  });
+
+  const removeAfterHook = router.afterEach(async (to, _from, failure) => {
+    const nextHistoryPosition = getHistoryPosition();
+
+    if (!failure) {
+      await nextTick();
+      const scrollElement = getLayoutScrollElement();
+      if (scrollElement) {
+        const savedPosition =
+          isHistoryNavigation && nextHistoryPosition !== undefined
+            ? scrollPositions.get(nextHistoryPosition)
+            : undefined;
+
+        if (savedPosition === undefined) {
+          const hashTarget = getHashTarget(scrollElement, to.hash);
+          if (hashTarget) {
+            hashTarget.scrollIntoView({ behavior: 'smooth', block: 'start' });
+          } else {
+            scrollElement.scrollTo({ top: 0 });
+          }
+        } else {
+          scrollElement.scrollTo({ top: savedPosition });
+        }
+      }
+    }
+
+    currentHistoryPosition = nextHistoryPosition;
+    isHistoryNavigation = false;
+  });
+
+  onScopeDispose(() => {
+    removeBeforeGuard();
+    removeAfterHook();
+  });
+}
diff --git a/packages/effects/layouts/src/hooks/index.ts b/packages/effects/layouts/src/hooks/index.ts
new file mode 100644
index 00000000..5f825ac9
--- /dev/null
+++ b/packages/effects/layouts/src/hooks/index.ts
@@ -0,0 +1,98 @@
+import type { VNode } from 'vue';
+import type {
+  RouteLocationNormalizedLoaded,
+  RouteLocationNormalizedLoadedGeneric,
+} from 'vue-router';
+
+import { computed } from 'vue';
+
+import { preferences, usePreferences } from '@vben/preferences';
+
+/**
+ * 转换组件，自动添加 name
+ * @param component
+ * @param route
+ */
+export function transformComponent(
+  component: VNode,
+  route: RouteLocationNormalizedLoadedGeneric,
+) {
+  // 组件视图未找到，如果有设置后备视图，则返回后备视图，如果没有，则抛出错误
+  if (!component) {
+    console.error(
+      'Component view not found，please check the route configuration',
+    );
+    return undefined;
+  }
+
+  const routeName = route.name as string;
+  // 如果组件没有 name，则直接返回
+  if (!routeName) {
+    return component;
+  }
+  const componentName = (component?.type as any)?.name;
+
+  // 已经设置过 name，则直接返回
+  if (componentName) {
+    return component;
+  }
+
+  // componentName 与 routeName 一致，则直接返回
+  if (componentName === routeName) {
+    return component;
+  }
+
+  // 设置 name
+  component.type ||= {};
+  (component.type as any).name = routeName;
+
+  return component;
+}
+
+/**
+ * Layout相关hook
+ */
+export function useLayoutHook() {
+  const { keepAlive } = usePreferences();
+  /**
+   * 是否使用动画
+   */
+  const getEnabledTransition = computed(() => {
+    const { transition } = preferences;
+    const transitionName = transition.name;
+    return transitionName && transition.enable;
+  });
+
+  /**
+   * 获取路由过渡动画
+   * @param _route
+   */
+  function getTransitionName(_route: RouteLocationNormalizedLoaded) {
+    // 如果偏好设置未设置，则不使用动画
+    const { tabbar, transition } = preferences;
+    const transitionName = transition.name;
+    if (!transitionName || !transition.enable) {
+      return;
+    }
+
+    // 标签页未启用或者未开启缓存，则使用全局配置动画
+    if (!tabbar.enable || !keepAlive) {
+      return transitionName;
+    }
+
+    // 如果页面已经加载过，则不使用动画
+    // if (route.meta.loaded) {
+    //   return;
+    // }
+    // 已经打开且已经加载过的页面不使用动画
+    // const inTabs = getCachedTabs.value.includes(route.name as string);
+
+    // return inTabs && route.meta.loaded ? undefined : transitionName;
+    return transitionName;
+  }
+
+  return {
+    getEnabledTransition,
+    getTransitionName,
+  };
+}
diff --git a/packages/effects/layouts/src/iframe/iframe-router-view.vue b/packages/effects/layouts/src/iframe/iframe-router-view.vue
index 0e45ed96..3f1f9524 100644
--- a/packages/effects/layouts/src/iframe/iframe-router-view.vue
+++ b/packages/effects/layouts/src/iframe/iframe-router-view.vue
@@ -6,6 +6,7 @@ import { useRoute } from 'vue-router';
 
 import { preferences } from '@vben/preferences';
 import { useTabbarStore } from '@vben/stores';
+
 import { VbenSpinner } from '@vben-core/shadcn-ui';
 
 defineOptions({ name: 'IFrameRouterView' });
diff --git a/packages/effects/layouts/src/route-cached/index.ts b/packages/effects/layouts/src/route-cached/index.ts
new file mode 100644
index 00000000..daae4a07
--- /dev/null
+++ b/packages/effects/layouts/src/route-cached/index.ts
@@ -0,0 +1,2 @@
+export { default as RouteCachedPage } from './route-cached-page.vue';
+export { default as RouteCachedView } from './route-cached-view.vue';
diff --git a/packages/effects/layouts/src/route-cached/route-cached-page.vue b/packages/effects/layouts/src/route-cached/route-cached-page.vue
new file mode 100644
index 00000000..63708ce8
--- /dev/null
+++ b/packages/effects/layouts/src/route-cached/route-cached-page.vue
@@ -0,0 +1,36 @@
+<!-- 本组件用于获取缓存的route并保存到pinia -->
+<script setup lang="ts">
+import type { VNode } from 'vue';
+import type { RouteLocationNormalizedLoadedGeneric } from 'vue-router';
+
+import { watch } from 'vue';
+
+import { useTabbarStore } from '@vben/stores';
+
+interface Props {
+  component?: VNode;
+  route: RouteLocationNormalizedLoadedGeneric;
+}
+
+/**
+ * 这是页面缓存组件，不做任何的的实际渲染
+ */
+defineOptions({
+  render() {
+    return null;
+  },
+});
+const props = defineProps<Props>();
+
+const { addCachedRoute } = useTabbarStore();
+
+watch(
+  () => props.route,
+  () => {
+    if (props.component && props.route.meta.domCached) {
+      addCachedRoute(props.component, props.route);
+    }
+  },
+  { immediate: true },
+);
+</script>
diff --git a/packages/effects/layouts/src/route-cached/route-cached-view.vue b/packages/effects/layouts/src/route-cached/route-cached-view.vue
new file mode 100644
index 00000000..96616aa1
--- /dev/null
+++ b/packages/effects/layouts/src/route-cached/route-cached-view.vue
@@ -0,0 +1,98 @@
+<script setup lang="ts">
+import { computed, unref, watch } from 'vue';
+import { useRoute } from 'vue-router';
+
+import { preferences } from '@vben/preferences';
+import { getTabKey, storeToRefs, useTabbarStore } from '@vben/stores';
+
+import { transformComponent, useLayoutHook } from '../hooks';
+
+const route = useRoute();
+
+const tabbarStore = useTabbarStore();
+
+const { getTabs, getCachedRoutes, getExcludeCachedTabs } =
+  storeToRefs(tabbarStore);
+const { removeCachedRoute } = tabbarStore;
+
+const { getEnabledTransition, getTransitionName } = useLayoutHook();
+
+/**
+ * 是否启用tab
+ */
+const enableTabbar = computed(() => preferences.tabbar.enable);
+
+const computedCachedRouteKeys = computed(() => {
+  if (!unref(enableTabbar)) {
+    return [];
+  }
+  return unref(getTabs)
+    .filter((item) => item.meta.domCached)
+    .map((item) => getTabKey(item));
+});
+
+/**
+ * 监听缓存路由变化，删除不存在的缓存路由
+ */
+watch(computedCachedRouteKeys, (keys) => {
+  unref(getCachedRoutes).forEach((item) => {
+    if (!keys.includes(item.key)) {
+      removeCachedRoute(item.key);
+    }
+  });
+});
+
+/**
+ * 所有缓存的route
+ */
+const computedCachedRoutes = computed(() => {
+  if (!unref(enableTabbar)) {
+    return [];
+  }
+  // 刷新路由可刷新缓存
+  const excludeCachedTabKeys = unref(getExcludeCachedTabs);
+  return [...unref(getCachedRoutes).values()].filter((item) => {
+    const componentType: any = item.component.type || {};
+    let componentName = componentType.name;
+    if (!componentName) {
+      componentName = item.route.name;
+    }
+    return !excludeCachedTabKeys.includes(componentName);
+  });
+});
+
+/**
+ * 是否显示
+ */
+const computedShowView = computed(() => unref(computedCachedRoutes).length > 0);
+
+const computedCurrentRouteKey = computed(() => {
+  return getTabKey(route);
+});
+</script>
+
+<template>
+  <template v-if="computedShowView">
+    <template v-for="item in computedCachedRoutes" :key="item.key">
+      <Transition
+        v-if="getEnabledTransition"
+        appear
+        mode="out-in"
+        :name="getTransitionName(item.route)"
+      >
+        <component
+          v-show="item.key === computedCurrentRouteKey"
+          :is="transformComponent(item.component, item.route)"
+        />
+      </Transition>
+      <template v-else>
+        <component
+          v-show="item.key === computedCurrentRouteKey"
+          :is="transformComponent(item.component, item.route)"
+        />
+      </template>
+    </template>
+  </template>
+</template>
+
+<style scoped></style>
diff --git a/packages/effects/layouts/src/widgets/breadcrumb.vue b/packages/effects/layouts/src/widgets/breadcrumb.vue
index 744aed26..c0419606 100644
--- a/packages/effects/layouts/src/widgets/breadcrumb.vue
+++ b/packages/effects/layouts/src/widgets/breadcrumb.vue
@@ -1,11 +1,13 @@
 <script lang="ts" setup>
 import type { BreadcrumbStyleType } from '@vben/types';
+
 import type { IBreadcrumb } from '@vben-core/shadcn-ui';
 
 import { computed } from 'vue';
 import { useRoute, useRouter } from 'vue-router';
 
 import { $t } from '@vben/locales';
+
 import { VbenBreadcrumbView } from '@vben-core/shadcn-ui';
 
 interface Props {
diff --git a/packages/effects/layouts/src/widgets/check-updates/check-updates.vue b/packages/effects/layouts/src/widgets/check-updates/check-updates.vue
index a0c9adea..4f3082f3 100644
--- a/packages/effects/layouts/src/widgets/check-updates/check-updates.vue
+++ b/packages/effects/layouts/src/widgets/check-updates/check-updates.vue
@@ -2,10 +2,11 @@
 import { onMounted, onUnmounted, ref } from 'vue';
 
 import { $t } from '@vben/locales';
+
 import { useVbenModal } from '@vben-core/popup-ui';
 
 interface Props {
-  // 轮训时间，分钟
+  // 轮询时间，分钟
   checkUpdatesInterval?: number;
   // 检查更新的地址
   checkUpdateUrl?: string;
@@ -45,6 +46,7 @@ async function getVersionTag() {
     const response = await fetch(props.checkUpdateUrl, {
       cache: 'no-cache',
       method: 'HEAD',
+      redirect: 'manual',
     });
 
     return (
diff --git a/packages/effects/layouts/src/widgets/color-toggle.vue b/packages/effects/layouts/src/widgets/color-toggle.vue
index 67cad31f..82e04ff5 100644
--- a/packages/effects/layouts/src/widgets/color-toggle.vue
+++ b/packages/effects/layouts/src/widgets/color-toggle.vue
@@ -7,6 +7,7 @@ import {
   preferences,
   updatePreferences,
 } from '@vben/preferences';
+
 import { VbenIconButton } from '@vben-core/shadcn-ui';
 
 defineOptions({
@@ -30,16 +31,16 @@ function handleUpdate(colorPrimary: string, type: BuiltinThemeType) {
     >
       <template v-for="preset in COLOR_PRESETS" :key="preset.color">
         <VbenIconButton
-          class="flex-center flex-shrink-0"
+          class="flex-center shrink-0"
           @click="handleUpdate(preset.color, preset.type)"
         >
           <div
             :style="{ backgroundColor: preset.color }"
-            class="flex-center relative size-5 rounded-full hover:scale-110"
+            class="relative flex-center size-5 rounded-full hover:scale-110"
           >
             <svg
               v-if="preferences.theme.builtinType === preset.type"
-              class="h-3.5 w-3.5 text-white"
+              class="size-3.5 text-white"
               height="1em"
               viewBox="0 0 15 15"
               width="1em"
@@ -57,7 +58,7 @@ function handleUpdate(colorPrimary: string, type: BuiltinThemeType) {
     </div>
 
     <VbenIconButton>
-      <Palette class="text-primary size-4" />
+      <Palette class="size-4 text-primary" />
     </VbenIconButton>
   </div>
 </template>
diff --git a/packages/effects/layouts/src/widgets/global-search/global-search.vue b/packages/effects/layouts/src/widgets/global-search/global-search.vue
index 197251b8..2b2c24ea 100644
--- a/packages/effects/layouts/src/widgets/global-search/global-search.vue
+++ b/packages/effects/layouts/src/widgets/global-search/global-search.vue
@@ -12,6 +12,7 @@ import {
 } from '@vben/icons';
 import { $t } from '@vben/locales';
 import { isWindowsOs } from '@vben/utils';
+
 import { useVbenModal } from '@vben-core/popup-ui';
 
 import { useMagicKeys, whenever } from '@vueuse/core';
@@ -23,10 +24,16 @@ defineOptions({
 });
 
 const props = withDefaults(
-  defineProps<{ enableShortcutKey?: boolean; menus: MenuRecordRaw[] }>(),
+  defineProps<{
+    enableShortcutKey?: boolean;
+    menus?: MenuRecordRaw[];
+    /** 是否显示触发按钮（嵌在 dropdown 等容器里时可关掉） */
+    showButton?: boolean;
+  }>(),
   {
     enableShortcutKey: true,
     menus: () => [],
+    showButton: true,
   },
 );
 
@@ -52,11 +59,13 @@ function handleClose() {
 
 const keys = useMagicKeys();
 const cmd = isWindowsOs() ? keys['ctrl+k'] : keys['cmd+k'];
-whenever(cmd!, () => {
-  if (props.enableShortcutKey) {
-    modalApi.open();
-  }
-});
+if (cmd) {
+  whenever(cmd, () => {
+    if (props.enableShortcutKey) {
+      modalApi.open();
+    }
+  });
+}
 
 whenever(open, () => {
   nextTick(() => {
@@ -91,23 +100,30 @@ onMounted(() => {
     window.removeEventListener('keydown', preventDefaultBrowserSearchHotKey);
   });
 });
+
+// 暴露给父组件，允许从外部触发搜索弹框（如 user-dropdown 里点击菜单项触发）
+defineExpose({
+  open: () => modalApi.open(),
+  close: () => modalApi.close(),
+  toggle: toggleOpen,
+});
 </script>
 
 <template>
   <div>
     <Modal
       :fullscreen-button="false"
-      class="w-[600px]"
+      class="w-150"
       header-class="py-2 border-b"
     >
       <template #title>
         <div class="flex items-center">
-          <Search class="text-muted-foreground mr-2 size-4" />
+          <Search class="mr-2 size-4 text-muted-foreground" />
           <input
             ref="searchInputRef"
             v-model="keyword"
             :placeholder="$t('ui.widgets.search.searchNavigate')"
-            class="ring-none placeholder:text-muted-foreground w-[80%] rounded-md border border-none bg-transparent p-2 pl-0 text-sm font-normal outline-none ring-0 ring-offset-transparent focus-visible:ring-transparent"
+            class="ring-none w-[80%] rounded-md border border-none bg-transparent p-2 pl-0 text-sm font-normal ring-0 ring-offset-transparent outline-hidden placeholder:text-muted-foreground focus-visible:ring-transparent"
           />
         </div>
       </template>
@@ -132,20 +148,21 @@ onMounted(() => {
       </template>
     </Modal>
     <div
-      class="md:bg-accent group flex h-8 cursor-pointer items-center gap-3 rounded-2xl border-none bg-none px-2 py-0.5 outline-none"
+      v-if="showButton"
+      class="group flex h-8 cursor-pointer items-center gap-3 rounded-2xl border-none bg-none px-2 py-0.5 outline-hidden md:bg-accent"
       @click="toggleOpen()"
     >
       <Search
-        class="text-muted-foreground group-hover:text-foreground size-4 group-hover:opacity-100"
+        class="size-4 text-muted-foreground group-hover:text-foreground group-hover:opacity-100"
       />
       <span
-        class="text-muted-foreground group-hover:text-foreground hidden text-xs duration-300 md:block"
+        class="hidden text-xs text-muted-foreground duration-300 group-hover:text-foreground md:block"
       >
         {{ $t('ui.widgets.search.title') }}
       </span>
       <span
         v-if="enableShortcutKey"
-        class="bg-background border-foreground/60 text-muted-foreground group-hover:text-foreground relative hidden rounded-sm rounded-r-xl px-1.5 py-1 text-xs leading-none group-hover:opacity-100 md:block"
+        class="relative hidden rounded-sm rounded-r-xl border-foreground/60 bg-background px-1.5 py-1 text-xs leading-none text-muted-foreground group-hover:text-foreground group-hover:opacity-100 md:block"
       >
         {{ isWindowsOs() ? 'Ctrl' : '⌘' }}
         <kbd>K</kbd>
diff --git a/packages/effects/layouts/src/widgets/global-search/search-panel.vue b/packages/effects/layouts/src/widgets/global-search/search-panel.vue
index acbc2f19..c51f1de8 100644
--- a/packages/effects/layouts/src/widgets/global-search/search-panel.vue
+++ b/packages/effects/layouts/src/widgets/global-search/search-panel.vue
@@ -7,17 +7,23 @@ import { useRouter } from 'vue-router';
 import { SearchX, X } from '@vben/icons';
 import { $t } from '@vben/locales';
 import { mapTree, traverseTreeValues, uniqueByField } from '@vben/utils';
+
 import { VbenIcon, VbenScrollbar } from '@vben-core/shadcn-ui';
 import { isHttpUrl } from '@vben-core/shared/utils';
 
-import { onKeyStroke, useLocalStorage, useThrottleFn } from '@vueuse/core';
+import {
+  onKeyStroke,
+  useEventListener,
+  useLocalStorage,
+  useThrottleFn,
+} from '@vueuse/core';
 
 defineOptions({
   name: 'SearchPanel',
 });
 
 const props = withDefaults(
-  defineProps<{ keyword: string; menus: MenuRecordRaw[] }>(),
+  defineProps<{ keyword?: string; menus?: MenuRecordRaw[] }>(),
   {
     keyword: '',
     menus: () => [],
@@ -33,6 +39,7 @@ const searchHistory = useLocalStorage<MenuRecordRaw[]>(
 const activeIndex = ref(-1);
 const searchItems = shallowRef<MenuRecordRaw[]>([]);
 const searchResults = ref<MenuRecordRaw[]>([]);
+const isNavigating = ref(false);
 
 const handleSearch = useThrottleFn(search, 200);
 
@@ -46,6 +53,8 @@ function search(searchKey: string) {
     searchResults.value = [];
     return;
   }
+  // 将搜索关键词转换为小写，确保大小写不敏感的搜索
+  searchKey = searchKey.toLowerCase();
 
   // 使用搜索关键词创建正则表达式
   const reg = createSearchReg(searchKey);
@@ -97,7 +106,7 @@ async function handleEnter() {
   }
   const to = result[index];
   if (to) {
-    searchHistory.value.push(to);
+    searchHistory.value = uniqueByField([...searchHistory.value, to], 'path');
     handleClose();
     await nextTick();
     if (isHttpUrl(to.path)) {
@@ -113,6 +122,7 @@ function handleUp() {
   if (searchResults.value.length === 0) {
     return;
   }
+  isNavigating.value = true;
   activeIndex.value--;
   if (activeIndex.value < 0) {
     activeIndex.value = searchResults.value.length - 1;
@@ -125,6 +135,7 @@ function handleDown() {
   if (searchResults.value.length === 0) {
     return;
   }
+  isNavigating.value = true;
   activeIndex.value++;
   if (activeIndex.value > searchResults.value.length - 1) {
     activeIndex.value = 0;
@@ -140,6 +151,7 @@ function handleClose() {
 
 // Activate when the mouse moves to a certain line
 function handleMouseenter(e: MouseEvent) {
+  if (isNavigating.value) return;
   const index = (e.target as HTMLElement)?.dataset.index;
   activeIndex.value = Number(index);
 }
@@ -195,7 +207,7 @@ watch(
     if (val) {
       handleSearch(val);
     } else {
-      searchResults.value = [...searchHistory.value];
+      searchResults.value = searchHistory.value;
     }
   },
 );
@@ -218,20 +230,24 @@ onMounted(() => {
   // esc close
   onKeyStroke('Escape', handleClose);
 });
+
+useEventListener('mousemove', () => {
+  isNavigating.value = false;
+});
 </script>
 
 <template>
   <VbenScrollbar>
-    <div class="!flex h-full justify-center px-2 sm:max-h-[450px]">
+    <div class="flex! h-full justify-center px-2 sm:max-h-112.5">
       <!-- 无搜索结果 -->
       <div
         v-if="keyword && searchResults.length === 0"
-        class="text-muted-foreground text-center"
+        class="text-center text-muted-foreground"
       >
         <SearchX class="mx-auto mt-4 size-12" />
-        <p class="mb-10 mt-6 text-xs">
+        <p class="mt-6 mb-10 text-xs">
           {{ $t('ui.widgets.search.noResults') }}
-          <span class="text-foreground text-sm font-medium">
+          <span class="text-sm font-medium text-foreground">
             "{{ keyword }}"
           </span>
         </p>
@@ -239,7 +255,7 @@ onMounted(() => {
       <!-- 历史搜索记录 & 没有搜索结果 -->
       <div
         v-if="!keyword && searchResults.length === 0"
-        class="text-muted-foreground text-center"
+        class="text-center text-muted-foreground"
       >
         <p class="my-10 text-xs">
           {{ $t('ui.widgets.search.noRecent') }}
@@ -249,7 +265,7 @@ onMounted(() => {
       <ul v-show="searchResults.length > 0" class="w-full">
         <li
           v-if="searchHistory.length > 0 && !keyword"
-          class="text-muted-foreground mb-2 text-xs"
+          class="mb-2 text-xs text-muted-foreground"
         >
           {{ $t('ui.widgets.search.recent') }}
         </li>
@@ -263,19 +279,15 @@ onMounted(() => {
           "
           :data-index="index"
           :data-search-item="index"
-          class="bg-accent flex-center group mb-3 w-full cursor-pointer rounded-lg px-4 py-4"
+          class="group mb-3 flex-center w-full cursor-pointer rounded-lg bg-accent p-4"
           @click="handleEnter"
           @mouseenter="handleMouseenter"
         >
-          <VbenIcon
-            :icon="item.icon"
-            class="mr-2 size-5 flex-shrink-0"
-            fallback
-          />
+          <VbenIcon :icon="item.icon" class="mr-2 size-5 shrink-0" fallback />
 
           <span class="flex-1">{{ item.name }}</span>
           <div
-            class="flex-center dark:hover:bg-accent hover:text-primary-foreground rounded-full p-1 hover:scale-110"
+            class="flex-center rounded-full p-1 hover:scale-110 hover:text-primary-foreground dark:hover:bg-accent"
             @click.stop="removeItem(index)"
           >
             <X class="size-4" />
diff --git a/packages/effects/layouts/src/widgets/index.ts b/packages/effects/layouts/src/widgets/index.ts
index f6a4a7ba..0f9e11a9 100644
--- a/packages/effects/layouts/src/widgets/index.ts
+++ b/packages/effects/layouts/src/widgets/index.ts
@@ -8,4 +8,5 @@ export * from './lock-screen';
 export * from './notification';
 export * from './preferences';
 export * from './theme-toggle';
+export * from './timezone';
 export * from './user-dropdown';
diff --git a/packages/effects/layouts/src/widgets/language-toggle.vue b/packages/effects/layouts/src/widgets/language-toggle.vue
index c8b612bb..0c5f6d58 100644
--- a/packages/effects/layouts/src/widgets/language-toggle.vue
+++ b/packages/effects/layouts/src/widgets/language-toggle.vue
@@ -5,13 +5,15 @@ import { SUPPORT_LANGUAGES } from '@vben/constants';
 import { Languages } from '@vben/icons';
 import { loadLocaleMessages } from '@vben/locales';
 import { preferences, updatePreferences } from '@vben/preferences';
+
 import { VbenDropdownRadioMenu, VbenIconButton } from '@vben-core/shadcn-ui';
 
 defineOptions({
   name: 'LanguageToggle',
 });
 
-async function handleUpdate(value: string) {
+async function handleUpdate(value: string | undefined) {
+  if (!value) return;
   const locale = value as SupportedLanguagesType;
   updatePreferences({
     app: {
@@ -29,8 +31,8 @@ async function handleUpdate(value: string) {
       :model-value="preferences.app.locale"
       @update:model-value="handleUpdate"
     >
-      <VbenIconButton>
-        <Languages class="text-foreground size-4" />
+      <VbenIconButton class="hover:animate-[shrink_0.3s_ease-in-out]">
+        <Languages class="size-4 text-foreground" />
       </VbenIconButton>
     </VbenDropdownRadioMenu>
   </div>
diff --git a/packages/effects/layouts/src/widgets/layout-toggle.vue b/packages/effects/layouts/src/widgets/layout-toggle.vue
index 21823c3d..ae4eecb3 100644
--- a/packages/effects/layouts/src/widgets/layout-toggle.vue
+++ b/packages/effects/layouts/src/widgets/layout-toggle.vue
@@ -1,5 +1,6 @@
 <script setup lang="ts">
 import type { AuthPageLayoutType } from '@vben/types';
+
 import type { VbenDropdownMenuItem } from '@vben-core/shadcn-ui';
 
 import { computed } from 'vue';
@@ -11,6 +12,7 @@ import {
   updatePreferences,
   usePreferences,
 } from '@vben/preferences';
+
 import { VbenDropdownRadioMenu, VbenIconButton } from '@vben-core/shadcn-ui';
 
 defineOptions({
@@ -37,7 +39,8 @@ const menus = computed((): VbenDropdownMenuItem[] => [
 
 const { authPanelCenter, authPanelLeft, authPanelRight } = usePreferences();
 
-function handleUpdate(value: string) {
+function handleUpdate(value: string | undefined) {
+  if (!value) return;
   updatePreferences({
     app: {
       authPageLayout: value as AuthPageLayoutType,
diff --git a/packages/effects/layouts/src/widgets/lock-screen/index.ts b/packages/effects/layouts/src/widgets/lock-screen/index.ts
index 1609becb..8ba1f16b 100644
--- a/packages/effects/layouts/src/widgets/lock-screen/index.ts
+++ b/packages/effects/layouts/src/widgets/lock-screen/index.ts
@@ -1,2 +1,2 @@
-export { default as LockScreen } from './lock-screen.vue';
 export { default as LockScreenModal } from './lock-screen-modal.vue';
+export { default as LockScreen } from './lock-screen.vue';
diff --git a/packages/effects/layouts/src/widgets/lock-screen/lock-screen-modal.vue b/packages/effects/layouts/src/widgets/lock-screen/lock-screen-modal.vue
index a346d82a..9170bdd8 100644
--- a/packages/effects/layouts/src/widgets/lock-screen/lock-screen-modal.vue
+++ b/packages/effects/layouts/src/widgets/lock-screen/lock-screen-modal.vue
@@ -4,6 +4,7 @@ import type { Recordable } from '@vben/types';
 import { computed, reactive } from 'vue';
 
 import { $t } from '@vben/locales';
+
 import { useVbenForm, z } from '@vben-core/form-ui';
 import { useVbenModal } from '@vben-core/popup-ui';
 import { VbenAvatar, VbenButton } from '@vben-core/shadcn-ui';
@@ -26,29 +27,30 @@ const emit = defineEmits<{
   submit: [Recordable<any>];
 }>();
 
-const [Form, { resetForm, validate, getValues }] = useVbenForm(
-  reactive({
-    commonConfig: {
-      hideLabel: true,
-      hideRequiredMark: true,
-    },
-    schema: computed(() => [
-      {
-        component: 'VbenInputPassword' as const,
-        componentProps: {
-          placeholder: $t('ui.widgets.lockScreen.placeholder'),
-        },
-        fieldName: 'lockScreenPassword',
-        formFieldProps: { validateOnBlur: false },
-        label: $t('authentication.password'),
-        rules: z
-          .string()
-          .min(1, { message: $t('ui.widgets.lockScreen.placeholder') }),
+const [Form, { resetForm, validate, getValues, getFieldComponentRef }] =
+  useVbenForm(
+    reactive({
+      commonConfig: {
+        hideLabel: true,
+        hideRequiredMark: true,
       },
-    ]),
-    showDefaultActions: false,
-  }),
-);
+      schema: computed(() => [
+        {
+          component: 'VbenInputPassword' as const,
+          componentProps: {
+            placeholder: $t('ui.widgets.lockScreen.placeholder'),
+          },
+          fieldName: 'lockScreenPassword',
+          formFieldProps: { validateOn: ['change'] as const },
+          label: $t('authentication.password'),
+          rules: z
+            .string()
+            .min(1, { message: $t('ui.widgets.lockScreen.placeholder') }),
+        },
+      ]),
+      showDefaultActions: false,
+    }),
+  );
 
 const [Modal] = useVbenModal({
   onConfirm() {
@@ -59,6 +61,13 @@ const [Modal] = useVbenModal({
       resetForm();
     }
   },
+  onOpened() {
+    requestAnimationFrame(() => {
+      getFieldComponentRef('lockScreenPassword')
+        ?.$el?.querySelector('[name="lockScreenPassword"]')
+        ?.focus();
+    });
+  },
 });
 
 async function handleSubmit() {
@@ -87,7 +96,7 @@ async function handleSubmit() {
             class="size-20"
             dot-class="bottom-0 right-1 border-2 size-4 bg-green-500"
           />
-          <div class="text-foreground my-6 flex items-center font-medium">
+          <div class="my-6 flex items-center font-medium text-foreground">
             {{ text }}
           </div>
         </div>
diff --git a/packages/effects/layouts/src/widgets/lock-screen/lock-screen.vue b/packages/effects/layouts/src/widgets/lock-screen/lock-screen.vue
index cce417da..75e24015 100644
--- a/packages/effects/layouts/src/widgets/lock-screen/lock-screen.vue
+++ b/packages/effects/layouts/src/widgets/lock-screen/lock-screen.vue
@@ -3,7 +3,8 @@ import { computed, reactive, ref } from 'vue';
 
 import { LockKeyhole } from '@vben/icons';
 import { $t, useI18n } from '@vben/locales';
-import { storeToRefs, useLockStore } from '@vben/stores';
+import { storeToRefs, useAccessStore } from '@vben/stores';
+
 import { useScrollLock } from '@vben-core/composables';
 import { useVbenForm, z } from '@vben-core/form-ui';
 import { VbenAvatar, VbenButton } from '@vben-core/shadcn-ui';
@@ -25,7 +26,7 @@ withDefaults(defineProps<Props>(), {
 defineEmits<{ toLogin: [] }>();
 
 const { locale } = useI18n();
-const lockStore = useLockStore();
+const accessStore = useAccessStore();
 
 const now = useNow();
 const meridiem = useDateFormat(now, 'A');
@@ -34,57 +35,64 @@ const minute = useDateFormat(now, 'mm');
 const date = useDateFormat(now, 'YYYY-MM-DD dddd', { locales: locale.value });
 
 const showUnlockForm = ref(false);
-const { lockScreenPassword } = storeToRefs(lockStore);
+const { lockScreenPassword } = storeToRefs(accessStore);
 
-const [Form, { form, validate }] = useVbenForm(
-  reactive({
-    commonConfig: {
-      hideLabel: true,
-      hideRequiredMark: true,
-    },
-    schema: computed(() => [
-      {
-        component: 'VbenInputPassword' as const,
-        componentProps: {
-          placeholder: $t('ui.widgets.lockScreen.placeholder'),
-        },
-        fieldName: 'password',
-        label: $t('authentication.password'),
-        rules: z.string().min(1, { message: $t('authentication.passwordTip') }),
+const [Form, { getFieldComponentRef, getRawValues, setFieldError, validate }] =
+  useVbenForm(
+    reactive({
+      commonConfig: {
+        hideLabel: true,
+        hideRequiredMark: true,
       },
-    ]),
-    showDefaultActions: false,
-  }),
-);
-
-const validPass = computed(
-  () => lockScreenPassword?.value === form?.values?.password,
-);
+      schema: computed(() => [
+        {
+          component: 'VbenInputPassword' as const,
+          componentProps: {
+            placeholder: $t('ui.widgets.lockScreen.placeholder'),
+          },
+          fieldName: 'password',
+          label: $t('authentication.password'),
+          rules: z
+            .string()
+            .min(1, { message: $t('authentication.passwordTip') }),
+        },
+      ]),
+      showDefaultActions: false,
+    }),
+  );
 
 async function handleSubmit() {
   const { valid } = await validate();
   if (valid) {
-    if (validPass.value) {
-      lockStore.unlockScreen();
+    const { password } = await getRawValues();
+    if (lockScreenPassword?.value === password) {
+      accessStore.unlockScreen();
     } else {
-      form.setFieldError('password', $t('authentication.passwordErrorTip'));
+      await setFieldError('password', $t('authentication.passwordErrorTip'));
     }
   }
 }
 
 function toggleUnlockForm() {
   showUnlockForm.value = !showUnlockForm.value;
+  if (showUnlockForm.value) {
+    requestAnimationFrame(() => {
+      getFieldComponentRef('password')
+        ?.$el?.querySelector('[name="password"]')
+        ?.focus();
+    });
+  }
 }
 
 useScrollLock();
 </script>
 
 <template>
-  <div class="bg-background fixed z-[2000] size-full">
+  <div class="fixed z-2000 size-full bg-background">
     <transition name="slide-left">
       <div v-show="!showUnlockForm" class="size-full">
         <div
-          class="flex-col-center text-foreground/80 hover:text-foreground group my-4 cursor-pointer text-xl font-semibold"
+          class="group fixed top-6 left-1/2 z-2001 flex-col-center -translate-x-1/2 cursor-pointer text-xl font-semibold text-foreground/80 hover:text-foreground"
           @click="toggleUnlockForm"
         >
           <LockKeyhole
@@ -92,19 +100,23 @@ useScrollLock();
           />
           <span>{{ $t('ui.widgets.lockScreen.unlock') }}</span>
         </div>
-        <div class="flex h-full justify-center px-[10%]">
-          <div
-            class="bg-accent flex-center relative mb-14 mr-20 h-4/5 w-2/5 flex-auto rounded-3xl text-center text-[260px]"
-          >
-            <span class="absolute left-4 top-4 text-xl font-semibold">
-              {{ meridiem }}
-            </span>
-            {{ hour }}
-          </div>
-          <div
-            class="bg-accent flex-center mb-14 h-4/5 w-2/5 flex-auto rounded-3xl text-center text-[260px]"
-          >
-            {{ minute }}
+        <div class="flex-center size-full">
+          <div class="flex w-full justify-center gap-4 px-4 sm:gap-6 md:gap-8">
+            <div
+              class="relative flex-center h-35 w-35 rounded-xl bg-accent text-[36px] sm:h-40 sm:w-40 sm:text-[42px] md:h-50 md:w-50 md:text-[72px]"
+            >
+              <span
+                class="absolute top-3 left-3 text-xs font-semibold sm:text-sm md:text-xl"
+              >
+                {{ meridiem }}
+              </span>
+              {{ hour }}
+            </div>
+            <div
+              class="flex-center h-35 w-35 rounded-xl bg-accent text-[36px] sm:h-40 sm:w-40 sm:text-[42px] md:h-50 md:w-50 md:text-[72px]"
+            >
+              {{ minute }}
+            </div>
           </div>
         </div>
       </div>
@@ -116,9 +128,8 @@ useScrollLock();
         class="flex-center size-full"
         @keydown.enter.prevent="handleSubmit"
       >
-        <div class="flex-col-center mb-10 w-[300px]">
+        <div class="mb-10 flex-col-center w-[90%] max-w-75 px-4">
           <VbenAvatar :src="avatar" class="enter-x mb-6 size-20" />
-
           <div class="enter-x mb-2 w-full items-center">
             <Form />
           </div>
@@ -144,12 +155,13 @@ useScrollLock();
     </transition>
 
     <div
-      class="enter-y absolute bottom-5 w-full text-center xl:text-xl 2xl:text-3xl"
+      class="enter-y absolute bottom-5 w-full text-center text-xl md:text-2xl xl:text-xl 2xl:text-3xl"
     >
-      <div v-if="showUnlockForm" class="enter-x mb-2 text-3xl">
-        {{ hour }}:{{ minute }} <span class="text-lg">{{ meridiem }}</span>
+      <div v-if="showUnlockForm" class="enter-x mb-2 text-2xl md:text-3xl">
+        {{ hour }}:{{ minute }}
+        <span class="text-base md:text-lg">{{ meridiem }}</span>
       </div>
-      <div class="text-3xl">{{ date }}</div>
+      <div class="text-xl md:text-3xl">{{ date }}</div>
     </div>
   </div>
 </template>
diff --git a/packages/effects/layouts/src/widgets/notification/notification.vue b/packages/effects/layouts/src/widgets/notification/notification.vue
index 98c1c178..71ed83b2 100644
--- a/packages/effects/layouts/src/widgets/notification/notification.vue
+++ b/packages/effects/layouts/src/widgets/notification/notification.vue
@@ -1,8 +1,9 @@
 <script lang="ts" setup>
 import type { NotificationItem } from './types';
 
-import { Bell, MailCheck } from '@vben/icons';
+import { Bell, CircleCheckBig, CircleX, MailCheck } from '@vben/icons';
 import { $t } from '@vben/locales';
+
 import {
   VbenButton,
   VbenIconButton,
@@ -12,36 +13,38 @@ import {
 
 import { useToggle } from '@vueuse/core';
 
-interface Props {
-  /**
-   * 显示圆点
-   */
-  dot?: boolean;
-  /**
-   * 消息列表
-   */
-  notifications?: NotificationItem[];
-}
-
 defineOptions({ name: 'NotificationPopup' });
 
-withDefaults(defineProps<Props>(), {
-  dot: false,
-  notifications: () => [],
-});
+withDefaults(
+  defineProps<{
+    /** 显示圆点 */
+    dot?: boolean;
+    /** 未读数量角标（优先于圆点） */
+    count?: number;
+    /** 消息列表 */
+    notifications?: NotificationItem[];
+  }>(),
+  {
+    dot: false,
+    count: 0,
+    notifications: () => [],
+  },
+);
 
 const emit = defineEmits<{
   clear: [];
   makeAll: [];
+  onClick: [NotificationItem];
   read: [NotificationItem];
+  remove: [NotificationItem];
   viewAll: [];
 }>();
 
 const [open, toggle] = useToggle();
 
-function close() {
+const close = () => {
   open.value = false;
-}
+};
 
 function handleViewAll() {
   emit('viewAll');
@@ -56,21 +59,22 @@ function handleClear() {
   emit('clear');
 }
 
-function handleClick(item: NotificationItem) {
-  emit('read', item);
-}
+defineExpose({ toggle });
 </script>
 <template>
-  <VbenPopover
-    v-model:open="open"
-    content-class="relative right-2 w-[360px] p-0"
-  >
+  <VbenPopover v-model:open="open" content-class="relative right-2 w-90 p-0">
     <template #trigger>
-      <div class="flex-center mr-2 h-full" @click.stop="toggle()">
-        <VbenIconButton class="bell-button text-foreground relative">
+      <div class="mr-2 flex-center h-full" @click.stop="toggle()">
+        <VbenIconButton class="bell-button relative text-foreground">
           <span
-            v-if="dot"
-            class="bg-primary absolute right-0.5 top-0.5 h-2 w-2 rounded"
+            v-if="count > 0"
+            class="absolute -top-0.5 -right-0.5 flex h-4 min-w-4 items-center justify-center rounded-full bg-primary px-1 text-[10px] leading-none text-primary-foreground"
+          >
+            {{ count > 99 ? '99+' : count }}
+          </span>
+          <span
+            v-else-if="dot"
+            class="absolute top-0.5 right-0.5 size-2 rounded-sm bg-primary"
           ></span>
           <Bell class="size-4" />
         </VbenIconButton>
@@ -89,56 +93,85 @@ function handleClick(item: NotificationItem) {
         </VbenIconButton>
       </div>
       <VbenScrollbar v-if="notifications.length > 0">
-        <ul class="!flex max-h-[360px] w-full flex-col">
-          <template v-for="item in notifications" :key="item.title">
+        <ul class="flex! max-h-90 w-full flex-col">
+          <template v-for="item in notifications" :key="item.id ?? item.title">
             <li
-              class="hover:bg-accent border-border relative flex w-full cursor-pointer items-start gap-5 border-t px-3 py-3"
-              @click="handleClick(item)"
+              class="relative flex w-full cursor-pointer items-start gap-5 border-t border-border p-3 hover:bg-accent"
+              @click="emit('onClick', item)"
             >
-              <span
-                v-if="!item.isRead"
-                class="bg-primary absolute right-2 top-2 h-2 w-2 rounded"
-              ></span>
+              <slot name="content" :item="item">
+                <span
+                  v-if="!item.isRead"
+                  class="absolute top-2 right-2 size-2 rounded-sm bg-primary"
+                ></span>
 
-              <span
-                class="relative flex h-10 w-10 shrink-0 overflow-hidden rounded-full"
-              >
-
-                <component
-                  :is="item.icon"
-                  v-if="item.icon"
-                  :class="item.status === 1 ? 'text-gray-400 group-hover:text-gray-600': item.color"
-                  class="aspect-square h-full w-full object-cover"
-                  role="img"
-                />
-<!--                <img-->
-<!--                  :src="item.avatar"-->
-<!--                  class="aspect-square h-full w-full object-cover"-->
-<!--                  role="img"-->
-<!--                />-->
-              </span>
-              <div class="flex flex-col gap-1 leading-none">
-                <p class="font-semibold">{{ item.title }}</p>
-                <p class="text-muted-foreground my-1 line-clamp-2 text-xs">
-                  {{ item.message }}
-                </p>
-                <p class="text-muted-foreground line-clamp-2 text-xs">
-                  {{ item.date }}
-                </p>
-              </div>
+                <span
+                  class="relative flex size-10 shrink-0 items-center justify-center overflow-hidden rounded-full bg-muted"
+                >
+                  <component
+                    :is="item.icon"
+                    v-if="item.icon"
+                    :class="
+                      item.status === 1
+                        ? 'text-gray-400 group-hover:text-gray-600'
+                        : item.color
+                    "
+                    class="size-5"
+                    role="img"
+                  />
+                  <Bell v-else class="size-5 text-muted-foreground" />
+                </span>
+                <div class="flex flex-col gap-1 leading-none">
+                  <p class="font-semibold">{{ item.title }}</p>
+                  <p class="my-1 line-clamp-2 text-xs text-muted-foreground">
+                    {{ item.message }}
+                  </p>
+                  <p class="line-clamp-2 text-xs text-muted-foreground">
+                    {{ item.date }}
+                  </p>
+                </div>
+                <div
+                  class="absolute top-1/2 right-3 flex -translate-y-1/2 flex-row gap-1"
+                >
+                  <slot name="action" :item="item">
+                    <slot name="action-prepend" :item="item"></slot>
+                    <VbenIconButton
+                      v-if="!item.isRead"
+                      size="xs"
+                      variant="ghost"
+                      class="h-6 px-2"
+                      :tooltip="$t('common.confirm')"
+                      @click.stop="emit('read', item)"
+                    >
+                      <CircleCheckBig class="size-4" />
+                    </VbenIconButton>
+                    <VbenIconButton
+                      v-if="item.isRead"
+                      size="xs"
+                      variant="ghost"
+                      class="h-6 px-2 text-destructive"
+                      :tooltip="$t('common.delete')"
+                      @click.stop="emit('remove', item)"
+                    >
+                      <CircleX class="size-4" />
+                    </VbenIconButton>
+                    <slot name="action-append" :item="item"></slot>
+                  </slot>
+                </div>
+              </slot>
             </li>
           </template>
         </ul>
       </VbenScrollbar>
 
       <template v-else>
-        <div class="flex-center text-muted-foreground min-h-[150px] w-full">
+        <div class="flex-center min-h-37.5 w-full text-muted-foreground">
           {{ $t('common.noData') }}
         </div>
       </template>
 
       <div
-        class="border-border flex items-center justify-between border-t px-4 py-3"
+        class="flex items-center justify-between border-t border-border px-4 py-3"
       >
         <VbenButton
           :disabled="notifications.length <= 0"
diff --git a/packages/effects/layouts/src/widgets/notification/types.ts b/packages/effects/layouts/src/widgets/notification/types.ts
index f937d175..2e537717 100644
--- a/packages/effects/layouts/src/widgets/notification/types.ts
+++ b/packages/effects/layouts/src/widgets/notification/types.ts
@@ -7,6 +7,15 @@ interface NotificationItem {
   isRead?: boolean;
   message: string;
   title: string;
+  /**
+   * 跳转链接，可以是路由路径或完整 URL
+   * @example '/dashboard' 或 'https://example.com'
+   */
+  link?: string;
+  query?: Record<string, any>;
+  state?: Record<string, any>;
+  /** 业务字段 */
+  [key: string]: any;
 }
 
 export type { NotificationItem };
diff --git a/packages/effects/layouts/src/widgets/preferences/blocks/block.vue b/packages/effects/layouts/src/widgets/preferences/blocks/block.vue
index c8cc9e6a..e1941b7a 100644
--- a/packages/effects/layouts/src/widgets/preferences/blocks/block.vue
+++ b/packages/effects/layouts/src/widgets/preferences/blocks/block.vue
@@ -14,7 +14,7 @@ withDefaults(defineProps<Props>(), {
 
 <template>
   <div class="flex flex-col py-4">
-    <h3 class="mb-3 font-semibold leading-none tracking-tight">
+    <h3 class="mb-3 leading-none font-semibold tracking-tight">
       {{ title }}
     </h3>
     <slot></slot>
diff --git a/packages/effects/layouts/src/widgets/preferences/blocks/checkbox-item.vue b/packages/effects/layouts/src/widgets/preferences/blocks/checkbox-item.vue
new file mode 100644
index 00000000..57e662a6
--- /dev/null
+++ b/packages/effects/layouts/src/widgets/preferences/blocks/checkbox-item.vue
@@ -0,0 +1,63 @@
+<script setup lang="ts">
+import type { SelectOption } from '@vben/types';
+
+import { useSlots } from 'vue';
+
+import { CircleHelp } from '@vben/icons';
+
+import { VbenCheckButtonGroup, VbenTooltip } from '@vben-core/shadcn-ui';
+
+defineOptions({
+  name: 'PreferenceCheckboxItem',
+});
+
+withDefaults(
+  defineProps<{
+    disabled?: boolean;
+    items?: SelectOption[];
+    multiple?: boolean;
+    onBtnClick?: (value: string) => void;
+    placeholder?: string;
+  }>(),
+  {
+    disabled: false,
+    placeholder: '',
+    items: () => [],
+    onBtnClick: () => {},
+    multiple: false,
+  },
+);
+
+const inputValue = defineModel<string[]>();
+
+const slots = useSlots();
+</script>
+
+<template>
+  <div
+    :class="{
+      'hover:bg-accent': !slots.tip,
+      'pointer-events-none opacity-50': disabled,
+    }"
+    class="my-1 flex w-full items-center justify-between rounded-md px-2 py-1"
+  >
+    <span class="flex items-center text-sm">
+      <slot></slot>
+
+      <VbenTooltip v-if="slots.tip" side="bottom">
+        <template #trigger>
+          <CircleHelp class="ml-1 size-3 cursor-help" />
+        </template>
+        <slot name="tip"></slot>
+      </VbenTooltip>
+    </span>
+    <VbenCheckButtonGroup
+      v-model="inputValue"
+      class="h-8 w-41.25"
+      :options="items"
+      :disabled="disabled"
+      :multiple="multiple"
+      @btn-click="onBtnClick"
+    />
+  </div>
+</template>
diff --git a/packages/effects/layouts/src/widgets/preferences/blocks/custom/custom.vue b/packages/effects/layouts/src/widgets/preferences/blocks/custom/custom.vue
new file mode 100644
index 00000000..2cfb8f0b
--- /dev/null
+++ b/packages/effects/layouts/src/widgets/preferences/blocks/custom/custom.vue
@@ -0,0 +1,121 @@
+<script setup lang="ts">
+import type {
+  CustomPreferencesField,
+  CustomPreferencesRecord,
+} from '@vben/preferences';
+
+import { computed } from 'vue';
+
+import { $t } from '@vben/locales';
+
+import InputItem from '../input-item.vue';
+import NumberFieldItem from '../number-field-item.vue';
+import SelectItem from '../select-item.vue';
+import SwitchItem from '../switch-item.vue';
+
+defineOptions({
+  name: 'PreferenceCustomFields',
+});
+
+const props = defineProps<{
+  fields: Array<CustomPreferencesField>;
+  values: CustomPreferencesRecord;
+}>();
+
+const emit = defineEmits<{
+  update: [updates: CustomPreferencesRecord];
+}>();
+
+function handleUpdate(key: string, value: boolean | number | string) {
+  emit('update', { [key]: value });
+}
+
+function handleBooleanUpdate(key: string, value: boolean | undefined) {
+  handleUpdate(key, value ?? false);
+}
+
+function resolveNumberValue(value: unknown) {
+  return typeof value === 'number' && Number.isFinite(value)
+    ? value
+    : undefined;
+}
+
+function handleNumberUpdate(key: string, value: number | undefined) {
+  const resolvedValue = resolveNumberValue(value);
+
+  if (resolvedValue !== undefined) {
+    handleUpdate(key, resolvedValue);
+  }
+}
+
+function handleStringUpdate(key: string, value: string | undefined) {
+  handleUpdate(key, value ?? '');
+}
+
+const resolvedFields = computed(() => {
+  return props.fields.map((field) => {
+    return {
+      ...field,
+      label: $t(field.label),
+      options:
+        field.component === 'select'
+          ? field.options.map((option) => ({
+              ...option,
+              label: $t(option.label),
+            }))
+          : undefined,
+      placeholder: field.placeholder ? $t(field.placeholder) : '',
+      tip: field.tip ? $t(field.tip) : '',
+    };
+  });
+});
+</script>
+
+<template>
+  <template v-for="field in resolvedFields" :key="field.key">
+    <SwitchItem
+      v-if="field.component === 'switch'"
+      :disabled="field.disabled"
+      :model-value="Boolean(values[field.key])"
+      :tip="field.tip"
+      v-bind="field.componentProps"
+      @update:model-value="handleBooleanUpdate(field.key, $event)"
+    >
+      {{ field.label }}
+    </SwitchItem>
+    <NumberFieldItem
+      v-else-if="field.component === 'number'"
+      :disabled="field.disabled"
+      :model-value="resolveNumberValue(values[field.key])"
+      :placeholder="field.placeholder"
+      :tip="field.tip"
+      v-bind="field.componentProps"
+      @update:model-value="handleNumberUpdate(field.key, $event)"
+    >
+      {{ field.label }}
+    </NumberFieldItem>
+    <SelectItem
+      v-else-if="field.component === 'select'"
+      :disabled="field.disabled"
+      :items="field.options"
+      :model-value="String(values[field.key] ?? '')"
+      :placeholder="field.placeholder"
+      :tip="field.tip"
+      v-bind="field.componentProps"
+      @update:model-value="handleStringUpdate(field.key, $event)"
+    >
+      {{ field.label }}
+    </SelectItem>
+    <InputItem
+      v-else
+      :disabled="field.disabled"
+      :model-value="String(values[field.key] ?? '')"
+      :placeholder="field.placeholder"
+      :tip="field.tip"
+      v-bind="field.componentProps"
+      @update:model-value="handleStringUpdate(field.key, $event)"
+    >
+      {{ field.label }}
+    </InputItem>
+  </template>
+</template>
diff --git a/packages/effects/layouts/src/widgets/preferences/blocks/draggable-list.vue b/packages/effects/layouts/src/widgets/preferences/blocks/draggable-list.vue
new file mode 100644
index 00000000..bf17de66
--- /dev/null
+++ b/packages/effects/layouts/src/widgets/preferences/blocks/draggable-list.vue
@@ -0,0 +1,138 @@
+<script setup lang="ts">
+import type { SelectOption } from '@vben/types';
+
+import { computed, nextTick, onMounted, onUnmounted, ref } from 'vue';
+
+import { GripVertical } from '@vben/icons';
+import { $t } from '@vben/locales';
+
+import Sortable from 'sortablejs';
+
+import SelectItem from './select-item.vue';
+
+interface Item {
+  key: string;
+  label: string;
+  position: 'auto' | 'fixed' | 'header' | 'none' | 'user-dropdown';
+  /** 每项可选的 position 选项；不传则用 props.positionItems */
+  positionItems?: SelectOption[];
+}
+
+const props = defineProps<{
+  items: Item[];
+  positionItems: SelectOption[];
+}>();
+
+const emit = defineEmits<{
+  updateOrder: [keys: string[]];
+  updatePosition: [
+    key: string,
+    position: 'auto' | 'fixed' | 'header' | 'none' | 'user-dropdown',
+  ];
+}>();
+
+const listRef = ref<HTMLElement>();
+let sortableInstance: null | Sortable = null;
+
+// 划分规则：
+// - hidden：position === 'none'（不显示）
+// - sortable：其它（含 auto/fixed，偏好按钮的智能模式视觉归入顶栏组参与排序，
+//   避免 preferences 从 widget.order 丢失）
+const sortableList = computed(() =>
+  props.items.filter((item) => item.position !== 'none'),
+);
+
+const hiddenList = computed(() =>
+  props.items.filter((item) => item.position === 'none'),
+);
+function initSortable() {
+  const container = listRef.value;
+  if (!container) return;
+  sortableInstance?.destroy();
+  sortableInstance = Sortable.create(container, {
+    animation: 200,
+    handle: '.drag-handle',
+    onEnd() {
+      // Sortable 已经改了 DOM，但 sortableList computed 还是旧顺序。
+      // 直接从 DOM 读 children 的 data-key 拿新顺序，再追加 hidden 部分。
+      const newOrder = [...container.children]
+        .map((el) => (el as HTMLElement).dataset.key)
+        .filter(Boolean) as string[];
+      emit('updateOrder', [...newOrder, ...hiddenList.value.map((i) => i.key)]);
+    },
+  });
+}
+
+onMounted(initSortable);
+onUnmounted(() => {
+  sortableInstance?.destroy();
+  sortableInstance = null;
+});
+
+function setPosition(key: string, value: string | undefined) {
+  if (!value) return;
+  emit(
+    'updatePosition',
+    key,
+    value as 'auto' | 'fixed' | 'header' | 'none' | 'user-dropdown',
+  );
+  nextTick(() => {
+    emit(
+      'updateOrder',
+      [...sortableList.value, ...hiddenList.value].map((i) => i.key),
+    );
+  });
+}
+</script>
+
+<template>
+  <div class="space-y-1">
+    <div ref="listRef" class="space-y-1">
+      <div
+        v-for="item in sortableList"
+        :key="item.key"
+        :data-key="item.key"
+        class="bg-accent flex items-center rounded-md pl-2"
+      >
+        <GripVertical
+          class="drag-handle size-4 shrink-0 cursor-grab text-muted-foreground active:cursor-grabbing"
+        />
+        <SelectItem
+          :items="item.positionItems ?? positionItems"
+          :model-value="item.position"
+          class="min-w-0 flex-1"
+          @update:model-value="
+            (v: string | undefined) => setPosition(item.key, v)
+          "
+        >
+          <span class="truncate">{{ item.label }}</span>
+        </SelectItem>
+      </div>
+    </div>
+    <div v-if="hiddenList.length > 0" class="pt-2">
+      <div class="text-muted-foreground mb-1 text-xs font-medium">
+        {{ $t('preferences.widget.hidden') }}
+      </div>
+      <div
+        v-for="item in hiddenList"
+        :key="item.key"
+        class="flex items-center rounded-md"
+      >
+        <SelectItem
+          :items="item.positionItems ?? positionItems"
+          :model-value="item.position"
+          class="min-w-0 flex-1"
+          @update:model-value="
+            (v: string | undefined) => setPosition(item.key, v)
+          "
+        >
+          <span
+            class="text-muted-foreground truncate line-through decoration-dotted"
+          >
+            {{ item.label }}
+          </span>
+        </SelectItem>
+      </div>
+    </div>
+  </div>
+</template>
diff --git a/packages/effects/layouts/src/widgets/preferences/blocks/general/animation.vue b/packages/effects/layouts/src/widgets/preferences/blocks/general/animation.vue
index b27d074a..9bf06ad9 100644
--- a/packages/effects/layouts/src/widgets/preferences/blocks/general/animation.vue
+++ b/packages/effects/layouts/src/widgets/preferences/blocks/general/animation.vue
@@ -34,7 +34,7 @@ function handleClick(value: string) {
   </SwitchItem>
   <div
     v-if="transitionEnable"
-    class="mb-2 mt-3 flex justify-between gap-3 px-2"
+    class="mt-3 mb-2 flex justify-between gap-3 px-2"
   >
     <div
       v-for="item in transitionPreset"
@@ -45,7 +45,10 @@ function handleClick(value: string) {
       class="outline-box p-2"
       @click="handleClick(item)"
     >
-      <div :class="`${item}-slow`" class="bg-accent h-10 w-12 rounded-md"></div>
+      <div
+        :class="`${item}-slow`"
+        class="h-10 w-12 rounded-md bg-primary"
+      ></div>
     </div>
   </div>
 </template>
diff --git a/packages/effects/layouts/src/widgets/preferences/blocks/general/general.vue b/packages/effects/layouts/src/widgets/preferences/blocks/general/general.vue
index 630882f4..d5fd1c73 100644
--- a/packages/effects/layouts/src/widgets/preferences/blocks/general/general.vue
+++ b/packages/effects/layouts/src/widgets/preferences/blocks/general/general.vue
@@ -1,7 +1,11 @@
 <script setup lang="ts">
+import { onMounted, ref, unref } from 'vue';
+
 import { SUPPORT_LANGUAGES } from '@vben/constants';
 import { $t } from '@vben/locales';
+import { useTimezoneStore } from '@vben/stores';
 
+import InputItem from '../input-item.vue';
 import SelectItem from '../select-item.vue';
 import SwitchItem from '../switch-item.vue';
 
@@ -10,22 +14,64 @@ defineOptions({
 });
 
 const appLocale = defineModel<string>('appLocale');
+const appTimezone = defineModel<string>('appTimezone');
 const appDynamicTitle = defineModel<boolean>('appDynamicTitle');
 const appWatermark = defineModel<boolean>('appWatermark');
+const appWatermarkContent = defineModel<string>('appWatermarkContent');
 const appEnableCheckUpdates = defineModel<boolean>('appEnableCheckUpdates');
+const appEnableCopyPreferences = defineModel<boolean>(
+  'appEnableCopyPreferences',
+);
+const timezoneStore = useTimezoneStore();
+
+const timezoneOptionsRef = ref<
+  {
+    label: string;
+    value: string;
+  }[]
+>([]);
+
+onMounted(async () => {
+  timezoneOptionsRef.value = await timezoneStore.getTimezoneOptions();
+  // 获取当前时区，例如：Asia/Shanghai
+  const timezoneValue = unref(timezoneStore.timezone);
+  if (timezoneValue) {
+    appTimezone.value = timezoneValue;
+  }
+});
 </script>
 
 <template>
   <SelectItem v-model="appLocale" :items="SUPPORT_LANGUAGES">
     {{ $t('preferences.language') }}
   </SelectItem>
+  <SelectItem v-model="appTimezone" :items="timezoneOptionsRef">
+    {{ $t('preferences.timezone') }}
+  </SelectItem>
   <SwitchItem v-model="appDynamicTitle">
     {{ $t('preferences.dynamicTitle') }}
   </SwitchItem>
-  <SwitchItem v-model="appWatermark">
+  <SwitchItem
+    v-model="appWatermark"
+    @update:model-value="
+      (val) => {
+        if (!val) appWatermarkContent = '';
+      }
+    "
+  >
     {{ $t('preferences.watermark') }}
   </SwitchItem>
+  <InputItem
+    v-if="appWatermark"
+    v-model="appWatermarkContent"
+    :placeholder="$t('preferences.watermarkContent')"
+  >
+    {{ $t('preferences.watermarkContent') }}
+  </InputItem>
   <SwitchItem v-model="appEnableCheckUpdates">
     {{ $t('preferences.checkUpdates') }}
   </SwitchItem>
+  <SwitchItem v-model="appEnableCopyPreferences">
+    {{ $t('preferences.enableCopyPreferences') }}
+  </SwitchItem>
 </template>
diff --git a/packages/effects/layouts/src/widgets/preferences/blocks/index.ts b/packages/effects/layouts/src/widgets/preferences/blocks/index.ts
index 59595dc4..b1b8eac9 100644
--- a/packages/effects/layouts/src/widgets/preferences/blocks/index.ts
+++ b/packages/effects/layouts/src/widgets/preferences/blocks/index.ts
@@ -1,4 +1,5 @@
 export { default as Block } from './block.vue';
+export { default as Custom } from './custom/custom.vue';
 export { default as Animation } from './general/animation.vue';
 export { default as General } from './general/general.vue';
 export { default as Breadcrumb } from './layout/breadcrumb.vue';
@@ -15,5 +16,6 @@ export { default as GlobalShortcutKeys } from './shortcut-keys/global.vue';
 export { default as SwitchItem } from './switch-item.vue';
 export { default as BuiltinTheme } from './theme/builtin.vue';
 export { default as ColorMode } from './theme/color-mode.vue';
+export { default as FontSize } from './theme/font-size.vue';
 export { default as Radius } from './theme/radius.vue';
 export { default as Theme } from './theme/theme.vue';
diff --git a/packages/effects/layouts/src/widgets/preferences/blocks/input-item.vue b/packages/effects/layouts/src/widgets/preferences/blocks/input-item.vue
index c480db08..d0766772 100644
--- a/packages/effects/layouts/src/widgets/preferences/blocks/input-item.vue
+++ b/packages/effects/layouts/src/widgets/preferences/blocks/input-item.vue
@@ -3,7 +3,8 @@ import type { SelectOption } from '@vben/types';
 
 import { useSlots } from 'vue';
 
-import { CircleHelp } from '@vben/icons';
+import { CircleHelp, CircleX } from '@vben/icons';
+
 import { Input, VbenTooltip } from '@vben-core/shadcn-ui';
 
 defineOptions({
@@ -15,10 +16,12 @@ withDefaults(
     disabled?: boolean;
     items?: SelectOption[];
     placeholder?: string;
+    tip?: string;
   }>(),
   {
     disabled: false,
     placeholder: '',
+    tip: '',
     items: () => [],
   },
 );
@@ -31,7 +34,7 @@ const slots = useSlots();
 <template>
   <div
     :class="{
-      'hover:bg-accent': !slots.tip,
+      'hover:bg-accent': !(slots.tip || tip),
       'pointer-events-none opacity-50': disabled,
     }"
     class="my-1 flex w-full items-center justify-between rounded-md px-2 py-1"
@@ -39,13 +42,30 @@ const slots = useSlots();
     <span class="flex items-center text-sm">
       <slot></slot>
 
-      <VbenTooltip v-if="slots.tip" side="bottom">
+      <VbenTooltip v-if="slots.tip || tip" side="bottom">
         <template #trigger>
           <CircleHelp class="ml-1 size-3 cursor-help" />
         </template>
-        <slot name="tip"></slot>
+        <slot name="tip">
+          <template v-if="tip">
+            <p v-for="(line, index) in tip.split('\n')" :key="index">
+              {{ line }}
+            </p>
+          </template>
+        </slot>
       </VbenTooltip>
     </span>
-    <Input v-model="inputValue" class="h-8 w-[165px]" />
+    <div class="relative">
+      <Input
+        v-model="inputValue"
+        class="h-8 w-41.25"
+        :placeholder="placeholder"
+      />
+      <CircleX
+        v-if="inputValue"
+        class="absolute top-1/2 right-2 size-3 -translate-y-1/2 transform cursor-pointer text-foreground/60 hover:text-foreground"
+        @click="() => (inputValue = '')"
+      />
+    </div>
   </div>
 </template>
diff --git a/packages/effects/layouts/src/widgets/preferences/blocks/layout/content.vue b/packages/effects/layouts/src/widgets/preferences/blocks/layout/content.vue
index cd773771..aa5428b7 100644
--- a/packages/effects/layouts/src/widgets/preferences/blocks/layout/content.vue
+++ b/packages/effects/layouts/src/widgets/preferences/blocks/layout/content.vue
@@ -1,5 +1,7 @@
 <script setup lang="ts">
-import { type Component, computed } from 'vue';
+import type { Component } from 'vue';
+
+import { computed } from 'vue';
 
 import { $t } from '@vben/locales';
 
@@ -36,13 +38,13 @@ function activeClass(theme: string): string[] {
   <div class="flex w-full gap-5">
     <template v-for="theme in PRESET" :key="theme.name">
       <div
-        class="flex w-[100px] cursor-pointer flex-col"
+        class="flex w-25 cursor-pointer flex-col"
         @click="modelValue = theme.type"
       >
         <div :class="activeClass(theme.type)" class="outline-box flex-center">
           <component :is="components[theme.type]" />
         </div>
-        <div class="text-muted-foreground mt-2 text-center text-xs">
+        <div class="mt-2 text-center text-xs text-muted-foreground">
           {{ theme.name }}
         </div>
       </div>
diff --git a/packages/effects/layouts/src/widgets/preferences/blocks/layout/header.vue b/packages/effects/layouts/src/widgets/preferences/blocks/layout/header.vue
index cdb236cf..ee04ee28 100644
--- a/packages/effects/layouts/src/widgets/preferences/blocks/layout/header.vue
+++ b/packages/effects/layouts/src/widgets/preferences/blocks/layout/header.vue
@@ -1,15 +1,22 @@
 <script setup lang="ts">
-import type { LayoutHeaderModeType, SelectOption } from '@vben/types';
+import type {
+  LayoutHeaderMenuAlignType,
+  LayoutHeaderModeType,
+  SelectOption,
+} from '@vben/types';
 
 import { $t } from '@vben/locales';
 
 import SelectItem from '../select-item.vue';
 import SwitchItem from '../switch-item.vue';
+import ToggleItem from '../toggle-item.vue';
 
 defineProps<{ disabled: boolean }>();
 
 const headerEnable = defineModel<boolean>('headerEnable');
 const headerMode = defineModel<LayoutHeaderModeType>('headerMode');
+const headerMenuAlign =
+  defineModel<LayoutHeaderMenuAlignType>('headerMenuAlign');
 
 const localeItems: SelectOption[] = [
   {
@@ -29,6 +36,21 @@ const localeItems: SelectOption[] = [
     value: 'auto-scroll',
   },
 ];
+
+const headerMenuAlignItems: SelectOption[] = [
+  {
+    label: $t('preferences.header.menuAlignStart'),
+    value: 'start',
+  },
+  {
+    label: $t('preferences.header.menuAlignCenter'),
+    value: 'center',
+  },
+  {
+    label: $t('preferences.header.menuAlignEnd'),
+    value: 'end',
+  },
+];
 </script>
 
 <template>
@@ -42,4 +64,11 @@ const localeItems: SelectOption[] = [
   >
     {{ $t('preferences.mode') }}
   </SelectItem>
+  <ToggleItem
+    v-model="headerMenuAlign"
+    :disabled="!headerEnable"
+    :items="headerMenuAlignItems"
+  >
+    {{ $t('preferences.header.menuAlign') }}
+  </ToggleItem>
 </template>
diff --git a/packages/effects/layouts/src/widgets/preferences/blocks/layout/layout.vue b/packages/effects/layouts/src/widgets/preferences/blocks/layout/layout.vue
index ec5d3cfb..4b435302 100644
--- a/packages/effects/layouts/src/widgets/preferences/blocks/layout/layout.vue
+++ b/packages/effects/layouts/src/widgets/preferences/blocks/layout/layout.vue
@@ -1,15 +1,20 @@
 <script setup lang="ts">
+import type { Component } from 'vue';
+
 import type { LayoutType } from '@vben/types';
 
-import { type Component, computed } from 'vue';
+import { computed } from 'vue';
 
 import { CircleHelp } from '@vben/icons';
 import { $t } from '@vben/locales';
+
 import { VbenTooltip } from '@vben-core/shadcn-ui';
 
 import {
   FullContent,
+  HeaderMixedNav,
   HeaderNav,
+  HeaderSidebarNav,
   MixedNav,
   SidebarMixedNav,
   SidebarNav,
@@ -33,6 +38,8 @@ const components: Record<LayoutType, Component> = {
   'mixed-nav': MixedNav,
   'sidebar-mixed-nav': SidebarMixedNav,
   'sidebar-nav': SidebarNav,
+  'header-mixed-nav': HeaderMixedNav,
+  'header-sidebar-nav': HeaderSidebarNav,
 };
 
 const PRESET = computed((): PresetItem[] => [
@@ -51,11 +58,21 @@ const PRESET = computed((): PresetItem[] => [
     tip: $t('preferences.horizontalTip'),
     type: 'header-nav',
   },
+  {
+    name: $t('preferences.headerSidebarNav'),
+    tip: $t('preferences.headerSidebarNavTip'),
+    type: 'header-sidebar-nav',
+  },
   {
     name: $t('preferences.mixedMenu'),
     tip: $t('preferences.mixedMenuTip'),
     type: 'mixed-nav',
   },
+  {
+    name: $t('preferences.headerTwoColumn'),
+    tip: $t('preferences.headerTwoColumnTip'),
+    type: 'header-mixed-nav',
+  },
   {
     name: $t('preferences.fullContent'),
     tip: $t('preferences.fullContentTip'),
@@ -72,14 +89,14 @@ function activeClass(theme: string): string[] {
   <div class="flex w-full flex-wrap gap-5">
     <template v-for="theme in PRESET" :key="theme.name">
       <div
-        class="flex w-[100px] cursor-pointer flex-col"
+        class="flex w-25 cursor-pointer flex-col"
         @click="modelValue = theme.type"
       >
         <div :class="activeClass(theme.type)" class="outline-box flex-center">
           <component :is="components[theme.type]" />
         </div>
         <div
-          class="text-muted-foreground flex-center hover:text-foreground mt-2 text-center text-xs"
+          class="mt-2 flex-center text-center text-xs text-muted-foreground hover:text-foreground"
         >
           {{ theme.name }}
           <VbenTooltip v-if="theme.tip" side="bottom">
diff --git a/packages/effects/layouts/src/widgets/preferences/blocks/layout/sidebar.vue b/packages/effects/layouts/src/widgets/preferences/blocks/layout/sidebar.vue
index dfb63229..94d380f8 100644
--- a/packages/effects/layouts/src/widgets/preferences/blocks/layout/sidebar.vue
+++ b/packages/effects/layouts/src/widgets/preferences/blocks/layout/sidebar.vue
@@ -1,8 +1,11 @@
 <script setup lang="ts">
 import type { LayoutType } from '@vben/types';
 
+import { onMounted } from 'vue';
+
 import { $t } from '@vben/locales';
 
+import CheckboxItem from '../checkbox-item.vue';
 import NumberFieldItem from '../number-field-item.vue';
 import SwitchItem from '../switch-item.vue';
 
@@ -16,14 +19,41 @@ const sidebarCollapsedShowTitle = defineModel<boolean>(
 const sidebarAutoActivateChild = defineModel<boolean>(
   'sidebarAutoActivateChild',
 );
+const sidebarDraggable = defineModel<boolean>('sidebarDraggable');
 const sidebarCollapsed = defineModel<boolean>('sidebarCollapsed');
 const sidebarExpandOnHover = defineModel<boolean>('sidebarExpandOnHover');
+
+const sidebarButtons = defineModel<string[]>('sidebarButtons', {
+  default: () => [],
+});
+const sidebarCollapsedButton = defineModel<boolean>('sidebarCollapsedButton');
+const sidebarFixedButton = defineModel<boolean>('sidebarFixedButton');
+
+onMounted(() => {
+  if (
+    sidebarCollapsedButton.value &&
+    !sidebarButtons.value.includes('collapsed')
+  ) {
+    sidebarButtons.value.push('collapsed');
+  }
+  if (sidebarFixedButton.value && !sidebarButtons.value.includes('fixed')) {
+    sidebarButtons.value.push('fixed');
+  }
+});
+
+const handleCheckboxChange = () => {
+  sidebarCollapsedButton.value = !!sidebarButtons.value.includes('collapsed');
+  sidebarFixedButton.value = !!sidebarButtons.value.includes('fixed');
+};
 </script>
 
 <template>
   <SwitchItem v-model="sidebarEnable" :disabled="disabled">
     {{ $t('preferences.sidebar.visible') }}
   </SwitchItem>
+  <SwitchItem v-model="sidebarDraggable" :disabled="!sidebarEnable || disabled">
+    {{ $t('preferences.sidebar.draggable') }}
+  </SwitchItem>
   <SwitchItem v-model="sidebarCollapsed" :disabled="!sidebarEnable || disabled">
     {{ $t('preferences.sidebar.collapsed') }}
   </SwitchItem>
@@ -44,7 +74,7 @@ const sidebarExpandOnHover = defineModel<boolean>('sidebarExpandOnHover');
     v-model="sidebarAutoActivateChild"
     :disabled="
       !sidebarEnable ||
-      !['sidebar-mixed-nav', 'mixed-nav', 'sidebar-nav'].includes(
+      !['sidebar-mixed-nav', 'mixed-nav', 'header-mixed-nav'].includes(
         currentLayout as string,
       ) ||
       disabled
@@ -53,6 +83,17 @@ const sidebarExpandOnHover = defineModel<boolean>('sidebarExpandOnHover');
   >
     {{ $t('preferences.sidebar.autoActivateChild') }}
   </SwitchItem>
+  <CheckboxItem
+    :items="[
+      { label: $t('preferences.sidebar.buttonCollapsed'), value: 'collapsed' },
+      { label: $t('preferences.sidebar.buttonFixed'), value: 'fixed' },
+    ]"
+    multiple
+    v-model="sidebarButtons"
+    :on-btn-click="handleCheckboxChange"
+  >
+    {{ $t('preferences.sidebar.buttons') }}
+  </CheckboxItem>
   <NumberFieldItem
     v-model="sidebarWidth"
     :disabled="!sidebarEnable || disabled"
diff --git a/packages/effects/layouts/src/widgets/preferences/blocks/layout/tabbar.vue b/packages/effects/layouts/src/widgets/preferences/blocks/layout/tabbar.vue
index e613f516..885c30c3 100644
--- a/packages/effects/layouts/src/widgets/preferences/blocks/layout/tabbar.vue
+++ b/packages/effects/layouts/src/widgets/preferences/blocks/layout/tabbar.vue
@@ -5,6 +5,7 @@ import { computed } from 'vue';
 
 import { $t } from '@vben/locales';
 
+import NumberFieldItem from '../number-field-item.vue';
 import SelectItem from '../select-item.vue';
 import SwitchItem from '../switch-item.vue';
 
@@ -17,11 +18,16 @@ defineProps<{ disabled?: boolean }>();
 const tabbarEnable = defineModel<boolean>('tabbarEnable');
 const tabbarShowIcon = defineModel<boolean>('tabbarShowIcon');
 const tabbarPersist = defineModel<boolean>('tabbarPersist');
+const tabbarVisitHistory = defineModel<boolean>('tabbarVisitHistory');
 const tabbarDraggable = defineModel<boolean>('tabbarDraggable');
 const tabbarWheelable = defineModel<boolean>('tabbarWheelable');
 const tabbarStyleType = defineModel<string>('tabbarStyleType');
 const tabbarShowMore = defineModel<boolean>('tabbarShowMore');
 const tabbarShowMaximize = defineModel<boolean>('tabbarShowMaximize');
+const tabbarMaxCount = defineModel<number>('tabbarMaxCount');
+const tabbarMiddleClickToClose = defineModel<boolean>(
+  'tabbarMiddleClickToClose',
+);
 
 const styleItems = computed((): SelectOption[] => [
   {
@@ -51,6 +57,23 @@ const styleItems = computed((): SelectOption[] => [
   <SwitchItem v-model="tabbarPersist" :disabled="!tabbarEnable">
     {{ $t('preferences.tabbar.persist') }}
   </SwitchItem>
+  <SwitchItem
+    v-model="tabbarVisitHistory"
+    :disabled="!tabbarEnable"
+    :tip="$t('preferences.tabbar.visitHistoryTip')"
+  >
+    {{ $t('preferences.tabbar.visitHistory') }}
+  </SwitchItem>
+  <NumberFieldItem
+    v-model="tabbarMaxCount"
+    :disabled="!tabbarEnable"
+    :max="30"
+    :min="0"
+    :step="5"
+    :tip="$t('preferences.tabbar.maxCountTip')"
+  >
+    {{ $t('preferences.tabbar.maxCount') }}
+  </NumberFieldItem>
   <SwitchItem v-model="tabbarDraggable" :disabled="!tabbarEnable">
     {{ $t('preferences.tabbar.draggable') }}
   </SwitchItem>
@@ -61,6 +84,9 @@ const styleItems = computed((): SelectOption[] => [
   >
     {{ $t('preferences.tabbar.wheelable') }}
   </SwitchItem>
+  <SwitchItem v-model="tabbarMiddleClickToClose" :disabled="!tabbarEnable">
+    {{ $t('preferences.tabbar.middleClickClose') }}
+  </SwitchItem>
   <SwitchItem v-model="tabbarShowIcon" :disabled="!tabbarEnable">
     {{ $t('preferences.tabbar.icon') }}
   </SwitchItem>
diff --git a/packages/effects/layouts/src/widgets/preferences/blocks/layout/widget.vue b/packages/effects/layouts/src/widgets/preferences/blocks/layout/widget.vue
index 82addb33..95735f17 100644
--- a/packages/effects/layouts/src/widgets/preferences/blocks/layout/widget.vue
+++ b/packages/effects/layouts/src/widgets/preferences/blocks/layout/widget.vue
@@ -1,30 +1,70 @@
 <script setup lang="ts">
-import type { SelectOption } from '@vben/types';
+import type { PreferencesButtonPositionType, SelectOption } from '@vben/types';
 
 import { computed } from 'vue';
 
 import { $t } from '@vben/locales';
 
-import SelectItem from '../select-item.vue';
-import SwitchItem from '../switch-item.vue';
+import DraggableList from '../draggable-list.vue';
 
 defineOptions({
   name: 'PreferenceInterfaceControl',
 });
 
-const widgetGlobalSearch = defineModel<boolean>('widgetGlobalSearch');
-const widgetFullscreen = defineModel<boolean>('widgetFullscreen');
-const widgetLanguageToggle = defineModel<boolean>('widgetLanguageToggle');
-const widgetNotification = defineModel<boolean>('widgetNotification');
-const widgetThemeToggle = defineModel<boolean>('widgetThemeToggle');
-const widgetSidebarToggle = defineModel<boolean>('widgetSidebarToggle');
-const widgetLockScreen = defineModel<boolean>('widgetLockScreen');
-const appPreferencesButtonPosition = defineModel<string>(
+const widgetOrder = defineModel<string[]>('widgetOrder', { required: true });
+
+const widgetGlobalSearchButtonPosition = defineModel<string>(
+  'widgetGlobalSearchButtonPosition',
+);
+const widgetFullscreenButtonPosition = defineModel<string>(
+  'widgetFullscreenButtonPosition',
+);
+const widgetLanguageToggleButtonPosition = defineModel<string>(
+  'widgetLanguageToggleButtonPosition',
+);
+const widgetNotificationButtonPosition = defineModel<string>(
+  'widgetNotificationButtonPosition',
+);
+const widgetThemeToggleButtonPosition = defineModel<string>(
+  'widgetThemeToggleButtonPosition',
+);
+const widgetLockScreenButtonPosition = defineModel<string>(
+  'widgetLockScreenButtonPosition',
+);
+const widgetLogoutButtonPosition = defineModel<string>(
+  'widgetLogoutButtonPosition',
+);
+const widgetRefreshButtonPosition = defineModel<string>(
+  'widgetRefreshButtonPosition',
+);
+const widgetTimezoneButtonPosition = defineModel<string>(
+  'widgetTimezoneButtonPosition',
+);
+const appPreferencesButtonPosition = defineModel<PreferencesButtonPositionType>(
   'appPreferencesButtonPosition',
 );
-const widgetRefresh = defineModel<boolean>('widgetRefresh');
 
-const positionItems = computed((): SelectOption[] => [
+const buttonPositionItems = computed((): SelectOption[] => [
+  {
+    label: $t('preferences.widget.header'),
+    value: 'header',
+  },
+  {
+    label: $t('preferences.widget.userDropdown'),
+    value: 'user-dropdown',
+  },
+  {
+    label: $t('common.notShow'),
+    value: 'none',
+  },
+]);
+
+/**
+ * preferences 按钮独享的位置选项：
+ * 保留 auto/fixed 让 use-preferences.ts 的智能 fallback 生效
+ * （移动端/全屏内容模式下自动切换 header/fixed，避免偏好入口死锁）
+ */
+const preferencesPositionItems = computed((): SelectOption[] => [
   {
     label: $t('preferences.position.auto'),
     value: 'auto',
@@ -37,35 +77,103 @@ const positionItems = computed((): SelectOption[] => [
     label: $t('preferences.position.fixed'),
     value: 'fixed',
   },
+  {
+    label: $t('preferences.position.userDropdown'),
+    value: 'user-dropdown',
+  },
+  {
+    label: $t('common.notShow'),
+    value: 'none',
+  },
 ]);
+
+const positionMap: Record<string, string> = {
+  globalSearch: 'widgetGlobalSearchButtonPosition',
+  preferences: 'appPreferencesButtonPosition',
+  themeToggle: 'widgetThemeToggleButtonPosition',
+  languageToggle: 'widgetLanguageToggleButtonPosition',
+  timezone: 'widgetTimezoneButtonPosition',
+  fullscreen: 'widgetFullscreenButtonPosition',
+  refresh: 'widgetRefreshButtonPosition',
+  notification: 'widgetNotificationButtonPosition',
+  lockScreenBtn: 'widgetLockScreenButtonPosition',
+  logoutBtn: 'widgetLogoutButtonPosition',
+};
+
+const labelMap: Record<string, string> = {
+  globalSearch: 'preferences.widget.globalSearch',
+  preferences: 'preferences.title',
+  themeToggle: 'preferences.widget.themeToggle',
+  languageToggle: 'preferences.widget.languageToggle',
+  timezone: 'preferences.widget.timezone',
+  fullscreen: 'preferences.widget.fullscreen',
+  refresh: 'preferences.widget.refresh',
+  notification: 'preferences.widget.notification',
+  lockScreenBtn: 'ui.widgets.lockScreen.title',
+  logoutBtn: 'common.logout',
+};
+
+const draggableItems = computed(() =>
+  (widgetOrder.value ?? []).map((key) => ({
+    key,
+    label: $t(labelMap[key] ?? key),
+    position: getPosition(key),
+    positionItems:
+      key === 'preferences' ? preferencesPositionItems.value : undefined,
+  })),
+);
+
+function getPosition(
+  key: string,
+): 'auto' | 'fixed' | 'header' | 'none' | 'user-dropdown' {
+  const modelName = positionMap[key];
+  if (!modelName) return 'none';
+  const modelMap: Record<string, any> = {
+    widgetGlobalSearchButtonPosition,
+    widgetFullscreenButtonPosition,
+    widgetLanguageToggleButtonPosition,
+    widgetNotificationButtonPosition,
+    widgetThemeToggleButtonPosition,
+    widgetLockScreenButtonPosition,
+    widgetLogoutButtonPosition,
+    widgetRefreshButtonPosition,
+    widgetTimezoneButtonPosition,
+    appPreferencesButtonPosition,
+  };
+  return modelMap[modelName]?.value ?? 'none';
+}
+
+function handleUpdateOrder(keys: string[]) {
+  widgetOrder.value = keys;
+}
+
+function handleUpdatePosition(
+  key: string,
+  position: 'auto' | 'fixed' | 'header' | 'none' | 'user-dropdown',
+) {
+  const modelName = positionMap[key];
+  if (!modelName) return;
+  const modelMap: Record<string, any> = {
+    widgetGlobalSearchButtonPosition,
+    widgetFullscreenButtonPosition,
+    widgetLanguageToggleButtonPosition,
+    widgetNotificationButtonPosition,
+    widgetThemeToggleButtonPosition,
+    widgetLockScreenButtonPosition,
+    widgetLogoutButtonPosition,
+    widgetRefreshButtonPosition,
+    widgetTimezoneButtonPosition,
+    appPreferencesButtonPosition,
+  };
+  modelMap[modelName].value = position;
+}
 </script>
 
 <template>
-  <SwitchItem v-model="widgetGlobalSearch">
-    {{ $t('preferences.widget.globalSearch') }}
-  </SwitchItem>
-  <SwitchItem v-model="widgetThemeToggle">
-    {{ $t('preferences.widget.themeToggle') }}
-  </SwitchItem>
-  <SwitchItem v-model="widgetLanguageToggle">
-    {{ $t('preferences.widget.languageToggle') }}
-  </SwitchItem>
-  <SwitchItem v-model="widgetFullscreen">
-    {{ $t('preferences.widget.fullscreen') }}
-  </SwitchItem>
-  <SwitchItem v-model="widgetNotification">
-    {{ $t('preferences.widget.notification') }}
-  </SwitchItem>
-  <SwitchItem v-model="widgetLockScreen">
-    {{ $t('preferences.widget.lockScreen') }}
-  </SwitchItem>
-  <SwitchItem v-model="widgetSidebarToggle">
-    {{ $t('preferences.widget.sidebarToggle') }}
-  </SwitchItem>
-  <SwitchItem v-model="widgetRefresh">
-    {{ $t('preferences.widget.refresh') }}
-  </SwitchItem>
-  <SelectItem v-model="appPreferencesButtonPosition" :items="positionItems">
-    {{ $t('preferences.position.title') }}
-  </SelectItem>
+  <DraggableList
+    :items="draggableItems"
+    :position-items="buttonPositionItems"
+    @update-order="handleUpdateOrder"
+    @update-position="handleUpdatePosition"
+  />
 </template>
diff --git a/packages/effects/layouts/src/widgets/preferences/blocks/number-field-item.vue b/packages/effects/layouts/src/widgets/preferences/blocks/number-field-item.vue
index 00a53281..ee2ddaa8 100644
--- a/packages/effects/layouts/src/widgets/preferences/blocks/number-field-item.vue
+++ b/packages/effects/layouts/src/widgets/preferences/blocks/number-field-item.vue
@@ -4,6 +4,7 @@ import type { SelectOption } from '@vben/types';
 import { useSlots } from 'vue';
 
 import { CircleHelp } from '@vben/icons';
+
 import {
   NumberField,
   NumberFieldContent,
@@ -22,10 +23,12 @@ withDefaults(
     disabled?: boolean;
     items?: SelectOption[];
     placeholder?: string;
+    tip?: string;
   }>(),
   {
     disabled: false,
     placeholder: '',
+    tip: '',
     items: () => [],
   },
 );
@@ -46,15 +49,21 @@ const slots = useSlots();
     <span class="flex items-center text-sm">
       <slot></slot>
 
-      <VbenTooltip v-if="slots.tip" side="bottom">
+      <VbenTooltip v-if="slots.tip || tip" side="bottom">
         <template #trigger>
           <CircleHelp class="ml-1 size-3 cursor-help" />
         </template>
-        <slot name="tip"></slot>
+        <slot name="tip">
+          <template v-if="tip">
+            <p v-for="(line, index) in tip.split('\n')" :key="index">
+              {{ line }}
+            </p>
+          </template>
+        </slot>
       </VbenTooltip>
     </span>
 
-    <NumberField v-model="inputValue" v-bind="$attrs" class="w-[165px]">
+    <NumberField v-model="inputValue" v-bind="$attrs" class="w-41.25">
       <NumberFieldContent>
         <NumberFieldDecrement />
         <NumberFieldInput />
diff --git a/packages/effects/layouts/src/widgets/preferences/blocks/select-item.vue b/packages/effects/layouts/src/widgets/preferences/blocks/select-item.vue
index 4e310156..f20295be 100644
--- a/packages/effects/layouts/src/widgets/preferences/blocks/select-item.vue
+++ b/packages/effects/layouts/src/widgets/preferences/blocks/select-item.vue
@@ -4,6 +4,7 @@ import type { SelectOption } from '@vben/types';
 import { useSlots } from 'vue';
 
 import { CircleHelp } from '@vben/icons';
+
 import {
   Select,
   SelectContent,
@@ -22,10 +23,12 @@ withDefaults(
     disabled?: boolean;
     items?: SelectOption[];
     placeholder?: string;
+    tip?: string;
   }>(),
   {
     disabled: false,
     placeholder: '',
+    tip: '',
     items: () => [],
   },
 );
@@ -38,7 +41,7 @@ const slots = useSlots();
 <template>
   <div
     :class="{
-      'hover:bg-accent': !slots.tip,
+      'hover:bg-accent': !(slots.tip || tip),
       'pointer-events-none opacity-50': disabled,
     }"
     class="my-1 flex w-full items-center justify-between rounded-md px-2 py-1"
@@ -46,15 +49,21 @@ const slots = useSlots();
     <span class="flex items-center text-sm">
       <slot></slot>
 
-      <VbenTooltip v-if="slots.tip" side="bottom">
+      <VbenTooltip v-if="slots.tip || tip" side="bottom">
         <template #trigger>
           <CircleHelp class="ml-1 size-3 cursor-help" />
         </template>
-        <slot name="tip"></slot>
+        <slot name="tip">
+          <template v-if="tip">
+            <p v-for="(line, index) in tip.split('\n')" :key="index">
+              {{ line }}
+            </p>
+          </template>
+        </slot>
       </VbenTooltip>
     </span>
     <Select v-model="selectValue">
-      <SelectTrigger class="h-8 w-[165px]">
+      <SelectTrigger class="h-8 w-41.25">
         <SelectValue :placeholder="placeholder" />
       </SelectTrigger>
       <SelectContent>
diff --git a/packages/effects/layouts/src/widgets/preferences/blocks/shortcut-keys/global.vue b/packages/effects/layouts/src/widgets/preferences/blocks/shortcut-keys/global.vue
index f71a1f6c..baa18a90 100644
--- a/packages/effects/layouts/src/widgets/preferences/blocks/shortcut-keys/global.vue
+++ b/packages/effects/layouts/src/widgets/preferences/blocks/shortcut-keys/global.vue
@@ -17,6 +17,7 @@ const shortcutKeysGlobalSearch = defineModel<boolean>(
 const shortcutKeysLogout = defineModel<boolean>('shortcutKeysLogout');
 // const shortcutKeysPreferences = defineModel<boolean>('shortcutKeysPreferences');
 const shortcutKeysLockScreen = defineModel<boolean>('shortcutKeysLockScreen');
+const shortcutKeysEscape = defineModel<boolean>('shortcutKeysEscape');
 
 const altView = computed(() => (isWindowsOs() ? 'Alt' : '⌥'));
 </script>
@@ -47,4 +48,8 @@ const altView = computed(() => (isWindowsOs() ? 'Alt' : '⌥'));
     {{ $t('ui.widgets.lockScreen.title') }}
     <template #shortcut> {{ altView }} L </template>
   </SwitchItem>
+  <SwitchItem v-model="shortcutKeysEscape" :disabled="!shortcutKeysEnable">
+    {{ $t('preferences.shortcutKeys.escape') }}
+    <template #shortcut> Esc </template>
+  </SwitchItem>
 </template>
diff --git a/packages/effects/layouts/src/widgets/preferences/blocks/switch-item.vue b/packages/effects/layouts/src/widgets/preferences/blocks/switch-item.vue
index 93a9e6e8..7d0458eb 100644
--- a/packages/effects/layouts/src/widgets/preferences/blocks/switch-item.vue
+++ b/packages/effects/layouts/src/widgets/preferences/blocks/switch-item.vue
@@ -2,6 +2,7 @@
 import { useSlots } from 'vue';
 
 import { CircleHelp } from '@vben/icons';
+
 import { Switch, VbenTooltip } from '@vben-core/shadcn-ui';
 
 defineOptions({
@@ -27,7 +28,7 @@ function handleClick() {
     :class="{
       'pointer-events-none opacity-50': disabled,
     }"
-    class="hover:bg-accent my-1 flex w-full items-center justify-between rounded-md px-2 py-2.5"
+    class="my-1 flex w-full items-center justify-between rounded-md px-2 py-2.5 hover:bg-accent"
     @click="handleClick"
   >
     <span class="flex items-center text-sm">
@@ -35,7 +36,7 @@ function handleClick() {
 
       <VbenTooltip v-if="slots.tip || tip" side="bottom">
         <template #trigger>
-          <CircleHelp class="ml-1 size-3 cursor-help" />
+          <CircleHelp class="ml-1 size-3 cursor-help pointer-events-auto" />
         </template>
         <slot name="tip">
           <template v-if="tip">
@@ -46,9 +47,9 @@ function handleClick() {
         </slot>
       </VbenTooltip>
     </span>
-    <span v-if="$slots.shortcut" class="ml-auto mr-2 text-xs opacity-60">
+    <span v-if="$slots.shortcut" class="mr-2 ml-auto text-xs opacity-60">
       <slot name="shortcut"></slot>
     </span>
-    <Switch v-model:checked="checked" @click.stop />
+    <Switch v-model="checked" @click.stop />
   </div>
 </template>
diff --git a/packages/effects/layouts/src/widgets/preferences/blocks/theme/builtin.vue b/packages/effects/layouts/src/widgets/preferences/blocks/theme/builtin.vue
index 480bc8c9..c262eeb9 100644
--- a/packages/effects/layouts/src/widgets/preferences/blocks/theme/builtin.vue
+++ b/packages/effects/layouts/src/widgets/preferences/blocks/theme/builtin.vue
@@ -1,16 +1,16 @@
 <script setup lang="ts">
+import type { BuiltinThemePreset } from '@vben/preferences';
 import type { BuiltinThemeType } from '@vben/types';
 
-import { computed, ref } from 'vue';
+import { computed, ref, watch } from 'vue';
 
 import { UserRoundPen } from '@vben/icons';
 import { $t } from '@vben/locales';
-import {
-  BUILT_IN_THEME_PRESETS,
-  type BuiltinThemePreset,
-} from '@vben/preferences';
+import { BUILT_IN_THEME_PRESETS } from '@vben/preferences';
 import { convertToHsl, TinyColor } from '@vben/utils';
 
+import { useThrottleFn } from '@vueuse/core';
+
 defineOptions({
   name: 'PreferenceBuiltinTheme',
 });
@@ -21,6 +21,15 @@ const colorInput = ref();
 const modelValue = defineModel<BuiltinThemeType>({ default: 'default' });
 const themeColorPrimary = defineModel<string>('themeColorPrimary');
 
+const updateThemeColorPrimary = useThrottleFn(
+  (value: string) => {
+    themeColorPrimary.value = value;
+  },
+  300,
+  true,
+  true,
+);
+
 const inputValue = computed(() => {
   return new TinyColor(themeColorPrimary.value || '').toHexString();
 });
@@ -49,7 +58,6 @@ function typeView(name: BuiltinThemeType) {
     case 'green': {
       return $t('preferences.theme.builtin.green');
     }
-
     case 'neutral': {
       return $t('preferences.theme.builtin.neutral');
     }
@@ -82,21 +90,32 @@ function typeView(name: BuiltinThemeType) {
 
 function handleSelect(theme: BuiltinThemePreset) {
   modelValue.value = theme.type;
-  const primaryColor = props.isDark
-    ? theme.darkPrimaryColor || theme.primaryColor
-    : theme.primaryColor;
-
-  themeColorPrimary.value = primaryColor || theme.color;
 }
 
 function handleInputChange(e: Event) {
   const target = e.target as HTMLInputElement;
-  themeColorPrimary.value = convertToHsl(target.value);
+  updateThemeColorPrimary(convertToHsl(target.value));
 }
 
 function selectColor() {
   colorInput.value?.[0]?.click?.();
 }
+
+watch(
+  () => [modelValue.value, props.isDark] as [BuiltinThemeType, boolean],
+  ([themeType, isDark]) => {
+    const theme = builtinThemePresets.value.find(
+      (item) => item.type === themeType,
+    );
+    if (theme) {
+      const primaryColor = isDark
+        ? theme.darkPrimaryColor || theme.primaryColor
+        : theme.primaryColor;
+
+      themeColorPrimary.value = primaryColor || theme.color;
+    }
+  },
+);
 </script>
 
 <template>
@@ -107,19 +126,19 @@ function selectColor() {
           :class="{
             'outline-box-active': theme.type === modelValue,
           }"
-          class="outline-box flex-center group cursor-pointer"
+          class="group outline-box flex-center cursor-pointer"
         >
           <template v-if="theme.type !== 'custom'">
             <div
               :style="{ backgroundColor: theme.color }"
-              class="mx-10 my-2 size-5 rounded-md"
+              class="mx-9 my-2 size-5 rounded-md"
             ></div>
           </template>
           <template v-else>
-            <div class="size-full px-10 py-2" @click.stop="selectColor">
-              <div class="flex-center relative size-5 rounded-sm">
+            <div class="size-full px-9 py-2" @click.stop="selectColor">
+              <div class="relative flex-center size-5 rounded-sm">
                 <UserRoundPen
-                  class="absolute z-10 size-5 opacity-60 group-hover:opacity-100"
+                  class="absolute z-1 size-5 opacity-60 group-hover:opacity-100"
                 />
                 <input
                   ref="colorInput"
@@ -132,7 +151,7 @@ function selectColor() {
             </div>
           </template>
         </div>
-        <div class="text-muted-foreground my-2 text-center text-xs">
+        <div class="my-2 text-center text-xs text-muted-foreground">
           {{ typeView(theme.type) }}
         </div>
       </div>
diff --git a/packages/effects/layouts/src/widgets/preferences/blocks/theme/font-size.vue b/packages/effects/layouts/src/widgets/preferences/blocks/theme/font-size.vue
new file mode 100644
index 00000000..58b7b815
--- /dev/null
+++ b/packages/effects/layouts/src/widgets/preferences/blocks/theme/font-size.vue
@@ -0,0 +1,62 @@
+<script setup lang="ts">
+import { watch } from 'vue';
+
+import { $t } from '@vben/locales';
+
+import {
+  NumberField,
+  NumberFieldContent,
+  NumberFieldDecrement,
+  NumberFieldIncrement,
+  NumberFieldInput,
+} from '@vben-core/shadcn-ui';
+
+defineOptions({
+  name: 'PreferenceFontSize',
+});
+
+const modelValue = defineModel<number>({
+  default: 16,
+});
+
+const min = 15;
+const max = 22;
+const step = 1;
+
+// 限制输入值在 min 和 max 之间
+watch(
+  modelValue,
+  (newValue) => {
+    if (newValue < min) {
+      modelValue.value = min;
+    } else if (newValue > max) {
+      modelValue.value = max;
+    }
+  },
+  { immediate: true },
+);
+</script>
+
+<template>
+  <div class="flex w-full flex-col gap-4">
+    <div class="flex items-center gap-2">
+      <NumberField
+        v-model="modelValue"
+        :max="max"
+        :min="min"
+        :step="step"
+        class="w-full"
+      >
+        <NumberFieldContent>
+          <NumberFieldDecrement />
+          <NumberFieldInput />
+          <NumberFieldIncrement />
+        </NumberFieldContent>
+      </NumberField>
+      <span class="text-xs whitespace-nowrap text-muted-foreground">px</span>
+    </div>
+    <div class="text-xs text-muted-foreground">
+      {{ $t('preferences.theme.fontSizeTip') }}
+    </div>
+  </div>
+</template>
diff --git a/packages/effects/layouts/src/widgets/preferences/blocks/theme/radius.vue b/packages/effects/layouts/src/widgets/preferences/blocks/theme/radius.vue
index 4201ed60..0cfcd98b 100644
--- a/packages/effects/layouts/src/widgets/preferences/blocks/theme/radius.vue
+++ b/packages/effects/layouts/src/widgets/preferences/blocks/theme/radius.vue
@@ -29,7 +29,7 @@ const items = [
     <template v-for="item in items" :key="item.value">
       <ToggleGroupItem
         :value="item.value"
-        class="data-[state=on]:bg-primary data-[state=on]:text-primary-foreground h-7 w-16 rounded-sm"
+        class="h-7 w-16 rounded-sm data-[state=on]:bg-primary data-[state=on]:text-primary-foreground"
       >
         {{ item.label }}
       </ToggleGroupItem>
diff --git a/packages/effects/layouts/src/widgets/preferences/blocks/theme/theme.vue b/packages/effects/layouts/src/widgets/preferences/blocks/theme/theme.vue
index e509d667..a6423e96 100644
--- a/packages/effects/layouts/src/widgets/preferences/blocks/theme/theme.vue
+++ b/packages/effects/layouts/src/widgets/preferences/blocks/theme/theme.vue
@@ -1,10 +1,13 @@
 <script setup lang="ts">
+import type { Component } from 'vue';
+
 import type { ThemeModeType } from '@vben/types';
 
-import type { Component } from 'vue';
+import { watch } from 'vue';
 
 import { MoonStar, Sun, SunMoon } from '@vben/icons';
 import { $t } from '@vben/locales';
+import { usePreferences } from '@vben/preferences';
 
 import SwitchItem from '../switch-item.vue';
 
@@ -14,8 +17,20 @@ defineOptions({
 
 const modelValue = defineModel<string>({ default: 'auto' });
 const themeSemiDarkSidebar = defineModel<boolean>('themeSemiDarkSidebar');
+const themeSemiDarkSidebarSub = defineModel<boolean>('themeSemiDarkSidebarSub');
 const themeSemiDarkHeader = defineModel<boolean>('themeSemiDarkHeader');
 
+const { layout } = usePreferences();
+
+watch(
+  () => themeSemiDarkSidebar.value,
+  () => {
+    if (!themeSemiDarkSidebar.value) {
+      themeSemiDarkSidebarSub.value = themeSemiDarkSidebar.value;
+    }
+  },
+);
+
 const THEME_PRESET: Array<{ icon: Component; name: ThemeModeType }> = [
   {
     icon: Sun,
@@ -63,7 +78,7 @@ function nameView(name: string) {
         >
           <component :is="theme.icon" class="mx-9 size-5" />
         </div>
-        <div class="text-muted-foreground mt-2 text-center text-xs">
+        <div class="mt-2 text-center text-xs text-muted-foreground">
           {{ nameView(theme.name) }}
         </div>
       </div>
@@ -71,11 +86,27 @@ function nameView(name: string) {
 
     <SwitchItem
       v-model="themeSemiDarkSidebar"
-      :disabled="modelValue === 'dark'"
+      :disabled="
+        modelValue === 'dark' ||
+        layout === 'header-nav' ||
+        layout === 'full-content'
+      "
+      :tip="$t('preferences.theme.darkSidebarTip')"
       class="mt-6"
     >
       {{ $t('preferences.theme.darkSidebar') }}
     </SwitchItem>
+    <SwitchItem
+      v-model="themeSemiDarkSidebarSub"
+      :disabled="
+        modelValue === 'dark' ||
+        (layout !== 'header-mixed-nav' && layout !== 'sidebar-mixed-nav') ||
+        !themeSemiDarkSidebar
+      "
+      :tip="$t('preferences.theme.darkSidebarSubTip')"
+    >
+      {{ $t('preferences.theme.darkSidebarSub') }}
+    </SwitchItem>
     <SwitchItem v-model="themeSemiDarkHeader" :disabled="modelValue === 'dark'">
       {{ $t('preferences.theme.darkHeader') }}
     </SwitchItem>
diff --git a/packages/effects/layouts/src/widgets/preferences/blocks/toggle-item.vue b/packages/effects/layouts/src/widgets/preferences/blocks/toggle-item.vue
index df2c39fa..cfa3c62a 100644
--- a/packages/effects/layouts/src/widgets/preferences/blocks/toggle-item.vue
+++ b/packages/effects/layouts/src/widgets/preferences/blocks/toggle-item.vue
@@ -7,7 +7,7 @@ defineOptions({
   name: 'PreferenceToggleItem',
 });
 
-withDefaults(defineProps<{ disabled?: boolean; items: SelectOption[] }>(), {
+withDefaults(defineProps<{ disabled?: boolean; items?: SelectOption[] }>(), {
   disabled: false,
   items: () => [],
 });
@@ -20,7 +20,7 @@ const modelValue = defineModel<string>();
     :class="{
       'pointer-events-none opacity-50': disabled,
     }"
-    class="hover:bg-accent flex w-full items-center justify-between rounded-md px-2 py-2"
+    class="flex w-full items-center justify-between rounded-md p-2 hover:bg-accent"
     disabled
   >
     <span class="text-sm">
@@ -36,7 +36,7 @@ const modelValue = defineModel<string>();
       <template v-for="item in items" :key="item.value">
         <ToggleGroupItem
           :value="item.value"
-          class="data-[state=on]:bg-primary data-[state=on]:text-primary-foreground h-7 rounded-sm"
+          class="h-7 rounded-sm data-[state=on]:bg-primary data-[state=on]:text-primary-foreground"
         >
           {{ item.label }}
         </ToggleGroupItem>
diff --git a/packages/effects/layouts/src/widgets/preferences/icons/header-mixed-nav.vue b/packages/effects/layouts/src/widgets/preferences/icons/header-mixed-nav.vue
new file mode 100644
index 00000000..d5c93677
--- /dev/null
+++ b/packages/effects/layouts/src/widgets/preferences/icons/header-mixed-nav.vue
@@ -0,0 +1,202 @@
+<template>
+  <svg
+    class="custom-radio-image"
+    fill="none"
+    height="66"
+    width="104"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+    <g>
+      <rect
+        id="svg_1"
+        fill="currentColor"
+        fill-opacity="0.02"
+        height="66"
+        rx="4"
+        stroke="null"
+        width="104"
+        x="0.13514"
+        y="0.13514"
+      />
+      <path
+        id="svg_2"
+        d="m-3.37838,3.7543a1.93401,4.02457 0 0 1 1.93401,-4.02457l11.3488,0l0,66.40541l-11.3488,0a1.93401,4.02457 0 0 1 -1.93401,-4.02457l0,-58.35627z"
+        fill="hsl(var(--primary))"
+        stroke="null"
+      />
+      <rect
+        id="svg_3"
+        fill="#e5e5e5"
+        height="2.789"
+        rx="1.395"
+        stroke="null"
+        width="5.47439"
+        x="1.64059"
+        y="15.46086"
+      />
+      <rect
+        id="svg_4"
+        fill="#ffffff"
+        height="7.67897"
+        rx="2"
+        stroke="null"
+        width="8.18938"
+        x="0.58676"
+        y="1.42154"
+      />
+      <rect
+        id="svg_8"
+        fill="hsl(var(--primary))"
+        height="9.07027"
+        rx="2"
+        stroke="null"
+        width="75.91967"
+        x="25.38277"
+        y="1.42876"
+      />
+      <rect
+        id="svg_9"
+        fill="#b2b2b2"
+        height="4.4"
+        rx="1"
+        stroke="null"
+        width="3.925"
+        x="27.91529"
+        y="3.69284"
+      />
+      <rect
+        id="svg_10"
+        fill="#b2b2b2"
+        height="4.4"
+        rx="1"
+        stroke="null"
+        width="3.925"
+        x="80.75054"
+        y="3.62876"
+      />
+      <rect
+        id="svg_11"
+        fill="#b2b2b2"
+        height="4.4"
+        rx="1"
+        stroke="null"
+        width="3.925"
+        x="87.78868"
+        y="3.69981"
+      />
+      <rect
+        id="svg_12"
+        fill="#b2b2b2"
+        height="4.4"
+        rx="1"
+        stroke="null"
+        width="3.925"
+        x="94.6847"
+        y="3.62876"
+      />
+      <rect
+        id="svg_13"
+        fill="currentColor"
+        fill-opacity="0.08"
+        height="21.51892"
+        rx="2"
+        stroke="null"
+        width="42.9287"
+        x="58.75427"
+        y="14.613"
+      />
+      <rect
+        id="svg_14"
+        fill="currentColor"
+        fill-opacity="0.08"
+        height="20.97838"
+        rx="2"
+        stroke="null"
+        width="28.36894"
+        x="26.14342"
+        y="14.613"
+      />
+      <rect
+        id="svg_15"
+        fill="currentColor"
+        fill-opacity="0.08"
+        height="21.65405"
+        rx="2"
+        stroke="null"
+        width="75.09493"
+        x="26.34264"
+        y="39.68822"
+      />
+      <rect
+        id="svg_5"
+        fill="#e5e5e5"
+        height="2.789"
+        rx="1.395"
+        stroke="null"
+        width="5.47439"
+        x="1.79832"
+        y="28.39462"
+      />
+      <rect
+        id="svg_6"
+        fill="#e5e5e5"
+        height="2.789"
+        rx="1.395"
+        stroke="null"
+        width="5.47439"
+        x="1.64059"
+        y="41.80156"
+      />
+      <rect
+        id="svg_7"
+        fill="#e5e5e5"
+        height="2.789"
+        rx="1.395"
+        stroke="null"
+        width="5.47439"
+        x="1.64059"
+        y="55.36623"
+      />
+      <rect
+        id="svg_16"
+        fill="currentColor"
+        fill-opacity="0.08"
+        height="65.72065"
+        stroke="null"
+        width="12.49265"
+        x="9.85477"
+        y="-0.02618"
+      />
+      <rect
+        id="svg_21"
+        fill="#e5e5e5"
+        height="2.789"
+        rx="1.395"
+        stroke="null"
+        width="7.52486"
+        x="35.14924"
+        y="4.07319"
+      />
+      <rect
+        id="svg_22"
+        fill="#e5e5e5"
+        height="2.789"
+        rx="1.395"
+        stroke="null"
+        width="7.52486"
+        x="47.25735"
+        y="4.20832"
+      />
+      <rect
+        id="svg_23"
+        fill="#e5e5e5"
+        height="2.789"
+        rx="1.395"
+        stroke="null"
+        width="7.52486"
+        x="59.23033"
+        y="4.07319"
+      />
+    </g>
+  </svg>
+</template>
diff --git a/packages/effects/layouts/src/widgets/preferences/icons/header-sidebar-nav.vue b/packages/effects/layouts/src/widgets/preferences/icons/header-sidebar-nav.vue
new file mode 100644
index 00000000..b44e249e
--- /dev/null
+++ b/packages/effects/layouts/src/widgets/preferences/icons/header-sidebar-nav.vue
@@ -0,0 +1,177 @@
+<template>
+  <svg
+    class="custom-radio-image"
+    fill="none"
+    height="66"
+    width="104"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+    <g>
+      <rect
+        id="svg_1"
+        fill="currentColor"
+        fill-opacity="0.02"
+        height="66"
+        rx="4"
+        stroke="null"
+        width="104"
+        x="0.13514"
+        y="0.13514"
+      />
+      <rect
+        id="svg_8"
+        fill="currentColor"
+        fill-opacity="0.08"
+        height="9.07027"
+        stroke="null"
+        width="104.07934"
+        x="-0.07419"
+        y="-0.05773"
+      />
+      <rect
+        id="svg_3"
+        fill="#b2b2b2"
+        height="1.689"
+        rx="1.395"
+        stroke="null"
+        width="6.52486"
+        x="10.08168"
+        y="3.50832"
+      />
+      <rect
+        id="svg_10"
+        fill="#b2b2b2"
+        height="4.4"
+        rx="1"
+        stroke="null"
+        width="3.925"
+        x="80.75054"
+        y="2.89362"
+      />
+      <rect
+        id="svg_11"
+        fill="#b2b2b2"
+        height="4.4"
+        rx="1"
+        stroke="null"
+        width="3.925"
+        x="87.58249"
+        y="2.89362"
+      />
+      <path
+        id="svg_12"
+        d="m98.19822,2.872c0,-0.54338 0.45662,-1 1,-1l1.925,0c0.54338,0 1,0.45662 1,1l0,2.4c0,0.54338 -0.45662,1 -1,1l-1.925,0c-0.54338,0 -1,-0.45662 -1,-1l0,-2.4z"
+        fill="#ffffff"
+        opacity="undefined"
+        stroke="null"
+      />
+      <rect
+        id="svg_13"
+        fill="currentColor"
+        fill-opacity="0.08"
+        height="21.51892"
+        rx="2"
+        stroke="null"
+        width="44.13071"
+        x="53.37873"
+        y="13.45652"
+      />
+      <path
+        id="svg_14"
+        d="m19.4393,15.74245c0,-1.08676 0.79001,-2 1.73013,-2l23.18605,0c0.94011,0 1.73013,0.91324 1.73013,2l0,17.24865c0,1.08676 -0.79001,2 -1.73013,2l-23.18605,0c-0.94011,0 -1.73013,-0.91324 -1.73013,-2l0,-17.24865z"
+        fill="currentColor"
+        fill-opacity="0.08"
+        opacity="undefined"
+        stroke="null"
+      />
+      <rect
+        id="svg_15"
+        fill="currentColor"
+        fill-opacity="0.08"
+        height="21.65405"
+        rx="2"
+        stroke="null"
+        width="78.39372"
+        x="19.93575"
+        y="39.34689"
+      />
+      <rect
+        id="svg_21"
+        fill="#e5e5e5"
+        height="2.789"
+        rx="1.395"
+        stroke="null"
+        width="7.52486"
+        x="28.14924"
+        y="3.07319"
+      />
+      <rect
+        id="svg_22"
+        fill="#e5e5e5"
+        height="2.789"
+        rx="1.395"
+        stroke="null"
+        width="7.52486"
+        x="41.25735"
+        y="3.20832"
+      />
+      <rect
+        id="svg_23"
+        fill="#e5e5e5"
+        height="2.789"
+        rx="1.395"
+        stroke="null"
+        width="7.52486"
+        x="54.23033"
+        y="3.07319"
+      />
+      <rect
+        id="svg_4"
+        fill="#ffffff"
+        height="5.13843"
+        rx="2"
+        stroke="null"
+        width="5.78397"
+        x="1.5327"
+        y="1.081"
+      />
+      <rect
+        id="svg_5"
+        fill="hsl(var(--primary))"
+        height="56.81191"
+        stroke="null"
+        width="15.44642"
+        x="-0.06423"
+        y="9.03113"
+      />
+      <path
+        id="svg_2"
+        d="m2.38669,15.38074c0,-0.20384 0.27195,-0.37513 0.59557,-0.37513l7.98149,0c0.32362,0 0.59557,0.17129 0.59557,0.37513l0,3.23525c0,0.20384 -0.27195,0.37513 -0.59557,0.37513l-7.98149,0c-0.32362,0 -0.59557,-0.17129 -0.59557,-0.37513l0,-3.23525z"
+        fill="#fff"
+        opacity="undefined"
+        stroke="null"
+      />
+      <path
+        id="svg_6"
+        d="m2.38669,28.43336c0,-0.20384 0.27195,-0.37513 0.59557,-0.37513l7.98149,0c0.32362,0 0.59557,0.17129 0.59557,0.37513l0,3.23525c0,0.20384 -0.27195,0.37513 -0.59557,0.37513l-7.98149,0c-0.32362,0 -0.59557,-0.17129 -0.59557,-0.37513l0,-3.23525z"
+        fill="#fff"
+        opacity="undefined"
+        stroke="null"
+      />
+      <path
+        id="svg_7"
+        d="m2.17616,41.27545c0,-0.20384 0.27195,-0.37513 0.59557,-0.37513l7.98149,0c0.32362,0 0.59557,0.17129 0.59557,0.37513l0,3.23525c0,0.20384 -0.27195,0.37513 -0.59557,0.37513l-7.98149,0c-0.32362,0 -0.59557,-0.17129 -0.59557,-0.37513l0,-3.23525z"
+        fill="#fff"
+        opacity="undefined"
+        stroke="null"
+      />
+      <path
+        id="svg_9"
+        d="m2.17616,54.32806c0,-0.20384 0.27195,-0.37513 0.59557,-0.37513l7.98149,0c0.32362,0 0.59557,0.17129 0.59557,0.37513l0,3.23525c0,0.20384 -0.27195,0.37513 -0.59557,0.37513l-7.98149,0c-0.32362,0 -0.59557,-0.17129 -0.59557,-0.37513l0,-3.23525z"
+        fill="#fff"
+        opacity="undefined"
+        stroke="null"
+      />
+    </g>
+  </svg>
+</template>
diff --git a/packages/effects/layouts/src/widgets/preferences/icons/index.ts b/packages/effects/layouts/src/widgets/preferences/icons/index.ts
index c0c5a28e..7eec1b47 100644
--- a/packages/effects/layouts/src/widgets/preferences/icons/index.ts
+++ b/packages/effects/layouts/src/widgets/preferences/icons/index.ts
@@ -2,6 +2,8 @@ import HeaderNav from './header-nav.vue';
 
 export { default as ContentCompact } from './content-compact.vue';
 export { default as FullContent } from './full-content.vue';
+export { default as HeaderMixedNav } from './header-mixed-nav.vue';
+export { default as HeaderSidebarNav } from './header-sidebar-nav.vue';
 export { default as MixedNav } from './mixed-nav.vue';
 export { default as SidebarMixedNav } from './sidebar-mixed-nav.vue';
 export { default as SidebarNav } from './sidebar-nav.vue';
diff --git a/packages/effects/layouts/src/widgets/preferences/index.ts b/packages/effects/layouts/src/widgets/preferences/index.ts
index 0a7d32cc..2c737d5a 100644
--- a/packages/effects/layouts/src/widgets/preferences/index.ts
+++ b/packages/effects/layouts/src/widgets/preferences/index.ts
@@ -1,3 +1,3 @@
-export { default as Preferences } from './preferences.vue';
 export { default as PreferencesButton } from './preferences-button.vue';
+export { default as Preferences } from './preferences.vue';
 export * from './use-open-preferences';
diff --git a/packages/effects/layouts/src/widgets/preferences/preferences-button.vue b/packages/effects/layouts/src/widgets/preferences/preferences-button.vue
index 29e110d3..d3703b84 100644
--- a/packages/effects/layouts/src/widgets/preferences/preferences-button.vue
+++ b/packages/effects/layouts/src/widgets/preferences/preferences-button.vue
@@ -1,5 +1,8 @@
 <script lang="ts" setup>
+import { ref } from 'vue';
+
 import { Settings } from '@vben/icons';
+
 import { VbenIconButton } from '@vben-core/shadcn-ui';
 
 import Preferences from './preferences.vue';
@@ -9,11 +12,20 @@ const emit = defineEmits<{ clearPreferencesAndLogout: [] }>();
 function clearPreferencesAndLogout() {
   emit('clearPreferencesAndLogout');
 }
+
+const preferencesRef = ref<InstanceType<typeof Preferences> | null>(null);
 </script>
+
 <template>
-  <Preferences @clear-preferences-and-logout="clearPreferencesAndLogout">
-    <VbenIconButton>
-      <Settings class="text-foreground size-4" />
+  <Preferences
+    ref="preferencesRef"
+    @clear-preferences-and-logout="clearPreferencesAndLogout"
+  >
+    <VbenIconButton
+      class="hover:animate-[shrink_0.3s_ease-in-out]"
+      @click="preferencesRef?.open()"
+    >
+      <Settings class="size-4 text-foreground" />
     </VbenIconButton>
   </Preferences>
 </template>
diff --git a/packages/effects/layouts/src/widgets/preferences/preferences-drawer.vue b/packages/effects/layouts/src/widgets/preferences/preferences-drawer.vue
index 4ae09130..c1b6ec8e 100644
--- a/packages/effects/layouts/src/widgets/preferences/preferences-drawer.vue
+++ b/packages/effects/layouts/src/widgets/preferences/preferences-drawer.vue
@@ -1,27 +1,32 @@
 <script setup lang="ts">
 import type { SupportedLanguagesType } from '@vben/locales';
+import type { CustomPreferencesRecord } from '@vben/preferences';
 import type {
   BreadcrumbStyleType,
   BuiltinThemeType,
   ContentCompactType,
+  LayoutHeaderMenuAlignType,
   LayoutHeaderModeType,
   LayoutType,
   NavigationStyleType,
   PreferencesButtonPositionType,
   ThemeModeType,
 } from '@vben/types';
+
 import type { SegmentedItem } from '@vben-core/shadcn-ui';
 
 import { computed, ref } from 'vue';
 
-import { Copy, RotateCw } from '@vben/icons';
+import { Copy, Pin, PinOff, RotateCw } from '@vben/icons';
 import { $t, loadLocaleMessages } from '@vben/locales';
 import {
-  clearPreferencesCache,
+  clearCache,
   preferences,
   resetPreferences,
+  updateCustomPreferences,
   usePreferences,
 } from '@vben/preferences';
+
 import { useVbenDrawer } from '@vben-core/popup-ui';
 import {
   VbenButton,
@@ -40,6 +45,8 @@ import {
   ColorMode,
   Content,
   Copyright,
+  Custom,
+  FontSize,
   Footer,
   General,
   GlobalShortcutKeys,
@@ -58,13 +65,21 @@ const emit = defineEmits<{ clearPreferencesAndLogout: [] }>();
 const message = globalShareState.getMessage();
 
 const appLocale = defineModel<SupportedLanguagesType>('appLocale');
+const appTimezone = defineModel<string>('appTimezone');
 const appDynamicTitle = defineModel<boolean>('appDynamicTitle');
 const appLayout = defineModel<LayoutType>('appLayout');
 const appColorGrayMode = defineModel<boolean>('appColorGrayMode');
 const appColorWeakMode = defineModel<boolean>('appColorWeakMode');
 const appContentCompact = defineModel<ContentCompactType>('appContentCompact');
 const appWatermark = defineModel<boolean>('appWatermark');
+const appWatermarkContent = defineModel<string>('appWatermarkContent');
 const appEnableCheckUpdates = defineModel<boolean>('appEnableCheckUpdates');
+const appEnableCopyPreferences = defineModel<boolean>(
+  'appEnableCopyPreferences',
+);
+const appEnableStickyPreferencesNavigationBar = defineModel<boolean>(
+  'appEnableStickyPreferencesNavigationBar',
+);
 const appPreferencesButtonPosition = defineModel<PreferencesButtonPositionType>(
   'appPreferencesButtonPosition',
 );
@@ -78,11 +93,14 @@ const themeColorPrimary = defineModel<string>('themeColorPrimary');
 const themeBuiltinType = defineModel<BuiltinThemeType>('themeBuiltinType');
 const themeMode = defineModel<ThemeModeType>('themeMode');
 const themeRadius = defineModel<string>('themeRadius');
+const themeFontSize = defineModel<number>('themeFontSize');
 const themeSemiDarkSidebar = defineModel<boolean>('themeSemiDarkSidebar');
+const themeSemiDarkSidebarSub = defineModel<boolean>('themeSemiDarkSidebarSub');
 const themeSemiDarkHeader = defineModel<boolean>('themeSemiDarkHeader');
 
 const sidebarEnable = defineModel<boolean>('sidebarEnable');
 const sidebarWidth = defineModel<number>('sidebarWidth');
+const sidebarDraggable = defineModel<boolean>('sidebarDraggable');
 const sidebarCollapsed = defineModel<boolean>('sidebarCollapsed');
 const sidebarCollapsedShowTitle = defineModel<boolean>(
   'sidebarCollapsedShowTitle',
@@ -90,10 +108,13 @@ const sidebarCollapsedShowTitle = defineModel<boolean>(
 const sidebarAutoActivateChild = defineModel<boolean>(
   'sidebarAutoActivateChild',
 );
-const SidebarExpandOnHover = defineModel<boolean>('sidebarExpandOnHover');
-
+const sidebarExpandOnHover = defineModel<boolean>('sidebarExpandOnHover');
+const sidebarCollapsedButton = defineModel<boolean>('sidebarCollapsedButton');
+const sidebarFixedButton = defineModel<boolean>('sidebarFixedButton');
 const headerEnable = defineModel<boolean>('headerEnable');
 const headerMode = defineModel<LayoutHeaderModeType>('headerMode');
+const headerMenuAlign =
+  defineModel<LayoutHeaderMenuAlignType>('headerMenuAlign');
 
 const breadcrumbEnable = defineModel<boolean>('breadcrumbEnable');
 const breadcrumbShowIcon = defineModel<boolean>('breadcrumbShowIcon');
@@ -108,9 +129,14 @@ const tabbarShowIcon = defineModel<boolean>('tabbarShowIcon');
 const tabbarShowMore = defineModel<boolean>('tabbarShowMore');
 const tabbarShowMaximize = defineModel<boolean>('tabbarShowMaximize');
 const tabbarPersist = defineModel<boolean>('tabbarPersist');
+const tabbarVisitHistory = defineModel<boolean>('tabbarVisitHistory');
 const tabbarDraggable = defineModel<boolean>('tabbarDraggable');
 const tabbarWheelable = defineModel<boolean>('tabbarWheelable');
 const tabbarStyleType = defineModel<string>('tabbarStyleType');
+const tabbarMaxCount = defineModel<number>('tabbarMaxCount');
+const tabbarMiddleClickToClose = defineModel<boolean>(
+  'tabbarMiddleClickToClose',
+);
 
 const navigationStyleType = defineModel<NavigationStyleType>(
   'navigationStyleType',
@@ -140,26 +166,53 @@ const shortcutKeysGlobalSearch = defineModel<boolean>(
 const shortcutKeysGlobalLogout = defineModel<boolean>(
   'shortcutKeysGlobalLogout',
 );
+const shortcutKeysGlobalEscape = defineModel<boolean>(
+  'shortcutKeysGlobalEscape',
+);
 
 const shortcutKeysGlobalLockScreen = defineModel<boolean>(
   'shortcutKeysGlobalLockScreen',
 );
 
-const widgetGlobalSearch = defineModel<boolean>('widgetGlobalSearch');
-const widgetFullscreen = defineModel<boolean>('widgetFullscreen');
-const widgetLanguageToggle = defineModel<boolean>('widgetLanguageToggle');
-const widgetNotification = defineModel<boolean>('widgetNotification');
-const widgetThemeToggle = defineModel<boolean>('widgetThemeToggle');
-const widgetSidebarToggle = defineModel<boolean>('widgetSidebarToggle');
-const widgetLockScreen = defineModel<boolean>('widgetLockScreen');
-const widgetRefresh = defineModel<boolean>('widgetRefresh');
+const widgetGlobalSearchButtonPosition = defineModel<string>(
+  'widgetGlobalSearchButtonPosition',
+);
+const widgetFullscreenButtonPosition = defineModel<string>(
+  'widgetFullscreenButtonPosition',
+);
+const widgetLanguageToggleButtonPosition = defineModel<string>(
+  'widgetLanguageToggleButtonPosition',
+);
+const widgetNotificationButtonPosition = defineModel<string>(
+  'widgetNotificationButtonPosition',
+);
+const widgetThemeToggleButtonPosition = defineModel<string>(
+  'widgetThemeToggleButtonPosition',
+);
+const widgetLockScreenButtonPosition = defineModel<string>(
+  'widgetLockScreenButtonPosition',
+);
+const widgetLogoutButtonPosition = defineModel<string>(
+  'widgetLogoutButtonPosition',
+);
+const widgetOrder = defineModel<string[]>('widgetOrder', { required: true });
+const widgetRefreshButtonPosition = defineModel<string>(
+  'widgetRefreshButtonPosition',
+);
+const widgetTimezoneButtonPosition = defineModel<string>(
+  'widgetTimezoneButtonPosition',
+);
 
 const {
+  customPreferences,
+  diffCustomPreference,
   diffPreference,
   isDark,
   isFullContent,
   isHeaderNav,
+  isHeaderSidebarNav,
   isMixedNav,
+  preferencesExtension,
   isSideMixedNav,
   isSideMode,
   isSideNav,
@@ -170,8 +223,42 @@ const [Drawer] = useVbenDrawer();
 
 const activeTab = ref('appearance');
 
+const customPreferencesTab = computed(() => {
+  return preferencesExtension.value;
+});
+
+const customTabLabel = computed(() => {
+  return customPreferencesTab.value?.tabLabel
+    ? $t(customPreferencesTab.value.tabLabel)
+    : '';
+});
+
+const customTabTitle = computed(() => {
+  const title =
+    customPreferencesTab.value?.title || customPreferencesTab.value?.tabLabel;
+  return title ? $t(title) : '';
+});
+
+const mergedDiffPreference = computed(() => {
+  const result: Record<string, unknown> = {};
+
+  if (diffPreference.value) {
+    Object.assign(result, diffPreference.value);
+  }
+
+  if (diffCustomPreference.value) {
+    result.custom = diffCustomPreference.value;
+  }
+
+  return Object.keys(result).length > 0 ? result : undefined;
+});
+
+const showCustomTab = computed(() => {
+  return (customPreferencesTab.value?.fields.length ?? 0) > 0;
+});
+
 const tabs = computed((): SegmentedItem[] => {
-  return [
+  const items: SegmentedItem[] = [
     {
       label: $t('preferences.appearance'),
       value: 'appearance',
@@ -189,6 +276,15 @@ const tabs = computed((): SegmentedItem[] => {
       value: 'general',
     },
   ];
+
+  if (showCustomTab.value) {
+    items.push({
+      label: customTabLabel.value,
+      value: 'custom',
+    });
+  }
+
+  return items;
 });
 
 const showBreadcrumbConfig = computed(() => {
@@ -201,7 +297,7 @@ const showBreadcrumbConfig = computed(() => {
 });
 
 async function handleCopy() {
-  await copy(JSON.stringify(diffPreference.value, null, 2));
+  await copy(JSON.stringify(mergedDiffPreference.value, null, 2));
 
   message.copyPreferencesSuccess?.(
     $t('preferences.copyPreferencesSuccessTitle'),
@@ -210,18 +306,22 @@ async function handleCopy() {
 }
 
 async function handleClearCache() {
-  resetPreferences();
-  clearPreferencesCache();
+  await resetPreferences();
+  await clearCache();
   emit('clearPreferencesAndLogout');
 }
 
 async function handleReset() {
-  if (!diffPreference.value) {
+  if (!mergedDiffPreference.value) {
     return;
   }
-  resetPreferences();
+  await resetPreferences();
   await loadLocaleMessages(preferences.app.locale);
 }
+
+function handleCustomPreferencesUpdate(updates: CustomPreferencesRecord) {
+  updateCustomPreferences(updates);
+}
 </script>
 
 <template>
@@ -229,33 +329,62 @@ async function handleReset() {
     <Drawer
       :description="$t('preferences.subtitle')"
       :title="$t('preferences.title')"
-      class="sm:max-w-sm"
+      class="border-0! sm:max-w-sm"
     >
       <template #extra>
         <div class="flex items-center">
           <VbenIconButton
-            :disabled="!diffPreference"
+            :disabled="!mergedDiffPreference"
             :tooltip="$t('preferences.resetTip')"
             class="relative"
+            @click="handleReset"
           >
             <span
-              v-if="diffPreference"
-              class="bg-primary absolute right-0.5 top-0.5 h-2 w-2 rounded"
+              v-if="mergedDiffPreference"
+              class="absolute top-0.5 right-0.5 size-2 rounded-sm bg-primary"
             ></span>
-            <RotateCw class="size-4" @click="handleReset" />
+            <RotateCw class="size-4" />
+          </VbenIconButton>
+          <VbenIconButton
+            :tooltip="
+              appEnableStickyPreferencesNavigationBar
+                ? $t('preferences.disableStickyPreferencesNavigationBar')
+                : $t('preferences.enableStickyPreferencesNavigationBar')
+            "
+            class="relative"
+            @click="
+              () =>
+                (appEnableStickyPreferencesNavigationBar =
+                  !appEnableStickyPreferencesNavigationBar)
+            "
+          >
+            <PinOff
+              v-if="appEnableStickyPreferencesNavigationBar"
+              class="size-4"
+            />
+            <Pin v-else class="size-4" />
           </VbenIconButton>
         </div>
       </template>
 
-      <div class="p-1">
-        <VbenSegmented v-model="activeTab" :tabs="tabs">
+      <div>
+        <VbenSegmented
+          v-model="activeTab"
+          :tabs="tabs"
+          :class="{
+            'sticky-tabs-header': appEnableStickyPreferencesNavigationBar,
+          }"
+        >
           <template #general>
             <Block :title="$t('preferences.general')">
               <General
                 v-model:app-dynamic-title="appDynamicTitle"
                 v-model:app-enable-check-updates="appEnableCheckUpdates"
+                v-model:app-enable-copy-preferences="appEnableCopyPreferences"
                 v-model:app-locale="appLocale"
+                v-model:app-timezone="appTimezone"
                 v-model:app-watermark="appWatermark"
+                v-model:app-watermark-content="appWatermarkContent"
               />
             </Block>
 
@@ -274,6 +403,7 @@ async function handleReset() {
                 v-model="themeMode"
                 v-model:theme-semi-dark-header="themeSemiDarkHeader"
                 v-model:theme-semi-dark-sidebar="themeSemiDarkSidebar"
+                v-model:theme-semi-dark-sidebar-sub="themeSemiDarkSidebarSub"
               />
             </Block>
             <Block :title="$t('preferences.theme.builtin.title')">
@@ -286,6 +416,9 @@ async function handleReset() {
             <Block :title="$t('preferences.theme.radius')">
               <Radius v-model="themeRadius" />
             </Block>
+            <Block :title="$t('preferences.theme.fontSize')">
+              <FontSize v-model="themeFontSize" />
+            </Block>
             <Block :title="$t('preferences.other')">
               <ColorMode
                 v-model:app-color-gray-mode="appColorGrayMode"
@@ -304,11 +437,14 @@ async function handleReset() {
             <Block :title="$t('preferences.sidebar.title')">
               <Sidebar
                 v-model:sidebar-auto-activate-child="sidebarAutoActivateChild"
+                v-model:sidebar-draggable="sidebarDraggable"
                 v-model:sidebar-collapsed="sidebarCollapsed"
                 v-model:sidebar-collapsed-show-title="sidebarCollapsedShowTitle"
                 v-model:sidebar-enable="sidebarEnable"
-                v-model:sidebar-expand-on-hover="SidebarExpandOnHover"
+                v-model:sidebar-expand-on-hover="sidebarExpandOnHover"
                 v-model:sidebar-width="sidebarWidth"
+                v-model:sidebar-collapsed-button="sidebarCollapsedButton"
+                v-model:sidebar-fixed-button="sidebarFixedButton"
                 :current-layout="appLayout"
                 :disabled="!isSideMode"
               />
@@ -317,6 +453,7 @@ async function handleReset() {
             <Block :title="$t('preferences.header.title')">
               <Header
                 v-model:header-enable="headerEnable"
+                v-model:header-menu-align="headerMenuAlign"
                 v-model:header-mode="headerMode"
                 :disabled="isFullContent"
               />
@@ -340,7 +477,8 @@ async function handleReset() {
                 v-model:breadcrumb-show-icon="breadcrumbShowIcon"
                 v-model:breadcrumb-style-type="breadcrumbStyleType"
                 :disabled="
-                  !showBreadcrumbConfig || !(isSideNav || isSideMixedNav)
+                  !showBreadcrumbConfig ||
+                  !(isSideNav || isSideMixedNav || isHeaderSidebarNav)
                 "
               />
             </Block>
@@ -349,11 +487,14 @@ async function handleReset() {
                 v-model:tabbar-draggable="tabbarDraggable"
                 v-model:tabbar-enable="tabbarEnable"
                 v-model:tabbar-persist="tabbarPersist"
+                v-model:tabbar-visit-history="tabbarVisitHistory"
                 v-model:tabbar-show-icon="tabbarShowIcon"
                 v-model:tabbar-show-maximize="tabbarShowMaximize"
                 v-model:tabbar-show-more="tabbarShowMore"
                 v-model:tabbar-style-type="tabbarStyleType"
                 v-model:tabbar-wheelable="tabbarWheelable"
+                v-model:tabbar-max-count="tabbarMaxCount"
+                v-model:tabbar-middle-click-to-close="tabbarMiddleClickToClose"
               />
             </Block>
             <Block :title="$t('preferences.widget.title')">
@@ -361,14 +502,34 @@ async function handleReset() {
                 v-model:app-preferences-button-position="
                   appPreferencesButtonPosition
                 "
-                v-model:widget-fullscreen="widgetFullscreen"
-                v-model:widget-global-search="widgetGlobalSearch"
-                v-model:widget-language-toggle="widgetLanguageToggle"
-                v-model:widget-lock-screen="widgetLockScreen"
-                v-model:widget-notification="widgetNotification"
-                v-model:widget-refresh="widgetRefresh"
-                v-model:widget-sidebar-toggle="widgetSidebarToggle"
-                v-model:widget-theme-toggle="widgetThemeToggle"
+                v-model:widget-fullscreen-button-position="
+                  widgetFullscreenButtonPosition
+                "
+                v-model:widget-global-search-button-position="
+                  widgetGlobalSearchButtonPosition
+                "
+                v-model:widget-language-toggle-button-position="
+                  widgetLanguageToggleButtonPosition
+                "
+                v-model:widget-lock-screen-button-position="
+                  widgetLockScreenButtonPosition
+                "
+                v-model:widget-logout-button-position="
+                  widgetLogoutButtonPosition
+                "
+                v-model:widget-order="widgetOrder"
+                v-model:widget-notification-button-position="
+                  widgetNotificationButtonPosition
+                "
+                v-model:widget-refresh-button-position="
+                  widgetRefreshButtonPosition
+                "
+                v-model:widget-theme-toggle-button-position="
+                  widgetThemeToggleButtonPosition
+                "
+                v-model:widget-timezone-button-position="
+                  widgetTimezoneButtonPosition
+                "
               />
             </Block>
             <Block :title="$t('preferences.footer.title')">
@@ -400,6 +561,16 @@ async function handleReset() {
                 v-model:shortcut-keys-global-search="shortcutKeysGlobalSearch"
                 v-model:shortcut-keys-lock-screen="shortcutKeysGlobalLockScreen"
                 v-model:shortcut-keys-logout="shortcutKeysGlobalLogout"
+                v-model:shortcut-keys-escape="shortcutKeysGlobalEscape"
+              />
+            </Block>
+          </template>
+          <template #custom>
+            <Block :title="customTabTitle">
+              <Custom
+                :fields="customPreferencesTab?.fields || []"
+                :values="customPreferences"
+                @update="handleCustomPreferencesUpdate"
               />
             </Block>
           </template>
@@ -408,7 +579,8 @@ async function handleReset() {
 
       <template #footer>
         <VbenButton
-          :disabled="!diffPreference"
+          v-if="appEnableCopyPreferences"
+          :disabled="!mergedDiffPreference"
           class="mx-4 w-full"
           size="sm"
           variant="default"
@@ -418,7 +590,7 @@ async function handleReset() {
           {{ $t('preferences.copyPreferences') }}
         </VbenButton>
         <VbenButton
-          :disabled="!diffPreference"
+          :disabled="!mergedDiffPreference"
           class="mr-4 w-full"
           size="sm"
           variant="ghost"
@@ -430,3 +602,9 @@ async function handleReset() {
     </Drawer>
   </div>
 </template>
+
+<style scoped>
+:deep(.sticky-tabs-header [role='tablist']) {
+  @apply -top-3 z-9999 sticky;
+}
+</style>
diff --git a/packages/effects/layouts/src/widgets/preferences/preferences.vue b/packages/effects/layouts/src/widgets/preferences/preferences.vue
index 9479adb2..ef2e41cf 100644
--- a/packages/effects/layouts/src/widgets/preferences/preferences.vue
+++ b/packages/effects/layouts/src/widgets/preferences/preferences.vue
@@ -5,15 +5,32 @@ import { Settings } from '@vben/icons';
 import { $t, loadLocaleMessages } from '@vben/locales';
 import { preferences, updatePreferences } from '@vben/preferences';
 import { capitalizeFirstLetter } from '@vben/utils';
+
 import { useVbenDrawer } from '@vben-core/popup-ui';
 import { VbenButton } from '@vben-core/shadcn-ui';
 
 import PreferencesDrawer from './preferences-drawer.vue';
 
+interface Props {
+  /** 是否显示按钮 */
+  showButton?: boolean;
+}
+
+const props = withDefaults(defineProps<Props>(), {
+  showButton: true,
+});
+
+const emit = defineEmits<{ clearPreferencesAndLogout: [] }>();
+
 const [Drawer, drawerApi] = useVbenDrawer({
   connectedComponent: PreferencesDrawer,
 });
 
+// 暴露打开抽屉的方法
+defineExpose({
+  open: () => drawerApi.open(),
+});
+
 /**
  * preferences 转成 vue props
  * preferences.widget.fullscreen=>widgetFullscreen
@@ -55,17 +72,22 @@ const listen = computed(() => {
 </script>
 <template>
   <div>
-    <Drawer v-bind="{ ...$attrs, ...attrs }" v-on="listen" />
+    <Drawer
+      v-bind="{ ...$attrs, ...attrs }"
+      v-on="listen"
+      @clear-preferences-and-logout="emit('clearPreferencesAndLogout')"
+    />
 
-    <div @click="() => drawerApi.open()">
-      <slot>
-        <VbenButton
-          :title="$t('preferences.title')"
-          class="bg-primary flex-col-center size-10 cursor-pointer rounded-l-lg rounded-r-none border-none"
-        >
-          <Settings class="size-5" />
-        </VbenButton>
-      </slot>
-    </div>
+    <!-- 触发打开抽屉的按钮(可覆盖) -->
+    <slot>
+      <VbenButton
+        v-if="props.showButton"
+        :title="$t('preferences.title')"
+        class="flex-col-center size-10 cursor-pointer rounded-l-lg rounded-r-none border-none bg-primary"
+        @click="() => drawerApi.open()"
+      >
+        <Settings class="size-5" />
+      </VbenButton>
+    </slot>
   </div>
 </template>
diff --git a/packages/effects/layouts/src/widgets/theme-toggle/theme-button.vue b/packages/effects/layouts/src/widgets/theme-toggle/theme-button.vue
index 77f330c5..178f9776 100644
--- a/packages/effects/layouts/src/widgets/theme-toggle/theme-button.vue
+++ b/packages/effects/layouts/src/widgets/theme-toggle/theme-button.vue
@@ -41,7 +41,7 @@ const bindProps = computed(() => {
 
 function toggleTheme(event: MouseEvent) {
   const isAppearanceTransition =
-    // @ts-expect-error
+    // @ts-expect-error - startViewTransition is not available in the current DOM lib target
     document.startViewTransition &&
     !window.matchMedia('(prefers-reduced-motion: reduce)').matches;
   if (!isAppearanceTransition || !event) {
@@ -54,7 +54,6 @@ function toggleTheme(event: MouseEvent) {
     Math.max(x, innerWidth - x),
     Math.max(y, innerHeight - y),
   );
-  // @ts-ignore startViewTransition
   const transition = document.startViewTransition(async () => {
     isDark.value = !isDark.value;
     await nextTick();
@@ -64,9 +63,9 @@ function toggleTheme(event: MouseEvent) {
       `circle(0px at ${x}px ${y}px)`,
       `circle(${endRadius}px at ${x}px ${y}px)`,
     ];
-    document.documentElement.animate(
+    const animate = document.documentElement.animate(
       {
-        clipPath: isDark.value ? [...clipPath].reverse() : clipPath,
+        clipPath: isDark.value ? [...clipPath].toReversed() : clipPath,
       },
       {
         duration: 450,
@@ -76,6 +75,9 @@ function toggleTheme(event: MouseEvent) {
           : '::view-transition-new(root)',
       },
     );
+    animate.onfinish = () => {
+      transition.skipTransition();
+    };
   });
 }
 </script>
@@ -85,29 +87,24 @@ function toggleTheme(event: MouseEvent) {
     :aria-label="theme"
     :class="[`is-${theme}`]"
     aria-live="polite"
-    class="theme-toggle cursor-pointer border-none bg-none"
+    class="theme-toggle cursor-pointer border-none bg-none hover:animate-[shrink_0.3s_ease-in-out]"
     v-bind="bindProps"
     @click.stop="toggleTheme"
   >
     <svg aria-hidden="true" height="24" viewBox="0 0 24 24" width="24">
-      <mask
-        id="theme-toggle-moon"
-        class="theme-toggle__moon"
-        fill="hsl(var(--foreground)/80%)"
-        stroke="none"
-      >
+      <mask id="theme-toggle-moon" class="theme-toggle__moon">
         <rect fill="white" height="100%" width="100%" x="0" y="0" />
         <circle cx="40" cy="8" fill="black" r="11" />
       </mask>
       <circle
         id="sun"
-        class="theme-toggle__sun"
+        class="theme-toggle__sun fill-foreground/90"
         cx="12"
         cy="12"
         mask="url(#theme-toggle-moon)"
         r="11"
       />
-      <g class="theme-toggle__sun-beams">
+      <g class="theme-toggle__sun-beams stroke-foreground/90 stroke-2">
         <line x1="12" x2="12" y1="1" y2="3" />
         <line x1="12" x2="12" y1="21" y2="23" />
         <line x1="4.22" x2="5.64" y1="4.22" y2="5.64" />
@@ -122,64 +119,46 @@ function toggleTheme(event: MouseEvent) {
 </template>
 
 <style scoped>
-.theme-toggle {
-  &__moon {
-    & > circle {
-      transition: transform 0.5s cubic-bezier(0, 0, 0.3, 1);
-    }
-  }
+@reference "@vben/tailwind-config/theme";
 
-  &__sun {
-    @apply fill-foreground/90 stroke-none;
+.theme-toggle__moon > circle {
+  transition: transform 0.5s cubic-bezier(0, 0, 0.3, 1);
+}
 
-    transition: transform 1.6s cubic-bezier(0.25, 0, 0.2, 1);
-    transform-origin: center center;
+.theme-toggle__sun {
+  stroke: none;
+  transform-origin: center center;
+  transition: transform 1.6s cubic-bezier(0.25, 0, 0.2, 1);
+}
 
-    &:hover > svg > & {
-      @apply fill-foreground/90;
-    }
-  }
+.theme-toggle__sun-beams {
+  transform-origin: center center;
+  transition:
+    transform 1.6s cubic-bezier(0.5, 1.5, 0.75, 1.25),
+    opacity 0.6s cubic-bezier(0.25, 0, 0.3, 1);
+}
 
-  &__sun-beams {
-    @apply stroke-foreground/90 stroke-[2px];
+.theme-toggle.is-light .theme-toggle__sun {
+  @apply scale-50;
+}
 
-    transition:
-      transform 1.6s cubic-bezier(0.5, 1.5, 0.75, 1.25),
-      opacity 0.6s cubic-bezier(0.25, 0, 0.3, 1);
-    transform-origin: center center;
+.theme-toggle.is-light .theme-toggle__sun-beams {
+  transform: rotateZ(0.25turn);
+}
 
-    &:hover > svg > & {
-      @apply stroke-foreground;
-    }
-  }
+.theme-toggle.is-dark .theme-toggle__moon > circle {
+  transform: translateX(-20px);
+}
 
-  &.is-light {
-    .theme-toggle__sun {
-      @apply scale-50;
-    }
+.theme-toggle.is-dark .theme-toggle__sun-beams {
+  @apply opacity-0;
+}
 
-    .theme-toggle__sun-beams {
-      transform: rotateZ(0.25turn);
-    }
-  }
+.theme-toggle:hover > svg .theme-toggle__sun {
+  fill: hsl(var(--foreground));
+}
 
-  &.is-dark {
-    .theme-toggle__moon {
-      & > circle {
-        transform: translateX(-20px);
-      }
-    }
-
-    .theme-toggle__sun-beams {
-      @apply opacity-0;
-    }
-  }
-
-  &:hover > svg {
-    .theme-toggle__sun,
-    .theme-toggle__moon {
-      @apply fill-foreground;
-    }
-  }
+.theme-toggle:hover > svg .theme-toggle__sun-beams {
+  stroke: hsl(var(--foreground));
 }
 </style>
diff --git a/packages/effects/layouts/src/widgets/theme-toggle/theme-toggle.vue b/packages/effects/layouts/src/widgets/theme-toggle/theme-toggle.vue
index 4ddc6b8f..19c132e3 100644
--- a/packages/effects/layouts/src/widgets/theme-toggle/theme-toggle.vue
+++ b/packages/effects/layouts/src/widgets/theme-toggle/theme-toggle.vue
@@ -8,6 +8,7 @@ import {
   updatePreferences,
   usePreferences,
 } from '@vben/preferences';
+
 import {
   ToggleGroup,
   ToggleGroupItem,
@@ -24,7 +25,7 @@ withDefaults(defineProps<{ shouldOnHover?: boolean }>(), {
   shouldOnHover: false,
 });
 
-function handleChange(isDark: boolean) {
+function handleChange(isDark: boolean | undefined) {
   updatePreferences({
     theme: { mode: isDark ? 'dark' : 'light' },
   });
diff --git a/packages/effects/layouts/src/widgets/timezone/index.ts b/packages/effects/layouts/src/widgets/timezone/index.ts
new file mode 100644
index 00000000..eef486dd
--- /dev/null
+++ b/packages/effects/layouts/src/widgets/timezone/index.ts
@@ -0,0 +1 @@
+export { default as TimezoneButton } from './timezone-button.vue';
diff --git a/packages/effects/layouts/src/widgets/timezone/timezone-button.vue b/packages/effects/layouts/src/widgets/timezone/timezone-button.vue
new file mode 100644
index 00000000..5361016f
--- /dev/null
+++ b/packages/effects/layouts/src/widgets/timezone/timezone-button.vue
@@ -0,0 +1,92 @@
+<script setup lang="ts">
+import { ref, unref } from 'vue';
+
+import { createIconifyIcon } from '@vben/icons';
+import { $t } from '@vben/locales';
+import { useTimezoneStore } from '@vben/stores';
+
+import { useVbenModal } from '@vben-core/popup-ui';
+import {
+  RadioGroup,
+  RadioGroupItem,
+  VbenIconButton,
+} from '@vben-core/shadcn-ui';
+
+withDefaults(defineProps<{ showButton?: boolean }>(), { showButton: true });
+
+const TimezoneIcon = createIconifyIcon('fluent-mdl2:world-clock');
+
+const timezoneStore = useTimezoneStore();
+
+const timezoneRef = ref<string | undefined>();
+
+const timezoneOptionsRef = ref<
+  {
+    label: string;
+    value: string;
+  }[]
+>([]);
+
+const [Modal, modalApi] = useVbenModal({
+  fullscreenButton: false,
+  onConfirm: async () => {
+    try {
+      modalApi.setState({ confirmLoading: true });
+      const timezone = unref(timezoneRef);
+      if (timezone) {
+        await timezoneStore.setTimezone(timezone);
+      }
+      modalApi.close();
+    } finally {
+      modalApi.setState({ confirmLoading: false });
+    }
+  },
+  async onOpenChange(isOpen) {
+    if (isOpen) {
+      timezoneRef.value = unref(timezoneStore.timezone);
+      timezoneOptionsRef.value = await timezoneStore.getTimezoneOptions();
+    }
+  },
+});
+
+function open() {
+  modalApi.open();
+}
+
+defineExpose({ open });
+</script>
+
+<template>
+  <div>
+    <VbenIconButton
+      v-if="showButton"
+      :tooltip="$t('ui.widgets.timezone.setTimezone')"
+      class="hover:animate-[shrink_0.3s_ease-in-out]"
+      @click="open"
+    >
+      <TimezoneIcon class="size-4 text-foreground" />
+    </VbenIconButton>
+    <Modal :title="$t('ui.widgets.timezone.setTimezone')">
+      <div class="timezone-container">
+        <RadioGroup v-model="timezoneRef" class="flex flex-col gap-2">
+          <div
+            class="flex cursor-pointer items-center gap-2"
+            v-for="item in timezoneOptionsRef"
+            :key="`container${item.value}`"
+          >
+            <RadioGroupItem :id="item.value" :value="item.value" />
+            <label :for="item.value" class="cursor-pointer">{{
+              item.label
+            }}</label>
+          </div>
+        </RadioGroup>
+      </div>
+    </Modal>
+  </div>
+</template>
+
+<style scoped>
+.timezone-container {
+  @apply pl-5;
+}
+</style>
diff --git a/packages/effects/layouts/src/widgets/user-dropdown/user-dropdown.vue b/packages/effects/layouts/src/widgets/user-dropdown/user-dropdown.vue
index 14d1e6fb..e9bcaf05 100644
--- a/packages/effects/layouts/src/widgets/user-dropdown/user-dropdown.vue
+++ b/packages/effects/layouts/src/widgets/user-dropdown/user-dropdown.vue
@@ -1,15 +1,30 @@
 <script setup lang="ts">
+import type { Component } from 'vue';
+
 import type { AnyFunction } from '@vben/types';
 
-import type { Component } from 'vue';
-import { computed, useTemplateRef, watch } from 'vue';
+import { computed, ref, useTemplateRef, watch } from 'vue';
 
-import { useHoverToggle } from '@vben/hooks';
-import { LockKeyhole, LogOut } from '@vben/icons';
-import { $t } from '@vben/locales';
-import { preferences, usePreferences } from '@vben/preferences';
-import { useLockStore } from '@vben/stores';
+import { SUPPORT_LANGUAGES } from '@vben/constants';
+import { useHoverToggle, useRefresh } from '@vben/hooks';
+import {
+  createIconifyIcon,
+  Languages,
+  LockKeyhole,
+  LogOut,
+  RotateCw,
+  Search,
+  Settings,
+} from '@vben/icons';
+import { $t, loadLocaleMessages } from '@vben/locales';
+import {
+  preferences,
+  updatePreferences,
+  usePreferences,
+} from '@vben/preferences';
+import { useAccessStore } from '@vben/stores';
 import { isWindowsOs } from '@vben/utils';
+
 import { useVbenModal } from '@vben-core/popup-ui';
 import {
   Badge,
@@ -21,12 +36,19 @@ import {
   DropdownMenuShortcut,
   DropdownMenuTrigger,
   VbenAvatar,
+  VbenFullScreen,
   VbenIcon,
+  VbenIconButton,
 } from '@vben-core/shadcn-ui';
 
-import { useMagicKeys, whenever } from '@vueuse/core';
+import { useFullscreen, useMagicKeys, whenever } from '@vueuse/core';
 
+import { GlobalSearch } from '../global-search';
 import { LockScreenModal } from '../lock-screen';
+import { Notification } from '../notification';
+import { Preferences } from '../preferences';
+import { ThemeToggle } from '../theme-toggle';
+import { TimezoneButton } from '../timezone';
 
 import UpdatePasswordModal from '../../../../../../apps/web-antd/src/layouts/components/UpdatePasswordModal.vue'
 
@@ -39,14 +61,14 @@ interface Props {
    * @zh_CN 描述
    */
   description?: string;
-  /**
-   * 是否启用快捷键
-   */
-  enableShortcutKey?: boolean;
   /**
    * 菜单数组
    */
-  menus?: Array<{ handler: AnyFunction; icon?: Component; text: string }>;
+  menus?: Array<{
+    handler: AnyFunction;
+    icon?: Component | Function | string;
+    text: string;
+  }>;
 
   /**
    * 标签文本
@@ -69,20 +91,25 @@ defineOptions({
 const props = withDefaults(defineProps<Props>(), {
   avatar: '',
   description: '',
-  enableShortcutKey: true,
   menus: () => [],
-  showShortcutKey: true,
   tagText: '',
   text: '',
   trigger: 'click',
   hoverDelay: 500,
 });
 
-const emit = defineEmits<{ logout: [] }>();
+const emit = defineEmits<{ clearPreferencesAndLogout: []; logout: [] }>();
 
-const { globalLockScreenShortcutKey, globalLogoutShortcutKey } =
-  usePreferences();
-const lockStore = useLockStore();
+const {
+  globalLogoutShortcutKey,
+  globalLockScreenShortcutKey,
+  globalSearchShortcutKey,
+  isDark,
+  preferencesButtonPosition,
+} = usePreferences();
+const { refresh } = useRefresh();
+const { toggle: toggleFullscreen } = useFullscreen();
+const accessStore = useAccessStore();
 const [LockModal, lockModalApi] = useVbenModal({
   connectedComponent: LockScreenModal,
 });
@@ -94,6 +121,12 @@ const [LogoutModal, logoutModalApi] = useVbenModal({
 
 const refTrigger = useTemplateRef('refTrigger');
 const refContent = useTemplateRef('refContent');
+const refPreferences = useTemplateRef('refPreferences');
+const refGlobalSearch = useTemplateRef('refGlobalSearch');
+const refTimezone = useTemplateRef('refTimezone');
+const refNotification = useTemplateRef('refNotification');
+
+const TimezoneIcon = createIconifyIcon('fluent-mdl2:world-clock');
 const [openPopover, hoverWatcher] = useHoverToggle(
   [refTrigger, refContent],
   () => props.hoverDelay,
@@ -112,18 +145,79 @@ watch(
   },
 );
 
+const showLockInDropdown = computed(
+  () =>
+    preferences.widget.lockScreen &&
+    preferences.widget.lockScreenButtonPosition === 'user-dropdown',
+);
+
+const showLogoutInDropdown = computed(
+  () => preferences.widget.logoutButtonPosition === 'user-dropdown',
+);
+
+const showGlobalSearchInDropdown = computed(
+  () =>
+    preferences.widget.globalSearch &&
+    preferences.widget.globalSearchButtonPosition === 'user-dropdown',
+);
+
+const showThemeToggleInDropdown = computed(
+  () =>
+    preferences.widget.themeToggle &&
+    preferences.widget.themeToggleButtonPosition === 'user-dropdown',
+);
+
+const showLanguageToggleInDropdown = computed(
+  () =>
+    preferences.widget.languageToggle &&
+    preferences.widget.languageToggleButtonPosition === 'user-dropdown',
+);
+
+const showTimezoneInDropdown = computed(
+  () =>
+    preferences.widget.timezone &&
+    preferences.widget.timezoneButtonPosition === 'user-dropdown',
+);
+
+const showFullscreenInDropdown = computed(
+  () =>
+    preferences.widget.fullscreen &&
+    preferences.widget.fullscreenButtonPosition === 'user-dropdown',
+);
+
+const showNotificationInDropdown = computed(
+  () =>
+    preferences.widget.notification &&
+    preferences.widget.notificationButtonPosition === 'user-dropdown',
+);
+
+const showRefreshInDropdown = computed(
+  () =>
+    preferences.widget.refresh &&
+    preferences.widget.refreshButtonPosition === 'user-dropdown',
+);
+
+const hasAnyInDropdown = computed(
+  () =>
+    showLockInDropdown.value ||
+    showLogoutInDropdown.value ||
+    showGlobalSearchInDropdown.value ||
+    showThemeToggleInDropdown.value ||
+    showLanguageToggleInDropdown.value ||
+    showTimezoneInDropdown.value ||
+    showFullscreenInDropdown.value ||
+    showNotificationInDropdown.value ||
+    showRefreshInDropdown.value,
+);
+
 const altView = computed(() => (isWindowsOs() ? 'Alt' : '⌥'));
 
 const enableLogoutShortcutKey = computed(() => {
-  return props.enableShortcutKey && globalLogoutShortcutKey.value;
+  return showLogoutInDropdown.value && globalLogoutShortcutKey.value;
 });
 
 const enableLockScreenShortcutKey = computed(() => {
-  return props.enableShortcutKey && globalLockScreenShortcutKey.value;
-});
-
-const enableShortcutKey = computed(() => {
-  return props.enableShortcutKey && preferences.shortcutKeys.enable;
+  return showLockInDropdown.value && globalLockScreenShortcutKey.value;
 });
 
 function handleOpenLock() {
@@ -132,11 +226,10 @@ function handleOpenLock() {
 
 function handleSubmitLock(lockScreenPassword: string) {
   lockModalApi.close();
-  lockStore.lockScreen(lockScreenPassword);
+  accessStore.lockScreen(lockScreenPassword);
 }
 
 function handleLogout() {
-  // emit
   logoutModalApi.open();
   openPopover.value = false;
 }
@@ -146,19 +239,79 @@ function handleSubmitLogout() {
   logoutModalApi.close();
 }
 
-if (enableShortcutKey.value) {
-  const keys = useMagicKeys();
-  whenever(keys['Alt+KeyQ']!, () => {
-    if (enableLogoutShortcutKey.value) {
-      handleLogout();
-    }
-  });
+// 设置 - 打开偏好设置抽屉
+function handleOpenSettings() {
+  refPreferences.value?.open();
+}
 
-  whenever(keys['Alt+KeyL']!, () => {
-    if (enableLockScreenShortcutKey.value) {
-      handleOpenLock();
-    }
-  });
+// 刷新当前页面
+function handleRefresh() {
+  openPopover.value = false;
+  refresh();
+}
+
+// 搜索 - 不关闭 dropdown，直接触发 GlobalSearch 组件的弹框
+function handleGlobalSearch() {
+  refGlobalSearch.value?.open();
+}
+
+// 主题切换
+function handleThemeToggleSelect(event?: Event) {
+  event?.preventDefault();
+  updatePreferences({ theme: { mode: isDark.value ? 'light' : 'dark' } });
+}
+
+// 时区
+function handleTimezoneSelect() {
+  refTimezone.value?.open();
+}
+
+// 全屏切换
+function handleFullscreenSelect() {
+  toggleFullscreen();
+}
+
+// 通知
+function handleNotificationSelect(event?: Event) {
+  event?.preventDefault();
+  refNotification.value?.toggle();
+}
+
+// 语言切换 - 阻止 Radix 默认关闭外层 dropdown，就地展开/收起 locale 列表
+const showLanguageList = ref(false);
+function handleLanguageToggleSelect(event?: Event) {
+  event?.preventDefault();
+  showLanguageList.value = !showLanguageList.value;
+}
+async function handleLocaleChange(event: Event, value: 'en-US' | 'zh-CN') {
+  // 阻止默认关闭，让用户能继续看到选择结果；选完手动收起
+  event.preventDefault();
+  updatePreferences({ app: { locale: value } });
+  await loadLocaleMessages(value);
+  showLanguageList.value = false;
+  openPopover.value = false;
+}
+
+if (preferences.shortcutKeys.enable) {
+  const keys = useMagicKeys();
+  const logoutKey = keys['Alt+KeyQ'];
+  const lockKey = keys['Alt+KeyL'];
+
+  if (logoutKey) {
+    whenever(logoutKey, () => {
+      if (enableLogoutShortcutKey.value) {
+        handleLogout();
+      }
+    });
+  }
+
+  if (lockKey) {
+    whenever(lockKey, () => {
+      if (enableLockScreenShortcutKey.value) {
+        handleOpenLock();
+      }
+    });
+  }
 }
 
 /**
@@ -172,13 +325,14 @@ const [UpdatePasswordModals, UpdatePasswordModalApi] = useVbenModal({
 <template>
   <UpdatePasswordModals />
   <LockModal
-    v-if="preferences.widget.lockScreen"
+    v-if="showLockInDropdown"
     :avatar="avatar"
     :text="text"
     @submit="handleSubmitLock"
   />
 
   <LogoutModal
+    v-if="showLogoutInDropdown"
     :cancel-text="$t('common.cancel')"
     :confirm-text="$t('common.confirm')"
     :fullscreen-button="false"
@@ -191,15 +345,36 @@ const [UpdatePasswordModals, UpdatePasswordModalApi] = useVbenModal({
     {{ $t('ui.widgets.logoutTip') }}
   </LogoutModal>
 
-  <DropdownMenu v-model:open="openPopover">
+  <Preferences
+    v-if="preferencesButtonPosition.userDropdown"
+    ref="refPreferences"
+    :show-button="false"
+    @clear-preferences-and-logout="emit('clearPreferencesAndLogout')"
+  />
+
+  <GlobalSearch
+    v-if="showGlobalSearchInDropdown"
+    ref="refGlobalSearch"
+    :enable-shortcut-key="globalSearchShortcutKey"
+    :menus="accessStore.accessMenus"
+    :show-button="false"
+  />
+
+  <TimezoneButton
+    v-if="showTimezoneInDropdown"
+    ref="refTimezone"
+    :show-button="false"
+  />
+
+  <DropdownMenu v-model:open="openPopover" :modal="false">
     <DropdownMenuTrigger ref="refTrigger" :disabled="props.trigger === 'hover'">
-      <div class="hover:bg-accent ml-1 mr-2 cursor-pointer rounded-full p-1.5">
-        <div class="hover:text-accent-foreground flex-center">
+      <div class="mr-2 ml-1 cursor-pointer rounded-full p-1.5 hover:bg-accent">
+        <div class="flex-center hover:text-accent-foreground">
           <VbenAvatar :alt="text" :src="avatar" class="size-8" dot />
         </div>
       </div>
     </DropdownMenuTrigger>
-    <DropdownMenuContent class="mr-2 min-w-[240px] p-0 pb-1">
+    <DropdownMenuContent class="mr-2 min-w-60 p-0 pb-1">
       <div ref="refContent">
         <DropdownMenuLabel class="flex items-center p-3">
           <VbenAvatar
@@ -212,16 +387,20 @@ const [UpdatePasswordModals, UpdatePasswordModalApi] = useVbenModal({
           <div class="ml-2 w-full">
             <div
               v-if="tagText || text || $slots.tagText"
-              class="text-foreground mb-1 flex items-center text-sm font-medium"
+              class="mb-1 flex items-center text-sm font-medium text-foreground"
             >
               {{ text }}
               <slot name="tagText">
-                <Badge v-if="tagText" class="ml-2 text-green-400">
+                <Badge
+                  v-if="tagText"
+                  variant="secondary"
+                  class="ml-2 text-green-400"
+                >
                   {{ tagText }}
                 </Badge>
               </slot>
             </div>
-            <div class="text-muted-foreground text-xs font-normal">
+            <div class="text-xs font-normal text-muted-foreground">
               {{ description }}
             </div>
           </div>
@@ -242,31 +421,146 @@ const [UpdatePasswordModals, UpdatePasswordModalApi] = useVbenModal({
           class="mx-1 flex cursor-pointer items-center rounded-sm py-1 leading-8"
           @click="menu.handler"
         >
-          <VbenIcon :icon="menu.icon" class="mr-2 size-4" />
+          <VbenIconButton class="mr-2" @click="menu.handler">
+            <VbenIcon :icon="menu.icon" class="size-4" />
+          </VbenIconButton>
           {{ menu.text }}
         </DropdownMenuItem>
-        <DropdownMenuSeparator />
-        <DropdownMenuItem
-          v-if="preferences.widget.lockScreen"
-          class="mx-1 flex cursor-pointer items-center rounded-sm py-1 leading-8"
-          @click="handleOpenLock"
+        <template v-if="showLockInDropdown || showLogoutInDropdown">
+          <DropdownMenuSeparator v-if="showLockInDropdown" />
+          <DropdownMenuItem
+            v-if="showLockInDropdown"
+            class="mx-1 flex cursor-pointer items-center rounded-sm py-1 leading-8"
+            @click="handleOpenLock"
+          >
+            <VbenIconButton class="mr-2" @click="handleOpenLock">
+              <LockKeyhole class="size-4" />
+            </VbenIconButton>
+            {{ $t('ui.widgets.lockScreen.title') }}
+            <DropdownMenuShortcut v-if="enableLockScreenShortcutKey">
+              {{ altView }} L
+            </DropdownMenuShortcut>
+          </DropdownMenuItem>
+          <DropdownMenuSeparator v-if="showLogoutInDropdown" />
+          <DropdownMenuItem
+            v-if="showLogoutInDropdown"
+            class="mx-1 flex cursor-pointer items-center rounded-sm py-1 leading-8"
+            @click="handleLogout"
+          >
+            <VbenIconButton class="mr-2" @click="handleLogout">
+              <LogOut class="size-4" />
+            </VbenIconButton>
+            {{ $t('common.logout') }}
+            <DropdownMenuShortcut v-if="enableLogoutShortcutKey">
+              {{ altView }} Q
+            </DropdownMenuShortcut>
+          </DropdownMenuItem>
+        </template>
+        <template
+          v-if="
+            showGlobalSearchInDropdown ||
+            showThemeToggleInDropdown ||
+            showLanguageToggleInDropdown ||
+            showTimezoneInDropdown ||
+            showFullscreenInDropdown ||
+            showNotificationInDropdown ||
+            showRefreshInDropdown
+          "
         >
-          <LockKeyhole class="mr-2 size-4" />
-          {{ $t('ui.widgets.lockScreen.title') }}
-          <DropdownMenuShortcut v-if="enableLockScreenShortcutKey">
-            {{ altView }} L
-          </DropdownMenuShortcut>
-        </DropdownMenuItem>
-        <DropdownMenuSeparator v-if="preferences.widget.lockScreen" />
+          <DropdownMenuSeparator />
+          <DropdownMenuItem
+            v-if="showGlobalSearchInDropdown"
+            class="mx-1 flex cursor-pointer items-center rounded-sm py-1 leading-8"
+            @select="handleGlobalSearch"
+          >
+            <VbenIconButton class="mr-2" @click="handleGlobalSearch">
+              <Search class="size-4" />
+            </VbenIconButton>
+            {{ $t('preferences.widget.globalSearch') }}
+          </DropdownMenuItem>
+          <DropdownMenuItem
+            v-if="showThemeToggleInDropdown"
+            class="mx-1 flex cursor-pointer items-center rounded-sm py-1 leading-8"
+            @select="handleThemeToggleSelect"
+          >
+            <ThemeToggle class="mr-2" />
+            {{ $t('preferences.theme.title') }}
+          </DropdownMenuItem>
+          <DropdownMenuItem
+            v-if="showLanguageToggleInDropdown"
+            class="mx-1 flex cursor-pointer items-center rounded-sm py-1 leading-8"
+            @select="handleLanguageToggleSelect"
+          >
+            <VbenIconButton class="mr-2" @click="handleLanguageToggleSelect">
+              <Languages class="size-4" />
+            </VbenIconButton>
+            {{ $t('preferences.widget.languageToggle') }}
+          </DropdownMenuItem>
+          <template v-if="showLanguageList">
+            <DropdownMenuItem
+              v-for="lang in SUPPORT_LANGUAGES"
+              :key="lang.value"
+              class="mx-1 flex cursor-pointer items-center rounded-sm py-1 pl-8 leading-8"
+              @select="(e: Event) => handleLocaleChange(e, lang.value)"
+            >
+              <span
+                :class="
+                  lang.value === preferences.app.locale ? 'bg-foreground' : ''
+                "
+                class="mr-2 size-1.5 rounded-full"
+              ></span>
+              {{ lang.label }}
+            </DropdownMenuItem>
+          </template>
+          <DropdownMenuItem
+            v-if="showTimezoneInDropdown"
+            class="mx-1 flex cursor-pointer items-center rounded-sm py-1 leading-8"
+            @select="handleTimezoneSelect"
+          >
+            <VbenIconButton class="mr-2" @click="handleTimezoneSelect">
+              <TimezoneIcon class="size-4" />
+            </VbenIconButton>
+            {{ $t('ui.widgets.timezone.setTimezone') }}
+          </DropdownMenuItem>
+          <DropdownMenuItem
+            v-if="showFullscreenInDropdown"
+            class="mx-1 flex cursor-pointer items-center rounded-sm py-1 leading-8"
+            @select="handleFullscreenSelect"
+          >
+            <VbenFullScreen class="mr-2" @click.stop />
+            {{ $t('preferences.widget.fullscreen') }}
+          </DropdownMenuItem>
+          <DropdownMenuItem
+            v-if="showNotificationInDropdown"
+            class="mx-1 flex cursor-pointer items-center rounded-sm py-1 leading-8"
+            @select="handleNotificationSelect"
+          >
+            <Notification ref="refNotification" class="mr-2" />
+            {{ $t('preferences.widget.notification') }}
+          </DropdownMenuItem>
+          <DropdownMenuItem
+            v-if="showRefreshInDropdown"
+            class="mx-1 flex cursor-pointer items-center rounded-sm py-1 leading-8"
+            @click="handleRefresh"
+          >
+            <VbenIconButton class="mr-2" @click="handleRefresh">
+              <RotateCw class="size-4" />
+            </VbenIconButton>
+            {{ $t('preferences.widget.refresh') }}
+          </DropdownMenuItem>
+        </template>
+        <DropdownMenuSeparator
+          v-if="hasAnyInDropdown || preferencesButtonPosition.userDropdown"
+        />
         <DropdownMenuItem
+          v-if="preferencesButtonPosition.userDropdown"
           class="mx-1 flex cursor-pointer items-center rounded-sm py-1 leading-8"
-          @click="handleLogout"
+          @click="handleOpenSettings"
         >
-          <LogOut class="mr-2 size-4" />
-          {{ $t('common.logout') }}
-          <DropdownMenuShortcut v-if="enableLogoutShortcutKey">
-            {{ altView }} Q
-          </DropdownMenuShortcut>
+          <VbenIconButton class="mr-2" @click="handleOpenSettings">
+            <Settings class="size-4" />
+          </VbenIconButton>
+          {{ $t('preferences.title') }}
         </DropdownMenuItem>
       </div>
     </DropdownMenuContent>
diff --git a/packages/effects/plugins/package.json b/packages/effects/plugins/package.json
index ac11e5a0..6f4e71f5 100644
--- a/packages/effects/plugins/package.json
+++ b/packages/effects/plugins/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vben/plugins",
-  "version": "5.5.1",
+  "version": "5.7.0",
   "homepage": "https://github.com/vbenjs/vue-vben-admin",
   "bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
   "repository": {
@@ -14,17 +14,43 @@
     "**/*.css"
   ],
   "exports": {
+    ".": {
+      "types": "./src/index.ts",
+      "default": "./src/index.ts"
+    },
     "./echarts": {
       "types": "./src/echarts/index.ts",
       "default": "./src/echarts/index.ts"
     },
+    "./tiptap": {
+      "types": "./src/tiptap/index.ts",
+      "default": "./src/tiptap/index.ts"
+    },
     "./vxe-table": {
       "types": "./src/vxe-table/index.ts",
       "default": "./src/vxe-table/index.ts"
+    },
+    "./motion": {
+      "types": "./src/motion/index.ts",
+      "default": "./src/motion/index.ts"
     }
   },
   "dependencies": {
+    "@tiptap/core": "catalog:",
+    "@tiptap/extension-document": "catalog:",
+    "@tiptap/extension-highlight": "catalog:",
+    "@tiptap/extension-image": "catalog:",
+    "@tiptap/extension-link": "catalog:",
+    "@tiptap/extension-placeholder": "catalog:",
+    "@tiptap/extension-text-align": "catalog:",
+    "@tiptap/extension-text-style": "catalog:",
+    "@tiptap/extension-underline": "catalog:",
+    "@tiptap/pm": "catalog:",
+    "@tiptap/starter-kit": "catalog:",
+    "@tiptap/vue-3": "catalog:",
+    "@vben-core/design": "workspace:*",
     "@vben-core/form-ui": "workspace:*",
+    "@vben-core/popup-ui": "workspace:*",
     "@vben-core/shadcn-ui": "workspace:*",
     "@vben-core/shared": "workspace:*",
     "@vben/hooks": "workspace:*",
@@ -34,6 +60,7 @@
     "@vben/types": "workspace:*",
     "@vben/utils": "workspace:*",
     "@vueuse/core": "catalog:",
+    "@vueuse/motion": "catalog:",
     "echarts": "catalog:",
     "vue": "catalog:",
     "vxe-pc-ui": "catalog:",
diff --git a/packages/effects/plugins/src/echarts/README.md b/packages/effects/plugins/src/echarts/README.md
new file mode 100644
index 00000000..2549b68b
--- /dev/null
+++ b/packages/effects/plugins/src/echarts/README.md
@@ -0,0 +1,41 @@
+# ECharts Plugin
+
+ECharts 图表插件，预置常用组件和图表类型。
+
+## 导出
+
+| 导出         | 类型 | 说明         |
+| ------------ | ---- | ------------ |
+| `default`    | 对象 | echarts 实例 |
+| `EchartsUI`  | 组件 | 图表容器组件 |
+| `ECOption`   | 类型 | 图表配置类型 |
+| `useEcharts` | 函数 | 组合式函数   |
+
+## 使用
+
+```ts
+import { EchartsUI, useEcharts, ECOption } from '@vben/plugins/echarts';
+```
+
+## 类型
+
+```ts
+import type { ECOption } from '@vben/plugins/echarts';
+```
+
+## 预置组件
+
+- TitleComponent
+- TooltipComponent
+- GridComponent
+- LegendComponent
+- ToolboxComponent
+- DatasetComponent
+- TransformComponent
+
+## 预置图表
+
+- BarChart
+- LineChart
+- PieChart
+- RadarChart
diff --git a/packages/effects/plugins/src/echarts/echarts.ts b/packages/effects/plugins/src/echarts/echarts.ts
index 85323a42..8f3cd71c 100644
--- a/packages/effects/plugins/src/echarts/echarts.ts
+++ b/packages/effects/plugins/src/echarts/echarts.ts
@@ -1,44 +1,21 @@
-import type {
-  // 系列类型的定义后缀都为 SeriesOption
-  BarSeriesOption,
-  LineSeriesOption,
-} from 'echarts/charts';
-import type {
-  DatasetComponentOption,
-  GridComponentOption,
-  // 组件类型的定义后缀都为 ComponentOption
-  TitleComponentOption,
-  TooltipComponentOption,
-} from 'echarts/components';
-import type { ComposeOption } from 'echarts/core';
-
 import { BarChart, LineChart, PieChart, RadarChart } from 'echarts/charts';
 import {
-  // 数据集组件
   DatasetComponent,
   GridComponent,
   LegendComponent,
   TitleComponent,
   ToolboxComponent,
   TooltipComponent,
-  // 内置数据转换器组件 (filter, sort)
   TransformComponent,
 } from 'echarts/components';
 import * as echarts from 'echarts/core';
-import { LabelLayout, UniversalTransition } from 'echarts/features';
+import {
+  LabelLayout,
+  LegacyGridContainLabel,
+  UniversalTransition,
+} from 'echarts/features';
 import { CanvasRenderer } from 'echarts/renderers';
 
-// 通过 ComposeOption 来组合出一个只有必须组件和图表的 Option 类型
-export type ECOption = ComposeOption<
-  | BarSeriesOption
-  | DatasetComponentOption
-  | GridComponentOption
-  | LineSeriesOption
-  | TitleComponentOption
-  | TooltipComponentOption
->;
-
-// 注册必须的组件
 echarts.use([
   TitleComponent,
   PieChart,
@@ -50,10 +27,12 @@ echarts.use([
   BarChart,
   LineChart,
   LabelLayout,
+  LegacyGridContainLabel,
   UniversalTransition,
   CanvasRenderer,
   LegendComponent,
   ToolboxComponent,
 ]);
+export type { ECOption } from './types';
 
 export default echarts;
diff --git a/packages/effects/plugins/src/echarts/index.ts b/packages/effects/plugins/src/echarts/index.ts
index 80f36a13..acb0f1e2 100644
--- a/packages/effects/plugins/src/echarts/index.ts
+++ b/packages/effects/plugins/src/echarts/index.ts
@@ -1,3 +1,4 @@
 export * from './echarts';
 export { default as EchartsUI } from './echarts-ui.vue';
+export * from './types';
 export * from './use-echarts';
diff --git a/packages/effects/plugins/src/echarts/types.ts b/packages/effects/plugins/src/echarts/types.ts
new file mode 100644
index 00000000..bebafb87
--- /dev/null
+++ b/packages/effects/plugins/src/echarts/types.ts
@@ -0,0 +1,28 @@
+import type {
+  BarSeriesOption,
+  LineSeriesOption,
+  PieSeriesOption,
+  RadarSeriesOption,
+} from 'echarts/charts';
+import type {
+  DatasetComponentOption,
+  GridComponentOption,
+  LegendComponentOption,
+  TitleComponentOption,
+  ToolboxComponentOption,
+  TooltipComponentOption,
+} from 'echarts/components';
+import type { ComposeOption } from 'echarts/core';
+
+export type ECOption = ComposeOption<
+  | BarSeriesOption
+  | DatasetComponentOption
+  | GridComponentOption
+  | LegendComponentOption
+  | LineSeriesOption
+  | PieSeriesOption
+  | RadarSeriesOption
+  | TitleComponentOption
+  | ToolboxComponentOption
+  | TooltipComponentOption
+>;
diff --git a/packages/effects/plugins/src/echarts/use-echarts.ts b/packages/effects/plugins/src/echarts/use-echarts.ts
index bbe31590..49ae5699 100644
--- a/packages/effects/plugins/src/echarts/use-echarts.ts
+++ b/packages/effects/plugins/src/echarts/use-echarts.ts
@@ -1,9 +1,22 @@
 import type { EChartsOption } from 'echarts';
 
+import type { Ref } from 'vue';
+
+import type { Nullable } from '@vben/types';
+
 import type EchartsUI from './echarts-ui.vue';
 
-import type { Ref } from 'vue';
-import { computed, nextTick, watch } from 'vue';
+import {
+  computed,
+  nextTick,
+  onActivated,
+  onBeforeUnmount,
+  onDeactivated,
+  onMounted,
+  ref,
+  unref,
+  watch,
+} from 'vue';
 
 import { usePreferences } from '@vben/preferences';
 
@@ -24,11 +37,33 @@ type EchartsThemeType = 'dark' | 'light' | null;
 function useEcharts(chartRef: Ref<EchartsUIType>) {
   let chartInstance: echarts.ECharts | null = null;
   let cacheOptions: EChartsOption = {};
+  // echarts是否处于激活状态
+  const isActiveRef = ref(false);
 
   const { isDark } = usePreferences();
   const { height, width } = useWindowSize();
   const resizeHandler: () => void = useDebounceFn(resize, 200);
 
+  const getChartEl = (): HTMLElement | null => {
+    const refValue = chartRef?.value as unknown;
+    if (!refValue) return null;
+    if (refValue instanceof HTMLElement) {
+      return refValue;
+    }
+    const maybeComponent = refValue as { $el?: HTMLElement };
+    return maybeComponent.$el ?? null;
+  };
+
+  onMounted(() => (isActiveRef.value = true));
+  onActivated(() => (isActiveRef.value = true));
+  onDeactivated(() => (isActiveRef.value = false));
+  onBeforeUnmount(() => (isActiveRef.value = false));
+
+  const isElHidden = (el: HTMLElement | null): boolean => {
+    if (!el) return true;
+    return el.offsetHeight === 0 || el.offsetWidth === 0;
+  };
+
   const getOptions = computed((): EChartsOption => {
     if (!isDark.value) {
       return {};
@@ -49,7 +84,13 @@ function useEcharts(chartRef: Ref<EchartsUIType>) {
     return chartInstance;
   };
 
-  const renderEcharts = (options: EChartsOption, clear = true) => {
+  const renderEcharts = (
+    options: EChartsOption,
+    clear = true,
+  ): Promise<Nullable<echarts.ECharts>> => {
+    if (!unref(isActiveRef)) {
+      return Promise.resolve(null);
+    }
     cacheOptions = options;
     const currentOptions = {
       ...options,
@@ -57,27 +98,69 @@ function useEcharts(chartRef: Ref<EchartsUIType>) {
     };
     return new Promise((resolve) => {
       if (chartRef.value?.offsetHeight === 0) {
-        useTimeoutFn(() => {
-          renderEcharts(currentOptions);
-          resolve(null);
+        useTimeoutFn(async () => {
+          resolve(await renderEcharts(currentOptions));
         }, 30);
         return;
       }
       nextTick(() => {
+        const el = getChartEl();
+        if (isElHidden(el)) {
+          useTimeoutFn(async () => {
+            resolve(await renderEcharts(currentOptions));
+          }, 30);
+          return;
+        }
         useTimeoutFn(() => {
-          if (!chartInstance) {
+          if (!chartInstance || chartInstance?.getDom() !== el) {
+            chartInstance?.dispose();
             const instance = initCharts();
             if (!instance) return;
+            chartInstance = instance;
           }
           clear && chartInstance?.clear();
           chartInstance?.setOption(currentOptions);
-          resolve(null);
+          resolve(chartInstance);
         }, 30);
       });
     });
   };
 
+  const updateData = (
+    option: EChartsOption,
+    notMerge = false, // false = 合并（保留动画），true = 完全替换
+    lazyUpdate = false, // true 时不立即重绘，适合短时间内多次调用
+  ): Promise<echarts.ECharts | null> => {
+    return new Promise((resolve) => {
+      nextTick(() => {
+        if (!chartInstance) {
+          // 还没初始化 → 当作首次渲染
+          renderEcharts(option).then(resolve);
+          return;
+        }
+
+        // 合并你原有的全局配置（比如 backgroundColor）
+        const finalOption = {
+          ...option,
+          ...getOptions.value,
+        };
+
+        chartInstance.setOption(finalOption, {
+          notMerge,
+          lazyUpdate,
+          // silent: true,     // 如果追求极致性能可开启（关闭所有事件）
+        });
+
+        resolve(chartInstance);
+      });
+    });
+  };
+
   function resize() {
+    const el = getChartEl();
+    if (isElHidden(el)) {
+      return;
+    }
     chartInstance?.resize({
       animation: {
         duration: 300,
@@ -92,8 +175,8 @@ function useEcharts(chartRef: Ref<EchartsUIType>) {
 
   useResizeObserver(chartRef as never, resizeHandler);
 
-  watch(isDark, () => {
-    if (chartInstance) {
+  watch([isDark, isActiveRef], () => {
+    if (chartInstance && unref(isActiveRef)) {
       chartInstance.dispose();
       initCharts();
       renderEcharts(cacheOptions);
@@ -106,8 +189,11 @@ function useEcharts(chartRef: Ref<EchartsUIType>) {
     chartInstance?.dispose();
   });
   return {
+    isActive: isActiveRef,
     renderEcharts,
     resize,
+    updateData,
+    getChartInstance: () => chartInstance,
   };
 }
 
diff --git a/packages/effects/plugins/src/index.ts b/packages/effects/plugins/src/index.ts
new file mode 100644
index 00000000..744be92c
--- /dev/null
+++ b/packages/effects/plugins/src/index.ts
@@ -0,0 +1,2 @@
+export * from './plugins-context';
+export * from './types';
diff --git a/packages/effects/plugins/src/motion/README.md b/packages/effects/plugins/src/motion/README.md
new file mode 100644
index 00000000..03c2ca1e
--- /dev/null
+++ b/packages/effects/plugins/src/motion/README.md
@@ -0,0 +1,26 @@
+# Motion Plugin
+
+基于 @vueuse/motion 的动画插件。
+
+## 导出
+
+| 导出              | 类型 | 说明       |
+| ----------------- | ---- | ---------- |
+| `Motion`          | 组件 | 动画组件   |
+| `MotionGroup`     | 组件 | 动画组组件 |
+| `MotionDirective` | 指令 | 动画指令   |
+| `MotionPlugin`    | 插件 | Vue 插件   |
+
+## 使用
+
+```ts
+import { MotionPlugin, Motion, MotionDirective } from '@vben/plugins/motion';
+
+app.use(MotionPlugin);
+```
+
+## 类型
+
+```ts
+import type { MotionOptions, MotionVariants } from '@vben/plugins/motion';
+```
diff --git a/packages/effects/plugins/src/motion/index.ts b/packages/effects/plugins/src/motion/index.ts
new file mode 100644
index 00000000..021465aa
--- /dev/null
+++ b/packages/effects/plugins/src/motion/index.ts
@@ -0,0 +1,8 @@
+export * from './types';
+
+export {
+  MotionComponent as Motion,
+  MotionDirective,
+  MotionGroupComponent as MotionGroup,
+  MotionPlugin,
+} from '@vueuse/motion';
diff --git a/packages/effects/plugins/src/motion/types.ts b/packages/effects/plugins/src/motion/types.ts
new file mode 100644
index 00000000..f08bf21e
--- /dev/null
+++ b/packages/effects/plugins/src/motion/types.ts
@@ -0,0 +1,26 @@
+export const MotionPresets = [
+  'fade',
+  'fadeVisible',
+  'fadeVisibleOnce',
+  'rollBottom',
+  'rollLeft',
+  'rollRight',
+  'rollTop',
+  'rollVisibleBottom',
+  'rollVisibleLeft',
+  'rollVisibleRight',
+  'rollVisibleTop',
+  'pop',
+  'popVisible',
+  'popVisibleOnce',
+  'slideBottom',
+  'slideLeft',
+  'slideRight',
+  'slideTop',
+  'slideVisibleBottom',
+  'slideVisibleLeft',
+  'slideVisibleRight',
+  'slideVisibleTop',
+] as const;
+
+export type MotionPreset = (typeof MotionPresets)[number];
diff --git a/packages/effects/plugins/src/plugins-context.ts b/packages/effects/plugins/src/plugins-context.ts
new file mode 100644
index 00000000..459c2134
--- /dev/null
+++ b/packages/effects/plugins/src/plugins-context.ts
@@ -0,0 +1,39 @@
+import type { VbenPluginsOptions } from './types';
+
+let globalPluginsOptions: null | VbenPluginsOptions = null;
+
+export function providePluginsOptions(options: VbenPluginsOptions) {
+  if (!globalPluginsOptions) {
+    globalPluginsOptions = options;
+    return;
+  }
+
+  globalPluginsOptions = {
+    ...globalPluginsOptions,
+    ...options,
+    form:
+      globalPluginsOptions.form && options.form
+        ? { ...globalPluginsOptions.form, ...options.form }
+        : globalPluginsOptions.form || options.form,
+    modal:
+      globalPluginsOptions.modal && options.modal
+        ? { ...globalPluginsOptions.modal, ...options.modal }
+        : globalPluginsOptions.modal || options.modal,
+    message:
+      globalPluginsOptions.message && options.message
+        ? { ...globalPluginsOptions.message, ...options.message }
+        : globalPluginsOptions.message || options.message,
+    components: {
+      ...globalPluginsOptions.components,
+      ...options.components,
+    },
+  };
+}
+
+export function injectPluginsOptions() {
+  return globalPluginsOptions;
+}
+
+export function resetPluginsOptions() {
+  globalPluginsOptions = null;
+}
diff --git a/packages/effects/plugins/src/tiptap/extensions.ts b/packages/effects/plugins/src/tiptap/extensions.ts
new file mode 100644
index 00000000..245aa804
--- /dev/null
+++ b/packages/effects/plugins/src/tiptap/extensions.ts
@@ -0,0 +1,450 @@
+import type { Editor as CoreEditor } from '@tiptap/core';
+import type { Node as ProseMirrorNode } from '@tiptap/pm/model';
+import type { EditorView } from '@tiptap/pm/view';
+import type { Extensions } from '@tiptap/vue-3';
+
+import type { ImageUploadOptions, VbenTiptapExtensionOptions } from './types';
+
+import { $t } from '@vben/locales';
+
+import { alert } from '@vben-core/popup-ui';
+
+import Highlight from '@tiptap/extension-highlight';
+import Image from '@tiptap/extension-image';
+import Link from '@tiptap/extension-link';
+import Placeholder from '@tiptap/extension-placeholder';
+import TextAlign from '@tiptap/extension-text-align';
+import { Color, TextStyle } from '@tiptap/extension-text-style';
+import { Plugin, PluginKey } from '@tiptap/pm/state';
+import StarterKit from '@tiptap/starter-kit';
+
+const DEFAULT_ACCEPT = 'image/*';
+
+function validateFile(
+  file: File,
+  options: ImageUploadOptions,
+): string | undefined {
+  if (options.maxSize !== undefined && file.size > options.maxSize) {
+    return $t('ui.tiptap.upload.fileTooLarge');
+  }
+
+  const accept = options.accept ?? DEFAULT_ACCEPT;
+  if (accept && accept !== '*/*' && accept !== 'image/*') {
+    const acceptedTypes = accept.split(',').map((t) => t.trim());
+    const isAccepted = acceptedTypes.some((type) => {
+      if (type.endsWith('/*')) {
+        return file.type.startsWith(type.slice(0, -1));
+      }
+      return file.type === type;
+    });
+    if (!isAccepted) {
+      return $t('ui.tiptap.upload.fileTypeNotAllowed');
+    }
+  }
+
+  return undefined;
+}
+
+function handleUploadError(error: unknown, options: ImageUploadOptions): void {
+  if (options.onUploadError) {
+    options.onUploadError(error);
+  } else {
+    const message = error instanceof Error ? error.message : String(error);
+    alert(message, $t('ui.tiptap.upload.uploadFailed')).catch(() => {});
+  }
+}
+
+function findPlaceholderPos(doc: ProseMirrorNode, blobUrl: string): number {
+  let found = -1;
+  doc.descendants((node: ProseMirrorNode, offset: number) => {
+    if (found !== -1) return false;
+    if (
+      node.type.name === 'image' &&
+      node.attrs.src === blobUrl &&
+      node.attrs['data-uploading'] === 'true'
+    ) {
+      found = offset;
+      return false;
+    }
+    return true;
+  });
+  return found;
+}
+
+interface UploadContext {
+  blobUrl: string;
+  pos: number;
+}
+
+function createUploadProcess(
+  editor: CoreEditor,
+  file: File,
+  options: ImageUploadOptions,
+  blobUrlTracker?: Set<string>,
+  pos?: number,
+): UploadContext {
+  const blobUrl = URL.createObjectURL(file);
+  blobUrlTracker?.add(blobUrl);
+  const insertPos = pos ?? editor.state.selection.from;
+
+  // Insert placeholder image with blob URL
+  editor
+    .chain()
+    .insertContentAt(insertPos, {
+      attrs: {
+        'data-upload-progress': 0,
+        'data-uploading': 'true',
+        src: blobUrl,
+      },
+      type: 'image',
+    })
+    .run();
+
+  const nodePos = findPlaceholderPos(editor.state.doc, blobUrl);
+
+  const uploadContext: UploadContext = { blobUrl, pos: nodePos };
+
+  options
+    .upload(file, (percent: number) => {
+      if (editor.isDestroyed) return;
+
+      const currentPos = findPlaceholderPos(editor.state.doc, blobUrl);
+      if (currentPos === -1) return;
+
+      const node = editor.state.doc.nodeAt(currentPos);
+      if (!node) return;
+
+      const transaction = editor.state.tr.setNodeMarkup(currentPos, undefined, {
+        ...node.attrs,
+        'data-upload-progress': percent,
+      });
+      editor.view.dispatch(transaction);
+    })
+    .then((url: string) => {
+      if (editor.isDestroyed) {
+        URL.revokeObjectURL(blobUrl);
+        return;
+      }
+
+      const currentPos = findPlaceholderPos(editor.state.doc, blobUrl);
+
+      if (currentPos === -1) {
+        blobUrlTracker?.delete(blobUrl);
+        URL.revokeObjectURL(blobUrl);
+        return;
+      }
+
+      const node = editor.state.doc.nodeAt(currentPos);
+      if (!node) {
+        blobUrlTracker?.delete(blobUrl);
+        URL.revokeObjectURL(blobUrl);
+        return;
+      }
+
+      const transaction = editor.state.tr.setNodeMarkup(currentPos, undefined, {
+        ...node.attrs,
+        'data-upload-progress': null,
+        'data-uploading': null,
+        src: url,
+      });
+      editor.view.dispatch(transaction);
+      blobUrlTracker?.delete(blobUrl);
+      URL.revokeObjectURL(blobUrl);
+    })
+    .catch((error: unknown) => {
+      if (editor.isDestroyed) {
+        URL.revokeObjectURL(blobUrl);
+        return;
+      }
+
+      const currentPos = findPlaceholderPos(editor.state.doc, blobUrl);
+
+      if (currentPos !== -1) {
+        const transaction = editor.state.tr.delete(
+          currentPos,
+          currentPos + (editor.state.doc.nodeAt(currentPos)?.nodeSize ?? 1),
+        );
+        editor.view.dispatch(transaction);
+      }
+
+      URL.revokeObjectURL(blobUrl);
+      blobUrlTracker?.delete(blobUrl);
+      handleUploadError(error, options);
+    });
+
+  return uploadContext;
+}
+
+function createCustomImage(
+  imageUpload: ImageUploadOptions,
+  blobUrlTracker?: Set<string>,
+) {
+  return Image.extend({
+    addAttributes() {
+      return {
+        ...this.parent?.(),
+        'data-upload-progress': {
+          default: null,
+          parseHTML: (element) => element.dataset.uploadProgress,
+          renderHTML: () => {
+            return {};
+          },
+        },
+        'data-uploading': {
+          default: null,
+          parseHTML: (element) => element.dataset.uploading,
+          renderHTML: () => {
+            return {};
+          },
+        },
+      };
+    },
+
+    addNodeView() {
+      return ({ node }) => {
+        const isUploading = node.attrs['data-uploading'] === 'true';
+
+        if (!isUploading) {
+          return null as any;
+        }
+
+        const wrapper = document.createElement('div');
+        wrapper.className = 'vben-tiptap-upload-wrapper';
+
+        const img = document.createElement('img');
+        img.src = node.attrs.src;
+        img.className = 'vben-tiptap__image';
+        wrapper.append(img);
+
+        const spinner = document.createElement('div');
+        spinner.className = 'vben-tiptap-upload-spinner';
+        wrapper.append(spinner);
+
+        const progressBar = document.createElement('div');
+        progressBar.className = 'vben-tiptap-upload-progress';
+        const progressFill = document.createElement('div');
+        progressFill.className = 'vben-tiptap-upload-progress-fill';
+        progressBar.append(progressFill);
+        wrapper.append(progressBar);
+
+        const progress = node.attrs['data-upload-progress'];
+        if (progress !== null && progress !== undefined && progress > 0) {
+          spinner.style.display = 'none';
+          progressBar.style.display = '';
+          progressFill.style.width = `${progress}%`;
+        } else {
+          spinner.style.display = '';
+          progressBar.style.display = 'none';
+        }
+
+        return {
+          dom: wrapper,
+          update(updatedNode: ProseMirrorNode) {
+            if (updatedNode.attrs['data-uploading'] !== 'true') {
+              return false;
+            }
+
+            if (updatedNode.attrs.src !== img.src) {
+              img.src = updatedNode.attrs.src;
+            }
+
+            const newProgress = updatedNode.attrs['data-upload-progress'];
+            if (
+              newProgress !== null &&
+              newProgress !== undefined &&
+              newProgress > 0
+            ) {
+              spinner.style.display = 'none';
+              progressBar.style.display = '';
+              progressFill.style.width = `${newProgress}%`;
+            } else {
+              spinner.style.display = '';
+              progressBar.style.display = 'none';
+            }
+
+            return true;
+          },
+        } as any;
+      };
+    },
+
+    addCommands() {
+      return {
+        ...this.parent?.(),
+        uploadImage:
+          () =>
+          ({ editor: cmdEditor }: { editor: CoreEditor }) => {
+            const input = document.createElement('input');
+            input.type = 'file';
+            input.accept = imageUpload.accept ?? DEFAULT_ACCEPT;
+            input.style.display = 'none';
+
+            input.addEventListener('change', () => {
+              const file = input.files?.[0];
+              if (!file) return;
+
+              const error = validateFile(file, imageUpload);
+              if (error) {
+                handleUploadError(new Error(error), imageUpload);
+                return;
+              }
+
+              createUploadProcess(cmdEditor, file, imageUpload, blobUrlTracker);
+              input.remove();
+            });
+
+            document.body.append(input);
+            input.click();
+            return true;
+          },
+      };
+    },
+
+    addProseMirrorPlugins() {
+      const editor = this.editor;
+
+      return [
+        new Plugin({
+          key: new PluginKey('imageUploadDrop'),
+          props: {
+            handleDrop: (view: EditorView, event: DragEvent) => {
+              if (!event.dataTransfer?.files.length) return false;
+
+              const imageFiles = [...event.dataTransfer.files].filter((f) =>
+                f.type.startsWith('image/'),
+              );
+              if (imageFiles.length === 0) return false;
+
+              event.preventDefault();
+
+              // Only support single image upload
+              const file = imageFiles[0];
+              if (!file) return false;
+              if (imageFiles.length > 1) {
+                handleUploadError(
+                  new Error($t('ui.tiptap.upload.onlySingleImage')),
+                  imageUpload,
+                );
+              }
+
+              const error = validateFile(file, imageUpload);
+              if (error) {
+                handleUploadError(new Error(error), imageUpload);
+                return true;
+              }
+
+              const coordinates = view.posAtCoords({
+                left: event.clientX,
+                top: event.clientY,
+              });
+
+              const pos = coordinates?.pos ?? view.state.selection.from;
+
+              createUploadProcess(
+                editor,
+                file,
+                imageUpload,
+                blobUrlTracker,
+                pos,
+              );
+              return true;
+            },
+          },
+        }),
+        new Plugin({
+          key: new PluginKey('imageUploadPaste'),
+          props: {
+            handlePaste: (_view: EditorView, event: ClipboardEvent) => {
+              const items = event.clipboardData?.items;
+              if (!items) return false;
+
+              const imageFiles: File[] = [];
+              for (const item of items) {
+                if (item.type.startsWith('image/')) {
+                  const file = item.getAsFile();
+                  if (file) imageFiles.push(file);
+                }
+              }
+
+              if (imageFiles.length === 0) return false;
+
+              event.preventDefault();
+
+              const imageFile = imageFiles[0];
+              if (!imageFile) return false;
+              if (imageFiles.length > 1) {
+                handleUploadError(
+                  new Error($t('ui.tiptap.upload.onlySingleImage')),
+                  imageUpload,
+                );
+              }
+
+              const error = validateFile(imageFile, imageUpload);
+              if (error) {
+                handleUploadError(new Error(error), imageUpload);
+                return true;
+              }
+
+              createUploadProcess(
+                editor,
+                imageFile,
+                imageUpload,
+                blobUrlTracker,
+              );
+              return true;
+            },
+          },
+        }),
+      ];
+    },
+  });
+}
+
+export function createDefaultTiptapExtensions(
+  options: VbenTiptapExtensionOptions = {},
+): Extensions {
+  return [
+    StarterKit.configure({
+      heading: {
+        levels: [1, 2, 3, 4],
+      },
+      link: false,
+    }),
+    TextAlign.configure({
+      types: ['heading', 'paragraph'],
+    }),
+    TextStyle,
+    Color.configure({
+      types: ['textStyle'],
+    }),
+    Highlight.configure({
+      multicolor: true,
+    }),
+    Link.configure({
+      autolink: true,
+      defaultProtocol: 'https',
+      enableClickSelection: true,
+      openOnClick: false,
+      protocols: ['mailto', { optionalSlashes: true, scheme: 'tel' }],
+    }),
+    options.imageUpload
+      ? createCustomImage(
+          options.imageUpload,
+          options._blobUrlTracker,
+        ).configure({
+          allowBase64: true,
+          HTMLAttributes: {
+            class: 'vben-tiptap__image',
+          },
+        })
+      : Image.configure({
+          allowBase64: true,
+          HTMLAttributes: {
+            class: 'vben-tiptap__image',
+          },
+        }),
+    Placeholder.configure({
+      placeholder: options.placeholder ?? $t('ui.tiptap.placeholder'),
+    }),
+  ];
+}
diff --git a/packages/effects/plugins/src/tiptap/index.ts b/packages/effects/plugins/src/tiptap/index.ts
new file mode 100644
index 00000000..292ead0d
--- /dev/null
+++ b/packages/effects/plugins/src/tiptap/index.ts
@@ -0,0 +1,4 @@
+export { default as VbenTiptapPreview } from './preview.vue';
+export { default as VbenTiptap } from './tiptap.vue';
+
+export * from './types';
diff --git a/packages/effects/plugins/src/tiptap/preview.vue b/packages/effects/plugins/src/tiptap/preview.vue
new file mode 100644
index 00000000..99563d2d
--- /dev/null
+++ b/packages/effects/plugins/src/tiptap/preview.vue
@@ -0,0 +1,34 @@
+<script setup lang="ts">
+import type { TipTapPreviewProps } from './types';
+
+import { computed } from 'vue';
+
+import { cn } from '@vben-core/shared/utils';
+
+import './style.css';
+const props = withDefaults(defineProps<TipTapPreviewProps>(), {
+  content: '',
+  minHeight: 160,
+});
+const contentMinHeight = computed(() =>
+  typeof props.minHeight === 'number'
+    ? `${props.minHeight}px`
+    : props.minHeight,
+);
+const previewClass = computed(() =>
+  cn(
+    'vben-tiptap-content',
+    'text-foreground bg-transparent p-0 leading-7',
+    props.class,
+  ),
+);
+</script>
+
+<template>
+  <!-- eslint-disable vue/no-v-html -->
+  <div
+    :class="previewClass"
+    :style="{ minHeight: contentMinHeight }"
+    v-html="content"
+  ></div>
+</template>
diff --git a/packages/effects/plugins/src/tiptap/style.css b/packages/effects/plugins/src/tiptap/style.css
new file mode 100644
index 00000000..3f5f6cc8
--- /dev/null
+++ b/packages/effects/plugins/src/tiptap/style.css
@@ -0,0 +1,112 @@
+@reference "@vben/tailwind-config/theme";
+
+.vben-tiptap-content h1 {
+  @apply text-2xl font-bold leading-[1.4];
+}
+
+.vben-tiptap-content h2 {
+  @apply text-xl font-bold leading-[1.45];
+}
+
+.vben-tiptap-content h3 {
+  @apply text-lg font-semibold leading-[1.5];
+}
+
+.vben-tiptap-content h4 {
+  @apply text-base font-semibold leading-[1.55];
+}
+
+.vben-tiptap-content ul {
+  @apply list-disc pl-6;
+}
+
+.vben-tiptap-content ol {
+  @apply list-decimal pl-6;
+}
+
+.vben-tiptap-content blockquote {
+  @apply border-l-4 border-primary pl-4 text-muted-foreground;
+}
+
+.vben-tiptap-content a {
+  @apply text-primary underline decoration-1 underline-offset-[3px];
+}
+
+.vben-tiptap-content code {
+  @apply rounded-[0.45rem] border border-border bg-secondary px-[0.35rem] py-[0.15rem] text-[0.9em] text-primary;
+}
+
+.vben-tiptap-content pre {
+  @apply overflow-x-auto rounded-[0.9rem] border border-border bg-popover p-4 text-popover-foreground;
+}
+
+.vben-tiptap-content pre code {
+  @apply border-none bg-transparent p-0 text-inherit;
+}
+
+.vben-tiptap-content img,
+.vben-tiptap-content .vben-tiptap__image {
+  max-width: min(100%, 640px);
+}
+
+/* Image upload states */
+.vben-tiptap-upload-wrapper {
+  position: relative;
+  display: inline-block;
+  max-width: min(100%, 640px);
+  margin: 1rem 0;
+}
+
+.vben-tiptap-upload-wrapper img {
+  display: block;
+  margin: 0;
+  opacity: 0.6;
+}
+
+.vben-tiptap-upload-spinner {
+  position: absolute;
+  inset: 0;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background-color: hsl(var(--card) / 30%);
+  border-radius: 1rem;
+}
+
+.vben-tiptap-upload-spinner::after {
+  display: block;
+  width: 24px;
+  height: 24px;
+  content: '';
+  border: 2px solid hsl(var(--foreground) / 30%);
+  border-top-color: hsl(var(--foreground));
+  border-radius: 50%;
+  animation: vben-tiptap-spin 0.8s linear infinite;
+}
+
+.vben-tiptap-upload-progress {
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  width: 100%;
+  height: 4px;
+  overflow: hidden;
+  background-color: hsl(var(--muted));
+  border-radius: 0 0 1rem 1rem;
+}
+
+.vben-tiptap-upload-progress-fill {
+  height: 100%;
+  background-color: hsl(var(--primary));
+  transition: width 0.2s ease;
+}
+
+@keyframes vben-tiptap-spin {
+  from {
+    transform: rotate(0deg);
+  }
+
+  to {
+    transform: rotate(360deg);
+  }
+}
diff --git a/packages/effects/plugins/src/tiptap/tiptap.vue b/packages/effects/plugins/src/tiptap/tiptap.vue
new file mode 100644
index 00000000..2c4da366
--- /dev/null
+++ b/packages/effects/plugins/src/tiptap/tiptap.vue
@@ -0,0 +1,324 @@
+<script setup lang="ts">
+import type {
+  TipTapProps,
+  ToolbarAction,
+  ToolbarMenuItem,
+  VbenTiptapChangeEvent,
+} from './types';
+
+import { computed, onBeforeUnmount, reactive, watch } from 'vue';
+
+import { Check, ChevronDown, Eye } from '@vben/icons';
+import { $t } from '@vben/locales';
+
+import { useVbenModal } from '@vben-core/popup-ui';
+import { VbenIconButton, VbenPopover } from '@vben-core/shadcn-ui';
+import { cn } from '@vben-core/shared/utils';
+
+import { EditorContent, useEditor } from '@tiptap/vue-3';
+
+import { createDefaultTiptapExtensions } from './extensions';
+import Preview from './preview.vue';
+import { createToolbarGroups } from './toolbar';
+import { useTiptapToolbar } from './use-tiptap-toolbar';
+
+import './style.css';
+const props = withDefaults(defineProps<TipTapProps>(), {
+  editable: true,
+  extensions: undefined,
+  imageUpload: undefined,
+  minHeight: 240,
+  maxHeight: 400,
+  placeholder: $t('ui.tiptap.placeholder'),
+  previewable: true,
+  toolbar: true,
+});
+const emit = defineEmits<{
+  change: [payload: VbenTiptapChangeEvent];
+}>();
+const modelValue = defineModel<string>({ default: '' });
+const contentMinHeight = computed(() =>
+  typeof props.minHeight === 'number'
+    ? `${props.minHeight}px`
+    : props.minHeight,
+);
+const contentMaxHeight = computed(() =>
+  typeof props.maxHeight === 'number'
+    ? `${props.maxHeight}px`
+    : props.maxHeight,
+);
+const tiptapContentClass = cn(
+  'vben-tiptap-content vben-tiptap__content',
+  'text-foreground max-h-(--vben-tiptap-max-height) min-h-(--vben-tiptap-min-height) overflow-auto leading-7 outline-none',
+);
+const blobUrlTracker = new Set<string>();
+const editor = useEditor({
+  content: modelValue.value,
+  editable: props.editable,
+  editorProps: {
+    attributes: {
+      class: tiptapContentClass,
+    },
+  },
+  extensions:
+    props.extensions ??
+    createDefaultTiptapExtensions({
+      _blobUrlTracker: blobUrlTracker,
+      imageUpload: props.imageUpload,
+      placeholder: props.placeholder,
+    }),
+  onUpdate: ({ editor }) => {
+    const html = editor.getHTML();
+    if (html !== modelValue.value) {
+      modelValue.value = html;
+    }
+    emit('change', {
+      html,
+      json: editor.getJSON(),
+      text: editor.getText(),
+    });
+  },
+});
+const toolbarGroups = computed<ToolbarAction[][]>(() => {
+  // Only show upload toolbar option when using default extensions
+  // (custom extensions may not include the uploadImage command)
+  const effectiveImageUpload = props.extensions ? undefined : props.imageUpload;
+  return createToolbarGroups(effectiveImageUpload);
+});
+const previewContent = computed(
+  () => editor.value?.getHTML() ?? modelValue.value,
+);
+const [PreviewModal, previewModalApi] = useVbenModal({
+  footer: false,
+  fullscreenButton: false,
+});
+const {
+  applyPaletteColor,
+  canRunAction,
+  canRunMenuItem,
+  clearPaletteColor,
+  getActionIndicatorColor,
+  getMenuItemClass,
+  getPaletteCurrentColor,
+  getPaletteSwatchClass,
+  getToolbarButtonClass,
+  isMenuItemActive,
+  runAction,
+  runMenuItem,
+} = useTiptapToolbar({
+  editable: () => props.editable,
+  editor,
+});
+
+const menuOpenState = reactive<Record<string, boolean>>({});
+
+function getMenuOpen(action: ToolbarAction): boolean {
+  return menuOpenState[action.label] ?? false;
+}
+
+function setMenuOpen(action: ToolbarAction, open: boolean) {
+  menuOpenState[action.label] = open;
+}
+
+function handleMenuItemClick(action: ToolbarAction, item: ToolbarMenuItem) {
+  runMenuItem(item);
+  setMenuOpen(action, false);
+}
+
+function openPreviewModal() {
+  previewModalApi.open();
+}
+watch(
+  () => props.editable,
+  (editable) => {
+    editor.value?.setEditable(editable);
+  },
+);
+watch(
+  () => modelValue.value,
+  (nextValue = '') => {
+    if (!editor.value) {
+      return;
+    }
+    const currentValue = editor.value.getHTML();
+    if (nextValue === currentValue) {
+      return;
+    }
+    editor.value.commands.setContent(nextValue, {
+      emitUpdate: false,
+    });
+  },
+);
+onBeforeUnmount(() => {
+  for (const url of blobUrlTracker) {
+    URL.revokeObjectURL(url);
+  }
+  blobUrlTracker.clear();
+  editor.value?.destroy();
+});
+</script>
+
+<template>
+  <div
+    :style="{
+      '--vben-tiptap-min-height': contentMinHeight,
+      '--vben-tiptap-max-height': contentMaxHeight,
+    }"
+    class="vben-tiptap overflow-hidden rounded-xl border border-border bg-card"
+  >
+    <div
+      v-if="toolbar"
+      class="sticky top-0 z-10 flex flex-wrap items-center gap-2 border-b border-border p-2 backdrop-blur-[14px]"
+    >
+      <div
+        v-for="(group, groupIndex) in toolbarGroups"
+        :key="groupIndex"
+        class="flex items-center gap-1"
+      >
+        <template v-for="action in group" :key="action.label">
+          <VbenPopover
+            v-if="action.menu || action.palette"
+            :open="action.menu ? getMenuOpen(action) : undefined"
+            :content-props="{ align: 'start', side: 'bottom', sideOffset: 8 }"
+            content-class="w-auto p-2"
+            @update:open="action.menu ? setMenuOpen(action, $event) : undefined"
+          >
+            <template #trigger>
+              <VbenIconButton
+                :aria-label="action.label"
+                :class="getToolbarButtonClass(action)"
+                :disabled="!canRunAction(action)"
+                :tooltip="action.label"
+                tooltip-side="top"
+                variant="ghost"
+              >
+                <template v-if="action.triggerText">
+                  <span class="text-xs font-semibold tracking-wide">
+                    {{
+                      typeof action.triggerText === 'function'
+                        ? action.triggerText(editor)
+                        : action.triggerText
+                    }}
+                  </span>
+                  <ChevronDown class="size-4 opacity-70" />
+                </template>
+                <component
+                  v-else-if="action.icon"
+                  :is="action.icon"
+                  class="size-4"
+                />
+                <span
+                  v-if="getActionIndicatorColor(action)"
+                  :style="{ backgroundColor: getActionIndicatorColor(action) }"
+                  class="absolute bottom-1 left-1/2 h-1 w-4 -translate-x-1/2 rounded-full shadow-[0_0_0_1px_hsl(var(--card)/0.7)]"
+                ></span>
+              </VbenIconButton>
+            </template>
+            <div
+              v-if="action.palette"
+              class="flex max-w-52 flex-wrap items-center gap-2"
+            >
+              <button
+                v-for="color in action.palette.colors"
+                :key="color"
+                :aria-label="`${action.label}-${color}`"
+                :class="getPaletteSwatchClass(action, color)"
+                :style="{ backgroundColor: color }"
+                type="button"
+                @click="applyPaletteColor(action, color)"
+              >
+                <Check
+                  v-if="getPaletteCurrentColor(action) === color"
+                  class="size-4 text-white drop-shadow-sm"
+                />
+              </button>
+              <button
+                v-if="action.palette.clear"
+                class="h-8 w-full rounded-xl border border-border bg-secondary text-muted-foreground transition-colors hover:bg-accent hover:text-foreground"
+                type="button"
+                @click="clearPaletteColor(action)"
+              >
+                {{ $t('ui.tiptap.toolbar.clear') }}
+              </button>
+            </div>
+            <div v-else-if="action.menu" class="flex min-w-32 flex-col gap-1">
+              <button
+                v-for="item in action.menu.items"
+                :key="item.shortLabel"
+                :class="getMenuItemClass(item)"
+                :disabled="!canRunMenuItem(item)"
+                type="button"
+                @click="handleMenuItemClick(action, item)"
+              >
+                <span class="w-7 text-xs font-semibold tracking-wide">
+                  {{ item.shortLabel }}
+                </span>
+                <span class="flex-1">{{ item.label }}</span>
+                <Check
+                  v-if="isMenuItemActive(item)"
+                  class="size-4 text-primary"
+                />
+              </button>
+            </div>
+          </VbenPopover>
+          <VbenIconButton
+            v-else
+            :aria-label="action.label"
+            :class="getToolbarButtonClass(action)"
+            :disabled="!canRunAction(action)"
+            :tooltip="action.label"
+            tooltip-side="top"
+            @click="runAction(action)"
+          >
+            <component :is="action.icon" class="size-4" />
+            <span
+              v-if="getActionIndicatorColor(action)"
+              :style="{ backgroundColor: getActionIndicatorColor(action) }"
+              class="absolute bottom-1 left-1/2 h-1 w-4 -translate-x-1/2 rounded-full shadow-[0_0_0_1px_hsl(var(--card)/0.7)]"
+            ></span>
+          </VbenIconButton>
+        </template>
+        <div
+          v-if="groupIndex < toolbarGroups.length - 1"
+          class="ml-1 h-5 w-px bg-border"
+        ></div>
+      </div>
+      <div v-if="previewable" class="ml-auto flex items-center">
+        <VbenIconButton
+          :aria-label="$t('ui.tiptap.toolbar.preview')"
+          :class="
+            getToolbarButtonClass({
+              action: () => {},
+              label: $t('ui.tiptap.toolbar.preview'),
+            })
+          "
+          :tooltip="$t('ui.tiptap.toolbar.preview')"
+          tooltip-side="top"
+          variant="ghost"
+          @click="openPreviewModal"
+        >
+          <Eye class="size-4" />
+        </VbenIconButton>
+      </div>
+    </div>
+    <EditorContent v-if="editor" :editor="editor" class="p-4" />
+    <PreviewModal
+      v-if="previewable"
+      :title="$t('ui.tiptap.toolbar.preview')"
+      class="w-4/5"
+    >
+      <Preview :content="previewContent" :min-height="320" />
+    </PreviewModal>
+  </div>
+</template>
+
+<style scoped>
+.vben-tiptap
+  :deep(.vben-tiptap__content p.is-editor-empty:first-child::before) {
+  float: left;
+  height: 0;
+  color: hsl(var(--input-placeholder));
+  pointer-events: none;
+  content: attr(data-placeholder);
+}
+</style>
diff --git a/packages/effects/plugins/src/tiptap/toolbar.ts b/packages/effects/plugins/src/tiptap/toolbar.ts
new file mode 100644
index 00000000..2bd0eb77
--- /dev/null
+++ b/packages/effects/plugins/src/tiptap/toolbar.ts
@@ -0,0 +1,374 @@
+import type { Editor } from '@tiptap/vue-3';
+
+import type {
+  ImageUploadOptions,
+  ToolbarAction,
+  ToolbarMenuItem,
+} from './types';
+
+import {
+  AlignCenter,
+  AlignLeft,
+  AlignRight,
+  Bold,
+  Highlighter,
+  ImagePlus,
+  Italic,
+  Link2,
+  List,
+  ListOrdered,
+  MessageSquareCode,
+  Paintbrush,
+  Redo2,
+  RemoveFormatting,
+  SquareCode,
+  Strikethrough,
+  TextQuote,
+  Underline,
+  Undo2,
+  Unlink2,
+} from '@vben/icons';
+import { $t } from '@vben/locales';
+import { COLOR_PRESETS } from '@vben/preferences';
+
+import { prompt } from '@vben-core/popup-ui';
+
+const headingLevels = [1, 2, 3, 4] as const;
+const editorColorPresets = [
+  'hsl(var(--foreground))',
+  'hsl(var(--warning))',
+  'hsl(var(--success))',
+  'hsl(var(--destructive))',
+  ...COLOR_PRESETS.map((item) => item.color),
+];
+const editorHighlightPresets = [
+  withAlpha('hsl(var(--warning))', 0.45),
+  withAlpha('hsl(var(--success))', 0.35),
+  withAlpha('hsl(var(--primary))', 0.3),
+  withAlpha('hsl(var(--destructive))', 0.3),
+  ...COLOR_PRESETS.map((item) => withAlpha(item.color, 0.4)),
+];
+
+function createHeadingMenuItems(): ToolbarMenuItem[] {
+  return [
+    {
+      action: (editor) => editor.chain().focus().setParagraph().run(),
+      can: (editor) => editor.can().chain().focus().setParagraph().run(),
+      isActive: (editor) => editor.isActive('paragraph'),
+      label: $t('ui.tiptap.toolbar.paragraph'),
+      shortLabel: 'P',
+    },
+    ...headingLevels.map((level) => ({
+      action: (editor: Editor) =>
+        editor.chain().focus().toggleHeading({ level }).run(),
+      can: (editor: Editor) =>
+        editor.can().chain().focus().toggleHeading({ level }).run(),
+      isActive: (editor: Editor) => editor.isActive('heading', { level }),
+      label: $t(`ui.tiptap.toolbar.heading${level}`),
+      shortLabel: `H${level}`,
+    })),
+  ];
+}
+
+function getHeadingTriggerText(editor?: Editor) {
+  if (editor?.isActive('paragraph')) {
+    return 'P';
+  }
+
+  const level = headingLevels.find((headingLevel) =>
+    editor?.isActive('heading', { level: headingLevel }),
+  );
+
+  return level ? `H${level}` : 'H';
+}
+
+function normalizeLinkUrl(url: string) {
+  if (/^(https?:|mailto:|tel:)/i.test(url)) {
+    return url;
+  }
+
+  return `https://${url}`;
+}
+
+function withAlpha(color: string, alpha: number) {
+  const normalizedAlpha = Math.min(Math.max(alpha, 0), 1);
+  const hslMatch = color.match(/^hsl\((.+)\)$/);
+
+  if (!hslMatch) {
+    return color;
+  }
+
+  return `hsl(${hslMatch[1]} / ${normalizedAlpha})`;
+}
+
+async function handleLinkAction(editor: Editor) {
+  const currentHref = editor.getAttributes('link').href as string | undefined;
+
+  let url: string | undefined;
+
+  try {
+    url = await prompt<string>({
+      componentProps: {
+        placeholder: 'https://example.com',
+      },
+      content: $t('ui.tiptap.prompts.link'),
+      defaultValue: currentHref ?? '',
+    });
+  } catch {
+    return;
+  }
+
+  const nextUrl = (url ?? '').trim();
+
+  if (!nextUrl) {
+    editor.chain().focus().extendMarkRange('link').unsetLink().run();
+    return;
+  }
+
+  editor
+    .chain()
+    .focus()
+    .extendMarkRange('link')
+    .setLink({
+      href: normalizeLinkUrl(nextUrl),
+    })
+    .run();
+}
+
+async function handleImageAction(editor: Editor) {
+  let url: string | undefined;
+
+  try {
+    url = await prompt<string>({
+      componentProps: {
+        placeholder: 'https://example.com/image.png',
+      },
+      content: $t('ui.tiptap.prompts.image'),
+      defaultValue: '',
+    });
+  } catch {
+    return;
+  }
+
+  const nextUrl = (url ?? '').trim();
+
+  if (!nextUrl) {
+    return;
+  }
+
+  editor.chain().focus().setImage({ src: nextUrl }).run();
+}
+
+export function createToolbarGroups(
+  imageUpload?: ImageUploadOptions,
+): ToolbarAction[][] {
+  const headingMenuItems = createHeadingMenuItems();
+
+  return [
+    [
+      {
+        action: (editor) => editor.chain().focus().undo().run(),
+        can: (editor) => editor.can().chain().focus().undo().run(),
+        icon: Undo2,
+        label: $t('ui.tiptap.toolbar.undo'),
+      },
+      {
+        action: (editor) => editor.chain().focus().redo().run(),
+        can: (editor) => editor.can().chain().focus().redo().run(),
+        icon: Redo2,
+        label: $t('ui.tiptap.toolbar.redo'),
+      },
+      {
+        action: (editor) =>
+          editor.chain().focus().clearNodes().unsetAllMarks().run(),
+        icon: RemoveFormatting,
+        label: $t('ui.tiptap.toolbar.clear'),
+      },
+    ],
+    [
+      {
+        action: (editor) => editor.chain().focus().toggleBold().run(),
+        active: { name: 'bold' },
+        can: (editor) => editor.can().chain().focus().toggleBold().run(),
+        icon: Bold,
+        label: $t('ui.tiptap.toolbar.bold'),
+      },
+      {
+        action: (editor) => editor.chain().focus().toggleItalic().run(),
+        active: { name: 'italic' },
+        can: (editor) => editor.can().chain().focus().toggleItalic().run(),
+        icon: Italic,
+        label: $t('ui.tiptap.toolbar.italic'),
+      },
+      {
+        action: (editor) => editor.chain().focus().toggleUnderline().run(),
+        active: { name: 'underline' },
+        can: (editor) => editor.can().chain().focus().toggleUnderline().run(),
+        icon: Underline,
+        label: $t('ui.tiptap.toolbar.underline'),
+      },
+      {
+        action: (editor) => editor.chain().focus().toggleStrike().run(),
+        active: { name: 'strike' },
+        can: (editor) => editor.can().chain().focus().toggleStrike().run(),
+        icon: Strikethrough,
+        label: $t('ui.tiptap.toolbar.strike'),
+      },
+      {
+        action: (editor) => editor.chain().focus().toggleCode().run(),
+        active: { name: 'code' },
+        can: (editor) => editor.can().chain().focus().toggleCode().run(),
+        icon: SquareCode,
+        label: $t('ui.tiptap.toolbar.code'),
+      },
+    ],
+    [
+      {
+        action: () => {},
+        can: (editor) =>
+          headingMenuItems.some((item) => (item.can ? item.can(editor) : true)),
+        isActive: (editor) =>
+          headingMenuItems.some((item) => item.isActive?.(editor)),
+        label: $t('ui.tiptap.toolbar.heading'),
+        menu: {
+          items: headingMenuItems,
+        },
+        triggerText: (editor) => getHeadingTriggerText(editor),
+      },
+      {
+        action: (editor) => editor.chain().focus().toggleBulletList().run(),
+        active: { name: 'bulletList' },
+        can: (editor) => editor.can().chain().focus().toggleBulletList().run(),
+        icon: List,
+        label: $t('ui.tiptap.toolbar.bulletList'),
+      },
+      {
+        action: (editor) => editor.chain().focus().toggleOrderedList().run(),
+        active: { name: 'orderedList' },
+        can: (editor) => editor.can().chain().focus().toggleOrderedList().run(),
+        icon: ListOrdered,
+        label: $t('ui.tiptap.toolbar.orderedList'),
+      },
+      {
+        action: (editor) => editor.chain().focus().toggleBlockquote().run(),
+        active: { name: 'blockquote' },
+        can: (editor) => editor.can().chain().focus().toggleBlockquote().run(),
+        icon: TextQuote,
+        label: $t('ui.tiptap.toolbar.blockquote'),
+      },
+      {
+        action: (editor) => editor.chain().focus().toggleCodeBlock().run(),
+        active: { name: 'codeBlock' },
+        can: (editor) => editor.can().chain().focus().toggleCodeBlock().run(),
+        icon: MessageSquareCode,
+        label: $t('ui.tiptap.toolbar.codeBlock'),
+      },
+    ],
+    [
+      {
+        action: (editor) => handleLinkAction(editor),
+        active: { name: 'link' },
+        can: (editor) =>
+          editor.can().chain().focus().extendMarkRange('link').run(),
+        icon: Link2,
+        label: $t('ui.tiptap.toolbar.link'),
+      },
+      {
+        action: (editor) => editor.chain().focus().unsetLink().run(),
+        can: (editor) => editor.can().chain().focus().unsetLink().run(),
+        icon: Unlink2,
+        isActive: (editor) => editor.isActive('link'),
+        label: $t('ui.tiptap.toolbar.unlink'),
+      },
+      {
+        action: (editor) => handleImageAction(editor),
+        icon: ImagePlus,
+        label: $t('ui.tiptap.toolbar.image'),
+        ...(imageUpload
+          ? {
+              action: () => {},
+              menu: {
+                items: [
+                  {
+                    action: (editor) => {
+                      if (typeof editor.commands.uploadImage === 'function') {
+                        editor.commands.uploadImage();
+                      }
+                    },
+                    label: $t('ui.tiptap.toolbar.imageUpload'),
+                    shortLabel: 'UPL',
+                  },
+                  {
+                    action: (editor) => handleImageAction(editor),
+                    label: $t('ui.tiptap.toolbar.imageUrl'),
+                    shortLabel: 'URL',
+                  },
+                ],
+              },
+            }
+          : {}),
+      },
+    ],
+    [
+      {
+        action: () => {},
+        icon: Paintbrush,
+        indicatorColor: (editor) =>
+          editor.getAttributes('textStyle').color as string | undefined,
+        isActive: (editor) => Boolean(editor.getAttributes('textStyle').color),
+        label: $t('ui.tiptap.toolbar.textColor'),
+        palette: {
+          apply: (editor, color) =>
+            editor.chain().focus().setColor(color).run(),
+          clear: (editor) => editor.chain().focus().unsetColor().run(),
+          colors: editorColorPresets,
+          currentColor: (editor) =>
+            editor.getAttributes('textStyle').color as string | undefined,
+        },
+      },
+      {
+        action: () => {},
+        icon: Highlighter,
+        indicatorColor: (editor) =>
+          (editor.getAttributes('highlight').color as string | undefined) ??
+          '#fef08a',
+        isActive: (editor) => editor.isActive('highlight'),
+        label: $t('ui.tiptap.toolbar.highlightColor'),
+        palette: {
+          apply: (editor, color) =>
+            editor.chain().focus().setHighlight({ color }).run(),
+          clear: (editor) => editor.chain().focus().unsetHighlight().run(),
+          colors: editorHighlightPresets,
+          currentColor: (editor) =>
+            editor.getAttributes('highlight').color as string | undefined,
+        },
+      },
+    ],
+    [
+      {
+        action: (editor) => editor.chain().focus().setTextAlign('left').run(),
+        can: (editor) =>
+          editor.can().chain().focus().setTextAlign('left').run(),
+        icon: AlignLeft,
+        isActive: (editor) => editor.isActive({ textAlign: 'left' }),
+        label: $t('ui.tiptap.toolbar.alignLeft'),
+      },
+      {
+        action: (editor) => editor.chain().focus().setTextAlign('center').run(),
+        can: (editor) =>
+          editor.can().chain().focus().setTextAlign('center').run(),
+        icon: AlignCenter,
+        isActive: (editor) => editor.isActive({ textAlign: 'center' }),
+        label: $t('ui.tiptap.toolbar.alignCenter'),
+      },
+      {
+        action: (editor) => editor.chain().focus().setTextAlign('right').run(),
+        can: (editor) =>
+          editor.can().chain().focus().setTextAlign('right').run(),
+        icon: AlignRight,
+        isActive: (editor) => editor.isActive({ textAlign: 'right' }),
+        label: $t('ui.tiptap.toolbar.alignRight'),
+      },
+    ],
+  ];
+}
diff --git a/packages/effects/plugins/src/tiptap/types.ts b/packages/effects/plugins/src/tiptap/types.ts
new file mode 100644
index 00000000..adf21bf4
--- /dev/null
+++ b/packages/effects/plugins/src/tiptap/types.ts
@@ -0,0 +1,87 @@
+import type { Extensions, JSONContent } from '@tiptap/core';
+import type { Editor } from '@tiptap/vue-3';
+
+import type { Component } from 'vue';
+
+declare module '@tiptap/core' {
+  interface Commands<ReturnType> {
+    imageUpload: {
+      uploadImage: () => ReturnType;
+    };
+  }
+}
+
+export interface ImageUploadOptions {
+  /** 允许的文件类型，默认 'image/*' */
+  accept?: string;
+  /** 最大文件大小(字节)，默认 5MB */
+  maxSize?: number;
+  /** 上传失败回调，未提供时使用 alert 弹窗提示 */
+  onUploadError?: (error: unknown) => void;
+  /** 上传函数，返回图片 URL，可选 onProgress 回调报告上传进度 */
+  upload: (
+    file: File,
+    onProgress?: (percent: number) => void,
+  ) => Promise<string>;
+}
+
+export interface TipTapProps {
+  editable?: boolean;
+  extensions?: Extensions;
+  imageUpload?: ImageUploadOptions;
+  minHeight?: number | string;
+  maxHeight?: number | string;
+  placeholder?: string;
+  previewable?: boolean;
+  toolbar?: boolean;
+}
+
+export interface TipTapPreviewProps {
+  class?: any;
+  content?: string;
+  minHeight?: number | string;
+}
+
+export interface VbenTiptapChangeEvent {
+  html: string;
+  json: JSONContent;
+  text: string;
+}
+
+export interface VbenTiptapExtensionOptions {
+  imageUpload?: ImageUploadOptions;
+  /** 内部使用：追踪 blob URL 以便组件销毁时清理 */
+  _blobUrlTracker?: Set<string>;
+  placeholder?: string;
+}
+
+export interface ToolbarAction {
+  action: (editor: Editor) => void;
+  active?: {
+    attrs?: Record<string, unknown>;
+    name: string;
+  };
+  can?: (editor: Editor) => boolean;
+  icon?: Component;
+  indicatorColor?: (editor: Editor) => string | undefined;
+  isActive?: (editor: Editor) => boolean;
+  label: string;
+  menu?: {
+    items: ToolbarMenuItem[];
+  };
+  palette?: {
+    apply: (editor: Editor, color: string) => void;
+    clear?: (editor: Editor) => void;
+    colors: string[];
+    currentColor?: (editor: Editor) => string | undefined;
+  };
+  triggerText?: ((editor?: Editor) => string) | string;
+}
+
+export interface ToolbarMenuItem {
+  action: (editor: Editor) => void;
+  can?: (editor: Editor) => boolean;
+  isActive?: (editor: Editor) => boolean;
+  label: string;
+  shortLabel: string;
+}
diff --git a/packages/effects/plugins/src/tiptap/use-tiptap-toolbar.ts b/packages/effects/plugins/src/tiptap/use-tiptap-toolbar.ts
new file mode 100644
index 00000000..25d98cbb
--- /dev/null
+++ b/packages/effects/plugins/src/tiptap/use-tiptap-toolbar.ts
@@ -0,0 +1,176 @@
+import type { Editor } from '@tiptap/vue-3';
+
+import type { ShallowRef } from 'vue';
+
+import type { ToolbarAction, ToolbarMenuItem } from './types';
+
+import { cn } from '@vben-core/shared/utils';
+
+interface UseTiptapToolbarOptions {
+  editable: () => boolean;
+  editor: Readonly<ShallowRef<Editor | undefined>>;
+}
+
+export function useTiptapToolbar(options: UseTiptapToolbarOptions) {
+  const getEditor = () => options.editor.value;
+
+  function getActionIndicatorColor(action: ToolbarAction) {
+    const currentEditor = getEditor();
+
+    if (!currentEditor || !action.indicatorColor) {
+      return undefined;
+    }
+
+    return action.indicatorColor(currentEditor);
+  }
+
+  function getPaletteCurrentColor(action: ToolbarAction) {
+    const currentEditor = getEditor();
+
+    if (!currentEditor || !action.palette?.currentColor) {
+      return undefined;
+    }
+
+    return action.palette.currentColor(currentEditor);
+  }
+
+  function canRunAction(action: ToolbarAction) {
+    const currentEditor = getEditor();
+
+    if (!currentEditor || !options.editable()) {
+      return false;
+    }
+
+    return action.can ? action.can(currentEditor) : true;
+  }
+
+  function canRunMenuItem(item: ToolbarMenuItem) {
+    const currentEditor = getEditor();
+
+    if (!currentEditor || !options.editable()) {
+      return false;
+    }
+
+    return item.can ? item.can(currentEditor) : true;
+  }
+
+  function isActionActive(action: ToolbarAction) {
+    const currentEditor = getEditor();
+
+    if (!currentEditor) {
+      return false;
+    }
+
+    if (action.isActive) {
+      return action.isActive(currentEditor);
+    }
+
+    if (!action.active) {
+      return false;
+    }
+
+    return currentEditor.isActive(action.active.name, action.active.attrs);
+  }
+
+  function isMenuItemActive(item: ToolbarMenuItem, currentEditor?: Editor) {
+    const targetEditor = currentEditor ?? getEditor();
+
+    if (!targetEditor || !item.isActive) {
+      return false;
+    }
+
+    return item.isActive(targetEditor);
+  }
+
+  function runAction(action: ToolbarAction) {
+    const currentEditor = getEditor();
+
+    if (!currentEditor || !options.editable()) {
+      return;
+    }
+
+    if (action.menu || action.palette) {
+      return;
+    }
+
+    action.action(currentEditor);
+  }
+
+  function runMenuItem(item: ToolbarMenuItem) {
+    const currentEditor = getEditor();
+
+    if (!currentEditor || !options.editable()) {
+      return;
+    }
+
+    item.action(currentEditor);
+  }
+
+  function applyPaletteColor(action: ToolbarAction, color: string) {
+    const currentEditor = getEditor();
+
+    if (!currentEditor || !action.palette) {
+      return;
+    }
+
+    action.palette.apply(currentEditor, color);
+  }
+
+  function clearPaletteColor(action: ToolbarAction) {
+    const currentEditor = getEditor();
+
+    if (!currentEditor || !action.palette?.clear) {
+      return;
+    }
+
+    action.palette.clear(currentEditor);
+  }
+
+  function getToolbarButtonClass(action: ToolbarAction) {
+    return cn(
+      'text-muted-foreground relative rounded-[10px] border border-transparent bg-transparent shadow-none',
+      'transition-[transform,color,background-color,border-color,box-shadow] duration-200 ease-out',
+      'enabled:hover:border-border enabled:hover:-translate-y-px disabled:opacity-45',
+      'enabled:hover:bg-accent enabled:hover:text-foreground',
+      isActionActive(action) &&
+        'bg-accent border-primary/30 shadow-primary text-primary',
+    );
+  }
+
+  function getPaletteSwatchClass(action: ToolbarAction, color: string) {
+    return cn(
+      'border-border inline-flex size-8 items-center justify-center rounded-full border',
+      'shadow-accent',
+      'transition-[transform,box-shadow,border-color] duration-200 ease-out',
+      'hover:-translate-y-px hover:scale-[1.04]',
+      getPaletteCurrentColor(action) === color &&
+        'border-primary shadow-primary',
+    );
+  }
+
+  function getMenuItemClass(item: ToolbarMenuItem) {
+    return cn(
+      'flex items-center gap-2 rounded-lg p-2 text-left text-sm transition-colors',
+      'disabled:cursor-not-allowed disabled:opacity-45',
+      isMenuItemActive(item)
+        ? 'bg-accent text-foreground'
+        : 'hover:bg-accent hover:text-foreground text-muted-foreground',
+    );
+  }
+
+  return {
+    applyPaletteColor,
+    canRunAction,
+    canRunMenuItem,
+    clearPaletteColor,
+    getActionIndicatorColor,
+    getMenuItemClass,
+    getPaletteCurrentColor,
+    getPaletteSwatchClass,
+    getToolbarButtonClass,
+    isActionActive,
+    isMenuItemActive,
+    runAction,
+    runMenuItem,
+  };
+}
diff --git a/packages/effects/plugins/src/types.ts b/packages/effects/plugins/src/types.ts
new file mode 100644
index 00000000..9a989784
--- /dev/null
+++ b/packages/effects/plugins/src/types.ts
@@ -0,0 +1,24 @@
+import type { Component } from 'vue';
+
+export interface VbenPluginsFormOptions {
+  useVbenForm: (...args: any[]) => any;
+}
+
+export interface VbenPluginsModalOptions {
+  useVbenModal?: () => any;
+}
+
+export interface VbenPluginsMessageOptions {
+  useMessage?: () => any;
+}
+
+export interface VbenPluginsComponentsOptions {
+  [key: string]: Component;
+}
+
+export interface VbenPluginsOptions {
+  form?: VbenPluginsFormOptions;
+  modal?: VbenPluginsModalOptions;
+  message?: VbenPluginsMessageOptions;
+  components?: VbenPluginsComponentsOptions;
+}
diff --git a/packages/effects/plugins/src/vxe-table/README.md b/packages/effects/plugins/src/vxe-table/README.md
new file mode 100644
index 00000000..2dfd2b29
--- /dev/null
+++ b/packages/effects/plugins/src/vxe-table/README.md
@@ -0,0 +1,50 @@
+# VXE Table Plugin
+
+基于 vxe-table 和 vxe-pc-ui 的表格组件插件。
+
+## 导出
+
+| 导出                  | 类型 | 说明           |
+| --------------------- | ---- | -------------- |
+| `setupVbenVxeTable`   | 函数 | 初始化配置函数 |
+| `useVbenVxeGrid`      | 函数 | 表格组合式函数 |
+| `VbenVxeGrid`         | 组件 | 表格组件       |
+| `VxeTableGridColumns` | 类型 | 表格列类型     |
+| `VxeTableGridOptions` | 类型 | 表格配置类型   |
+| `VxeGridProps`        | 类型 | 表格 Props     |
+| `VxeGridListeners`    | 类型 | 表格事件类型   |
+
+## 使用
+
+```ts
+import {
+  setupVbenVxeTable,
+  useVbenVxeGrid,
+  VbenVxeGrid,
+} from '@vben/plugins/vxe-table';
+```
+
+## 初始化
+
+在应用入口处调用：
+
+```ts
+import { setupVbenVxeTable } from '@vben/plugins/vxe-table';
+import { useVbenForm } from '@vben-core/form-ui';
+
+setupVbenVxeTable({
+  configVxeTable: (vxeUI) => {
+    // 配置 VXE Table
+  },
+  useVbenForm,
+});
+```
+
+## 类型
+
+```ts
+import type {
+  VxeTableGridOptions,
+  VxeGridProps,
+} from '@vben/plugins/vxe-table';
+```
diff --git a/packages/effects/plugins/src/vxe-table/api.ts b/packages/effects/plugins/src/vxe-table/api.ts
index 0bff8b38..6f9bf7ff 100644
--- a/packages/effects/plugins/src/vxe-table/api.ts
+++ b/packages/effects/plugins/src/vxe-table/api.ts
@@ -1,7 +1,13 @@
-import type { ExtendedFormApi } from '@vben-core/form-ui';
 import type { VxeGridInstance } from 'vxe-table';
 
+import type {
+  BaseFormComponentType,
+  ExtendedFormApi,
+  FormValues,
+} from '@vben-core/form-ui';
+
 import type { VxeGridProps } from './types';
+import type { ViewedRowHelper } from './viewed-row';
 
 import { toRaw } from 'vue';
 
@@ -25,39 +31,102 @@ function getDefaultState(): VxeGridProps {
   };
 }
 
-export class VxeGridApi {
+export class VxeGridApi<
+  T extends Record<string, any> = any,
+  D extends BaseFormComponentType = BaseFormComponentType,
+  P extends Record<string, any> = Record<never, never>,
+  TFormValues extends FormValues = FormValues,
+  TSubmitValues extends FormValues = TFormValues,
+> {
+  public formApi = {} as ExtendedFormApi<TFormValues, D, P, TSubmitValues>;
+
+  // private prevState: null | VxeGridProps = null;
+  public grid = {} as VxeGridInstance<T>;
+  public state: null | VxeGridProps<T, D, P, TFormValues, TSubmitValues> = null;
+
+  public store: Store<VxeGridProps<T, D, P, TFormValues, TSubmitValues>>;
+
+  /**
+   * 已读行 helper（在 mount 中初始化，业务能力全部封装在 useViewedRow 中）
+   */
+  public viewedRowHelper: null | ViewedRowHelper<T> = null;
+
   private isMounted = false;
 
   private stateHandler: StateHandler;
-  public formApi = {} as ExtendedFormApi;
 
-  // private prevState: null | VxeGridProps = null;
-  public grid = {} as VxeGridInstance;
-
-  public state: null | VxeGridProps = null;
-
-  public store: Store<VxeGridProps>;
-
-  constructor(options: VxeGridProps = {}) {
+  constructor(
+    options: VxeGridProps<
+      T,
+      D,
+      P,
+      TFormValues,
+      TSubmitValues
+    > = {} as VxeGridProps<T, D, P, TFormValues, TSubmitValues>,
+  ) {
     const storeState = { ...options };
 
     const defaultState = getDefaultState();
-    this.store = new Store<VxeGridProps>(
-      mergeWithArrayOverride(storeState, defaultState),
-      {
-        onUpdate: () => {
-          // this.prevState = this.state;
-          this.state = this.store.state;
-        },
-      },
+    this.store = new Store<VxeGridProps<T, D, P, TFormValues, TSubmitValues>>(
+      mergeWithArrayOverride(storeState, defaultState) as VxeGridProps<
+        T,
+        D,
+        P,
+        TFormValues,
+        TSubmitValues
+      >,
     );
 
+    this.store.subscribe((state) => {
+      // this.prevState = this.state;
+      this.state = state;
+    });
+
     this.state = this.store.state;
     this.stateHandler = new StateHandler();
     bindMethods(this);
   }
 
-  mount(instance: null | VxeGridInstance, formApi: ExtendedFormApi) {
+  /**
+   * 清除所有已读状态
+   */
+  clearViewedRows() {
+    this.viewedRowHelper?.clearViewed();
+  }
+
+  /**
+   * 获取所有已读的 key 集合（返回副本，避免外部修改内部状态）
+   */
+  getViewedKeys(): Set<number | string> {
+    const raw = this.viewedRowHelper?.viewedSet.value;
+    return raw ? new Set(raw) : new Set();
+  }
+
+  /**
+   * 判断某行是否已读
+   */
+  isRowViewed(record: T): boolean {
+    return this.viewedRowHelper?.isViewed(record) ?? false;
+  }
+
+  /**
+   * 批量标记行为已读
+   */
+  markKeysAsViewed(keys: Array<number | string>) {
+    this.viewedRowHelper?.markKeysAsViewed(keys);
+  }
+
+  /**
+   * 标记某行为已读
+   */
+  markRowAsViewed(record: T) {
+    this.viewedRowHelper?.markAsViewed(record);
+  }
+
+  mount(
+    instance: null | VxeGridInstance,
+    formApi: ExtendedFormApi<TFormValues, D, P, TSubmitValues>,
+  ) {
     if (!this.isMounted && instance) {
       this.grid = instance;
       this.formApi = formApi;
@@ -82,7 +151,18 @@ export class VxeGridApi {
     }
   }
 
-  setGridOptions(options: Partial<VxeGridProps['gridOptions']>) {
+  /**
+   * 移除指定 key 的已读状态
+   */
+  removeViewedKeys(keys: Array<number | string>) {
+    this.viewedRowHelper?.removeKeys(keys);
+  }
+
+  setGridOptions(
+    options: Partial<
+      VxeGridProps<T, D, P, TFormValues, TSubmitValues>['gridOptions']
+    >,
+  ) {
     this.setState({
       gridOptions: options,
     });
@@ -98,8 +178,10 @@ export class VxeGridApi {
 
   setState(
     stateOrFn:
-      | ((prev: VxeGridProps) => Partial<VxeGridProps>)
-      | Partial<VxeGridProps>,
+      | ((
+          prev: VxeGridProps<T, D, P, TFormValues, TSubmitValues>,
+        ) => Partial<VxeGridProps<T, D, P, TFormValues, TSubmitValues>>)
+      | Partial<VxeGridProps<T, D, P, TFormValues, TSubmitValues>>,
   ) {
     if (isFunction(stateOrFn)) {
       this.store.setState((prev) => {
@@ -123,5 +205,6 @@ export class VxeGridApi {
   unmount() {
     this.isMounted = false;
     this.stateHandler.reset();
+    this.viewedRowHelper = null;
   }
 }
diff --git a/packages/effects/plugins/src/vxe-table/extends.ts b/packages/effects/plugins/src/vxe-table/extends.ts
index d20ecfa7..a6cf4ca3 100644
--- a/packages/effects/plugins/src/vxe-table/extends.ts
+++ b/packages/effects/plugins/src/vxe-table/extends.ts
@@ -1,6 +1,7 @@
-import type { Recordable } from '@vben/types';
 import type { VxeGridProps, VxeUIExport } from 'vxe-table';
 
+import type { Recordable } from '@vben/types';
+
 import type { VxeGridApi } from './api';
 
 import { formatDate, formatDateTime, isFunction } from '@vben/utils';
diff --git a/packages/effects/plugins/src/vxe-table/index.ts b/packages/effects/plugins/src/vxe-table/index.ts
index 38fe5880..6f0efe44 100644
--- a/packages/effects/plugins/src/vxe-table/index.ts
+++ b/packages/effects/plugins/src/vxe-table/index.ts
@@ -1,6 +1,10 @@
 export { setupVbenVxeTable } from './init';
-export type { VxeTableGridOptions } from './types';
+export type { VxeTableGridColumns, VxeTableGridOptions } from './types';
 export * from './use-vxe-grid';
 
 export { default as VbenVxeGrid } from './use-vxe-grid.vue';
-export type { VxeGridListeners, VxeGridProps } from 'vxe-table';
+export type {
+  VxeGridListeners,
+  VxeGridProps,
+  VxeGridPropTypes,
+} from 'vxe-table';
diff --git a/packages/effects/plugins/src/vxe-table/init.ts b/packages/effects/plugins/src/vxe-table/init.ts
index 9051cd17..61b6ca77 100644
--- a/packages/effects/plugins/src/vxe-table/init.ts
+++ b/packages/effects/plugins/src/vxe-table/init.ts
@@ -3,39 +3,23 @@ import type { SetupVxeTable } from './types';
 import { defineComponent, watch } from 'vue';
 
 import { usePreferences } from '@vben/preferences';
-import { useVbenForm } from '@vben-core/form-ui';
 
 import {
   VxeButton,
   VxeCheckbox,
-
-  // VxeFormGather,
-  // VxeForm,
-  // VxeFormItem,
   VxeIcon,
   VxeInput,
   VxeLoading,
   VxeModal,
   VxeNumberInput,
   VxePager,
-  // VxeList,
-  // VxeModal,
-  // VxeOptgroup,
-  // VxeOption,
-  // VxePulldown,
-  // VxeRadio,
-  // VxeRadioButton,
   VxeRadioGroup,
   VxeSelect,
   VxeTooltip,
   VxeUI,
   VxeUpload,
-  // VxeSwitch,
-  // VxeTextarea,
 } from 'vxe-pc-ui';
-import enUS from 'vxe-pc-ui/lib/language/en-US';
-
-// 导入默认的语言
+import enUS from 'vxe-pc-ui/lib/language/en-US'; // 导入默认的语言
 import zhCN from 'vxe-pc-ui/lib/language/zh-CN';
 import {
   VxeColgroup,
@@ -45,13 +29,37 @@ import {
   VxeToolbar,
 } from 'vxe-table';
 
-import { extendsDefaultFormatter } from './extends';
+import { injectPluginsOptions } from '../plugins-context';
+import { extendsDefaultFormatter } from './extends'; // 是否加载过
 
 // 是否加载过
 let isInit = false;
 
-// eslint-disable-next-line import/no-mutable-exports
-export let useTableForm: typeof useVbenForm;
+let tableFormFactory: ((...args: any[]) => any) | undefined;
+
+function normalizeVxeLocale<T extends Record<string, any>>(localeModule: T) {
+  return (
+    localeModule &&
+    typeof localeModule === 'object' &&
+    'default' in localeModule
+      ? localeModule.default
+      : localeModule
+  ) as T;
+}
+
+export function useTableForm(...args: any[]) {
+  const pluginsOptions = injectPluginsOptions();
+  const contextFormFactory = pluginsOptions?.form?.useVbenForm;
+
+  const factory = tableFormFactory || contextFormFactory;
+  if (!factory) {
+    throw new Error(
+      'useTableForm is not initialized. Please provide useVbenForm via setupVbenVxeTable() or providePluginsOptions()',
+    );
+  }
+
+  return factory(...args);
+}
 
 // 部分组件，如果没注册，vxe-table 会报错，这里实际没用组件，只是为了不报错，同时可以减少打包体积
 const createVirtualComponent = (name = '') => {
@@ -101,24 +109,27 @@ export function initVxeTable() {
 }
 
 export function setupVbenVxeTable(setupOptions: SetupVxeTable) {
-  const { configVxeTable, useVbenForm } = setupOptions;
+  const { configVxeTable, useVbenForm: useVbenFormFromParam } = setupOptions;
 
   initVxeTable();
-  useTableForm = useVbenForm;
 
-  const preference = usePreferences();
+  // 优先使用参数传入的 useVbenForm，否则清空让 context 注入生效
+  if (useVbenFormFromParam) {
+    tableFormFactory = useVbenFormFromParam;
+  }
+  const { isDark, locale } = usePreferences();
 
   const localMap = {
-    'zh-CN': zhCN,
-    'en-US': enUS,
+    'zh-CN': normalizeVxeLocale(zhCN),
+    'en-US': normalizeVxeLocale(enUS),
   };
 
   watch(
-    [() => preference.theme.value, () => preference.locale.value],
-    ([theme, locale]) => {
-      VxeUI.setTheme(theme === 'dark' ? 'dark' : 'light');
-      VxeUI.setI18n(locale, localMap[locale]);
-      VxeUI.setLanguage(locale);
+    [() => isDark.value, () => locale.value],
+    ([isDarkValue, localeValue]) => {
+      VxeUI.setTheme(isDarkValue ? 'dark' : 'light');
+      VxeUI.setI18n(localeValue, localMap[localeValue]);
+      VxeUI.setLanguage(localeValue);
     },
     {
       immediate: true,
diff --git a/packages/effects/plugins/src/vxe-table/style.css b/packages/effects/plugins/src/vxe-table/style.css
index 2f8fa843..89d6733d 100644
--- a/packages/effects/plugins/src/vxe-table/style.css
+++ b/packages/effects/plugins/src/vxe-table/style.css
@@ -1,3 +1,5 @@
+@reference "@vben/tailwind-config/theme";
+
 :root .vxe-grid {
   --vxe-ui-font-color: hsl(var(--foreground));
   --vxe-ui-font-primary-color: hsl(var(--primary));
@@ -45,6 +47,11 @@
   );
   --vxe-ui-table-row-current-background-color: hsl(var(--accent));
   --vxe-ui-table-row-hover-current-background-color: hsl(var(--accent-hover));
+  --vxe-ui-font-primary-tinge-color: hsl(var(--primary));
+  --vxe-ui-font-primary-lighten-color: hsl(var(--primary) / 60%);
+  --vxe-ui-font-primary-darken-color: hsl(var(--primary));
+
+  height: auto !important;
 
   /* --vxe-ui-table-fixed-scrolling-box-shadow-color: rgb(0 0 0 / 80%); */
 }
@@ -102,3 +109,20 @@
 .vxe-tools--operate:not(:has(button)) {
   margin-left: 0;
 }
+
+.vxe-grid--layout-header-wrapper {
+  overflow: visible;
+}
+
+.vxe-grid--layout-body-content-wrapper {
+  overflow: hidden;
+}
+
+/* 已读行默认样式 */
+.vxe-row--viewed {
+  color: hsl(var(--foreground) / 50%);
+
+  .vxe-body--column {
+    opacity: 0.9;
+  }
+}
diff --git a/packages/effects/plugins/src/vxe-table/types.ts b/packages/effects/plugins/src/vxe-table/types.ts
index 7e8f2b83..f6fd81e4 100644
--- a/packages/effects/plugins/src/vxe-table/types.ts
+++ b/packages/effects/plugins/src/vxe-table/types.ts
@@ -1,5 +1,3 @@
-import type { ClassType, DeepPartial } from '@vben/types';
-import type { VbenFormProps } from '@vben-core/form-ui';
 import type {
   VxeGridListeners,
   VxeGridPropTypes,
@@ -7,10 +5,19 @@ import type {
   VxeUIExport,
 } from 'vxe-table';
 
-import type { VxeGridApi } from './api';
-
 import type { Ref } from 'vue';
 
+import type { ClassType, DeepPartial } from '@vben/types';
+
+import type {
+  BaseFormComponentType,
+  FormValues,
+  VbenFormProps,
+} from '@vben-core/form-ui';
+
+import type { VxeGridApi } from './api';
+import type { ViewedRowOptions } from './viewed-row';
+
 import { useVbenForm } from '@vben-core/form-ui';
 
 export interface VxePaginationInfo {
@@ -24,12 +31,29 @@ interface ToolbarConfigOptions extends VxeGridPropTypes.ToolbarConfig {
   search?: boolean;
 }
 
+export type VxeTableGridColumns<T = any> = VxeTableGridOptions<T>['columns'];
+
 export interface VxeTableGridOptions<T = any> extends VxeTableGridProps<T> {
   /** 工具栏配置 */
   toolbarConfig?: ToolbarConfigOptions;
 }
 
-export interface VxeGridProps {
+export interface SeparatorOptions {
+  show?: boolean;
+  backgroundColor?: string;
+}
+
+export interface VxeGridProps<
+  T extends Record<string, any> = any,
+  D extends BaseFormComponentType = BaseFormComponentType,
+  P extends Record<string, any> = Record<never, never>,
+  TFormValues extends FormValues = FormValues,
+  TSubmitValues extends FormValues = TFormValues,
+> {
+  /**
+   * 数据
+   */
+  tableData?: any[];
   /**
    * 标题
    */
@@ -49,28 +73,44 @@ export interface VxeGridProps {
   /**
    * vxe-grid 配置
    */
-  gridOptions?: DeepPartial<VxeTableGridOptions>;
+  gridOptions?: DeepPartial<VxeTableGridOptions<T>>;
   /**
    * vxe-grid 事件
    */
-  gridEvents?: DeepPartial<VxeGridListeners>;
+  gridEvents?: DeepPartial<VxeGridListeners<T>>;
   /**
    * 表单配置
    */
-  formOptions?: VbenFormProps;
+  formOptions?: VbenFormProps<D, P, TFormValues, TSubmitValues>;
   /**
    * 显示搜索表单
    */
   showSearchForm?: boolean;
+  /**
+   * 搜索表单与表格主体之间的分隔条
+   */
+  separator?: boolean | SeparatorOptions;
+  /**
+   * 已读行功能
+   */
+  viewedRowOptions?: boolean | ViewedRowOptions<T>;
 }
 
-export type ExtendedVxeGridApi = {
-  useStore: <T = NoInfer<VxeGridProps>>(
-    selector?: (state: NoInfer<VxeGridProps>) => T,
-  ) => Readonly<Ref<T>>;
-} & VxeGridApi;
+export type ExtendedVxeGridApi<
+  D extends Record<string, any> = any,
+  F extends BaseFormComponentType = BaseFormComponentType,
+  P extends Record<string, any> = Record<never, never>,
+  TFormValues extends FormValues = FormValues,
+  TSubmitValues extends FormValues = TFormValues,
+> = VxeGridApi<D, F, P, TFormValues, TSubmitValues> & {
+  useStore: <S = NoInfer<VxeGridProps<D, F, P, TFormValues, TSubmitValues>>>(
+    selector?: (
+      state: NoInfer<VxeGridProps<D, F, P, TFormValues, TSubmitValues>>,
+    ) => S,
+  ) => Readonly<Ref<S>>;
+};
 
 export interface SetupVxeTable {
   configVxeTable: (ui: VxeUIExport) => void;
-  useVbenForm: typeof useVbenForm;
+  useVbenForm?: typeof useVbenForm;
 }
diff --git a/packages/effects/plugins/src/vxe-table/use-vxe-grid.ts b/packages/effects/plugins/src/vxe-table/use-vxe-grid.ts
index a309f5ac..8d7a2e47 100644
--- a/packages/effects/plugins/src/vxe-table/use-vxe-grid.ts
+++ b/packages/effects/plugins/src/vxe-table/use-vxe-grid.ts
@@ -1,3 +1,9 @@
+import type { VxeGridSlots, VxeGridSlotTypes } from 'vxe-table';
+
+import type { SlotsType } from 'vue';
+
+import type { BaseFormComponentType, FormValues } from '@vben-core/form-ui';
+
 import type { ExtendedVxeGridApi, VxeGridProps } from './types';
 
 import { defineComponent, h, onBeforeUnmount } from 'vue';
@@ -7,25 +13,62 @@ import { useStore } from '@vben-core/shared/store';
 import { VxeGridApi } from './api';
 import VxeGrid from './use-vxe-grid.vue';
 
-export function useVbenVxeGrid(options: VxeGridProps) {
+type FilteredSlots<T> = {
+  [K in keyof VxeGridSlots<T> as K extends 'form'
+    ? never
+    : K]: VxeGridSlots<T>[K];
+};
+
+export function useVbenVxeGrid<
+  T extends Record<string, any> = any,
+  D extends BaseFormComponentType = BaseFormComponentType,
+  P extends Record<string, any> = Record<never, never>,
+  TFormValues extends FormValues = FormValues,
+  TSubmitValues extends FormValues = TFormValues,
+>(options: VxeGridProps<T, D, P, TFormValues, TSubmitValues>) {
   // const IS_REACTIVE = isReactive(options);
-  const api = new VxeGridApi(options);
-  const extendedApi: ExtendedVxeGridApi = api as ExtendedVxeGridApi;
+  const api = new VxeGridApi<T, D, P, TFormValues, TSubmitValues>(options);
+  const extendedApi: ExtendedVxeGridApi<T, D, P, TFormValues, TSubmitValues> =
+    api as ExtendedVxeGridApi<T, D, P, TFormValues, TSubmitValues>;
   extendedApi.useStore = (selector) => {
     return useStore(api.store, selector);
   };
 
   const Grid = defineComponent(
-    (props: VxeGridProps, { attrs, slots }) => {
+    (
+      props: VxeGridProps<T, D, P, TFormValues, TSubmitValues>,
+      { attrs, slots },
+    ) => {
       onBeforeUnmount(() => {
         api.unmount();
       });
-      api.setState({ ...props, ...attrs });
-      return () => h(VxeGrid, { ...props, ...attrs, api: extendedApi }, slots);
+      api.setState({ ...props, ...attrs } as Partial<
+        VxeGridProps<T, D, P, TFormValues, TSubmitValues>
+      >);
+      return () =>
+        h(
+          VxeGrid,
+          {
+            ...props,
+            ...attrs,
+            api: extendedApi as ExtendedVxeGridApi,
+          } as any,
+          slots,
+        );
     },
     {
-      inheritAttrs: false,
       name: 'VbenVxeGrid',
+      inheritAttrs: false,
+      slots: Object as SlotsType<
+        {
+          // 表格标题
+          'table-title': undefined;
+          // 工具栏左侧部分
+          'toolbar-actions': VxeGridSlotTypes.DefaultSlotParams<T>;
+          // 工具栏右侧部分
+          'toolbar-tools': VxeGridSlotTypes.DefaultSlotParams<T>;
+        } & FilteredSlots<T>
+      >,
     },
   );
   // Add reactivity support
diff --git a/packages/effects/plugins/src/vxe-table/use-vxe-grid.vue b/packages/effects/plugins/src/vxe-table/use-vxe-grid.vue
index 573fe583..ae671258 100644
--- a/packages/effects/plugins/src/vxe-table/use-vxe-grid.vue
+++ b/packages/effects/plugins/src/vxe-table/use-vxe-grid.vue
@@ -1,5 +1,4 @@
 <script lang="ts" setup>
-import type { VbenFormProps } from '@vben-core/form-ui';
 import type {
   VxeGridDefines,
   VxeGridInstance,
@@ -9,6 +8,10 @@ import type {
   VxeToolbarPropTypes,
 } from 'vxe-table';
 
+import type { SetupContext } from 'vue';
+
+import type { VbenFormProps } from '@vben-core/form-ui';
+
 import type { ExtendedVxeGridApi, VxeGridProps } from './types';
 
 import {
@@ -26,13 +29,22 @@ import { usePriorityValues } from '@vben/hooks';
 import { EmptyIcon } from '@vben/icons';
 import { $t } from '@vben/locales';
 import { usePreferences } from '@vben/preferences';
-import { cloneDeep, cn, mergeWithArrayOverride } from '@vben/utils';
+import {
+  cloneDeep,
+  cn,
+  isBoolean,
+  isEqual,
+  mergeWithArrayOverride,
+} from '@vben/utils';
+
 import { VbenHelpTooltip, VbenLoading } from '@vben-core/shadcn-ui';
 
+import { VxeButton } from 'vxe-pc-ui';
 import { VxeGrid, VxeUI } from 'vxe-table';
 
 import { extendProxyOptions } from './extends';
 import { useTableForm } from './init';
+import { applyViewedRowOptions, useViewedRow } from './viewed-row';
 
 import 'vxe-table/styles/cssvar.scss';
 import 'vxe-pc-ui/styles/cssvar.scss';
@@ -48,6 +60,7 @@ const FORM_SLOT_PREFIX = 'form-';
 
 const TOOLBAR_ACTIONS = 'toolbar-actions';
 const TOOLBAR_TOOLS = 'toolbar-tools';
+const TABLE_TITLE = 'table-title';
 
 const gridRef = useTemplateRef<VxeGridInstance>('gridRef');
 
@@ -60,26 +73,71 @@ const {
   gridEvents,
   formOptions,
   tableTitle,
+  tableData,
   tableTitleHelp,
   showSearchForm,
+  separator,
+  viewedRowOptions,
 } = usePriorityValues(props, state);
 
-const { isMobile } = usePreferences();
+// viewedRowOptions：helper 只创建一次（persist/keyField 不支持运行时切换）
+// actionCodes、rowClassName、rowStyle、viewedKeys 的变化通过 options computed 自然响应
+const gridApi = props.api;
 
-const slots = useSlots();
+watch(
+  viewedRowOptions,
+  (cfg) => {
+    // helper 已存在则不重建
+    if (gridApi.viewedRowHelper) return;
+
+    if (!cfg) return;
+
+    const keyField = (gridOptions.value?.rowConfig as any)?.keyField || 'id';
+    const resolved = isBoolean(cfg) ? { keyField } : { keyField, ...cfg };
+    gridApi.viewedRowHelper = useViewedRow(resolved);
+  },
+  { immediate: true },
+);
+
+const { isMobile } = usePreferences();
+const isSeparator = computed(() => {
+  if (
+    !formOptions.value ||
+    showSearchForm.value === false ||
+    separator.value === false
+  ) {
+    return false;
+  }
+  if (separator.value === true || separator.value === undefined) {
+    return true;
+  }
+  return separator.value.show !== false;
+});
+const separatorBg = computed(() => {
+  return !separator.value ||
+    isBoolean(separator.value) ||
+    !separator.value.backgroundColor
+    ? undefined
+    : separator.value.backgroundColor;
+});
+const slots: SetupContext['slots'] = useSlots();
 
 const [Form, formApi] = useTableForm({
   compact: true,
   handleSubmit: async () => {
-    const formValues = formApi.form.values;
+    const formValues = await formApi.getValues();
     formApi.setLatestSubmissionValues(toRaw(formValues));
     props.api.reload(formValues);
   },
   handleReset: async () => {
-    await formApi.resetForm();
-    const formValues = formApi.form.values;
+    const prevValues = await formApi.getValues();
+    await formApi.reset();
+    const formValues = await formApi.getValues();
     formApi.setLatestSubmissionValues(formValues);
-    props.api.reload(formValues);
+    // 如果值发生了变化，submitOnChange会触发刷新。所以只在submitOnChange为false或者值没有发生变化时，手动刷新
+    if (isEqual(prevValues, formValues) || !formOptions.value?.submitOnChange) {
+      props.api.reload(formValues);
+    }
   },
   commonConfig: {
     componentProps: {
@@ -88,13 +146,13 @@ const [Form, formApi] = useTableForm({
   },
   showCollapseButton: true,
   submitButtonOptions: {
-    content: $t('common.query'),
+    content: computed(() => $t('common.search')),
   },
   wrapperClass: 'grid-cols-1 md:grid-cols-2 lg:grid-cols-3',
 });
 
 const showTableTitle = computed(() => {
-  return !!slots.tableTitle?.() || tableTitle.value;
+  return !!slots[TABLE_TITLE]?.() || tableTitle.value;
 });
 
 const showToolbar = computed(() => {
@@ -110,10 +168,12 @@ const toolbarOptions = computed(() => {
   const slotTools = slots[TOOLBAR_TOOLS]?.();
   const searchBtn: VxeToolbarPropTypes.ToolConfig = {
     code: 'search',
-    icon: 'vxe-icon--search',
+    icon: 'vxe-icon-search',
     circle: true,
     status: showSearchForm.value ? 'primary' : undefined,
-    title: $t('common.search'),
+    title: showSearchForm.value
+      ? $t('common.hideSearchPanel')
+      : $t('common.showSearchPanel'),
   };
   // 将搜索按钮合并到用户配置的toolbarConfig.tools中
   const toolbarConfig: VxeGridPropTypes.ToolbarConfig = {
@@ -127,6 +187,7 @@ const toolbarOptions = computed(() => {
   }
 
   if (!showToolbar.value) {
+    toolbarConfig.enabled = false;
     return { toolbarConfig };
   }
 
@@ -191,18 +252,35 @@ const options = computed(() => {
   if (mergedOptions.formConfig) {
     mergedOptions.formConfig.enabled = false;
   }
+  if (tableData.value && tableData.value.length > 0) {
+    mergedOptions.data = tableData.value;
+  }
+
+  // 注入已读行功能（rowClassName、rowStyle、columns 拦截）
+  if (viewedRowOptions.value && gridApi.viewedRowHelper) {
+    applyViewedRowOptions(
+      mergedOptions,
+      viewedRowOptions.value,
+      gridApi.viewedRowHelper,
+    );
+  }
+
   return mergedOptions;
 });
 
 function onToolbarToolClick(event: VxeGridDefines.ToolbarToolClickEventParams) {
   if (event.code === 'search') {
-    props.api?.toggleSearchForm?.();
+    onSearchBtnClick();
   }
   (
     gridEvents.value?.toolbarToolClick as VxeGridListeners['toolbarToolClick']
   )?.(event);
 }
 
+function onSearchBtnClick() {
+  props.api?.toggleSearchForm?.();
+}
+
 const events = computed(() => {
   return {
     ...gridEvents.value,
@@ -214,7 +292,11 @@ const delegatedSlots = computed(() => {
   const resultSlots: string[] = [];
 
   for (const key of Object.keys(slots)) {
-    if (!['empty', 'form', 'loading', TOOLBAR_ACTIONS].includes(key)) {
+    if (
+      !['empty', 'form', 'loading', TOOLBAR_ACTIONS, TOOLBAR_TOOLS].includes(
+        key,
+      )
+    ) {
       resultSlots.push(key);
     }
   }
@@ -232,6 +314,15 @@ const delegatedFormSlots = computed(() => {
   return resultSlots.map((key) => key.replace(FORM_SLOT_PREFIX, ''));
 });
 
+const showDefaultEmpty = computed(() => {
+  // 检查是否有原生的 VXE Table 空状态配置
+  const hasEmptyText = options.value.emptyText !== undefined;
+  const hasEmptyRender = options.value.emptyRender !== undefined;
+
+  // 如果有原生配置，就不显示默认的空状态
+  return !hasEmptyText && !hasEmptyRender;
+});
+
 async function init() {
   await nextTick();
   const globalGridConfig = VxeUI?.getConfig()?.grid ?? {};
@@ -244,8 +335,10 @@ async function init() {
   const autoLoad = defaultGridOptions.proxyConfig?.autoLoad;
   const enableProxyConfig = options.value.proxyConfig?.enabled;
   if (enableProxyConfig && autoLoad) {
-    props.api.grid.commitProxy?.('_init', formApi.form?.values ?? {});
-    // props.api.reload(formApi.form?.values ?? {});
+    props.api.grid.commitProxy?.(
+      'query',
+      formOptions.value ? ((await formApi.getValues()) ?? {}) : {},
+    );
   }
 
   // form 由 vben-form代替，所以不适配formConfig，这里给出警告
@@ -268,7 +361,7 @@ async function init() {
 watch(
   formOptions,
   () => {
-    formApi.setState((prev) => {
+    formApi.setState((prev: Record<string, any>) => {
       const finalFormOptions: VbenFormProps = mergeWithArrayOverride(
         {},
         formOptions.value,
@@ -301,7 +394,7 @@ onUnmounted(() => {
 </script>
 
 <template>
-  <div :class="cn('bg-card h-full rounded-md', className)">
+  <div :class="cn('h-full rounded-md bg-card', className)">
     <VxeGrid
       ref="gridRef"
       :class="
@@ -319,9 +412,9 @@ onUnmounted(() => {
       <!-- 左侧操作区域或者title -->
       <template v-if="showToolbar" #toolbar-actions="slotProps">
         <slot v-if="showTableTitle" name="table-title">
-          <div class="mr-1 pl-1 text-[1rem]">
+          <div class="flex-center gap-1 text-[1rem] font-bold">
             {{ tableTitle }}
-            <VbenHelpTooltip v-if="tableTitleHelp" trigger-class="pb-1">
+            <VbenHelpTooltip v-if="tableTitleHelp">
               {{ tableTitleHelp }}
             </VbenHelpTooltip>
           </div>
@@ -337,13 +430,36 @@ onUnmounted(() => {
       >
         <slot :name="slotName" v-bind="slotProps"></slot>
       </template>
+      <template #toolbar-tools="slotProps">
+        <slot name="toolbar-tools" v-bind="slotProps"></slot>
+        <VxeButton
+          icon="vxe-icon-search"
+          circle
+          class="ml-2"
+          v-if="gridOptions?.toolbarConfig?.search && !!formOptions"
+          :status="showSearchForm ? 'primary' : undefined"
+          :title="$t('common.search')"
+          @click="onSearchBtnClick"
+        />
+      </template>
 
       <!-- form表单 -->
       <template #form>
         <div
           v-if="formOptions"
           v-show="showSearchForm !== false"
-          :class="cn('relative rounded py-3', isCompactForm ? 'pb-6' : 'pb-4')"
+          :class="
+            cn(
+              'relative rounded-sm py-3',
+              isCompactForm
+                ? isSeparator
+                  ? 'pb-8'
+                  : 'pb-4'
+                : isSeparator
+                  ? 'pb-4'
+                  : 'pb-0',
+            )
+          "
         >
           <slot name="form">
             <Form>
@@ -372,7 +488,11 @@ onUnmounted(() => {
             </Form>
           </slot>
           <div
-            class="bg-background-deep z-100 absolute -left-2 bottom-1 h-2 w-[calc(100%+1rem)] overflow-hidden md:bottom-2 md:h-3"
+            v-if="isSeparator"
+            :style="{
+              ...(separatorBg ? { backgroundColor: separatorBg } : undefined),
+            }"
+            class="absolute bottom-1 -left-2 z-100 h-2 w-[calc(100%+1rem)] overflow-hidden bg-background-deep md:bottom-2 md:h-3"
           ></div>
         </div>
       </template>
@@ -383,7 +503,7 @@ onUnmounted(() => {
         </slot>
       </template>
       <!-- 统一控状态 -->
-      <template #empty>
+      <template v-if="showDefaultEmpty" #empty>
         <slot name="empty">
           <EmptyIcon class="mx-auto" />
           <div class="mt-2">{{ $t('common.noData') }}</div>
diff --git a/packages/effects/plugins/src/vxe-table/viewed-row/index.ts b/packages/effects/plugins/src/vxe-table/viewed-row/index.ts
new file mode 100644
index 00000000..76bf91e0
--- /dev/null
+++ b/packages/effects/plugins/src/vxe-table/viewed-row/index.ts
@@ -0,0 +1,8 @@
+export type {
+  ViewedRowOptions,
+  ViewedRowPersistOptions,
+  ViewedRowStorageAdapter,
+} from './types';
+
+export { applyViewedRowOptions, useViewedRow } from './use-viewed-row';
+export type { ViewedRowHelper } from './use-viewed-row';
diff --git a/packages/effects/plugins/src/vxe-table/viewed-row/types.ts b/packages/effects/plugins/src/vxe-table/viewed-row/types.ts
new file mode 100644
index 00000000..c82dfe8c
--- /dev/null
+++ b/packages/effects/plugins/src/vxe-table/viewed-row/types.ts
@@ -0,0 +1,84 @@
+import type { VxeTablePropTypes } from 'vxe-table';
+
+import type { Ref } from 'vue';
+
+/**
+ * 自定义存储适配器接口
+ * 用户可接入任意后端（API、IndexedDB wrapper、第三方库等）
+ */
+export interface ViewedRowStorageAdapter {
+  /** 读取所有已查看的 key 列表 */
+  getKeys(): Promise<Array<number | string>>;
+
+  /** 移除所有已查看数据 */
+  removeKeys(): Promise<void>;
+
+  /** 持久化已查看的 key 列表 */
+  setKeys(keys: Array<number | string>): Promise<void>;
+}
+
+/**
+ * 已读行持久化 — 公共基础字段
+ */
+interface ViewedRowPersistBase {
+  /** 持久化数据的存活时间（毫秒） */
+  ttl?: number;
+  /** 最大缓存数量，超出时淘汰最早标记的 key（FIFO），默认 100 */
+  maxSize?: number;
+}
+
+/**
+ * 已读行持久化配置（按 type 区分的联合类型）
+ *
+ * - 'memory'          → 仅内存，不持久化
+ * - 'localStorage'    → 使用 localStorage 整体存储，key 必传
+ * - 'sessionStorage'  → 使用 sessionStorage 整体存储，key 必传
+ * - 'indexedDB'       → 使用 IndexedDB 单条存储，key 必传
+ * - 'custom'          → 用户自定义存储适配器，storage 必传
+ */
+export type ViewedRowPersistOptions =
+  | ({
+      /** IndexedDB 数据库名称，默认 'viewed-table-db' */
+      dbName?: string;
+      /** IndexedDB 数据库版本，默认 1 */
+      dbVersion?: number;
+      /** 存储 key / prefix（必传） */
+      key: string;
+      /** IndexedDB 对象存储名称，默认 'viewed-table-row' */
+      storeName?: string;
+      type: 'indexedDB';
+    } & ViewedRowPersistBase)
+  | ({
+      /** 存储 key（必传） */
+      key: string;
+      type: 'localStorage' | 'sessionStorage';
+    } & ViewedRowPersistBase)
+  | ({
+      /** 自定义存储适配器（必传） */
+      storage: ViewedRowStorageAdapter;
+      type: 'custom';
+    } & ViewedRowPersistBase)
+  | (ViewedRowPersistBase & {
+      type: 'memory';
+    });
+
+/**
+ * 已查看row设置
+ */
+export interface ViewedRowOptions<T = any> {
+  /** 点击 CellOperation 中匹配的 code 时，自动将该行标记为已读 */
+  actionCodes?: string | string[];
+  /** 行唯一标识字段，默认取 gridOptions.rowConfig.keyField，最终兜底 'id' */
+  keyField?: string;
+  /** 已查看的行key列表 */
+  viewedKeys?: Array<number | string> | Ref<Array<number | string>>;
+  /**
+   * 持久化配置
+   * - 传 string：使用内置 localStorage，值为 storage key（向后兼容）
+   * - 传 object：高级配置
+   * - 不传：不持久化（等同于 memory）
+   */
+  persist?: string | ViewedRowPersistOptions;
+  rowClassName?: VxeTablePropTypes.RowClassName<T>;
+  rowStyle?: VxeTablePropTypes.RowStyle<T>;
+}
diff --git a/packages/effects/plugins/src/vxe-table/viewed-row/use-viewed-row.ts b/packages/effects/plugins/src/vxe-table/viewed-row/use-viewed-row.ts
new file mode 100644
index 00000000..71d838a6
--- /dev/null
+++ b/packages/effects/plugins/src/vxe-table/viewed-row/use-viewed-row.ts
@@ -0,0 +1,537 @@
+/* oxlint-disable unicorn/no-nested-ternary */
+import type { VxeGridProps as VxeTableGridProps } from 'vxe-table';
+
+import type {
+  ViewedRowOptions,
+  ViewedRowPersistOptions,
+  ViewedRowStorageAdapter,
+} from './types';
+
+import { isRef, shallowRef, toRaw, triggerRef, watch } from 'vue';
+
+import { isBoolean, isFunction } from '@vben/utils';
+
+import {
+  IndexedDBDriver,
+  LocalStorageDriver,
+  StorageManager,
+} from '@vben-core/shared/cache';
+
+import { useDebounceFn } from '@vueuse/core';
+
+const DEFAULT_VIEWED_CLASS = 'vxe-row--viewed';
+
+// ========== 持久化策略 ==========
+
+/**
+ * localStorage / sessionStorage 适配器
+ * 整体存储：key → [1, 2, 3]
+ */
+function createWebStorageAdapter(
+  storageType: 'localStorage' | 'sessionStorage',
+  key: string,
+  ttl?: number,
+): ViewedRowStorageAdapter {
+  const manager = new StorageManager({
+    driver: new LocalStorageDriver({ storageType }),
+  });
+
+  return {
+    async getKeys() {
+      const stored = await manager.getItem<Array<number | string>>(key);
+      return stored ?? [];
+    },
+    async removeKeys() {
+      await manager.removeItem(key);
+    },
+    async setKeys(keys) {
+      await manager.setItem(key, keys, ttl);
+    },
+  };
+}
+
+/**
+ * IndexedDB 适配器
+ * 单条存储：prefix:1 → { expiry, value: 1 }
+ */
+function createIndexedDBAdapter(
+  opts: Extract<ViewedRowPersistOptions, { type: 'indexedDB' }>,
+): ViewedRowStorageAdapter {
+  const prefix = opts.key;
+  const manager = new StorageManager({
+    driver: new IndexedDBDriver({
+      dbName: opts.dbName || 'viewed-table-db',
+      dbVersion: opts.dbVersion || 1,
+      storeName: opts.storeName || 'viewed-table-row',
+    }),
+    prefix,
+  });
+
+  return {
+    async getKeys() {
+      try {
+        // 通过 StorageManager 获取当前前缀下所有 key，再逐条读取（自动过滤过期）
+        const shortKeys = await manager.keys();
+
+        const results: Array<number | string> = [];
+        for (const shortKey of shortKeys) {
+          const value = await manager.getItem<number | string>(shortKey);
+          if (value !== null) {
+            results.push(value);
+          }
+        }
+        return results;
+      } catch (error) {
+        console.error('[viewedRow] indexedDB restore failed:', error);
+        return [];
+      }
+    },
+    async removeKeys() {
+      try {
+        await manager.clear();
+      } catch (error) {
+        console.error('[viewedRow] indexedDB clear failed:', error);
+      }
+    },
+    async setKeys(keys) {
+      try {
+        const newKeySet = new Set(keys.map(String));
+        // 获取已存在的 key，避免重复写入刷新过期时间
+        const existingKeys = await manager.keys();
+        const existingKeySet = new Set(existingKeys);
+
+        // 只写入新增的 key，不覆盖已有记录的过期时间
+        const toAdd = keys.filter((key) => !existingKeySet.has(String(key)));
+        if (toAdd.length > 0) {
+          await Promise.all(
+            toAdd.map((key) => manager.setItem(String(key), key, opts.ttl)),
+          );
+        }
+
+        // 清理不在新集合中的旧 key
+        const toRemove = existingKeys.filter((k) => !newKeySet.has(k));
+        if (toRemove.length > 0) {
+          await Promise.all(toRemove.map((k) => manager.removeItem(k)));
+        }
+      } catch (error) {
+        console.error('[viewedRow] indexedDB persist failed:', error);
+      }
+    },
+  };
+}
+
+/**
+ * 根据 persist 配置创建存储适配器
+ */
+function createStorageAdapter(
+  persist?: string | ViewedRowPersistOptions,
+): null | ViewedRowStorageAdapter {
+  if (!persist) return null;
+
+  // 简写模式：string → localStorage
+  if (typeof persist === 'string') {
+    return createWebStorageAdapter('localStorage', persist);
+  }
+
+  switch (persist.type) {
+    case 'custom': {
+      // 用户自定义适配器，解除 Vue 响应式代理
+      return toRaw(persist.storage);
+    }
+    case 'indexedDB': {
+      return createIndexedDBAdapter(persist);
+    }
+    case 'localStorage': {
+      return createWebStorageAdapter('localStorage', persist.key, persist.ttl);
+    }
+    case 'memory': {
+      return null;
+    }
+    case 'sessionStorage': {
+      return createWebStorageAdapter(
+        'sessionStorage',
+        persist.key,
+        persist.ttl,
+      );
+    }
+    default: {
+      return null;
+    }
+  }
+}
+
+// ========== maxSize 淘汰 ==========
+
+/**
+ * 强制执行 maxSize 限制，超出时淘汰最早插入的 key（FIFO）
+ */
+function enforceMaxSize(set: Set<number | string>, maxSize: number): void {
+  if (maxSize > 0 && set.size > maxSize) {
+    const iterator = set.values();
+    while (set.size > maxSize) {
+      const oldest = iterator.next().value;
+      if (oldest !== undefined) {
+        set.delete(oldest);
+      }
+    }
+  }
+}
+
+// ========== 核心 composable ==========
+
+export function useViewedRow<T = any>(
+  options: ViewedRowOptions<T> & { keyField: string },
+) {
+  // ========== 解析持久化配置 ==========
+  const persistOpts: null | ViewedRowPersistOptions = options.persist
+    ? typeof options.persist === 'string'
+      ? { key: options.persist, type: 'localStorage' }
+      : options.persist
+    : null;
+
+  const adapter = createStorageAdapter(options.persist);
+  const maxSize = persistOpts?.maxSize ?? 100;
+
+  // ========== 初始化已读集合 ==========
+  const viewedSet = shallowRef<Set<number | string>>(new Set());
+
+  // ========== 持久化（防抖） ==========
+  function persistImmediate() {
+    if (!adapter) return;
+    adapter.setKeys([...viewedSet.value]).catch((error) => {
+      console.error('[viewedRow] persist failed:', error);
+    });
+  }
+
+  const persist = useDebounceFn(persistImmediate, 300);
+
+  // ========== 从存储恢复 ==========
+  async function restoreFromStorage(): Promise<void> {
+    if (!adapter) return;
+
+    try {
+      const stored = await adapter.getKeys();
+      if (stored && stored.length > 0) {
+        for (const key of stored) {
+          viewedSet.value.add(key);
+        }
+        if (maxSize > 0) {
+          enforceMaxSize(viewedSet.value, maxSize);
+        }
+        triggerRef(viewedSet);
+      }
+    } catch (error) {
+      console.error('[viewedRow] restore failed:', error);
+    }
+  }
+
+  // 先恢复存储，再合并外部 viewedKeys，确保 viewedKeys 是最新插入的（最后被淘汰）
+  restoreFromStorage().then(() => {
+    if (options.viewedKeys) {
+      const keys = isRef(options.viewedKeys)
+        ? options.viewedKeys.value
+        : options.viewedKeys;
+      updateViewedSet((set) => {
+        let changed = false;
+        for (const key of keys) {
+          if (!set.has(key)) {
+            set.add(key);
+            changed = true;
+          }
+        }
+        return changed;
+      });
+    }
+  });
+
+  // ========== 更新 viewedSet 的统一入口 ==========
+  function updateViewedSet(updater: (set: Set<number | string>) => boolean) {
+    const changed = updater(viewedSet.value);
+
+    if (changed) {
+      if (maxSize > 0) {
+        enforceMaxSize(viewedSet.value, maxSize);
+      }
+      triggerRef(viewedSet);
+      persist();
+    }
+  }
+
+  // ========== 监听外部 viewedKeys 变化（如果是 Ref） ==========
+  if (isRef(options.viewedKeys)) {
+    watch(options.viewedKeys, (newKeys) => {
+      updateViewedSet((set) => {
+        let changed = false;
+        for (const key of newKeys) {
+          if (!set.has(key)) {
+            set.add(key);
+            changed = true;
+          }
+        }
+        return changed;
+      });
+    });
+  }
+
+  // ========== 标记已读 ==========
+  function markAsViewed(record: T) {
+    const key = (record as Record<string, any>)[options.keyField] as
+      | number
+      | string;
+    if (key === null || key === undefined) return;
+
+    updateViewedSet((set) => {
+      if (set.has(key)) return false;
+      set.add(key);
+      return true;
+    });
+  }
+
+  function markKeysAsViewed(keys: Array<number | string>) {
+    updateViewedSet((set) => {
+      let changed = false;
+      for (const key of keys) {
+        if (!set.has(key)) {
+          set.add(key);
+          changed = true;
+        }
+      }
+      return changed;
+    });
+  }
+
+  // ========== 查询 ==========
+  function isViewed(record: T): boolean {
+    const key = (record as Record<string, any>)[options.keyField] as
+      | number
+      | string;
+    return viewedSet.value.has(key);
+  }
+
+  // ========== 清除 ==========
+  function clearViewed() {
+    const hadData = viewedSet.value.size > 0;
+    viewedSet.value.clear();
+
+    if (hadData) {
+      triggerRef(viewedSet);
+    }
+
+    if (adapter) {
+      adapter.removeKeys().catch((error) => {
+        console.error('[viewedRow] clear persist failed:', error);
+      });
+    }
+  }
+
+  // ========== 移除指定 keys ==========
+  function removeKeys(keys: Array<number | string>) {
+    updateViewedSet((set) => {
+      let changed = false;
+      for (const key of keys) {
+        if (set.has(key)) {
+          set.delete(key);
+          changed = true;
+        }
+      }
+      return changed;
+    });
+  }
+
+  // ========== rowClassName 函数 ==========
+  function getRowClassName(params: any): string {
+    if (!isViewed(params.row)) return '';
+
+    const { rowClassName } = options;
+    if (rowClassName === undefined || rowClassName === null) {
+      return DEFAULT_VIEWED_CLASS;
+    }
+    if (typeof rowClassName === 'string') {
+      return rowClassName;
+    }
+    if (isFunction(rowClassName)) {
+      return normalizeClassName(rowClassName(params));
+    }
+    return DEFAULT_VIEWED_CLASS;
+  }
+
+  // ========== rowStyle 函数 ==========
+  function getRowStyle(params: any): any {
+    if (!isViewed(params.row)) return undefined;
+
+    const { rowStyle } = options;
+    if (rowStyle === undefined || rowStyle === null) {
+      return undefined;
+    }
+    if (isFunction(rowStyle)) {
+      return rowStyle(params);
+    }
+    return rowStyle;
+  }
+
+  return {
+    clearViewed,
+    getRowClassName,
+    getRowStyle,
+    isViewed,
+    markAsViewed,
+    markKeysAsViewed,
+    removeKeys,
+    viewedSet,
+  };
+}
+
+export type ViewedRowHelper<T = any> = ReturnType<typeof useViewedRow<T>>;
+
+// ========== 工具函数 ==========
+
+function normalizeClassName(value: any): string {
+  if (!value) return '';
+  if (typeof value === 'string') return value;
+  if (typeof value === 'object') {
+    return Object.entries(value)
+      .filter(([, v]) => v)
+      .map(([k]) => k)
+      .join(' ');
+  }
+  return '';
+}
+
+function mergeClassNames(...classNames: any[]): string {
+  return classNames
+    .map((c) => normalizeClassName(c))
+    .filter(Boolean)
+    .join(' ');
+}
+
+/**
+ * 包装 columns，拦截 CellOperation 的 onClick，根据 actionCodes 自动标记已读
+ * 注意：columns 每次都是 cloneDeep 后的新对象，不存在重复包装问题
+ */
+function wrapColumnsForViewedRow(
+  columns: any[],
+  actionCodes: string[],
+  markAsViewed: (record: any) => void,
+): any[] {
+  return columns.map((column) => {
+    if (!column || typeof column !== 'object') return column;
+
+    const nextColumn = { ...column };
+
+    if (nextColumn.cellRender?.name === 'CellOperation') {
+      const cellRender = { ...nextColumn.cellRender };
+      const attrs = { ...cellRender.attrs };
+      const originalOnClick = attrs.onClick;
+
+      attrs.onClick = (params: { code: string; row: any }) => {
+        originalOnClick?.(params);
+        if (actionCodes.includes(params.code)) {
+          markAsViewed(params.row);
+        }
+      };
+
+      cellRender.attrs = attrs;
+      nextColumn.cellRender = cellRender;
+    }
+
+    if (Array.isArray(nextColumn.children)) {
+      nextColumn.children = wrapColumnsForViewedRow(
+        nextColumn.children,
+        actionCodes,
+        markAsViewed,
+      );
+    }
+
+    return nextColumn;
+  });
+}
+
+/**
+ * 将 viewedRow 配置应用到 mergedOptions 上
+ * 注入 rowClassName、rowStyle、columns 拦截
+ */
+export function applyViewedRowOptions(
+  mergedOptions: VxeTableGridProps,
+  viewedRowConfig: boolean | ViewedRowOptions,
+  helper: ReturnType<typeof useViewedRow>,
+) {
+  // 从最新的配置中读取 rowClassName 和 rowStyle（支持运行时修改）
+  const viewedRowClassName = isBoolean(viewedRowConfig)
+    ? undefined
+    : viewedRowConfig.rowClassName;
+  const viewedRowStyle = isBoolean(viewedRowConfig)
+    ? undefined
+    : viewedRowConfig.rowStyle;
+
+  // 注入 rowClassName
+  const originalRowClassName = mergedOptions.rowClassName;
+  mergedOptions.rowClassName = (params: any) => {
+    if (!helper.isViewed(params.row)) {
+      return normalizeClassName(
+        isFunction(originalRowClassName)
+          ? originalRowClassName(params)
+          : originalRowClassName,
+      );
+    }
+
+    let viewedClass: string;
+    if (viewedRowClassName === undefined || viewedRowClassName === null) {
+      viewedClass = DEFAULT_VIEWED_CLASS;
+    } else if (typeof viewedRowClassName === 'string') {
+      viewedClass = viewedRowClassName;
+    } else if (isFunction(viewedRowClassName)) {
+      viewedClass = normalizeClassName(viewedRowClassName(params));
+    } else {
+      viewedClass = DEFAULT_VIEWED_CLASS;
+    }
+
+    return mergeClassNames(
+      isFunction(originalRowClassName)
+        ? originalRowClassName(params)
+        : originalRowClassName,
+      viewedClass,
+    );
+  };
+
+  // 注入 rowStyle
+  const originalRowStyle = mergedOptions.rowStyle;
+  mergedOptions.rowStyle = (params: any) => {
+    const originalStyle = isFunction(originalRowStyle)
+      ? originalRowStyle(params)
+      : originalRowStyle;
+
+    if (!helper.isViewed(params.row)) {
+      return originalStyle || undefined;
+    }
+
+    let viewedStyle: any;
+    if (viewedRowStyle === undefined || viewedRowStyle === null) {
+      viewedStyle = undefined;
+    } else if (isFunction(viewedRowStyle)) {
+      viewedStyle = viewedRowStyle(params);
+    } else {
+      viewedStyle = viewedRowStyle;
+    }
+
+    if (!viewedStyle && !originalStyle) return undefined;
+    if (!originalStyle) return viewedStyle;
+    if (!viewedStyle) return originalStyle;
+    return { ...originalStyle, ...viewedStyle };
+  };
+
+  // 拦截 CellOperation columns
+  const actionCodes =
+    !isBoolean(viewedRowConfig) && viewedRowConfig.actionCodes
+      ? Array.isArray(viewedRowConfig.actionCodes)
+        ? viewedRowConfig.actionCodes
+        : [viewedRowConfig.actionCodes]
+      : [];
+
+  if (actionCodes.length > 0 && Array.isArray(mergedOptions.columns)) {
+    mergedOptions.columns = wrapColumnsForViewedRow(
+      mergedOptions.columns,
+      actionCodes,
+      helper.markAsViewed,
+    );
+  }
+}
diff --git a/packages/effects/request/package.json b/packages/effects/request/package.json
index 106c9517..e3a60735 100644
--- a/packages/effects/request/package.json
+++ b/packages/effects/request/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vben/request",
-  "version": "5.5.1",
+  "version": "5.7.0",
   "homepage": "https://github.com/vbenjs/vue-vben-admin",
   "bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
   "repository": {
@@ -22,9 +22,11 @@
   "dependencies": {
     "@vben/locales": "workspace:*",
     "@vben/utils": "workspace:*",
-    "axios": "catalog:"
+    "axios": "catalog:",
+    "qs": "catalog:"
   },
   "devDependencies": {
+    "@types/qs": "catalog:",
     "axios-mock-adapter": "catalog:"
   }
 }
diff --git a/packages/effects/request/src/request-client/modules/downloader.test.ts b/packages/effects/request/src/request-client/modules/downloader.test.ts
index 0e78b54f..27e8a30c 100644
--- a/packages/effects/request/src/request-client/modules/downloader.test.ts
+++ b/packages/effects/request/src/request-client/modules/downloader.test.ts
@@ -30,7 +30,9 @@ describe('fileDownloader', () => {
     expect(result).toBeInstanceOf(Blob);
     expect(result).toEqual(mockBlob);
     expect(mockAxiosInstance.get).toHaveBeenCalledWith(url, {
+      method: 'GET',
       responseType: 'blob',
+      responseReturn: 'body',
     });
   });
 
@@ -50,7 +52,9 @@ describe('fileDownloader', () => {
     expect(result).toEqual(mockBlob);
     expect(mockAxiosInstance.get).toHaveBeenCalledWith(url, {
       ...customConfig,
+      method: 'GET',
       responseType: 'blob',
+      responseReturn: 'body',
     });
   });
 
@@ -82,3 +86,72 @@ describe('fileDownloader', () => {
     );
   });
 });
+
+describe('fileDownloader use other method', () => {
+  let fileDownloader: FileDownloader;
+
+  it('should call request using get', async () => {
+    const url = 'https://example.com/file';
+    const mockBlob = new Blob(['file content'], { type: 'text/plain' });
+    const mockResponse: Blob = mockBlob;
+
+    const mockAxiosInstance = {
+      request: vi.fn(),
+    } as any;
+
+    fileDownloader = new FileDownloader(mockAxiosInstance);
+
+    mockAxiosInstance.request.mockResolvedValueOnce(mockResponse);
+
+    const result = await fileDownloader.download(url);
+
+    expect(result).toBeInstanceOf(Blob);
+    expect(result).toEqual(mockBlob);
+    expect(mockAxiosInstance.request).toHaveBeenCalledWith(url, {
+      method: 'GET',
+      responseType: 'blob',
+      responseReturn: 'body',
+    });
+  });
+
+  it('should call post', async () => {
+    const url = 'https://example.com/file';
+
+    const mockAxiosInstance = {
+      post: vi.fn(),
+    } as any;
+
+    fileDownloader = new FileDownloader(mockAxiosInstance);
+
+    const customConfig: AxiosRequestConfig = {
+      method: 'POST',
+      data: { name: 'aa' },
+    };
+
+    await fileDownloader.download(url, customConfig);
+
+    expect(mockAxiosInstance.post).toHaveBeenCalledWith(
+      url,
+      { name: 'aa' },
+      {
+        method: 'POST',
+        responseType: 'blob',
+        responseReturn: 'body',
+      },
+    );
+  });
+
+  it('should handle errors gracefully', async () => {
+    const url = 'https://example.com/file';
+    const mockAxiosInstance = {
+      post: vi.fn(),
+    } as any;
+
+    fileDownloader = new FileDownloader(mockAxiosInstance);
+    await expect(() =>
+      fileDownloader.download(url, { method: 'postt' }),
+    ).rejects.toThrow(
+      'RequestClient does not support method "POSTT". Please ensure the method is properly implemented in your RequestClient instance.',
+    );
+  });
+});
diff --git a/packages/effects/request/src/request-client/modules/downloader.ts b/packages/effects/request/src/request-client/modules/downloader.ts
index bf065d33..6c300058 100644
--- a/packages/effects/request/src/request-client/modules/downloader.ts
+++ b/packages/effects/request/src/request-client/modules/downloader.ts
@@ -1,7 +1,14 @@
-import type { AxiosRequestConfig } from 'axios';
-
 import type { RequestClient } from '../request-client';
-import type { RequestResponse } from '../types';
+import type { RequestClientConfig } from '../types';
+
+type DownloadRequestConfig = {
+  /**
+   * 定义期望获得的数据类型。
+   * raw: 原始的AxiosResponse，包括headers、status等。
+   * body: 只返回响应数据的BODY部分(Blob)
+   */
+  responseReturn?: 'body' | 'raw';
+} & Omit<RequestClientConfig, 'responseReturn'>;
 
 class FileDownloader {
   private client: RequestClient;
@@ -9,22 +16,44 @@ class FileDownloader {
   constructor(client: RequestClient) {
     this.client = client;
   }
-
-  public async download(
+  /**
+   * 下载文件
+   * @param url 文件的完整链接
+   * @param config 配置信息，可选。
+   * @returns 如果config.responseReturn为'body'，则返回Blob(默认)，否则返回RequestResponse<Blob>
+   */
+  public async download<T = Blob>(
     url: string,
-    config?: AxiosRequestConfig,
-  ): Promise<RequestResponse<Blob>> {
-    const finalConfig: AxiosRequestConfig = {
+    config?: DownloadRequestConfig,
+  ): Promise<T> {
+    const finalConfig: DownloadRequestConfig = {
+      responseReturn: 'body',
+      method: 'GET',
       ...config,
       responseType: 'blob',
     };
 
-    const response = await this.client.get<RequestResponse<Blob>>(
-      url,
-      finalConfig,
-    );
+    // Prefer a generic request if available; otherwise, dispatch to method-specific calls.
+    const method = (finalConfig.method || 'GET').toUpperCase();
+    const clientAny = this.client as any;
 
-    return response;
+    if (typeof clientAny.request === 'function') {
+      return await clientAny.request(url, finalConfig);
+    }
+    const lower = method.toLowerCase();
+
+    if (typeof clientAny[lower] === 'function') {
+      if (['POST', 'PUT'].includes(method)) {
+        const { data, ...rest } = finalConfig as Record<string, any>;
+        return await clientAny[lower](url, data, rest);
+      }
+
+      return await clientAny[lower](url, finalConfig);
+    }
+
+    throw new Error(
+      `RequestClient does not support method "${method}". Please ensure the method is properly implemented in your RequestClient instance.`,
+    );
   }
 }
 
diff --git a/packages/effects/request/src/request-client/modules/sse.test.ts b/packages/effects/request/src/request-client/modules/sse.test.ts
new file mode 100644
index 00000000..4e8c6a9d
--- /dev/null
+++ b/packages/effects/request/src/request-client/modules/sse.test.ts
@@ -0,0 +1,142 @@
+import type { RequestClient } from '../request-client';
+
+import { beforeEach, describe, expect, it, vi } from 'vitest';
+
+import { SSE } from './sse';
+
+// 模拟 TextDecoder
+const OriginalTextDecoder = globalThis.TextDecoder;
+
+beforeEach(() => {
+  vi.stubGlobal(
+    'TextDecoder',
+    class {
+      private decoder = new OriginalTextDecoder();
+      decode(value: Uint8Array, opts?: any) {
+        return this.decoder.decode(value, opts);
+      }
+    },
+  );
+});
+
+// 创建 fetch mock
+const createFetchMock = (chunks: string[], ok = true) => {
+  const encoder = new TextEncoder();
+  let index = 0;
+  return vi.fn().mockResolvedValue({
+    ok,
+    status: ok ? 200 : 500,
+    body: {
+      getReader: () => ({
+        read: async () => {
+          if (index < chunks.length) {
+            return { done: false, value: encoder.encode(chunks[index++]) };
+          }
+          return { done: true, value: undefined };
+        },
+      }),
+    },
+  });
+};
+
+describe('sSE', () => {
+  let client: RequestClient;
+  let sse: SSE;
+
+  beforeEach(() => {
+    vi.restoreAllMocks();
+    client = {
+      getBaseUrl: () => 'http://localhost',
+      instance: {
+        interceptors: {
+          request: {
+            handlers: [],
+          },
+        },
+      },
+    } as unknown as RequestClient;
+    sse = new SSE(client);
+  });
+
+  it('should call requestSSE when postSSE is used', async () => {
+    const spy = vi.spyOn(sse, 'requestSSE').mockResolvedValue(undefined);
+    await sse.postSSE('/test', { foo: 'bar' }, { headers: { a: '1' } });
+    expect(spy).toHaveBeenCalledWith(
+      '/test',
+      { foo: 'bar' },
+      {
+        headers: { a: '1' },
+        method: 'POST',
+      },
+    );
+  });
+
+  it('should throw error if fetch response not ok', async () => {
+    vi.stubGlobal('fetch', createFetchMock([], false));
+    await expect(sse.requestSSE('/bad')).rejects.toThrow(
+      'HTTP error! status: 500',
+    );
+  });
+
+  it('should trigger onMessage and onEnd callbacks', async () => {
+    const messages: string[] = [];
+    const onMessage = vi.fn((msg: string) => messages.push(msg));
+    const onEnd = vi.fn();
+
+    vi.stubGlobal('fetch', createFetchMock(['hello', ' world']));
+
+    await sse.requestSSE('/sse', undefined, { onMessage, onEnd });
+
+    expect(onMessage).toHaveBeenCalledTimes(2);
+    expect(messages.join('')).toBe('hello world');
+    // onEnd 不再带参数
+    expect(onEnd).toHaveBeenCalled();
+  });
+
+  it('should apply request interceptors', async () => {
+    const interceptor = vi.fn(async (config) => {
+      config.headers['x-test'] = 'intercepted';
+      return config;
+    });
+    (client.instance.interceptors.request as any).handlers.push({
+      fulfilled: interceptor,
+    });
+
+    // 创建 fetch mock，并挂到全局
+    const fetchMock = createFetchMock(['data']);
+    vi.stubGlobal('fetch', fetchMock);
+
+    await sse.requestSSE('/sse', undefined, {});
+
+    expect(interceptor).toHaveBeenCalled();
+    expect(fetchMock).toHaveBeenCalledWith(
+      'http://localhost/sse',
+      expect.objectContaining({
+        headers: expect.any(Headers),
+      }),
+    );
+
+    const calls = fetchMock.mock?.calls;
+    expect(calls).toBeDefined();
+    expect(calls?.length).toBeGreaterThan(0);
+
+    const init = calls?.[0]?.[1] as RequestInit;
+    expect(init).toBeDefined();
+
+    const headers = init?.headers as Headers;
+    expect(headers?.get('x-test')).toBe('intercepted');
+    expect(headers?.get('accept')).toBe('text/event-stream');
+  });
+
+  it('should throw error when no reader', async () => {
+    vi.stubGlobal(
+      'fetch',
+      vi.fn().mockResolvedValue({
+        ok: true,
+        status: 200,
+        body: null,
+      }),
+    );
+    await expect(sse.requestSSE('/sse')).rejects.toThrow('No reader');
+  });
+});
diff --git a/packages/effects/request/src/request-client/modules/sse.ts b/packages/effects/request/src/request-client/modules/sse.ts
new file mode 100644
index 00000000..aa2755cf
--- /dev/null
+++ b/packages/effects/request/src/request-client/modules/sse.ts
@@ -0,0 +1,134 @@
+import type { AxiosRequestHeaders, InternalAxiosRequestConfig } from 'axios';
+
+import type { RequestClient } from '../request-client';
+import type { SseRequestOptions } from '../types';
+
+/**
+ * SSE模块
+ */
+class SSE {
+  private client: RequestClient;
+
+  constructor(client: RequestClient) {
+    this.client = client;
+  }
+
+  public async postSSE(
+    url: string,
+    data?: any,
+    requestOptions?: SseRequestOptions,
+  ) {
+    return this.requestSSE(url, data, {
+      ...requestOptions,
+      method: 'POST',
+    });
+  }
+
+  /**
+   * SSE请求方法
+   * @param url - 请求URL
+   * @param data - 请求数据
+   * @param requestOptions - SSE请求选项
+   */
+  public async requestSSE(
+    url: string,
+    data?: any,
+    requestOptions?: SseRequestOptions,
+  ) {
+    const baseUrl = this.client.getBaseUrl() || '';
+
+    let axiosConfig: InternalAxiosRequestConfig<any> = {
+      url,
+      method: (requestOptions?.method as any) ?? 'GET',
+      headers: {} as AxiosRequestHeaders,
+    };
+    const requestInterceptors = this.client.instance.interceptors
+      .request as any;
+    if (
+      requestInterceptors.handlers &&
+      requestInterceptors.handlers.length > 0
+    ) {
+      for (const handler of requestInterceptors.handlers) {
+        if (typeof handler?.fulfilled === 'function') {
+          const next = await handler.fulfilled(axiosConfig as any);
+          if (next) axiosConfig = next as InternalAxiosRequestConfig<any>;
+        }
+      }
+    }
+
+    const merged = new Headers();
+    Object.entries(
+      (axiosConfig.headers ?? {}) as Record<string, string>,
+    ).forEach(([k, v]) => merged.set(k, String(v)));
+    if (requestOptions?.headers) {
+      new Headers(requestOptions.headers).forEach((v, k) => merged.set(k, v));
+    }
+    if (!merged.has('accept')) {
+      merged.set('accept', 'text/event-stream');
+    }
+
+    let bodyInit = requestOptions?.body ?? data;
+    const ct = (merged.get('content-type') || '').toLowerCase();
+    if (
+      bodyInit &&
+      typeof bodyInit === 'object' &&
+      !ArrayBuffer.isView(bodyInit as any) &&
+      !(bodyInit instanceof ArrayBuffer) &&
+      !(bodyInit instanceof Blob) &&
+      !(bodyInit instanceof FormData) &&
+      ct.includes('application/json')
+    ) {
+      bodyInit = JSON.stringify(bodyInit);
+    }
+    const requestInit: RequestInit = {
+      ...requestOptions,
+      method: axiosConfig.method,
+      headers: merged,
+      body: bodyInit,
+    };
+
+    const response = await fetch(safeJoinUrl(baseUrl, url), requestInit);
+    if (!response.ok) {
+      throw new Error(`HTTP error! status: ${response.status}`);
+    }
+
+    const reader = response.body?.getReader();
+    const decoder = new TextDecoder();
+
+    if (!reader) {
+      throw new Error('No reader');
+    }
+    while (true) {
+      const { done, value } = await reader.read();
+      if (done) {
+        decoder.decode(new Uint8Array(0), { stream: false });
+        requestOptions?.onEnd?.();
+        reader.releaseLock?.();
+        break;
+      }
+      const content = decoder.decode(value, { stream: true });
+      requestOptions?.onMessage?.(content);
+    }
+  }
+}
+
+function safeJoinUrl(baseUrl: string | undefined, url: string): string {
+  if (!baseUrl) {
+    return url; // 没有 baseUrl，直接返回 url
+  }
+
+  // 如果 url 本身就是绝对地址，直接返回
+  if (/^https?:\/\//i.test(url)) {
+    return url;
+  }
+
+  // 如果 baseUrl 是完整 URL，就用 new URL
+  if (/^https?:\/\//i.test(baseUrl)) {
+    return new URL(url, baseUrl).toString();
+  }
+
+  // 否则，当作路径拼接
+  return `${baseUrl.replace(/\/+$/, '')}/${url.replace(/^\/+/, '')}`;
+}
+
+export { SSE };
diff --git a/packages/effects/request/src/request-client/modules/uploader.ts b/packages/effects/request/src/request-client/modules/uploader.ts
index e9a9f602..1353222a 100644
--- a/packages/effects/request/src/request-client/modules/uploader.ts
+++ b/packages/effects/request/src/request-client/modules/uploader.ts
@@ -1,6 +1,7 @@
-import type { AxiosRequestConfig, AxiosResponse } from 'axios';
-
 import type { RequestClient } from '../request-client';
+import type { RequestClientConfig } from '../types';
+
+import { isUndefined } from '@vben/utils';
 
 class FileUploader {
   private client: RequestClient;
@@ -9,18 +10,24 @@ class FileUploader {
     this.client = client;
   }
 
-  public async upload(
+  public async upload<T = any>(
     url: string,
-    data: { file: Blob | File } & Record<string, any>,
-    config?: AxiosRequestConfig,
-  ): Promise<AxiosResponse> {
+    data: Record<string, any> & { file: Blob | File },
+    config?: RequestClientConfig,
+  ): Promise<T> {
     const formData = new FormData();
 
     Object.entries(data).forEach(([key, value]) => {
-      formData.append(key, value);
+      if (Array.isArray(value)) {
+        value.forEach((item, index) => {
+          !isUndefined(item) && formData.append(`${key}[${index}]`, item);
+        });
+      } else {
+        !isUndefined(value) && formData.append(key, value);
+      }
     });
 
-    const finalConfig: AxiosRequestConfig = {
+    const finalConfig: RequestClientConfig = {
       ...config,
       headers: {
         'Content-Type': 'multipart/form-data',
diff --git a/packages/effects/request/src/request-client/preset-interceptors.ts b/packages/effects/request/src/request-client/preset-interceptors.ts
index 4bfac320..3c10de2e 100644
--- a/packages/effects/request/src/request-client/preset-interceptors.ts
+++ b/packages/effects/request/src/request-client/preset-interceptors.ts
@@ -2,9 +2,48 @@ import type { RequestClient } from './request-client';
 import type { MakeErrorMessageFn, ResponseInterceptorConfig } from './types';
 
 import { $t } from '@vben/locales';
+import { isFunction } from '@vben/utils';
 
 import axios from 'axios';
 
+export const defaultResponseInterceptor = ({
+  codeField = 'code',
+  dataField = 'data',
+  successCode = 0,
+}: {
+  /** 响应数据中代表访问结果的字段名 */
+  codeField: string;
+  /** 响应数据中装载实际数据的字段名，或者提供一个函数从响应数据中解析需要返回的数据 */
+  dataField: ((response: any) => any) | string;
+  /** 当codeField所指定的字段值与successCode相同时，代表接口访问成功。如果提供一个函数，则返回true代表接口访问成功 */
+  successCode: ((code: any) => boolean) | number | string;
+}): ResponseInterceptorConfig => {
+  return {
+    fulfilled: (response) => {
+      const { config, data: responseData, status } = response;
+
+      if (config.responseReturn === 'raw') {
+        return response;
+      }
+
+      if (status >= 200 && status < 400) {
+        if (config.responseReturn === 'body') {
+          return responseData;
+        } else if (
+          isFunction(successCode)
+            ? successCode(responseData[codeField])
+            : responseData[codeField] === successCode
+        ) {
+          return isFunction(dataField)
+            ? dataField(responseData)
+            : responseData[dataField];
+        }
+      }
+      throw Object.assign({}, response, { response });
+    },
+  };
+};
+
 export const authenticateResponseInterceptor = ({
   client,
   doReAuthenticate,
@@ -91,7 +130,7 @@ export const errorMessageResponseInterceptor = (
         return Promise.reject(error);
       }
 
-      let errorMessage = '';
+      let errorMessage: string;
       const status = error?.response?.status;
 
       switch (status) {
diff --git a/packages/effects/request/src/request-client/request-client.test.ts b/packages/effects/request/src/request-client/request-client.test.ts
index 2d94525e..66175349 100644
--- a/packages/effects/request/src/request-client/request-client.test.ts
+++ b/packages/effects/request/src/request-client/request-client.test.ts
@@ -50,24 +50,18 @@ describe('requestClient', () => {
 
   it('should handle network errors', async () => {
     mock.onGet('/test/error').networkError();
-    try {
-      await requestClient.get('/test/error');
-      expect(true).toBe(false);
-    } catch (error: any) {
-      expect(error.isAxiosError).toBe(true);
-      expect(error.message).toBe('Network Error');
-    }
+    await expect(requestClient.get('/test/error')).rejects.toMatchObject({
+      isAxiosError: true,
+      message: 'Network Error',
+    });
   });
 
   it('should handle timeout', async () => {
     mock.onGet('/test/timeout').timeout();
-    try {
-      await requestClient.get('/test/timeout');
-      expect(true).toBe(false);
-    } catch (error: any) {
-      expect(error.isAxiosError).toBe(true);
-      expect(error.code).toBe('ECONNABORTED');
-    }
+    await expect(requestClient.get('/test/timeout')).rejects.toMatchObject({
+      isAxiosError: true,
+      code: 'ECONNABORTED',
+    });
   });
 
   it('should successfully upload a file', async () => {
@@ -92,7 +86,7 @@ describe('requestClient', () => {
 
     mock.onGet('/test/download').reply(200, mockFileContent);
 
-    const res = await requestClient.download('/test/download');
+    const res = await requestClient.download<any>('/test/download');
 
     expect(res.data).toBeInstanceOf(Blob);
   });
diff --git a/packages/effects/request/src/request-client/request-client.ts b/packages/effects/request/src/request-client/request-client.ts
index 278b3267..bf759094 100644
--- a/packages/effects/request/src/request-client/request-client.ts
+++ b/packages/effects/request/src/request-client/request-client.ts
@@ -1,30 +1,54 @@
-import type {
-  AxiosInstance,
-  AxiosRequestConfig,
-  AxiosResponse,
-  CreateAxiosDefaults,
-} from 'axios';
+import type { AxiosInstance, AxiosResponse } from 'axios';
 
-import { bindMethods, merge } from '@vben/utils';
+import type { RequestClientConfig, RequestClientOptions } from './types';
+
+import { bindMethods, isString, merge } from '@vben/utils';
 
 import axios from 'axios';
+import qs from 'qs';
 
 import { FileDownloader } from './modules/downloader';
 import { InterceptorManager } from './modules/interceptor';
+import { SSE } from './modules/sse';
 import { FileUploader } from './modules/uploader';
-import { type RequestClientOptions } from './types';
+
+function getParamsSerializer(
+  paramsSerializer: RequestClientOptions['paramsSerializer'],
+) {
+  if (isString(paramsSerializer)) {
+    switch (paramsSerializer) {
+      case 'brackets': {
+        return (params: any) =>
+          qs.stringify(params, { arrayFormat: 'brackets' });
+      }
+      case 'comma': {
+        return (params: any) => qs.stringify(params, { arrayFormat: 'comma' });
+      }
+      case 'indices': {
+        return (params: any) =>
+          qs.stringify(params, { arrayFormat: 'indices' });
+      }
+      case 'repeat': {
+        return (params: any) => qs.stringify(params, { arrayFormat: 'repeat' });
+      }
+    }
+  }
+  return paramsSerializer;
+}
 
 class RequestClient {
-  private readonly instance: AxiosInstance;
-
   public addRequestInterceptor: InterceptorManager['addRequestInterceptor'];
-  public addResponseInterceptor: InterceptorManager['addResponseInterceptor'];
 
+  public addResponseInterceptor: InterceptorManager['addResponseInterceptor'];
   public download: FileDownloader['download'];
+
+  public readonly instance: AxiosInstance;
   // 是否正在刷新token
   public isRefreshing = false;
+  public postSSE: SSE['postSSE'];
   // 刷新token队列
   public refreshTokenQueue: ((token: string) => void)[] = [];
+  public requestSSE: SSE['requestSSE'];
   public upload: FileUploader['upload'];
 
   /**
@@ -33,15 +57,19 @@ class RequestClient {
    */
   constructor(options: RequestClientOptions = {}) {
     // 合并默认配置和传入的配置
-    const defaultConfig: CreateAxiosDefaults = {
+    const defaultConfig: RequestClientOptions = {
       headers: {
         'Content-Type': 'application/json;charset=utf-8',
       },
+      responseReturn: 'raw',
       // 默认超时时间
       timeout: 100_000,
     };
     const { ...axiosConfig } = options;
     const requestConfig = merge(axiosConfig, defaultConfig);
+    requestConfig.paramsSerializer = getParamsSerializer(
+      requestConfig.paramsSerializer,
+    );
     this.instance = axios.create(requestConfig);
 
     bindMethods(this);
@@ -59,29 +87,43 @@ class RequestClient {
     // 实例化文件下载器
     const fileDownloader = new FileDownloader(this);
     this.download = fileDownloader.download.bind(fileDownloader);
+    // 实例化SSE模块
+    const sse = new SSE(this);
+    this.postSSE = sse.postSSE.bind(sse);
+    this.requestSSE = sse.requestSSE.bind(sse);
   }
 
   /**
    * DELETE请求方法
    */
-  public delete<T = any>(url: string, config?: AxiosRequestConfig): Promise<T> {
+  public delete<T = any>(
+    url: string,
+    config?: RequestClientConfig,
+  ): Promise<T> {
     return this.request<T>(url, { ...config, method: 'DELETE' });
   }
 
   /**
    * GET请求方法
    */
-  public get<T = any>(url: string, config?: AxiosRequestConfig): Promise<T> {
+  public get<T = any>(url: string, config?: RequestClientConfig): Promise<T> {
     return this.request<T>(url, { ...config, method: 'GET' });
   }
 
+  /**
+   * 获取基础URL
+   */
+  public getBaseUrl() {
+    return this.instance.defaults.baseURL;
+  }
+
   /**
    * POST请求方法
    */
   public post<T = any>(
     url: string,
     data?: any,
-    config?: AxiosRequestConfig,
+    config?: RequestClientConfig,
   ): Promise<T> {
     return this.request<T>(url, { ...config, data, method: 'POST' });
   }
@@ -92,7 +134,7 @@ class RequestClient {
   public put<T = any>(
     url: string,
     data?: any,
-    config?: AxiosRequestConfig,
+    config?: RequestClientConfig,
   ): Promise<T> {
     return this.request<T>(url, { ...config, data, method: 'PUT' });
   }
@@ -100,11 +142,17 @@ class RequestClient {
   /**
    * 通用的请求方法
    */
-  public async request<T>(url: string, config: AxiosRequestConfig): Promise<T> {
+  public async request<T>(
+    url: string,
+    config: RequestClientConfig,
+  ): Promise<T> {
     try {
       const response: AxiosResponse<T> = await this.instance({
         url,
         ...config,
+        ...(config.paramsSerializer
+          ? { paramsSerializer: getParamsSerializer(config.paramsSerializer) }
+          : {}),
       });
       return response as T;
     } catch (error: any) {
diff --git a/packages/effects/request/src/request-client/types.ts b/packages/effects/request/src/request-client/types.ts
index 8c0eb4de..b57d69e8 100644
--- a/packages/effects/request/src/request-client/types.ts
+++ b/packages/effects/request/src/request-client/types.ts
@@ -1,10 +1,37 @@
 import type {
+  AxiosRequestConfig,
   AxiosResponse,
   CreateAxiosDefaults,
   InternalAxiosRequestConfig,
 } from 'axios';
 
-type RequestResponse<T = any> = AxiosResponse<T>;
+type ExtendOptions<T = any> = {
+  /**
+   * 参数序列化方式。预置的有
+   * - brackets: ids[]=1&ids[]=2&ids[]=3
+   * - comma: ids=1,2,3
+   * - indices: ids[0]=1&ids[1]=2&ids[2]=3
+   * - repeat: ids=1&ids=2&ids=3
+   */
+  paramsSerializer?:
+    | 'brackets'
+    | 'comma'
+    | 'indices'
+    | 'repeat'
+    | AxiosRequestConfig<T>['paramsSerializer'];
+  /**
+   * 响应数据的返回方式。
+   * - raw: 原始的AxiosResponse，包括headers、status等，不做是否成功请求的检查。
+   * - body: 返回响应数据的BODY部分（只会根据status检查请求是否成功，忽略对code的判断，这种情况下应由调用方检查请求是否成功）。
+   * - data: 解构响应的BODY数据，只返回其中的data节点数据（会检查status和code是否为成功状态）。
+   */
+  responseReturn?: 'body' | 'data' | 'raw';
+};
+type RequestClientConfig<T = any> = AxiosRequestConfig<T> & ExtendOptions<T>;
+
+type RequestResponse<T = any> = AxiosResponse<T> & {
+  config: RequestClientConfig<T>;
+};
 
 type RequestContentType =
   | 'application/json;charset=utf-8'
@@ -12,21 +39,29 @@ type RequestContentType =
   | 'application/x-www-form-urlencoded;charset=utf-8'
   | 'multipart/form-data;charset=utf-8';
 
-type RequestClientOptions = CreateAxiosDefaults;
+type RequestClientOptions = CreateAxiosDefaults & ExtendOptions;
+
+/**
+ * SSE 请求选项
+ */
+interface SseRequestOptions extends RequestInit {
+  onMessage?: (message: string) => void;
+  onEnd?: () => void;
+}
 
 interface RequestInterceptorConfig {
   fulfilled?: (
-    config: InternalAxiosRequestConfig,
+    config: ExtendOptions & InternalAxiosRequestConfig,
   ) =>
-    | InternalAxiosRequestConfig<any>
-    | Promise<InternalAxiosRequestConfig<any>>;
+    | (ExtendOptions & InternalAxiosRequestConfig<any>)
+    | Promise<ExtendOptions & InternalAxiosRequestConfig<any>>;
   rejected?: (error: any) => any;
 }
 
 interface ResponseInterceptorConfig<T = any> {
   fulfilled?: (
-    response: AxiosResponse<T>,
-  ) => AxiosResponse | Promise<AxiosResponse>;
+    response: RequestResponse<T>,
+  ) => Promise<RequestResponse> | RequestResponse;
   rejected?: (error: any) => any;
 }
 
@@ -45,9 +80,11 @@ interface HttpResponse<T = any> {
 export type {
   HttpResponse,
   MakeErrorMessageFn,
+  RequestClientConfig,
   RequestClientOptions,
   RequestContentType,
   RequestInterceptorConfig,
   RequestResponse,
   ResponseInterceptorConfig,
+  SseRequestOptions,
 };
diff --git a/packages/icons/package.json b/packages/icons/package.json
index 8bda07bb..1a5fc72b 100644
--- a/packages/icons/package.json
+++ b/packages/icons/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vben/icons",
-  "version": "5.5.1",
+  "version": "5.7.0",
   "homepage": "https://github.com/vbenjs/vue-vben-admin",
   "bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
   "repository": {
diff --git a/packages/icons/src/index.ts b/packages/icons/src/index.ts
index babbf664..f69f28ef 100644
--- a/packages/icons/src/index.ts
+++ b/packages/icons/src/index.ts
@@ -1,3 +1,3 @@
-export * from './iconify/index.js';
+export * from './iconify';
 export { default as EmptyIcon } from './icons/empty-icon.vue';
-export * from './svg/index.js';
+export * from './svg';
diff --git a/packages/icons/src/svg/icons/antdv-next-logo.svg b/packages/icons/src/svg/icons/antdv-next-logo.svg
new file mode 100644
index 00000000..b335be1d
--- /dev/null
+++ b/packages/icons/src/svg/icons/antdv-next-logo.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="none" version="1.1" width="100" height="100" viewBox="0 0 100 100"><defs><clipPath id="master_svg0_15_16"><rect x="0" y="0" width="100" height="100" rx="0"/></clipPath><linearGradient x1="0.696908175945282" y1="-0.12974359095096588" x2="0.4750439931090237" y2="1.2243471980169296" id="master_svg1_15_26"><stop offset="0%" stop-color="#FA816E" stop-opacity="1"/><stop offset="41.472604870796204%" stop-color="#F74A5C" stop-opacity="1"/><stop offset="100%" stop-color="#F51D2C" stop-opacity="1"/></linearGradient><linearGradient x1="0.552905797958374" y1="0.30240023136138916" x2="-0.011689962096274294" y2="0.67748094524159" id="master_svg2_15_23"><stop offset="0%" stop-color="#29CDFF" stop-opacity="1"/><stop offset="36.24463677406311%" stop-color="#148EFF" stop-opacity="1"/><stop offset="100%" stop-color="#0A60FF" stop-opacity="1"/></linearGradient><linearGradient x1="0.5" y1="0" x2="0.40112216980036397" y2="1.1742942637447706" id="master_svg3_15_20"><stop offset="0%" stop-color="#4285EB" stop-opacity="1"/><stop offset="100%" stop-color="#2EC7FF" stop-opacity="1"/></linearGradient></defs><g><g clip-path="url(#master_svg0_15_16)"><g><g transform="matrix(0,1,-1,0,128.38507080078125,1.3009490966796875)"><path d="M64.69695375205077,90.04532994873047C66.12390785205078,91.47199394873047,68.43745515205079,91.47199394873047,69.86440945205078,90.04532994873047L79.03075785205078,80.88083794873047C80.62410185205079,79.28782094873047,80.62410185205079,76.71482494873047,79.03094385205078,75.12199194873047L69.78469225205077,65.91039584873047C68.35435965205077,64.48542385873047,66.04007265205078,64.48747908873047,64.61227515205078,65.91498784873046C63.18532103205078,67.34165384873047,63.18532103205078,69.65473504873047,64.61227515205078,71.08139894873047L70.85724495205078,77.32510194873046C71.25382805205078,77.72160194873047,71.25382805205078,78.32337194873047,70.85724495205078,78.71987294873047L64.69695375205077,84.87891394873047C63.26999962205078,86.30557994873047,63.26999962205078,88.61865994873047,64.69695375205077,90.04532994873047Z" fill="url(#master_svg1_15_26)" fill-opacity="1"/></g><g><path d="M45.071075,20.462244300000002C50.317059,17.4434862,57.016956,19.24900955,60.035713,24.4949932L87.180679,71.667404C88.863739,74.592205,87.871445,78.327076,84.958672,80.030849C84.949287,80.036343,84.939903,80.041798,84.930489,80.047234C82.030266,81.722801,78.320847,80.73002600000001,76.64527100000001,77.829803L52.21682,35.546923C52.036407,35.234653,51.776993,34.975366,51.464634,34.795109C50.481709,34.227886,49.22506,34.56488,48.657841,35.547808L24.197922,77.933762C24.188855,77.949471,24.179718,77.965141,24.170509,77.98077C22.496816600000002,80.820942,18.837607900000002,81.76656,15.9974368,80.09286900000001C13.12257836,78.398735,12.14775169,74.705757,13.81193882,71.81346500000001L41.038097,24.4953909C42.002892,22.8186166,43.394342,21.4271069,45.071075,20.462244300000002Z" fill-rule="evenodd" fill="url(#master_svg2_15_23)" fill-opacity="1"/></g><g><path d="M56.65453717255859,29.786590576171875C60.05306537255859,29.786590576171875,62.594127372558596,31.106560476171875,64.2777233725586,33.74650027617187L86.61734737255858,72.63262957617187C88.29955337255859,75.56081357617188,87.3005633725586,79.29788257617187,84.3816263725586,80.99607857617187C84.37327937255859,81.00094257617187,84.36491437255859,81.00577557617189,84.3565443725586,81.01059357617189C81.44811637255859,82.68416957617188,77.73366737255859,81.68312457617188,76.0600893725586,78.77469657617188L55.2176894725586,42.553740576171876L51.6441945725586,36.51258137617187C51.45962977255859,36.200564876171875,51.19580437255859,35.942928776171875,50.87949277255859,35.765822876171875C49.889291872558594,35.21139527617188,48.63712227255859,35.564660076171876,48.082697242558595,36.55486197617188L48.056419372558594,36.601793776171874C50.389970572558596,32.05832457617188,53.256010072558595,29.786590576171875,56.65453717255859,29.786590576171875Z" fill-rule="evenodd" fill="url(#master_svg3_15_20)" fill-opacity="1"/></g></g></g></g></svg>
\ No newline at end of file
diff --git a/packages/icons/src/svg/icons/dingding.svg b/packages/icons/src/svg/icons/dingding.svg
new file mode 100644
index 00000000..c2fc786b
--- /dev/null
+++ b/packages/icons/src/svg/icons/dingding.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024" width="200" height="200"><path d="M512 2C230.2 2 2 230.2 2 512s228.2 510 510 510 510-228.2 510-510S793.3 2 512 2z m235.9 442c-1 4.6-3.6 10.8-7.2 19.1l-0.5 0.5c-21.6 45.8-77.3 135.5-77.3 135.5l-0.5-0.5-16.5 28.3h78.8L574.3 826.8l34-136h-61.8l21.6-90.2c-17.5 4.1-38.1 9.8-62.3 18 0 0-33 19.1-94.8-37.1 0 0-41.7-37.1-17.5-45.8 10.3-4.1 50-8.8 81.4-12.9 42.2-5.7 68.5-8.8 68.5-8.8s-130.3 2.1-161.2-3.1c-30.9-4.6-70.1-56.7-78.3-102 0 0-12.9-24.7 27.8-12.9 40.2 11.8 209.2 45.8 209.2 45.8S321.4 375 307 358.5c-14.4-16.5-42.8-89.6-39.2-134.5 0 0 1.5-11.3 12.9-8.2 0 0 161.8 74.2 272.5 114.4C664.5 371.4 760.8 392 747.9 444z" fill="#3296FA"/></svg>
diff --git a/packages/icons/src/svg/icons/github.svg b/packages/icons/src/svg/icons/github.svg
new file mode 100644
index 00000000..39d092d9
--- /dev/null
+++ b/packages/icons/src/svg/icons/github.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024" width="200" height="200"><path d="M517.30912244 23.0407001c-277.94803947-0.11230224-503.114027 225.0536853-503.11402702 503.00172479 0 219.66317786 140.82700667 406.42179996 337.01901675 475.03846748 26.39102597 6.73813429 22.34814539-12.24094396 22.3481454-25.04339914v-87.14653682c-152.61874168 17.9683581-158.68306256-83.10365624-169.01486845-99.94899196-20.77591406-35.37520501-69.62738767-44.35938408-55.0280967-61.20471981 34.81369383-17.9683581 70.18889885 4.49208953 111.17921577 65.13529813 29.76009311 43.91017513 87.48344355 36.49822743 116.90662996 29.19858195 6.40122758-26.39102597 20.21440287-49.97449598 38.96887665-68.39206307-157.89694687-28.07555954-223.93066292-124.65548435-223.93066294-239.42837176 0-55.5896079 18.30526482-106.7994285 54.35428331-148.01434994-22.90965658-68.16745859 2.13374251-126.34001793 5.50280964-134.98729027 65.3599026-5.95201861 133.07815223 46.71773107 138.46865968 50.87291388 37.17204084-9.99489919 79.50998463-15.38540662 126.90152914-15.38540659 47.72845123 0 90.29099949 5.50280967 127.57534256 15.61001106 12.69015291-9.65799248 75.69170854-54.80349223 136.33491714-49.30068255 3.25676491 8.64727234 27.73865283 65.47220485 6.1766231 132.74124553 36.49822743 41.32722364 54.91579446 92.87395098 54.91579447 148.80046559 0 114.99749189-66.25832052 211.57741672-224.82908082 239.54067401 26.5033282 26.05411926 42.89945497 62.32774217 42.89945498 102.41964122v126.45232019c0.89841792 9.99489919 0 20.21440287 16.95763795 20.21440287 199.22417052-67.26904065 342.52182644-255.3752896 342.52182644-477.05990776 0-277.94803947-225.27828977-503.114027-503.11402701-503.11402703z" fill="currentColor"/></svg>
diff --git a/packages/icons/src/svg/icons/google.svg b/packages/icons/src/svg/icons/google.svg
new file mode 100644
index 00000000..f2ad0a40
--- /dev/null
+++ b/packages/icons/src/svg/icons/google.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024" width="200" height="200"><path d="M213.573746 512.08574a296.892457 296.892457 0 0 1 15.663636-94.698456L53.712514 286.089155a504.154105 504.154105 0 0 0 0 451.737229l175.422492-131.502883a296.022255 296.022255 0 0 1-15.356507-94.288949" fill="#FBBC05"/><path d="M521.881206 208.845928a305.696854 305.696854 0 0 1 192.007518 67.210309l151.773472-148.446228A527.547183 527.547183 0 0 0 53.763703 284.195186l175.422491 131.349318a306.771809 306.771809 0 0 1 292.541447-206.698576" fill="#EA4335"/><path d="M521.881206 815.325553a307.130128 307.130128 0 0 1-292.643824-206.698576l-175.524868 131.29813A521.148639 521.148639 0 0 0 521.881206 1023.969287a503.130338 503.130338 0 0 0 339.839486-127.100685l-166.771659-126.128105a327.861412 327.861412 0 0 1-173.221392 44.585056" fill="#34A853"/><path d="M1023.475893 513.774956a415.64944 415.64944 0 0 0-11.875698-92.70211h-486.289369v197.023977h279.744358a229.528582 229.528582 0 0 1-106.522966 152.43892l166.618094 126.128106a502.004194 502.004194 0 0 0 158.069639-382.888893" fill="#4285F4"/></svg>
diff --git a/packages/icons/src/svg/icons/qqchat.svg b/packages/icons/src/svg/icons/qqchat.svg
new file mode 100644
index 00000000..ac9a7f03
--- /dev/null
+++ b/packages/icons/src/svg/icons/qqchat.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024" width="200" height="200"><path d="M511.09761 957.257c-80.159 0-153.737-25.019-201.11-62.386-24.057 6.702-54.831 17.489-74.252 30.864-16.617 11.439-14.546 23.106-11.55 27.816 13.15 20.689 225.583 13.211 286.912 6.767v-3.061z" fill="#FAAD08"/><path d="M496.65061 957.257c80.157 0 153.737-25.019 201.11-62.386 24.057 6.702 54.83 17.489 74.253 30.864 16.616 11.439 14.543 23.106 11.55 27.816-13.15 20.689-225.584 13.211-286.914 6.767v-3.061z" fill="#FAAD08"/><path d="M497.12861 474.524c131.934-0.876 237.669-25.783 273.497-35.34 8.541-2.28 13.11-6.364 13.11-6.364 0.03-1.172 0.542-20.952 0.542-31.155C784.27761 229.833 701.12561 57.173 496.64061 57.162 292.15661 57.173 209.00061 229.832 209.00061 401.665c0 10.203 0.516 29.983 0.547 31.155 0 0 3.717 3.821 10.529 5.67 33.078 8.98 140.803 35.139 276.08 36.034h0.972z" fill="#000000"/><path d="M860.28261 619.782c-8.12-26.086-19.204-56.506-30.427-85.72 0 0-6.456-0.795-9.718 0.148-100.71 29.205-222.773 47.818-315.792 46.695h-0.962C410.88561 582.017 289.65061 563.617 189.27961 534.698 185.44461 533.595 177.87261 534.063 177.87261 534.063 166.64961 563.276 155.56661 593.696 147.44761 619.782 108.72961 744.168 121.27261 795.644 130.82461 796.798c20.496 2.474 79.78-93.637 79.78-93.637 0 97.66 88.324 247.617 290.576 248.996a718.01 718.01 0 0 1 5.367 0C708.80161 950.778 797.12261 800.822 797.12261 703.162c0 0 59.284 96.111 79.783 93.637 9.55-1.154 22.093-52.63-16.623-177.017" fill="#000000"/><path d="M434.38261 316.917c-27.9 1.24-51.745-30.106-53.24-69.956-1.518-39.877 19.858-73.207 47.764-74.454 27.875-1.224 51.703 30.109 53.218 69.974 1.527 39.877-19.853 73.2-47.742 74.436m206.67-69.956c-1.494 39.85-25.34 71.194-53.24 69.956-27.888-1.238-49.269-34.559-47.742-74.435 1.513-39.868 25.341-71.201 53.216-69.974 27.909 1.247 49.285 34.576 47.767 74.453" fill="#FFFFFF"/><path d="M683.94261 368.627c-7.323-17.609-81.062-37.227-172.353-37.227h-0.98c-91.29 0-165.031 19.618-172.352 37.227a6.244 6.244 0 0 0-0.535 2.505c0 1.269 0.393 2.414 1.006 3.386 6.168 9.765 88.054 58.018 171.882 58.018h0.98c83.827 0 165.71-48.25 171.881-58.016a6.352 6.352 0 0 0 1.002-3.395c0-0.897-0.2-1.736-0.531-2.498" fill="#FAAD08"/><path d="M467.63161 256.377c1.26 15.886-7.377 30-19.266 31.542-11.907 1.544-22.569-10.083-23.836-25.978-1.243-15.895 7.381-30.008 19.25-31.538 11.927-1.549 22.607 10.088 23.852 25.974m73.097 7.935c2.533-4.118 19.827-25.77 55.62-17.886 9.401 2.07 13.75 5.116 14.668 6.316 1.355 1.77 1.726 4.29 0.352 7.684-2.722 6.725-8.338 6.542-11.454 5.226-2.01-0.85-26.94-15.889-49.905 6.553-1.579 1.545-4.405 2.074-7.085 0.242-2.678-1.834-3.786-5.553-2.196-8.135" fill="#000000"/><path d="M504.33261 584.495h-0.967c-63.568 0.752-140.646-7.504-215.286-21.92-6.391 36.262-10.25 81.838-6.936 136.196 8.37 137.384 91.62 223.736 220.118 224.996H506.48461c128.498-1.26 211.748-87.612 220.12-224.996 3.314-54.362-0.547-99.938-6.94-136.203-74.654 14.423-151.745 22.684-215.332 21.927" fill="#FFFFFF"/><path d="M323.27461 577.016v137.468s64.957 12.705 130.031 3.91V591.59c-41.225-2.262-85.688-7.304-130.031-14.574" fill="#EB1C26"/><path d="M788.09761 432.536s-121.98 40.387-283.743 41.539h-0.962c-161.497-1.147-283.328-41.401-283.744-41.539l-40.854 106.952c102.186 32.31 228.837 53.135 324.598 51.926l0.96-0.002c95.768 1.216 222.4-19.61 324.6-51.924l-40.855-106.952z" fill="#EB1C26"/></svg>
diff --git a/packages/icons/src/svg/icons/tdesign-logo.svg b/packages/icons/src/svg/icons/tdesign-logo.svg
new file mode 100644
index 00000000..bdbba5cd
--- /dev/null
+++ b/packages/icons/src/svg/icons/tdesign-logo.svg
@@ -0,0 +1,39 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg width="100%" height="100%" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;">
+    <rect id="b1" x="0" y="0" width="32" height="32" style="fill:none;"/>
+    <g id="b11" serif:id="b1">
+        <g>
+            <g transform="matrix(1.155236,0,0,1.133743,3.49525,-0.501586)">
+                <path d="M7.972,26.181L3.28,26.181C3.203,26.181 3.126,26.165 3.055,26.132C2.984,26.1 2.921,26.053 2.87,25.994C2.819,25.936 2.782,25.867 2.76,25.792C2.737,25.718 2.732,25.639 2.742,25.562L3.656,20.403L9.441,20.403L8.498,25.748C8.473,25.869 8.407,25.978 8.311,26.057C8.216,26.136 8.096,26.18 7.972,26.181Z" style="fill:rgb(0,155,255);fill-rule:nonzero;"/>
+            </g>
+            <g transform="matrix(1.155236,0,0,1.133743,3.49525,-0.501586)">
+                <clipPath id="_clip1">
+                    <path d="M21.178,8.787L5.698,8.787L6.716,3.002L21.988,3.002C22.071,2.994 22.156,3.006 22.234,3.037C22.312,3.067 22.382,3.115 22.439,3.178C22.495,3.24 22.536,3.315 22.558,3.396C22.58,3.477 22.583,3.562 22.566,3.645L21.71,8.353C21.687,8.477 21.621,8.588 21.523,8.667C21.426,8.747 21.303,8.789 21.178,8.787Z" clip-rule="nonzero"/>
+                </clipPath>
+                <g clip-path="url(#_clip1)">
+                    <g transform="matrix(0.865624,-0,-0,0.882034,-3.025571,0.442416)">
+                        <use xlink:href="#_Image2" x="10.078" y="2.9" width="20px" height="7px"/>
+                    </g>
+                </g>
+            </g>
+            <g transform="matrix(1.155236,0,0,1.133743,3.49525,-0.501586)">
+                <path d="M5.698,8.787L0.55,8.787C0.471,8.788 0.393,8.772 0.321,8.739C0.249,8.707 0.185,8.66 0.134,8.6C0.082,8.541 0.044,8.471 0.022,8.395C-0,8.32 -0.006,8.24 0.006,8.162L0.845,3.448C0.868,3.323 0.933,3.211 1.031,3.129C1.128,3.048 1.25,3.003 1.377,3.002L6.716,3.002L5.698,8.787Z" style="fill:rgb(0,100,255);fill-rule:nonzero;"/>
+            </g>
+            <g transform="matrix(1.155236,0,0,1.133743,3.49525,-0.501586)">
+                <clipPath id="_clip3">
+                    <path d="M9.447,20.385L3.65,20.385L5.698,8.799L11.494,8.799L9.447,20.385Z" clip-rule="nonzero"/>
+                </clipPath>
+                <g clip-path="url(#_clip3)">
+                    <g transform="matrix(0.865624,-0,-0,0.882034,-3.025571,0.442416)">
+                        <use xlink:href="#_Image4" x="7.712" y="9.474" width="10px" height="14px"/>
+                    </g>
+                </g>
+            </g>
+        </g>
+    </g>
+    <defs>
+        <image id="_Image2" width="20px" height="7px" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAHCAYAAAAIy204AAAACXBIWXMAAA7EAAAOxAGVKw4bAAAAsUlEQVQokW2R267CMAwEB/7/RxGoXFrKoSS7PMQJrnQSrZKn8dg+nGwDLJq468zsC7MmFk8svrLqxtN3Vj14eeHPM2+vvL2y8eLjjeINUTHiCGBMpSAK1RURcX6FaW/7i+bS084RaKCIelwCrKhef6AB7Zc9sLpZZLvK3i7DesBhybBswJ1dAqcCRsjdK9s5hpZbdkkzLAMyYO6w+O9w+t9Qzgspv1bTQka7jnYDlqf4BQuSDbEWXdA2AAAAAElFTkSuQmCC"/>
+        <image id="_Image4" width="10px" height="14px" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAOCAYAAAAWo42rAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAAR0lEQVQokZ2PQQrAIAwEx5L/3/ys2qbXglRGc1sYZjeFmom4oBkMgqaEO8ZuwfFJixVBtxuPqhf1M/hrfASVENzW6J7mchi89l8Tj8VznSAAAAAASUVORK5CYII="/>
+    </defs>
+</svg>
diff --git a/packages/icons/src/svg/icons/wechat.svg b/packages/icons/src/svg/icons/wechat.svg
new file mode 100644
index 00000000..346b0379
--- /dev/null
+++ b/packages/icons/src/svg/icons/wechat.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024" width="200" height="200"><path d="M712.149333 352.234667c5.184 0 10.282667 0.064 15.381334 0.341333-26.944-146.837333-178.602667-259.2-361.642667-259.2-202.090667 0-365.888 137.002667-365.888 306.005333 0 99.093333 56.298667 187.178667 143.637333 243.093334l3.349334 2.133333-35.349334 110.72 132.266667-67.370667 6.229333 1.792a431.296 431.296 0 0 0 140.330667 14.848 237.141333 237.141333 0 0 1-11.626667-73.002666c0.021333-154.282667 149.290667-279.36 333.312-279.36z m-218.901333-107.968c28.373333 0 51.349333 22.250667 51.349333 49.728 0 27.456-22.976 49.770667-51.349333 49.770666-28.416 0-51.370667-22.293333-51.370667-49.770666-0.021333-27.498667 22.954667-49.728 51.370667-49.728z m-254.677333 99.477333c-28.394667 0-51.370667-22.293333-51.370667-49.770667 0-27.477333 22.997333-49.728 51.370667-49.728 28.394667 0 51.434667 22.250667 51.434666 49.728s-23.04 49.770667-51.434666 49.770667z" fill="#46AF35"/><path d="M405.76 633.408c0 142.805333 138.453333 258.56 309.162667 258.56a363.392 363.392 0 0 0 103.04-14.762667l111.701333 56.96-29.866667-93.589333 2.816-1.792c73.770667-47.232 121.344-121.621333 121.344-205.397333 0-142.741333-138.389333-258.496-309.056-258.496-170.688 0.042667-309.141333 115.776-309.141333 258.517333z m373.312-89.045333c0-23.168 19.413333-41.962667 43.370667-41.962667 24.021333 0 43.413333 18.816 43.413333 41.962667 0 23.253333-19.413333 42.090667-43.413333 42.090666-23.957333 0-43.370667-18.858667-43.370667-42.090666z m-215.146667 0c0-23.168 19.456-41.962667 43.413334-41.962667 23.978667 0 43.413333 18.816 43.413333 41.962667 0 23.253333-19.434667 42.090667-43.413333 42.090666-23.957333 0-43.413333-18.858667-43.413334-42.090666z" fill="#46AF35"/></svg>
diff --git a/packages/icons/src/svg/index.ts b/packages/icons/src/svg/index.ts
index 698a9bce..eaed8631 100644
--- a/packages/icons/src/svg/index.ts
+++ b/packages/icons/src/svg/index.ts
@@ -12,10 +12,18 @@ const SvgBellIcon = createIconifyIcon('svg:bell');
 const SvgCakeIcon = createIconifyIcon('svg:cake');
 const SvgAntdvLogoIcon = createIconifyIcon('svg:antdv-logo');
 const LogoSvgICON = createIconifyIcon('svg:logo');
+const SvgGithubIcon = createIconifyIcon('svg:github');
+const SvgGoogleIcon = createIconifyIcon('svg:google');
+const SvgQQChatIcon = createIconifyIcon('svg:qqchat');
+const SvgWeChatIcon = createIconifyIcon('svg:wechat');
+const SvgDingDingIcon = createIconifyIcon('svg:dingding');
+const SvgTDesignIcon = createIconifyIcon('svg:tdesign-logo');
+const SvgAntdvNextLogoIcon = createIconifyIcon('svg:antdv-next-logo');
 
 export {
   LogoSvgICON,
   SvgAntdvLogoIcon,
+  SvgAntdvNextLogoIcon,
   SvgAvatar1Icon,
   SvgAvatar2Icon,
   SvgAvatar3Icon,
@@ -23,5 +31,11 @@ export {
   SvgBellIcon,
   SvgCakeIcon,
   SvgCardIcon,
+  SvgDingDingIcon,
   SvgDownloadIcon,
+  SvgGithubIcon,
+  SvgGoogleIcon,
+  SvgQQChatIcon,
+  SvgTDesignIcon,
+  SvgWeChatIcon,
 };
diff --git a/packages/icons/src/svg/load.ts b/packages/icons/src/svg/load.ts
index 25f4261e..b21869ba 100644
--- a/packages/icons/src/svg/load.ts
+++ b/packages/icons/src/svg/load.ts
@@ -2,21 +2,35 @@ import type { IconifyIconStructure } from '@vben-core/icons';
 
 import { addIcon } from '@vben-core/icons';
 
-let loaded = false;
-if (!loaded) {
-  loadSvgIcons();
-  loaded = true;
-}
+loadSvgIcons();
 
 function parseSvg(svgData: string): IconifyIconStructure {
   const parser = new DOMParser();
   const xmlDoc = parser.parseFromString(svgData, 'image/svg+xml');
   const svgElement = xmlDoc.documentElement;
 
+  // 提取 SVG 根元素的关键样式属性
+  const getAttrs = (el: Element, attrs: string[]) =>
+    attrs
+      .map((attr) =>
+        el.hasAttribute(attr) ? `${attr}="${el.getAttribute(attr)}"` : '',
+      )
+      .filter(Boolean)
+      .join(' ');
+
+  const rootAttrs = getAttrs(svgElement, [
+    'fill',
+    'stroke',
+    'fill-rule',
+    'stroke-width',
+  ]);
+
   const svgContent = [...svgElement.childNodes]
     .filter((node) => node.nodeType === Node.ELEMENT_NODE)
     .map((node) => new XMLSerializer().serializeToString(node))
     .join('');
+  // 若根有属性，用一个 g 标签包裹内容并继承属性
+  const body = rootAttrs ? `<g ${rootAttrs}>${svgContent}</g>` : svgContent;
 
   const viewBoxValue = svgElement.getAttribute('viewBox') || '';
   const [left, top, width, height] = viewBoxValue.split(' ').map((val) => {
@@ -25,7 +39,7 @@ function parseSvg(svgData: string): IconifyIconStructure {
   });
 
   return {
-    body: svgContent,
+    body,
     height,
     left,
     top,
@@ -39,6 +53,14 @@ function parseSvg(svgData: string): IconifyIconStructure {
  * <Icon icon="svg:avatar"></Icon>
  */
 async function loadSvgIcons() {
+  if (
+    typeof DOMParser === 'undefined' ||
+    typeof Node === 'undefined' ||
+    typeof XMLSerializer === 'undefined'
+  ) {
+    return;
+  }
+
   const svgEagers = import.meta.glob('./icons/**', {
     eager: true,
     query: '?raw',
@@ -46,7 +68,7 @@ async function loadSvgIcons() {
 
   await Promise.all(
     Object.entries(svgEagers).map((svg) => {
-      const [key, body] = svg as [string, { default: string } | string];
+      const [key, body] = svg as [string, string | { default: string }];
 
       // ./icons/xxxx.svg => xxxxxx
       const start = key.lastIndexOf('/') + 1;
diff --git a/packages/locales/package.json b/packages/locales/package.json
index e54354b7..709b264e 100644
--- a/packages/locales/package.json
+++ b/packages/locales/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vben/locales",
-  "version": "5.5.1",
+  "version": "5.7.0",
   "homepage": "https://github.com/vbenjs/vue-vben-admin",
   "bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
   "repository": {
diff --git a/packages/locales/src/i18n.ts b/packages/locales/src/i18n.ts
index 99259c3c..e3c75bde 100644
--- a/packages/locales/src/i18n.ts
+++ b/packages/locales/src/i18n.ts
@@ -1,3 +1,4 @@
+import type { App } from 'vue';
 import type { Locale } from 'vue-i18n';
 
 import type {
@@ -7,7 +8,7 @@ import type {
   SupportedLanguagesType,
 } from './typing';
 
-import { type App, unref } from 'vue';
+import { unref } from 'vue';
 import { createI18n } from 'vue-i18n';
 
 import { useSimpleLocale } from '@vben-core/composables';
diff --git a/packages/locales/src/index.ts b/packages/locales/src/index.ts
index eb2251ad..d4bfd819 100644
--- a/packages/locales/src/index.ts
+++ b/packages/locales/src/index.ts
@@ -7,9 +7,11 @@ import {
 } from './i18n';
 
 const $t = i18n.global.t;
+const $te = i18n.global.te;
 
 export {
   $t,
+  $te,
   i18n,
   loadLocaleMessages,
   loadLocalesMap,
diff --git a/packages/locales/src/langs/en-US/authentication.json b/packages/locales/src/langs/en-US/authentication.json
index f294cdd8..7dd34622 100644
--- a/packages/locales/src/langs/en-US/authentication.json
+++ b/packages/locales/src/langs/en-US/authentication.json
@@ -36,6 +36,11 @@
   "qrcodeSubtitle": "Scan the QR code with your phone to login",
   "qrcodePrompt": "Click 'Confirm' after scanning to complete login",
   "qrcodeLogin": "QR Code Login",
+  "wechatLogin": "Wechat Login",
+  "qqLogin": "QQ Login",
+  "githubLogin": "Github Login",
+  "googleLogin": "Google Login",
+  "dingdingLogin": "Dingding Login",
   "codeSubtitle": "Enter your phone number to start managing your project",
   "code": "Security code",
   "codeTip": "Security code required {0} characters",
@@ -46,6 +51,10 @@
   "sendCode": "Get Security code",
   "sendText": "Resend in {0}s",
   "thirdPartyLogin": "Or continue with",
+  "weChat": "WeChat",
+  "qq": "QQ",
+  "gitHub": "GitHub",
+  "google": "Google",
   "loginAgainTitle": "Please Log In Again",
   "loginAgainSubTitle": "Your login session has expired. Please log in again to continue.",
   "layout": {
diff --git a/packages/locales/src/langs/en-US/common.json b/packages/locales/src/langs/en-US/common.json
index 01fc9ce7..b4a576ac 100644
--- a/packages/locales/src/langs/en-US/common.json
+++ b/packages/locales/src/langs/en-US/common.json
@@ -6,9 +6,21 @@
   "prompt": "Prompt",
   "cancel": "Cancel",
   "confirm": "Confirm",
+  "reset": "Reset",
   "noData": "No Data",
   "refresh": "Refresh",
   "loadingMenu": "Loading Menu",
   "query": "Search",
-  "search": "Search"
+  "search": "Search",
+  "enabled": "Enabled",
+  "disabled": "Disabled",
+  "edit": "Edit",
+  "delete": "Delete",
+  "detail": "Detail",
+  "create": "Create",
+  "yes": "Yes",
+  "no": "No",
+  "showSearchPanel": "Show search panel",
+  "hideSearchPanel": "Hide search panel",
+  "notShow": "Don't Show"
 }
diff --git a/packages/locales/src/langs/en-US/preferences.json b/packages/locales/src/langs/en-US/preferences.json
index 5bb58176..1a2697a6 100644
--- a/packages/locales/src/langs/en-US/preferences.json
+++ b/packages/locales/src/langs/en-US/preferences.json
@@ -1,6 +1,8 @@
 {
   "title": "Preferences",
   "subtitle": "Customize Preferences & Preview in Real Time",
+  "enableStickyPreferencesNavigationBar": "Enable sticky preferences navigation bar",
+  "disableStickyPreferencesNavigationBar": "Disable sticky preferences navigation bar",
   "resetTip": "Data has changed, click to reset",
   "resetTitle": "Reset Preferences",
   "resetSuccess": "Preferences reset successfully",
@@ -17,6 +19,10 @@
   "horizontalTip": "Horizontal menu mode, all menus displayed at the top",
   "twoColumn": "Two Column",
   "twoColumnTip": "Vertical Two Column Menu Mode",
+  "headerSidebarNav": "Header Vertical",
+  "headerSidebarNavTip": "Header Full Width, Sidebar Navigation Mode",
+  "headerTwoColumn": "Header Two Column",
+  "headerTwoColumnTip": "Header Navigation & Sidebar Two Column co-exists",
   "mixedMenu": "Mixed Menu",
   "mixedMenuTip": "Vertical & Horizontal Menu Co-exists",
   "fullContent": "Full Content",
@@ -25,25 +31,33 @@
   "plain": "Plain",
   "rounded": "Rounded",
   "copyPreferences": "Copy Preferences",
+  "enableCopyPreferences": "Show copy preferences button",
   "copyPreferencesSuccessTitle": "Copy successful",
   "copyPreferencesSuccess": "Copy successful, please override in `src/preferences.ts` under app",
   "clearAndLogout": "Clear Cache & Logout",
   "mode": "Mode",
   "general": "General",
   "language": "Language",
+  "timezone": "Timezone",
   "dynamicTitle": "Dynamic Title",
   "watermark": "Watermark",
+  "watermarkContent": "Please input Watermark content",
   "checkUpdates": "Periodic update check",
   "position": {
     "title": "Preferences Postion",
     "header": "Header",
     "auto": "Auto",
-    "fixed": "Fixed"
+    "fixed": "Fixed",
+    "userDropdown": "User Dropdown"
   },
   "sidebar": {
+    "buttons": "Show Buttons",
+    "buttonFixed": "Fixed",
+    "buttonCollapsed": "Collapsed",
     "title": "Sidebar",
     "width": "Width",
     "visible": "Show Sidebar",
+    "draggable": "Drag Sidebar Menu",
     "collapsed": "Collpase Menu",
     "collapsedShowTitle": "Show Menu Title",
     "autoActivateChild": "Auto Activate SubMenu",
@@ -58,8 +72,13 @@
     "showMore": "Show More Button",
     "showMaximize": "Show Maximize Button",
     "persist": "Persist Tabs",
+    "visitHistory": "Visit History",
+    "visitHistoryTip": "When enabled, the tab bar records tab visit history. \nClosing the current tab will automatically select the last opened tab.",
+    "maxCount": "Max Count of Tabs",
+    "maxCountTip": "When the number of tabs exceeds the maximum,\nthe oldest tab will be closed.\n Set to 0 to disable count checking.",
     "draggable": "Enable Draggable Sort",
     "wheelable": "Support Mouse Wheel",
+    "middleClickClose": "Close Tab when Mouse Middle Button Click",
     "wheelableTip": "When enabled, the Tabbar area responds to vertical scrolling events of the scroll wheel.",
     "styleType": {
       "title": "Tabs Style",
@@ -107,9 +126,14 @@
   "theme": {
     "title": "Theme",
     "radius": "Radius",
+    "fontSize": "Font Size",
+    "fontSizeTip": "Adjust global font size with real-time preview",
     "light": "Light",
     "dark": "Dark",
     "darkSidebar": "Semi Dark Sidebar",
+    "darkSidebarTip": "It can be enabled when the theme is light, and the layout is neither 'Horizontal' nor 'Full Content'.",
+    "darkSidebarSub": "Semi Dark Sidebar Sub",
+    "darkSidebarSubTip": "It can be enabled when the theme is light, the semi dark sidebar is enabled, and the layout uses 'Two-Column' menu mode.",
     "darkHeader": "Semi Dark Header",
     "weakMode": "Weak Mode",
     "grayMode": "Gray Mode",
@@ -138,7 +162,11 @@
     "modeStatic": "Static",
     "modeFixed": "Fixed",
     "modeAuto": "Auto hide & Show",
-    "modeAutoScroll": "Scroll to Hide & Show"
+    "modeAutoScroll": "Scroll to Hide & Show",
+    "menuAlign": "Menu Align",
+    "menuAlignStart": "Start",
+    "menuAlignEnd": "End",
+    "menuAlignCenter": "Center"
   },
   "footer": {
     "title": "Footer",
@@ -159,17 +187,59 @@
     "global": "Global",
     "search": "Global Search",
     "logout": "Logout",
+    "escape": "Close Current Window",
     "preferences": "Preferences"
   },
   "widget": {
     "title": "Widget",
-    "globalSearch": "Enable Global Search",
+    "globalSearch": "Global Search",
+    "globalSearchPosition": "Global Search Position",
     "fullscreen": "Enable Fullscreen",
+    "fullscreenPosition": "Fullscreen Position",
     "themeToggle": "Enable Theme Toggle",
-    "languageToggle": "Enable Language Toggle",
+    "themeTogglePosition": "Theme Toggle Position",
+    "languageToggle": "Language Toggle",
+    "languageTogglePosition": "Language Toggle Position",
     "notification": "Enable Notification",
+    "notificationPosition": "Notification Position",
     "sidebarToggle": "Enable Sidebar Toggle",
     "lockScreen": "Enable Lock Screen",
-    "refresh": "Enable Refresh"
+    "lockScreenPosition": "Lock Screen Button Position",
+    "logoutButtonPosition": "Logout Button Position",
+    "header": "Header",
+    "userDropdown": "User Dropdown",
+    "hidden": "Hidden",
+    "refresh": "Enable Refresh",
+    "refreshPosition": "Refresh Position",
+    "timezone": "Enable Timezone",
+    "timezonePosition": "Timezone Position"
+  },
+  "antd": {
+    "tabLabel": "Antd Extension",
+    "title": "Business Preferences",
+    "fields": {
+      "enableFormFullscreen": {
+        "label": "Enable Form Fullscreen Mode",
+        "tip": "Subprojects can read this extension configuration in their own business scenarios."
+      },
+      "tenantMode": {
+        "label": "Tenant Mode",
+        "options": {
+          "single": {
+            "label": "Single Tenant"
+          },
+          "multi": {
+            "label": "Multi Tenant"
+          }
+        }
+      },
+      "defaultTableSize": {
+        "label": "Default Page Size"
+      },
+      "reportTitle": {
+        "label": "Default Report Title",
+        "placeholder": "Please enter the default report title"
+      }
+    }
   }
 }
diff --git a/packages/locales/src/langs/en-US/profile.json b/packages/locales/src/langs/en-US/profile.json
new file mode 100644
index 00000000..1c17e2ec
--- /dev/null
+++ b/packages/locales/src/langs/en-US/profile.json
@@ -0,0 +1,4 @@
+{
+  "updatePassword": "Update Password",
+  "updateBasicProfile": "Update Basic Profile"
+}
diff --git a/packages/locales/src/langs/en-US/ui.json b/packages/locales/src/langs/en-US/ui.json
index 651a65ac..bafab9eb 100644
--- a/packages/locales/src/langs/en-US/ui.json
+++ b/packages/locales/src/langs/en-US/ui.json
@@ -1,11 +1,34 @@
 {
   "formRules": {
     "required": "Please enter {0}",
-    "selectRequired": "Please select {0}"
+    "selectRequired": "Please select {0}",
+    "mobile": "Please enter a valid {0}",
+    "minLength": "{0} must be at least {1} characters",
+    "maxLength": "{0} can be at most {1} characters",
+    "length": "{0} must be {1} characters long",
+    "alreadyExists": "{0} `{1}` already exists",
+    "startWith": "{0} must start with `{1}`",
+    "invalidURL": "Please input a valid URL",
+    "sizeLimit": "The file size cannot exceed {0}MB",
+    "previewWarning": "Unable to open the file, there is no available URL or preview address"
+  },
+  "actionTitle": {
+    "edit": "Modify {0}",
+    "create": "Create {0}",
+    "delete": "Delete {0}",
+    "view": "View {0}"
+  },
+  "actionMessage": {
+    "deleteConfirm": "Are you sure to delete {0}?",
+    "deleting": "Deleting {0} ...",
+    "deleteSuccess": "{0} deleted successfully",
+    "operationSuccess": "Operation succeeded",
+    "operationFailed": "Operation failed"
   },
   "placeholder": {
     "input": "Please enter",
-    "select": "Please select"
+    "select": "Please select",
+    "upload": "Click to upload"
   },
   "captcha": {
     "title": "Please complete the security verification",
@@ -13,8 +36,11 @@
     "sliderDefaultText": "Slider and drag",
     "alt": "Supports img tag src attribute value",
     "sliderRotateDefaultTip": "Click picture to refresh",
+    "sliderTranslateDefaultTip": "Click picture to refresh",
     "sliderRotateFailTip": "Validation failed",
     "sliderRotateSuccessTip": "Validation successful, time {0} seconds",
+    "sliderTranslateFailTip": "Validation failed",
+    "sliderTranslateSuccessTip": "Validation successful, time {0} seconds",
     "refreshAriaLabel": "Refresh captcha",
     "confirmAriaLabel": "Confirm selection",
     "confirm": "Confirm",
@@ -25,6 +51,61 @@
     "placeholder": "Select an icon",
     "search": "Search icon..."
   },
+  "jsonViewer": {
+    "copy": "Copy",
+    "copied": "Copied"
+  },
+  "crop": {
+    "title": "Image Cropping",
+    "titleTip": "Cropping Ratio {0}",
+    "confirm": "Crop",
+    "cancel": "Cancel cropping",
+    "errorTip": "Cropping error"
+  },
+  "tiptap": {
+    "placeholder": "Please enter content...",
+    "prompts": {
+      "image": "Enter image URL",
+      "link": "Enter link URL"
+    },
+    "toolbar": {
+      "bold": "Bold",
+      "italic": "Italic",
+      "underline": "Underline",
+      "strike": "Strike",
+      "code": "Code",
+      "codeBlock": "Code Block",
+      "heading": "Heading",
+      "paragraph": "Paragraph",
+      "heading1": "H1",
+      "heading2": "H2",
+      "heading3": "H3",
+      "heading4": "H4",
+      "bulletList": "Bullets",
+      "orderedList": "Numbering",
+      "blockquote": "Quote",
+      "link": "Link",
+      "unlink": "Unlink",
+      "image": "Image",
+      "imageUrl": "Image URL",
+      "imageUpload": "Upload Image",
+      "textColor": "Text Color",
+      "highlightColor": "Highlight Color",
+      "alignLeft": "Left",
+      "alignCenter": "Center",
+      "alignRight": "Right",
+      "preview": "Preview",
+      "undo": "Undo",
+      "redo": "Redo",
+      "clear": "Clear"
+    },
+    "upload": {
+      "fileTooLarge": "File size exceeds the limit",
+      "fileTypeNotAllowed": "File type is not allowed",
+      "onlySingleImage": "Only single image upload is supported, the first one is selected",
+      "uploadFailed": "Upload Failed"
+    }
+  },
   "fallback": {
     "pageNotFound": "Oops! Page Not Found",
     "pageNotFoundDesc": "Sorry, we couldn't find the page you were looking for.",
@@ -69,13 +150,17 @@
     },
     "lockScreen": {
       "title": "Lock Screen",
-      "screenButton": "Locking",
+      "screenButton": "Lock",
       "password": "Password",
       "placeholder": "Please enter password",
       "unlock": "Click to unlock",
       "errorPasswordTip": "Password error, please re-enter",
       "backToLogin": "Back to login",
       "entry": "Enter the system"
+    },
+    "timezone": {
+      "setTimezone": "Set Timezone",
+      "setSuccess": "Timezone set successfully"
     }
   }
 }
diff --git a/packages/locales/src/langs/zh-CN/authentication.json b/packages/locales/src/langs/zh-CN/authentication.json
index f32202b2..60e17df6 100644
--- a/packages/locales/src/langs/zh-CN/authentication.json
+++ b/packages/locales/src/langs/zh-CN/authentication.json
@@ -4,7 +4,7 @@
   "pageDesc": "满足百姓健康要求为核心，致力于便捷、安全、高效的用药与医疗服务的解决方案",
   "loginSuccess": "登录成功",
   "loginSuccessDesc": "欢迎回来",
-  "loginSubtitle": "请输入您的帐户信息以开始管理您的项目",
+  "loginSubtitle": "请输入您的账户信息以开始管理您的项目",
   "selectAccount": "快速选择账号",
   "username": "账号",
   "password": "密码",
@@ -36,6 +36,11 @@
   "qrcodeSubtitle": "请用手机扫描二维码登录",
   "qrcodePrompt": "扫码后点击 '确认'，即可完成登录",
   "qrcodeLogin": "扫码登录",
+  "wechatLogin": "微信登录",
+  "qqLogin": "QQ登录",
+  "githubLogin": "Github登录",
+  "googleLogin": "Google登录",
+  "dingdingLogin": "钉钉登录",
   "codeSubtitle": "请输入您的手机号码以开始管理您的项目",
   "code": "验证码",
   "codeTip": "请输入{0}位验证码",
@@ -46,6 +51,10 @@
   "sendCode": "获取验证码",
   "sendText": "{0}秒后重新获取",
   "thirdPartyLogin": "其他登录方式",
+  "weChat": "微信",
+  "qq": "QQ",
+  "gitHub": "GitHub",
+  "google": "Google",
   "loginAgainTitle": "重新登录",
   "loginAgainSubTitle": "您的登录状态已过期，请重新登录以继续。",
   "layout": {
diff --git a/packages/locales/src/langs/zh-CN/common.json b/packages/locales/src/langs/zh-CN/common.json
index d0b5ffc0..f33b1844 100644
--- a/packages/locales/src/langs/zh-CN/common.json
+++ b/packages/locales/src/langs/zh-CN/common.json
@@ -6,9 +6,21 @@
   "prompt": "提示",
   "cancel": "取消",
   "confirm": "确认",
+  "reset": "重置",
   "noData": "暂无数据",
   "refresh": "刷新",
   "loadingMenu": "加载菜单中",
   "query": "查询",
-  "search": "搜索"
+  "search": "搜索",
+  "enabled": "已启用",
+  "disabled": "已禁用",
+  "edit": "修改",
+  "delete": "删除",
+  "detail": "详情",
+  "create": "新增",
+  "yes": "是",
+  "no": "否",
+  "showSearchPanel": "显示搜索面板",
+  "hideSearchPanel": "隐藏搜索面板",
+  "notShow": "不显示"
 }
diff --git a/packages/locales/src/langs/zh-CN/preferences.json b/packages/locales/src/langs/zh-CN/preferences.json
index 5c3c2283..7b53e825 100644
--- a/packages/locales/src/langs/zh-CN/preferences.json
+++ b/packages/locales/src/langs/zh-CN/preferences.json
@@ -1,6 +1,8 @@
 {
   "title": "偏好设置",
   "subtitle": "自定义偏好设置 & 实时预览",
+  "enableStickyPreferencesNavigationBar": "开启首选项导航栏吸顶效果",
+  "disableStickyPreferencesNavigationBar": "关闭首选项导航栏吸顶效果",
   "resetTitle": "重置偏好设置",
   "resetTip": "数据有变化，点击可进行重置",
   "resetSuccess": "重置偏好设置成功",
@@ -17,7 +19,11 @@
   "horizontalTip": "水平菜单模式，菜单全部显示在顶部",
   "twoColumn": "双列菜单",
   "twoColumnTip": "垂直双列菜单模式",
-  "mixedMenu": "混合菜单",
+  "headerSidebarNav": "侧边导航",
+  "headerSidebarNavTip": "顶部通栏，侧边导航模式",
+  "headerTwoColumn": "混合双列",
+  "headerTwoColumnTip": "双列、水平菜单共存模式",
+  "mixedMenu": "混合垂直",
   "mixedMenuTip": "垂直水平菜单共存",
   "fullContent": "内容全屏",
   "fullContentTip": "不显示任何菜单，只显示内容主体",
@@ -25,25 +31,33 @@
   "plain": "朴素",
   "rounded": "圆润",
   "copyPreferences": "复制偏好设置",
+  "enableCopyPreferences": "显示复制偏好设置按钮",
   "copyPreferencesSuccessTitle": "复制成功",
   "copyPreferencesSuccess": "复制成功，请在 app 下的 `src/preferences.ts`内进行覆盖",
   "clearAndLogout": "清空缓存 & 退出登录",
   "mode": "模式",
   "general": "通用",
   "language": "语言",
+  "timezone": "时区",
   "dynamicTitle": "动态标题",
   "watermark": "水印",
+  "watermarkContent": "请输入水印文案",
   "checkUpdates": "定时检查更新",
   "position": {
     "title": "偏好设置位置",
     "header": "顶栏",
     "auto": "自动",
-    "fixed": "固定"
+    "fixed": "固定",
+    "userDropdown": "用户下拉窗"
   },
   "sidebar": {
+    "buttons": "显示按钮",
+    "buttonFixed": "固定按钮",
+    "buttonCollapsed": "折叠按钮",
     "title": "侧边栏",
     "width": "宽度",
     "visible": "显示侧边栏",
+    "draggable": "侧边栏菜单拖拽",
     "collapsed": "折叠菜单",
     "collapsedShowTitle": "折叠显示菜单名",
     "autoActivateChild": "自动激活子菜单",
@@ -58,8 +72,13 @@
     "showMore": "显示更多按钮",
     "showMaximize": "显示最大化按钮",
     "persist": "持久化标签页",
+    "visitHistory": "访问历史记录",
+    "visitHistoryTip": "开启后，标签栏会记录标签访问历史\n关闭当前标签，会自动选中上一个打开的标签",
+    "maxCount": "最大标签数",
+    "maxCountTip": "每次打开新的标签时如果超过最大标签数，\n会自动关闭一个最先打开的标签\n设置为 0 则不限制",
     "draggable": "启动拖拽排序",
     "wheelable": "启用纵向滚轮响应",
+    "middleClickClose": "点击鼠标中键关闭标签页",
     "wheelableTip": "开启后，标签栏区域可以响应滚轮的纵向滚动事件。\n关闭时，只能响应系统的横向滚动事件（需要按下Shift再滚动滚轮）",
     "styleType": {
       "title": "标签页风格",
@@ -107,9 +126,14 @@
   "theme": {
     "title": "主题",
     "radius": "圆角",
+    "fontSize": "字体大小",
+    "fontSizeTip": "调整全局字体大小，实时预览效果",
     "light": "浅色",
     "dark": "深色",
     "darkSidebar": "深色侧边栏",
+    "darkSidebarTip": "当主题为浅色，布局不为水平菜单或不为内容全屏时可开启",
+    "darkSidebarSub": "深色侧边栏子栏",
+    "darkSidebarSubTip": "当主题为浅色，开启深色侧边栏且布局使用双列菜单模式时可开启",
     "darkHeader": "深色顶栏",
     "weakMode": "色弱模式",
     "grayMode": "灰色模式",
@@ -138,7 +162,11 @@
     "modeFixed": "固定",
     "modeAuto": "自动隐藏和显示",
     "modeAutoScroll": "滚动隐藏和显示",
-    "visible": "显示顶栏"
+    "visible": "显示顶栏",
+    "menuAlign": "菜单位置",
+    "menuAlignStart": "左侧",
+    "menuAlignEnd": "右侧",
+    "menuAlignCenter": "居中"
   },
   "footer": {
     "title": "底栏",
@@ -159,17 +187,59 @@
     "global": "全局",
     "search": "全局搜索",
     "logout": "退出登录",
+    "escape": "关闭当前窗口",
     "preferences": "偏好设置"
   },
   "widget": {
     "title": "小部件",
-    "globalSearch": "启用全局搜索",
-    "fullscreen": "启用全屏",
-    "themeToggle": "启用主题切换",
-    "languageToggle": "启用语言切换",
-    "notification": "启用通知",
+    "globalSearch": "全局搜索",
+    "globalSearchPosition": "全局搜索位置",
+    "fullscreen": "全屏",
+    "fullscreenPosition": "全屏按钮位置",
+    "themeToggle": "主题切换",
+    "themeTogglePosition": "主题切换位置",
+    "languageToggle": "语言切换",
+    "languageTogglePosition": "语言切换位置",
+    "notification": "通知",
+    "notificationPosition": "通知位置",
     "sidebarToggle": "启用侧边栏切换",
-    "lockScreen": "启用锁屏",
-    "refresh": "启用刷新"
+    "lockScreen": "锁屏",
+    "lockScreenPosition": "锁屏按钮位置",
+    "logoutButtonPosition": "退出按钮位置",
+    "header": "顶栏",
+    "userDropdown": "用户下拉窗",
+    "hidden": "已隐藏",
+    "refresh": "刷新",
+    "refreshPosition": "刷新按钮位置",
+    "timezone": "时区",
+    "timezonePosition": "时区按钮位置"
+  },
+  "antd": {
+    "tabLabel": "Antd 拓展",
+    "title": "业务偏好",
+    "fields": {
+      "enableFormFullscreen": {
+        "label": "启用表单全屏模式",
+        "tip": "子项目可在自己的业务场景中读取这个拓展配置。"
+      },
+      "tenantMode": {
+        "label": "租户模式",
+        "options": {
+          "single": {
+            "label": "单租户"
+          },
+          "multi": {
+            "label": "多租户"
+          }
+        }
+      },
+      "defaultTableSize": {
+        "label": "默认分页条数"
+      },
+      "reportTitle": {
+        "label": "报表默认标题",
+        "placeholder": "请输入报表默认标题"
+      }
+    }
   }
 }
diff --git a/packages/locales/src/langs/zh-CN/profile.json b/packages/locales/src/langs/zh-CN/profile.json
new file mode 100644
index 00000000..a38908c5
--- /dev/null
+++ b/packages/locales/src/langs/zh-CN/profile.json
@@ -0,0 +1,4 @@
+{
+  "updatePassword": "更新密码",
+  "updateBasicProfile": "更新基本信息"
+}
diff --git a/packages/locales/src/langs/zh-CN/ui.json b/packages/locales/src/langs/zh-CN/ui.json
index 2b6fe98d..79fe4c7d 100644
--- a/packages/locales/src/langs/zh-CN/ui.json
+++ b/packages/locales/src/langs/zh-CN/ui.json
@@ -1,19 +1,45 @@
 {
   "formRules": {
     "required": "请输入{0}",
-    "selectRequired": "请选择{0}"
+    "selectRequired": "请选择{0}",
+    "mobile": "请输入正确的{0}",
+    "minLength": "{0}至少{1}个字符",
+    "maxLength": "{0}最多{1}个字符",
+    "length": "{0}长度必须为{1}个字符",
+    "alreadyExists": "{0} `{1}` 已存在",
+    "startWith": "{0}必须以 {1} 开头",
+    "invalidURL": "请输入有效的链接",
+    "sizeLimit": "文件大小不能超过 {0}MB",
+    "previewWarning": "无法打开文件，没有可用的URL或预览地址"
+  },
+  "actionTitle": {
+    "edit": "修改{0}",
+    "create": "新增{0}",
+    "delete": "删除{0}",
+    "view": "查看{0}"
+  },
+  "actionMessage": {
+    "deleteConfirm": "确定删除 {0} 吗？",
+    "deleting": "正在删除 {0} ...",
+    "deleteSuccess": "{0} 删除成功",
+    "operationSuccess": "操作成功",
+    "operationFailed": "操作失败"
   },
   "placeholder": {
     "input": "请输入",
-    "select": "请选择"
+    "select": "请选择",
+    "upload": "点击上传"
   },
   "captcha": {
     "title": "请完成安全验证",
     "sliderSuccessText": "验证通过",
     "sliderDefaultText": "请按住滑块拖动",
     "sliderRotateDefaultTip": "点击图片可刷新",
+    "sliderTranslateDefaultTip": "点击图片可刷新",
     "sliderRotateFailTip": "验证失败",
     "sliderRotateSuccessTip": "验证成功，耗时{0}秒",
+    "sliderTranslateFailTip": "验证失败",
+    "sliderTranslateSuccessTip": "验证成功，耗时{0}秒",
     "alt": "支持img标签src属性值",
     "refreshAriaLabel": "刷新验证码",
     "confirmAriaLabel": "确认选择",
@@ -25,6 +51,61 @@
     "placeholder": "选择一个图标",
     "search": "搜索图标..."
   },
+  "jsonViewer": {
+    "copy": "复制",
+    "copied": "已复制"
+  },
+  "crop": {
+    "title": "图片裁剪",
+    "titleTip": "裁剪比例 {0}",
+    "confirm": "裁剪",
+    "cancel": "取消裁剪",
+    "errorTip": "裁剪错误"
+  },
+  "tiptap": {
+    "placeholder": "请输入内容...",
+    "prompts": {
+      "image": "请输入图片地址",
+      "link": "请输入链接地址"
+    },
+    "toolbar": {
+      "bold": "加粗",
+      "italic": "斜体",
+      "underline": "下划线",
+      "strike": "删除线",
+      "code": "行内代码",
+      "codeBlock": "代码块",
+      "heading": "标题",
+      "paragraph": "正文",
+      "heading1": "标题1",
+      "heading2": "标题2",
+      "heading3": "标题3",
+      "heading4": "标题4",
+      "bulletList": "无序列表",
+      "orderedList": "有序列表",
+      "blockquote": "引用",
+      "link": "链接",
+      "unlink": "移除链接",
+      "image": "图片",
+      "imageUrl": "图片URL",
+      "imageUpload": "从本地上传",
+      "textColor": "文字颜色",
+      "highlightColor": "高亮颜色",
+      "alignLeft": "左对齐",
+      "alignCenter": "居中",
+      "alignRight": "右对齐",
+      "preview": "预览",
+      "undo": "撤销",
+      "redo": "重做",
+      "clear": "清除"
+    },
+    "upload": {
+      "fileTooLarge": "文件大小超出限制",
+      "fileTypeNotAllowed": "不支持的文件类型",
+      "onlySingleImage": "仅支持单张图片上传，已选取第一张",
+      "uploadFailed": "上传失败"
+    }
+  },
   "fallback": {
     "pageNotFound": "哎呀！未找到页面",
     "pageNotFoundDesc": "抱歉，我们无法找到您要找的页面。",
@@ -76,6 +157,10 @@
       "errorPasswordTip": "密码错误，请重新输入",
       "backToLogin": "返回登录",
       "entry": "进入系统"
+    },
+    "timezone": {
+      "setTimezone": "设置时区",
+      "setSuccess": "时区设置成功"
     }
   }
 }
diff --git a/packages/preferences/package.json b/packages/preferences/package.json
index 5d51c8be..baac39e8 100644
--- a/packages/preferences/package.json
+++ b/packages/preferences/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vben/preferences",
-  "version": "5.5.1",
+  "version": "5.7.0",
   "homepage": "https://github.com/vbenjs/vue-vben-admin",
   "bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
   "repository": {
diff --git a/packages/preferences/src/index.ts b/packages/preferences/src/index.ts
index 75fab432..d97bca1e 100644
--- a/packages/preferences/src/index.ts
+++ b/packages/preferences/src/index.ts
@@ -1,4 +1,8 @@
-import type { Preferences } from '@vben-core/preferences';
+import type {
+  CustomPreferencesRecord,
+  Preferences,
+  PreferencesExtension,
+} from '@vben-core/preferences';
 import type { DeepPartial } from '@vben-core/typings';
 
 /**
@@ -12,6 +16,22 @@ function defineOverridesPreferences(preferences: DeepPartial<Preferences>) {
   return preferences;
 }
 
-export { defineOverridesPreferences };
+function definePreferencesExtension<
+  TCustomPreferences extends object = CustomPreferencesRecord,
+>(extension: PreferencesExtension<TCustomPreferences>) {
+  return extension;
+}
+
+/** 应用级 ICP 备案配置，供各 app 的 preferences 覆盖使用 */
+const appCopyrightPreferences = {
+  icp: '闽ICP备19024351号',
+  icpLink: 'https://beian.miit.gov.cn/',
+} satisfies DeepPartial<Preferences>['copyright'];
+
+export {
+  appCopyrightPreferences,
+  defineOverridesPreferences,
+  definePreferencesExtension,
+};
 
 export * from '@vben-core/preferences';
diff --git a/packages/stores/package.json b/packages/stores/package.json
index a8707d8b..dca737ea 100644
--- a/packages/stores/package.json
+++ b/packages/stores/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vben/stores",
-  "version": "5.5.1",
+  "version": "5.7.0",
   "homepage": "https://github.com/vbenjs/vue-vben-admin",
   "bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
   "repository": {
@@ -20,10 +20,12 @@
     }
   },
   "dependencies": {
+    "@vben-core/preferences": "workspace:*",
     "@vben-core/shared": "workspace:*",
     "@vben-core/typings": "workspace:*",
     "pinia": "catalog:",
     "pinia-plugin-persistedstate": "catalog:",
+    "secure-ls": "catalog:",
     "vue": "catalog:",
     "vue-router": "catalog:"
   }
diff --git a/packages/stores/shim-pinia.d.ts b/packages/stores/shim-pinia.d.ts
index 69be75da..558d0ba5 100644
--- a/packages/stores/shim-pinia.d.ts
+++ b/packages/stores/shim-pinia.d.ts
@@ -6,4 +6,4 @@ declare module 'pinia' {
   ): (newModule: any) => any;
 }
 
-export {};
+export { acceptHMRUpdate };
diff --git a/packages/stores/src/modules/access.ts b/packages/stores/src/modules/access.ts
index 6b445207..b88242e0 100644
--- a/packages/stores/src/modules/access.ts
+++ b/packages/stores/src/modules/access.ts
@@ -1,6 +1,7 @@
-import type { MenuRecordRaw } from '@vben-core/typings';
 import type { RouteRecordRaw } from 'vue-router';
 
+import type { MenuRecordRaw } from '@vben-core/typings';
+
 import { acceptHMRUpdate, defineStore } from 'pinia';
 
 type AccessToken = null | string;
@@ -26,6 +27,14 @@ interface AccessState {
    * 是否已经检查过权限
    */
   isAccessChecked: boolean;
+  /**
+   * 是否锁屏状态
+   */
+  isLockScreen: boolean;
+  /**
+   * 锁屏密码
+   */
+  lockScreenPassword?: string;
   /**
    * 登录是否过期
    */
@@ -60,6 +69,10 @@ export const useAccessStore = defineStore('core-access', {
       }
       return findMenu(this.accessMenus, path);
     },
+    lockScreen(password: string) {
+      this.isLockScreen = true;
+      this.lockScreenPassword = password;
+    },
     setAccessCodes(codes: string[]) {
       this.accessCodes = codes;
     },
@@ -81,10 +94,20 @@ export const useAccessStore = defineStore('core-access', {
     setRefreshToken(token: AccessToken) {
       this.refreshToken = token;
     },
+    unlockScreen() {
+      this.isLockScreen = false;
+      this.lockScreenPassword = undefined;
+    },
   },
   persist: {
     // 持久化
-    pick: ['accessToken', 'refreshToken', 'accessCodes'],
+    pick: [
+      'accessToken',
+      'refreshToken',
+      'accessCodes',
+      'isLockScreen',
+      'lockScreenPassword',
+    ],
   },
   state: (): AccessState => ({
     accessCodes: [],
@@ -92,6 +115,8 @@ export const useAccessStore = defineStore('core-access', {
     accessRoutes: [],
     accessToken: null,
     isAccessChecked: false,
+    isLockScreen: false,
+    lockScreenPassword: undefined,
     loginExpired: false,
     refreshToken: null,
   }),
diff --git a/packages/stores/src/modules/index.ts b/packages/stores/src/modules/index.ts
index 7941cbea..bb9a66f4 100644
--- a/packages/stores/src/modules/index.ts
+++ b/packages/stores/src/modules/index.ts
@@ -1,4 +1,4 @@
 export * from './access';
-export * from './lock';
 export * from './tabbar';
+export * from './timezone';
 export * from './user';
diff --git a/packages/stores/src/modules/lock.test.ts b/packages/stores/src/modules/lock.test.ts
deleted file mode 100644
index d8dbe554..00000000
--- a/packages/stores/src/modules/lock.test.ts
+++ /dev/null
@@ -1,31 +0,0 @@
-import { createPinia, setActivePinia } from 'pinia';
-import { beforeEach, describe, expect, it } from 'vitest';
-
-import { useLockStore } from './lock';
-
-describe('useLockStore', () => {
-  beforeEach(() => {
-    setActivePinia(createPinia());
-  });
-
-  it('should initialize with correct default state', () => {
-    const store = useLockStore();
-    expect(store.isLockScreen).toBe(false);
-    expect(store.lockScreenPassword).toBeUndefined();
-  });
-
-  it('should lock screen with a password', () => {
-    const store = useLockStore();
-    store.lockScreen('1234');
-    expect(store.isLockScreen).toBe(true);
-    expect(store.lockScreenPassword).toBe('1234');
-  });
-
-  it('should unlock screen and clear password', () => {
-    const store = useLockStore();
-    store.lockScreen('1234');
-    store.unlockScreen();
-    expect(store.isLockScreen).toBe(false);
-    expect(store.lockScreenPassword).toBeUndefined();
-  });
-});
diff --git a/packages/stores/src/modules/lock.ts b/packages/stores/src/modules/lock.ts
deleted file mode 100644
index 76a96006..00000000
--- a/packages/stores/src/modules/lock.ts
+++ /dev/null
@@ -1,33 +0,0 @@
-import { defineStore } from 'pinia';
-
-interface AppState {
-  /**
-   * 是否锁屏状态
-   */
-  isLockScreen: boolean;
-  /**
-   * 锁屏密码
-   */
-  lockScreenPassword?: string;
-}
-
-export const useLockStore = defineStore('core-lock', {
-  actions: {
-    lockScreen(password: string) {
-      this.isLockScreen = true;
-      this.lockScreenPassword = password;
-    },
-
-    unlockScreen() {
-      this.isLockScreen = false;
-      this.lockScreenPassword = undefined;
-    },
-  },
-  persist: {
-    pick: ['isLockScreen', 'lockScreenPassword'],
-  },
-  state: (): AppState => ({
-    isLockScreen: false,
-    lockScreenPassword: undefined,
-  }),
-});
diff --git a/packages/stores/src/modules/tabbar.test.ts b/packages/stores/src/modules/tabbar.test.ts
index d74615ca..7c0fe7a2 100644
--- a/packages/stores/src/modules/tabbar.test.ts
+++ b/packages/stores/src/modules/tabbar.test.ts
@@ -22,12 +22,13 @@ describe('useAccessStore', () => {
     const tab: any = {
       fullPath: '/home',
       meta: {},
+      key: '/home',
       name: 'Home',
       path: '/home',
     };
-    store.addTab(tab);
+    const addNewTab = store.addTab(tab);
     expect(store.tabs.length).toBe(1);
-    expect(store.tabs[0]).toEqual(tab);
+    expect(store.tabs[0]).toEqual(addNewTab);
   });
 
   it('adds a new tab if it does not exist', () => {
@@ -38,20 +39,22 @@ describe('useAccessStore', () => {
       name: 'New',
       path: '/new',
     };
-    store.addTab(newTab);
-    expect(store.tabs).toContainEqual(newTab);
+    const addNewTab = store.addTab(newTab);
+    expect(store.tabs).toContainEqual(addNewTab);
   });
 
   it('updates an existing tab instead of adding a new one', () => {
     const store = useTabbarStore();
     const initialTab: any = {
       fullPath: '/existing',
-      meta: {},
+      meta: {
+        fullPathKey: false,
+      },
       name: 'Existing',
       path: '/existing',
       query: {},
     };
-    store.tabs.push(initialTab);
+    store.addTab(initialTab);
     const updatedTab = { ...initialTab, query: { id: '1' } };
     store.addTab(updatedTab);
     expect(store.tabs.length).toBe(1);
@@ -60,9 +63,12 @@ describe('useAccessStore', () => {
 
   it('closes all tabs', async () => {
     const store = useTabbarStore();
-    store.tabs = [
-      { fullPath: '/home', meta: {}, name: 'Home', path: '/home' },
-    ] as any;
+    store.addTab({
+      fullPath: '/home',
+      meta: {},
+      name: 'Home',
+      path: '/home',
+    } as any);
     router.replace = vi.fn();
 
     await store.closeAllTabs(router);
@@ -157,7 +163,7 @@ describe('useAccessStore', () => {
       path: '/contact',
     } as any);
 
-    await store._bulkCloseByPaths(['/home', '/contact']);
+    await store._bulkCloseByKeys(['/home', '/contact']);
 
     expect(store.tabs).toHaveLength(1);
     expect(store.tabs[0]?.name).toBe('About');
@@ -183,9 +189,8 @@ describe('useAccessStore', () => {
       name: 'Contact',
       path: '/contact',
     };
-    store.addTab(targetTab);
-
-    await store.closeLeftTabs(targetTab);
+    const addTargetTab = store.addTab(targetTab);
+    await store.closeLeftTabs(addTargetTab);
 
     expect(store.tabs).toHaveLength(1);
     expect(store.tabs[0]?.name).toBe('Contact');
@@ -205,7 +210,7 @@ describe('useAccessStore', () => {
       name: 'About',
       path: '/about',
     };
-    store.addTab(targetTab);
+    const addTargetTab = store.addTab(targetTab);
     store.addTab({
       fullPath: '/contact',
       meta: {},
@@ -213,7 +218,7 @@ describe('useAccessStore', () => {
       path: '/contact',
     } as any);
 
-    await store.closeOtherTabs(targetTab);
+    await store.closeOtherTabs(addTargetTab);
 
     expect(store.tabs).toHaveLength(1);
     expect(store.tabs[0]?.name).toBe('About');
@@ -227,7 +232,7 @@ describe('useAccessStore', () => {
       name: 'Home',
       path: '/home',
     };
-    store.addTab(targetTab);
+    const addTargetTab = store.addTab(targetTab);
     store.addTab({
       fullPath: '/about',
       meta: {},
@@ -241,7 +246,7 @@ describe('useAccessStore', () => {
       path: '/contact',
     } as any);
 
-    await store.closeRightTabs(targetTab);
+    await store.closeRightTabs(addTargetTab);
 
     expect(store.tabs).toHaveLength(1);
     expect(store.tabs[0]?.name).toBe('Home');
diff --git a/packages/stores/src/modules/tabbar.ts b/packages/stores/src/modules/tabbar.ts
index 53a74feb..098c7f07 100644
--- a/packages/stores/src/modules/tabbar.ts
+++ b/packages/stores/src/modules/tabbar.ts
@@ -1,17 +1,35 @@
+import type { ComputedRef, VNode } from 'vue';
+import type {
+  RouteLocationNormalized,
+  RouteLocationNormalizedLoaded,
+  RouteLocationNormalizedLoadedGeneric,
+  Router,
+  RouteRecordNormalized,
+} from 'vue-router';
+
 import type { TabDefinition } from '@vben-core/typings';
-import type { Router, RouteRecordNormalized } from 'vue-router';
 
-import { toRaw } from 'vue';
+import { markRaw, nextTick, toRaw } from 'vue';
 
+import { preferences } from '@vben-core/preferences';
 import {
-  openRouteInNewWindow,
+  createStack,
+  openWindow,
+  Stack,
   startProgress,
   stopProgress,
 } from '@vben-core/shared/utils';
 
 import { acceptHMRUpdate, defineStore } from 'pinia';
 
+interface RouteCached {
+  component: VNode;
+  key: string;
+  route: RouteLocationNormalizedLoadedGeneric;
+}
+
 interface TabbarState {
+  cachedRoutes: Map<string, RouteCached>;
   /**
    * @zh_CN 当前打开的标签页列表缓存
    */
@@ -24,6 +42,10 @@ interface TabbarState {
    * @zh_CN 需要排除缓存的标签页
    */
   excludeCachedTabs: Set<string>;
+  /**
+   * @zh_CN 标签右键菜单列表
+   */
+  menuList: string[];
   /**
    * @zh_CN 是否刷新
    */
@@ -36,8 +58,17 @@ interface TabbarState {
    * @zh_CN 更新时间，用于一些更新场景，使用watch深度监听的话，会损耗性能
    */
   updateTime?: number;
+  /**
+   * @zh_CN 上一个标签页打开的标签
+   */
+  visitHistory: Stack<string>;
 }
 
+/**
+ * @zh_CN 访问历史记录最大数量
+ */
+const MAX_VISIT_HISTORY = 50;
+
 /**
  * @zh_CN 访问权限相关
  */
@@ -46,23 +77,26 @@ export const useTabbarStore = defineStore('core-tabbar', {
     /**
      * Close tabs in bulk
      */
-    async _bulkCloseByPaths(paths: string[]) {
-      this.tabs = this.tabs.filter((item) => {
-        return !paths.includes(getTabPath(item));
-      });
+    async _bulkCloseByKeys(keys: string[]) {
+      const keySet = new Set(keys);
+      this.tabs = this.tabs.filter(
+        (item) => !keySet.has(getTabKeyFromTab(item)),
+      );
+      if (isVisitHistory()) {
+        this.visitHistory.remove(...keys);
+      }
 
-      this.updateCacheTabs();
+      await this.updateCacheTabs();
     },
     /**
      * @zh_CN 关闭标签页
      * @param tab
      */
     _close(tab: TabDefinition) {
-      const { fullPath } = tab;
       if (isAffixTab(tab)) {
         return;
       }
-      const index = this.tabs.findIndex((item) => item.fullPath === fullPath);
+      const index = this.tabs.findIndex((item) => equalTab(item, tab));
       index !== -1 && this.tabs.splice(index, 1);
     },
     /**
@@ -95,17 +129,21 @@ export const useTabbarStore = defineStore('core-tabbar', {
      * @zh_CN 添加标签页
      * @param routeTab
      */
-    addTab(routeTab: TabDefinition) {
-      const tab = cloneTab(routeTab);
+    addTab(routeTab: TabDefinition): TabDefinition {
+      let tab = cloneTab(routeTab);
+      if (!tab.key) {
+        tab.key = getTabKey(routeTab);
+      }
       if (!isTabShown(tab)) {
-        return;
+        return tab;
       }
 
-      const tabIndex = this.tabs.findIndex((tab) => {
-        return getTabPath(tab) === getTabPath(routeTab);
+      const tabIndex = this.tabs.findIndex((item) => {
+        return equalTab(item, tab);
       });
 
       if (tabIndex === -1) {
+        const maxCount = preferences.tabbar.maxCount;
         // 获取动态路由打开数，超过 0 即代表需要控制打开数
         const maxNumOfOpenTab = (routeTab?.meta?.maxNumOfOpenTab ??
           -1) as number;
@@ -121,8 +159,14 @@ export const useTabbarStore = defineStore('core-tabbar', {
             (item) => item.name === routeTab.name,
           );
           index !== -1 && this.tabs.splice(index, 1);
+        } else if (maxCount > 0 && this.tabs.length >= maxCount) {
+          // 关闭第一个
+          const index = this.tabs.findIndex(
+            (item) =>
+              !Reflect.has(item.meta, 'affixTab') || !item.meta.affixTab,
+          );
+          index !== -1 && this.tabs.splice(index, 1);
         }
-
         this.tabs.push(tab);
       } else {
         // 页面已经存在，不重复添加选项卡，只更新选项卡参数
@@ -141,10 +185,15 @@ export const useTabbarStore = defineStore('core-tabbar', {
             mergedTab.meta.newTabTitle = curMeta.newTabTitle;
           }
         }
-
+        tab = mergedTab;
         this.tabs.splice(tabIndex, 1, mergedTab);
       }
       this.updateCacheTabs();
+      // 添加访问历史记录
+      if (isVisitHistory()) {
+        this.visitHistory.push(tab.key as string);
+      }
+      return tab;
     },
     /**
      * @zh_CN 关闭所有标签页
@@ -152,6 +201,12 @@ export const useTabbarStore = defineStore('core-tabbar', {
     async closeAllTabs(router: Router) {
       const newTabs = this.tabs.filter((tab) => isAffixTab(tab));
       this.tabs = newTabs.length > 0 ? newTabs : [...this.tabs].splice(0, 1);
+      // 设置访问历史记录
+      if (isVisitHistory()) {
+        this.visitHistory.retain(
+          this.tabs.map((item) => getTabKeyFromTab(item)),
+        );
+      }
       await this._goToDefaultTab(router);
       this.updateCacheTabs();
     },
@@ -160,65 +215,63 @@ export const useTabbarStore = defineStore('core-tabbar', {
      * @param tab
      */
     async closeLeftTabs(tab: TabDefinition) {
-      const index = this.tabs.findIndex(
-        (item) => getTabPath(item) === getTabPath(tab),
-      );
+      const index = this.tabs.findIndex((item) => equalTab(item, tab));
 
       if (index < 1) {
         return;
       }
 
       const leftTabs = this.tabs.slice(0, index);
-      const paths: string[] = [];
+      const keys: string[] = [];
 
       for (const item of leftTabs) {
         if (!isAffixTab(item)) {
-          paths.push(getTabPath(item));
+          keys.push(item.key as string);
         }
       }
-      await this._bulkCloseByPaths(paths);
+      await this._bulkCloseByKeys(keys);
     },
     /**
      * @zh_CN 关闭其他标签页
      * @param tab
      */
     async closeOtherTabs(tab: TabDefinition) {
-      const closePaths = this.tabs.map((item) => getTabPath(item));
+      const closeKeys = this.tabs.map((item) => getTabKeyFromTab(item));
 
-      const paths: string[] = [];
+      const keys: string[] = [];
 
-      for (const path of closePaths) {
-        if (path !== tab.fullPath) {
-          const closeTab = this.tabs.find((item) => getTabPath(item) === path);
+      for (const key of closeKeys) {
+        if (key !== getTabKeyFromTab(tab)) {
+          const closeTab = this.tabs.find(
+            (item) => getTabKeyFromTab(item) === key,
+          );
           if (!closeTab) {
             continue;
           }
           if (!isAffixTab(closeTab)) {
-            paths.push(getTabPath(closeTab));
+            keys.push(closeTab.key as string);
           }
         }
       }
-      await this._bulkCloseByPaths(paths);
+      await this._bulkCloseByKeys(keys);
     },
     /**
      * @zh_CN 关闭右侧标签页
      * @param tab
      */
     async closeRightTabs(tab: TabDefinition) {
-      const index = this.tabs.findIndex(
-        (item) => getTabPath(item) === getTabPath(tab),
-      );
+      const index = this.tabs.findIndex((item) => equalTab(item, tab));
 
       if (index !== -1 && index < this.tabs.length - 1) {
         const rightTabs = this.tabs.slice(index + 1);
 
-        const paths: string[] = [];
+        const keys: string[] = [];
         for (const item of rightTabs) {
           if (!isAffixTab(item)) {
-            paths.push(getTabPath(item));
+            keys.push(item.key as string);
           }
         }
-        await this._bulkCloseByPaths(paths);
+        await this._bulkCloseByKeys(keys);
       }
     },
 
@@ -229,15 +282,46 @@ export const useTabbarStore = defineStore('core-tabbar', {
      */
     async closeTab(tab: TabDefinition, router: Router) {
       const { currentRoute } = router;
-
+      const currentTabKey = getTabKey(currentRoute.value);
       // 关闭不是激活选项卡
-      if (getTabPath(currentRoute.value) !== getTabPath(tab)) {
+      if (currentTabKey !== getTabKeyFromTab(tab)) {
         this._close(tab);
         this.updateCacheTabs();
+        // 移除访问历史记录
+        if (isVisitHistory()) {
+          this.visitHistory.remove(getTabKeyFromTab(tab));
+        }
         return;
       }
+      if (this.getTabs.length <= 1) {
+        console.error('Failed to close the tab; only one tab remains open.');
+        return;
+      }
+      // 从访问历史记录中移除当前关闭的tab
+      if (isVisitHistory()) {
+        this.visitHistory.remove(currentTabKey);
+        this._close(tab);
+
+        let previousTab: TabDefinition | undefined;
+        let previousTabKey: string | undefined;
+        while (true) {
+          previousTabKey = this.visitHistory.pop();
+          if (!previousTabKey) {
+            break;
+          }
+          previousTab = this.getTabByKey(previousTabKey);
+          if (previousTab) {
+            break;
+          }
+        }
+        await (previousTab
+          ? this._goToTab(previousTab, router)
+          : this._goToDefaultTab(router));
+        return;
+      }
+      // 未开启访问历史记录，直接跳转下一个或上一个tab
       const index = this.getTabs.findIndex(
-        (item) => getTabPath(item) === getTabPath(currentRoute.value),
+        (item) => getTabKeyFromTab(item) === getTabKey(currentRoute.value),
       );
 
       const before = this.getTabs[index - 1];
@@ -251,8 +335,6 @@ export const useTabbarStore = defineStore('core-tabbar', {
       } else if (before) {
         this._close(tab);
         await this._goToTab(before, router);
-      } else {
-        console.error('Failed to close the tab; only one tab remains open.');
       }
     },
 
@@ -264,7 +346,7 @@ export const useTabbarStore = defineStore('core-tabbar', {
     async closeTabByKey(key: string, router: Router) {
       const originKey = decodeURIComponent(key);
       const index = this.tabs.findIndex(
-        (item) => getTabPath(item) === originKey,
+        (item) => getTabKeyFromTab(item) === originKey,
       );
       if (index === -1) {
         return;
@@ -277,20 +359,21 @@ export const useTabbarStore = defineStore('core-tabbar', {
     },
 
     /**
-     * 根据路径获取标签页
-     * @param path
+     * 根据tab的key获取tab
+     * @param key
      */
-    getTabByPath(path: string) {
+    getTabByKey(key: string) {
       return this.getTabs.find(
-        (item) => getTabPath(item) === path,
+        (item) => getTabKeyFromTab(item) === key,
       ) as TabDefinition;
     },
     /**
      * @zh_CN 新窗口打开标签页
      * @param tab
      */
-    async openTabInNewWindow(tab: TabDefinition) {
-      openRouteInNewWindow(tab.fullPath || tab.path);
+    async openTabInNewWindow(tab: TabDefinition, router: Router) {
+      const href = router.resolve(tab.fullPath || tab.path).href;
+      openWindow(new URL(href, location.href).href, { target: '_blank' });
     },
 
     /**
@@ -298,22 +381,19 @@ export const useTabbarStore = defineStore('core-tabbar', {
      * @param tab
      */
     async pinTab(tab: TabDefinition) {
-      const index = this.tabs.findIndex(
-        (item) => getTabPath(item) === getTabPath(tab),
-      );
-      if (index !== -1) {
-        const oldTab = this.tabs[index];
-        tab.meta.affixTab = true;
-        tab.meta.title = oldTab?.meta?.title as string;
-        // this.addTab(tab);
-        this.tabs.splice(index, 1, tab);
+      const index = this.tabs.findIndex((item) => equalTab(item, tab));
+      if (index === -1) {
+        return;
       }
+      const oldTab = this.tabs[index];
+      tab.meta.affixTab = true;
+      tab.meta.title = oldTab?.meta?.title as string;
+      // this.addTab(tab);
+      this.tabs.splice(index, 1, tab);
       // 过滤固定tabs，后面更改affixTabOrder的值的话可能会有问题，目前行464排序affixTabs没有设置值
       const affixTabs = this.tabs.filter((tab) => isAffixTab(tab));
       // 获得固定tabs的index
-      const newIndex = affixTabs.findIndex(
-        (item) => getTabPath(item) === getTabPath(tab),
-      );
+      const newIndex = affixTabs.findIndex((item) => equalTab(item, tab));
       // 交换位置重新排序
       await this.sortTabs(index, newIndex);
     },
@@ -321,7 +401,13 @@ export const useTabbarStore = defineStore('core-tabbar', {
     /**
      * 刷新标签页
      */
-    async refresh(router: Router) {
+    async refresh(router: Router | string) {
+      // 如果是Router路由，那么就根据当前路由刷新
+      // 如果是string字符串，为路由名称，则定向刷新指定标签页，不能是当前路由名称，否则不会刷新
+      if (typeof router === 'string') {
+        return await this.refreshByName(router);
+      }
+
       const { currentRoute } = router;
       const { name } = currentRoute.value;
 
@@ -329,13 +415,23 @@ export const useTabbarStore = defineStore('core-tabbar', {
       this.renderRouteView = false;
       startProgress();
 
-      await new Promise((resolve) => setTimeout(resolve, 200));
+      await nextTick();
+      // await new Promise((resolve) => setTimeout(resolve, 200));
 
       this.excludeCachedTabs.delete(name as string);
       this.renderRouteView = true;
       stopProgress();
     },
 
+    /**
+     * 根据路由名称刷新指定标签页
+     */
+    async refreshByName(name: string) {
+      this.excludeCachedTabs.add(name);
+      await new Promise((resolve) => setTimeout(resolve, 200));
+      this.excludeCachedTabs.delete(name);
+    },
+
     /**
      * @zh_CN 重置标签页标题
      */
@@ -343,9 +439,7 @@ export const useTabbarStore = defineStore('core-tabbar', {
       if (tab?.meta?.newTabTitle) {
         return;
       }
-      const findTab = this.tabs.find(
-        (item) => getTabPath(item) === getTabPath(tab),
-      );
+      const findTab = this.tabs.find((item) => equalTab(item, tab));
       if (findTab) {
         findTab.meta.newTabTitle = undefined;
         await this.updateCacheTabs();
@@ -364,14 +458,33 @@ export const useTabbarStore = defineStore('core-tabbar', {
     },
 
     /**
-     * @zh_CN 设置标签页标题
-     * @param tab
-     * @param title
+     * @zh_CN 更新菜单列表
+     * @param list
      */
-    async setTabTitle(tab: TabDefinition, title: string) {
-      const findTab = this.tabs.find(
-        (item) => getTabPath(item) === getTabPath(tab),
-      );
+    setMenuList(list: string[]) {
+      this.menuList = list;
+    },
+
+    /**
+     * @zh_CN 设置标签页标题
+     *
+     * @zh_CN 支持设置静态标题字符串或计算属性作为动态标题
+     * @zh_CN 当标题为计算属性时,标题会随计算属性值变化而自动更新
+     * @zh_CN 适用于需要根据状态或多语言动态更新标题的场景
+     *
+     * @param {TabDefinition} tab - 标签页对象
+     * @param {ComputedRef<string> | string} title - 标题内容,支持静态字符串或计算属性
+     *
+     * @example
+     * // 设置静态标题
+     * setTabTitle(tab, '新标签页');
+     *
+     * @example
+     * // 设置动态标题
+     * setTabTitle(tab, computed(() => t('common.dashboard')));
+     */
+    async setTabTitle(tab: TabDefinition, title: ComputedRef<string> | string) {
+      const findTab = this.tabs.find((item) => equalTab(item, tab));
 
       if (findTab) {
         findTab.meta.newTabTitle = title;
@@ -379,7 +492,6 @@ export const useTabbarStore = defineStore('core-tabbar', {
         await this.updateCacheTabs();
       }
     },
-
     setUpdateTime() {
       this.updateTime = Date.now();
     },
@@ -397,6 +509,7 @@ export const useTabbarStore = defineStore('core-tabbar', {
       this.tabs.splice(newIndex, 0, currentTab);
       this.dragEndIndex = this.dragEndIndex + 1;
     },
+
     /**
      * @zh_CN 切换固定标签页
      * @param tab
@@ -412,17 +525,15 @@ export const useTabbarStore = defineStore('core-tabbar', {
      * @param tab
      */
     async unpinTab(tab: TabDefinition) {
-      const index = this.tabs.findIndex(
-        (item) => getTabPath(item) === getTabPath(tab),
-      );
-
-      if (index !== -1) {
-        const oldTab = this.tabs[index];
-        tab.meta.affixTab = false;
-        tab.meta.title = oldTab?.meta?.title as string;
-        // this.addTab(tab);
-        this.tabs.splice(index, 1, tab);
+      const index = this.tabs.findIndex((item) => equalTab(item, tab));
+      if (index === -1) {
+        return;
       }
+      const oldTab = this.tabs[index];
+      tab.meta.affixTab = false;
+      tab.meta.title = oldTab?.meta?.title as string;
+      // this.addTab(tab);
+      this.tabs.splice(index, 1, tab);
       // 过滤固定tabs，后面更改affixTabOrder的值的话可能会有问题，目前行464排序affixTabs没有设置值
       const affixTabs = this.tabs.filter((tab) => isAffixTab(tab));
       // 获得固定tabs的index,使用固定tabs的下一个位置也就是活动tabs的第一个位置
@@ -430,7 +541,6 @@ export const useTabbarStore = defineStore('core-tabbar', {
       // 交换位置重新排序
       await this.sortTabs(index, newIndex);
     },
-
     /**
      * 根据当前打开的选项卡更新缓存
      */
@@ -454,12 +564,31 @@ export const useTabbarStore = defineStore('core-tabbar', {
       }
       this.cachedTabs = cacheMap;
     },
+    /**
+     * 添加缓存的route
+     * @param component
+     * @param route
+     */
+    addCachedRoute(component: VNode, route: RouteLocationNormalizedLoaded) {
+      const key = getTabKey(route);
+      if (this.cachedRoutes.has(key)) {
+        return;
+      }
+      this.cachedRoutes.set(key, {
+        key,
+        component: markRaw(component),
+        route: markRaw(route),
+      });
+    },
+    removeCachedRoute(key: string) {
+      this.cachedRoutes.delete(key);
+    },
   },
   getters: {
     affixTabs(): TabDefinition[] {
       const affixTabs = this.tabs.filter((tab) => isAffixTab(tab));
 
-      return affixTabs.sort((a, b) => {
+      return affixTabs.toSorted((a, b) => {
         const orderA = (a.meta?.affixTabOrder ?? 0) as number;
         const orderB = (b.meta?.affixTabOrder ?? 0) as number;
         return orderA - orderB;
@@ -471,22 +600,58 @@ export const useTabbarStore = defineStore('core-tabbar', {
     getExcludeCachedTabs(): string[] {
       return [...this.excludeCachedTabs];
     },
+    getMenuList(): string[] {
+      return this.menuList;
+    },
     getTabs(): TabDefinition[] {
       const normalTabs = this.tabs.filter((tab) => !isAffixTab(tab));
       return [...this.affixTabs, ...normalTabs].filter(Boolean);
     },
+    getCachedRoutes(): Map<string, RouteCached> {
+      return this.cachedRoutes;
+    },
   },
   persist: [
     // tabs不需要保存在localStorage
     {
-      pick: ['tabs'],
+      pick: ['tabs', 'visitHistory'],
       storage: sessionStorage,
+      serializer: {
+        serialize: JSON.stringify,
+        deserialize(value: string) {
+          const parsed = JSON.parse(value);
+          // Stack 类实例经 JSON 序列化后会变成普通对象 {dedup, items, maxSize}，
+          // 丢失所有方法和 getter，需要重新构建 Stack 实例
+          if (parsed.visitHistory && !(parsed.visitHistory instanceof Stack)) {
+            const raw = parsed.visitHistory;
+            const stack = createStack<string>(true, MAX_VISIT_HISTORY);
+            if (Array.isArray(raw.items)) {
+              stack.push(...raw.items);
+            }
+            parsed.visitHistory = stack;
+          }
+          return parsed;
+        },
+      },
     },
   ],
   state: (): TabbarState => ({
+    visitHistory: createStack<string>(true, MAX_VISIT_HISTORY),
+    cachedRoutes: new Map<string, RouteCached>(),
     cachedTabs: new Set(),
     dragEndIndex: 0,
     excludeCachedTabs: new Set(),
+    menuList: [
+      'close',
+      'affix',
+      'maximize',
+      'reload',
+      'open-in-new-window',
+      'close-left',
+      'close-right',
+      'close-other',
+      'close-all',
+    ],
     renderRouteView: true,
     tabs: [],
     updateTime: Date.now(),
@@ -542,11 +707,56 @@ function isTabShown(tab: TabDefinition) {
 }
 
 /**
- * @zh_CN 获取标签页路径
+ * 从route获取tab页的key
  * @param tab
  */
-function getTabPath(tab: RouteRecordNormalized | TabDefinition) {
-  return decodeURIComponent((tab as TabDefinition).fullPath || tab.path);
+function getTabKey(tab: RouteLocationNormalized | RouteRecordNormalized) {
+  const {
+    fullPath,
+    path,
+    meta: { fullPathKey } = {},
+    query = {},
+  } = tab as RouteLocationNormalized;
+  // pageKey可能是数组（查询参数重复时可能出现）
+  const pageKey = Array.isArray(query.pageKey)
+    ? query.pageKey[0]
+    : query.pageKey;
+  let rawKey;
+  if (pageKey) {
+    rawKey = pageKey;
+  } else {
+    rawKey = fullPathKey === false ? path : (fullPath ?? path);
+  }
+  try {
+    return decodeURIComponent(rawKey);
+  } catch {
+    return rawKey;
+  }
+}
+
+/**
+ * @zh_CN 是否开启访问历史记录
+ */
+function isVisitHistory() {
+  return preferences.tabbar.visitHistory;
+}
+
+/**
+ * 从tab获取tab页的key
+ * 如果tab没有key,那么就从route获取key
+ * @param tab
+ */
+function getTabKeyFromTab(tab: TabDefinition): string {
+  return tab.key ?? getTabKey(tab);
+}
+
+/**
+ * 比较两个tab是否相等
+ * @param a
+ * @param b
+ */
+function equalTab(a: TabDefinition, b: TabDefinition) {
+  return getTabKeyFromTab(a) === getTabKeyFromTab(b);
 }
 
 function routeToTab(route: RouteRecordNormalized) {
@@ -554,5 +764,8 @@ function routeToTab(route: RouteRecordNormalized) {
     meta: route.meta,
     name: route.name,
     path: route.path,
+    key: getTabKey(route),
   } as TabDefinition;
 }
+
+export { getTabKey };
diff --git a/packages/stores/src/modules/timezone.ts b/packages/stores/src/modules/timezone.ts
new file mode 100644
index 00000000..24180c60
--- /dev/null
+++ b/packages/stores/src/modules/timezone.ts
@@ -0,0 +1,132 @@
+import { ref, unref } from 'vue';
+
+import { DEFAULT_TIME_ZONE_OPTIONS } from '@vben-core/preferences';
+import {
+  getCurrentTimezone,
+  setCurrentTimezone,
+} from '@vben-core/shared/utils';
+
+import { acceptHMRUpdate, defineStore } from 'pinia';
+
+interface TimezoneHandler {
+  getTimezone?: () => Promise<null | string | undefined>;
+  getTimezoneOptions?: () => Promise<
+    {
+      label: string;
+      value: string;
+    }[]
+  >;
+  setTimezone?: (timezone: string) => Promise<void>;
+}
+
+/**
+ * 默认时区处理模块
+ * 时区存储基于pinia存储插件
+ */
+const getDefaultTimezoneHandler = (): TimezoneHandler => {
+  return {
+    getTimezoneOptions: () => {
+      return Promise.resolve(
+        DEFAULT_TIME_ZONE_OPTIONS.map((item) => {
+          return {
+            label: item.label,
+            value: item.timezone,
+          };
+        }),
+      );
+    },
+  };
+};
+
+/**
+ * 自定义时区处理模块
+ */
+let customTimezoneHandler: null | Partial<TimezoneHandler> = null;
+const setTimezoneHandler = (handler: Partial<TimezoneHandler>) => {
+  customTimezoneHandler = handler;
+};
+
+/**
+ * 获取时区处理模块
+ */
+const getTimezoneHandler = () => {
+  return {
+    ...getDefaultTimezoneHandler(),
+    ...customTimezoneHandler,
+  };
+};
+
+/**
+ * timezone支持模块
+ */
+const useTimezoneStore = defineStore(
+  'core-timezone',
+  () => {
+    const timezoneRef = ref(getCurrentTimezone());
+
+    /**
+     * 初始化时区
+     * Initialize the timezone
+     */
+    async function initTimezone() {
+      const timezoneHandler = getTimezoneHandler();
+      const timezone = await timezoneHandler.getTimezone?.();
+      if (timezone) {
+        timezoneRef.value = timezone;
+      }
+      // 设置dayjs默认时区
+      setCurrentTimezone(unref(timezoneRef));
+    }
+
+    /**
+     * 设置时区
+     * Set the timezone
+     * @param timezone 时区字符串
+     */
+    async function setTimezone(timezone: string) {
+      const timezoneHandler = getTimezoneHandler();
+      await timezoneHandler.setTimezone?.(timezone);
+      timezoneRef.value = timezone;
+      // 设置dayjs默认时区
+      setCurrentTimezone(timezone);
+    }
+
+    /**
+     * 获取时区选项
+     * Get the timezone options
+     */
+    async function getTimezoneOptions() {
+      const timezoneHandler = getTimezoneHandler();
+      return (await timezoneHandler.getTimezoneOptions?.()) || [];
+    }
+
+    initTimezone().catch((error) => {
+      console.error('Failed to initialize timezone during store setup:', error);
+    });
+
+    function $reset() {
+      timezoneRef.value = getCurrentTimezone();
+    }
+
+    return {
+      timezone: timezoneRef,
+      setTimezone,
+      getTimezoneOptions,
+      $reset,
+    };
+  },
+  {
+    persist: {
+      // 持久化
+      pick: ['timezone'],
+    },
+  },
+);
+
+export { setTimezoneHandler, useTimezoneStore };
+
+// 解决热更新问题
+const hot = import.meta.hot;
+if (hot) {
+  hot.accept(acceptHMRUpdate(useTimezoneStore, hot));
+}
diff --git a/packages/stores/src/modules/user.ts b/packages/stores/src/modules/user.ts
index 8099002f..aea55831 100644
--- a/packages/stores/src/modules/user.ts
+++ b/packages/stores/src/modules/user.ts
@@ -1,3 +1,5 @@
+import type { BasicUserInfo } from '@vben-core/typings';
+
 import { acceptHMRUpdate, defineStore } from 'pinia';
 
 interface BasicUserInfo {
diff --git a/packages/stores/src/setup.ts b/packages/stores/src/setup.ts
index a404fc57..f13a497e 100644
--- a/packages/stores/src/setup.ts
+++ b/packages/stores/src/setup.ts
@@ -3,9 +3,32 @@ import type { Pinia } from 'pinia';
 import type { App } from 'vue';
 
 import { createPinia } from 'pinia';
+import SecureLS from 'secure-ls';
 
 let pinia: Pinia;
 
+type SecureLSStorage = {
+  get(key: string): any;
+  set(key: string, value: unknown): void;
+};
+
+type SecureLSCtor = new (config?: {
+  encodingType?: string;
+  encryptionSecret?: string;
+  isCompression?: boolean;
+  metaKey?: string;
+}) => SecureLSStorage;
+
+const secureLSModule = SecureLS as unknown as {
+  default?: SecureLSCtor;
+  SecureLS?: SecureLSCtor;
+};
+
+const SecureLSConstructor =
+  secureLSModule.default ??
+  secureLSModule.SecureLS ??
+  (SecureLS as unknown as SecureLSCtor);
+
 export interface InitStoreOptions {
   /**
    * @zh_CN 应用名,由于 @vben/stores 是公用的，后续可能有多个app，为了防止多个app缓存冲突，可在这里配置应用名,应用名将被用于持久化的前缀
@@ -20,11 +43,26 @@ export async function initStores(app: App, options: InitStoreOptions) {
   const { createPersistedState } = await import('pinia-plugin-persistedstate');
   pinia = createPinia();
   const { namespace } = options;
+  const ls = new SecureLSConstructor({
+    encodingType: 'aes',
+    encryptionSecret: import.meta.env.VITE_APP_STORE_SECURE_KEY,
+    isCompression: true,
+    metaKey: `${namespace}-secure-meta`,
+  });
   pinia.use(
     createPersistedState({
       // key $appName-$store.id
       key: (storeKey) => `${namespace}-${storeKey}`,
-      storage: localStorage,
+      storage: import.meta.env.DEV
+        ? localStorage
+        : {
+            getItem(key) {
+              return ls.get(key);
+            },
+            setItem(key, value) {
+              ls.set(key, value);
+            },
+          },
     }),
   );
   app.use(pinia);
diff --git a/packages/styles/package.json b/packages/styles/package.json
index 7bb54019..2a3a1e14 100644
--- a/packages/styles/package.json
+++ b/packages/styles/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vben/styles",
-  "version": "5.5.1",
+  "version": "5.7.0",
   "homepage": "https://github.com/vbenjs/vue-vben-admin",
   "bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
   "repository": {
@@ -16,12 +16,23 @@
       "default": "./src/index.ts"
     },
     "./antd": {
+      "types": "./src/style-exports.d.ts",
       "default": "./src/antd/index.css"
     },
+    "./antdv-next": {
+      "types": "./src/style-exports.d.ts",
+      "default": "./src/antdv-next/index.css"
+    },
     "./ele": {
+      "types": "./src/style-exports.d.ts",
       "default": "./src/ele/index.css"
     },
+    "./naive": {
+      "types": "./src/style-exports.d.ts",
+      "default": "./src/naive/index.css"
+    },
     "./global": {
+      "types": "./src/style-exports.d.ts",
       "default": "./src/global/index.scss"
     }
   },
diff --git a/packages/styles/src/antd/index.css b/packages/styles/src/antd/index.css
index 33766b6f..03b9e9ef 100644
--- a/packages/styles/src/antd/index.css
+++ b/packages/styles/src/antd/index.css
@@ -11,17 +11,39 @@
   .anticon {
     display: inline-flex;
   }
+
+  /* * 修复按钮添加图标时的位置问题 */
+  > svg {
+    display: inline-block;
+  }
+
+  > svg + span {
+    margin-inline-start: 6px;
+  }
+}
+
+.ant-tag {
+  > svg {
+    display: inline-block;
+  }
+
+  > svg + span {
+    margin-inline-start: 4px;
+  }
 }
 
 .ant-message-notice-content,
 .ant-notification-notice {
-  @apply dark:border-border/60 dark:border;
+  &:is(.dark *) {
+    border-color: hsl(var(--border) / 60%);
+    border-width: 1px;
+  }
 }
 
 .form-valid-error {
   /** select 选择器的样式 */
 
-  .ant-select .ant-select-selector {
+  .ant-select:not(.valid-success) .ant-select-selector:not(.valid-success) {
     border-color: hsl(var(--destructive)) !important;
   }
 
@@ -39,6 +61,10 @@
     border-color: hsl(var(--destructive));
     box-shadow: 0 0 0 2px rgb(255 38 5 / 6%);
   }
+
+  .ant-input:not(.valid-success) {
+    border-color: hsl(var(--destructive)) !important;
+  }
 }
 
 /** 区间选择器下面来回切换时的样式 */
diff --git a/packages/styles/src/antdv-next/index.css b/packages/styles/src/antdv-next/index.css
new file mode 100644
index 00000000..766f025e
--- /dev/null
+++ b/packages/styles/src/antdv-next/index.css
@@ -0,0 +1,85 @@
+/* antdv-next 组件库的一些样式重置 */
+
+.ant-app {
+  width: 100%;
+  height: 100%;
+  overscroll-behavior: none;
+  color: inherit;
+}
+
+.ant-btn {
+  .anticon {
+    display: inline-flex;
+  }
+
+  /* * 修复按钮添加图标时的位置问题 */
+  > .ant-btn-icon {
+    svg {
+      display: inline-block;
+    }
+
+    svg + span {
+      margin-inline-start: 6px;
+    }
+  }
+}
+
+.ant-tag {
+  > svg {
+    display: inline-block;
+  }
+
+  > svg + span {
+    margin-inline-start: 4px;
+  }
+}
+
+.ant-message-notice-content,
+.ant-notification-notice {
+  &:is(.dark *) {
+    border-color: hsl(var(--border) / 60%);
+    border-width: 1px;
+  }
+}
+
+.form-valid-error {
+  /** select 选择器的样式 */
+
+  .ant-select:not(.valid-success) {
+    border-color: hsl(var(--destructive)) !important;
+  }
+
+  .ant-select-focused {
+    box-shadow: 0 0 0 2px rgb(255 38 5 / 6%) !important;
+  }
+
+  /** 数字输入框样式 */
+  .ant-input-number-focused {
+    box-shadow: 0 0 0 2px rgb(255 38 5 / 6%);
+  }
+
+  /** 密码输入框样式 */
+  .ant-input-affix-wrapper:hover {
+    border-color: hsl(var(--destructive));
+    box-shadow: 0 0 0 2px rgb(255 38 5 / 6%);
+  }
+
+  .ant-input:not(.valid-success) {
+    border-color: hsl(var(--destructive)) !important;
+  }
+}
+
+/** 区间选择器下面来回切换时的样式 */
+.ant-app .form-valid-error .ant-picker-active-bar {
+  background-color: hsl(var(--destructive));
+}
+
+/** 时间选择器的样式 */
+.ant-app .form-valid-error .ant-picker-focused {
+  box-shadow: 0 0 0 2px rgb(255 38 5 / 6%);
+}
+
+/** 弹窗内tooltip层级问题 */
+.css-var-root.ant-tooltip-css-var {
+  --ant-tooltip-z-index-popup: 2001;
+}
diff --git a/packages/styles/src/ele/index.css b/packages/styles/src/ele/index.css
index b59ee2ad..4ee8f7b1 100644
--- a/packages/styles/src/ele/index.css
+++ b/packages/styles/src/ele/index.css
@@ -38,3 +38,7 @@
     border: 1px solid var(--el-color-danger);
   }
 }
+
+html .el-loading-mask {
+  z-index: 1000;
+}
diff --git a/packages/styles/src/naive/index.css b/packages/styles/src/naive/index.css
new file mode 100644
index 00000000..f97d55b0
--- /dev/null
+++ b/packages/styles/src/naive/index.css
@@ -0,0 +1,26 @@
+.form-valid-error {
+  .n-base-selection__state-border,
+  .n-input__state-border,
+  .n-radio-group__splitor {
+    border: var(--n-border-error);
+  }
+
+  .n-radio-group .n-radio-button,
+  .n-radio-group .n-radio-group__splitor {
+    --n-button-border-color: rgb(255 56 96);
+  }
+
+  .n-radio__dot {
+    --n-box-shadow: inset 0 0 0 1px rgb(255 56 96);
+  }
+
+  .n-checkbox-box__border {
+    --n-border: 1px solid rgb(255 56 96);
+  }
+
+  .n-input .n-input__input-el,
+  .n-input .n-input__textarea-el,
+  .n-input-number .n-input__input-el {
+    font-family: Arial, Roboto, 'Helvetica Neue', sans-serif;
+  }
+}
diff --git a/packages/styles/src/style-exports.d.ts b/packages/styles/src/style-exports.d.ts
new file mode 100644
index 00000000..a9f6f080
--- /dev/null
+++ b/packages/styles/src/style-exports.d.ts
@@ -0,0 +1,3 @@
+declare const stylesheet: string;
+
+export default stylesheet;
diff --git a/packages/types/global.d.ts b/packages/types/global.d.ts
index 0c8f0198..77bc923c 100644
--- a/packages/types/global.d.ts
+++ b/packages/types/global.d.ts
@@ -3,16 +3,26 @@ import type { RouteMeta as IRouteMeta } from '@vben-core/typings';
 import 'vue-router';
 
 declare module 'vue-router' {
-  // eslint-disable-next-line @typescript-eslint/no-empty-object-type
+  // oxlint-disable-next-line typescript/no-empty-object-type
   interface RouteMeta extends IRouteMeta {}
 }
 
 export interface VbenAdminProAppConfigRaw {
   VITE_GLOB_API_URL: string;
+  VITE_GLOB_AUTH_DINGDING_CLIENT_ID: string;
+  VITE_GLOB_AUTH_DINGDING_CORP_ID: string;
+}
+
+interface AuthConfig {
+  dingding?: {
+    clientId: string;
+    corpId: string;
+  };
 }
 
 export interface ApplicationConfig {
   apiURL: string;
+  auth: AuthConfig;
 }
 
 declare global {
diff --git a/packages/types/package.json b/packages/types/package.json
index 8b38a928..e489048a 100644
--- a/packages/types/package.json
+++ b/packages/types/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vben/types",
-  "version": "5.5.1",
+  "version": "5.7.0",
   "homepage": "https://github.com/vbenjs/vue-vben-admin",
   "bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
   "repository": {
diff --git a/packages/utils/package.json b/packages/utils/package.json
index b4eafd8a..fddacfed 100644
--- a/packages/utils/package.json
+++ b/packages/utils/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vben/utils",
-  "version": "5.5.1",
+  "version": "5.7.0",
   "homepage": "https://github.com/vbenjs/vue-vben-admin",
   "bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
   "repository": {
diff --git a/packages/utils/src/helpers/__tests__/generate-menus.test.ts b/packages/utils/src/helpers/__tests__/generate-menus.test.ts
index 9d98b5a1..c02cc9db 100644
--- a/packages/utils/src/helpers/__tests__/generate-menus.test.ts
+++ b/packages/utils/src/helpers/__tests__/generate-menus.test.ts
@@ -69,7 +69,7 @@ describe('generateMenus', () => {
       },
     ];
 
-    const menus = await generateMenus(mockRoutes, mockRouter as any);
+    const menus = generateMenus(mockRoutes, mockRouter as any);
     expect(menus).toEqual(expectedMenus);
   });
 
@@ -82,7 +82,7 @@ describe('generateMenus', () => {
       },
     ] as RouteRecordRaw[];
 
-    const menus = await generateMenus(mockRoutesWithMeta, mockRouter as any);
+    const menus = generateMenus(mockRoutesWithMeta, mockRouter as any);
     expect(menus).toEqual([
       {
         badge: undefined,
@@ -109,7 +109,7 @@ describe('generateMenus', () => {
       },
     ] as RouteRecordRaw[];
 
-    const menus = await generateMenus(mockRoutesWithParams, mockRouter as any);
+    const menus = generateMenus(mockRoutesWithParams, mockRouter as any);
     expect(menus).toEqual([
       {
         badge: undefined,
@@ -141,10 +141,7 @@ describe('generateMenus', () => {
       },
     ] as RouteRecordRaw[];
 
-    const menus = await generateMenus(
-      mockRoutesWithRedirect,
-      mockRouter as any,
-    );
+    const menus = generateMenus(mockRoutesWithRedirect, mockRouter as any);
     expect(menus).toEqual([
       // Assuming your generateMenus function excludes redirect routes from the menu
       {
@@ -195,7 +192,7 @@ describe('generateMenus', () => {
   });
 
   it('should generate menu list with correct order', async () => {
-    const menus = await generateMenus(routes, router);
+    const menus = generateMenus(routes, router);
     const expectedMenus = [
       {
         badge: undefined,
@@ -230,7 +227,7 @@ describe('generateMenus', () => {
 
   it('should handle empty routes', async () => {
     const emptyRoutes: any[] = [];
-    const menus = await generateMenus(emptyRoutes, router);
+    const menus = generateMenus(emptyRoutes, router);
     expect(menus).toEqual([]);
   });
 });
diff --git a/packages/utils/src/helpers/find-menu-by-path.ts b/packages/utils/src/helpers/find-menu-by-path.ts
index 1c69e622..747cc7f0 100644
--- a/packages/utils/src/helpers/find-menu-by-path.ts
+++ b/packages/utils/src/helpers/find-menu-by-path.ts
@@ -21,9 +21,9 @@ function findMenuByPath(
  * @param menus
  * @param path
  */
-function findRootMenuByPath(menus: MenuRecordRaw[], path?: string) {
+function findRootMenuByPath(menus: MenuRecordRaw[], path?: string, level = 0) {
   const findMenu = findMenuByPath(menus, path);
-  const rootMenuPath = findMenu?.parents?.[0];
+  const rootMenuPath = findMenu?.parents?.[level];
   const rootMenu = rootMenuPath
     ? menus.find((item) => item.path === rootMenuPath)
     : undefined;
diff --git a/packages/utils/src/helpers/generate-menus.ts b/packages/utils/src/helpers/generate-menus.ts
index 48c30fd6..9209048c 100644
--- a/packages/utils/src/helpers/generate-menus.ts
+++ b/packages/utils/src/helpers/generate-menus.ts
@@ -1,29 +1,38 @@
-import type { ExRouteRecordRaw, MenuRecordRaw } from '@vben-core/typings';
 import type { Router, RouteRecordRaw } from 'vue-router';
 
-import { filterTree, mapTree } from '@vben-core/shared/utils';
+import type {
+  ExRouteRecordRaw,
+  MenuRecordRaw,
+  RouteMeta,
+} from '@vben-core/typings';
+
+import { filterTree, mapTree, sortTree } from '@vben-core/shared/utils';
 
 /**
  * 根据 routes 生成菜单列表
- * @param routes
+ * @param routes - 路由配置列表
+ * @param router - Vue Router 实例
+ * @returns 生成的菜单列表
  */
-async function generateMenus(
+function generateMenus(
   routes: RouteRecordRaw[],
   router: Router,
-): Promise<MenuRecordRaw[]> {
+): MenuRecordRaw[] {
   // 将路由列表转换为一个以 name 为键的对象映射
-  // 获取所有router最终的path及name
   const finalRoutesMap: { [key: string]: string } = Object.fromEntries(
     router.getRoutes().map(({ name, path }) => [name, path]),
   );
 
   let menus = mapTree<ExRouteRecordRaw, MenuRecordRaw>(routes, (route) => {
-    // 路由表的路径写法有多种，这里从router获取到最终的path并赋值
-    const path = finalRoutesMap[route.name as string] ?? route.path;
+    // 获取最终的路由路径
+    const path = finalRoutesMap[route.name as string] ?? route.path ?? '';
 
-    // 转换为菜单结构
-    // const path = matchRoute?.path ?? route.path;
-    const { meta, name: routeName, redirect, children } = route;
+    const {
+      meta = {} as RouteMeta,
+      name: routeName,
+      redirect,
+      children = [],
+    } = route;
     const {
       activeIcon,
       badge,
@@ -34,24 +43,28 @@ async function generateMenus(
       link,
       order,
       title = '',
-    } = meta || {};
+      query,
+    } = meta;
 
+    // 确保菜单名称不为空
     const name = (title || routeName || '') as string;
 
-    // 隐藏子菜单
+    // 处理子菜单
     const resultChildren = hideChildrenInMenu
       ? []
-      : (children as MenuRecordRaw[]);
+      : ((children as MenuRecordRaw[]) ?? []);
 
-    // 将菜单的所有父级和父级菜单记录到菜单项内
-    if (resultChildren && resultChildren.length > 0) {
+    // 设置子菜单的父子关系
+    if (resultChildren.length > 0) {
       resultChildren.forEach((child) => {
-        child.parents = [...(route.parents || []), path];
+        child.parents = [...(route.parents ?? []), path];
         child.parent = path;
       });
     }
-    // 隐藏子菜单
+
+    // 确定最终路径
     const resultPath = hideChildrenInMenu ? redirect || path : link || path;
+
     return {
       activeIcon,
       badge,
@@ -59,22 +72,21 @@ async function generateMenus(
       badgeVariants,
       icon,
       name,
+      query,
       order,
       parent: route.parent,
       parents: route.parents,
-      path: resultPath as string,
-      show: !route?.meta?.hideInMenu,
-      children: resultChildren || [],
+      path: resultPath,
+      show: !meta.hideInMenu,
+      children: resultChildren,
     };
   });
 
-  // 对菜单进行排序
-  menus = menus.sort((a, b) => (a.order || 999) - (b.order || 999));
+  // 对菜单进行排序，避免order=0时被替换成999的问题
+  menus = sortTree(menus, (a, b) => (a?.order ?? 999) - (b?.order ?? 999));
 
-  const finalMenus = filterTree(menus, (menu) => {
-    return !!menu.show;
-  });
-  return finalMenus;
+  // 过滤掉隐藏的菜单项
+  return filterTree(menus, (menu) => !!menu.show);
 }
 
 export { generateMenus };
diff --git a/packages/utils/src/helpers/generate-routes-backend.ts b/packages/utils/src/helpers/generate-routes-backend.ts
index 4f179080..3f8693ce 100644
--- a/packages/utils/src/helpers/generate-routes-backend.ts
+++ b/packages/utils/src/helpers/generate-routes-backend.ts
@@ -1,19 +1,33 @@
+import type { RouteRecordRaw } from 'vue-router';
+
 import type {
   ComponentRecordType,
   GenerateMenuAndRoutesOptions,
   RouteRecordStringComponent,
 } from '@vben-core/typings';
-import type { RouteRecordRaw } from 'vue-router';
 
 import { mapTree } from '@vben-core/shared/utils';
 
+/**
+ * 判断路由是否在菜单中显示但访问时展示 403（让用户知悉功能并申请权限）
+ */
+function menuHasVisibleWithForbidden(route: RouteRecordRaw): boolean {
+  return !!route.meta?.menuVisibleWithForbidden;
+}
+
 /**
  * 动态生成路由 - 后端方式
+ * 对 meta.menuVisibleWithForbidden 为 true 的项直接替换为 403 组件，让用户知悉功能并申请权限。
  */
 async function generateRoutesByBackend(
   options: GenerateMenuAndRoutesOptions,
 ): Promise<RouteRecordRaw[]> {
-  const { fetchMenuListAsync, layoutMap = {}, pageMap = {} } = options;
+  const {
+    fetchMenuListAsync,
+    layoutMap = {},
+    pageMap = {},
+    forbiddenComponent,
+  } = options;
 
   try {
     const menuRoutes = await fetchMenuListAsync?.();
@@ -27,12 +41,21 @@ async function generateRoutesByBackend(
       normalizePageMap[normalizeViewPath(key)] = value;
     }
 
-    const routes = convertRoutes(menuRoutes, layoutMap, normalizePageMap);
+    let routes = convertRoutes(menuRoutes, layoutMap, normalizePageMap);
+
+    if (forbiddenComponent) {
+      routes = mapTree(routes, (route) => {
+        if (menuHasVisibleWithForbidden(route)) {
+          route.component = forbiddenComponent;
+        }
+        return route;
+      });
+    }
 
     return routes;
   } catch (error) {
     console.error(error);
-    return [];
+    throw error;
   }
 }
 
@@ -55,12 +78,15 @@ function convertRoutes(
       // 页面组件转换
     } else if (component) {
       const normalizePath = normalizeViewPath(component);
-      route.component =
-        pageMap[
-          normalizePath.endsWith('.vue')
-            ? normalizePath
-            : `${normalizePath}.vue`
-        ];
+      const pageKey = normalizePath.endsWith('.vue')
+        ? normalizePath
+        : `${normalizePath}.vue`;
+      if (pageMap[pageKey]) {
+        route.component = pageMap[pageKey];
+      } else {
+        console.error(`route component is invalid: ${pageKey}`, route);
+        route.component = pageMap['/_core/fallback/not-found.vue'];
+      }
     }
 
     return route;
diff --git a/packages/utils/src/helpers/get-popup-container.ts b/packages/utils/src/helpers/get-popup-container.ts
index ca5a72dd..6aa84d6d 100644
--- a/packages/utils/src/helpers/get-popup-container.ts
+++ b/packages/utils/src/helpers/get-popup-container.ts
@@ -1,6 +1,10 @@
 /**
- * Returns the parent node of the given element or the document body if the element is not provided.it
+ * If the node is holding inside a form, return the form element,
+ * otherwise return the parent node of the given element or
+ * the document body if the element is not provided.
  */
 export function getPopupContainer(node?: HTMLElement): HTMLElement {
-  return (node?.parentNode as HTMLElement) ?? document.body;
+  return (
+    node?.closest('form') ?? (node?.parentNode as HTMLElement) ?? document.body
+  );
 }
diff --git a/playground/.env b/playground/.env
index 32957303..94ff4faf 100644
--- a/playground/.env
+++ b/playground/.env
@@ -3,3 +3,6 @@ VITE_APP_TITLE=Vben Admin
 
 # 应用命名空间，用于缓存、store等功能的前缀，确保隔离
 VITE_APP_NAMESPACE=vben-web-play
+
+# 对store进行加密的密钥，在将store持久化到localStorage时会使用该密钥进行加密
+VITE_APP_STORE_SECURE_KEY=please-replace-me-with-your-own-key
diff --git a/playground/.env.development b/playground/.env.development
index dcf361e7..0b1dc057 100644
--- a/playground/.env.development
+++ b/playground/.env.development
@@ -14,3 +14,7 @@ VITE_DEVTOOLS=false
 
 # 是否注入全局loading
 VITE_INJECT_APP_LOADING=true
+
+# 钉钉登录配置
+VITE_GLOB_AUTH_DINGDING_CLIENT_ID=应用的clientId
+VITE_GLOB_AUTH_DINGDING_CORP_ID=应用的corpId
diff --git a/playground/__tests__/unit/date-range-codec.test.ts b/playground/__tests__/unit/date-range-codec.test.ts
new file mode 100644
index 00000000..690008e9
--- /dev/null
+++ b/playground/__tests__/unit/date-range-codec.test.ts
@@ -0,0 +1,78 @@
+import type { Dayjs } from 'dayjs';
+
+import dayjs from 'dayjs';
+import { describe, expect, it } from 'vitest';
+
+import { createDateRangeCodec } from '../../src/utils/date-range-codec';
+
+interface SearchFormValues extends Record<string, unknown> {
+  createdAt?: [Dayjs, Dayjs];
+  keyword?: string;
+}
+
+const codec = createDateRangeCodec<SearchFormValues>()({
+  endField: 'finishedAt',
+  rangeField: 'createdAt',
+  startField: 'startedAt',
+});
+
+describe('date range codec', () => {
+  it('only accepts optional date range fields', () => {
+    interface RangeFieldCandidates extends Record<string, unknown> {
+      optionalRange?: [Dayjs, Dayjs];
+      optionalText?: string;
+      requiredRange: [Dayjs, Dayjs];
+    }
+
+    const createCodec = createDateRangeCodec<RangeFieldCandidates>();
+    const optionalRangeCodec = createCodec({
+      endField: 'end',
+      rangeField: 'optionalRange',
+      startField: 'start',
+    });
+    expect(optionalRangeCodec).toEqual({
+      decode: expect.any(Function),
+      encode: expect.any(Function),
+    });
+    createCodec({
+      endField: 'end',
+      // @ts-expect-error A required range cannot be omitted by decode.
+      rangeField: 'requiredRange',
+      startField: 'start',
+    });
+    createCodec({
+      endField: 'end',
+      // @ts-expect-error The range field must contain a DateRange.
+      rangeField: 'optionalText',
+      startField: 'start',
+    });
+  });
+
+  it('encodes and decodes configurable date range fields', () => {
+    const submitValues = codec.encode({
+      createdAt: [dayjs('2026-07-01'), dayjs('2026-07-23')],
+      keyword: 'admin',
+    });
+
+    expect(submitValues).toEqual({
+      finishedAt: '2026-07-23',
+      keyword: 'admin',
+      startedAt: '2026-07-01',
+    });
+    const formValues = codec.decode(submitValues);
+    expect(formValues.keyword).toBe('admin');
+    expect(
+      formValues.createdAt?.map((value) => value.format('YYYY-MM-DD')),
+    ).toEqual(['2026-07-01', '2026-07-23']);
+  });
+
+  it('does not reconstruct a range with a missing bound', () => {
+    expect(
+      codec.decode({
+        finishedAt: undefined,
+        keyword: 'admin',
+        startedAt: '2026-07-01',
+      }),
+    ).toEqual({ keyword: 'admin' });
+  });
+});
diff --git a/playground/index.html b/playground/index.html
index ca532699..727cb303 100644
--- a/playground/index.html
+++ b/playground/index.html
@@ -12,7 +12,7 @@
       content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=0"
     />
     <!-- 由 vite 注入 VITE_APP_TITLE 变量，在 .env 文件内配置 -->
-    <title><%= VITE_APP_TITLE %></title>
+    <title>%VITE_APP_TITLE%</title>
     <link rel="icon" href="/favicon.ico" />
     <script>
       // 生产环境下注入百度统计
diff --git a/playground/package.json b/playground/package.json
index 720622e0..fe113e9d 100644
--- a/playground/package.json
+++ b/playground/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vben/playground",
-  "version": "5.5.1",
+  "version": "5.7.0",
   "homepage": "https://vben.pro",
   "bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
   "repository": {
@@ -30,6 +30,7 @@
   },
   "dependencies": {
     "@tanstack/vue-query": "catalog:",
+    "@vben-core/design": "workspace:*",
     "@vben-core/menu-ui": "workspace:*",
     "@vben/access": "workspace:*",
     "@vben/common-ui": "workspace:*",
@@ -46,10 +47,15 @@
     "@vben/types": "workspace:*",
     "@vben/utils": "workspace:*",
     "@vueuse/core": "catalog:",
-    "ant-design-vue": "catalog:",
+    "antdv-next": "catalog:",
     "dayjs": "catalog:",
+    "json-bigint": "catalog:",
     "pinia": "catalog:",
     "vue": "catalog:",
     "vue-router": "catalog:"
+  },
+  "devDependencies": {
+    "@playwright/test": "catalog:",
+    "@types/json-bigint": "catalog:"
   }
 }
diff --git a/playground/postcss.config.mjs b/playground/postcss.config.mjs
deleted file mode 100644
index 3d807045..00000000
--- a/playground/postcss.config.mjs
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from '@vben/tailwind-config/postcss';
diff --git a/playground/src/adapter/component/index.ts b/playground/src/adapter/component/index.ts
index fa1e61c4..adc3b05d 100644
--- a/playground/src/adapter/component/index.ts
+++ b/playground/src/adapter/component/index.ts
@@ -3,13 +3,184 @@
  * 可用于 vben-form、vben-modal、vben-drawer 等组件使用,
  */
 
-import type { BaseFormComponentType } from '@vben/common-ui';
+/* eslint-disable vue/one-component-per-file */
 
-import type { Component, SetupContext } from 'vue';
-import { h } from 'vue';
+import type {
+  AutoCompleteProps,
+  ButtonProps,
+  CascaderProps,
+  CheckboxGroupProps,
+  CheckboxProps,
+  DatePickerProps,
+  DividerProps,
+  InputNumberProps,
+  InputProps,
+  MentionsProps,
+  RadioGroupProps,
+  RadioProps,
+  RangePickerProps,
+  RateProps,
+  SelectProps,
+  SpaceProps,
+  SwitchProps,
+  TextAreaProps,
+  TimePickerProps,
+  TreeSelectProps,
+  UploadChangeParam,
+  UploadFile,
+  UploadProps,
+} from 'antdv-next';
 
-import { ApiComponent, globalShareState, IconPicker } from '@vben/common-ui';
+import type { Component, Ref } from 'vue';
+
+import type {
+  ApiComponentSharedProps,
+  BaseFormComponentType,
+  CollapsibleParamsProps,
+  IconPickerProps,
+} from '@vben/common-ui';
+import type { Sortable } from '@vben/hooks';
+import type { TipTapProps } from '@vben/plugins/tiptap';
+import type { Recordable } from '@vben/types';
+
+import {
+  computed,
+  defineAsyncComponent,
+  defineComponent,
+  h,
+  nextTick,
+  onMounted,
+  onUnmounted,
+  ref,
+  render,
+  unref,
+  watch,
+} from 'vue';
+
+import {
+  ApiComponent,
+  globalShareState,
+  IconPicker,
+  VbenCollapsibleParams,
+  VCropper,
+} from '@vben/common-ui';
+import { useSortable } from '@vben/hooks';
+import { IconifyIcon } from '@vben/icons';
 import { $t } from '@vben/locales';
+import { VbenTiptap } from '@vben/plugins/tiptap';
+import { isEmpty } from '@vben/utils';
+
+import { message, Modal, notification } from 'antdv-next';
+
+import { upload_file } from '#/api/examples/upload';
+type AdapterUploadProps = UploadProps & {
+  aspectRatio?: string;
+  crop?: boolean;
+  draggable?: boolean;
+  handleChange?: (event: UploadChangeParam) => void;
+  maxSize?: number;
+  onDragSort?: (oldIndex: number, newIndex: number) => void;
+  onHandleChange?: (event: UploadChangeParam) => void;
+};
+
+const AutoComplete = defineAsyncComponent(
+  () => import('antdv-next/dist/auto-complete/index'),
+);
+const Button = defineAsyncComponent(
+  () => import('antdv-next/dist/button/index'),
+);
+const Checkbox = defineAsyncComponent(
+  () => import('antdv-next/dist/checkbox/index'),
+);
+const CheckboxGroup = defineAsyncComponent(() =>
+  import('antdv-next/dist/checkbox/index').then((res) => res.CheckboxGroup),
+);
+const DatePicker = defineAsyncComponent(
+  () => import('antdv-next/dist/date-picker/index'),
+);
+const Divider = defineAsyncComponent(
+  () => import('antdv-next/dist/divider/index'),
+);
+const Input = defineAsyncComponent(() => import('antdv-next/dist/input/index'));
+const InputNumber = defineAsyncComponent(
+  () => import('antdv-next/dist/input-number/index'),
+);
+const InputPassword = defineAsyncComponent(() =>
+  import('antdv-next/dist/input/index').then((res) => res.InputPassword),
+);
+const Mentions = defineAsyncComponent(
+  () => import('antdv-next/dist/mentions/index'),
+);
+const Radio = defineAsyncComponent(() => import('antdv-next/dist/radio/index'));
+const RadioGroup = defineAsyncComponent(() =>
+  import('antdv-next/dist/radio/index').then((res) => res.RadioGroup),
+);
+const RangePicker = defineAsyncComponent(() =>
+  import('antdv-next/dist/date-picker/index').then(
+    (res) => res.DateRangePicker,
+  ),
+);
+const Rate = defineAsyncComponent(() => import('antdv-next/dist/rate/index'));
+const Select = defineAsyncComponent(
+  () => import('antdv-next/dist/select/index'),
+);
+const Space = defineAsyncComponent(() => import('antdv-next/dist/space/index'));
+const Switch = defineAsyncComponent(
+  () => import('antdv-next/dist/switch/index'),
+);
+const Textarea = defineAsyncComponent(
+  () => import('antdv-next/dist/input/TextArea'),
+);
+const TimePicker = defineAsyncComponent(
+  () => import('antdv-next/dist/time-picker/index'),
+);
+const TreeSelect = defineAsyncComponent(
+  () => import('antdv-next/dist/tree-select/index'),
+);
+const Cascader = defineAsyncComponent(
+  () => import('antdv-next/dist/cascader/index'),
+);
+const Upload = defineAsyncComponent(
+  () => import('antdv-next/dist/upload/index'),
+);
+const Image = defineAsyncComponent(() => import('antdv-next/dist/image/index'));
+const PreviewGroup = defineAsyncComponent(() =>
+  import('antdv-next/dist/image/index').then((res) => res.ImagePreviewGroup),
+);
+
+const withDefaultPlaceholder = (
+  component: Component,
+  type: 'input' | 'select',
+  componentProps: Recordable<any> = {},
+) => {
+  return defineComponent({
+    name: component.name,
+    inheritAttrs: false,
+    setup: (props: any, { attrs, expose, slots }) => {
+      const placeholder =
+        props?.placeholder ||
+        attrs?.placeholder ||
+        $t(`ui.placeholder.${type}`);
+      // 透传组件暴露的方法
+      const innerRef = ref();
+      expose(
+        new Proxy(
+          {},
+          {
+            get: (_target, key) => innerRef.value?.[key],
+            has: (_target, key) => key in (innerRef.value || {}),
+          },
+        ),
+      );
+      return () =>
+        h(
+          component,
+          { ...componentProps, placeholder, ...props, ...attrs, ref: innerRef },
+          slots,
+        );
+    },
+  });
+};
 
 import {
   AutoComplete,
@@ -46,15 +217,449 @@ const withDefaultPlaceholder = <T extends Component>(
     return h(component, { ...props, ...attrs, placeholder }, slots);
   };
 };
+const IMAGE_EXTENSIONS = new Set([
+  'bmp',
+  'gif',
+  'jpeg',
+  'jpg',
+  'png',
+  'svg',
+  'webp',
+]);
+
+/**
+ * 检查是否为图片文件
+ */
+function isImageFile(file: UploadFile): boolean {
+  if (file.url) {
+    try {
+      const pathname = new URL(file.url, 'http://localhost').pathname;
+      const ext = pathname.split('.').pop()?.toLowerCase();
+      return ext ? IMAGE_EXTENSIONS.has(ext) : false;
+    } catch {
+      const ext = file.url?.split('.').pop()?.toLowerCase();
+      return ext ? IMAGE_EXTENSIONS.has(ext) : false;
+    }
+  }
+  if (!file.type) {
+    const ext = file.name?.split('.').pop()?.toLowerCase();
+    return ext ? IMAGE_EXTENSIONS.has(ext) : false;
+  }
+  return file.type.startsWith('image/');
+}
+
+/**
+ * 创建默认的上传按钮插槽
+ */
+function createDefaultUploadSlots(listType: string, placeholder: string) {
+  if (listType === 'picture-card') {
+    return { default: () => placeholder };
+  }
+  return {
+    default: () =>
+      h(
+        Button,
+        {
+          icon: h(IconifyIcon, {
+            icon: 'ant-design:upload-outlined',
+            class: 'mb-1 size-4',
+          }),
+        },
+        () => placeholder,
+      ),
+  };
+}
+
+/**
+ * 获取文件的 Base64
+ */
+function getBase64(file: File): Promise<string> {
+  return new Promise((resolve, reject) => {
+    const reader = new FileReader();
+    reader.readAsDataURL(file);
+    reader.addEventListener('load', () => resolve(reader.result as string));
+    reader.addEventListener('error', reject);
+  });
+}
+
+/**
+ * 预览图片
+ */
+async function previewImage(
+  file: UploadFile,
+  open: Ref<boolean>,
+  fileList: Ref<UploadProps['fileList']>,
+) {
+  // 非图片文件直接打开链接
+  if (!isImageFile(file)) {
+    const url = file.url || file.preview;
+    if (url) {
+      window.open(url, '_blank');
+    } else if (file.preview) {
+      window.open(file.preview, '_blank');
+    } else {
+      message.error($t('ui.formRules.previewWarning'));
+    }
+    return;
+  }
+
+  const [ImageComponent, PreviewGroupComponent] = await Promise.all([
+    Image,
+    PreviewGroup,
+  ]);
+
+  // 过滤图片文件并生成预览
+  const imageFiles = (unref(fileList) || []).filter((f) => isImageFile(f));
+
+  for (const imgFile of imageFiles) {
+    if (!imgFile.url && !imgFile.preview && imgFile.originFileObj) {
+      imgFile.preview = await getBase64(imgFile.originFileObj);
+    }
+  }
+
+  const container = document.createElement('div');
+  document.body.append(container);
+  let isUnmounted = false;
+
+  const currentIndex = imageFiles.findIndex((f) => f.uid === file.uid);
+
+  const PreviewWrapper = {
+    setup() {
+      return () => {
+        if (isUnmounted) return null;
+        return h(
+          PreviewGroupComponent,
+          {
+            classes: { popup: { root: '!z-2000' } },
+            preview: {
+              open: open.value,
+              current: currentIndex,
+              onOpenChange: (value: boolean) => {
+                open.value = value;
+                if (!value) {
+                  setTimeout(() => {
+                    if (!isUnmounted && container) {
+                      isUnmounted = true;
+                      render(null, container);
+                      container.remove();
+                    }
+                  }, 300);
+                }
+              },
+            },
+          },
+          () =>
+            imageFiles.map((imgFile) =>
+              h(ImageComponent, {
+                key: imgFile.uid,
+                src: imgFile.url || imgFile.preview,
+              }),
+            ),
+        );
+      };
+    },
+  };
+
+  render(h(PreviewWrapper), container);
+}
+
+/**
+ * 图片裁剪操作
+ */
+function cropImage(file: File, aspectRatio: string | undefined) {
+  return new Promise<Blob | string | undefined>((resolve, reject) => {
+    const container = document.createElement('div');
+    document.body.append(container);
+
+    let isUnmounted = false;
+    let objectUrl: null | string = null;
+
+    const open = ref<boolean>(true);
+    const cropperRef = ref<InstanceType<typeof VCropper> | null>(null);
+
+    function closeModal() {
+      open.value = false;
+      setTimeout(() => {
+        if (!isUnmounted && container) {
+          if (objectUrl) {
+            URL.revokeObjectURL(objectUrl);
+          }
+          isUnmounted = true;
+          render(null, container);
+          container.remove();
+        }
+      }, 300);
+    }
+
+    const CropperWrapper = {
+      setup() {
+        return () => {
+          if (isUnmounted) return null;
+          if (!objectUrl) {
+            objectUrl = URL.createObjectURL(file);
+          }
+          return h(
+            Modal,
+            {
+              open: open.value,
+              title: h('div', {}, [
+                $t('ui.crop.title'),
+                h(
+                  'span',
+                  {
+                    class: `${aspectRatio ? '' : 'hidden'} ml-2 text-sm text-gray-400 font-normal`,
+                  },
+                  $t('ui.crop.titleTip', [aspectRatio]),
+                ),
+              ]),
+              centered: true,
+              width: 548,
+              zIndex: 9999,
+              keyboard: false,
+              maskClosable: false,
+              closable: false,
+              cancelText: $t('common.cancel'),
+              okText: $t('ui.crop.confirm'),
+              destroyOnHidden: true,
+              onOk: async () => {
+                const cropper = cropperRef.value;
+                if (!cropper) {
+                  reject(new Error('Cropper not found'));
+                  closeModal();
+                  return;
+                }
+                try {
+                  const dataUrl = await cropper.getCropImage();
+                  if (dataUrl) {
+                    resolve(dataUrl);
+                  } else {
+                    reject(new Error($t('ui.crop.errorTip')));
+                  }
+                } catch {
+                  reject(new Error($t('ui.crop.errorTip')));
+                } finally {
+                  closeModal();
+                }
+              },
+              onCancel() {
+                resolve('');
+                closeModal();
+              },
+            },
+            () =>
+              h(VCropper, {
+                ref: (ref: any) => (cropperRef.value = ref),
+                img: objectUrl as string,
+                aspectRatio,
+              }),
+          );
+        };
+      },
+    };
+
+    render(h(CropperWrapper), container);
+  });
+}
+
+/**
+ * 带预览功能的上传组件
+ */
+function withPreviewUpload() {
+  return defineComponent({
+    name: Upload.name,
+    emits: ['update:modelValue'],
+    setup(
+      props: any,
+      { attrs, slots, emit }: { attrs: any; emit: any; slots: any },
+    ) {
+      const previewVisible = ref<boolean>(false);
+      const placeholder = attrs?.placeholder || $t('ui.placeholder.upload');
+      const listType = attrs?.listType || attrs?.['list-type'] || 'text';
+      const fileList = ref<UploadProps['fileList']>(
+        attrs?.fileList || attrs?.['file-list'] || [],
+      );
+
+      const maxSize = computed(() => attrs?.maxSize ?? attrs?.['max-size']);
+      const aspectRatio = computed(
+        () => attrs?.aspectRatio ?? attrs?.['aspect-ratio'],
+      );
+
+      async function handleBeforeUpload(
+        file: UploadFile,
+        originFileList: Array<File>,
+      ) {
+        // 文件大小限制
+        if (maxSize.value && (file.size || 0) / 1024 / 1024 > maxSize.value) {
+          message.error($t('ui.formRules.sizeLimit', [maxSize.value]));
+          file.status = 'removed';
+          return false;
+        }
+
+        // 图片裁剪处理
+        if (
+          attrs.crop &&
+          !attrs.multiple &&
+          originFileList[0] &&
+          isImageFile(file)
+        ) {
+          file.status = 'removed';
+          const blob = await cropImage(originFileList[0], aspectRatio.value);
+          if (!blob) {
+            throw new Error($t('ui.crop.errorTip'));
+          }
+          return blob;
+        }
+
+        return attrs.beforeUpload?.(file) ?? true;
+      }
+
+      function handleChange(event: UploadChangeParam) {
+        try {
+          attrs.handleChange?.(event);
+          attrs.onHandleChange?.(event);
+        } catch (error) {
+          console.error(error);
+        }
+        fileList.value = event.fileList.filter(
+          (file) => file.status !== 'removed',
+        );
+        emit(
+          'update:modelValue',
+          event.fileList?.length ? fileList.value : undefined,
+        );
+      }
+
+      function handlePreview(file: UploadFile) {
+        previewVisible.value = true;
+        return previewImage(file, previewVisible, fileList);
+      }
+
+      function renderUploadButton() {
+        if (attrs.disabled) return null;
+        return isEmpty(slots)
+          ? createDefaultUploadSlots(listType, placeholder)
+          : slots;
+      }
+
+      // 拖拽排序
+      const draggable = computed(
+        () => (attrs.draggable ?? false) && !attrs.disabled,
+      );
+      const uploadId = `upload-${Date.now()}-${Math.random().toString(36).slice(2, 9)}`;
+      const sortableInstance = ref<null | Sortable>(null);
+
+      const styleId = `upload-drag-style-${uploadId}`;
+
+      function injectDragStyle() {
+        if (!document.querySelector(`[id="${styleId}"]`)) {
+          const style = document.createElement('style');
+          style.id = styleId;
+          style.textContent = `
+            [data-upload-id="${uploadId}"] .ant-upload-list-item { cursor: move; }
+            [data-upload-id="${uploadId}"] .ant-upload-list-item:hover { box-shadow: 0 2px 8px rgba(0,0,0,0.15); }
+          `;
+          document.head.append(style);
+        }
+      }
+
+      function removeDragStyle() {
+        document.querySelector(`[id="${styleId}"]`)?.remove();
+      }
+
+      async function initSortable(retryCount = 0) {
+        if (!draggable.value) return;
+
+        injectDragStyle();
+        await nextTick();
+        await new Promise((resolve) => setTimeout(resolve, 100));
+
+        const container = document.querySelector(
+          `[data-upload-id="${uploadId}"] .ant-upload-list`,
+        ) as HTMLElement;
+
+        if (!container) {
+          if (retryCount < 5) {
+            setTimeout(() => initSortable(retryCount + 1), 200);
+          }
+          return;
+        }
+
+        const { initializeSortable } = useSortable(container, {
+          animation: 300,
+          delay: 400,
+          delayOnTouchOnly: true,
+          filter:
+            '.ant-upload-select, .ant-upload-list-item-error, .ant-upload-list-item-uploading',
+          onEnd: (evt) => {
+            const { oldIndex, newIndex } = evt;
+            if (
+              oldIndex === undefined ||
+              newIndex === undefined ||
+              oldIndex === newIndex
+            ) {
+              return;
+            }
+
+            const list = [...(fileList.value || [])];
+            const [movedItem] = list.splice(oldIndex, 1);
+            if (movedItem) {
+              list.splice(newIndex, 0, movedItem);
+              fileList.value = list;
+            }
+
+            attrs.onDragSort?.(oldIndex, newIndex);
+            emit('update:modelValue', fileList.value);
+          },
+        });
+
+        sortableInstance.value = await initializeSortable();
+      }
+
+      // 监听表单值变化
+      watch(
+        () => attrs.modelValue,
+        (res) => {
+          fileList.value = res;
+        },
+      );
+
+      onMounted(initSortable);
+      onUnmounted(() => {
+        sortableInstance.value?.destroy();
+        removeDragStyle();
+      });
+
+      return () =>
+        h(
+          'div',
+          { 'data-upload-id': uploadId, class: 'w-full' },
+          h(
+            Upload,
+            {
+              ...props,
+              ...attrs,
+              fileList: fileList.value,
+              beforeUpload: handleBeforeUpload,
+              onChange: handleChange,
+              onPreview: handlePreview,
+            },
+            renderUploadButton() as any,
+          ),
+        );
+    },
+  });
+}
 
 // 这里需要自行根据业务组件库进行适配，需要用到的组件都需要在这里类型说明
 export type ComponentType =
+  | 'ApiCascader'
   | 'ApiSelect'
   | 'ApiTreeSelect'
   | 'AutoComplete'
   | 'Cascader'
   | 'Checkbox'
   | 'CheckboxGroup'
+  | 'CollapsibleParams'
   | 'DatePicker'
   | 'DefaultButton'
   | 'Divider'
@@ -68,6 +673,7 @@ export type ComponentType =
   | 'RadioGroup'
   | 'RangePicker'
   | 'Rate'
+  | 'RichEditor'
   | 'Select'
   | 'Space'
   | 'Switch'
@@ -77,44 +683,68 @@ export type ComponentType =
   | 'Upload'
   | BaseFormComponentType;
 
+/**
+ * 与 {@link ComponentType} 中注册的组件名一一对应，便于 Schema 上 `component` + `componentProps` 联动提示
+ */
+export interface ComponentPropsMap {
+  ApiCascader: ApiComponentSharedProps & CascaderProps;
+  ApiSelect: ApiComponentSharedProps & SelectProps;
+  ApiTreeSelect: ApiComponentSharedProps & TreeSelectProps;
+  AutoComplete: AutoCompleteProps;
+  Cascader: CascaderProps;
+  Checkbox: CheckboxProps;
+  CheckboxGroup: CheckboxGroupProps;
+  CollapsibleParams: CollapsibleParamsProps;
+  DatePicker: DatePickerProps;
+  DefaultButton: ButtonProps;
+  Divider: DividerProps;
+  IconPicker: IconPickerProps;
+  Input: InputProps;
+  InputNumber: InputNumberProps;
+  InputPassword: InputProps;
+  Mentions: MentionsProps;
+  PrimaryButton: ButtonProps;
+  Radio: RadioProps;
+  RadioGroup: RadioGroupProps;
+  RangePicker: RangePickerProps;
+  Rate: RateProps;
+  RichEditor: TipTapProps;
+  Select: SelectProps;
+  Space: SpaceProps;
+  Switch: SwitchProps;
+  Textarea: TextAreaProps;
+  TimePicker: TimePickerProps;
+  TreeSelect: TreeSelectProps;
+  Upload: AdapterUploadProps;
+}
+
 async function initComponentAdapter() {
   const components: Partial<Record<ComponentType, Component>> = {
     // 如果你的组件体积比较大，可以使用异步加载
     // Button: () =>
     // import('xxx').then((res) => res.Button),
 
-    ApiSelect: (props, { attrs, slots }) => {
-      return h(
-        ApiComponent,
-        {
-          placeholder: $t('ui.placeholder.select'),
-          ...props,
-          ...attrs,
-          component: Select,
-          loadingSlot: 'suffixIcon',
-          modelPropName: 'value',
-          visibleEvent: 'onVisibleChange',
-        },
-        slots,
-      );
-    },
-    ApiTreeSelect: (props, { attrs, slots }) => {
-      return h(
-        ApiComponent,
-        {
-          placeholder: $t('ui.placeholder.select'),
-          ...props,
-          ...attrs,
-          component: TreeSelect,
-          fieldNames: { label: 'label', value: 'value', children: 'children' },
-          loadingSlot: 'suffixIcon',
-          modelPropName: 'value',
-          optionsPropName: 'treeData',
-          visibleEvent: 'onVisibleChange',
-        },
-        slots,
-      );
-    },
+    ApiCascader: withDefaultPlaceholder(ApiComponent, 'select', {
+      component: Cascader,
+      fieldNames: { label: 'label', value: 'value', children: 'children' },
+      loadingSlot: 'suffixIcon',
+      modelPropName: 'value',
+      visibleEvent: 'onOpenChange',
+    }),
+    ApiSelect: withDefaultPlaceholder(ApiComponent, 'select', {
+      component: Select,
+      loadingSlot: 'suffixIcon',
+      modelPropName: 'value',
+      visibleEvent: 'onOpenChange',
+    }),
+    ApiTreeSelect: withDefaultPlaceholder(ApiComponent, 'select', {
+      component: TreeSelect,
+      fieldNames: { label: 'label', value: 'value', children: 'children' },
+      loadingSlot: 'suffixIcon',
+      modelPropName: 'value',
+      optionsPropName: 'treeData',
+      visibleEvent: 'onOpenChange',
+    }),
     AutoComplete,
     Cascader,
     Checkbox,
@@ -125,13 +755,11 @@ async function initComponentAdapter() {
       return h(Button, { ...props, attrs, type: 'default' }, slots);
     },
     Divider,
-    IconPicker: (props, { attrs, slots }) => {
-      return h(
-        IconPicker,
-        { iconSlot: 'addonAfter', inputComponent: Input, ...props, ...attrs },
-        slots,
-      );
-    },
+    IconPicker: withDefaultPlaceholder(IconPicker, 'select', {
+      iconSlot: 'addonAfter',
+      inputComponent: Input,
+      modelValueProp: 'value',
+    }),
     Input: withDefaultPlaceholder(Input, 'input'),
     InputNumber: withDefaultPlaceholder(InputNumber, 'input'),
     InputPassword: withDefaultPlaceholder(InputPassword, 'input'),
@@ -144,13 +772,35 @@ async function initComponentAdapter() {
     RadioGroup,
     RangePicker,
     Rate,
+    RichEditor: withDefaultPlaceholder(VbenTiptap, 'input', {
+      imageUpload: {
+        upload: (file: any, onProgress: any) => {
+          return new Promise((resolve, reject) => {
+            upload_file({
+              file,
+              onProgress({ percent }) {
+                onProgress?.(percent);
+              },
+              onSuccess(response) {
+                // 从响应中提取图片URL
+                resolve(response?.data?.url ?? response?.url ?? '');
+              },
+              onError() {
+                reject(new Error($t('ui.tiptap.upload.uploadFailed')));
+              },
+            });
+          });
+        },
+      },
+    }),
     Select: withDefaultPlaceholder(Select, 'select'),
     Space,
     Switch,
     Textarea: withDefaultPlaceholder(Textarea, 'input'),
     TimePicker,
     TreeSelect: withDefaultPlaceholder(TreeSelect, 'select'),
-    Upload,
+    Upload: withPreviewUpload(),
+    CollapsibleParams: VbenCollapsibleParams,
   };
 
   // 将组件注册到全局共享状态中
@@ -162,7 +812,7 @@ async function initComponentAdapter() {
     copyPreferencesSuccess: (title, content) => {
       notification.success({
         description: content,
-        message: title,
+        title,
         placement: 'bottomRight',
       });
     },
diff --git a/playground/src/adapter/form.ts b/playground/src/adapter/form.ts
index dfe8fed0..fa692c24 100644
--- a/playground/src/adapter/form.ts
+++ b/playground/src/adapter/form.ts
@@ -1,45 +1,67 @@
 import type {
+  VbenFormProps as FormProps,
   VbenFormSchema as FormSchema,
-  VbenFormProps,
+  FormValues,
 } from '@vben/common-ui';
 
-import type { ComponentType } from './component';
+import type { ComponentPropsMap, ComponentType } from './component';
 
 import { setupVbenForm, useVbenForm as useForm, z } from '@vben/common-ui';
 import { $t } from '@vben/locales';
 
-setupVbenForm<ComponentType>({
-  config: {
-    // ant design vue组件库默认都是 v-model:value
-    baseModelPropName: 'value',
-    // 一些组件是 v-model:checked 或者 v-model:fileList
-    modelPropNameMap: {
-      Checkbox: 'checked',
-      Radio: 'checked',
-      Switch: 'checked',
-      Upload: 'fileList',
+async function initSetupVbenForm() {
+  setupVbenForm<ComponentType>({
+    config: {
+      // antdv-next 组件库默认都是 v-model:value
+      baseModelPropName: 'value',
+      // 一些组件是 v-model:checked 或者 v-model:fileList
+      modelPropNameMap: {
+        Checkbox: 'checked',
+        Radio: 'checked',
+        Switch: 'checked',
+        Upload: 'fileList',
+      },
     },
-  },
-  defineRules: {
-    // 输入项目必填国际化适配
-    required: (value, _params, ctx) => {
-      if (value === undefined || value === null || value.length === 0) {
-        return $t('ui.formRules.required', [ctx.label]);
-      }
-      return true;
+    rules: {
+      // 输入项目必填国际化适配
+      required: (value, _params, ctx) => {
+        if (value === undefined || value === null || value.length === 0) {
+          return $t('ui.formRules.required', [ctx.label]);
+        }
+        return true;
+      },
+      // 选择项目必填国际化适配
+      selectRequired: (value, _params, ctx) => {
+        if (value === undefined || value === null) {
+          return $t('ui.formRules.selectRequired', [ctx.label]);
+        }
+        return true;
+      },
     },
-    // 选择项目必填国际化适配
-    selectRequired: (value, _params, ctx) => {
-      if (value === undefined || value === null) {
-        return $t('ui.formRules.selectRequired', [ctx.label]);
-      }
-      return true;
-    },
-  },
-});
+  });
+}
 
-const useVbenForm = useForm<ComponentType>;
+function useVbenForm<
+  TFormValues extends FormValues = FormValues,
+  TSubmitValues extends FormValues = TFormValues,
+>(
+  options: FormProps<
+    ComponentType,
+    ComponentPropsMap,
+    TFormValues,
+    TSubmitValues
+  >,
+) {
+  return useForm<TFormValues, ComponentType, ComponentPropsMap, TSubmitValues>(
+    options,
+  );
+}
 
-export { useVbenForm, z };
-export type VbenFormSchema = FormSchema<ComponentType>;
-export type { VbenFormProps };
+export { initSetupVbenForm, useVbenForm, z };
+
+export type VbenFormSchema<TValues extends FormValues = FormValues> =
+  FormSchema<ComponentType, ComponentPropsMap, TValues>;
+export type VbenFormProps<
+  TFormValues extends FormValues = FormValues,
+  TSubmitValues extends FormValues = TFormValues,
+> = FormProps<ComponentType, ComponentPropsMap, TFormValues, TSubmitValues>;
diff --git a/playground/src/adapter/vxe-table.ts b/playground/src/adapter/vxe-table.ts
index 8f68b15d..391d9e06 100644
--- a/playground/src/adapter/vxe-table.ts
+++ b/playground/src/adapter/vxe-table.ts
@@ -1,10 +1,25 @@
-import { h } from 'vue';
+import type { FormValues, TableActionProps } from '@vben/common-ui';
+import type { VxeTableGridOptions } from '@vben/plugins/vxe-table';
+import type { Recordable } from '@vben/types';
 
-import { setupVbenVxeTable, useVbenVxeGrid } from '@vben/plugins/vxe-table';
+import type { ComponentPropsMap, ComponentType } from './component';
 
-import { Button, Image } from 'ant-design-vue';
+import { defineComponent, h } from 'vue';
 
-import { useVbenForm } from './form';
+import { useAccess } from '@vben/access';
+import { VbenTableAction as VbenTableActionCore } from '@vben/common-ui';
+import { IconifyIcon } from '@vben/icons';
+import { $te } from '@vben/locales';
+import {
+  setupVbenVxeTable,
+  useVbenVxeGrid as useGrid,
+} from '@vben/plugins/vxe-table';
+import { get, isFunction, isString } from '@vben/utils';
+
+import { objectOmit } from '@vueuse/core';
+import { Button, Image, Popconfirm, Switch, Tag } from 'antdv-next';
+
+import { $t } from '#/locales';
 
 setupVbenVxeTable({
   configVxeTable: (vxeUI) => {
@@ -26,7 +41,7 @@ setupVbenVxeTable({
           response: {
             result: 'items',
             total: 'total',
-            list: 'items',
+            list: '',
           },
           showActiveMsg: true,
           showResponseMsg: false,
@@ -34,14 +49,24 @@ setupVbenVxeTable({
         round: true,
         showOverflow: true,
         size: 'small',
-      },
+      } as VxeTableGridOptions,
+    });
+
+    /**
+     * 解决vxeTable在热更新时可能会出错的问题
+     */
+    vxeUI.renderer.forEach((_item, key) => {
+      if (key.startsWith('Cell')) {
+        vxeUI.renderer.delete(key);
+      }
     });
 
     // 表格配置项可以用 cellRender: { name: 'CellImage' },
     vxeUI.renderer.add('CellImage', {
-      renderTableDefault(_renderOpts, params) {
+      renderTableDefault(renderOpts, params) {
+        const { props } = renderOpts;
         const { column, row } = params;
-        return h(Image, { src: row[column.field] });
+        return h(Image, { src: row[column.field], ...props });
       },
     });
 
@@ -57,12 +82,258 @@ setupVbenVxeTable({
       },
     });
 
+    // 单元格渲染： Tag
+    vxeUI.renderer.add('CellTag', {
+      renderTableDefault({ options, props }, { column, row }) {
+        const value = get(row, column.field);
+        const tagOptions = options ?? [
+          { color: 'success', label: $t('common.enabled'), value: 1 },
+          { color: 'error', label: $t('common.disabled'), value: 0 },
+        ];
+        const tagItem = tagOptions.find((item) => item.value === value);
+        return h(
+          Tag,
+          {
+            ...props,
+            ...objectOmit(tagItem ?? {}, ['label']),
+          },
+          { default: () => tagItem?.label ?? value },
+        );
+      },
+    });
+
+    vxeUI.renderer.add('CellSwitch', {
+      renderTableDefault({ attrs, props }, { column, row }) {
+        const loadingKey = `__loading_${column.field}`;
+        const finallyProps = {
+          checkedChildren: $t('common.enabled'),
+          checkedValue: 1,
+          unCheckedChildren: $t('common.disabled'),
+          unCheckedValue: 0,
+          ...props,
+          checked: row[column.field],
+          loading: row[loadingKey] ?? false,
+          'onUpdate:checked': onChange,
+        };
+        async function onChange(newVal: any) {
+          row[loadingKey] = true;
+          try {
+            const result = await attrs?.beforeChange?.(newVal, row);
+            if (result !== false) {
+              row[column.field] = newVal;
+            }
+          } finally {
+            row[loadingKey] = false;
+          }
+        }
+        return h(Switch, finallyProps);
+      },
+    });
+
+    /**
+     * 注册表格的操作按钮渲染器
+     */
+    vxeUI.renderer.add('CellOperation', {
+      renderTableDefault({ attrs, options, props }, { column, row }) {
+        const defaultProps = { size: 'small', type: 'link', ...props };
+        let align: string;
+        switch (column.align) {
+          case 'center': {
+            align = 'center';
+            break;
+          }
+          case 'left': {
+            align = 'start';
+            break;
+          }
+          default: {
+            align = 'end';
+            break;
+          }
+        }
+        const presets: Recordable<Recordable<any>> = {
+          delete: {
+            danger: true,
+            text: $t('common.delete'),
+          },
+          edit: {
+            text: $t('common.edit'),
+          },
+          detail: {
+            text: $t('common.detail'),
+          },
+        };
+        const operations: Array<Recordable<any>> = (
+          options || ['edit', 'detail', 'delete']
+        )
+          .map((opt) => {
+            if (isString(opt)) {
+              return presets[opt]
+                ? { code: opt, ...presets[opt], ...defaultProps }
+                : {
+                    code: opt,
+                    text: $te(`common.${opt}`) ? $t(`common.${opt}`) : opt,
+                    ...defaultProps,
+                  };
+            } else {
+              return { ...defaultProps, ...presets[opt.code], ...opt };
+            }
+          })
+          .map((opt) => {
+            const optBtn: Recordable<any> = {};
+            Object.keys(opt).forEach((key) => {
+              optBtn[key] = isFunction(opt[key]) ? opt[key](row) : opt[key];
+            });
+            return optBtn;
+          })
+          .filter((opt) => opt.show !== false);
+
+        function renderBtn(opt: Recordable<any>, listen = true) {
+          return h(
+            Button,
+            {
+              ...props,
+              ...opt,
+              icon: undefined,
+              onClick: listen
+                ? () =>
+                    attrs?.onClick?.({
+                      code: opt.code,
+                      row,
+                    })
+                : undefined,
+            },
+            {
+              default: () => {
+                const content = [];
+                if (opt.icon) {
+                  content.push(
+                    h(IconifyIcon, { class: 'size-5', icon: opt.icon }),
+                  );
+                }
+                content.push(opt.text);
+                return content;
+              },
+            },
+          );
+        }
+
+        function renderConfirm(opt: Recordable<any>) {
+          let viewportWrapper: HTMLElement | null = null;
+          return h(
+            Popconfirm,
+            {
+              /**
+               * 当popconfirm用在固定列中时，将固定列作为弹窗的容器时可能会因为固定列较窄而无法容纳弹窗
+               * 将表格主体区域作为弹窗容器时又会因为固定列的层级较高而遮挡弹窗
+               * 将body或者表格视口区域作为弹窗容器时又会导致弹窗无法跟随表格滚动。
+               * 鉴于以上各种情况，一种折中的解决方案是弹出层展示时，禁止操作表格的滚动条。
+               * 这样既解决了弹窗的遮挡问题，又不至于让弹窗随着表格的滚动而跑出视口区域。
+               */
+              getPopupContainer(el) {
+                viewportWrapper = el.closest('.vxe-table--viewport-wrapper');
+                return document.body;
+              },
+              placement: 'topLeft',
+              title: $t('ui.actionTitle.delete', [attrs?.nameTitle || '']),
+              ...props,
+              ...opt,
+              icon: undefined,
+              onOpenChange: (open: boolean) => {
+                // 当弹窗打开时，禁止表格的滚动
+                if (open) {
+                  viewportWrapper?.style.setProperty('pointer-events', 'none');
+                } else {
+                  viewportWrapper?.style.removeProperty('pointer-events');
+                }
+              },
+              onConfirm: () => {
+                attrs?.onClick?.({
+                  code: opt.code,
+                  row,
+                });
+              },
+            },
+            {
+              default: () => renderBtn({ ...opt }, false),
+              description: () =>
+                h(
+                  'div',
+                  { class: 'truncate' },
+                  $t('ui.actionMessage.deleteConfirm', [
+                    row[attrs?.nameField || 'name'],
+                  ]),
+                ),
+            },
+          );
+        }
+
+        const btns = operations.map((opt) =>
+          opt.code === 'delete' ? renderConfirm(opt) : renderBtn(opt),
+        );
+        return h(
+          'div',
+          {
+            class: 'flex table-operations',
+            style: { justifyContent: align },
+          },
+          btns,
+        );
+      },
+    });
+
     // 这里可以自行扩展 vxe-table 的全局配置，比如自定义格式化
     // vxeUI.formats.add
   },
-  useVbenForm,
 });
 
-export { useVbenVxeGrid };
+export const useVbenVxeGrid = <
+  T extends Record<string, any>,
+  TFormValues extends FormValues = FormValues,
+  TSubmitValues extends FormValues = TFormValues,
+>(
+  ...rest: Parameters<
+    typeof useGrid<
+      T,
+      ComponentType,
+      ComponentPropsMap,
+      TFormValues,
+      TSubmitValues
+    >
+  >
+) =>
+  useGrid<T, ComponentType, ComponentPropsMap, TFormValues, TSubmitValues>(
+    ...rest,
+  );
 
+/**
+ * 表格操作按钮组件
+ *
+ * 在适配器内部统一注入权限判断（hasPermission），使用方无需再传入 `:has-permission`。
+ * 通过 action 的 `auth` 字段声明权限码，结合 `useAccess().hasAccessByCodes` 判断是否展示。
+ * 如需自定义权限逻辑，仍可显式传入 `:has-permission` 覆盖默认行为。
+ */
+export const VbenTableAction = defineComponent(
+  (props: TableActionProps, { attrs, slots }) => {
+    const { hasAccessByCodes } = useAccess();
+    function hasPermission(auth?: string | string[]) {
+      if (!auth) return true;
+      return hasAccessByCodes(Array.isArray(auth) ? auth : [auth]);
+    }
+    return () =>
+      h(VbenTableActionCore, { hasPermission, ...props, ...attrs }, slots);
+  },
+  {
+    name: 'VbenTableAction',
+    inheritAttrs: false,
+  },
+);
+
+export type OnActionClickParams<T = Recordable<any>> = {
+  code: string;
+  row: T;
+};
+export type OnActionClickFn<T = Recordable<any>> = (
+  params: OnActionClickParams<T>,
+) => void;
 export type * from '@vben/plugins/vxe-table';
diff --git a/playground/src/api/core/auth.ts b/playground/src/api/core/auth.ts
index 71d9f994..b4627cbe 100644
--- a/playground/src/api/core/auth.ts
+++ b/playground/src/api/core/auth.ts
@@ -22,23 +22,29 @@ export namespace AuthApi {
  * 登录
  */
 export async function loginApi(data: AuthApi.LoginParams) {
-  return requestClient.post<AuthApi.LoginResult>('/auth/login', data);
+  return requestClient.post<AuthApi.LoginResult>('/auth/login', data, {
+    withCredentials: true,
+  });
 }
 
 /**
  * 刷新accessToken
  */
 export async function refreshTokenApi() {
-  return baseRequestClient.post<AuthApi.RefreshTokenResult>('/auth/refresh', {
-    withCredentials: true,
-  });
+  return baseRequestClient.post<AuthApi.RefreshTokenResult>(
+    '/auth/refresh',
+    null,
+    {
+      withCredentials: true,
+    },
+  );
 }
 
 /**
  * 退出登录
  */
 export async function logoutApi() {
-  return baseRequestClient.post('/auth/logout', {
+  return baseRequestClient.post('/auth/logout', null, {
     withCredentials: true,
   });
 }
diff --git a/playground/src/api/core/index.ts b/playground/src/api/core/index.ts
index 28a5aef4..7134366b 100644
--- a/playground/src/api/core/index.ts
+++ b/playground/src/api/core/index.ts
@@ -1,3 +1,4 @@
 export * from './auth';
 export * from './menu';
+export * from './timezone';
 export * from './user';
diff --git a/playground/src/api/core/timezone.ts b/playground/src/api/core/timezone.ts
new file mode 100644
index 00000000..13d44d19
--- /dev/null
+++ b/playground/src/api/core/timezone.ts
@@ -0,0 +1,26 @@
+import { requestClient } from '#/api/request';
+
+/**
+ * 获取系统支持的时区列表
+ */
+export async function getTimezoneOptionsApi() {
+  return await requestClient.get<
+    {
+      label: string;
+      value: string;
+    }[]
+  >('/timezone/getTimezoneOptions');
+}
+/**
+ * 获取用户时区
+ */
+export async function getTimezoneApi(): Promise<null | string | undefined> {
+  return requestClient.get<null | string | undefined>('/timezone/getTimezone');
+}
+/**
+ * 设置用户时区
+ * @param timezone 时区
+ */
+export async function setTimezoneApi(timezone: string): Promise<void> {
+  return requestClient.post('/timezone/setTimezone', { timezone });
+}
diff --git a/playground/src/api/examples/download.ts b/playground/src/api/examples/download.ts
new file mode 100644
index 00000000..0b4dcd36
--- /dev/null
+++ b/playground/src/api/examples/download.ts
@@ -0,0 +1,28 @@
+import type { RequestResponse } from '@vben/request';
+
+import { requestClient } from '../request';
+
+/**
+ * 下载文件，获取Blob
+ * @returns Blob
+ */
+async function downloadFile1() {
+  return requestClient.download<Blob>(
+    'https://unpkg.com/@vbenjs/static-source@0.1.7/source/logo-v1.webp',
+  );
+}
+
+/**
+ * 下载文件，获取完整的Response
+ * @returns RequestResponse<Blob>
+ */
+async function downloadFile2() {
+  return requestClient.download<RequestResponse<Blob>>(
+    'https://unpkg.com/@vbenjs/static-source@0.1.7/source/logo-v1.webp',
+    {
+      responseReturn: 'raw',
+    },
+  );
+}
+
+export { downloadFile1, downloadFile2 };
diff --git a/playground/src/api/examples/json-bigint.ts b/playground/src/api/examples/json-bigint.ts
new file mode 100644
index 00000000..19e41e2e
--- /dev/null
+++ b/playground/src/api/examples/json-bigint.ts
@@ -0,0 +1,10 @@
+import { requestClient } from '#/api/request';
+
+/**
+ * 发起请求
+ */
+async function getBigIntData() {
+  return requestClient.get('/demo/bigint');
+}
+
+export { getBigIntData };
diff --git a/playground/src/api/examples/params.ts b/playground/src/api/examples/params.ts
new file mode 100644
index 00000000..6568ec64
--- /dev/null
+++ b/playground/src/api/examples/params.ts
@@ -0,0 +1,19 @@
+import type { Recordable } from '@vben/types';
+
+import { requestClient } from '#/api/request';
+
+/**
+ * 发起数组请求
+ */
+async function getParamsData(
+  params: Recordable<any>,
+  type: 'brackets' | 'comma' | 'indices' | 'repeat',
+) {
+  return requestClient.get('/status', {
+    params,
+    paramsSerializer: type,
+    responseReturn: 'raw',
+  });
+}
+
+export { getParamsData };
diff --git a/playground/src/api/examples/upload.ts b/playground/src/api/examples/upload.ts
new file mode 100644
index 00000000..246d4f26
--- /dev/null
+++ b/playground/src/api/examples/upload.ts
@@ -0,0 +1,25 @@
+import { requestClient } from '#/api/request';
+
+interface UploadFileParams {
+  file: File;
+  onError?: (error: Error) => void;
+  onProgress?: (progress: { percent: number }) => void;
+  onSuccess?: (data: any, file: File) => void;
+}
+export async function upload_file({
+  file,
+  onError,
+  onProgress,
+  onSuccess,
+}: UploadFileParams) {
+  try {
+    onProgress?.({ percent: 0 });
+
+    const data = await requestClient.upload('/upload', { file });
+
+    onProgress?.({ percent: 100 });
+    onSuccess?.(data, file);
+  } catch (error) {
+    onError?.(error instanceof Error ? error : new Error(String(error)));
+  }
+}
diff --git a/playground/src/api/index.ts b/playground/src/api/index.ts
index ab806c62..3c3fa0d2 100644
--- a/playground/src/api/index.ts
+++ b/playground/src/api/index.ts
@@ -1,2 +1,3 @@
 export * from './core';
 export * from './examples';
+export * from './system';
diff --git a/playground/src/api/request.ts b/playground/src/api/request.ts
index b1f6c060..3aebcce6 100644
--- a/playground/src/api/request.ts
+++ b/playground/src/api/request.ts
@@ -1,18 +1,21 @@
 /**
  * 该文件可自行根据业务逻辑进行调整
  */
-import type { HttpResponse } from '@vben/request';
+import type { AxiosResponseHeaders, RequestClientOptions } from '@vben/request';
 
 import { useAppConfig } from '@vben/hooks';
 import { preferences } from '@vben/preferences';
 import {
   authenticateResponseInterceptor,
+  defaultResponseInterceptor,
   errorMessageResponseInterceptor,
   RequestClient,
 } from '@vben/request';
 import { useAccessStore } from '@vben/stores';
+import { cloneDeep } from '@vben/utils';
 
-import { message } from 'ant-design-vue';
+import { message } from 'antdv-next';
+import JSONBigInt from 'json-bigint';
 
 import { useAuthStore } from '#/store';
 
@@ -20,9 +23,22 @@ import { refreshTokenApi } from './core';
 
 const { apiURL } = useAppConfig(import.meta.env, import.meta.env.PROD);
 
-function createRequestClient(baseURL: string) {
+function createRequestClient(baseURL: string, options?: RequestClientOptions) {
   const client = new RequestClient({
+    ...options,
     baseURL,
+    transformResponse: (data: any, header: AxiosResponseHeaders) => {
+      // storeAsString指示将BigInt存储为字符串，设为false则会存储为内置的BigInt类型
+      if (
+        header.getContentType()?.toString().includes('application/json') &&
+        typeof data === 'string'
+      ) {
+        return cloneDeep(
+          JSONBigInt({ storeAsString: true, strict: true }).parse(data),
+        );
+      }
+      return data;
+    },
   });
 
   /**
@@ -69,19 +85,14 @@ function createRequestClient(baseURL: string) {
     },
   });
 
-  // response数据解构
-  client.addResponseInterceptor<HttpResponse>({
-    fulfilled: (response) => {
-      const { data: responseData, status } = response;
-
-      const { code, data } = responseData;
-
-      if (status >= 200 && status < 400 && code === 0) {
-        return data;
-      }
-      throw Object.assign({}, response, { response });
-    },
-  });
+  // 处理返回的响应数据格式
+  client.addResponseInterceptor(
+    defaultResponseInterceptor({
+      codeField: 'code',
+      dataField: 'data',
+      successCode: 0,
+    }),
+  );
 
   // token过期的处理
   client.addResponseInterceptor(
@@ -109,6 +120,14 @@ function createRequestClient(baseURL: string) {
   return client;
 }
 
-export const requestClient = createRequestClient(apiURL);
+export const requestClient = createRequestClient(apiURL, {
+  responseReturn: 'data',
+});
 
 export const baseRequestClient = new RequestClient({ baseURL: apiURL });
+
+export interface PageFetchParams {
+  [key: string]: any;
+  pageNo?: number;
+  pageSize?: number;
+}
diff --git a/playground/src/api/system/dept.ts b/playground/src/api/system/dept.ts
new file mode 100644
index 00000000..ce2b0de8
--- /dev/null
+++ b/playground/src/api/system/dept.ts
@@ -0,0 +1,54 @@
+import { requestClient } from '#/api/request';
+
+export namespace SystemDeptApi {
+  export interface SystemDept {
+    [key: string]: any;
+    children?: SystemDept[];
+    id: string;
+    name: string;
+    remark?: string;
+    status: 0 | 1;
+  }
+}
+
+/**
+ * 获取部门列表数据
+ */
+async function getDeptList() {
+  return requestClient.get<Array<SystemDeptApi.SystemDept>>(
+    '/system/dept/list',
+  );
+}
+
+/**
+ * 创建部门
+ * @param data 部门数据
+ */
+async function createDept(
+  data: Omit<SystemDeptApi.SystemDept, 'children' | 'id'>,
+) {
+  return requestClient.post('/system/dept', data);
+}
+
+/**
+ * 更新部门
+ *
+ * @param id 部门 ID
+ * @param data 部门数据
+ */
+async function updateDept(
+  id: string,
+  data: Omit<SystemDeptApi.SystemDept, 'children' | 'id'>,
+) {
+  return requestClient.put(`/system/dept/${id}`, data);
+}
+
+/**
+ * 删除部门
+ * @param id 部门 ID
+ */
+async function deleteDept(id: string) {
+  return requestClient.delete(`/system/dept/${id}`);
+}
+
+export { createDept, deleteDept, getDeptList, updateDept };
diff --git a/playground/src/api/system/index.ts b/playground/src/api/system/index.ts
new file mode 100644
index 00000000..1b28fb64
--- /dev/null
+++ b/playground/src/api/system/index.ts
@@ -0,0 +1,4 @@
+export * from './dept';
+export * from './menu';
+export * from './role';
+export * from './user';
diff --git a/playground/src/api/system/menu.ts b/playground/src/api/system/menu.ts
new file mode 100644
index 00000000..507a5aec
--- /dev/null
+++ b/playground/src/api/system/menu.ts
@@ -0,0 +1,158 @@
+import type { Recordable } from '@vben/types';
+
+import { requestClient } from '#/api/request';
+
+export namespace SystemMenuApi {
+  /** 徽标颜色集合 */
+  export const BadgeVariants = [
+    'default',
+    'destructive',
+    'primary',
+    'success',
+    'warning',
+  ] as const;
+  /** 徽标类型集合 */
+  export const BadgeTypes = ['dot', 'normal'] as const;
+  /** 菜单类型集合 */
+  export const MenuTypes = [
+    'catalog',
+    'menu',
+    'embedded',
+    'link',
+    'button',
+  ] as const;
+  /** 系统菜单 */
+  export interface SystemMenu {
+    [key: string]: any;
+    /** 后端权限标识 */
+    authCode: string;
+    /** 子级 */
+    children?: SystemMenu[];
+    /** 组件 */
+    component?: string;
+    /** 菜单ID */
+    id: string;
+    /** 菜单元数据 */
+    meta?: {
+      /** 激活时显示的图标 */
+      activeIcon?: string;
+      /** 作为路由时，需要激活的菜单的Path */
+      activePath?: string;
+      /** 固定在标签栏 */
+      affixTab?: boolean;
+      /** 在标签栏固定的顺序 */
+      affixTabOrder?: number;
+      /** 徽标内容(当徽标类型为normal时有效) */
+      badge?: string;
+      /** 徽标类型 */
+      badgeType?: (typeof BadgeTypes)[number];
+      /** 徽标颜色 */
+      badgeVariants?: (typeof BadgeVariants)[number];
+      /** 在菜单中隐藏下级 */
+      hideChildrenInMenu?: boolean;
+      /** 在面包屑中隐藏 */
+      hideInBreadcrumb?: boolean;
+      /** 在菜单中隐藏 */
+      hideInMenu?: boolean;
+      /** 在标签栏中隐藏 */
+      hideInTab?: boolean;
+      /** 菜单图标 */
+      icon?: string;
+      /** 内嵌Iframe的URL */
+      iframeSrc?: string;
+      /** 是否缓存页面 */
+      keepAlive?: boolean;
+      /** 外链页面的URL */
+      link?: string;
+      /** 同一个路由最大打开的标签数 */
+      maxNumOfOpenTab?: number;
+      /** 无需基础布局 */
+      noBasicLayout?: boolean;
+      /** 是否在新窗口打开 */
+      openInNewWindow?: boolean;
+      /** 菜单排序 */
+      order?: number;
+      /** 额外的路由参数 */
+      query?: Recordable<any>;
+      /** 菜单标题 */
+      title?: string;
+    };
+    /** 菜单名称 */
+    name: string;
+    /** 路由路径 */
+    path: string;
+    /** 父级ID */
+    pid: string;
+    /** 重定向 */
+    redirect?: string;
+    /** 菜单类型 */
+    type: (typeof MenuTypes)[number];
+  }
+}
+
+/**
+ * 获取菜单数据列表
+ */
+async function getMenuList() {
+  return requestClient.get<Array<SystemMenuApi.SystemMenu>>(
+    '/system/menu/list',
+  );
+}
+
+async function isMenuNameExists(
+  name: string,
+  id?: SystemMenuApi.SystemMenu['id'],
+) {
+  return requestClient.get<boolean>('/system/menu/name-exists', {
+    params: { id, name },
+  });
+}
+
+async function isMenuPathExists(
+  path: string,
+  id?: SystemMenuApi.SystemMenu['id'],
+) {
+  return requestClient.get<boolean>('/system/menu/path-exists', {
+    params: { id, path },
+  });
+}
+
+/**
+ * 创建菜单
+ * @param data 菜单数据
+ */
+async function createMenu(
+  data: Omit<SystemMenuApi.SystemMenu, 'children' | 'id'>,
+) {
+  return requestClient.post('/system/menu', data);
+}
+
+/**
+ * 更新菜单
+ *
+ * @param id 菜单 ID
+ * @param data 菜单数据
+ */
+async function updateMenu(
+  id: string,
+  data: Omit<SystemMenuApi.SystemMenu, 'children' | 'id'>,
+) {
+  return requestClient.put(`/system/menu/${id}`, data);
+}
+
+/**
+ * 删除菜单
+ * @param id 菜单 ID
+ */
+async function deleteMenu(id: string) {
+  return requestClient.delete(`/system/menu/${id}`);
+}
+
+export {
+  createMenu,
+  deleteMenu,
+  getMenuList,
+  isMenuNameExists,
+  isMenuPathExists,
+  updateMenu,
+};
diff --git a/playground/src/api/system/role.ts b/playground/src/api/system/role.ts
new file mode 100644
index 00000000..60b465ae
--- /dev/null
+++ b/playground/src/api/system/role.ts
@@ -0,0 +1,55 @@
+import type { Recordable } from '@vben/types';
+
+import { requestClient } from '#/api/request';
+
+export namespace SystemRoleApi {
+  export interface SystemRole {
+    [key: string]: any;
+    id: string;
+    name: string;
+    permissions: string[];
+    remark?: string;
+    status: 0 | 1;
+  }
+}
+
+/**
+ * 获取角色列表数据
+ */
+async function getRoleList(params: Recordable<any>) {
+  return requestClient.get<Array<SystemRoleApi.SystemRole>>(
+    '/system/role/list',
+    { params },
+  );
+}
+
+/**
+ * 创建角色
+ * @param data 角色数据
+ */
+async function createRole(data: Omit<SystemRoleApi.SystemRole, 'id'>) {
+  return requestClient.post('/system/role', data);
+}
+
+/**
+ * 更新角色
+ *
+ * @param id 角色 ID
+ * @param data 角色数据
+ */
+async function updateRole(
+  id: string,
+  data: Omit<SystemRoleApi.SystemRole, 'id'>,
+) {
+  return requestClient.put(`/system/role/${id}`, data);
+}
+
+/**
+ * 删除角色
+ * @param id 角色 ID
+ */
+async function deleteRole(id: string) {
+  return requestClient.delete(`/system/role/${id}`);
+}
+
+export { createRole, deleteRole, getRoleList, updateRole };
diff --git a/playground/src/api/system/user.ts b/playground/src/api/system/user.ts
new file mode 100644
index 00000000..40a1b806
--- /dev/null
+++ b/playground/src/api/system/user.ts
@@ -0,0 +1,55 @@
+import type { Recordable } from '@vben/types';
+
+import { requestClient } from '#/api/request';
+
+export namespace SystemUserApi {
+  export interface SystemUser {
+    [key: string]: any;
+    id: string;
+    name: string;
+    permissions: string[];
+    remark?: string;
+    status: 0 | 1;
+  }
+}
+
+/**
+ * 获取用户列表数据
+ */
+async function getUserList(params: Recordable<any>) {
+  return requestClient.get<Array<SystemUserApi.SystemUser>>(
+    '/system/user/list',
+    { params },
+  );
+}
+
+/**
+ * 创建用户
+ * @param data 用户数据
+ */
+async function createUser(data: Omit<SystemUserApi.SystemUser, 'id'>) {
+  return requestClient.post('/system/user', data);
+}
+
+/**
+ * 更新用户
+ *
+ * @param id 用户 ID
+ * @param data 用户数据
+ */
+async function updateUser(
+  id: string,
+  data: Omit<SystemUserApi.SystemUser, 'id'>,
+) {
+  return requestClient.put(`/system/user/${id}`, data);
+}
+
+/**
+ * 删除用户
+ * @param id 用户 ID
+ */
+async function deleteUser(id: string) {
+  return requestClient.delete(`/system/user/${id}`);
+}
+
+export { createUser, deleteUser, getUserList, updateUser };
diff --git a/playground/src/app.vue b/playground/src/app.vue
index bbaccce1..46366e91 100644
--- a/playground/src/app.vue
+++ b/playground/src/app.vue
@@ -1,10 +1,10 @@
 <script lang="ts" setup>
-import { computed } from 'vue';
+import { computed, watch } from 'vue';
 
 import { useAntdDesignTokens } from '@vben/hooks';
 import { preferences, usePreferences } from '@vben/preferences';
 
-import { App, ConfigProvider, theme } from 'ant-design-vue';
+import { App, ConfigProvider, StyleProvider, theme } from 'antdv-next';
 
 import { antdLocale } from '#/locales';
 
@@ -28,12 +28,23 @@ const tokenTheme = computed(() => {
     token: tokens,
   };
 });
+
+watch(
+  tokenTheme,
+  (themeConfig) => {
+    ConfigProvider.config({ theme: themeConfig });
+  },
+  { immediate: true },
+);
 </script>
 
 <template>
-  <ConfigProvider :locale="antdLocale" :theme="tokenTheme">
-    <App>
-      <RouterView />
-    </App>
-  </ConfigProvider>
+  <!-- layer: antd 组件样式注入 @layer antd，让 Tailwind 工具类可以覆盖组件样式 -->
+  <StyleProvider layer>
+    <ConfigProvider :locale="antdLocale" :theme="tokenTheme">
+      <App>
+        <RouterView />
+      </App>
+    </ConfigProvider>
+  </StyleProvider>
 </template>
diff --git a/playground/src/bootstrap.ts b/playground/src/bootstrap.ts
index 09b8cfa8..1df00ac7 100644
--- a/playground/src/bootstrap.ts
+++ b/playground/src/bootstrap.ts
@@ -1,41 +1,79 @@
 import { createApp, watchEffect } from 'vue';
 
 import { registerAccessDirective } from '@vben/access';
+import { registerLoadingDirective } from '@vben/common-ui';
+import { providePluginsOptions } from '@vben/plugins';
 import { preferences } from '@vben/preferences';
 import { initStores } from '@vben/stores';
 import '@vben/styles';
-import '@vben/styles/antd';
+import '@vben/styles/antdv-next';
 
-import { VueQueryPlugin } from '@tanstack/vue-query';
 import { useTitle } from '@vueuse/core';
 
 import { $t, setupI18n } from '#/locales';
 import { router } from '#/router';
 
 import { initComponentAdapter } from './adapter/component';
+import { initSetupVbenForm, useVbenForm } from './adapter/form';
 import App from './app.vue';
+import { initTimezone } from './timezone-init';
 
 async function bootstrap(namespace: string) {
   // 初始化组件适配器
   await initComponentAdapter();
 
+  // 初始化表单组件
+  await initSetupVbenForm();
+
+  // 注入插件全局配置
+  providePluginsOptions({
+    form: { useVbenForm },
+  });
+
+  // 设置弹窗的默认配置
+  // setDefaultModalProps({
+  //   fullscreenButton: false,
+  // });
+  // 设置抽屉的默认配置
+  // setDefaultDrawerProps({
+  //   zIndex: 1020,
+  // });
+
   const app = createApp(App);
 
+  // 注册v-loading指令
+  registerLoadingDirective(app, {
+    loading: 'loading', // 在这里可以自定义指令名称，也可以明确提供false表示不注册这个指令
+    spinning: 'spinning',
+  });
+
   // 国际化 i18n 配置
   await setupI18n(app);
 
   // 配置 pinia-tore
   await initStores(app, { namespace });
 
+  // 初始化时区HANDLER
+  initTimezone();
+
   // 安装权限指令
   registerAccessDirective(app);
 
+  // 初始化 tippy
+  const { initTippy } = await import('@vben/common-ui/es/tippy');
+  initTippy(app);
+
   // 配置路由及路由守卫
   app.use(router);
 
   // 配置@tanstack/vue-query
+  const { VueQueryPlugin } = await import('@tanstack/vue-query');
   app.use(VueQueryPlugin);
 
+  // 配置Motion插件
+  const { MotionPlugin } = await import('@vben/plugins/motion');
+  app.use(MotionPlugin);
+
   // 动态更新标题
   watchEffect(() => {
     if (preferences.app.dynamicTitle) {
diff --git a/playground/src/layouts/auth.vue b/playground/src/layouts/auth.vue
index 18d415bc..c33a632a 100644
--- a/playground/src/layouts/auth.vue
+++ b/playground/src/layouts/auth.vue
@@ -8,6 +8,7 @@ import { $t } from '#/locales';
 
 const appName = computed(() => preferences.app.name);
 const logo = computed(() => preferences.logo.source);
+const clickLogo = () => {};
 </script>
 
 <template>
@@ -16,6 +17,7 @@ const logo = computed(() => preferences.logo.source);
     :logo="logo"
     :page-description="$t('authentication.pageDesc')"
     :page-title="$t('authentication.pageTitle')"
+    :click-logo="clickLogo"
   >
     <!-- 自定义工具栏 -->
     <!-- <template #toolbar></template> -->
diff --git a/playground/src/layouts/basic.vue b/playground/src/layouts/basic.vue
index e257f116..bfefb316 100644
--- a/playground/src/layouts/basic.vue
+++ b/playground/src/layouts/basic.vue
@@ -1,28 +1,43 @@
 <script lang="ts" setup>
 import type { NotificationItem } from '@vben/layouts';
 
-import { computed, ref, watch } from 'vue';
+import { computed, onBeforeMount, ref, watch } from 'vue';
+import { useRouter } from 'vue-router';
 
 import { AuthenticationLoginExpiredModal } from '@vben/common-ui';
 import { VBEN_DOC_URL, VBEN_GITHUB_URL } from '@vben/constants';
 import { useWatermark } from '@vben/hooks';
-import { BookOpenText, CircleHelp, MdiGithub } from '@vben/icons';
+import { BookOpenText, CircleHelp, SvgGithubIcon } from '@vben/icons';
 import {
   BasicLayout,
   LockScreen,
   Notification,
   UserDropdown,
 } from '@vben/layouts';
-import { preferences } from '@vben/preferences';
-import { useAccessStore, useUserStore } from '@vben/stores';
+import { preferences, usePreferences } from '@vben/preferences';
+import { useAccessStore, useTabbarStore, useUserStore } from '@vben/stores';
 import { openWindow } from '@vben/utils';
 
 import { $t } from '#/locales';
 import { useAuthStore } from '#/store';
 import LoginForm from '#/views/_core/authentication/login.vue';
 
+const { setMenuList } = useTabbarStore();
+setMenuList([
+  'close',
+  'affix',
+  'maximize',
+  'reload',
+  'open-in-new-window',
+  'close-left',
+  'close-right',
+  'close-other',
+  'close-all',
+]);
+
 const notifications = ref<NotificationItem[]>([
   {
+    id: 1,
     avatar: 'https://avatar.vercel.sh/vercel.svg?text=VB',
     date: '3小时前',
     isRead: true,
@@ -30,6 +45,7 @@ const notifications = ref<NotificationItem[]>([
     title: '收到了 14 份新周报',
   },
   {
+    id: 2,
     avatar: 'https://avatar.vercel.sh/1',
     date: '刚刚',
     isRead: false,
@@ -37,6 +53,7 @@ const notifications = ref<NotificationItem[]>([
     title: '朱偏右 回复了你',
   },
   {
+    id: 3,
     avatar: 'https://avatar.vercel.sh/1',
     date: '2024-01-01',
     isRead: false,
@@ -44,23 +61,51 @@ const notifications = ref<NotificationItem[]>([
     title: '曲丽丽 评论了你',
   },
   {
+    id: 4,
     avatar: 'https://avatar.vercel.sh/satori',
     date: '1天前',
     isRead: false,
     message: '描述信息描述信息描述信息',
     title: '代办提醒',
   },
+  {
+    id: 5,
+    avatar: 'https://avatar.vercel.sh/satori',
+    date: '1天前',
+    isRead: false,
+    message: '描述信息描述信息描述信息',
+    title: '跳转Workspace示例',
+    link: '/workspace',
+  },
+  {
+    id: 6,
+    avatar: 'https://avatar.vercel.sh/satori',
+    date: '1天前',
+    isRead: false,
+    message: '描述信息描述信息描述信息',
+    title: '跳转外部链接示例',
+    link: 'https://doc.vben.pro',
+  },
 ]);
 
+const router = useRouter();
 const userStore = useUserStore();
 const authStore = useAuthStore();
 const accessStore = useAccessStore();
 const { destroyWatermark, updateWatermark } = useWatermark();
+const { isDark } = usePreferences();
 const showDot = computed(() =>
   notifications.value.some((item) => !item.isRead),
 );
 
 const menus = computed(() => [
+  {
+    handler: () => {
+      router.push({ name: 'Profile' });
+    },
+    icon: 'lucide:user',
+    text: $t('page.auth.profile'),
+  },
   {
     handler: () => {
       openWindow(VBEN_DOC_URL, {
@@ -76,7 +121,7 @@ const menus = computed(() => [
         target: '_blank',
       });
     },
-    icon: MdiGithub,
+    icon: SvgGithubIcon,
     text: 'GitHub',
   },
   {
@@ -102,16 +147,79 @@ function handleNoticeClear() {
   notifications.value = [];
 }
 
+function markRead(id: number | string) {
+  const item = notifications.value.find((item) => item.id === id);
+  if (item) {
+    item.isRead = true;
+  }
+}
+
+function remove(id: number | string) {
+  notifications.value = notifications.value.filter((item) => item.id !== id);
+}
+
 function handleMakeAll() {
   notifications.value.forEach((item) => (item.isRead = true));
 }
 
+function handleClickLogo() {}
+
+const viewAll = () => {};
+
+const handleClick = (item: NotificationItem) => {
+  // 如果通知项有链接，点击时跳转
+  if (item.link) {
+    navigateTo(item.link, item.query, item.state);
+  }
+};
+
+function navigateTo(
+  link: string,
+  query?: Record<string, any>,
+  state?: Record<string, any>,
+) {
+  if (link.startsWith('http://') || link.startsWith('https://')) {
+    // 外部链接，在新标签页打开
+    window.open(link, '_blank');
+  } else {
+    // 内部路由链接，支持 query 参数和 state
+    router.push({
+      path: link,
+      query: query || {},
+      state,
+    });
+  }
+}
+
 watch(
-  () => preferences.app.watermark,
-  async (enable) => {
+  () => ({
+    enable: preferences.app.watermark,
+    content: preferences.app.watermarkContent,
+    isDark: isDark.value,
+  }),
+  async ({ enable, content, isDark: isDarkValue }) => {
     if (enable) {
+      const watermarkColor = isDarkValue
+        ? 'rgba(255, 255, 255, 0.12)'
+        : 'rgba(0, 0, 0, 0.12)';
+
       await updateWatermark({
-        content: `${userStore.userInfo?.username}`,
+        advancedStyle: {
+          colorStops: [
+            {
+              color: watermarkColor,
+              offset: 0,
+            },
+            {
+              color: watermarkColor,
+              offset: 1,
+            },
+          ],
+          type: 'linear',
+        },
+        content:
+          content ||
+          `${userStore.userInfo?.username} - ${userStore.userInfo?.realName}`,
       });
     } else {
       destroyWatermark();
@@ -121,10 +229,22 @@ watch(
     immediate: true,
   },
 );
+
+onBeforeMount(() => {
+  if (preferences.app.watermark) {
+    destroyWatermark();
+  }
+});
 </script>
 
 <template>
-  <BasicLayout @clear-preferences-and-logout="handleLogout">
+  <BasicLayout
+    :avatar
+    :text="userStore.userInfo?.realName"
+    @clear-preferences-and-logout="handleLogout"
+    @click-logo="handleClickLogo"
+    @logout="handleLogout"
+  >
     <template #user-dropdown>
       <UserDropdown
         :avatar
@@ -134,6 +254,7 @@ watch(
         tag-text="Pro"
         trigger="both"
         @logout="handleLogout"
+        @clear-preferences-and-logout="handleLogout"
       />
     </template>
     <template #notification>
@@ -141,7 +262,11 @@ watch(
         :dot="showDot"
         :notifications="notifications"
         @clear="handleNoticeClear"
+        @read="(item) => item.id && markRead(item.id)"
+        @remove="(item) => item.id && remove(item.id)"
         @make-all="handleMakeAll"
+        @on-click="handleClick"
+        @view-all="viewAll"
       />
     </template>
     <template #extra>
diff --git a/playground/src/locales/index.ts b/playground/src/locales/index.ts
index 1972e06e..2586d859 100644
--- a/playground/src/locales/index.ts
+++ b/playground/src/locales/index.ts
@@ -1,7 +1,9 @@
-import type { LocaleSetupOptions, SupportedLanguagesType } from '@vben/locales';
-import type { Locale } from 'ant-design-vue/es/locale';
+import type { Locale } from 'antdv-next/dist/locale/index';
 
 import type { App } from 'vue';
+
+import type { LocaleSetupOptions, SupportedLanguagesType } from '@vben/locales';
+
 import { ref } from 'vue';
 
 import {
@@ -11,8 +13,8 @@ import {
 } from '@vben/locales';
 import { preferences } from '@vben/preferences';
 
-import antdEnLocale from 'ant-design-vue/es/locale/en_US';
-import antdDefaultLocale from 'ant-design-vue/es/locale/zh_CN';
+import antdEnLocale from 'antdv-next/dist/locale/en_US';
+import antdDefaultLocale from 'antdv-next/dist/locale/zh_CN';
 import dayjs from 'dayjs';
 
 const antdLocale = ref<Locale>(antdDefaultLocale);
diff --git a/playground/src/locales/langs/en-US/demos.json b/playground/src/locales/langs/en-US/demos.json
index 44b12780..89b4198d 100644
--- a/playground/src/locales/langs/en-US/demos.json
+++ b/playground/src/locales/langs/en-US/demos.json
@@ -44,13 +44,72 @@
     "loginExpired": "Login Expired",
     "icons": "Icons",
     "watermark": "Watermark",
+    "preferencesExtension": "Preferences Extension",
     "tabs": "Tabs",
     "tabDetail": "Tab Detail Page",
     "fullScreen": "FullScreen",
     "clipboard": "Clipboard",
     "menuWithQuery": "Menu With Query",
     "openInNewWindow": "Open in New Window",
-    "fileDownload": "File Download"
+    "fileDownload": "File Download",
+    "requestParamsSerializer": "Request Params Serializer"
+  },
+  "preferencesExtensionDemo": {
+    "description": "This page directly uses extension preferences defined in the playground app. You can modify them in “Preferences → Playground Extension” at the top right, or click the preset buttons below to see the page update in real time.",
+    "currentConfig": "Current Extension Preferences",
+    "currentTitle": "Current Title: {title}",
+    "currentDescription": "Displaying {count} tasks by default; quick actions are {quickActionText}; the current highlight tone is “{tone}”.",
+    "showQuickActions": "shown",
+    "hideQuickActions": "hidden",
+    "boardDescription": "This is a real usage example: the page title, action area, visible row count, and highlight styles are all driven by extension preferences.",
+    "quickActionsEnabled": "Quick actions are currently disabled, so the page only keeps the read-only information view.",
+    "quickActions": {
+      "create": "Create Task",
+      "export": "Batch Export",
+      "refresh": "Refresh Data"
+    },
+    "presetTitle": "Quick Presets (demonstrates updateCustomPreferences)",
+    "presetButtons": {
+      "default": "Reset Default",
+      "compact": "Switch to Compact",
+      "review": "Switch to Review"
+    },
+    "presetTitles": {
+      "compact": "Compact Dashboard",
+      "default": "Weekly Operations Overview",
+      "review": "Review Dashboard"
+    },
+    "tones": {
+      "default": "Default",
+      "success": "Success",
+      "warning": "Warning"
+    },
+    "owner": "Owner"
+  },
+  "preferencesExtensionConfig": {
+    "tabLabel": "Extension",
+    "title": "Playground Business Preferences",
+    "fields": {
+      "reportTitle": {
+        "label": "Report Title",
+        "placeholder": "Please enter the report title"
+      },
+      "defaultVisibleRows": {
+        "label": "Default Visible Rows",
+        "tip": "Controls how many task items are rendered by default on the demo page."
+      },
+      "enableQuickActions": {
+        "label": "Show Quick Actions"
+      },
+      "highlightTone": {
+        "label": "Highlight Tone",
+        "options": {
+          "default": "Default",
+          "success": "Success",
+          "warning": "Warning"
+        }
+      }
+    }
   },
   "breadcrumb": {
     "navigation": "Breadcrumb Navigation",
@@ -64,7 +123,9 @@
     "about": "About",
     "document": "Document",
     "antdv": "Ant Design Vue Version",
+    "antdv-next": "Antdv Next Version",
     "naive-ui": "Naive UI Version",
-    "element-plus": "Element Plus Version"
+    "element-plus": "Element Plus Version",
+    "tdesign": "TDesign Vue Version"
   }
 }
diff --git a/playground/src/locales/langs/en-US/examples.json b/playground/src/locales/langs/en-US/examples.json
index 8131380f..ebf085ff 100644
--- a/playground/src/locales/langs/en-US/examples.json
+++ b/playground/src/locales/langs/en-US/examples.json
@@ -12,12 +12,21 @@
   "form": {
     "title": "Form",
     "basic": "Basic Form",
+    "layout": "Custom Layout",
     "query": "Query Form",
+    "valueFormat": "Value Format",
     "rules": "Form Rules",
     "dynamic": "Dynamic Form",
     "custom": "Custom Component",
     "api": "Api",
-    "merge": "Merge Form"
+    "merge": "Merge Form",
+    "scrollToError": "Scroll to Error Field",
+    "upload-error": "Partial file upload failed",
+    "upload-urls": "Urls after file upload",
+    "file": "file",
+    "crop-image": "Crop image",
+    "upload-image": "Click to upload image",
+    "collapsible": "Collapsible Form Field"
   },
   "vxeTable": {
     "title": "Vxe Table",
@@ -29,13 +38,15 @@
     "editCell": "Edit Cell",
     "editRow": "Edit Row",
     "custom-cell": "Custom Cell",
-    "form": "Form Table"
+    "form": "Form Table",
+    "viewed": "Row Marker"
   },
   "captcha": {
     "title": "Captcha",
     "pointSelection": "Point Selection Captcha",
     "sliderCaptcha": "Slider Captcha",
     "sliderRotateCaptcha": "Rotate Captcha",
+    "sliderTranslateCaptcha": "Translate Captcha",
     "captchaCardTitle": "Please complete the security verification",
     "pageDescription": "Verify user identity by clicking on specific locations in the image.",
     "pageTitle": "Captcha Component Example",
@@ -62,5 +73,17 @@
   },
   "layout": {
     "col-page": "ColPage Layout"
+  },
+  "button-group": {
+    "title": "Button Group"
+  },
+  "function": {
+    "contentMenu": "Content Menu"
+  },
+  "cropper": {
+    "title": "Cropper"
+  },
+  "tiptap": {
+    "title": "Rich Text Editor"
   }
 }
diff --git a/playground/src/locales/langs/en-US/page.json b/playground/src/locales/langs/en-US/page.json
index 50f19dc4..32e323c2 100644
--- a/playground/src/locales/langs/en-US/page.json
+++ b/playground/src/locales/langs/en-US/page.json
@@ -6,7 +6,8 @@
     "qrcodeLogin": "Qr Code Login",
     "forgetPassword": "Forget Password",
     "sendingCode": "SMS Code is sending...",
-    "codeSentTo": "Code has been sent to {0}"
+    "codeSentTo": "Code has been sent to {0}",
+    "profile": "Profile"
   },
   "dashboard": {
     "title": "Dashboard",
diff --git a/playground/src/locales/langs/en-US/system.json b/playground/src/locales/langs/en-US/system.json
new file mode 100644
index 00000000..61ed76cb
--- /dev/null
+++ b/playground/src/locales/langs/en-US/system.json
@@ -0,0 +1,78 @@
+{
+  "title": "System Management",
+  "user": {
+    "title": "User Management",
+    "list": "User List",
+    "name": "User",
+    "userName": "User Name",
+    "id": "User ID",
+    "dept": "Department",
+    "status": "Status",
+    "remark": "Remark",
+    "createTime": "Creation Time",
+    "operation": "Operation",
+    "placeholder": "Search Department..."
+  },
+  "dept": {
+    "name": "Department",
+    "title": "Department Management",
+    "deptName": "Department Name",
+    "status": "Status",
+    "createTime": "Create Time",
+    "remark": "Remark",
+    "operation": "Operation",
+    "parentDept": "Parent Department"
+  },
+  "menu": {
+    "title": "Menu Management",
+    "parent": "Parent Menu",
+    "menuTitle": "Title",
+    "menuName": "Menu Name",
+    "name": "Menu",
+    "type": "Type",
+    "typeCatalog": "Catalog",
+    "typeMenu": "Menu",
+    "typeButton": "Button",
+    "typeLink": "Link",
+    "typeEmbedded": "Embedded",
+    "icon": "Icon",
+    "activeIcon": "Active Icon",
+    "activePath": "Active Path",
+    "path": "Route Path",
+    "component": "Component",
+    "status": "Status",
+    "authCode": "Auth Code",
+    "badge": "Badge",
+    "operation": "Operation",
+    "linkSrc": "Link Address",
+    "affixTab": "Affix In Tabs",
+    "keepAlive": "Keep Alive",
+    "hideInMenu": "Hide In Menu",
+    "hideInTab": "Hide In Tabbar",
+    "hideChildrenInMenu": "Hide Children In Menu",
+    "hideInBreadcrumb": "Hide In Breadcrumb",
+    "advancedSettings": "Other Settings",
+    "activePathMustExist": "The path could not find a valid menu",
+    "activePathHelp": "When jumping to the current route, \nthe menu path that needs to be activated must be specified when it does not display in the navigation menu.",
+    "badgeType": {
+      "title": "Badge Type",
+      "dot": "Dot",
+      "normal": "Text",
+      "none": "None"
+    },
+    "badgeVariants": "Badge Style"
+  },
+  "role": {
+    "title": "Role Management",
+    "list": "Role List",
+    "name": "Role",
+    "roleName": "Role Name",
+    "id": "Role ID",
+    "status": "Status",
+    "remark": "Remark",
+    "createTime": "Creation Time",
+    "operation": "Operation",
+    "permissions": "Permissions",
+    "setPermissions": "Permissions"
+  }
+}
diff --git a/playground/src/locales/langs/zh-CN/demos.json b/playground/src/locales/langs/zh-CN/demos.json
index 254e072b..b22c34a5 100644
--- a/playground/src/locales/langs/zh-CN/demos.json
+++ b/playground/src/locales/langs/zh-CN/demos.json
@@ -44,13 +44,72 @@
     "loginExpired": "登录过期",
     "icons": "图标",
     "watermark": "水印",
+    "preferencesExtension": "偏好扩展示例",
     "tabs": "标签页",
     "tabDetail": "标签详情页",
     "fullScreen": "全屏",
     "clipboard": "剪贴板",
     "menuWithQuery": "带参菜单",
     "openInNewWindow": "新窗口打开",
-    "fileDownload": "文件下载"
+    "fileDownload": "文件下载",
+    "requestParamsSerializer": "参数序列化"
+  },
+  "preferencesExtensionDemo": {
+    "description": "这个页面直接读取 playground 子项目定义的拓展偏好。你可以在右上角的“偏好设置 → Playground 拓展”中修改字段，也可以点击下方预设按钮，页面会实时联动。",
+    "currentConfig": "当前拓展配置",
+    "currentTitle": "当前标题：{title}",
+    "currentDescription": "默认展示 {count} 条任务；{quickActionText} 快捷操作；当前高亮风格为“{tone}”。",
+    "showQuickActions": "显示",
+    "hideQuickActions": "隐藏",
+    "boardDescription": "这是一个“真实使用”的示例：页面标题、操作区、列表条数和高亮样式都由拓展偏好驱动。",
+    "quickActionsEnabled": "当前已关闭快捷操作，页面只保留只读信息展示。",
+    "quickActions": {
+      "create": "新建任务",
+      "export": "批量导出",
+      "refresh": "刷新数据"
+    },
+    "presetTitle": "快捷预设（演示 updateCustomPreferences 用法）",
+    "presetButtons": {
+      "default": "恢复默认",
+      "compact": "切换紧凑模式",
+      "review": "切换评审模式"
+    },
+    "presetTitles": {
+      "compact": "紧凑模式看板",
+      "default": "本周运营概览",
+      "review": "评审态工作看板"
+    },
+    "tones": {
+      "default": "默认",
+      "success": "成功",
+      "warning": "警告"
+    },
+    "owner": "负责人"
+  },
+  "preferencesExtensionConfig": {
+    "tabLabel": "拓展",
+    "title": "Playground 业务偏好",
+    "fields": {
+      "reportTitle": {
+        "label": "看板标题",
+        "placeholder": "请输入看板标题"
+      },
+      "defaultVisibleRows": {
+        "label": "默认展示条数",
+        "tip": "用于控制示例页中任务列表默认渲染多少条数据。"
+      },
+      "enableQuickActions": {
+        "label": "显示快捷操作"
+      },
+      "highlightTone": {
+        "label": "高亮风格",
+        "options": {
+          "default": "默认",
+          "success": "成功",
+          "warning": "警告"
+        }
+      }
+    }
   },
   "breadcrumb": {
     "navigation": "面包屑导航",
@@ -64,7 +123,9 @@
     "about": "关于",
     "document": "文档",
     "antdv": "Ant Design Vue 版本",
+    "antdv-next": "Antdv Next 版本",
     "naive-ui": "Naive UI 版本",
-    "element-plus": "Element Plus 版本"
+    "element-plus": "Element Plus 版本",
+    "tdesign": "TDesign Vue 版本"
   }
 }
diff --git a/playground/src/locales/langs/zh-CN/examples.json b/playground/src/locales/langs/zh-CN/examples.json
index fea65a70..1a2b6a83 100644
--- a/playground/src/locales/langs/zh-CN/examples.json
+++ b/playground/src/locales/langs/zh-CN/examples.json
@@ -15,12 +15,21 @@
   "form": {
     "title": "表单",
     "basic": "基础表单",
+    "layout": "自定义布局",
     "query": "查询表单",
+    "valueFormat": "值格式化",
     "rules": "表单校验",
     "dynamic": "动态表单",
     "custom": "自定义组件",
     "api": "Api",
-    "merge": "合并表单"
+    "merge": "合并表单",
+    "scrollToError": "滚动到错误字段",
+    "upload-error": "部分文件上传失败",
+    "upload-urls": "文件上传后的网址",
+    "file": "文件",
+    "crop-image": "裁剪图片",
+    "upload-image": "点击上传图片",
+    "collapsible": "单项表单折叠"
   },
   "vxeTable": {
     "title": "Vxe 表格",
@@ -32,13 +41,15 @@
     "editCell": "单元格编辑",
     "editRow": "行编辑",
     "custom-cell": "自定义单元格",
-    "form": "搜索表单"
+    "form": "搜索表单",
+    "viewed": "行标记"
   },
   "captcha": {
     "title": "验证码",
     "pointSelection": "点选验证",
     "sliderCaptcha": "滑块验证",
     "sliderRotateCaptcha": "旋转验证",
+    "sliderTranslateCaptcha": "拼图滑块验证",
     "captchaCardTitle": "请完成安全验证",
     "pageDescription": "通过点击图片中的特定位置来验证用户身份。",
     "pageTitle": "验证码组件示例",
@@ -62,5 +73,17 @@
   },
   "layout": {
     "col-page": "双列布局"
+  },
+  "button-group": {
+    "title": "按钮组"
+  },
+  "function": {
+    "contentMenu": "上下文菜单"
+  },
+  "cropper": {
+    "title": "图片裁剪"
+  },
+  "tiptap": {
+    "title": "富文本编辑器"
   }
 }
diff --git a/playground/src/locales/langs/zh-CN/page.json b/playground/src/locales/langs/zh-CN/page.json
index 666db5b7..437068c9 100644
--- a/playground/src/locales/langs/zh-CN/page.json
+++ b/playground/src/locales/langs/zh-CN/page.json
@@ -6,7 +6,8 @@
     "qrcodeLogin": "二维码登录",
     "forgetPassword": "忘记密码",
     "sendingCode": "正在发送验证码",
-    "codeSentTo": "验证码已发送至{0}"
+    "codeSentTo": "验证码已发送至{0}",
+    "profile": "个人中心"
   },
   "dashboard": {
     "title": "概览",
diff --git a/playground/src/locales/langs/zh-CN/system.json b/playground/src/locales/langs/zh-CN/system.json
new file mode 100644
index 00000000..9e29248d
--- /dev/null
+++ b/playground/src/locales/langs/zh-CN/system.json
@@ -0,0 +1,80 @@
+{
+  "title": "系统管理",
+  "user": {
+    "title": "用户管理",
+    "list": "用户列表",
+    "name": "用户名",
+    "userName": "用户名称",
+    "id": "用户ID",
+    "dept": "部门",
+    "status": "状态",
+    "remark": "备注",
+    "createTime": "创建时间",
+    "operation": "操作",
+    "placeholder": "搜索部门..."
+  },
+  "dept": {
+    "list": "部门列表",
+    "createTime": "创建时间",
+    "deptName": "部门名称",
+    "name": "部门",
+    "operation": "操作",
+    "parentDept": "上级部门",
+    "remark": "备注",
+    "status": "状态",
+    "title": "部门管理"
+  },
+  "menu": {
+    "list": "菜单列表",
+    "activeIcon": "激活图标",
+    "activePath": "激活路径",
+    "activePathHelp": "跳转到当前路由时，需要激活的菜单路径。\n当不在导航菜单中显示时，需要指定激活路径",
+    "activePathMustExist": "该路径未能找到有效的菜单",
+    "advancedSettings": "其它设置",
+    "affixTab": "固定在标签",
+    "authCode": "权限标识",
+    "badge": "徽章内容",
+    "badgeVariants": "徽标样式",
+    "badgeType": {
+      "dot": "点",
+      "none": "无",
+      "normal": "文字",
+      "title": "徽标类型"
+    },
+    "component": "页面组件",
+    "hideChildrenInMenu": "隐藏子菜单",
+    "hideInBreadcrumb": "在面包屑中隐藏",
+    "hideInMenu": "隐藏菜单",
+    "hideInTab": "在标签栏中隐藏",
+    "icon": "图标",
+    "keepAlive": "缓存标签页",
+    "linkSrc": "链接地址",
+    "menuName": "菜单名称",
+    "menuTitle": "标题",
+    "name": "菜单",
+    "operation": "操作",
+    "parent": "上级菜单",
+    "path": "路由地址",
+    "status": "状态",
+    "title": "菜单管理",
+    "type": "类型",
+    "typeButton": "按钮",
+    "typeCatalog": "目录",
+    "typeEmbedded": "内嵌",
+    "typeLink": "外链",
+    "typeMenu": "菜单"
+  },
+  "role": {
+    "title": "角色管理",
+    "list": "角色列表",
+    "name": "角色",
+    "roleName": "角色名称",
+    "id": "角色ID",
+    "status": "状态",
+    "remark": "备注",
+    "createTime": "创建时间",
+    "operation": "操作",
+    "permissions": "权限",
+    "setPermissions": "授权"
+  }
+}
diff --git a/playground/src/main.ts b/playground/src/main.ts
index 5d728a02..2952e3a1 100644
--- a/playground/src/main.ts
+++ b/playground/src/main.ts
@@ -1,7 +1,7 @@
 import { initPreferences } from '@vben/preferences';
 import { unmountGlobalLoading } from '@vben/utils';
 
-import { overridesPreferences } from './preferences';
+import { overridesPreferences, preferencesExtension } from './preferences';
 
 /**
  * 应用初始化完成之后再进行页面加载渲染
@@ -15,6 +15,7 @@ async function initApplication() {
 
   // app偏好设置初始化
   await initPreferences({
+    extension: preferencesExtension,
     namespace,
     overrides: overridesPreferences,
   });
@@ -28,4 +29,4 @@ async function initApplication() {
   unmountGlobalLoading();
 }
 
-initApplication();
+void initApplication();
diff --git a/playground/src/preferences.ts b/playground/src/preferences.ts
index b2e9ace4..661abcfa 100644
--- a/playground/src/preferences.ts
+++ b/playground/src/preferences.ts
@@ -1,4 +1,15 @@
-import { defineOverridesPreferences } from '@vben/preferences';
+import {
+  appCopyrightPreferences,
+  defineOverridesPreferences,
+  definePreferencesExtension,
+} from '@vben/preferences';
+
+interface PlaygroundPreferencesExtension {
+  defaultVisibleRows: number;
+  enableQuickActions: boolean;
+  highlightTone: 'default' | 'success' | 'warning';
+  reportTitle: string;
+}
 
 /**
  * @description 项目配置文件
@@ -10,4 +21,66 @@ export const overridesPreferences = defineOverridesPreferences({
   app: {
     name: import.meta.env.VITE_APP_TITLE,
   },
+  copyright: appCopyrightPreferences,
 });
+
+export type { PlaygroundPreferencesExtension };
+
+export const preferencesExtension =
+  definePreferencesExtension<PlaygroundPreferencesExtension>({
+    tabLabel: 'demos.preferencesExtensionConfig.tabLabel',
+    title: 'demos.preferencesExtensionConfig.title',
+    fields: [
+      {
+        component: 'input',
+        defaultValue: '',
+        key: 'reportTitle',
+        label: 'demos.preferencesExtensionConfig.fields.reportTitle.label',
+        placeholder:
+          'demos.preferencesExtensionConfig.fields.reportTitle.placeholder',
+      },
+      {
+        component: 'number',
+        componentProps: {
+          max: 8,
+          min: 1,
+          step: 1,
+        },
+        defaultValue: 4,
+        key: 'defaultVisibleRows',
+        label:
+          'demos.preferencesExtensionConfig.fields.defaultVisibleRows.label',
+        tip: 'demos.preferencesExtensionConfig.fields.defaultVisibleRows.tip',
+      },
+      {
+        component: 'switch',
+        defaultValue: true,
+        key: 'enableQuickActions',
+        label:
+          'demos.preferencesExtensionConfig.fields.enableQuickActions.label',
+      },
+      {
+        component: 'select',
+        defaultValue: 'default',
+        key: 'highlightTone',
+        label: 'demos.preferencesExtensionConfig.fields.highlightTone.label',
+        options: [
+          {
+            label:
+              'demos.preferencesExtensionConfig.fields.highlightTone.options.default',
+            value: 'default',
+          },
+          {
+            label:
+              'demos.preferencesExtensionConfig.fields.highlightTone.options.success',
+            value: 'success',
+          },
+          {
+            label:
+              'demos.preferencesExtensionConfig.fields.highlightTone.options.warning',
+            value: 'warning',
+          },
+        ],
+      },
+    ],
+  });
diff --git a/playground/src/router/access.ts b/playground/src/router/access.ts
index 3a48be23..e9e98511 100644
--- a/playground/src/router/access.ts
+++ b/playground/src/router/access.ts
@@ -6,7 +6,7 @@ import type {
 import { generateAccessible } from '@vben/access';
 import { preferences } from '@vben/preferences';
 
-import { message } from 'ant-design-vue';
+import { message } from 'antdv-next';
 
 import { getAllMenusApi } from '#/api';
 import { BasicLayout, IFrameView } from '#/layouts';
diff --git a/playground/src/router/guard.ts b/playground/src/router/guard.ts
index 8d7e7ee0..167a84d1 100644
--- a/playground/src/router/guard.ts
+++ b/playground/src/router/guard.ts
@@ -1,6 +1,6 @@
 import type { Router } from 'vue-router';
 
-import { DEFAULT_HOME_PATH, LOGIN_PATH } from '@vben/constants';
+import { LOGIN_PATH } from '@vben/constants';
 import { preferences } from '@vben/preferences';
 import { useAccessStore, useUserStore } from '@vben/stores';
 import { startProgress, stopProgress } from '@vben/utils';
@@ -18,7 +18,7 @@ function setupCommonGuard(router: Router) {
   // 记录已经加载的页面
   const loadedPaths = new Set<string>();
 
-  router.beforeEach(async (to) => {
+  router.beforeEach((to) => {
     to.meta.loaded = loadedPaths.has(to.path);
 
     // 页面加载进度条
@@ -54,7 +54,7 @@ function setupAccessGuard(router: Router) {
         return decodeURIComponent(
           (to.query?.redirect as string) ||
             userStore.userInfo?.homePath ||
-            DEFAULT_HOME_PATH,
+            preferences.app.defaultHomePath,
         );
       }
       return true;
@@ -73,7 +73,7 @@ function setupAccessGuard(router: Router) {
           path: LOGIN_PATH,
           // 如不需要，直接删除 query
           query:
-            to.fullPath === DEFAULT_HOME_PATH
+            to.fullPath === preferences.app.defaultHomePath
               ? {}
               : { redirect: encodeURIComponent(to.fullPath) },
           // 携带当前跳转的页面，登录后重新跳转该页面
@@ -105,11 +105,16 @@ function setupAccessGuard(router: Router) {
     accessStore.setAccessMenus(accessibleMenus);
     accessStore.setAccessRoutes(accessibleRoutes);
     accessStore.setIsAccessChecked(true);
-    const redirectPath = (from.query.redirect ??
-      (to.path === DEFAULT_HOME_PATH
-        ? userInfo.homePath || DEFAULT_HOME_PATH
-        : to.fullPath)) as string;
-
+    let redirectPath: string;
+    if (from.query.redirect) {
+      redirectPath = from.query.redirect as string;
+    } else if (to.fullPath === preferences.app.defaultHomePath) {
+      redirectPath = preferences.app.defaultHomePath;
+    } else if (userInfo.homePath && to.fullPath === userInfo.homePath) {
+      redirectPath = userInfo.homePath;
+    } else {
+      redirectPath = to.fullPath;
+    }
     return {
       ...router.resolve(decodeURIComponent(redirectPath)),
       replace: true,
diff --git a/playground/src/router/routes/core.ts b/playground/src/router/routes/core.ts
index fe030a9a..949b0b65 100644
--- a/playground/src/router/routes/core.ts
+++ b/playground/src/router/routes/core.ts
@@ -1,11 +1,12 @@
 import type { RouteRecordRaw } from 'vue-router';
 
-import { DEFAULT_HOME_PATH, LOGIN_PATH } from '@vben/constants';
+import { LOGIN_PATH } from '@vben/constants';
+import { preferences } from '@vben/preferences';
 
-import { AuthPageLayout } from '#/layouts';
 import { $t } from '#/locales';
-import Login from '#/views/_core/authentication/login.vue';
 
+const BasicLayout = () => import('#/layouts/basic.vue');
+const AuthPageLayout = () => import('#/layouts/auth.vue');
 /** 全局404页面 */
 const fallbackNotFoundRoute: RouteRecordRaw = {
   component: () => import('#/views/_core/fallback/not-found.vue'),
@@ -21,13 +22,21 @@ const fallbackNotFoundRoute: RouteRecordRaw = {
 
 /** 基本路由，这些路由是必须存在的 */
 const coreRoutes: RouteRecordRaw[] = [
+  /**
+   * 根路由
+   * 使用基础布局，作为所有页面的父级容器，子级就不必配置BasicLayout。
+   * 此路由必须存在，且不应修改
+   */
   {
+    component: BasicLayout,
     meta: {
+      hideInBreadcrumb: true,
       title: 'Root',
     },
     name: 'Root',
     path: '/',
-    redirect: DEFAULT_HOME_PATH,
+    redirect: preferences.app.defaultHomePath,
+    children: [],
   },
   {
     component: AuthPageLayout,
@@ -42,7 +51,7 @@ const coreRoutes: RouteRecordRaw[] = [
       {
         name: 'Login',
         path: 'login',
-        component: Login,
+        component: () => import('#/views/_core/authentication/login.vue'),
         meta: {
           title: $t('page.auth.login'),
         },
diff --git a/playground/src/router/routes/index.ts b/playground/src/router/routes/index.ts
index e6fb1440..275eb837 100644
--- a/playground/src/router/routes/index.ts
+++ b/playground/src/router/routes/index.ts
@@ -34,4 +34,14 @@ const coreRouteNames = traverseTreeValues(coreRoutes, (route) => route.name);
 
 /** 有权限校验的路由列表，包含动态路由和静态路由 */
 const accessRoutes = [...dynamicRoutes, ...staticRoutes];
-export { accessRoutes, coreRouteNames, routes };
+
+const componentKeys: string[] = Object.keys(
+  import.meta.glob('../../views/**/*.vue'),
+)
+  .filter((item) => !item.includes('/modules/'))
+  .map((v) => {
+    const path = v.replace('../../views/', '/');
+    return path.endsWith('.vue') ? path.slice(0, -4) : path;
+  });
+
+export { accessRoutes, componentKeys, coreRouteNames, routes };
diff --git a/playground/src/router/routes/modules/dashboard.ts b/playground/src/router/routes/modules/dashboard.ts
index 1bddab9d..de8e98b8 100644
--- a/playground/src/router/routes/modules/dashboard.ts
+++ b/playground/src/router/routes/modules/dashboard.ts
@@ -1,32 +1,31 @@
 import type { RouteRecordRaw } from 'vue-router';
 
-import { BasicLayout } from '#/layouts';
 import { $t } from '#/locales';
 
 const routes: RouteRecordRaw[] = [
   {
-    component: BasicLayout,
     meta: {
       icon: 'lucide:layout-dashboard',
       order: -1,
       title: $t('page.dashboard.title'),
     },
     name: 'Dashboard',
-    path: '/',
+    path: '/dashboard',
     children: [
       {
         name: 'Analytics',
-        path: '/analytics',
+        path: 'analytics',
         component: () => import('#/views/dashboard/analytics/index.vue'),
         meta: {
           affixTab: true,
           icon: 'lucide:area-chart',
           title: $t('page.dashboard.analytics'),
+          keepAlive: true,
         },
       },
       {
         name: 'Workspace',
-        path: '/workspace',
+        path: 'workspace',
         component: () => import('#/views/dashboard/workspace/index.vue'),
         meta: {
           icon: 'carbon:workspace',
diff --git a/playground/src/router/routes/modules/demos.ts b/playground/src/router/routes/modules/demos.ts
index 46ebeeb9..d2770659 100644
--- a/playground/src/router/routes/modules/demos.ts
+++ b/playground/src/router/routes/modules/demos.ts
@@ -1,11 +1,10 @@
 import type { RouteRecordRaw } from 'vue-router';
 
-import { BasicLayout, IFrameView } from '#/layouts';
+import { IFrameView } from '#/layouts';
 import { $t } from '#/locales';
 
 const routes: RouteRecordRaw[] = [
   {
-    component: BasicLayout,
     meta: {
       icon: 'ic:baseline-view-in-ar',
       keepAlive: true,
@@ -22,20 +21,21 @@ const routes: RouteRecordRaw[] = [
           title: $t('demos.access.frontendPermissions'),
         },
         name: 'AccessDemos',
-        path: '/demos/access',
+        path: 'access',
         children: [
           {
             name: 'AccessPageControlDemo',
-            path: '/demos/access/page-control',
+            path: 'page-control',
             component: () => import('#/views/demos/access/index.vue'),
             meta: {
               icon: 'mdi:page-previous-outline',
               title: $t('demos.access.pageAccess'),
+              domCached: true,
             },
           },
           {
             name: 'AccessButtonControlDemo',
-            path: '/demos/access/button-control',
+            path: 'button-control',
             component: () => import('#/views/demos/access/button-control.vue'),
             meta: {
               icon: 'mdi:button-cursor',
@@ -44,7 +44,7 @@ const routes: RouteRecordRaw[] = [
           },
           {
             name: 'AccessMenuVisible403Demo',
-            path: '/demos/access/menu-visible-403',
+            path: 'menu-visible-403',
             component: () =>
               import('#/views/demos/access/menu-visible-403.vue'),
             meta: {
@@ -56,7 +56,7 @@ const routes: RouteRecordRaw[] = [
           },
           {
             name: 'AccessSuperVisibleDemo',
-            path: '/demos/access/super-visible',
+            path: 'super-visible',
             component: () => import('#/views/demos/access/super-visible.vue'),
             meta: {
               authority: ['super'],
@@ -66,7 +66,7 @@ const routes: RouteRecordRaw[] = [
           },
           {
             name: 'AccessAdminVisibleDemo',
-            path: '/demos/access/admin-visible',
+            path: 'admin-visible',
             component: () => import('#/views/demos/access/admin-visible.vue'),
             meta: {
               authority: ['admin'],
@@ -76,7 +76,7 @@ const routes: RouteRecordRaw[] = [
           },
           {
             name: 'AccessUserVisibleDemo',
-            path: '/demos/access/user-visible',
+            path: 'user-visible',
             component: () => import('#/views/demos/access/user-visible.vue'),
             meta: {
               authority: ['user'],
@@ -93,11 +93,11 @@ const routes: RouteRecordRaw[] = [
           title: $t('demos.features.title'),
         },
         name: 'FeaturesDemos',
-        path: '/demos/features',
+        path: 'features',
         children: [
           {
             name: 'LoginExpiredDemo',
-            path: '/demos/features/login-expired',
+            path: 'login-expired',
             component: () =>
               import('#/views/demos/features/login-expired/index.vue'),
             meta: {
@@ -107,7 +107,7 @@ const routes: RouteRecordRaw[] = [
           },
           {
             name: 'IconsDemo',
-            path: '/demos/features/icons',
+            path: 'icons',
             component: () => import('#/views/demos/features/icons/index.vue'),
             meta: {
               icon: 'lucide:annoyed',
@@ -116,7 +116,7 @@ const routes: RouteRecordRaw[] = [
           },
           {
             name: 'WatermarkDemo',
-            path: '/demos/features/watermark',
+            path: 'watermark',
             component: () =>
               import('#/views/demos/features/watermark/index.vue'),
             meta: {
@@ -124,9 +124,19 @@ const routes: RouteRecordRaw[] = [
               title: $t('demos.features.watermark'),
             },
           },
+          {
+            name: 'PreferencesExtensionDemo',
+            path: 'preferences-extension',
+            component: () =>
+              import('#/views/demos/features/preferences-extension/index.vue'),
+            meta: {
+              icon: 'lucide:sliders-horizontal',
+              title: $t('demos.features.preferencesExtension'),
+            },
+          },
           {
             name: 'FeatureTabsDemo',
-            path: '/demos/features/tabs',
+            path: 'tabs',
             component: () => import('#/views/demos/features/tabs/index.vue'),
             meta: {
               icon: 'lucide:app-window',
@@ -135,7 +145,7 @@ const routes: RouteRecordRaw[] = [
           },
           {
             name: 'FeatureTabDetailDemo',
-            path: '/demos/features/tabs/detail/:id',
+            path: 'detail/:id',
             component: () =>
               import('#/views/demos/features/tabs/tab-detail.vue'),
             meta: {
@@ -147,9 +157,7 @@ const routes: RouteRecordRaw[] = [
           },
           {
             name: 'HideChildrenInMenuParentDemo',
-            path: '/demos/features/hide-menu-children',
-            component: () =>
-              import('#/views/demos/features/hide-menu-children/parent.vue'),
+            path: 'hide-menu-children',
             meta: {
               hideChildrenInMenu: true,
               icon: 'ic:round-menu',
@@ -160,28 +168,27 @@ const routes: RouteRecordRaw[] = [
                 name: 'HideChildrenInMenuDemo',
                 path: '',
                 component: () =>
-                  import(
-                    '#/views/demos/features/hide-menu-children/children.vue'
-                  ),
+                  import('#/views/demos/features/hide-menu-children/parent.vue'),
                 meta: {
-                  hideInMenu: true,
+                  // hideInMenu: true,
                   title: $t('demos.features.hideChildrenInMenu'),
                 },
               },
               {
                 name: 'HideChildrenInMenuChildrenDemo',
-                path: '/demos/features/hide-menu-children/children',
+                path: 'children',
                 component: () =>
-                  import(
-                    '#/views/demos/features/hide-menu-children/children.vue'
-                  ),
-                meta: { title: $t('demos.features.hideChildrenInMenu') },
+                  import('#/views/demos/features/hide-menu-children/children.vue'),
+                meta: {
+                  activePath: '/demos/features/hide-menu-children',
+                  title: $t('demos.features.hideChildrenInMenu'),
+                },
               },
             ],
           },
           {
             name: 'FullScreenDemo',
-            path: '/demos/features/full-screen',
+            path: 'full-screen',
             component: () =>
               import('#/views/demos/features/full-screen/index.vue'),
             meta: {
@@ -191,7 +198,7 @@ const routes: RouteRecordRaw[] = [
           },
           {
             name: 'FileDownloadDemo',
-            path: '/demos/features/file-download',
+            path: 'file-download',
             component: () =>
               import('#/views/demos/features/file-download/index.vue'),
             meta: {
@@ -201,7 +208,7 @@ const routes: RouteRecordRaw[] = [
           },
           {
             name: 'ClipboardDemo',
-            path: '/demos/features/clipboard',
+            path: 'clipboard',
             component: () =>
               import('#/views/demos/features/clipboard/index.vue'),
             meta: {
@@ -211,7 +218,7 @@ const routes: RouteRecordRaw[] = [
           },
           {
             name: 'MenuQueryDemo',
-            path: '/demos/menu-query',
+            path: 'menu-query',
             component: () =>
               import('#/views/demos/features/menu-query/index.vue'),
             meta: {
@@ -224,7 +231,7 @@ const routes: RouteRecordRaw[] = [
           },
           {
             name: 'NewWindowDemo',
-            path: '/demos/new-window',
+            path: 'new-window',
             component: () =>
               import('#/views/demos/features/new-window/index.vue'),
             meta: {
@@ -235,7 +242,7 @@ const routes: RouteRecordRaw[] = [
           },
           {
             name: 'VueQueryDemo',
-            path: '/demos/features/vue-query',
+            path: 'vue-query',
             component: () =>
               import('#/views/demos/features/vue-query/index.vue'),
             meta: {
@@ -243,12 +250,32 @@ const routes: RouteRecordRaw[] = [
               title: 'Tanstack Query',
             },
           },
+          {
+            name: 'RequestParamsSerializerDemo',
+            path: 'request-params-serializer',
+            component: () =>
+              import('#/views/demos/features/request-params-serializer/index.vue'),
+            meta: {
+              icon: 'lucide:git-pull-request-arrow',
+              title: $t('demos.features.requestParamsSerializer'),
+            },
+          },
+          {
+            name: 'BigIntDemo',
+            path: 'json-bigint',
+            component: () =>
+              import('#/views/demos/features/json-bigint/index.vue'),
+            meta: {
+              icon: 'lucide:grape',
+              title: 'JSON BigInt',
+            },
+          },
         ],
       },
       // 面包屑导航
       {
         name: 'BreadcrumbDemos',
-        path: '/demos/breadcrumb',
+        path: 'breadcrumb',
         meta: {
           icon: 'lucide:navigation',
           title: $t('demos.breadcrumb.navigation'),
@@ -256,7 +283,7 @@ const routes: RouteRecordRaw[] = [
         children: [
           {
             name: 'BreadcrumbLateralDemo',
-            path: '/demos/breadcrumb/lateral',
+            path: 'lateral',
             component: () => import('#/views/demos/breadcrumb/lateral.vue'),
             meta: {
               icon: 'lucide:navigation',
@@ -265,7 +292,7 @@ const routes: RouteRecordRaw[] = [
           },
           {
             name: 'BreadcrumbLateralDetailDemo',
-            path: '/demos/breadcrumb/lateral-detail',
+            path: 'lateral-detail',
             component: () =>
               import('#/views/demos/breadcrumb/lateral-detail.vue'),
             meta: {
@@ -276,7 +303,7 @@ const routes: RouteRecordRaw[] = [
           },
           {
             name: 'BreadcrumbLevelDemo',
-            path: '/demos/breadcrumb/level',
+            path: 'level',
             meta: {
               icon: 'lucide:navigation',
               title: $t('demos.breadcrumb.level'),
@@ -284,7 +311,7 @@ const routes: RouteRecordRaw[] = [
             children: [
               {
                 name: 'BreadcrumbLevelDetailDemo',
-                path: '/demos/breadcrumb/level/detail',
+                path: 'detail',
                 component: () =>
                   import('#/views/demos/breadcrumb/level-detail.vue'),
                 meta: {
@@ -302,11 +329,11 @@ const routes: RouteRecordRaw[] = [
           title: $t('demos.fallback.title'),
         },
         name: 'FallbackDemos',
-        path: '/demos/fallback',
+        path: 'fallback',
         children: [
           {
             name: 'Fallback403Demo',
-            path: '/demos/fallback/403',
+            path: '403',
             component: () => import('#/views/_core/fallback/forbidden.vue'),
             meta: {
               icon: 'mdi:do-not-disturb-alt',
@@ -315,7 +342,7 @@ const routes: RouteRecordRaw[] = [
           },
           {
             name: 'Fallback404Demo',
-            path: '/demos/fallback/404',
+            path: '404',
             component: () => import('#/views/_core/fallback/not-found.vue'),
             meta: {
               icon: 'mdi:table-off',
@@ -324,7 +351,7 @@ const routes: RouteRecordRaw[] = [
           },
           {
             name: 'Fallback500Demo',
-            path: '/demos/fallback/500',
+            path: '500',
             component: () =>
               import('#/views/_core/fallback/internal-error.vue'),
             meta: {
@@ -334,7 +361,7 @@ const routes: RouteRecordRaw[] = [
           },
           {
             name: 'FallbackOfflineDemo',
-            path: '/demos/fallback/offline',
+            path: 'offline',
             component: () => import('#/views/_core/fallback/offline.vue'),
             meta: {
               icon: 'mdi:offline',
@@ -352,12 +379,12 @@ const routes: RouteRecordRaw[] = [
           title: $t('demos.badge.title'),
         },
         name: 'BadgeDemos',
-        path: '/demos/badge',
+        path: 'badge',
         children: [
           {
             name: 'BadgeDotDemo',
             component: () => import('#/views/demos/badge/index.vue'),
-            path: '/demos/badge/dot',
+            path: 'dot',
             meta: {
               badgeType: 'dot',
               icon: 'lucide:square-dot',
@@ -367,7 +394,7 @@ const routes: RouteRecordRaw[] = [
           {
             name: 'BadgeTextDemo',
             component: () => import('#/views/demos/badge/index.vue'),
-            path: '/demos/badge/text',
+            path: 'text',
             meta: {
               badge: '10',
               icon: 'lucide:square-dot',
@@ -377,7 +404,7 @@ const routes: RouteRecordRaw[] = [
           {
             name: 'BadgeColorDemo',
             component: () => import('#/views/demos/badge/index.vue'),
-            path: '/demos/badge/color',
+            path: 'color',
             meta: {
               badge: 'Hot',
               badgeVariants: 'destructive',
@@ -395,12 +422,12 @@ const routes: RouteRecordRaw[] = [
           title: $t('demos.activeIcon.title'),
         },
         name: 'ActiveIconDemos',
-        path: '/demos/active-icon',
+        path: 'active-icon',
         children: [
           {
             name: 'ActiveIconDemo',
             component: () => import('#/views/demos/active-icon/index.vue'),
-            path: '/demos/active-icon/children',
+            path: 'children',
             meta: {
               activeIcon: 'fluent-emoji:radioactive',
               icon: 'bi:radioactive',
@@ -416,11 +443,11 @@ const routes: RouteRecordRaw[] = [
           title: $t('demos.outside.title'),
         },
         name: 'OutsideDemos',
-        path: '/demos/outside',
+        path: 'outside',
         children: [
           {
             name: 'IframeDemos',
-            path: '/demos/outside/iframe',
+            path: 'iframe',
             meta: {
               icon: 'mdi:newspaper-variant-outline',
               title: $t('demos.outside.embedded'),
@@ -428,7 +455,7 @@ const routes: RouteRecordRaw[] = [
             children: [
               {
                 name: 'VueDocumentDemo',
-                path: '/demos/outside/iframe/vue-document',
+                path: 'vue-document',
                 component: IFrameView,
                 meta: {
                   icon: 'logos:vue',
@@ -439,7 +466,7 @@ const routes: RouteRecordRaw[] = [
               },
               {
                 name: 'TailwindcssDemo',
-                path: '/demos/outside/iframe/tailwindcss',
+                path: 'tailwindcss',
                 component: IFrameView,
                 meta: {
                   icon: 'devicon:tailwindcss',
@@ -452,7 +479,7 @@ const routes: RouteRecordRaw[] = [
           },
           {
             name: 'ExternalLinkDemos',
-            path: '/demos/outside/external-link',
+            path: 'external-link',
             meta: {
               icon: 'mdi:newspaper-variant-multiple-outline',
               title: $t('demos.outside.externalLink'),
@@ -460,7 +487,7 @@ const routes: RouteRecordRaw[] = [
             children: [
               {
                 name: 'ViteDemo',
-                path: '/demos/outside/external-link/vite',
+                path: 'vite',
                 component: IFrameView,
                 meta: {
                   icon: 'logos:vitejs',
@@ -470,7 +497,7 @@ const routes: RouteRecordRaw[] = [
               },
               {
                 name: 'VueUseDemo',
-                path: '/demos/outside/external-link/vue-use',
+                path: 'vue-use',
                 component: IFrameView,
                 meta: {
                   icon: 'logos:vueuse',
@@ -489,11 +516,11 @@ const routes: RouteRecordRaw[] = [
           title: $t('demos.nested.title'),
         },
         name: 'NestedDemos',
-        path: '/demos/nested',
+        path: 'nested',
         children: [
           {
             name: 'Menu1Demo',
-            path: '/demos/nested/menu1',
+            path: 'menu1',
             component: () => import('#/views/demos/nested/menu-1.vue'),
             meta: {
               icon: 'ic:round-menu',
@@ -503,7 +530,7 @@ const routes: RouteRecordRaw[] = [
           },
           {
             name: 'Menu2Demo',
-            path: '/demos/nested/menu2',
+            path: 'menu2',
             meta: {
               icon: 'ic:round-menu',
               keepAlive: true,
@@ -512,7 +539,7 @@ const routes: RouteRecordRaw[] = [
             children: [
               {
                 name: 'Menu21Demo',
-                path: '/demos/nested/menu2/menu2-1',
+                path: 'menu2-1',
                 component: () => import('#/views/demos/nested/menu-2-1.vue'),
                 meta: {
                   icon: 'ic:round-menu',
@@ -524,7 +551,7 @@ const routes: RouteRecordRaw[] = [
           },
           {
             name: 'Menu3Demo',
-            path: '/demos/nested/menu3',
+            path: 'menu3',
             meta: {
               icon: 'ic:round-menu',
               title: $t('demos.nested.menu3'),
@@ -550,7 +577,7 @@ const routes: RouteRecordRaw[] = [
                 children: [
                   {
                     name: 'Menu321Demo',
-                    path: '/demos/nested/menu3/menu3-2/menu3-2-1',
+                    path: 'menu3-2-1',
                     component: () =>
                       import('#/views/demos/nested/menu-3-2-1.vue'),
                     meta: {
diff --git a/playground/src/router/routes/modules/examples.ts b/playground/src/router/routes/modules/examples.ts
index b02bc4da..8c8b5aae 100644
--- a/playground/src/router/routes/modules/examples.ts
+++ b/playground/src/router/routes/modules/examples.ts
@@ -1,11 +1,9 @@
 import type { RouteRecordRaw } from 'vue-router';
 
-import { BasicLayout } from '#/layouts';
 import { $t } from '#/locales';
 
 const routes: RouteRecordRaw[] = [
   {
-    component: BasicLayout,
     meta: {
       icon: 'ion:layers-outline',
       keepAlive: true,
@@ -17,7 +15,7 @@ const routes: RouteRecordRaw[] = [
     children: [
       {
         name: 'FormExample',
-        path: '/examples/form',
+        path: 'form',
         meta: {
           icon: 'mdi:form-select',
           title: $t('examples.form.title'),
@@ -25,7 +23,7 @@ const routes: RouteRecordRaw[] = [
         children: [
           {
             name: 'FormBasicExample',
-            path: '/examples/form/basic',
+            path: 'basic',
             component: () => import('#/views/examples/form/basic.vue'),
             meta: {
               title: $t('examples.form.basic'),
@@ -33,15 +31,23 @@ const routes: RouteRecordRaw[] = [
           },
           {
             name: 'FormQueryExample',
-            path: '/examples/form/query',
+            path: 'query',
             component: () => import('#/views/examples/form/query.vue'),
             meta: {
               title: $t('examples.form.query'),
             },
           },
+          {
+            name: 'FormValueFormatExample',
+            path: 'value-format',
+            component: () => import('#/views/examples/form/value-format.vue'),
+            meta: {
+              title: $t('examples.form.valueFormat'),
+            },
+          },
           {
             name: 'FormRulesExample',
-            path: '/examples/form/rules',
+            path: 'rules',
             component: () => import('#/views/examples/form/rules.vue'),
             meta: {
               title: $t('examples.form.rules'),
@@ -49,15 +55,23 @@ const routes: RouteRecordRaw[] = [
           },
           {
             name: 'FormDynamicExample',
-            path: '/examples/form/dynamic',
+            path: 'dynamic',
             component: () => import('#/views/examples/form/dynamic.vue'),
             meta: {
               title: $t('examples.form.dynamic'),
             },
           },
+          {
+            name: 'FormLayoutExample',
+            path: 'custom-layout',
+            component: () => import('#/views/examples/form/custom-layout.vue'),
+            meta: {
+              title: $t('examples.form.layout'),
+            },
+          },
           {
             name: 'FormCustomExample',
-            path: '/examples/form/custom',
+            path: 'custom',
             component: () => import('#/views/examples/form/custom.vue'),
             meta: {
               title: $t('examples.form.custom'),
@@ -65,7 +79,7 @@ const routes: RouteRecordRaw[] = [
           },
           {
             name: 'FormApiExample',
-            path: '/examples/form/api',
+            path: 'api',
             component: () => import('#/views/examples/form/api.vue'),
             meta: {
               title: $t('examples.form.api'),
@@ -73,17 +87,43 @@ const routes: RouteRecordRaw[] = [
           },
           {
             name: 'FormMergeExample',
-            path: '/examples/form/merge',
+            path: 'merge',
             component: () => import('#/views/examples/form/merge.vue'),
             meta: {
               title: $t('examples.form.merge'),
             },
           },
+          {
+            name: 'FormScrollToErrorExample',
+            path: 'scroll-to-error-test',
+            component: () =>
+              import('#/views/examples/form/scroll-to-error-test.vue'),
+            meta: {
+              title: $t('examples.form.scrollToError'),
+            },
+          },
+          {
+            name: 'FormCollapsibleExample',
+            path: 'collapsible-test',
+            component: () => import('#/views/examples/form/collapsible.vue'),
+            meta: {
+              title: $t('examples.form.collapsible'),
+            },
+          },
+          {
+            name: 'FormArrayDemo',
+            path: '/form-array-demo',
+            component: () => import('#/views/demos/form-array/index.vue'),
+            meta: {
+              icon: 'lucide:list-plus',
+              title: '表单数组 Demo',
+            },
+          },
         ],
       },
       {
         name: 'VxeTableExample',
-        path: '/examples/vxe-table',
+        path: 'vxe-table',
         meta: {
           icon: 'lucide:table',
           title: $t('examples.vxeTable.title'),
@@ -91,7 +131,7 @@ const routes: RouteRecordRaw[] = [
         children: [
           {
             name: 'VxeTableBasicExample',
-            path: '/examples/vxe-table/basic',
+            path: 'basic',
             component: () => import('#/views/examples/vxe-table/basic.vue'),
             meta: {
               title: $t('examples.vxeTable.basic'),
@@ -99,7 +139,7 @@ const routes: RouteRecordRaw[] = [
           },
           {
             name: 'VxeTableRemoteExample',
-            path: '/examples/vxe-table/remote',
+            path: 'remote',
             component: () => import('#/views/examples/vxe-table/remote.vue'),
             meta: {
               title: $t('examples.vxeTable.remote'),
@@ -107,7 +147,7 @@ const routes: RouteRecordRaw[] = [
           },
           {
             name: 'VxeTableTreeExample',
-            path: '/examples/vxe-table/tree',
+            path: 'tree',
             component: () => import('#/views/examples/vxe-table/tree.vue'),
             meta: {
               title: $t('examples.vxeTable.tree'),
@@ -115,7 +155,7 @@ const routes: RouteRecordRaw[] = [
           },
           {
             name: 'VxeTableFixedExample',
-            path: '/examples/vxe-table/fixed',
+            path: 'fixed',
             component: () => import('#/views/examples/vxe-table/fixed.vue'),
             meta: {
               title: $t('examples.vxeTable.fixed'),
@@ -123,7 +163,7 @@ const routes: RouteRecordRaw[] = [
           },
           {
             name: 'VxeTableCustomCellExample',
-            path: '/examples/vxe-table/custom-cell',
+            path: 'custom-cell',
             component: () =>
               import('#/views/examples/vxe-table/custom-cell.vue'),
             meta: {
@@ -132,7 +172,7 @@ const routes: RouteRecordRaw[] = [
           },
           {
             name: 'VxeTableFormExample',
-            path: '/examples/vxe-table/form',
+            path: 'form',
             component: () => import('#/views/examples/vxe-table/form.vue'),
             meta: {
               title: $t('examples.vxeTable.form'),
@@ -140,7 +180,7 @@ const routes: RouteRecordRaw[] = [
           },
           {
             name: 'VxeTableEditCellExample',
-            path: '/examples/vxe-table/edit-cell',
+            path: 'edit-cell',
             component: () => import('#/views/examples/vxe-table/edit-cell.vue'),
             meta: {
               title: $t('examples.vxeTable.editCell'),
@@ -148,7 +188,7 @@ const routes: RouteRecordRaw[] = [
           },
           {
             name: 'VxeTableEditRowExample',
-            path: '/examples/vxe-table/edit-row',
+            path: 'edit-row',
             component: () => import('#/views/examples/vxe-table/edit-row.vue'),
             meta: {
               title: $t('examples.vxeTable.editRow'),
@@ -156,17 +196,25 @@ const routes: RouteRecordRaw[] = [
           },
           {
             name: 'VxeTableVirtualExample',
-            path: '/examples/vxe-table/virtual',
+            path: 'virtual',
             component: () => import('#/views/examples/vxe-table/virtual.vue'),
             meta: {
               title: $t('examples.vxeTable.virtual'),
             },
           },
+          {
+            name: 'VxeTableViewedExample',
+            path: 'viewed',
+            component: () => import('#/views/examples/vxe-table/viewed.vue'),
+            meta: {
+              title: $t('examples.vxeTable.viewed'),
+            },
+          },
         ],
       },
       {
         name: 'CaptchaExample',
-        path: '/examples/captcha',
+        path: 'captcha',
         meta: {
           icon: 'logos:recaptcha',
           title: $t('examples.captcha.title'),
@@ -174,7 +222,7 @@ const routes: RouteRecordRaw[] = [
         children: [
           {
             name: 'DragVerifyExample',
-            path: '/examples/captcha/slider',
+            path: 'slider',
             component: () =>
               import('#/views/examples/captcha/slider-captcha.vue'),
             meta: {
@@ -183,16 +231,25 @@ const routes: RouteRecordRaw[] = [
           },
           {
             name: 'RotateVerifyExample',
-            path: '/examples/captcha/slider-rotate',
+            path: 'slider-rotate',
             component: () =>
               import('#/views/examples/captcha/slider-rotate-captcha.vue'),
             meta: {
               title: $t('examples.captcha.sliderRotateCaptcha'),
             },
           },
+          {
+            name: 'TranslateVerifyExample',
+            path: 'slider-translate',
+            component: () =>
+              import('#/views/examples/captcha/slider-translate-captcha.vue'),
+            meta: {
+              title: $t('examples.captcha.sliderTranslateCaptcha'),
+            },
+          },
           {
             name: 'CaptchaPointSelectionExample',
-            path: '/examples/captcha/point-selection',
+            path: 'point-selection',
             component: () =>
               import('#/views/examples/captcha/point-selection-captcha.vue'),
             meta: {
@@ -203,25 +260,27 @@ const routes: RouteRecordRaw[] = [
       },
       {
         name: 'ModalExample',
-        path: '/examples/modal',
+        path: 'modal',
         component: () => import('#/views/examples/modal/index.vue'),
         meta: {
           icon: 'system-uicons:window-content',
+          keepAlive: true,
           title: $t('examples.modal.title'),
         },
       },
       {
         name: 'DrawerExample',
-        path: '/examples/drawer',
+        path: 'drawer',
         component: () => import('#/views/examples/drawer/index.vue'),
         meta: {
           icon: 'iconoir:drawer',
+          keepAlive: true,
           title: $t('examples.drawer.title'),
         },
       },
       {
         name: 'EllipsisExample',
-        path: '/examples/ellipsis',
+        path: 'ellipsis',
         component: () => import('#/views/examples/ellipsis/index.vue'),
         meta: {
           icon: 'ion:ellipsis-horizontal',
@@ -230,7 +289,7 @@ const routes: RouteRecordRaw[] = [
       },
       {
         name: 'VueResizeDemo',
-        path: '/demos/resize/basic',
+        path: 'resize/basic',
         component: () => import('#/views/examples/resize/basic.vue'),
         meta: {
           icon: 'material-symbols:resize',
@@ -239,7 +298,7 @@ const routes: RouteRecordRaw[] = [
       },
       {
         name: 'ColPageDemo',
-        path: '/examples/layout/col-page',
+        path: 'layout/col-page',
         component: () => import('#/views/examples/layout/col-page.vue'),
         meta: {
           badge: 'Alpha',
@@ -248,6 +307,87 @@ const routes: RouteRecordRaw[] = [
           title: $t('examples.layout.col-page'),
         },
       },
+      {
+        name: 'TippyDemo',
+        path: 'tippy',
+        component: () => import('#/views/examples/tippy/index.vue'),
+        meta: {
+          icon: 'mdi:message-settings-outline',
+          title: 'Tippy',
+        },
+      },
+      {
+        name: 'JsonViewer',
+        path: 'json-viewer',
+        component: () => import('#/views/examples/json-viewer/index.vue'),
+        meta: {
+          icon: 'tabler:json',
+          title: 'JsonViewer',
+        },
+      },
+      {
+        name: 'Motion',
+        path: 'motion',
+        component: () => import('#/views/examples/motion/index.vue'),
+        meta: {
+          icon: 'mdi:animation-play',
+          title: 'Motion',
+        },
+      },
+      {
+        name: 'CountTo',
+        path: 'count-to',
+        component: () => import('#/views/examples/count-to/index.vue'),
+        meta: {
+          icon: 'mdi:animation-play',
+          title: 'CountTo',
+        },
+      },
+      {
+        name: 'Loading',
+        path: 'loading',
+        component: () => import('#/views/examples/loading/index.vue'),
+        meta: {
+          icon: 'mdi:circle-double',
+          title: 'Loading',
+        },
+      },
+      {
+        name: 'ButtonGroup',
+        path: 'button-group',
+        component: () => import('#/views/examples/button-group/index.vue'),
+        meta: {
+          icon: 'mdi:check-circle',
+          title: $t('examples.button-group.title'),
+        },
+      },
+      {
+        name: 'ContextMenu',
+        path: 'context-menu',
+        component: () => import('#/views/examples/context-menu/index.vue'),
+        meta: {
+          icon: 'mdi:menu',
+          title: $t('examples.function.contentMenu'),
+        },
+      },
+      {
+        name: 'CropperDemo',
+        path: 'cropper',
+        component: () => import('#/views/examples/cropper/index.vue'),
+        meta: {
+          icon: 'mdi:crop',
+          title: $t('examples.cropper.title'),
+        },
+      },
+      {
+        name: 'TiptapExample',
+        path: 'tiptap',
+        component: () => import('#/views/examples/tiptap/index.vue'),
+        meta: {
+          icon: 'lucide:square-pen',
+          title: $t('examples.tiptap.title'),
+        },
+      },
     ],
   },
 ];
diff --git a/playground/src/router/routes/modules/system.ts b/playground/src/router/routes/modules/system.ts
new file mode 100644
index 00000000..371bfed1
--- /dev/null
+++ b/playground/src/router/routes/modules/system.ts
@@ -0,0 +1,55 @@
+import type { RouteRecordRaw } from 'vue-router';
+
+import { $t } from '#/locales';
+
+const routes: RouteRecordRaw[] = [
+  {
+    meta: {
+      icon: 'ion:settings-outline',
+      order: 9997,
+      title: $t('system.title'),
+    },
+    name: 'System',
+    path: '/system',
+    children: [
+      {
+        path: 'user',
+        name: 'SystemUser',
+        meta: {
+          icon: 'mdi:user',
+          title: $t('system.user.title'),
+        },
+        component: () => import('#/views/system/user/list.vue'),
+      },
+      {
+        path: 'role',
+        name: 'SystemRole',
+        meta: {
+          icon: 'mdi:account-group',
+          title: $t('system.role.title'),
+        },
+        component: () => import('#/views/system/role/list.vue'),
+      },
+      {
+        path: 'menu',
+        name: 'SystemMenu',
+        meta: {
+          icon: 'mdi:menu',
+          title: $t('system.menu.title'),
+        },
+        component: () => import('#/views/system/menu/list.vue'),
+      },
+      {
+        path: 'dept',
+        name: 'SystemDept',
+        meta: {
+          icon: 'charm:organisation',
+          title: $t('system.dept.title'),
+        },
+        component: () => import('#/views/system/dept/list.vue'),
+      },
+    ],
+  },
+];
+
+export default routes;
diff --git a/playground/src/router/routes/modules/vben.ts b/playground/src/router/routes/modules/vben.ts
index 2f2eb660..5dee04c8 100644
--- a/playground/src/router/routes/modules/vben.ts
+++ b/playground/src/router/routes/modules/vben.ts
@@ -2,41 +2,37 @@ import type { RouteRecordRaw } from 'vue-router';
 
 import {
   VBEN_ANT_PREVIEW_URL,
+  VBEN_ANTDV_NEXT_PREVIEW_URL,
   VBEN_DOC_URL,
   VBEN_ELE_PREVIEW_URL,
   VBEN_GITHUB_URL,
   VBEN_LOGO_URL,
   VBEN_NAIVE_PREVIEW_URL,
+  VBEN_TD_PREVIEW_URL,
 } from '@vben/constants';
-import { SvgAntdvLogoIcon } from '@vben/icons';
+import {
+  SvgAntdvLogoIcon,
+  SvgAntdvNextLogoIcon,
+  SvgTDesignIcon,
+} from '@vben/icons';
 
-import { BasicLayout, IFrameView } from '#/layouts';
+import { IFrameView } from '#/layouts';
 import { $t } from '#/locales';
 
 const routes: RouteRecordRaw[] = [
   {
-    component: BasicLayout,
     meta: {
       badgeType: 'dot',
       icon: VBEN_LOGO_URL,
-      order: 9999,
+      order: 9998,
       title: $t('demos.vben.title'),
     },
     name: 'VbenProject',
     path: '/vben-admin',
     children: [
-      {
-        name: 'VbenAbout',
-        path: '/vben-admin/about',
-        component: () => import('#/views/_core/about/index.vue'),
-        meta: {
-          icon: 'lucide:copyright',
-          title: $t('demos.vben.about'),
-        },
-      },
       {
         name: 'VbenDocument',
-        path: '/vben-admin/document',
+        path: 'document',
         component: IFrameView,
         meta: {
           icon: 'lucide:book-open-text',
@@ -46,7 +42,7 @@ const routes: RouteRecordRaw[] = [
       },
       {
         name: 'VbenGithub',
-        path: '/vben-admin/github',
+        path: 'github',
         component: IFrameView,
         meta: {
           icon: 'mdi:github',
@@ -56,7 +52,7 @@ const routes: RouteRecordRaw[] = [
       },
       {
         name: 'VbenAntdv',
-        path: '/vben-admin/antdv',
+        path: 'antdv',
         component: IFrameView,
         meta: {
           badgeType: 'dot',
@@ -65,9 +61,21 @@ const routes: RouteRecordRaw[] = [
           title: $t('demos.vben.antdv'),
         },
       },
+      {
+        name: 'VbenAntdVNext',
+        path: 'antdv-next',
+        component: IFrameView,
+        meta: {
+          badgeType: 'dot',
+          icon: SvgAntdvNextLogoIcon,
+          link: VBEN_ANTDV_NEXT_PREVIEW_URL,
+          title: $t('demos.vben.antdv-next'),
+        },
+      },
+
       {
         name: 'VbenNaive',
-        path: '/vben-admin/naive',
+        path: 'naive',
         component: IFrameView,
         meta: {
           badgeType: 'dot',
@@ -78,7 +86,7 @@ const routes: RouteRecordRaw[] = [
       },
       {
         name: 'VbenElementPlus',
-        path: '/vben-admin/ele',
+        path: 'ele',
         component: IFrameView,
         meta: {
           badgeType: 'dot',
@@ -87,8 +95,39 @@ const routes: RouteRecordRaw[] = [
           title: $t('demos.vben.element-plus'),
         },
       },
+      {
+        name: 'VbenTDesign',
+        path: 'tdesign',
+        component: IFrameView,
+        meta: {
+          badgeType: 'dot',
+          icon: SvgTDesignIcon,
+          link: VBEN_TD_PREVIEW_URL,
+          title: $t('demos.vben.tdesign'),
+        },
+      },
     ],
   },
+  {
+    component: () => import('#/views/_core/about/index.vue'),
+    meta: {
+      icon: 'lucide:copyright',
+      order: 9999,
+      title: $t('demos.vben.about'),
+    },
+    name: 'VbenAbout',
+    path: '/vben-admin/about',
+  },
+  {
+    name: 'Profile',
+    path: '/profile',
+    component: () => import('#/views/_core/profile/index.vue'),
+    meta: {
+      icon: 'lucide:user',
+      hideInMenu: true,
+      title: $t('page.auth.profile'),
+    },
+  },
 ];
 
 export default routes;
diff --git a/playground/src/store/auth.ts b/playground/src/store/auth.ts
index b7a2d044..44831158 100644
--- a/playground/src/store/auth.ts
+++ b/playground/src/store/auth.ts
@@ -4,9 +4,10 @@ import { ref } from 'vue';
 import { useRouter } from 'vue-router';
 
 import { DEFAULT_HOME_PATH, LOGIN_PATH } from '@vben/constants';
+import { preferences } from '@vben/preferences';
 import { resetAllStores, useAccessStore, useUserStore } from '@vben/stores';
 
-import { notification } from 'ant-design-vue';
+import { notification } from 'antdv-next';
 import { defineStore } from 'pinia';
 
 import { getAccessCodesApi, getUserInfoApi, loginApi, logoutApi } from '#/api';
@@ -62,7 +63,7 @@ export const useAuthStore = defineStore('auth', () => {
           notification.success({
             description: `${$t('authentication.loginSuccessDesc')}:${userInfo?.nick_name}`,
             duration: 3,
-            message: $t('authentication.loginSuccess'),
+            title: $t('authentication.loginSuccess'),
           });
         }
       }
@@ -75,15 +76,22 @@ export const useAuthStore = defineStore('auth', () => {
     };
   }
 
+  const isLoggingOut = ref(false); // 正在 logout 标识, 防止 /logout 死循环.
+
   async function logout(redirect: boolean = true) {
+    if (isLoggingOut.value) return; // 正在登出中, 说明已进入循环, 直接返回.
+    isLoggingOut.value = true; // 设置 标识
+
     try {
       await logoutApi();
     } catch {
       // 不做任何处理
-    }
+    } finally {
+      isLoggingOut.value = false; // 重置 标识
 
-    resetAllStores();
-    accessStore.setLoginExpired(false);
+      resetAllStores();
+      accessStore.setLoginExpired(false);
+    }
 
     // 回登录页带上当前路由地址
     await router.replace({
@@ -97,8 +105,7 @@ export const useAuthStore = defineStore('auth', () => {
   }
 
   async function fetchUserInfo() {
-    let userInfo: null | UserInfo = null;
-    userInfo = await getUserInfoApi();
+    const userInfo = await getUserInfoApi();
     userStore.setUserInfo(userInfo);
     return userInfo;
   }
diff --git a/playground/src/timezone-init.ts b/playground/src/timezone-init.ts
new file mode 100644
index 00000000..1d82bd47
--- /dev/null
+++ b/playground/src/timezone-init.ts
@@ -0,0 +1,20 @@
+import { setTimezoneHandler } from '@vben/stores';
+
+import { getTimezoneApi, getTimezoneOptionsApi, setTimezoneApi } from '#/api';
+
+/**
+ * 初始化时区处理，通过API保存时区设置
+ */
+export function initTimezone() {
+  setTimezoneHandler({
+    getTimezone() {
+      return getTimezoneApi();
+    },
+    setTimezone(timezone: string) {
+      return setTimezoneApi(timezone);
+    },
+    getTimezoneOptions() {
+      return getTimezoneOptionsApi();
+    },
+  });
+}
diff --git a/playground/src/utils/date-range-codec.ts b/playground/src/utils/date-range-codec.ts
new file mode 100644
index 00000000..4b4b0e51
--- /dev/null
+++ b/playground/src/utils/date-range-codec.ts
@@ -0,0 +1,81 @@
+import type { Dayjs } from 'dayjs';
+
+import dayjs from 'dayjs';
+
+type DateRange = [Dayjs, Dayjs];
+
+type OptionalDateRangeField<
+  TFormValues extends Record<string, unknown>,
+  TRangeField extends keyof TFormValues,
+> =
+  Record<never, never> extends Pick<TFormValues, TRangeField>
+    ? [Exclude<TFormValues[TRangeField], undefined>] extends [never]
+      ? never
+      : Exclude<TFormValues[TRangeField], undefined> extends DateRange
+        ? TRangeField
+        : never
+    : never;
+
+type DateRangeSubmitValues<
+  TFormValues extends Record<string, unknown>,
+  TRangeField extends keyof TFormValues,
+  TStartField extends string,
+  TEndField extends string,
+> = Omit<TFormValues, TRangeField> &
+  Record<TEndField | TStartField, string | undefined>;
+
+interface DateRangeCodecOptions<
+  TFormValues extends Record<string, unknown>,
+  TRangeField extends keyof TFormValues & string,
+  TStartField extends string,
+  TEndField extends string,
+> {
+  endField: TEndField;
+  rangeField: OptionalDateRangeField<TFormValues, TRangeField> & TRangeField;
+  startField: TStartField;
+}
+
+export function createDateRangeCodec<
+  TFormValues extends Record<string, unknown>,
+>() {
+  return function createCodec<
+    TRangeField extends keyof TFormValues & string,
+    TStartField extends string,
+    TEndField extends string,
+  >(
+    options: DateRangeCodecOptions<
+      TFormValues,
+      TRangeField,
+      TStartField,
+      TEndField
+    >,
+  ) {
+    const { endField, startField } = options;
+    const rangeField = options.rangeField as TRangeField;
+    type SubmitValues = DateRangeSubmitValues<
+      TFormValues,
+      TRangeField,
+      TStartField,
+      TEndField
+    >;
+
+    return {
+      decode(values: Readonly<SubmitValues>): TFormValues {
+        const { [endField]: end, [startField]: start, ...formValues } = values;
+        return {
+          ...formValues,
+          ...(start && end ? { [rangeField]: [dayjs(start), dayjs(end)] } : {}),
+        } as TFormValues;
+      },
+      encode(values: Readonly<TFormValues>): SubmitValues {
+        const { [rangeField]: value, ...formValues } = values;
+        const range = value as DateRange | undefined;
+        return {
+          ...formValues,
+          [endField]: range?.[1]?.format('YYYY-MM-DD'),
+          [startField]: range?.[0]?.format('YYYY-MM-DD'),
+        } as SubmitValues;
+      },
+    };
+  };
+}
diff --git a/playground/src/views/_core/authentication/code-login.vue b/playground/src/views/_core/authentication/code-login.vue
index 3b50c626..5bd170c3 100644
--- a/playground/src/views/_core/authentication/code-login.vue
+++ b/playground/src/views/_core/authentication/code-login.vue
@@ -7,7 +7,7 @@ import { computed, ref, useTemplateRef } from 'vue';
 import { AuthenticationCodeLogin, z } from '@vben/common-ui';
 import { $t } from '@vben/locales';
 
-import { message } from 'ant-design-vue';
+import { message } from 'antdv-next';
 
 defineOptions({ name: 'CodeLogin' });
 
@@ -94,8 +94,7 @@ const formSchema = computed((): VbenFormSchema[] => {
  * @param values 登录表单数据
  */
 async function handleLogin(values: Recordable<any>) {
-  // eslint-disable-next-line no-console
-  console.log(values);
+  void values;
 }
 </script>
 
diff --git a/playground/src/views/_core/authentication/forget-password.vue b/playground/src/views/_core/authentication/forget-password.vue
index 34491113..9082cb95 100644
--- a/playground/src/views/_core/authentication/forget-password.vue
+++ b/playground/src/views/_core/authentication/forget-password.vue
@@ -28,8 +28,7 @@ const formSchema = computed((): VbenFormSchema[] => {
 });
 
 function handleSubmit(value: Record<string, any>) {
-  // eslint-disable-next-line no-console
-  console.log('reset email:', value);
+  void value;
 }
 </script>
 
diff --git a/playground/src/views/_core/authentication/login.vue b/playground/src/views/_core/authentication/login.vue
index 599d11e2..d252a820 100644
--- a/playground/src/views/_core/authentication/login.vue
+++ b/playground/src/views/_core/authentication/login.vue
@@ -1,8 +1,8 @@
 <script lang="ts" setup>
 import type { VbenFormSchema } from '@vben/common-ui';
-import type { BasicOption } from '@vben/types';
+import type { BasicOption, Recordable } from '@vben/types';
 
-import { computed, markRaw } from 'vue';
+import { computed, markRaw, useTemplateRef } from 'vue';
 
 import { AuthenticationLogin, SliderCaptcha, z } from '@vben/common-ui';
 import { $t } from '@vben/locales';
@@ -104,12 +104,29 @@ const formSchema = computed((): VbenFormSchema[] => {
     },
   ];
 });
+
+const loginRef =
+  useTemplateRef<InstanceType<typeof AuthenticationLogin>>('loginRef');
+
+async function onSubmit(params: Recordable<any>) {
+  authStore.authLogin(params).catch(() => {
+    // 登陆失败，刷新验证码的演示
+    const formApi = loginRef.value?.getFormApi();
+    // 重置验证码组件的值
+    formApi?.setFieldValue('captcha', false, false);
+    // 使用表单API获取验证码组件实例，并调用其resume方法来重置验证码
+    formApi
+      ?.getFieldComponentRef<InstanceType<typeof SliderCaptcha>>('captcha')
+      ?.resume();
+  });
+}
 </script>
 
 <template>
   <AuthenticationLogin
+    ref="loginRef"
     :form-schema="formSchema"
     :loading="authStore.loginLoading"
-    @submit="authStore.authLogin"
+    @submit="onSubmit"
   />
 </template>
diff --git a/playground/src/views/_core/authentication/register.vue b/playground/src/views/_core/authentication/register.vue
index b1a5de72..a1175357 100644
--- a/playground/src/views/_core/authentication/register.vue
+++ b/playground/src/views/_core/authentication/register.vue
@@ -46,7 +46,7 @@ const formSchema = computed((): VbenFormSchema[] => {
         rules(values) {
           const { password } = values;
           return z
-            .string({ required_error: $t('authentication.passwordTip') })
+            .string({ error: $t('authentication.passwordTip') })
             .min(1, { message: $t('authentication.passwordTip') })
             .refine((value) => value === password, {
               message: $t('authentication.confirmPasswordTip'),
@@ -82,8 +82,7 @@ const formSchema = computed((): VbenFormSchema[] => {
 });
 
 function handleSubmit(value: Recordable<any>) {
-  // eslint-disable-next-line no-console
-  console.log('register submit:', value);
+  void value;
 }
 </script>
 
diff --git a/playground/src/views/_core/profile/base-setting.vue b/playground/src/views/_core/profile/base-setting.vue
new file mode 100644
index 00000000..aa8a4c26
--- /dev/null
+++ b/playground/src/views/_core/profile/base-setting.vue
@@ -0,0 +1,65 @@
+<script setup lang="ts">
+import type { BasicOption } from '@vben/types';
+
+import type { VbenFormSchema } from '#/adapter/form';
+
+import { computed, onMounted, ref } from 'vue';
+
+import { ProfileBaseSetting } from '@vben/common-ui';
+
+import { getUserInfoApi } from '#/api';
+
+const profileBaseSettingRef = ref();
+
+const MOCK_ROLES_OPTIONS: BasicOption[] = [
+  {
+    label: '管理员',
+    value: 'super',
+  },
+  {
+    label: '用户',
+    value: 'user',
+  },
+  {
+    label: '测试',
+    value: 'test',
+  },
+];
+
+const formSchema = computed((): VbenFormSchema[] => {
+  return [
+    {
+      fieldName: 'realName',
+      component: 'Input',
+      label: '姓名',
+    },
+    {
+      fieldName: 'username',
+      component: 'Input',
+      label: '用户名',
+    },
+    {
+      fieldName: 'roles',
+      component: 'Select',
+      componentProps: {
+        mode: 'tags',
+        options: MOCK_ROLES_OPTIONS,
+      },
+      label: '角色',
+    },
+    {
+      fieldName: 'introduction',
+      component: 'Textarea',
+      label: '个人简介',
+    },
+  ];
+});
+
+onMounted(async () => {
+  const data = await getUserInfoApi();
+  profileBaseSettingRef.value.getFormApi().setValues(data);
+});
+</script>
+<template>
+  <ProfileBaseSetting ref="profileBaseSettingRef" :form-schema="formSchema" />
+</template>
diff --git a/playground/src/views/_core/profile/index.vue b/playground/src/views/_core/profile/index.vue
new file mode 100644
index 00000000..8740894e
--- /dev/null
+++ b/playground/src/views/_core/profile/index.vue
@@ -0,0 +1,49 @@
+<script setup lang="ts">
+import { ref } from 'vue';
+
+import { Profile } from '@vben/common-ui';
+import { useUserStore } from '@vben/stores';
+
+import ProfileBase from './base-setting.vue';
+import ProfileNotificationSetting from './notification-setting.vue';
+import ProfilePasswordSetting from './password-setting.vue';
+import ProfileSecuritySetting from './security-setting.vue';
+
+const userStore = useUserStore();
+
+const tabsValue = ref<string>('basic');
+
+const tabs = ref([
+  {
+    label: '基本设置',
+    value: 'basic',
+  },
+  {
+    label: '安全设置',
+    value: 'security',
+  },
+  {
+    label: '修改密码',
+    value: 'password',
+  },
+  {
+    label: '新消息提醒',
+    value: 'notice',
+  },
+]);
+</script>
+<template>
+  <Profile
+    v-model:model-value="tabsValue"
+    title="个人中心"
+    :user-info="userStore.userInfo"
+    :tabs="tabs"
+  >
+    <template #content>
+      <ProfileBase v-if="tabsValue === 'basic'" />
+      <ProfileSecuritySetting v-if="tabsValue === 'security'" />
+      <ProfilePasswordSetting v-if="tabsValue === 'password'" />
+      <ProfileNotificationSetting v-if="tabsValue === 'notice'" />
+    </template>
+  </Profile>
+</template>
diff --git a/playground/src/views/_core/profile/notification-setting.vue b/playground/src/views/_core/profile/notification-setting.vue
new file mode 100644
index 00000000..324a4b39
--- /dev/null
+++ b/playground/src/views/_core/profile/notification-setting.vue
@@ -0,0 +1,31 @@
+<script setup lang="ts">
+import { computed } from 'vue';
+
+import { ProfileNotificationSetting } from '@vben/common-ui';
+
+const formSchema = computed(() => {
+  return [
+    {
+      value: true,
+      fieldName: 'accountPassword',
+      label: '账户密码',
+      description: '其他用户的消息将以站内信的形式通知',
+    },
+    {
+      value: true,
+      fieldName: 'systemMessage',
+      label: '系统消息',
+      description: '系统消息将以站内信的形式通知',
+    },
+    {
+      value: true,
+      fieldName: 'todoTask',
+      label: '待办任务',
+      description: '待办任务将以站内信的形式通知',
+    },
+  ];
+});
+</script>
+<template>
+  <ProfileNotificationSetting :form-schema="formSchema" />
+</template>
diff --git a/playground/src/views/_core/profile/password-setting.vue b/playground/src/views/_core/profile/password-setting.vue
new file mode 100644
index 00000000..a79d083a
--- /dev/null
+++ b/playground/src/views/_core/profile/password-setting.vue
@@ -0,0 +1,63 @@
+<script setup lang="ts">
+import type { VbenFormSchema } from '#/adapter/form';
+
+import { computed } from 'vue';
+
+import { ProfilePasswordSetting, z } from '@vben/common-ui';
+
+import { message } from 'antdv-next';
+
+const formSchema = computed((): VbenFormSchema[] => {
+  return [
+    {
+      fieldName: 'oldPassword',
+      label: '旧密码',
+      component: 'VbenInputPassword',
+      componentProps: {
+        placeholder: '请输入旧密码',
+      },
+    },
+    {
+      fieldName: 'newPassword',
+      label: '新密码',
+      component: 'VbenInputPassword',
+      componentProps: {
+        passwordStrength: true,
+        placeholder: '请输入新密码',
+      },
+    },
+    {
+      fieldName: 'confirmPassword',
+      label: '确认密码',
+      component: 'VbenInputPassword',
+      componentProps: {
+        passwordStrength: true,
+        placeholder: '请再次输入新密码',
+      },
+      dependencies: {
+        rules(values) {
+          const { newPassword } = values;
+          return z
+            .string({ error: '请再次输入新密码' })
+            .min(1, { message: '请再次输入新密码' })
+            .refine((value) => value === newPassword, {
+              message: '两次输入的密码不一致',
+            });
+        },
+        triggerFields: ['newPassword'],
+      },
+    },
+  ];
+});
+
+function handleSubmit() {
+  message.success('密码修改成功');
+}
+</script>
+<template>
+  <ProfilePasswordSetting
+    class="w-1/3"
+    :form-schema="formSchema"
+    @submit="handleSubmit"
+  />
+</template>
diff --git a/playground/src/views/_core/profile/security-setting.vue b/playground/src/views/_core/profile/security-setting.vue
new file mode 100644
index 00000000..be30db58
--- /dev/null
+++ b/playground/src/views/_core/profile/security-setting.vue
@@ -0,0 +1,43 @@
+<script setup lang="ts">
+import { computed } from 'vue';
+
+import { ProfileSecuritySetting } from '@vben/common-ui';
+
+const formSchema = computed(() => {
+  return [
+    {
+      value: true,
+      fieldName: 'accountPassword',
+      label: '账户密码',
+      description: '当前密码强度：强',
+    },
+    {
+      value: true,
+      fieldName: 'securityPhone',
+      label: '密保手机',
+      description: '已绑定手机：138****8293',
+    },
+    {
+      value: true,
+      fieldName: 'securityQuestion',
+      label: '密保问题',
+      description: '未设置密保问题，密保问题可有效保护账户安全',
+    },
+    {
+      value: true,
+      fieldName: 'securityEmail',
+      label: '备用邮箱',
+      description: '已绑定邮箱：ant***sign.com',
+    },
+    {
+      value: false,
+      fieldName: 'securityMfa',
+      label: 'MFA 设备',
+      description: '未绑定 MFA 设备，绑定后，可以进行二次确认',
+    },
+  ];
+});
+</script>
+<template>
+  <ProfileSecuritySetting :form-schema="formSchema" />
+</template>
diff --git a/playground/src/views/dashboard/analytics/analytics-trends.vue b/playground/src/views/dashboard/analytics/analytics-trends.vue
index fadfc917..f1f0b232 100644
--- a/playground/src/views/dashboard/analytics/analytics-trends.vue
+++ b/playground/src/views/dashboard/analytics/analytics-trends.vue
@@ -1,11 +1,9 @@
 <script lang="ts" setup>
+import type { EchartsUIType } from '@vben/plugins/echarts';
+
 import { onMounted, ref } from 'vue';
 
-import {
-  EchartsUI,
-  type EchartsUIType,
-  useEcharts,
-} from '@vben/plugins/echarts';
+import { EchartsUI, useEcharts } from '@vben/plugins/echarts';
 
 const chartRef = ref<EchartsUIType>();
 const { renderEcharts } = useEcharts(chartRef);
diff --git a/playground/src/views/dashboard/analytics/analytics-visits-data.vue b/playground/src/views/dashboard/analytics/analytics-visits-data.vue
index 30c4265d..190fb41f 100644
--- a/playground/src/views/dashboard/analytics/analytics-visits-data.vue
+++ b/playground/src/views/dashboard/analytics/analytics-visits-data.vue
@@ -1,11 +1,9 @@
 <script lang="ts" setup>
+import type { EchartsUIType } from '@vben/plugins/echarts';
+
 import { onMounted, ref } from 'vue';
 
-import {
-  EchartsUI,
-  type EchartsUIType,
-  useEcharts,
-} from '@vben/plugins/echarts';
+import { EchartsUI, useEcharts } from '@vben/plugins/echarts';
 
 const chartRef = ref<EchartsUIType>();
 const { renderEcharts } = useEcharts(chartRef);
diff --git a/playground/src/views/dashboard/analytics/analytics-visits-sales.vue b/playground/src/views/dashboard/analytics/analytics-visits-sales.vue
index 260520b8..6ff52086 100644
--- a/playground/src/views/dashboard/analytics/analytics-visits-sales.vue
+++ b/playground/src/views/dashboard/analytics/analytics-visits-sales.vue
@@ -1,11 +1,9 @@
 <script lang="ts" setup>
+import type { EchartsUIType } from '@vben/plugins/echarts';
+
 import { onMounted, ref } from 'vue';
 
-import {
-  EchartsUI,
-  type EchartsUIType,
-  useEcharts,
-} from '@vben/plugins/echarts';
+import { EchartsUI, useEcharts } from '@vben/plugins/echarts';
 
 const chartRef = ref<EchartsUIType>();
 const { renderEcharts } = useEcharts(chartRef);
@@ -26,7 +24,7 @@ onMounted(() => {
           { name: '定制', value: 310 },
           { name: '技术支持', value: 274 },
           { name: '远程', value: 400 },
-        ].sort((a, b) => {
+        ].toSorted((a, b) => {
           return a.value - b.value;
         }),
         name: '商业占比',
diff --git a/playground/src/views/dashboard/analytics/analytics-visits-source.vue b/playground/src/views/dashboard/analytics/analytics-visits-source.vue
index e0d0aab5..0915c7af 100644
--- a/playground/src/views/dashboard/analytics/analytics-visits-source.vue
+++ b/playground/src/views/dashboard/analytics/analytics-visits-source.vue
@@ -1,11 +1,9 @@
 <script lang="ts" setup>
+import type { EchartsUIType } from '@vben/plugins/echarts';
+
 import { onMounted, ref } from 'vue';
 
-import {
-  EchartsUI,
-  type EchartsUIType,
-  useEcharts,
-} from '@vben/plugins/echarts';
+import { EchartsUI, useEcharts } from '@vben/plugins/echarts';
 
 const chartRef = ref<EchartsUIType>();
 const { renderEcharts } = useEcharts(chartRef);
diff --git a/playground/src/views/dashboard/analytics/analytics-visits.vue b/playground/src/views/dashboard/analytics/analytics-visits.vue
index 7e1f14ee..7e0f1013 100644
--- a/playground/src/views/dashboard/analytics/analytics-visits.vue
+++ b/playground/src/views/dashboard/analytics/analytics-visits.vue
@@ -1,11 +1,9 @@
 <script lang="ts" setup>
+import type { EchartsUIType } from '@vben/plugins/echarts';
+
 import { onMounted, ref } from 'vue';
 
-import {
-  EchartsUI,
-  type EchartsUIType,
-  useEcharts,
-} from '@vben/plugins/echarts';
+import { EchartsUI, useEcharts } from '@vben/plugins/echarts';
 
 const chartRef = ref<EchartsUIType>();
 const { renderEcharts } = useEcharts(chartRef);
diff --git a/playground/src/views/dashboard/analytics/index.vue b/playground/src/views/dashboard/analytics/index.vue
index 00b34df1..e794c99a 100644
--- a/playground/src/views/dashboard/analytics/index.vue
+++ b/playground/src/views/dashboard/analytics/index.vue
@@ -15,10 +15,10 @@ import {
 } from '@vben/icons';
 
 import AnalyticsTrends from './analytics-trends.vue';
-import AnalyticsVisits from './analytics-visits.vue';
 import AnalyticsVisitsData from './analytics-visits-data.vue';
 import AnalyticsVisitsSales from './analytics-visits-sales.vue';
 import AnalyticsVisitsSource from './analytics-visits-source.vue';
+import AnalyticsVisits from './analytics-visits.vue';
 
 const overviewItems: AnalysisOverviewItem[] = [
   {
@@ -76,10 +76,10 @@ const chartTabs: TabOption[] = [
     </AnalysisChartsTabs>
 
     <div class="mt-5 w-full md:flex">
-      <AnalysisChartCard class="mt-5 md:mr-4 md:mt-0 md:w-1/3" title="访问数量">
+      <AnalysisChartCard class="mt-5 md:mt-0 md:mr-4 md:w-1/3" title="访问数量">
         <AnalyticsVisitsData />
       </AnalysisChartCard>
-      <AnalysisChartCard class="mt-5 md:mr-4 md:mt-0 md:w-1/3" title="访问来源">
+      <AnalysisChartCard class="mt-5 md:mt-0 md:mr-4 md:w-1/3" title="访问来源">
         <AnalyticsVisitsSource />
       </AnalysisChartCard>
       <AnalysisChartCard class="mt-5 md:mt-0 md:w-1/3" title="访问来源">
diff --git a/playground/src/views/dashboard/workspace/index.vue b/playground/src/views/dashboard/workspace/index.vue
index 4534b19a..2b5528a5 100644
--- a/playground/src/views/dashboard/workspace/index.vue
+++ b/playground/src/views/dashboard/workspace/index.vue
@@ -252,7 +252,7 @@ function navTo(nav: WorkbenchProjectItem | WorkbenchQuickNavItem) {
       <div class="w-full lg:w-2/5">
         <WorkbenchQuickNav
           :items="quickNavItems"
-          class="mt-5 lg:mt-0"
+          class="lg:mt-0"
           title="快捷导航"
           @click="navTo"
         />
diff --git a/playground/src/views/demos/access/button-control.vue b/playground/src/views/demos/access/button-control.vue
index 0966a7be..888543f9 100644
--- a/playground/src/views/demos/access/button-control.vue
+++ b/playground/src/views/demos/access/button-control.vue
@@ -7,7 +7,7 @@ import { AccessControl, useAccess } from '@vben/access';
 import { Page } from '@vben/common-ui';
 import { resetAllStores, useUserStore } from '@vben/stores';
 
-import { Button, Card } from 'ant-design-vue';
+import { Button, Card } from 'antdv-next';
 
 import { useAuthStore } from '#/store';
 
@@ -58,7 +58,7 @@ async function changeAccount(role: string) {
     <Card class="mb-5">
       <template #title>
         <span class="font-semibold">当前角色:</span>
-        <span class="text-primary mx-4 text-lg">
+        <span class="mx-4 text-lg text-primary">
           {{ userStore.userRoles?.[0] }}
         </span>
       </template>
diff --git a/playground/src/views/demos/access/index.vue b/playground/src/views/demos/access/index.vue
index abd55254..b326cc9e 100644
--- a/playground/src/views/demos/access/index.vue
+++ b/playground/src/views/demos/access/index.vue
@@ -7,7 +7,7 @@ import { useAccess } from '@vben/access';
 import { Page } from '@vben/common-ui';
 import { resetAllStores, useUserStore } from '@vben/stores';
 
-import { Button, Card } from 'ant-design-vue';
+import { Button, Card } from 'antdv-next';
 
 import { useAuthStore } from '#/store';
 
@@ -71,7 +71,7 @@ async function handleToggleAccessMode() {
   >
     <Card class="mb-5" title="权限模式">
       <span class="font-semibold">当前权限模式:</span>
-      <span class="text-primary mx-4">{{
+      <span class="mx-4 text-primary">{{
         accessMode === 'frontend' ? '前端权限控制' : '后端权限控制'
       }}</span>
       <Button type="primary" @click="handleToggleAccessMode">
diff --git a/playground/src/views/demos/badge/index.vue b/playground/src/views/demos/badge/index.vue
index 8976c6fe..30bd78af 100644
--- a/playground/src/views/demos/badge/index.vue
+++ b/playground/src/views/demos/badge/index.vue
@@ -4,9 +4,10 @@ import { useRoute } from 'vue-router';
 
 import { Page } from '@vben/common-ui';
 import { useAccessStore } from '@vben/stores';
+
 import { MenuBadge } from '@vben-core/menu-ui';
 
-import { Button, Card, Radio, RadioGroup } from 'ant-design-vue';
+import { Button, Card, Radio, RadioGroup } from 'antdv-next';
 
 import { useVbenForm } from '#/adapter/form';
 
@@ -90,7 +91,7 @@ function updateMenuBadge() {
     <Card title="徽标更新">
       <Form>
         <template #badgeVariants="slotProps">
-          <RadioGroup v-bind="slotProps">
+          <RadioGroup v-bind="slotProps.componentProps">
             <Radio
               v-for="color in colors"
               :key="color.value"
@@ -98,7 +99,7 @@ function updateMenuBadge() {
             >
               <div
                 :title="color.label"
-                class="flex h-[14px] w-[50px] items-center justify-start"
+                class="flex h-3.5 w-12.5 items-center justify-start"
               >
                 <MenuBadge
                   v-bind="{ ...badgeProps, badgeVariants: color.value }"
diff --git a/playground/src/views/demos/breadcrumb/lateral-detail.vue b/playground/src/views/demos/breadcrumb/lateral-detail.vue
index 8a4de64e..73d778d0 100644
--- a/playground/src/views/demos/breadcrumb/lateral-detail.vue
+++ b/playground/src/views/demos/breadcrumb/lateral-detail.vue
@@ -3,7 +3,7 @@ import { useRouter } from 'vue-router';
 
 import { Fallback } from '@vben/common-ui';
 
-import { Button } from 'ant-design-vue';
+import { Button } from 'antdv-next';
 
 const router = useRouter();
 </script>
diff --git a/playground/src/views/demos/breadcrumb/lateral.vue b/playground/src/views/demos/breadcrumb/lateral.vue
index 2c24abff..cbf64bb7 100644
--- a/playground/src/views/demos/breadcrumb/lateral.vue
+++ b/playground/src/views/demos/breadcrumb/lateral.vue
@@ -3,7 +3,7 @@ import { useRouter } from 'vue-router';
 
 import { Fallback } from '@vben/common-ui';
 
-import { Button } from 'ant-design-vue';
+import { Button } from 'antdv-next';
 
 const router = useRouter();
 
diff --git a/playground/src/views/demos/features/clipboard/index.vue b/playground/src/views/demos/features/clipboard/index.vue
index 792315ff..6ebdc728 100644
--- a/playground/src/views/demos/features/clipboard/index.vue
+++ b/playground/src/views/demos/features/clipboard/index.vue
@@ -4,7 +4,7 @@ import { ref } from 'vue';
 import { Page } from '@vben/common-ui';
 
 import { useClipboard } from '@vueuse/core';
-import { Button, Card, Input } from 'ant-design-vue';
+import { Button, Card, Input } from 'antdv-next';
 
 const source = ref('Hello');
 const { copy, text } = useClipboard({ legacy: true, source });
@@ -17,7 +17,7 @@ const { copy, text } = useClipboard({ legacy: true, source });
         Current copied: <code>{{ text || 'none' }}</code>
       </p>
       <div class="flex">
-        <Input v-model:value="source" class="mr-3 flex w-[200px]" />
+        <Input v-model:value="source" class="mr-3 flex w-50" />
         <Button type="primary" @click="copy(source)"> Copy </Button>
       </div>
     </Card>
diff --git a/playground/src/views/demos/features/file-download/index.vue b/playground/src/views/demos/features/file-download/index.vue
index b4125b8a..a40a2d3e 100644
--- a/playground/src/views/demos/features/file-download/index.vue
+++ b/playground/src/views/demos/features/file-download/index.vue
@@ -1,4 +1,6 @@
 <script setup lang="ts">
+import { ref } from 'vue';
+
 import { Page } from '@vben/common-ui';
 import {
   downloadFileFromBase64,
@@ -7,9 +9,25 @@ import {
   downloadFileFromUrl,
 } from '@vben/utils';
 
-import { Button, Card } from 'ant-design-vue';
+import { Button, Card } from 'antdv-next';
+
+import { downloadFile1, downloadFile2 } from '#/api/examples/download';
 
 import imageBase64 from './base64';
+
+const downloadResult = ref('');
+
+function getBlob() {
+  downloadFile1().then((res) => {
+    downloadResult.value = `获取Blob成功，长度：${res.size}`;
+  });
+}
+
+function getResponse() {
+  downloadFile2().then((res) => {
+    downloadResult.value = `获取Response成功，headers：${JSON.stringify(res.headers)},长度：${res.data.size}`;
+  });
+}
 </script>
 
 <template>
@@ -70,5 +88,13 @@ import imageBase64 from './base64';
         Download TxT
       </Button>
     </Card>
+
+    <Card class="my-5" title="Request download">
+      <Button type="primary" @click="getBlob"> 获取Blob </Button>
+      <Button type="primary" class="ml-4" @click="getResponse">
+        获取Response
+      </Button>
+      <div class="mt-4">{{ downloadResult }}</div>
+    </Card>
   </Page>
 </template>
diff --git a/playground/src/views/demos/features/full-screen/index.vue b/playground/src/views/demos/features/full-screen/index.vue
index 485b2e43..3f8fba5d 100644
--- a/playground/src/views/demos/features/full-screen/index.vue
+++ b/playground/src/views/demos/features/full-screen/index.vue
@@ -4,7 +4,7 @@ import { ref } from 'vue';
 import { Page } from '@vben/common-ui';
 
 import { useFullscreen } from '@vueuse/core';
-import { Button, Card } from 'ant-design-vue';
+import { Button, Card } from 'antdv-next';
 
 const domRef = ref<HTMLElement>();
 
@@ -37,7 +37,7 @@ const { isFullscreen: isDomFullscreen, toggle: toggleDom } =
 
     <div
       ref="domRef"
-      class="mx-auto mt-10 flex h-64 w-1/2 items-center justify-center rounded-md bg-yellow-400"
+      class="mx-auto mt-10 flex-center h-64 w-1/2 rounded-md bg-yellow-400"
     >
       <Button class="mr-2" type="primary" @click="toggleDom">
         {{ isDomFullscreen ? 'Exit Dom Full Screen' : 'Enter Dom Full Screen' }}
diff --git a/playground/src/views/demos/features/hide-menu-children/children.vue b/playground/src/views/demos/features/hide-menu-children/children.vue
index 9b009e36..1959f96d 100644
--- a/playground/src/views/demos/features/hide-menu-children/children.vue
+++ b/playground/src/views/demos/features/hide-menu-children/children.vue
@@ -1,3 +1,23 @@
+<script lang="ts" setup>
+import { Fallback, VbenButton } from '@vben/common-ui';
+import { useTabs } from '@vben/hooks';
+import { X } from '@vben/icons';
+
+const { closeCurrentTab } = useTabs();
+</script>
+
 <template>
-  <div>children</div>
+  <Fallback
+    description="当前路由在菜单中不可见"
+    status="coming-soon"
+    title="被隐藏的子菜单"
+    show-back
+  >
+    <template #action>
+      <VbenButton size="lg" @click="closeCurrentTab()">
+        <X class="mr-2 size-4" />
+        关闭当前标签页
+      </VbenButton>
+    </template>
+  </Fallback>
 </template>
diff --git a/playground/src/views/demos/features/hide-menu-children/parent.vue b/playground/src/views/demos/features/hide-menu-children/parent.vue
index 92087751..b732c1be 100644
--- a/playground/src/views/demos/features/hide-menu-children/parent.vue
+++ b/playground/src/views/demos/features/hide-menu-children/parent.vue
@@ -4,8 +4,14 @@ import { Fallback } from '@vben/common-ui';
 
 <template>
   <Fallback
-    description="当前菜单的子菜单不可见"
+    :description="`当前路由：${String($route.name)}，子菜单不可见`"
     status="coming-soon"
     title="隐藏子菜单"
-  />
+  >
+    <template #action>
+      <RouterLink to="/demos/features/hide-menu-children/children">
+        打开子路由
+      </RouterLink>
+    </template>
+  </Fallback>
 </template>
diff --git a/playground/src/views/demos/features/icons/index.vue b/playground/src/views/demos/features/icons/index.vue
index cc5ed066..bd3d847f 100644
--- a/playground/src/views/demos/features/icons/index.vue
+++ b/playground/src/views/demos/features/icons/index.vue
@@ -3,11 +3,7 @@ import { h, ref } from 'vue';
 
 import { IconPicker, Page } from '@vben/common-ui';
 import {
-  MdiGithub,
-  MdiGoogle,
   MdiKeyboardEsc,
-  MdiQqchat,
-  MdiWechat,
   SvgAvatar1Icon,
   SvgAvatar2Icon,
   SvgAvatar3Icon,
@@ -16,11 +12,18 @@ import {
   SvgCakeIcon,
   SvgCardIcon,
   SvgDownloadIcon,
+  SvgGithubIcon,
+  SvgGoogleIcon,
+  SvgQQChatIcon,
+  SvgWeChatIcon,
 } from '@vben/icons';
 
-import { Card, Input } from 'ant-design-vue';
+import { Card, Input } from 'antdv-next';
 
-const iconValue = ref('ant-design:trademark-outlined');
+const iconValue1 = ref('ant-design:trademark-outlined');
+const iconValue2 = ref('svg:avatar-1');
+const iconValue3 = ref('mdi:alien-outline');
+const iconValue4 = ref('mdi-light:book-multiple');
 
 const inputComponent = h(Input);
 </script>
@@ -28,7 +31,7 @@ const inputComponent = h(Input);
 <template>
   <Page title="图标">
     <template #description>
-      <div class="text-foreground/80 mt-2">
+      <div class="mt-2 text-foreground/80">
         图标可在
         <a
           class="text-primary"
@@ -43,10 +46,10 @@ const inputComponent = h(Input);
 
     <Card class="mb-5" title="Iconify">
       <div class="flex items-center gap-5">
-        <MdiGithub class="size-8" />
-        <MdiGoogle class="size-8 text-red-500" />
-        <MdiQqchat class="size-8 text-green-500" />
-        <MdiWechat class="size-8" />
+        <SvgGithubIcon class="size-8" />
+        <SvgGoogleIcon class="size-8" />
+        <SvgQQChatIcon class="size-8" />
+        <SvgWeChatIcon class="size-8" />
         <MdiKeyboardEsc class="size-8" />
       </div>
     </Card>
@@ -78,26 +81,32 @@ const inputComponent = h(Input);
     <Card class="mb-5" title="图标选择器">
       <div class="mb-5 flex items-center gap-5">
         <span>原始样式(Iconify):</span>
-        <IconPicker class="w-[200px]" />
+        <IconPicker v-model="iconValue1" class="w-50" />
       </div>
       <div class="mb-5 flex items-center gap-5">
         <span>原始样式(svg):</span>
-        <IconPicker class="w-[200px]" prefix="svg" />
+        <IconPicker v-model="iconValue2" class="w-50" prefix="svg" />
       </div>
       <div class="mb-5 flex items-center gap-5">
-        <span>使用Input:</span>
-        <IconPicker :input-component="inputComponent" icon-slot="addonAfter" />
+        <span>自定义Input:</span>
+        <IconPicker
+          :input-component="inputComponent"
+          v-model="iconValue3"
+          icon-slot="addonAfter"
+          model-value-prop="value"
+          prefix="mdi"
+        />
       </div>
       <div class="flex items-center gap-5">
-        <span>可手动输入，只能点击图标打开弹窗:</span>
+        <span>显示为一个Icon:</span>
         <Input
-          v-model:value="iconValue"
+          v-model:value="iconValue4"
           allow-clear
           placeholder="点击这里选择图标"
-          style="width: 300px"
+          class="w-75"
         >
           <template #addonAfter>
-            <IconPicker v-model="iconValue" class="w-[200px]" />
+            <IconPicker v-model="iconValue4" prefix="mdi-light" type="icon" />
           </template>
         </Input>
       </div>
diff --git a/playground/src/views/demos/features/json-bigint/index.vue b/playground/src/views/demos/features/json-bigint/index.vue
new file mode 100644
index 00000000..f4b6bdf2
--- /dev/null
+++ b/playground/src/views/demos/features/json-bigint/index.vue
@@ -0,0 +1,39 @@
+<script lang="ts" setup>
+import { ref } from 'vue';
+
+import { Page } from '@vben/common-ui';
+
+import { Alert, Button, Card } from 'antdv-next';
+
+import { getBigIntData } from '#/api/examples/json-bigint';
+
+const response = ref('');
+function fetchData() {
+  getBigIntData().then((res) => {
+    response.value = res;
+  });
+}
+</script>
+<template>
+  <Page
+    title="JSON BigInt Support"
+    description="解析后端返回的长整数（long/bigInt）。代码位置：playground/src/api/request.ts中的transformResponse"
+  >
+    <Card>
+      <Alert>
+        <template #title>
+          有些后端接口返回的ID是长整数，但javascript原生的JSON解析是不支持超过2^53-1的长整数的。
+          这种情况可以建议后端返回数据前将长整数转换为字符串类型。如果后端不接受我们的建议😡……
+          <br />
+          下面的按钮点击后会发起请求，接口返回的JSON数据中的id字段是超出整数范围的数字，已自动将其解析为字符串
+        </template>
+      </Alert>
+      <Button class="mt-4" type="primary" @click="fetchData">发起请求</Button>
+      <div>
+        <pre>
+        {{ response }}
+        </pre>
+      </div>
+    </Card>
+  </Page>
+</template>
diff --git a/playground/src/views/demos/features/login-expired/index.vue b/playground/src/views/demos/features/login-expired/index.vue
index 532839af..98ec5227 100644
--- a/playground/src/views/demos/features/login-expired/index.vue
+++ b/playground/src/views/demos/features/login-expired/index.vue
@@ -4,7 +4,7 @@ import type { LoginExpiredModeType } from '@vben/types';
 import { Page } from '@vben/common-ui';
 import { preferences, updatePreferences } from '@vben/preferences';
 
-import { Button, Card } from 'ant-design-vue';
+import { Button, Card } from 'antdv-next';
 
 import { getMockStatusApi } from '#/api';
 
@@ -20,7 +20,7 @@ async function handleClick(type: LoginExpiredModeType) {
 <template>
   <Page title="登录过期演示">
     <template #description>
-      <div class="text-foreground/80 mt-2">
+      <div class="mt-2 text-foreground/80">
         接口请求遇到401状态码时，需要重新登录。有两种方式：
         <p>1.转到登录页，登录成功后跳转回原页面</p>
         <p>
diff --git a/playground/src/views/demos/features/preferences-extension/index.vue b/playground/src/views/demos/features/preferences-extension/index.vue
new file mode 100644
index 00000000..70822a09
--- /dev/null
+++ b/playground/src/views/demos/features/preferences-extension/index.vue
@@ -0,0 +1,231 @@
+<script lang="ts" setup>
+import type { PlaygroundPreferencesExtension } from '#/preferences';
+
+import { computed } from 'vue';
+
+import { Page } from '@vben/common-ui';
+import {
+  getCustomPreferences,
+  updateCustomPreferences,
+} from '@vben/preferences';
+
+import { Alert, Button, Card, Space, Tag } from 'antdv-next';
+
+import { $t } from '#/locales';
+
+interface DemoTaskItem {
+  id: number;
+  owner: string;
+  priority: 'P0' | 'P1' | 'P2';
+  title: string;
+}
+
+type HighlightTone = PlaygroundPreferencesExtension['highlightTone'];
+
+const playgroundPreferences =
+  getCustomPreferences<PlaygroundPreferencesExtension>();
+
+const demoTasks: DemoTaskItem[] = [
+  { id: 1, owner: 'Luna', priority: 'P0', title: '同步租户配置到缓存' },
+  { id: 2, owner: 'Aiden', priority: 'P1', title: '补充角色权限回归用例' },
+  { id: 3, owner: 'Mia', priority: 'P0', title: '修复看板接口超时重试' },
+  { id: 4, owner: 'Noah', priority: 'P2', title: '整理本周运营周报模板' },
+  { id: 5, owner: 'Ethan', priority: 'P1', title: '验证暗黑主题下图表对比度' },
+  { id: 6, owner: 'Sophia', priority: 'P1', title: '更新埋点字段映射文档' },
+  { id: 7, owner: 'Lucas', priority: 'P2', title: '检查消息中心未读状态同步' },
+  { id: 8, owner: 'Emma', priority: 'P0', title: '补齐导出任务失败告警' },
+];
+
+const toneMap = {
+  default: {
+    alertType: 'info',
+    cardClass: 'border-primary/20 bg-primary/5',
+    label: $t('demos.preferencesExtensionDemo.tones.default'),
+    tagColor: 'processing',
+  },
+  success: {
+    alertType: 'success',
+    cardClass: 'border-emerald-500/20 bg-emerald-500/5',
+    label: $t('demos.preferencesExtensionDemo.tones.success'),
+    tagColor: 'success',
+  },
+  warning: {
+    alertType: 'warning',
+    cardClass: 'border-amber-500/20 bg-amber-500/5',
+    label: $t('demos.preferencesExtensionDemo.tones.warning'),
+    tagColor: 'warning',
+  },
+} as const satisfies Record<
+  HighlightTone,
+  {
+    alertType: 'info' | 'success' | 'warning';
+    cardClass: string;
+    label: string;
+    tagColor: string;
+  }
+>;
+
+const visibleTasks = computed(() => {
+  return demoTasks.slice(0, playgroundPreferences.defaultVisibleRows);
+});
+
+const toneConfig = computed(() => {
+  return toneMap[playgroundPreferences.highlightTone];
+});
+
+const formattedPlaygroundPreferences = computed(() => {
+  return JSON.stringify(playgroundPreferences, null, 2);
+});
+
+const preClasses =
+  'mt-4 overflow-auto rounded-lg border border-border bg-muted p-4 text-sm';
+
+function applyPreset(type: 'compact' | 'focus' | 'review') {
+  const presetMap: Record<
+    typeof type,
+    Partial<PlaygroundPreferencesExtension>
+  > = {
+    compact: {
+      defaultVisibleRows: 3,
+      enableQuickActions: false,
+      highlightTone: 'warning',
+      reportTitle: $t('demos.preferencesExtensionDemo.presetTitles.compact'),
+    },
+    focus: {
+      defaultVisibleRows: 4,
+      enableQuickActions: true,
+      highlightTone: 'default',
+      reportTitle: $t('demos.preferencesExtensionDemo.presetTitles.default'),
+    },
+    review: {
+      defaultVisibleRows: 6,
+      enableQuickActions: true,
+      highlightTone: 'success',
+      reportTitle: $t('demos.preferencesExtensionDemo.presetTitles.review'),
+    },
+  };
+
+  updateCustomPreferences(presetMap[type]);
+}
+
+function getPriorityColor(priority: DemoTaskItem['priority']) {
+  switch (priority) {
+    case 'P0': {
+      return 'error';
+    }
+    case 'P1': {
+      return 'warning';
+    }
+    default: {
+      return 'default';
+    }
+  }
+}
+</script>
+
+<template>
+  <Page :title="$t('demos.features.preferencesExtension')">
+    <template #description>
+      <div class="mt-2 text-foreground/80">
+        {{ $t('demos.preferencesExtensionDemo.description') }}
+      </div>
+    </template>
+
+    <Card
+      class="mb-5"
+      :title="$t('demos.preferencesExtensionDemo.currentConfig')"
+    >
+      <Alert :type="toneConfig.alertType" show-icon>
+        <template #title>
+          {{
+            $t('demos.preferencesExtensionDemo.currentTitle', {
+              title: playgroundPreferences.reportTitle,
+            })
+          }}
+        </template>
+        <template #description>
+          {{
+            $t('demos.preferencesExtensionDemo.currentDescription', {
+              count: playgroundPreferences.defaultVisibleRows,
+              quickActionText: playgroundPreferences.enableQuickActions
+                ? $t('demos.preferencesExtensionDemo.showQuickActions')
+                : $t('demos.preferencesExtensionDemo.hideQuickActions'),
+              tone: toneConfig.label,
+            })
+          }}
+        </template>
+      </Alert>
+
+      <div class="mt-4 rounded-xl border p-4" :class="toneConfig.cardClass">
+        <div class="mb-4 flex flex-wrap items-center justify-between gap-3">
+          <div>
+            <div class="text-lg font-semibold">
+              {{ playgroundPreferences.reportTitle }}
+            </div>
+            <div class="text-sm text-foreground/60">
+              {{ $t('demos.preferencesExtensionDemo.boardDescription') }}
+            </div>
+          </div>
+          <Tag :color="toneConfig.tagColor">
+            {{ toneConfig.label }}
+          </Tag>
+        </div>
+
+        <Space
+          v-if="playgroundPreferences.enableQuickActions"
+          wrap
+          class="mb-4"
+        >
+          <Button type="primary">
+            {{ $t('demos.preferencesExtensionDemo.quickActions.create') }}
+          </Button>
+          <Button>
+            {{ $t('demos.preferencesExtensionDemo.quickActions.export') }}
+          </Button>
+          <Button>
+            {{ $t('demos.preferencesExtensionDemo.quickActions.refresh') }}
+          </Button>
+        </Space>
+        <div v-else class="mb-4 text-sm text-foreground/60">
+          {{ $t('demos.preferencesExtensionDemo.quickActionsEnabled') }}
+        </div>
+
+        <div class="space-y-2">
+          <div
+            v-for="task in visibleTasks"
+            :key="task.id"
+            class="flex flex-wrap items-center justify-between gap-3 rounded-lg border border-border bg-background px-4 py-3"
+          >
+            <div>
+              <div class="font-medium">{{ task.title }}</div>
+              <div class="text-sm text-foreground/60">
+                {{ $t('demos.preferencesExtensionDemo.owner') }}：{{
+                  task.owner
+                }}
+              </div>
+            </div>
+            <Tag :color="getPriorityColor(task.priority)">
+              {{ task.priority }}
+            </Tag>
+          </div>
+        </div>
+      </div>
+    </Card>
+
+    <Card :title="$t('demos.preferencesExtensionDemo.presetTitle')">
+      <Space wrap>
+        <Button @click="applyPreset('focus')">
+          {{ $t('demos.preferencesExtensionDemo.presetButtons.default') }}
+        </Button>
+        <Button @click="applyPreset('compact')">
+          {{ $t('demos.preferencesExtensionDemo.presetButtons.compact') }}
+        </Button>
+        <Button type="primary" @click="applyPreset('review')">
+          {{ $t('demos.preferencesExtensionDemo.presetButtons.review') }}
+        </Button>
+      </Space>
+
+      <pre :class="preClasses">{{ formattedPlaygroundPreferences }}</pre>
+    </Card>
+  </Page>
+</template>
diff --git a/playground/src/views/demos/features/request-params-serializer/index.vue b/playground/src/views/demos/features/request-params-serializer/index.vue
new file mode 100644
index 00000000..0acc59d2
--- /dev/null
+++ b/playground/src/views/demos/features/request-params-serializer/index.vue
@@ -0,0 +1,61 @@
+<script lang="ts" setup>
+import { computed, ref, watchEffect } from 'vue';
+
+import { Page } from '@vben/common-ui';
+
+import { Card, Radio, RadioGroup } from 'antdv-next';
+
+import { getParamsData } from '#/api/examples/params';
+
+const params = { ids: [2512, 3241, 4255] };
+const paramsSerializer = ref<'brackets' | 'comma' | 'indices' | 'repeat'>(
+  'brackets',
+);
+const response = ref('');
+const paramsStr = computed(() => {
+  // 写一段代码，从完整的URL中提取参数部分
+  const url = response.value;
+  return new URL(url).searchParams.toString();
+});
+
+watchEffect(() => {
+  getParamsData(params, paramsSerializer.value).then((res) => {
+    response.value = res.request.responseURL;
+  });
+});
+</script>
+<template>
+  <Page
+    title="请求参数序列化"
+    description="不同的后台接口可能对数组类型的GET参数的解析方式不同，我们预置了几种数组序列化方式，通过配置 paramsSerializer 来实现不同的序列化方式"
+  >
+    <Card>
+      <RadioGroup v-model:value="paramsSerializer" name="paramsSerializer">
+        <Radio value="brackets">brackets</Radio>
+        <Radio value="comma">comma</Radio>
+        <Radio value="indices">indices</Radio>
+        <Radio value="repeat">repeat</Radio>
+      </RadioGroup>
+      <div class="mt-4 flex flex-col gap-4">
+        <div>
+          <h3>需要提交的参数</h3>
+          <div>{{ JSON.stringify(params, null, 2) }}</div>
+        </div>
+        <template v-if="response">
+          <div>
+            <h3>访问地址</h3>
+            <pre>{{ response }}</pre>
+          </div>
+          <div>
+            <h3>参数字符串</h3>
+            <pre>{{ paramsStr }}</pre>
+          </div>
+          <div>
+            <h3>参数解码</h3>
+            <pre>{{ decodeURIComponent(paramsStr) }}</pre>
+          </div>
+        </template>
+      </div>
+    </Card>
+  </Page>
+</template>
diff --git a/playground/src/views/demos/features/tabs/index.vue b/playground/src/views/demos/features/tabs/index.vue
index 5e7bfa2e..5b5bdd7d 100644
--- a/playground/src/views/demos/features/tabs/index.vue
+++ b/playground/src/views/demos/features/tabs/index.vue
@@ -5,7 +5,7 @@ import { useRouter } from 'vue-router';
 import { Page } from '@vben/common-ui';
 import { useTabs } from '@vben/hooks';
 
-import { Button, Card, Input } from 'ant-design-vue';
+import { Button, Card, Input } from 'antdv-next';
 
 const router = useRouter();
 const newTabTitle = ref('');
@@ -41,7 +41,7 @@ function reset() {
 <template>
   <Page description="用于需要操作标签页的场景" title="标签页">
     <Card class="mb-5" title="打开/关闭标签页">
-      <div class="text-foreground/80 mb-3">
+      <div class="mb-3 text-foreground/80">
         如果标签页存在，直接跳转切换。如果标签页不存在，则打开新的标签页。
       </div>
       <div class="flex flex-wrap gap-3">
@@ -53,7 +53,7 @@ function reset() {
     </Card>
 
     <Card class="mb-5" title="标签页操作">
-      <div class="text-foreground/80 mb-3">用于动态控制标签页的各种操作</div>
+      <div class="mb-3 text-foreground/80">用于动态控制标签页的各种操作</div>
       <div class="flex flex-wrap gap-3">
         <Button type="primary" @click="closeCurrentTab()">
           关闭当前标签页
@@ -73,7 +73,7 @@ function reset() {
     </Card>
 
     <Card class="mb-5" title="动态标题">
-      <div class="text-foreground/80 mb-3">
+      <div class="mb-3 text-foreground/80">
         该操作不会影响页面标题，仅修改Tab标题
       </div>
       <div class="flex flex-wrap items-center gap-3">
@@ -90,7 +90,7 @@ function reset() {
     </Card>
 
     <Card class="mb-5" title="最大打开数量">
-      <div class="text-foreground/80 mb-3">
+      <div class="mb-3 text-foreground/80">
         限制带参数的tab打开的最大数量，由 `route.meta.maxNumOfOpenTab` 控制
       </div>
       <div class="flex flex-wrap items-center gap-3">
diff --git a/playground/src/views/demos/features/vue-query/concurrency-caching.vue b/playground/src/views/demos/features/vue-query/concurrency-caching.vue
new file mode 100644
index 00000000..1e0f3280
--- /dev/null
+++ b/playground/src/views/demos/features/vue-query/concurrency-caching.vue
@@ -0,0 +1,61 @@
+<script lang="ts" setup>
+import type { Recordable } from '@vben/types';
+
+import { useQuery } from '@tanstack/vue-query';
+
+import { useVbenForm } from '#/adapter/form';
+import { getMenuList } from '#/api';
+
+const queryKey = ['demo', 'api', 'options'];
+const count = 4;
+
+const { dataUpdatedAt, promise: fetchDataFn } = useQuery({
+  // 在组件渲染期间预取数据
+  experimental_prefetchInRender: true,
+  // 获取接口数据的函数
+  queryFn: getMenuList,
+  queryKey,
+  // 每次组件挂载时都重新获取数据。如果不需要每次都重新获取就不要设置为always
+  refetchOnMount: 'always',
+  // 缓存时间
+  staleTime: 1000 * 60 * 5,
+});
+
+async function fetchOptions() {
+  return await fetchDataFn.value;
+}
+
+const schema = [];
+
+for (let i = 0; i < count; i++) {
+  schema.push({
+    component: 'ApiSelect',
+    componentProps: {
+      api: fetchOptions,
+      class: 'w-full',
+      filterOption: (input: string, option: Recordable<any>) => {
+        return option.label.toLowerCase().includes(input.toLowerCase());
+      },
+      labelField: 'name',
+      showSearch: true,
+      valueField: 'id',
+    },
+    fieldName: `field${i}`,
+    label: `Select ${i}`,
+  });
+}
+
+const [Form] = useVbenForm({
+  schema,
+  showDefaultActions: false,
+});
+</script>
+<template>
+  <div>
+    <div class="mb-2 flex gap-2">
+      <div>以下{{ count }}个组件共用一个数据源。</div>
+      <div>缓存更新时间：{{ new Date(dataUpdatedAt).toLocaleString() }}</div>
+    </div>
+    <Form />
+  </div>
+</template>
diff --git a/playground/src/views/demos/features/vue-query/index.vue b/playground/src/views/demos/features/vue-query/index.vue
index d57cf812..2d1a8a2a 100644
--- a/playground/src/views/demos/features/vue-query/index.vue
+++ b/playground/src/views/demos/features/vue-query/index.vue
@@ -1,11 +1,15 @@
 <script setup lang="ts">
 import { Page } from '@vben/common-ui';
 
-import { Card } from 'ant-design-vue';
+import { refAutoReset } from '@vueuse/core';
+import { Button, Card, Empty } from 'antdv-next';
 
+import ConcurrencyCaching from './concurrency-caching.vue';
 import InfiniteQueries from './infinite-queries.vue';
 import PaginatedQueries from './paginated-queries.vue';
 import QueryRetries from './query-retries.vue';
+
+const showCaching = refAutoReset(true, 1000);
 </script>
 
 <template>
@@ -15,11 +19,22 @@ import QueryRetries from './query-retries.vue';
         <PaginatedQueries />
       </Card>
       <Card title="无限滚动">
-        <InfiniteQueries class="h-[300px] overflow-auto" />
+        <InfiniteQueries class="h-75 overflow-auto" />
       </Card>
       <Card title="错误重试">
         <QueryRetries />
       </Card>
+      <Card
+        title="并发和缓存"
+        v-spinning="!showCaching"
+        :styles="{ body: { minHeight: '330px' } }"
+      >
+        <template #extra>
+          <Button @click="showCaching = false">重新加载</Button>
+        </template>
+        <ConcurrencyCaching v-if="showCaching" />
+        <Empty v-else description="正在加载..." />
+      </Card>
     </div>
   </Page>
 </template>
diff --git a/playground/src/views/demos/features/vue-query/infinite-queries.vue b/playground/src/views/demos/features/vue-query/infinite-queries.vue
index 2add4c15..f6545ebe 100644
--- a/playground/src/views/demos/features/vue-query/infinite-queries.vue
+++ b/playground/src/views/demos/features/vue-query/infinite-queries.vue
@@ -2,7 +2,7 @@
 import type { IProducts } from './typing';
 
 import { useInfiniteQuery } from '@tanstack/vue-query';
-import { Button } from 'ant-design-vue';
+import { Button } from 'antdv-next';
 
 const LIMIT = 10;
 const fetchProducts = async ({ pageParam = 0 }): Promise<IProducts> => {
diff --git a/playground/src/views/demos/features/vue-query/paginated-queries.vue b/playground/src/views/demos/features/vue-query/paginated-queries.vue
index b2e3c26d..828744d9 100644
--- a/playground/src/views/demos/features/vue-query/paginated-queries.vue
+++ b/playground/src/views/demos/features/vue-query/paginated-queries.vue
@@ -1,10 +1,12 @@
 <script setup lang="ts">
+import type { Ref } from 'vue';
+
 import type { IProducts } from './typing';
 
-import { type Ref, ref } from 'vue';
+import { ref } from 'vue';
 
 import { keepPreviousData, useQuery } from '@tanstack/vue-query';
-import { Button } from 'ant-design-vue';
+import { Button } from 'antdv-next';
 
 const LIMIT = 10;
 const fetcher = async (page: Ref<number>): Promise<IProducts> => {
diff --git a/playground/src/views/demos/features/vue-query/query-retries.vue b/playground/src/views/demos/features/vue-query/query-retries.vue
index 0080386f..53ee8faa 100644
--- a/playground/src/views/demos/features/vue-query/query-retries.vue
+++ b/playground/src/views/demos/features/vue-query/query-retries.vue
@@ -2,7 +2,7 @@
 import { ref } from 'vue';
 
 import { useQuery } from '@tanstack/vue-query';
-import { Button } from 'ant-design-vue';
+import { Button } from 'antdv-next';
 
 const count = ref(-1);
 async function fetchApi() {
diff --git a/playground/src/views/demos/features/watermark/index.vue b/playground/src/views/demos/features/watermark/index.vue
index 77b3f179..82f994f5 100644
--- a/playground/src/views/demos/features/watermark/index.vue
+++ b/playground/src/views/demos/features/watermark/index.vue
@@ -2,13 +2,13 @@
 import { Page } from '@vben/common-ui';
 import { useWatermark } from '@vben/hooks';
 
-import { Button, Card } from 'ant-design-vue';
+import { Button, Card } from 'antdv-next';
 
 const { destroyWatermark, updateWatermark, watermark } = useWatermark();
 
 async function recreateWaterMark() {
   destroyWatermark();
-  await updateWatermark({});
+  await createWaterMark();
 }
 
 async function createWaterMark() {
@@ -48,7 +48,7 @@ async function createWaterMark() {
 <template>
   <Page title="水印">
     <template #description>
-      <div class="text-foreground/80 mt-2">
+      <div class="mt-2 text-foreground/80">
         水印使用了
         <a
           class="text-primary"
diff --git a/playground/src/views/demos/form-array/README.md b/playground/src/views/demos/form-array/README.md
new file mode 100644
index 00000000..5c246711
--- /dev/null
+++ b/playground/src/views/demos/form-array/README.md
@@ -0,0 +1,324 @@
+# Form Array 数组字段用法
+
+这个 demo 展示 `form-ui` 的数组字段 schema 写法。业务侧推荐使用 `type: 'array' + children` 描述数组结构，不需要直接指定 `component: 'VbenFormFieldArray'`。
+
+示例页面：
+
+- `/vue-vben-admin/playground/src/views/demos/form-array/index.vue`
+
+核心实现：
+
+- `/packages/@core/ui-kit/form-ui/src/form-render/schema.ts`
+- `/packages/@core/ui-kit/form-ui/src/components/form-field-array.vue`
+- `/packages/@core/ui-kit/form-ui/src/form-api.ts`
+
+## 快速开始
+
+```ts
+const schema: VbenFormSchema[] = [
+  {
+    type: 'array',
+    fieldName: 'contacts',
+    label: '联系人',
+    formItemClass: 'col-span-1 md:col-span-2',
+    defaultValue: [
+      {
+        enabled: true,
+        name: '张三',
+        phone: '10086',
+        role: 'owner',
+      },
+    ],
+    rules: z.array(z.any()).min(1, '请至少添加一个联系人'),
+    arrayProps: {
+      addButtonText: '添加联系人',
+      min: 1,
+      max: 5,
+      createRow: () => ({
+        enabled: true,
+        name: '',
+        phone: '',
+        role: 'member',
+      }),
+    },
+    children: [
+      {
+        component: 'Input',
+        fieldName: 'name',
+        label: '姓名',
+        rules: z.string().min(1, '请输入姓名'),
+      },
+      {
+        component: 'Select',
+        fieldName: 'role',
+        label: '角色',
+        rules: 'selectRequired',
+        componentProps: {
+          options: [
+            { label: '负责人', value: 'owner' },
+            { label: '成员', value: 'member' },
+          ],
+        },
+      },
+    ],
+  },
+];
+```
+
+## 字段职责
+
+### `type: 'array'`
+
+声明这是一个数组字段。渲染前会被内部转换为 `VbenFormFieldArray`，所以业务 schema 不需要写具体组件名。
+
+### `fieldName`
+
+数组字段名。假设为 `contacts`，第 1 行子字段 `name` 会被转换成：
+
+```ts
+contacts[0].name;
+```
+
+### `children`
+
+数组每一行的子字段定义。每个 child 都是完整的 `FormSchema`，可以继续使用：
+
+- `component`
+- `componentProps`
+- `rules`
+- `dependencies`
+- `defaultValue`
+- `help`
+- `suffix`
+- `renderComponentContent`
+- `formFieldProps`
+- `disabled`
+- `hide`
+- `labelClass`
+- `controlClass`
+
+### `arrayProps`
+
+传给数组编辑器的配置：
+
+| 字段            | 说明                     |
+| --------------- | ------------------------ |
+| `addButtonText` | 新增按钮文案             |
+| `actionText`    | 操作列表头文案           |
+| `emptyText`     | 空数据文案               |
+| `min`           | 最少行数，达到后禁用删除 |
+| `max`           | 最多行数，达到后禁用新增 |
+| `showIndex`     | 是否显示序号             |
+| `createRow`     | 新增行时生成默认数据     |
+
+## 校验建议
+
+数组父级 `rules` 建议只写数组级规则，例如至少一行：
+
+```ts
+rules: z.array(z.any()).min(1, '请至少添加一个联系人');
+```
+
+每个子字段的必填、长度、格式校验写在 children 自己的 `rules`：
+
+```ts
+{
+  component: 'Input',
+  fieldName: 'name',
+  label: '姓名',
+  rules: z.string().min(1, '请输入姓名'),
+}
+```
+
+不要在父级数组规则里重复写 `z.object({ name: ... })`，否则某一行子字段失败时，父级数组也会失败，容易出现重复错误提示。
+
+## dependencies 用法
+
+children 里的 `dependencies.triggerFields` 默认是“当前行相对路径”。例如：
+
+```ts
+{
+  component: 'Input',
+  fieldName: 'phone',
+  label: '电话',
+  dependencies: {
+    triggerFields: ['role'],
+    componentProps: (_values, _form, _api, ctx) => ({
+      disabled: ctx?.row?.role === 'viewer',
+      placeholder:
+        ctx?.row?.role === 'viewer' ? '观察员无需电话' : '请输入电话',
+    }),
+  },
+}
+```
+
+在第 1 行中，`triggerFields: ['role']` 会被转换成：
+
+```ts
+contacts[0].role;
+```
+
+回调多了一个可选 `ctx` 参数：
+
+| 字段                    | 说明                                     |
+| ----------------------- | ---------------------------------------- |
+| `ctx.row`               | 当前行数据                               |
+| `ctx.rowIndex`          | 当前行索引                               |
+| `ctx.rowPath`           | 当前行路径，例如 `contacts[0]`           |
+| `ctx.arrayField`        | 数组字段名，例如 `contacts`              |
+| `ctx.fieldName`         | 当前真实字段名，例如 `contacts[0].phone` |
+| `ctx.originalFieldName` | 原始 child 字段名，例如 `phone`          |
+| `ctx.rootValues`        | 表单完整值                               |
+
+如果 child 需要依赖表单根字段，可以使用 `$root.` 前缀：
+
+```ts
+dependencies: {
+  triggerFields: ['$root.planName'],
+  componentProps: (values) => ({
+    disabled: !values.planName,
+  }),
+}
+```
+
+如果想显式写当前行字段，也可以使用 `$row.` 前缀：
+
+```ts
+triggerFields: ['$row.role'];
+```
+
+## 提交值转换
+
+数组字段的提交转换使用表单级 `codec`，一次处理完整表单值：
+
+```ts
+function encodeArrayFormValues(values: Readonly<ArrayFormValues>) {
+  return {
+    ...values,
+    contacts: values.contacts.map((contact) => ({
+      ...contact,
+      name: contact.name.trim(),
+      phone: contact.phone?.trim() || undefined,
+    })),
+  };
+}
+
+const [Form] = useVbenForm({
+  codec: {
+    decode: decodeArrayFormValues,
+    encode: encodeArrayFormValues,
+  },
+  schema,
+});
+```
+
+如果要写根字段，用 `$root.`：
+
+```ts
+setValue('$root.firstContactPhone', value);
+```
+
+如果要显式写当前行字段，用 `$row.`：
+
+```ts
+setValue('$row.phone', value);
+```
+
+## updateSchema 用法
+
+可以用父级路径更新 child schema：
+
+```ts
+formApi.updateSchema([
+  {
+    fieldName: 'contacts.phone',
+    rules: z.string().min(5, '电话至少 5 位'),
+  },
+]);
+```
+
+如果传入带索引路径，也会更新对应 child 定义：
+
+```ts
+formApi.updateSchema([
+  {
+    fieldName: 'contacts[0].phone',
+    rules: z.string().min(5, '电话至少 5 位'),
+  },
+]);
+```
+
+注意：`updateSchema` 更新的是 schema 定义，不是单行实例。因此 `contacts[0].phone` 这种写法目前会解析到 child `phone`，实际影响所有行的该列。
+
+## 新增行默认值
+
+优先使用 `arrayProps.createRow`：
+
+```ts
+arrayProps: {
+  createRow: () => ({
+    name: '',
+    role: 'member',
+    phone: '',
+    enabled: true,
+  }),
+}
+```
+
+没有 `createRow` 时，会根据 children 的 `defaultValue` 生成行数据；没有 defaultValue 的字段会给 `null`。
+
+## 内部流程
+
+数组字段从 schema 到渲染大致是这条链路：
+
+```mermaid
+flowchart TD
+  A["业务 schema: type='array' + children"] --> B["form.vue computedSchema"]
+  B --> C["createFormFieldSchema"]
+  C --> D["识别数组 schema"]
+  D --> E["转换为 component='VbenFormFieldArray'"]
+  E --> F["children 放入 componentProps.schema"]
+  F --> G["form-field.vue 渲染外层 FormField"]
+  G --> H["form-field-array.vue useFieldArray 管理行"]
+  H --> I["createArrayChildSchema"]
+  I --> J["child.fieldName 转为 contacts[index].xxx"]
+  I --> K["scope dependencies triggerFields"]
+  I --> L["包装 componentProps/help/render ctx"]
+  J --> M["继续复用 FormField 渲染 child"]
+```
+
+几个关键点：
+
+- 外层 `type: 'array'` 只是语义声明。
+- 具体展示仍复用内部 `VbenFormFieldArray`。
+- child 最终仍然走 `FormField`，所以现有 FormSchema 能力不会丢。
+- `dependencies` 不改核心调用链，而是在 `createArrayChildSchema` 里做路径和 ctx 适配。
+- `updateSchema` 在 `FormApi` 里递归处理 children；提交转换由表单级 `codec` 统一完成。
+
+## 小屏幕展示
+
+`form-field-array` 在大屏下按表格式 grid 展示，在小屏下每行转为纵向堆叠，并显示每个 child 的 label。业务侧通常不需要额外处理移动端布局。
+
+## 兼容旧写法
+
+旧写法仍可用：
+
+```ts
+{
+  component: 'VbenFormFieldArray',
+  fieldName: 'contacts',
+  componentProps: {
+    schema: [...],
+  },
+}
+```
+
+新代码推荐：
+
+```ts
+{
+  type: 'array',
+  fieldName: 'contacts',
+  children: [...],
+}
+```
diff --git a/playground/src/views/demos/form-array/index.vue b/playground/src/views/demos/form-array/index.vue
new file mode 100644
index 00000000..699c5ba3
--- /dev/null
+++ b/playground/src/views/demos/form-array/index.vue
@@ -0,0 +1,234 @@
+<script setup lang="ts">
+import type { VbenFormSchema } from '#/adapter/form';
+
+import { computed, ref } from 'vue';
+
+import { Page } from '@vben/common-ui';
+
+import { Button, Card, message, Space } from 'antdv-next';
+
+import { useVbenForm, z } from '#/adapter/form';
+
+interface ContactFormValues {
+  enabled: boolean;
+  name: string;
+  phone?: string;
+  role: 'member' | 'owner' | 'viewer';
+}
+
+interface ArrayFormValues extends Record<string, unknown> {
+  contacts: ContactFormValues[];
+  description?: string;
+  planName: string;
+}
+
+function encodeArrayFormValues(values: Readonly<ArrayFormValues>) {
+  return {
+    ...values,
+    contacts: values.contacts.map(({ phone, ...contact }) => {
+      const trimmedPhone = phone?.trim();
+      return {
+        ...contact,
+        name: contact.name.trim(),
+        ...(trimmedPhone ? { phone: trimmedPhone } : {}),
+      };
+    }),
+  };
+}
+
+type ArraySubmitValues = ReturnType<typeof encodeArrayFormValues>;
+
+function decodeArrayFormValues(
+  values: Readonly<ArraySubmitValues>,
+): ArrayFormValues {
+  return {
+    ...values,
+    contacts: values.contacts.map((contact) => ({
+      ...contact,
+      phone: contact.phone ?? '',
+    })),
+  };
+}
+
+const submitValues = ref<Partial<ArraySubmitValues>>({});
+const formattedSubmitValues = computed(() =>
+  JSON.stringify(submitValues.value, null, 2),
+);
+const outputClass = [
+  'bg-muted',
+  'text-muted-foreground',
+  'max-h-105',
+  'overflow-auto',
+  'rounded-md',
+  'p-3',
+  'text-xs',
+];
+
+const schema: VbenFormSchema<ArrayFormValues>[] = [
+  {
+    component: 'Input',
+    componentProps: {
+      placeholder: '请输入方案名称',
+    },
+    defaultValue: '值班联络人配置',
+    fieldName: 'planName',
+    label: '方案名称',
+    rules: z.string().min(1, '请输入方案名称'),
+  },
+  {
+    component: 'Textarea',
+    dependencies: {
+      componentProps: (values) => {
+        const planName = values.planName;
+        return {
+          disabled: !planName,
+          placeholder: planName ? `${planName} 的补充说明` : '请先填写方案名称',
+          rows: 2,
+        };
+      },
+      required: (values) => {
+        return String(values.planName ?? '').includes('值班');
+      },
+      rules: (values) => {
+        return String(values.planName ?? '').includes('值班')
+          ? z.string().min(2, '请输入至少 2 个字')
+          : z.string().optional();
+      },
+      triggerFields: ['planName'],
+    },
+    fieldName: 'description',
+    formItemClass: 'col-span-1 md:col-span-2',
+    label: '方案说明',
+  },
+  {
+    arrayProps: {
+      addButtonText: '添加联系人',
+      createRow: () => ({
+        enabled: true,
+        name: '',
+        phone: '',
+        role: 'member',
+      }),
+      max: 5,
+      min: 1,
+    },
+    children: [
+      {
+        component: 'Input',
+        componentProps: (ctx) => ({
+          placeholder: `第 ${(ctx.rowIndex ?? 0) + 1} 行姓名`,
+        }),
+        defaultValue: '',
+        fieldName: 'name',
+        label: '姓名',
+        rules: z.string().trim().min(1, '请输入姓名'),
+      },
+      {
+        component: 'Select',
+        componentProps: {
+          options: [
+            { label: '负责人', value: 'owner' },
+            { label: '成员', value: 'member' },
+            { label: '观察员', value: 'viewer' },
+          ],
+        },
+        defaultValue: 'member',
+        fieldName: 'role',
+        label: '角色',
+        rules: 'selectRequired',
+      },
+      {
+        component: 'Input',
+        dependencies: {
+          componentProps: (_values, _form, _api, ctx) => ({
+            disabled: ctx?.row?.role === 'viewer',
+            placeholder:
+              ctx?.row?.role === 'viewer' ? '观察员无需电话' : '请输入电话',
+          }),
+          triggerFields: ['role'],
+        },
+        fieldName: 'phone',
+        label: '电话',
+        rules: z.string().optional(),
+      },
+      {
+        component: 'Switch',
+        componentProps: {
+          checkedChildren: '启用',
+          unCheckedChildren: '停用',
+        },
+        defaultValue: true,
+        fieldName: 'enabled',
+        label: '状态',
+      },
+    ],
+    defaultValue: [
+      {
+        enabled: true,
+        name: '张三',
+        phone: ' 10086 ',
+        role: 'owner',
+      },
+    ],
+    fieldName: 'contacts',
+    formItemClass: 'col-span-1 md:col-span-2',
+    label: '联系人',
+    rules: z.array(z.any()).min(1, '请至少添加一个联系人'),
+    type: 'array',
+  },
+];
+
+const [Form, formApi] = useVbenForm({
+  codec: {
+    decode: decodeArrayFormValues,
+    encode: encodeArrayFormValues,
+  },
+  commonConfig: {
+    labelWidth: 90,
+  },
+  handleSubmit: (values) => {
+    submitValues.value = values;
+    message.success('已通过校验');
+  },
+  schema,
+  showDefaultActions: false,
+  wrapperClass: 'grid-cols-1 gap-x-4 md:grid-cols-2',
+});
+
+async function handleSubmit() {
+  await formApi.validateAndSubmit();
+}
+
+async function handleGetValues() {
+  submitValues.value = await formApi.getValues();
+}
+
+function handlePatchChildRule() {
+  formApi.updateSchema([
+    {
+      fieldName: 'contacts.phone',
+      rules: z.string().min(5, '电话至少 5 位'),
+    },
+  ]);
+  message.success('已动态更新子字段规则');
+}
+</script>
+
+<template>
+  <Page title="Form Array Demo">
+    <div class="grid gap-4 xl:grid-cols-[minmax(0,1fr)_360px]">
+      <Card title="数组字段">
+        <Form />
+        <Space class="mt-4 flex flex-wrap">
+          <Button type="primary" @click="handleSubmit">提交</Button>
+          <Button @click="handleGetValues">获取值</Button>
+          <Button @click="handlePatchChildRule">更新电话规则</Button>
+        </Space>
+      </Card>
+
+      <Card title="输出">
+        <pre :class="outputClass" v-text="formattedSubmitValues"></pre>
+      </Card>
+    </div>
+  </Page>
+</template>
diff --git a/playground/src/views/examples/button-group/index.vue b/playground/src/views/examples/button-group/index.vue
new file mode 100644
index 00000000..f642ce16
--- /dev/null
+++ b/playground/src/views/examples/button-group/index.vue
@@ -0,0 +1,229 @@
+<script lang="ts" setup>
+import type { Recordable } from '@vben/types';
+
+import { reactive, ref } from 'vue';
+
+import {
+  Page,
+  VbenButton,
+  VbenButtonGroup,
+  VbenCheckButtonGroup,
+} from '@vben/common-ui';
+import { LoaderCircle, Square, SquareCheckBig } from '@vben/icons';
+
+import { Button, Card, message } from 'antdv-next';
+
+import { useVbenForm } from '#/adapter/form';
+
+const radioValue = ref<string | undefined>('a');
+const checkValue = ref(['a', 'b']);
+
+const options = [
+  { label: '选项1', value: 'a' },
+  { label: '选项2', value: 'b', num: 999 },
+  { label: '选项3', value: 'c' },
+  { label: '选项4', value: 'd' },
+  { label: '选项5', value: 'e' },
+  { label: '选项6', value: 'f' },
+];
+
+function resetValues() {
+  radioValue.value = undefined;
+  checkValue.value = [];
+}
+
+function beforeChange(v: any, isChecked: boolean) {
+  return new Promise((resolve) => {
+    message.loading({
+      content: `正在设置${v}为${isChecked ? '选中' : '未选中'}...`,
+      duration: 0,
+      key: 'beforeChange',
+    });
+    setTimeout(() => {
+      message.success({ content: `${v} 已设置成功`, key: 'beforeChange' });
+      resolve(true);
+    }, 2000);
+  });
+}
+
+const compProps = reactive({
+  beforeChange: undefined,
+  disabled: false,
+  gap: 0,
+  showIcon: true,
+  size: 'middle',
+  allowClear: false,
+} as Recordable<any>);
+
+const [Form] = useVbenForm({
+  handleValuesChange(values) {
+    Object.keys(values).forEach((k) => {
+      if (k === 'beforeChange') {
+        compProps[k] = values[k] ? beforeChange : undefined;
+      } else {
+        compProps[k] = values[k];
+      }
+    });
+  },
+  commonConfig: {
+    labelWidth: 150,
+  },
+  schema: [
+    {
+      component: 'RadioGroup',
+      componentProps: {
+        options: [
+          { label: '大', value: 'large' },
+          { label: '中', value: 'middle' },
+          { label: '小', value: 'small' },
+        ],
+      },
+      defaultValue: compProps.size,
+      fieldName: 'size',
+      label: '尺寸',
+    },
+    {
+      component: 'RadioGroup',
+      componentProps: {
+        options: [
+          { label: '无', value: 0 },
+          { label: '小', value: 5 },
+          { label: '中', value: 15 },
+          { label: '大', value: 30 },
+        ],
+      },
+      defaultValue: compProps.gap,
+      fieldName: 'gap',
+      label: '间距',
+    },
+    {
+      component: 'Switch',
+      defaultValue: compProps.showIcon,
+      fieldName: 'showIcon',
+      label: '显示图标',
+    },
+    {
+      component: 'Switch',
+      defaultValue: compProps.disabled,
+      fieldName: 'disabled',
+      label: '禁用',
+    },
+    {
+      component: 'Switch',
+      defaultValue: false,
+      fieldName: 'beforeChange',
+      label: '前置回调',
+    },
+    {
+      component: 'Switch',
+      defaultValue: false,
+      fieldName: 'allowClear',
+      label: '允许清除',
+      help: '单选时是否允许取消选中（值为undefined）',
+    },
+    {
+      component: 'InputNumber',
+      defaultValue: 0,
+      fieldName: 'maxCount',
+      label: '最大选中数量',
+      help: '多选时有效，0表示不限制',
+    },
+  ],
+  showDefaultActions: false,
+  submitOnChange: true,
+});
+
+function onBtnClick(value: any) {
+  const opt = options.find((o) => o.value === value);
+  if (opt) {
+    message.success(`点击了按钮${opt.label}，value = ${value}`);
+  }
+}
+</script>
+<template>
+  <Page
+    title="VbenButtonGroup 按钮组"
+    description="VbenButtonGroup是一个按钮容器，用于包裹一组按钮，协调整体样式。VbenCheckButtonGroup则可以作为一个表单组件，提供单选或多选功能"
+  >
+    <Card title="基本用法">
+      <template #extra>
+        <Button type="primary" @click="resetValues">清空值</Button>
+      </template>
+      <p class="mt-4">按钮组：</p>
+      <div class="mt-2 flex flex-col gap-2">
+        <VbenButtonGroup v-bind="compProps" border>
+          <VbenButton
+            v-for="btn in options"
+            :key="btn.value"
+            variant="link"
+            @click="onBtnClick(btn.value)"
+          >
+            {{ btn.label }}
+          </VbenButton>
+        </VbenButtonGroup>
+        <VbenButtonGroup v-bind="compProps" border>
+          <VbenButton
+            v-for="btn in options"
+            :key="btn.value"
+            variant="outline"
+            @click="onBtnClick(btn.value)"
+          >
+            {{ btn.label }}
+          </VbenButton>
+        </VbenButtonGroup>
+      </div>
+      <p class="mt-4">单选：{{ radioValue }}</p>
+      <div class="mt-2 flex flex-col gap-2">
+        <VbenCheckButtonGroup
+          v-model="radioValue"
+          :options="options"
+          v-bind="compProps"
+        />
+      </div>
+      <p class="mt-4">单选插槽：{{ radioValue }}</p>
+      <div class="mt-2 flex flex-col gap-2">
+        <VbenCheckButtonGroup
+          v-model="radioValue"
+          :options="options"
+          v-bind="compProps"
+        >
+          <template #option="{ label, value, data }">
+            <div class="flex items-center">
+              <span>{{ label }}</span>
+              <span class="ml-2 text-gray-400">{{ value }}</span>
+              <span v-if="data.num" class="white ml-2">{{ data.num }}</span>
+            </div>
+          </template>
+        </VbenCheckButtonGroup>
+      </div>
+      <p class="mt-4">多选{{ checkValue }}</p>
+      <div class="mt-2 flex flex-col gap-2">
+        <VbenCheckButtonGroup
+          v-model="checkValue"
+          multiple
+          :options="options"
+          v-bind="compProps"
+        />
+      </div>
+      <p class="mt-4">自定义图标{{ checkValue }}</p>
+      <div class="mt-2 flex flex-col gap-2">
+        <VbenCheckButtonGroup
+          v-model="checkValue"
+          multiple
+          :options="options"
+          v-bind="compProps"
+        >
+          <template #icon="{ loading, checked }">
+            <LoaderCircle class="animate-spin" v-if="loading" />
+            <SquareCheckBig v-else-if="checked" />
+            <Square v-else />
+          </template>
+        </VbenCheckButtonGroup>
+      </div>
+    </Card>
+
+    <Card title="设置" class="mt-4">
+      <Form />
+    </Card>
+  </Page>
+</template>
diff --git a/playground/src/views/examples/captcha/point-selection-captcha.vue b/playground/src/views/examples/captcha/point-selection-captcha.vue
index ae8ab0af..2663cb5e 100644
--- a/playground/src/views/examples/captcha/point-selection-captcha.vue
+++ b/playground/src/views/examples/captcha/point-selection-captcha.vue
@@ -5,7 +5,7 @@ import { reactive, ref } from 'vue';
 
 import { Page, PointSelectionCaptcha } from '@vben/common-ui';
 
-import { Card, Input, InputNumber, message, Switch } from 'ant-design-vue';
+import { Card, Input, InputNumber, message, Switch } from 'antdv-next';
 
 import { $t } from '#/locales';
 
@@ -64,7 +64,7 @@ const handleClick = (point: CaptchaPoint) => {
         />
         <div class="ml-8 flex w-96 items-center">
           <Switch
-            v-model:checked="params.showHintImage"
+            v-model="params.showHintImage"
             :checked-children="$t('examples.captcha.hintImage')"
             :un-checked-children="$t('examples.captcha.hintText')"
             class="mr-4 w-40"
@@ -82,7 +82,7 @@ const handleClick = (point: CaptchaPoint) => {
         </div>
 
         <Switch
-          v-model:checked="params.showConfirm"
+          v-model="params.showConfirm"
           :checked-children="$t('examples.captcha.showConfirm')"
           :un-checked-children="$t('examples.captcha.hideConfirm')"
           class="ml-8 w-28"
diff --git a/playground/src/views/examples/captcha/slider-captcha.vue b/playground/src/views/examples/captcha/slider-captcha.vue
index 0a397655..816ff872 100644
--- a/playground/src/views/examples/captcha/slider-captcha.vue
+++ b/playground/src/views/examples/captcha/slider-captcha.vue
@@ -9,7 +9,7 @@ import { ref } from 'vue';
 import { Page, SliderCaptcha } from '@vben/common-ui';
 import { Bell, Sun } from '@vben/icons';
 
-import { Button, Card, message } from 'ant-design-vue';
+import { Button, Card, message } from 'antdv-next';
 
 function handleSuccess(data: CaptchaVerifyPassingData) {
   const { time } = data;
@@ -33,7 +33,7 @@ const el6 = ref<SliderCaptchaActionType>();
 <template>
   <Page description="用于前端简单的拖动校验场景" title="滑块校验">
     <Card class="mb-5" title="基础示例">
-      <div class="flex items-center justify-center p-4 px-[30%]">
+      <div class="flex-center p-4 px-[30%]">
         <SliderCaptcha ref="el1" @success="handleSuccess" />
         <Button class="ml-2" type="primary" @click="handleBtnClick(el1)">
           还原
@@ -41,7 +41,7 @@ const el6 = ref<SliderCaptchaActionType>();
       </div>
     </Card>
     <Card class="mb-5" title="自定义圆角">
-      <div class="flex items-center justify-center p-4 px-[30%]">
+      <div class="flex-center p-4 px-[30%]">
         <SliderCaptcha
           ref="el2"
           class="rounded-full"
@@ -53,7 +53,7 @@ const el6 = ref<SliderCaptchaActionType>();
       </div>
     </Card>
     <Card class="mb-5" title="自定义背景色">
-      <div class="flex items-center justify-center p-4 px-[30%]">
+      <div class="flex-center p-4 px-[30%]">
         <SliderCaptcha
           ref="el3"
           :bar-style="{
@@ -69,7 +69,7 @@ const el6 = ref<SliderCaptchaActionType>();
       </div>
     </Card>
     <Card class="mb-5" title="自定义拖拽图标">
-      <div class="flex items-center justify-center p-4 px-[30%]">
+      <div class="flex-center p-4 px-[30%]">
         <SliderCaptcha ref="el4" @success="handleSuccess">
           <template #actionIcon="{ isPassing }">
             <Bell v-if="isPassing" />
@@ -82,7 +82,7 @@ const el6 = ref<SliderCaptchaActionType>();
       </div>
     </Card>
     <Card class="mb-5" title="自定义文本">
-      <div class="flex items-center justify-center p-4 px-[30%]">
+      <div class="flex-center p-4 px-[30%]">
         <SliderCaptcha
           ref="el5"
           success-text="成功"
@@ -95,7 +95,7 @@ const el6 = ref<SliderCaptchaActionType>();
       </div>
     </Card>
     <Card class="mb-5" title="自定义内容(slot)">
-      <div class="flex items-center justify-center p-4 px-[30%]">
+      <div class="flex-center p-4 px-[30%]">
         <SliderCaptcha ref="el6" @success="handleSuccess">
           <template #text="{ isPassing }">
             <template v-if="isPassing">
diff --git a/playground/src/views/examples/captcha/slider-rotate-captcha.vue b/playground/src/views/examples/captcha/slider-rotate-captcha.vue
index 23775774..6258a928 100644
--- a/playground/src/views/examples/captcha/slider-rotate-captcha.vue
+++ b/playground/src/views/examples/captcha/slider-rotate-captcha.vue
@@ -5,7 +5,7 @@ import { Page, SliderRotateCaptcha } from '@vben/common-ui';
 import { preferences } from '@vben/preferences';
 import { useUserStore } from '@vben/stores';
 
-import { Card, message } from 'ant-design-vue';
+import { Card, message } from 'antdv-next';
 
 const userStore = useUserStore();
 function handleSuccess() {
@@ -20,7 +20,7 @@ const avatar = computed(() => {
 <template>
   <Page description="用于前端简单的拖动校验场景" title="滑块旋转校验">
     <Card class="mb-5" title="基本示例">
-      <div class="flex items-center justify-center p-4">
+      <div class="flex-center p-4">
         <SliderRotateCaptcha :src="avatar" @success="handleSuccess" />
       </div>
     </Card>
diff --git a/playground/src/views/examples/captcha/slider-translate-captcha.vue b/playground/src/views/examples/captcha/slider-translate-captcha.vue
new file mode 100644
index 00000000..abe54a3a
--- /dev/null
+++ b/playground/src/views/examples/captcha/slider-translate-captcha.vue
@@ -0,0 +1,27 @@
+<script setup lang="ts">
+import { Page, SliderTranslateCaptcha } from '@vben/common-ui';
+
+import { Card, message } from 'antdv-next';
+
+function handleSuccess() {
+  message.success('success!');
+}
+</script>
+
+<template>
+  <Page
+    description="用于前端简单的拼图滑块水平拖动校验场景"
+    title="拼图滑块校验"
+  >
+    <Card class="mb-5" title="基本示例">
+      <div class="flex-center p-4">
+        <SliderTranslateCaptcha
+          src="https://unpkg.com/@vbenjs/static-source@0.1.7/source/pro-avatar.webp"
+          :canvas-width="420"
+          :canvas-height="420"
+          @success="handleSuccess"
+        />
+      </div>
+    </Card>
+  </Page>
+</template>
diff --git a/playground/src/views/examples/context-menu/index.vue b/playground/src/views/examples/context-menu/index.vue
new file mode 100644
index 00000000..29038dc7
--- /dev/null
+++ b/playground/src/views/examples/context-menu/index.vue
@@ -0,0 +1,57 @@
+<script setup lang="ts">
+import { Page, VbenContextMenu } from '@vben/common-ui';
+
+import { Button, Card, message } from 'antdv-next';
+
+const needHidden = (role: string) => {
+  return role === 'user';
+};
+
+const contextMenus = () => {
+  return [
+    {
+      text: '刷新',
+      key: 'refresh',
+      handler: (data: any) => {
+        message.success('刷新成功', data);
+      },
+      hidden: needHidden('admin'),
+    },
+    {
+      text: '关闭当前',
+      key: 'close-current',
+      handler: (data: any) => {
+        message.success('关闭当前', data);
+      },
+      hidden: needHidden('user'),
+    },
+    {
+      text: '关闭其他',
+      key: 'close-other',
+      handler: (data: any) => {
+        message.success('关闭其他', data);
+      },
+    },
+    {
+      text: '关闭所有',
+      key: 'close-all',
+      handler: (data: any) => {
+        message.success('关闭所有', data);
+      },
+    },
+  ];
+};
+</script>
+
+<template>
+  <Page title="Context Menu 上下文菜单">
+    <Card title="基本使用">
+      <div>一共四个菜单（刷新、关闭当前、关闭其他、关闭所有）</div>
+      <br />
+      <br />
+      <VbenContextMenu :menus="contextMenus" :modal="true" item-class="pr-6">
+        <Button> 右键点击我打开上下文菜单(有隐藏项) </Button>
+      </VbenContextMenu>
+    </Card>
+  </Page>
+</template>
diff --git a/playground/src/views/examples/count-to/index.vue b/playground/src/views/examples/count-to/index.vue
new file mode 100644
index 00000000..2343f251
--- /dev/null
+++ b/playground/src/views/examples/count-to/index.vue
@@ -0,0 +1,175 @@
+<script lang="ts" setup>
+import type { CountToProps, TransitionPresets } from '@vben/common-ui';
+
+import { reactive } from 'vue';
+
+import { CountTo, Page, TransitionPresetsKeys } from '@vben/common-ui';
+import { IconifyIcon } from '@vben/icons';
+
+import {
+  Button,
+  Card,
+  Col,
+  Form,
+  FormItem,
+  Input,
+  InputNumber,
+  message,
+  Row,
+  Select,
+  Switch,
+} from 'antdv-next';
+
+const props = reactive<CountToProps & { transition: TransitionPresets }>({
+  decimal: '.',
+  decimals: 2,
+  decimalStyle: {
+    fontSize: 'small',
+    fontStyle: 'italic',
+  },
+  delay: 0,
+  disabled: false,
+  duration: 2000,
+  endVal: 100_000,
+  mainStyle: {
+    color: 'hsl(var(--primary))',
+    fontSize: 'xx-large',
+    fontWeight: 'bold',
+  },
+  prefix: '￥',
+  prefixStyle: {
+    paddingRight: '0.5rem',
+  },
+  separator: ',',
+  startVal: 0,
+  suffix: '元',
+  suffixStyle: {
+    paddingLeft: '0.5rem',
+  },
+  transition: 'easeOutQuart',
+});
+
+function changeNumber() {
+  props.endVal =
+    Math.floor(Math.random() * 100_000_000) / 10 ** (props.decimals || 0);
+}
+
+function openDocumentation() {
+  window.open('https://vueuse.org/core/useTransition/', '_blank');
+}
+
+function onStarted() {
+  message.loading({
+    content: '动画已开始',
+    duration: 0,
+    key: 'animator-info',
+  });
+}
+
+function onFinished() {
+  message.success({
+    content: '动画已结束',
+    duration: 2,
+    key: 'animator-info',
+  });
+}
+</script>
+<template>
+  <Page title="CountTo" description="数字滚动动画组件。使用">
+    <template #description>
+      <span>
+        使用useTransition封装的数字滚动动画组件，每次改变当前值都会产生过渡动画。
+      </span>
+      <Button type="link" @click="openDocumentation">
+        查看useTransition文档
+      </Button>
+    </template>
+    <Card title="基本用法">
+      <div class="flex-center w-full pb-4">
+        <CountTo v-bind="props" @started="onStarted" @finished="onFinished" />
+      </div>
+      <Form :model="props">
+        <Row :gutter="20">
+          <Col :span="8">
+            <FormItem label="初始值" name="startVal">
+              <InputNumber v-model:value="props.startVal" />
+            </FormItem>
+          </Col>
+          <Col :span="8">
+            <FormItem label="当前值" name="endVal">
+              <InputNumber
+                v-model:value="props.endVal"
+                class="w-full"
+                :precision="props.decimals"
+              >
+                <template #addonAfter>
+                  <IconifyIcon
+                    v-tippy="`设置一个随机值`"
+                    class="size-5 cursor-pointer outline-hidden"
+                    icon="ix:random-filled"
+                    @click="changeNumber"
+                  />
+                </template>
+              </InputNumber>
+            </FormItem>
+          </Col>
+          <Col :span="8">
+            <FormItem label="禁用动画" name="disabled">
+              <Switch v-model="props.disabled" />
+            </FormItem>
+          </Col>
+          <Col :span="8">
+            <FormItem label="延迟动画" name="delay">
+              <InputNumber v-model:value="props.delay" :min="0" />
+            </FormItem>
+          </Col>
+          <Col :span="8">
+            <FormItem label="持续时间" name="duration">
+              <InputNumber v-model:value="props.duration" :min="0" />
+            </FormItem>
+          </Col>
+
+          <Col :span="8">
+            <FormItem label="小数位数" name="decimals">
+              <InputNumber
+                v-model:value="props.decimals"
+                :min="0"
+                :precision="0"
+              />
+            </FormItem>
+          </Col>
+          <Col :span="8">
+            <FormItem label="分隔符" name="separator">
+              <Input v-model:value="props.separator" />
+            </FormItem>
+          </Col>
+          <Col :span="8">
+            <FormItem label="小数点" name="decimal">
+              <Input v-model:value="props.decimal" />
+            </FormItem>
+          </Col>
+          <Col :span="8">
+            <FormItem label="动画" name="transition">
+              <Select
+                v-model:value="props.transition"
+                :options="
+                  TransitionPresetsKeys.map((p) => ({ label: p, value: p }))
+                "
+              />
+            </FormItem>
+          </Col>
+          <Col :span="8">
+            <FormItem label="前缀" name="prefix">
+              <Input v-model:value="props.prefix" />
+            </FormItem>
+          </Col>
+          <Col :span="8">
+            <FormItem label="后缀" name="suffix">
+              <Input v-model:value="props.suffix" />
+            </FormItem>
+          </Col>
+        </Row>
+      </Form>
+    </Card>
+  </Page>
+</template>
diff --git a/playground/src/views/examples/cropper/index.vue b/playground/src/views/examples/cropper/index.vue
new file mode 100644
index 00000000..f652eaea
--- /dev/null
+++ b/playground/src/views/examples/cropper/index.vue
@@ -0,0 +1,144 @@
+<script lang="ts" setup>
+import type { UploadChangeParam } from 'antdv-next';
+
+import { ref } from 'vue';
+
+import { Page, VCropper } from '@vben/common-ui';
+
+import { Button, Card, Select, Upload } from 'antdv-next';
+
+const options = [
+  { label: '1:1', value: '1:1' },
+  { label: '16:9', value: '16:9' },
+  { label: '不限制', value: '' },
+];
+
+const cropperRef = ref<InstanceType<typeof VCropper>>();
+
+const cropLoading = ref(false);
+const validAspectRatio = ref<string | undefined>('1:1');
+const imgUrl = ref('');
+const cropperImg = ref();
+
+const selectImgFile = (event: UploadChangeParam) => {
+  const file = event.fileList[0]?.originFileObj;
+  if (!file) return;
+
+  if (!file.type.startsWith('image/')) {
+    console.error('请上传图片文件');
+    return;
+  }
+
+  const reader = new FileReader();
+  reader.addEventListener('load', (e) => {
+    imgUrl.value = e.target?.result as string;
+  });
+  reader.addEventListener('error', () => {
+    console.error('Failed to read file');
+  });
+
+  reader.readAsDataURL(file);
+};
+
+const cropImage = async () => {
+  if (!cropperRef.value) return;
+  cropLoading.value = true;
+  try {
+    cropperImg.value = await cropperRef.value.getCropImage(
+      'image/jpeg',
+      0.92,
+      'base64',
+    );
+  } catch (error) {
+    console.error('图片裁剪失败:', error);
+  } finally {
+    cropLoading.value = false;
+  }
+};
+
+/**
+ * 下载图片
+ */
+const downloadImage = () => {
+  if (!cropperImg.value) return;
+
+  const link = document.createElement('a');
+  link.download = `cropped-image-${Date.now()}.png`;
+  link.href = cropperImg.value;
+  link.click();
+};
+</script>
+<template>
+  <Page
+    title="VCropper 图片裁剪"
+    description="VCropper是一个图片裁剪组件，提供基础的图片裁剪功能。"
+  >
+    <Card>
+      <div class="image-cropper-container">
+        <div class="cropper-ratio-display">
+          <label class="ratio-label">当前裁剪比例：</label>
+          <Select
+            class="w-24"
+            v-model:value="validAspectRatio"
+            :options="options"
+          />
+          <Upload
+            :max-count="1"
+            :show-upload-list="false"
+            :before-upload="() => false"
+            @change="selectImgFile"
+          >
+            <Button>上传图片</Button>
+          </Upload>
+        </div>
+
+        <div v-if="imgUrl" class="cropper-main-wrapper">
+          <VCropper
+            ref="cropperRef"
+            :img="imgUrl"
+            :aspect-ratio="validAspectRatio"
+            :width="600"
+            :height="600"
+          />
+
+          <!-- 操作按钮组 -->
+          <div class="cropper-btn-group">
+            <Button :loading="cropLoading" @click="cropImage" type="primary">
+              裁剪
+            </Button>
+            <Button v-if="cropperImg" @click="downloadImage" danger>
+              下载图片
+            </Button>
+          </div>
+
+          <!-- 裁剪预览 -->
+          <img
+            v-if="cropperImg"
+            class="h-full w-80"
+            :src="cropperImg"
+            alt="裁剪预览"
+          />
+        </div>
+      </div>
+    </Card>
+  </Page>
+</template>
+<style scoped>
+/* 比例展示区域 */
+.cropper-ratio-display {
+  @apply my-2.5 flex items-center justify-start gap-4;
+}
+
+.ratio-label {
+  @apply text-sm font-medium;
+}
+
+/* 主裁剪区域 */
+.cropper-main-wrapper {
+  @apply flex items-center gap-4;
+}
+
+.cropper-btn-group {
+  @apply flex flex-col gap-2;
+}
+</style>
diff --git a/playground/src/views/examples/doc-button.vue b/playground/src/views/examples/doc-button.vue
index 4dad2a8d..c9746adc 100644
--- a/playground/src/views/examples/doc-button.vue
+++ b/playground/src/views/examples/doc-button.vue
@@ -2,7 +2,7 @@
 import { VBEN_DOC_URL } from '@vben/constants';
 import { openWindow } from '@vben/utils';
 
-import { Button } from 'ant-design-vue';
+import { Button } from 'antdv-next';
 
 const props = defineProps<{ path: string }>();
 
diff --git a/playground/src/views/examples/drawer/auto-height-demo.vue b/playground/src/views/examples/drawer/auto-height-demo.vue
index 0c327340..d517a8ab 100644
--- a/playground/src/views/examples/drawer/auto-height-demo.vue
+++ b/playground/src/views/examples/drawer/auto-height-demo.vue
@@ -3,7 +3,7 @@ import { ref } from 'vue';
 
 import { useVbenDrawer } from '@vben/common-ui';
 
-import { Button, message } from 'ant-design-vue';
+import { Button, message } from 'antdv-next';
 
 const list = ref<number[]>([]);
 
@@ -35,7 +35,7 @@ function handleUpdate(len: number) {
     <div
       v-for="item in list"
       :key="item"
-      class="even:bg-heavy bg-muted flex-center h-[220px] w-full"
+      class="flex-center h-55 w-full bg-muted even:bg-heavy"
     >
       {{ item }}
     </div>
diff --git a/playground/src/views/examples/drawer/base-demo.vue b/playground/src/views/examples/drawer/base-demo.vue
index ffa5e390..2e36966d 100644
--- a/playground/src/views/examples/drawer/base-demo.vue
+++ b/playground/src/views/examples/drawer/base-demo.vue
@@ -1,24 +1,35 @@
 <script lang="ts" setup>
 import { useVbenDrawer } from '@vben/common-ui';
 
-import { message } from 'ant-design-vue';
+import { Button, message } from 'antdv-next';
 
 const [Drawer, drawerApi] = useVbenDrawer({
   onCancel() {
     drawerApi.close();
   },
+  onClosed() {
+    drawerApi.setState({ overlayBlur: 0, placement: 'right' });
+  },
   onConfirm() {
     message.info('onConfirm');
     // drawerApi.close();
   },
 });
+
+function lockDrawer() {
+  drawerApi.lock();
+  setTimeout(() => {
+    drawerApi.unlock();
+  }, 3000);
+}
 </script>
 <template>
   <Drawer title="基础抽屉示例" title-tooltip="标题提示内容">
     <template #extra> extra </template>
     base demo
-
+    <Button type="primary" @click="lockDrawer">锁定抽屉状态</Button>
     <!-- <template #prepend-footer> slot </template> -->
     <!-- <template #append-footer> prepend slot </template> -->
+    <!-- <template #center-footer> center slot </template> -->
   </Drawer>
 </template>
diff --git a/playground/src/views/examples/drawer/dynamic-demo.vue b/playground/src/views/examples/drawer/dynamic-demo.vue
index ce5560fa..18e67631 100644
--- a/playground/src/views/examples/drawer/dynamic-demo.vue
+++ b/playground/src/views/examples/drawer/dynamic-demo.vue
@@ -1,7 +1,7 @@
 <script lang="ts" setup>
 import { useVbenDrawer } from '@vben/common-ui';
 
-import { Button, message } from 'ant-design-vue';
+import { Button, message } from 'antdv-next';
 
 const [Drawer, drawerApi] = useVbenDrawer({
   onCancel() {
diff --git a/playground/src/views/examples/drawer/form-drawer-demo.vue b/playground/src/views/examples/drawer/form-drawer-demo.vue
index 5af392f6..eab0c961 100644
--- a/playground/src/views/examples/drawer/form-drawer-demo.vue
+++ b/playground/src/views/examples/drawer/form-drawer-demo.vue
@@ -7,6 +7,10 @@ defineOptions({
   name: 'FormDrawerDemo',
 });
 
+interface FormDrawerData {
+  values?: Record<string, unknown>;
+}
+
 const [Form, formApi] = useVbenForm({
   schema: [
     {
@@ -30,24 +34,28 @@ const [Form, formApi] = useVbenForm({
   ],
   showDefaultActions: false,
 });
-const [Drawer, drawerApi] = useVbenDrawer({
+const [Drawer, drawerApi] = useVbenDrawer<FormDrawerData>({
   onCancel() {
     drawerApi.close();
   },
   onConfirm: async () => {
-    await formApi.submitForm();
+    await formApi.submit();
     drawerApi.close();
   },
   onOpenChange(isOpen: boolean) {
     if (isOpen) {
-      const { values } = drawerApi.getData<Record<string, any>>();
-      if (values) {
-        formApi.setValues(values);
+      const data = drawerApi.getData();
+      if (data?.values) {
+        formApi.setValues(data.values);
+      } else {
+        formApi.reset();
       }
     }
   },
   title: '内嵌表单示例',
 });
+
+defineExpose({ drawerApi });
 </script>
 <template>
   <Drawer>
diff --git a/playground/src/views/examples/drawer/in-content-demo.vue b/playground/src/views/examples/drawer/in-content-demo.vue
index 8bc29b2c..66c7d38d 100644
--- a/playground/src/views/examples/drawer/in-content-demo.vue
+++ b/playground/src/views/examples/drawer/in-content-demo.vue
@@ -1,9 +1,31 @@
 <script lang="ts" setup>
+import { ref } from 'vue';
+
 import { useVbenDrawer } from '@vben/common-ui';
 
-import { message } from 'ant-design-vue';
+import { Input, message } from 'antdv-next';
+
+import { useVbenForm } from '#/adapter/form';
+
+const value = ref('');
+
+const [Form] = useVbenForm({
+  schema: [
+    {
+      component: 'Input',
+      componentProps: {
+        placeholder: 'KeepAlive测试：内部组件',
+      },
+      fieldName: 'field1',
+      hideLabel: true,
+      label: '字段1',
+    },
+  ],
+  showDefaultActions: false,
+});
 
 const [Drawer, drawerApi] = useVbenDrawer({
+  destroyOnClose: false,
   onCancel() {
     drawerApi.close();
   },
@@ -16,6 +38,11 @@ const [Drawer, drawerApi] = useVbenDrawer({
 <template>
   <Drawer append-to-main title="基础抽屉示例" title-tooltip="标题提示内容">
     <template #extra> extra </template>
-    本抽屉指定在内容区域打开
+    此弹窗指定在内容区域打开，并且在关闭之后弹窗内容不会被销毁
+    <Input
+      v-model:value="value"
+      placeholder="KeepAlive测试:connectedComponent"
+    />
+    <Form />
   </Drawer>
 </template>
diff --git a/playground/src/views/examples/drawer/index.vue b/playground/src/views/examples/drawer/index.vue
index 32d3c95d..b57c5946 100644
--- a/playground/src/views/examples/drawer/index.vue
+++ b/playground/src/views/examples/drawer/index.vue
@@ -1,7 +1,11 @@
 <script lang="ts" setup>
-import { type DrawerPlacement, Page, useVbenDrawer } from '@vben/common-ui';
+import type { DrawerPlacement, DrawerState } from '@vben/common-ui';
 
-import { Button, Card } from 'ant-design-vue';
+import type { ExplicitDrawerData } from './typed-data-contract';
+
+import { Page, useVbenDrawer } from '@vben/common-ui';
+
+import { Button, Card } from 'antdv-next';
 
 import DocButton from '../doc-button.vue';
 import AutoHeightDemo from './auto-height-demo.vue';
@@ -10,7 +14,12 @@ import DynamicDemo from './dynamic-demo.vue';
 import FormDrawerDemo from './form-drawer-demo.vue';
 import inContentDemo from './in-content-demo.vue';
 import SharedDataDemo from './shared-data-demo.vue';
+import TypedDataAutoDemo from './typed-data-auto-demo.vue';
+import { useFactoryDrawer } from './typed-data-contract';
+import TypedDataExplicitDemo from './typed-data-explicit-demo.vue';
+import TypedDataFactoryDemo from './typed-data-factory-demo.vue';
 
+defineOptions({ name: 'DrawerExample' });
 const [BaseDrawer, baseDrawerApi] = useVbenDrawer({
   // 连接抽离的组件
   connectedComponent: BaseDemo,
@@ -39,26 +48,39 @@ const [FormDrawer, formDrawerApi] = useVbenDrawer({
   connectedComponent: FormDrawerDemo,
 });
 
+const [TypedDataAutoDrawer, typedDataAutoDrawerApi] = useVbenDrawer({
+  connectedComponent: TypedDataAutoDemo,
+});
+
+const [TypedDataExplicitDrawer, typedDataExplicitDrawerApi] =
+  useVbenDrawer<ExplicitDrawerData>({
+    connectedComponent: TypedDataExplicitDemo,
+  });
+
+const [TypedDataFactoryDrawer, typedDataFactoryDrawerApi] = useFactoryDrawer({
+  connectedComponent: TypedDataFactoryDemo,
+});
+
 function openBaseDrawer(placement: DrawerPlacement = 'right') {
-  baseDrawerApi.setState({ placement });
-  baseDrawerApi.open();
+  baseDrawerApi.setState({ placement }).open();
+}
+
+function openBlurDrawer() {
+  baseDrawerApi.setState({ overlayBlur: 5 }).open();
 }
 
 function openInContentDrawer(placement: DrawerPlacement = 'right') {
-  inContentDrawerApi.setState({ class: '', placement });
+  const state: Partial<DrawerState> = { class: '', placement };
   if (placement === 'top') {
     // 页面顶部区域的层级只有200，所以设置一个低于200的值，抽屉从顶部滑出来的时候才比较合适
-    inContentDrawerApi.setState({ zIndex: 199 });
-  } else {
-    inContentDrawerApi.setState({ zIndex: undefined });
+    state.zIndex = 199;
   }
-  inContentDrawerApi.open();
+  inContentDrawerApi.setState(state).open();
 }
 
 function openMaxContentDrawer() {
-  // 这里只是用来演示方便。实际上自己使用的时候可以直接将这些配置卸载Drawer的属性里
-  inContentDrawerApi.setState({ class: 'w-full', placement: 'right' });
-  inContentDrawerApi.open();
+  // 这里只是用来演示方便。实际上自己使用的时候可以直接将这些配置写在Drawer的属性里
+  inContentDrawerApi.setState({ class: 'w-full', placement: 'right' }).open();
 }
 
 function openAutoHeightDrawer() {
@@ -70,24 +92,52 @@ function openDynamicDrawer() {
 }
 
 function handleUpdateTitle() {
-  dynamicDrawerApi.setState({ title: '外部动态标题' });
-  dynamicDrawerApi.open();
+  dynamicDrawerApi.setState({ title: '外部动态标题' }).open();
 }
 
 function openSharedDrawer() {
-  sharedDrawerApi.setData({
-    content: '外部传递的数据 content',
-    payload: '外部传递的数据 payload',
-  });
-  sharedDrawerApi.open();
+  sharedDrawerApi
+    .setData({
+      content: '外部传递的数据 content',
+      payload: '外部传递的数据 payload',
+    })
+    .open();
 }
 
 function openFormDrawer() {
-  formDrawerApi.setData({
-    // 表单值
-    values: { field1: 'abc', field2: '123' },
-  });
-  formDrawerApi.open();
+  formDrawerApi
+    .setData({
+      // 表单值
+      values: { field1: 'abc', field2: '123' },
+    })
+    .open();
+}
+
+function openTypedDataAutoDrawer() {
+  typedDataAutoDrawerApi
+    .setData({
+      message: '外部无需声明泛型，由 connected component 自动推导。',
+      method: '自动推导',
+    })
+    .open();
+}
+
+function openTypedDataExplicitDrawer() {
+  typedDataExplicitDrawerApi
+    .setData({
+      message: '父子组件显式引用同一个数据类型。',
+      method: '显式泛型',
+    })
+    .open();
+}
+
+function openTypedDataFactoryDrawer() {
+  typedDataFactoryDrawerApi
+    .setData({
+      message: '父子组件复用预绑定的 typed composable。',
+      method: '契约工厂',
+    })
+    .open();
 }
 </script>
 
@@ -106,6 +156,9 @@ function openFormDrawer() {
     <DynamicDrawer />
     <SharedDataDrawer />
     <FormDrawer />
+    <TypedDataAutoDrawer />
+    <TypedDataExplicitDrawer />
+    <TypedDataFactoryDrawer />
 
     <Card class="mb-4" title="基本使用">
       <p class="mb-3">一个基础的抽屉示例</p>
@@ -125,6 +178,9 @@ function openFormDrawer() {
       <Button class="mb-2 ml-2" type="primary" @click="openBaseDrawer('top')">
         顶部打开
       </Button>
+      <Button class="mb-2 ml-2" type="primary" @click="openBlurDrawer">
+        遮罩层模糊效果
+      </Button>
     </Card>
 
     <Card class="mb-4" title="在内容区域打开">
@@ -184,5 +240,30 @@ function openFormDrawer() {
         打开抽屉并设置表单schema以及数据
       </Button>
     </Card>
+
+    <Card class="mb-4" title="共享数据：自动推导">
+      <p class="mb-3">
+        子组件 expose API，父组件从 connected component 推导类型
+      </p>
+      <Button type="primary" @click="openTypedDataAutoDrawer">
+        打开自动推导示例
+      </Button>
+    </Card>
+
+    <Card class="mb-4" title="共享数据：显式泛型">
+      <p class="mb-3">无法自动推导时，父子组件显式引用同一个数据类型</p>
+      <Button type="primary" @click="openTypedDataExplicitDrawer">
+        打开显式泛型示例
+      </Button>
+    </Card>
+
+    <Card class="mb-4" title="共享数据：契约工厂">
+      <p class="mb-3">
+        通过 createVbenDrawer 预绑定类型并复用 typed composable
+      </p>
+      <Button type="primary" @click="openTypedDataFactoryDrawer">
+        打开契约工厂示例
+      </Button>
+    </Card>
   </Page>
 </template>
diff --git a/playground/src/views/examples/drawer/shared-data-demo.vue b/playground/src/views/examples/drawer/shared-data-demo.vue
index d5422739..90f7eca6 100644
--- a/playground/src/views/examples/drawer/shared-data-demo.vue
+++ b/playground/src/views/examples/drawer/shared-data-demo.vue
@@ -3,11 +3,16 @@ import { ref } from 'vue';
 
 import { useVbenDrawer } from '@vben/common-ui';
 
-import { message } from 'ant-design-vue';
+import { message } from 'antdv-next';
 
-const data = ref();
+interface SharedData {
+  content: string;
+  payload: string;
+}
 
-const [Drawer, drawerApi] = useVbenDrawer({
+const data = ref<SharedData>();
+
+const [Drawer, drawerApi] = useVbenDrawer<SharedData>({
   onCancel() {
     drawerApi.close();
   },
@@ -17,10 +22,12 @@ const [Drawer, drawerApi] = useVbenDrawer({
   },
   onOpenChange(isOpen: boolean) {
     if (isOpen) {
-      data.value = drawerApi.getData<Record<string, any>>();
+      data.value = drawerApi.getData();
     }
   },
 });
+
+defineExpose({ drawerApi });
 </script>
 <template>
   <Drawer title="数据共享示例">
diff --git a/playground/src/views/examples/drawer/typed-data-auto-demo.vue b/playground/src/views/examples/drawer/typed-data-auto-demo.vue
new file mode 100644
index 00000000..5af52258
--- /dev/null
+++ b/playground/src/views/examples/drawer/typed-data-auto-demo.vue
@@ -0,0 +1,29 @@
+<script setup lang="ts">
+import { ref } from 'vue';
+
+import { useVbenDrawer } from '@vben/common-ui';
+
+interface AutoDrawerData {
+  message: string;
+  method: '自动推导';
+}
+
+const data = ref<AutoDrawerData>();
+
+const [Drawer, drawerApi] = useVbenDrawer<AutoDrawerData>({
+  onOpenChange(isOpen) {
+    data.value = isOpen ? drawerApi.getData() : undefined;
+  },
+});
+
+defineExpose({ drawerApi });
+</script>
+
+<template>
+  <Drawer title="自动推导数据类型">
+    <div class="space-y-2 px-2">
+      <p>类型来源：{{ data?.method }}</p>
+      <p>接收内容：{{ data?.message }}</p>
+    </div>
+  </Drawer>
+</template>
diff --git a/playground/src/views/examples/drawer/typed-data-contract.ts b/playground/src/views/examples/drawer/typed-data-contract.ts
new file mode 100644
index 00000000..96ab8e25
--- /dev/null
+++ b/playground/src/views/examples/drawer/typed-data-contract.ts
@@ -0,0 +1,13 @@
+import { createVbenDrawer } from '@vben/common-ui';
+
+export interface ExplicitDrawerData {
+  message: string;
+  method: '显式泛型';
+}
+
+export interface FactoryDrawerData {
+  message: string;
+  method: '契约工厂';
+}
+
+export const useFactoryDrawer = createVbenDrawer<FactoryDrawerData>();
diff --git a/playground/src/views/examples/drawer/typed-data-explicit-demo.vue b/playground/src/views/examples/drawer/typed-data-explicit-demo.vue
new file mode 100644
index 00000000..cad5315e
--- /dev/null
+++ b/playground/src/views/examples/drawer/typed-data-explicit-demo.vue
@@ -0,0 +1,24 @@
+<script setup lang="ts">
+import type { ExplicitDrawerData } from './typed-data-contract';
+
+import { ref } from 'vue';
+
+import { useVbenDrawer } from '@vben/common-ui';
+
+const data = ref<ExplicitDrawerData>();
+
+const [Drawer, drawerApi] = useVbenDrawer<ExplicitDrawerData>({
+  onOpenChange(isOpen) {
+    data.value = isOpen ? drawerApi.getData() : undefined;
+  },
+});
+</script>
+
+<template>
+  <Drawer title="显式泛型数据类型">
+    <div class="space-y-2 px-2">
+      <p>类型来源：{{ data?.method }}</p>
+      <p>接收内容：{{ data?.message }}</p>
+    </div>
+  </Drawer>
+</template>
diff --git a/playground/src/views/examples/drawer/typed-data-factory-demo.vue b/playground/src/views/examples/drawer/typed-data-factory-demo.vue
new file mode 100644
index 00000000..b4ee168e
--- /dev/null
+++ b/playground/src/views/examples/drawer/typed-data-factory-demo.vue
@@ -0,0 +1,24 @@
+<script setup lang="ts">
+import type { FactoryDrawerData } from './typed-data-contract';
+
+import { ref } from 'vue';
+
+import { useFactoryDrawer } from './typed-data-contract';
+
+const data = ref<FactoryDrawerData>();
+
+const [Drawer, drawerApi] = useFactoryDrawer({
+  onOpenChange(isOpen) {
+    data.value = isOpen ? drawerApi.getData() : undefined;
+  },
+});
+</script>
+
+<template>
+  <Drawer title="契约工厂数据类型">
+    <div class="space-y-2 px-2">
+      <p>类型来源：{{ data?.method }}</p>
+      <p>接收内容：{{ data?.message }}</p>
+    </div>
+  </Drawer>
+</template>
diff --git a/playground/src/views/examples/ellipsis/index.vue b/playground/src/views/examples/ellipsis/index.vue
index b88c8190..5c1ad1ce 100644
--- a/playground/src/views/examples/ellipsis/index.vue
+++ b/playground/src/views/examples/ellipsis/index.vue
@@ -3,7 +3,7 @@ import { ref } from 'vue';
 
 import { EllipsisText, Page } from '@vben/common-ui';
 
-import { Card } from 'ant-design-vue';
+import { Card } from 'antdv-next';
 
 import DocButton from '../doc-button.vue';
 
diff --git a/playground/src/views/examples/form/api.vue b/playground/src/views/examples/form/api.vue
index 02abfce3..820488ad 100644
--- a/playground/src/views/examples/form/api.vue
+++ b/playground/src/views/examples/form/api.vue
@@ -3,7 +3,7 @@ import { ref } from 'vue';
 
 import { Page } from '@vben/common-ui';
 
-import { Button, Card, message, Space } from 'ant-design-vue';
+import { Button, Card, message, Space } from 'antdv-next';
 
 import { useVbenForm } from '#/adapter/form';
 
@@ -82,6 +82,7 @@ function handleClick(
   action:
     | 'batchAddSchema'
     | 'batchDeleteSchema'
+    | 'componentRef'
     | 'disabled'
     | 'hiddenAction'
     | 'hiddenResetButton'
@@ -129,6 +130,13 @@ function handleClick(
       });
       break;
     }
+    case 'componentRef': {
+      // 获取下拉组件的实例，并调用它的focus方法
+      formApi
+        .getFieldComponentRef<{ focus?: () => void }>('fieldOptions')
+        ?.focus?.();
+      break;
+    }
     case 'disabled': {
       formApi.setState({ commonConfig: { disabled: true } });
       break;
@@ -182,6 +190,7 @@ function handleClick(
       formApi.setState({ submitButtonOptions: { show: true } });
       break;
     }
+
     case 'updateActionAlign': {
       formApi.setState({
         // 可以自行调整class
@@ -189,7 +198,6 @@ function handleClick(
       });
       break;
     }
-
     case 'updateResetButton': {
       formApi.setState({
         resetButtonOptions: { disabled: true },
@@ -257,6 +265,7 @@ function handleClick(
       <Button @click="handleClick('batchDeleteSchema')">
         批量删除表单项
       </Button>
+      <Button @click="handleClick('componentRef')">下拉组件获取焦点</Button>
     </Space>
     <Card title="操作示例">
       <BaseForm />
diff --git a/playground/src/views/examples/form/basic.vue b/playground/src/views/examples/form/basic.vue
index da292b2b..6b08ce18 100644
--- a/playground/src/views/examples/form/basic.vue
+++ b/playground/src/views/examples/form/basic.vue
@@ -1,19 +1,74 @@
 <script lang="ts" setup>
-import { ref } from 'vue';
+import type { UploadFile } from 'antdv-next';
+import type { Dayjs } from 'dayjs';
+
+import { h, ref, toRaw } from 'vue';
 
 import { Page } from '@vben/common-ui';
 
-import { Button, Card, message, TabPane, Tabs } from 'ant-design-vue';
+import { useDebounceFn } from '@vueuse/core';
+import { Button, Card, message, Spin, Tag } from 'antdv-next';
 import dayjs from 'dayjs';
 
-import { useVbenForm } from '#/adapter/form';
+import { useVbenForm, z } from '#/adapter/form';
 import { getAllMenusApi } from '#/api';
+import { upload_file } from '#/api/examples/upload';
+import { $t } from '#/locales';
 
 import DocButton from '../doc-button.vue';
 
-const activeTab = ref('basic');
+const keyword = ref('');
+const fetching = ref(false);
+
+interface BasicFormValues extends Record<string, any> {
+  cropImage?: UploadFile[];
+  files?: UploadFile[];
+  rangePicker?: [Dayjs, Dayjs];
+}
+
+function encodeBasicFormValues(values: Readonly<BasicFormValues>) {
+  const { rangePicker, ...formValues } = values;
+  return {
+    ...formValues,
+    endTime: rangePicker?.[1]?.format('YYYY-MM-DD'),
+    startTime: rangePicker?.[0]?.format('YYYY-MM-DD'),
+  };
+}
+
+type BasicSubmitValues = ReturnType<typeof encodeBasicFormValues>;
+
+function decodeBasicFormValues(
+  values: Readonly<BasicSubmitValues>,
+): BasicFormValues {
+  const { endTime, startTime, ...formValues } = values;
+  return {
+    ...formValues,
+    ...(startTime && endTime
+      ? { rangePicker: [dayjs(startTime), dayjs(endTime)] }
+      : {}),
+  };
+}
+
+// 模拟远程获取数据
+function fetchRemoteOptions({ keyword = '选项' }: Record<string, any>) {
+  fetching.value = true;
+  return new Promise((resolve) => {
+    setTimeout(() => {
+      const options = Array.from({ length: 10 }).map((_, index) => ({
+        label: `${keyword}-${index}`,
+        value: `${keyword}-${index}`,
+      }));
+      resolve(options);
+      fetching.value = false;
+    }, 1000);
+  });
+}
 
 const [BaseForm, baseFormApi] = useVbenForm({
+  codec: {
+    decode: decodeBasicFormValues,
+    encode: encodeBasicFormValues,
+  },
   // 所有表单项共用，可单独在表单内覆盖
   commonConfig: {
     // 在label后显示一个冒号
@@ -23,9 +78,11 @@ const [BaseForm, baseFormApi] = useVbenForm({
       class: 'w-full',
     },
   },
-  fieldMappingTime: [['rangePicker', ['startTime', 'endTime'], 'YYYY-MM-DD']],
   // 提交函数
   handleSubmit: onSubmit,
+  handleValuesChange(_values, fieldsChanged) {
+    message.info(`表单以下字段发生变化：${fieldsChanged.join('，')}`);
+  },
 
   // 垂直布局，label和input在不同行，值为vertical
   // 水平布局，label和input在同一行
@@ -44,6 +101,13 @@ const [BaseForm, baseFormApi] = useVbenForm({
       label: '字符串',
       rules: 'required',
     },
+    {
+      component: 'Input',
+      fieldName: 'desc',
+      // 界面显示的description
+      description: '这是表单描述',
+      label: '字符串(带描述)',
+    },
     {
       // 组件需要在 #/adapter.ts内注册，并加上类型
       component: 'ApiSelect',
@@ -58,22 +122,60 @@ const [BaseForm, baseFormApi] = useVbenForm({
         },
         // 菜单接口
         api: getAllMenusApi,
+        autoSelect: 'first',
       },
       // 字段名
       fieldName: 'api',
       // 界面显示的label
       label: 'ApiSelect',
     },
+    {
+      component: 'ApiSelect',
+      // 对应组件的参数
+      componentProps: () => {
+        return {
+          api: fetchRemoteOptions,
+          // 禁止本地过滤
+          filterOption: false,
+          // 如果正在获取数据，使用插槽显示一个loading
+          notFoundContent: fetching.value ? undefined : null,
+          // 搜索词变化时记录下来， 使用useDebounceFn防抖。
+          onSearch: useDebounceFn((value: string) => {
+            keyword.value = value;
+          }, 300),
+          // 远程搜索参数。当搜索词变化时，params也会更新
+          params: {
+            keyword: keyword.value || undefined,
+          },
+          // 远程搜索判断。当为true时，才允许调用api
+          shouldFetch: (params: any) => {
+            return !!params?.keyword;
+          },
+          showSearch: true,
+        };
+      },
+      // 字段名
+      fieldName: 'remoteSearch',
+      // 界面显示的label
+      label: '远程搜索',
+      help: '远程查询，仅有输入时方进行查询',
+      renderComponentContent: () => {
+        return {
+          notFoundContent: fetching.value ? h(Spin) : undefined,
+        };
+      },
+      rules: 'selectRequired',
+    },
     {
       component: 'ApiTreeSelect',
       // 对应组件的参数
       componentProps: {
         // 菜单接口
         api: getAllMenusApi,
-        childrenField: 'children',
         // 菜单接口转options格式
         labelField: 'name',
         valueField: 'path',
+        childrenField: 'children',
       },
       // 字段名
       fieldName: 'apiTree',
@@ -103,6 +205,7 @@ const [BaseForm, baseFormApi] = useVbenForm({
       label: '图标',
     },
     {
+      colon: false,
       component: 'Select',
       componentProps: {
         allowClear: true,
@@ -121,7 +224,7 @@ const [BaseForm, baseFormApi] = useVbenForm({
         showSearch: true,
       },
       fieldName: 'options',
-      label: '下拉选',
+      label: () => h(Tag, { color: 'warning' }, () => '😎自定义：'),
     },
     {
       component: 'RadioGroup',
@@ -177,6 +280,9 @@ const [BaseForm, baseFormApi] = useVbenForm({
           default: () => ['我已阅读并同意'],
         };
       },
+      rules: z
+        .boolean()
+        .refine((v) => v, { message: '为什么不同意？勾上它！' }),
     },
     {
       component: 'Mentions',
@@ -207,10 +313,21 @@ const [BaseForm, baseFormApi] = useVbenForm({
         class: 'w-auto',
       },
       fieldName: 'switch',
+      help: () =>
+        ['这是一个多行帮助信息', '第二行', '第三行'].map((v) => h('p', v)),
       label: '开关',
     },
     {
       component: 'DatePicker',
+      dependencies: {
+        resolve: ({ values }) => ({
+          help: () =>
+            [`这是一个可输出其他字段值的帮助信息${values.rate}`].map((value) =>
+              h('p', value),
+            ),
+        }),
+        triggerFields: ['rate'],
+      },
       fieldName: 'datePicker',
       label: '日期选择框',
     },
@@ -271,81 +388,117 @@ const [BaseForm, baseFormApi] = useVbenForm({
       fieldName: 'treeSelect',
       label: '树选择',
     },
+    {
+      component: 'Upload',
+      componentProps: {
+        // 更多属性见：https://ant.design/components/upload-cn
+        accept: '.png,.jpg,.jpeg',
+        // 自动携带认证信息
+        customRequest: upload_file,
+        disabled: false,
+        maxCount: 3,
+        // 单位：MB
+        maxSize: 2,
+        multiple: false,
+        showUploadList: true,
+        // 上传列表的内建样式，支持四种基本样式 text, picture, picture-card 和 picture-circle
+        listType: 'picture-card',
+        draggable: true, // 启用拖拽排序
+        // onChange事件已被重写，如需自定义请在此基础上扩展
+        handleChange: ({ file }: { file: UploadFile }) => {
+          const { name, status } = file;
+          if (status === 'done') {
+            message.success(`${name} ${$t('examples.form.upload-success')}`);
+          } else if (status === 'error') {
+            message.error(`${name} ${$t('examples.form.upload-fail')}`);
+          }
+        },
+        onDragSort: (oldIndex: number, newIndex: number) => {
+          console.warn(`图片从 ${oldIndex} 移动到 ${newIndex}`);
+        },
+      },
+      fieldName: 'files',
+      label: $t('examples.form.file'),
+      renderComponentContent: () => {
+        return {
+          default: () => $t('examples.form.upload-image'),
+        };
+      },
+      rules: 'selectRequired',
+    },
+    {
+      component: 'Upload',
+      componentProps: {
+        accept: '.png,.jpg,.jpeg',
+        customRequest: upload_file,
+        maxCount: 1,
+        maxSize: 2,
+        listType: 'picture-card',
+        // 是否启用图片裁剪(多选或者非图片不唤起裁剪框)
+        crop: true,
+        // 裁剪比例
+        aspectRatio: '1:1',
+      },
+      fieldName: 'cropImage',
+      label: $t('examples.form.crop-image'),
+      renderComponentContent: () => {
+        return {
+          default: () => $t('examples.form.upload-image'),
+        };
+      },
+      rules: 'selectRequired',
+    },
+    {
+      component: 'RichEditor',
+      fieldName: 'richEditor',
+      label: '富文本',
+      formItemClass: 'col-span-3 items-baseline',
+    },
   ],
   // 大屏一行显示3个，中屏一行显示2个，小屏一行显示1个
   wrapperClass: 'grid-cols-1 md:grid-cols-2 lg:grid-cols-3',
 });
 
-const [CustomLayoutForm] = useVbenForm({
-  // 所有表单项共用，可单独在表单内覆盖
-  commonConfig: {
-    // 所有表单项
-    componentProps: {
-      class: 'w-full',
-    },
-  },
-  layout: 'horizontal',
-  schema: [
-    {
-      component: 'Select',
-      fieldName: 'field1',
-      label: '字符串',
-    },
-    {
-      component: 'TreeSelect',
-      fieldName: 'field2',
-      label: '字符串',
-    },
-    {
-      component: 'Mentions',
-      fieldName: 'field3',
-      label: '字符串',
-    },
-    {
-      component: 'Input',
-      fieldName: 'field4',
-      label: '字符串',
-    },
-    {
-      component: 'InputNumber',
-      fieldName: 'field5',
-      // 从第三列开始 相当于中间空了一列
-      formItemClass: 'col-start-3',
-      label: '前面空了一列',
-    },
-    {
-      component: 'Textarea',
-      fieldName: 'field6',
-      // 占满三列空间 基线对齐
-      formItemClass: 'col-span-3 items-baseline',
-      label: '占满三列',
-    },
-    {
-      component: 'Input',
-      fieldName: 'field7',
-      // 占满2列空间 从第二列开始 相当于前面空了一列
-      formItemClass: 'col-span-2 col-start-2',
-      label: '占满2列',
-    },
-    {
-      component: 'Input',
-      fieldName: 'field8',
-      // 左右留空
-      formItemClass: 'col-start-2',
-      label: '左右留空',
-    },
-    {
-      component: 'InputPassword',
-      fieldName: 'field9',
-      formItemClass: 'col-start-1',
-      label: '字符串',
-    },
-  ],
-  // 一共三列
-  wrapperClass: 'grid-cols-3',
-});
+function onSubmit(values: BasicSubmitValues) {
+  const files = (toRaw(values.files) ?? []) as UploadFile[];
+  const cropImage = (toRaw(values.cropImage) ?? []) as UploadFile[];
+  const doneFiles = files.filter((file) => file.status === 'done');
+  const failedFiles = files.filter((file) => file.status !== 'done');
+  const doneCrop = cropImage.filter((file) => file.status === 'done');
+  const failedCrop = cropImage.filter((file) => file.status !== 'done');
 
-function onSubmit(values: Record<string, any>) {
+  const msg = [
+    ...doneFiles.map((file) => file.response?.url || file.url),
+    ...failedFiles.map((file) => file.name),
+  ].join(', ');
+  const msgCrop = [
+    ...doneCrop.map((file) => file.response?.url || file.url),
+    ...failedCrop.map((file) => file.name),
+  ].join(', ');
+
+  if (failedFiles.length === 0) {
+    message.success({
+      content: `${$t('examples.form.upload-urls')}: ${msg}`,
+    });
+  } else {
+    message.error({
+      content: `${$t('examples.form.upload-error')}: ${msg}`,
+    });
+    return;
+  }
+  if (doneCrop.length > 0 && failedCrop.length === 0) {
+    message.success({
+      content: `${$t('examples.form.upload-urls')}: ${msgCrop}`,
+    });
+  } else if (failedCrop.length > 0) {
+    message.error({
+      content: `${$t('examples.form.upload-error')}: ${msgCrop}`,
+    });
+    return;
+  }
+  // 如果需要可提交前替换为需要的urls
+  values.files = doneFiles.map((file) => file.response?.url || file.url);
+  values.cropImage = doneCrop.map((file) => file.response?.url || file.url);
   message.success({
     content: `form values: ${JSON.stringify(values)}`,
   });
@@ -358,6 +511,14 @@ function handleSetFormValue() {
   baseFormApi.setValues({
     checkboxGroup: ['1'],
     datePicker: dayjs('2022-01-01'),
+    files: [
+      {
+        name: 'example.png',
+        status: 'done',
+        uid: '-1',
+        url: 'https://unpkg.com/@vbenjs/static-source@0.1.7/source/logo-v1.webp',
+      },
+    ],
     mentions: '@afc163',
     number: 3,
     options: '1',
@@ -369,6 +530,12 @@ function handleSetFormValue() {
     timePicker: dayjs('2022-01-01 12:00:00'),
     treeSelect: 'leaf1',
     username: '1',
+    richEditor: `
+      <h1>Vben Tiptap</h1>
+      <p>这个编辑器已经被封装在 <code>packages/effects/plugins/src/tiptap</code> 中。</p>
+      <p>你可以直接在各个 app 里通过 <code>@vben/plugins/tiptap</code> 引入。</p>
+      <blockquote>默认内置 StarterKit、Underline、TextAlign、Placeholder。</blockquote>
+    `,
   });
 
   // 设置单个表单值
@@ -380,7 +547,6 @@ function handleSetFormValue() {
   <Page
     content-class="flex flex-col gap-4"
     description="表单组件基础示例，请注意，该页面用到的参数代码会添加一些简单注释，方便理解，请仔细查看。"
-    header-class="pb-0"
     title="表单组件"
   >
     <template #description>
@@ -389,22 +555,15 @@ function handleSetFormValue() {
           表单组件基础示例，请注意，该页面用到的参数代码会添加一些简单注释，方便理解，请仔细查看。
         </p>
       </div>
-      <Tabs v-model:active-key="activeTab" :tab-bar-style="{ marginBottom: 0 }">
-        <TabPane key="basic" tab="基础示例" />
-        <TabPane key="layout" tab="自定义布局" />
-      </Tabs>
     </template>
     <template #extra>
       <DocButton class="mb-2" path="/components/common-ui/vben-form" />
     </template>
-    <Card v-show="activeTab === 'basic'" title="基础示例">
+    <Card title="基础示例">
       <template #extra>
         <Button type="primary" @click="handleSetFormValue">设置表单值</Button>
       </template>
       <BaseForm />
     </Card>
-    <Card v-show="activeTab === 'layout'" title="使用tailwind自定义布局">
-      <CustomLayoutForm />
-    </Card>
   </Page>
 </template>
diff --git a/playground/src/views/examples/form/collapsible.vue b/playground/src/views/examples/form/collapsible.vue
new file mode 100644
index 00000000..338c70bd
--- /dev/null
+++ b/playground/src/views/examples/form/collapsible.vue
@@ -0,0 +1,311 @@
+<script lang="ts" setup>
+import type { RadioGroupProps } from 'antdv-next';
+
+import type { CollapsibleParamSchema, FormLayout } from '@vben/common-ui';
+
+import { h, ref } from 'vue';
+
+import { Page, VbenCollapsibleParams } from '@vben/common-ui';
+
+import { Button, Card, message, RadioGroup } from 'antdv-next';
+
+import { useVbenForm, z } from '#/adapter/form';
+
+import DocButton from '../doc-button.vue';
+
+const layouts: RadioGroupProps['options'] = [
+  { label: 'Vertical', value: 'vertical' },
+  { label: 'Horizontal', value: 'horizontal' },
+];
+
+const layout = ref<FormLayout>('vertical');
+
+function getNumberValidator(key: string, limit?: [number?, number?]) {
+  let validator = z.number({
+    error: (issue) =>
+      issue.input === undefined ? `${key} 值不能为空` : `${key} 值只能为数字`,
+  });
+
+  if (limit) {
+    if (limit[0] !== undefined) {
+      validator = validator.min(limit[0], {
+        message: `${key} 值不能小于${limit[0]}`,
+      });
+    }
+    if (limit[1] !== undefined) {
+      validator = validator.max(limit[1], {
+        message: `${key} 值不能大于${limit[1]}`,
+      });
+    }
+  }
+
+  return validator.optional();
+}
+
+const paramsSchema: CollapsibleParamSchema[] = [
+  {
+    key: 'micro_batch_size',
+    description: `批次大小，代表模型训练过程中，模型更新模型参数的数据步长，可理解为模型每看多少数据即更新一次模型参数，
+    一般建议的批次大小为16/32，表示模型每看16或32条数据即更新一次参数`,
+    option: {
+      min: 8,
+      max: 1024,
+      step: 8,
+    },
+  },
+  {
+    key: 'learning_rate',
+    description:
+      '学习率，代表每次更新数据的增量参数权重，学习率数值越大参数变化越大，对模型影响越大',
+    option: {
+      step: 1e-4,
+      type: 'exponential',
+      min: 0,
+      max: 1,
+    },
+  },
+  {
+    key: 'eval_steps',
+    description:
+      '验证步数，训练阶段针模型的验证间隔步长，用于阶段性评估模型训练准确率、训练损失',
+    option: {
+      min: 1,
+      max: 2_147_483_647,
+    },
+  },
+  {
+    key: 'num_train_epochs',
+    description:
+      '循环次数，代表模型训练过程中模型学习数据集的次数，可理解为看几遍数据，一般建议的范围是1-3遍即可，可依据需求进行调整',
+    option: {
+      min: 1,
+      max: 200,
+    },
+  },
+  {
+    key: 'max_length',
+    description: `序列长度，单个训练数据样本的最大长度，超出配置长度将丢弃`,
+    option: {
+      min: 500,
+      max: 131_072,
+    },
+  },
+  {
+    key: 'warmup_ratio',
+    description: '学习率预热比例，学习率预热阶段占总训练步数的比例',
+    option: {
+      min: 0,
+      max: 1,
+      precision: 2,
+      step: 0.01,
+    },
+  },
+  {
+    key: 'save_steps',
+    description: 'Checkpoint保存间隔',
+    option: {
+      min: 1,
+      max: 2_147_483_647,
+    },
+  },
+];
+
+const paramsValidator = z
+  .object({
+    micro_batch_size: getNumberValidator('micro_batch_size', [8, 1024]),
+    learning_rate: getNumberValidator('learning_rate'),
+    eval_steps: getNumberValidator('eval_steps', [1, 2_147_483_647]),
+    num_train_epochs: getNumberValidator('num_train_epochs', [1, 200]),
+    max_length: getNumberValidator('max_length', [500, 131_072]),
+    warmup_ratio: getNumberValidator('warmup_ratio', [0, 1]),
+    save_steps: getNumberValidator('save_steps', [1, 2_147_483_647]),
+  })
+  .required();
+
+const [BaseForm, baseFormApi] = useVbenForm({
+  showDefaultActions: false,
+  // 所有表单项共用，可单独在表单内覆盖
+  commonConfig: {
+    colon: true,
+    componentProps: {
+      class: 'w-full',
+    },
+  },
+  handleSubmit: onSubmit,
+  layout: 'vertical',
+  schema: [
+    {
+      component: 'Switch',
+      fieldName: 'qat',
+      componentProps: {
+        checkedChildren: '开',
+        unCheckedChildren: '关',
+        class: 'w-auto',
+      },
+      label: 'QAT',
+      formItemClass: 'col-span-2',
+      defaultValue: false,
+    },
+    {
+      // component:'CollapsibleParams',
+      component: h(VbenCollapsibleParams),
+      componentProps: {
+        params: paramsSchema,
+        // maxHeight: 200, //限制最大高度，展开后可滚动
+        // defaultOpen: true, // 默认false折叠
+        // visibleCount: 0 // 默认3，最小可见为1，小于1取1
+      },
+      modelPropName: 'value',
+      fieldName: 'params',
+      label: '参数配置',
+      formItemClass: 'col-span-8 items-baseline col-start-1',
+      dependencies: {
+        triggerFields: ['qat'],
+        componentProps(values) {
+          return {
+            params: values.qat
+              ? [
+                  {
+                    key: 'calib_steps',
+                    description: `校准步数；校准的数据集大小 = 校准步数 * 训练的batch_size`,
+                    option: {
+                      min: 1,
+                    },
+                  },
+                  ...paramsSchema,
+                ]
+              : paramsSchema,
+          };
+        },
+        trigger(values, __, controller) {
+          // 访问 form 内 VbenCollapsibleParams 的实例
+          const paramsRef =
+            controller.getFieldComponentRef<typeof VbenCollapsibleParams>(
+              'params',
+            );
+          if (values.qat) {
+            paramsRef?.updateValues?.({
+              calib_steps: 10,
+              micro_batch_size: 32,
+              learning_rate: 4e-5,
+              eval_steps: 80,
+              num_train_epochs: 3,
+              max_length: 32_768,
+              warmup_ratio: 0.1,
+              save_steps: 80,
+            });
+          } else {
+            paramsRef?.updateValues?.({
+              calib_steps: null,
+            });
+          }
+        },
+        rules(values) {
+          if (values.qat) {
+            return paramsValidator.extend({
+              calib_steps: getNumberValidator('calib_steps', [1]),
+            });
+          }
+          return paramsValidator;
+        },
+      },
+      rules: paramsValidator,
+      defaultValue: {
+        micro_batch_size: 8,
+        learning_rate: 1e-5,
+        eval_steps: 50,
+        num_train_epochs: 3,
+        max_length: 32_768,
+        warmup_ratio: 0.05,
+        save_steps: 50,
+      },
+    },
+    {
+      component: 'RichEditor',
+      fieldName: 'richEditor',
+      label: '富文本',
+      formItemClass: 'col-span-12 items-baseline',
+      collapsible: true,
+      defaultCollapsed: false, // 默认false
+    },
+  ],
+  wrapperClass: 'grid-cols-12',
+});
+
+function onSubmit(values: Record<string, any>) {
+  message.info({
+    content: `form values: ${JSON.stringify(values)}`,
+  });
+}
+
+function onLayoutChange() {
+  baseFormApi.setState({
+    layout: layout.value,
+  });
+}
+
+function handleSetFormValue() {
+  baseFormApi.setFieldValue('params', {
+    micro_batch_size: 1024,
+    learning_rate: 1e-5,
+    eval_steps: 150,
+    num_train_epochs: 13,
+    max_length: 131_072,
+    warmup_ratio: 0.05,
+    save_steps: 150,
+  });
+}
+
+function handleResetFormValue() {
+  baseFormApi.reset(undefined, { force: true });
+}
+
+async function handleSubmitFormValue() {
+  const { valid } = await baseFormApi.validate();
+
+  if (valid) {
+    baseFormApi.submit();
+  }
+}
+</script>
+
+<template>
+  <Page
+    auto-content-height
+    content-class="flex flex-col gap-4"
+    title="可折叠表单项"
+  >
+    <template #description>
+      <div class="text-muted-foreground">
+        <p>可折叠表单项、以及可折叠参数配置组件示例</p>
+      </div>
+    </template>
+    <template #extra>
+      <DocButton class="mb-2" path="/components/common-ui/vben-form" />
+    </template>
+    <Card title="基础示例">
+      <template #extra>
+        <div class="inline-flex items-center gap-4!">
+          <RadioGroup
+            :options="layouts"
+            option-type="button"
+            v-model:value="layout"
+            @change="onLayoutChange"
+          />
+          <Button type="primary" @click="handleSetFormValue">
+            设置表单值
+          </Button>
+          <Button type="primary" @click="handleSubmitFormValue">
+            提交表单
+          </Button>
+          <Button type="primary" @click="handleResetFormValue">
+            重置表单
+          </Button>
+        </div>
+      </template>
+      <div class="w-full overflow-hidden">
+        <BaseForm />
+      </div>
+    </Card>
+  </Page>
+</template>
diff --git a/playground/src/views/examples/form/custom-layout.vue b/playground/src/views/examples/form/custom-layout.vue
new file mode 100644
index 00000000..ac106e75
--- /dev/null
+++ b/playground/src/views/examples/form/custom-layout.vue
@@ -0,0 +1,111 @@
+<script lang="ts" setup>
+import { h } from 'vue';
+
+import { Page } from '@vben/common-ui';
+
+import { Card } from 'antdv-next';
+
+import { useVbenForm } from '#/adapter/form';
+
+import DocButton from '../doc-button.vue';
+
+const [CustomLayoutForm] = useVbenForm({
+  // 所有表单项共用，可单独在表单内覆盖
+  commonConfig: {
+    // 所有表单项
+    componentProps: {
+      class: 'w-full',
+    },
+  },
+  layout: 'horizontal',
+  schema: [
+    {
+      component: 'Select',
+      fieldName: 'field1',
+      label: '字符串',
+    },
+    {
+      component: 'TreeSelect',
+      fieldName: 'field2',
+      label: '字符串',
+    },
+    {
+      component: 'Mentions',
+      fieldName: 'field3',
+      label: '字符串',
+    },
+    {
+      component: 'Input',
+      fieldName: 'field4',
+      label: '字符串',
+    },
+    {
+      component: 'InputNumber',
+      fieldName: 'field5',
+      // 从第三列开始 相当于中间空了一列
+      formItemClass: 'col-start-3',
+      label: '前面空了一列',
+    },
+    {
+      component: 'Divider',
+      fieldName: '_divider',
+      formItemClass: 'col-span-3',
+      hideLabel: true,
+      renderComponentContent: () => {
+        return {
+          default: () => h('div', '分割线'),
+        };
+      },
+    },
+    {
+      component: 'Textarea',
+      fieldName: 'field6',
+      // 占满三列空间 基线对齐
+      formItemClass: 'col-span-3 items-baseline',
+      label: '占满三列',
+    },
+    {
+      component: 'Input',
+      fieldName: 'field7',
+      // 占满2列空间 从第二列开始 相当于前面空了一列
+      formItemClass: 'col-span-2 col-start-2',
+      label: '占满2列',
+    },
+    {
+      component: 'Input',
+      fieldName: 'field8',
+      // 左右留空
+      formItemClass: 'col-start-2',
+      label: '左右留空',
+    },
+    {
+      component: 'InputPassword',
+      fieldName: 'field9',
+      formItemClass: 'col-start-1',
+      label: '字符串',
+    },
+  ],
+  // 一共三列
+  wrapperClass: 'grid-cols-3',
+});
+</script>
+
+<template>
+  <Page
+    content-class="flex flex-col gap-4"
+    description="使用tailwind自定义表单项的布局"
+    title="表单自定义布局"
+  >
+    <template #description>
+      <div class="text-muted-foreground">
+        <p>使用tailwind自定义表单项的布局，使用Divider分割表单。</p>
+      </div>
+    </template>
+    <template #extra>
+      <DocButton class="mb-2" path="/components/common-ui/vben-form" />
+    </template>
+    <Card title="使用tailwind自定义布局">
+      <CustomLayoutForm />
+    </Card>
+  </Page>
+</template>
diff --git a/playground/src/views/examples/form/custom.vue b/playground/src/views/examples/form/custom.vue
index a035e597..13453f34 100644
--- a/playground/src/views/examples/form/custom.vue
+++ b/playground/src/views/examples/form/custom.vue
@@ -1,13 +1,51 @@
 <script lang="ts" setup>
-import { h } from 'vue';
+import { h, markRaw, ref } from 'vue';
 
 import { Page } from '@vben/common-ui';
 
-import { Card, Input, message } from 'ant-design-vue';
+import { Button, Card, Input, message, Select } from 'antdv-next';
 
-import { useVbenForm } from '#/adapter/form';
+import { useVbenForm, z } from '#/adapter/form';
 
-const [Form] = useVbenForm({
+import TwoFields from './modules/two-fields.vue';
+
+interface CustomFormValues extends Record<string, unknown> {
+  field?: string;
+  field1?: string;
+  field2?: string;
+  field3?: string;
+  field4?: [string | undefined, string | undefined];
+  field5?: string;
+}
+
+function encodeCustomFormValues(values: Readonly<CustomFormValues>) {
+  const { field4, ...formValues } = values;
+  return {
+    ...formValues,
+    phoneNumber: field4?.[1],
+    phoneType: field4?.[0],
+  };
+}
+
+type CustomSubmitValues = ReturnType<typeof encodeCustomFormValues>;
+
+const dynamicComponentType = ref<'input' | 'select'>('input');
+
+function decodeCustomFormValues(
+  values: Readonly<CustomSubmitValues>,
+): CustomFormValues {
+  const { phoneNumber, phoneType, ...formValues } = values;
+  return {
+    ...formValues,
+    field4: [phoneType, phoneNumber ?? ''],
+  };
+}
+
+const [Form, formApi] = useVbenForm({
+  codec: {
+    decode: decodeCustomFormValues,
+    encode: encodeCustomFormValues,
+  },
   // 所有表单项共用，可单独在表单内覆盖
   commonConfig: {
     // 所有表单项
@@ -39,9 +77,10 @@ const [Form] = useVbenForm({
       }),
     },
     {
-      component: h(Input, { placeholder: '请输入' }),
+      component: h(Input, { placeholder: '请输入Field2' }),
       fieldName: 'field2',
       label: '自定义组件',
+      modelPropName: 'value',
       rules: 'required',
     },
     {
@@ -50,12 +89,76 @@ const [Form] = useVbenForm({
       label: '自定义组件(slot)',
       rules: 'required',
     },
+    {
+      component: markRaw(TwoFields),
+      defaultValue: [undefined, ''],
+      fieldName: 'field4',
+      formItemClass: 'col-span-1',
+      label: '组合字段',
+      rules: z
+        .array(z.string().optional())
+        .length(2, '请选择类型并输入手机号码')
+        .refine((v) => !!v[0], {
+          message: '请选择类型',
+        })
+        .refine((v) => !!v[1] && v[1] !== '', {
+          message: '　　　　　　　输入手机号码',
+        })
+        .refine((v) => v[1]?.match(/^1[3-9]\d{9}$/), {
+          // 使用全角空格占位，将错误提示文字挤到手机号码输入框的下面
+          message: '　　　　　　　号码格式不正确',
+        }),
+    },
+    {
+      component: markRaw(Input),
+      componentProps: {
+        placeholder: '请输入动态组件值',
+      },
+      fieldName: 'field5',
+      label: '动态组件',
+      modelPropName: 'value',
+    },
   ],
   // 中屏一行显示2个，小屏一行显示1个
   wrapperClass: 'grid-cols-1 md:grid-cols-2',
 });
 
-function onSubmit(values: Record<string, any>) {
+function handleToggleDynamicComponent() {
+  const nextType = dynamicComponentType.value === 'input' ? 'select' : 'input';
+  dynamicComponentType.value = nextType;
+
+  if (nextType === 'select') {
+    formApi.updateSchema([
+      {
+        component: markRaw(Select),
+        componentProps: {
+          allowClear: true,
+          options: [
+            { label: '选项一', value: 'option-1' },
+            { label: '选项二', value: 'option-2' },
+          ],
+          placeholder: '请选择动态组件值',
+        },
+        fieldName: 'field5',
+        modelPropName: 'value',
+      },
+    ]);
+    return;
+  }
+
+  formApi.updateSchema([
+    {
+      component: markRaw(Input),
+      componentProps: {
+        placeholder: '请输入动态组件值',
+      },
+      fieldName: 'field5',
+      modelPropName: 'value',
+    },
+  ]);
+}
+
+function onSubmit(values: CustomSubmitValues) {
   message.success({
     content: `form values: ${JSON.stringify(values)}`,
   });
@@ -65,9 +168,16 @@ function onSubmit(values: Record<string, any>) {
 <template>
   <Page description="表单组件自定义示例" title="表单组件">
     <Card title="基础示例">
+      <template #extra>
+        <Button @click="handleToggleDynamicComponent">
+          {{
+            dynamicComponentType === 'input' ? '切换为下拉框' : '切换为输入框'
+          }}
+        </Button>
+      </template>
       <Form>
         <template #field3="slotProps">
-          <Input placeholder="请输入" v-bind="slotProps" />
+          <Input placeholder="请输入" v-bind="slotProps.componentProps" />
         </template>
       </Form>
     </Card>
diff --git a/playground/src/views/examples/form/dynamic.vue b/playground/src/views/examples/form/dynamic.vue
index c11a3c1a..b7bd770d 100644
--- a/playground/src/views/examples/form/dynamic.vue
+++ b/playground/src/views/examples/form/dynamic.vue
@@ -1,7 +1,7 @@
 <script lang="ts" setup>
 import { Page } from '@vben/common-ui';
 
-import { Button, Card, message } from 'ant-design-vue';
+import { Button, Card, message } from 'antdv-next';
 
 import { useVbenForm } from '#/adapter/form';
 
diff --git a/playground/src/views/examples/form/merge.vue b/playground/src/views/examples/form/merge.vue
index 22f20fa1..c0d8f4a3 100644
--- a/playground/src/views/examples/form/merge.vue
+++ b/playground/src/views/examples/form/merge.vue
@@ -1,9 +1,11 @@
 <script lang="ts" setup>
+import type { StepItem } from 'antdv-next';
+
 import { ref } from 'vue';
 
 import { Page } from '@vben/common-ui';
 
-import { Button, Card, message, Step, Steps, Switch } from 'ant-design-vue';
+import { Button, Card, message, Steps, Switch } from 'antdv-next';
 
 import { useVbenForm } from '#/adapter/form';
 
@@ -75,6 +77,7 @@ const [SecondForm, secondFormApi] = useVbenForm({
   ],
   wrapperClass: 'grid-cols-1 md:grid-cols-1 lg:grid-cols-1',
 });
+const stepsItems: StepItem[] = [{ title: '表单1' }, { title: '表单2' }];
 const needMerge = ref(true);
 async function handleMergeSubmit() {
   const values = await firstFormApi
@@ -102,10 +105,7 @@ async function handleMergeSubmit() {
         <Button type="primary" @click="handleMergeSubmit">合并提交</Button>
       </template>
       <div class="mx-auto max-w-lg">
-        <Steps :current="currentTab" class="steps">
-          <Step title="表单1" />
-          <Step title="表单2" />
-        </Steps>
+        <Steps :current="currentTab" :items="stepsItems" class="steps" />
         <div class="p-20">
           <FirstForm v-show="currentTab === 0" />
           <SecondForm v-show="currentTab === 1" />
diff --git a/playground/src/views/examples/form/modules/two-fields.vue b/playground/src/views/examples/form/modules/two-fields.vue
new file mode 100644
index 00000000..66a46cc6
--- /dev/null
+++ b/playground/src/views/examples/form/modules/two-fields.vue
@@ -0,0 +1,51 @@
+<script lang="ts" setup>
+import type { SelectValue } from 'antdv-next';
+
+import { Input, Select } from 'antdv-next';
+
+const emit = defineEmits(['blur']);
+
+const modelValue = defineModel<[string | undefined, string | undefined]>({
+  default: () => [undefined, undefined],
+});
+
+function handlePhoneChange(value: string | undefined) {
+  modelValue.value = [modelValue.value[0], value];
+}
+
+function handleTypeChange(value: SelectValue) {
+  modelValue.value = [
+    typeof value === 'string' ? value : undefined,
+    modelValue.value[1],
+  ];
+}
+</script>
+<template>
+  <div class="flex w-full gap-1">
+    <Select
+      :value="modelValue[0]"
+      class="w-20"
+      placeholder="类型"
+      allow-clear
+      :class="{ 'valid-success': !!modelValue[0] }"
+      :options="[
+        { label: '个人', value: 'personal' },
+        { label: '工作', value: 'work' },
+        { label: '私密', value: 'private' },
+      ]"
+      @blur="emit('blur')"
+      @update:value="handleTypeChange"
+    />
+    <Input
+      placeholder="请输入11位手机号码"
+      class="flex-1"
+      allow-clear
+      :class="{ 'valid-success': modelValue[1]?.match(/^1[3-9]\d{9}$/) }"
+      :value="modelValue[1]"
+      :maxlength="11"
+      type="tel"
+      @blur="emit('blur')"
+      @update:value="handlePhoneChange"
+    />
+  </div>
+</template>
diff --git a/playground/src/views/examples/form/query.vue b/playground/src/views/examples/form/query.vue
index 23292362..d3401d0b 100644
--- a/playground/src/views/examples/form/query.vue
+++ b/playground/src/views/examples/form/query.vue
@@ -1,7 +1,7 @@
 <script lang="ts" setup>
 import { Page } from '@vben/common-ui';
 
-import { Card, message } from 'ant-design-vue';
+import { Card, message } from 'antdv-next';
 
 import { useVbenForm } from '#/adapter/form';
 
@@ -86,6 +86,62 @@ const [QueryForm] = useVbenForm({
   wrapperClass: 'grid-cols-1 md:grid-cols-2 lg:grid-cols-3',
 });
 
+const [InlineForm] = useVbenForm({
+  layout: 'inline',
+  schema: [
+    {
+      // 组件需要在 #/adapter.ts内注册，并加上类型
+      component: 'Input',
+      // 对应组件的参数
+      componentProps: {
+        placeholder: '请输入用户名',
+      },
+      // 字段名
+      fieldName: 'username',
+      // 界面显示的label
+      label: '字符串',
+    },
+    {
+      component: 'InputPassword',
+      componentProps: {
+        placeholder: '请输入密码',
+      },
+      fieldName: 'password',
+      label: '密码',
+    },
+    {
+      component: 'InputNumber',
+      componentProps: {
+        placeholder: '请输入',
+      },
+      fieldName: 'number',
+      label: '数字(带后缀)',
+      suffix: () => '¥',
+    },
+    {
+      component: 'Select',
+      componentProps: {
+        allowClear: true,
+        filterOption: true,
+        options: [
+          {
+            label: '选项1',
+            value: '1',
+          },
+          {
+            label: '选项2',
+            value: '2',
+          },
+        ],
+        placeholder: '请选择',
+        showSearch: true,
+      },
+      fieldName: 'options',
+      label: '下拉选',
+    },
+  ],
+});
+
 const [QueryForm1] = useVbenForm({
   // 默认展开
   collapsed: true,
@@ -125,6 +181,70 @@ const [QueryForm1] = useVbenForm({
   wrapperClass: 'grid-cols-1 md:grid-cols-2 lg:grid-cols-3',
 });
 
+const [QueryForm2] = useVbenForm({
+  // 操作按钮组 newLine: 在新行显示。rowEnd: 在行内显示，靠右对齐（默认）。inline: 使用grid默认样式
+  actionLayout: 'newLine',
+  actionPosition: 'left', // 操作按钮组在左侧显示
+  // 默认折叠
+  collapsed: true,
+  collapsedRows: 3,
+  // 所有表单项共用，可单独在表单内覆盖
+  commonConfig: {
+    // 所有表单项
+    componentProps: {
+      class: 'w-full',
+    },
+  },
+  // 提交函数
+  handleSubmit: onSubmit,
+  // 垂直布局，label和input在不同行，值为vertical
+  // 水平布局，label和input在同一行
+  layout: 'vertical',
+  schema: [
+    {
+      // 组件需要在 #/adapter.ts内注册，并加上类型
+      component: 'Input',
+      // 对应组件的参数
+      componentProps: {
+        placeholder: '请输入用户名',
+      },
+      // 字段名
+      fieldName: 'username',
+      // 界面显示的label
+      label: '字符串',
+    },
+    {
+      component: 'InputPassword',
+      componentProps: {
+        placeholder: '请输入密码',
+      },
+      fieldName: 'password',
+      label: '密码',
+    },
+    {
+      component: 'InputNumber',
+      componentProps: {
+        placeholder: '请输入',
+      },
+      fieldName: 'number',
+      label: '数字(带后缀)',
+      suffix: () => '¥',
+    },
+    {
+      component: 'DatePicker',
+      fieldName: 'datePicker',
+      label: '日期选择框',
+    },
+  ],
+  // 是否可展开
+  showCollapseButton: true,
+  submitButtonOptions: {
+    content: '查询',
+  },
+  // 大屏一行显示3个，中屏一行显示2个，小屏一行显示1个
+  wrapperClass: 'grid-cols-1 md:grid-cols-2 lg:grid-cols-3',
+});
+
 function onSubmit(values: Record<string, any>) {
   message.success({
     content: `form values: ${JSON.stringify(values)}`,
@@ -140,6 +260,15 @@ function onSubmit(values: Record<string, any>) {
     <Card class="mb-5" title="查询表单，默认展开">
       <QueryForm />
     </Card>
+
+    <Card class="mb-5" title="查询表单，单行表单">
+      <InlineForm />
+    </Card>
+
+    <Card class="mb-5" title="查询表单，默认展开，垂直布局">
+      <QueryForm2 />
+    </Card>
+
     <Card title="查询表单，默认折叠，折叠时保留2行">
       <QueryForm1 />
     </Card>
diff --git a/playground/src/views/examples/form/rules.vue b/playground/src/views/examples/form/rules.vue
index dd95894c..7c627d90 100644
--- a/playground/src/views/examples/form/rules.vue
+++ b/playground/src/views/examples/form/rules.vue
@@ -1,7 +1,7 @@
 <script lang="ts" setup>
 import { Page } from '@vben/common-ui';
 
-import { Button, Card, message } from 'ant-design-vue';
+import { Button, Card, message } from 'antdv-next';
 
 import { useVbenForm, z } from '#/adapter/form';
 
@@ -70,7 +70,7 @@ const [Form, formApi] = useVbenForm({
       fieldName: 'field4',
       // 界面显示的label
       label: '邮箱',
-      rules: z.string().email('请输入正确的邮箱'),
+      rules: z.email('请输入正确的邮箱'),
     },
     {
       component: 'InputNumber',
@@ -150,7 +150,9 @@ const [Form, formApi] = useVbenForm({
           default: () => ['我已阅读并同意'],
         };
       },
-      rules: 'selectRequired',
+      rules: z.boolean().refine((value) => value, {
+        message: '请勾选',
+      }),
     },
     {
       component: 'DatePicker',
@@ -182,8 +184,7 @@ const [Form, formApi] = useVbenForm({
       },
       fieldName: 'input-blur',
       formFieldProps: {
-        validateOnChange: false,
-        validateOnModelUpdate: false,
+        validateOn: ['blur'],
       },
       help: 'blur时才会触发校验',
       label: 'blur触发',
@@ -233,7 +234,7 @@ function onSubmit(values: Record<string, any>) {
     <Card title="基础组件校验示例">
       <template #extra>
         <Button @click="() => formApi.validate()">校验表单</Button>
-        <Button class="mx-2" @click="() => formApi.resetValidate()">
+        <Button class="mx-2" @click="() => formApi.clearValidation()">
           清空校验信息
         </Button>
       </template>
diff --git a/playground/src/views/examples/form/scroll-to-error-test.vue b/playground/src/views/examples/form/scroll-to-error-test.vue
new file mode 100644
index 00000000..4aa48848
--- /dev/null
+++ b/playground/src/views/examples/form/scroll-to-error-test.vue
@@ -0,0 +1,183 @@
+<script lang="ts" setup>
+import { ref } from 'vue';
+
+import { Page } from '@vben/common-ui';
+
+import { Button, Card, Switch } from 'antdv-next';
+
+import { useVbenForm } from '#/adapter/form';
+
+defineOptions({
+  name: 'ScrollToErrorTest',
+});
+
+const scrollEnabled = ref(true);
+
+const [Form, formApi] = useVbenForm({
+  scrollToFirstError: scrollEnabled.value,
+  schema: [
+    {
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入用户名',
+      },
+      fieldName: 'username',
+      label: '用户名',
+      rules: 'required',
+    },
+    {
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入邮箱',
+      },
+      fieldName: 'email',
+      label: '邮箱',
+      rules: 'required',
+    },
+    {
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入手机号',
+      },
+      fieldName: 'phone',
+      label: '手机号',
+      rules: 'required',
+    },
+    {
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入地址',
+      },
+      fieldName: 'address',
+      label: '地址',
+      rules: 'required',
+    },
+    {
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入备注',
+      },
+      fieldName: 'remark',
+      label: '备注',
+      rules: 'required',
+    },
+    {
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入公司名称',
+      },
+      fieldName: 'company',
+      label: '公司名称',
+      rules: 'required',
+    },
+    {
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入职位',
+      },
+      fieldName: 'position',
+      label: '职位',
+      rules: 'required',
+    },
+    {
+      component: 'Select',
+      componentProps: {
+        options: [
+          { label: '男', value: 'male' },
+          { label: '女', value: 'female' },
+        ],
+        placeholder: '请选择性别',
+      },
+      fieldName: 'gender',
+      label: '性别',
+      rules: 'selectRequired',
+    },
+  ],
+  showDefaultActions: false,
+});
+
+// 测试 validateAndSubmitForm（验证并提交）
+async function testValidateAndSubmit() {
+  await formApi.validateAndSubmit();
+}
+
+// 测试 validate（手动验证整个表单）
+async function testValidate() {
+  await formApi.validate();
+}
+
+// 测试 validateField（验证单个字段）
+async function testValidateField() {
+  await formApi.validateField('username');
+}
+
+// 切换滚动功能
+function toggleScrollToError(checked: boolean) {
+  formApi.setState({ scrollToFirstError: checked });
+}
+
+// 填充部分数据测试
+async function fillPartialData() {
+  await formApi.reset();
+  await formApi.setFieldValue('username', '测试用户');
+  await formApi.setFieldValue('email', 'test@example.com');
+}
+</script>
+
+<template>
+  <Page
+    description="测试表单验证失败时自动滚动到错误字段的功能"
+    title="滚动到错误字段测试"
+  >
+    <Card title="功能测试">
+      <template #extra>
+        <div class="flex items-center gap-2">
+          <Switch
+            v-model:checked="scrollEnabled"
+            @change="toggleScrollToError"
+          />
+          <span>启用滚动到错误字段</span>
+        </div>
+      </template>
+
+      <div class="space-y-4">
+        <div class="rounded-sm bg-blue-50 dark:bg-blue-900 p-4">
+          <h3 class="mb-2 font-medium">测试说明：</h3>
+          <ul class="list-inside list-disc space-y-1 text-sm">
+            <li>所有验证方法在验证失败时都会自动滚动到第一个错误字段</li>
+            <li>可以通过右上角的开关控制是否启用自动滚动功能</li>
+          </ul>
+        </div>
+
+        <div class="rounded-sm border p-4">
+          <h4 class="mb-3 font-medium">验证方法测试：</h4>
+          <div class="flex flex-wrap gap-2">
+            <Button type="primary" @click="testValidateAndSubmit">
+              测试 validateAndSubmit()
+            </Button>
+            <Button @click="testValidate"> 测试 validate() </Button>
+            <Button @click="testValidateField"> 测试 validateField() </Button>
+          </div>
+          <div class="mt-2 text-xs text-gray-500">
+            <p>• validateAndSubmit(): 验证表单并提交</p>
+            <p>• validate(): 手动验证整个表单</p>
+            <p>• validateField(): 验证单个字段（这里测试用户名字段）</p>
+          </div>
+        </div>
+
+        <div class="rounded-sm border p-4">
+          <h4 class="mb-3 font-medium">数据填充测试：</h4>
+          <div class="flex flex-wrap gap-2">
+            <Button @click="fillPartialData"> 填充部分数据 </Button>
+            <Button @click="() => formApi.reset()"> 清空表单 </Button>
+          </div>
+          <div class="mt-2 text-xs text-gray-500">
+            <p>• 填充部分数据后验证，会滚动到第一个错误字段</p>
+          </div>
+        </div>
+
+        <Form />
+      </div>
+    </Card>
+  </Page>
+</template>
diff --git a/playground/src/views/examples/form/value-format.vue b/playground/src/views/examples/form/value-format.vue
new file mode 100644
index 00000000..5a1a2eb9
--- /dev/null
+++ b/playground/src/views/examples/form/value-format.vue
@@ -0,0 +1,195 @@
+<script lang="ts" setup>
+import type { Dayjs } from 'dayjs';
+
+import { computed, nextTick, onMounted, ref } from 'vue';
+
+import { Page } from '@vben/common-ui';
+
+import { Button, Card, message, Space, Tag } from 'antdv-next';
+import dayjs from 'dayjs';
+
+import { useVbenForm } from '#/adapter/form';
+
+import DocButton from '../doc-button.vue';
+
+interface ValueFormatFormValues {
+  deadline?: Dayjs;
+  keyword?: string;
+  reportRange?: [Dayjs, Dayjs];
+}
+
+function encodeValueFormatValues(values: Readonly<ValueFormatFormValues>) {
+  return {
+    deadline: values.deadline?.valueOf(),
+    endTime: values.reportRange?.[1].valueOf(),
+    keyword: values.keyword,
+    startTime: values.reportRange?.[0].valueOf(),
+  };
+}
+
+type ValueFormatSubmitValues = ReturnType<typeof encodeValueFormatValues>;
+
+function decodeValueFormatValues(
+  values: Readonly<ValueFormatSubmitValues>,
+): ValueFormatFormValues {
+  let reportRange: [Dayjs, Dayjs] | undefined;
+  if (values.startTime !== undefined && values.endTime !== undefined) {
+    reportRange = [dayjs(values.startTime), dayjs(values.endTime)];
+  }
+  return {
+    deadline:
+      values.deadline === undefined ? undefined : dayjs(values.deadline),
+    keyword: values.keyword,
+    reportRange,
+  };
+}
+
+const transformedValues = ref<Partial<ValueFormatSubmitValues>>({});
+const liveValues = ref<Partial<ValueFormatFormValues>>({});
+
+const [Form, formApi] = useVbenForm({
+  codec: {
+    decode: decodeValueFormatValues,
+    encode: encodeValueFormatValues,
+  },
+  commonConfig: {
+    componentProps: {
+      class: 'w-full',
+    },
+  },
+  handleSubmit,
+  handleValuesChange,
+  schema: [
+    {
+      component: 'RangePicker',
+      fieldName: 'reportRange',
+      help: '由表单 codec 拆分为 startTime / endTime',
+      label: '统计时间范围',
+    },
+    {
+      component: 'DatePicker',
+      fieldName: 'deadline',
+      help: '由表单 codec 编码为时间戳',
+      label: '截止时间',
+    },
+    {
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入关键字',
+      },
+      fieldName: 'keyword',
+      label: '关键字',
+    },
+  ],
+  wrapperClass: 'grid-cols-1 md:grid-cols-2',
+});
+
+const liveValuesPreview = computed(() => formatJsonPreview(liveValues.value));
+
+const transformedValuesPreview = computed(() => {
+  return formatJsonPreview(transformedValues.value);
+});
+
+function formatJsonPreview(value: unknown) {
+  return JSON.stringify(
+    value,
+    (_key, currentValue) => {
+      return dayjs.isDayjs(currentValue)
+        ? currentValue.format('YYYY-MM-DD HH:mm:ss')
+        : currentValue;
+    },
+    2,
+  );
+}
+
+async function handleInspectValues() {
+  await syncPreviewValues();
+  message.success('已刷新 getValues 输出');
+}
+
+function handleSetExampleValue() {
+  formApi.setValues({
+    deadline: dayjs('2026-04-12 18:30:00'),
+    keyword: 'invoice',
+    reportRange: [dayjs('2026-04-01 00:00:00'), dayjs('2026-04-12 23:59:59')],
+  });
+}
+
+function handleSubmit(values: ValueFormatSubmitValues) {
+  transformedValues.value = values;
+  message.success({
+    content: `getValues output: ${JSON.stringify(values)}`,
+  });
+}
+
+function handleValuesChange(
+  values: Readonly<ValueFormatFormValues>,
+  _fieldsChanged: string[],
+  getFormattedValues: () => ValueFormatSubmitValues,
+) {
+  liveValues.value = { ...values };
+  transformedValues.value = getFormattedValues();
+}
+
+async function syncPreviewValues(values?: Readonly<ValueFormatFormValues>) {
+  const rawValues = values ?? (await formApi.getRawValues());
+  liveValues.value = { ...rawValues };
+  transformedValues.value = await formApi.getValues();
+}
+
+onMounted(async () => {
+  await nextTick();
+  await syncPreviewValues();
+});
+</script>
+
+<template>
+  <Page
+    content-class="flex flex-col gap-4"
+    description="演示表单级 codec 如何双向转换组件值和提交 payload。"
+    title="表单 Codec"
+  >
+    <template #description>
+      <div class="text-muted-foreground space-y-2">
+        <p>
+          <code>getRawValues()</code> 返回组件原始值，<code>getValues()</code> /
+          提交时会按 <code>codec.encode</code> 输出 payload，回填时通过
+          <code>codec.decode</code> 恢复组件值。
+        </p>
+        <div class="flex flex-wrap gap-2">
+          <Tag color="processing">encode：生成完整提交值</Tag>
+          <Tag color="success">decode：恢复完整表单值</Tag>
+          <Tag color="warning">多字段转换原子执行</Tag>
+        </div>
+      </div>
+    </template>
+    <template #extra>
+      <DocButton path="/components/common-ui/vben-form" />
+    </template>
+
+    <Card title="Codec 示例">
+      <template #extra>
+        <Space wrap>
+          <Button @click="handleSetExampleValue">填充示例数据</Button>
+          <Button type="primary" @click="handleInspectValues">
+            查看 getValues 输出
+          </Button>
+        </Space>
+      </template>
+      <Form />
+    </Card>
+
+    <div class="grid gap-4 lg:grid-cols-2">
+      <Card title="getRawValues() 输出（组件值）">
+        <pre class="bg-muted overflow-auto rounded-md p-4 text-sm">{{
+          liveValuesPreview
+        }}</pre>
+      </Card>
+      <Card title="getValues / submit 输出（codec.encode 后）">
+        <pre class="bg-muted overflow-auto rounded-md p-4 text-sm">{{
+          transformedValuesPreview
+        }}</pre>
+      </Card>
+    </div>
+  </Page>
+</template>
diff --git a/playground/src/views/examples/json-viewer/data.ts b/playground/src/views/examples/json-viewer/data.ts
new file mode 100644
index 00000000..b2bb402a
--- /dev/null
+++ b/playground/src/views/examples/json-viewer/data.ts
@@ -0,0 +1,66 @@
+export const json1 = {
+  additionalInfo: {
+    author: 'Your Name',
+    debug: true,
+    version: '1.3.10',
+    versionCode: 132,
+  },
+  additionalNotes: 'This JSON is used for demonstration purposes',
+  tools: [
+    {
+      description: 'Description of Tool 1',
+      name: 'Tool 1',
+    },
+    {
+      description: 'Description of Tool 2',
+      name: 'Tool 2',
+    },
+    {
+      description: 'Description of Tool 3',
+      name: 'Tool 3',
+    },
+    {
+      description: 'Description of Tool 4',
+      name: 'Tool 4',
+    },
+  ],
+};
+
+export const json2 = JSON.parse(`
+  {
+	"id": "chatgpt-123",
+	"object": "chat.completion",
+	"created": 1677652288,
+	"model": "gpt-3.5-turbo-0613",
+	"system_fingerprint": "fp_44709d6fcb",
+	"choices": [{
+		"index": 0,
+		"message": {
+			"role": "assistant",
+			"content": "Hello there, how may I assist you today?"
+		},
+		"finish_reason": "stop"
+	}],
+	"usage": {
+		"prompt_tokens": 9,
+		"completion_tokens": 12,
+		"total_tokens": 21,
+    "debug_mode": true
+	},
+  "debug": {
+    "startAt": "2021-08-01T00:00:00Z",
+    "logs": [
+      {
+        "timestamp": "2021-08-01T00:00:00Z",
+        "message": "This is a debug message",
+        "extra":[ "extra1", "extra2" ]
+      },
+      {
+        "timestamp": "2021-08-01T00:00:01Z",
+        "message": "This is another debug message",
+        "extra":[ "extra3", "extra4" ]
+      }
+    ]
+  }
+}
+  `);
diff --git a/playground/src/views/examples/json-viewer/index.vue b/playground/src/views/examples/json-viewer/index.vue
new file mode 100644
index 00000000..c38712f2
--- /dev/null
+++ b/playground/src/views/examples/json-viewer/index.vue
@@ -0,0 +1,51 @@
+<script lang="ts" setup>
+import type { JsonViewerAction, JsonViewerValue } from '@vben/common-ui';
+
+import { JsonViewer, Page } from '@vben/common-ui';
+
+import { Card, message } from 'antdv-next';
+
+import { json1, json2 } from './data';
+
+function handleKeyClick(key: string) {
+  message.info(`点击了Key ${key}`);
+}
+
+function handleValueClick(value: JsonViewerValue) {
+  message.info(`点击了Value ${JSON.stringify(value)}`);
+}
+
+function handleCopied(_event: JsonViewerAction) {
+  message.success('已复制JSON');
+}
+</script>
+<template>
+  <Page
+    title="Json Viewer"
+    description="一个渲染 JSON 结构数据的组件，支持复制、展开等，简单易用"
+  >
+    <Card title="默认配置">
+      <JsonViewer :value="json1" />
+    </Card>
+    <Card title="可复制、默认展开3层、显示边框、事件处理" class="mt-4">
+      <JsonViewer
+        :value="json2"
+        :expand-depth="3"
+        copyable
+        :sort="false"
+        @key-click="handleKeyClick"
+        @value-click="handleValueClick"
+        @copied="handleCopied"
+        boxed
+      />
+    </Card>
+    <Card title="预览模式" class="mt-4">
+      <JsonViewer
+        :value="json2"
+        copyable
+        preview-mode
+        :show-array-index="false"
+      />
+    </Card>
+  </Page>
+</template>
diff --git a/playground/src/views/examples/layout/col-page.vue b/playground/src/views/examples/layout/col-page.vue
index 5b18330e..b16008bd 100644
--- a/playground/src/views/examples/layout/col-page.vue
+++ b/playground/src/views/examples/layout/col-page.vue
@@ -12,7 +12,7 @@ import {
   Slider,
   Tag,
   Tooltip,
-} from 'ant-design-vue';
+} from 'antdv-next';
 
 const props = reactive({
   leftCollapsedWidth: 5,
@@ -22,8 +22,8 @@ const props = reactive({
   leftWidth: 30,
   resizable: true,
   rightWidth: 70,
-  splitHandle: false,
-  splitLine: false,
+  splitHandle: true,
+  splitLine: true,
 });
 const leftMinWidth = ref(props.leftMinWidth || 1);
 const leftMaxWidth = ref(props.leftMaxWidth || 100);
@@ -42,7 +42,7 @@ const leftMaxWidth = ref(props.leftMaxWidth || 100);
     <template #left="{ isCollapsed, expand }">
       <div v-if="isCollapsed" @click="expand">
         <Tooltip title="点击展开左侧">
-          <Button shape="circle" type="primary">
+          <Button shape="circle" type="primary" class="flex-center">
             <template #icon>
               <IconifyIcon class="text-2xl" icon="bi:arrow-right" />
             </template>
@@ -52,7 +52,7 @@ const leftMaxWidth = ref(props.leftMaxWidth || 100);
       <div
         v-else
         :style="{ minWidth: '200px' }"
-        class="border-border bg-card mr-2 rounded-[var(--radius)] border p-2"
+        class="mr-2 rounded-(--radius) border border-border bg-card p-2"
       >
         <p>这里是左侧内容</p>
         <p>这里是左侧内容</p>
@@ -77,7 +77,7 @@ const leftMaxWidth = ref(props.leftMaxWidth || 100);
             v-model:value="leftMinWidth"
             :max="props.leftMaxWidth - 1"
             :min="1"
-            style="width: 100px"
+            class="w-25"
             @after-change="(value) => (props.leftMinWidth = value as number)"
           />
           <span>左侧最大宽度百分比：</span>
@@ -85,11 +85,11 @@ const leftMaxWidth = ref(props.leftMaxWidth || 100);
             v-model:value="props.leftMaxWidth"
             :max="100"
             :min="leftMaxWidth + 1"
-            style="width: 100px"
+            class="w-25"
             @after-change="(value) => (props.leftMaxWidth = value as number)"
           />
         </div>
-        <Alert message="实验性的组件" show-icon type="warning">
+        <Alert title="实验性的组件" show-icon type="warning">
           <template #description>
             <p>
               双列布局组件是一个在Page组件上扩展的相对基础的布局组件，支持左侧折叠（当拖拽导致左侧宽度比最小宽度还要小时，还可以进入折叠状态）、拖拽调整宽度等功能。
diff --git a/playground/src/views/examples/loading/index.vue b/playground/src/views/examples/loading/index.vue
new file mode 100644
index 00000000..0ff5c260
--- /dev/null
+++ b/playground/src/views/examples/loading/index.vue
@@ -0,0 +1,94 @@
+<script lang="ts" setup>
+import { Loading, Page, Spinner } from '@vben/common-ui';
+import { IconifyIcon } from '@vben/icons';
+
+import { refAutoReset } from '@vueuse/core';
+import { Button, Card, Spin } from 'antdv-next';
+
+const spinning = refAutoReset(false, 3000);
+const loading = refAutoReset(false, 3000);
+
+const spinningV = refAutoReset(false, 3000);
+const loadingV = refAutoReset(false, 3000);
+</script>
+<template>
+  <Page
+    title="Vben Loading"
+    description="加载中状态组件。这个组件可以为其它作为容器的组件添加一个加载中的遮罩层。使用它们时，容器需要relative定位。"
+  >
+    <Card title="Antd Spin">
+      <template #actions>这是Antd 组件库自带的Spin组件演示</template>
+      <Spin :spinning="spinning" description="加载中...">
+        <Button type="primary" @click="spinning = true">显示Spin</Button>
+      </Spin>
+    </Card>
+
+    <Card title="Vben Loading" v-loading="loadingV" class="mt-4">
+      <template #extra>
+        <Button type="primary" @click="loadingV = true">
+          v-loading 指令
+        </Button>
+      </template>
+      <template #actions>
+        Loading组件可以设置文字，并且也提供了icon插槽用于替换加载图标。
+      </template>
+      <div class="flex gap-4">
+        <div class="size-40">
+          <Loading
+            :spinning="loading"
+            text="正在加载..."
+            class="flex-center size-full"
+          >
+            <Button type="primary" @click="loading = true">默认动画</Button>
+          </Loading>
+        </div>
+        <div class="size-40">
+          <Loading :spinning="loading" class="flex-center size-full">
+            <Button type="primary" @click="loading = true">自定义动画1</Button>
+            <template #icon>
+              <IconifyIcon
+                icon="svg-spinners:ring-resize"
+                class="size-10 text-primary"
+              />
+            </template>
+          </Loading>
+        </div>
+        <div class="size-40">
+          <Loading :spinning="loading" class="flex-center size-full">
+            <Button type="primary" @click="loading = true">自定义动画2</Button>
+            <template #icon>
+              <IconifyIcon
+                icon="svg-spinners:bars-scale"
+                class="size-10 text-primary"
+              />
+            </template>
+          </Loading>
+        </div>
+      </div>
+    </Card>
+
+    <Card
+      title="Vben Spinner"
+      v-spinning="spinningV"
+      class="mt-4 overflow-hidden"
+      :styles="{
+        body: {
+          position: 'relative',
+          overflow: 'hidden',
+        },
+      }"
+    >
+      <template #extra>
+        <Button type="primary" @click="spinningV = true">
+          v-spinning 指令
+        </Button>
+      </template>
+      <template #actions>
+        Spinner组件是Loading组件的一个特例，只有一个固定的统一样式。
+      </template>
+      <Spinner :spinning="spinning" class="flex-center size-40">
+        <Button type="primary" @click="spinning = true">显示Spinner</Button>
+      </Spinner>
+    </Card>
+  </Page>
+</template>
diff --git a/playground/src/views/examples/modal/auto-height-demo.vue b/playground/src/views/examples/modal/auto-height-demo.vue
index 28939a62..24ac99f4 100644
--- a/playground/src/views/examples/modal/auto-height-demo.vue
+++ b/playground/src/views/examples/modal/auto-height-demo.vue
@@ -3,7 +3,7 @@ import { ref } from 'vue';
 
 import { useVbenModal } from '@vben/common-ui';
 
-import { Button, message } from 'ant-design-vue';
+import { Button, message } from 'antdv-next';
 
 const list = ref<number[]>([]);
 
@@ -16,15 +16,18 @@ const [Modal, modalApi] = useVbenModal({
   },
   onOpenChange(isOpen) {
     if (isOpen) {
-      handleUpdate(10);
+      handleUpdate();
     }
   },
 });
 
-function handleUpdate(len: number) {
+function handleUpdate(len?: number) {
   modalApi.setState({ confirmDisabled: true, loading: true });
   setTimeout(() => {
-    list.value = Array.from({ length: len }, (_v, k) => k + 1);
+    list.value = Array.from(
+      { length: len ?? Math.floor(Math.random() * 10) + 1 },
+      (_v, k) => k + 1,
+    );
     modalApi.setState({ confirmDisabled: false, loading: false });
   }, 2000);
 }
@@ -35,12 +38,12 @@ function handleUpdate(len: number) {
     <div
       v-for="item in list"
       :key="item"
-      class="even:bg-heavy bg-muted flex-center h-[220px] w-full"
+      class="flex-center h-55 w-full bg-muted even:bg-heavy"
     >
       {{ item }}
     </div>
     <template #prepend-footer>
-      <Button type="link" @click="handleUpdate(6)">点击更新数据</Button>
+      <Button type="link" @click="handleUpdate()">点击更新数据</Button>
     </template>
   </Modal>
 </template>
diff --git a/playground/src/views/examples/modal/base-demo.vue b/playground/src/views/examples/modal/base-demo.vue
index 40afb869..6dbab5fd 100644
--- a/playground/src/views/examples/modal/base-demo.vue
+++ b/playground/src/views/examples/modal/base-demo.vue
@@ -1,7 +1,7 @@
 <script lang="ts" setup>
 import { useVbenModal } from '@vben/common-ui';
 
-import { message } from 'ant-design-vue';
+import { Button, message } from 'antdv-next';
 
 const [Modal, modalApi] = useVbenModal({
   onCancel() {
@@ -18,9 +18,17 @@ const [Modal, modalApi] = useVbenModal({
     message.info('onOpened：打开动画结束');
   },
 });
+
+function lockModal() {
+  modalApi.lock();
+  setTimeout(() => {
+    modalApi.unlock();
+  }, 3000);
+}
 </script>
 <template>
-  <Modal class="w-[600px]" title="基础弹窗示例" title-tooltip="标题提示内容">
+  <Modal class="w-150" title="基础弹窗示例" title-tooltip="标题提示内容">
     base demo
+    <Button type="primary" @click="lockModal">锁定弹窗</Button>
   </Modal>
 </template>
diff --git a/playground/src/views/examples/modal/blur-demo.vue b/playground/src/views/examples/modal/blur-demo.vue
new file mode 100644
index 00000000..23b071b2
--- /dev/null
+++ b/playground/src/views/examples/modal/blur-demo.vue
@@ -0,0 +1,23 @@
+<script lang="ts" setup>
+import { ref, watch } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+
+import { Slider } from 'antdv-next';
+
+const blur = ref(5);
+const [Modal, modalApi] = useVbenModal({
+  overlayBlur: blur.value,
+});
+watch(blur, (val) => {
+  modalApi.setState({
+    overlayBlur: val,
+  });
+});
+</script>
+<template>
+  <Modal title="遮罩层模糊">
+    <p>调整滑块来改变遮罩层模糊程度：{{ blur }}</p>
+    <Slider v-model:value="blur" :max="30" :min="0" />
+  </Modal>
+</template>
diff --git a/playground/src/views/examples/modal/drag-demo.vue b/playground/src/views/examples/modal/drag-demo.vue
index 45203036..82c0e5a0 100644
--- a/playground/src/views/examples/modal/drag-demo.vue
+++ b/playground/src/views/examples/modal/drag-demo.vue
@@ -1,7 +1,7 @@
 <script lang="ts" setup>
 import { useVbenModal } from '@vben/common-ui';
 
-import { message } from 'ant-design-vue';
+import { message } from 'antdv-next';
 
 const [Modal, modalApi] = useVbenModal({
   draggable: true,
diff --git a/playground/src/views/examples/modal/dynamic-demo.vue b/playground/src/views/examples/modal/dynamic-demo.vue
index 33d1c4ee..1977b3e9 100644
--- a/playground/src/views/examples/modal/dynamic-demo.vue
+++ b/playground/src/views/examples/modal/dynamic-demo.vue
@@ -1,7 +1,7 @@
 <script lang="ts" setup>
 import { useVbenModal } from '@vben/common-ui';
 
-import { Button, message } from 'ant-design-vue';
+import { Button, message } from 'antdv-next';
 
 const [Modal, modalApi] = useVbenModal({
   draggable: true,
diff --git a/playground/src/views/examples/modal/form-modal-demo.vue b/playground/src/views/examples/modal/form-modal-demo.vue
index 31942b0f..c33491d7 100644
--- a/playground/src/views/examples/modal/form-modal-demo.vue
+++ b/playground/src/views/examples/modal/form-modal-demo.vue
@@ -1,14 +1,14 @@
 <script lang="ts" setup>
 import { useVbenModal } from '@vben/common-ui';
 
-import { message } from 'ant-design-vue';
+import { message } from 'antdv-next';
 
 import { useVbenForm } from '#/adapter/form';
 
 
 
-function onSubmit(values: Record<string, any>) {
-  message.info(JSON.stringify(values)); // 只会执行一次
+interface FormModalData {
+  values?: Record<string, unknown>;
 }
 
 const [Form, formApi] = useVbenForm({
@@ -35,6 +35,7 @@ const [Form, formApi] = useVbenForm({
     {
       component: 'Select',
       componentProps: {
+        class: 'w-full',
         options: [
           { label: '选项1', value: '1' },
           { label: '选项2', value: '2' },
@@ -49,25 +50,44 @@ const [Form, formApi] = useVbenForm({
   showDefaultActions: false,
 });
 
-const [Modal, modalApi] = useVbenModal({
+const [Modal, modalApi] = useVbenModal<FormModalData>({
   fullscreenButton: false,
   onCancel() {
     modalApi.close();
   },
   onConfirm: async () => {
-    await formApi.validateAndSubmitForm();
+    await formApi.validateAndSubmit();
     // modalApi.close();
   },
   onOpenChange(isOpen: boolean) {
     if (isOpen) {
-      const { values } = modalApi.getData<Record<string, any>>();
-      if (values) {
-        formApi.setValues(values);
+      const data = modalApi.getData();
+      if (data?.values) {
+        formApi.setValues(data.values);
       }
     }
   },
   title: '内嵌表单示例',
 });
+
+defineExpose({ modalApi });
+
+function onSubmit(values: Record<string, any>) {
+  message.loading({
+    content: '正在提交中...',
+    duration: 0,
+    key: 'is-form-submitting',
+  });
+  modalApi.lock();
+  setTimeout(() => {
+    modalApi.close();
+    message.success({
+      content: `提交成功：${JSON.stringify(values)}`,
+      duration: 2,
+      key: 'is-form-submitting',
+    });
+  }, 3000);
+}
 </script>
 <template>
   <Modal>
diff --git a/playground/src/views/examples/modal/in-content-demo.vue b/playground/src/views/examples/modal/in-content-demo.vue
index 4ffbceaa..93d3e831 100644
--- a/playground/src/views/examples/modal/in-content-demo.vue
+++ b/playground/src/views/examples/modal/in-content-demo.vue
@@ -1,9 +1,12 @@
 <script lang="ts" setup>
+import { ref } from 'vue';
+
 import { useVbenModal } from '@vben/common-ui';
 
-import { message } from 'ant-design-vue';
+import { Input, message } from 'antdv-next';
 
 const [Modal, modalApi] = useVbenModal({
+  destroyOnClose: false,
   onCancel() {
     modalApi.close();
   },
@@ -12,14 +15,16 @@ const [Modal, modalApi] = useVbenModal({
     // modalApi.close();
   },
 });
+const value = ref();
 </script>
 <template>
   <Modal
     append-to-main
-    class="w-[600px]"
+    class="w-150"
     title="基础弹窗示例"
     title-tooltip="标题提示内容"
   >
-    此弹窗指定在内容区域打开
+    此弹窗指定在内容区域打开，并且在关闭之后弹窗内容不会被销毁
+    <Input v-model:value="value" placeholder="KeepAlive测试" />
   </Modal>
 </template>
diff --git a/playground/src/views/examples/modal/index.vue b/playground/src/views/examples/modal/index.vue
index 4176f14e..5631e7c8 100644
--- a/playground/src/views/examples/modal/index.vue
+++ b/playground/src/views/examples/modal/index.vue
@@ -1,16 +1,35 @@
 <script lang="ts" setup>
-import { Page, useVbenModal } from '@vben/common-ui';
+import type { ExplicitModalData } from './typed-data-contract';
 
-import { Button, Card } from 'ant-design-vue';
+import { onBeforeUnmount } from 'vue';
+
+import {
+  alert,
+  clearAllAlerts,
+  confirm,
+  Page,
+  prompt,
+  useVbenModal,
+} from '@vben/common-ui';
+
+import { Button, Card, Flex, message } from 'antdv-next';
 
 import DocButton from '../doc-button.vue';
 import AutoHeightDemo from './auto-height-demo.vue';
 import BaseDemo from './base-demo.vue';
+import BlurDemo from './blur-demo.vue';
 import DragDemo from './drag-demo.vue';
 import DynamicDemo from './dynamic-demo.vue';
 import FormModalDemo from './form-modal-demo.vue';
 import InContentModalDemo from './in-content-demo.vue';
+import NestedDemo from './nested-demo.vue';
 import SharedDataDemo from './shared-data-demo.vue';
+import TypedDataAutoDemo from './typed-data-auto-demo.vue';
+import { useFactoryModal } from './typed-data-contract';
+import TypedDataExplicitDemo from './typed-data-explicit-demo.vue';
+import TypedDataFactoryDemo from './typed-data-factory-demo.vue';
+
+defineOptions({ name: 'ModalExample' });
 
 const [BaseModal, baseModalApi] = useVbenModal({
   // 连接抽离的组件
@@ -42,6 +61,27 @@ const [FormModal, formModalApi] = useVbenModal({
   connectedComponent: FormModalDemo,
 });
 
+const [TypedDataAutoModal, typedDataAutoModalApi] = useVbenModal({
+  connectedComponent: TypedDataAutoDemo,
+});
+
+const [TypedDataExplicitModal, typedDataExplicitModalApi] =
+  useVbenModal<ExplicitModalData>({
+    connectedComponent: TypedDataExplicitDemo,
+  });
+
+const [TypedDataFactoryModal, typedDataFactoryModalApi] = useFactoryModal({
+  connectedComponent: TypedDataFactoryDemo,
+});
+
+const [NestedModal, nestedModalApi] = useVbenModal({
+  connectedComponent: NestedDemo,
+});
+
+const [BlurModal, blurModalApi] = useVbenModal({
+  connectedComponent: BlurDemo,
+});
+
 function openBaseModal() {
   baseModalApi.open();
 }
@@ -63,24 +103,118 @@ function openDynamicModal() {
 }
 
 function openSharedModal() {
-  sharedModalApi.setData({
-    content: '外部传递的数据 content',
-    payload: '外部传递的数据 payload',
-  });
-  sharedModalApi.open();
+  sharedModalApi
+    .setData({
+      content: '外部传递的数据 content',
+      payload: '外部传递的数据 payload',
+    })
+    .open();
+}
+
+function openNestedModal() {
+  nestedModalApi.open();
+}
+
+function openBlurModal() {
+  blurModalApi.open();
 }
 
 function handleUpdateTitle() {
-  dynamicModalApi.setState({ title: '外部动态标题' });
-  dynamicModalApi.open();
+  dynamicModalApi.setState({ title: '外部动态标题' }).open();
 }
 
 function openFormModal() {
-  formModalApi.setData({
-    // 表单值
-    values: { field1: 'abc' },
+  formModalApi
+    .setData({
+      // 表单值
+      values: { field1: 'abc', field2: '123', field3: '1' },
+    })
+    .open();
+}
+
+function openTypedDataAutoModal() {
+  typedDataAutoModalApi
+    .setData({
+      message: '外部无需声明泛型，由 connected component 自动推导。',
+      method: '自动推导',
+    })
+    .open();
+}
+
+function openTypedDataExplicitModal() {
+  typedDataExplicitModalApi
+    .setData({
+      message: '父子组件显式引用同一个数据类型。',
+      method: '显式泛型',
+    })
+    .open();
+}
+
+function openTypedDataFactoryModal() {
+  typedDataFactoryModalApi
+    .setData({
+      message: '父子组件复用预绑定的 typed composable。',
+      method: '契约工厂',
+    })
+    .open();
+}
+
+function openAlert() {
+  alert({
+    content: '这是一个弹窗',
+    icon: 'success',
+  }).then(() => {
+    message.info('用户关闭了弹窗');
   });
-  formModalApi.open();
+}
+
+onBeforeUnmount(() => {
+  // 清除所有弹窗
+  clearAllAlerts();
+});
+
+function openConfirm() {
+  confirm({
+    beforeClose({ isConfirm }) {
+      if (!isConfirm) return;
+      // 这里可以做一些异步操作
+      return new Promise((resolve) => {
+        setTimeout(() => {
+          resolve(true);
+        }, 1000);
+      });
+    },
+    centered: false,
+    content: '这是一个确认弹窗',
+    icon: 'question',
+  })
+    .then(() => {
+      message.success('用户确认了操作');
+    })
+    .catch(() => {
+      message.error('用户取消了操作');
+    });
+}
+
+async function openPrompt() {
+  prompt<string>({
+    async beforeClose({ isConfirm, value }) {
+      if (isConfirm && value === '芝士') {
+        message.error('不能吃芝士');
+        return false;
+      }
+    },
+    componentProps: { placeholder: '不能吃芝士...' },
+    content: '中午吃了什么？',
+    icon: 'question',
+    overlayBlur: 3,
+  })
+    .then((res) => {
+      message.success(`用户输入了：${res}`);
+    })
+    .catch(() => {
+      message.error('用户取消了输入');
+    });
 }
 </script>
 
@@ -100,44 +234,121 @@ function openFormModal() {
     <DynamicModal />
     <SharedDataModal />
     <FormModal />
-    <Card class="mb-4" title="基本使用">
-      <p class="mb-3">一个基础的弹窗示例</p>
-      <Button type="primary" @click="openBaseModal">打开弹窗</Button>
-    </Card>
+    <TypedDataAutoModal />
+    <TypedDataExplicitModal />
+    <TypedDataFactoryModal />
+    <NestedModal />
+    <BlurModal />
+    <Flex wrap="wrap" class="w-full" gap="10">
+      <Card class="w-75" title="基本使用">
+        <p>一个基础的弹窗示例</p>
+        <template #actions>
+          <Button type="primary" @click="openBaseModal">打开弹窗</Button>
+        </template>
+      </Card>
 
-    <Card class="mb-4" title="指定容器">
-      <p class="mb-3">在内容区域打开弹窗的示例</p>
-      <Button type="primary" @click="openInContentModal">打开弹窗</Button>
-    </Card>
+      <Card class="w-75" title="指定容器+关闭后不销毁">
+        <p>在内容区域打开弹窗的示例</p>
+        <template #actions>
+          <Button type="primary" @click="openInContentModal">打开弹窗</Button>
+        </template>
+      </Card>
 
-    <Card class="mb-4" title="内容高度自适应">
-      <p class="mb-3">可根据内容并自动调整高度</p>
-      <Button type="primary" @click="openAutoHeightModal">打开弹窗</Button>
-    </Card>
+      <Card class="w-75" title="内容高度自适应">
+        <p>可根据内容并自动调整高度</p>
+        <template #actions>
+          <Button type="primary" @click="openAutoHeightModal">
+            打开弹窗
+          </Button>
+        </template>
+      </Card>
 
-    <Card class="mb-4" title="可拖拽示例">
-      <p class="mb-3">配置 draggable 可开启拖拽功能</p>
-      <Button type="primary" @click="openDragModal">打开弹窗</Button>
-    </Card>
+      <Card class="w-75" title="可拖拽示例">
+        <p>配置 draggable 可开启拖拽功能</p>
+        <template #actions>
+          <Button type="primary" @click="openDragModal"> 打开弹窗 </Button>
+        </template>
+      </Card>
 
-    <Card class="mb-4" title="动态配置示例">
-      <p class="mb-3">通过 setState 动态调整弹窗数据</p>
-      <Button type="primary" @click="openDynamicModal">打开弹窗</Button>
-      <Button class="ml-2" type="primary" @click="handleUpdateTitle">
-        从外部修改标题并打开
-      </Button>
-    </Card>
+      <Card class="w-75" title="动态配置示例">
+        <p>通过 setState 动态调整弹窗数据</p>
+        <template #extra>
+          <Button type="link" @click="openDynamicModal">打开弹窗</Button>
+        </template>
+        <template #actions>
+          <Button type="primary" @click="handleUpdateTitle">
+            外部修改标题并打开
+          </Button>
+        </template>
+      </Card>
 
-    <Card class="mb-4" title="内外数据共享示例">
-      <p class="mb-3">通过共享 sharedData 来进行数据交互</p>
-      <Button type="primary" @click="openSharedModal">
-        打开弹窗并传递数据
-      </Button>
-    </Card>
+      <Card class="w-75" title="内外数据共享示例">
+        <p>通过共享 sharedData 来进行数据交互</p>
+        <template #actions>
+          <Button type="primary" @click="openSharedModal">
+            打开弹窗并传递数据
+          </Button>
+        </template>
+      </Card>
 
-    <Card class="mb-4" title="表单弹窗示例">
-      <p class="mb-3">弹窗与表单结合</p>
-      <Button type="primary" @click="openFormModal"> 打开弹窗 </Button>
-    </Card>
+      <Card class="w-75" title="表单弹窗示例">
+        <p>弹窗与表单结合</p>
+        <template #actions>
+          <Button type="primary" @click="openFormModal"> 打开表单弹窗 </Button>
+        </template>
+      </Card>
+
+      <Card class="w-75" title="共享数据：自动推导">
+        <p>子组件 expose API，父组件从 connected component 推导类型</p>
+        <template #actions>
+          <Button type="primary" @click="openTypedDataAutoModal">
+            打开自动推导示例
+          </Button>
+        </template>
+      </Card>
+
+      <Card class="w-75" title="共享数据：显式泛型">
+        <p>无法自动推导时，父子组件显式引用同一个数据类型</p>
+        <template #actions>
+          <Button type="primary" @click="openTypedDataExplicitModal">
+            打开显式泛型示例
+          </Button>
+        </template>
+      </Card>
+
+      <Card class="w-75" title="共享数据：契约工厂">
+        <p>通过 createVbenModal 预绑定类型并复用 typed composable</p>
+        <template #actions>
+          <Button type="primary" @click="openTypedDataFactoryModal">
+            打开契约工厂示例
+          </Button>
+        </template>
+      </Card>
+
+      <Card class="w-75" title="嵌套弹窗示例">
+        <p>在已经打开的弹窗中再次打开弹窗</p>
+        <template #actions>
+          <Button type="primary" @click="openNestedModal">打开嵌套弹窗</Button>
+        </template>
+      </Card>
+
+      <Card class="w-75" title="遮罩模糊示例">
+        <p>遮罩层应用类似毛玻璃的模糊效果</p>
+        <template #actions>
+          <Button type="primary" @click="openBlurModal">打开弹窗</Button>
+        </template>
+      </Card>
+      <Card class="w-75" title="轻量提示弹窗">
+        <template #extra>
+          <DocButton path="/components/common-ui/vben-alert" />
+        </template>
+        <p>通过快捷方法创建动态提示弹窗，适合一些轻量的提示和确认、输入等</p>
+        <template #actions>
+          <Button type="primary" @click="openAlert">Alert</Button>
+          <Button type="primary" @click="openConfirm">Confirm</Button>
+          <Button type="primary" @click="openPrompt">Prompt</Button>
+        </template>
+      </Card>
+    </Flex>
   </Page>
 </template>
diff --git a/playground/src/views/examples/modal/nested-demo.vue b/playground/src/views/examples/modal/nested-demo.vue
new file mode 100644
index 00000000..a7384d78
--- /dev/null
+++ b/playground/src/views/examples/modal/nested-demo.vue
@@ -0,0 +1,24 @@
+<script lang="ts" setup>
+import { useVbenModal } from '@vben/common-ui';
+
+import { Button } from 'antdv-next';
+
+import DragDemo from './drag-demo.vue';
+
+const [Modal] = useVbenModal({
+  destroyOnClose: true,
+});
+const [BaseModal, baseModalApi] = useVbenModal({
+  connectedComponent: DragDemo,
+});
+
+function openNestedModal() {
+  baseModalApi.open();
+}
+</script>
+<template>
+  <Modal title="嵌套弹窗示例">
+    <Button @click="openNestedModal" type="primary">打开子弹窗</Button>
+    <BaseModal />
+  </Modal>
+</template>
diff --git a/playground/src/views/examples/modal/shared-data-demo.vue b/playground/src/views/examples/modal/shared-data-demo.vue
index 8ba6e7e9..733261e9 100644
--- a/playground/src/views/examples/modal/shared-data-demo.vue
+++ b/playground/src/views/examples/modal/shared-data-demo.vue
@@ -3,11 +3,16 @@ import { ref } from 'vue';
 
 import { useVbenModal } from '@vben/common-ui';
 
-import { message } from 'ant-design-vue';
+import { message } from 'antdv-next';
 
-const data = ref();
+interface SharedData {
+  content: string;
+  payload: string;
+}
 
-const [Modal, modalApi] = useVbenModal({
+const data = ref<SharedData>();
+
+const [Modal, modalApi] = useVbenModal<SharedData>({
   onCancel() {
     modalApi.close();
   },
@@ -17,10 +22,12 @@ const [Modal, modalApi] = useVbenModal({
   },
   onOpenChange(isOpen: boolean) {
     if (isOpen) {
-      data.value = modalApi.getData<Record<string, any>>();
+      data.value = modalApi.getData();
     }
   },
 });
+
+defineExpose({ modalApi });
 </script>
 <template>
   <Modal title="数据共享示例">
diff --git a/playground/src/views/examples/modal/typed-data-auto-demo.vue b/playground/src/views/examples/modal/typed-data-auto-demo.vue
new file mode 100644
index 00000000..52dd5270
--- /dev/null
+++ b/playground/src/views/examples/modal/typed-data-auto-demo.vue
@@ -0,0 +1,29 @@
+<script setup lang="ts">
+import { ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+
+interface AutoModalData {
+  message: string;
+  method: '自动推导';
+}
+
+const data = ref<AutoModalData>();
+
+const [Modal, modalApi] = useVbenModal<AutoModalData>({
+  onOpenChange(isOpen) {
+    data.value = isOpen ? modalApi.getData() : undefined;
+  },
+});
+
+defineExpose({ modalApi });
+</script>
+
+<template>
+  <Modal title="自动推导数据类型">
+    <div class="space-y-2 px-2">
+      <p>类型来源：{{ data?.method }}</p>
+      <p>接收内容：{{ data?.message }}</p>
+    </div>
+  </Modal>
+</template>
diff --git a/playground/src/views/examples/modal/typed-data-contract.ts b/playground/src/views/examples/modal/typed-data-contract.ts
new file mode 100644
index 00000000..87e74275
--- /dev/null
+++ b/playground/src/views/examples/modal/typed-data-contract.ts
@@ -0,0 +1,13 @@
+import { createVbenModal } from '@vben/common-ui';
+
+export interface ExplicitModalData {
+  message: string;
+  method: '显式泛型';
+}
+
+export interface FactoryModalData {
+  message: string;
+  method: '契约工厂';
+}
+
+export const useFactoryModal = createVbenModal<FactoryModalData>();
diff --git a/playground/src/views/examples/modal/typed-data-explicit-demo.vue b/playground/src/views/examples/modal/typed-data-explicit-demo.vue
new file mode 100644
index 00000000..f3300666
--- /dev/null
+++ b/playground/src/views/examples/modal/typed-data-explicit-demo.vue
@@ -0,0 +1,24 @@
+<script setup lang="ts">
+import type { ExplicitModalData } from './typed-data-contract';
+
+import { ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+
+const data = ref<ExplicitModalData>();
+
+const [Modal, modalApi] = useVbenModal<ExplicitModalData>({
+  onOpenChange(isOpen) {
+    data.value = isOpen ? modalApi.getData() : undefined;
+  },
+});
+</script>
+
+<template>
+  <Modal title="显式泛型数据类型">
+    <div class="space-y-2 px-2">
+      <p>类型来源：{{ data?.method }}</p>
+      <p>接收内容：{{ data?.message }}</p>
+    </div>
+  </Modal>
+</template>
diff --git a/playground/src/views/examples/modal/typed-data-factory-demo.vue b/playground/src/views/examples/modal/typed-data-factory-demo.vue
new file mode 100644
index 00000000..4713f848
--- /dev/null
+++ b/playground/src/views/examples/modal/typed-data-factory-demo.vue
@@ -0,0 +1,24 @@
+<script setup lang="ts">
+import type { FactoryModalData } from './typed-data-contract';
+
+import { ref } from 'vue';
+
+import { useFactoryModal } from './typed-data-contract';
+
+const data = ref<FactoryModalData>();
+
+const [Modal, modalApi] = useFactoryModal({
+  onOpenChange(isOpen) {
+    data.value = isOpen ? modalApi.getData() : undefined;
+  },
+});
+</script>
+
+<template>
+  <Modal title="契约工厂数据类型">
+    <div class="space-y-2 px-2">
+      <p>类型来源：{{ data?.method }}</p>
+      <p>接收内容：{{ data?.message }}</p>
+    </div>
+  </Modal>
+</template>
diff --git a/playground/src/views/examples/motion/index.vue b/playground/src/views/examples/motion/index.vue
new file mode 100644
index 00000000..bf5b99fa
--- /dev/null
+++ b/playground/src/views/examples/motion/index.vue
@@ -0,0 +1,197 @@
+<script lang="ts" setup>
+import { reactive } from 'vue';
+
+import { Page } from '@vben/common-ui';
+import { Motion, MotionGroup, MotionPresets } from '@vben/plugins/motion';
+
+import { refAutoReset, watchDebounced } from '@vueuse/core';
+import {
+  Button,
+  Card,
+  Col,
+  Form,
+  FormItem,
+  InputNumber,
+  Row,
+  Select,
+} from 'antdv-next';
+// 本例子用不到visible类型的动画。带有VisibleOnce和Visible的类型会在组件进入视口被显示时执行动画，
+const presets = MotionPresets.filter((v) => !v.includes('Visible'));
+const showCard1 = refAutoReset(true, 100);
+const showCard2 = refAutoReset(true, 100);
+const showCard3 = refAutoReset(true, 100);
+const motionProps = reactive({
+  delay: 0,
+  duration: 300,
+  enter: { scale: 1 },
+  hovered: { scale: 1.1, transition: { delay: 0, duration: 50 } },
+  preset: 'fade',
+  tapped: { scale: 0.9, transition: { delay: 0, duration: 50 } },
+});
+
+const motionGroupProps = reactive({
+  delay: 0,
+  duration: 300,
+  enter: { scale: 1 },
+  hovered: { scale: 1.1, transition: { delay: 0, duration: 50 } },
+  preset: 'fade',
+  tapped: { scale: 0.9, transition: { delay: 0, duration: 50 } },
+});
+
+watchDebounced(
+  motionProps,
+  () => {
+    showCard2.value = false;
+  },
+  { debounce: 200, deep: true },
+);
+
+watchDebounced(
+  motionGroupProps,
+  () => {
+    showCard3.value = false;
+  },
+  { debounce: 200, deep: true },
+);
+
+function openDocPage() {
+  window.open('https://motion.vueuse.org/', '_blank');
+}
+</script>
+<template>
+  <Page title="Motion">
+    <template #description>
+      <span>一个易于使用的为其它组件赋予动画效果的组件。</span>
+      <Button type="link" @click="openDocPage">查看文档</Button>
+    </template>
+    <Card title="使用指令" :styles="{ body: { minHeight: '5rem' } }">
+      <template #extra>
+        <Button type="primary" @click="showCard1 = false">重载</Button>
+      </template>
+      <div>
+        <div class="relative flex gap-2 overflow-hidden" v-if="showCard1">
+          <Button v-motion-fade-visible>fade</Button>
+          <Button v-motion-pop-visible :duration="500">pop</Button>
+          <Button v-motion-slide-left>slide-left</Button>
+          <Button v-motion-slide-right>slide-right</Button>
+          <Button v-motion-slide-bottom>slide-bottom</Button>
+          <Button v-motion-slide-top>slide-top</Button>
+        </div>
+      </div>
+    </Card>
+    <Card
+      class="mt-2"
+      title="使用组件（将内部作为一个整体添加动画）"
+      :styles="{ body: { padding: 0 } }"
+    >
+      <div class="relative flex-center min-h-32 gap-2 overflow-hidden">
+        <Motion
+          v-bind="motionProps"
+          v-if="showCard2"
+          class="flex items-center gap-2"
+        >
+          <Button size="large">这个按钮在显示时会有动画效果</Button>
+          <span>附属组件，会作为整体处理动画</span>
+        </Motion>
+      </div>
+      <div class="relative flex-center min-h-32 gap-2 overflow-hidden">
+        <div v-if="showCard2" class="flex items-center gap-2">
+          <span>顺序延迟</span>
+          <Motion
+            v-bind="{
+              ...motionProps,
+              delay: motionProps.delay + 100 * i,
+            }"
+            v-for="i in 5"
+            :key="i"
+          >
+            <Button size="large">按钮{{ i }}</Button>
+          </Motion>
+        </div>
+      </div>
+      <div>
+        <Form :model="motionProps" :label-col="{ span: 10 }">
+          <Row>
+            <Col :span="8">
+              <FormItem prop="preset" label="动画效果">
+                <Select
+                  v-model:value="motionProps.preset"
+                  :options="presets.map((p) => ({ label: p, value: p }))"
+                />
+              </FormItem>
+            </Col>
+            <Col :span="8">
+              <FormItem prop="duration" label="持续时间">
+                <InputNumber v-model:value="motionProps.duration" />
+              </FormItem>
+            </Col>
+            <Col :span="8">
+              <FormItem prop="delay" label="延迟动画">
+                <InputNumber v-model:value="motionProps.delay" />
+              </FormItem>
+            </Col>
+            <Col :span="8">
+              <FormItem prop="hovered.scale" label="Hover缩放">
+                <InputNumber v-model:value="motionProps.hovered.scale" />
+              </FormItem>
+            </Col>
+            <Col :span="8">
+              <FormItem prop="hovered.tapped" label="按下时缩放">
+                <InputNumber v-model:value="motionProps.tapped.scale" />
+              </FormItem>
+            </Col>
+          </Row>
+        </Form>
+      </div>
+    </Card>
+    <Card
+      class="mt-2"
+      title="分组动画（每个子元素都会应用相同的独立动画）"
+      :styles="{ body: { padding: 0 } }"
+    >
+      <div class="relative flex-center min-h-32 gap-2 overflow-hidden">
+        <MotionGroup v-bind="motionGroupProps" v-if="showCard3">
+          <Button size="large">按钮1</Button>
+          <Button size="large">按钮2</Button>
+          <Button size="large">按钮3</Button>
+          <Button size="large">按钮4</Button>
+          <Button size="large">按钮5</Button>
+        </MotionGroup>
+      </div>
+      <div>
+        <Form :model="motionGroupProps" :label-col="{ span: 10 }">
+          <Row>
+            <Col :span="8">
+              <FormItem prop="preset" label="动画效果">
+                <Select
+                  v-model:value="motionGroupProps.preset"
+                  :options="presets.map((p) => ({ label: p, value: p }))"
+                />
+              </FormItem>
+            </Col>
+            <Col :span="8">
+              <FormItem prop="duration" label="持续时间">
+                <InputNumber v-model:value="motionGroupProps.duration" />
+              </FormItem>
+            </Col>
+            <Col :span="8">
+              <FormItem prop="delay" label="延迟动画">
+                <InputNumber v-model:value="motionGroupProps.delay" />
+              </FormItem>
+            </Col>
+            <Col :span="8">
+              <FormItem prop="hovered.scale" label="Hover缩放">
+                <InputNumber v-model:value="motionGroupProps.hovered.scale" />
+              </FormItem>
+            </Col>
+            <Col :span="8">
+              <FormItem prop="hovered.tapped" label="按下时缩放">
+                <InputNumber v-model:value="motionGroupProps.tapped.scale" />
+              </FormItem>
+            </Col>
+          </Row>
+        </Form>
+      </div>
+    </Card>
+  </Page>
+</template>
diff --git a/playground/src/views/examples/resize/basic.vue b/playground/src/views/examples/resize/basic.vue
index 6295839a..7894e7f0 100644
--- a/playground/src/views/examples/resize/basic.vue
+++ b/playground/src/views/examples/resize/basic.vue
@@ -50,7 +50,7 @@ const resize = (size?: TSize, rect?: TSize) => {
       >
         <div
           :style="{ backgroundColor: colorMap[idx] }"
-          class="h-full w-full"
+          class="size-full"
         ></div>
       </VResize>
     </template>
diff --git a/playground/src/views/examples/tippy/index.vue b/playground/src/views/examples/tippy/index.vue
new file mode 100644
index 00000000..232e8cc3
--- /dev/null
+++ b/playground/src/views/examples/tippy/index.vue
@@ -0,0 +1,303 @@
+<script lang="ts" setup>
+import type { TippyProps } from '@vben/common-ui';
+
+import { reactive } from 'vue';
+
+import { Page, Tippy } from '@vben/common-ui';
+
+import { Button, Card, Flex } from 'antdv-next';
+
+import { useVbenForm } from '#/adapter/form';
+
+const tippyProps = reactive<TippyProps>({
+  animation: 'shift-away',
+  arrow: true,
+  content: '这是一个提示',
+  delay: [200, 200],
+  duration: 200,
+  followCursor: false,
+  hideOnClick: false,
+  inertia: true,
+  maxWidth: 'none',
+  placement: 'top',
+  theme: 'dark',
+  trigger: 'mouseenter focusin',
+});
+
+function parseBoolean(value: string) {
+  switch (value) {
+    case 'false': {
+      return false;
+    }
+    case 'true': {
+      return true;
+    }
+    default: {
+      return value;
+    }
+  }
+}
+
+const [Form] = useVbenForm({
+  handleValuesChange(values) {
+    Object.assign(tippyProps, {
+      ...values,
+      delay: [values.delay1, values.delay2],
+      followCursor: parseBoolean(values.followCursor),
+      hideOnClick: parseBoolean(values.hideOnClick),
+      trigger: values.trigger.join(' '),
+    });
+  },
+  schema: [
+    {
+      component: 'RadioGroup',
+      componentProps: {
+        buttonStyle: 'solid',
+        class: 'w-full',
+        options: [
+          { label: '自动', value: 'auto' },
+          { label: '暗色', value: 'dark' },
+          { label: '亮色', value: 'light' },
+        ],
+        optionType: 'button',
+      },
+      defaultValue: tippyProps.theme,
+      fieldName: 'theme',
+      label: '主题',
+    },
+    {
+      component: 'Select',
+      componentProps: {
+        class: 'w-full',
+        options: [
+          { label: '向上滑入', value: 'shift-away' },
+          { label: '向下滑入', value: 'shift-toward' },
+          { label: '缩放', value: 'scale' },
+          { label: '透视', value: 'perspective' },
+          { label: '淡入', value: 'fade' },
+        ],
+      },
+      defaultValue: tippyProps.animation,
+      fieldName: 'animation',
+      label: '动画类型',
+    },
+    {
+      component: 'RadioGroup',
+      componentProps: {
+        buttonStyle: 'solid',
+        options: [
+          { label: '是', value: true },
+          { label: '否', value: false },
+        ],
+        optionType: 'button',
+      },
+      defaultValue: tippyProps.inertia,
+      fieldName: 'inertia',
+      label: '动画惯性',
+    },
+    {
+      component: 'Select',
+      componentProps: {
+        class: 'w-full',
+        options: [
+          { label: '顶部', value: 'top' },
+          { label: '顶左', value: 'top-start' },
+          { label: '顶右', value: 'top-end' },
+          { label: '底部', value: 'bottom' },
+          { label: '底左', value: 'bottom-start' },
+          { label: '底右', value: 'bottom-end' },
+          { label: '左侧', value: 'left' },
+          { label: '左上', value: 'left-start' },
+          { label: '左下', value: 'left-end' },
+          { label: '右侧', value: 'right' },
+          { label: '右上', value: 'right-start' },
+          { label: '右下', value: 'right-end' },
+        ],
+      },
+      defaultValue: tippyProps.placement,
+      fieldName: 'placement',
+      label: '位置',
+    },
+    {
+      component: 'InputNumber',
+      componentProps: {
+        addonAfter: '毫秒',
+      },
+      defaultValue: tippyProps.duration,
+      fieldName: 'duration',
+      label: '动画时长',
+    },
+    {
+      component: 'InputNumber',
+      componentProps: {
+        addonAfter: '毫秒',
+      },
+      defaultValue: 100,
+      fieldName: 'delay1',
+      label: '显示延时',
+    },
+    {
+      component: 'InputNumber',
+      componentProps: {
+        addonAfter: '毫秒',
+      },
+      defaultValue: 100,
+      fieldName: 'delay2',
+      label: '隐藏延时',
+    },
+    {
+      component: 'Input',
+      defaultValue: tippyProps.content,
+      fieldName: 'content',
+      label: '内容',
+    },
+    {
+      component: 'RadioGroup',
+      componentProps: {
+        buttonStyle: 'solid',
+        options: [
+          { label: '是', value: true },
+          { label: '否', value: false },
+        ],
+        optionType: 'button',
+      },
+      defaultValue: tippyProps.arrow,
+      fieldName: 'arrow',
+      label: '指示箭头',
+    },
+    {
+      component: 'Select',
+      componentProps: {
+        class: 'w-full',
+        options: [
+          { label: '不跟随', value: 'false' },
+          { label: '完全跟随', value: 'true' },
+          { label: '仅横向', value: 'horizontal' },
+          { label: '仅纵向', value: 'vertical' },
+          { label: '仅初始', value: 'initial' },
+        ],
+      },
+      defaultValue: tippyProps.followCursor?.toString(),
+      fieldName: 'followCursor',
+      label: '跟随指针',
+    },
+    {
+      component: 'Select',
+      componentProps: {
+        class: 'w-full',
+        mode: 'multiple',
+        options: [
+          { label: '鼠标移入', value: 'mouseenter' },
+          { label: '被点击', value: 'click' },
+          { label: '获得焦点', value: 'focusin' },
+          { label: '无触发，仅手动', value: 'manual' },
+        ],
+      },
+      defaultValue: tippyProps.trigger?.split(' '),
+      fieldName: 'trigger',
+      label: '触发方式',
+    },
+    {
+      component: 'Select',
+      componentProps: {
+        class: 'w-full',
+        options: [
+          { label: '否', value: 'false' },
+          { label: '是', value: 'true' },
+          { label: '仅内部', value: 'toggle' },
+        ],
+      },
+      defaultValue: tippyProps.hideOnClick?.toString(),
+      dependencies: {
+        componentProps(_, formAction) {
+          return {
+            disabled: !formAction.values.trigger.includes('click'),
+          };
+        },
+        triggerFields: ['trigger'],
+      },
+      fieldName: 'hideOnClick',
+      help: '只有在触发方式为`click`时才有效',
+      label: '点击后隐藏',
+    },
+    {
+      component: 'Input',
+      componentProps: {
+        allowClear: true,
+        placeholder: 'none、200px',
+      },
+      defaultValue: tippyProps.maxWidth,
+      fieldName: 'maxWidth',
+      label: '最大宽度',
+    },
+  ],
+  showDefaultActions: false,
+  wrapperClass: 'grid-cols-1 md:grid-cols-2 lg:grid-cols-3',
+});
+
+function goDoc() {
+  window.open('https://atomiks.github.io/tippyjs/v6/all-props/');
+}
+</script>
+<template>
+  <Page title="Tippy">
+    <template #description>
+      <div class="flex items-center">
+        <p>
+          Tippy
+          是一个轻量级的提示工具库，它可以用来创建各种交互式提示，如工具提示、引导提示等。
+        </p>
+        <Button type="link" size="small" @click="goDoc">查看文档</Button>
+      </div>
+    </template>
+    <Card title="指令形式使用">
+      <p class="mb-4">
+        指令形式使用比较简洁，直接在需要展示tooltip的组件上用v-tippy传递配置，适用于固定内容的工具提示。
+      </p>
+      <Flex warp="warp" gap="20" align="center">
+        <Button v-tippy="'这是一个提示，使用了默认的配置'">默认配置</Button>
+
+        <Button
+          v-tippy="{ theme: 'light', content: '这是一个提示，总是light主题' }"
+        >
+          指定主题
+        </Button>
+        <Button
+          v-tippy="{
+            theme: 'light',
+            content: '这个提示将在点燃组件100毫秒后激活',
+            delay: 100,
+          }"
+        >
+          指定延时
+        </Button>
+        <Button
+          v-tippy="{
+            content: '本提示的动画为`scale`',
+            animation: 'scale',
+          }"
+        >
+          指定动画
+        </Button>
+      </Flex>
+    </Card>
+    <Card title="组件形式使用" class="mt-4">
+      <div class="flex w-full justify-center">
+        <Tippy v-bind="tippyProps">
+          <Button>鼠标移到这个组件上来体验效果</Button>
+        </Tippy>
+      </div>
+
+      <Form class="mt-4" />
+      <template #actions>
+        <p
+          class="cursor-default text-secondary-foreground hover:text-secondary-foreground"
+        >
+          更多配置请
+          <Button type="link" size="small" @click="goDoc">查看文档</Button>
+          ，这里只列出了一些常用的配置
+        </p>
+      </template>
+    </Card>
+  </Page>
+</template>
diff --git a/playground/src/views/examples/tiptap/index.vue b/playground/src/views/examples/tiptap/index.vue
new file mode 100644
index 00000000..9d426a21
--- /dev/null
+++ b/playground/src/views/examples/tiptap/index.vue
@@ -0,0 +1,77 @@
+<script lang="ts" setup>
+import type { ImageUploadOptions } from '@vben/plugins/tiptap';
+
+import { computed, ref } from 'vue';
+
+import { Page } from '@vben/common-ui';
+import { VbenTiptap, VbenTiptapPreview } from '@vben/plugins/tiptap';
+
+import { Card, Switch } from 'antdv-next';
+const content = ref(`
+  <h1>Vben Tiptap</h1>
+  <p>这个编辑器已经被封装在 <code>packages/effects/plugins/src/tiptap</code> 中。</p>
+  <p>你可以直接在各个 app 里通过 <code>@vben/plugins/tiptap</code> 引入。</p>
+  <blockquote>默认内置 StarterKit、Underline、TextAlign、Placeholder。</blockquote>
+`);
+const previewContent = computed(() => content.value);
+
+const enableUpload = ref(true);
+
+// Mock upload: 模拟上传延迟，支持进度回调
+const imageUpload: ImageUploadOptions = {
+  accept: 'image/*',
+  maxSize: 5 * 1024 * 1024, // 5MB
+  upload: (file, onProgress) =>
+    new Promise((resolve) => {
+      let progress = 0;
+      const interval = setInterval(() => {
+        progress += Math.random() * 30;
+        if (progress >= 100) {
+          progress = 100;
+          clearInterval(interval);
+        }
+        onProgress?.(Math.round(progress));
+        if (progress >= 100) {
+          // 上传完成后返回 mock URL
+          resolve(
+            `https://picsum.photos/seed/${Date.now()}/640/${Math.round((640 * ((file.size % 3) + 2)) / 4)}`,
+          );
+        }
+      }, 300);
+    }),
+  onUploadError: (error) => {
+    console.error('Image upload failed:', error);
+  },
+};
+</script>
+
+<template>
+  <Page title="Tiptap 富文本">
+    <template #description>
+      <div class="mt-2 text-foreground/80">
+        统一封装后的富文本编辑器，适合在各个 app 中直接复用。
+      </div>
+    </template>
+
+    <Card class="mb-5" title="编辑器">
+      <div class="mb-3 flex items-center gap-3">
+        <span class="text-sm">启用图片上传：</span>
+        <Switch v-model:checked="enableUpload" />
+      </div>
+      <VbenTiptap
+        v-model="content"
+        :image-upload="enableUpload ? imageUpload : undefined"
+      />
+    </Card>
+
+    <Card class="mb-5" title="富文本预览">
+      <VbenTiptapPreview :content="previewContent" />
+    </Card>
+
+    <Card title="HTML 输出">
+      <pre class="overflow-auto rounded-xl border border-border bg-muted p-4">
+        {{ previewContent }}
+      </pre>
+    </Card>
+  </Page>
+</template>
diff --git a/playground/src/views/examples/vxe-table/basic.vue b/playground/src/views/examples/vxe-table/basic.vue
index 1216468d..e8d2b695 100644
--- a/playground/src/views/examples/vxe-table/basic.vue
+++ b/playground/src/views/examples/vxe-table/basic.vue
@@ -3,7 +3,7 @@ import type { VxeGridListeners, VxeGridProps } from '#/adapter/vxe-table';
 
 import { Page } from '@vben/common-ui';
 
-import { Button, message } from 'ant-design-vue';
+import { Button, message } from 'antdv-next';
 
 import { useVbenVxeGrid } from '#/adapter/vxe-table';
 
@@ -43,7 +43,22 @@ const gridEvents: VxeGridListeners<RowType> = {
   },
 };
 
-const [Grid, gridApi] = useVbenVxeGrid({ gridEvents, gridOptions });
+const [Grid, gridApi] = useVbenVxeGrid<RowType>({
+  // 放开注释查看表单组件的类型
+  // formOptions: {
+  //   schema: [
+  //     {
+  //       component: 'Switch',
+  //       fieldName: 'name',
+  //     },
+  //   ],
+  // },
+  gridEvents,
+  gridOptions,
+});
+
+// 放开注释查看当前表格实例的类型
+// gridApi.grid
 
 const showBorder = gridApi.useStore((state) => state.gridOptions?.border);
 const showStripe = gridApi.useStore((state) => state.gridOptions?.stripe);
diff --git a/playground/src/views/examples/vxe-table/custom-cell.vue b/playground/src/views/examples/vxe-table/custom-cell.vue
index 3bf1cb91..95b015a9 100644
--- a/playground/src/views/examples/vxe-table/custom-cell.vue
+++ b/playground/src/views/examples/vxe-table/custom-cell.vue
@@ -3,7 +3,7 @@ import type { VxeGridProps } from '#/adapter/vxe-table';
 
 import { Page } from '@vben/common-ui';
 
-import { Button, Image, Switch, Tag } from 'ant-design-vue';
+import { Button, Image, Switch, Tag } from 'antdv-next';
 
 import { useVbenVxeGrid } from '#/adapter/vxe-table';
 import { getExampleTableApi } from '#/api';
@@ -95,7 +95,7 @@ const [Grid] = useVbenVxeGrid({ gridOptions });
         <Image :src="row.imageUrl" height="30" width="30" />
       </template>
       <template #open="{ row }">
-        <Switch v-model:checked="row.open" />
+        <Switch v-model="row.open" />
       </template>
       <template #status="{ row }">
         <Tag :color="row.color">{{ row.status }}</Tag>
diff --git a/playground/src/views/examples/vxe-table/edit-row.vue b/playground/src/views/examples/vxe-table/edit-row.vue
index f9d25cac..31ebadf9 100644
--- a/playground/src/views/examples/vxe-table/edit-row.vue
+++ b/playground/src/views/examples/vxe-table/edit-row.vue
@@ -3,7 +3,7 @@ import type { VxeGridProps } from '#/adapter/vxe-table';
 
 import { Page } from '@vben/common-ui';
 
-import { Button, message } from 'ant-design-vue';
+import { Button, message } from 'antdv-next';
 
 import { useVbenVxeGrid } from '#/adapter/vxe-table';
 import { getExampleTableApi } from '#/api';
diff --git a/playground/src/views/examples/vxe-table/fixed.vue b/playground/src/views/examples/vxe-table/fixed.vue
index 399d3521..a9791323 100644
--- a/playground/src/views/examples/vxe-table/fixed.vue
+++ b/playground/src/views/examples/vxe-table/fixed.vue
@@ -3,7 +3,7 @@ import type { VxeGridProps } from '#/adapter/vxe-table';
 
 import { Page } from '@vben/common-ui';
 
-import { Button } from 'ant-design-vue';
+import { Button } from 'antdv-next';
 
 import { useVbenVxeGrid } from '#/adapter/vxe-table';
 import { getExampleTableApi } from '#/api';
diff --git a/playground/src/views/examples/vxe-table/form.vue b/playground/src/views/examples/vxe-table/form.vue
index dd9e2a37..f4d83c55 100644
--- a/playground/src/views/examples/vxe-table/form.vue
+++ b/playground/src/views/examples/vxe-table/form.vue
@@ -1,13 +1,17 @@
 <script lang="ts" setup>
+import type { Dayjs } from 'dayjs';
+
 import type { VbenFormProps } from '#/adapter/form';
 import type { VxeTableGridOptions } from '#/adapter/vxe-table';
 
 import { Page } from '@vben/common-ui';
 
-import { message } from 'ant-design-vue';
+import { message } from 'antdv-next';
+import dayjs from 'dayjs';
 
 import { useVbenVxeGrid } from '#/adapter/vxe-table';
 import { getExampleTableApi } from '#/api';
+import { createDateRangeCodec } from '#/utils/date-range-codec';
 
 interface RowType {
   category: string;
@@ -18,7 +22,24 @@ interface RowType {
   releaseDate: string;
 }
 
-const formOptions: VbenFormProps = {
+interface SearchFormValues extends Record<string, unknown> {
+  category?: string;
+  color?: string;
+  date?: [Dayjs, Dayjs];
+  price?: string;
+  productName?: string;
+}
+
+const searchCodec = createDateRangeCodec<SearchFormValues>()({
+  endField: 'end',
+  rangeField: 'date',
+  startField: 'start',
+});
+
+type SearchSubmitValues = ReturnType<typeof searchCodec.encode>;
+
+const formOptions: VbenFormProps<SearchFormValues, SearchSubmitValues> = {
+  codec: searchCodec,
   // 默认展开
   collapsed: false,
   schema: [
@@ -58,8 +79,9 @@ const formOptions: VbenFormProps = {
       label: 'Color',
     },
     {
-      component: 'DatePicker',
-      fieldName: 'datePicker',
+      component: 'RangePicker',
+      defaultValue: [dayjs().subtract(7, 'days'), dayjs()],
+      fieldName: 'date',
       label: 'Date',
     },
   ],
@@ -91,7 +113,7 @@ const gridOptions: VxeTableGridOptions<RowType> = {
   pagerConfig: {},
   proxyConfig: {
     ajax: {
-      query: async ({ page }, formValues) => {
+      query: async ({ page }, formValues: SearchSubmitValues) => {
         message.success(`Query params: ${JSON.stringify(formValues)}`);
         return await getExampleTableApi({
           page: page.currentPage,
diff --git a/playground/src/views/examples/vxe-table/remote.vue b/playground/src/views/examples/vxe-table/remote.vue
index 907c1e2c..de2faf85 100644
--- a/playground/src/views/examples/vxe-table/remote.vue
+++ b/playground/src/views/examples/vxe-table/remote.vue
@@ -3,7 +3,7 @@ import type { VxeGridProps } from '#/adapter/vxe-table';
 
 import { Page } from '@vben/common-ui';
 
-import { Button } from 'ant-design-vue';
+import { Button } from 'antdv-next';
 
 import { useVbenVxeGrid } from '#/adapter/vxe-table';
 import { getExampleTableApi } from '#/api';
@@ -55,7 +55,7 @@ const gridOptions: VxeGridProps<RowType> = {
     custom: true,
     export: true,
     // import: true,
-    refresh: { code: 'query' },
+    refresh: true,
     zoom: true,
   },
 };
diff --git a/playground/src/views/examples/vxe-table/tree.vue b/playground/src/views/examples/vxe-table/tree.vue
index c8a1df46..1a28dee0 100644
--- a/playground/src/views/examples/vxe-table/tree.vue
+++ b/playground/src/views/examples/vxe-table/tree.vue
@@ -3,7 +3,7 @@ import type { VxeGridProps } from '#/adapter/vxe-table';
 
 import { Page } from '@vben/common-ui';
 
-import { Button } from 'ant-design-vue';
+import { Button } from 'antdv-next';
 
 import { useVbenVxeGrid } from '#/adapter/vxe-table';
 
diff --git a/playground/src/views/examples/vxe-table/viewed.vue b/playground/src/views/examples/vxe-table/viewed.vue
new file mode 100644
index 00000000..d2b48556
--- /dev/null
+++ b/playground/src/views/examples/vxe-table/viewed.vue
@@ -0,0 +1,209 @@
+<script lang="ts" setup>
+import type { OnActionClickParams, VxeGridProps } from '#/adapter/vxe-table';
+
+import { ref } from 'vue';
+
+import { Page, useVbenModal } from '@vben/common-ui';
+import { $t } from '@vben/locales';
+
+import { Button, message } from 'antdv-next';
+
+import { useVbenVxeGrid } from '#/adapter/vxe-table';
+import { getExampleTableApi } from '#/api';
+
+interface RowType {
+  category: string;
+  color: string;
+  id: string;
+  price: string;
+  productName: string;
+  releaseDate: string;
+}
+
+const gridOptions: VxeGridProps<RowType> = {
+  checkboxConfig: {
+    highlight: true,
+    labelField: 'category',
+  },
+  columns: [
+    { title: '序号', type: 'seq', width: 50 },
+    { field: 'category', sortable: true, title: 'Category' },
+    { field: 'color', sortable: true, title: 'Color' },
+    { field: 'productName', sortable: true, title: 'Product Name' },
+    { field: 'price', sortable: true, title: 'Price' },
+    { field: 'releaseDate', formatter: 'formatDateTime', title: 'DateTime' },
+    {
+      align: 'center',
+      cellRender: {
+        attrs: {
+          nameField: 'category',
+          onClick: onActionClick,
+        },
+        name: 'CellOperation',
+        options: [
+          {
+            code: 'view',
+            text: '查看',
+          },
+          'edit',
+        ],
+      },
+      field: 'operation',
+      fixed: 'right',
+      headerAlign: 'center',
+      showOverflow: false,
+      title: $t('system.menu.operation'),
+      width: 200,
+    },
+  ],
+  exportConfig: {},
+  height: 'auto',
+  keepSource: true,
+  proxyConfig: {
+    ajax: {
+      query: async ({ page, sort }) => {
+        return await getExampleTableApi({
+          page: page.currentPage,
+          pageSize: page.pageSize,
+          sortBy: sort.field,
+          sortOrder: sort.order,
+        });
+      },
+    },
+    sort: true,
+  },
+  sortConfig: {
+    defaultSort: { field: 'category', order: 'desc' },
+    remote: true,
+  },
+  toolbarConfig: {
+    custom: true,
+    export: true,
+    // import: true,
+    refresh: true,
+    zoom: true,
+  },
+};
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  gridOptions,
+  viewedRowOptions: {
+    // 触发已读的操作码
+    actionCodes: ['view'],
+    // 行数据中的唯一标识字段
+    keyField: 'id',
+    // 持久化配置（简写模式，使用内置 localStorage）
+    // persist: 'viewed_rows',
+    persist: {
+      key: 'viewed-rows',
+      type: 'indexedDB',
+      ttl: 7 * 24 * 60 * 60 * 1000, // 7天过期
+      maxSize: 200,
+    },
+  },
+});
+
+function onActionClick({ code, row }: OnActionClickParams<RowType>) {
+  switch (code) {
+    case 'edit': {
+      onEdit(row);
+      break;
+    }
+    case 'view': {
+      onView(row);
+      break;
+    }
+    default: {
+      break;
+    }
+  }
+}
+
+const editRow = ref<RowType>();
+const [Modal, modalApi] = useVbenModal({
+  draggable: true,
+  onConfirm: () => {
+    modalApi.setState({ loading: true });
+    editRow.value && gridApi.markRowAsViewed(editRow.value);
+    modalApi.setState({ loading: false });
+    modalApi.close();
+  },
+});
+
+function onEdit(row: RowType) {
+  editRow.value = row;
+  modalApi.open();
+}
+
+function onView(row: RowType) {
+  message.success({
+    content: `查看${row.category}`,
+    key: 'action_process_msg_id',
+  });
+}
+
+const isStyle = ref(false);
+
+function onStyleSet() {
+  isStyle.value = !isStyle.value;
+  gridApi.setState({
+    viewedRowOptions: {
+      rowStyle: () => {
+        return isStyle.value ? { backgroundColor: 'gray' } : '';
+      },
+    },
+  });
+}
+
+const isClassName = ref(false);
+
+function onClassNameSet() {
+  isClassName.value = !isClassName.value;
+  gridApi.setState({
+    viewedRowOptions: {
+      rowClassName: () => {
+        return isClassName.value
+          ? 'bg-red-100 vxe-row--viewed'
+          : 'vxe-row--viewed';
+      },
+    },
+  });
+}
+
+function onCustomSet() {
+  const tableData = gridApi.grid.getData();
+  const keys = tableData.slice(0, 2).map((row) => row.id);
+  gridApi.markKeysAsViewed(keys);
+}
+
+function onClearViewed() {
+  gridApi.clearViewedRows();
+}
+</script>
+
+<template>
+  <Page
+    auto-content-height
+    description="表格行标记支持存储类型 custom | indexedDB | localStorage | memory | sessionStorage 。
+    默认使用memory存储，当设置custom时需要自己实现getKeys()/setKeys()/removeKeys()。
+    具体属性查看packages/effects/plugins/src/vxe-table/types.ts。可通过gridApi调用
+    clearViewedRows()/getViewedKeys()/isRowViewed()/markKeysAsViewed()/markRowAsViewed()/removeViewedKeys()"
+    title="表格行标记示例"
+  >
+    <Modal class="w-150" title="数据修改"> 数据修改完成后设置行标记</Modal>
+    <Grid table-title="已查看行标记" table-title-help="提示">
+      <template #toolbar-tools>
+        <Button class="mr-2" type="primary" @click="onCustomSet">
+          手动标记
+        </Button>
+        <Button class="mr-2" type="primary" @click="onStyleSet">
+          设置Style
+        </Button>
+        <Button class="mr-2" type="primary" @click="onClassNameSet">
+          设置ClassName
+        </Button>
+        <Button type="primary" @click="onClearViewed"> 清空缓存</Button>
+      </template>
+    </Grid>
+  </Page>
+</template>
diff --git a/playground/src/views/system/dept/data.ts b/playground/src/views/system/dept/data.ts
new file mode 100644
index 00000000..b0699e7a
--- /dev/null
+++ b/playground/src/views/system/dept/data.ts
@@ -0,0 +1,135 @@
+import type { VxeTableGridColumns } from '@vben/plugins/vxe-table';
+
+import type { VbenFormSchema } from '#/adapter/form';
+import type { OnActionClickFn } from '#/adapter/vxe-table';
+import type { SystemDeptApi } from '#/api/system/dept';
+
+import { z } from '#/adapter/form';
+import { getDeptList } from '#/api/system/dept';
+import { $t } from '#/locales';
+
+/**
+ * 获取编辑表单的字段配置。如果没有使用多语言，可以直接export一个数组常量
+ */
+export function useSchema(): VbenFormSchema[] {
+  return [
+    {
+      component: 'Input',
+      fieldName: 'name',
+      label: $t('system.dept.deptName'),
+      rules: z
+        .string()
+        .min(2, $t('ui.formRules.minLength', [$t('system.dept.deptName'), 2]))
+        .max(
+          20,
+          $t('ui.formRules.maxLength', [$t('system.dept.deptName'), 20]),
+        ),
+    },
+    {
+      component: 'ApiTreeSelect',
+      componentProps: {
+        allowClear: true,
+        api: getDeptList,
+        class: 'w-full',
+        labelField: 'name',
+        valueField: 'id',
+        childrenField: 'children',
+      },
+      fieldName: 'pid',
+      label: $t('system.dept.parentDept'),
+    },
+    {
+      component: 'RadioGroup',
+      componentProps: {
+        buttonStyle: 'solid',
+        options: [
+          { label: $t('common.enabled'), value: 1 },
+          { label: $t('common.disabled'), value: 0 },
+        ],
+        optionType: 'button',
+      },
+      defaultValue: 1,
+      fieldName: 'status',
+      label: $t('system.dept.status'),
+    },
+    {
+      component: 'Textarea',
+      componentProps: {
+        maxLength: 50,
+        rows: 3,
+        showCount: true,
+      },
+      fieldName: 'remark',
+      label: $t('system.dept.remark'),
+      rules: z
+        .string()
+        .max(50, $t('ui.formRules.maxLength', [$t('system.dept.remark'), 50]))
+        .optional(),
+    },
+  ];
+}
+
+/**
+ * 获取表格列配置
+ * @description 使用函数的形式返回列数据而不是直接export一个Array常量，是为了响应语言切换时重新翻译表头
+ * @param onActionClick 表格操作按钮点击事件
+ */
+export function useColumns(
+  onActionClick?: OnActionClickFn<SystemDeptApi.SystemDept>,
+): VxeTableGridColumns<SystemDeptApi.SystemDept> {
+  return [
+    {
+      align: 'left',
+      field: 'name',
+      fixed: 'left',
+      title: $t('system.dept.deptName'),
+      treeNode: true,
+      width: 150,
+    },
+    {
+      cellRender: { name: 'CellTag' },
+      field: 'status',
+      title: $t('system.dept.status'),
+      width: 100,
+    },
+    {
+      field: 'createTime',
+      title: $t('system.dept.createTime'),
+      width: 180,
+    },
+    {
+      field: 'remark',
+      title: $t('system.dept.remark'),
+    },
+    {
+      align: 'right',
+      cellRender: {
+        attrs: {
+          nameField: 'name',
+          nameTitle: $t('system.dept.name'),
+          onClick: onActionClick,
+        },
+        name: 'CellOperation',
+        options: [
+          {
+            code: 'append',
+            text: '新增下级',
+          },
+          'edit', // 默认的编辑按钮
+          {
+            code: 'delete', // 默认的删除按钮
+            disabled: (row: SystemDeptApi.SystemDept) => {
+              return !!(row.children && row.children.length > 0);
+            },
+          },
+        ],
+      },
+      field: 'operation',
+      fixed: 'right',
+      headerAlign: 'center',
+      showOverflow: false,
+      title: $t('system.dept.operation'),
+      width: 200,
+    },
+  ];
+}
diff --git a/playground/src/views/system/dept/list.vue b/playground/src/views/system/dept/list.vue
new file mode 100644
index 00000000..f98099d5
--- /dev/null
+++ b/playground/src/views/system/dept/list.vue
@@ -0,0 +1,143 @@
+<script lang="ts" setup>
+import type {
+  OnActionClickParams,
+  VxeTableGridOptions,
+} from '#/adapter/vxe-table';
+import type { SystemDeptApi } from '#/api/system/dept';
+
+import { Page, useVbenModal } from '@vben/common-ui';
+import { Plus } from '@vben/icons';
+
+import { Button, message } from 'antdv-next';
+
+import { useVbenVxeGrid } from '#/adapter/vxe-table';
+import { deleteDept, getDeptList } from '#/api/system/dept';
+import { $t } from '#/locales';
+
+import { useColumns } from './data';
+import Form from './modules/form.vue';
+
+const [FormModal, formModalApi] = useVbenModal({
+  connectedComponent: Form,
+  destroyOnClose: true,
+});
+
+/**
+ * 编辑部门
+ * @param row
+ */
+function onEdit(row: SystemDeptApi.SystemDept) {
+  formModalApi.setData(row).open();
+}
+
+/**
+ * 添加下级部门
+ * @param row
+ */
+function onAppend(row: SystemDeptApi.SystemDept) {
+  formModalApi.setData({ pid: row.id }).open();
+}
+
+/**
+ * 创建新部门
+ */
+function onCreate() {
+  formModalApi.setData(null).open();
+}
+
+/**
+ * 删除部门
+ * @param row
+ */
+function onDelete(row: SystemDeptApi.SystemDept) {
+  const hideLoading = message.loading({
+    content: $t('ui.actionMessage.deleting', [row.name]),
+    duration: 0,
+    key: 'action_process_msg',
+  });
+  deleteDept(row.id)
+    .then(() => {
+      message.success({
+        content: $t('ui.actionMessage.deleteSuccess', [row.name]),
+        key: 'action_process_msg',
+      });
+      refreshGrid();
+    })
+    .catch(() => {
+      hideLoading();
+    });
+}
+
+/**
+ * 表格操作按钮的回调函数
+ */
+function onActionClick({
+  code,
+  row,
+}: OnActionClickParams<SystemDeptApi.SystemDept>) {
+  switch (code) {
+    case 'append': {
+      onAppend(row);
+      break;
+    }
+    case 'delete': {
+      onDelete(row);
+      break;
+    }
+    case 'edit': {
+      onEdit(row);
+      break;
+    }
+  }
+}
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  gridEvents: {},
+  gridOptions: {
+    columns: useColumns(onActionClick),
+    height: 'auto',
+    keepSource: true,
+    pagerConfig: {
+      enabled: false,
+    },
+    proxyConfig: {
+      ajax: {
+        query: async (_params) => {
+          return await getDeptList();
+        },
+      },
+    },
+    toolbarConfig: {
+      custom: true,
+      export: false,
+      refresh: true,
+      zoom: true,
+    },
+    treeConfig: {
+      parentField: 'pid',
+      rowField: 'id',
+      transform: false,
+    },
+  } as VxeTableGridOptions,
+});
+
+/**
+ * 刷新表格
+ */
+function refreshGrid() {
+  gridApi.query();
+}
+</script>
+<template>
+  <Page auto-content-height>
+    <FormModal @success="refreshGrid" />
+    <Grid table-title="部门列表">
+      <template #toolbar-tools>
+        <Button type="primary" @click="onCreate">
+          <Plus class="size-5" />
+          {{ $t('ui.actionTitle.create', [$t('system.dept.name')]) }}
+        </Button>
+      </template>
+    </Grid>
+  </Page>
+</template>
diff --git a/playground/src/views/system/dept/modules/form.vue b/playground/src/views/system/dept/modules/form.vue
new file mode 100644
index 00000000..040a2bc8
--- /dev/null
+++ b/playground/src/views/system/dept/modules/form.vue
@@ -0,0 +1,89 @@
+<script lang="ts" setup>
+import type { SystemDeptApi } from '#/api/system/dept';
+
+import { computed, ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+
+import { Button } from 'antdv-next';
+
+import { useVbenForm } from '#/adapter/form';
+import { createDept, updateDept } from '#/api/system/dept';
+import { $t } from '#/locales';
+
+import { useSchema } from '../data';
+
+const emit = defineEmits(['success']);
+const formData = ref<SystemDeptApi.SystemDept>();
+type DeptModalData =
+  | null
+  | SystemDeptApi.SystemDept
+  | { pid: SystemDeptApi.SystemDept['pid'] };
+
+const getTitle = computed(() => {
+  return formData.value?.id
+    ? $t('ui.actionTitle.edit', [$t('system.dept.name')])
+    : $t('ui.actionTitle.create', [$t('system.dept.name')]);
+});
+
+const [Form, formApi] = useVbenForm({
+  layout: 'vertical',
+  schema: useSchema(),
+  showDefaultActions: false,
+});
+
+function resetForm() {
+  formApi.reset();
+  formApi.setValues(formData.value || {});
+}
+
+const [Modal, modalApi] = useVbenModal<DeptModalData>({
+  async onConfirm() {
+    const { valid } = await formApi.validate();
+    if (valid) {
+      modalApi.lock();
+      const data = await formApi.getValues();
+      try {
+        await (formData.value?.id
+          ? updateDept(formData.value.id, data)
+          : createDept(data));
+        modalApi.close();
+        emit('success');
+      } finally {
+        modalApi.lock(false);
+      }
+    }
+  },
+  onOpenChange(isOpen) {
+    if (isOpen) {
+      const data = modalApi.getData();
+      if (data) {
+        formData.value = 'id' in data ? data : undefined;
+        const formValues = {
+          ...data,
+          ...(data.pid === 0 ? { pid: undefined } : {}),
+        };
+        formApi.setValues(formValues);
+      } else {
+        formData.value = undefined;
+        formApi.reset();
+      }
+    }
+  },
+});
+
+defineExpose({ modalApi });
+</script>
+
+<template>
+  <Modal :title="getTitle">
+    <Form class="mx-4" />
+    <template #prepend-footer>
+      <div class="flex-auto">
+        <Button type="primary" danger @click="resetForm">
+          {{ $t('common.reset') }}
+        </Button>
+      </div>
+    </template>
+  </Modal>
+</template>
diff --git a/playground/src/views/system/menu/data.ts b/playground/src/views/system/menu/data.ts
new file mode 100644
index 00000000..11aa2bd3
--- /dev/null
+++ b/playground/src/views/system/menu/data.ts
@@ -0,0 +1,109 @@
+import type { OnActionClickFn, VxeTableGridColumns } from '#/adapter/vxe-table';
+import type { SystemMenuApi } from '#/api/system/menu';
+
+import { $t } from '#/locales';
+
+export function getMenuTypeOptions() {
+  return [
+    {
+      color: 'processing',
+      label: $t('system.menu.typeCatalog'),
+      value: 'catalog',
+    },
+    { color: 'default', label: $t('system.menu.typeMenu'), value: 'menu' },
+    { color: 'error', label: $t('system.menu.typeButton'), value: 'button' },
+    {
+      color: 'success',
+      label: $t('system.menu.typeEmbedded'),
+      value: 'embedded',
+    },
+    { color: 'warning', label: $t('system.menu.typeLink'), value: 'link' },
+  ];
+}
+
+export function useColumns(
+  onActionClick: OnActionClickFn<SystemMenuApi.SystemMenu>,
+): VxeTableGridColumns<SystemMenuApi.SystemMenu> {
+  return [
+    {
+      align: 'left',
+      field: 'meta.title',
+      fixed: 'left',
+      slots: { default: 'title' },
+      title: $t('system.menu.menuTitle'),
+      treeNode: true,
+      width: 250,
+    },
+    {
+      align: 'center',
+      cellRender: { name: 'CellTag', options: getMenuTypeOptions() },
+      field: 'type',
+      title: $t('system.menu.type'),
+      width: 100,
+    },
+    {
+      field: 'authCode',
+      title: $t('system.menu.authCode'),
+      width: 200,
+    },
+    {
+      align: 'left',
+      field: 'path',
+      title: $t('system.menu.path'),
+      width: 200,
+    },
+
+    {
+      align: 'left',
+      field: 'component',
+      formatter: ({ row }) => {
+        switch (row.type) {
+          case 'catalog':
+          case 'menu': {
+            return row.component ?? '';
+          }
+          case 'embedded': {
+            return row.meta?.iframeSrc ?? '';
+          }
+          case 'link': {
+            return row.meta?.link ?? '';
+          }
+        }
+        return '';
+      },
+      minWidth: 200,
+      title: $t('system.menu.component'),
+    },
+    {
+      cellRender: { name: 'CellTag' },
+      field: 'status',
+      title: $t('system.menu.status'),
+      width: 100,
+    },
+
+    {
+      align: 'right',
+      cellRender: {
+        attrs: {
+          nameField: 'name',
+          onClick: onActionClick,
+        },
+        name: 'CellOperation',
+        options: [
+          {
+            code: 'append',
+            text: '新增下级',
+          },
+          'edit', // 默认的编辑按钮
+          'delete', // 默认的删除按钮
+        ],
+      },
+      field: 'operation',
+      fixed: 'right',
+      headerAlign: 'center',
+      showOverflow: false,
+      title: $t('system.menu.operation'),
+      width: 200,
+    },
+  ];
+}
diff --git a/playground/src/views/system/menu/list.vue b/playground/src/views/system/menu/list.vue
new file mode 100644
index 00000000..e4c7fb24
--- /dev/null
+++ b/playground/src/views/system/menu/list.vue
@@ -0,0 +1,162 @@
+<script lang="ts" setup>
+import type {
+  OnActionClickParams,
+  VxeTableGridOptions,
+} from '#/adapter/vxe-table';
+
+import { Page, useVbenDrawer } from '@vben/common-ui';
+import { IconifyIcon, Plus } from '@vben/icons';
+import { $t } from '@vben/locales';
+
+import { MenuBadge } from '@vben-core/menu-ui';
+
+import { Button, message } from 'antdv-next';
+
+import { useVbenVxeGrid } from '#/adapter/vxe-table';
+import { deleteMenu, getMenuList, SystemMenuApi } from '#/api/system/menu';
+
+import { useColumns } from './data';
+import Form from './modules/form.vue';
+
+const [FormDrawer, formDrawerApi] = useVbenDrawer({
+  connectedComponent: Form,
+  destroyOnClose: true,
+});
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  gridOptions: {
+    columns: useColumns(onActionClick),
+    height: 'auto',
+    keepSource: true,
+    pagerConfig: {
+      enabled: false,
+    },
+    proxyConfig: {
+      ajax: {
+        query: async (_params) => {
+          return await getMenuList();
+        },
+      },
+    },
+    rowConfig: {
+      keyField: 'id',
+    },
+    toolbarConfig: {
+      custom: true,
+      export: false,
+      refresh: true,
+      zoom: true,
+    },
+    treeConfig: {
+      parentField: 'pid',
+      rowField: 'id',
+      transform: false,
+    },
+  } as VxeTableGridOptions,
+});
+
+function onActionClick({
+  code,
+  row,
+}: OnActionClickParams<SystemMenuApi.SystemMenu>) {
+  switch (code) {
+    case 'append': {
+      onAppend(row);
+      break;
+    }
+    case 'delete': {
+      onDelete(row);
+      break;
+    }
+    case 'edit': {
+      onEdit(row);
+      break;
+    }
+    default: {
+      break;
+    }
+  }
+}
+
+function onRefresh() {
+  gridApi.query();
+}
+function onEdit(row: SystemMenuApi.SystemMenu) {
+  formDrawerApi.setData(row).open();
+}
+function onCreate() {
+  formDrawerApi.setData({}).open();
+}
+function onAppend(row: SystemMenuApi.SystemMenu) {
+  formDrawerApi.setData({ pid: row.id }).open();
+}
+
+function onDelete(row: SystemMenuApi.SystemMenu) {
+  const hideLoading = message.loading({
+    content: $t('ui.actionMessage.deleting', [row.name]),
+    duration: 0,
+    key: 'action_process_msg',
+  });
+  deleteMenu(row.id)
+    .then(() => {
+      message.success({
+        content: $t('ui.actionMessage.deleteSuccess', [row.name]),
+        key: 'action_process_msg',
+      });
+      onRefresh();
+    })
+    .catch(() => {
+      hideLoading();
+    });
+}
+</script>
+<template>
+  <Page auto-content-height>
+    <FormDrawer @success="onRefresh" />
+    <Grid>
+      <template #toolbar-tools>
+        <Button type="primary" @click="onCreate">
+          <Plus class="size-5" />
+          {{ $t('ui.actionTitle.create', [$t('system.menu.name')]) }}
+        </Button>
+      </template>
+      <template #title="{ row }">
+        <div class="flex w-full items-center gap-1">
+          <div class="size-5 shrink-0">
+            <IconifyIcon
+              v-if="row.type === 'button'"
+              icon="carbon:security"
+              class="size-full"
+            />
+            <IconifyIcon
+              v-else-if="row.meta?.icon"
+              :icon="row.meta?.icon || 'carbon:circle-dash'"
+              class="size-full"
+            />
+          </div>
+          <span class="flex-auto">{{ $t(row.meta?.title) }}</span>
+          <div class="items-center justify-end"></div>
+        </div>
+        <MenuBadge
+          v-if="row.meta?.badgeType"
+          class="menu-badge"
+          :badge="row.meta.badge"
+          :badge-type="row.meta.badgeType"
+          :badge-variants="row.meta.badgeVariants"
+        />
+      </template>
+    </Grid>
+  </Page>
+</template>
+<style lang="scss" scoped>
+.menu-badge {
+  top: 50%;
+  right: 0;
+  transform: translateY(-50%);
+
+  & > :deep(div) {
+    padding-top: 0;
+    padding-bottom: 0;
+  }
+}
+</style>
diff --git a/playground/src/views/system/menu/modules/form.vue b/playground/src/views/system/menu/modules/form.vue
new file mode 100644
index 00000000..34ae38dc
--- /dev/null
+++ b/playground/src/views/system/menu/modules/form.vue
@@ -0,0 +1,534 @@
+<script lang="ts" setup>
+import type { Recordable } from '@vben/types';
+
+import type { VbenFormSchema } from '#/adapter/form';
+
+import { computed, h, ref } from 'vue';
+
+import { useVbenDrawer } from '@vben/common-ui';
+import { IconifyIcon } from '@vben/icons';
+import { $te } from '@vben/locales';
+import { getPopupContainer } from '@vben/utils';
+
+import { breakpointsTailwind, useBreakpoints } from '@vueuse/core';
+
+import { useVbenForm, z } from '#/adapter/form';
+import {
+  createMenu,
+  getMenuList,
+  isMenuNameExists,
+  isMenuPathExists,
+  SystemMenuApi,
+  updateMenu,
+} from '#/api/system/menu';
+import { $t } from '#/locales';
+import { componentKeys } from '#/router/routes';
+
+import { getMenuTypeOptions } from '../data';
+
+const emit = defineEmits<{
+  success: [];
+}>();
+const formData = ref<SystemMenuApi.SystemMenu>();
+const titleSuffix = ref<string>();
+
+type MenuDrawerData =
+  | SystemMenuApi.SystemMenu
+  | { pid?: SystemMenuApi.SystemMenu['pid'] };
+type MenuSubmitValues = Omit<SystemMenuApi.SystemMenu, 'children' | 'id'>;
+type MenuFormValues = MenuSubmitValues & { linkSrc?: string };
+
+function encodeMenuFormValues(
+  values: Readonly<MenuFormValues>,
+): MenuSubmitValues {
+  const { linkSrc, ...formValues } = values;
+  if (values.type === 'link') {
+    const meta = { ...values.meta, link: linkSrc };
+    Reflect.deleteProperty(meta, 'iframeSrc');
+    return {
+      ...formValues,
+      meta,
+    };
+  }
+  if (values.type === 'embedded') {
+    const meta = { ...values.meta, iframeSrc: linkSrc };
+    Reflect.deleteProperty(meta, 'link');
+    return {
+      ...formValues,
+      meta,
+    };
+  }
+  return formValues;
+}
+
+function decodeMenuFormValues(
+  values: Readonly<MenuSubmitValues>,
+): MenuFormValues {
+  let linkSrc: string | undefined;
+  if (values.type === 'link') {
+    linkSrc = values.meta?.link;
+  } else if (values.type === 'embedded') {
+    linkSrc = values.meta?.iframeSrc;
+  }
+  return { ...values, linkSrc };
+}
+
+const schema: VbenFormSchema<MenuFormValues>[] = [
+  {
+    component: 'RadioGroup',
+    componentProps: {
+      buttonStyle: 'solid',
+      options: getMenuTypeOptions(),
+      optionType: 'button',
+    },
+    defaultValue: 'menu',
+    fieldName: 'type',
+    formItemClass: 'col-span-2 md:col-span-2',
+    label: $t('system.menu.type'),
+  },
+  {
+    component: 'Input',
+    fieldName: 'name',
+    label: $t('system.menu.menuName'),
+    rules: z
+      .string()
+      .min(2, $t('ui.formRules.minLength', [$t('system.menu.menuName'), 2]))
+      .max(30, $t('ui.formRules.maxLength', [$t('system.menu.menuName'), 30]))
+      .refine(
+        async (value: string) => {
+          return !(await isMenuNameExists(value, formData.value?.id));
+        },
+        {
+          error: (issue) =>
+            $t('ui.formRules.alreadyExists', [
+              $t('system.menu.menuName'),
+              issue.input,
+            ]),
+        },
+      ),
+  },
+  {
+    component: 'ApiTreeSelect',
+    componentProps: {
+      api: getMenuList,
+      class: 'w-full',
+      filterTreeNode(input: string, node: Recordable<any>) {
+        if (!input || input.length === 0) {
+          return true;
+        }
+        const title: string = node.meta?.title ?? '';
+        if (!title) return false;
+        return title.includes(input) || $t(title).includes(input);
+      },
+      getPopupContainer,
+      labelField: 'meta.title',
+      showSearch: true,
+      treeDefaultExpandAll: true,
+      valueField: 'id',
+      childrenField: 'children',
+    },
+    fieldName: 'pid',
+    label: $t('system.menu.parent'),
+    renderComponentContent() {
+      return {
+        treeTitleRender({
+          label,
+          meta,
+        }: {
+          label: string;
+          meta: Recordable<any>;
+        }) {
+          const coms = [];
+          if (!label) return '';
+          if (meta?.icon) {
+            coms.push(h(IconifyIcon, { class: 'size-4', icon: meta.icon }));
+          }
+          coms.push(h('span', { class: '' }, $t(label || '')));
+          return h('div', { class: 'flex items-center gap-1' }, coms);
+        },
+      };
+    },
+  },
+  {
+    component: 'Input',
+    componentProps() {
+      // 不需要处理多语言时就无需这么做
+      return {
+        ...(titleSuffix.value && { addonAfter: titleSuffix.value }),
+        onChange({ target: { value } }: { target: { value: string } }) {
+          titleSuffix.value = value && $te(value) ? $t(value) : undefined;
+        },
+      };
+    },
+    fieldName: 'meta.title',
+    label: $t('system.menu.menuTitle'),
+    rules: 'required',
+  },
+  {
+    component: 'Input',
+    dependencies: {
+      show: (values) => {
+        return ['catalog', 'embedded', 'menu'].includes(values.type);
+      },
+      triggerFields: ['type'],
+    },
+    fieldName: 'path',
+    label: $t('system.menu.path'),
+    rules: z
+      .string()
+      .min(2, $t('ui.formRules.minLength', [$t('system.menu.path'), 2]))
+      .max(100, $t('ui.formRules.maxLength', [$t('system.menu.path'), 100]))
+      .refine(
+        async (value: string) => {
+          return !(await isMenuPathExists(value, formData.value?.id));
+        },
+        {
+          error: (issue) =>
+            $t('ui.formRules.alreadyExists', [
+              $t('system.menu.path'),
+              issue.input,
+            ]),
+        },
+      ),
+  },
+  {
+    component: 'Input',
+    dependencies: {
+      show: (values) => {
+        return ['embedded', 'menu'].includes(values.type);
+      },
+      triggerFields: ['type'],
+    },
+    fieldName: 'activePath',
+    help: $t('system.menu.activePathHelp'),
+    label: $t('system.menu.activePath'),
+    rules: z
+      .string()
+      .min(2, $t('ui.formRules.minLength', [$t('system.menu.path'), 2]))
+      .max(100, $t('ui.formRules.maxLength', [$t('system.menu.path'), 100]))
+      .refine(async (value: string) => {
+        return await isMenuPathExists(value, formData.value?.id);
+      }, $t('system.menu.activePathMustExist'))
+      .optional(),
+  },
+  {
+    component: 'IconPicker',
+    componentProps: {
+      prefix: 'carbon',
+    },
+    dependencies: {
+      show: (values) => {
+        return ['catalog', 'embedded', 'link', 'menu'].includes(values.type);
+      },
+      triggerFields: ['type'],
+    },
+    fieldName: 'meta.icon',
+    label: $t('system.menu.icon'),
+  },
+  {
+    component: 'IconPicker',
+    componentProps: {
+      prefix: 'carbon',
+    },
+    dependencies: {
+      show: (values) => {
+        return ['catalog', 'embedded', 'menu'].includes(values.type);
+      },
+      triggerFields: ['type'],
+    },
+    fieldName: 'meta.activeIcon',
+    label: $t('system.menu.activeIcon'),
+  },
+  {
+    component: 'AutoComplete',
+    componentProps: {
+      allowClear: true,
+      class: 'w-full',
+      filterOption(input: string, option: { value: string }) {
+        return option.value.toLowerCase().includes(input.toLowerCase());
+      },
+      options: componentKeys.map((v) => ({ value: v })),
+    },
+    dependencies: {
+      rules: (values) => {
+        return values.type === 'menu' ? 'required' : null;
+      },
+      show: (values) => {
+        return values.type === 'menu';
+      },
+      triggerFields: ['type'],
+    },
+    fieldName: 'component',
+    label: $t('system.menu.component'),
+  },
+  {
+    component: 'Input',
+    dependencies: {
+      show: (values) => {
+        return ['embedded', 'link'].includes(values.type);
+      },
+      triggerFields: ['type'],
+    },
+    fieldName: 'linkSrc',
+    label: $t('system.menu.linkSrc'),
+    rules: z.url($t('ui.formRules.invalidURL')),
+  },
+  {
+    component: 'Input',
+    dependencies: {
+      rules: (values) => {
+        return values.type === 'button' ? 'required' : null;
+      },
+      show: (values) => {
+        return ['button', 'catalog', 'embedded', 'menu'].includes(values.type);
+      },
+      triggerFields: ['type'],
+    },
+    fieldName: 'authCode',
+    label: $t('system.menu.authCode'),
+  },
+  {
+    component: 'RadioGroup',
+    componentProps: {
+      buttonStyle: 'solid',
+      options: [
+        { label: $t('common.enabled'), value: 1 },
+        { label: $t('common.disabled'), value: 0 },
+      ],
+      optionType: 'button',
+    },
+    defaultValue: 1,
+    fieldName: 'status',
+    label: $t('system.menu.status'),
+  },
+  {
+    component: 'Select',
+    componentProps: {
+      allowClear: true,
+      class: 'w-full',
+      options: [
+        { label: $t('system.menu.badgeType.dot'), value: 'dot' },
+        { label: $t('system.menu.badgeType.normal'), value: 'normal' },
+      ],
+    },
+    dependencies: {
+      show: (values) => {
+        return values.type !== 'button';
+      },
+      triggerFields: ['type'],
+    },
+    fieldName: 'meta.badgeType',
+    label: $t('system.menu.badgeType.title'),
+  },
+  {
+    component: 'Input',
+    dependencies: {
+      resolve: ({ values }) => {
+        return {
+          componentProps: {
+            allowClear: true,
+            class: 'w-full',
+            disabled: values.meta?.badgeType !== 'normal',
+          },
+          show: values.type !== 'button',
+        };
+      },
+      triggerFields: ['meta.badgeType', 'type'],
+    },
+    fieldName: 'meta.badge',
+    label: $t('system.menu.badge'),
+  },
+  {
+    component: 'Select',
+    componentProps: {
+      allowClear: true,
+      class: 'w-full',
+      options: SystemMenuApi.BadgeVariants.map((v) => ({
+        label: v,
+        value: v,
+      })),
+    },
+    dependencies: {
+      show: (values) => {
+        return values.type !== 'button';
+      },
+      triggerFields: ['type'],
+    },
+    fieldName: 'meta.badgeVariants',
+    label: $t('system.menu.badgeVariants'),
+  },
+  {
+    component: 'Divider',
+    dependencies: {
+      show: (values) => {
+        return !['button', 'link'].includes(values.type);
+      },
+      triggerFields: ['type'],
+    },
+    fieldName: 'divider1',
+    formItemClass: 'col-span-2 md:col-span-2 pb-0',
+    hideLabel: true,
+    renderComponentContent() {
+      return {
+        default: () => $t('system.menu.advancedSettings'),
+      };
+    },
+  },
+  {
+    component: 'Checkbox',
+    dependencies: {
+      show: (values) => {
+        return ['menu'].includes(values.type);
+      },
+      triggerFields: ['type'],
+    },
+    fieldName: 'meta.keepAlive',
+    renderComponentContent() {
+      return {
+        default: () => $t('system.menu.keepAlive'),
+      };
+    },
+  },
+  {
+    component: 'Checkbox',
+    dependencies: {
+      show: (values) => {
+        return ['embedded', 'menu'].includes(values.type);
+      },
+      triggerFields: ['type'],
+    },
+    fieldName: 'meta.affixTab',
+    renderComponentContent() {
+      return {
+        default: () => $t('system.menu.affixTab'),
+      };
+    },
+  },
+  {
+    component: 'Checkbox',
+    dependencies: {
+      show: (values) => {
+        return !['button'].includes(values.type);
+      },
+      triggerFields: ['type'],
+    },
+    fieldName: 'meta.hideInMenu',
+    renderComponentContent() {
+      return {
+        default: () => $t('system.menu.hideInMenu'),
+      };
+    },
+  },
+  {
+    component: 'Checkbox',
+    dependencies: {
+      show: (values) => {
+        return ['catalog', 'menu'].includes(values.type);
+      },
+      triggerFields: ['type'],
+    },
+    fieldName: 'meta.hideChildrenInMenu',
+    renderComponentContent() {
+      return {
+        default: () => $t('system.menu.hideChildrenInMenu'),
+      };
+    },
+  },
+  {
+    component: 'Checkbox',
+    dependencies: {
+      show: (values) => {
+        return !['button', 'link'].includes(values.type);
+      },
+      triggerFields: ['type'],
+    },
+    fieldName: 'meta.hideInBreadcrumb',
+    renderComponentContent() {
+      return {
+        default: () => $t('system.menu.hideInBreadcrumb'),
+      };
+    },
+  },
+  {
+    component: 'Checkbox',
+    dependencies: {
+      show: (values) => {
+        return !['button', 'link'].includes(values.type);
+      },
+      triggerFields: ['type'],
+    },
+    fieldName: 'meta.hideInTab',
+    renderComponentContent() {
+      return {
+        default: () => $t('system.menu.hideInTab'),
+      };
+    },
+  },
+];
+
+const breakpoints = useBreakpoints(breakpointsTailwind);
+const isHorizontal = computed(() => breakpoints.greaterOrEqual('md').value);
+
+const [Form, formApi] = useVbenForm({
+  codec: {
+    decode: decodeMenuFormValues,
+    encode: encodeMenuFormValues,
+  },
+  commonConfig: {
+    colon: true,
+    formItemClass: 'col-span-2 md:col-span-1',
+  },
+  schema,
+  showDefaultActions: false,
+  wrapperClass: 'grid-cols-2 gap-x-4',
+});
+const [Drawer, drawerApi] = useVbenDrawer<MenuDrawerData>({
+  onConfirm: onSubmit,
+  async onOpenChange(isOpen) {
+    if (isOpen) {
+      const data = drawerApi.getData();
+      if (data && 'id' in data) {
+        formData.value = data;
+        await formApi.setSubmitValues(data);
+        titleSuffix.value = formData.value.meta?.title
+          ? $t(formData.value.meta.title)
+          : '';
+      } else {
+        formData.value = undefined;
+        formApi.reset();
+        await formApi.setValues(data ?? {});
+        titleSuffix.value = '';
+      }
+    }
+  },
+});
+
+defineExpose({ drawerApi });
+
+async function onSubmit() {
+  const { valid } = await formApi.validate();
+  if (valid) {
+    drawerApi.lock();
+    const data = await formApi.getValues();
+    try {
+      await (formData.value?.id
+        ? updateMenu(formData.value.id, data)
+        : createMenu(data));
+      drawerApi.close();
+      emit('success');
+    } finally {
+      drawerApi.unlock();
+    }
+  }
+}
+const getDrawerTitle = computed(() =>
+  formData.value?.id
+    ? $t('ui.actionTitle.edit', [$t('system.menu.name')])
+    : $t('ui.actionTitle.create', [$t('system.menu.name')]),
+);
+</script>
+<template>
+  <Drawer class="w-full max-w-200" :title="getDrawerTitle">
+    <Form class="mx-4" :layout="isHorizontal ? 'horizontal' : 'vertical'" />
+  </Drawer>
+</template>
diff --git a/playground/src/views/system/role/data.ts b/playground/src/views/system/role/data.ts
new file mode 100644
index 00000000..9c9d0fba
--- /dev/null
+++ b/playground/src/views/system/role/data.ts
@@ -0,0 +1,127 @@
+import type { VbenFormSchema } from '#/adapter/form';
+import type { OnActionClickFn, VxeTableGridColumns } from '#/adapter/vxe-table';
+import type { SystemRoleApi } from '#/api';
+
+import { $t } from '#/locales';
+
+export function useFormSchema(): VbenFormSchema[] {
+  return [
+    {
+      component: 'Input',
+      fieldName: 'name',
+      label: $t('system.role.roleName'),
+      rules: 'required',
+    },
+    {
+      component: 'RadioGroup',
+      componentProps: {
+        buttonStyle: 'solid',
+        options: [
+          { label: $t('common.enabled'), value: 1 },
+          { label: $t('common.disabled'), value: 0 },
+        ],
+        optionType: 'button',
+      },
+      defaultValue: 1,
+      fieldName: 'status',
+      label: $t('system.role.status'),
+    },
+    {
+      component: 'Textarea',
+      fieldName: 'remark',
+      label: $t('system.role.remark'),
+    },
+    {
+      component: 'Input',
+      fieldName: 'permissions',
+      formItemClass: 'items-start',
+      label: $t('system.role.setPermissions'),
+      modelPropName: 'modelValue',
+    },
+  ];
+}
+
+export function useGridFormSchema(): VbenFormSchema[] {
+  return [
+    {
+      component: 'Input',
+      fieldName: 'name',
+      label: $t('system.role.roleName'),
+    },
+    { component: 'Input', fieldName: 'id', label: $t('system.role.id') },
+    {
+      component: 'Select',
+      componentProps: {
+        allowClear: true,
+        options: [
+          { label: $t('common.enabled'), value: 1 },
+          { label: $t('common.disabled'), value: 0 },
+        ],
+      },
+      fieldName: 'status',
+      label: $t('system.role.status'),
+    },
+    {
+      component: 'Input',
+      fieldName: 'remark',
+      label: $t('system.role.remark'),
+    },
+    {
+      component: 'RangePicker',
+      fieldName: 'createTime',
+      label: $t('system.role.createTime'),
+    },
+  ];
+}
+
+export function useColumns<T = SystemRoleApi.SystemRole>(
+  onActionClick: OnActionClickFn<T>,
+  onStatusChange?: (newStatus: any, row: T) => PromiseLike<boolean | undefined>,
+): VxeTableGridColumns {
+  return [
+    {
+      field: 'name',
+      title: $t('system.role.roleName'),
+      width: 200,
+    },
+    {
+      field: 'id',
+      title: $t('system.role.id'),
+      width: 200,
+    },
+    {
+      cellRender: {
+        attrs: { beforeChange: onStatusChange },
+        name: onStatusChange ? 'CellSwitch' : 'CellTag',
+      },
+      field: 'status',
+      title: $t('system.role.status'),
+      width: 100,
+    },
+    {
+      field: 'remark',
+      minWidth: 100,
+      title: $t('system.role.remark'),
+    },
+    {
+      field: 'createTime',
+      title: $t('system.role.createTime'),
+      width: 200,
+    },
+    {
+      align: 'center',
+      cellRender: {
+        attrs: {
+          nameField: 'name',
+          nameTitle: $t('system.role.name'),
+          onClick: onActionClick,
+        },
+        name: 'CellOperation',
+      },
+      field: 'operation',
+      fixed: 'right',
+      title: $t('system.role.operation'),
+      width: 130,
+    },
+  ];
+}
diff --git a/playground/src/views/system/role/list.vue b/playground/src/views/system/role/list.vue
new file mode 100644
index 00000000..91f23ddc
--- /dev/null
+++ b/playground/src/views/system/role/list.vue
@@ -0,0 +1,179 @@
+<script lang="ts" setup>
+import type { Dayjs } from 'dayjs';
+
+import type { Recordable } from '@vben/types';
+
+import type {
+  OnActionClickParams,
+  VxeTableGridOptions,
+} from '#/adapter/vxe-table';
+import type { SystemRoleApi } from '#/api';
+
+import { Page, useVbenDrawer } from '@vben/common-ui';
+import { Plus } from '@vben/icons';
+
+import { Button, message, Modal } from 'antdv-next';
+
+import { useVbenVxeGrid } from '#/adapter/vxe-table';
+import { deleteRole, getRoleList, updateRole } from '#/api';
+import { $t } from '#/locales';
+import { createDateRangeCodec } from '#/utils/date-range-codec';
+
+import { useColumns, useGridFormSchema } from './data';
+import Form from './modules/form.vue';
+
+interface RoleSearchFormValues extends Record<string, unknown> {
+  createTime?: [Dayjs, Dayjs];
+}
+
+const roleSearchCodec = createDateRangeCodec<RoleSearchFormValues>()({
+  endField: 'endTime',
+  rangeField: 'createTime',
+  startField: 'startTime',
+});
+
+type RoleSearchSubmitValues = ReturnType<typeof roleSearchCodec.encode>;
+
+const [FormDrawer, formDrawerApi] = useVbenDrawer({
+  connectedComponent: Form,
+  destroyOnClose: true,
+});
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  formOptions: {
+    codec: roleSearchCodec,
+    schema: useGridFormSchema(),
+    submitOnChange: true,
+  },
+  gridOptions: {
+    columns: useColumns(onActionClick, onStatusChange),
+    height: 'auto',
+    keepSource: true,
+    proxyConfig: {
+      ajax: {
+        query: async ({ page }, formValues: RoleSearchSubmitValues) => {
+          return await getRoleList({
+            page: page.currentPage,
+            pageSize: page.pageSize,
+            ...formValues,
+          });
+        },
+      },
+    },
+    rowConfig: {
+      keyField: 'id',
+    },
+
+    toolbarConfig: {
+      custom: true,
+      export: false,
+      refresh: true,
+      search: true,
+      zoom: true,
+    },
+  } as VxeTableGridOptions<SystemRoleApi.SystemRole>,
+});
+
+function onActionClick(e: OnActionClickParams<SystemRoleApi.SystemRole>) {
+  switch (e.code) {
+    case 'delete': {
+      onDelete(e.row);
+      break;
+    }
+    case 'edit': {
+      onEdit(e.row);
+      break;
+    }
+  }
+}
+
+/**
+ * 将Antd的Modal.confirm封装为promise，方便在异步函数中调用。
+ * @param content 提示内容
+ * @param title 提示标题
+ */
+function confirm(content: string, title: string) {
+  return new Promise((reslove, reject) => {
+    Modal.confirm({
+      content,
+      onCancel() {
+        reject(new Error('已取消'));
+      },
+      onOk() {
+        reslove(true);
+      },
+      title,
+    });
+  });
+}
+
+/**
+ * 状态开关即将改变
+ * @param newStatus 期望改变的状态值
+ * @param row 行数据
+ * @returns 返回false则中止改变，返回其他值（undefined、true）则允许改变
+ */
+async function onStatusChange(
+  newStatus: number,
+  row: SystemRoleApi.SystemRole,
+) {
+  const status: Recordable<string> = {
+    0: '禁用',
+    1: '启用',
+  };
+  try {
+    await confirm(
+      `你要将${row.name}的状态切换为 【${status[newStatus.toString()]}】 吗？`,
+      `切换状态`,
+    );
+    await updateRole(row.id, { status: newStatus });
+    return true;
+  } catch {
+    return false;
+  }
+}
+
+function onEdit(row: SystemRoleApi.SystemRole) {
+  formDrawerApi.setData(row).open();
+}
+
+function onDelete(row: SystemRoleApi.SystemRole) {
+  const hideLoading = message.loading({
+    content: $t('ui.actionMessage.deleting', [row.name]),
+    duration: 0,
+    key: 'action_process_msg',
+  });
+  deleteRole(row.id)
+    .then(() => {
+      message.success({
+        content: $t('ui.actionMessage.deleteSuccess', [row.name]),
+        key: 'action_process_msg',
+      });
+      onRefresh();
+    })
+    .catch(() => {
+      hideLoading();
+    });
+}
+
+function onRefresh() {
+  gridApi.query();
+}
+
+function onCreate() {
+  formDrawerApi.setData(null).open();
+}
+</script>
+<template>
+  <Page auto-content-height>
+    <FormDrawer @success="onRefresh" />
+    <Grid :table-title="$t('system.role.list')">
+      <template #toolbar-tools>
+        <Button type="primary" @click="onCreate">
+          <Plus class="size-5" />
+          {{ $t('ui.actionTitle.create', [$t('system.role.name')]) }}
+        </Button>
+      </template>
+    </Grid>
+  </Page>
+</template>
diff --git a/playground/src/views/system/role/modules/form.vue b/playground/src/views/system/role/modules/form.vue
new file mode 100644
index 00000000..79879072
--- /dev/null
+++ b/playground/src/views/system/role/modules/form.vue
@@ -0,0 +1,141 @@
+<script lang="ts" setup>
+import type { DataNode } from 'antdv-next/dist/tree';
+
+import type { Recordable } from '@vben/types';
+
+import type { SystemRoleApi } from '#/api/system/role';
+
+import { computed, nextTick, ref } from 'vue';
+
+import { Tree, useVbenDrawer } from '@vben/common-ui';
+import { IconifyIcon } from '@vben/icons';
+
+import { Spin } from 'antdv-next';
+
+import { useVbenForm } from '#/adapter/form';
+import { getMenuList } from '#/api/system/menu';
+import { createRole, updateRole } from '#/api/system/role';
+import { $t } from '#/locales';
+
+import { useFormSchema } from '../data';
+
+const emits = defineEmits(['success']);
+
+const formData = ref<SystemRoleApi.SystemRole>();
+
+const [Form, formApi] = useVbenForm({
+  schema: useFormSchema(),
+  showDefaultActions: false,
+});
+
+const permissions = ref<DataNode[]>([]);
+const loadingPermissions = ref(false);
+
+const id = ref();
+const [Drawer, drawerApi] = useVbenDrawer<null | SystemRoleApi.SystemRole>({
+  async onConfirm() {
+    const { valid } = await formApi.validate();
+    if (!valid) return;
+    const values = await formApi.getValues();
+    drawerApi.lock();
+    (id.value ? updateRole(id.value, values) : createRole(values))
+      .then(() => {
+        emits('success');
+        drawerApi.close();
+      })
+      .catch(() => {
+        drawerApi.unlock();
+      });
+  },
+
+  async onOpenChange(isOpen) {
+    if (isOpen) {
+      const data = drawerApi.getData();
+      formApi.reset();
+
+      if (data) {
+        formData.value = data;
+        id.value = data.id;
+      } else {
+        formData.value = undefined;
+        id.value = undefined;
+      }
+
+      if (permissions.value.length === 0) {
+        await loadPermissions();
+      }
+      // Wait for Vue to flush DOM updates (form fields mounted)
+      await nextTick();
+      if (data) {
+        formApi.setValues(data);
+      }
+    }
+  },
+});
+
+defineExpose({ drawerApi });
+
+async function loadPermissions() {
+  loadingPermissions.value = true;
+  try {
+    const res = await getMenuList();
+    permissions.value = res as unknown as DataNode[];
+  } finally {
+    loadingPermissions.value = false;
+  }
+}
+
+const getDrawerTitle = computed(() => {
+  return formData.value?.id
+    ? $t('common.edit', $t('system.role.name'))
+    : $t('common.create', $t('system.role.name'));
+});
+
+function getNodeClass(node: Recordable<any>) {
+  const classes: string[] = [];
+  if (node.value?.type === 'button') {
+    classes.push('inline-flex');
+  }
+
+  return classes.join(' ');
+}
+</script>
+<template>
+  <Drawer :title="getDrawerTitle">
+    <Form>
+      <template #permissions="slotProps">
+        <Spin :spinning="loadingPermissions" :classes="{ root: 'w-full' }">
+          <Tree
+            :tree-data="permissions"
+            multiple
+            bordered
+            :default-expanded-level="2"
+            :get-node-class="getNodeClass"
+            v-bind="slotProps.componentProps"
+            value-field="id"
+            label-field="meta.title"
+            icon-field="meta.icon"
+          >
+            <template #node="{ value }">
+              <IconifyIcon v-if="value.meta.icon" :icon="value.meta.icon" />
+              {{ $t(value.meta.title) }}
+            </template>
+          </Tree>
+        </Spin>
+      </template>
+    </Form>
+  </Drawer>
+</template>
+<style lang="css" scoped>
+:deep(.ant-tree-title) {
+  .tree-actions {
+    @apply ml-5 hidden;
+  }
+}
+
+:deep(.ant-tree-title:hover) {
+  .tree-actions {
+    @apply ml-5 flex flex-auto justify-end;
+  }
+}
+</style>
diff --git a/playground/src/views/system/user/data.ts b/playground/src/views/system/user/data.ts
new file mode 100644
index 00000000..1ffad8c2
--- /dev/null
+++ b/playground/src/views/system/user/data.ts
@@ -0,0 +1,164 @@
+import type { DescriptionsItemType } from '@vben/common-ui';
+
+import type { VbenFormSchema } from '#/adapter/form';
+import type { VxeTableGridColumns } from '#/adapter/vxe-table';
+import type { SystemUserApi } from '#/api';
+
+import { h } from 'vue';
+
+import { Tag } from 'antdv-next';
+
+import { getDeptList } from '#/api';
+import { $t } from '#/locales';
+
+export function useFormSchema(): VbenFormSchema[] {
+  return [
+    {
+      component: 'Input',
+      fieldName: 'name',
+      label: $t('system.user.name'),
+      rules: 'required',
+    },
+    {
+      component: 'ApiTreeSelect',
+      componentProps: {
+        allowClear: true,
+        api: getDeptList,
+        class: 'w-full',
+        labelField: 'name',
+        valueField: 'id',
+        childrenField: 'children',
+      },
+      fieldName: 'deptId',
+      label: $t('system.user.dept'),
+      rules: 'required',
+    },
+    {
+      component: 'RadioGroup',
+      componentProps: {
+        buttonStyle: 'solid',
+        options: [
+          { label: $t('common.enabled'), value: 1 },
+          { label: $t('common.disabled'), value: 0 },
+        ],
+        optionType: 'button',
+      },
+      defaultValue: 1,
+      fieldName: 'status',
+      label: $t('system.user.status'),
+    },
+    {
+      component: 'Textarea',
+      fieldName: 'remark',
+      label: $t('system.user.remark'),
+    },
+  ];
+}
+
+export function useGridFormSchema(): VbenFormSchema[] {
+  return [
+    {
+      component: 'Input',
+      fieldName: 'name',
+      label: $t('system.user.name'),
+    },
+    { component: 'Input', fieldName: 'id', label: $t('system.user.id') },
+    {
+      component: 'Select',
+      componentProps: {
+        allowClear: true,
+        options: [
+          { label: $t('common.enabled'), value: 1 },
+          { label: $t('common.disabled'), value: 0 },
+        ],
+      },
+      fieldName: 'status',
+      label: $t('system.user.status'),
+    },
+    {
+      component: 'Input',
+      fieldName: 'remark',
+      label: $t('system.user.remark'),
+    },
+    {
+      component: 'RangePicker',
+      fieldName: 'createTime',
+      label: $t('system.user.createTime'),
+    },
+  ];
+}
+
+/**
+ * 用户详情描述列表项
+ * @param row 用户数据
+ */
+export function useDescriptionItems(
+  row?: SystemUserApi.SystemUser,
+): DescriptionsItemType[] {
+  const enabled = row?.status === 1;
+  return [
+    { label: $t('system.user.name'), content: row?.name },
+    { label: $t('system.user.id'), content: row?.id },
+    { label: $t('system.user.dept'), content: row?.deptId },
+    {
+      label: $t('system.user.status'),
+      content: () =>
+        h(
+          Tag,
+          {
+            color: enabled ? 'success' : 'error',
+          },
+          {
+            default: () =>
+              enabled ? $t('common.enabled') : $t('common.disabled'),
+          },
+        ),
+    },
+    { label: $t('system.user.createTime'), content: row?.createTime },
+    { label: $t('system.user.remark'), content: row?.remark },
+  ];
+}
+
+export function useColumns<T = SystemUserApi.SystemUser>(
+  onStatusChange?: (newStatus: any, row: T) => PromiseLike<boolean | undefined>,
+): VxeTableGridColumns {
+  return [
+    {
+      field: 'name',
+      title: $t('system.user.name'),
+      width: 200,
+    },
+    {
+      field: 'id',
+      title: $t('system.user.id'),
+      width: 200,
+    },
+    {
+      cellRender: {
+        attrs: { beforeChange: onStatusChange },
+        name: onStatusChange ? 'CellSwitch' : 'CellTag',
+      },
+      field: 'status',
+      title: $t('system.user.status'),
+      width: 100,
+    },
+    {
+      field: 'remark',
+      minWidth: 100,
+      title: $t('system.user.remark'),
+    },
+    {
+      field: 'createTime',
+      title: $t('system.user.createTime'),
+      width: 200,
+    },
+    {
+      align: 'center',
+      field: 'operation',
+      fixed: 'right',
+      slots: { default: 'action' },
+      title: $t('system.user.operation'),
+      width: 180,
+    },
+  ];
+}
diff --git a/playground/src/views/system/user/list.vue b/playground/src/views/system/user/list.vue
new file mode 100644
index 00000000..c88a304f
--- /dev/null
+++ b/playground/src/views/system/user/list.vue
@@ -0,0 +1,261 @@
+<script lang="ts" setup>
+import type { Dayjs } from 'dayjs';
+
+import type { Recordable } from '@vben/types';
+
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { SystemDeptApi, SystemUserApi } from '#/api';
+
+import { onMounted, ref, watch } from 'vue';
+
+import { Page, Tree, useVbenDrawer } from '@vben/common-ui';
+import { Plus } from '@vben/icons';
+
+import { Button, Card, InputSearch, message, Modal } from 'antdv-next';
+
+import { useVbenVxeGrid, VbenTableAction } from '#/adapter/vxe-table';
+import { deleteUser, getDeptList, getUserList, updateUser } from '#/api';
+import { $t } from '#/locales';
+import { createDateRangeCodec } from '#/utils/date-range-codec';
+
+import { useColumns, useGridFormSchema } from './data';
+import Detail from './modules/detail.vue';
+import Form from './modules/form.vue';
+
+interface UserSearchFormValues extends Record<string, unknown> {
+  createTime?: [Dayjs, Dayjs];
+}
+
+const userSearchCodec = createDateRangeCodec<UserSearchFormValues>()({
+  endField: 'endTime',
+  rangeField: 'createTime',
+  startField: 'startTime',
+});
+
+type UserSearchSubmitValues = ReturnType<typeof userSearchCodec.encode>;
+
+const deptList = ref<SystemDeptApi.SystemDept[]>([]);
+const inputSearchValue = ref('');
+const selectedDeptId = ref<string>('');
+
+const [FormDrawer, formDrawerApi] = useVbenDrawer({
+  connectedComponent: Form,
+  destroyOnClose: true,
+});
+
+const [DetailDrawer, detailDrawerApi] = useVbenDrawer({
+  connectedComponent: Detail,
+  destroyOnClose: true,
+});
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  formOptions: {
+    codec: userSearchCodec,
+    schema: useGridFormSchema(),
+    submitOnChange: true,
+  },
+  gridOptions: {
+    columns: useColumns(onStatusChange),
+    height: 'auto',
+    keepSource: true,
+    proxyConfig: {
+      ajax: {
+        query: async ({ page }, formValues: UserSearchSubmitValues) => {
+          return await getUserList({
+            page: page.currentPage,
+            pageSize: page.pageSize,
+            ...formValues,
+            deptId: selectedDeptId.value,
+          });
+        },
+      },
+    },
+    rowConfig: {
+      keyField: 'id',
+    },
+
+    toolbarConfig: {
+      custom: true,
+      export: false,
+      refresh: true,
+      search: true,
+      zoom: true,
+    },
+  } as VxeTableGridOptions<SystemUserApi.SystemUser>,
+});
+
+/**
+ * 将Antd的Modal.confirm封装为promise，方便在异步函数中调用。
+ * @param content 提示内容
+ * @param title 提示标题
+ */
+function confirm(content: string, title: string) {
+  return new Promise((reslove, reject) => {
+    Modal.confirm({
+      content,
+      onCancel() {
+        reject(new Error('已取消'));
+      },
+      onOk() {
+        reslove(true);
+      },
+      title,
+    });
+  });
+}
+
+/**
+ * 状态开关即将改变
+ * @param newStatus 期望改变的状态值
+ * @param row 行数据
+ * @returns 返回false则中止改变，返回其他值（undefined、true）则允许改变
+ */
+async function onStatusChange(
+  newStatus: number,
+  row: SystemUserApi.SystemUser,
+) {
+  const status: Recordable<string> = {
+    0: '禁用',
+    1: '启用',
+  };
+  try {
+    await confirm(
+      `你要将${row.name}的状态切换为 【${status[newStatus.toString()]}】 吗？`,
+      `切换状态`,
+    );
+    await updateUser(row.id, { status: newStatus });
+    return true;
+  } catch {
+    return false;
+  }
+}
+
+function onEdit(row: SystemUserApi.SystemUser) {
+  formDrawerApi.setData(row).open();
+}
+
+function onDetail(row: SystemUserApi.SystemUser) {
+  detailDrawerApi.setData(row).open();
+}
+
+function onDelete(row: SystemUserApi.SystemUser) {
+  const hideLoading = message.loading({
+    content: $t('ui.actionMessage.deleting', [row.name]),
+    duration: 0,
+    key: 'action_process_msg',
+  });
+  deleteUser(row.id)
+    .then(() => {
+      message.success({
+        content: $t('ui.actionMessage.deleteSuccess', [row.name]),
+        key: 'action_process_msg',
+      });
+      onRefresh();
+    })
+    .catch(() => {
+      hideLoading();
+    });
+}
+
+function onRefresh() {
+  gridApi.query();
+}
+
+function onCreate() {
+  formDrawerApi.setData(null).open();
+}
+
+async function loadDeptList() {
+  try {
+    const res = await getDeptList();
+    deptList.value = res;
+  } catch (error) {
+    console.error('Failed to load department list:', error);
+  }
+}
+
+function selectDept(v: string) {
+  selectedDeptId.value = v;
+  gridApi.query();
+}
+
+function searchDept(value: string) {
+  if (!value) {
+    loadDeptList();
+    return;
+  }
+  const filtered = deptList.value.filter((dept) =>
+    dept.name.toLowerCase().includes(value.toLowerCase()),
+  );
+  deptList.value = filtered;
+}
+
+onMounted(() => {
+  loadDeptList();
+});
+
+watch(inputSearchValue, (value) => {
+  searchDept(value);
+});
+</script>
+<template>
+  <Page auto-content-height>
+    <FormDrawer @success="onRefresh" />
+    <DetailDrawer @success="onRefresh" />
+    <div class="flex size-full">
+      <Card class="w-1/6">
+        <InputSearch
+          v-model:value="inputSearchValue"
+          :placeholder="$t('system.user.placeholder')"
+        />
+        <Tree
+          label-field="name"
+          value-field="id"
+          :tree-data="deptList"
+          :default-expanded-level="2"
+          @select="selectDept"
+        />
+      </Card>
+
+      <div class="w-5/6 ml-4">
+        <Grid :table-title="$t('system.user.list')">
+          <template #toolbar-tools>
+            <Button type="primary" @click="onCreate">
+              <Plus class="size-5" />
+              {{ $t('ui.actionTitle.create', [$t('system.user.name')]) }}
+            </Button>
+          </template>
+          <template #action="{ row }">
+            <VbenTableAction
+              :actions="[
+                {
+                  text: $t('common.detail'),
+                  icon: 'lucide:eye',
+                  onClick: () => onDetail(row),
+                },
+                {
+                  text: $t('common.edit'),
+                  icon: 'lucide:edit',
+                  onClick: () => onEdit(row),
+                },
+              ]"
+              :dropdown-actions="[
+                {
+                  text: $t('common.delete'),
+                  icon: 'lucide:trash-2',
+                  danger: true,
+                  popConfirm: {
+                    title: $t('ui.actionMessage.deleteConfirm', [row.name]),
+                    confirm: () => onDelete(row),
+                  },
+                  auth: ['AC_100100'],
+                },
+              ]"
+              align="center"
+            />
+          </template>
+        </Grid>
+      </div>
+    </div>
+  </Page>
+</template>
diff --git a/playground/src/views/system/user/modules/detail.vue b/playground/src/views/system/user/modules/detail.vue
new file mode 100644
index 00000000..43a80558
--- /dev/null
+++ b/playground/src/views/system/user/modules/detail.vue
@@ -0,0 +1,30 @@
+<script lang="ts" setup>
+import type { SystemUserApi } from '#/api/system/user';
+
+import { computed, ref } from 'vue';
+
+import { useVbenDrawer, VbenDescriptions } from '@vben/common-ui';
+
+import { $t } from '#/locales';
+
+import { useDescriptionItems } from '../data';
+
+const detailData = ref<SystemUserApi.SystemUser>();
+
+const items = computed(() => useDescriptionItems(detailData.value));
+
+const [Drawer, drawerApi] = useVbenDrawer<SystemUserApi.SystemUser>({
+  onOpenChange(isOpen) {
+    if (isOpen) {
+      detailData.value = drawerApi.getData();
+    }
+  },
+});
+
+defineExpose({ drawerApi });
+</script>
+<template>
+  <Drawer :footer="false" :title="$t('common.detail')">
+    <VbenDescriptions bordered :column="1" :items="items" />
+  </Drawer>
+</template>
diff --git a/playground/src/views/system/user/modules/form.vue b/playground/src/views/system/user/modules/form.vue
new file mode 100644
index 00000000..f904f08e
--- /dev/null
+++ b/playground/src/views/system/user/modules/form.vue
@@ -0,0 +1,121 @@
+<script lang="ts" setup>
+import type { DataNode } from 'antdv-next/dist/tree';
+
+import type { Recordable } from '@vben/types';
+
+import type { SystemUserApi } from '#/api/system/user';
+
+import { computed, nextTick, ref } from 'vue';
+
+import { Tree, useVbenDrawer } from '@vben/common-ui';
+
+import { Spin } from 'antdv-next';
+
+import { useVbenForm } from '#/adapter/form';
+import { getMenuList } from '#/api/system/menu';
+import { createUser, updateUser } from '#/api/system/user';
+import { $t } from '#/locales';
+
+import { useFormSchema } from '../data';
+
+const emits = defineEmits(['success']);
+
+const formData = ref<SystemUserApi.SystemUser>();
+
+const [Form, formApi] = useVbenForm({
+  schema: useFormSchema(),
+  showDefaultActions: false,
+});
+
+const permissions = ref<DataNode[]>([]);
+const loadingPermissions = ref(false);
+
+const id = ref();
+const [Drawer, drawerApi] = useVbenDrawer<null | SystemUserApi.SystemUser>({
+  async onConfirm() {
+    const { valid } = await formApi.validate();
+    if (!valid) return;
+    const values = await formApi.getValues();
+    drawerApi.lock();
+    (id.value ? updateUser(id.value, values) : createUser(values))
+      .then(() => {
+        emits('success');
+        drawerApi.close();
+      })
+      .catch(() => {
+        drawerApi.unlock();
+      });
+  },
+
+  async onOpenChange(isOpen) {
+    if (isOpen) {
+      const data = drawerApi.getData();
+      formApi.reset();
+
+      if (data) {
+        formData.value = data;
+        id.value = data.id;
+      } else {
+        formData.value = undefined;
+        id.value = undefined;
+      }
+
+      if (permissions.value.length === 0) {
+        await loadPermissions();
+      }
+      // Wait for Vue to flush DOM updates (form fields mounted)
+      await nextTick();
+      if (data) {
+        formApi.setValues(data);
+      }
+    }
+  },
+});
+
+defineExpose({ drawerApi });
+
+async function loadPermissions() {
+  loadingPermissions.value = true;
+  try {
+    const res = await getMenuList();
+    permissions.value = res as unknown as DataNode[];
+  } finally {
+    loadingPermissions.value = false;
+  }
+}
+
+const getDrawerTitle = computed(() => {
+  return formData.value?.id
+    ? $t('common.edit', $t('system.user.name'))
+    : $t('common.create', $t('system.user.name'));
+});
+
+function getNodeClass(node: Recordable<any>) {
+  const classes: string[] = [];
+  if (node.value?.type === 'button') {
+    classes.push('inline-flex');
+  }
+
+  return classes.join(' ');
+}
+</script>
+<template>
+  <Drawer :title="getDrawerTitle">
+    <Form>
+      <template #permissions="slotProps">
+        <Spin :spinning="loadingPermissions" :classes="{ root: 'w-full' }">
+          <Tree
+            :tree-data="permissions"
+            multiple
+            bordered
+            :default-expanded-level="2"
+            :get-node-class="getNodeClass"
+            v-bind="slotProps.componentProps"
+            value-field="id"
+            label-field="name"
+          />
+        </Spin>
+      </template>
+    </Form>
+  </Drawer>
+</template>
diff --git a/playground/tailwind.config.mjs b/playground/tailwind.config.mjs
deleted file mode 100644
index f17f556f..00000000
--- a/playground/tailwind.config.mjs
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from '@vben/tailwind-config';
diff --git a/playground/tsconfig.json b/playground/tsconfig.json
index 02c287fe..858a0ec0 100644
--- a/playground/tsconfig.json
+++ b/playground/tsconfig.json
@@ -2,7 +2,6 @@
   "$schema": "https://json.schemastore.org/tsconfig",
   "extends": "@vben/tsconfig/web-app.json",
   "compilerOptions": {
-    "baseUrl": ".",
     "paths": {
       "#/*": ["./src/*"]
     }
diff --git a/playground/tsconfig.node.json b/playground/tsconfig.node.json
index c2f0d86c..36e9fb5f 100644
--- a/playground/tsconfig.node.json
+++ b/playground/tsconfig.node.json
@@ -6,5 +6,5 @@
     "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.node.tsbuildinfo",
     "noEmit": false
   },
-  "include": ["vite.config.mts"]
+  "include": ["vite.config.ts"]
 }
diff --git a/playground/vite.config.mts b/playground/vite.config.ts
similarity index 100%
rename from playground/vite.config.mts
rename to playground/vite.config.ts
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 9e210808..a05c0102 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -7,257 +7,290 @@ settings:
 catalogs:
   default:
     '@changesets/changelog-github':
-      specifier: ^0.5.0
-      version: 0.5.0
+      specifier: ^0.7.0
+      version: 0.7.0
     '@changesets/cli':
-      specifier: ^2.27.11
-      version: 2.27.11
+      specifier: ^2.31.1
+      version: 2.31.1
     '@changesets/git':
-      specifier: ^3.0.2
-      version: 3.0.2
+      specifier: ^3.0.4
+      version: 3.0.4
     '@clack/prompts':
-      specifier: ^0.9.0
-      version: 0.9.0
+      specifier: ^1.7.0
+      version: 1.7.0
     '@commitlint/cli':
-      specifier: ^19.6.1
-      version: 19.6.1
+      specifier: ^21.2.1
+      version: 21.2.1
     '@commitlint/config-conventional':
-      specifier: ^19.6.0
-      version: 19.6.0
+      specifier: ^21.2.0
+      version: 21.2.0
+    '@eslint-community/eslint-plugin-eslint-comments':
+      specifier: ^4.7.2
+      version: 4.7.2
     '@eslint/js':
-      specifier: ^9.17.0
-      version: 9.17.0
+      specifier: ^10.0.1
+      version: 10.0.1
     '@iconify/json':
-      specifier: ^2.2.286
-      version: 2.2.286
-    '@iconify/tailwind':
-      specifier: ^1.2.0
-      version: 1.2.0
+      specifier: ^2.2.504
+      version: 2.2.513
+    '@iconify/tailwind4':
+      specifier: ^1.2.3
+      version: 1.2.3
     '@iconify/vue':
-      specifier: ^4.2.0
-      version: 4.2.0
+      specifier: ^5.0.1
+      version: 5.0.1
     '@intlify/core-base':
-      specifier: ^10.0.5
-      version: 10.0.5
+      specifier: ^11.4.7
+      version: 11.4.8
     '@intlify/unplugin-vue-i18n':
-      specifier: ^6.0.1
-      version: 6.0.1
+      specifier: ^11.2.4
+      version: 11.2.4
     '@jspm/generator':
-      specifier: ^2.4.1
-      version: 2.4.1
+      specifier: ^2.16.3
+      version: 2.16.3
+    '@lucide/vue':
+      specifier: ^1.26.0
+      version: 1.31.0
     '@manypkg/get-packages':
-      specifier: ^2.2.2
-      version: 2.2.2
+      specifier: ^3.1.0
+      version: 3.1.0
     '@playwright/test':
-      specifier: ^1.49.1
-      version: 1.49.1
+      specifier: ^1.61.1
+      version: 1.62.1
     '@pnpm/workspace.read-manifest':
-      specifier: ^1000.0.1
-      version: 1000.0.1
+      specifier: ^1000.3.1
+      version: 1000.3.1
     '@stylistic/stylelint-plugin':
-      specifier: ^3.1.1
-      version: 3.1.1
-    '@tailwindcss/nesting':
-      specifier: 0.0.0-insiders.565cd3e
-      version: 0.0.0-insiders.565cd3e
+      specifier: ^5.2.1
+      version: 5.3.0
     '@tailwindcss/typography':
-      specifier: ^0.5.15
-      version: 0.5.15
+      specifier: ^0.5.20
+      version: 0.5.20
+    '@tailwindcss/vite':
+      specifier: ^4.3.3
+      version: 4.3.3
+    '@tanstack/store':
+      specifier: ^0.11.0
+      version: 0.11.1
+    '@tanstack/vue-form':
+      specifier: ^1.33.2
+      version: 1.33.4
     '@tanstack/vue-query':
-      specifier: ^5.62.8
-      version: 5.62.8
+      specifier: ^5.101.4
+      version: 5.101.4
     '@tanstack/vue-store':
-      specifier: ^0.6.0
-      version: 0.6.0
+      specifier: ^0.11.0
+      version: 0.11.1
+    '@tiptap/core':
+      specifier: ^3.28.0
+      version: 3.29.2
+    '@tiptap/extension-document':
+      specifier: ^3.28.0
+      version: 3.29.2
+    '@tiptap/extension-highlight':
+      specifier: ^3.28.0
+      version: 3.29.2
+    '@tiptap/extension-image':
+      specifier: ^3.28.0
+      version: 3.29.2
+    '@tiptap/extension-link':
+      specifier: ^3.28.0
+      version: 3.29.2
+    '@tiptap/extension-placeholder':
+      specifier: ^3.28.0
+      version: 3.29.2
+    '@tiptap/extension-text-align':
+      specifier: ^3.28.0
+      version: 3.29.2
+    '@tiptap/extension-text-style':
+      specifier: ^3.28.0
+      version: 3.29.2
+    '@tiptap/extension-underline':
+      specifier: ^3.28.0
+      version: 3.29.2
+    '@tiptap/pm':
+      specifier: ^3.28.0
+      version: 3.29.2
+    '@tiptap/starter-kit':
+      specifier: ^3.28.0
+      version: 3.29.2
+    '@tiptap/vue-3':
+      specifier: ^3.28.0
+      version: 3.29.2
+    '@tsdown/css':
+      specifier: ^0.22.13
+      version: 0.22.14
     '@types/archiver':
-      specifier: ^6.0.3
-      version: 6.0.3
-    '@types/eslint':
-      specifier: ^9.6.1
-      version: 9.6.1
+      specifier: ^8.0.0
+      version: 8.0.0
     '@types/html-minifier-terser':
       specifier: ^7.0.2
       version: 7.0.2
+    '@types/json-bigint':
+      specifier: ^1.0.4
+      version: 1.0.4
     '@types/lodash.clonedeep':
       specifier: ^4.5.9
       version: 4.5.9
-    '@types/lodash.get':
-      specifier: ^4.4.9
-      version: 4.4.9
-    '@types/lodash.isequal':
-      specifier: ^4.5.8
-      version: 4.5.8
     '@types/node':
-      specifier: ^22.10.2
-      version: 22.10.2
+      specifier: ^25.9.5
+      version: 25.9.5
     '@types/nprogress':
       specifier: ^0.2.3
       version: 0.2.3
-    '@types/postcss-import':
-      specifier: ^14.0.3
-      version: 14.0.3
     '@types/qrcode':
-      specifier: ^1.5.5
-      version: 1.5.5
+      specifier: ^1.5.6
+      version: 1.5.6
+    '@types/qs':
+      specifier: ^6.15.1
+      version: 6.15.1
     '@types/sortablejs':
-      specifier: ^1.15.8
-      version: 1.15.8
-    '@typescript-eslint/eslint-plugin':
-      specifier: ^8.18.1
-      version: 8.18.1
+      specifier: ^1.15.9
+      version: 1.15.9
     '@typescript-eslint/parser':
-      specifier: ^8.18.1
-      version: 8.18.1
-    '@vee-validate/zod':
-      specifier: ^4.14.7
-      version: 4.14.7
+      specifier: ^8.65.0
+      version: 8.66.0
     '@vitejs/plugin-vue':
-      specifier: ^5.2.1
-      version: 5.2.1
+      specifier: ^6.0.8
+      version: 6.0.8
     '@vitejs/plugin-vue-jsx':
-      specifier: ^4.1.1
-      version: 4.1.1
+      specifier: ^5.1.6
+      version: 5.1.6
     '@vue/shared':
-      specifier: ^3.5.13
-      version: 3.5.13
+      specifier: ^3.5.40
+      version: 3.5.41
     '@vue/test-utils':
-      specifier: ^2.4.6
-      version: 2.4.6
+      specifier: ^2.4.11
+      version: 2.4.11
     '@vueuse/core':
-      specifier: ^12.0.0
-      version: 12.0.0
+      specifier: ^14.3.0
+      version: 14.4.0
     '@vueuse/integrations':
-      specifier: ^12.0.0
-      version: 12.0.0
+      specifier: ^14.3.0
+      version: 14.4.0
+    '@vueuse/motion':
+      specifier: ^3.0.3
+      version: 3.0.3
     ant-design-vue:
       specifier: ^4.2.6
       version: 4.2.6
+    antdv-next:
+      specifier: ^1.4.5
+      version: 1.5.0
     archiver:
-      specifier: ^7.0.1
-      version: 7.0.1
+      specifier: ^8.0.0
+      version: 8.0.0
     autoprefixer:
-      specifier: ^10.4.20
-      version: 10.4.20
+      specifier: ^10.4.19
+      version: 10.5.4
     axios:
-      specifier: ^1.7.9
-      version: 1.7.9
+      specifier: ^1.18.1
+      version: 1.19.0
     axios-mock-adapter:
       specifier: ^2.1.0
       version: 2.1.0
     cac:
-      specifier: ^6.7.14
-      version: 6.7.14
+      specifier: ^7.0.0
+      version: 7.0.0
     chalk:
-      specifier: ^5.4.0
-      version: 5.4.0
+      specifier: ^5.6.2
+      version: 5.6.2
     cheerio:
-      specifier: 1.0.0
-      version: 1.0.0
+      specifier: ^1.2.0
+      version: 1.2.0
     circular-dependency-scanner:
-      specifier: ^2.3.0
-      version: 2.3.0
+      specifier: ^3.0.1
+      version: 3.1.0
     class-variance-authority:
       specifier: ^0.7.1
       version: 0.7.1
     commitlint-plugin-function-rules:
-      specifier: ^4.0.1
-      version: 4.0.1
+      specifier: ^5.0.1
+      version: 5.0.1
     consola:
-      specifier: ^3.3.0
-      version: 3.3.0
+      specifier: ^3.4.2
+      version: 3.4.2
     cross-env:
-      specifier: ^7.0.3
-      version: 7.0.3
+      specifier: ^10.1.0
+      version: 10.1.0
     cspell:
-      specifier: ^8.17.1
-      version: 8.17.1
-    cssnano:
-      specifier: ^7.0.6
-      version: 7.0.6
+      specifier: ^10.0.1
+      version: 10.0.1
     cz-git:
-      specifier: ^1.11.0
-      version: 1.11.0
+      specifier: ^1.13.1
+      version: 1.13.1
     czg:
-      specifier: ^1.11.0
-      version: 1.11.0
+      specifier: ^1.13.1
+      version: 1.13.1
     dayjs:
-      specifier: ^1.11.13
-      version: 1.11.13
+      specifier: ^1.11.21
+      version: 1.11.21
     defu:
-      specifier: ^6.1.4
-      version: 6.1.4
-    depcheck:
-      specifier: ^1.4.7
-      version: 1.4.7
+      specifier: ^6.1.7
+      version: 6.1.7
     dotenv:
-      specifier: ^16.4.7
-      version: 16.4.7
+      specifier: ^17.4.2
+      version: 17.4.2
     echarts:
-      specifier: ^5.5.1
-      version: 5.5.1
+      specifier: ^6.1.0
+      version: 6.1.0
+    electron-builder:
+      specifier: ^26.15.3
+      version: 26.15.3
+    electron-log:
+      specifier: ^5.4.4
+      version: 5.4.4
+    electron-vite:
+      specifier: ^5.0.0
+      version: 5.0.0
+    es-toolkit:
+      specifier: ^1.49.0
+      version: 1.50.0
     eslint:
-      specifier: ^9.17.0
-      version: 9.17.0
-    eslint-config-turbo:
-      specifier: ^2.3.3
-      version: 2.3.3
+      specifier: ^10.7.0
+      version: 10.8.1
+    eslint-plugin-better-tailwindcss:
+      specifier: ^4.7.0
+      version: 4.7.0
     eslint-plugin-command:
-      specifier: ^0.2.7
-      version: 0.2.7
-    eslint-plugin-eslint-comments:
-      specifier: ^3.2.0
-      version: 3.2.0
-    eslint-plugin-import-x:
-      specifier: ^4.6.1
-      version: 4.6.1
-    eslint-plugin-jsdoc:
-      specifier: ^50.6.1
-      version: 50.6.1
+      specifier: ^3.5.3
+      version: 3.5.3
     eslint-plugin-jsonc:
-      specifier: ^2.18.2
-      version: 2.18.2
-    eslint-plugin-n:
-      specifier: ^17.15.1
-      version: 17.15.1
-    eslint-plugin-no-only-tests:
       specifier: ^3.3.0
-      version: 3.3.0
+      version: 3.4.1
+    eslint-plugin-n:
+      specifier: ^18.2.2
+      version: 18.3.0
     eslint-plugin-perfectionist:
-      specifier: ^3.9.1
-      version: 3.9.1
-    eslint-plugin-prettier:
-      specifier: ^5.2.1
-      version: 5.2.1
-    eslint-plugin-regexp:
-      specifier: ^2.7.0
-      version: 2.7.0
-    eslint-plugin-unicorn:
-      specifier: ^56.0.1
-      version: 56.0.1
+      specifier: ^5.10.0
+      version: 5.10.1
+    eslint-plugin-pnpm:
+      specifier: ^1.7.0
+      version: 1.7.0
     eslint-plugin-unused-imports:
-      specifier: ^4.1.4
-      version: 4.1.4
-    eslint-plugin-vitest:
-      specifier: ^0.5.4
-      version: 0.5.4
+      specifier: ^4.4.1
+      version: 4.4.1
     eslint-plugin-vue:
-      specifier: ^9.32.0
-      version: 9.32.0
+      specifier: ^10.10.0
+      version: 10.10.0
+    eslint-plugin-yml:
+      specifier: ^3.6.0
+      version: 3.8.1
     execa:
-      specifier: ^9.5.2
-      version: 9.5.2
+      specifier: ^10.0.0
+      version: 10.0.1
     find-up:
-      specifier: ^7.0.0
-      version: 7.0.0
+      specifier: ^8.0.0
+      version: 8.0.0
     get-port:
-      specifier: ^7.1.0
-      version: 7.1.0
+      specifier: ^7.2.0
+      version: 7.2.0
     globals:
-      specifier: ^15.14.0
-      version: 15.14.0
+      specifier: ^17.7.0
+      version: 17.9.0
     happy-dom:
-      specifier: ^15.11.7
-      version: 15.11.7
+      specifier: ^20.11.1
+      version: 20.11.2
     html-minifier-terser:
       specifier: ^7.2.0
       version: 7.2.0
@@ -267,257 +300,241 @@ catalogs:
     is-ci:
       specifier: ^4.1.0
       version: 4.1.0
-    jsonc-eslint-parser:
-      specifier: ^2.4.0
-      version: 2.4.0
-    lint-staged:
-      specifier: ^15.2.11
-      version: 15.2.11
+    json-bigint:
+      specifier: ^1.0.0
+      version: 1.0.0
+    knip:
+      specifier: ^6.29.0
+      version: 6.32.1
+    lefthook:
+      specifier: ^2.1.10
+      version: 2.1.10
     lodash.clonedeep:
       specifier: ^4.5.0
       version: 4.5.0
-    lodash.get:
-      specifier: ^4.4.2
-      version: 4.4.2
-    lodash.isequal:
-      specifier: ^4.5.0
-      version: 4.5.0
-    lucide-vue-next:
-      specifier: ^0.469.0
-      version: 0.469.0
     nitropack:
-      specifier: ^2.10.4
-      version: 2.10.4
+      specifier: ^2.13.4
+      version: 2.13.4
     nprogress:
       specifier: ^0.2.0
       version: 0.2.0
     ora:
-      specifier: ^8.1.1
-      version: 8.1.1
+      specifier: ^9.4.1
+      version: 9.4.1
+    oxfmt:
+      specifier: ^0.60.0
+      version: 0.60.0
+    oxlint:
+      specifier: ^1.75.0
+      version: 1.77.0
+    oxlint-tsgolint:
+      specifier: ^0.25.0
+      version: 0.25.0
     pinia-plugin-persistedstate:
-      specifier: ^4.2.0
-      version: 4.2.0
+      specifier: ^4.7.1
+      version: 4.7.1
     pkg-types:
-      specifier: ^1.2.1
-      version: 1.2.1
+      specifier: ^2.3.1
+      version: 2.3.1
     playwright:
-      specifier: ^1.49.1
-      version: 1.49.1
+      specifier: ^1.61.1
+      version: 1.62.1
     postcss:
-      specifier: ^8.4.49
-      version: 8.4.49
-    postcss-antd-fixes:
-      specifier: ^0.2.0
-      version: 0.2.0
+      specifier: ^8.5.22
+      version: 8.5.26
     postcss-html:
-      specifier: ^1.7.0
-      version: 1.7.0
-    postcss-import:
-      specifier: ^16.1.0
-      version: 16.1.0
-    postcss-preset-env:
-      specifier: ^10.1.2
-      version: 10.1.2
+      specifier: ^1.8.1
+      version: 1.8.1
     postcss-scss:
       specifier: ^4.0.9
       version: 4.0.9
-    prettier:
-      specifier: ^3.4.2
-      version: 3.4.2
-    prettier-plugin-tailwindcss:
-      specifier: ^0.6.9
-      version: 0.6.9
     publint:
-      specifier: ^0.2.12
-      version: 0.2.12
+      specifier: ^0.3.22
+      version: 0.3.23
     qrcode:
       specifier: ^1.5.4
       version: 1.5.4
-    radix-vue:
-      specifier: ^1.9.11
-      version: 1.9.11
+    qs:
+      specifier: ^6.15.3
+      version: 6.15.3
+    reka-ui:
+      specifier: ^2.10.1
+      version: 2.10.3
     resolve.exports:
       specifier: ^2.0.3
       version: 2.0.3
     rimraf:
-      specifier: ^6.0.1
-      version: 6.0.1
-    rollup:
-      specifier: ^4.28.1
-      version: 4.28.1
+      specifier: ^6.1.3
+      version: 6.1.3
     rollup-plugin-visualizer:
-      specifier: ^5.12.0
-      version: 5.12.0
+      specifier: ^7.0.1
+      version: 7.0.1
     sass:
-      specifier: 1.80.6
-      version: 1.80.6
+      specifier: ^1.101.6
+      version: 1.102.0
+    sass-embedded:
+      specifier: ^1.100.0
+      version: 1.100.0
+    secure-ls:
+      specifier: ^2.0.0
+      version: 2.0.0
     sortablejs:
-      specifier: ^1.15.6
-      version: 1.15.6
+      specifier: ^1.15.7
+      version: 1.15.7
     stylelint:
-      specifier: ^16.12.0
-      version: 16.12.0
+      specifier: ^17.14.1
+      version: 17.14.1
     stylelint-config-recess-order:
-      specifier: ^5.1.1
-      version: 5.1.1
+      specifier: ^7.7.0
+      version: 7.7.0
     stylelint-config-recommended:
-      specifier: ^14.0.1
-      version: 14.0.1
+      specifier: ^18.0.0
+      version: 18.0.0
     stylelint-config-recommended-scss:
-      specifier: ^14.1.0
-      version: 14.1.0
+      specifier: ^17.0.1
+      version: 17.0.1
     stylelint-config-recommended-vue:
-      specifier: ^1.5.0
-      version: 1.5.0
+      specifier: ^1.6.1
+      version: 1.6.1
     stylelint-config-standard:
-      specifier: ^36.0.1
-      version: 36.0.1
+      specifier: ^40.0.0
+      version: 40.0.0
     stylelint-order:
-      specifier: ^6.0.4
-      version: 6.0.4
-    stylelint-prettier:
-      specifier: ^5.0.2
-      version: 5.0.2
+      specifier: ^8.1.1
+      version: 8.1.1
     stylelint-scss:
-      specifier: ^6.10.0
-      version: 6.10.0
+      specifier: ^7.2.0
+      version: 7.2.0
     tailwind-merge:
-      specifier: ^2.5.5
-      version: 2.5.5
+      specifier: ^3.6.0
+      version: 3.6.0
     tailwindcss:
-      specifier: ^3.4.17
-      version: 3.4.17
-    tailwindcss-animate:
-      specifier: ^1.0.7
-      version: 1.0.7
+      specifier: ^4.3.3
+      version: 4.3.3
+    tdesign-vue-next:
+      specifier: ^1.20.3
+      version: 1.20.5
     theme-colors:
       specifier: ^0.1.0
       version: 0.1.0
+    tippy.js:
+      specifier: ^6.3.7
+      version: 6.3.7
+    tsdown:
+      specifier: ^0.22.13
+      version: 0.22.14
     turbo:
-      specifier: ^2.3.3
-      version: 2.3.3
+      specifier: ^2.10.6
+      version: 2.10.9
+    tw-animate-css:
+      specifier: ^1.4.0
+      version: 1.4.0
     typescript:
-      specifier: 5.6.3
-      version: 5.6.3
+      specifier: ^6.0.3
+      version: 6.0.3
     unbuild:
-      specifier: ^3.0.1
-      version: 3.0.1
-    vee-validate:
-      specifier: ^4.14.7
-      version: 4.14.7
+      specifier: ^3.5.0
+      version: 3.6.1
+    unplugin-dts:
+      specifier: ^1.0.3
+      version: 1.0.3
+    unplugin-vue:
+      specifier: ^7.2.0
+      version: 7.2.0
     vite:
-      specifier: ^6.0.5
-      version: 6.0.5
+      specifier: ^8.1.5
+      version: 8.2.1
     vite-plugin-compression:
       specifier: ^0.5.1
       version: 0.5.1
-    vite-plugin-dts:
-      specifier: 4.2.1
-      version: 4.2.1
-    vite-plugin-html:
-      specifier: ^3.2.2
-      version: 3.2.2
     vite-plugin-lazy-import:
       specifier: ^1.0.7
       version: 1.0.7
     vite-plugin-pwa:
-      specifier: ^0.21.1
-      version: 0.21.1
+      specifier: ^1.3.0
+      version: 1.3.0
     vite-plugin-vue-devtools:
-      specifier: ^7.6.8
-      version: 7.6.8
+      specifier: ^8.1.5
+      version: 8.2.1
     vitest:
-      specifier: ^2.1.8
-      version: 2.1.8
+      specifier: ^4.1.10
+      version: 4.1.10
     vue-eslint-parser:
-      specifier: ^9.4.3
-      version: 9.4.3
+      specifier: ^10.4.1
+      version: 10.4.1
     vue-i18n:
-      specifier: ^10.0.5
-      version: 10.0.5
+      specifier: ^11.4.7
+      version: 11.4.8
+    vue-json-pretty:
+      specifier: ^2.6.0
+      version: 2.6.0
     vue-router:
-      specifier: ^4.5.0
-      version: 4.5.0
+      specifier: ^5.2.0
+      version: 5.2.0
+    vue-tippy:
+      specifier: ^6.7.1
+      version: 6.7.1
     vue-tsc:
-      specifier: ^2.1.10
-      version: 2.1.10
+      specifier: ^3.3.8
+      version: 3.3.9
     vxe-pc-ui:
-      specifier: ^4.3.40
-      version: 4.3.40
+      specifier: ^4.16.19
+      version: 4.16.27
     vxe-table:
-      specifier: ^4.9.33
-      version: 4.9.33
+      specifier: ^4.20.6
+      version: 4.20.11
     watermark-js-plus:
-      specifier: ^1.5.7
-      version: 1.5.7
+      specifier: ^1.6.6
+      version: 1.6.6
+    yaml-eslint-parser:
+      specifier: ^2.1.0
+      version: 2.1.0
     zod:
-      specifier: ^3.24.1
-      version: 3.24.1
+      specifier: ^4.4.3
+      version: 4.4.3
     zod-defaults:
-      specifier: ^0.1.3
-      version: 0.1.3
+      specifier: ^0.2.3
+      version: 0.2.3
 
 overrides:
-  '@ast-grep/napi': ^0.31.1
-  '@ctrl/tinycolor': ^4.1.0
+  '@ast-grep/napi': ^0.44.1
+  '@ctrl/tinycolor': ^4.2.0
   clsx: ^2.1.1
-  esbuild: 0.24.0
-  pinia: 2.2.2
-  vue: ^3.5.13
+  pinia: ^4.0.2
+  vue: ^3.5.40
 
 importers:
 
   .:
     dependencies:
-      '@fortawesome/fontawesome-free':
-        specifier: ^6.7.2
-        version: 6.7.2
-      '@vueup/vue-quill':
-        specifier: ^1.2.0
-        version: 1.2.0(vue@3.5.13(typescript@5.6.3))
-      axios:
-        specifier: ^1.10.0
-        version: 1.10.0
-      html2canvas:
-        specifier: ^1.4.1
-        version: 1.4.1
-      js-base64:
-        specifier: ^3.7.7
-        version: 3.7.7
-      lodash-es:
-        specifier: ^4.17.21
-        version: 4.17.21
-      lucide-vue-next:
-        specifier: ^0.487.0
-        version: 0.487.0(vue@3.5.13(typescript@5.6.3))
-      md-editor-v3:
-        specifier: ^5.4.5
-        version: 5.4.5(vue@3.5.13(typescript@5.6.3))
-      xgplayer:
-        specifier: ^3.0.24
-        version: 3.0.24(core-js@3.39.0)
+      sortablejs:
+        specifier: 'catalog:'
+        version: 1.15.7
     devDependencies:
       '@changesets/changelog-github':
         specifier: 'catalog:'
-        version: 0.5.0(encoding@0.1.13)
+        version: 0.7.0
       '@changesets/cli':
         specifier: 'catalog:'
-        version: 2.27.11
-      '@playwright/test':
+        version: 2.31.1(@types/node@25.9.5)
+      '@tsdown/css':
         specifier: 'catalog:'
-        version: 1.49.1
+        version: 0.22.14(jiti@2.7.0)(postcss@8.5.26)(sass-embedded@1.100.0)(sass@1.102.0)(tsdown@0.22.14)(yaml@2.9.0)
       '@types/node':
         specifier: 'catalog:'
-        version: 22.10.2
+        version: 25.9.5
       '@vben/commitlint-config':
         specifier: workspace:*
         version: link:internal/lint-configs/commitlint-config
       '@vben/eslint-config':
         specifier: workspace:*
         version: link:internal/lint-configs/eslint-config
-      '@vben/prettier-config':
+      '@vben/oxfmt-config':
         specifier: workspace:*
-        version: link:internal/lint-configs/prettier-config
+        version: link:internal/lint-configs/oxfmt-config
+      '@vben/oxlint-config':
+        specifier: workspace:*
+        version: link:internal/lint-configs/oxlint-config
       '@vben/stylelint-config':
         specifier: workspace:*
         version: link:internal/lint-configs/stylelint-config
@@ -538,70 +555,225 @@ importers:
         version: link:scripts/vsh
       '@vitejs/plugin-vue':
         specifier: 'catalog:'
-        version: 5.2.1(vite@6.0.5(@types/node@22.10.2)(jiti@2.4.2)(less@4.2.1)(terser@5.37.0)(yaml@2.6.1))(vue@3.5.13(typescript@5.6.3))
+        version: 6.0.8(vite@8.2.1(@types/node@25.9.5)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0))(vue@3.5.41(typescript@6.0.3))
       '@vitejs/plugin-vue-jsx':
         specifier: 'catalog:'
-        version: 4.1.1(vite@6.0.5(@types/node@22.10.2)(jiti@2.4.2)(less@4.2.1)(terser@5.37.0)(yaml@2.6.1))(vue@3.5.13(typescript@5.6.3))
+        version: 5.1.6(supports-color@10.2.2)(vite@8.2.1(@types/node@25.9.5)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0))(vue@3.5.41(typescript@6.0.3))
       '@vue/test-utils':
         specifier: 'catalog:'
-        version: 2.4.6
+        version: 2.4.11(@vue/compiler-dom@3.5.41)(@vue/server-renderer@3.5.41)(vue@3.5.41(typescript@6.0.3))
       autoprefixer:
         specifier: 'catalog:'
-        version: 10.4.20(postcss@8.4.49)
+        version: 10.5.4(postcss@8.5.26)
       cross-env:
         specifier: 'catalog:'
-        version: 7.0.3
+        version: 10.1.0
       cspell:
         specifier: 'catalog:'
-        version: 8.17.1
+        version: 10.0.1
+      eslint:
+        specifier: 'catalog:'
+        version: 10.8.1(jiti@2.7.0)(supports-color@10.2.2)
       happy-dom:
         specifier: 'catalog:'
-        version: 15.11.7
+        version: 20.11.2
       husky:
         specifier: 'catalog:'
         version: 9.1.7
       is-ci:
         specifier: 'catalog:'
         version: 4.1.0
-      lint-staged:
+      lefthook:
         specifier: 'catalog:'
-        version: 15.2.11
+        version: 2.1.10
+      oxfmt:
+        specifier: 'catalog:'
+        version: 0.60.0
+      oxlint:
+        specifier: 'catalog:'
+        version: 1.77.0(oxlint-tsgolint@0.25.0)
+      oxlint-tsgolint:
+        specifier: 'catalog:'
+        version: 0.25.0
       playwright:
         specifier: 'catalog:'
-        version: 1.49.1
+        version: 1.62.1
       rimraf:
         specifier: 'catalog:'
-        version: 6.0.1
+        version: 6.1.3
       tailwindcss:
         specifier: 'catalog:'
-        version: 3.4.17
+        version: 4.3.3
+      tsdown:
+        specifier: 'catalog:'
+        version: 0.22.14(@tsdown/css@0.22.14)(@volar/typescript@2.4.28)(oxc-resolver@11.24.2)(publint@0.3.23)(typescript@6.0.3)(vue-tsc@3.3.9(typescript@6.0.3))
       turbo:
         specifier: 'catalog:'
-        version: 2.3.3
+        version: 2.10.9
       typescript:
         specifier: 'catalog:'
-        version: 5.6.3
+        version: 6.0.3
       unbuild:
         specifier: 'catalog:'
-        version: 3.0.1(typescript@5.6.3)(vue-tsc@2.1.10(typescript@5.6.3))(vue@3.5.13(typescript@5.6.3))
+        version: 3.6.1(sass@1.102.0)(typescript@6.0.3)(vue-tsc@3.3.9(typescript@6.0.3))(vue@3.5.41(typescript@6.0.3))
       vite:
         specifier: 'catalog:'
-        version: 6.0.5(@types/node@22.10.2)(jiti@2.4.2)(less@4.2.1)(sass@1.80.6)(terser@5.37.0)(yaml@2.6.1)
+        version: 8.2.1(@types/node@25.9.5)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0)
       vitest:
         specifier: 'catalog:'
-        version: 2.1.8(@types/node@22.10.2)(happy-dom@15.11.7)(less@4.2.1)(sass@1.80.6)(terser@5.37.0)
+        version: 4.1.10(@types/node@25.9.5)(happy-dom@20.11.2)(vite@8.2.1(@types/node@25.9.5)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0))
       vue:
-        specifier: ^3.5.13
-        version: 3.5.13(typescript@5.6.3)
+        specifier: ^3.5.40
+        version: 3.5.41(typescript@6.0.3)
       vue-tsc:
         specifier: 'catalog:'
-        version: 2.1.10(typescript@5.6.3)
+        version: 3.3.9(typescript@6.0.3)
+
+  apps/desktop:
+    dependencies:
+      electron-log:
+        specifier: 'catalog:'
+        version: 5.4.4
+      electron-updater:
+        specifier: ^6.8.9
+        version: 6.8.9(supports-color@10.2.2)
+    devDependencies:
+      '@types/node':
+        specifier: 'catalog:'
+        version: 25.9.5
+      '@vben/web-antd':
+        specifier: workspace:*
+        version: link:../web-antd
+      electron:
+        specifier: ^43.4.0
+        version: 43.4.0(supports-color@10.2.2)
+      electron-builder:
+        specifier: 'catalog:'
+        version: 26.15.3(electron-builder-squirrel-windows@26.15.3)(supports-color@10.2.2)
+      electron-vite:
+        specifier: 'catalog:'
+        version: 5.0.0(supports-color@10.2.2)(vite@7.3.6(@types/node@25.9.5)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(lightningcss@1.33.0)(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0))
+      typescript:
+        specifier: 'catalog:'
+        version: 6.0.3
+      vite:
+        specifier: ^7.3.6
+        version: 7.3.6(@types/node@25.9.5)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(lightningcss@1.33.0)(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0)
 
   apps/web-antd:
     dependencies:
       '@ant-design/icons-vue':
         specifier: ^7.0.1
-        version: 7.0.1(vue@3.5.13(typescript@5.7.2))
+        version: 7.0.1(vue@3.5.41(typescript@6.0.3))
+      '@fortawesome/fontawesome-free':
+        specifier: ^6.7.2
+        version: 6.7.2
+      '@vben/access':
+        specifier: workspace:*
+        version: link:../../packages/effects/access
+      '@vben/common-ui':
+        specifier: workspace:*
+        version: link:../../packages/effects/common-ui
+      '@vben/constants':
+        specifier: workspace:*
+        version: link:../../packages/constants
+      '@vben/hooks':
+        specifier: workspace:*
+        version: link:../../packages/effects/hooks
+      '@vben/icons':
+        specifier: workspace:*
+        version: link:../../packages/icons
+      '@vben/layouts':
+        specifier: workspace:*
+        version: link:../../packages/effects/layouts
+      '@vben/locales':
+        specifier: workspace:*
+        version: link:../../packages/locales
+      '@vben/plugins':
+        specifier: workspace:*
+        version: link:../../packages/effects/plugins
+      '@vben/preferences':
+        specifier: workspace:*
+        version: link:../../packages/preferences
+      '@vben/request':
+        specifier: workspace:*
+        version: link:../../packages/effects/request
+      '@vben/stores':
+        specifier: workspace:*
+        version: link:../../packages/stores
+      '@vben/styles':
+        specifier: workspace:*
+        version: link:../../packages/styles
+      '@vben/types':
+        specifier: workspace:*
+        version: link:../../packages/types
+      '@vben/utils':
+        specifier: workspace:*
+        version: link:../../packages/utils
+      '@vueup/vue-quill':
+        specifier: ^1.2.0
+        version: 1.5.5(vue@3.5.41(typescript@6.0.3))
+      '@vueuse/core':
+        specifier: 'catalog:'
+        version: 14.4.0(vue@3.5.41(typescript@6.0.3))
+      ant-design-vue:
+        specifier: 'catalog:'
+        version: 4.2.6(vue@3.5.41(typescript@6.0.3))
+      axios:
+        specifier: ^1.10.0
+        version: 1.19.0(debug@4.4.3(supports-color@10.2.2))(supports-color@10.2.2)
+      dayjs:
+        specifier: 'catalog:'
+        version: 1.11.21
+      exceljs:
+        specifier: ^4.4.0
+        version: 4.4.0
+      html2canvas:
+        specifier: ^1.4.1
+        version: 1.4.1
+      js-base64:
+        specifier: ^3.7.7
+        version: 3.9.2
+      lodash-es:
+        specifier: ^4.17.21
+        version: 4.18.1
+      lucide-vue-next:
+        specifier: ^0.487.0
+        version: 0.487.0(vue@3.5.41(typescript@6.0.3))
+      lunar-typescript:
+        specifier: ^1.8.6
+        version: 1.8.6
+      markdown-it:
+        specifier: ^14.1.0
+        version: 14.3.0
+      md-editor-v3:
+        specifier: ^5.4.5
+        version: 5.8.5(vue@3.5.41(typescript@6.0.3))
+      pinia:
+        specifier: ^4.0.2
+        version: 4.0.2(@vue/devtools-api@8.2.1)(typescript@6.0.3)(vue@3.5.41(typescript@6.0.3))
+      sortablejs:
+        specifier: 'catalog:'
+        version: 1.15.7
+      vue:
+        specifier: ^3.5.40
+        version: 3.5.41(typescript@6.0.3)
+      vue-router:
+        specifier: 'catalog:'
+        version: 5.2.0(@vue/compiler-sfc@3.5.41)(esbuild@0.28.2)(pinia@4.0.2(@vue/devtools-api@8.2.1)(typescript@6.0.3)(vue@3.5.41(typescript@6.0.3)))(rolldown@1.2.3)(rollup@4.62.4)(vite@8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0))(vue@3.5.41(typescript@6.0.3))
+      xgplayer:
+        specifier: ^3.0.24
+        version: 3.0.26(core-js@3.50.0)
+      xlsx:
+        specifier: ^0.18.5
+        version: 0.18.5
+    devDependencies:
+      '@types/sortablejs':
+        specifier: 'catalog:'
+        version: 1.15.9
+
+  apps/web-antdv-next:
+    dependencies:
       '@vben/access':
         specifier: workspace:*
         version: link:../../packages/effects/access
@@ -646,269 +818,263 @@ importers:
         version: link:../../packages/utils
       '@vueuse/core':
         specifier: 'catalog:'
-        version: 12.0.0(typescript@5.7.2)
-      ant-design-vue:
+        version: 14.4.0(vue@3.5.41(typescript@6.0.3))
+      antdv-next:
         specifier: 'catalog:'
-        version: 4.2.6(vue@3.5.13(typescript@5.7.2))
+        version: 1.5.0(vue@3.5.41(typescript@6.0.3))
       dayjs:
         specifier: 'catalog:'
-        version: 1.11.13
-      exceljs:
-        specifier: ^4.4.0
-        version: 4.4.0
-      markdown-it:
-        specifier: ^14.1.0
-        version: 14.1.0
+        version: 1.11.21
       pinia:
-        specifier: 2.2.2
-        version: 2.2.2(typescript@5.7.2)(vue@3.5.13(typescript@5.7.2))
-      sortablejs:
-        specifier: 'catalog:'
-        version: 1.15.6
+        specifier: ^4.0.2
+        version: 4.0.2(@vue/devtools-api@8.2.1)(typescript@6.0.3)(vue@3.5.41(typescript@6.0.3))
       vue:
-        specifier: ^3.5.13
-        version: 3.5.13(typescript@5.7.2)
+        specifier: ^3.5.40
+        version: 3.5.41(typescript@6.0.3)
       vue-router:
         specifier: 'catalog:'
-        version: 4.5.0(vue@3.5.13(typescript@5.7.2))
-      xlsx:
-        specifier: ^0.18.5
-        version: 0.18.5
-    devDependencies:
-      '@types/sortablejs':
+        version: 5.2.0(@vue/compiler-sfc@3.5.41)(esbuild@0.28.2)(pinia@4.0.2(@vue/devtools-api@8.2.1)(typescript@6.0.3)(vue@3.5.41(typescript@6.0.3)))(rolldown@1.2.3)(rollup@4.62.4)(vite@8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0))(vue@3.5.41(typescript@6.0.3))
+
+  apps/web-tdesign:
+    dependencies:
+      '@vben/access':
+        specifier: workspace:*
+        version: link:../../packages/effects/access
+      '@vben/common-ui':
+        specifier: workspace:*
+        version: link:../../packages/effects/common-ui
+      '@vben/constants':
+        specifier: workspace:*
+        version: link:../../packages/constants
+      '@vben/hooks':
+        specifier: workspace:*
+        version: link:../../packages/effects/hooks
+      '@vben/icons':
+        specifier: workspace:*
+        version: link:../../packages/icons
+      '@vben/layouts':
+        specifier: workspace:*
+        version: link:../../packages/effects/layouts
+      '@vben/locales':
+        specifier: workspace:*
+        version: link:../../packages/locales
+      '@vben/plugins':
+        specifier: workspace:*
+        version: link:../../packages/effects/plugins
+      '@vben/preferences':
+        specifier: workspace:*
+        version: link:../../packages/preferences
+      '@vben/request':
+        specifier: workspace:*
+        version: link:../../packages/effects/request
+      '@vben/stores':
+        specifier: workspace:*
+        version: link:../../packages/stores
+      '@vben/styles':
+        specifier: workspace:*
+        version: link:../../packages/styles
+      '@vben/types':
+        specifier: workspace:*
+        version: link:../../packages/types
+      '@vben/utils':
+        specifier: workspace:*
+        version: link:../../packages/utils
+      '@vueuse/core':
         specifier: 'catalog:'
-        version: 1.15.8
+        version: 14.4.0(vue@3.5.41(typescript@6.0.3))
+      dayjs:
+        specifier: 'catalog:'
+        version: 1.11.21
+      es-toolkit:
+        specifier: 'catalog:'
+        version: 1.50.0
+      pinia:
+        specifier: ^4.0.2
+        version: 4.0.2(@vue/devtools-api@8.2.1)(typescript@6.0.3)(vue@3.5.41(typescript@6.0.3))
+      tdesign-vue-next:
+        specifier: 'catalog:'
+        version: 1.20.5(vue@3.5.41(typescript@6.0.3))
+      vue:
+        specifier: ^3.5.40
+        version: 3.5.41(typescript@6.0.3)
+      vue-router:
+        specifier: 'catalog:'
+        version: 5.2.0(@vue/compiler-sfc@3.5.41)(esbuild@0.28.2)(pinia@4.0.2(@vue/devtools-api@8.2.1)(typescript@6.0.3)(vue@3.5.41(typescript@6.0.3)))(rolldown@1.2.3)(rollup@4.62.4)(vite@8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0))(vue@3.5.41(typescript@6.0.3))
 
   internal/lint-configs/commitlint-config:
     dependencies:
       '@commitlint/cli':
         specifier: 'catalog:'
-        version: 19.6.1(@types/node@22.10.2)(typescript@5.7.2)
+        version: 21.2.1(@types/node@25.9.5)(conventional-commits-parser@7.1.2)(typescript@6.0.3)
       '@commitlint/config-conventional':
         specifier: 'catalog:'
-        version: 19.6.0
+        version: 21.2.0
       '@vben/node-utils':
         specifier: workspace:*
         version: link:../../node-utils
       commitlint-plugin-function-rules:
         specifier: 'catalog:'
-        version: 4.0.1(@commitlint/lint@19.6.0)
+        version: 5.0.1(@commitlint/lint@21.2.0)
       cz-git:
         specifier: 'catalog:'
-        version: 1.11.0
+        version: 1.13.1
       czg:
         specifier: 'catalog:'
-        version: 1.11.0
+        version: 1.13.1
 
   internal/lint-configs/eslint-config:
     dependencies:
-      eslint-config-turbo:
-        specifier: 'catalog:'
-        version: 2.3.3(eslint@9.17.0(jiti@2.4.2))
-      eslint-plugin-command:
-        specifier: 'catalog:'
-        version: 0.2.7(eslint@9.17.0(jiti@2.4.2))
-      eslint-plugin-import-x:
-        specifier: 'catalog:'
-        version: 4.6.1(eslint@9.17.0(jiti@2.4.2))(typescript@5.7.2)
-    devDependencies:
       '@eslint/js':
         specifier: 'catalog:'
-        version: 9.17.0
-      '@types/eslint':
-        specifier: 'catalog:'
-        version: 9.6.1
-      '@typescript-eslint/eslint-plugin':
-        specifier: 'catalog:'
-        version: 8.18.1(@typescript-eslint/parser@8.18.1(eslint@9.17.0(jiti@2.4.2))(typescript@5.7.2))(eslint@9.17.0(jiti@2.4.2))(typescript@5.7.2)
+        version: 10.0.1(eslint@10.8.1(jiti@2.7.0)(supports-color@10.2.2))
       '@typescript-eslint/parser':
         specifier: 'catalog:'
-        version: 8.18.1(eslint@9.17.0(jiti@2.4.2))(typescript@5.7.2)
+        version: 8.66.0(eslint@10.8.1(jiti@2.7.0)(supports-color@10.2.2))(supports-color@10.2.2)(typescript@6.0.3)
+      '@vben/oxlint-config':
+        specifier: workspace:*
+        version: link:../oxlint-config
       eslint:
         specifier: 'catalog:'
-        version: 9.17.0(jiti@2.4.2)
-      eslint-plugin-eslint-comments:
-        specifier: 'catalog:'
-        version: 3.2.0(eslint@9.17.0(jiti@2.4.2))
-      eslint-plugin-jsdoc:
-        specifier: 'catalog:'
-        version: 50.6.1(eslint@9.17.0(jiti@2.4.2))
+        version: 10.8.1(jiti@2.7.0)(supports-color@10.2.2)
       eslint-plugin-jsonc:
         specifier: 'catalog:'
-        version: 2.18.2(eslint@9.17.0(jiti@2.4.2))
+        version: 3.4.1(eslint@10.8.1(jiti@2.7.0)(supports-color@10.2.2))
       eslint-plugin-n:
         specifier: 'catalog:'
-        version: 17.15.1(eslint@9.17.0(jiti@2.4.2))
-      eslint-plugin-no-only-tests:
-        specifier: 'catalog:'
-        version: 3.3.0
+        version: 18.3.0(eslint@10.8.1(jiti@2.7.0)(supports-color@10.2.2))(typescript@6.0.3)
       eslint-plugin-perfectionist:
         specifier: 'catalog:'
-        version: 3.9.1(eslint@9.17.0(jiti@2.4.2))(typescript@5.7.2)(vue-eslint-parser@9.4.3(eslint@9.17.0(jiti@2.4.2)))
-      eslint-plugin-prettier:
+        version: 5.10.1(eslint@10.8.1(jiti@2.7.0)(supports-color@10.2.2))(supports-color@10.2.2)(typescript@6.0.3)
+      eslint-plugin-pnpm:
         specifier: 'catalog:'
-        version: 5.2.1(@types/eslint@9.6.1)(eslint@9.17.0(jiti@2.4.2))(prettier@3.4.2)
-      eslint-plugin-regexp:
-        specifier: 'catalog:'
-        version: 2.7.0(eslint@9.17.0(jiti@2.4.2))
-      eslint-plugin-unicorn:
-        specifier: 'catalog:'
-        version: 56.0.1(eslint@9.17.0(jiti@2.4.2))
+        version: 1.7.0(eslint@10.8.1(jiti@2.7.0)(supports-color@10.2.2))
       eslint-plugin-unused-imports:
         specifier: 'catalog:'
-        version: 4.1.4(@typescript-eslint/eslint-plugin@8.18.1(@typescript-eslint/parser@8.18.1(eslint@9.17.0(jiti@2.4.2))(typescript@5.7.2))(eslint@9.17.0(jiti@2.4.2))(typescript@5.7.2))(eslint@9.17.0(jiti@2.4.2))
-      eslint-plugin-vitest:
-        specifier: 'catalog:'
-        version: 0.5.4(@typescript-eslint/eslint-plugin@8.18.1(@typescript-eslint/parser@8.18.1(eslint@9.17.0(jiti@2.4.2))(typescript@5.7.2))(eslint@9.17.0(jiti@2.4.2))(typescript@5.7.2))(eslint@9.17.0(jiti@2.4.2))(typescript@5.7.2)(vitest@2.1.8(@types/node@22.10.2)(happy-dom@15.11.7)(less@4.2.1)(sass@1.80.6)(terser@5.37.0))
+        version: 4.4.1(eslint@10.8.1(jiti@2.7.0)(supports-color@10.2.2))
       eslint-plugin-vue:
         specifier: 'catalog:'
-        version: 9.32.0(eslint@9.17.0(jiti@2.4.2))
+        version: 10.10.0(@typescript-eslint/parser@8.66.0(eslint@10.8.1(jiti@2.7.0)(supports-color@10.2.2))(supports-color@10.2.2)(typescript@6.0.3))(eslint@10.8.1(jiti@2.7.0)(supports-color@10.2.2))(vue-eslint-parser@10.4.1(eslint@10.8.1(jiti@2.7.0)(supports-color@10.2.2))(supports-color@10.2.2))
+      eslint-plugin-yml:
+        specifier: 'catalog:'
+        version: 3.8.1(eslint@10.8.1(jiti@2.7.0)(supports-color@10.2.2))
       globals:
         specifier: 'catalog:'
-        version: 15.14.0
-      jsonc-eslint-parser:
-        specifier: 'catalog:'
-        version: 2.4.0
+        version: 17.9.0
       vue-eslint-parser:
         specifier: 'catalog:'
-        version: 9.4.3(eslint@9.17.0(jiti@2.4.2))
+        version: 10.4.1(eslint@10.8.1(jiti@2.7.0)(supports-color@10.2.2))(supports-color@10.2.2)
+      yaml-eslint-parser:
+        specifier: 'catalog:'
+        version: 2.1.0
 
-  internal/lint-configs/prettier-config:
+  internal/lint-configs/oxfmt-config:
     dependencies:
-      prettier:
+      oxfmt:
         specifier: 'catalog:'
-        version: 3.4.2
-      prettier-plugin-tailwindcss:
+        version: 0.60.0
+
+  internal/lint-configs/oxlint-config:
+    dependencies:
+      '@eslint-community/eslint-plugin-eslint-comments':
         specifier: 'catalog:'
-        version: 0.6.9(prettier@3.4.2)
+        version: 4.7.2(eslint@10.8.1(jiti@2.7.0)(supports-color@10.2.2))
+      eslint-plugin-better-tailwindcss:
+        specifier: 'catalog:'
+        version: 4.7.0(eslint@10.8.1(jiti@2.7.0)(supports-color@10.2.2))(oxlint@1.77.0(oxlint-tsgolint@0.25.0))(tailwindcss@4.3.3)(typescript@6.0.3)
+      eslint-plugin-command:
+        specifier: 'catalog:'
+        version: 3.5.3(@typescript-eslint/typescript-estree@8.66.0(supports-color@10.2.2)(typescript@6.0.3))(@typescript-eslint/utils@8.66.0(eslint@10.8.1(jiti@2.7.0)(supports-color@10.2.2))(supports-color@10.2.2)(typescript@6.0.3))(eslint@10.8.1(jiti@2.7.0)(supports-color@10.2.2))
+      oxlint:
+        specifier: 'catalog:'
+        version: 1.77.0(oxlint-tsgolint@0.25.0)
 
   internal/lint-configs/stylelint-config:
     dependencies:
       '@stylistic/stylelint-plugin':
         specifier: 'catalog:'
-        version: 3.1.1(stylelint@16.12.0(typescript@5.7.2))
+        version: 5.3.0(stylelint@17.14.1(supports-color@10.2.2)(typescript@6.0.3))
       stylelint-config-recess-order:
         specifier: 'catalog:'
-        version: 5.1.1(stylelint@16.12.0(typescript@5.7.2))
+        version: 7.7.0(stylelint-order@8.1.1(stylelint@17.14.1(supports-color@10.2.2)(typescript@6.0.3)))(stylelint@17.14.1(supports-color@10.2.2)(typescript@6.0.3))
       stylelint-scss:
         specifier: 'catalog:'
-        version: 6.10.0(stylelint@16.12.0(typescript@5.7.2))
+        version: 7.2.0(stylelint@17.14.1(supports-color@10.2.2)(typescript@6.0.3))
     devDependencies:
       postcss:
         specifier: 'catalog:'
-        version: 8.4.49
+        version: 8.5.26
       postcss-html:
         specifier: 'catalog:'
-        version: 1.7.0
+        version: 1.8.1
       postcss-scss:
         specifier: 'catalog:'
-        version: 4.0.9(postcss@8.4.49)
-      prettier:
-        specifier: 'catalog:'
-        version: 3.4.2
+        version: 4.0.9(postcss@8.5.26)
       stylelint:
         specifier: 'catalog:'
-        version: 16.12.0(typescript@5.7.2)
+        version: 17.14.1(supports-color@10.2.2)(typescript@6.0.3)
       stylelint-config-recommended:
         specifier: 'catalog:'
-        version: 14.0.1(stylelint@16.12.0(typescript@5.7.2))
+        version: 18.0.0(stylelint@17.14.1(supports-color@10.2.2)(typescript@6.0.3))
       stylelint-config-recommended-scss:
         specifier: 'catalog:'
-        version: 14.1.0(postcss@8.4.49)(stylelint@16.12.0(typescript@5.7.2))
+        version: 17.0.1(postcss@8.5.26)(stylelint@17.14.1(supports-color@10.2.2)(typescript@6.0.3))
       stylelint-config-recommended-vue:
         specifier: 'catalog:'
-        version: 1.5.0(postcss-html@1.7.0)(stylelint@16.12.0(typescript@5.7.2))
+        version: 1.6.1(postcss-html@1.8.1)(stylelint@17.14.1(supports-color@10.2.2)(typescript@6.0.3))
       stylelint-config-standard:
         specifier: 'catalog:'
-        version: 36.0.1(stylelint@16.12.0(typescript@5.7.2))
+        version: 40.0.0(stylelint@17.14.1(supports-color@10.2.2)(typescript@6.0.3))
       stylelint-order:
         specifier: 'catalog:'
-        version: 6.0.4(stylelint@16.12.0(typescript@5.7.2))
-      stylelint-prettier:
-        specifier: 'catalog:'
-        version: 5.0.2(prettier@3.4.2)(stylelint@16.12.0(typescript@5.7.2))
+        version: 8.1.1(stylelint@17.14.1(supports-color@10.2.2)(typescript@6.0.3))
 
   internal/node-utils:
     dependencies:
       '@changesets/git':
         specifier: 'catalog:'
-        version: 3.0.2
+        version: 3.0.4
       '@manypkg/get-packages':
         specifier: 'catalog:'
-        version: 2.2.2
+        version: 3.1.0
       chalk:
         specifier: 'catalog:'
-        version: 5.4.0
+        version: 5.6.2
       consola:
         specifier: 'catalog:'
-        version: 3.3.0
+        version: 3.4.2
       dayjs:
         specifier: 'catalog:'
-        version: 1.11.13
+        version: 1.11.21
       execa:
         specifier: 'catalog:'
-        version: 9.5.2
+        version: 10.0.1
       find-up:
         specifier: 'catalog:'
-        version: 7.0.0
+        version: 8.0.0
       ora:
         specifier: 'catalog:'
-        version: 8.1.1
+        version: 9.4.1
       pkg-types:
         specifier: 'catalog:'
-        version: 1.2.1
-      prettier:
-        specifier: 'catalog:'
-        version: 3.4.2
+        version: 2.3.1
       rimraf:
         specifier: 'catalog:'
-        version: 6.0.1
+        version: 6.1.3
 
   internal/tailwind-config:
     dependencies:
-      '@iconify/json':
+      '@iconify/tailwind4':
         specifier: 'catalog:'
-        version: 2.2.286
-      '@iconify/tailwind':
-        specifier: 'catalog:'
-        version: 1.2.0
-      '@manypkg/get-packages':
-        specifier: 'catalog:'
-        version: 2.2.2
-      '@tailwindcss/nesting':
-        specifier: 'catalog:'
-        version: 0.0.0-insiders.565cd3e(postcss@8.4.49)
+        version: 1.2.3(tailwindcss@4.3.3)
       '@tailwindcss/typography':
         specifier: 'catalog:'
-        version: 0.5.15(tailwindcss@3.4.17)
-      autoprefixer:
-        specifier: 'catalog:'
-        version: 10.4.20(postcss@8.4.49)
-      cssnano:
-        specifier: 'catalog:'
-        version: 7.0.6(postcss@8.4.49)
-      postcss:
-        specifier: 'catalog:'
-        version: 8.4.49
-      postcss-antd-fixes:
-        specifier: 'catalog:'
-        version: 0.2.0(postcss@8.4.49)
-      postcss-import:
-        specifier: 'catalog:'
-        version: 16.1.0(postcss@8.4.49)
-      postcss-preset-env:
-        specifier: 'catalog:'
-        version: 10.1.2(postcss@8.4.49)
+        version: 0.5.20(tailwindcss@4.3.3)
       tailwindcss:
         specifier: 'catalog:'
-        version: 3.4.17
-      tailwindcss-animate:
+        version: 4.3.3
+      tw-animate-css:
         specifier: 'catalog:'
-        version: 1.0.7(tailwindcss@3.4.17)
-    devDependencies:
-      '@types/postcss-import':
-        specifier: 'catalog:'
-        version: 14.0.3
+        version: 1.4.0
 
   internal/tsconfig:
     dependencies:
@@ -917,139 +1083,140 @@ importers:
         version: link:../../packages/types
       vite:
         specifier: 'catalog:'
-        version: 6.0.5(@types/node@22.10.2)(jiti@2.4.2)(less@4.2.1)(sass@1.80.6)(terser@5.37.0)(yaml@2.6.1)
+        version: 8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0)
 
   internal/vite-config:
     dependencies:
       '@intlify/unplugin-vue-i18n':
         specifier: 'catalog:'
-        version: 6.0.1(@vue/compiler-dom@3.5.13)(eslint@9.17.0(jiti@2.4.2))(rollup@4.28.1)(typescript@5.7.2)(vue-i18n@10.0.5(vue@3.5.13(typescript@5.7.2)))(vue@3.5.13(typescript@5.7.2))
+        version: 11.2.4(@vue/compiler-dom@3.5.41)(eslint@10.8.1(jiti@2.7.0)(supports-color@10.2.2))(rollup@4.62.4)(supports-color@10.2.2)(typescript@6.0.3)(vite@8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0))(vue-i18n@11.4.8(vue@3.5.41(typescript@6.0.3)))(vue@3.5.41(typescript@6.0.3))
       '@jspm/generator':
         specifier: 'catalog:'
-        version: 2.4.1
+        version: 2.16.3(supports-color@10.2.2)
+      '@tailwindcss/vite':
+        specifier: 'catalog:'
+        version: 4.3.3(vite@8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0))
+      '@vben/node-utils':
+        specifier: workspace:*
+        version: link:../node-utils
       archiver:
         specifier: 'catalog:'
-        version: 7.0.1
+        version: 8.0.0
       cheerio:
         specifier: 'catalog:'
-        version: 1.0.0
+        version: 1.2.0
       get-port:
         specifier: 'catalog:'
-        version: 7.1.0
+        version: 7.2.0
       html-minifier-terser:
         specifier: 'catalog:'
         version: 7.2.0
       nitropack:
         specifier: 'catalog:'
-        version: 2.10.4(encoding@0.1.13)(typescript@5.7.2)
+        version: 2.13.4(@parcel/watcher@2.6.0)(oxc-parser@0.142.0)(rolldown@1.2.3)(supports-color@10.2.2)(vite@8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0))
       resolve.exports:
         specifier: 'catalog:'
         version: 2.0.3
       vite-plugin-pwa:
         specifier: 'catalog:'
-        version: 0.21.1(vite@6.0.5(@types/node@22.10.2)(jiti@2.4.2)(less@4.2.1)(sass@1.80.6)(terser@5.37.0)(yaml@2.6.1))(workbox-build@7.3.0)(workbox-window@7.3.0)
+        version: 1.3.0(supports-color@10.2.2)(vite@8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0))(workbox-build@7.4.1(supports-color@10.2.2))(workbox-window@7.4.1)
       vite-plugin-vue-devtools:
         specifier: 'catalog:'
-        version: 7.6.8(rollup@4.28.1)(vite@6.0.5(@types/node@22.10.2)(jiti@2.4.2)(less@4.2.1)(sass@1.80.6)(terser@5.37.0)(yaml@2.6.1))(vue@3.5.13(typescript@5.7.2))
+        version: 8.2.1(@nuxt/kit@3.21.11(magicast@0.5.4))(supports-color@10.2.2)(vite@8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0))(vue@3.5.41(typescript@6.0.3))
     devDependencies:
       '@pnpm/workspace.read-manifest':
         specifier: 'catalog:'
-        version: 1000.0.1
+        version: 1000.3.1
       '@types/archiver':
         specifier: 'catalog:'
-        version: 6.0.3
+        version: 8.0.0
       '@types/html-minifier-terser':
         specifier: 'catalog:'
         version: 7.0.2
-      '@vben/node-utils':
-        specifier: workspace:*
-        version: link:../node-utils
       '@vitejs/plugin-vue':
         specifier: 'catalog:'
-        version: 5.2.1(vite@6.0.5(@types/node@22.10.2)(jiti@2.4.2)(less@4.2.1)(sass@1.80.6)(terser@5.37.0)(yaml@2.6.1))(vue@3.5.13(typescript@5.7.2))
+        version: 6.0.8(vite@8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0))(vue@3.5.41(typescript@6.0.3))
       '@vitejs/plugin-vue-jsx':
         specifier: 'catalog:'
-        version: 4.1.1(vite@6.0.5(@types/node@22.10.2)(jiti@2.4.2)(less@4.2.1)(sass@1.80.6)(terser@5.37.0)(yaml@2.6.1))(vue@3.5.13(typescript@5.7.2))
+        version: 5.1.6(supports-color@10.2.2)(vite@8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0))(vue@3.5.41(typescript@6.0.3))
       dayjs:
         specifier: 'catalog:'
-        version: 1.11.13
+        version: 1.11.21
       dotenv:
         specifier: 'catalog:'
-        version: 16.4.7
-      rollup:
-        specifier: 'catalog:'
-        version: 4.28.1
+        version: 17.4.2
       rollup-plugin-visualizer:
         specifier: 'catalog:'
-        version: 5.12.0(rollup@4.28.1)
+        version: 7.0.1(rolldown@1.2.3)(rollup@4.62.4)
       sass:
         specifier: 'catalog:'
-        version: 1.80.6
+        version: 1.102.0
+      sass-embedded:
+        specifier: 'catalog:'
+        version: 1.100.0
+      unplugin-dts:
+        specifier: 'catalog:'
+        version: 1.0.3(@vue/language-core@3.3.9)(esbuild@0.28.2)(rolldown@1.2.3)(rollup@4.62.4)(supports-color@10.2.2)(typescript@6.0.3)(vite@8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0))
       vite:
         specifier: 'catalog:'
-        version: 6.0.5(@types/node@22.10.2)(jiti@2.4.2)(less@4.2.1)(sass@1.80.6)(terser@5.37.0)(yaml@2.6.1)
+        version: 8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0)
       vite-plugin-compression:
         specifier: 'catalog:'
-        version: 0.5.1(vite@6.0.5(@types/node@22.10.2)(jiti@2.4.2)(less@4.2.1)(sass@1.80.6)(terser@5.37.0)(yaml@2.6.1))
-      vite-plugin-dts:
-        specifier: 'catalog:'
-        version: 4.2.1(@types/node@22.10.2)(rollup@4.28.1)(typescript@5.7.2)(vite@6.0.5(@types/node@22.10.2)(jiti@2.4.2)(less@4.2.1)(sass@1.80.6)(terser@5.37.0)(yaml@2.6.1))
-      vite-plugin-html:
-        specifier: 'catalog:'
-        version: 3.2.2(vite@6.0.5(@types/node@22.10.2)(jiti@2.4.2)(less@4.2.1)(sass@1.80.6)(terser@5.37.0)(yaml@2.6.1))
+        version: 0.5.1(supports-color@10.2.2)(vite@8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0))
       vite-plugin-lazy-import:
         specifier: 'catalog:'
         version: 1.0.7
 
-  packages/@core/base/design: {}
+  packages/@core/base/design:
+    dependencies:
+      '@iconify/json':
+        specifier: 'catalog:'
+        version: 2.2.513
 
   packages/@core/base/icons:
     dependencies:
       '@iconify/vue':
         specifier: 'catalog:'
-        version: 4.2.0(vue@3.5.13(typescript@5.7.2))
-      lucide-vue-next:
+        version: 5.0.1(vue@3.5.41(typescript@6.0.3))
+      '@lucide/vue':
         specifier: 'catalog:'
-        version: 0.469.0(vue@3.5.13(typescript@5.7.2))
+        version: 1.31.0(vue@3.5.41(typescript@6.0.3))
       vue:
-        specifier: ^3.5.13
-        version: 3.5.13(typescript@5.7.2)
+        specifier: ^3.5.40
+        version: 3.5.41(typescript@6.0.3)
 
   packages/@core/base/shared:
     dependencies:
       '@ctrl/tinycolor':
-        specifier: ^4.1.0
-        version: 4.1.0
+        specifier: ^4.2.0
+        version: 4.2.0
       '@tanstack/vue-store':
         specifier: 'catalog:'
-        version: 0.6.0(vue@3.5.13(typescript@5.7.2))
+        version: 0.11.1(vue@3.5.41(typescript@6.0.3))
       '@vue/shared':
         specifier: 'catalog:'
-        version: 3.5.13
+        version: 3.5.41
       clsx:
         specifier: ^2.1.1
         version: 2.1.1
       dayjs:
         specifier: 'catalog:'
-        version: 1.11.13
+        version: 1.11.21
       defu:
         specifier: 'catalog:'
-        version: 6.1.4
+        version: 6.1.7
+      es-toolkit:
+        specifier: 'catalog:'
+        version: 1.50.0
       lodash.clonedeep:
         specifier: 'catalog:'
         version: 4.5.0
-      lodash.get:
-        specifier: 'catalog:'
-        version: 4.4.2
-      lodash.isequal:
-        specifier: 'catalog:'
-        version: 4.5.0
       nprogress:
         specifier: 'catalog:'
         version: 0.2.0
       tailwind-merge:
         specifier: 'catalog:'
-        version: 2.5.5
+        version: 3.6.0
       theme-colors:
         specifier: 'catalog:'
         version: 0.1.0
@@ -1057,12 +1224,6 @@ importers:
       '@types/lodash.clonedeep':
         specifier: 'catalog:'
         version: 4.5.9
-      '@types/lodash.get':
-        specifier: 'catalog:'
-        version: 4.4.9
-      '@types/lodash.isequal':
-        specifier: 'catalog:'
-        version: 4.5.8
       '@types/nprogress':
         specifier: 'catalog:'
         version: 0.2.3
@@ -1070,11 +1231,11 @@ importers:
   packages/@core/base/typings:
     dependencies:
       vue:
-        specifier: ^3.5.13
-        version: 3.5.13(typescript@5.7.2)
+        specifier: ^3.5.40
+        version: 3.5.41(typescript@6.0.3)
       vue-router:
         specifier: 'catalog:'
-        version: 4.5.0(vue@3.5.13(typescript@5.7.2))
+        version: 5.2.0(@vue/compiler-sfc@3.5.41)(esbuild@0.28.2)(pinia@4.0.2(@vue/devtools-api@8.2.1)(typescript@6.0.3)(vue@3.5.41(typescript@6.0.3)))(rolldown@1.2.3)(rollup@4.62.4)(vite@8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0))(vue@3.5.41(typescript@6.0.3))
 
   packages/@core/composables:
     dependencies:
@@ -1083,20 +1244,20 @@ importers:
         version: link:../base/shared
       '@vueuse/core':
         specifier: 'catalog:'
-        version: 12.0.0(typescript@5.7.2)
-      radix-vue:
+        version: 14.4.0(vue@3.5.41(typescript@6.0.3))
+      reka-ui:
         specifier: 'catalog:'
-        version: 1.9.11(vue@3.5.13(typescript@5.7.2))
+        version: 2.10.3(vue@3.5.41(typescript@6.0.3))
       sortablejs:
         specifier: 'catalog:'
-        version: 1.15.6
+        version: 1.15.7
       vue:
-        specifier: ^3.5.13
-        version: 3.5.13(typescript@5.7.2)
+        specifier: ^3.5.40
+        version: 3.5.41(typescript@6.0.3)
     devDependencies:
       '@types/sortablejs':
         specifier: 'catalog:'
-        version: 1.15.8
+        version: 1.15.9
 
   packages/@core/preferences:
     dependencies:
@@ -1108,16 +1269,25 @@ importers:
         version: link:../base/typings
       '@vueuse/core':
         specifier: 'catalog:'
-        version: 12.0.0(typescript@5.7.2)
+        version: 14.4.0(vue@3.5.41(typescript@6.0.3))
       vue:
-        specifier: ^3.5.13
-        version: 3.5.13(typescript@5.7.2)
+        specifier: ^3.5.40
+        version: 3.5.41(typescript@6.0.3)
 
   packages/@core/ui-kit/form-ui:
     dependencies:
+      '@tanstack/store':
+        specifier: 'catalog:'
+        version: 0.11.1
+      '@tanstack/vue-form':
+        specifier: 'catalog:'
+        version: 1.33.4(vue@3.5.41(typescript@6.0.3))
       '@vben-core/composables':
         specifier: workspace:*
         version: link:../../composables
+      '@vben-core/icons':
+        specifier: workspace:*
+        version: link:../../base/icons
       '@vben-core/shadcn-ui':
         specifier: workspace:*
         version: link:../shadcn-ui
@@ -1127,24 +1297,25 @@ importers:
       '@vben-core/typings':
         specifier: workspace:*
         version: link:../../base/typings
-      '@vee-validate/zod':
-        specifier: 'catalog:'
-        version: 4.14.7(vue@3.5.13(typescript@5.7.2))
       '@vueuse/core':
         specifier: 'catalog:'
-        version: 12.0.0(typescript@5.7.2)
-      vee-validate:
-        specifier: 'catalog:'
-        version: 4.14.7(vue@3.5.13(typescript@5.7.2))
+        version: 14.4.0(vue@3.5.41(typescript@6.0.3))
       vue:
-        specifier: ^3.5.13
-        version: 3.5.13(typescript@5.7.2)
+        specifier: ^3.5.40
+        version: 3.5.41(typescript@6.0.3)
       zod:
         specifier: 'catalog:'
-        version: 3.24.1
+        version: 4.4.3
       zod-defaults:
         specifier: 'catalog:'
-        version: 0.1.3(zod@3.24.1)
+        version: 0.2.3(zod@4.4.3)
+    devDependencies:
+      '@vue/test-utils':
+        specifier: 'catalog:'
+        version: 2.4.11(@vue/compiler-dom@3.5.41)(@vue/server-renderer@3.5.41)(vue@3.5.41(typescript@6.0.3))
+      unplugin-vue:
+        specifier: 'catalog:'
+        version: 7.2.0(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(rolldown@1.2.3)(rollup@4.62.4)(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(vue@3.5.41(typescript@6.0.3))(yaml@2.9.0)
 
   packages/@core/ui-kit/layout-ui:
     dependencies:
@@ -1165,16 +1336,23 @@ importers:
         version: link:../../base/typings
       '@vueuse/core':
         specifier: 'catalog:'
-        version: 12.0.0(typescript@5.7.2)
+        version: 14.4.0(vue@3.5.41(typescript@6.0.3))
       vue:
-        specifier: ^3.5.13
-        version: 3.5.13(typescript@5.7.2)
+        specifier: ^3.5.40
+        version: 3.5.41(typescript@6.0.3)
+    devDependencies:
+      unplugin-vue:
+        specifier: 'catalog:'
+        version: 7.2.0(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(rolldown@1.2.3)(rollup@4.62.4)(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(vue@3.5.41(typescript@6.0.3))(yaml@2.9.0)
 
   packages/@core/ui-kit/menu-ui:
     dependencies:
       '@vben-core/composables':
         specifier: workspace:*
         version: link:../../composables
+      '@vben-core/design':
+        specifier: workspace:*
+        version: link:../../base/design
       '@vben-core/icons':
         specifier: workspace:*
         version: link:../../base/icons
@@ -1189,10 +1367,20 @@ importers:
         version: link:../../base/typings
       '@vueuse/core':
         specifier: 'catalog:'
-        version: 12.0.0(typescript@5.7.2)
+        version: 14.4.0(vue@3.5.41(typescript@6.0.3))
+      qs:
+        specifier: 'catalog:'
+        version: 6.15.3
       vue:
-        specifier: ^3.5.13
-        version: 3.5.13(typescript@5.7.2)
+        specifier: ^3.5.40
+        version: 3.5.41(typescript@6.0.3)
+    devDependencies:
+      '@types/qs':
+        specifier: 'catalog:'
+        version: 6.15.1
+      unplugin-vue:
+        specifier: 'catalog:'
+        version: 7.2.0(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(rolldown@1.2.3)(rollup@4.62.4)(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(vue@3.5.41(typescript@6.0.3))(yaml@2.9.0)
 
   packages/@core/ui-kit/popup-ui:
     dependencies:
@@ -1202,6 +1390,9 @@ importers:
       '@vben-core/icons':
         specifier: workspace:*
         version: link:../../base/icons
+      '@vben-core/preferences':
+        specifier: workspace:*
+        version: link:../../preferences
       '@vben-core/shadcn-ui':
         specifier: workspace:*
         version: link:../shadcn-ui
@@ -1213,16 +1404,26 @@ importers:
         version: link:../../base/typings
       '@vueuse/core':
         specifier: 'catalog:'
-        version: 12.0.0(typescript@5.7.2)
+        version: 14.4.0(vue@3.5.41(typescript@6.0.3))
       vue:
-        specifier: ^3.5.13
-        version: 3.5.13(typescript@5.7.2)
+        specifier: ^3.5.40
+        version: 3.5.41(typescript@6.0.3)
+    devDependencies:
+      unplugin-vue:
+        specifier: 'catalog:'
+        version: 7.2.0(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(rolldown@1.2.3)(rollup@4.62.4)(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(vue@3.5.41(typescript@6.0.3))(yaml@2.9.0)
 
   packages/@core/ui-kit/shadcn-ui:
     dependencies:
+      '@lucide/vue':
+        specifier: 'catalog:'
+        version: 1.31.0(vue@3.5.41(typescript@6.0.3))
       '@vben-core/composables':
         specifier: workspace:*
         version: link:../../composables
+      '@vben-core/design':
+        specifier: workspace:*
+        version: link:../../base/design
       '@vben-core/icons':
         specifier: workspace:*
         version: link:../../base/icons
@@ -1234,28 +1435,25 @@ importers:
         version: link:../../base/typings
       '@vueuse/core':
         specifier: 'catalog:'
-        version: 12.0.0(typescript@5.7.2)
+        version: 14.4.0(vue@3.5.41(typescript@6.0.3))
       class-variance-authority:
         specifier: 'catalog:'
         version: 0.7.1
-      lucide-vue-next:
+      reka-ui:
         specifier: 'catalog:'
-        version: 0.469.0(vue@3.5.13(typescript@5.7.2))
-      radix-vue:
-        specifier: 'catalog:'
-        version: 1.9.11(vue@3.5.13(typescript@5.7.2))
-      vee-validate:
-        specifier: 'catalog:'
-        version: 4.14.7(vue@3.5.13(typescript@5.7.2))
+        version: 2.10.3(vue@3.5.41(typescript@6.0.3))
       vue:
-        specifier: ^3.5.13
-        version: 3.5.13(typescript@5.7.2)
+        specifier: ^3.5.40
+        version: 3.5.41(typescript@6.0.3)
 
   packages/@core/ui-kit/tabs-ui:
     dependencies:
       '@vben-core/composables':
         specifier: workspace:*
         version: link:../../composables
+      '@vben-core/design':
+        specifier: workspace:*
+        version: link:../../base/design
       '@vben-core/icons':
         specifier: workspace:*
         version: link:../../base/icons
@@ -1267,10 +1465,14 @@ importers:
         version: link:../../base/typings
       '@vueuse/core':
         specifier: 'catalog:'
-        version: 12.0.0(typescript@5.7.2)
+        version: 14.4.0(vue@3.5.41(typescript@6.0.3))
       vue:
-        specifier: ^3.5.13
-        version: 3.5.13(typescript@5.7.2)
+        specifier: ^3.5.40
+        version: 3.5.41(typescript@6.0.3)
+    devDependencies:
+      unplugin-vue:
+        specifier: 'catalog:'
+        version: 7.2.0(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(rolldown@1.2.3)(rollup@4.62.4)(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(vue@3.5.41(typescript@6.0.3))(yaml@2.9.0)
 
   packages/constants:
     dependencies:
@@ -1293,11 +1495,14 @@ importers:
         specifier: workspace:*
         version: link:../../utils
       vue:
-        specifier: ^3.5.13
-        version: 3.5.13(typescript@5.7.2)
+        specifier: ^3.5.40
+        version: 3.5.41(typescript@6.0.3)
 
   packages/effects/common-ui:
     dependencies:
+      '@vben-core/design':
+        specifier: workspace:*
+        version: link:../../@core/base/design
       '@vben-core/form-ui':
         specifier: workspace:*
         version: link:../../@core/ui-kit/form-ui
@@ -1330,23 +1535,41 @@ importers:
         version: link:../../types
       '@vueuse/core':
         specifier: 'catalog:'
-        version: 12.0.0(typescript@5.7.2)
+        version: 14.4.0(vue@3.5.41(typescript@6.0.3))
       '@vueuse/integrations':
         specifier: 'catalog:'
-        version: 12.0.0(async-validator@4.2.5)(axios@1.10.0)(change-case@5.4.4)(focus-trap@7.6.2)(nprogress@0.2.0)(qrcode@1.5.4)(sortablejs@1.15.6)(typescript@5.7.2)
+        version: 14.4.0(async-validator@4.2.5)(axios@1.19.0(debug@4.4.3(supports-color@10.2.2))(supports-color@10.2.2))(nprogress@0.2.0)(qrcode@1.5.4)(sortablejs@1.15.7)(vue@3.5.41(typescript@6.0.3))
+      json-bigint:
+        specifier: 'catalog:'
+        version: 1.0.0
       qrcode:
         specifier: 'catalog:'
         version: 1.5.4
+      tippy.js:
+        specifier: 'catalog:'
+        version: 6.3.7
       vue:
-        specifier: ^3.5.13
-        version: 3.5.13(typescript@5.7.2)
+        specifier: ^3.5.40
+        version: 3.5.41(typescript@6.0.3)
+      vue-json-pretty:
+        specifier: 'catalog:'
+        version: 2.6.0(vue@3.5.41(typescript@6.0.3))
       vue-router:
         specifier: 'catalog:'
-        version: 4.5.0(vue@3.5.13(typescript@5.7.2))
+        version: 5.2.0(@vue/compiler-sfc@3.5.41)(esbuild@0.28.2)(pinia@4.0.2(@vue/devtools-api@8.2.1)(typescript@6.0.3)(vue@3.5.41(typescript@6.0.3)))(rolldown@1.2.3)(rollup@4.62.4)(vite@8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0))(vue@3.5.41(typescript@6.0.3))
+      vue-tippy:
+        specifier: 'catalog:'
+        version: 6.7.1(vue@3.5.41(typescript@6.0.3))
     devDependencies:
+      '@types/json-bigint':
+        specifier: 'catalog:'
+        version: 1.0.4
       '@types/qrcode':
         specifier: 'catalog:'
-        version: 1.5.5
+        version: 1.5.6
+      '@vue/test-utils':
+        specifier: 'catalog:'
+        version: 2.4.11(@vue/compiler-dom@3.5.41)(@vue/server-renderer@3.5.41)(vue@3.5.41(typescript@6.0.3))
 
   packages/effects/hooks:
     dependencies:
@@ -1367,22 +1590,28 @@ importers:
         version: link:../../utils
       '@vueuse/core':
         specifier: 'catalog:'
-        version: 12.0.0(typescript@5.7.2)
+        version: 14.4.0(vue@3.5.41(typescript@6.0.3))
       vue:
-        specifier: ^3.5.13
-        version: 3.5.13(typescript@5.7.2)
+        specifier: ^3.5.40
+        version: 3.5.41(typescript@6.0.3)
       vue-router:
         specifier: 'catalog:'
-        version: 4.5.0(vue@3.5.13(typescript@5.7.2))
+        version: 5.2.0(@vue/compiler-sfc@3.5.41)(esbuild@0.28.2)(pinia@4.0.2(@vue/devtools-api@8.2.1)(typescript@6.0.3)(vue@3.5.41(typescript@6.0.3)))(rolldown@1.2.3)(rollup@4.62.4)(vite@8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0))(vue@3.5.41(typescript@6.0.3))
       watermark-js-plus:
         specifier: 'catalog:'
-        version: 1.5.7
+        version: 1.6.6
 
   packages/effects/layouts:
     dependencies:
+      '@types/sortablejs':
+        specifier: 'catalog:'
+        version: 1.15.9
       '@vben-core/composables':
         specifier: workspace:*
         version: link:../../@core/composables
+      '@vben-core/design':
+        specifier: workspace:*
+        version: link:../../@core/base/design
       '@vben-core/form-ui':
         specifier: workspace:*
         version: link:../../@core/ui-kit/form-ui
@@ -1430,19 +1659,64 @@ importers:
         version: link:../../utils
       '@vueuse/core':
         specifier: 'catalog:'
-        version: 12.0.0(typescript@5.7.2)
+        version: 14.4.0(vue@3.5.41(typescript@6.0.3))
+      sortablejs:
+        specifier: 'catalog:'
+        version: 1.15.7
       vue:
-        specifier: ^3.5.13
-        version: 3.5.13(typescript@5.7.2)
+        specifier: ^3.5.40
+        version: 3.5.41(typescript@6.0.3)
       vue-router:
         specifier: 'catalog:'
-        version: 4.5.0(vue@3.5.13(typescript@5.7.2))
+        version: 5.2.0(@vue/compiler-sfc@3.5.41)(esbuild@0.28.2)(pinia@4.0.2(@vue/devtools-api@8.2.1)(typescript@6.0.3)(vue@3.5.41(typescript@6.0.3)))(rolldown@1.2.3)(rollup@4.62.4)(vite@8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0))(vue@3.5.41(typescript@6.0.3))
 
   packages/effects/plugins:
     dependencies:
+      '@tiptap/core':
+        specifier: 'catalog:'
+        version: 3.29.2(@tiptap/pm@3.29.2)
+      '@tiptap/extension-document':
+        specifier: 'catalog:'
+        version: 3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))
+      '@tiptap/extension-highlight':
+        specifier: 'catalog:'
+        version: 3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))
+      '@tiptap/extension-image':
+        specifier: 'catalog:'
+        version: 3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))
+      '@tiptap/extension-link':
+        specifier: 'catalog:'
+        version: 3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))(@tiptap/pm@3.29.2)
+      '@tiptap/extension-placeholder':
+        specifier: 'catalog:'
+        version: 3.29.2(@tiptap/extensions@3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))(@tiptap/pm@3.29.2))
+      '@tiptap/extension-text-align':
+        specifier: 'catalog:'
+        version: 3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))
+      '@tiptap/extension-text-style':
+        specifier: 'catalog:'
+        version: 3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))
+      '@tiptap/extension-underline':
+        specifier: 'catalog:'
+        version: 3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))
+      '@tiptap/pm':
+        specifier: 'catalog:'
+        version: 3.29.2
+      '@tiptap/starter-kit':
+        specifier: 'catalog:'
+        version: 3.29.2
+      '@tiptap/vue-3':
+        specifier: 'catalog:'
+        version: 3.29.2(@floating-ui/dom@1.8.0)(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))(@tiptap/pm@3.29.2)(vue@3.5.41(typescript@6.0.3))
+      '@vben-core/design':
+        specifier: workspace:*
+        version: link:../../@core/base/design
       '@vben-core/form-ui':
         specifier: workspace:*
         version: link:../../@core/ui-kit/form-ui
+      '@vben-core/popup-ui':
+        specifier: workspace:*
+        version: link:../../@core/ui-kit/popup-ui
       '@vben-core/shadcn-ui':
         specifier: workspace:*
         version: link:../../@core/ui-kit/shadcn-ui
@@ -1469,19 +1743,22 @@ importers:
         version: link:../../utils
       '@vueuse/core':
         specifier: 'catalog:'
-        version: 12.0.0(typescript@5.7.2)
+        version: 14.4.0(vue@3.5.41(typescript@6.0.3))
+      '@vueuse/motion':
+        specifier: 'catalog:'
+        version: 3.0.3(magicast@0.5.4)(vue@3.5.41(typescript@6.0.3))
       echarts:
         specifier: 'catalog:'
-        version: 5.5.1
+        version: 6.1.0
       vue:
-        specifier: ^3.5.13
-        version: 3.5.13(typescript@5.7.2)
+        specifier: ^3.5.40
+        version: 3.5.41(typescript@6.0.3)
       vxe-pc-ui:
         specifier: 'catalog:'
-        version: 4.3.40(vue@3.5.13(typescript@5.7.2))
+        version: 4.16.27(vue@3.5.41(typescript@6.0.3))
       vxe-table:
         specifier: 'catalog:'
-        version: 4.9.33(vue@3.5.13(typescript@5.7.2))
+        version: 4.20.11
 
   packages/effects/request:
     dependencies:
@@ -1493,11 +1770,17 @@ importers:
         version: link:../../utils
       axios:
         specifier: 'catalog:'
-        version: 1.7.9
+        version: 1.19.0(debug@4.4.3(supports-color@10.2.2))(supports-color@10.2.2)
+      qs:
+        specifier: 'catalog:'
+        version: 6.15.3
     devDependencies:
+      '@types/qs':
+        specifier: 'catalog:'
+        version: 6.15.1
       axios-mock-adapter:
         specifier: 'catalog:'
-        version: 2.1.0(axios@1.7.9)
+        version: 2.1.0(axios@1.19.0(debug@4.4.3(supports-color@10.2.2))(supports-color@10.2.2))
 
   packages/icons:
     dependencies:
@@ -1509,16 +1792,16 @@ importers:
     dependencies:
       '@intlify/core-base':
         specifier: 'catalog:'
-        version: 10.0.5
+        version: 11.4.8
       '@vben-core/composables':
         specifier: workspace:*
         version: link:../@core/composables
       vue:
-        specifier: ^3.5.13
-        version: 3.5.13(typescript@5.7.2)
+        specifier: ^3.5.40
+        version: 3.5.41(typescript@6.0.3)
       vue-i18n:
         specifier: 'catalog:'
-        version: 10.0.5(vue@3.5.13(typescript@5.7.2))
+        version: 11.4.8(vue@3.5.41(typescript@6.0.3))
 
   packages/preferences:
     dependencies:
@@ -1531,6 +1814,9 @@ importers:
 
   packages/stores:
     dependencies:
+      '@vben-core/preferences':
+        specifier: workspace:*
+        version: link:../@core/preferences
       '@vben-core/shared':
         specifier: workspace:*
         version: link:../@core/base/shared
@@ -1538,17 +1824,20 @@ importers:
         specifier: workspace:*
         version: link:../@core/base/typings
       pinia:
-        specifier: 2.2.2
-        version: 2.2.2(typescript@5.7.2)(vue@3.5.13(typescript@5.7.2))
+        specifier: ^4.0.2
+        version: 4.0.2(@vue/devtools-api@8.2.1)(typescript@6.0.3)(vue@3.5.41(typescript@6.0.3))
       pinia-plugin-persistedstate:
         specifier: 'catalog:'
-        version: 4.2.0(magicast@0.3.5)(pinia@2.2.2(typescript@5.7.2)(vue@3.5.13(typescript@5.7.2)))(rollup@4.28.1)
+        version: 4.7.1(@nuxt/kit@3.21.11(magicast@0.5.4))(pinia@4.0.2(@vue/devtools-api@8.2.1)(typescript@6.0.3)(vue@3.5.41(typescript@6.0.3)))
+      secure-ls:
+        specifier: 'catalog:'
+        version: 2.0.0
       vue:
-        specifier: ^3.5.13
-        version: 3.5.13(typescript@5.7.2)
+        specifier: ^3.5.40
+        version: 3.5.41(typescript@6.0.3)
       vue-router:
         specifier: 'catalog:'
-        version: 4.5.0(vue@3.5.13(typescript@5.7.2))
+        version: 5.2.0(@vue/compiler-sfc@3.5.41)(esbuild@0.28.2)(pinia@4.0.2(@vue/devtools-api@8.2.1)(typescript@6.0.3)(vue@3.5.41(typescript@6.0.3)))(rolldown@1.2.3)(rollup@4.62.4)(vite@8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0))(vue@3.5.41(typescript@6.0.3))
 
   packages/styles:
     dependencies:
@@ -1562,11 +1851,11 @@ importers:
         specifier: workspace:*
         version: link:../@core/base/typings
       vue:
-        specifier: ^3.5.13
-        version: 3.5.13(typescript@5.7.2)
+        specifier: ^3.5.40
+        version: 3.5.41(typescript@6.0.3)
       vue-router:
         specifier: 'catalog:'
-        version: 4.5.0(vue@3.5.13(typescript@5.7.2))
+        version: 5.2.0(@vue/compiler-sfc@3.5.41)(esbuild@0.28.2)(pinia@4.0.2(@vue/devtools-api@8.2.1)(typescript@6.0.3)(vue@3.5.41(typescript@6.0.3)))(rolldown@1.2.3)(rollup@4.62.4)(vite@8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0))(vue@3.5.41(typescript@6.0.3))
 
   packages/utils:
     dependencies:
@@ -1578,13 +1867,16 @@ importers:
         version: link:../@core/base/typings
       vue-router:
         specifier: 'catalog:'
-        version: 4.5.0(vue@3.5.13(typescript@5.7.2))
+        version: 5.2.0(@vue/compiler-sfc@3.5.41)(esbuild@0.28.2)(pinia@4.0.2(@vue/devtools-api@8.2.1)(typescript@6.0.3)(vue@3.5.41(typescript@6.0.3)))(rolldown@1.2.3)(rollup@4.62.4)(vite@8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0))(vue@3.5.41(typescript@6.0.3))
 
   playground:
     dependencies:
       '@tanstack/vue-query':
         specifier: 'catalog:'
-        version: 5.62.8(vue@3.5.13(typescript@5.7.2))
+        version: 5.101.4(vue@3.5.41(typescript@6.0.3))
+      '@vben-core/design':
+        specifier: workspace:*
+        version: link:../packages/@core/base/design
       '@vben-core/menu-ui':
         specifier: workspace:*
         version: link:../packages/@core/ui-kit/menu-ui
@@ -1632,34 +1924,44 @@ importers:
         version: link:../packages/utils
       '@vueuse/core':
         specifier: 'catalog:'
-        version: 12.0.0(typescript@5.7.2)
-      ant-design-vue:
+        version: 14.4.0(vue@3.5.41(typescript@6.0.3))
+      antdv-next:
         specifier: 'catalog:'
-        version: 4.2.6(vue@3.5.13(typescript@5.7.2))
+        version: 1.5.0(vue@3.5.41(typescript@6.0.3))
       dayjs:
         specifier: 'catalog:'
-        version: 1.11.13
+        version: 1.11.21
+      json-bigint:
+        specifier: 'catalog:'
+        version: 1.0.0
       pinia:
-        specifier: 2.2.2
-        version: 2.2.2(typescript@5.7.2)(vue@3.5.13(typescript@5.7.2))
+        specifier: ^4.0.2
+        version: 4.0.2(@vue/devtools-api@8.2.1)(typescript@6.0.3)(vue@3.5.41(typescript@6.0.3))
       vue:
-        specifier: ^3.5.13
-        version: 3.5.13(typescript@5.7.2)
+        specifier: ^3.5.40
+        version: 3.5.41(typescript@6.0.3)
       vue-router:
         specifier: 'catalog:'
-        version: 4.5.0(vue@3.5.13(typescript@5.7.2))
+        version: 5.2.0(@vue/compiler-sfc@3.5.41)(esbuild@0.28.2)(pinia@4.0.2(@vue/devtools-api@8.2.1)(typescript@6.0.3)(vue@3.5.41(typescript@6.0.3)))(rolldown@1.2.3)(rollup@4.62.4)(vite@8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0))(vue@3.5.41(typescript@6.0.3))
+    devDependencies:
+      '@playwright/test':
+        specifier: 'catalog:'
+        version: 1.62.1
+      '@types/json-bigint':
+        specifier: 'catalog:'
+        version: 1.0.4
 
   scripts/turbo-run:
     dependencies:
       '@clack/prompts':
         specifier: 'catalog:'
-        version: 0.9.0
+        version: 1.7.0
       '@vben/node-utils':
         specifier: workspace:*
         version: link:../../internal/node-utils
       cac:
         specifier: 'catalog:'
-        version: 6.7.14
+        version: 7.0.0
 
   scripts/vsh:
     dependencies:
@@ -1668,245 +1970,292 @@ importers:
         version: link:../../internal/node-utils
       cac:
         specifier: 'catalog:'
-        version: 6.7.14
+        version: 7.0.0
       circular-dependency-scanner:
         specifier: 'catalog:'
-        version: 2.3.0
-      depcheck:
+        version: 3.1.0
+      knip:
         specifier: 'catalog:'
-        version: 1.4.7
+        version: 6.32.1
       publint:
         specifier: 'catalog:'
-        version: 0.2.12
+        version: 0.3.23
 
 packages:
 
-  '@alloc/quick-lru@5.2.0':
-    resolution: {integrity: sha512-UrcABB+4bUrFABwbluTIBErXwvbsU/V7TZWfmbgJfbkwiBuziS9gxdODUyuiecfdGQ85jglMW6juS3+z5TsKLw==}
-    engines: {node: '>=10'}
-
-  '@ampproject/remapping@2.3.0':
-    resolution: {integrity: sha512-30iZtAPgz+LTIYoeivqYo853f02jBYSd5uGnGpkFV0M3xOt9aN73erkgYAmZU43x4VfqcnLxW9Kpg3R5LC4YYw==}
-    engines: {node: '>=6.0.0'}
-
   '@ant-design/colors@6.0.0':
     resolution: {integrity: sha512-qAZRvPzfdWHtfameEGP2Qvuf838NhergR35o+EuVyB5XvSA98xod5r4utvi4TJ3ywmevm290g9nsCG5MryrdWQ==}
 
-  '@ant-design/icons-svg@4.4.2':
-    resolution: {integrity: sha512-vHbT+zJEVzllwP+CM+ul7reTEfBR0vgxFe7+lREAsAA7YGsYpboiq2sQNeQeRvh09GfQgs/GyFEvZpJ9cLXpXA==}
+  '@ant-design/colors@7.2.1':
+    resolution: {integrity: sha512-lCHDcEzieu4GA3n8ELeZ5VQ8pKQAWcGGLRTQ50aQM2iqPpq2evTxER84jfdPvsPAtEcZ7m44NI45edFMo8oOYQ==}
+
+  '@ant-design/colors@8.0.1':
+    resolution: {integrity: sha512-foPVl0+SWIslGUtD/xBr1p9U4AKzPhNYEseXYRRo5QSzGACYZrQbe11AYJbYfAWnWSpGBx6JjBmSeugUsD9vqQ==}
+
+  '@ant-design/fast-color@2.0.6':
+    resolution: {integrity: sha512-y2217gk4NqL35giHl72o6Zzqji9O7vHh9YmhUVkPtAOpoTCH4uWxo/pr4VE8t0+ChEPs0qo4eJRC5Q1eXWo3vA==}
+    engines: {node: '>=8.x'}
+
+  '@ant-design/fast-color@3.0.1':
+    resolution: {integrity: sha512-esKJegpW4nckh0o6kV3Tkb7NPIZYbPnnFxmQDUmL08ukXZAvV85TZBr70eGuke/CIArLaP6aw8lt9KILjnWuOw==}
+    engines: {node: '>=8.x'}
+
+  '@ant-design/icons-svg@4.5.0':
+    resolution: {integrity: sha512-1BTUFyKPTBZ53MuTP8s0k5SFEXL7o3VHEOwLgzaoWKwnBeqIcqUtVshc4SKzhI6uACfqhJqBwBUE9FsWR3uULA==}
 
   '@ant-design/icons-vue@7.0.1':
     resolution: {integrity: sha512-eCqY2unfZK6Fe02AwFlDHLfoyEFreP6rBwAZMIJ1LugmfMiVgwWDYlp1YsRugaPtICYOabV1iWxXdP12u9U43Q==}
     peerDependencies:
-      vue: ^3.5.13
+      vue: ^3.5.40
 
-  '@antfu/utils@0.7.10':
-    resolution: {integrity: sha512-+562v9k4aI80m1+VuMHehNJWLOFjBnXn3tdOitzD0il5b7smkSBal4+a3oKiQTbrwMmN/TBUMDvbdoWDehgOww==}
+  '@antdv-next/cssinjs@1.0.6':
+    resolution: {integrity: sha512-8NL+AzjFZVHfG9A2l+r4rNWdRfbS5FFFozGU9jVl7WNgd7y+wEYSzl+qvRjJuqd3IryacrDfsTxIgcSQkVlr5Q==}
+    peerDependencies:
+      vue: ^3.5.40
 
-  '@apideck/better-ajv-errors@0.3.6':
-    resolution: {integrity: sha512-P+ZygBLZtkp0qqOAJJVX4oX/sFo5JR3eBWwwuqHHhK0GIgQOKWrAfiAaWX0aArHkRWHMuggFEgAZNxVPwPZYaA==}
+  '@antdv-next/icons@1.1.1':
+    resolution: {integrity: sha512-SiblayeqWLW58funYgNVR8FaVDKNCZIbgRT3kTWZEag+UnNUOhaHRFj675u84IHACtUpmyLfMLysVnmfAljttg==}
+    peerDependencies:
+      vue: ^3.5.40
+
+  '@antfu/install-pkg@1.1.0':
+    resolution: {integrity: sha512-MGQsmw10ZyI+EJo45CdSER4zEb+p31LpDAFp2Z3gkSd1yqVZGi0Ebx++YTEMonJy4oChEMLsxZ64j8FH6sSqtQ==}
+
+  '@apideck/better-ajv-errors@0.3.7':
+    resolution: {integrity: sha512-TajUJwGWbDwkCx/CZi7tRE8PVB7simCvKJfHUsSdvps+aTM/PDPP4gkLmKnc+x3CE//y9i/nj74GqdL/hwk7Iw==}
     engines: {node: '>=10'}
     peerDependencies:
       ajv: '>=8'
 
-  '@ast-grep/napi-darwin-arm64@0.31.1':
-    resolution: {integrity: sha512-i2GOKyowGyGWwnwBmzZj8MFACTh5QzWrYTV7Si7V+4JjYLlrm94A/KgxBWX16mwXQr1qxziS6GjlQDqRSBxCtw==}
+  '@ast-grep/napi-darwin-arm64@0.44.1':
+    resolution: {integrity: sha512-JPcb1PvOkwKgccGbBgtoc4e6qfx/luvAtlc6SEtNPhvSwV8qagLb9MCSDcCiuqrqICx3qHj2CXouGbs66lCFvA==}
     engines: {node: '>= 10'}
     cpu: [arm64]
     os: [darwin]
 
-  '@ast-grep/napi-darwin-x64@0.31.1':
-    resolution: {integrity: sha512-oUyxBoWT6o1hsJ1H0id9PkK2jgwDS1RSziZ+ORJxlV+VuvXbqPC2yrrqjWK60yBSK49GPNQjuQueGC3Js9Zqhg==}
+  '@ast-grep/napi-darwin-x64@0.44.1':
+    resolution: {integrity: sha512-TZj9CnCoe30mj2Nri/mMDORgkp1nkeCiw03CIRPOaUqNOvCNyMWLQhxwGJcG1KpY9MuTZsbLcQ3jju0fXZJjwQ==}
     engines: {node: '>= 10'}
     cpu: [x64]
     os: [darwin]
 
-  '@ast-grep/napi-linux-arm64-gnu@0.31.1':
-    resolution: {integrity: sha512-UVGjseE/RLW2Qx21t8TSGArFgmud2YPqdpgneLuRiW4unM9FIM1PKyxnm9AKzkQbJJzpG7CSWBnMbVkmvWMB/A==}
+  '@ast-grep/napi-linux-arm64-gnu@0.44.1':
+    resolution: {integrity: sha512-tw/7ruKolNcy97tDf/24Arb8wo/Ho2FRHk98lrmYQZZr18fFaiYjRXTCJTizOsdo6wL/asht4Rpdo/eRPuDhVw==}
     engines: {node: '>= 10'}
     cpu: [arm64]
     os: [linux]
     libc: [glibc]
 
-  '@ast-grep/napi-linux-arm64-musl@0.31.1':
-    resolution: {integrity: sha512-K6LBPjbd1ugHYG4EPaepYgfg7M2UOpTC1fFGkViLuONDfpiH5A/i0HAkcDBkEbfzcOGv2WU7aqnHJ2rqKDLodg==}
+  '@ast-grep/napi-linux-arm64-musl@0.44.1':
+    resolution: {integrity: sha512-IJlY4GnuDqABa40xMvJp62nEQWYmk6wXtZc2sbPiQoemxAPG6X2m+eWwYpE9heAQOe6iNkXsILNH8YZHRTYayA==}
     engines: {node: '>= 10'}
     cpu: [arm64]
     os: [linux]
     libc: [musl]
 
-  '@ast-grep/napi-linux-x64-gnu@0.31.1':
-    resolution: {integrity: sha512-VeJ5XVFyETypqIxTcB0JaMt+dadOHzXnrU5qSrbUsrnhtIUoleazvxHEzaoXQ0wglCVgl0odLAwgcwkHRxJ/Pg==}
+  '@ast-grep/napi-linux-x64-gnu@0.44.1':
+    resolution: {integrity: sha512-6YyLrXn0RcKCS/FpqAFVWWtbGNFYia5tNI6mX1PqVQPCMT5EojHDXpW2/eo6uV/BnGCsVpTocAWSpac6tACa6g==}
     engines: {node: '>= 10'}
     cpu: [x64]
     os: [linux]
     libc: [glibc]
 
-  '@ast-grep/napi-linux-x64-musl@0.31.1':
-    resolution: {integrity: sha512-6pGQDPiaMqSHXCahVoJCpThc8TEk7HaJBP/n+xay/OTwqrqe54nS6baRnEm9k5q9vh4V2ceaOVf3754tkg8TSg==}
+  '@ast-grep/napi-linux-x64-musl@0.44.1':
+    resolution: {integrity: sha512-P8ze2Srap/4RsxbrzMy/NSvkRfLwNfvfoEbwBqS/q199t3wVkpS2gT13QkANrgU+RLUgAIawnFBpjbm5XinIuQ==}
     engines: {node: '>= 10'}
     cpu: [x64]
     os: [linux]
     libc: [musl]
 
-  '@ast-grep/napi-win32-arm64-msvc@0.31.1':
-    resolution: {integrity: sha512-JVIFHBDPoxVjG5c/XauJywypn1wkv0I+WqiwIzlMTNpqmEoJEnJGIom3gJZGqgrFmPpc6/PiATTw6DEjGJs4QA==}
+  '@ast-grep/napi-win32-arm64-msvc@0.44.1':
+    resolution: {integrity: sha512-ty5fItgu6aTDJg1fVkWwx0qboB5pFsyjRHSgi5uqXFzLbno1vOKog1pMzu3xcKcLqMiNI0axML+HdFOqSFQz0w==}
     engines: {node: '>= 10'}
     cpu: [arm64]
     os: [win32]
 
-  '@ast-grep/napi-win32-ia32-msvc@0.31.1':
-    resolution: {integrity: sha512-PTyEPvJgNuvzj0kWyR9/0+AAL13LftvGijp5sZ0lgXIpig8MfF3czIU62Nf6AMpABhsu0h+u4KmD4DaMxdw0EA==}
+  '@ast-grep/napi-win32-ia32-msvc@0.44.1':
+    resolution: {integrity: sha512-1wTv2MrQLygnaZhlgH8aYpOkHW051CwWWowTr2AFGkn+2PMfsTTG4SEWcZArOIKlAGdWAvvlut66tLyzKhAFyw==}
     engines: {node: '>= 10'}
     cpu: [ia32]
     os: [win32]
 
-  '@ast-grep/napi-win32-x64-msvc@0.31.1':
-    resolution: {integrity: sha512-tEgj2Fp2Pi5qXXDLR3AWkZwQTj8yeSN3I7Pvw2DOfINu9imE2EY+Aq5kOhfvduGWVPmP8az68xUFC4b29+yrUw==}
+  '@ast-grep/napi-win32-x64-msvc@0.44.1':
+    resolution: {integrity: sha512-U8CK5JaH8YUezTJnyk97I3C5Twh9gKDB/Q3KztQdOZGeoYqthnQzM4Ntvlz8aWaVSssn7OyGMr3O8ZoK0W8aJg==}
     engines: {node: '>= 10'}
     cpu: [x64]
     os: [win32]
 
-  '@ast-grep/napi@0.31.1':
-    resolution: {integrity: sha512-XOFCIeCYdXeRhp1OesRtes/sjPlTSe9Q7tKLLztM8sbDVYgla8k1eCTU3ia7xYIwdK3pjwc39akb8Z7qlOpzHg==}
+  '@ast-grep/napi@0.44.1':
+    resolution: {integrity: sha512-dJAJVYRKmUjXn+4mXUgfRvMrWujB9mLzPSq/2e8J7n6Hn3dY4jpZNpChj6hMi7PlZ2J2c7coAVoDBaax06uvXw==}
     engines: {node: '>= 10'}
 
-  '@babel/code-frame@7.26.2':
-    resolution: {integrity: sha512-RJlIHRueQgwWitWgF8OdFYGZX328Ax5BCemNGlqHfplnRT9ESi8JkFlvaVYbS+UubVY6dpv87Fs2u5M29iNFVQ==}
+  '@babel/code-frame@7.29.7':
+    resolution: {integrity: sha512-Aup7aUOfpbAUg2ROOJN6Iw5f9DMBlzu0mIkm/malLQFN/YQgO48wCj0Kxa3sEHJvPVFg7siR+qRInwXd2qhQKw==}
     engines: {node: '>=6.9.0'}
 
-  '@babel/compat-data@7.26.3':
-    resolution: {integrity: sha512-nHIxvKPniQXpmQLb0vhY3VaFb3S0YrTAwpOWJZh1wn3oJPjJk9Asva204PsBdmAE8vpzfHudT8DB0scYvy9q0g==}
+  '@babel/code-frame@8.0.0':
+    resolution: {integrity: sha512-dYYg153EyN2Ekbqw2zAsbd6/JR+9N2SEoC7YV2GyyqMM7x9bLDTjBD6XBhSMLH0wtIVyJj03jWNriQhaN+eoCw==}
+    engines: {node: ^22.18.0 || >=24.11.0}
+
+  '@babel/compat-data@7.29.7':
+    resolution: {integrity: sha512-locTkQyKvwIEgBzVrn8693ebc97F2U8ZHjbXwDXJ5Fn2TCpNwTlKcaKLkdHop5c/icOFE7qt7Q9JC5hnKNa6Gg==}
     engines: {node: '>=6.9.0'}
 
-  '@babel/core@7.26.0':
-    resolution: {integrity: sha512-i1SLeK+DzNnQ3LL/CswPCa/E5u4lh1k6IAEphON8F+cXt0t9euTshDru0q7/IqMa1PMPz5RnHuHscF8/ZJsStg==}
+  '@babel/core@7.29.7':
+    resolution: {integrity: sha512-RgHBCvtjbOK2gXSNBNIkNoEc9qoVEtau3hj8gEqKQuL3HZAibKarWFEI3Lfm6EYKkLalOh8eSrj9b+ch9H/VBA==}
     engines: {node: '>=6.9.0'}
 
-  '@babel/generator@7.26.3':
-    resolution: {integrity: sha512-6FF/urZvD0sTeO7k6/B15pMLC4CHUv1426lzr3N01aHJTl046uCAh9LXW/fzeXXjPNCJ6iABW5XaWOsIZB93aQ==}
+  '@babel/generator@7.29.8':
+    resolution: {integrity: sha512-gZbepsdh3WDtgZKWL+vTPh71LSBrm/Y4/QDZBVCcYfmeTEEuoOYwlSy+G1StfJg+/Zy550u/3TATbm7qDbbMtg==}
     engines: {node: '>=6.9.0'}
 
-  '@babel/helper-annotate-as-pure@7.25.9':
-    resolution: {integrity: sha512-gv7320KBUFJz1RnylIg5WWYPRXKZ884AGkYpgpWW02TH66Dl+HaC1t1CKd0z3R4b6hdYEcmrNZHUmfCP+1u3/g==}
+  '@babel/generator@8.0.0':
+    resolution: {integrity: sha512-NT9NrVwJsbSV6Y2FSstWa71EETOnzrjkL5/wX3D2mYHtKM+qvqB1DvR4D0Setb/gDBsHzRICifwEWMO8CnTF6g==}
+    engines: {node: ^22.18.0 || >=24.11.0}
+
+  '@babel/helper-annotate-as-pure@7.29.7':
+    resolution: {integrity: sha512-OoK6239jHPuSQOoS0kfTVKn0b/rVTk0seKq4Gd2UMLtmOVLjDC0ki3e+c90Trqv2gMfvJFqkiljrr568+qddiw==}
     engines: {node: '>=6.9.0'}
 
-  '@babel/helper-compilation-targets@7.25.9':
-    resolution: {integrity: sha512-j9Db8Suy6yV/VHa4qzrj9yZfZxhLWQdVnRlXxmKLYlhWUVB1sB2G5sxuWYXk/whHD9iW76PmNzxZ4UCnTQTVEQ==}
+  '@babel/helper-compilation-targets@7.29.7':
+    resolution: {integrity: sha512-wem6WaBj4NaVYVdNhLPPVacES6ZJ+KBBfSkTMD3YZxbP3rm3Di85tJU5ljaUNhaOynt+Aj0xruhYuzQBt8n71g==}
     engines: {node: '>=6.9.0'}
 
-  '@babel/helper-create-class-features-plugin@7.25.9':
-    resolution: {integrity: sha512-UTZQMvt0d/rSz6KI+qdu7GQze5TIajwTS++GUozlw8VBJDEOAqSXwm1WvmYEZwqdqSGQshRocPDqrt4HBZB3fQ==}
+  '@babel/helper-create-class-features-plugin@7.29.7':
+    resolution: {integrity: sha512-IY3ZD9Tmooqr3TUhc3DUWxiuo8xx1DWLhd5M7hQ+ZWJamqM2BbalrBJb2MisSLoYorOj75U03qULCxQTY9r3hg==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0
 
-  '@babel/helper-create-regexp-features-plugin@7.26.3':
-    resolution: {integrity: sha512-G7ZRb40uUgdKOQqPLjfD12ZmGA54PzqDFUv2BKImnC9QIfGhIHKvVML0oN8IUiDq4iRqpq74ABpvOaerfWdong==}
+  '@babel/helper-create-regexp-features-plugin@7.29.7':
+    resolution: {integrity: sha512-907Uymvqgg1dwUA+7IGwFAOSYzQOuzPXKNJ1yxzwPffzkYFg2q2eHi1fIOs6sXkG9NbIUMunnUlkYsfRFNvomg==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0
 
-  '@babel/helper-define-polyfill-provider@0.6.3':
-    resolution: {integrity: sha512-HK7Bi+Hj6H+VTHA3ZvBis7V/6hu9QuTrnMXNybfUf2iiuU/N97I8VjB+KbhFF8Rld/Lx5MzoCwPCpPjfK+n8Cg==}
+  '@babel/helper-define-polyfill-provider@0.6.8':
+    resolution: {integrity: sha512-47UwBLPpQi1NoWzLuHNjRoHlYXMwIJoBf7MFou6viC/sIHWYygpvr0B6IAyh5sBdA2nr2LPIRww8lfaUVQINBA==}
     peerDependencies:
       '@babel/core': ^7.4.0 || ^8.0.0-0 <8.0.0
 
-  '@babel/helper-member-expression-to-functions@7.25.9':
-    resolution: {integrity: sha512-wbfdZ9w5vk0C0oyHqAJbc62+vet5prjj01jjJ8sKn3j9h3MQQlflEdXYvuqRWjHnM12coDEqiC1IRCi0U/EKwQ==}
+  '@babel/helper-globals@7.29.7':
+    resolution: {integrity: sha512-3nQVUAtvkKH9zahfWgw96Jc/uFOmjACE1kQz82E2lqWmHBgjzbNlsC22nuQTfahmWeQtTq5nQ/4Nnd2A1wj4zA==}
     engines: {node: '>=6.9.0'}
 
-  '@babel/helper-module-imports@7.25.9':
-    resolution: {integrity: sha512-tnUA4RsrmflIM6W6RFTLFSXITtl0wKjgpnLgXyowocVPrbYrLUXSBXDgTs8BlbmIzIdlBySRQjINYs2BAkiLtw==}
+  '@babel/helper-member-expression-to-functions@7.29.7':
+    resolution: {integrity: sha512-j+7JYmk1JYDtACIGj0QJqqWZjoUpMoEikQGADMaHgCMCSDqd2+P32rfcibUNrGOMWrlzK1WJBdxrB3JJQZwWtg==}
     engines: {node: '>=6.9.0'}
 
-  '@babel/helper-module-transforms@7.26.0':
-    resolution: {integrity: sha512-xO+xu6B5K2czEnQye6BHA7DolFFmS3LB7stHZFaOLb1pAwO1HWLS8fXA+eh0A2yIvltPVmx3eNNDBJA2SLHXFw==}
+  '@babel/helper-module-imports@7.29.7':
+    resolution: {integrity: sha512-ejHwrQQYcm9xnTivShn2IDOlIzInN34AXskvq9QicvCtEzq1Vzclu/tKF8Jq1Cg8JG2GL6/EmjgsCT7lXepE3g==}
+    engines: {node: '>=6.9.0'}
+
+  '@babel/helper-module-transforms@7.29.7':
+    resolution: {integrity: sha512-UPUVSyXbOh627KiCIGQSgwWzGeBKLkaJ9PJEdrngIwMSzxLR4jS4+f1f1jb7VzBbg8nFLaYotvVPFCTqdrmTAg==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0
 
-  '@babel/helper-optimise-call-expression@7.25.9':
-    resolution: {integrity: sha512-FIpuNaz5ow8VyrYcnXQTDRGvV6tTjkNtCK/RYNDXGSLlUD6cBuQTSw43CShGxjvfBTfcUA/r6UhUCbtYqkhcuQ==}
+  '@babel/helper-optimise-call-expression@7.29.7':
+    resolution: {integrity: sha512-+kmGVjcT9RGYzoDwdwEqEvGgKe3BYq+O1iGzjFubaNgZHwYHP6lsF2Yghf4kEuv9BV7tYDZ913aBW9am6YKong==}
     engines: {node: '>=6.9.0'}
 
-  '@babel/helper-plugin-utils@7.25.9':
-    resolution: {integrity: sha512-kSMlyUVdWe25rEsRGviIgOWnoT/nfABVWlqt9N19/dIPWViAOW2s9wznP5tURbs/IDuNk4gPy3YdYRgH3uxhBw==}
+  '@babel/helper-plugin-utils@7.29.7':
+    resolution: {integrity: sha512-G7sHYigPY17oO5SYWnfD/0MTBwVR781S/JI643e/JhUYgVgWE/61SoW3NH9KWUKyKq5LVh3npif99Wkt6j86Jw==}
     engines: {node: '>=6.9.0'}
 
-  '@babel/helper-remap-async-to-generator@7.25.9':
-    resolution: {integrity: sha512-IZtukuUeBbhgOcaW2s06OXTzVNJR0ybm4W5xC1opWFFJMZbwRj5LCk+ByYH7WdZPZTt8KnFwA8pvjN2yqcPlgw==}
+  '@babel/helper-remap-async-to-generator@7.29.7':
+    resolution: {integrity: sha512-16AMiW26DbXWBbr3B8wNozKM0ydMLB892vaOaJW/fPJdnT8vJk5sdkQcU/isqUxyCE0cEoa8wZOcbgDuC4b6Og==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0
 
-  '@babel/helper-replace-supers@7.25.9':
-    resolution: {integrity: sha512-IiDqTOTBQy0sWyeXyGSC5TBJpGFXBkRynjBeXsvbhQFKj2viwJC76Epz35YLU1fpe/Am6Vppb7W7zM4fPQzLsQ==}
+  '@babel/helper-replace-supers@7.29.7':
+    resolution: {integrity: sha512-atfGXWSeCiF4DnKZIfmJfQRkSw9b9gNNXR1kqKjbhG4pGYCOnkp8OcTB8E3NXjBu8NpheSnOeNKz8KT7UNFTmQ==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0
 
-  '@babel/helper-skip-transparent-expression-wrappers@7.25.9':
-    resolution: {integrity: sha512-K4Du3BFa3gvyhzgPcntrkDgZzQaq6uozzcpGbOO1OEJaI+EJdqWIMTLgFgQf6lrfiDFo5FU+BxKepI9RmZqahA==}
+  '@babel/helper-skip-transparent-expression-wrappers@7.29.7':
+    resolution: {integrity: sha512-brcMGQaVzIeUb+6/bs1Av0f8YuNNjKY2JyvfRCsFuFsdKccEQ5Ges2y74D74NZ1Rz8lKJ9ksJkfqwQFJ/iNEyQ==}
     engines: {node: '>=6.9.0'}
 
-  '@babel/helper-string-parser@7.25.9':
-    resolution: {integrity: sha512-4A/SCr/2KLd5jrtOMFzaKjVtAei3+2r/NChoBNoZ3EyP/+GlhoaEGoWOZUmFmoITP7zOJyHIMm+DYRd8o3PvHA==}
+  '@babel/helper-string-parser@7.29.7':
+    resolution: {integrity: sha512-Pb5ijPrZ89GDH8223L4UP8i6QApWxs04RbPQJTeWDV0/keR2E36MeKnyr6LYmUUvqRRI+Iv87SuF1W6ErINzYw==}
     engines: {node: '>=6.9.0'}
 
-  '@babel/helper-validator-identifier@7.25.9':
-    resolution: {integrity: sha512-Ed61U6XJc3CVRfkERJWDz4dJwKe7iLmmJsbOGu9wSloNSFttHV0I8g6UAgb7qnK5ly5bGLPd4oXZlxCdANBOWQ==}
+  '@babel/helper-string-parser@8.0.0':
+    resolution: {integrity: sha512-6mJgmFFFIIO82vvoLt9XtRC7/TkzXfts1t/SpRX4IHSzMgqoPYCWesVu1udUPUWioAE/2fcG6WuI8zrkE1gwrg==}
+    engines: {node: ^22.18.0 || >=24.11.0}
+
+  '@babel/helper-validator-identifier@7.29.7':
+    resolution: {integrity: sha512-qehxGkRj55h/ff8EMaJ+cYhyaKlHIxqYDn682wQD7RNp9UujOQsHog2uS0r2vzr4pW+sXf90NeeayjcNaX3fFg==}
     engines: {node: '>=6.9.0'}
 
-  '@babel/helper-validator-option@7.25.9':
-    resolution: {integrity: sha512-e/zv1co8pp55dNdEcCynfj9X7nyUKUXoUEwfXqaZt0omVOmDe9oOTdKStH4GmAw6zxMFs50ZayuMfHDKlO7Tfw==}
+  '@babel/helper-validator-identifier@8.0.4':
+    resolution: {integrity: sha512-4wFaiLd0bVo4cIoTXI3zKI038NIWE/cr3jvBjejOVYVxV/m8Ltav1USiGzG1fmS5J2RhgEOgXNNK46cRPnRsrg==}
+    engines: {node: ^22.18.0 || >=24.11.0}
+
+  '@babel/helper-validator-option@7.29.7':
+    resolution: {integrity: sha512-N9ZErrD+yW5geCDtBqnOoxmR8+tNKiGuxKlDpuJxfsqpa2dFcexaziGAE/qoHLiDDreVNMupxGmSoNlyvsA3gw==}
     engines: {node: '>=6.9.0'}
 
-  '@babel/helper-wrap-function@7.25.9':
-    resolution: {integrity: sha512-ETzz9UTjQSTmw39GboatdymDq4XIQbR8ySgVrylRhPOFpsd+JrKHIuF0de7GCWmem+T4uC5z7EZguod7Wj4A4g==}
+  '@babel/helper-wrap-function@7.29.7':
+    resolution: {integrity: sha512-iES0Skag9ERIF68aXadpO6dbXa03mNWK3sEqJaMnLNs/eC3l0lkImdfoy6Y09/SfkpawdAB4RjQ7PVA7TcVGdw==}
     engines: {node: '>=6.9.0'}
 
-  '@babel/helpers@7.26.0':
-    resolution: {integrity: sha512-tbhNuIxNcVb21pInl3ZSjksLCvgdZy9KwJ8brv993QtIVKJBBkYXz4q4ZbAv31GdnC+R90np23L5FbEBlthAEw==}
+  '@babel/helpers@7.29.7':
+    resolution: {integrity: sha512-1k2lAGRMfHTcwuNYcCNUmaUffmQv8KWMfh2iJUUeRlwlwH4FdNG7mfPI10NPfLHJFThE4Tyr4mv7kTNZOiPuBg==}
     engines: {node: '>=6.9.0'}
 
-  '@babel/parser@7.26.3':
-    resolution: {integrity: sha512-WJ/CvmY8Mea8iDXo6a7RK2wbmJITT5fN3BEkRuFlxVyNx8jOKIIhmC4fSkTcPcf8JyavbBwIe6OpiCOBXt/IcA==}
+  '@babel/parser@7.29.8':
+    resolution: {integrity: sha512-E8lTAYNB1KW+FH+VGJuZM1ioAx2E6oVlvQFRrf5P8ZZmsiJXYAD9vTFV7yyEURNzgh1dFqMZuO6tUwcARbqFCA==}
     engines: {node: '>=6.0.0'}
     hasBin: true
 
-  '@babel/plugin-bugfix-firefox-class-in-computed-class-key@7.25.9':
-    resolution: {integrity: sha512-ZkRyVkThtxQ/J6nv3JFYv1RYY+JT5BvU0y3k5bWrmuG4woXypRa4PXmm9RhOwodRkYFWqC0C0cqcJ4OqR7kW+g==}
+  '@babel/parser@8.0.4':
+    resolution: {integrity: sha512-srpptsAkEbbNIC/q8nT7o+m6CQe8CJUTV/t7MYc9NnWlgYVtHOb7JH6SorxMhN0kuRJjVqXbKClG6xSbPtzz+g==}
+    engines: {node: ^22.18.0 || >=24.11.0}
+    hasBin: true
+
+  '@babel/plugin-bugfix-firefox-class-in-computed-class-key@7.29.7':
+    resolution: {integrity: sha512-j8SrR0zLZrRsC09DlszEx8FpMiwukKffYXMK0d5LmOglO7vGG6sz/BR/20yHqWH+Lnn31JTt2PE3hIWNgM2J6w==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0
 
-  '@babel/plugin-bugfix-safari-class-field-initializer-scope@7.25.9':
-    resolution: {integrity: sha512-MrGRLZxLD/Zjj0gdU15dfs+HH/OXvnw/U4jJD8vpcP2CJQapPEv1IWwjc/qMg7ItBlPwSv1hRBbb7LeuANdcnw==}
+  '@babel/plugin-bugfix-safari-class-field-initializer-scope@7.29.7':
+    resolution: {integrity: sha512-r8j8escF+U2FUHo0KOhPUdMzUO+jp9fInva6+ACVAF3Y97Ev+5iNZwiqTghmzNeWwDkOPlYuTcfb1vDaoZKmAQ==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0
 
-  '@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression@7.25.9':
-    resolution: {integrity: sha512-2qUwwfAFpJLZqxd02YW9btUCZHl+RFvdDkNfZwaIJrvB8Tesjsk8pEQkTvGwZXLqXUx/2oyY3ySRhm6HOXuCug==}
+  '@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression@7.29.7':
+    resolution: {integrity: sha512-GE1TFSiuFeGsCxmYXZl8HwoPrVlwe4rHPFE8weieGKZqnDORK+Ar3vgWMgW+AOxQ6/2TgLSKx9p6W7O4rC6qgQ==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0
 
-  '@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining@7.25.9':
-    resolution: {integrity: sha512-6xWgLZTJXwilVjlnV7ospI3xi+sl8lN8rXXbBD6vYn3UYDlGsag8wrZkKcSI8G6KgqKP7vNFaDgeDnfAABq61g==}
+  '@babel/plugin-bugfix-safari-rest-destructuring-rhs-array@7.29.7':
+    resolution: {integrity: sha512-oBNVCvnO5tND+xSopWvV8WNGfpTfgP4Zr/YXXSj8zfmcPktp5Ku/aZlsIowgSD4fjmgHn6sGmB9APVsU5zOdhA==}
+    engines: {node: '>=6.9.0'}
+    peerDependencies:
+      '@babel/core': ^7.0.0
+
+  '@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining@7.29.7':
+    resolution: {integrity: sha512-QQt9qKHZ2sg/kivaLr7lnQr8HVrQDdBNSfCsTjiDxRuX/K5ORyKq+Bu8Xr0cDE3Dfkv0cw28Ve0EKyKMvulkOw==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.13.0
 
-  '@babel/plugin-bugfix-v8-static-class-fields-redefine-readonly@7.25.9':
-    resolution: {integrity: sha512-aLnMXYPnzwwqhYSCyXfKkIkYgJ8zv9RK+roo9DkTXz38ynIhd9XCbN08s3MGvqL2MYGVUGdRQLL/JqBIeJhJBg==}
+  '@babel/plugin-bugfix-v8-static-class-fields-redefine-readonly@7.29.7':
+    resolution: {integrity: sha512-pn6QacGLgvCcwc+syUhKE/qSjV2D1IHDB84RNxWYSt1mW3K/SCtjinZ2p0cETJxAWBjPy3K/1lHwG5BjjPxNlw==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0
 
-  '@babel/plugin-proposal-decorators@7.25.9':
-    resolution: {integrity: sha512-smkNLL/O1ezy9Nhy4CNosc4Va+1wo5w4gzSZeLe6y6dM4mmHfYOCPolXQPHQxonZCF+ZyebxN9vqOolkYrSn5g==}
+  '@babel/plugin-proposal-decorators@7.29.7':
+    resolution: {integrity: sha512-EtU0Hi3GvrTqD56xKmZvV/uCXK2ZbwVNPNLAquVItcAZpUhkXwWlo3Fmj0c2LxgSf2I8IDULeAepwNP1OefLXg==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
@@ -1917,20 +2266,20 @@ packages:
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-syntax-decorators@7.25.9':
-    resolution: {integrity: sha512-ryzI0McXUPJnRCvMo4lumIKZUzhYUO/ScI+Mz4YVaTLt04DHNSjEUjKVvbzQjZFLuod/cYEc07mJWhzl6v4DPg==}
+  '@babel/plugin-syntax-decorators@7.29.7':
+    resolution: {integrity: sha512-9MTTLbF39X6sqM92JPEsoI7++26hjZvzkxKZy64aMhWLH2mPkJ/Q3AV4QLmls3R14FpSpkOwQQfUh962JGQxxg==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-syntax-import-assertions@7.26.0':
-    resolution: {integrity: sha512-QCWT5Hh830hK5EQa7XzuqIkQU9tT/whqbDz7kuaZMHFl1inRRg7JnuAEOQ0Ur0QUl0NufCk1msK2BeY79Aj/eg==}
+  '@babel/plugin-syntax-import-assertions@7.29.7':
+    resolution: {integrity: sha512-/An1OCBN93thpBAGyfsK2pcf0jvju1SAtKkL2Ny++B5Sy6sqgzXDQH1cZxWbF96Wuk+bn41MDA9bLd4VVAw6rw==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-syntax-import-attributes@7.26.0':
-    resolution: {integrity: sha512-e2dttdsJ1ZTpi3B9UYGLw41hifAubg19AtCu/2I/F1QNVclOBr1dYpTdmdyZ84Xiz43BS/tCUkMAZNLv12Pi+A==}
+  '@babel/plugin-syntax-import-attributes@7.29.7':
+    resolution: {integrity: sha512-zGYcYfq/WmZ4V+kBIXQon9dSSc8ircGZqw9ZaNhhGj9nZkeBu1jHLBDQqYYi5WA9uawvA2sIMbry2nCFhf5Djg==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
@@ -1940,14 +2289,14 @@ packages:
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-syntax-jsx@7.25.9':
-    resolution: {integrity: sha512-ld6oezHQMZsZfp6pWtbjaNDF2tiiCYYDqQszHt5VV437lewP9aSi2Of99CK0D0XB21k7FLgnLcmQKyKzynfeAA==}
+  '@babel/plugin-syntax-jsx@7.29.7':
+    resolution: {integrity: sha512-TSu8+mHCoEaaCDEZ0I3+6mvTBYR4PCxQwf2z9/r5Tbztv6NaLR3B9thGTTxX2WGuGHJqRiAbKPeGTJ5XWXVg6A==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-syntax-typescript@7.25.9':
-    resolution: {integrity: sha512-hjMgRy5hb8uJJjUcdWunWVcoi9bGpJp8p5Ol1229PoN6aytsLwNMgmdftO23wnCLMfVmTwZDWMPNq/D1SY60JQ==}
+  '@babel/plugin-syntax-typescript@7.29.7':
+    resolution: {integrity: sha512-ngr+82Sh0xMz25TPCZi+nC2iTzjfCdWS2ONXTp/PtSCHCgaCNBpdMqgvJ2ccdLlClVZ7sisIgB914j/JFe+RZA==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
@@ -1958,314 +2307,320 @@ packages:
     peerDependencies:
       '@babel/core': ^7.0.0
 
-  '@babel/plugin-transform-arrow-functions@7.25.9':
-    resolution: {integrity: sha512-6jmooXYIwn9ca5/RylZADJ+EnSxVUS5sjeJ9UPk6RWRzXCmOJCy6dqItPJFpw2cuCangPK4OYr5uhGKcmrm5Qg==}
+  '@babel/plugin-transform-arrow-functions@7.29.7':
+    resolution: {integrity: sha512-N7zArUXWzAMzm+/N0uPBeVB3Fam5lMxtUwMmDK5f/IBBS7a7p1qeUoxd/6CckXoxUdgsntq1Dh8xNW06maZbDQ==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-async-generator-functions@7.25.9':
-    resolution: {integrity: sha512-RXV6QAzTBbhDMO9fWwOmwwTuYaiPbggWQ9INdZqAYeSHyG7FzQ+nOZaUUjNwKv9pV3aE4WFqFm1Hnbci5tBCAw==}
+  '@babel/plugin-transform-async-generator-functions@7.29.7':
+    resolution: {integrity: sha512-d98gXZkgswvkyohMBABkhm3GeXhYj8psWfwQ2C7gtfrKGTykQa/iOIi+JJhwMjPlZ6Vm2XN+DCf3Es1EoG4ZLA==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-async-to-generator@7.25.9':
-    resolution: {integrity: sha512-NT7Ejn7Z/LjUH0Gv5KsBCxh7BH3fbLTV0ptHvpeMvrt3cPThHfJfst9Wrb7S8EvJ7vRTFI7z+VAvFVEQn/m5zQ==}
+  '@babel/plugin-transform-async-to-generator@7.29.7':
+    resolution: {integrity: sha512-pcUb2SS+RMo9TWVBwKGI5ShtoG7R+zBsFmCKDa6fe8c+hPr3XJlZgoE5j6i8W7gDjhyvy+85vmYexanvXh3d1w==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-block-scoped-functions@7.25.9':
-    resolution: {integrity: sha512-toHc9fzab0ZfenFpsyYinOX0J/5dgJVA2fm64xPewu7CoYHWEivIWKxkK2rMi4r3yQqLnVmheMXRdG+k239CgA==}
+  '@babel/plugin-transform-block-scoped-functions@7.29.7':
+    resolution: {integrity: sha512-cUSmjh72N+rN4PrkFlN1dJwNCwjVp5d38/CQrEsFggkD10UiFlBFgdH3tv5dNsLuHY+3S8db2xCHjhZcv5WgvA==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-block-scoping@7.25.9':
-    resolution: {integrity: sha512-1F05O7AYjymAtqbsFETboN1NvBdcnzMerO+zlMyJBEz6WkMdejvGWw9p05iTSjC85RLlBseHHQpYaM4gzJkBGg==}
+  '@babel/plugin-transform-block-scoping@7.29.7':
+    resolution: {integrity: sha512-ONyr4+AZhKh8yKWInVxU9AXA9EbsyeLcL6V0dJy6M2/62vuvpGm29zzuymbTpdc451GEpDIdAyPLP3r+P61yKQ==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-class-properties@7.25.9':
-    resolution: {integrity: sha512-bbMAII8GRSkcd0h0b4X+36GksxuheLFjP65ul9w6C3KgAamI3JqErNgSrosX6ZPj+Mpim5VvEbawXxJCyEUV3Q==}
+  '@babel/plugin-transform-class-properties@7.29.7':
+    resolution: {integrity: sha512-GtcpjFvanPfzNQi3eTitsCqtRRmmqzpy/A+yhTR1HaZo1Ly3EA8ZXxlPyHdR8/IuRMYc3E4wdGBewB2QKQjAaA==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-class-static-block@7.26.0':
-    resolution: {integrity: sha512-6J2APTs7BDDm+UMqP1useWqhcRAXo0WIoVj26N7kPFB6S73Lgvyka4KTZYIxtgYXiN5HTyRObA72N2iu628iTQ==}
+  '@babel/plugin-transform-class-static-block@7.29.7':
+    resolution: {integrity: sha512-kibJgmEdX2iMwsHY2tSZNDgj8PwIlCQz7FK9KuGKO8zsuoUwSEhoNnNVp/emKWrbY4HeO6kkXfdMqRKKKXBm2A==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.12.0
 
-  '@babel/plugin-transform-classes@7.25.9':
-    resolution: {integrity: sha512-mD8APIXmseE7oZvZgGABDyM34GUmK45Um2TXiBUt7PnuAxrgoSVf123qUzPxEr/+/BHrRn5NMZCdE2m/1F8DGg==}
+  '@babel/plugin-transform-classes@7.29.7':
+    resolution: {integrity: sha512-qV0OGGBVacduzQHE649JyCneOFI/maT+YKsO+K4Yi3xv2wTPNjM/W2o2gdzMwEAZz7fXNTHAe0NcSg30bIN69g==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-computed-properties@7.25.9':
-    resolution: {integrity: sha512-HnBegGqXZR12xbcTHlJ9HGxw1OniltT26J5YpfruGqtUHlz/xKf/G2ak9e+t0rVqrjXa9WOhvYPz1ERfMj23AA==}
+  '@babel/plugin-transform-computed-properties@7.29.7':
+    resolution: {integrity: sha512-RK7/IyU5phpuCdBAuig5VkzG/EnbDaui5SQGdU9BFrHdV+mV4cUjLMQ9lJDjLNtWHsqtiefpGZUXQP2BiTYMsA==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-destructuring@7.25.9':
-    resolution: {integrity: sha512-WkCGb/3ZxXepmMiX101nnGiU+1CAdut8oHyEOHxkKuS1qKpU2SMXE2uSvfz8PBuLd49V6LEsbtyPhWC7fnkgvQ==}
+  '@babel/plugin-transform-destructuring@7.29.7':
+    resolution: {integrity: sha512-iPX8aD6H9zV5s7ZsqTdNocPN/MGQ5sSMnElKrktxjJRMnB2jN/1p2+R7GkfD6CAYoVFqy5A4XnSIUeGgJzIWpg==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-dotall-regex@7.25.9':
-    resolution: {integrity: sha512-t7ZQ7g5trIgSRYhI9pIJtRl64KHotutUJsh4Eze5l7olJv+mRSg4/MmbZ0tv1eeqRbdvo/+trvJD/Oc5DmW2cA==}
+  '@babel/plugin-transform-dotall-regex@7.29.7':
+    resolution: {integrity: sha512-3qc18hsD2RdZiyJNDNc7HQpv6xbncwh8FYtxNFFzclSyh/trPD9KkVR9BDECUjDLvb7yJVF15GfYUuC+LMkkiQ==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-duplicate-keys@7.25.9':
-    resolution: {integrity: sha512-LZxhJ6dvBb/f3x8xwWIuyiAHy56nrRG3PeYTpBkkzkYRRQ6tJLu68lEF5VIqMUZiAV7a8+Tb78nEoMCMcqjXBw==}
+  '@babel/plugin-transform-duplicate-keys@7.29.7':
+    resolution: {integrity: sha512-6IvRRriEMqnBwD6chtxdLpMYCHWEzN+oL5cyQtjykya19UgzbmKhxmhZgKC/LHxS2nYr9Q/qYPZ5Lr6jOL9+yQ==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-duplicate-named-capturing-groups-regex@7.25.9':
-    resolution: {integrity: sha512-0UfuJS0EsXbRvKnwcLjFtJy/Sxc5J5jhLHnFhy7u4zih97Hz6tJkLU+O+FMMrNZrosUPxDi6sYxJ/EA8jDiAog==}
+  '@babel/plugin-transform-duplicate-named-capturing-groups-regex@7.29.7':
+    resolution: {integrity: sha512-2wiIyo2BjtgU7HufSeDnL9L2O7zr8jmhFKuSr65VpRkUiRKRNpb0mdlk56+XPPKoIrfHqzbMuglDvZun0RISsA==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0
 
-  '@babel/plugin-transform-dynamic-import@7.25.9':
-    resolution: {integrity: sha512-GCggjexbmSLaFhqsojeugBpeaRIgWNTcgKVq/0qIteFEqY2A+b9QidYadrWlnbWQUrW5fn+mCvf3tr7OeBFTyg==}
+  '@babel/plugin-transform-dynamic-import@7.29.7':
+    resolution: {integrity: sha512-giOlEm/EFjfjr+te9NsdjkUo2v4f8rS/SXPumRVHAtbNcyNlvtREkU1dZzaIDclNpnaVhlCqRdFKhJBjBikzLg==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-exponentiation-operator@7.26.3':
-    resolution: {integrity: sha512-7CAHcQ58z2chuXPWblnn1K6rLDnDWieghSOEmqQsrBenH0P9InCUtOJYD89pvngljmZlJcz3fcmgYsXFNGa1ZQ==}
+  '@babel/plugin-transform-explicit-resource-management@7.29.7':
+    resolution: {integrity: sha512-Rstj7coNz8sE+7Ju7ihpHLI564lsK5pUpNNlvptCIC/16E/S5hbl6n3kESPKdNRmqEWlpn5xpS5Q2dvXBsySLw==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-export-namespace-from@7.25.9':
-    resolution: {integrity: sha512-2NsEz+CxzJIVOPx2o9UsW1rXLqtChtLoVnwYHHiB04wS5sgn7mrV45fWMBX0Kk+ub9uXytVYfNP2HjbVbCB3Ww==}
+  '@babel/plugin-transform-exponentiation-operator@7.29.7':
+    resolution: {integrity: sha512-zFpMOTLZBdW5LfObqcSbL6kefg4R4eLdmvS0wbN9M6D5Mym/sKm9toOoWyVOa+xDjvCnuWcHls2YonXwHvH3CQ==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-for-of@7.25.9':
-    resolution: {integrity: sha512-LqHxduHoaGELJl2uhImHwRQudhCM50pT46rIBNvtT/Oql3nqiS3wOwP+5ten7NpYSXrrVLgtZU3DZmPtWZo16A==}
+  '@babel/plugin-transform-export-namespace-from@7.29.7':
+    resolution: {integrity: sha512-24B2nOy2TeJSMheqwPD4DDQOV/elLSIlKxjZt4i05H5AgdPdWR3n18HnNrcJ+j76WJd9gbwb9jPjNYUy6RautA==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-function-name@7.25.9':
-    resolution: {integrity: sha512-8lP+Yxjv14Vc5MuWBpJsoUCd3hD6V9DgBon2FVYL4jJgbnVQ9fTgYmonchzZJOVNgzEgbxp4OwAf6xz6M/14XA==}
+  '@babel/plugin-transform-for-of@7.29.7':
+    resolution: {integrity: sha512-zeSIHh0+E1Um1WJRXCFlHQYu2ieJNdivLLjlBEp+dIBu3S51n+SZZmIXjxnItw6pz56Cn+KvK68BIBVsxq2JiQ==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-json-strings@7.25.9':
-    resolution: {integrity: sha512-xoTMk0WXceiiIvsaquQQUaLLXSW1KJ159KP87VilruQm0LNNGxWzahxSS6T6i4Zg3ezp4vA4zuwiNUR53qmQAw==}
+  '@babel/plugin-transform-function-name@7.29.7':
+    resolution: {integrity: sha512-otRWaHXE6fbAGkePvaj/kvs3HsqXfPhlnzwSOlnFgbqCPMd975dW+4wZ00WFBt+/YlBGcJwNrARQTOJOb4ZrIg==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-literals@7.25.9':
-    resolution: {integrity: sha512-9N7+2lFziW8W9pBl2TzaNht3+pgMIRP74zizeCSrtnSKVdUl8mAjjOP2OOVQAfZ881P2cNjDj1uAMEdeD50nuQ==}
+  '@babel/plugin-transform-json-strings@7.29.7':
+    resolution: {integrity: sha512-RRnE2+eon1rJAq8MnoF1b5kTpY1vU88twHcvcKMrsqP/jxIRqDVs9iJB5fqPuqyeFAW0wJo4MlUIPpQCq/aRsg==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-logical-assignment-operators@7.25.9':
-    resolution: {integrity: sha512-wI4wRAzGko551Y8eVf6iOY9EouIDTtPb0ByZx+ktDGHwv6bHFimrgJM/2T021txPZ2s4c7bqvHbd+vXG6K948Q==}
+  '@babel/plugin-transform-literals@7.29.7':
+    resolution: {integrity: sha512-DZ/oLP21ZuWx1vKqnoNv6/tvEK48AQOBRai40CX9dTjGluvT/YZCyY3rryDtyUqCEoyNroy5KKPwX2iQCiRvyw==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-member-expression-literals@7.25.9':
-    resolution: {integrity: sha512-PYazBVfofCQkkMzh2P6IdIUaCEWni3iYEerAsRWuVd8+jlM1S9S9cz1dF9hIzyoZ8IA3+OwVYIp9v9e+GbgZhA==}
+  '@babel/plugin-transform-logical-assignment-operators@7.29.7':
+    resolution: {integrity: sha512-A0H91hh6W8MFRkp5TqJmMr39jzGD1A1E1Ysiv2O06Sfbhkapm+XyIzxWCEh5kqwOZ1/8QZ0dY3SeQ7XBqfJd5Q==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-modules-amd@7.25.9':
-    resolution: {integrity: sha512-g5T11tnI36jVClQlMlt4qKDLlWnG5pP9CSM4GhdRciTNMRgkfpo5cR6b4rGIOYPgRRuFAvwjPQ/Yk+ql4dyhbw==}
+  '@babel/plugin-transform-member-expression-literals@7.29.7':
+    resolution: {integrity: sha512-hl1kwFZCCiDyfH25Xmco9jTrkPgnS9pmOzSG7W5I4SaGbLeqKv417hcU2RKmaxoPEgsoJh7ZPOrnPGq99bHoUg==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-modules-commonjs@7.26.3':
-    resolution: {integrity: sha512-MgR55l4q9KddUDITEzEFYn5ZsGDXMSsU9E+kh7fjRXTIC3RHqfCo8RPRbyReYJh44HQ/yomFkqbOFohXvDCiIQ==}
+  '@babel/plugin-transform-modules-amd@7.29.7':
+    resolution: {integrity: sha512-fxtQoH3m5ywUSIfaH0FGCzWu4McsYon5bD3K4XnskC7f+OyQMj7rsOMi4NvvmJ83WwBAg4UCe+ov4VZlqEvyew==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-modules-systemjs@7.25.9':
-    resolution: {integrity: sha512-hyss7iIlH/zLHaehT+xwiymtPOpsiwIIRlCAOwBB04ta5Tt+lNItADdlXw3jAWZ96VJ2jlhl/c+PNIQPKNfvcA==}
+  '@babel/plugin-transform-modules-commonjs@7.29.7':
+    resolution: {integrity: sha512-j0vCldybPC5b5dwCQOJ21uKtHzt7hxLygJTg9eF1ScfaikEDNfzn94XoW5Fi+seBR0nCyL23xaBFFkq7dTM8XQ==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-modules-umd@7.25.9':
-    resolution: {integrity: sha512-bS9MVObUgE7ww36HEfwe6g9WakQ0KF07mQF74uuXdkoziUPfKyu/nIm663kz//e5O1nPInPFx36z7WJmJ4yNEw==}
+  '@babel/plugin-transform-modules-systemjs@7.29.8':
+    resolution: {integrity: sha512-6iSnEK0zlkLKU4heofK/AdmRD4e2SHVpJMtrwnTCzhnaM98ria4rTrOXBBi45BTTYnJtO8txnPsX4fChYXkmeA==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-named-capturing-groups-regex@7.25.9':
-    resolution: {integrity: sha512-oqB6WHdKTGl3q/ItQhpLSnWWOpjUJLsOCLVyeFgeTktkBSCiurvPOsyt93gibI9CmuKvTUEtWmG5VhZD+5T/KA==}
+  '@babel/plugin-transform-modules-umd@7.29.7':
+    resolution: {integrity: sha512-B4UkaTK3QpgCwJnrxKfMPKdo92CN7OKXAlpAAnM3UPu0Q0lCCk57ylA9AJbRy2v8dDKOPAAWcoR6CMyeoHwRCA==}
+    engines: {node: '>=6.9.0'}
+    peerDependencies:
+      '@babel/core': ^7.0.0-0
+
+  '@babel/plugin-transform-named-capturing-groups-regex@7.29.7':
+    resolution: {integrity: sha512-vuFoLwr4qnv2xbZ16SQd6uPcH5FNrLHhk/Jzo++0XJFcaDsr4gjJVg6j398oMHiC+83k/GiBzviwF5KBJkPUtQ==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0
 
-  '@babel/plugin-transform-new-target@7.25.9':
-    resolution: {integrity: sha512-U/3p8X1yCSoKyUj2eOBIx3FOn6pElFOKvAAGf8HTtItuPyB+ZeOqfn+mvTtg9ZlOAjsPdK3ayQEjqHjU/yLeVQ==}
+  '@babel/plugin-transform-new-target@7.29.7':
+    resolution: {integrity: sha512-fEo41GmsOUhOBlw8ioo6zvjX5Xc2Lqkzlyfqbpsk3eB6TReV18uhxZ0esfEokVbY2+PVJAQHNKxER6lGrzNd3A==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-nullish-coalescing-operator@7.25.9':
-    resolution: {integrity: sha512-ENfftpLZw5EItALAD4WsY/KUWvhUlZndm5GC7G3evUsVeSJB6p0pBeLQUnRnBCBx7zV0RKQjR9kCuwrsIrjWog==}
+  '@babel/plugin-transform-nullish-coalescing-operator@7.29.7':
+    resolution: {integrity: sha512-idmp1dFaekP9GbcMvG24Kvw2BfhFZjHnNJCkV4WuIY4PskJzwI3f1N5OdgYke38T7rftO6ERulFRn2cFeZwRkg==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-numeric-separator@7.25.9':
-    resolution: {integrity: sha512-TlprrJ1GBZ3r6s96Yq8gEQv82s8/5HnCVHtEJScUj90thHQbwe+E5MLhi2bbNHBEJuzrvltXSru+BUxHDoog7Q==}
+  '@babel/plugin-transform-numeric-separator@7.29.7':
+    resolution: {integrity: sha512-zR7fv/z14OjgHl4AgRtkDBvBMhIzCxqV/qN/2BCRC7LjFwvuzjYe7gDWxC4Wl/SNsLM6SE1IWvRPYMgSJaUvNw==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-object-rest-spread@7.25.9':
-    resolution: {integrity: sha512-fSaXafEE9CVHPweLYw4J0emp1t8zYTXyzN3UuG+lylqkvYd7RMrsOQ8TYx5RF231be0vqtFC6jnx3UmpJmKBYg==}
+  '@babel/plugin-transform-object-rest-spread@7.29.7':
+    resolution: {integrity: sha512-Ld98jn4c0smUywL57m7SgsHq3OpThOa6LqZJif3G6jYOovPleoFhVrBJ1WegRApSFB2wu4+RelAj9AC9G08Z4A==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-object-super@7.25.9':
-    resolution: {integrity: sha512-Kj/Gh+Rw2RNLbCK1VAWj2U48yxxqL2x0k10nPtSdRa0O2xnHXalD0s+o1A6a0W43gJ00ANo38jxkQreckOzv5A==}
+  '@babel/plugin-transform-object-super@7.29.7':
+    resolution: {integrity: sha512-Ea/diGcw0twB5IlZPO5sgET6fJsLJqPABqTuFWIR+iMPGPZJkATEIWx0wa+aEQ5UY1CBQyP/gkAiLEqn1vBiQA==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-optional-catch-binding@7.25.9':
-    resolution: {integrity: sha512-qM/6m6hQZzDcZF3onzIhZeDHDO43bkNNlOX0i8n3lR6zLbu0GN2d8qfM/IERJZYauhAHSLHy39NF0Ctdvcid7g==}
+  '@babel/plugin-transform-optional-catch-binding@7.29.7':
+    resolution: {integrity: sha512-sLsyndxK2VwX6yNUOakMb7Sh553ZTe/vVM1XJ+9Z5aW1ytsc8xOIwmyk05NNjN60vkc5/KqoTH6hB4V41LJhng==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-optional-chaining@7.25.9':
-    resolution: {integrity: sha512-6AvV0FsLULbpnXeBjrY4dmWF8F7gf8QnvTEoO/wX/5xm/xE1Xo8oPuD3MPS+KS9f9XBEAWN7X1aWr4z9HdOr7A==}
+  '@babel/plugin-transform-optional-chaining@7.29.7':
+    resolution: {integrity: sha512-6GM1dhvK3gNODkXcEcMCOLEDCLSoZ/sBbro2Ax8HURyasQ4NshagQixkRFdh5niI6E4gmA/jYI/4aT7rRos3ZQ==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-parameters@7.25.9':
-    resolution: {integrity: sha512-wzz6MKwpnshBAiRmn4jR8LYz/g8Ksg0o80XmwZDlordjwEk9SxBzTWC7F5ef1jhbrbOW2DJ5J6ayRukrJmnr0g==}
+  '@babel/plugin-transform-parameters@7.29.7':
+    resolution: {integrity: sha512-ZDOBqV/qLYJI0YElr8DcENEyARsFQeESqWXH6gZlghYXuPPjvweuDhP4VyEi4BlUBlLRFZVjxoZDMjxhLW766g==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-private-methods@7.25.9':
-    resolution: {integrity: sha512-D/JUozNpQLAPUVusvqMxyvjzllRaF8/nSrP1s2YGQT/W4LHK4xxsMcHjhOGTS01mp9Hda8nswb+FblLdJornQw==}
+  '@babel/plugin-transform-private-methods@7.29.7':
+    resolution: {integrity: sha512-/6Rz4DK1ETDEM/bWHsPHcaEe7ZaT1EqSXjtSP/L0DijOYuaUhiRiOKcwpZ8P7zR4xXEHc2ITdiCgBm9Tpyv9ug==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-private-property-in-object@7.25.9':
-    resolution: {integrity: sha512-Evf3kcMqzXA3xfYJmZ9Pg1OvKdtqsDMSWBDzZOPLvHiTt36E75jLDQo5w1gtRU95Q4E5PDttrTf25Fw8d/uWLw==}
+  '@babel/plugin-transform-private-property-in-object@7.29.7':
+    resolution: {integrity: sha512-+BNo06dnrzdNNqCm1X6YUaVv0DKk8Q+JYcoZfOkLhYWNCXzlwTSRq8zGWayT1csjcpNXV9CQTBRRbmTLZac5cA==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-property-literals@7.25.9':
-    resolution: {integrity: sha512-IvIUeV5KrS/VPavfSM/Iu+RE6llrHrYIKY1yfCzyO/lMXHQ+p7uGhonmGVisv6tSBSVgWzMBohTcvkC9vQcQFA==}
+  '@babel/plugin-transform-property-literals@7.29.7':
+    resolution: {integrity: sha512-bOMRLQuI0A5ZqHq3OWJ89/rXpJ/NJrbVhXiP4zwPGMs6kpcVsuTUNjwoE30K0Qm3mf48a/TnRYYD6vPNqcg6jA==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-regenerator@7.25.9':
-    resolution: {integrity: sha512-vwDcDNsgMPDGP0nMqzahDWE5/MLcX8sv96+wfX7as7LoF/kr97Bo/7fI00lXY4wUXYfVmwIIyG80fGZ1uvt2qg==}
+  '@babel/plugin-transform-regenerator@7.29.8':
+    resolution: {integrity: sha512-0UpIXPtdDtMXfnV2OJAVMLpj3H/92vmkA6lpSRakmycJvj3VUy6Xs1dM8tXRugupykr5WB+LpiVl0J8LMVg2mg==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-regexp-modifiers@7.26.0':
-    resolution: {integrity: sha512-vN6saax7lrA2yA/Pak3sCxuD6F5InBjn9IcrIKQPjpsLvuHYLVroTxjdlVRHjjBWxKOqIwpTXDkOssYT4BFdRw==}
+  '@babel/plugin-transform-regexp-modifiers@7.29.7':
+    resolution: {integrity: sha512-mB5Fs0VWrJ42ZCmc8114v60qetdaUVNkj9PmSZRmanCZM3S9hm0CFRLjRmYIsuXav14l2jvZ+4T8iiCGnhj3nQ==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0
 
-  '@babel/plugin-transform-reserved-words@7.25.9':
-    resolution: {integrity: sha512-7DL7DKYjn5Su++4RXu8puKZm2XBPHyjWLUidaPEkCUBbE7IPcsrkRHggAOOKydH1dASWdcUBxrkOGNxUv5P3Jg==}
+  '@babel/plugin-transform-reserved-words@7.29.7':
+    resolution: {integrity: sha512-5+YhdpVgmfSmwZyLMftfaiffLRMHjzIRHFHHLdibcSyJm2pasMrKHrO3Ptrt2DRshjvpgjEJJ1zVW14WPq/6QA==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-shorthand-properties@7.25.9':
-    resolution: {integrity: sha512-MUv6t0FhO5qHnS/W8XCbHmiRWOphNufpE1IVxhK5kuN3Td9FT1x4rx4K42s3RYdMXCXpfWkGSbCSd0Z64xA7Ng==}
+  '@babel/plugin-transform-shorthand-properties@7.29.7':
+    resolution: {integrity: sha512-I+WYbGBAiCn7nA6xBrlgPH+MB7HWb4u8pv5S0Pv7OtwNvIFvCCb24YlttKEeUFVurfBCEaOTnuhlqsb7f0Z5Dg==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-spread@7.25.9':
-    resolution: {integrity: sha512-oNknIB0TbURU5pqJFVbOOFspVlrpVwo2H1+HUIsVDvp5VauGGDP1ZEvO8Nn5xyMEs3dakajOxlmkNW7kNgSm6A==}
+  '@babel/plugin-transform-spread@7.29.8':
+    resolution: {integrity: sha512-4S9ksMGVWUshvgK0mKfvZky7leuG5/uoFVwMpAomJ8bMoDJiNHRVmc1EglwW/CmGVSqqWpEbXm9FmbRit22qoA==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-sticky-regex@7.25.9':
-    resolution: {integrity: sha512-WqBUSgeVwucYDP9U/xNRQam7xV8W5Zf+6Eo7T2SRVUFlhRiMNFdFz58u0KZmCVVqs2i7SHgpRnAhzRNmKfi2uA==}
+  '@babel/plugin-transform-sticky-regex@7.29.7':
+    resolution: {integrity: sha512-BCHzNYJGe9l7EpwwDBN/ztlL2NYFFq8hp9ddjtUEM9f2O7S7kKV/lL6Fwo7IF7NSkYhPK2vO+86nIGltA90MsA==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-template-literals@7.25.9':
-    resolution: {integrity: sha512-o97AE4syN71M/lxrCtQByzphAdlYluKPDBzDVzMmfCobUjjhAryZV0AIpRPrxN0eAkxXO6ZLEScmt+PNhj2OTw==}
+  '@babel/plugin-transform-template-literals@7.29.7':
+    resolution: {integrity: sha512-NCSEJ4sLFU2gqAub45HYh4fus2yQ36rr6ei6vpU7NdoJqCpxvEG8E6eJpscGyXP3VHD2Ny+fSXr04k1hoUrFqA==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-typeof-symbol@7.25.9':
-    resolution: {integrity: sha512-v61XqUMiueJROUv66BVIOi0Fv/CUuZuZMl5NkRoCVxLAnMexZ0A3kMe7vvZ0nulxMuMp0Mk6S5hNh48yki08ZA==}
+  '@babel/plugin-transform-typeof-symbol@7.29.7':
+    resolution: {integrity: sha512-223mNGoTkBiTEWFoK+Q6Go3tueMRclO8vxxxxquNCYuNI4jWOofFKJRRDu6SDrB8Sgo1UEGW9T4GAQ8ZyRso1A==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-typescript@7.26.3':
-    resolution: {integrity: sha512-6+5hpdr6mETwSKjmJUdYw0EIkATiQhnELWlE3kJFBwSg/BGIVwVaVbX+gOXBCdc7Ln1RXZxyWGecIXhUfnl7oA==}
+  '@babel/plugin-transform-typescript@7.29.7':
+    resolution: {integrity: sha512-jK52h8LaLc7JarhQV2ofeFMts4H7vnOXnqZNA6fYglBTZewRBE51KWt3BUltW1P+KoPsYkHoJeXePuz4zo2LMw==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-unicode-escapes@7.25.9':
-    resolution: {integrity: sha512-s5EDrE6bW97LtxOcGj1Khcx5AaXwiMmi4toFWRDP9/y0Woo6pXC+iyPu/KuhKtfSrNFd7jJB+/fkOtZy6aIC6Q==}
+  '@babel/plugin-transform-unicode-escapes@7.29.7':
+    resolution: {integrity: sha512-jCfXxSjf94lf4E0hKE0AByxF6F3/pVFqRdUUNkDJhsY0m1ZKjnN6ZYyMeHNpzflxb/0q5b7t3p+BE+SLF1WOtA==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-unicode-property-regex@7.25.9':
-    resolution: {integrity: sha512-Jt2d8Ga+QwRluxRQ307Vlxa6dMrYEMZCgGxoPR8V52rxPyldHu3hdlHspxaqYmE7oID5+kB+UKUB/eWS+DkkWg==}
+  '@babel/plugin-transform-unicode-property-regex@7.29.7':
+    resolution: {integrity: sha512-OgZ+zoAJgZLUCunsTRQ5LAjOywDv5zzZ2/hQ5aMw1pGXyY2rtE8/chXYUmu3AlVHKpm10KEdG9aMwbI/K76ZGw==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-unicode-regex@7.25.9':
-    resolution: {integrity: sha512-yoxstj7Rg9dlNn9UQxzk4fcNivwv4nUYz7fYXBaKxvw/lnmPuOm/ikoELygbYq68Bls3D/D+NBPHiLwZdZZ4HA==}
+  '@babel/plugin-transform-unicode-regex@7.29.7':
+    resolution: {integrity: sha512-7D/x/23/d/3VqZ0QA+LGbZMlGwZjztBygSWWWsfTPoQ1oQ6Q1P6Mr3d0kk42XabyUVw+fha3LqdRsFqeKqvCyA==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-unicode-sets-regex@7.25.9':
-    resolution: {integrity: sha512-8BYqO3GeVNHtx69fdPshN3fnzUNLrWdHhk/icSwigksJGczKSizZ+Z6SBCxTs723Fr5VSNorTIK7a+R2tISvwQ==}
+  '@babel/plugin-transform-unicode-sets-regex@7.29.7':
+    resolution: {integrity: sha512-BLOhLht9DOJwIxlmp91wHvkXv1lguuHS3/FwUO8HL1H0u8s4hR1gASVFyilu9iGtcTRYqjTZmlsFFeQletntEg==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0
 
-  '@babel/preset-env@7.26.0':
-    resolution: {integrity: sha512-H84Fxq0CQJNdPFT2DrfnylZ3cf5K43rGfWK4LJGPpjKHiZlk0/RzwEus3PDDZZg+/Er7lCA03MVacueUuXdzfw==}
+  '@babel/preset-env@7.29.7':
+    resolution: {integrity: sha512-GYzX36n1nsciIb0uyH0GHwxwtNwPQIcpxSeiVLDtG/B7jB5xXgchnmL1f/jCX5o+pwnaDBtO60ONSJhEBJfxYA==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
@@ -2275,114 +2630,125 @@ packages:
     peerDependencies:
       '@babel/core': ^7.0.0-0 || ^8.0.0-0 <8.0.0
 
-  '@babel/preset-typescript@7.26.0':
-    resolution: {integrity: sha512-NMk1IGZ5I/oHhoXEElcm+xUnL/szL6xflkFZmoEU9xj1qSJXpiS7rsspYo92B4DRCDvZn2erT5LdsCeXAKNCkg==}
+  '@babel/preset-typescript@7.29.7':
+    resolution: {integrity: sha512-/Foi8vKY2EVbed/1eZx0gJEEwHAIxogrySI7rULcRIvhZzbvoE/b5qG5Ghc0WKAFKOHA9SD1x7RsFlOYdutIiQ==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/runtime@7.26.0':
-    resolution: {integrity: sha512-FDSOghenHTiToteC/QRlv2q3DhPZ/oOXTBoirfWNx1Cx3TMVcGWQtMMmQcSvb/JjpNeGzx8Pq/b4fKEJuWm1sw==}
+  '@babel/runtime@7.29.7':
+    resolution: {integrity: sha512-Nq8OhGWiZIZGV6hLHoyAKLLcJihP/xFeBMGJoUrxTX2psI8dCifzLhZISFb+VWS3wFMRDmCGw5R+dOySCqPLhw==}
     engines: {node: '>=6.9.0'}
 
-  '@babel/standalone@7.26.4':
-    resolution: {integrity: sha512-SF+g7S2mhTT1b7CHyfNjDkPU1corxg4LPYsyP0x5KuCl+EbtBQHRLqr9N3q7e7+x7NQ5LYxQf8mJ2PmzebLr0A==}
+  '@babel/template@7.29.7':
+    resolution: {integrity: sha512-puq+Gf35oI24FeN11LkoUQFqv9uwNeWpxXZi/Ji3rRIoKAzKnxRaZ+Gkj0vKS9ZCiTESfng1N9LyOyXvo+m+Gg==}
     engines: {node: '>=6.9.0'}
 
-  '@babel/template@7.25.9':
-    resolution: {integrity: sha512-9DGttpmPvIxBb/2uwpVo3dqJ+O6RooAFOS+lB+xDqoE2PVCE8nfoHMdZLpfCQRLwvohzXISPZcgxt80xLfsuwg==}
+  '@babel/traverse@7.29.8':
+    resolution: {integrity: sha512-I5z7H3bf/41ktsNVLtpN0wAa336HkqIHQ5BuPLEhTkt1jVSyZpeNKIzTgEWmlxjdg81R0IgUCcaE+Ok3NvrfZg==}
     engines: {node: '>=6.9.0'}
 
-  '@babel/traverse@7.26.4':
-    resolution: {integrity: sha512-fH+b7Y4p3yqvApJALCPJcwb0/XaOSgtK4pzV6WVjPR5GLFQBRI7pfoX2V2iM48NXvX07NUxxm1Vw98YjqTcU5w==}
+  '@babel/types@7.29.8':
+    resolution: {integrity: sha512-Vj1jF3cPfxg7OAfoI7QnVKLoILlm2JF9pnVHrX8qx7AHMiYWT+NDAA7jChlNgRS4WTLc/fD1lXLmPixluj+3Gg==}
     engines: {node: '>=6.9.0'}
 
-  '@babel/types@7.26.3':
-    resolution: {integrity: sha512-vN5p+1kl59GVKMvTHt55NzzmYVxprfJD+ql7U9NFIfKCBkYE55LYtS+WtPlaYOyzydrKI8Nezd+aZextrd+FMA==}
-    engines: {node: '>=6.9.0'}
+  '@babel/types@8.0.4':
+    resolution: {integrity: sha512-eY+Yn3dCqTGmyiq2QRU66lA5FL8lqqqvecHt0fF3uHONIa7ToYsaCiWV8lOKqAs0Rb2SjixiKFROngnulPtt2g==}
+    engines: {node: ^22.18.0 || >=24.11.0}
 
-  '@changesets/apply-release-plan@7.0.7':
-    resolution: {integrity: sha512-qnPOcmmmnD0MfMg9DjU1/onORFyRpDXkMMl2IJg9mECY6RnxL3wN0TCCc92b2sXt1jt8DgjAUUsZYGUGTdYIXA==}
+  '@bufbuild/protobuf@2.13.0':
+    resolution: {integrity: sha512-acq7c49vxfm1ggJ95P70TX7ABDM0vxr1SYD3BB0o0jnBLB4OAqeHyKuN+cD3w80gXEDQ2zxHpR6CUeA+O/aU9g==}
 
-  '@changesets/assemble-release-plan@6.0.5':
-    resolution: {integrity: sha512-IgvBWLNKZd6k4t72MBTBK3nkygi0j3t3zdC1zrfusYo0KpdsvnDjrMM9vPnTCLCMlfNs55jRL4gIMybxa64FCQ==}
+  '@cacheable/memory@2.2.0':
+    resolution: {integrity: sha512-CTLKqLItRCEixEAewD3/j9DB3/o96gpTPD4eJ1v+DGOlxZRZncRQkGYqqnAGCscYd6RNeXfGeiuCphsPtqyIfQ==}
 
-  '@changesets/changelog-git@0.2.0':
-    resolution: {integrity: sha512-bHOx97iFI4OClIT35Lok3sJAwM31VbUM++gnMBV16fdbtBhgYu4dxsphBF/0AZZsyAHMrnM0yFcj5gZM1py6uQ==}
+  '@cacheable/utils@2.5.0':
+    resolution: {integrity: sha512-buipgOVDkkPXNR5+xBpDw7Zk2n1EvU7qBJCNUcL7rhQ//kfpOXPAvQ511Os0vpLYJ1pZnvudNytkQt2hst3wqA==}
 
-  '@changesets/changelog-github@0.5.0':
-    resolution: {integrity: sha512-zoeq2LJJVcPJcIotHRJEEA2qCqX0AQIeFE+L21L8sRLPVqDhSXY8ZWAt2sohtBpFZkBwu+LUwMSKRr2lMy3LJA==}
+  '@changesets/apply-release-plan@7.1.1':
+    resolution: {integrity: sha512-9qPCm/rLx/xoOFXIHGB229+4GOL76S4MC+7tyOuTsR6+1jYlfFDQORdvwR5hDA6y4FL2BPt3qpbcQIS+dW85LA==}
 
-  '@changesets/cli@2.27.11':
-    resolution: {integrity: sha512-1QislpE+nvJgSZZo9+Lj3Lno5pKBgN46dAV8IVxKJy9wX8AOrs9nn5pYVZuDpoxWJJCALmbfOsHkyxujgetQSg==}
+  '@changesets/assemble-release-plan@6.0.10':
+    resolution: {integrity: sha512-rSDcqdJ9KbVyjpBIuCidhvZNIiVt1XaIYp73ycVQRIA5n/j6wQaEk0ChRLMUQ1vkxZe51PTQ9OIhbg6HQMW45A==}
+
+  '@changesets/changelog-git@0.2.1':
+    resolution: {integrity: sha512-x/xEleCFLH28c3bQeQIyeZf8lFXyDFVn1SgcBiR2Tw/r4IAWlk1fzxCEZ6NxQAjF2Nwtczoen3OA2qR+UawQ8Q==}
+
+  '@changesets/changelog-github@0.7.0':
+    resolution: {integrity: sha512-rBsbRvc4TVn+FvFnOVM3LxlFJfTXXCp8gfVJ+0BubxWNSVnLuAzowi5j+IEraLLP52w8AAs9QfKbPS3MMiXQJA==}
+
+  '@changesets/cli@2.31.1':
+    resolution: {integrity: sha512-uO05WTcRBwuVOJVSW8Cmpqw6q0WDL53ajGCMyszutvOe5toOnunbpM4jZzf+qxBOz7i0AzopZ8diBuewjmF40w==}
     hasBin: true
 
-  '@changesets/config@3.0.5':
-    resolution: {integrity: sha512-QyXLSSd10GquX7hY0Mt4yQFMEeqnO5z/XLpbIr4PAkNNoQNKwDyiSrx4yd749WddusH1v3OSiA0NRAYmH/APpQ==}
+  '@changesets/config@3.1.4':
+    resolution: {integrity: sha512-pf0bvD/v6WI2cRlZ6hzpjtZdSlXDXMAJ+Iz7xfFzV4ZxJ8OGGAON+1qYc99ZPrijnt4xp3VGG7eNvAOGS24V1Q==}
 
   '@changesets/errors@0.2.0':
     resolution: {integrity: sha512-6BLOQUscTpZeGljvyQXlWOItQyU71kCdGz7Pi8H8zdw6BI0g3m43iL4xKUVPWtG+qrrL9DTjpdn8eYuCQSRpow==}
 
-  '@changesets/get-dependents-graph@2.1.2':
-    resolution: {integrity: sha512-sgcHRkiBY9i4zWYBwlVyAjEM9sAzs4wYVwJUdnbDLnVG3QwAaia1Mk5P8M7kraTOZN+vBET7n8KyB0YXCbFRLQ==}
+  '@changesets/get-dependents-graph@2.1.4':
+    resolution: {integrity: sha512-ZsS00x6WvmHq3sQv8oCMwL0f/z3wbXCVuSVTJwCnnmbC/iBdNJGFx1EcbMG4PC6sXRyH69liM4A2WKXzn/kRPg==}
 
-  '@changesets/get-github-info@0.6.0':
-    resolution: {integrity: sha512-v/TSnFVXI8vzX9/w3DU2Ol+UlTZcu3m0kXTjTT4KlAdwSvwutcByYwyYn9hwerPWfPkT2JfpoX0KgvCEi8Q/SA==}
+  '@changesets/get-github-info@0.8.0':
+    resolution: {integrity: sha512-cRnC+xdF0JIik7coko3iUP9qbnfi1iJQ3sAa6dE+Tx3+ET8bjFEm63PA4WEohgjYcmsOikPHWzPsMWWiZmntOQ==}
 
-  '@changesets/get-release-plan@4.0.6':
-    resolution: {integrity: sha512-FHRwBkY7Eili04Y5YMOZb0ezQzKikTka4wL753vfUA5COSebt7KThqiuCN9BewE4/qFGgF/5t3AuzXx1/UAY4w==}
+  '@changesets/get-release-plan@4.0.16':
+    resolution: {integrity: sha512-2K5Om6CrMPm45rtvckfzWo7e9jOVCKLCnXia5eUPaURH7/LWzri7pK1TycdzAuAtehLkW7VPbWLCSExTHmiI6g==}
 
   '@changesets/get-version-range-type@0.4.0':
     resolution: {integrity: sha512-hwawtob9DryoGTpixy1D3ZXbGgJu1Rhr+ySH2PvTLHvkZuQ7sRT4oQwMh0hbqZH1weAooedEjRsbrWcGLCeyVQ==}
 
-  '@changesets/git@3.0.2':
-    resolution: {integrity: sha512-r1/Kju9Y8OxRRdvna+nxpQIsMsRQn9dhhAZt94FLDeu0Hij2hnOozW8iqnHBgvu+KdnJppCveQwK4odwfw/aWQ==}
+  '@changesets/git@3.0.4':
+    resolution: {integrity: sha512-BXANzRFkX+XcC1q/d27NKvlJ1yf7PSAgi8JG6dt8EfbHFHi4neau7mufcSca5zRhwOL8j9s6EqsxmT+s+/E6Sw==}
 
   '@changesets/logger@0.1.1':
     resolution: {integrity: sha512-OQtR36ZlnuTxKqoW4Sv6x5YIhOmClRd5pWsjZsddYxpWs517R0HkyiefQPIytCVh4ZcC5x9XaG8KTdd5iRQUfg==}
 
-  '@changesets/parse@0.4.0':
-    resolution: {integrity: sha512-TS/9KG2CdGXS27S+QxbZXgr8uPsP4yNJYb4BC2/NeFUj80Rni3TeD2qwWmabymxmrLo7JEsytXH1FbpKTbvivw==}
+  '@changesets/parse@0.4.3':
+    resolution: {integrity: sha512-ZDmNc53+dXdWEv7fqIUSgRQOLYoUom5Z40gmLgmATmYR9NbL6FJJHwakcCpzaeCy+1D0m0n7mT4jj2B/MQPl7A==}
 
-  '@changesets/pre@2.0.1':
-    resolution: {integrity: sha512-vvBJ/If4jKM4tPz9JdY2kGOgWmCowUYOi5Ycv8dyLnEE8FgpYYUo1mgJZxcdtGGP3aG8rAQulGLyyXGSLkIMTQ==}
+  '@changesets/pre@2.0.2':
+    resolution: {integrity: sha512-HaL/gEyFVvkf9KFg6484wR9s0qjAXlZ8qWPDkTyKF6+zqjBe/I2mygg3MbpZ++hdi0ToqNUF8cjj7fBy0dg8Ug==}
 
-  '@changesets/read@0.6.2':
-    resolution: {integrity: sha512-wjfQpJvryY3zD61p8jR87mJdyx2FIhEcdXhKUqkja87toMrP/3jtg/Yg29upN+N4Ckf525/uvV7a4tzBlpk6gg==}
+  '@changesets/read@0.6.7':
+    resolution: {integrity: sha512-D1G4AUYGrBEk8vj8MGwf75k9GpN6XL3wg8i42P2jZZwFLXnlr2Pn7r9yuQNbaMCarP7ZQWNJbV6XLeysAIMhTA==}
 
-  '@changesets/should-skip-package@0.1.1':
-    resolution: {integrity: sha512-H9LjLbF6mMHLtJIc/eHR9Na+MifJ3VxtgP/Y+XLn4BF7tDTEN1HNYtH6QMcjP1uxp9sjaFYmW8xqloaCi/ckTg==}
+  '@changesets/should-skip-package@0.1.2':
+    resolution: {integrity: sha512-qAK/WrqWLNCP22UDdBTMPH5f41elVDlsNyat180A33dWxuUDyNpg6fPi/FyTZwRriVjg0L8gnjJn2F9XAoF0qw==}
 
   '@changesets/types@4.1.0':
     resolution: {integrity: sha512-LDQvVDv5Kb50ny2s25Fhm3d9QSZimsoUGBsUioj6MC3qbMUCuC8GPIvk/M6IvXx3lYhAs0lwWUQLb+VIEUCECw==}
 
-  '@changesets/types@6.0.0':
-    resolution: {integrity: sha512-b1UkfNulgKoWfqyHtzKS5fOZYSJO+77adgL7DLRDr+/7jhChN+QcHnbjiQVOz/U+Ts3PGNySq7diAItzDgugfQ==}
+  '@changesets/types@6.1.0':
+    resolution: {integrity: sha512-rKQcJ+o1nKNgeoYRHKOS07tAMNd3YSN0uHaJOZYjBAgxfV7TUE7JE+z4BzZdQwb5hKaYbayKN5KrYV7ODb2rAA==}
 
-  '@changesets/write@0.3.2':
-    resolution: {integrity: sha512-kDxDrPNpUgsjDbWBvUo27PzKX4gqeKOlhibaOXDJA6kuBisGqNHv/HwGJrAu8U/dSf8ZEFIeHIPtvSlZI1kULw==}
+  '@changesets/write@0.4.0':
+    resolution: {integrity: sha512-CdTLvIOPiCNuH71pyDu3rA+Q0n65cmAbXnwWH84rKGiFumFzkmHNT8KHTMEchcxN+Kl8I54xGUhJ7l3E7X396Q==}
 
-  '@clack/core@0.4.0':
-    resolution: {integrity: sha512-YJCYBsyJfNDaTbvDUVSJ3SgSuPrcujarRgkJ5NLjexDZKvaOiVVJvAQYx8lIgG0qRT8ff0fPgqyBCVivanIZ+A==}
+  '@clack/core@1.4.3':
+    resolution: {integrity: sha512-/kr3UWNtdJfxZtPgDqUOmG2pvwlmcLGheex5yiZKdwbzZJxhV+HMNR9QNmyY5cGwTNV6LrR7Jtp+KjhUAP1qBQ==}
+    engines: {node: '>= 20.12.0'}
 
-  '@clack/prompts@0.9.0':
-    resolution: {integrity: sha512-nGsytiExgUr4FL0pR/LeqxA28nz3E0cW7eLTSh3Iod9TGrbBt8Y7BHbV3mmkNC4G0evdYyQ3ZsbiBkk7ektArA==}
+  '@clack/prompts@1.7.0':
+    resolution: {integrity: sha512-y7/yvZ2TPAnR9+jnc00klvNNLkJiXFFrQA/hlLCcxA9a2A4zQIOimyFQ9XfwYKiGD1fb5GY8vbKIIgO8d5Tb2A==}
+    engines: {node: '>= 20.12.0'}
 
-  '@cloudflare/kv-asset-handler@0.3.4':
-    resolution: {integrity: sha512-YLPHc8yASwjNkmcDMQMY35yiWjoKAKnhUbPRszBRS0YgH+IXtsMp61j+yTcnCE3oO2DgP0U3iejLC8FTtKDC8Q==}
-    engines: {node: '>=16.13'}
+  '@cloudflare/kv-asset-handler@0.4.2':
+    resolution: {integrity: sha512-SIOD2DxrRRwQ+jgzlXCqoEFiKOFqaPjhnNTGKXSRLvp1HiOvapLaFG2kEr9dYQTYe8rKrd9uvDUzmAITeNyaHQ==}
+    engines: {node: '>=18.0.0'}
 
-  '@codemirror/autocomplete@6.18.6':
-    resolution: {integrity: sha512-PHHBXFomUs5DF+9tCOM/UoW6XQ4R44lLNNhRaW9PKPTU0D7lIjRg3ElxaJnTwsl/oHiR93WSXDBrekhoUGCPtg==}
+  '@codemirror/autocomplete@6.20.3':
+    resolution: {integrity: sha512-tlosUqb+3BbxCxZdu4tKeRghPFC+QM7q4X5YhKV2eCmPG+1r2F3f4AaSz5sCrFqUtX4Jh20VFTKecl16MgiV9g==}
 
-  '@codemirror/commands@6.8.1':
-    resolution: {integrity: sha512-KlGVYufHMQzxbdQONiLyGQDUW0itrLZwq3CcY7xpv9ZLRHqzkBSoteocBHtMCoY7/Ci4xhzSrToIeLg7FxHuaw==}
+  '@codemirror/commands@6.10.4':
+    resolution: {integrity: sha512-Ryk9y9T0FFVF0cUGhAknveAyUOl/A1qReTFi+qPKtOh2Z9F4AUBz3XOrYD4ZEgZirdugVzHvd/2/Wcwy5OliTg==}
 
-  '@codemirror/lang-angular@0.1.3':
-    resolution: {integrity: sha512-xgeWGJQQl1LyStvndWtruUvb4SnBZDAu/gvFH/ZU+c0W25tQR8e5hq7WTwiIY2dNxnf+49mRiGI/9yxIwB6f5w==}
+  '@codemirror/lang-angular@0.1.4':
+    resolution: {integrity: sha512-oap+gsltb/fzdlTQWD6BFF4bSLKcDnlxDsLdePiJpCVNKWXSTAbiiQeYI3UmES+BLAdkmIC1WjyztC1pi/bX4g==}
 
-  '@codemirror/lang-cpp@6.0.2':
-    resolution: {integrity: sha512-6oYEYUKHvrnacXxWxYa6t4puTlbN3dgV662BDfSH8+MfjQjVmP697/KYTDOqpxgerkvoNm7q5wlFMBeX8ZMocg==}
+  '@codemirror/lang-cpp@6.0.3':
+    resolution: {integrity: sha512-URM26M3vunFFn9/sm6rzqrBzDgfWuDixp85uTY49wKudToc2jTHUrKIGGKs+QWND+YLofNNZpxcNGRynFJfvgA==}
 
   '@codemirror/lang-css@6.3.1':
     resolution: {integrity: sha512-kr5fwBGiGtmz6l0LSJIbno9QrifNMUusivHbnA1H6Dmqy4HZFte3UAICix1VuKo0lMPKQr2rqB+0BkKi/S3Ejg==}
@@ -2390,41 +2756,44 @@ packages:
   '@codemirror/lang-go@6.0.1':
     resolution: {integrity: sha512-7fNvbyNylvqCphW9HD6WFnRpcDjr+KXX/FgqXy5H5ZS0eC5edDljukm/yNgYkwTsgp2busdod50AOTIy6Jikfg==}
 
-  '@codemirror/lang-html@6.4.9':
-    resolution: {integrity: sha512-aQv37pIMSlueybId/2PVSP6NPnmurFDVmZwzc7jszd2KAF8qd4VBbvNYPXWQq90WIARjsdVkPbw29pszmHws3Q==}
+  '@codemirror/lang-html@6.4.12':
+    resolution: {integrity: sha512-pw2ReWKUqSkbvh76RAT4NYxiogRu+PWkR2ukAwO9uOgrm8uipkzjtKKtNpyeAQwHOqxEeSvAXZ6vr3AfyB9y/w==}
 
-  '@codemirror/lang-java@6.0.1':
-    resolution: {integrity: sha512-OOnmhH67h97jHzCuFaIEspbmsT98fNdhVhmA3zCxW0cn7l8rChDhZtwiwJ/JOKXgfm4J+ELxQihxaI7bj7mJRg==}
+  '@codemirror/lang-java@6.0.2':
+    resolution: {integrity: sha512-m5Nt1mQ/cznJY7tMfQTJchmrjdjQ71IDs+55d1GAa8DGaB8JXWsVCkVT284C3RTASaY43YknrK2X3hPO/J3MOQ==}
 
-  '@codemirror/lang-javascript@6.2.3':
-    resolution: {integrity: sha512-8PR3vIWg7pSu7ur8A07pGiYHgy3hHj+mRYRCSG8q+mPIrl0F02rgpGv+DsQTHRTc30rydOsf5PZ7yjKFg2Ackw==}
+  '@codemirror/lang-javascript@6.2.5':
+    resolution: {integrity: sha512-zD4e5mS+50htS7F+TYjBPsiIFGanfVqg4HyUz6WNFikgOPf2BgKlx+TQedI1w6n/IqRBVBbBWmGFdLB/7uxO4A==}
 
-  '@codemirror/lang-json@6.0.1':
-    resolution: {integrity: sha512-+T1flHdgpqDDlJZ2Lkil/rLiRy684WMLc74xUnjJH48GQdfJo/pudlTRreZmKwzP8/tGdKf83wlbAdOCzlJOGQ==}
+  '@codemirror/lang-jinja@6.0.1':
+    resolution: {integrity: sha512-P5kyHLObzjtbGj16h+hyvZTxJhSjBEeSx4wMjbnAf3b0uwTy2+F0zGjMZL4PQOm/mh2eGZ5xUDVZXgwP783Nsw==}
+
+  '@codemirror/lang-json@6.0.2':
+    resolution: {integrity: sha512-x2OtO+AvwEHrEwR0FyyPtfDUiloG3rnVTSZV1W8UteaLL8/MajQd8DpvUb2YVzC+/T18aSDv0H9mu+xw0EStoQ==}
 
   '@codemirror/lang-less@6.0.2':
     resolution: {integrity: sha512-EYdQTG22V+KUUk8Qq582g7FMnCZeEHsyuOJisHRft/mQ+ZSZ2w51NupvDUHiqtsOy7It5cHLPGfHQLpMh9bqpQ==}
 
-  '@codemirror/lang-liquid@6.2.3':
-    resolution: {integrity: sha512-yeN+nMSrf/lNii3FJxVVEGQwFG0/2eDyH6gNOj+TGCa0hlNO4bhQnoO5ISnd7JOG+7zTEcI/GOoyraisFVY7jQ==}
+  '@codemirror/lang-liquid@6.3.2':
+    resolution: {integrity: sha512-6PDVU3ZnfeYyz1at1E/ttorErZvZFXXt1OPhtfe1EZJ2V2iDFa0CwPqPgG5F7NXN0yONGoBogKmFAafKTqlwIw==}
 
-  '@codemirror/lang-markdown@6.3.2':
-    resolution: {integrity: sha512-c/5MYinGbFxYl4itE9q/rgN/sMTjOr8XL5OWnC+EaRMLfCbVUmmubTJfdgpfcSS2SCaT7b+Q+xi3l6CgoE+BsA==}
+  '@codemirror/lang-markdown@6.5.2':
+    resolution: {integrity: sha512-AwBOdkWYuA//WcM0xO5PfHPUcmz/O2i5o0Nsg1U69SII/loCJlFI1Romd9xp2HYb1kYJRGZotyqRghuHH5n8Kw==}
 
-  '@codemirror/lang-php@6.0.1':
-    resolution: {integrity: sha512-ublojMdw/PNWa7qdN5TMsjmqkNuTBD3k6ndZ4Z0S25SBAiweFGyY68AS3xNcIOlb6DDFDvKlinLQ40vSLqf8xA==}
+  '@codemirror/lang-php@6.0.2':
+    resolution: {integrity: sha512-ZKy2v1n8Fc8oEXj0Th0PUMXzQJ0AIR6TaZU+PbDHExFwdu+guzOA4jmCHS1Nz4vbFezwD7LyBdDnddSJeScMCA==}
 
-  '@codemirror/lang-python@6.1.7':
-    resolution: {integrity: sha512-mZnFTsL4lW5p9ch8uKNKeRU3xGGxr1QpESLilfON2E3fQzOa/OygEMkaDvERvXDJWJA9U9oN/D4w0ZuUzNO4+g==}
+  '@codemirror/lang-python@6.2.1':
+    resolution: {integrity: sha512-IRjC8RUBhn9mGR9ywecNhB51yePWCGgvHfY1lWN/Mrp3cKuHr0isDKia+9HnvhiWNnMpbGhWrkhuWOc09exRyw==}
 
-  '@codemirror/lang-rust@6.0.1':
-    resolution: {integrity: sha512-344EMWFBzWArHWdZn/NcgkwMvZIWUR1GEBdwG8FEp++6o6vT6KL9V7vGs2ONsKxxFUPXKI0SPcWhyYyl2zPYxQ==}
+  '@codemirror/lang-rust@6.0.2':
+    resolution: {integrity: sha512-EZaGjCUegtiU7kSMvOfEZpaCReowEf3yNidYu7+vfuGTm9ow4mthAparY5hisJqOHmJowVH3Upu+eJlUji6qqA==}
 
   '@codemirror/lang-sass@6.0.2':
     resolution: {integrity: sha512-l/bdzIABvnTo1nzdY6U+kPAC51czYQcOErfzQ9zSm9D8GmNPD0WTW8st/CJwBTPLO8jlrbyvlSEcN20dc4iL0Q==}
 
-  '@codemirror/lang-sql@6.8.0':
-    resolution: {integrity: sha512-aGLmY4OwGqN3TdSx3h6QeA1NrvaYtF7kkoWR/+W7/JzB0gQtJ+VJxewlnE3+VImhA4WVlhmkJr109PefOOhjLg==}
+  '@codemirror/lang-sql@6.10.0':
+    resolution: {integrity: sha512-6ayPkEd/yRw0XKBx5uAiToSgGECo/GY2NoJIHXIIQh1EVwLuKoU8BP/qK0qH5NLXAbtJRLuT73hx7P9X34iO4w==}
 
   '@codemirror/lang-vue@0.1.3':
     resolution: {integrity: sha512-QSKdtYTDRhEHCfo5zOShzxCmqKJvgGrZwDQSdbvCRJ5pRLWBS7pD/8e/tH44aVQT6FKm0t6RVNoSUWHOI5vNug==}
@@ -2435,765 +2804,835 @@ packages:
   '@codemirror/lang-xml@6.1.0':
     resolution: {integrity: sha512-3z0blhicHLfwi2UgkZYRPioSgVTo9PV5GP5ducFH6FaHy0IAJRg+ixj5gTR1gnT/glAIC8xv4w2VL1LoZfs+Jg==}
 
-  '@codemirror/lang-yaml@6.1.2':
-    resolution: {integrity: sha512-dxrfG8w5Ce/QbT7YID7mWZFKhdhsaTNOYjOkSIMt1qmC4VQnXSDSYVHHHn8k6kJUfIhtLo8t1JJgltlxWdsITw==}
+  '@codemirror/lang-yaml@6.1.3':
+    resolution: {integrity: sha512-AZ8DJBuXGVHybpBQhmZtgew5//4hv3tdkXnr3vDmOUMJRuB6vn/uuwtmTOTlqEaQFg3hQSVeA90NmvIQyUV6FQ==}
 
-  '@codemirror/language-data@6.5.1':
-    resolution: {integrity: sha512-0sWxeUSNlBr6OmkqybUTImADFUP0M3P0IiSde4nc24bz/6jIYzqYSgkOSLS+CBIoW1vU8Q9KUWXscBXeoMVC9w==}
+  '@codemirror/language-data@6.5.2':
+    resolution: {integrity: sha512-CPkWBKrNS8stYbEU5kwBwTf3JB1kghlbh4FSAwzGW2TEscdeHHH4FGysREW86Mqnj3Qn09s0/6Ea/TutmoTobg==}
 
-  '@codemirror/language@6.11.0':
-    resolution: {integrity: sha512-A7+f++LodNNc1wGgoRDTt78cOwWm9KVezApgjOMp1W4hM0898nsqBXwF+sbePE7ZRcjN7Sa1Z5m2oN27XkmEjQ==}
+  '@codemirror/language@6.12.4':
+    resolution: {integrity: sha512-1q4PaT+o6PbgpkJt4Q8Fv5XJxTy4FUZ4MWETtyiDw3J0Pyr9E2vqcKL+k9wcvjNTIsauxvE7OfmWj3FRPHQ76A==}
 
-  '@codemirror/legacy-modes@6.5.0':
-    resolution: {integrity: sha512-dNw5pwTqtR1giYjaJyEajunLqxGavZqV0XRtVZyMJnNOD2HmK9DMUmuCAr6RMFGRJ4l8OeQDjpI/us+R09mQsw==}
+  '@codemirror/legacy-modes@6.5.3':
+    resolution: {integrity: sha512-xCsmIzH78MyWkib9jlPaaun57XNkfbMIhagfaZVd0iLTqlpw3jXaIcbZm72MTmmn64eTZpBVNjbyYh+QXnxRsg==}
 
-  '@codemirror/lint@6.8.5':
-    resolution: {integrity: sha512-s3n3KisH7dx3vsoeGMxsbRAgKe4O1vbrnKBClm99PU0fWxmxsx5rR2PfqQgIt+2MMJBHbiJ5rfIdLYfB9NNvsA==}
+  '@codemirror/lint@6.9.7':
+    resolution: {integrity: sha512-28/+iWLYxKxsvGYhSYL7zaCZqLz5+FFFDq9tVsvGv9kv8RY4fFAchJ5WX9M3YrrRlTIsECjsXPqeNgnSmNP2dg==}
 
-  '@codemirror/search@6.5.10':
-    resolution: {integrity: sha512-RMdPdmsrUf53pb2VwflKGHEe1XVM07hI7vV2ntgw1dmqhimpatSJKva4VA9h4TLUDOD4EIF02201oZurpnEFsg==}
+  '@codemirror/search@6.7.1':
+    resolution: {integrity: sha512-uMe5UO6PamJtSHrXhhHOzSX3ReWtiJrva6GnPMwSOrZtiExb5X5eExhr2OUZQVvdxPsKpY3Ro2mFbQadpPWmHA==}
 
-  '@codemirror/state@6.5.2':
-    resolution: {integrity: sha512-FVqsPqtPWKVVL3dPSxy8wEF/ymIEuVzF1PK3VbUgrxXpJUSHQWWZz4JMToquRxnkw+36LTamCZG2iua2Ptq0fA==}
+  '@codemirror/state@6.7.1':
+    resolution: {integrity: sha512-9QzNDgE4EYDnAHfrTlR2lwiPciiOymLtwKK+8yHQzCc7GXhAP9xdEbEJFy2IWB1j9UGUl9BsgMmTo/ImA02T7A==}
 
-  '@codemirror/view@6.36.5':
-    resolution: {integrity: sha512-cd+FZEUlu3GQCYnguYm3EkhJ8KJVisqqUsCOKedBoAt/d9c76JUUap6U0UrpElln5k6VyrEOYliMuDAKIeDQLg==}
+  '@codemirror/view@6.43.8':
+    resolution: {integrity: sha512-qtItTDssZ/5GFfi94hrILu9j/VUeFPDPkhovEfmWFj2ipTxnzPB8DdHgfbb8HYTzLTYhrndKmyQxXUz/PDLenw==}
 
-  '@commitlint/cli@19.6.1':
-    resolution: {integrity: sha512-8hcyA6ZoHwWXC76BoC8qVOSr8xHy00LZhZpauiD0iO0VYbVhMnED0da85lTfIULxl7Lj4c6vZgF0Wu/ed1+jlQ==}
-    engines: {node: '>=v18'}
+  '@colordx/core@5.5.0':
+    resolution: {integrity: sha512-3PxTH8itZzltK0U9jTwVVnjLXvnDYuq3m+QXsHkENxWiPRh4WaoLcs1SQjqgZ55kS+QyirpH5BVwzP2gMVG6EQ==}
+
+  '@commitlint/cli@21.2.1':
+    resolution: {integrity: sha512-blsZGe29hJ72VGEFVl72IVYX+1vsfINpjA9yWQA6i7OKD/McGEOXg08sKIRKjFk4JvzhV/9n0l3i6NooPLTNfg==}
+    engines: {node: '>=22.12.0'}
     hasBin: true
 
-  '@commitlint/config-conventional@19.6.0':
-    resolution: {integrity: sha512-DJT40iMnTYtBtUfw9ApbsLZFke1zKh6llITVJ+x9mtpHD08gsNXaIRqHTmwTZL3dNX5+WoyK7pCN/5zswvkBCQ==}
-    engines: {node: '>=v18'}
+  '@commitlint/config-conventional@21.2.0':
+    resolution: {integrity: sha512-Qf8WRDVcyVd14if6VTWenebxFbKnVnbzPUJjlzjkyJGeHK2xCGd63Dr1XZzj0plXKQb9P0BfOxoc1HVeCo2BWQ==}
+    engines: {node: '>=22.12.0'}
 
-  '@commitlint/config-validator@19.5.0':
-    resolution: {integrity: sha512-CHtj92H5rdhKt17RmgALhfQt95VayrUo2tSqY9g2w+laAXyk7K/Ef6uPm9tn5qSIwSmrLjKaXK9eiNuxmQrDBw==}
-    engines: {node: '>=v18'}
+  '@commitlint/config-validator@21.2.0':
+    resolution: {integrity: sha512-t7AzNHAKeIdo/3NRGwzpufKHsKkPHmFs/56N2Fnsh0/r0rGtnQzTxk6vnFgjaGr4hdSQKNB50/KAhR9Yk4LJKA==}
+    engines: {node: '>=22.12.0'}
 
-  '@commitlint/ensure@19.5.0':
-    resolution: {integrity: sha512-Kv0pYZeMrdg48bHFEU5KKcccRfKmISSm9MvgIgkpI6m+ohFTB55qZlBW6eYqh/XDfRuIO0x4zSmvBjmOwWTwkg==}
-    engines: {node: '>=v18'}
+  '@commitlint/ensure@21.2.0':
+    resolution: {integrity: sha512-76IF9vDNS13lAzEEik9eKwzt8f9hYhWiwVXZ2AnyLCz5/f511FsEQ3pw1X3/zSQpdRLQU7i5qDMVKyXi1GWjSg==}
+    engines: {node: '>=22.12.0'}
 
-  '@commitlint/execute-rule@19.5.0':
-    resolution: {integrity: sha512-aqyGgytXhl2ejlk+/rfgtwpPexYyri4t8/n4ku6rRJoRhGZpLFMqrZ+YaubeGysCP6oz4mMA34YSTaSOKEeNrg==}
-    engines: {node: '>=v18'}
+  '@commitlint/execute-rule@21.0.1':
+    resolution: {integrity: sha512-RifH+FmImozKBE6mozhF4K3r2RRKP7SMi/Q/zLCmExtp5e05lhHOUYqGBlFBAGNHaZxU/WYw1XuugYK9jQzqnA==}
+    engines: {node: '>=22.12.0'}
 
-  '@commitlint/format@19.5.0':
-    resolution: {integrity: sha512-yNy088miE52stCI3dhG/vvxFo9e4jFkU1Mj3xECfzp/bIS/JUay4491huAlVcffOoMK1cd296q0W92NlER6r3A==}
-    engines: {node: '>=v18'}
+  '@commitlint/format@21.2.0':
+    resolution: {integrity: sha512-c4q64xaav2U83t7k7RyzJerBZurPer7FxUOY0RL5L/6CZijZ7K+s6HIBGIghj0ey1P2+seRX0J9XQYtDued6tg==}
+    engines: {node: '>=22.12.0'}
 
-  '@commitlint/is-ignored@19.6.0':
-    resolution: {integrity: sha512-Ov6iBgxJQFR9koOupDPHvcHU9keFupDgtB3lObdEZDroiG4jj1rzky60fbQozFKVYRTUdrBGICHG0YVmRuAJmw==}
-    engines: {node: '>=v18'}
+  '@commitlint/is-ignored@21.2.0':
+    resolution: {integrity: sha512-4/eB0vBN7L88O/oC4ajAEqi7j2ZfNgxl/+11RfAV9YosejZgDXhY2C9VcHnHJhOzPLoSy5P3Mg/46kqeyJfXKw==}
+    engines: {node: '>=22.12.0'}
 
-  '@commitlint/lint@19.6.0':
-    resolution: {integrity: sha512-LRo7zDkXtcIrpco9RnfhOKeg8PAnE3oDDoalnrVU/EVaKHYBWYL1DlRR7+3AWn0JiBqD8yKOfetVxJGdEtZ0tg==}
-    engines: {node: '>=v18'}
+  '@commitlint/lint@21.2.0':
+    resolution: {integrity: sha512-ceO5dp9pLjEZ6y6qbq/uXWXDPykqqlTsyzoQ0NzecpisSJhK3kTy9qzQoPeJuWG/IMNdV1lO0RgmzqoAlSi1uw==}
+    engines: {node: '>=22.12.0'}
 
-  '@commitlint/load@19.6.1':
-    resolution: {integrity: sha512-kE4mRKWWNju2QpsCWt428XBvUH55OET2N4QKQ0bF85qS/XbsRGG1MiTByDNlEVpEPceMkDr46LNH95DtRwcsfA==}
-    engines: {node: '>=v18'}
+  '@commitlint/load@21.2.0':
+    resolution: {integrity: sha512-RjlzWQqruRwIenJEfZtq7kG97co97nKoHpflE5YnF61tDLXxHPrdWImgzw6VL6MlFyaOcVlk74eBV8ZQmc3oIA==}
+    engines: {node: '>=22.12.0'}
 
-  '@commitlint/message@19.5.0':
-    resolution: {integrity: sha512-R7AM4YnbxN1Joj1tMfCyBryOC5aNJBdxadTZkuqtWi3Xj0kMdutq16XQwuoGbIzL2Pk62TALV1fZDCv36+JhTQ==}
-    engines: {node: '>=v18'}
+  '@commitlint/message@21.2.0':
+    resolution: {integrity: sha512-YxGoiXD/HXNXLJPrQwE5poXa+XH0CBEm+mdvbHQP0g6MV/dmJyUFCzPNzZbxL93GvZ70TmtTK0Z0/IBpAqHv8g==}
+    engines: {node: '>=22.12.0'}
 
-  '@commitlint/parse@19.5.0':
-    resolution: {integrity: sha512-cZ/IxfAlfWYhAQV0TwcbdR1Oc0/r0Ik1GEessDJ3Lbuma/MRO8FRQX76eurcXtmhJC//rj52ZSZuXUg0oIX0Fw==}
-    engines: {node: '>=v18'}
+  '@commitlint/parse@21.2.0':
+    resolution: {integrity: sha512-QHWxG4d0PLTF634/AdyZ0MQS+CLn5YOuJlCFhMMlSGKFxzYGUetkHBj18xgBD+6fVzUrA2lrCdi/vlS2f/oYXg==}
+    engines: {node: '>=22.12.0'}
 
-  '@commitlint/read@19.5.0':
-    resolution: {integrity: sha512-TjS3HLPsLsxFPQj6jou8/CZFAmOP2y+6V4PGYt3ihbQKTY1Jnv0QG28WRKl/d1ha6zLODPZqsxLEov52dhR9BQ==}
-    engines: {node: '>=v18'}
+  '@commitlint/read@21.2.1':
+    resolution: {integrity: sha512-hUW7EJQnNTL0vPOmVMNK4CrnrNBN0nN+JJHReFkdHO5y4iyHeEmTBwuC15OCqUTjxWo7idnH1LftfpWVIaPWIA==}
+    engines: {node: '>=22.12.0'}
 
-  '@commitlint/resolve-extends@19.5.0':
-    resolution: {integrity: sha512-CU/GscZhCUsJwcKTJS9Ndh3AKGZTNFIOoQB2n8CmFnizE0VnEuJoum+COW+C1lNABEeqk6ssfc1Kkalm4bDklA==}
-    engines: {node: '>=v18'}
+  '@commitlint/resolve-extends@21.2.0':
+    resolution: {integrity: sha512-4O/1j51+79Wth9s/MGxt/5gs0XYLDgNlYpltQfhAvLE0itusLKs9zruxbiNg1oOkmkb9L9L4USYGjEj7n87NxA==}
+    engines: {node: '>=22.12.0'}
 
-  '@commitlint/rules@19.6.0':
-    resolution: {integrity: sha512-1f2reW7lbrI0X0ozZMesS/WZxgPa4/wi56vFuJENBmed6mWq5KsheN/nxqnl/C23ioxpPO/PL6tXpiiFy5Bhjw==}
-    engines: {node: '>=v18'}
+  '@commitlint/rules@21.2.0':
+    resolution: {integrity: sha512-C2yXMNpiB8ETZKfx5JD8+ExgF8vTU1VQMKPSUUYwqKpw9oJWQBrlXBpdU038mj2WPjof7o9UzFpmTyBeGMZwZg==}
+    engines: {node: '>=22.12.0'}
 
-  '@commitlint/to-lines@19.5.0':
-    resolution: {integrity: sha512-R772oj3NHPkodOSRZ9bBVNq224DOxQtNef5Pl8l2M8ZnkkzQfeSTr4uxawV2Sd3ui05dUVzvLNnzenDBO1KBeQ==}
-    engines: {node: '>=v18'}
+  '@commitlint/to-lines@21.0.1':
+    resolution: {integrity: sha512-bd1BFII7p1EQZre9Kaj+kKaMFP3cFCdt21K7DItVux9XP5WjLgJ0/Uy1pJJh9aPwVJ6SKg62PxqlZaHI8hQAXw==}
+    engines: {node: '>=22.12.0'}
 
-  '@commitlint/top-level@19.5.0':
-    resolution: {integrity: sha512-IP1YLmGAk0yWrImPRRc578I3dDUI5A2UBJx9FbSOjxe9sTlzFiwVJ+zeMLgAtHMtGZsC8LUnzmW1qRemkFU4ng==}
-    engines: {node: '>=v18'}
+  '@commitlint/top-level@21.2.0':
+    resolution: {integrity: sha512-Y5gmQ+KxzqCrBFJfLvFEPvvwD3LDiNZoTT2yeFBm96M8qhmqSzQc5DvX3rheAaAMjyIvMXOCLS/mWfdpONsjyQ==}
+    engines: {node: '>=22.12.0'}
 
-  '@commitlint/types@19.5.0':
-    resolution: {integrity: sha512-DSHae2obMSMkAtTBSOulg5X7/z+rGLxcXQIkg3OmWvY6wifojge5uVMydfhUvs7yQj+V7jNmRZ2Xzl8GJyqRgg==}
-    engines: {node: '>=v18'}
+  '@commitlint/types@21.2.0':
+    resolution: {integrity: sha512-7zVFCDB2reMvJH5dmbKnOQPjZEvjdJTH8jc0U/PIPU1r3/+vf5pD1HlfitV2MWsWXrvu7u39iY1lyLUPOaN0Gw==}
+    engines: {node: '>=22.12.0'}
 
-  '@cspell/cspell-bundled-dicts@8.17.1':
-    resolution: {integrity: sha512-HmkXS5uX4bk/XxsRS4Q+zRvhgRa81ddGiR2/Xfag9MIi5L5UnEJ4g21EpmIlXkMxYrTu2fp69SZFss5NfcFF9Q==}
-    engines: {node: '>=18'}
-
-  '@cspell/cspell-json-reporter@8.17.1':
-    resolution: {integrity: sha512-EV9Xkh42Xw3aORvDZfxusICX91DDbqQpYdGKBdPGuhgxWOUYYZKpLXsHCmDkhruMPo2m5gDh++/OqjLRPZofKQ==}
-    engines: {node: '>=18'}
-
-  '@cspell/cspell-pipe@8.17.1':
-    resolution: {integrity: sha512-uhC99Ox+OH3COSgShv4fpVHiotR70dNvAOSkzRvKVRzV6IGyFnxHjmyVVPEV0dsqzVLxltwYTqFhwI+UOwm45A==}
-    engines: {node: '>=18'}
-
-  '@cspell/cspell-resolver@8.17.1':
-    resolution: {integrity: sha512-XEK2ymTdQNgsV3ny60VkKzWskbICl4zNXh/DbxsoRXHqIRg43MXFpTNkEJ7j873EqdX7BU4opQQ+5D4stWWuhQ==}
-    engines: {node: '>=18'}
-
-  '@cspell/cspell-service-bus@8.17.1':
-    resolution: {integrity: sha512-2sFWQtMEWZ4tdz7bw0bAx4NaV1t0ynGfjpuKWdQppsJFKNb+ZPZZ6Ah1dC13AdRRMZaG194kDRFwzNvRaCgWkQ==}
-    engines: {node: '>=18'}
-
-  '@cspell/cspell-types@8.17.1':
-    resolution: {integrity: sha512-NJbov7Jp57fh8addoxesjb8atg/APQfssCH5Q9uZuHBN06wEJDgs7fhfE48bU+RBViC9gltblsYZzZZQKzHYKg==}
-    engines: {node: '>=18'}
-
-  '@cspell/dict-ada@4.0.5':
-    resolution: {integrity: sha512-6/RtZ/a+lhFVmrx/B7bfP7rzC4yjEYe8o74EybXcvu4Oue6J4Ey2WSYj96iuodloj1LWrkNCQyX5h4Pmcj0Iag==}
-
-  '@cspell/dict-al@1.0.3':
-    resolution: {integrity: sha512-V1HClwlfU/qwSq2Kt+MkqRAsonNu3mxjSCDyGRecdLGIHmh7yeEeaxqRiO/VZ4KP+eVSiSIlbwrb5YNFfxYZbw==}
-
-  '@cspell/dict-aws@4.0.7':
-    resolution: {integrity: sha512-PoaPpa2NXtSkhGIMIKhsJUXB6UbtTt6Ao3x9JdU9kn7fRZkwD4RjHDGqulucIOz7KeEX/dNRafap6oK9xHe4RA==}
-
-  '@cspell/dict-bash@4.1.8':
-    resolution: {integrity: sha512-I2CM2pTNthQwW069lKcrVxchJGMVQBzru2ygsHCwgidXRnJL/NTjAPOFTxN58Jc1bf7THWghfEDyKX/oyfc0yg==}
-
-  '@cspell/dict-companies@3.1.9':
-    resolution: {integrity: sha512-w7XEJ2B6x2jq9ws5XNyYgpYj2MxdZ3jW3PETLxjK7nc8pulCFmaGVgZ0JTnDWfJ3QMOczoagn5f9LM2PZ/CuJg==}
-
-  '@cspell/dict-cpp@6.0.2':
-    resolution: {integrity: sha512-yw5eejWvY4bAnc6LUA44m4WsFwlmgPt2uMSnO7QViGMBDuoeopMma4z9XYvs4lSjTi8fIJs/A1YDfM9AVzb8eg==}
-
-  '@cspell/dict-cryptocurrencies@5.0.3':
-    resolution: {integrity: sha512-bl5q+Mk+T3xOZ12+FG37dB30GDxStza49Rmoax95n37MTLksk9wBo1ICOlPJ6PnDUSyeuv4SIVKgRKMKkJJglA==}
-
-  '@cspell/dict-csharp@4.0.5':
-    resolution: {integrity: sha512-c/sFnNgtRwRJxtC3JHKkyOm+U3/sUrltFeNwml9VsxKBHVmvlg4tk4ar58PdpW9/zTlGUkWi2i85//DN1EsUCA==}
-
-  '@cspell/dict-css@4.0.16':
-    resolution: {integrity: sha512-70qu7L9z/JR6QLyJPk38fNTKitlIHnfunx0wjpWQUQ8/jGADIhMCrz6hInBjqPNdtGpYm8d1dNFyF8taEkOgrQ==}
-
-  '@cspell/dict-dart@2.2.4':
-    resolution: {integrity: sha512-of/cVuUIZZK/+iqefGln8G3bVpfyN6ZtH+LyLkHMoR5tEj+2vtilGNk9ngwyR8L4lEqbKuzSkOxgfVjsXf5PsQ==}
-
-  '@cspell/dict-data-science@2.0.5':
-    resolution: {integrity: sha512-nNSILXmhSJox9/QoXICPQgm8q5PbiSQP4afpbkBqPi/u/b3K9MbNH5HvOOa6230gxcGdbZ9Argl2hY/U8siBlg==}
-
-  '@cspell/dict-django@4.1.3':
-    resolution: {integrity: sha512-yBspeL3roJlO0a1vKKNaWABURuHdHZ9b1L8d3AukX0AsBy9snSggc8xCavPmSzNfeMDXbH+1lgQiYBd3IW03fg==}
-
-  '@cspell/dict-docker@1.1.11':
-    resolution: {integrity: sha512-s0Yhb16/R+UT1y727ekbR/itWQF3Qz275DR1ahOa66wYtPjHUXmhM3B/LT3aPaX+hD6AWmK23v57SuyfYHUjsw==}
-
-  '@cspell/dict-dotnet@5.0.8':
-    resolution: {integrity: sha512-MD8CmMgMEdJAIPl2Py3iqrx3B708MbCIXAuOeZ0Mzzb8YmLmiisY7QEYSZPg08D7xuwARycP0Ki+bb0GAkFSqg==}
-
-  '@cspell/dict-elixir@4.0.6':
-    resolution: {integrity: sha512-TfqSTxMHZ2jhiqnXlVKM0bUADtCvwKQv2XZL/DI0rx3doG8mEMS8SGPOmiyyGkHpR/pGOq18AFH3BEm4lViHIw==}
-
-  '@cspell/dict-en-common-misspellings@2.0.7':
-    resolution: {integrity: sha512-qNFo3G4wyabcwnM+hDrMYKN9vNVg/k9QkhqSlSst6pULjdvPyPs1mqz1689xO/v9t8e6sR4IKc3CgUXDMTYOpA==}
-
-  '@cspell/dict-en-gb@1.1.33':
-    resolution: {integrity: sha512-tKSSUf9BJEV+GJQAYGw5e+ouhEe2ZXE620S7BLKe3ZmpnjlNG9JqlnaBhkIMxKnNFkLY2BP/EARzw31AZnOv4g==}
-
-  '@cspell/dict-en_us@4.3.28':
-    resolution: {integrity: sha512-BN1PME7cOl7DXRQJ92pEd1f0Xk5sqjcDfThDGkKcsgwbSOY7KnTc/czBW6Pr3WXIchIm6cT12KEfjNqx7U7Rrw==}
-
-  '@cspell/dict-filetypes@3.0.9':
-    resolution: {integrity: sha512-U7ycC1cE32A5aEgwzp/iE0TVabonUFnVt+Ygbf6NsIWqEuFWZgZChC7gfztA4T1fpuj602nFdp7eOnTWKORsnQ==}
-
-  '@cspell/dict-flutter@1.0.3':
-    resolution: {integrity: sha512-52C9aUEU22ptpgYh6gQyIdA4MP6NPwzbEqndfgPh3Sra191/kgs7CVqXiO1qbtZa9gnYHUoVApkoxRE7mrXHfg==}
-
-  '@cspell/dict-fonts@4.0.3':
-    resolution: {integrity: sha512-sPd17kV5qgYXLteuHFPn5mbp/oCHKgitNfsZLFC3W2fWEgZlhg4hK+UGig3KzrYhhvQ8wBnmZrAQm0TFKCKzsA==}
-
-  '@cspell/dict-fsharp@1.0.4':
-    resolution: {integrity: sha512-G5wk0o1qyHUNi9nVgdE1h5wl5ylq7pcBjX8vhjHcO4XBq20D5eMoXjwqMo/+szKAqzJ+WV3BgAL50akLKrT9Rw==}
-
-  '@cspell/dict-fullstack@3.2.3':
-    resolution: {integrity: sha512-62PbndIyQPH11mAv0PyiyT0vbwD0AXEocPpHlCHzfb5v9SspzCCbzQ/LIBiFmyRa+q5LMW35CnSVu6OXdT+LKg==}
-
-  '@cspell/dict-gaming-terms@1.0.9':
-    resolution: {integrity: sha512-AVIrZt3YiUnxsUzzGYTZ1XqgtkgwGEO0LWIlEf+SiDUEVLtv4CYmmyXFQ+WXDN0pyJ0wOwDazWrP0Cu7avYQmQ==}
-
-  '@cspell/dict-git@3.0.3':
-    resolution: {integrity: sha512-LSxB+psZ0qoj83GkyjeEH/ZViyVsGEF/A6BAo8Nqc0w0HjD2qX/QR4sfA6JHUgQ3Yi/ccxdK7xNIo67L2ScW5A==}
-
-  '@cspell/dict-golang@6.0.17':
-    resolution: {integrity: sha512-uDDLEJ/cHdLiqPw4+5BnmIo2i/TSR+uDvYd6JlBjTmjBKpOCyvUgYRztH7nv5e7virsN5WDiUWah4/ATQGz4Pw==}
-
-  '@cspell/dict-google@1.0.4':
-    resolution: {integrity: sha512-JThUT9eiguCja1mHHLwYESgxkhk17Gv7P3b1S7ZJzXw86QyVHPrbpVoMpozHk0C9o+Ym764B7gZGKmw9uMGduQ==}
-
-  '@cspell/dict-haskell@4.0.4':
-    resolution: {integrity: sha512-EwQsedEEnND/vY6tqRfg9y7tsnZdxNqOxLXSXTsFA6JRhUlr8Qs88iUUAfsUzWc4nNmmzQH2UbtT25ooG9x4nA==}
-
-  '@cspell/dict-html-symbol-entities@4.0.3':
-    resolution: {integrity: sha512-aABXX7dMLNFdSE8aY844X4+hvfK7977sOWgZXo4MTGAmOzR8524fjbJPswIBK7GaD3+SgFZ2yP2o0CFvXDGF+A==}
-
-  '@cspell/dict-html@4.0.10':
-    resolution: {integrity: sha512-I9uRAcdtHbh0wEtYZlgF0TTcgH0xaw1B54G2CW+tx4vHUwlde/+JBOfIzird4+WcMv4smZOfw+qHf7puFUbI5g==}
-
-  '@cspell/dict-java@5.0.10':
-    resolution: {integrity: sha512-pVNcOnmoGiNL8GSVq4WbX/Vs2FGS0Nej+1aEeGuUY9CU14X8yAVCG+oih5ZoLt1jaR8YfR8byUF8wdp4qG4XIw==}
-
-  '@cspell/dict-julia@1.0.4':
-    resolution: {integrity: sha512-bFVgNX35MD3kZRbXbJVzdnN7OuEqmQXGpdOi9jzB40TSgBTlJWA4nxeAKV4CPCZxNRUGnLH0p05T/AD7Aom9/w==}
-
-  '@cspell/dict-k8s@1.0.9':
-    resolution: {integrity: sha512-Q7GELSQIzo+BERl2ya/nBEnZeQC+zJP19SN1pI6gqDYraM51uYJacbbcWLYYO2Y+5joDjNt/sd/lJtLaQwoSlA==}
-
-  '@cspell/dict-latex@4.0.3':
-    resolution: {integrity: sha512-2KXBt9fSpymYHxHfvhUpjUFyzrmN4c4P8mwIzweLyvqntBT3k0YGZJSriOdjfUjwSygrfEwiuPI1EMrvgrOMJw==}
-
-  '@cspell/dict-lorem-ipsum@4.0.3':
-    resolution: {integrity: sha512-WFpDi/PDYHXft6p0eCXuYnn7mzMEQLVeqpO+wHSUd+kz5ADusZ4cpslAA4wUZJstF1/1kMCQCZM6HLZic9bT8A==}
-
-  '@cspell/dict-lua@4.0.6':
-    resolution: {integrity: sha512-Jwvh1jmAd9b+SP9e1GkS2ACbqKKRo9E1f9GdjF/ijmooZuHU0hPyqvnhZzUAxO1egbnNjxS/J2T6iUtjAUK2KQ==}
-
-  '@cspell/dict-makefile@1.0.3':
-    resolution: {integrity: sha512-R3U0DSpvTs6qdqfyBATnePj9Q/pypkje0Nj26mQJ8TOBQutCRAJbr2ZFAeDjgRx5EAJU/+8txiyVF97fbVRViw==}
-
-  '@cspell/dict-markdown@2.0.7':
-    resolution: {integrity: sha512-F9SGsSOokFn976DV4u/1eL4FtKQDSgJHSZ3+haPRU5ki6OEqojxKa8hhj4AUrtNFpmBaJx/WJ4YaEzWqG7hgqg==}
+  '@conventional-changelog/git-client@3.1.1':
+    resolution: {integrity: sha512-w/q+UIVdWQMgXlziPIYfPlyDud+H8kcvSCzDQQoc/gid7yZzb6eNfAkNN4UlEcS2cVVh924jevsOIb36d0In2g==}
+    engines: {node: '>=22'}
     peerDependencies:
-      '@cspell/dict-css': ^4.0.16
-      '@cspell/dict-html': ^4.0.10
-      '@cspell/dict-html-symbol-entities': ^4.0.3
-      '@cspell/dict-typescript': ^3.1.11
+      conventional-commits-filter: ^6.0.1
+      conventional-commits-parser: ^7.1.2
+    peerDependenciesMeta:
+      conventional-commits-filter:
+        optional: true
+      conventional-commits-parser:
+        optional: true
 
-  '@cspell/dict-monkeyc@1.0.9':
-    resolution: {integrity: sha512-Jvf6g5xlB4+za3ThvenYKREXTEgzx5gMUSzrAxIiPleVG4hmRb/GBSoSjtkGaibN3XxGx5x809gSTYCA/IHCpA==}
+  '@conventional-changelog/template@1.2.1':
+    resolution: {integrity: sha512-TzlTVpKPjaqW6qOYjQcYUDuGsLCNsvFHVBXkYGTAnf5V37jCWrE5haKNXzz0WZUtVHjrpV76L1buANjwXMfT8w==}
+    engines: {node: '>=22'}
 
-  '@cspell/dict-node@5.0.5':
-    resolution: {integrity: sha512-7NbCS2E8ZZRZwlLrh2sA0vAk9n1kcTUiRp/Nia8YvKaItGXLfxYqD2rMQ3HpB1kEutal6hQLVic3N2Yi1X7AaA==}
+  '@cspell/cspell-bundled-dicts@10.0.1':
+    resolution: {integrity: sha512-WvkSDNX4Uyyj/ZgbPO6L38iFNMfK1EqsH1FteRiI2qLz6QZMXRFrIt12OqiWIplzZDDaVpBH9FCJOPJll0fjCQ==}
+    engines: {node: '>=22.18.0'}
 
-  '@cspell/dict-npm@5.1.18':
-    resolution: {integrity: sha512-/Nukl+DSxtEWSlb8svWFSpJVctAsM9SP+f5Q1n+qdDcXNKMb1bUCo/d3QZPwyOhuMjDawnsGBUAfp+iq7Mw83Q==}
+  '@cspell/cspell-json-reporter@10.0.1':
+    resolution: {integrity: sha512-/nes1RGILec3WCBcoMOd0byNTBtnJuPaVz/+ZzqYkLtY7x58VMcBG5kyP6hPyN8cIwjRADE/SR43gwdXuqk/FA==}
+    engines: {node: '>=22.18.0'}
 
-  '@cspell/dict-php@4.0.13':
-    resolution: {integrity: sha512-P6sREMZkhElzz/HhXAjahnICYIqB/HSGp1EhZh+Y6IhvC15AzgtDP8B8VYCIsQof6rPF1SQrFwunxOv8H1e2eg==}
+  '@cspell/cspell-performance-monitor@10.0.1':
+    resolution: {integrity: sha512-9tVcHXwRnbazUv4WSG0h3MqV4+LgmLNgSALAQUflPPW0EMxTf7C4Dmv9cgxJyCEQrdnVKCr58nPPaahhz9LJUg==}
+    engines: {node: '>=22.18.0'}
 
-  '@cspell/dict-powershell@5.0.13':
-    resolution: {integrity: sha512-0qdj0XZIPmb77nRTynKidRJKTU0Fl+10jyLbAhFTuBWKMypVY06EaYFnwhsgsws/7nNX8MTEQuewbl9bWFAbsg==}
+  '@cspell/cspell-pipe@10.0.1':
+    resolution: {integrity: sha512-HPeXMD9AZ3V/qPkvQaPcak+C7cJ2z7JTHN8smd6J8L2aThLRky2cHc2OyeaHPSHB7WA47b4z2n5u5nawZhv5VQ==}
+    engines: {node: '>=22.18.0'}
 
-  '@cspell/dict-public-licenses@2.0.11':
-    resolution: {integrity: sha512-rR5KjRUSnVKdfs5G+gJ4oIvQvm8+NJ6cHWY2N+GE69/FSGWDOPHxulCzeGnQU/c6WWZMSimG9o49i9r//lUQyA==}
+  '@cspell/cspell-resolver@10.0.1':
+    resolution: {integrity: sha512-PIzkZHD1fGUQx1XteK2d1iQ0Mzq/maYcoB4jkvAiiR6WqP3MWYNKFdI9z+R5pOq5KgMfW+5Ig1q0oSR6h8irlA==}
+    engines: {node: '>=22.18.0'}
 
-  '@cspell/dict-python@4.2.13':
-    resolution: {integrity: sha512-mZIcmo9qif8LkJ6N/lqTZawcOk2kVTcuWIUOSbMcjyomO0XZ7iWz15TfONyr03Ea/l7o5ULV+MZ4vx76bAUb7w==}
+  '@cspell/cspell-service-bus@10.0.1':
+    resolution: {integrity: sha512-y6NcIGP2IdXaBL4PVH8vxsr7K27wzz3Ech87UtUtrDSXAiVEOvXgAIknEOUVp59rTlUE8Rn4IRURC6f/hgMyfw==}
+    engines: {node: '>=22.18.0'}
 
-  '@cspell/dict-r@2.0.4':
-    resolution: {integrity: sha512-cBpRsE/U0d9BRhiNRMLMH1PpWgw+N+1A2jumgt1if9nBGmQw4MUpg2u9I0xlFVhstTIdzXiLXMxP45cABuiUeQ==}
+  '@cspell/cspell-types@10.0.1':
+    resolution: {integrity: sha512-kLgLShnWADDVreKC63pBrWkcvxgZzFIfO34Jhx/SWfuOIA3cD8AXT+HjyuLfoGJ7mUb58hv2kUziKzEy4INb1w==}
+    engines: {node: '>=22.18.0'}
 
-  '@cspell/dict-ruby@5.0.7':
-    resolution: {integrity: sha512-4/d0hcoPzi5Alk0FmcyqlzFW9lQnZh9j07MJzPcyVO62nYJJAGKaPZL2o4qHeCS/od/ctJC5AHRdoUm0ktsw6Q==}
+  '@cspell/cspell-worker@10.0.1':
+    resolution: {integrity: sha512-L2bJerfuYOls2wEknm8FmynLtj/G7O4UqX9I/HznRggEW6i2yZIxagDetpVDNowpyavNHJ3SJtUFiyMiZc16Sw==}
+    engines: {node: '>=22.18.0'}
 
-  '@cspell/dict-rust@4.0.10':
-    resolution: {integrity: sha512-6o5C8566VGTTctgcwfF3Iy7314W0oMlFFSQOadQ0OEdJ9Z9ERX/PDimrzP3LGuOrvhtEFoK8pj+BLnunNwRNrw==}
+  '@cspell/dict-ada@4.1.1':
+    resolution: {integrity: sha512-E+0YW9RhZod/9Qy2gxfNZiHJjCYFlCdI69br1eviQQWB8yOTJX0JHXLs79kOYhSW0kINPVUdvddEBe6Lu6CjGQ==}
 
-  '@cspell/dict-scala@5.0.6':
-    resolution: {integrity: sha512-tl0YWAfjUVb4LyyE4JIMVE8DlLzb1ecHRmIWc4eT6nkyDqQgHKzdHsnusxFEFMVLIQomgSg0Zz6hJ5S1E4W4ww==}
+  '@cspell/dict-al@1.1.1':
+    resolution: {integrity: sha512-sD8GCaZetgQL4+MaJLXqbzWcRjfKVp8x+px3HuCaaiATAAtvjwUQ5/Iubiqwfd1boIh2Y1/3EgM3TLQ7Q8e0wQ==}
 
-  '@cspell/dict-software-terms@4.1.20':
-    resolution: {integrity: sha512-ma51njqbk9ZKzZF9NpCZpZ+c50EwR5JTJ2LEXlX0tX+ExVbKpthhlDLhT2+mkUh5Zvj+CLf5F9z0qB4+X3re/w==}
+  '@cspell/dict-aws@4.0.17':
+    resolution: {integrity: sha512-ORcblTWcdlGjIbWrgKF+8CNEBQiLVKdUOFoTn0KPNkAYnFcdPP0muT4892h7H4Xafh3j72wqB4/loQ6Nti9E/w==}
 
-  '@cspell/dict-sql@2.1.8':
-    resolution: {integrity: sha512-dJRE4JV1qmXTbbGm6WIcg1knmR6K5RXnQxF4XHs5HA3LAjc/zf77F95i5LC+guOGppVF6Hdl66S2UyxT+SAF3A==}
+  '@cspell/dict-bash@4.2.3':
+    resolution: {integrity: sha512-ljUZoKHbDqw5Sx0qpL2qTUlmkmr+vhZH/sCNrNaBZKTbdgiswErSnIF1jRbGmEitJNxHRHWsuZyVgnTGfVO1Yw==}
 
-  '@cspell/dict-svelte@1.0.5':
-    resolution: {integrity: sha512-sseHlcXOqWE4Ner9sg8KsjxwSJ2yssoJNqFHR9liWVbDV+m7kBiUtn2EB690TihzVsEmDr/0Yxrbb5Bniz70mA==}
+  '@cspell/dict-companies@3.2.12':
+    resolution: {integrity: sha512-mjiz/N3zWOCsz5VfwMUydSl7uW0OU9H2PnbCNc3RV44Vj6Q59CSp6EYGSGZQxrXU1gpsuZUrwr6QCjNjFOOg5A==}
 
-  '@cspell/dict-swift@2.0.4':
-    resolution: {integrity: sha512-CsFF0IFAbRtYNg0yZcdaYbADF5F3DsM8C4wHnZefQy8YcHP/qjAF/GdGfBFBLx+XSthYuBlo2b2XQVdz3cJZBw==}
+  '@cspell/dict-cpp@7.1.0':
+    resolution: {integrity: sha512-rcjycobioQUd9Jm/Y1n8U+sq6ytpZ0iV8AYIo+vyEFfutC5x7g6hL6Fh3bCdh6IporGHRqfEutGK/4sfopD2ZA==}
 
-  '@cspell/dict-terraform@1.0.6':
-    resolution: {integrity: sha512-Sqm5vGbXuI9hCFcr4w6xWf4Y25J9SdleE/IqfM6RySPnk8lISEmVdax4k6+Kinv9qaxyvnIbUUN4WFLWcBPQAg==}
+  '@cspell/dict-cryptocurrencies@5.0.5':
+    resolution: {integrity: sha512-R68hYYF/rtlE6T/dsObStzN5QZw+0aQBinAXuWCVqwdS7YZo0X33vGMfChkHaiCo3Z2+bkegqHlqxZF4TD3rUA==}
 
-  '@cspell/dict-typescript@3.1.11':
-    resolution: {integrity: sha512-FwvK5sKbwrVpdw0e9+1lVTl8FPoHYvfHRuQRQz2Ql5XkC0gwPPkpoyD1zYImjIyZRoYXk3yp9j8ss4iz7A7zoQ==}
+  '@cspell/dict-csharp@4.0.8':
+    resolution: {integrity: sha512-qmk45pKFHSxckl5mSlbHxmDitSsGMlk/XzFgt7emeTJWLNSTUK//MbYAkBNRtfzB4uD7pAFiKgpKgtJrTMRnrQ==}
 
-  '@cspell/dict-vue@3.0.3':
-    resolution: {integrity: sha512-akmYbrgAGumqk1xXALtDJcEcOMYBYMnkjpmGzH13Ozhq1mkPF4VgllFQlm1xYde+BUKNnzMgPEzxrL2qZllgYA==}
+  '@cspell/dict-css@4.1.2':
+    resolution: {integrity: sha512-+ylGoKdwZ2sVOCOnU2Eq5wDZx+RaVX3HoKyNHGGsFvhSw6IidQ6tH/mAPKBDofViHJoWCPNlklE0lTr6MDG3QA==}
 
-  '@cspell/dynamic-import@8.17.1':
-    resolution: {integrity: sha512-XQtr2olYOtqbg49E+8SISd6I5DzfxmsKINDn0ZgaTFeLalnNdF3ewDU4gOEbApIzGffRa1mW9t19MsiVrznSDw==}
-    engines: {node: '>=18.0'}
+  '@cspell/dict-dart@2.3.2':
+    resolution: {integrity: sha512-sUiLW56t9gfZcu8iR/5EUg+KYyRD83Cjl3yjDEA2ApVuJvK1HhX+vn4e4k4YfjpUQMag8XO2AaRhARE09+/rqw==}
 
-  '@cspell/filetypes@8.17.1':
-    resolution: {integrity: sha512-AxYw6j7EPYtDFAFjwybjFpMc9waXQzurfBXmEVfQ5RQRlbylujLZWwR6GnMqofeNg4oGDUpEjcAZFrgdkvMQlA==}
-    engines: {node: '>=18'}
+  '@cspell/dict-data-science@2.0.16':
+    resolution: {integrity: sha512-M72mxv5asuAnORurz4iXRJ+Tw9XBq6eu7D2Ne7biP0Z1RciKGNxXWu9JycA/KlVvK1hAlKj/fANlXhuEWpXKFg==}
 
-  '@cspell/strong-weak-map@8.17.1':
-    resolution: {integrity: sha512-8cY3vLAKdt5gQEMM3Gr57BuQ8sun2NjYNh9qTdrctC1S9gNC7XzFghTYAfHSWR4VrOUcMFLO/izMdsc1KFvFOA==}
-    engines: {node: '>=18'}
+  '@cspell/dict-django@4.1.6':
+    resolution: {integrity: sha512-SdbSFDGy9ulETqNz15oWv2+kpWLlk8DJYd573xhIkeRdcXOjskRuxjSZPKfW7O3NxN/KEf3gm3IevVOiNuFS+w==}
 
-  '@cspell/url@8.17.1':
-    resolution: {integrity: sha512-LMvReIndW1ckvemElfDgTt282fb2C3C/ZXfsm0pJsTV5ZmtdelCHwzmgSBmY5fDr7D66XDp8EurotSE0K6BTvw==}
-    engines: {node: '>=18.0'}
+  '@cspell/dict-docker@1.1.17':
+    resolution: {integrity: sha512-OcnVTIpHIYYKhztNTyK8ShAnXTfnqs43hVH6p0py0wlcwRIXe5uj4f12n7zPf2CeBI7JAlPjEsV0Rlf4hbz/xQ==}
 
-  '@csstools/cascade-layer-name-parser@2.0.4':
-    resolution: {integrity: sha512-7DFHlPuIxviKYZrOiwVU/PiHLm3lLUR23OMuEEtfEOQTOp9hzQ2JjdY6X5H18RVuUPJqSCI+qNnD5iOLMVE0bA==}
-    engines: {node: '>=18'}
+  '@cspell/dict-dotnet@5.0.13':
+    resolution: {integrity: sha512-xPp7jMnFpOri7tzmqmm/dXMolXz1t2bhNqxYkOyMqXhvs08oc7BFs+EsbDY0X7hqiISgeFZGNqn0dOCr+ncPYw==}
+
+  '@cspell/dict-elixir@4.0.8':
+    resolution: {integrity: sha512-CyfphrbMyl4Ms55Vzuj+mNmd693HjBFr9hvU+B2YbFEZprE5AG+EXLYTMRWrXbpds4AuZcvN3deM2XVB80BN/Q==}
+
+  '@cspell/dict-en-common-misspellings@2.2.0':
+    resolution: {integrity: sha512-5PmCHv+AhY0LVNo3bE1FdRKMmw1esKj83GPwLymnVPYNtlI2Jf6y27EjC0azg4zny5keWmku0GQiMf55Fi+qeA==}
+
+  '@cspell/dict-en-gb-mit@3.1.25':
+    resolution: {integrity: sha512-zGODptk24CMrXi49ieG2SUm94CKxEsVF0dYNF+1ZYH0MSsQDZ/PKDlrrbvtBqSupKdPSj0Z9sjOmMNfHHW9ZSg==}
+
+  '@cspell/dict-en_us@4.4.36':
+    resolution: {integrity: sha512-2yOhI/+7d1DbfvMljGW4jw8pLqDEsVmnvUXBOCFXtLU2BWgQkrqOJDCNseYjEiEbTp0OtdrWEWWPFSP1TNugQw==}
+
+  '@cspell/dict-filetypes@3.0.18':
+    resolution: {integrity: sha512-yU7RKD/x1IWmDLzWeiItMwgV+6bUcU/af23uS0+uGiFUbsY1qWV/D4rxlAAO6Z7no3J2z8aZOkYIOvUrJq0Rcw==}
+
+  '@cspell/dict-flutter@1.1.1':
+    resolution: {integrity: sha512-UlOzRcH2tNbFhZmHJN48Za/2/MEdRHl2BMkCWZBYs+30b91mWvBfzaN4IJQU7dUZtowKayVIF9FzvLZtZokc5A==}
+
+  '@cspell/dict-fonts@4.0.6':
+    resolution: {integrity: sha512-aR/0csY01dNb0A1tw/UmN9rKgHruUxsYsvXu6YlSBJFu60s26SKr/k1o4LavpHTQ+lznlYMqAvuxGkE4Flliqw==}
+
+  '@cspell/dict-fsharp@1.1.1':
+    resolution: {integrity: sha512-imhs0u87wEA4/cYjgzS0tAyaJpwG7vwtC8UyMFbwpmtw+/bgss+osNfyqhYRyS/ehVCWL17Ewx2UPkexjKyaBA==}
+
+  '@cspell/dict-fullstack@3.2.9':
+    resolution: {integrity: sha512-diZX+usW5aZ4/b2T0QM/H/Wl9aNMbdODa1Jq0ReBr/jazmNeWjd+PyqeVgzd1joEaHY+SAnjrf/i9CwKd2ZtWQ==}
+
+  '@cspell/dict-gaming-terms@1.1.2':
+    resolution: {integrity: sha512-9XnOvaoTBscq0xuD6KTEIkk9hhdfBkkvJAIsvw3JMcnp1214OCGW8+kako5RqQ2vTZR3Tnf3pc57o7VgkM0q1Q==}
+
+  '@cspell/dict-git@3.1.0':
+    resolution: {integrity: sha512-KEt9zGkxqGy2q1nwH4CbyqTSv5nadpn8BAlDnzlRcnL0Xb3LX9xTgSGShKvzb0bw35lHoYyLWN2ZKAqbC4pgGQ==}
+
+  '@cspell/dict-golang@6.0.26':
+    resolution: {integrity: sha512-YKA7Xm5KeOd14v5SQ4ll6afe9VSy3a2DWM7L9uBq4u3lXToRBQ1W5PRa+/Q9udd+DTURyVVnQ+7b9cnOlNxaRg==}
+
+  '@cspell/dict-google@1.0.9':
+    resolution: {integrity: sha512-biL65POqialY0i4g6crj7pR6JnBkbsPovB2WDYkj3H4TuC/QXv7Pu5pdPxeUJA6TSCHI7T5twsO4VSVyRxD9CA==}
+
+  '@cspell/dict-haskell@4.0.6':
+    resolution: {integrity: sha512-ib8SA5qgftExpYNjWhpYIgvDsZ/0wvKKxSP+kuSkkak520iPvTJumEpIE+qPcmJQo4NzdKMN8nEfaeci4OcFAQ==}
+
+  '@cspell/dict-html-symbol-entities@4.0.5':
+    resolution: {integrity: sha512-429alTD4cE0FIwpMucvSN35Ld87HCyuM8mF731KU5Rm4Je2SG6hmVx7nkBsLyrmH3sQukTcr1GaiZsiEg8svPA==}
+
+  '@cspell/dict-html@4.0.15':
+    resolution: {integrity: sha512-GJYnYKoD9fmo2OI0aySEGZOjThnx3upSUvV7mmqUu8oG+mGgzqm82P/f7OqsuvTaInZZwZbo+PwJQd/yHcyFIw==}
+
+  '@cspell/dict-java@5.0.12':
+    resolution: {integrity: sha512-qPSNhTcl7LGJ5Qp6VN71H8zqvRQK04S08T67knMq9hTA8U7G1sTKzLmBaDOFhq17vNX/+rT+rbRYp+B5Nwza1A==}
+
+  '@cspell/dict-julia@1.1.1':
+    resolution: {integrity: sha512-WylJR9TQ2cgwd5BWEOfdO3zvDB+L7kYFm0I9u0s9jKHWQ6yKmfKeMjU9oXxTBxIufhCXm92SKwwVNAC7gjv+yA==}
+
+  '@cspell/dict-k8s@1.0.13':
+    resolution: {integrity: sha512-ELGkS13k7K/NEfVimBSrxVTfqXvOF/Kvxj4I62YxRm8bvHbfoXgrGaOx28lPiNRz+dmu+yYtvuXbnURKtYbC6g==}
+
+  '@cspell/dict-kotlin@1.1.1':
+    resolution: {integrity: sha512-J3NzzfgmxRvEeOe3qUXnSJQCd38i/dpF9/t3quuWh6gXM+krsAXP75dY1CzDmS8mrJAlBdVBeAW5eAZTD8g86Q==}
+
+  '@cspell/dict-latex@5.1.0':
+    resolution: {integrity: sha512-qxT4guhysyBt0gzoliXYEBYinkAdEtR2M7goRaUH0a7ltCsoqqAeEV8aXYRIdZGcV77gYSobvu3jJL038tlPAw==}
+
+  '@cspell/dict-lorem-ipsum@4.0.5':
+    resolution: {integrity: sha512-9a4TJYRcPWPBKkQAJ/whCu4uCAEgv/O2xAaZEI0n4y1/l18Yyx8pBKoIX5QuVXjjmKEkK7hi5SxyIsH7pFEK9Q==}
+
+  '@cspell/dict-lua@4.0.8':
+    resolution: {integrity: sha512-N4PkgNDMu9JVsRu7JBS/3E/dvfItRgk9w5ga2dKq+JupP2Y3lojNaAVFhXISh4Y0a6qXDn2clA6nvnavQ/jjLA==}
+
+  '@cspell/dict-makefile@1.0.5':
+    resolution: {integrity: sha512-4vrVt7bGiK8Rx98tfRbYo42Xo2IstJkAF4tLLDMNQLkQ86msDlYSKG1ZCk8Abg+EdNcFAjNhXIiNO+w4KflGAQ==}
+
+  '@cspell/dict-markdown@2.0.17':
+    resolution: {integrity: sha512-H8bAxih6U8NOnSPL7R8My+tqjaB4tmnJTjERuz4zYqmf+cH+5xshX3UVgKlwWFcyjsYfv/zEDuRdMctQv1q6HQ==}
     peerDependencies:
-      '@csstools/css-parser-algorithms': ^3.0.4
-      '@csstools/css-tokenizer': ^3.0.3
+      '@cspell/dict-css': ^4.1.2
+      '@cspell/dict-html': ^4.0.15
+      '@cspell/dict-html-symbol-entities': ^4.0.5
+      '@cspell/dict-typescript': ^3.2.3
 
-  '@csstools/color-helpers@5.0.1':
-    resolution: {integrity: sha512-MKtmkA0BX87PKaO1NFRTFH+UnkgnmySQOvNxJubsadusqPEC2aJ9MOQiMceZJJ6oitUl/i0L6u0M1IrmAOmgBA==}
-    engines: {node: '>=18'}
+  '@cspell/dict-monkeyc@1.1.0':
+    resolution: {integrity: sha512-mc/hgvSy/emOIYtc8kuVEaLUlnaERunfAubfJ5plUXq6s0A69bcukJzUzSt9C0UTCwS28641ILRPv80m3L9QbA==}
 
-  '@csstools/css-calc@2.1.0':
-    resolution: {integrity: sha512-X69PmFOrjTZfN5ijxtI8hZ9kRADFSLrmmQ6hgDJ272Il049WGKpDY64KhrFm/7rbWve0z81QepawzjkKlqkNGw==}
-    engines: {node: '>=18'}
+  '@cspell/dict-node@5.0.9':
+    resolution: {integrity: sha512-hO+ga+uYZ/WA4OtiMEyKt5rDUlUyu3nXMf8KVEeqq2msYvAPdldKBGH7lGONg6R/rPhv53Rb+0Y1SLdoK1+7wQ==}
+
+  '@cspell/dict-npm@5.2.45':
+    resolution: {integrity: sha512-BXUmMMspl+AhPIk/ZOjxlNu5k1yCRAzSMzdNPYM+2vaBL8ffev7ZFfOyBCDk8kgcpsHotz8/3fLNX+xwWaDR2w==}
+
+  '@cspell/dict-php@4.1.1':
+    resolution: {integrity: sha512-EXelI+4AftmdIGtA8HL8kr4WlUE11OqCSVlnIgZekmTkEGSZdYnkFdiJ5IANSALtlQ1mghKjz+OFqVs6yowgWA==}
+
+  '@cspell/dict-powershell@5.0.15':
+    resolution: {integrity: sha512-l4S5PAcvCFcVDMJShrYD0X6Huv9dcsQPlsVsBGbH38wvuN7gS7+GxZFAjTNxDmTY1wrNi1cCatSg6Pu2BW4rgg==}
+
+  '@cspell/dict-public-licenses@2.0.16':
+    resolution: {integrity: sha512-EQRrPvEOmwhwWezV+W7LjXbIBjiy6y/shrET6Qcpnk3XANTzfvWflf9PnJ5kId/oKWvihFy0za0AV1JHd03pSQ==}
+
+  '@cspell/dict-python@4.3.0':
+    resolution: {integrity: sha512-afVcbsCOYtpdvu8I4ANiIXVcxqxzrno+oEuObNx9hwpvEmf/AbXQBk9CMjFR9QZllcfnOfpjCSXgGuTna5hKQA==}
+
+  '@cspell/dict-r@2.1.1':
+    resolution: {integrity: sha512-71Ka+yKfG4ZHEMEmDxc6+blFkeTTvgKbKAbwiwQAuKl3zpqs1Y0vUtwW2N4b3LgmSPhV3ODVY0y4m5ofqDuKMw==}
+
+  '@cspell/dict-ruby@5.1.1':
+    resolution: {integrity: sha512-LHrp84oEV6q1ZxPPyj4z+FdKyq1XAKYPtmGptrd+uwHbrF/Ns5+fy6gtSi7pS+uc0zk3JdO9w/tPK+8N1/7WUA==}
+
+  '@cspell/dict-rust@4.1.2':
+    resolution: {integrity: sha512-O1FHrumYcO+HZti3dHfBPUdnDFkI+nbYK3pxYmiM1sr+G0ebOd6qchmswS0Wsc6ZdEVNiPYJY/gZQR6jfW3uOg==}
+
+  '@cspell/dict-scala@5.0.9':
+    resolution: {integrity: sha512-AjVcVAELgllybr1zk93CJ5wSUNu/Zb5kIubymR/GAYkMyBdYFCZ3Zbwn4Zz8GJlFFAbazABGOu0JPVbeY59vGg==}
+
+  '@cspell/dict-shell@1.2.0':
+    resolution: {integrity: sha512-PVctvT22lJ49niMiakO8xieY7ELCAzjSqhejWR7bAMb5AZ9F4WDEs+XdGMnoVHWeXq7K5rcepLPmEJb+37zzIw==}
+
+  '@cspell/dict-software-terms@5.3.0':
+    resolution: {integrity: sha512-HEMvFWeItTA5A/MFxrH5fpOz9DU7ormXaGp1PJPsd0jt+qqaYNpevGIgTfIhfp/hsabPyAGa51N/DeDT0ZMg2Q==}
+
+  '@cspell/dict-sql@2.2.1':
+    resolution: {integrity: sha512-qDHF8MpAYCf4pWU8NKbnVGzkoxMNrFqBHyG/dgrlic5EQiKANCLELYtGlX5auIMDLmTf1inA0eNtv74tyRJ/vg==}
+
+  '@cspell/dict-svelte@1.0.7':
+    resolution: {integrity: sha512-hGZsGqP0WdzKkdpeVLBivRuSNzOTvN036EBmpOwxH+FTY2DuUH7ecW+cSaMwOgmq5JFSdTcbTNFlNC8HN8lhaQ==}
+
+  '@cspell/dict-swift@2.0.6':
+    resolution: {integrity: sha512-PnpNbrIbex2aqU1kMgwEKvCzgbkHtj3dlFLPMqW1vSniop7YxaDTtvTUO4zA++ugYAEL+UK8vYrBwDPTjjvSnA==}
+
+  '@cspell/dict-terraform@1.1.4':
+    resolution: {integrity: sha512-Ere42ilvMFvQA4GlcN0OKlruMPR6EsvaB+iTHzj2xc+NJGRK64V7yApUcWrOrSgTiM/vhWXPIsK3OMfiAiNdmA==}
+
+  '@cspell/dict-typescript@3.2.3':
+    resolution: {integrity: sha512-zXh1wYsNljQZfWWdSPYwQhpwiuW0KPW1dSd8idjMRvSD0aSvWWHoWlrMsmZeRl4qM4QCEAjua8+cjflm41cQBg==}
+
+  '@cspell/dict-vue@3.0.5':
+    resolution: {integrity: sha512-Mqutb8jbM+kIcywuPQCCaK5qQHTdaByoEO2J9LKFy3sqAdiBogNkrplqUK0HyyRFgCfbJUgjz3N85iCMcWH0JA==}
+
+  '@cspell/dict-zig@1.0.0':
+    resolution: {integrity: sha512-XibBIxBlVosU06+M6uHWkFeT0/pW5WajDRYdXG2CgHnq85b0TI/Ks0FuBJykmsgi2CAD3Qtx8UHFEtl/DSFnAQ==}
+
+  '@cspell/dynamic-import@10.0.1':
+    resolution: {integrity: sha512-mP1gdq00aIcH8HxNMqnH11X6BKxLcneDtFgl/ecjIKnaGKwi44m8AndP5Kr4ODaYdl8UUw9O3dJh7KaQXnLHZQ==}
+    engines: {node: '>=22.18.0'}
+
+  '@cspell/filetypes@10.0.1':
+    resolution: {integrity: sha512-Z5S35giU5IW49fBBq6BksUbE8PC4IYPfaKuwl5Nl9jkf/OkAKiBmCowKX45NzRUQInwK/GSqqIUifrNeI6LdLw==}
+    engines: {node: '>=22.18.0'}
+
+  '@cspell/rpc@10.0.1':
+    resolution: {integrity: sha512-axSRKv3zEAmBm66iD/FV/MPmE4/Yf7c3PZiwTW894Yd3iEhtn3KPKeTrqQ2/tDrhB1Z2qTsap/Hue0MK4o5WXg==}
+    engines: {node: '>=22.18.0'}
+
+  '@cspell/strong-weak-map@10.0.1':
+    resolution: {integrity: sha512-lenN1DVyPi8nJLSMSJJ670ddTjyiruLueuSZO1qLcxBqUhgxDt/mALu9N/1m6WdOVcg6m/5cLiZVg2KOo2UzRw==}
+    engines: {node: '>=22.18.0'}
+
+  '@cspell/url@10.0.1':
+    resolution: {integrity: sha512-abYYgI29wJhWIfWTYrYuzRYDcHQUQ1N5ylnhxYn1NJnIQMqUWGLbDmt12JABtZ+R6h6UNatQrS7rhP86etvJyQ==}
+    engines: {node: '>=22.18.0'}
+
+  '@csstools/css-calc@3.3.0':
+    resolution: {integrity: sha512-c5ihYsPkdG6JCkU2zTMm4+k6r7RXuGxtWYhu5DHMIiF1FHzrfmHL5so11AoFpUv/tu61xfcmT4AmKoFfMPoqdQ==}
+    engines: {node: '>=20.19.0'}
     peerDependencies:
-      '@csstools/css-parser-algorithms': ^3.0.4
-      '@csstools/css-tokenizer': ^3.0.3
+      '@csstools/css-parser-algorithms': ^4.0.0
+      '@csstools/css-tokenizer': ^4.0.0
 
-  '@csstools/css-color-parser@3.0.6':
-    resolution: {integrity: sha512-S/IjXqTHdpI4EtzGoNCHfqraXF37x12ZZHA1Lk7zoT5pm2lMjFuqhX/89L7dqX4CcMacKK+6ZCs5TmEGb/+wKw==}
-    engines: {node: '>=18'}
+  '@csstools/css-parser-algorithms@4.0.0':
+    resolution: {integrity: sha512-+B87qS7fIG3L5h3qwJ/IFbjoVoOe/bpOdh9hAjXbvx0o8ImEmUsGXN0inFOnk2ChCFgqkkGFQ+TpM5rbhkKe4w==}
+    engines: {node: '>=20.19.0'}
     peerDependencies:
-      '@csstools/css-parser-algorithms': ^3.0.4
-      '@csstools/css-tokenizer': ^3.0.3
+      '@csstools/css-tokenizer': ^4.0.0
 
-  '@csstools/css-parser-algorithms@3.0.4':
-    resolution: {integrity: sha512-Up7rBoV77rv29d3uKHUIVubz1BTcgyUK72IvCQAbfbMv584xHcGKCKbWh7i8hPrRJ7qU4Y8IO3IY9m+iTB7P3A==}
-    engines: {node: '>=18'}
+  '@csstools/css-syntax-patches-for-csstree@1.1.7':
+    resolution: {integrity: sha512-fQ+05118eQS1cofO3aJpB5efgpBZMvIzwr/sbC8kDLVA5XLG8q1kJV5yzrUAI1f7lvhPnm8fgIjzFB8/O/5Dig==}
     peerDependencies:
-      '@csstools/css-tokenizer': ^3.0.3
+      css-tree: ^3.2.1
+    peerDependenciesMeta:
+      css-tree:
+        optional: true
 
-  '@csstools/css-tokenizer@3.0.3':
-    resolution: {integrity: sha512-UJnjoFsmxfKUdNYdWgOB0mWUypuLvAfQPH1+pyvRJs6euowbFkFC6P13w1l8mJyi3vxYMxc9kld5jZEGRQs6bw==}
-    engines: {node: '>=18'}
+  '@csstools/css-tokenizer@4.0.0':
+    resolution: {integrity: sha512-QxULHAm7cNu72w97JUNCBFODFaXpbDg+dP8b/oWFAZ2MTRppA3U00Y2L1HqaS4J6yBqxwa/Y3nMBaxVKbB/NsA==}
+    engines: {node: '>=20.19.0'}
 
-  '@csstools/media-query-list-parser@3.0.1':
-    resolution: {integrity: sha512-HNo8gGD02kHmcbX6PvCoUuOQvn4szyB9ca63vZHKX5A81QytgDG4oxG4IaEfHTlEZSZ6MjPEMWIVU+zF2PZcgw==}
-    engines: {node: '>=18'}
+  '@csstools/media-query-list-parser@5.0.0':
+    resolution: {integrity: sha512-T9lXmZOfnam3eMERPsszjY5NK0jX8RmThmmm99FZ8b7z8yMaFZWKwLWGZuTwdO3ddRY5fy13GmmEYZXB4I98Eg==}
+    engines: {node: '>=20.19.0'}
     peerDependencies:
-      '@csstools/css-parser-algorithms': ^3.0.1
-      '@csstools/css-tokenizer': ^3.0.1
+      '@csstools/css-parser-algorithms': ^4.0.0
+      '@csstools/css-tokenizer': ^4.0.0
 
-  '@csstools/media-query-list-parser@4.0.2':
-    resolution: {integrity: sha512-EUos465uvVvMJehckATTlNqGj4UJWkTmdWuDMjqvSUkjGpmOyFZBVwb4knxCm/k2GMTXY+c/5RkdndzFYWeX5A==}
-    engines: {node: '>=18'}
+  '@csstools/selector-resolve-nested@4.0.1':
+    resolution: {integrity: sha512-j3vdQu0XwLME5qOTWxm8cnmvsf423R2YL6DbKklCHZwkDm7UdKNu6RPlw4REIJhSlKBICY3B70/7QZdicLqZgg==}
+    engines: {node: '>=20.19.0'}
     peerDependencies:
-      '@csstools/css-parser-algorithms': ^3.0.4
-      '@csstools/css-tokenizer': ^3.0.3
+      postcss-selector-parser: ^7.1.1
 
-  '@csstools/postcss-cascade-layers@5.0.1':
-    resolution: {integrity: sha512-XOfhI7GShVcKiKwmPAnWSqd2tBR0uxt+runAxttbSp/LY2U16yAVPmAf7e9q4JJ0d+xMNmpwNDLBXnmRCl3HMQ==}
-    engines: {node: '>=18'}
+  '@csstools/selector-specificity@6.0.0':
+    resolution: {integrity: sha512-4sSgl78OtOXEX/2d++8A83zHNTgwCJMaR24FvsYL7Uf/VS8HZk9PTwR51elTbGqMuwH3szLvvOXEaVnqn0Z3zA==}
+    engines: {node: '>=20.19.0'}
     peerDependencies:
-      postcss: ^8.4
+      postcss-selector-parser: ^7.1.1
 
-  '@csstools/postcss-color-function@4.0.6':
-    resolution: {integrity: sha512-EcvXfC60cTIumzpsxWuvVjb7rsJEHPvqn3jeMEBUaE3JSc4FRuP7mEQ+1eicxWmIrs3FtzMH9gR3sgA5TH+ebQ==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss: ^8.4
-
-  '@csstools/postcss-color-mix-function@3.0.6':
-    resolution: {integrity: sha512-jVKdJn4+JkASYGhyPO+Wa5WXSx1+oUgaXb3JsjJn/BlrtFh5zjocCY7pwWi0nuP24V1fY7glQsxEYcYNy0dMFg==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss: ^8.4
-
-  '@csstools/postcss-content-alt-text@2.0.4':
-    resolution: {integrity: sha512-YItlZUOuZJCBlRaCf8Aucc1lgN41qYGALMly0qQllrxYJhiyzlI6RxOTMUvtWk+KhS8GphMDsDhKQ7KTPfEMSw==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss: ^8.4
-
-  '@csstools/postcss-exponential-functions@2.0.5':
-    resolution: {integrity: sha512-mi8R6dVfA2nDoKM3wcEi64I8vOYEgQVtVKCfmLHXupeLpACfGAided5ddMt5f+CnEodNu4DifuVwb0I6fQDGGQ==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss: ^8.4
-
-  '@csstools/postcss-font-format-keywords@4.0.0':
-    resolution: {integrity: sha512-usBzw9aCRDvchpok6C+4TXC57btc4bJtmKQWOHQxOVKen1ZfVqBUuCZ/wuqdX5GHsD0NRSr9XTP+5ID1ZZQBXw==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss: ^8.4
-
-  '@csstools/postcss-gamut-mapping@2.0.6':
-    resolution: {integrity: sha512-0ke7fmXfc8H+kysZz246yjirAH6JFhyX9GTlyRnM0exHO80XcA9zeJpy5pOp5zo/AZiC/q5Pf+Hw7Pd6/uAoYA==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss: ^8.4
-
-  '@csstools/postcss-gradients-interpolation-method@5.0.6':
-    resolution: {integrity: sha512-Itrbx6SLUzsZ6Mz3VuOlxhbfuyLTogG5DwEF1V8dAi24iMuvQPIHd7Ti+pNDp7j6WixndJGZaoNR0f9VSzwuTg==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss: ^8.4
-
-  '@csstools/postcss-hwb-function@4.0.6':
-    resolution: {integrity: sha512-927Pqy3a1uBP7U8sTfaNdZVB0mNXzIrJO/GZ8us9219q9n06gOqCdfZ0E6d1P66Fm0fYHvxfDbfcUuwAn5UwhQ==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss: ^8.4
-
-  '@csstools/postcss-ic-unit@4.0.0':
-    resolution: {integrity: sha512-9QT5TDGgx7wD3EEMN3BSUG6ckb6Eh5gSPT5kZoVtUuAonfPmLDJyPhqR4ntPpMYhUKAMVKAg3I/AgzqHMSeLhA==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss: ^8.4
-
-  '@csstools/postcss-initial@2.0.0':
-    resolution: {integrity: sha512-dv2lNUKR+JV+OOhZm9paWzYBXOCi+rJPqJ2cJuhh9xd8USVrd0cBEPczla81HNOyThMQWeCcdln3gZkQV2kYxA==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss: ^8.4
-
-  '@csstools/postcss-is-pseudo-class@5.0.1':
-    resolution: {integrity: sha512-JLp3POui4S1auhDR0n8wHd/zTOWmMsmK3nQd3hhL6FhWPaox5W7j1se6zXOG/aP07wV2ww0lxbKYGwbBszOtfQ==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss: ^8.4
-
-  '@csstools/postcss-light-dark-function@2.0.7':
-    resolution: {integrity: sha512-ZZ0rwlanYKOHekyIPaU+sVm3BEHCe+Ha0/px+bmHe62n0Uc1lL34vbwrLYn6ote8PHlsqzKeTQdIejQCJ05tfw==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss: ^8.4
-
-  '@csstools/postcss-logical-float-and-clear@3.0.0':
-    resolution: {integrity: sha512-SEmaHMszwakI2rqKRJgE+8rpotFfne1ZS6bZqBoQIicFyV+xT1UF42eORPxJkVJVrH9C0ctUgwMSn3BLOIZldQ==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss: ^8.4
-
-  '@csstools/postcss-logical-overflow@2.0.0':
-    resolution: {integrity: sha512-spzR1MInxPuXKEX2csMamshR4LRaSZ3UXVaRGjeQxl70ySxOhMpP2252RAFsg8QyyBXBzuVOOdx1+bVO5bPIzA==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss: ^8.4
-
-  '@csstools/postcss-logical-overscroll-behavior@2.0.0':
-    resolution: {integrity: sha512-e/webMjoGOSYfqLunyzByZj5KKe5oyVg/YSbie99VEaSDE2kimFm0q1f6t/6Jo+VVCQ/jbe2Xy+uX+C4xzWs4w==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss: ^8.4
-
-  '@csstools/postcss-logical-resize@3.0.0':
-    resolution: {integrity: sha512-DFbHQOFW/+I+MY4Ycd/QN6Dg4Hcbb50elIJCfnwkRTCX05G11SwViI5BbBlg9iHRl4ytB7pmY5ieAFk3ws7yyg==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss: ^8.4
-
-  '@csstools/postcss-logical-viewport-units@3.0.3':
-    resolution: {integrity: sha512-OC1IlG/yoGJdi0Y+7duz/kU/beCwO+Gua01sD6GtOtLi7ByQUpcIqs7UE/xuRPay4cHgOMatWdnDdsIDjnWpPw==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss: ^8.4
-
-  '@csstools/postcss-media-minmax@2.0.5':
-    resolution: {integrity: sha512-sdh5i5GToZOIAiwhdntRWv77QDtsxP2r2gXW/WbLSCoLr00KTq/yiF1qlQ5XX2+lmiFa8rATKMcbwl3oXDMNew==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss: ^8.4
-
-  '@csstools/postcss-media-queries-aspect-ratio-number-values@3.0.4':
-    resolution: {integrity: sha512-AnGjVslHMm5xw9keusQYvjVWvuS7KWK+OJagaG0+m9QnIjZsrysD2kJP/tr/UJIyYtMCtu8OkUd+Rajb4DqtIQ==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss: ^8.4
-
-  '@csstools/postcss-nested-calc@4.0.0':
-    resolution: {integrity: sha512-jMYDdqrQQxE7k9+KjstC3NbsmC063n1FTPLCgCRS2/qHUbHM0mNy9pIn4QIiQGs9I/Bg98vMqw7mJXBxa0N88A==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss: ^8.4
-
-  '@csstools/postcss-normalize-display-values@4.0.0':
-    resolution: {integrity: sha512-HlEoG0IDRoHXzXnkV4in47dzsxdsjdz6+j7MLjaACABX2NfvjFS6XVAnpaDyGesz9gK2SC7MbNwdCHusObKJ9Q==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss: ^8.4
-
-  '@csstools/postcss-oklab-function@4.0.6':
-    resolution: {integrity: sha512-Hptoa0uX+XsNacFBCIQKTUBrFKDiplHan42X73EklG6XmQLG7/aIvxoNhvZ7PvOWMt67Pw3bIlUY2nD6p5vL8A==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss: ^8.4
-
-  '@csstools/postcss-progressive-custom-properties@4.0.0':
-    resolution: {integrity: sha512-XQPtROaQjomnvLUSy/bALTR5VCtTVUFwYs1SblvYgLSeTo2a/bMNwUwo2piXw5rTv/FEYiy5yPSXBqg9OKUx7Q==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss: ^8.4
-
-  '@csstools/postcss-random-function@1.0.1':
-    resolution: {integrity: sha512-Ab/tF8/RXktQlFwVhiC70UNfpFQRhtE5fQQoP2pO+KCPGLsLdWFiOuHgSRtBOqEshCVAzR4H6o38nhvRZq8deA==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss: ^8.4
-
-  '@csstools/postcss-relative-color-syntax@3.0.6':
-    resolution: {integrity: sha512-yxP618Xb+ji1I624jILaYM62uEmZcmbdmFoZHoaThw896sq0vU39kqTTF+ZNic9XyPtPMvq0vyvbgmHaszq8xg==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss: ^8.4
-
-  '@csstools/postcss-scope-pseudo-class@4.0.1':
-    resolution: {integrity: sha512-IMi9FwtH6LMNuLea1bjVMQAsUhFxJnyLSgOp/cpv5hrzWmrUYU5fm0EguNDIIOHUqzXode8F/1qkC/tEo/qN8Q==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss: ^8.4
-
-  '@csstools/postcss-sign-functions@1.1.0':
-    resolution: {integrity: sha512-SLcc20Nujx/kqbSwDmj6oaXgpy3UjFhBy1sfcqPgDkHfOIfUtUVH7OXO+j7BU4v/At5s61N5ZX6shvgPwluhsA==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss: ^8.4
-
-  '@csstools/postcss-stepped-value-functions@4.0.5':
-    resolution: {integrity: sha512-G6SJ6hZJkhxo6UZojVlLo14MohH4J5J7z8CRBrxxUYy9JuZiIqUo5TBYyDGcE0PLdzpg63a7mHSJz3VD+gMwqw==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss: ^8.4
-
-  '@csstools/postcss-text-decoration-shorthand@4.0.1':
-    resolution: {integrity: sha512-xPZIikbx6jyzWvhms27uugIc0I4ykH4keRvoa3rxX5K7lEhkbd54rjj/dv60qOCTisoS+3bmwJTeyV1VNBrXaw==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss: ^8.4
-
-  '@csstools/postcss-trigonometric-functions@4.0.5':
-    resolution: {integrity: sha512-/YQThYkt5MLvAmVu7zxjhceCYlKrYddK6LEmK5I4ojlS6BmO9u2yO4+xjXzu2+NPYmHSTtP4NFSamBCMmJ1NJA==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss: ^8.4
-
-  '@csstools/postcss-unset-value@4.0.0':
-    resolution: {integrity: sha512-cBz3tOCI5Fw6NIFEwU3RiwK6mn3nKegjpJuzCndoGq3BZPkUjnsq7uQmIeMNeMbMk7YD2MfKcgCpZwX5jyXqCA==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss: ^8.4
-
-  '@csstools/selector-resolve-nested@3.0.0':
-    resolution: {integrity: sha512-ZoK24Yku6VJU1gS79a5PFmC8yn3wIapiKmPgun0hZgEI5AOqgH2kiPRsPz1qkGv4HL+wuDLH83yQyk6inMYrJQ==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss-selector-parser: ^7.0.0
-
-  '@csstools/selector-specificity@5.0.0':
-    resolution: {integrity: sha512-PCqQV3c4CoVm3kdPhyeZ07VmBRdH2EpMFA/pd9OASpOEC3aXNGoqPDAZ80D0cLpMBxnmk0+yNhGsEx31hq7Gtw==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss-selector-parser: ^7.0.0
-
-  '@csstools/utilities@2.0.0':
-    resolution: {integrity: sha512-5VdOr0Z71u+Yp3ozOx8T11N703wIFGVRgOWbOZMKgglPJsWA54MRIoMNVMa7shUToIhx5J8vX4sOZgD2XiihiQ==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss: ^8.4
-
-  '@ctrl/tinycolor@4.1.0':
-    resolution: {integrity: sha512-WyOx8cJQ+FQus4Mm4uPIZA64gbk3Wxh0so5Lcii0aJifqwoVOlfFtorjLE0Hen4OYyHZMXDWqMmaQemBhgxFRQ==}
+  '@ctrl/tinycolor@4.2.0':
+    resolution: {integrity: sha512-kzyuwOAQnXJNLS9PSyrk0CWk35nWJW/zl/6KvnTBMFK65gm7U1/Z5BqjxeapjZCIhQcM/DsrEmcbRwDyXyXK4A==}
     engines: {node: '>=14'}
 
-  '@dual-bundle/import-meta-resolve@4.1.0':
-    resolution: {integrity: sha512-+nxncfwHM5SgAtrVzgpzJOI1ol0PkumhVo469KCf9lUi21IGcY90G98VuHm9VRrUypmAzawAHO9bs6hqeADaVg==}
+  '@cyberalien/svg-utils@1.2.19':
+    resolution: {integrity: sha512-paDJoDu+LhuH5Ma1q0BDqBpg6d16Xk22cZZrlg/s/J9oB8KgnnpU/snaEETJu2G1pwYcWQINUz6WUqu0Wm9k6A==}
+
+  '@electron-internal/extract-zip@1.0.5':
+    resolution: {integrity: sha512-+bqFCP98pLI0Tt0XQo1TmlXtwjWchISndDOxCkEcIuUgXWpBnLyRI+2DU+mesvnMMX6L1XDqYNA0lXNDHd/yiA==}
+    engines: {node: '>=22.12.0'}
+
+  '@electron/asar@3.4.1':
+    resolution: {integrity: sha512-i4/rNPRS84t0vSRa2HorerGRXWyF4vThfHesw0dmcWHp+cspK743UanA0suA5Q5y8kzY2y6YKrvbIUn69BCAiA==}
+    engines: {node: '>=10.12.0'}
+    hasBin: true
+
+  '@electron/fuses@1.8.0':
+    resolution: {integrity: sha512-zx0EIq78WlY/lBb1uXlziZmDZI4ubcCXIMJ4uGjXzZW0nS19TjSPeXPAjzzTmKQlJUZm0SbmZhPKP7tuQ1SsEw==}
+    hasBin: true
+
+  '@electron/get@3.1.0':
+    resolution: {integrity: sha512-F+nKc0xW+kVbBRhFzaMgPy3KwmuNTYX1fx6+FxxoSnNgwYX6LD7AKBTWkU0MQ6IBoe7dz069CNkR673sPAgkCQ==}
+    engines: {node: '>=14'}
+
+  '@electron/get@5.1.0':
+    resolution: {integrity: sha512-3kSBtG8ObcTVfXanm5vVJ6UnBLEVmVsRk1M+vGqCuMBV+XLCbJYuWQful+yIy0GQDsSlK0kHEriEHn7SPk4EnA==}
+    engines: {node: '>=22.12.0'}
+
+  '@electron/notarize@2.5.0':
+    resolution: {integrity: sha512-jNT8nwH1f9X5GEITXaQ8IF/KdskvIkOFfB2CvwumsveVidzpSc+mvhhTMdAGSYF3O+Nq49lJ7y+ssODRXu06+A==}
+    engines: {node: '>= 10.0.0'}
+
+  '@electron/osx-sign@1.3.3':
+    resolution: {integrity: sha512-KZ8mhXvWv2rIEgMbWZ4y33bDHyUKMXnx4M0sTyPNK/vcB81ImdeY9Ggdqy0SWbMDgmbqyQ+phgejh6V3R2QuSg==}
+    engines: {node: '>=12.0.0'}
+    hasBin: true
+
+  '@electron/rebuild@4.2.0':
+    resolution: {integrity: sha512-RKL/O+jGoXJMxrx/5771y1n0xTKmFuOYGO3gMmwypBM6rsH0kou0mswwdXA2JrhIkE4xyC7v9vGk0n6NPzgOxQ==}
+    engines: {node: '>=22.12.0'}
+    hasBin: true
+
+  '@electron/universal@2.0.3':
+    resolution: {integrity: sha512-Wn9sPYIVFRFl5HmwMJkARCCf7rqK/EurkfQ/rJZ14mHP3iYTjZSIOSVonEAnhWeAXwtw7zOekGRlc6yTtZ0t+g==}
+    engines: {node: '>=16.4'}
+
+  '@electron/windows-sign@1.2.2':
+    resolution: {integrity: sha512-dfZeox66AvdPtb2lD8OsIIQh12Tp0GNCRUDfBHIKGpbmopZto2/A8nSpYYLoedPIHpqkeblZ/k8OV0Gy7PYuyQ==}
+    engines: {node: '>=14.14'}
+    hasBin: true
+
+  '@emnapi/core@1.11.2':
+    resolution: {integrity: sha512-TC8MkTuZUtcTSiFeuC0ksCh9QIJ5+F21MvZ4Wn4ORfYaFJ/0dsiudv5tVkejgwZlwQ39jL9WWDe2lz8x0WglOA==}
+
+  '@emnapi/runtime@1.11.2':
+    resolution: {integrity: sha512-kyOl3X0DuTiT1h2ft8r2fYO8JYtU9a9Xis/zBSiGArNaagCOWx90N1k2wxp18czFDH+OgcWGb5ZP/XMt3dcyPA==}
+
+  '@emnapi/wasi-threads@1.2.2':
+    resolution: {integrity: sha512-c95qOXkHdydNKhscBTebqEC1CVAZpyqOfVfBzQ1qgzyl3gfeldUjIggDbIZgDKsHLgnsM+igH7TJ/eAasaVuMA==}
+
+  '@emotion/hash@0.8.0':
+    resolution: {integrity: sha512-kBJtf7PH6aWwZ6fka3zQ0p6SBYzx4fl1LoZXE2RrnYST9Xljm7WfKJrU4g/Xr3Beg72MLrp1AWNUmuYJTL7Cow==}
 
   '@emotion/hash@0.9.2':
     resolution: {integrity: sha512-MyqliTZGuOm3+5ZRSaaBGP3USLw6+EGykkwZns2EPC5g8jJ4z9OrdZY9apkl3+UP9+sdz76YYkwCKP5gh8iY3g==}
 
+  '@emotion/unitless@0.7.5':
+    resolution: {integrity: sha512-OWORNpfjMsSSUBVrRBVGECkhWcULOAJz9ZW8uK9qgxD+87M7jHRcvh/A96XXNhXTLmKcoYSQtBEX7lHMO7YRwg==}
+
   '@emotion/unitless@0.8.1':
     resolution: {integrity: sha512-KOEGMu6dmJZtpadb476IsZBclKvILjopjUii3V+7MnXIQCYh8W3NgNcgwo21n9LXZX6EDIKvqfjYxXebDwxKmQ==}
 
-  '@es-joy/jsdoccomment@0.49.0':
-    resolution: {integrity: sha512-xjZTSFgECpb9Ohuk5yMX5RhUEbfeQcuOp8IF60e+wyzWEF0M5xeSgqsfLtvPEX8BIyOX9saZqzuGPmZ8oWc+5Q==}
-    engines: {node: '>=16'}
+  '@epic-web/invariant@1.0.0':
+    resolution: {integrity: sha512-lrTPqgvfFQtR/eY/qkIzp98OGdNJu0m5ji3q/nJI8v3SXkRKEnWiOxMmbvcSoAIzv/cGiuvRy57k4suKQSAdwA==}
 
-  '@esbuild/aix-ppc64@0.24.0':
-    resolution: {integrity: sha512-WtKdFM7ls47zkKHFVzMz8opM7LkcsIp9amDUBIAWirg70RM71WRSjdILPsY5Uv1D42ZpUfaPILDlfactHgsRkw==}
+  '@es-joy/jsdoccomment@0.88.0':
+    resolution: {integrity: sha512-GK/HL/claLLNo5KG705auIlZMwEtmn88ofSGuLsmVZwKBqMPJhW9DiznYNq07QEqz9BPtA3LBfYImtZmhVvRAw==}
+    engines: {node: ^20.19.0 || ^22.13.0 || >=24}
+
+  '@esbuild/aix-ppc64@0.25.12':
+    resolution: {integrity: sha512-Hhmwd6CInZ3dwpuGTF8fJG6yoWmsToE+vYgD4nytZVxcu1ulHpUQRAB1UJ8+N1Am3Mz4+xOByoQoSZf4D+CpkA==}
     engines: {node: '>=18'}
     cpu: [ppc64]
     os: [aix]
 
-  '@esbuild/android-arm64@0.24.0':
-    resolution: {integrity: sha512-Vsm497xFM7tTIPYK9bNTYJyF/lsP590Qc1WxJdlB6ljCbdZKU9SY8i7+Iin4kyhV/KV5J2rOKsBQbB77Ab7L/w==}
+  '@esbuild/aix-ppc64@0.28.2':
+    resolution: {integrity: sha512-XExcO+dvLKvVtNTibSTBej1NCAbaGhWn9Ww1ZPx80qsahhPFe/8jgWP0IchNe0F3HwkU7n8ejhH8bjonqht8mQ==}
+    engines: {node: '>=18'}
+    cpu: [ppc64]
+    os: [aix]
+
+  '@esbuild/android-arm64@0.25.12':
+    resolution: {integrity: sha512-6AAmLG7zwD1Z159jCKPvAxZd4y/VTO0VkprYy+3N2FtJ8+BQWFXU+OxARIwA46c5tdD9SsKGZ/1ocqBS/gAKHg==}
     engines: {node: '>=18'}
     cpu: [arm64]
     os: [android]
 
-  '@esbuild/android-arm@0.24.0':
-    resolution: {integrity: sha512-arAtTPo76fJ/ICkXWetLCc9EwEHKaeya4vMrReVlEIUCAUncH7M4bhMQ+M9Vf+FFOZJdTNMXNBrWwW+OXWpSew==}
+  '@esbuild/android-arm64@0.28.2':
+    resolution: {integrity: sha512-5YfKeeI8qWfBZIX+u2xZC3Zlb3Os/gLS2sbEKM+I4ZOcsWmHS2WLysCcQZDAFRslDUU5Oiq44gf6PYN1vGwG5A==}
+    engines: {node: '>=18'}
+    cpu: [arm64]
+    os: [android]
+
+  '@esbuild/android-arm@0.25.12':
+    resolution: {integrity: sha512-VJ+sKvNA/GE7Ccacc9Cha7bpS8nyzVv0jdVgwNDaR4gDMC/2TTRc33Ip8qrNYUcpkOHUT5OZ0bUcNNVZQ9RLlg==}
     engines: {node: '>=18'}
     cpu: [arm]
     os: [android]
 
-  '@esbuild/android-x64@0.24.0':
-    resolution: {integrity: sha512-t8GrvnFkiIY7pa7mMgJd7p8p8qqYIz1NYiAoKc75Zyv73L3DZW++oYMSHPRarcotTKuSs6m3hTOa5CKHaS02TQ==}
+  '@esbuild/android-arm@0.28.2':
+    resolution: {integrity: sha512-kXXoiPVVGQcnIYGOeaovwOURpniDBpSq4A03qkQ+BMQqtGG6HYap3xne9C1O1yo4TR3qxlCX5IqqmX6fFo2Lqg==}
+    engines: {node: '>=18'}
+    cpu: [arm]
+    os: [android]
+
+  '@esbuild/android-x64@0.25.12':
+    resolution: {integrity: sha512-5jbb+2hhDHx5phYR2By8GTWEzn6I9UqR11Kwf22iKbNpYrsmRB18aX/9ivc5cabcUiAT/wM+YIZ6SG9QO6a8kg==}
     engines: {node: '>=18'}
     cpu: [x64]
     os: [android]
 
-  '@esbuild/darwin-arm64@0.24.0':
-    resolution: {integrity: sha512-CKyDpRbK1hXwv79soeTJNHb5EiG6ct3efd/FTPdzOWdbZZfGhpbcqIpiD0+vwmpu0wTIL97ZRPZu8vUt46nBSw==}
+  '@esbuild/android-x64@0.28.2':
+    resolution: {integrity: sha512-O387ite7SzUyCcy3JQX4P4bLtEA7bLLkx+esve5JHnyYfNTxcVpXZo9jhdB0lTKN44gztELTdU7nS8Nr16Fs1Q==}
+    engines: {node: '>=18'}
+    cpu: [x64]
+    os: [android]
+
+  '@esbuild/darwin-arm64@0.25.12':
+    resolution: {integrity: sha512-N3zl+lxHCifgIlcMUP5016ESkeQjLj/959RxxNYIthIg+CQHInujFuXeWbWMgnTo4cp5XVHqFPmpyu9J65C1Yg==}
     engines: {node: '>=18'}
     cpu: [arm64]
     os: [darwin]
 
-  '@esbuild/darwin-x64@0.24.0':
-    resolution: {integrity: sha512-rgtz6flkVkh58od4PwTRqxbKH9cOjaXCMZgWD905JOzjFKW+7EiUObfd/Kav+A6Gyud6WZk9w+xu6QLytdi2OA==}
+  '@esbuild/darwin-arm64@0.28.2':
+    resolution: {integrity: sha512-n4KqkOQrraxHJcgjM1RvwbigfQKIKJVpM7xp+KsxiyUSrRdIXnt73VhrPAx0fV44hgfmIVKjxMN9J1t5jySVkw==}
+    engines: {node: '>=18'}
+    cpu: [arm64]
+    os: [darwin]
+
+  '@esbuild/darwin-x64@0.25.12':
+    resolution: {integrity: sha512-HQ9ka4Kx21qHXwtlTUVbKJOAnmG1ipXhdWTmNXiPzPfWKpXqASVcWdnf2bnL73wgjNrFXAa3yYvBSd9pzfEIpA==}
     engines: {node: '>=18'}
     cpu: [x64]
     os: [darwin]
 
-  '@esbuild/freebsd-arm64@0.24.0':
-    resolution: {integrity: sha512-6Mtdq5nHggwfDNLAHkPlyLBpE5L6hwsuXZX8XNmHno9JuL2+bg2BX5tRkwjyfn6sKbxZTq68suOjgWqCicvPXA==}
+  '@esbuild/darwin-x64@0.28.2':
+    resolution: {integrity: sha512-uq6suIWYP37qzGddBKPw5QEQPi6HiLGsO7UmkpfyaYNQ3D+rN6w6WfwH+nuqcGXWvawGwxOEroO4YGnFh95azw==}
+    engines: {node: '>=18'}
+    cpu: [x64]
+    os: [darwin]
+
+  '@esbuild/freebsd-arm64@0.25.12':
+    resolution: {integrity: sha512-gA0Bx759+7Jve03K1S0vkOu5Lg/85dou3EseOGUes8flVOGxbhDDh/iZaoek11Y8mtyKPGF3vP8XhnkDEAmzeg==}
     engines: {node: '>=18'}
     cpu: [arm64]
     os: [freebsd]
 
-  '@esbuild/freebsd-x64@0.24.0':
-    resolution: {integrity: sha512-D3H+xh3/zphoX8ck4S2RxKR6gHlHDXXzOf6f/9dbFt/NRBDIE33+cVa49Kil4WUjxMGW0ZIYBYtaGCa2+OsQwQ==}
+  '@esbuild/freebsd-arm64@0.28.2':
+    resolution: {integrity: sha512-n+I0BTSRIoy+d6RPKnEVwql5UwBJolytvY4mAOIEJorKlqgPII8ix6slVVrfZ5Tnj7glIZvloylbB/EJPMWEXw==}
+    engines: {node: '>=18'}
+    cpu: [arm64]
+    os: [freebsd]
+
+  '@esbuild/freebsd-x64@0.25.12':
+    resolution: {integrity: sha512-TGbO26Yw2xsHzxtbVFGEXBFH0FRAP7gtcPE7P5yP7wGy7cXK2oO7RyOhL5NLiqTlBh47XhmIUXuGciXEqYFfBQ==}
     engines: {node: '>=18'}
     cpu: [x64]
     os: [freebsd]
 
-  '@esbuild/linux-arm64@0.24.0':
-    resolution: {integrity: sha512-TDijPXTOeE3eaMkRYpcy3LarIg13dS9wWHRdwYRnzlwlA370rNdZqbcp0WTyyV/k2zSxfko52+C7jU5F9Tfj1g==}
+  '@esbuild/freebsd-x64@0.28.2':
+    resolution: {integrity: sha512-78XJTJkvPs0kz2w61301PJjXl4g7q3JqiYMZ/M/yVI73EHBrCRTgkhu9oqG7vPqq+a/yadEW8aD+agKlk5xrmg==}
+    engines: {node: '>=18'}
+    cpu: [x64]
+    os: [freebsd]
+
+  '@esbuild/linux-arm64@0.25.12':
+    resolution: {integrity: sha512-8bwX7a8FghIgrupcxb4aUmYDLp8pX06rGh5HqDT7bB+8Rdells6mHvrFHHW2JAOPZUbnjUpKTLg6ECyzvas2AQ==}
     engines: {node: '>=18'}
     cpu: [arm64]
     os: [linux]
 
-  '@esbuild/linux-arm@0.24.0':
-    resolution: {integrity: sha512-gJKIi2IjRo5G6Glxb8d3DzYXlxdEj2NlkixPsqePSZMhLudqPhtZ4BUrpIuTjJYXxvF9njql+vRjB2oaC9XpBw==}
+  '@esbuild/linux-arm64@0.28.2':
+    resolution: {integrity: sha512-pW4AC0P3it8c7do9MVM4p51FzHzdM/TZrerurgRcHJ2WTa1VQ1CIq18xncfpBJw4ojkiZZrKW2yIBWBP92j6Ug==}
+    engines: {node: '>=18'}
+    cpu: [arm64]
+    os: [linux]
+
+  '@esbuild/linux-arm@0.25.12':
+    resolution: {integrity: sha512-lPDGyC1JPDou8kGcywY0YILzWlhhnRjdof3UlcoqYmS9El818LLfJJc3PXXgZHrHCAKs/Z2SeZtDJr5MrkxtOw==}
     engines: {node: '>=18'}
     cpu: [arm]
     os: [linux]
 
-  '@esbuild/linux-ia32@0.24.0':
-    resolution: {integrity: sha512-K40ip1LAcA0byL05TbCQ4yJ4swvnbzHscRmUilrmP9Am7//0UjPreh4lpYzvThT2Quw66MhjG//20mrufm40mA==}
+  '@esbuild/linux-arm@0.28.2':
+    resolution: {integrity: sha512-XlDnu2q5yoqems+xay6wSAcg9DDD7K9RLKZEBOMZm3ckNpJBvOX20tSfby8KfrrhINDyv9V2YVZKY/SpoGJI8w==}
+    engines: {node: '>=18'}
+    cpu: [arm]
+    os: [linux]
+
+  '@esbuild/linux-ia32@0.25.12':
+    resolution: {integrity: sha512-0y9KrdVnbMM2/vG8KfU0byhUN+EFCny9+8g202gYqSSVMonbsCfLjUO+rCci7pM0WBEtz+oK/PIwHkzxkyharA==}
     engines: {node: '>=18'}
     cpu: [ia32]
     os: [linux]
 
-  '@esbuild/linux-loong64@0.24.0':
-    resolution: {integrity: sha512-0mswrYP/9ai+CU0BzBfPMZ8RVm3RGAN/lmOMgW4aFUSOQBjA31UP8Mr6DDhWSuMwj7jaWOT0p0WoZ6jeHhrD7g==}
+  '@esbuild/linux-ia32@0.28.2':
+    resolution: {integrity: sha512-CYbnj78HsIeA+DhgUKgFCfvNsTHFhMMrinUrMZpDXJXKN8T3XViTZ/+wtHeVxEWY8ewSzTFN+nRmSwO2tZaLUQ==}
+    engines: {node: '>=18'}
+    cpu: [ia32]
+    os: [linux]
+
+  '@esbuild/linux-loong64@0.25.12':
+    resolution: {integrity: sha512-h///Lr5a9rib/v1GGqXVGzjL4TMvVTv+s1DPoxQdz7l/AYv6LDSxdIwzxkrPW438oUXiDtwM10o9PmwS/6Z0Ng==}
     engines: {node: '>=18'}
     cpu: [loong64]
     os: [linux]
 
-  '@esbuild/linux-mips64el@0.24.0':
-    resolution: {integrity: sha512-hIKvXm0/3w/5+RDtCJeXqMZGkI2s4oMUGj3/jM0QzhgIASWrGO5/RlzAzm5nNh/awHE0A19h/CvHQe6FaBNrRA==}
+  '@esbuild/linux-loong64@0.28.2':
+    resolution: {integrity: sha512-buwkd8nsph4R+ajRvw0qM5Hja/TXQow3ptzWO2EbG/cqcIkHloRrdlBtQlshyYGTNFvfkfJ5tpPLVkY4DtsPfQ==}
+    engines: {node: '>=18'}
+    cpu: [loong64]
+    os: [linux]
+
+  '@esbuild/linux-mips64el@0.25.12':
+    resolution: {integrity: sha512-iyRrM1Pzy9GFMDLsXn1iHUm18nhKnNMWscjmp4+hpafcZjrr2WbT//d20xaGljXDBYHqRcl8HnxbX6uaA/eGVw==}
     engines: {node: '>=18'}
     cpu: [mips64el]
     os: [linux]
 
-  '@esbuild/linux-ppc64@0.24.0':
-    resolution: {integrity: sha512-HcZh5BNq0aC52UoocJxaKORfFODWXZxtBaaZNuN3PUX3MoDsChsZqopzi5UupRhPHSEHotoiptqikjN/B77mYQ==}
+  '@esbuild/linux-mips64el@0.28.2':
+    resolution: {integrity: sha512-ZVykbDyk7519VwiNb9Lcj9m8XM6v5V9uKPvrEMkkEedVewf+0itkhahp4HDpgERXhwLRpWFypsGbG/J8s0QjJA==}
+    engines: {node: '>=18'}
+    cpu: [mips64el]
+    os: [linux]
+
+  '@esbuild/linux-ppc64@0.25.12':
+    resolution: {integrity: sha512-9meM/lRXxMi5PSUqEXRCtVjEZBGwB7P/D4yT8UG/mwIdze2aV4Vo6U5gD3+RsoHXKkHCfSxZKzmDssVlRj1QQA==}
     engines: {node: '>=18'}
     cpu: [ppc64]
     os: [linux]
 
-  '@esbuild/linux-riscv64@0.24.0':
-    resolution: {integrity: sha512-bEh7dMn/h3QxeR2KTy1DUszQjUrIHPZKyO6aN1X4BCnhfYhuQqedHaa5MxSQA/06j3GpiIlFGSsy1c7Gf9padw==}
+  '@esbuild/linux-ppc64@0.28.2':
+    resolution: {integrity: sha512-CAXl+Dtd9UUuJd8pKKdwh6MLm3MUMiqMPmhZ3tTSXPqfyQ3vDl6R5hZdZ/kYojK4ofXtdfSv1tFq8XzWx3heNQ==}
+    engines: {node: '>=18'}
+    cpu: [ppc64]
+    os: [linux]
+
+  '@esbuild/linux-riscv64@0.25.12':
+    resolution: {integrity: sha512-Zr7KR4hgKUpWAwb1f3o5ygT04MzqVrGEGXGLnj15YQDJErYu/BGg+wmFlIDOdJp0PmB0lLvxFIOXZgFRrdjR0w==}
     engines: {node: '>=18'}
     cpu: [riscv64]
     os: [linux]
 
-  '@esbuild/linux-s390x@0.24.0':
-    resolution: {integrity: sha512-ZcQ6+qRkw1UcZGPyrCiHHkmBaj9SiCD8Oqd556HldP+QlpUIe2Wgn3ehQGVoPOvZvtHm8HPx+bH20c9pvbkX3g==}
+  '@esbuild/linux-riscv64@0.28.2':
+    resolution: {integrity: sha512-GeXCej4IQtU1B+QlDV8W/RRvbzI3O/Stss+/bCXv4lZls5WGRtu2a+3JkA3i4qIUlMXpcHebWpF8AkJhATowuA==}
+    engines: {node: '>=18'}
+    cpu: [riscv64]
+    os: [linux]
+
+  '@esbuild/linux-s390x@0.25.12':
+    resolution: {integrity: sha512-MsKncOcgTNvdtiISc/jZs/Zf8d0cl/t3gYWX8J9ubBnVOwlk65UIEEvgBORTiljloIWnBzLs4qhzPkJcitIzIg==}
     engines: {node: '>=18'}
     cpu: [s390x]
     os: [linux]
 
-  '@esbuild/linux-x64@0.24.0':
-    resolution: {integrity: sha512-vbutsFqQ+foy3wSSbmjBXXIJ6PL3scghJoM8zCL142cGaZKAdCZHyf+Bpu/MmX9zT9Q0zFBVKb36Ma5Fzfa8xA==}
+  '@esbuild/linux-s390x@0.28.2':
+    resolution: {integrity: sha512-3H1weTYZPxt/WOhByszQZybS9w5lKzUn1FDMsgEChbHWQwHYQQRfBxgCcZvPhjHfKyJjIievvMmEUawJrdY9Dg==}
+    engines: {node: '>=18'}
+    cpu: [s390x]
+    os: [linux]
+
+  '@esbuild/linux-x64@0.25.12':
+    resolution: {integrity: sha512-uqZMTLr/zR/ed4jIGnwSLkaHmPjOjJvnm6TVVitAa08SLS9Z0VM8wIRx7gWbJB5/J54YuIMInDquWyYvQLZkgw==}
     engines: {node: '>=18'}
     cpu: [x64]
     os: [linux]
 
-  '@esbuild/netbsd-x64@0.24.0':
-    resolution: {integrity: sha512-hjQ0R/ulkO8fCYFsG0FZoH+pWgTTDreqpqY7UnQntnaKv95uP5iW3+dChxnx7C3trQQU40S+OgWhUVwCjVFLvg==}
+  '@esbuild/linux-x64@0.28.2':
+    resolution: {integrity: sha512-4xTZr1FUmSoQW4XIWmit3tzQrUTZM+N3P0XV8xROKYF50XfI7xeO90+1bZvNwxIufQ9hDQVRJH5YhgPVF8A/HQ==}
+    engines: {node: '>=18'}
+    cpu: [x64]
+    os: [linux]
+
+  '@esbuild/netbsd-arm64@0.25.12':
+    resolution: {integrity: sha512-xXwcTq4GhRM7J9A8Gv5boanHhRa/Q9KLVmcyXHCTaM4wKfIpWkdXiMog/KsnxzJ0A1+nD+zoecuzqPmCRyBGjg==}
+    engines: {node: '>=18'}
+    cpu: [arm64]
+    os: [netbsd]
+
+  '@esbuild/netbsd-arm64@0.28.2':
+    resolution: {integrity: sha512-sSATRjPeDBg3pdgHoQfoYBob11Kk1FGa9lui5RIHZCoCkJa9QKlvl3/vKz2usCmYYjs7ymJR/2Nnsqe+Hjt5nw==}
+    engines: {node: '>=18'}
+    cpu: [arm64]
+    os: [netbsd]
+
+  '@esbuild/netbsd-x64@0.25.12':
+    resolution: {integrity: sha512-Ld5pTlzPy3YwGec4OuHh1aCVCRvOXdH8DgRjfDy/oumVovmuSzWfnSJg+VtakB9Cm0gxNO9BzWkj6mtO1FMXkQ==}
     engines: {node: '>=18'}
     cpu: [x64]
     os: [netbsd]
 
-  '@esbuild/openbsd-arm64@0.24.0':
-    resolution: {integrity: sha512-MD9uzzkPQbYehwcN583yx3Tu5M8EIoTD+tUgKF982WYL9Pf5rKy9ltgD0eUgs8pvKnmizxjXZyLt0z6DC3rRXg==}
+  '@esbuild/netbsd-x64@0.28.2':
+    resolution: {integrity: sha512-lqnzCV+mM0gIADaKihiCg6ifgfU2L3h5E33rNQBN1Y4MaVGnzryzmvvf7UHxprpQdE8hpqLolJ9Rl+SkIRDpyw==}
+    engines: {node: '>=18'}
+    cpu: [x64]
+    os: [netbsd]
+
+  '@esbuild/openbsd-arm64@0.25.12':
+    resolution: {integrity: sha512-fF96T6KsBo/pkQI950FARU9apGNTSlZGsv1jZBAlcLL1MLjLNIWPBkj5NlSz8aAzYKg+eNqknrUJ24QBybeR5A==}
     engines: {node: '>=18'}
     cpu: [arm64]
     os: [openbsd]
 
-  '@esbuild/openbsd-x64@0.24.0':
-    resolution: {integrity: sha512-4ir0aY1NGUhIC1hdoCzr1+5b43mw99uNwVzhIq1OY3QcEwPDO3B7WNXBzaKY5Nsf1+N11i1eOfFcq+D/gOS15Q==}
+  '@esbuild/openbsd-arm64@0.28.2':
+    resolution: {integrity: sha512-AL2qJILH7lNjrDmCQDvdxMfAUIv8KMNZOvrwAQ8i8//ntL9FflhOyMJ8OZSMBb8/AWXe3/5v5S20y3zCoZWKoQ==}
+    engines: {node: '>=18'}
+    cpu: [arm64]
+    os: [openbsd]
+
+  '@esbuild/openbsd-x64@0.25.12':
+    resolution: {integrity: sha512-MZyXUkZHjQxUvzK7rN8DJ3SRmrVrke8ZyRusHlP+kuwqTcfWLyqMOE3sScPPyeIXN/mDJIfGXvcMqCgYKekoQw==}
     engines: {node: '>=18'}
     cpu: [x64]
     os: [openbsd]
 
-  '@esbuild/sunos-x64@0.24.0':
-    resolution: {integrity: sha512-jVzdzsbM5xrotH+W5f1s+JtUy1UWgjU0Cf4wMvffTB8m6wP5/kx0KiaLHlbJO+dMgtxKV8RQ/JvtlFcdZ1zCPA==}
+  '@esbuild/openbsd-x64@0.28.2':
+    resolution: {integrity: sha512-QtiuPytchRyC4rwUKhexJdQKvDuZ6hWloi3igqPQNUJCS1/v9EiO3UTOXR6A3FoMo4fnAKbWJdqaIwhOzh8qEw==}
+    engines: {node: '>=18'}
+    cpu: [x64]
+    os: [openbsd]
+
+  '@esbuild/openharmony-arm64@0.25.12':
+    resolution: {integrity: sha512-rm0YWsqUSRrjncSXGA7Zv78Nbnw4XL6/dzr20cyrQf7ZmRcsovpcRBdhD43Nuk3y7XIoW2OxMVvwuRvk9XdASg==}
+    engines: {node: '>=18'}
+    cpu: [arm64]
+    os: [openharmony]
+
+  '@esbuild/openharmony-arm64@0.28.2':
+    resolution: {integrity: sha512-WkhYDmpTjLvGlScA1rwjRUmhl4k8oXR3cIbtqWmELgU/dFeHHlEllxDvdWcNJV9rbzCexB5vz8gtNewWLgCT7Q==}
+    engines: {node: '>=18'}
+    cpu: [arm64]
+    os: [openharmony]
+
+  '@esbuild/sunos-x64@0.25.12':
+    resolution: {integrity: sha512-3wGSCDyuTHQUzt0nV7bocDy72r2lI33QL3gkDNGkod22EsYl04sMf0qLb8luNKTOmgF/eDEDP5BFNwoBKH441w==}
     engines: {node: '>=18'}
     cpu: [x64]
     os: [sunos]
 
-  '@esbuild/win32-arm64@0.24.0':
-    resolution: {integrity: sha512-iKc8GAslzRpBytO2/aN3d2yb2z8XTVfNV0PjGlCxKo5SgWmNXx82I/Q3aG1tFfS+A2igVCY97TJ8tnYwpUWLCA==}
+  '@esbuild/sunos-x64@0.28.2':
+    resolution: {integrity: sha512-GPMSkTOtMnv2U2F8gxe4Io6qmVs+YKyp832Etqqxr0hFngmXQ3rzwytelm3GIn7T4VviRUlf3sOgBOiTdvaf7g==}
+    engines: {node: '>=18'}
+    cpu: [x64]
+    os: [sunos]
+
+  '@esbuild/win32-arm64@0.25.12':
+    resolution: {integrity: sha512-rMmLrur64A7+DKlnSuwqUdRKyd3UE7oPJZmnljqEptesKM8wx9J8gx5u0+9Pq0fQQW8vqeKebwNXdfOyP+8Bsg==}
     engines: {node: '>=18'}
     cpu: [arm64]
     os: [win32]
 
-  '@esbuild/win32-ia32@0.24.0':
-    resolution: {integrity: sha512-vQW36KZolfIudCcTnaTpmLQ24Ha1RjygBo39/aLkM2kmjkWmZGEJ5Gn9l5/7tzXA42QGIoWbICfg6KLLkIw6yw==}
+  '@esbuild/win32-arm64@0.28.2':
+    resolution: {integrity: sha512-PIhhEkE9uPBleRBrQEJpUn7MBnibZzbGzYWPmY3x+YoVg/95zbjB4CxPPOQ8l5tYYM4mMaCthF8/1DIfBQQyWQ==}
+    engines: {node: '>=18'}
+    cpu: [arm64]
+    os: [win32]
+
+  '@esbuild/win32-ia32@0.25.12':
+    resolution: {integrity: sha512-HkqnmmBoCbCwxUKKNPBixiWDGCpQGVsrQfJoVGYLPT41XWF8lHuE5N6WhVia2n4o5QK5M4tYr21827fNhi4byQ==}
     engines: {node: '>=18'}
     cpu: [ia32]
     os: [win32]
 
-  '@esbuild/win32-x64@0.24.0':
-    resolution: {integrity: sha512-7IAFPrjSQIJrGsK6flwg7NFmwBoSTyF3rl7If0hNUFQU4ilTsEPL6GuMuU9BfIWVVGuRnuIidkSMC+c0Otu8IA==}
+  '@esbuild/win32-ia32@0.28.2':
+    resolution: {integrity: sha512-YmJbfTlvU7Sdn9BB+4PRES4oB6pxgS37MAONj+hBr/cpXS1aBPKXxNnDbu+QCWPj0o9dgyxeq79g6c5P8KeuYA==}
+    engines: {node: '>=18'}
+    cpu: [ia32]
+    os: [win32]
+
+  '@esbuild/win32-x64@0.25.12':
+    resolution: {integrity: sha512-alJC0uCZpTFrSL0CCDjcgleBXPnCrEAhTBILpeAp7M/OFgoqtAetfBzX0xM00MUsVVPpVjlPuMbREqnZCXaTnA==}
     engines: {node: '>=18'}
     cpu: [x64]
     os: [win32]
 
-  '@eslint-community/eslint-utils@4.4.1':
-    resolution: {integrity: sha512-s3O3waFUrMV8P/XaF/+ZTp1X9XBZW1a4B97ZnjQF2KYWaFD2A8KyFBsrsfSjEmjn3RGWAIuvlneuZm3CUK3jbA==}
+  '@esbuild/win32-x64@0.28.2':
+    resolution: {integrity: sha512-5ebpxr3nWMzrL/rnUI755Jkuee0bHL/Gq0WTF9lvcpv73wAp5eu8MfBUgWK9bhWvZjj7yX8etf/8tI8Ney695g==}
+    engines: {node: '>=18'}
+    cpu: [x64]
+    os: [win32]
+
+  '@eslint-community/eslint-plugin-eslint-comments@4.7.2':
+    resolution: {integrity: sha512-LF03qURSwEWm2dz5wtdDCzNk+7Opl0X7q6I3undsaIuNsEiNvRV3BCtqu14Q/6Pzg1tBj44LcxpW2EpSLZStZw==}
+    engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
+    peerDependencies:
+      eslint: ^6.0.0 || ^7.0.0 || ^8.0.0 || ^9.0.0 || ^10.0.0
+
+  '@eslint-community/eslint-utils@4.10.1':
+    resolution: {integrity: sha512-cuadcxVFE8sDK6iWJbs8Sn0av2Nrh2QSGQhVlBW9AaAHqHwjWsZHT8LJ4hFGPh7ASBV2deFdM7H/DPjulmh8rg==}
     engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
     peerDependencies:
       eslint: ^6.0.0 || ^7.0.0 || >=8.0.0
 
-  '@eslint-community/regexpp@4.12.1':
-    resolution: {integrity: sha512-CCZCDJuduB9OUkFkY2IgppNZMi2lBQgD2qzwXkEia16cge2pijY/aXi96CJMquDMn3nJdlPV1A5KrJEXwfLNzQ==}
+  '@eslint-community/regexpp@4.12.2':
+    resolution: {integrity: sha512-EriSTlt5OC9/7SXkRSCAhfSxxoSUgBm33OH+IkwbdpgoqsSsUg7y3uh+IICI/Qg4BBWr3U2i39RpmycbxMq4ew==}
     engines: {node: ^12.0.0 || ^14.0.0 || >=16.0.0}
 
-  '@eslint/config-array@0.19.1':
-    resolution: {integrity: sha512-fo6Mtm5mWyKjA/Chy1BYTdn5mGJoDNjC7C64ug20ADsRDGrA85bN3uK3MaKbeRkRuuIEAR5N33Jr1pbm411/PA==}
-    engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
+  '@eslint/config-array@0.23.5':
+    resolution: {integrity: sha512-Y3kKLvC1dvTOT+oGlqNQ1XLqK6D1HU2YXPc52NmAlJZbMMWDzGYXMiPRJ8TYD39muD/OTjlZmNJ4ib7dvSrMBA==}
+    engines: {node: ^20.19.0 || ^22.13.0 || >=24}
 
-  '@eslint/core@0.9.1':
-    resolution: {integrity: sha512-GuUdqkyyzQI5RMIWkHhvTWLCyLo1jNK3vzkSyaExH5kHPDHcuL2VOpHjmMY+y3+NC69qAKToBqldTBgYeLSr9Q==}
-    engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
+  '@eslint/config-helpers@0.7.0':
+    resolution: {integrity: sha512-DObd/KKUsU+FaFv4PLxSRenpXfQWmPXXP3pPZ6/K1PCrMu2vQpMDMuQe/BqYeoLcz8ro0bVDF1RxOJgfVEdhUw==}
+    engines: {node: ^20.19.0 || ^22.13.0 || >=24}
 
-  '@eslint/eslintrc@3.2.0':
-    resolution: {integrity: sha512-grOjVNN8P3hjJn/eIETF1wwd12DdnwFDoyceUJLYYdkpbwq3nLi+4fqrTAONx7XDALqlL220wC/RHSC/QTI/0w==}
-    engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
+  '@eslint/core@1.2.1':
+    resolution: {integrity: sha512-MwcE1P+AZ4C6DWlpin/OmOA54mmIZ/+xZuJiQd4SyB29oAJjN30UW9wkKNptW2ctp4cEsvhlLY/CsQ1uoHDloQ==}
+    engines: {node: ^20.19.0 || ^22.13.0 || >=24}
 
-  '@eslint/js@9.17.0':
-    resolution: {integrity: sha512-Sxc4hqcs1kTu0iID3kcZDW3JHq2a77HO9P8CP6YEA/FpH3Ll8UXE2r/86Rz9YJLKme39S9vU5OWNjC6Xl0Cr3w==}
-    engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
+  '@eslint/css-tree@4.0.5':
+    resolution: {integrity: sha512-iPmijIAq4hlIJB86PYmY/fcZORHtjphSqICDbwuw32A/JmkhZQ/K/6TjHE03zqf3n5yABpVcbRAMG8Mi9ojy8g==}
+    engines: {node: ^20.19.0 || ^22.13.0 || >=24}
 
-  '@eslint/object-schema@2.1.5':
-    resolution: {integrity: sha512-o0bhxnL89h5Bae5T318nFoFzGy+YE5i/gGkoPAgkmTVdRKTiv3p8JHevPiPaMwoloKfEiiaHlawCqaZMqRm+XQ==}
-    engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
+  '@eslint/js@10.0.1':
+    resolution: {integrity: sha512-zeR9k5pd4gxjZ0abRoIaxdc7I3nDktoXZk2qOv9gCNWx3mVwEn32VRhyLaRsDiJjTs0xq/T8mfPtyuXu7GWBcA==}
+    engines: {node: ^20.19.0 || ^22.13.0 || >=24}
+    peerDependencies:
+      eslint: ^10.0.0
+    peerDependenciesMeta:
+      eslint:
+        optional: true
 
-  '@eslint/plugin-kit@0.2.4':
-    resolution: {integrity: sha512-zSkKow6H5Kdm0ZUQUB2kV5JIXqoG0+uH5YADhaEHswm664N9Db8dXSi0nMJpacpMf+MyyglF1vnZohpEg5yUtg==}
-    engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
+  '@eslint/object-schema@3.0.5':
+    resolution: {integrity: sha512-vqTaUEgxzm+YDSdElad6PiRoX4t8VGDjCtt05zn4nU810UIx/uNEV7/lZJ6KwFThKZOzOxzXy48da+No7HZaMw==}
+    engines: {node: ^20.19.0 || ^22.13.0 || >=24}
+
+  '@eslint/plugin-kit@0.7.2':
+    resolution: {integrity: sha512-+CNAzxglkrpNf/kKywqQfk74QjtceuOE7Qm+AF8miRvPF/wmmK5+OJOgVh3AVTT3RP2mH3+FOaxlE5v72owk0A==}
+    engines: {node: ^20.19.0 || ^22.13.0 || >=24}
 
   '@fast-csv/format@4.3.5':
     resolution: {integrity: sha512-8iRn6QF3I8Ak78lNAa+Gdl5MJJBM5vRHivFtMRUWINdevNo00K7OXxS2PshawLKTejVwieIlPmK5YlLu6w4u8A==}
@@ -3201,68 +3640,82 @@ packages:
   '@fast-csv/parse@4.3.6':
     resolution: {integrity: sha512-uRsLYksqpbDmWaSmzvJcuApSEe38+6NQZBUsuAyMZKqHxH0g1wcJgsKUvN3WC8tewaqFjBMMGrkHmC+T7k8LvA==}
 
-  '@floating-ui/core@1.6.8':
-    resolution: {integrity: sha512-7XJ9cPU+yI2QeLS+FCSlqNFZJq8arvswefkZrYI1yQBbftw6FyrZOxYSh+9S7z7TpeWlRt9zJ5IhM1WIL334jA==}
+  '@floating-ui/core@1.8.0':
+    resolution: {integrity: sha512-0CIZ5itps/8x7BG8dEIhs53BvCUH2PCoogtakwRTut+Arm58sJooJ0AuZhLw2HJYIR5cMLNPBSS728sPho2khQ==}
 
-  '@floating-ui/dom@1.6.12':
-    resolution: {integrity: sha512-NP83c0HjokcGVEMeoStg317VD9W7eDlGK7457dMBANbKA6GJZdc7rjujdgqzTaz93jkGgc5P/jeWbaCHnMNc+w==}
+  '@floating-ui/dom@1.8.0':
+    resolution: {integrity: sha512-yXSrzeHZBTZadLOlfyhCkJHNeLJnHRnRInwdZ40L7ZiaAtrBwoYlsDrX3v5zB1Utk7CLfzcOVnVVWoXEky7Ceg==}
 
-  '@floating-ui/utils@0.2.8':
-    resolution: {integrity: sha512-kym7SodPp8/wloecOpcmSnWJsK7M0E5Wg8UcFA+uO4B9s5d0ywXOEro/8HM9x0rW+TljRzul/14UYz3TleT3ig==}
+  '@floating-ui/utils@0.2.12':
+    resolution: {integrity: sha512-HpCo8tmWzLVad5s2d19EhAz5zqrrQ6s69qd6moPMQvkOuSwDT1YgRfWSVuc4ennqrgv3OHppiOGMQ7oC13yIww==}
 
-  '@floating-ui/vue@1.1.5':
-    resolution: {integrity: sha512-ynL1p5Z+woPVSwgMGqeDrx6HrJfGIDzFyESFkyqJKilGW1+h/8yVY29Khn0LaU6wHBRwZ13ntG6reiHWK6jyzw==}
+  '@floating-ui/vue@1.1.11':
+    resolution: {integrity: sha512-HzHKCNVxnGS35r9fCHBc3+uCnjw9IWIlCPL683cGgM9Kgj2BiAl8x1mS7vtvP6F9S/e/q4O6MApwSHj8hNLGfw==}
 
   '@fortawesome/fontawesome-free@6.7.2':
     resolution: {integrity: sha512-JUOtgFW6k9u4Y+xeIaEiLr3+cjoUPiAuLXoyKOJSia6Duzb7pq+A76P9ZdPDoAoxHdHzq6gE9/jKBGXlZT8FbA==}
     engines: {node: '>=6'}
 
-  '@gar/promisify@1.1.3':
-    resolution: {integrity: sha512-k2Ty1JcVojjJFwrg/ThKi2ujJ7XNLYaFGNB/bWT9wGR+oSMJHMa5w+CUq6p/pVrKeNNgA7pCqEcjSnHVoqJQFw==}
-
-  '@humanfs/core@0.19.1':
-    resolution: {integrity: sha512-5DyQ4+1JEUzejeK1JGICcideyfUbGixgS9jNgex5nqkW+cY7WZhxBigmieN5Qnw9ZosSNVC9KQKyb+GUaGyKUA==}
+  '@humanfs/core@0.19.2':
+    resolution: {integrity: sha512-UhXNm+CFMWcbChXywFwkmhqjs3PRCmcSa/hfBgLIb7oQ5HNb1wS0icWsGtSAUNgefHeI+eBrA8I1fxmbHsGdvA==}
     engines: {node: '>=18.18.0'}
 
-  '@humanfs/node@0.16.6':
-    resolution: {integrity: sha512-YuI2ZHQL78Q5HbhDiBA1X4LmYdXCKCMQIfw0pw7piHJwyREFebJUvrQN4cMssyES6x+vfUbx1CIpaQUKYdQZOw==}
+  '@humanfs/node@0.16.8':
+    resolution: {integrity: sha512-gE1eQNZ3R++kTzFUpdGlpmy8kDZD/MLyHqDwqjkVQI0JMdI1D51sy1H958PNXYkM2rAac7e5/CnIKZrHtPh3BQ==}
+    engines: {node: '>=18.18.0'}
+
+  '@humanfs/types@0.15.0':
+    resolution: {integrity: sha512-ZZ1w0aoQkwuUuC7Yf+7sdeaNfqQiiLcSRbfI08oAxqLtpXQr9AIVX7Ay7HLDuiLYAaFPu8oBYNq/QIi9URHJ3Q==}
     engines: {node: '>=18.18.0'}
 
   '@humanwhocodes/module-importer@1.0.1':
     resolution: {integrity: sha512-bxveV4V8v5Yb4ncFTT3rPSgZBOpCkjfK0y4oVVVJwIuDVBRMDXrPyXRL988i5ap9m9bnyEEjWfm5WkBmtffLfA==}
     engines: {node: '>=12.22'}
 
-  '@humanwhocodes/retry@0.3.1':
-    resolution: {integrity: sha512-JBxkERygn7Bv/GbN5Rv8Ul6LVknS+5Bp6RgDC/O8gEBU/yeH5Ui5C/OlWrTb6qct7LjjfT6Re2NxB0ln0yYybA==}
+  '@humanwhocodes/retry@0.4.3':
+    resolution: {integrity: sha512-bV0Tgo9K4hfPCek+aMAn81RppFKv2ySDQeMoSZuvTASywNTnVJCArCZE2FWqpvIatKu7VMRLWlR1EazvVhDyhQ==}
     engines: {node: '>=18.18'}
 
-  '@humanwhocodes/retry@0.4.1':
-    resolution: {integrity: sha512-c7hNEllBlenFTHBky65mhq8WD2kbN9Q6gk0bTk8lSBvc554jpXSkST1iePudpt7+A/AQvuHs9EMqjHDXMY1lrA==}
-    engines: {node: '>=18.18'}
+  '@iconify/json@2.2.513':
+    resolution: {integrity: sha512-PnksKLhD/7/LPNeTLZbkTnkzPqd+4m/ToEvzqPtBJzkOT/wTEoLXkrz0BWUv6SdQ4NOM5Xsqc+abVarzXSlh4A==}
 
-  '@iconify/json@2.2.286':
-    resolution: {integrity: sha512-tVl/fYvCyU5flYl4zfuJgig+ZEnpG3DJdTTTIjsiPu7xsk4s0gT1BktWvcFGr2B4UUiTRdb+XHWzW8Eu9WwhKQ==}
+  '@iconify/tailwind4@1.2.3':
+    resolution: {integrity: sha512-z8SKiMHRASJKF/IY//87MF88lcB7ulxh8vlhQXXLWsBkNtOh6ese9R41MyGpQeqXdRvQVt+/fX2glQtHFjQ+MA==}
+    peerDependencies:
+      tailwindcss: '>= 4.0.0'
 
-  '@iconify/tailwind@1.2.0':
-    resolution: {integrity: sha512-KgpIHWOTcRYw1XcoUqyNSrmYyfLLqZYu3AmP8zdfLk0F5TqRO8YerhlvlQmGfn7rJXgPeZN569xPAJnJ53zZxA==}
+  '@iconify/tools@5.0.12':
+    resolution: {integrity: sha512-aFPwSFmFphUPVjNLUkgxgUPSPVgTEEjv0mE7NgvfoQBuE5TtsMrKa4HTY65cM5oXZ2a1xKQcW/RKhiOKEiAarw==}
 
   '@iconify/types@2.0.0':
     resolution: {integrity: sha512-+wluvCrRhXrhyOmRDJ3q8mux9JkKy5SJ/v8ol2tu4FVjyYvtEzkc/3pK15ET6RKg4b4w4BmTk1+gsCUhf21Ykg==}
 
-  '@iconify/vue@4.2.0':
-    resolution: {integrity: sha512-CMynoz9BDWugDO2B7LU/s8L99dHCiqDGCjCki6bhVx5etZhw9x0BTV7wWRdj82jtl1yQTc+QQRcHQmSvUY6R+g==}
+  '@iconify/utils@3.1.4':
+    resolution: {integrity: sha512-b1S7B1k9ohZ+iNTi2ATxbRYG9fTrJmUT0rc46bvVnNxqNRGW7dyo/vRREwyniI5IRN2RSJHDcm+s3BjWrSAjHw==}
+
+  '@iconify/vue@5.0.1':
+    resolution: {integrity: sha512-aumwwooJlFJ5H5qYWB6ZTAyM0C8hpfcSVLB9/a3qnH1GGvIJ+FEbpEs4s/HfErYe/M5qZeLjwmESR5fFm3lXEw==}
     peerDependencies:
-      vue: ^3.5.13
+      vue: ^3.5.40
 
-  '@internationalized/date@3.6.0':
-    resolution: {integrity: sha512-+z6ti+CcJnRlLHok/emGEsWQhe7kfSmEW+/6qCzvKY67YPh7YOBfvc7+/+NXq+zJlbArg30tYpqLjNgcAYv2YQ==}
+  '@inquirer/external-editor@1.0.3':
+    resolution: {integrity: sha512-RWbSrDiYmO4LbejWY7ttpxczuwQyZLBUyygsA9Nsv95hpzUWwnNTVQmAq3xuh7vNwCp07UTmE5i11XAEExx4RA==}
+    engines: {node: '>=18'}
+    peerDependencies:
+      '@types/node': '>=18'
+    peerDependenciesMeta:
+      '@types/node':
+        optional: true
 
-  '@internationalized/number@3.6.0':
-    resolution: {integrity: sha512-PtrRcJVy7nw++wn4W2OuePQQfTqDzfusSuY1QTtui4wa7r+rGVtR75pO8CyKvHvzyQYi3Q1uO5sY0AsB4e65Bw==}
+  '@internationalized/date@3.12.3':
+    resolution: {integrity: sha512-fuLX+3ZKLsxI73y8b01EG/WjHb6gE6weCqlfawPO27kBWGMh9G1yH6Csv1uU7/cac9H2GHmOMt6CjmuQ1aia4Q==}
 
-  '@intlify/bundle-utils@10.0.0':
-    resolution: {integrity: sha512-BR5yLOkF2dzrARTbAg7RGAIPcx9Aark7p1K/0O285F7rfzso9j2dsa+S4dA67clZ0rToZ10NSSTfbyUptVu7Bg==}
-    engines: {node: '>= 18'}
+  '@internationalized/number@3.6.7':
+    resolution: {integrity: sha512-3ji1fcrT+FPAK86UqEhB/psHixYo6niWPJtt7+qRaYFynt/BaJG8GhAPimtWUpEiVSTq8ZM8L5psMxGquiB/Vg==}
+
+  '@intlify/bundle-utils@11.2.4':
+    resolution: {integrity: sha512-eE18yR9eM9k5n8snCkHIYp2MuVTxa19aF8z9OMyxXWv0frz2HlBZDGIPFjA38pP3OJ1IlRBXC/dW5GILeLMSCQ==}
+    engines: {node: '>= 22.13'}
     peerDependencies:
       petite-vue-i18n: '*'
       vue-i18n: '*'
@@ -3272,51 +3725,46 @@ packages:
       vue-i18n:
         optional: true
 
-  '@intlify/core-base@10.0.5':
-    resolution: {integrity: sha512-F3snDTQs0MdvnnyzTDTVkOYVAZOE/MHwRvF7mn7Jw1yuih4NrFYLNYIymGlLmq4HU2iIdzYsZ7f47bOcwY73XQ==}
-    engines: {node: '>= 16'}
-
-  '@intlify/message-compiler@10.0.5':
-    resolution: {integrity: sha512-6GT1BJ852gZ0gItNZN2krX5QAmea+cmdjMvsWohArAZ3GmHdnNANEcF9JjPXAMRtQ6Ux5E269ymamg/+WU6tQA==}
-    engines: {node: '>= 16'}
-
-  '@intlify/message-compiler@12.0.0-alpha.4':
-    resolution: {integrity: sha512-F4yHuJzI2ZXtXTW2B1VhuNULAOjR5bniFSC/Z0rLWRYPO43pVgKLu+FPDoJq13OjTFq4X5hx2s855M4gqPU/pA==}
+  '@intlify/core-base@11.4.8':
+    resolution: {integrity: sha512-A+Q7SKm5oEcy1E/cghqd7n/St4XjTqLhiiyDuieNcMrJcrHlkY5n0jp7Q9dD3txvVHzvsmBVV5M9wD5/s1zfzw==}
     engines: {node: '>= 22'}
 
-  '@intlify/shared@10.0.5':
-    resolution: {integrity: sha512-bmsP4L2HqBF6i6uaMqJMcFBONVjKt+siGluRq4Ca4C0q7W2eMaVZr8iCgF9dKbcVXutftkC7D6z2SaSMmLiDyA==}
-    engines: {node: '>= 16'}
-
-  '@intlify/shared@11.4.6':
-    resolution: {integrity: sha512-m1p1HHAMLhqSpTRH7VnXdrN0CQ4y+9vunFkpLkbD8soIuBsnQdawZXqMCgvwI2UVF9Ww7sVaw7g9tV2VO7shoA==}
+  '@intlify/devtools-types@11.4.8':
+    resolution: {integrity: sha512-MGpID+rlfzGUbNcnC20bm5NMSBHPrvx0atLTfv9dftn3kjXw1hGKDcIcwrO99tSrZEc2i+hczRL7ks8qXsHPkQ==}
     engines: {node: '>= 22'}
 
-  '@intlify/shared@12.0.0-alpha.4':
-    resolution: {integrity: sha512-MfunEN3/yQjD1Q9HnD4Qtvg/qLYnR+tK3mEz/EEvikJO+Hu8ICe7Rqh6uusLSjpWy6ECVt2p5HGXlYA12UBweA==}
+  '@intlify/message-compiler@11.4.8':
+    resolution: {integrity: sha512-vbzk17dYwduYiv52EK61+FDCyhfVg1uPUtPmiD/d45W99uJIcXywrweOBcHv7n9/iEqmXiMGT52bgJbZDQqK3w==}
     engines: {node: '>= 22'}
 
-  '@intlify/unplugin-vue-i18n@6.0.1':
-    resolution: {integrity: sha512-zDcGLNoaIP15JM4TGwgTHF01Y1Drwcv7pm9C2mHrGAZ3CugqyP2QEG0Vf82QVSNqgEwgB6prcAyDmjIDK1HlRQ==}
-    engines: {node: '>= 18'}
+  '@intlify/shared@11.4.8':
+    resolution: {integrity: sha512-XbRgrv+XEuvDr7UCY55oibVrh+o4u+A0VB6nSL0F5Z8LcZxE/8j573LYG6bCrOigIcHdGpSNI7Rh5UpC5/B/eg==}
+    engines: {node: '>= 22'}
+
+  '@intlify/unplugin-vue-i18n@11.2.4':
+    resolution: {integrity: sha512-bY0ZOaVUvWTyvy4bRGCUKw4Brx5uH/ojjVKsZ1aWzY2drFKIJbeP8DpGMD2QZT8aLpZSUsHtiJlRGLQSZenrvw==}
+    engines: {node: '>= 22.13'}
     peerDependencies:
       petite-vue-i18n: '*'
-      vue: ^3.5.13
+      vite: ^6.0.0 || ^7.0.0 || ^8.0.0
+      vue: ^3.5.40
       vue-i18n: '*'
     peerDependenciesMeta:
       petite-vue-i18n:
         optional: true
+      vite:
+        optional: true
       vue-i18n:
         optional: true
 
-  '@intlify/vue-i18n-extensions@7.0.0':
-    resolution: {integrity: sha512-MtvfJnb4aklpCU5Q/dkWkBT/vGsp3qERiPIwtTq5lX4PCLHtUprAJZp8wQj5ZcwDaFCU7+yVMjYbeXpIf927cA==}
+  '@intlify/vue-i18n-extensions@8.0.0':
+    resolution: {integrity: sha512-w0+70CvTmuqbskWfzeYhn0IXxllr6mU+IeM2MU0M+j9OW64jkrvqY+pYFWrUnIIC9bEdij3NICruicwd5EgUuQ==}
     engines: {node: '>= 18'}
     peerDependencies:
-      '@intlify/shared': ^9.0.0 || ^10.0.0
+      '@intlify/shared': ^9.0.0 || ^10.0.0 || ^11.0.0
       '@vue/compiler-dom': ^3.0.0
-      vue: ^3.5.13
-      vue-i18n: ^9.0.0 || ^10.0.0
+      vue: ^3.5.40
+      vue-i18n: ^9.0.0 || ^10.0.0 || ^11.0.0
     peerDependenciesMeta:
       '@intlify/shared':
         optional: true
@@ -3327,145 +3775,169 @@ packages:
       vue-i18n:
         optional: true
 
-  '@ioredis/commands@1.2.0':
-    resolution: {integrity: sha512-Sx1pU8EM64o2BrqNpEO1CNLtKQwyhuXuqyfH7oGKCk+1a33d2r5saW8zNwm3j6BTExtjrv2BxTgzzkMwts6vGg==}
+  '@ioredis/commands@1.10.0':
+    resolution: {integrity: sha512-UmeW7z4LfctwoQ5wkhVzgq8tXkreED2xZGpX+Bg+zA+WJFZCT6c062AfCK/Dfk81xZnnwdhJCUMkitihRaoC2Q==}
 
   '@isaacs/cliui@8.0.2':
     resolution: {integrity: sha512-O8jcjabXaleOG9DQ0+ARXWZBTfnP4WNAqzuiJK7ll44AmxGKv/J2M4TPjxjY3znBCfvBXFzucm1twdyFybFqEA==}
     engines: {node: '>=12'}
 
+  '@isaacs/cliui@9.0.0':
+    resolution: {integrity: sha512-AokJm4tuBHillT+FpMtxQ60n8ObyXBatq7jD2/JA9dxbDDokKQm8KMht5ibGzLVU9IJDIKK4TPKgMHEYMn3lMg==}
+    engines: {node: '>=18'}
+
   '@isaacs/fs-minipass@4.0.1':
     resolution: {integrity: sha512-wgm9Ehl2jpeqP3zw/7mo3kRHFp5MEDhqAdwy1fTGkHAwnkGOVsgpvQhL8B5n1qlb01jV3n/bI0ZfZp5lWA1k4w==}
     engines: {node: '>=18.0.0'}
 
-  '@jridgewell/gen-mapping@0.3.8':
-    resolution: {integrity: sha512-imAbBGkb+ebQyxKgzv5Hu2nmROxoDOXHh80evxdoXNOrvAnVx7zimzc1Oo5h9RlfV4vPXaE2iM5pOFbvOCClWA==}
-    engines: {node: '>=6.0.0'}
+  '@jridgewell/gen-mapping@0.3.13':
+    resolution: {integrity: sha512-2kkt/7niJ6MgEPxF0bYdQ6etZaA+fQvDcLKckhy1yIQOzaoKjBBjSj63/aLVjYE3qhRt5dvM+uUyfCg6UKCBbA==}
+
+  '@jridgewell/remapping@2.3.5':
+    resolution: {integrity: sha512-LI9u/+laYG4Ds1TDKSJW2YPrIlcVYOwi2fUC6xB43lueCjgxV4lffOCZCtYFiH6TNOX+tQKXx97T4IKHbhyHEQ==}
 
   '@jridgewell/resolve-uri@3.1.2':
     resolution: {integrity: sha512-bRISgCIjP20/tbWSPWMEi54QVPRZExkuD9lJL+UIxUKtwVJA8wW1Trb1jMs1RFXo1CBTNZ/5hpC9QvmKWdopKw==}
     engines: {node: '>=6.0.0'}
 
-  '@jridgewell/set-array@1.2.1':
-    resolution: {integrity: sha512-R8gLRTZeyp03ymzP/6Lil/28tGeGEzhx1q2k703KGWRAI1VdvPIXdG70VJc2pAMw3NA6JKL5hhFu1sJX0Mnn/A==}
-    engines: {node: '>=6.0.0'}
+  '@jridgewell/source-map@0.3.11':
+    resolution: {integrity: sha512-ZMp1V8ZFcPG5dIWnQLr3NSI1MiCU7UETdS/A0G8V/XWHvJv3ZsFqutJn1Y5RPmAPX6F3BiE397OqveU/9NCuIA==}
 
-  '@jridgewell/source-map@0.3.6':
-    resolution: {integrity: sha512-1ZJTZebgqllO79ue2bm3rIGud/bOe0pP5BjSRCRxxYkEZS8STV7zN84UBbiYu7jy+eCKSnVIUgoWWE/tt+shMQ==}
+  '@jridgewell/sourcemap-codec@1.5.5':
+    resolution: {integrity: sha512-cYQ9310grqxueWbl+WuIUIaiUaDcj7WOq5fVhEljNVgRfOUhY9fy2zTvfoqWsnebh8Sl70VScFbICvJnLKB0Og==}
 
-  '@jridgewell/sourcemap-codec@1.5.0':
-    resolution: {integrity: sha512-gv3ZRaISU3fjPAgNsriBRqGWQL6quFx04YMPW/zD8XMLsU32mhCCbfbO6KZFLjvYpCZ8zyDEgqsgf+PwPaM7GQ==}
+  '@jridgewell/trace-mapping@0.3.31':
+    resolution: {integrity: sha512-zzNR+SdQSDJzc8joaeP8QQoCQr8NuYx2dIIytl1QeBEZHJ9uW6hebsrYgbz8hJwUQao3TWCMtmfV8Nu1twOLAw==}
 
-  '@jridgewell/trace-mapping@0.3.25':
-    resolution: {integrity: sha512-vNk6aEwybGtawWmy/PzwnGDOjCkLWSD2wqvjGGAgOAwCGWySYXfYoxt00IJkTF+8Lb57DwOb3Aa0o9CApepiYQ==}
+  '@jspm/fetch@0.1.0':
+    resolution: {integrity: sha512-R749VLq+2zRvaYOrBz8JQaeahWmjOQH9tnvp6896WHhcsFwV7bJOEXiz56EMi34DxJZTLdFUFkrtjOC5Pw3zXQ==}
 
-  '@jspm/generator@2.4.1':
-    resolution: {integrity: sha512-FmVw1I4JoNUG129GjgPLU3PQ+OQP/eZpbSoH/jT8cCjN9blHQkx0KD4jHozcd04kxAoEFeWo+9HBxktv4geC0A==}
+  '@jspm/generator@2.16.3':
+    resolution: {integrity: sha512-OmtKanpTl2aVhVq2sOFIm4zBtPABASA/TmOrsJMcaR8zJnwVBo6QZiS+OuEM95c/JXGiLehKYQ6JBLCqQ/ROyg==}
 
-  '@jspm/import-map@1.1.0':
-    resolution: {integrity: sha512-vmk583YnMi4fmqeXbWIBiyzFu+vqVZ5VCoaa6H4xeSQy5E6JAWtmcq72OAMFTeSTqw7xxHQIJFq2OlHKdUWitQ==}
+  '@jspm/import-map@1.5.0':
+    resolution: {integrity: sha512-wvjrSEB2MCrpicc/tA0mYEsQ1Jgusnz+4ALwbp5IqGFcnxcTamU/VaVbodmEXFFg4GaPmC2LupUl7Bks6nWOhg==}
 
-  '@lezer/common@1.2.3':
-    resolution: {integrity: sha512-w7ojc8ejBqr2REPsWxJjrMFsA/ysDCFICn8zEOR9mrqzOu2amhITYuLD8ag6XZf0CFXDrhKqw7+tW8cX66NaDA==}
+  '@keyv/bigmap@1.3.1':
+    resolution: {integrity: sha512-WbzE9sdmQtKy8vrNPa9BRnwZh5UF4s1KTmSK0KUVLo3eff5BlQNNWDnFOouNpKfPKDnms9xynJjsMYjMaT/aFQ==}
+    engines: {node: '>= 18'}
+    peerDependencies:
+      keyv: ^5.6.0
 
-  '@lezer/cpp@1.1.3':
-    resolution: {integrity: sha512-ykYvuFQKGsRi6IcE+/hCSGUhb/I4WPjd3ELhEblm2wS2cOznDFzO+ubK2c+ioysOnlZ3EduV+MVQFCPzAIoY3w==}
+  '@keyv/serialize@1.1.1':
+    resolution: {integrity: sha512-dXn3FZhPv0US+7dtJsIi2R+c7qWYiReoEh5zUntWCf4oSpMNib8FDhSoed6m3QyZdx5hK7iLFkYk3rNxwt8vTA==}
 
-  '@lezer/css@1.1.11':
-    resolution: {integrity: sha512-FuAnusbLBl1SEAtfN8NdShxYJiESKw9LAFysfea1T96jD3ydBn12oYjaSG1a04BQRIUd93/0D8e5CV1cUMkmQg==}
+  '@lezer/common@1.5.2':
+    resolution: {integrity: sha512-sxQE460fPZyU3sdc8lafxiPwJHBzZRy/udNFynGQky1SePYBdhkBl1kOagA9uT3pxR8K09bOrmTUqA9wb/PjSQ==}
 
-  '@lezer/go@1.0.0':
-    resolution: {integrity: sha512-co9JfT3QqX1YkrMmourYw2Z8meGC50Ko4d54QEcQbEYpvdUvN4yb0NBZdn/9ertgvjsySxHsKzH3lbm3vqJ4Jw==}
+  '@lezer/cpp@1.1.6':
+    resolution: {integrity: sha512-vh9gWWJOXFVY8HBHK3Twzq8MgwG2iN4GSyzBP9sCGTe37P15x2R14VaBQk0VA0ezTRN1KHYBBsHhvpGZ2Xy/pA==}
 
-  '@lezer/highlight@1.2.1':
-    resolution: {integrity: sha512-Z5duk4RN/3zuVO7Jq0pGLJ3qynpxUVsh7IbUbGj88+uV2ApSAn6kWg2au3iJb+0Zi7kKtqffIESgNcRXWZWmSA==}
+  '@lezer/css@1.3.6':
+    resolution: {integrity: sha512-YJE78Wcg+zX8f10hiHWQ4Az48Qr/c13eId0VtRQYLBpxHDmDeSrXIlkbl+fJGW42rWC/uoUco9mhBZeVWP/A1g==}
 
-  '@lezer/html@1.3.10':
-    resolution: {integrity: sha512-dqpT8nISx/p9Do3AchvYGV3qYc4/rKr3IBZxlHmpIKam56P47RSHkSF5f13Vu9hebS1jM0HmtJIwLbWz1VIY6w==}
+  '@lezer/go@1.0.1':
+    resolution: {integrity: sha512-xToRsYxwsgJNHTgNdStpcvmbVuKxTapV0dM0wey1geMMRc9aggoVyKgzYp41D2/vVOx+Ii4hmE206kvxIXBVXQ==}
+
+  '@lezer/highlight@1.2.3':
+    resolution: {integrity: sha512-qXdH7UqTvGfdVBINrgKhDsVTJTxactNNxLk7+UMwZhU13lMHaOBlJe9Vqp907ya56Y3+ed2tlqzys7jDkTmW0g==}
+
+  '@lezer/html@1.3.13':
+    resolution: {integrity: sha512-oI7n6NJml729m7pjm9lvLvmXbdoMoi2f+1pwSDJkl9d68zGr7a9Btz8NdHTGQZtW2DA25ybeuv/SyDb9D5tseg==}
 
   '@lezer/java@1.1.3':
     resolution: {integrity: sha512-yHquUfujwg6Yu4Fd1GNHCvidIvJwi/1Xu2DaKl/pfWIA2c1oXkVvawH3NyXhCaFx4OdlYBVX5wvz2f7Aoa/4Xw==}
 
-  '@lezer/javascript@1.4.21':
-    resolution: {integrity: sha512-lL+1fcuxWYPURMM/oFZLEDm0XuLN128QPV+VuGtKpeaOGdcl9F2LYC3nh1S9LkPqx9M0mndZFdXCipNAZpzIkQ==}
+  '@lezer/javascript@1.5.4':
+    resolution: {integrity: sha512-vvYx3MhWqeZtGPwDStM2dwgljd5smolYD2lR2UyFcHfxbBQebqx8yjmFmxtJ/E6nN6u1D9srOiVWm3Rb4tmcUA==}
 
   '@lezer/json@1.0.3':
     resolution: {integrity: sha512-BP9KzdF9Y35PDpv04r0VeSTKDeox5vVr3efE7eBbx3r4s3oNLfunchejZhjArmeieBH+nVOpgIiBJpEAv8ilqQ==}
 
-  '@lezer/lr@1.4.2':
-    resolution: {integrity: sha512-pu0K1jCIdnQ12aWNaAVU5bzi7Bd1w54J3ECgANPmYLtQKP0HBj2cE/5coBD66MT10xbtIuUr7tg0Shbsvk0mDA==}
+  '@lezer/lr@1.4.10':
+    resolution: {integrity: sha512-rnCpTIBafOx4mRp43xOxDJbFipJm/c0cia/V5TiGlhmMa+wsSdoGmUN3w5Bqrks/09Q/D4tNAmWaT8p6NRi77A==}
 
-  '@lezer/markdown@1.4.2':
-    resolution: {integrity: sha512-iYewCigG/517D0xJPQd7RGaCjZAFwROiH8T9h7OTtz0bRVtkxzFhGBFJ9JGKgBBs4uuo1cvxzyQ5iKhDLMcLUQ==}
+  '@lezer/markdown@1.7.2':
+    resolution: {integrity: sha512-iTkYvoVcKt3WkeL7qUDyXHONZEwLio4wj8KTNi2dnjQEXBZKMV63BpQrPqfsM+OkvuRbiSTAcycYAsQzLhRNoQ==}
 
-  '@lezer/php@1.0.2':
-    resolution: {integrity: sha512-GN7BnqtGRpFyeoKSEqxvGvhJQiI4zkgmYnDk/JIyc7H7Ifc1tkPnUn/R2R8meH3h/aBf5rzjvU8ZQoyiNDtDrA==}
+  '@lezer/php@1.0.5':
+    resolution: {integrity: sha512-W7asp9DhM6q0W6DYNwIkLSKOvxlXRrif+UXBMxzsJUuqmhE7oVU+gS3THO4S/Puh7Xzgm858UNaFi6dxTP8dJA==}
 
-  '@lezer/python@1.1.17':
-    resolution: {integrity: sha512-Iz0doICPko9uv2chIfSsViNSugNa4PWhxs17jtFd0ZMt+OieDq3wxtFOdmj7wtst3FWDeJkB0CxWNot0BlYixw==}
+  '@lezer/python@1.1.19':
+    resolution: {integrity: sha512-MhQIURHRytsNzP/YXnqpYKW6la6voAH3kyplTOOiCdjyFY6cWWGFVmYVdHIPrElqSDf4iCDktQCockB9FxuhzQ==}
 
   '@lezer/rust@1.0.2':
     resolution: {integrity: sha512-Lz5sIPBdF2FUXcWeCu1//ojFAZqzTQNRga0aYv6dYXqJqPfMdCAI0NzajWUd4Xijj1IKJLtjoXRPMvTKWBcqKg==}
 
-  '@lezer/sass@1.0.7':
-    resolution: {integrity: sha512-8HLlOkuX/SMHOggI2DAsXUw38TuURe+3eQ5hiuk9QmYOUyC55B1dYEIMkav5A4IELVaW4e1T4P9WRiI5ka4mdw==}
+  '@lezer/sass@1.1.0':
+    resolution: {integrity: sha512-3mMGdCTUZ/84ArHOuXWQr37pnf7f+Nw9ycPUeKX+wu19b7pSMcZGLbaXwvD2APMBDOGxPmpK/O6S1v1EvLoqgQ==}
 
   '@lezer/xml@1.0.6':
     resolution: {integrity: sha512-CdDwirL0OEaStFue/66ZmFSeppuL6Dwjlk8qk153mSQwiSH/Dlri4GNymrNWnUmPl2Um7QfV1FO9KFUyX3Twww==}
 
-  '@lezer/yaml@1.0.3':
-    resolution: {integrity: sha512-GuBLekbw9jDBDhGur82nuwkxKQ+a3W5H0GfaAthDXcAu+XdpS43VlnxA9E9hllkpSP5ellRDKjLLj7Lu9Wr6xA==}
+  '@lezer/yaml@1.0.4':
+    resolution: {integrity: sha512-2lrrHqxalACEbxIbsjhqGpSW8kWpUKuY6RHgnSAFZa6qK62wvnPxA8hGOwOoDbwHcOFs5M4o27mjGu+P7TvBmw==}
+
+  '@lucide/vue@1.31.0':
+    resolution: {integrity: sha512-NtjEHhcAa7umPh40wrRmlESJqNGdnpc7LziBKFnW3fmlrW0g2xMCDpdWU7WeEHRSl3xOpxbqiFTLKxoK3CoVCg==}
+    peerDependencies:
+      vue: ^3.5.40
+
+  '@malept/cross-spawn-promise@2.0.0':
+    resolution: {integrity: sha512-1DpKU0Z5ThltBwjNySMC14g0CkbyhCaz9FkhxqNsZI6uAPJXFS8cMXlBKo26FJ8ZuW6S9GCMcR9IO5k2X5/9Fg==}
+    engines: {node: '>= 12.13.0'}
+
+  '@malept/flatpak-bundler@0.4.0':
+    resolution: {integrity: sha512-9QOtNffcOF/c1seMCDnjckb3R9WHcG34tky+FHpNKKCW0wc/scYLwMtO+ptyGUfMW0/b/n4qRiALlaFHc9Oj7Q==}
+    engines: {node: '>= 10.0.0'}
 
   '@manypkg/find-root@1.1.0':
     resolution: {integrity: sha512-mki5uBvhHzO8kYYix/WRy2WX8S3B5wdVSc9D6KcU5lQNglP2yt58/VfLuAK49glRXChosY8ap2oJ1qgma3GUVA==}
 
-  '@manypkg/find-root@2.2.3':
-    resolution: {integrity: sha512-jtEZKczWTueJYHjGpxU3KJQ08Gsrf4r6Q2GjmPp/RGk5leeYAA1eyDADSAF+KVCsQ6EwZd/FMcOFCoMhtqdCtQ==}
-    engines: {node: '>=14.18.0'}
+  '@manypkg/find-root@3.1.0':
+    resolution: {integrity: sha512-BcSqCyKhBVZ5YkSzOiheMCV41kqAFptW6xGqYSTjkVTl9XQpr+pqHhwgGCOHQtjDCv7Is6EFyA14Sm5GVbVABA==}
+    engines: {node: '>=20.0.0'}
 
   '@manypkg/get-packages@1.1.3':
     resolution: {integrity: sha512-fo+QhuU3qE/2TQMQmbVMqaQ6EWbMhi4ABWP+O4AM1NqPBuy0OrApV5LO6BrrgnhtAHS2NH6RrVk9OL181tTi8A==}
 
-  '@manypkg/get-packages@2.2.2':
-    resolution: {integrity: sha512-3+Zd8kLZmsyJFmWTBtY0MAuCErI7yKB2cjMBlujvSVKZ2R/BMXi0kjCXu2dtRlSq/ML86t1FkumT0yreQ3n8OQ==}
-    engines: {node: '>=14.18.0'}
+  '@manypkg/get-packages@3.1.0':
+    resolution: {integrity: sha512-0TbBVyvPrP7xGYBI/cP8UP+yl/z+HtbTttAD7FMAJgn/kXOTwh5/60TsqP9ZYY710forNfyV0N8P/IE/ujGZJg==}
+    engines: {node: '>=20.0.0'}
 
-  '@manypkg/tools@1.1.2':
-    resolution: {integrity: sha512-3lBouSuF7CqlseLB+FKES0K4FQ02JrbEoRtJhxnsyB1s5v4AP03gsoohN8jp7DcOImhaR9scYdztq3/sLfk/qQ==}
-    engines: {node: '>=14.18.0'}
+  '@manypkg/tools@2.1.2':
+    resolution: {integrity: sha512-6QEf6yqFbETdwGITKq57aYoPfX/3K8XFNwsAlx0C1M7o8cb79sv1M3w+tWuWvIcSbNqrLF7OD7YpZMVVz335hQ==}
+    engines: {node: '>=20.0.0'}
 
-  '@mapbox/node-pre-gyp@2.0.0-rc.0':
-    resolution: {integrity: sha512-nhSMNprz3WmeRvd8iUs5JqkKr0Ncx46JtPxM3AhXes84XpSJfmIwKeWXRpsr53S7kqPkQfPhzrMFUxSNb23qSA==}
+  '@mapbox/node-pre-gyp@2.0.3':
+    resolution: {integrity: sha512-uwPAhccfFJlsfCxMYTwOdVfOz3xqyj8xYL3zJj8f0pb30tLohnnFPhLuqp4/qoEz8sNxe4SESZedcBojRefIzg==}
     engines: {node: '>=18'}
     hasBin: true
 
-  '@marijn/find-cluster-break@1.0.2':
-    resolution: {integrity: sha512-l0h88YhZFyKdXIFNfSWpyjStDjGHwZ/U7iobcK1cQQD8sejsONdQtTVU+1wVN1PBw40PiiHB1vA5S7VTfQiP9g==}
+  '@marijn/find-cluster-break@1.0.3':
+    resolution: {integrity: sha512-FY+MKLBoTsLNJF/eLWaOsXGdz6uh3Iu1axjPf6TUq92IYumcTcXWHoS747JARLkcdlJ/Waiaxc5wQfFO8jC6NA==}
 
-  '@microsoft/api-extractor-model@7.29.6':
-    resolution: {integrity: sha512-gC0KGtrZvxzf/Rt9oMYD2dHvtN/1KPEYsrQPyMKhLHnlVuO/f4AFN3E4toqZzD2pt4LhkKoYmL2H9tX3yCOyRw==}
+  '@napi-rs/lzma-linux-x64-gnu@1.5.1':
+    resolution: {integrity: sha512-oTXEIha4SsuXdTA4Iyskj0kpdx2yVXdhd75c2v3xGrHFfVMsbhTPZU/nMPL4sWKo4pBHm3aucLaqGlF696dTyQ==}
+    engines: {node: ^22.20 || ^24.12 || >=25}
+    cpu: [x64]
+    os: [linux]
+    libc: [glibc]
 
-  '@microsoft/api-extractor@7.47.7':
-    resolution: {integrity: sha512-fNiD3G55ZJGhPOBPMKD/enozj8yxJSYyVJWxRWdcUtw842rvthDHJgUWq9gXQTensFlMHv2wGuCjjivPv53j0A==}
-    hasBin: true
+  '@napi-rs/wasm-runtime@1.2.2':
+    resolution: {integrity: sha512-JfB4kuJQjaoHuCTseIINHtHWeJnvgEcxjwA5t/Y00ZgaOO1Crz3fjT/p8kT28zA/Caz7oiUMn3d6H2yOVCVwuw==}
+    engines: {node: ^20.19.0 || ^22.13.0 || >=23.5.0}
+    peerDependencies:
+      '@emnapi/core': ^1.7.1 || ^2.0.0-alpha.3
+      '@emnapi/runtime': ^1.7.1 || ^2.0.0-alpha.3
 
-  '@microsoft/tsdoc-config@0.17.1':
-    resolution: {integrity: sha512-UtjIFe0C6oYgTnad4q1QP4qXwLhe6tIpNTRStJ2RZEPIkqQPREAwE5spzVxsdn9UaEMUqhh0AqSx3X4nWAKXWw==}
+  '@noble/hashes@1.4.0':
+    resolution: {integrity: sha512-V1JJ1WTRUqHHrOSh597hURcMqVKVGL/ea3kv0gSnEdsEZ0/+VyPghM1lMNGc00z7CIQorSvbKpuJkxvuHbvdbg==}
+    engines: {node: '>= 16'}
 
-  '@microsoft/tsdoc@0.15.1':
-    resolution: {integrity: sha512-4aErSrCR/On/e5G2hDP0wjooqDdauzEbIq8hIkIe5pXV0rtWJZvdCEKL0ykZxex+IxIwBp0eGeV48hQN07dXtw==}
-
-  '@netlify/functions@2.8.2':
-    resolution: {integrity: sha512-DeoAQh8LuNPvBE4qsKlezjKj0PyXDryOFJfJKo3Z1qZLKzQ21sT314KQKPVjfvw6knqijj+IO+0kHXy/TJiqNA==}
-    engines: {node: '>=14.0.0'}
-
-  '@netlify/node-cookies@0.1.0':
-    resolution: {integrity: sha512-OAs1xG+FfLX0LoRASpqzVntVV/RpYkgpI0VrUnw2u0Q1qiZUzcPffxRK8HF3gc4GjuhG5ahOEMJ9bswBiZPq0g==}
-    engines: {node: ^14.16.0 || >=16.0.0}
-
-  '@netlify/serverless-functions-api@1.26.1':
-    resolution: {integrity: sha512-q3L9i3HoNfz0SGpTIS4zTcKBbRkxzCRpd169eyiTuk3IwcPC3/85mzLHranlKo2b+HYT0gu37YxGB45aD8A3Tw==}
-    engines: {node: '>=18.0.0'}
+  '@noble/hashes@2.3.0':
+    resolution: {integrity: sha512-oN+QwyX7VSHotibwubG3kpzbwKrfnyR6OOO+3Nk/53ADL7FmgHHz4TgrbaYKvvOw09u6QTx0oiH1cNCIOuN0CQ==}
+    engines: {node: '>= 20.19.0'}
 
   '@nodelib/fs.scandir@2.1.5':
     resolution: {integrity: sha512-vq24Bq3ym5HEQm2NKCr3yXDwjc7vTsEThRDnkp2DK9p1uqLR+DHurm/NOTo0KG7HYHU7eppKZj3MyqYuMBf62g==}
@@ -3479,168 +3951,784 @@ packages:
     resolution: {integrity: sha512-oGB+UxlgWcgQkgwo8GcEGwemoTFt3FIO9ababBmaGwXIoBKZ+GTy0pP185beGg7Llih/NSHSV2XAs1lnznocSg==}
     engines: {node: '>= 8'}
 
-  '@npmcli/fs@1.1.1':
-    resolution: {integrity: sha512-8KG5RD0GVP4ydEzRn/I4BNDuxDtqVbOdm8675T49OIG/NGhaK0pjPX7ZcDlvKYbA+ulvVK3ztfcF4uBdOxuJbQ==}
-
-  '@npmcli/move-file@1.1.2':
-    resolution: {integrity: sha512-1SUf/Cg2GzGDyaf15aR9St9TWlb+XvbZXWpDx8YKs7MLzMH/BCeopv+y9vzrzgkfykCGuWOlSu3mZhj2+FQcrg==}
-    engines: {node: '>=10'}
-    deprecated: This functionality has been moved to @npmcli/fs
-
-  '@nuxt/kit@3.14.1592':
-    resolution: {integrity: sha512-r9r8bISBBisvfcNgNL3dSIQHSBe0v5YkX5zwNblIC2T0CIEgxEVoM5rq9O5wqgb5OEydsHTtT2hL57vdv6VT2w==}
-    engines: {node: ^14.18.0 || >=16.10.0}
-
-  '@nuxt/schema@3.14.1592':
-    resolution: {integrity: sha512-A1d/08ueX8stTXNkvGqnr1eEXZgvKn+vj6s7jXhZNWApUSqMgItU4VK28vrrdpKbjIPwq2SwhnGOHUYvN9HwCQ==}
-    engines: {node: ^14.18.0 || >=16.10.0}
+  '@nuxt/kit@3.21.11':
+    resolution: {integrity: sha512-0Xi3tgwN77w43Q8GCPIrvWmF1J7Peehkts44E0uKNIml9lB8WoUn8YxyUjxBv47XtVR86NWoWALAT+/IEMHJEA==}
+    engines: {node: '>=18.12.0'}
 
   '@one-ini/wasm@0.1.1':
     resolution: {integrity: sha512-XuySG1E38YScSJoMlqovLru4KTUNSjgVTIjyh7qMX6aNN5HY5Ct5LhRJdxO79JtTzKfzV/bnWpz+zquYrISsvw==}
 
-  '@parcel/watcher-android-arm64@2.5.0':
-    resolution: {integrity: sha512-qlX4eS28bUcQCdribHkg/herLe+0A9RyYC+mm2PXpncit8z5b3nSqGVzMNR3CmtAOgRutiZ02eIJJgP/b1iEFQ==}
+  '@ota-meshi/ast-token-store@0.3.0':
+    resolution: {integrity: sha512-XRO0zi2NIUKq2lUk3T1ecFSld1fMWRKE6naRFGkgkdeosx7IslyUKNv5Dcb5PJTja9tHJoFu0v/7yEpAkrkrTg==}
+    engines: {node: ^20.19.0 || ^22.13.0 || >=24}
+
+  '@oxc-parser/binding-android-arm-eabi@0.142.0':
+    resolution: {integrity: sha512-ZiRGDutGsv1G6bL/ozy/koC0Sv39T1DqyoC4KD1DOy9ZoACm1O5UWhEK2c02Qdk+4lfLVkvFa/mQ0fm/4h1BtQ==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [arm]
+    os: [android]
+
+  '@oxc-parser/binding-android-arm64@0.142.0':
+    resolution: {integrity: sha512-WZkvGRLNQTz8lR9zP5nLjUdlroRCopBu3g9zF1p/laE6DzT1UbQo8Rdz5MWhaJUPYg/6gp+jo7HUgsyKaN1FtQ==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [arm64]
+    os: [android]
+
+  '@oxc-parser/binding-darwin-arm64@0.142.0':
+    resolution: {integrity: sha512-l4khS8LQOOVYsGRVARo1gSaCT/aBSceUVXgtovWc2+drnxVuDr082WA3OCHVdVzIz5JIrP/y9CWsSKxBDNmYGg==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [arm64]
+    os: [darwin]
+
+  '@oxc-parser/binding-darwin-x64@0.142.0':
+    resolution: {integrity: sha512-QBsNF3nqlXmcH2B1YOPqQYmCJoy4HuIjUxGbBO/k5JAJUl68ghU2psRY2zPk+RyBaWqKP/qfL4oaFgEMCdwskA==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [x64]
+    os: [darwin]
+
+  '@oxc-parser/binding-freebsd-x64@0.142.0':
+    resolution: {integrity: sha512-b7Q7m4Cqc6XqNhri3R+QhU+GVy646Pn+bkdhrDdWym/Fdi0ZUa+d73H9dm5H91JtbtAQ/z1d8XKMW3oOV8a4tQ==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [x64]
+    os: [freebsd]
+
+  '@oxc-parser/binding-linux-arm-gnueabihf@0.142.0':
+    resolution: {integrity: sha512-3riVS5IhdH3uCZj1Y9ftDQlR0dvLsIlw/edrRqk8JhgNd5K0XSs+UBtgh50N13CAlW9/TXj6sVGXaKNBocd0Yg==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [arm]
+    os: [linux]
+
+  '@oxc-parser/binding-linux-arm-musleabihf@0.142.0':
+    resolution: {integrity: sha512-NmXUOpgpTSkhl795TiXmWppTwmSJ92RC1qvD6e4XOF+slgmo3e6Ah+kEu+6AN8s7NAOEwqGmir58MgSQSWmBSA==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [arm]
+    os: [linux]
+
+  '@oxc-parser/binding-linux-arm64-gnu@0.142.0':
+    resolution: {integrity: sha512-gc0EXsKtXgerujmU2Bql3u1L1HsSQ2774R83idq/FoNMPVV/RY/1ErFsvnit7KoiP/sLvzQixeUo4Ut0ic0wmw==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [arm64]
+    os: [linux]
+    libc: [glibc]
+
+  '@oxc-parser/binding-linux-arm64-musl@0.142.0':
+    resolution: {integrity: sha512-F2XvmWSE0uWpie+jHKKIFgdVOe9ypGhkEZxKx5DuW215K6cbAC274yYaPkcM7EqY4Df3Weyhpcz3lsURyH2LVg==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [arm64]
+    os: [linux]
+    libc: [musl]
+
+  '@oxc-parser/binding-linux-ppc64-gnu@0.142.0':
+    resolution: {integrity: sha512-wLMbT21U/QxknQsk+VvNF0b9D2/aGWhcaQQQ+VYlE8FwD5+GoWZIPPXNzyHmkYyhm0KB3itL+TBavjMatqNnYA==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [ppc64]
+    os: [linux]
+    libc: [glibc]
+
+  '@oxc-parser/binding-linux-riscv64-gnu@0.142.0':
+    resolution: {integrity: sha512-+G8F/4ckwT7FCJV4H2bt09xEzJbjNCfuL4Sp1AYNaFtFMVtgIGMuJlteT82U+K0UIZ/DzAR/LDlMFnEuajG7Kw==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [riscv64]
+    os: [linux]
+    libc: [glibc]
+
+  '@oxc-parser/binding-linux-riscv64-musl@0.142.0':
+    resolution: {integrity: sha512-hTsHtTLxMAfCo+rpF5K3qZJKW2NpPN/CHd4mYB3y7XlSdspHkd2gehDIofP64AacA9nWQw2tY3O7wR6UY8IVOA==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [riscv64]
+    os: [linux]
+    libc: [musl]
+
+  '@oxc-parser/binding-linux-s390x-gnu@0.142.0':
+    resolution: {integrity: sha512-6y7qYY3TCUDYjqswImdTGl92y+KA/80twALegQPN27kfY+bG7Ib1+L3jbmrCZQx6wrVnai9IPsEZp07I0hx7JQ==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [s390x]
+    os: [linux]
+    libc: [glibc]
+
+  '@oxc-parser/binding-linux-x64-gnu@0.142.0':
+    resolution: {integrity: sha512-i69kAWU+2LgoH5bR+zWiiu+UzAw7Oxkwv7COeJTeY19pn4e70nKQcr9Pm6cL2Z0Z54d+gl9qADlK/0yyuCPiBA==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [x64]
+    os: [linux]
+    libc: [glibc]
+
+  '@oxc-parser/binding-linux-x64-musl@0.142.0':
+    resolution: {integrity: sha512-4SQs678MmjYVrmhAgCWD4o0vpaFszXw9xLX5p2Z9MMFcltxiLkA88wQjh80YHjPrXtpyZ2CWI5m+1yNKM0m2Pw==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [x64]
+    os: [linux]
+    libc: [musl]
+
+  '@oxc-parser/binding-openharmony-arm64@0.142.0':
+    resolution: {integrity: sha512-YHpx9N7Ln3a++Tc8rv+H7mrK1zyJQOAwCFg8LZ3lTs1T5afGWeZrLPhPT9HLnIwSjCyJqPWVMIrMxbjcmBr2oQ==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [arm64]
+    os: [openharmony]
+
+  '@oxc-parser/binding-wasm32-wasi@0.142.0':
+    resolution: {integrity: sha512-3pLDyY3+oogW73RM5uehNgAiR/Xfb7fvO2Q1Z1gIqZ2+50XDVQmBVlRkHXZTU4gKnQHpwETNsYQVsJ3joVB2iA==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [wasm32]
+
+  '@oxc-parser/binding-win32-arm64-msvc@0.142.0':
+    resolution: {integrity: sha512-Had/VeVY28Oyb0K+Q4FV8KCzoBycIh93oDK6pCbya9lkzdq+ikMHMgBubsdqqlybjJmQRawCQRrnBRHyQwYvcQ==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [arm64]
+    os: [win32]
+
+  '@oxc-parser/binding-win32-ia32-msvc@0.142.0':
+    resolution: {integrity: sha512-GGi3+YphVHavvgs6gum2UXoNCqzHAmPt/nXkn8ZQZstV2Q1qZD1Mn8fz/nWrDkefHQtrG/+1/XrbMxsBTo6Svw==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [ia32]
+    os: [win32]
+
+  '@oxc-parser/binding-win32-x64-msvc@0.142.0':
+    resolution: {integrity: sha512-Ny/Wv4Us1LGC/ljwNTp+Hx3r/pH15EFfeDF0p+n898gt+TtRd6C9SccHcuUhDiNTb8s5tt7jdeAMDRQZ4Vq6hg==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [x64]
+    os: [win32]
+
+  '@oxc-project/types@0.142.0':
+    resolution: {integrity: sha512-7W+2q5AKQVU36fkaryontrHn3YDt1RyUYXatw9i5H8ocYe2sPKSFB6eS8WNPeRKiN1qAWWZUPm7gwFzJGrccqQ==}
+
+  '@oxc-project/types@0.143.0':
+    resolution: {integrity: sha512-u6JZdLBTLotrNC9Vd6vPssINdzcCzleKAH6EJKImQb7GtYvX5keN2dxkoK44stCc4tffE6QQRtZTXVSzsLUlWA==}
+
+  '@oxc-resolver/binding-android-arm-eabi@11.24.2':
+    resolution: {integrity: sha512-y09e0L0SRI2OA2tUIrjBgoV3eH5hvUKXNkJqXmNo5V2WxIjyC7I7aJfRLMEVpA8yi95f90gFDvO0VMgrDw+vwA==}
+    cpu: [arm]
+    os: [android]
+
+  '@oxc-resolver/binding-android-arm64@11.24.2':
+    resolution: {integrity: sha512-cl4icWaZFnLdg8m6qtnh5rBMuGbxc/ptStFHLeCNwr+2cZjkjNwQu/jYRS0CHlnPecOJMpuS5M6/BH+0J/YkEg==}
+    cpu: [arm64]
+    os: [android]
+
+  '@oxc-resolver/binding-darwin-arm64@11.24.2':
+    resolution: {integrity: sha512-At29QEMF6HajbQvgY8K6OXnHD1x9rad74xBEfmCB6ZqCGsdq75aK7tOYcTbOanMy8qdIBrfL3SMr3p/lfSlb9w==}
+    cpu: [arm64]
+    os: [darwin]
+
+  '@oxc-resolver/binding-darwin-x64@11.24.2':
+    resolution: {integrity: sha512-A5Kqr1EUj4oIL5CF4WRssq/o5P0Y11cwoFouMRmQ7YnC/A8V93nv1nb7aSU8HwcgmXropjLNkVTl4MN87cu28Q==}
+    cpu: [x64]
+    os: [darwin]
+
+  '@oxc-resolver/binding-freebsd-x64@11.24.2':
+    resolution: {integrity: sha512-R5xkRBRRz7ceH/P5Jrc6G7FmdUdgpLYyESFAUDVTNQ9K0sGPxcp4ljiwEwEqsvNcQ4sYbMRrWcHHBCu7ksAJVw==}
+    cpu: [x64]
+    os: [freebsd]
+
+  '@oxc-resolver/binding-linux-arm-gnueabihf@11.24.2':
+    resolution: {integrity: sha512-k/RuYL4L/R58IBn3wT5ma3Wh4k62bp1eYCFRWCmMsasUOqL+H6sW0VGFadEzKWXFFlz+2uIMoeMk9ySSZJHgbg==}
+    cpu: [arm]
+    os: [linux]
+
+  '@oxc-resolver/binding-linux-arm-musleabihf@11.24.2':
+    resolution: {integrity: sha512-bnHAak3ujYfH5pKk4NieFNbvYvernfoQDgwLddbZ3OtMYrem87/qjlA+u+aKG0oZcqSLGCful/6/CEA+aeAgaA==}
+    cpu: [arm]
+    os: [linux]
+
+  '@oxc-resolver/binding-linux-arm64-gnu@11.24.2':
+    resolution: {integrity: sha512-vDT3KHgzYp47gmtNOqL2VNhCyl5Zv643eyxm//A68J8DeUGXrvD1pZFiaT4jSfe+RInfnn1R2yVHye4enx6RnA==}
+    cpu: [arm64]
+    os: [linux]
+    libc: [glibc]
+
+  '@oxc-resolver/binding-linux-arm64-musl@11.24.2':
+    resolution: {integrity: sha512-+kMlQvbzfyEYtu5FcjE4p+ttBLpKW4d/AsAsuE69BxV6V4twZJeIQZFfD8gh/wqglY0MkPSezWXQH0jBV13MUw==}
+    cpu: [arm64]
+    os: [linux]
+    libc: [musl]
+
+  '@oxc-resolver/binding-linux-ppc64-gnu@11.24.2':
+    resolution: {integrity: sha512-shjfMhmZ3gq9fv/w7bi3PnZlgOPG+2QAOFf0BJF0EgBSIGZ6PMLN2zbGEblTUYB/NKVDRyYhE2ff3dJ1QqNPkA==}
+    cpu: [ppc64]
+    os: [linux]
+    libc: [glibc]
+
+  '@oxc-resolver/binding-linux-riscv64-gnu@11.24.2':
+    resolution: {integrity: sha512-zGelwFR5oRo+b69k8Lrzun86DyUHzfKN6cnjbR9l7Z7NIRznOE/2ZvPa1IUKqAL2PzAXOdwkfVqNvO1H2RlpAw==}
+    cpu: [riscv64]
+    os: [linux]
+    libc: [glibc]
+
+  '@oxc-resolver/binding-linux-riscv64-musl@11.24.2':
+    resolution: {integrity: sha512-qxZ1SWCXJY0eyhAlP6Lmo9F2Nrtx7EkYj9oCgL8apDPCwXwCEDA2U697bbT81JIc2IrVjxO4KX6WU2N+oN9Z4w==}
+    cpu: [riscv64]
+    os: [linux]
+    libc: [musl]
+
+  '@oxc-resolver/binding-linux-s390x-gnu@11.24.2':
+    resolution: {integrity: sha512-sGCecF3cx2DFlH4t/z7ApnOnXqN48p5p5mlHDEnHTAukQa2P+qMVE4CwyWE9W+q/m3QJ7kKfGrIjax31f44oFQ==}
+    cpu: [s390x]
+    os: [linux]
+    libc: [glibc]
+
+  '@oxc-resolver/binding-linux-x64-gnu@11.24.2':
+    resolution: {integrity: sha512-k/VlMMcSzMlahb3/fENM4rTlsJ0s3fFROA0KXPBmKggqmTSaE383sl8F3KCOXPLmVsYfW6hCitMhXCEtNeZxxg==}
+    cpu: [x64]
+    os: [linux]
+    libc: [glibc]
+
+  '@oxc-resolver/binding-linux-x64-musl@11.24.2':
+    resolution: {integrity: sha512-8hbnZyNi97b/8wapYaIF9+t9GmZKBW2vunaOc3h9HGJptH7b7XpvZqOTBSm/MpTjr7H497BlgOaSfLUdhmy2bw==}
+    cpu: [x64]
+    os: [linux]
+    libc: [musl]
+
+  '@oxc-resolver/binding-openharmony-arm64@11.24.2':
+    resolution: {integrity: sha512-MvyGik3a6pVgZ0t/kWlbmFxFLmXQJwgLsY2eYFHLpy0wGwRbfzeIGgDwQ3kXqE30z+kSXennRkCrT7TUvkptNg==}
+    cpu: [arm64]
+    os: [openharmony]
+
+  '@oxc-resolver/binding-wasm32-wasi@11.24.2':
+    resolution: {integrity: sha512-vHcssMPwO08RTvj/c0iOBz90attxyG3wQJ0dTcyEQK43LRpcdLWZlV5feBhv6Isn6ahbQIzHbCgfa81+RiML0Q==}
+    engines: {node: '>=14.0.0'}
+    cpu: [wasm32]
+
+  '@oxc-resolver/binding-win32-arm64-msvc@11.24.2':
+    resolution: {integrity: sha512-uokJqro2iBqkFvJdKQLP7d8/BUmFwESQFVmIJUQKj1Xn1a/LysJoe1vmeECLF5b3jsV8CAL5sEMJXX6SdK9Nhg==}
+    cpu: [arm64]
+    os: [win32]
+
+  '@oxc-resolver/binding-win32-x64-msvc@11.24.2':
+    resolution: {integrity: sha512-UqGPmo56KDfLlfXFAFIrNflHT8tFxWGEivWg3Zeyp4Uy2NlKN1FGPr6/BxcLGG3+kZ6Wp14g5Uj+n71boqZfiw==}
+    cpu: [x64]
+    os: [win32]
+
+  '@oxfmt/binding-android-arm-eabi@0.60.0':
+    resolution: {integrity: sha512-1q4q4Jc8FlOMVojEisyFAVyl8h1yawNv6phjgmhGVEDeyeOdsSnSr9x0+D4mOnEKvpO5L4mxKZ/DP9X6U3A/Mw==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [arm]
+    os: [android]
+
+  '@oxfmt/binding-android-arm64@0.60.0':
+    resolution: {integrity: sha512-tD41I6nCt9k8SQXft0CSjjU9jg6SwG7uMu7PxodSEHXl+GDW0868oy6tTtoJkyUze8YKFgTpz/k5LuPUnFiGLw==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [arm64]
+    os: [android]
+
+  '@oxfmt/binding-darwin-arm64@0.60.0':
+    resolution: {integrity: sha512-TTpzPug96Zxdyb46KvTyIUQDdsqbumXh2TKG9C23PCT0kF7JkW56Z/quPuG9rqOFKQIi1gpRNZ7DX18LwxXPnw==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [arm64]
+    os: [darwin]
+
+  '@oxfmt/binding-darwin-x64@0.60.0':
+    resolution: {integrity: sha512-CnOoWgQ7L+JL/YQaRJ+NyATciSfcftncm7y3kqyte1cGtFEGnStaCd1TAyrinkfQ7nRBfHrTs1/vTwUJr3WF2Q==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [x64]
+    os: [darwin]
+
+  '@oxfmt/binding-freebsd-x64@0.60.0':
+    resolution: {integrity: sha512-ychJo7S3hZxdO6eDZ9zM6F2lM9fpJS3EKS5CAUSWyprdLYxTu4gbaUKV/VBPTcMJwQa2Bpo+643y3OJ537pihA==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [x64]
+    os: [freebsd]
+
+  '@oxfmt/binding-linux-arm-gnueabihf@0.60.0':
+    resolution: {integrity: sha512-36IH5o55T2Fx7E0feDttt+mifxN6yk9pWv4KfhAIsP0dFnUq27331OwbpOsZdoXF9soOLWm7mQUz5+UUmyec4g==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [arm]
+    os: [linux]
+
+  '@oxfmt/binding-linux-arm-musleabihf@0.60.0':
+    resolution: {integrity: sha512-G1Ve7lAa6sFBolVI2LWHfEAqy0YKh4vnioH8uYO9kAEdgM7mR40IksIx9/Zk4+vbYew/sGa4J9Q4tZ3n9gXDHA==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [arm]
+    os: [linux]
+
+  '@oxfmt/binding-linux-arm64-gnu@0.60.0':
+    resolution: {integrity: sha512-LTQdRBf6uzj/h7Xk6lKzbGD2hrF/fK4YI9LIN1c0509tPUn8wRa3mCmrFQpEWJPLYGFrLFFMTYW1Ljj6VqW2Hw==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [arm64]
+    os: [linux]
+    libc: [glibc]
+
+  '@oxfmt/binding-linux-arm64-musl@0.60.0':
+    resolution: {integrity: sha512-2JMo3XPxMPx3hiqddSZYyaH+fKJm6cz0u8n1naYjP/CdOQOZW34i8lKBUfmbWiuFvd6KoYXLmhAyBuvojsYS7Q==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [arm64]
+    os: [linux]
+    libc: [musl]
+
+  '@oxfmt/binding-linux-ppc64-gnu@0.60.0':
+    resolution: {integrity: sha512-L3C+nBD13lr306tr/PjM3RMll+BVqgFrIgUyoeHuai5oueJrRLgO3j+GO5/Cbhtkf5PSlHYTI1JY7iqBd1qa6A==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [ppc64]
+    os: [linux]
+    libc: [glibc]
+
+  '@oxfmt/binding-linux-riscv64-gnu@0.60.0':
+    resolution: {integrity: sha512-M4MsmvqlxFiPtSRGyBYQSZxchEf463AOyd+Dh4/9xDpjWBsRtDUTDMFN5EdHinjVK1/eDJQ8MLpcYjpYayaCnA==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [riscv64]
+    os: [linux]
+    libc: [glibc]
+
+  '@oxfmt/binding-linux-riscv64-musl@0.60.0':
+    resolution: {integrity: sha512-OH+9UskYuxRB+GxqdGkVN8f5UpwhqG8YscNo1wl8+KJ62cd7wZdGga6iGLJIf8kibF1WBwvlfDUx3cez/VXwFg==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [riscv64]
+    os: [linux]
+    libc: [musl]
+
+  '@oxfmt/binding-linux-s390x-gnu@0.60.0':
+    resolution: {integrity: sha512-y7AAFutt9wFWBFOAn6+BHaV39usZmcr3YYH2385f+NHgPNpIF9HpqKp0jgUxPaUOCyG3oaX5VhJduL1Nw164rw==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [s390x]
+    os: [linux]
+    libc: [glibc]
+
+  '@oxfmt/binding-linux-x64-gnu@0.60.0':
+    resolution: {integrity: sha512-yKZ9+CXAI+1RO5nH/4Z/9M6DAsfOzd5bw/gtWk81KB4mpalMaRRSXfouc5/tHxazDmBek55HNPepNYBgaCew0Q==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [x64]
+    os: [linux]
+    libc: [glibc]
+
+  '@oxfmt/binding-linux-x64-musl@0.60.0':
+    resolution: {integrity: sha512-bCUGaF6hJOYnQzLJdHLZbvGsOd5oSvGAyJhPAKum2uyLYUuXmP8vqg690DWi2hqcnIoYpqSqCrjzE5aiUAgwQg==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [x64]
+    os: [linux]
+    libc: [musl]
+
+  '@oxfmt/binding-openharmony-arm64@0.60.0':
+    resolution: {integrity: sha512-GrUeZOvzP30ExxfCuQiyofuUGI+OmvAgFwOO5w5p9mGPlxcyuqI+6Sy9fAKFFfLQrqKYWFgc5sYA2Unj/29nPg==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [arm64]
+    os: [openharmony]
+
+  '@oxfmt/binding-win32-arm64-msvc@0.60.0':
+    resolution: {integrity: sha512-WD4Q954kUl2TDJV/6q7UnE2rlKk047kXLJsr4bJ2mXRaAqNXcmV3nwKUsGCc3mz/jYDBnXtJEaBErJEybK8iQQ==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [arm64]
+    os: [win32]
+
+  '@oxfmt/binding-win32-ia32-msvc@0.60.0':
+    resolution: {integrity: sha512-HqDekjr8JXzVDUP1YthDZ1Y3CBEcuZT4WX3B+1kaxj8CvZA8Y2YhcEsXqoSop3tVsgjACxjnFQFDkBo0r/jq1Q==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [ia32]
+    os: [win32]
+
+  '@oxfmt/binding-win32-x64-msvc@0.60.0':
+    resolution: {integrity: sha512-tz78yhmGPKboTMHCHSaUqXK8JrmoSejgDcWeqAtg2s07ZGKQ3rH5Jn8NuXPGNG33CDbY2e9NoQWXIVEmKO21Rw==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [x64]
+    os: [win32]
+
+  '@oxlint-tsgolint/darwin-arm64@0.25.0':
+    resolution: {integrity: sha512-87opKlwFP8qS9WHAeETV+kA0fC9Oyj4sg7OxWdI4xQY0WC7zlN6BgG66uE5mvtN5mahkt/gL0i/AVEnX6POq2Q==}
+    cpu: [arm64]
+    os: [darwin]
+
+  '@oxlint-tsgolint/darwin-x64@0.25.0':
+    resolution: {integrity: sha512-HJmuZexsrhqp4WmETn+Soq7Ogt5F0jirv+cYRSniIPe+d/x5beQzLX69xOLhQRE+8FLGETe7FahWMVP8x0dW4g==}
+    cpu: [x64]
+    os: [darwin]
+
+  '@oxlint-tsgolint/linux-arm64@0.25.0':
+    resolution: {integrity: sha512-aNyYsPREvCJi3qjfBA0sQB7DhT3y/W5Ac2JI2D8IJynoTOAhVZj401Si6901oDajlBWyqJqqojudn0VgHB6+7A==}
+    cpu: [arm64]
+    os: [linux]
+
+  '@oxlint-tsgolint/linux-x64@0.25.0':
+    resolution: {integrity: sha512-+60+VjK9Mch3uA5WlTdNHuAm5+WA7wPPjuWdPWlU0F6JJpYpGZXUpO1RPKuFEWsBpNbLcLeJ0LbCJ1doWu58NA==}
+    cpu: [x64]
+    os: [linux]
+
+  '@oxlint-tsgolint/win32-arm64@0.25.0':
+    resolution: {integrity: sha512-r53TO+eHp/t53nnUkQJfrYYXODPAxmtf3RUFQG5XsE2hD21IunliOaAdZXP2UwzCx+r/fbNaEelqTaAHcDr57w==}
+    cpu: [arm64]
+    os: [win32]
+
+  '@oxlint-tsgolint/win32-x64@0.25.0':
+    resolution: {integrity: sha512-vqe66B+gL9HarhyHemdlfC2VWT7eoA+o/ufZ7zT6AGHv64boyDZIJS3U+rpZo+ey4O7wZtiS/vYR2fWqDoFeBw==}
+    cpu: [x64]
+    os: [win32]
+
+  '@oxlint/binding-android-arm-eabi@1.77.0':
+    resolution: {integrity: sha512-E06sKWS6PiI6HRxS1wyQg22HvApt01hI7fV+T3wUk3OSbaaP4a3hYGY/MIQDmASqCiRjBdpRQYkgMkqH82cWmQ==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [arm]
+    os: [android]
+
+  '@oxlint/binding-android-arm64@1.77.0':
+    resolution: {integrity: sha512-NvsKz0KZxTp9cYWPLf+FXaSZwB3oO3peAjtukpOMBgse2vhQSoIIVqeO1yR0lEo/UcdZIDL18uq+kL0LzQ0ytA==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [arm64]
+    os: [android]
+
+  '@oxlint/binding-darwin-arm64@1.77.0':
+    resolution: {integrity: sha512-bgjTn6nW4bQCFBvSvuHCpDD+sONvmpo4lGI4PxzMt1quBA+xYxhczk6RiCn3GZ9gY8uhaBbwhj9MdKGfu6T9DA==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [arm64]
+    os: [darwin]
+
+  '@oxlint/binding-darwin-x64@1.77.0':
+    resolution: {integrity: sha512-aotaIttH1R6j1Rwhx0M0htgeZyGtVQqYNTVEYMN/UcgHPquGA6kmk9OyuDc3a2GKUQBC+3C3GVQCcrRPMYqAFA==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [x64]
+    os: [darwin]
+
+  '@oxlint/binding-freebsd-x64@1.77.0':
+    resolution: {integrity: sha512-nNx/wta7ksRAdYvq+l4AWjXkLxEXHALhENxjj2cYbQAIR4ybaA5L+hCbE63HOmft5czQ6ks+hb8vmEAnn7YGPg==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [x64]
+    os: [freebsd]
+
+  '@oxlint/binding-linux-arm-gnueabihf@1.77.0':
+    resolution: {integrity: sha512-tMLLjM7xXtzXisVCzkOTXNCy9bZVId2wteNwjohlFDR/jY6WagpEDA1c1wu4xRc20Hojaxj+V6DSR7gbKxijWA==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [arm]
+    os: [linux]
+
+  '@oxlint/binding-linux-arm-musleabihf@1.77.0':
+    resolution: {integrity: sha512-MiAFDFaqR0tmHTAyo0YDcZ5hyLREdYw/RQhc2R3cbT+8O3tB+zqPM2th9TTQ+Uo3jn/embS+DO+HyX9ztCPkOQ==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [arm]
+    os: [linux]
+
+  '@oxlint/binding-linux-arm64-gnu@1.77.0':
+    resolution: {integrity: sha512-/xqQ3B16i1T4cyt/9Mn+4CpzhUXoBXp7kVpIwzOXNFLj5JmK1bIjsbSnX296Gg8A/o7oDtKWikFgBx0SLwztkw==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [arm64]
+    os: [linux]
+    libc: [glibc]
+
+  '@oxlint/binding-linux-arm64-musl@1.77.0':
+    resolution: {integrity: sha512-LSbwuRKiNCenPDcbARqAZ5RfBy7gmj7vOvfJRLeCDU3gFtSxWbhv/+VTlaUqzUhNj1gFLHB8h7ALnxa/Az6z6g==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [arm64]
+    os: [linux]
+    libc: [musl]
+
+  '@oxlint/binding-linux-ppc64-gnu@1.77.0':
+    resolution: {integrity: sha512-QWdcH31mXEUe5Nq1s0CfCpceaKjIo9uZtwDjAuL681g1axf+5x8xrg/eXWaw//4NCxYZ4V4e5Hu5tvdR+pTBlg==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [ppc64]
+    os: [linux]
+    libc: [glibc]
+
+  '@oxlint/binding-linux-riscv64-gnu@1.77.0':
+    resolution: {integrity: sha512-GnOfYgJxbcElOiPZaDFDl406ONddwvOWk2jvAAAEjwAl4GofNoHF+/HHUIBYa6bFCArlcGPi0XjC4cU1pkgF/Q==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [riscv64]
+    os: [linux]
+    libc: [glibc]
+
+  '@oxlint/binding-linux-riscv64-musl@1.77.0':
+    resolution: {integrity: sha512-AyEMTUCf0xY+hHF+IxqXFQIX0yQOIR8ykpY0lJNOw9xYqOzUX8dyZfRvlG0RfXwuQn2eonf/8NrMmDSZJjdqsA==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [riscv64]
+    os: [linux]
+    libc: [musl]
+
+  '@oxlint/binding-linux-s390x-gnu@1.77.0':
+    resolution: {integrity: sha512-sPLzEcNvxd/oyVQ5oZo92CiHkFkpBeRop13E/P3TPY+hZfXHKCOWKI70TE2RYwMKFJDc20EMjH16L7NZICtKTw==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [s390x]
+    os: [linux]
+    libc: [glibc]
+
+  '@oxlint/binding-linux-x64-gnu@1.77.0':
+    resolution: {integrity: sha512-1Oh2ssH2L7lwyvkdSqaMUfsGfwU2Wfvew+obBUYjRVqhpBcUpwnsPSEr1IzVi9XqkuY10geiLsNKecqaZC34Dw==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [x64]
+    os: [linux]
+    libc: [glibc]
+
+  '@oxlint/binding-linux-x64-musl@1.77.0':
+    resolution: {integrity: sha512-0j/2wRgNGO+Qj/M1uu/p57h/hFTTWWcfie0ufkbabeus2s5+/QqkCflnMOwLLN5m2GsNeWp4xdl4cPa4n7QCOQ==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [x64]
+    os: [linux]
+    libc: [musl]
+
+  '@oxlint/binding-openharmony-arm64@1.77.0':
+    resolution: {integrity: sha512-BJ/j54qS0usEnyDkLYURMj2iiD9h5Cyy+ppzeMSXBGRXaGRNWnj1Mw14NqWMR5E/PzdgB30OOCCzLzbRoduafw==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [arm64]
+    os: [openharmony]
+
+  '@oxlint/binding-win32-arm64-msvc@1.77.0':
+    resolution: {integrity: sha512-Yh8w+g2Lpx7StrvtYkoz9JJvXjB9wxgFChFNb85nrXm/wj/XTwGWS1hve9+900HL7llrntYB3YP+y32E3tRqzA==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [arm64]
+    os: [win32]
+
+  '@oxlint/binding-win32-ia32-msvc@1.77.0':
+    resolution: {integrity: sha512-zja5b7+6a7UsRFgAQSrnax5vrzliEyNPLCjfXONu/vTWswaIVZGFajJZptaeRvPE4LghtFdAzVFlexTm7MVTGA==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [ia32]
+    os: [win32]
+
+  '@oxlint/binding-win32-x64-msvc@1.77.0':
+    resolution: {integrity: sha512-+teyvPDZ2RjUvo+SuCqS/UhaJl1QtdW5fWT5NJTV61V5MIuIS90Db9LixmtEGvXixyttiK62P96MSu3UlpviBw==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [x64]
+    os: [win32]
+
+  '@parcel/watcher-android-arm64@2.6.0':
+    resolution: {integrity: sha512-trgpLSCKRC/huFjXX/Smh+0sWe4+YtKfktIToiMl59ghz7z+qkH6kMvNnUbLyRs9N11t8l4svSCs1+5B3rOAhA==}
     engines: {node: '>= 10.0.0'}
     cpu: [arm64]
     os: [android]
 
-  '@parcel/watcher-darwin-arm64@2.5.0':
-    resolution: {integrity: sha512-hyZ3TANnzGfLpRA2s/4U1kbw2ZI4qGxaRJbBH2DCSREFfubMswheh8TeiC1sGZ3z2jUf3s37P0BBlrD3sjVTUw==}
+  '@parcel/watcher-darwin-arm64@2.6.0':
+    resolution: {integrity: sha512-Y3QV0gl7Q1zbfueunkWIERICbEojQFCgpyG7YqOGNFLsckXyI1xu9mAIUpKY9QBYzBtSkN8dBPwd3yiAO9ovMw==}
     engines: {node: '>= 10.0.0'}
     cpu: [arm64]
     os: [darwin]
 
-  '@parcel/watcher-darwin-x64@2.5.0':
-    resolution: {integrity: sha512-9rhlwd78saKf18fT869/poydQK8YqlU26TMiNg7AIu7eBp9adqbJZqmdFOsbZ5cnLp5XvRo9wcFmNHgHdWaGYA==}
+  '@parcel/watcher-darwin-x64@2.6.0':
+    resolution: {integrity: sha512-Ohv6OpzhUfKYD7Beb8kDvG0jbIxORCYY1JRdZnaBtnjjkJxgD7ZVL0nw2sCYd0yTMKTvz3nnTnOF3cDifK+kvw==}
     engines: {node: '>= 10.0.0'}
     cpu: [x64]
     os: [darwin]
 
-  '@parcel/watcher-freebsd-x64@2.5.0':
-    resolution: {integrity: sha512-syvfhZzyM8kErg3VF0xpV8dixJ+RzbUaaGaeb7uDuz0D3FK97/mZ5AJQ3XNnDsXX7KkFNtyQyFrXZzQIcN49Tw==}
+  '@parcel/watcher-freebsd-x64@2.6.0':
+    resolution: {integrity: sha512-5HmXvDgs8VK+74jF9y9/2FE3/OnlcKmc56tjmSrEuZjpSZOGL+fvAu+HKJBdPs9uwoP2hE6TlSUpXZ/C5jUFmQ==}
     engines: {node: '>= 10.0.0'}
     cpu: [x64]
     os: [freebsd]
 
-  '@parcel/watcher-linux-arm-glibc@2.5.0':
-    resolution: {integrity: sha512-0VQY1K35DQET3dVYWpOaPFecqOT9dbuCfzjxoQyif1Wc574t3kOSkKevULddcR9znz1TcklCE7Ht6NIxjvTqLA==}
+  '@parcel/watcher-linux-arm-glibc@2.6.0':
+    resolution: {integrity: sha512-Ps/hui3A+vMbjdqlqAowK2ZL8+BO8dBjxeWXj6npTBs3jx4wWmbPpaLuqwrQrSqIVMCnpWo238bJ1U37GhQOYg==}
     engines: {node: '>= 10.0.0'}
     cpu: [arm]
     os: [linux]
     libc: [glibc]
 
-  '@parcel/watcher-linux-arm-musl@2.5.0':
-    resolution: {integrity: sha512-6uHywSIzz8+vi2lAzFeltnYbdHsDm3iIB57d4g5oaB9vKwjb6N6dRIgZMujw4nm5r6v9/BQH0noq6DzHrqr2pA==}
+  '@parcel/watcher-linux-arm-musl@2.6.0':
+    resolution: {integrity: sha512-9c6AUHgHoG+IY88MRIHupztQiQnrbqHYQjkM2btA+Bf/wQnQMuiD0Wfk1EVv3TlNT3x41uU71rn6E4xh/+zvkw==}
     engines: {node: '>= 10.0.0'}
     cpu: [arm]
     os: [linux]
     libc: [musl]
 
-  '@parcel/watcher-linux-arm64-glibc@2.5.0':
-    resolution: {integrity: sha512-BfNjXwZKxBy4WibDb/LDCriWSKLz+jJRL3cM/DllnHH5QUyoiUNEp3GmL80ZqxeumoADfCCP19+qiYiC8gUBjA==}
+  '@parcel/watcher-linux-arm64-glibc@2.6.0':
+    resolution: {integrity: sha512-yHRqS2owEXe6Hic9z6Mh1ECsCd+ODVOGvZDyciqRd21+v+o+DnXMOrw50DSpIG2sb8GPEaPPmfeCAWKPJdq46g==}
     engines: {node: '>= 10.0.0'}
     cpu: [arm64]
     os: [linux]
     libc: [glibc]
 
-  '@parcel/watcher-linux-arm64-musl@2.5.0':
-    resolution: {integrity: sha512-S1qARKOphxfiBEkwLUbHjCY9BWPdWnW9j7f7Hb2jPplu8UZ3nes7zpPOW9bkLbHRvWM0WDTsjdOTUgW0xLBN1Q==}
+  '@parcel/watcher-linux-arm64-musl@2.6.0':
+    resolution: {integrity: sha512-WhB2e/V7rqdHHWZusBSPuy5Ei8S6lSz6FE5TKKQz5h3a0O+C+mhY7vxU9b/stqvMb8beLnPY82ZrFTLKs+SrKA==}
     engines: {node: '>= 10.0.0'}
     cpu: [arm64]
     os: [linux]
     libc: [musl]
 
-  '@parcel/watcher-linux-x64-glibc@2.5.0':
-    resolution: {integrity: sha512-d9AOkusyXARkFD66S6zlGXyzx5RvY+chTP9Jp0ypSTC9d4lzyRs9ovGf/80VCxjKddcUvnsGwCHWuF2EoPgWjw==}
+  '@parcel/watcher-linux-x64-glibc@2.6.0':
+    resolution: {integrity: sha512-ulGE6x6Oz6iAwg75T8YQSoguBWasniIbX+QWpaYPcCnDOpdWX3k+4xbEYPZVLxOuoJI+svJJPD3sEj8G7lrQ3A==}
     engines: {node: '>= 10.0.0'}
     cpu: [x64]
     os: [linux]
     libc: [glibc]
 
-  '@parcel/watcher-linux-x64-musl@2.5.0':
-    resolution: {integrity: sha512-iqOC+GoTDoFyk/VYSFHwjHhYrk8bljW6zOhPuhi5t9ulqiYq1togGJB5e3PwYVFFfeVgc6pbz3JdQyDoBszVaA==}
+  '@parcel/watcher-linux-x64-musl@2.6.0':
+    resolution: {integrity: sha512-tkBYKt7YQrjIJWYDnto2YgO8MRkjlMTSNoRHzsXinBqbLdeOM3L32wPZJvIZxqaLMfSlS/4sUjH/6STVP/XDLw==}
     engines: {node: '>= 10.0.0'}
     cpu: [x64]
     os: [linux]
     libc: [musl]
 
-  '@parcel/watcher-wasm@2.5.0':
-    resolution: {integrity: sha512-Z4ouuR8Pfggk1EYYbTaIoxc+Yv4o7cGQnH0Xy8+pQ+HbiW+ZnwhcD2LPf/prfq1nIWpAxjOkQ8uSMFWMtBLiVQ==}
+  '@parcel/watcher-wasm@2.6.0':
+    resolution: {integrity: sha512-dtjbDxKSDPQ8AmA+pS4OFaHE1FKrjtGpLGBxw85uKFkRorjNbvDM/aFPgqosu40wprbp1xw2ZSxIKqghCUHe2w==}
     engines: {node: '>= 10.0.0'}
     bundledDependencies:
       - napi-wasm
 
-  '@parcel/watcher-win32-arm64@2.5.0':
-    resolution: {integrity: sha512-twtft1d+JRNkM5YbmexfcH/N4znDtjgysFaV9zvZmmJezQsKpkfLYJ+JFV3uygugK6AtIM2oADPkB2AdhBrNig==}
+  '@parcel/watcher-win32-arm64@2.6.0':
+    resolution: {integrity: sha512-gIZAP23jaHjGWasY/TY6yL7NHFClf0Ga7FN+iINvk+KN94rhm94lYZhFsbYFNcA04/onvGD9kKmiJLJB2HbNwQ==}
     engines: {node: '>= 10.0.0'}
     cpu: [arm64]
     os: [win32]
 
-  '@parcel/watcher-win32-ia32@2.5.0':
-    resolution: {integrity: sha512-+rgpsNRKwo8A53elqbbHXdOMtY/tAtTzManTWShB5Kk54N8Q9mzNWV7tV+IbGueCbcj826MfWGU3mprWtuf1TA==}
-    engines: {node: '>= 10.0.0'}
-    cpu: [ia32]
-    os: [win32]
-
-  '@parcel/watcher-win32-x64@2.5.0':
-    resolution: {integrity: sha512-lPrxve92zEHdgeff3aiu4gDOIt4u7sJYha6wbdEZDCDUhtjTsOMiaJzG5lMY4GkWH8p0fMmO2Ppq5G5XXG+DQw==}
+  '@parcel/watcher-win32-x64@2.6.0':
+    resolution: {integrity: sha512-cA+/pXV2YkfxlIcXOQ5fSWqAzzPyD78/x5qbK/I0vUkrlYHA8TIz+MXjAbGouguKVSI4bOmkTSJ1/poVSsgt+A==}
     engines: {node: '>= 10.0.0'}
     cpu: [x64]
     os: [win32]
 
-  '@parcel/watcher@2.5.0':
-    resolution: {integrity: sha512-i0GV1yJnm2n3Yq1qw6QrUrd/LI9bE8WEBOTtOkpCXHHdyN3TAGgqAK/DAT05z4fq2x04cARXt2pDmjWjL92iTQ==}
+  '@parcel/watcher@2.6.0':
+    resolution: {integrity: sha512-7FNeNl8NCE7aINx7WXiKQrPYZWC/hvrTsmk6zmxbI7LTXE7hVek/n8AfVgpe2y82zl3w0HvCHN0bVKMBoJcC0w==}
     engines: {node: '>= 10.0.0'}
 
+  '@peculiar/asn1-schema@2.8.0':
+    resolution: {integrity: sha512-7YT0U/ze0tF2QOBbE15gKZwy5tvgGyLRiRHLzhlbOpf7BT032oBSd0haZqXn5W6l26WLlu3dyxzjM+2638/z2Q==}
+
+  '@peculiar/json-schema@1.1.12':
+    resolution: {integrity: sha512-coUfuoMeIB7B8/NMekxaDzLhaYmp0HZNPEjYRm9goRou8UZIC3z21s0sL9AWoCw4EG876QyO3kYrc61WNF9B/w==}
+    engines: {node: '>=8.0.0'}
+
+  '@peculiar/utils@2.0.3':
+    resolution: {integrity: sha512-+oL3HPFRIZ1St2K50lWCXiioIgSoxzz7R1J3uF6neO2yl1sgmpgY6XXJH4BdpoDkMWznQTeYF6oWNDZLCdQ4eQ==}
+
+  '@peculiar/webcrypto@1.7.1':
+    resolution: {integrity: sha512-ODOov0sGMJMf3jPonOkgGqPknTsu+DdQ7kD++gz8aI+aFMOMHFbWAA2taqXXVTdP+OTOQR/znGvSpmkeI0WTYQ==}
+    engines: {node: '>=14.18.0'}
+
   '@pkgjs/parseargs@0.11.0':
     resolution: {integrity: sha512-+1VkjdD0QBLPodGrJUeqarH8VAIvQODIbwh9XpP5Syisf7YoQgsJKPNFoqqLQlu+VQ/tVSshMR6loPMn8U+dPg==}
     engines: {node: '>=14'}
 
-  '@pkgr/core@0.1.1':
-    resolution: {integrity: sha512-cq8o4cWH0ibXh9VGi5P20Tu9XF/0fFXl9EUinr9QfTM7a7p0oTA4iJRCQWppXR1Pg8dSM0UCItCkPwsk9qWWYA==}
-    engines: {node: ^12.20.0 || ^14.18.0 || >=16.0.0}
+  '@pkgr/core@0.3.6':
+    resolution: {integrity: sha512-SEeaJLb3qBNF/OaXnaR1NmmBbFYk1zC0ZH/52fATcRPLFg/p791YrcyFFy44Bo9sLaGuSuLp5Q6axbb/O+v/RA==}
+    engines: {node: ^14.18.0 || >=16.0.0}
 
-  '@playwright/test@1.49.1':
-    resolution: {integrity: sha512-Ky+BVzPz8pL6PQxHqNRW1k3mIyv933LML7HktS8uik0bUXNCdPhoS/kLihiO1tMf/egaJb4IutXd7UywvXEW+g==}
-    engines: {node: '>=18'}
+  '@playwright/test@1.62.1':
+    resolution: {integrity: sha512-DTcUc8qii+cpHvtOwggMtBRMjKZHXYWdw8syRYu2vtzuq4Wxphqq4NfCs5Zt44L6mA8rfDfj+PHnxFc/FeK6mQ==}
+    engines: {node: '>=20'}
     hasBin: true
 
   '@pnpm/config.env-replace@1.1.0':
     resolution: {integrity: sha512-htyl8TWnKL7K/ESFa1oW2UB5lVDxuF5DpM7tBi6Hu2LNL3mWkIzNLG6N4zoCUP1lCKNxWy/3iu8mS8MvToGd6w==}
     engines: {node: '>=12.22.0'}
 
-  '@pnpm/constants@1001.0.0':
-    resolution: {integrity: sha512-yg+S/e8goJoUC4CxyKAplT2fuI94G/nynshPCNkLsi69bUMim5iDMuiiiMo/LeMoOjuyfByealD3u1mqNXrl+A==}
+  '@pnpm/constants@1001.3.1':
+    resolution: {integrity: sha512-2hf0s4pVrVEH8RvdJJ7YRKjQdiG8m0iAT26TTqXnCbK30kKwJW69VLmP5tED5zstmDRXcOeH5eRcrpkdwczQ9g==}
     engines: {node: '>=18.12'}
 
-  '@pnpm/error@1000.0.1':
-    resolution: {integrity: sha512-FdDMjp9ORXK/JlxwjlNF7mRohVKx5pvM01bxsVUSLFLZ9/oMBtDceWlntUTLhvr2MwYcr69mGilTojnXEbsjQA==}
+  '@pnpm/error@1000.1.0':
+    resolution: {integrity: sha512-Dqc2IJJPjUatwc9Letw+vG29rnaMrDGi5g6WCx1HiZYm0obXbTmLygeRafMbgf+sLKXrWE1shOeiayQuczBdoA==}
     engines: {node: '>=18.12'}
 
   '@pnpm/network.ca-file@1.0.2':
     resolution: {integrity: sha512-YcPQ8a0jwYU9bTdJDpXjMi7Brhkr1mXsXrUJvjqM2mQDgkRiz8jFaQGOdaLxgjtUfQgZhKy/O3cG/YwmgKaxLA==}
     engines: {node: '>=12.22.0'}
 
-  '@pnpm/npm-conf@2.3.1':
-    resolution: {integrity: sha512-c83qWb22rNRuB0UaVCI0uRPNRr8Z0FWnEIvT47jiHAmOIUHbBOg5XvV7pM5x+rKn9HRpjxquDbXYSXr3fAKFcw==}
+  '@pnpm/npm-conf@3.0.3':
+    resolution: {integrity: sha512-//0sR/cow/s4ICQaYoAobOl4aU8cjU6x/V24V7XkKotb9+O+3zySIYp146vpaobYHnxa4pZX8NkV54Z5AwbDKA==}
     engines: {node: '>=12'}
 
-  '@pnpm/workspace.read-manifest@1000.0.1':
-    resolution: {integrity: sha512-W45/escLD82Xss0oQYATs5GXZzet0wflnUe9SkL4KhEQUzX6jpmtoAqlxxbBccHFoeteoP6VjwT6Gmt8UFcewg==}
+  '@pnpm/types@1001.3.0':
+    resolution: {integrity: sha512-NLTXheat/u7OEGg5M5vF6Z85zx8uKUZE0+whtX/sbFV2XL48RdnOWGPTKYuVVkv8M+launaLUTgGEXNs/ess2w==}
     engines: {node: '>=18.12'}
 
-  '@polka/url@1.0.0-next.28':
-    resolution: {integrity: sha512-8LduaNlMZGwdZ6qWrKlfa+2M4gahzFkprZiAt2TF8uS0qQgBizKXpXURqvTJ4WtmupWxaLqjRb2UCTe72mu+Aw==}
+  '@pnpm/workspace.read-manifest@1000.3.1':
+    resolution: {integrity: sha512-ojO1Anf4ITL7OskuUYoLI3bldQ36XNLpG2cYQZ4F6LZbBZnRY8umW6TeWzb9h/aX8UFwYp9vWbQ8R/FaMtMEeg==}
+    engines: {node: '>=18.12'}
 
-  '@redocly/ajv@8.11.2':
-    resolution: {integrity: sha512-io1JpnwtIcvojV7QKDUSIuMN/ikdOUd1ReEnUnMKGfDVridQZ31J0MmIuqwuRjWDZfmvr+Q0MqCcfHM2gTivOg==}
+  '@polka/url@1.0.0-next.29':
+    resolution: {integrity: sha512-wwQAWhWSuHaag8c4q/KN/vCoeOJYshAIvMQwD4GpSb3OiZklFfvAgmj0VCBBImRpuF/aFgIRzllXlVX93Jevww==}
 
-  '@redocly/config@0.17.1':
-    resolution: {integrity: sha512-CEmvaJuG7pm2ylQg53emPmtgm4nW2nxBgwXzbVEHpGas/lGnMyN8Zlkgiz6rPw0unASg6VW3wlz27SOL5XFHYQ==}
+  '@popperjs/core@2.11.8':
+    resolution: {integrity: sha512-P1st0aksCrn9sGZhp8GMYwBnQsbvAWsZAX44oXNNvLHGqAOcoVxmjZiohstwQ7SqKnbR47akdNi+uleWD8+g6A==}
 
-  '@redocly/openapi-core@1.26.1':
-    resolution: {integrity: sha512-xRuVZqMVRFzqjbUCpOTra4tbnmQMWsya996omZMV3WgD084Z6OWB3FXflhAp93E/yAmbWlWZpddw758AyoaLSw==}
-    engines: {node: '>=14.19.0', npm: '>=7.0.0'}
+  '@poppinss/colors@4.1.6':
+    resolution: {integrity: sha512-H9xkIdFswbS8n1d6vmRd8+c10t2Qe+rZITbbDHHkQixH5+2x1FDGmi/0K+WgWiqQFKPSlIYB7jlH6Kpfn6Fleg==}
+
+  '@poppinss/dumper@0.7.0':
+    resolution: {integrity: sha512-0UTYalzk2t6S4rA2uHOz5bSSW2CHdv4vggJI6Alg90yvl0UgXs6XSXpH96OH+bRkX4J/06djv29pqXJ0lq5Kag==}
+
+  '@poppinss/exception@1.2.3':
+    resolution: {integrity: sha512-dCED+QRChTVatE9ibtoaxc+WkdzOSjYTKi/+uacHWIsfodVfpsueo3+DKpgU5Px8qXjgmXkSvhXvSCz3fnP9lw==}
+
+  '@publint/pack@0.1.6':
+    resolution: {integrity: sha512-3uVNyGcVplhPZSLVyeIpL7+cIRn1YCSNHLG/rUIlBQMVH8YuN9++YF+5+UDIIO9RW98dujiUoTltO7RDB5bFJA==}
+    engines: {node: '>=18'}
+
+  '@quansync/fs@1.0.0':
+    resolution: {integrity: sha512-4TJ3DFtlf1L5LDMaM6CanJ/0lckGNtJcMjQ1NAV6zDmA0tEHKZtxNKin8EgPaVX1YzljbxckyT2tJrpQKAtngQ==}
+
+  '@rolldown/binding-android-arm64@1.2.3':
+    resolution: {integrity: sha512-zrJtHDcaZJ1Fp7xf4hNl+7seH9Cn/N5TwLYkhgXREtBwAd/jaqW3uqeHxpDugJLVICWg4eW44kOQEGJ1r6jCGw==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [arm64]
+    os: [android]
+
+  '@rolldown/binding-darwin-arm64@1.2.3':
+    resolution: {integrity: sha512-ieIiibVCp0tX7TLu2cafoNPv8wJyYi01ekXpbf8q2j7F4rGAhhXb/eQh7ge9DRBY78GwmRQtvjZDux7EDbA8kA==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [arm64]
+    os: [darwin]
+
+  '@rolldown/binding-darwin-x64@1.2.3':
+    resolution: {integrity: sha512-Zh9tCon19eDXJoihx0rqKhMUlMYqzwj3aPsSuHmI4RWZh62dWUL+DJN4C5YQya5TcQBJU/Fe8+rY0jhXTQITqA==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [x64]
+    os: [darwin]
+
+  '@rolldown/binding-freebsd-x64@1.2.3':
+    resolution: {integrity: sha512-nGbJWewA1wrXXZiQhjAT5rhibGfns5ZNkDVqxsO6zJ3f3YvpoDNNmGMSbbhLuXKjNScaBJVOAboztAWVespQMg==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [x64]
+    os: [freebsd]
+
+  '@rolldown/binding-linux-arm-gnueabihf@1.2.3':
+    resolution: {integrity: sha512-QNniJr5Kml0kDEB98jiDOJjXNroxIIi0IXIbdYzY26Xt1pVbeP62+KnoIZLwirOymX/0jDk/2gI/bNUv7A7OIw==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [arm]
+    os: [linux]
+
+  '@rolldown/binding-linux-arm64-gnu@1.2.3':
+    resolution: {integrity: sha512-TkqEAcmmvH3I/q4114NB4RVt6241Dao48pF45uLcFGrwAaIn0iITgTAKP/dLjbN0R4buJjGb91+UHSoFmpgIWw==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [arm64]
+    os: [linux]
+    libc: [glibc]
+
+  '@rolldown/binding-linux-arm64-musl@1.2.3':
+    resolution: {integrity: sha512-NHqjnxpsndf4MPymxteFAWHHfkTL8HjWh1KB7z23ofZ6QO2euONuxDXjat69dKZRALnGypg8k8SsK8vZJoXv1Q==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [arm64]
+    os: [linux]
+    libc: [musl]
+
+  '@rolldown/binding-linux-ppc64-gnu@1.2.3':
+    resolution: {integrity: sha512-6tbrbwfz5GB9DQ4Jwo6hy9v+vR31xZlvzZ6n5Xut6Hhx5PvrA9q/HsK8KMaYQp063iqZGXwNvZtYNLD7EM/x0w==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [ppc64]
+    os: [linux]
+    libc: [glibc]
+
+  '@rolldown/binding-linux-s390x-gnu@1.2.3':
+    resolution: {integrity: sha512-oyuXxXmoZHjXC917IAPFAAv4wWAa0cM9afk8nx1+9/jNNOX1uPf8yDA6p7G0RypOfw/X0PQt5IfoquY1um+zSg==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [s390x]
+    os: [linux]
+    libc: [glibc]
+
+  '@rolldown/binding-linux-x64-gnu@1.2.3':
+    resolution: {integrity: sha512-TytMwF2KVGqP2tgd0I1OY0PAv78dZRAYcF5ssDzjM34SUXCED3uXvSd5+lHoC0bTD6eEdFz7LdQNCO1y0oVk9w==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [x64]
+    os: [linux]
+    libc: [glibc]
+
+  '@rolldown/binding-linux-x64-musl@1.2.3':
+    resolution: {integrity: sha512-/E9m3qstrJFVPoULV25mVQblSNExY2+kBsYe4sy0Tn0yOOgJ8wZbZt3KnRbF/XeU2Gl1STKUQnDNTqhIE5MD4A==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [x64]
+    os: [linux]
+    libc: [musl]
+
+  '@rolldown/binding-openharmony-arm64@1.2.3':
+    resolution: {integrity: sha512-Kr0OcsoQI816i6HOl3vFHpd1K0eZyh76zgfj4c1nTyaTsd5r2Mj1lwM4R90y/qaCfmTn9eHy0SKwi98eitRxug==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [arm64]
+    os: [openharmony]
+
+  '@rolldown/binding-win32-arm64-msvc@1.2.3':
+    resolution: {integrity: sha512-hOtMwTqnME+/gJcH/PCZ0wn0zPUjiWOgkHpxbSJpfGKMezHltx1S7/k1SitzVa7Ww2cqrDDaFbZEhcJZO8o+Jw==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [arm64]
+    os: [win32]
+
+  '@rolldown/binding-win32-x64-msvc@1.2.3':
+    resolution: {integrity: sha512-ekcqMMkI2PlhYnfzQnB/cEdYUVVJViWvoUyLrbzgDoi3Snfc1mVBwdnc306ufA5ejy8JSPjT2RlW1nQSjW7efg==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [x64]
+    os: [win32]
+
+  '@rolldown/pluginutils@1.0.1':
+    resolution: {integrity: sha512-2j9bGt5Jh8hj+vPtgzPtl72j0yRxHAyumoo6TNfAjsLB04UtpSvPbPcDcBMxz7n+9CYB0c1GxQFxYRg2jimqGw==}
 
   '@rollup/plugin-alias@5.1.1':
     resolution: {integrity: sha512-PR9zDb+rOzkRb2VD+EuKB7UC41vU5DIwZ5qqCpk0KJudcWAyi8rvYOhS7+L5aZCspw1stTViLgN5v6FF1p5cgQ==}
@@ -3651,19 +4739,39 @@ packages:
       rollup:
         optional: true
 
-  '@rollup/plugin-babel@5.3.1':
-    resolution: {integrity: sha512-WFfdLWU/xVWKeRQnKmIAQULUI7Il0gZnBIH/ZFO069wYIfPu+8zrfp/KMW0atmELoRDq8FbiP3VCss9MhCut7Q==}
-    engines: {node: '>= 10.0.0'}
+  '@rollup/plugin-alias@6.0.0':
+    resolution: {integrity: sha512-tPCzJOtS7uuVZd+xPhoy5W4vThe6KWXNmsFCNktaAh5RTqcLiSfT4huPQIXkgJ6YCOjJHvecOAzQxLFhPxKr+g==}
+    engines: {node: '>=20.19.0'}
+    peerDependencies:
+      rollup: '>=4.0.0'
+    peerDependenciesMeta:
+      rollup:
+        optional: true
+
+  '@rollup/plugin-babel@6.1.0':
+    resolution: {integrity: sha512-dFZNuFD2YRcoomP4oYf+DvQNSUA9ih+A3vUqopQx5EdtPGo3WBnQcI/S8pwpz91UsGfL0HsMSOlaMld8HrbubA==}
+    engines: {node: '>=14.0.0'}
     peerDependencies:
       '@babel/core': ^7.0.0
       '@types/babel__core': ^7.1.9
-      rollup: ^1.20.0||^2.0.0
+      rollup: ^1.20.0||^2.0.0||^3.0.0||^4.0.0
     peerDependenciesMeta:
       '@types/babel__core':
         optional: true
+      rollup:
+        optional: true
 
-  '@rollup/plugin-commonjs@28.0.2':
-    resolution: {integrity: sha512-BEFI2EDqzl+vA1rl97IDRZ61AIwGH093d9nz8+dThxJNH8oSoB7MjWvPCX3dkaK1/RCJ/1v/R1XB15FuSs0fQw==}
+  '@rollup/plugin-commonjs@28.0.9':
+    resolution: {integrity: sha512-PIR4/OHZ79romx0BVVll/PkwWpJ7e5lsqFa3gFfcrFPWwLXLV39JVUzQV9RKjWerE7B845Hqjj9VYlQeieZ2dA==}
+    engines: {node: '>=16.0.0 || 14 >= 14.17'}
+    peerDependencies:
+      rollup: ^2.68.0||^3.0.0||^4.0.0
+    peerDependenciesMeta:
+      rollup:
+        optional: true
+
+  '@rollup/plugin-commonjs@29.0.3':
+    resolution: {integrity: sha512-ZaOxZceP7SOUW7Lqw5IRVweSQYWaeIPnXIGLiB690EBA3FGJTO40EEr2L5yZplJWsgTCogILRSpcAe7+U0Otdg==}
     engines: {node: '>=16.0.0 || 14 >= 14.17'}
     peerDependencies:
       rollup: ^2.68.0||^3.0.0||^4.0.0
@@ -3689,8 +4797,8 @@ packages:
       rollup:
         optional: true
 
-  '@rollup/plugin-node-resolve@15.3.1':
-    resolution: {integrity: sha512-tgg6b91pAybXHJQMAAwW9VuWBO6Thi+q7BCNARLwSqlmsHz0XYURtGvh/AuwSADXSI4h/2uHbs7s4FzlZDGSGA==}
+  '@rollup/plugin-node-resolve@16.0.3':
+    resolution: {integrity: sha512-lUYM3UBGuM93CnMPG1YocWu7X802BrNF3jW2zny5gQyLQgRFJhV1Sq0Zi74+dh/6NBx1DxFC4b4GXg9wUCG5Qg==}
     engines: {node: '>=14.0.0'}
     peerDependencies:
       rollup: ^2.78.0||^3.0.0||^4.0.0
@@ -3698,13 +4806,8 @@ packages:
       rollup:
         optional: true
 
-  '@rollup/plugin-replace@2.4.2':
-    resolution: {integrity: sha512-IGcu+cydlUMZ5En85jxHH4qj2hta/11BHq95iHEyb2sbgiN0eCdzvUcHw5gt9pBL5lTi4JDYJ1acCoMGpTvEZg==}
-    peerDependencies:
-      rollup: ^1.20.0 || ^2.0.0
-
-  '@rollup/plugin-replace@6.0.2':
-    resolution: {integrity: sha512-7QaYCf8bqF04dOy7w/eHmJeNExxTYwvKAmlSAH/EaWWUzbT0h5sbF6bktFoX/0F/0qwng5/dWFMyf3gzaM8DsQ==}
+  '@rollup/plugin-replace@6.0.3':
+    resolution: {integrity: sha512-J4RZarRvQAm5IF0/LwUUg+obsm+xZhYnbMXmXROyoSE1ATJe3oXSb9L5MMppdxP2ylNSjv6zFBwKYjcKMucVfA==}
     engines: {node: '>=14.0.0'}
     peerDependencies:
       rollup: ^1.20.0||^2.0.0||^3.0.0||^4.0.0
@@ -3712,27 +4815,17 @@ packages:
       rollup:
         optional: true
 
-  '@rollup/plugin-terser@0.4.4':
-    resolution: {integrity: sha512-XHeJC5Bgvs8LfukDwWZp7yeqin6ns8RTl2B9avbejt6tZqsqvVoWI7ZTQrcNsfKEDWBTnTxM8nMDkO2IFFbd0A==}
-    engines: {node: '>=14.0.0'}
+  '@rollup/plugin-terser@1.0.0':
+    resolution: {integrity: sha512-FnCxhTBx6bMOYQrar6C8h3scPt8/JwIzw3+AJ2K++6guogH5fYaIFia+zZuhqv0eo1RN7W1Pz630SyvLbDjhtQ==}
+    engines: {node: '>=20.0.0'}
     peerDependencies:
       rollup: ^2.0.0||^3.0.0||^4.0.0
     peerDependenciesMeta:
       rollup:
         optional: true
 
-  '@rollup/pluginutils@3.1.0':
-    resolution: {integrity: sha512-GksZ6pr6TpIjHm8h9lSQ8pi8BE9VeubNT0OMJ3B5uZJ8pz73NPiqOtCog/x2/QzM1ENChPKxMDhiQuRHsqc+lg==}
-    engines: {node: '>= 8.0.0'}
-    peerDependencies:
-      rollup: ^1.20.0||^2.0.0
-
-  '@rollup/pluginutils@4.2.1':
-    resolution: {integrity: sha512-iKnFXr7NkdZAIHiIWE+BX5ULi/ucVFYWD6TbAV+rZctiRTY2PL6tsIKhoIOaoskiWAkgu+VsbXgUVDNLHf+InQ==}
-    engines: {node: '>= 8.0.0'}
-
-  '@rollup/pluginutils@5.1.4':
-    resolution: {integrity: sha512-USm05zrsFxYLPdWWq+K3STlWiT/3ELn3RcV5hJMghpeAIhxfsUIg6mt12CBJBInWMV4VneoV7SfGv8xIwo2qNQ==}
+  '@rollup/pluginutils@5.4.0':
+    resolution: {integrity: sha512-MfPp06CjRLfXQ3wY0R8vJDYBy/MvVcc9OulEfR0B8Iv9ko+GCNaRZ+EpJYFl27LhKsZK0o420sYCRHCjfCgeUg==}
     engines: {node: '>=14.0.0'}
     peerDependencies:
       rollup: ^1.20.0||^2.0.0||^3.0.0||^4.0.0
@@ -3740,132 +4833,143 @@ packages:
       rollup:
         optional: true
 
-  '@rollup/rollup-android-arm-eabi@4.28.1':
-    resolution: {integrity: sha512-2aZp8AES04KI2dy3Ss6/MDjXbwBzj+i0GqKtWXgw2/Ma6E4jJvujryO6gJAghIRVz7Vwr9Gtl/8na3nDUKpraQ==}
+  '@rollup/rollup-android-arm-eabi@4.62.4':
+    resolution: {integrity: sha512-RrPokAb7dmbxFoeO3TloqHyOjgye8RkBhSqmp4aJMIex4c9r46ZstPnleDQOq1t46VOVjwIuwNogIqbodV1Vvg==}
     cpu: [arm]
     os: [android]
 
-  '@rollup/rollup-android-arm64@4.28.1':
-    resolution: {integrity: sha512-EbkK285O+1YMrg57xVA+Dp0tDBRB93/BZKph9XhMjezf6F4TpYjaUSuPt5J0fZXlSag0LmZAsTmdGGqPp4pQFA==}
+  '@rollup/rollup-android-arm64@4.62.4':
+    resolution: {integrity: sha512-JKuJc+pnpks2pjy7L/N3v/cAkZxYlnmuZoD840ldbMI5KDbC4iO9NKwPKYdjYFCMAIIlBzYSFHxIJVYzRo2/8A==}
     cpu: [arm64]
     os: [android]
 
-  '@rollup/rollup-darwin-arm64@4.28.1':
-    resolution: {integrity: sha512-prduvrMKU6NzMq6nxzQw445zXgaDBbMQvmKSJaxpaZ5R1QDM8w+eGxo6Y/jhT/cLoCvnZI42oEqf9KQNYz1fqQ==}
+  '@rollup/rollup-darwin-arm64@4.62.4':
+    resolution: {integrity: sha512-krw5uS2STmvJ02x0uTXHbqQNuz+9eZ1iw+qXk9dmW2gvV4jV7O2hEoOnuhFrpOPiel1mBFtqbxYZZtC46hXLOw==}
     cpu: [arm64]
     os: [darwin]
 
-  '@rollup/rollup-darwin-x64@4.28.1':
-    resolution: {integrity: sha512-WsvbOunsUk0wccO/TV4o7IKgloJ942hVFK1CLatwv6TJspcCZb9umQkPdvB7FihmdxgaKR5JyxDjWpCOp4uZlQ==}
+  '@rollup/rollup-darwin-x64@4.62.4':
+    resolution: {integrity: sha512-wsTxtgApb4PrOsNJIm0FZ1h3WvCC+k9uxLJ4ad75hgoS4NiRes2SoJFlDAyMwiUY8IssDqGcHbXuN0sx1tfF1A==}
     cpu: [x64]
     os: [darwin]
 
-  '@rollup/rollup-freebsd-arm64@4.28.1':
-    resolution: {integrity: sha512-HTDPdY1caUcU4qK23FeeGxCdJF64cKkqajU0iBnTVxS8F7H/7BewvYoG+va1KPSL63kQ1PGNyiwKOfReavzvNA==}
+  '@rollup/rollup-freebsd-arm64@4.62.4':
+    resolution: {integrity: sha512-GUOnQlyZe3yAXhWOtOMsn5Qkrv5E5mZXa0thbARWi5Ei2szlVXJFQhddZ4HbAzh8q92w5twp+CQvs/eFanz9YQ==}
     cpu: [arm64]
     os: [freebsd]
 
-  '@rollup/rollup-freebsd-x64@4.28.1':
-    resolution: {integrity: sha512-m/uYasxkUevcFTeRSM9TeLyPe2QDuqtjkeoTpP9SW0XxUWfcYrGDMkO/m2tTw+4NMAF9P2fU3Mw4ahNvo7QmsQ==}
+  '@rollup/rollup-freebsd-x64@4.62.4':
+    resolution: {integrity: sha512-/Y7f3QuxjzPKsjA/rfEDa3+0vXqyjmJ50Ln8dPpCmWkKTrUoWHG1cWhTqaAMLob2m2nESWuC7yGrREz019Ztqg==}
     cpu: [x64]
     os: [freebsd]
 
-  '@rollup/rollup-linux-arm-gnueabihf@4.28.1':
-    resolution: {integrity: sha512-QAg11ZIt6mcmzpNE6JZBpKfJaKkqTm1A9+y9O+frdZJEuhQxiugM05gnCWiANHj4RmbgeVJpTdmKRmH/a+0QbA==}
+  '@rollup/rollup-linux-arm-gnueabihf@4.62.4':
+    resolution: {integrity: sha512-81wiiX3v7aqy+T+bT61TJ78yJjRquqFFTTbAPt08imfQQzkPIW8t6aJbkTagtCCrXMNc9D66+geqlK7ydLPNqA==}
     cpu: [arm]
     os: [linux]
     libc: [glibc]
 
-  '@rollup/rollup-linux-arm-musleabihf@4.28.1':
-    resolution: {integrity: sha512-dRP9PEBfolq1dmMcFqbEPSd9VlRuVWEGSmbxVEfiq2cs2jlZAl0YNxFzAQS2OrQmsLBLAATDMb3Z6MFv5vOcXg==}
+  '@rollup/rollup-linux-arm-musleabihf@4.62.4':
+    resolution: {integrity: sha512-9kmDIvNZqdoHOBZgNtpTBeLWYO/LVipM3H/j62P8848/l/VPEQL6N3uxU9pvP1oZAsXyC2MEnFP3ovRjo7WYNQ==}
     cpu: [arm]
     os: [linux]
     libc: [musl]
 
-  '@rollup/rollup-linux-arm64-gnu@4.28.1':
-    resolution: {integrity: sha512-uGr8khxO+CKT4XU8ZUH1TTEUtlktK6Kgtv0+6bIFSeiSlnGJHG1tSFSjm41uQ9sAO/5ULx9mWOz70jYLyv1QkA==}
+  '@rollup/rollup-linux-arm64-gnu@4.62.4':
+    resolution: {integrity: sha512-CcnXHWnXg69g+DX5VWL3FHts3qMRN2uVEHX+BZvGLdd07/gXkn3ePjYtO1LDJvxkGKVHMclKBRa1QUTH+6toYQ==}
     cpu: [arm64]
     os: [linux]
     libc: [glibc]
 
-  '@rollup/rollup-linux-arm64-musl@4.28.1':
-    resolution: {integrity: sha512-QF54q8MYGAqMLrX2t7tNpi01nvq5RI59UBNx+3+37zoKX5KViPo/gk2QLhsuqok05sSCRluj0D00LzCwBikb0A==}
+  '@rollup/rollup-linux-arm64-musl@4.62.4':
+    resolution: {integrity: sha512-iFOibiHnTRuhrWLlRsOQFdZJJIa7S8OwkneJr4ocALP16u5yk6lWLINFwhHaEqBFMsKDUZofLkGos7+CPzGB3g==}
     cpu: [arm64]
     os: [linux]
     libc: [musl]
 
-  '@rollup/rollup-linux-loongarch64-gnu@4.28.1':
-    resolution: {integrity: sha512-vPul4uodvWvLhRco2w0GcyZcdyBfpfDRgNKU+p35AWEbJ/HPs1tOUrkSueVbBS0RQHAf/A+nNtDpvw95PeVKOA==}
+  '@rollup/rollup-linux-loong64-gnu@4.62.4':
+    resolution: {integrity: sha512-XnWYMI7euHlb5a871xPja+Gm7DRCFU+FGRrtS2sMq9N8FvqtpagUy6gD4YOemC5MRk9xbh8+jYMEJbigFQwsgA==}
     cpu: [loong64]
     os: [linux]
     libc: [glibc]
 
-  '@rollup/rollup-linux-powerpc64le-gnu@4.28.1':
-    resolution: {integrity: sha512-pTnTdBuC2+pt1Rmm2SV7JWRqzhYpEILML4PKODqLz+C7Ou2apEV52h19CR7es+u04KlqplggmN9sqZlekg3R1A==}
+  '@rollup/rollup-linux-loong64-musl@4.62.4':
+    resolution: {integrity: sha512-qGDAlO0U8xedCcsdRm9oaoQY8DAx/QT7uIxJWhCdx0ceIWX783UC9QSYkdpzAe29wNiVfp24+bZdQmn49o45SQ==}
+    cpu: [loong64]
+    os: [linux]
+    libc: [musl]
+
+  '@rollup/rollup-linux-ppc64-gnu@4.62.4':
+    resolution: {integrity: sha512-ru4H6ezD7ysA5EiEK6qkkaEb4modH8CTej6kUy/gQi20u3kB3G7Zn8snXXkeJSCOFKG/rbPPtM/+9Wgas1961w==}
     cpu: [ppc64]
     os: [linux]
     libc: [glibc]
 
-  '@rollup/rollup-linux-riscv64-gnu@4.28.1':
-    resolution: {integrity: sha512-vWXy1Nfg7TPBSuAncfInmAI/WZDd5vOklyLJDdIRKABcZWojNDY0NJwruY2AcnCLnRJKSaBgf/GiJfauu8cQZA==}
+  '@rollup/rollup-linux-ppc64-musl@4.62.4':
+    resolution: {integrity: sha512-2W4MO5WQVJnbJaZdvDb9rhBDuFU1nKIepPFpJUBsTh2k1YY2g+ODViaWuyOAjQ5cOP7NvrvLzt3wvHOoiAvc7w==}
+    cpu: [ppc64]
+    os: [linux]
+    libc: [musl]
+
+  '@rollup/rollup-linux-riscv64-gnu@4.62.4':
+    resolution: {integrity: sha512-+fxjfuoAmVMCYV5QyjoIpu0cp5DOiOTeqYFk1AVaxGr+/ravWLX89XfQmptsoWcaVy/TGf2hexzbUOrCQIL1CQ==}
     cpu: [riscv64]
     os: [linux]
     libc: [glibc]
 
-  '@rollup/rollup-linux-s390x-gnu@4.28.1':
-    resolution: {integrity: sha512-/yqC2Y53oZjb0yz8PVuGOQQNOTwxcizudunl/tFs1aLvObTclTwZ0JhXF2XcPT/zuaymemCDSuuUPXJJyqeDOg==}
+  '@rollup/rollup-linux-riscv64-musl@4.62.4':
+    resolution: {integrity: sha512-jTn8JfHGL4djjFxPuM06LmNUJDsst2jeVlsd9OmIH6zc5sC9K6rIuO4YajXatLUpBmBKl6b35ro1QZocLi+tcA==}
+    cpu: [riscv64]
+    os: [linux]
+    libc: [musl]
+
+  '@rollup/rollup-linux-s390x-gnu@4.62.4':
+    resolution: {integrity: sha512-oCJCJL4pXsoDcP2QZ+JVlPTIRc6266zsIaeJJsWImmF7HO0W8nb6HuSgZlMWxJwaPf8ehbSw8yo0EUw925hKsA==}
     cpu: [s390x]
     os: [linux]
     libc: [glibc]
 
-  '@rollup/rollup-linux-x64-gnu@4.28.1':
-    resolution: {integrity: sha512-fzgeABz7rrAlKYB0y2kSEiURrI0691CSL0+KXwKwhxvj92VULEDQLpBYLHpF49MSiPG4sq5CK3qHMnb9tlCjBw==}
+  '@rollup/rollup-linux-x64-gnu@4.62.4':
+    resolution: {integrity: sha512-W69hukhZ3KKNRCaMIEzKvcFye42hh0FE1+YoYaf5+Ikacuftoco6yO/xouz0hc5d5W/s3yBro5jRiuEE/Q5vUw==}
     cpu: [x64]
     os: [linux]
     libc: [glibc]
 
-  '@rollup/rollup-linux-x64-musl@4.28.1':
-    resolution: {integrity: sha512-xQTDVzSGiMlSshpJCtudbWyRfLaNiVPXt1WgdWTwWz9n0U12cI2ZVtWe/Jgwyv/6wjL7b66uu61Vg0POWVfz4g==}
+  '@rollup/rollup-linux-x64-musl@4.62.4':
+    resolution: {integrity: sha512-qiXbGG2jkjXhzXpsFZSR2Xpb8DN/UaxYsbb/STbuR/6fpaDgRmmaq1B/LmtF2wQFOFOSsK2jdE0RZ3a0zHn4QA==}
     cpu: [x64]
     os: [linux]
     libc: [musl]
 
-  '@rollup/rollup-win32-arm64-msvc@4.28.1':
-    resolution: {integrity: sha512-wSXmDRVupJstFP7elGMgv+2HqXelQhuNf+IS4V+nUpNVi/GUiBgDmfwD0UGN3pcAnWsgKG3I52wMOBnk1VHr/A==}
+  '@rollup/rollup-openbsd-x64@4.62.4':
+    resolution: {integrity: sha512-nWeM//hxv8mIo6jD7Hu4o48DVmV9pbV6gsKaWU+4NFyqHoPKwrkRiZGLKUhOBk8qNmDmpwFtPKg80Bo/Tn4xiQ==}
+    cpu: [x64]
+    os: [openbsd]
+
+  '@rollup/rollup-openharmony-arm64@4.62.4':
+    resolution: {integrity: sha512-s62SQ/vgsRSvMwDkOEfTqfgASF0f26ZNaQuTA6Aok5lrikf89yI2W0gFHvZb2Jpgc6N8JnOKZgCK2iciO3CsxQ==}
+    cpu: [arm64]
+    os: [openharmony]
+
+  '@rollup/rollup-win32-arm64-msvc@4.62.4':
+    resolution: {integrity: sha512-J6wGf8TVGbXJq+HH+ttTvrcfNKPbuZecV6KT1B8I18BC5IURUh5kl4Yl5OEP5eFIUoI5BWxCsyYMhFsDx8kekw==}
     cpu: [arm64]
     os: [win32]
 
-  '@rollup/rollup-win32-ia32-msvc@4.28.1':
-    resolution: {integrity: sha512-ZkyTJ/9vkgrE/Rk9vhMXhf8l9D+eAhbAVbsGsXKy2ohmJaWg0LPQLnIxRdRp/bKyr8tXuPlXhIoGlEB5XpJnGA==}
+  '@rollup/rollup-win32-ia32-msvc@4.62.4':
+    resolution: {integrity: sha512-zmfrQd/0wu6oJs8Vq8KwY/YtsKSsLtKe/HwAP4Wqy8LhWjeT55fHRAkOhYQ12wI3ayS4Tt12d5CDRD7N96SAYQ==}
     cpu: [ia32]
     os: [win32]
 
-  '@rollup/rollup-win32-x64-msvc@4.28.1':
-    resolution: {integrity: sha512-ZvK2jBafvttJjoIdKm/Q/Bh7IJ1Ose9IBOwpOXcOvW3ikGTQGmKDgxTC6oCAzW6PynbkKP8+um1du81XJHZ0JA==}
+  '@rollup/rollup-win32-x64-gnu@4.62.4':
+    resolution: {integrity: sha512-qPzHqdj9rfUD+w79dtE07zi/kFwKyCJqplp5K5ygeLTp7jLpAoc16OAH39HSmRC9UpozaecsleI8uAdEj6v2yw==}
     cpu: [x64]
     os: [win32]
 
-  '@rushstack/node-core-library@5.7.0':
-    resolution: {integrity: sha512-Ff9Cz/YlWu9ce4dmqNBZpA45AEya04XaBFIjV7xTVeEf+y/kTjEasmozqFELXlNG4ROdevss75JrrZ5WgufDkQ==}
-    peerDependencies:
-      '@types/node': '*'
-    peerDependenciesMeta:
-      '@types/node':
-        optional: true
-
-  '@rushstack/rig-package@0.5.3':
-    resolution: {integrity: sha512-olzSSjYrvCNxUFZowevC3uz8gvKr3WTpHQ7BkpjtRpA3wK+T0ybep/SRUMfr195gBzJm5gaXw0ZMgjIyHqJUow==}
-
-  '@rushstack/terminal@0.14.0':
-    resolution: {integrity: sha512-juTKMAMpTIJKudeFkG5slD8Z/LHwNwGZLtU441l/u82XdTBfsP+LbGKJLCNwP5se+DMCT55GB8x9p6+C4UL7jw==}
-    peerDependencies:
-      '@types/node': '*'
-    peerDependenciesMeta:
-      '@types/node':
-        optional: true
-
-  '@rushstack/ts-command-line@4.22.6':
-    resolution: {integrity: sha512-QSRqHT/IfoC5nk9zn6+fgyqOPXHME0BfchII9EUPR19pocsNp/xSbeBCbD3PIR2Lg+Q5qk7OFqk1VhWPMdKHJg==}
+  '@rollup/rollup-win32-x64-msvc@4.62.4':
+    resolution: {integrity: sha512-zD6NdeWEByGE9QF9vCrlJ5YQB4oq9q91kPZS37Jwj5hOkvR1lTBSpsKhKDw4IJtbQ35LsTS1HD9DZYGKIshU1Q==}
+    cpu: [x64]
+    os: [win32]
 
   '@sec-ant/readable-stream@0.4.1':
     resolution: {integrity: sha512-831qok9r2t8AlxLko40y2ebgSDhenenCatLVeW/uBtnHPyhHOvG0C7TvfgecV+wHzIm5KUICgzmVpWS+IMEAeg==}
@@ -3873,133 +4977,481 @@ packages:
   '@simonwep/pickr@1.8.2':
     resolution: {integrity: sha512-/l5w8BIkrpP6n1xsetx9MWPWlU6OblN5YgZZphxan0Tq4BByTCETL6lyIeY8lagalS2Nbt4F2W034KHLIiunKA==}
 
-  '@sindresorhus/merge-streams@2.3.0':
-    resolution: {integrity: sha512-LtoMMhxAlorcGhmFYI+LhPgbPZCkgP6ra1YL604EeF6U98pLlQ3iWIGMdWSC+vWmPBWBNgmDBAhnAobLROJmwg==}
+  '@simple-libs/child-process-utils@2.0.0':
+    resolution: {integrity: sha512-dvNoRKLijXnD0XoJAz94pbNuB5GQgDr55UhpSPhffDkTT0Cmcqh9jSCOtwfT2d4H6MI9E7c4SgtMuJXZ6F3c6A==}
+    engines: {node: '>=22'}
+
+  '@simple-libs/stream-utils@2.0.0':
+    resolution: {integrity: sha512-fCTuZK4QBa+39Oz9l4OGfJfz+GpwCp3AqO7Zch3to99xHPgstVsRFpeQ8LNd2o1Gv8raL2mCFwiaHh7bFSp5DQ==}
+    engines: {node: '>=22'}
+
+  '@sindresorhus/is@4.6.0':
+    resolution: {integrity: sha512-t09vSN3MdfsyCHoFcTRCH/iUtG7OJ0CsjzB8cjAmKc/va/kIgeDI/TxsigdncE/4be734m0cvIYwNaV4i2XqAw==}
+    engines: {node: '>=10'}
+
+  '@sindresorhus/is@7.2.0':
+    resolution: {integrity: sha512-P1Cz1dWaFfR4IR+U13mqqiGsLFf1KbayybWwdd2vfctdV6hDpUkgCY0nKOLLTMSoRd/jJNjtbqzf13K8DCCXQw==}
     engines: {node: '>=18'}
 
   '@sindresorhus/merge-streams@4.0.0':
     resolution: {integrity: sha512-tlqY9xq5ukxTUZBmoOp+m61cqwQD5pHJtFY3Mn8CA8ps6yghLH/Hw8UPdqg4OLmFW3IFlcXnQNmo/dh8HzXYIQ==}
     engines: {node: '>=18'}
 
-  '@stylistic/stylelint-plugin@3.1.1':
-    resolution: {integrity: sha512-XagAHHIa528EvyGybv8EEYGK5zrVW74cHpsjhtovVATbhDRuJYfE+X4HCaAieW9lCkwbX6L+X0I4CiUG3w/hFw==}
-    engines: {node: ^18.12 || >=20.9}
+  '@speed-highlight/core@1.2.24':
+    resolution: {integrity: sha512-qeW2e1l78afw8VhRPfPQ1Gjj+KU5XFQ/OFV5ti6eTa9bruO7mJyZtA4vw0ofqmA3tKCkROE9xLk3VZoeRc98nw==}
+
+  '@standard-schema/spec@1.1.0':
+    resolution: {integrity: sha512-l2aFy5jALhniG5HgqrD6jXLi/rUWrKvqN/qJx6yoJsgKhblVd+iqqU4RCXavm/jPityDo5TCvKMnpjKnOriy0w==}
+
+  '@stylistic/stylelint-plugin@5.3.0':
+    resolution: {integrity: sha512-xbyxPeaO9Vns6A8/0MQV6PzZ5nNZCoGV4q1ERaNd5EBAKlWt+YcpaPapNYNUkZaiQg98+xPbikdA58ehquJG3g==}
     peerDependencies:
-      stylelint: ^16.8.0
+      stylelint: ^17.6.0
 
-  '@surma/rollup-plugin-off-main-thread@2.2.3':
-    resolution: {integrity: sha512-lR8q/9W7hZpMWweNiAKU7NQerBnzQQLvi8qnTDU/fxItPhtZVMbPV3lbCwjhIlNBe9Bbr5V+KHshvWmVSG9cxQ==}
+  '@swc/helpers@0.5.23':
+    resolution: {integrity: sha512-5lSsMOTXURePglDfvuAQUqkGek9Hg2kksOYay2m0+XR++b2NWYL/4sWyuvVBIs8oKnJaxkdi9whaL/sqN13afw==}
 
-  '@swc/helpers@0.5.15':
-    resolution: {integrity: sha512-JQ5TuMi45Owi4/BIMAJBoSQoOJu12oOk/gADqlcUL9JEdHB8vyjUSsxqeNXnmXHjYKMi2WcYtezGEEhqUI/E2g==}
+  '@szmarczak/http-timer@4.0.6':
+    resolution: {integrity: sha512-4BAffykYOgO+5nzBWYwE3W90sBgLJoUPRWWcL8wlyiM8IB8ipJz3UMJ9KXQd1RKQXpKp8Tutn80HZtWsu2u76w==}
+    engines: {node: '>=10'}
 
-  '@tailwindcss/nesting@0.0.0-insiders.565cd3e':
-    resolution: {integrity: sha512-WhHoFBx19TnH/c+xLwT/sxei6+4RpdfiyG3MYXfmLaMsADmVqBkF7B6lDalgZD9YdM459MF7DtxVbWkOrV7IaQ==}
+  '@tailwindcss/node@4.3.3':
+    resolution: {integrity: sha512-/T8IKEsf9VTU6tLjgC7+sv2mOPtQxzE2jMw7u4Tt40Tx+QSZxpzh95/H6cMKoja9XuW7iMdLJYBB0o9G1CaAgg==}
+
+  '@tailwindcss/oxide-android-arm64@4.3.3':
+    resolution: {integrity: sha512-Y85A2gmPSkl5Ve5qR86GL4HT509cFqQh1aes9p3sSkyTPwt0Pppf3GkwGe4JPACcRYjgJIEhQgM6dBClnr0NYw==}
+    engines: {node: '>= 20'}
+    cpu: [arm64]
+    os: [android]
+
+  '@tailwindcss/oxide-darwin-arm64@4.3.3':
+    resolution: {integrity: sha512-BiaWatpBcERQFDlOjRDpIVXuFK5PJez5SA4JMg6VYZdBYU+qKfV/vqjcIs+IYmtitf1xYQZTwXvU/8y4lfZUGw==}
+    engines: {node: '>= 20'}
+    cpu: [arm64]
+    os: [darwin]
+
+  '@tailwindcss/oxide-darwin-x64@4.3.3':
+    resolution: {integrity: sha512-fAeUqfV5ndhxRwai8cXGzdLvul9utWOmeTkv69unv4ZXixjn61Z+p9lCWdwOwA3TYboG3BwdVuN/RDjhBRl0mw==}
+    engines: {node: '>= 20'}
+    cpu: [x64]
+    os: [darwin]
+
+  '@tailwindcss/oxide-freebsd-x64@4.3.3':
+    resolution: {integrity: sha512-iyf5bV6+wnAlflVeEy7R25dupxTNECZN5QMI0qNT6eT+EgaGdZcKhGkr5SdoaWiLJ3spLqIY9VCeSGrwmtg4kw==}
+    engines: {node: '>= 20'}
+    cpu: [x64]
+    os: [freebsd]
+
+  '@tailwindcss/oxide-linux-arm-gnueabihf@4.3.3':
+    resolution: {integrity: sha512-aAYUprJAJQWWbRrPvtjdroZ56Md+JM8pMiopS6xGEwDfLhqj+2ver2p4nU4Mb3CRqcMmNBjo8KkUgcxhkzVQGQ==}
+    engines: {node: '>= 20'}
+    cpu: [arm]
+    os: [linux]
+
+  '@tailwindcss/oxide-linux-arm64-gnu@4.3.3':
+    resolution: {integrity: sha512-nDxldcEENOxZRzC2uu9jrutZdAAQtb+8WWDCSnWL1zvBk1+FN+x6MtDViPB5AJMfttVCUhehGWus3XBPgatM/w==}
+    engines: {node: '>= 20'}
+    cpu: [arm64]
+    os: [linux]
+    libc: [glibc]
+
+  '@tailwindcss/oxide-linux-arm64-musl@4.3.3':
+    resolution: {integrity: sha512-Md44bD6veX/PC5iyF8cDVnw4HBIANZepRZZ7a8DQOvkfo5WUBwcp6iAuCUz23u+4SUkhJlD3eL7hNdW8ezd/kA==}
+    engines: {node: '>= 20'}
+    cpu: [arm64]
+    os: [linux]
+    libc: [musl]
+
+  '@tailwindcss/oxide-linux-x64-gnu@4.3.3':
+    resolution: {integrity: sha512-tx7us1muwOKAKWao2v/GaafFeQboE6aj88vC6ziN2NCGcRm8gWUhwjzg+YdVB1e4boAtdtma4L43onunI6NS4w==}
+    engines: {node: '>= 20'}
+    cpu: [x64]
+    os: [linux]
+    libc: [glibc]
+
+  '@tailwindcss/oxide-linux-x64-musl@4.3.3':
+    resolution: {integrity: sha512-SJxX60smvHgasZoBy11dX6YRjXJFovwWBoedhbQPOBzgFWBHGB+TVPWB9BxzR7TTxU8FQZAI2AyiNCMzFm8Img==}
+    engines: {node: '>= 20'}
+    cpu: [x64]
+    os: [linux]
+    libc: [musl]
+
+  '@tailwindcss/oxide-wasm32-wasi@4.3.3':
+    resolution: {integrity: sha512-jx1+rPhY/5Ympkktd656HBWEBLxP7dH06losBLjjf5vgCODXvi9KhtftWcMIwTFIDqBr7cRnQkdLnAG+IOlGvQ==}
+    engines: {node: '>=14.0.0'}
+    cpu: [wasm32]
+    bundledDependencies:
+      - '@napi-rs/wasm-runtime'
+      - '@emnapi/core'
+      - '@emnapi/runtime'
+      - '@tybys/wasm-util'
+      - '@emnapi/wasi-threads'
+      - tslib
+
+  '@tailwindcss/oxide-win32-arm64-msvc@4.3.3':
+    resolution: {integrity: sha512-3rc292Ca2ceK6Ulcc/bAVnTs/3nDtoPhyEKlgPv+yQJQi/JS/AMJlqzxvlDacL1nekbrcf6bTqp/jV4qgnPxNQ==}
+    engines: {node: '>= 20'}
+    cpu: [arm64]
+    os: [win32]
+
+  '@tailwindcss/oxide-win32-x64-msvc@4.3.3':
+    resolution: {integrity: sha512-yJ0pwIVc/nYeGoV02WtsN8KYyLQv7kyI2wDnkezyJlGGjkd4QLwDGAwl47YpPJeuI0M0ObaXGSPjvWDPeTPggw==}
+    engines: {node: '>= 20'}
+    cpu: [x64]
+    os: [win32]
+
+  '@tailwindcss/oxide@4.3.3':
+    resolution: {integrity: sha512-krXjAikiaFSPaK/FkAQT5UTx3VormQaiZ5hBFlJZ9UFQGB/rwg1MZIhHAG9smMQRTdyJxP6Qt5MwMtdyU5FWrA==}
+    engines: {node: '>= 20'}
+
+  '@tailwindcss/typography@0.5.20':
+    resolution: {integrity: sha512-hwbzQuNUfcPvbegQFatVPl/MY/tcM9KLl963hQ5laJKPh81TEZ1+dNG9PirGvcaDBkp+BCshExAyKVPW91dozw==}
     peerDependencies:
-      postcss: ^8.2.15
+      tailwindcss: '>=3.0.0 || >=4.0.0 || insiders'
 
-  '@tailwindcss/typography@0.5.15':
-    resolution: {integrity: sha512-AqhlCXl+8grUz8uqExv5OTtgpjuVIwFTSXTrh8y9/pw6q2ek7fJ+Y8ZEVw7EB2DCcuCOtEjf9w3+J3rzts01uA==}
+  '@tailwindcss/vite@4.3.3':
+    resolution: {integrity: sha512-yYU8cogLeSh/ms2jh8Fj7jaba/EWa7Ja6GoUqYZaraEuCI5YS6ms6ObZgjjedm+jm6XZjdNRWBpPP6Z86oOxcw==}
     peerDependencies:
-      tailwindcss: '>=3.0.0 || insiders || >=4.0.0-alpha.20'
+      vite: ^5.2.0 || ^6 || ^7 || ^8
+
+  '@tanstack/devtools-event-client@0.4.4':
+    resolution: {integrity: sha512-6T5Yop/793YI+H+5J8Hsyj4kCih9sl4t3ElLgKioW5hk3ocn+ZdSJ94tT7vL7uabxSugWYBZlOTMPzEw2puvQw==}
+    engines: {node: '>=18'}
+    hasBin: true
+
+  '@tanstack/form-core@1.33.4':
+    resolution: {integrity: sha512-nqNaVAS+FfdWq6pfVqLC7SkgvRFyQEM9UEruIMTQULQ5SGF2X6+7RduFgr5ofpHftAHw/2yVs2vvIafx4WCVGQ==}
 
   '@tanstack/match-sorter-utils@8.19.4':
     resolution: {integrity: sha512-Wo1iKt2b9OT7d+YGhvEPD3DXvPv2etTusIMhMUoG7fbhmxcXCtIjJDEygy91Y2JFlwGyjqiBPRozme7UD8hoqg==}
     engines: {node: '>=12'}
 
-  '@tanstack/query-core@5.62.8':
-    resolution: {integrity: sha512-4fV31vDsUyvNGrKIOUNPrZztoyL187bThnoQOvAXEVlZbSiuPONpfx53634MKKdvsDir5NyOGm80ShFaoHS/mw==}
+  '@tanstack/pacer-lite@0.1.1':
+    resolution: {integrity: sha512-y/xtNPNt/YeyoVxE/JCx+T7yjEzpezmbb+toK8DDD1P4m7Kzs5YR956+7OKexG3f8aXgC3rLZl7b1V+yNUSy5w==}
+    engines: {node: '>=18'}
 
-  '@tanstack/store@0.6.0':
-    resolution: {integrity: sha512-+m2OBglsjXcLmmKOX6/9v8BDOCtyxhMmZLsRUDswOOSdIIR9mvv6i0XNKsmTh3AlYU8c1mRcodC8/Vyf+69VlQ==}
+  '@tanstack/query-core@5.101.4':
+    resolution: {integrity: sha512-gNwcvOJcRbLWPOLG/2OBm+zM+Yv+MKsXKEOWC57USuZDEsI71hEErQsiEGx5wX9rzWWkfwM0fVSPoiIFSsxfiw==}
 
-  '@tanstack/virtual-core@3.11.2':
-    resolution: {integrity: sha512-vTtpNt7mKCiZ1pwU9hfKPhpdVO2sVzFQsxoVBGtOSHxlrRRzYr8iQ2TlwbAcRYCcEiZ9ECAM8kBzH0v2+VzfKw==}
+  '@tanstack/store@0.11.1':
+    resolution: {integrity: sha512-mzTOBhypOuDJAy/D8n2MfUZ1HFkXnmSETviRyhqEC8LUE7/IZQExOTxMANj3KjTofYTkFNpBY67qaVrT41YccA==}
 
-  '@tanstack/vue-query@5.62.8':
-    resolution: {integrity: sha512-kOKTV6tu5iffq5/hOUpbohfwWH8nGhbCc9wf4UvihlhROILsWLrIPA5fOvdvc5VyozwKokdrubSdEukPZxpwXQ==}
+  '@tanstack/virtual-core@3.17.7':
+    resolution: {integrity: sha512-bp+v10y65sp2H7WpWfIMyxTNfl8ZVfxFTLRjPIFRryi6FV/J33z4IS53WO4pTk36KlvJ4iLiQz+oaydDC1xbcA==}
+
+  '@tanstack/vue-form@1.33.4':
+    resolution: {integrity: sha512-4cHeHupi5GzvKR0iDnLJSwh6s5iDlE5GOaafx4w5fuYwt5UgeXw0lhCVoBxz/OA/6eUI+shhDbb7JEorlg/l0g==}
+    peerDependencies:
+      vue: ^3.5.40
+
+  '@tanstack/vue-query@5.101.4':
+    resolution: {integrity: sha512-UYjkUZhnWQIFGNb7SdgjCitAftNyYQfOIVUh6vBUQAG4SQKNMSBKeQERFDubpxLAMpIBJTaOrE8fM4c1kZcIGQ==}
     peerDependencies:
       '@vue/composition-api': ^1.1.2
-      vue: ^3.5.13
+      vue: ^3.5.40
     peerDependenciesMeta:
       '@vue/composition-api':
         optional: true
 
-  '@tanstack/vue-store@0.6.0':
-    resolution: {integrity: sha512-QcvBEOG2dPiFw06LqEk1ehL7ZY0CJS8AKlW7uqmFFFzVost+Oj1oiQne9hW+L6O8f0ZnwFlD9fA5a7pTum8YeQ==}
+  '@tanstack/vue-store@0.11.1':
+    resolution: {integrity: sha512-0YmYwbiCQKhzfFTLpHybjoAVUh3GkQVYGguvGTzk/0wx0oWuni60huvRs1RqqRLJH6nig3PTYuLuQQ+X5s05gA==}
     peerDependencies:
       '@vue/composition-api': ^1.2.1
-      vue: ^3.5.13
+      vue: ^3.5.40
     peerDependenciesMeta:
       '@vue/composition-api':
         optional: true
 
-  '@tanstack/vue-virtual@3.11.2':
-    resolution: {integrity: sha512-y0b1p1FTlzxcSt/ZdGWY1AZ52ddwSU69pvFRYAELUSdLLxV8QOPe9dyT/KATO43UCb3DAwiyzi96h2IoYstBOQ==}
+  '@tanstack/vue-virtual@3.13.35':
+    resolution: {integrity: sha512-lOfSPvgPdlaH6Qy+CyIc3XpycitaSQ9GECndGpTuDiu+uDA1am+90yWXwzDSd/20ZM196ggWJLS+Qb6WjVd/OA==}
     peerDependencies:
-      vue: ^3.5.13
+      vue: ^3.5.40
 
-  '@tootallnate/once@1.1.2':
-    resolution: {integrity: sha512-RbzJvlNzmRq5c3O09UipeuXno4tA1FE6ikOjxZK0tuxVv3412l64l5t1W5pj4+rJq9vpkm/kwiR07aZXnsKPxw==}
-    engines: {node: '>= 6'}
+  '@tiptap/core@3.29.2':
+    resolution: {integrity: sha512-oKUkiPUB7noilVYxI9lNzUD4rX17sHub+PYjMfHMWHG9A3nvIy+FdePIVIIhThKWF7ijhr3eIqHY51Bn+GAFtw==}
+    peerDependencies:
+      '@tiptap/pm': 3.29.2
 
-  '@trysound/sax@0.2.0':
-    resolution: {integrity: sha512-L7z9BgrNEcYyUYtF+HaEfiS5ebkh9jXqbszz7pC0hRBPaatV0XjSD3+eHrpqFemQfgwiFF0QPIarnIihIDn7OA==}
-    engines: {node: '>=10.13.0'}
+  '@tiptap/extension-blockquote@3.29.2':
+    resolution: {integrity: sha512-ca4OzKDh0yaxg2+Z56bC2QnWsNsFp2YMRfVig1PDXyMVFMNJpLcnhxgq/9btn+xYAlYrj8RymOeCTYREOR6Zjg==}
+    peerDependencies:
+      '@tiptap/core': 3.29.2
+      '@tiptap/pm': 3.29.2
 
-  '@types/archiver@6.0.3':
-    resolution: {integrity: sha512-a6wUll6k3zX6qs5KlxIggs1P1JcYJaTCx2gnlr+f0S1yd2DoaEwoIK10HmBaLnZwWneBz+JBm0dwcZu0zECBcQ==}
+  '@tiptap/extension-bold@3.29.2':
+    resolution: {integrity: sha512-elYbGxJsYnBb4leqrcjdIJuiG380BcOgN+UUzvOv+qEjfGVzHodFOMBl3qnmD6urYHNu5/qQK2S0qSSRXKCLNQ==}
+    peerDependencies:
+      '@tiptap/core': 3.29.2
 
-  '@types/argparse@1.0.38':
-    resolution: {integrity: sha512-ebDJ9b0e702Yr7pWgB0jzm+CX4Srzz8RcXtLJDJB+BSccqMa36uyH/zUsSYao5+BD1ytv3k3rPYCq4mAE1hsXA==}
+  '@tiptap/extension-bubble-menu@3.29.2':
+    resolution: {integrity: sha512-kzcWarcpr031rZu+R3Hzut5uxb3Qj/xxMDEYZIQ3uiq1yb5vEMXj8/SIyWautk6Nu8Rr1leV3rGdR4NzhzyFAA==}
+    peerDependencies:
+      '@tiptap/core': 3.29.2
+      '@tiptap/pm': 3.29.2
 
-  '@types/bintrees@1.0.6':
-    resolution: {integrity: sha512-pZWT4Bz+tWwxlDspSjdoIza4PE5lbGI4Xvs3FZV/2v5m5SDA8LwNpU8AXxlndmARO7OaQ1Vf3zFenOsNMzaRkQ==}
+  '@tiptap/extension-bullet-list@3.29.2':
+    resolution: {integrity: sha512-3bWcCUPbCHv0XttlMdnAtXLNYWx2pblByMgxmGsaP9FU0QnslGXty6A6gHCqI33ygRg1vrA6U5Wtpwbi5aKu5g==}
+    peerDependencies:
+      '@tiptap/extension-list': 3.29.2
 
-  '@types/conventional-commits-parser@5.0.1':
-    resolution: {integrity: sha512-7uz5EHdzz2TqoMfV7ee61Egf5y6NkcO4FB/1iCCQnbeiI1F3xzv3vK5dBCXUCLQgGYS+mUeigK1iKQzvED+QnQ==}
+  '@tiptap/extension-code-block@3.29.2':
+    resolution: {integrity: sha512-w153ct8g6dLiPTdXQ6SOIMxX4SEo5Q50AmjdEEEcJ7ZcYUcde/ScSskLHfOYmyt5ZFAiyEwr121+pux+p3/oAQ==}
+    peerDependencies:
+      '@tiptap/core': 3.29.2
+      '@tiptap/pm': 3.29.2
 
-  '@types/doctrine@0.0.9':
-    resolution: {integrity: sha512-eOIHzCUSH7SMfonMG1LsC2f8vxBFtho6NGBznK41R84YzPuvSBzrhEps33IsQiOW9+VL6NQ9DbjQJznk/S4uRA==}
+  '@tiptap/extension-code@3.29.2':
+    resolution: {integrity: sha512-c6W5UGuB7WNLpYocsgRzpO2OOTI4QjaI9jjHRMuty9z+s9DtaYM/HrRLNwVh6MopkHb+i/89Wkv8gCS34fftig==}
+    peerDependencies:
+      '@tiptap/core': 3.29.2
 
-  '@types/eslint@9.6.1':
-    resolution: {integrity: sha512-FXx2pKgId/WyYo2jXw63kk7/+TY7u7AziEJxJAnSFzHlqTAS3Ync6SvgYAN/k4/PQpnnVuzoMuVnByKK2qp0ag==}
+  '@tiptap/extension-document@3.29.2':
+    resolution: {integrity: sha512-YUamvefLnsqu6124GavVTI7nqcFlQJ12ROB0oSwG69eSBZYNjg1tIs05LFrBxkwf4Xgqd6YzfJ9+FeG428RvzQ==}
+    peerDependencies:
+      '@tiptap/core': 3.29.2
 
-  '@types/estree@0.0.39':
-    resolution: {integrity: sha512-EYNwp3bU+98cpU4lAWYYL7Zz+2gryWH1qbdDTidVd6hkiR6weksdbMadyXKXNPEkQFhXM+hVO9ZygomHXp+AIw==}
+  '@tiptap/extension-dropcursor@3.29.2':
+    resolution: {integrity: sha512-KKno7cU9r1HdR48CRrsDu69/1UjZdoslq/UcE+Kx+tdhAv/aljXMkRSNzGMrBNOBDmHRgS1+58zm21WQWdQzwA==}
+    peerDependencies:
+      '@tiptap/extensions': 3.29.2
 
-  '@types/estree@1.0.6':
-    resolution: {integrity: sha512-AYnb1nQyY49te+VRAVgmzfcgjYS91mY5P0TKUDCLEM+gNnA+3T6rWITXRLYCpahpqSQbN5cE+gHpnPyXjHWxcw==}
+  '@tiptap/extension-floating-menu@3.29.2':
+    resolution: {integrity: sha512-CBTq4Xs5aGWr65uFCIkKBms796OhmirWf/ax//iJ4fl9IfwqjwFuc2vQs9PmuwpKn9ctDHo2sMTtvyeCvIt5LQ==}
+    peerDependencies:
+      '@floating-ui/dom': ^1.0.0
+      '@tiptap/core': 3.29.2
+      '@tiptap/pm': 3.29.2
 
-  '@types/fs-extra@11.0.4':
-    resolution: {integrity: sha512-yTbItCNreRooED33qjunPthRcSjERP1r4MqCZc7wv0u2sUkzTFp45tgUfS5+r7FrZPdmCCNflLhVSP/o+SemsQ==}
+  '@tiptap/extension-gapcursor@3.29.2':
+    resolution: {integrity: sha512-8Q39UR4/Tit759IeW9xZIe3NMwN11GsuA3FLheDyyGn7RrW02HD3HhUDlazE54Ki4HoosjFmChPlN4Ik2ubdRQ==}
+    peerDependencies:
+      '@tiptap/extensions': 3.29.2
+
+  '@tiptap/extension-hard-break@3.29.2':
+    resolution: {integrity: sha512-eUW3LN3fq8rXnjEUeI3D2QONYdLsU3yYQm4jxlErs2h4cfwrFjgf19VSUFVmm6LrFbbQ0OnDVPeVLL6iOwDw2w==}
+    peerDependencies:
+      '@tiptap/core': 3.29.2
+
+  '@tiptap/extension-heading@3.29.2':
+    resolution: {integrity: sha512-6W4aIy70Mh7BNlbG9zZ5FBLhJhU2UUEzgZJ/jwYSCcB30o8McLxJSEjhtoHiX8R78Ah2/JzBGvIe5olZlbeE4A==}
+    peerDependencies:
+      '@tiptap/core': 3.29.2
+
+  '@tiptap/extension-highlight@3.29.2':
+    resolution: {integrity: sha512-bSeZ1C8OlthyK7BzgtqOGfQymdap9V38W2hbr9KGlhVOIAmTqneOwjm27iFcu7jKqkMArVu6WBYN18Lom6umHQ==}
+    peerDependencies:
+      '@tiptap/core': 3.29.2
+
+  '@tiptap/extension-horizontal-rule@3.29.2':
+    resolution: {integrity: sha512-8/ZPzbB9X85Mc9/7xVLZupQKBr2UVcQTGr512xtqMW+XkCQRHCph46tRo828YE13IMWI5fWn/FaNCqXG9cULSw==}
+    peerDependencies:
+      '@tiptap/core': 3.29.2
+      '@tiptap/pm': 3.29.2
+
+  '@tiptap/extension-image@3.29.2':
+    resolution: {integrity: sha512-F+S4iru247mNVZdkNwNDZHeb281DkjsBJinaOGsOyJTvXY+KU5Uq7vY1LQTn493dTfU48Z0yMBUXwJffCT92Mg==}
+    peerDependencies:
+      '@tiptap/core': 3.29.2
+
+  '@tiptap/extension-italic@3.29.2':
+    resolution: {integrity: sha512-iH63V/5wsaMnY4Jz0+meaAGhaec4AiOzOduzl6ZZr5IyGhZ1kthyW84ELt0dyLI3hNceAUhaNWc+I7+vX0aoXA==}
+    peerDependencies:
+      '@tiptap/core': 3.29.2
+
+  '@tiptap/extension-link@3.29.2':
+    resolution: {integrity: sha512-DcVer5SqrexKCEP6Ip1UPxJUMvcRCCItSv0wxoGytanrimBh2smvcg6X0DWnjlsi5H0updhyl+atYCmmQXUIXA==}
+    peerDependencies:
+      '@tiptap/core': 3.29.2
+      '@tiptap/pm': 3.29.2
+
+  '@tiptap/extension-list-item@3.29.2':
+    resolution: {integrity: sha512-s8vBVHHFT0Qpu7CzAZ7S1kYmSiVaDvUNvMNcZUWnxj6VPfiwmx0eXd9FsjePrRCMoM5tFmPnhFTHDxY3D/eZeQ==}
+    peerDependencies:
+      '@tiptap/extension-list': 3.29.2
+
+  '@tiptap/extension-list-keymap@3.29.2':
+    resolution: {integrity: sha512-R+3k8OLnxdCH7Xy9ieOwUt5m2Je74u8mikothGmsYVO2Zyq48fIbmZ+X6RBPCu7DBOI2FIUhHEFbKQeDWvDNmA==}
+    peerDependencies:
+      '@tiptap/extension-list': 3.29.2
+
+  '@tiptap/extension-list@3.29.2':
+    resolution: {integrity: sha512-WPZ9BHAPT6QeIm1vdVkuoOWvy9a8/EZeJwV2VhU8LXyTAttvzyj4rsbbHyJWvYWlUSTt/QF2AZ2zhKo7u1w3/A==}
+    peerDependencies:
+      '@tiptap/core': 3.29.2
+      '@tiptap/pm': 3.29.2
+
+  '@tiptap/extension-ordered-list@3.29.2':
+    resolution: {integrity: sha512-ndCunC+UsYOpkOtL7vGnDz21UNa45WUlcO9wMT1fbuYow2QnRhsuMlCWENXI52YPPARWuQ0RDgN7q6TaxPERBg==}
+    peerDependencies:
+      '@tiptap/extension-list': 3.29.2
+
+  '@tiptap/extension-paragraph@3.29.2':
+    resolution: {integrity: sha512-7qJj5YTr11vvjNgjDN1ypOfwTovc0QOCYcit/rskeuVgnmQZOZQzC/BbyKLLG7UGnpRLemU/mEGbW9pAqjAXkQ==}
+    peerDependencies:
+      '@tiptap/core': 3.29.2
+
+  '@tiptap/extension-placeholder@3.29.2':
+    resolution: {integrity: sha512-/BlpPIq2JZk6zLaeYVOXazi6dmd0iRriTymNEnFn1doManN1y5HED9LsMeb/AhNhauL5AgmcHgpvAjbsN9k4SA==}
+    peerDependencies:
+      '@tiptap/extensions': 3.29.2
+
+  '@tiptap/extension-strike@3.29.2':
+    resolution: {integrity: sha512-aEvLAbddUQZ+FukCreV3q4G2HfNI+odE7E9U+wbq6XsSWKyo8/pDu1muz+TFKNre4blSMOQ3JQmw5UeHDKy+fg==}
+    peerDependencies:
+      '@tiptap/core': 3.29.2
+
+  '@tiptap/extension-text-align@3.29.2':
+    resolution: {integrity: sha512-205FF87zjUEh79n6dgVy9SMj1P+rNserHMqPd8lF7YS2TOWikXPG4PFuQHWXXCYzaCvQXAiATSAyPXXmUWUvaQ==}
+    peerDependencies:
+      '@tiptap/core': 3.29.2
+
+  '@tiptap/extension-text-style@3.29.2':
+    resolution: {integrity: sha512-aQad9V9ROaEi3hE4g5z9wQ6lv5FSnzlnWFMVJxRjNlwXgm7H0fymxb4rGfca+pAwYkiRwpKYh1LatpJw2ECQAA==}
+    peerDependencies:
+      '@tiptap/core': 3.29.2
+
+  '@tiptap/extension-text@3.29.2':
+    resolution: {integrity: sha512-Ubko45JWWHe8glBt2PiGNF8hcbys/JNalFhiR7Y1X4iOOtAxAKJJxh3+eq+//NTlGuBPdWGp7zw8EEUp7anjKA==}
+    peerDependencies:
+      '@tiptap/core': 3.29.2
+
+  '@tiptap/extension-underline@3.29.2':
+    resolution: {integrity: sha512-K7XwH/xS/5AIREWQ00VTEf/W5U0olp7j6wwit7cdd/8nHv6h6AGr1+iEApHKoLXWQZLfGQKzJlT9W61LAl+fHA==}
+    peerDependencies:
+      '@tiptap/core': 3.29.2
+
+  '@tiptap/extensions@3.29.2':
+    resolution: {integrity: sha512-BCz+FCAChSYtUe4BFj97HEO+nSK+J7GxbJgZG4Hg7DT/gI+hRyeNndU8efiQAx3WGdzsFi3UxRpcF1tTQM7iMQ==}
+    peerDependencies:
+      '@tiptap/core': 3.29.2
+      '@tiptap/pm': 3.29.2
+
+  '@tiptap/pm@3.29.2':
+    resolution: {integrity: sha512-GCOme7xHaS+DSoaA4CDcAD3l6JyBlvZhvCyfsy2Vp6j8tEoBkZWio7soYVosmlyn7zq8/64VeFZP5s47yfG7fQ==}
+
+  '@tiptap/starter-kit@3.29.2':
+    resolution: {integrity: sha512-oTu0tysiqk4zgjEtxRHjAQgxUKaAevZwueOWwSWubHdokqp7SpcbE5n9USJv89HKuTUDm3GjnQH6q8HNn/2DsA==}
+
+  '@tiptap/vue-3@3.29.2':
+    resolution: {integrity: sha512-rLX+V+HXbsVlk+My8mslvbnbVXZiQZHYtbOiRgxugsqZ9SK1mr1FpgZ/ZNcotJAjecT8FJmPa45ccDnVu66eGA==}
+    peerDependencies:
+      '@floating-ui/dom': ^1.0.0
+      '@tiptap/core': 3.29.2
+      '@tiptap/pm': 3.29.2
+      vue: ^3.5.40
+
+  '@trickfilm400/rollup-plugin-off-main-thread@3.0.0-pre1':
+    resolution: {integrity: sha512-/67zpWDBLV+oYAEL682s1ktXL0HgqX76f6gaVGkGnVZlBbm1zd0v4Bz8MFF2GGhoX9rvfq3KSQHubFHwa6w6/Q==}
+    engines: {node: '>=12'}
+
+  '@tsdown/css@0.22.14':
+    resolution: {integrity: sha512-0NpbgqfhfjaAoLdY3DxjrMo08vKFEtvlybCS42Gtolx8OPoKUdZZDyls0qgNEqea0c7XGjlF0NIE1tIxgU8RqA==}
+    engines: {node: ^22.18.0 || >=24.11.0}
+    peerDependencies:
+      postcss: ^8.4.0
+      postcss-import: ^16.0.0
+      postcss-modules: ^6.0.0
+      sass: '*'
+      sass-embedded: '*'
+      tsdown: 0.22.14
+    peerDependenciesMeta:
+      postcss:
+        optional: true
+      postcss-import:
+        optional: true
+      postcss-modules:
+        optional: true
+      sass:
+        optional: true
+      sass-embedded:
+        optional: true
+
+  '@turbo/darwin-64@2.10.9':
+    resolution: {integrity: sha512-Jh+pTGXLNz8+1tkUU13TI/f+ZOI+OvC4YbHi1H+57iSpLt5DR3xgptd+4sA07RdjdRR/RX/01uQQu2OkbzIefA==}
+    cpu: [x64]
+    os: [darwin]
+
+  '@turbo/darwin-arm64@2.10.9':
+    resolution: {integrity: sha512-aqtpPkiIC4IUas8Vv27oJ3aDfTuP1d5wofd01dZ7gfhHRrIKuFdqQb4imvNnVFahcOViF9Jh8Oi7feDoz8/ciA==}
+    cpu: [arm64]
+    os: [darwin]
+
+  '@turbo/linux-64@2.10.9':
+    resolution: {integrity: sha512-XyAneUBsS5uNOUOjBSs81zyigMVwwhVUd3u7F2JFMKGQk6F7eNAiOEBASJ+aHLldjYsOEjhfW+5gWIqwziyFFw==}
+    cpu: [x64]
+    os: [android, linux]
+
+  '@turbo/linux-arm64@2.10.9':
+    resolution: {integrity: sha512-5jAcldLnkuWIjujGhCn2MGIeUwW8IVNOq9Sce4EEzzgLcxmhTasbV0RiW6ZkaRdOjmOCGzeNXPLkDJEOIucOLw==}
+    cpu: [arm64]
+    os: [android, linux]
+
+  '@turbo/windows-64@2.10.9':
+    resolution: {integrity: sha512-u1xGpGlefzuhBedbt/VR2nWdftfFVZwPeDg9e5uZl68sV1fL3HNYTNr5VyHkzgtPK2VTYg1x4OKZuGrh1Gvhtg==}
+    cpu: [x64]
+    os: [win32]
+
+  '@turbo/windows-arm64@2.10.9':
+    resolution: {integrity: sha512-W2Ub165Qv0iMFljbYKxxbZN+2dVSngnzEjQNEFXtnz5oJVx9XSypmNmUvMtuYMeZ3kdVC1zI7yd/rtuX+SDnbg==}
+    cpu: [arm64]
+    os: [win32]
+
+  '@tybys/wasm-util@0.10.3':
+    resolution: {integrity: sha512-F3fo1MYrRJYL3zER0OUOmkutjr1Vp23m7OsSgp7nq4SP6OqX6C/56XFIPAl5bt3zaBRjmW7SGz3u/6LwFpYcOg==}
+
+  '@types/archiver@8.0.0':
+    resolution: {integrity: sha512-YpXPbEuv9+eUIPPQWUPahj3cvs9isWRuF+J4z+KbdYVDO3rWorWQFxUVHnwPu2AgKwvgpki5F2VMX0Xx+mX45A==}
+
+  '@types/cacheable-request@6.0.3':
+    resolution: {integrity: sha512-IQ3EbTzGxIigb1I3qPZc1rWJnH0BmSKv5QYTalEwweFvyBDLSAe24zP0le/hyi7ecGfZVlIVAg4BZqb8WBwKqw==}
+
+  '@types/chai@5.2.3':
+    resolution: {integrity: sha512-Mw558oeA9fFbv65/y4mHtXDs9bPnFMZAL/jxdPFUpOHHIXX91mcgEHbS5Lahr+pwZFR8A7GQleRWeI6cGFC2UA==}
+
+  '@types/debug@4.1.13':
+    resolution: {integrity: sha512-KSVgmQmzMwPlmtljOomayoR89W4FynCAi3E8PPs7vmDVPe84hT+vGPKkJfThkmXs0x0jAaa9U8uW8bbfyS2fWw==}
+
+  '@types/deep-eql@4.0.2':
+    resolution: {integrity: sha512-c9h9dVVMigMPc4bwTvC5dxqtqJZwQPePsWjPlpSOnojbor6pGqdk541lfA7AqFQr5pB1BRdq0juY9db81BwyFw==}
+
+  '@types/esrecurse@4.3.1':
+    resolution: {integrity: sha512-xJBAbDifo5hpffDBuHl0Y8ywswbiAp/Wi7Y/GtAgSlZyIABppyurxVueOPE8LUQOxdlgi6Zqce7uoEpqNTeiUw==}
+
+  '@types/estree@1.0.9':
+    resolution: {integrity: sha512-GhdPgy1el4/ImP05X05Uw4cw2/M93BCUmnEvWZNStlCzEKME4Fkk+YpoA5OiHNQmoS7Cafb8Xa3Pya8m1Qrzeg==}
+
+  '@types/fs-extra@9.0.13':
+    resolution: {integrity: sha512-nEnwB++1u5lVDM2UI4c1+5R+FYaKfaAzS4OococimjVm3nQw3TuzH5UNsocrcTBbhnerblyHj4A49qXbIiZdpA==}
 
   '@types/html-minifier-terser@7.0.2':
     resolution: {integrity: sha512-mm2HqV22l8lFQh4r2oSsOEVea+m0qqxEmwpc9kC1p/XzmjLWrReR9D/GRs8Pex2NX/imyEH9c5IU/7tMBQCHOA==}
 
-  '@types/http-proxy@1.17.15':
-    resolution: {integrity: sha512-25g5atgiVNTIv0LBDTg1H74Hvayx0ajtJPLLcYE3whFv75J0pWNtOBzaXJQgDTmrX1bx5U9YC2w/n65BN1HwRQ==}
+  '@types/http-cache-semantics@4.2.0':
+    resolution: {integrity: sha512-L3LgimLHXtGkWikKnsPg0/VFx9OGZaC+eN1u4r+OB1XRqH3meBIAVC2zr1WdMH+RHmnRkqliQAOHNJ/E0j/e0Q==}
+
+  '@types/jsesc@2.5.1':
+    resolution: {integrity: sha512-9VN+6yxLOPLOav+7PwjZbxiID2bVaeq0ED4qSQmdQTdjnXJSaCVKTR58t15oqH1H5t8Ng2ZX1SabJVoN9Q34bw==}
+
+  '@types/json-bigint@1.0.4':
+    resolution: {integrity: sha512-ydHooXLbOmxBbubnA7Eh+RpBzuaIiQjh8WGJYQB50JFGFrdxW7JzVlyEV7fAXw0T2sqJ1ysTneJbiyNLqZRAag==}
 
   '@types/json-schema@7.0.15':
     resolution: {integrity: sha512-5+fP8P8MFNC+AyZCDxrB2pkZFPGzqQWUzpSeuuVLvm8VMcorNYavBqoFcxK8bQz4Qsbn4oUEEem4wDLfcysGHA==}
 
-  '@types/jsonfile@6.1.4':
-    resolution: {integrity: sha512-D5qGUYwjvnNNextdU59/+fI+spnwtTFmyQP0h+PfIOSkNfpU6AOICUOkm4i0OnSk+NyjdPJrxCDro0sJsWlRpQ==}
+  '@types/keyv@3.1.4':
+    resolution: {integrity: sha512-BQ5aZNSCpj7D6K2ksrRCTmKRLEpnPvWDiLPfoGyhZ++8YtiK9d/3DBKPJgry359X/P1PfruyYwvnvwFjuEiEIg==}
 
   '@types/linkify-it@5.0.0':
     resolution: {integrity: sha512-sVDA58zAw4eWAffKOaQH5/5j3XeayukzDk+ewSsnv3p4yJEZHCCzMDiZM8e0OUrRvmpGZ85jf4yDHkHsgBNr9Q==}
 
+  '@types/lodash-es@4.17.12':
+    resolution: {integrity: sha512-0NgftHUcV4v34VhXm8QBSftKVXtbkBG3ViCjs6+eJ5a6y6Mi/jiFGPc1sC7QK+9BFhWrURE3EOggmWaSxL9OzQ==}
+
   '@types/lodash.clonedeep@4.5.9':
     resolution: {integrity: sha512-19429mWC+FyaAhOLzsS8kZUsI+/GmBAQ0HFiCPsKGU+7pBXOQWhyrY6xNNDwUSX8SMZMJvuFVMF9O5dQOlQK9Q==}
 
-  '@types/lodash.get@4.4.9':
-    resolution: {integrity: sha512-J5dvW98sxmGnamqf+/aLP87PYXyrha9xIgc2ZlHl6OHMFR2Ejdxep50QfU0abO1+CH6+ugx+8wEUN1toImAinA==}
-
-  '@types/lodash.isequal@4.5.8':
-    resolution: {integrity: sha512-uput6pg4E/tj2LGxCZo9+y27JNyB2OZuuI/T5F+ylVDYuqICLG2/ktjxx0v6GvVntAf8TvEzeQLcV0ffRirXuA==}
-
-  '@types/lodash@4.17.13':
-    resolution: {integrity: sha512-lfx+dftrEZcdBPczf9d0Qv0x+j/rfNCMuC6OcfXmO8gkfeNAY88PgKUbvG56whcN23gc27yenwF6oJZXGFpYxg==}
+  '@types/lodash@4.17.25':
+    resolution: {integrity: sha512-+K1NIO8I+F9/wNulfVvu23QYd0Pe9/OCqRrim4NoYIf1VoEDL90Ve4ClzpyqBLc7NpGGWRvYNCKZ1BE/Jpf8dQ==}
 
   '@types/markdown-it@14.1.2':
     resolution: {integrity: sha512-promo4eFwuiW+TfGxhi+0x3czqTYJkG8qB17ZUJiVF10Xm7NLVRSLUsfRTU/6h1e24VvRnXCx+hG7li58lkzog==}
@@ -4007,8 +5459,8 @@ packages:
   '@types/mdurl@2.0.0':
     resolution: {integrity: sha512-RGdgjQUZba5p6QEFAVx2OGb8rQDL/cPRG7GiedRzMcJ1tYnUANBncjbSB1NRGwbvjcPeikRABz2nshyPk1bhWg==}
 
-  '@types/minimatch@3.0.5':
-    resolution: {integrity: sha512-Klz949h02Gz2uZCMGwDUSDS1YBlTdDDgbWHi+81l29tQALUtvz4rAYi5uoVhE5Lagoq6DeqAUlbrHvW/mXDgdQ==}
+  '@types/ms@2.1.0':
+    resolution: {integrity: sha512-GsCCIZDE/p3i96vtEqx+7dBUGXrc7zeSK3wwPHIaRThS+9OhWIXRqzs4d6k1SVU8g91DrNRWxWUGhp5KXQb2VA==}
 
   '@types/node@12.20.55':
     resolution: {integrity: sha512-J8xLz7q2OFulZ2cyGTLE1TbbZcjpno7FaN6zdJNrgAdrJ+DZzh/uFR6YrTb4C+nXakvud8Q4+rbhoIWlYQbUFQ==}
@@ -4016,23 +5468,23 @@ packages:
   '@types/node@14.18.63':
     resolution: {integrity: sha512-fAtCfv4jJg+ExtXhvCkCqUKZ+4ok/JQk01qDKhL5BDDoS3AxKXhV5/MAVUZyQnSEd2GT92fkgZl0pz0Q0AzcIQ==}
 
-  '@types/node@22.10.2':
-    resolution: {integrity: sha512-Xxr6BBRCAOQixvonOye19wnzyDiUtTeqldOOmj3CkeblonbccA12PFwlufvRdrpjXxqnmUaeiU5EOA+7s5diUQ==}
+  '@types/node@24.13.3':
+    resolution: {integrity: sha512-Dh8vAsV36ig5wa9OX4pXvMc9D3Veibfw2wix0CUwYODLD8nkj9UsLjASr49nPg+2eKzxhBV+v7L8pXvT4e639Q==}
 
-  '@types/normalize-package-data@2.4.4':
-    resolution: {integrity: sha512-37i+OaWTh9qeK4LSHPsyRC7NahnGotNuZvjLSgcPzblpHB3rrCJxAOgI5gCdKm7coonsaX1Of0ILiTcnZjbfxA==}
+  '@types/node@25.9.5':
+    resolution: {integrity: sha512-OScDchr2fwuUmWdf4kZ9h7PcJiYDVInhJizG/biAq3cAvqwYktuy/TYGGdZNMtNTFUP7rnb0NU4TUdm82kt4Rg==}
+
+  '@types/node@26.2.0':
+    resolution: {integrity: sha512-5IviulTZeRNp2vAJ514cc/HUlY5nZ9fCbq9DMyC52BrhFZACo3nI0R7qBxhQmo/d27NFe96ur/b7Wwxklda+kg==}
 
   '@types/nprogress@0.2.3':
     resolution: {integrity: sha512-k7kRA033QNtC+gLc4VPlfnue58CM1iQLgn1IMAU8VPHGOj7oIHPp9UlhedEnD/Gl8evoCjwkZjlBORtZ3JByUA==}
 
-  '@types/parse-json@4.0.2':
-    resolution: {integrity: sha512-dISoDXWWQwUquiKsyZ4Ng+HX2KsPL7LyHKHQwgGFEA3IaKac4Obd+h2a/a6waisAoepJlBcx9paWqjA8/HVjCw==}
+  '@types/qrcode@1.5.6':
+    resolution: {integrity: sha512-te7NQcV2BOvdj2b1hCAHzAoMNuj65kNBMz0KBaxM6c3VGBOhU0dURQKOtH8CFNI/dsKkwlv32p26qYQTWoB5bw==}
 
-  '@types/postcss-import@14.0.3':
-    resolution: {integrity: sha512-raZhRVTf6Vw5+QbmQ7LOHSDML71A5rj4+EqDzAbrZPfxfoGzFxMHRCq16VlddGIZpHELw0BG4G0YE2ANkdZiIQ==}
-
-  '@types/qrcode@1.5.5':
-    resolution: {integrity: sha512-CdfBi/e3Qk+3Z/fXYShipBT13OJ2fDO2Q2w5CIP5anLTLIndQG9z6P1cnm+8zCWSpm5dnxMFd/uREtb0EXuQzg==}
+  '@types/qs@6.15.1':
+    resolution: {integrity: sha512-GZHUBZR9hckSUhrxmp1nG6NwdpM9fCunJwyThLW1X3AyHgd9IlHb6VANpQQqDr2o/qQp6McZ3y/IA2rVzKzSbw==}
 
   '@types/readdir-glob@1.1.5':
     resolution: {integrity: sha512-raiuEPUYqXu+nvtY2Pe8s8FEmZ3x5yAH4VkLdihcPdalvsHltomrRC9BzuStrJ9yk06470hS0Crw0f1pXqD+Hg==}
@@ -4040,265 +5492,490 @@ packages:
   '@types/resolve@1.20.2':
     resolution: {integrity: sha512-60BCwRFOZCQhDncwQdxxeOEEkbc5dIMccYLwbxsS4TUNeVECQ/pBJ0j09mrHOl/JJvpRPGwO9SvE4nR2Nb/a4Q==}
 
-  '@types/sortablejs@1.15.8':
-    resolution: {integrity: sha512-b79830lW+RZfwaztgs1aVPgbasJ8e7AXtZYHTELNXZPsERt4ymJdjV4OccDbHQAvHrCcFpbF78jkm0R6h/pZVg==}
+  '@types/responselike@1.0.3':
+    resolution: {integrity: sha512-H/+L+UkTV33uf49PH5pCAUBVPNj2nDBXTN+qS1dOwyyg24l3CcicicCA7ca+HMvJBZcFgl5r8e+RR6elsb4Lyw==}
+
+  '@types/sortablejs@1.15.9':
+    resolution: {integrity: sha512-7HP+rZGE2p886PKV9c9OJzLBI6BBJu1O7lJGYnPyG3fS4/duUCcngkNCjsLwIMV+WMqANe3tt4irrXHSIe68OQ==}
+
+  '@types/tinycolor2@1.4.6':
+    resolution: {integrity: sha512-iEN8J0BoMnsWBqjVbWH/c0G0Hh7O21lpR2/+PrvAVgWdzL7eexIFm4JN/Wn10PTcmNdtS6U67r499mlWMXOxNw==}
 
   '@types/trusted-types@2.0.7':
     resolution: {integrity: sha512-ScaPdn1dQczgbl0QFTeTOmVHFULt394XJgOQNoyVhZ6r2vLnMLJfBPd53SB52T/3G36VI1/g2MZaX0cwDuXsfw==}
 
-  '@types/web-bluetooth@0.0.20':
-    resolution: {integrity: sha512-g9gZnnXVq7gM7v3tJCWV/qw7w+KeOlSHAhgF9RytFyifW6AF61hdT2ucrYhPq9hLs5JIryeupHV3qGk95dH9ow==}
+  '@types/validator@13.15.10':
+    resolution: {integrity: sha512-T8L6i7wCuyoK8A/ZeLYt1+q0ty3Zb9+qbSSvrIVitzT3YjZqkTZ40IbRsPanlB4h1QB3JVL1SYCdR6ngtFYcuA==}
 
-  '@typescript-eslint/eslint-plugin@8.18.1':
-    resolution: {integrity: sha512-Ncvsq5CT3Gvh+uJG0Lwlho6suwDfUXH0HztslDf5I+F2wAFAZMRwYLEorumpKLzmO2suAXZ/td1tBg4NZIi9CQ==}
+  '@types/web-bluetooth@0.0.21':
+    resolution: {integrity: sha512-oIQLCGWtcFZy2JW77j9k8nHzAOpqMHLQejDA48XXMWH6tjCQHz5RCFz1bzsmROyL6PUm+LLnUiI4BCn221inxA==}
+
+  '@types/whatwg-mimetype@3.0.2':
+    resolution: {integrity: sha512-c2AKvDT8ToxLIOUlN51gTiHXflsfIFisS4pO7pDPoKouJCESkhZnEy623gwP9laCy5lnLDAw1vAzu2vM2YLOrA==}
+
+  '@types/ws@8.18.1':
+    resolution: {integrity: sha512-ThVF6DCVhA8kUGy+aazFQ4kXQ7E1Ty7A3ypFOe0IcJV8O/M511G99AW24irKrW56Wt44yG9+ij8FaqoBGkuBXg==}
+
+  '@typescript-eslint/parser@8.66.0':
+    resolution: {integrity: sha512-X6ypGChaWYk6PBtUg2BwuTZEFFcHJAtGTVJ9/lCTOufhZ4i9fNolQNnktq+kkMCwMj7V8Svsq7+TxSDslmhE0g==}
     engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
     peerDependencies:
-      '@typescript-eslint/parser': ^8.0.0 || ^8.0.0-alpha.0
-      eslint: ^8.57.0 || ^9.0.0
-      typescript: '>=4.8.4 <5.8.0'
+      eslint: ^8.57.0 || ^9.0.0 || ^10.0.0
+      typescript: '>=4.8.4 <6.1.0'
 
-  '@typescript-eslint/parser@8.18.1':
-    resolution: {integrity: sha512-rBnTWHCdbYM2lh7hjyXqxk70wvon3p2FyaniZuey5TrcGBpfhVp0OxOa6gxr9Q9YhZFKyfbEnxc24ZnVbbUkCA==}
+  '@typescript-eslint/project-service@8.66.0':
+    resolution: {integrity: sha512-7MthGPTt4BP69lSryqpqq8HQqxuzynssckL/jyDyk3+TNMQ3y2jFWkptCrktWvBrP+EH787Nl5N5Qpw7WZg+5g==}
     engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
     peerDependencies:
-      eslint: ^8.57.0 || ^9.0.0
-      typescript: '>=4.8.4 <5.8.0'
+      typescript: '>=4.8.4 <6.1.0'
 
-  '@typescript-eslint/scope-manager@7.18.0':
-    resolution: {integrity: sha512-jjhdIE/FPF2B7Z1uzc6i3oWKbGcHb87Qw7AWj6jmEqNOfDFbJWtjt/XfwCpvNkpGWlcJaog5vTR+VV8+w9JflA==}
-    engines: {node: ^18.18.0 || >=20.0.0}
-
-  '@typescript-eslint/scope-manager@8.18.1':
-    resolution: {integrity: sha512-HxfHo2b090M5s2+/9Z3gkBhI6xBH8OJCFjH9MhQ+nnoZqxU3wNxkLT+VWXWSFWc3UF3Z+CfPAyqdCTdoXtDPCQ==}
+  '@typescript-eslint/scope-manager@8.66.0':
+    resolution: {integrity: sha512-8TGcH25j9zqJ/IULB/ppyhRvxA8QYfFEZ7nfbg6/BN9spDgb8fPWQXlE5l8TWBL50EtUx007uZ1o9VOwrq2/9g==}
     engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
 
-  '@typescript-eslint/type-utils@8.18.1':
-    resolution: {integrity: sha512-jAhTdK/Qx2NJPNOTxXpMwlOiSymtR2j283TtPqXkKBdH8OAMmhiUfP0kJjc/qSE51Xrq02Gj9NY7MwK+UxVwHQ==}
+  '@typescript-eslint/tsconfig-utils@8.66.0':
+    resolution: {integrity: sha512-9D5gLYZG4rOjcoag8MQ/fWI8WqA9wcPDyOGyWtWFhvM1lHRbliqUSPIY5J3zqCU1tvSwzXxnnjhQhz5Ne7mJ4g==}
     engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
     peerDependencies:
-      eslint: ^8.57.0 || ^9.0.0
-      typescript: '>=4.8.4 <5.8.0'
+      typescript: '>=4.8.4 <6.1.0'
 
-  '@typescript-eslint/types@7.18.0':
-    resolution: {integrity: sha512-iZqi+Ds1y4EDYUtlOOC+aUmxnE9xS/yCigkjA7XpTKV6nCBd3Hp/PRGGmdwnfkV2ThMyYldP1wRpm/id99spTQ==}
-    engines: {node: ^18.18.0 || >=20.0.0}
-
-  '@typescript-eslint/types@8.18.1':
-    resolution: {integrity: sha512-7uoAUsCj66qdNQNpH2G8MyTFlgerum8ubf21s3TSM3XmKXuIn+H2Sifh/ES2nPOPiYSRJWAk0fDkW0APBWcpfw==}
+  '@typescript-eslint/types@8.66.0':
+    resolution: {integrity: sha512-H6gcYaSDOyvL3AD/jHUtUFo2jqGgn/F6nuyuZSu0QTesxL+cP4dQoIMrODRofuJC09g64+WgZ6tE19Y1N2YIFQ==}
     engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
 
-  '@typescript-eslint/typescript-estree@7.18.0':
-    resolution: {integrity: sha512-aP1v/BSPnnyhMHts8cf1qQ6Q1IFwwRvAQGRvBFkWlo3/lH29OXA3Pts+c10nxRxIBrDnoMqzhgdwVe5f2D6OzA==}
-    engines: {node: ^18.18.0 || >=20.0.0}
+  '@typescript-eslint/typescript-estree@8.66.0':
+    resolution: {integrity: sha512-8/x4INiiQb10jGgXYD7116/zQ+OL84ZIFn0za68wwFHCanT/VLbBEroWht8RV8fn0/ZCAoazHLQgwUC0UQcDfg==}
+    engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
     peerDependencies:
-      typescript: '*'
+      typescript: '>=4.8.4 <6.1.0'
+
+  '@typescript-eslint/utils@8.66.0':
+    resolution: {integrity: sha512-jasearZPolBw5NJNYGMwxzHMF83niVWmMU1VdHzG1CyfI2VS7f7nZltnKtHcg20hW+7Uo5GfK4MeDPoU3qI8EA==}
+    engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
+    peerDependencies:
+      eslint: ^8.57.0 || ^9.0.0 || ^10.0.0
+      typescript: '>=4.8.4 <6.1.0'
+
+  '@typescript-eslint/visitor-keys@8.66.0':
+    resolution: {integrity: sha512-dkKR8q+lKciskj1Y3vthHktl+3cMLWGyVUP23bRiPZ5O9BRT++4EqDDV+TVeIKBL1VXVEqrJlz8MYbcnvJcAlg==}
+    engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
+
+  '@v-c/async-validator@1.0.1':
+    resolution: {integrity: sha512-2WXdbTso13119ZLiwUv1JkmdL0K4ll69id4oE3ft3LQX+YAHOoJtfx080u26lLtypgZS32PguoohgB0BVo39rg==}
+
+  '@v-c/cascader@1.1.2':
+    resolution: {integrity: sha512-Aa0cXTo4J3d71NjSogjB1fG+yTBGIK5xt/oxqjy/jBcYo0mweOOLrtxSXl+86ZK7LIoWjEE+/MBxRwAR0R4l3w==}
+    peerDependencies:
+      vue: ^3.5.40
+
+  '@v-c/checkbox@1.0.1':
+    resolution: {integrity: sha512-+QsE/0VfU6oeglwuHWYxRNTn3+eV08iG0uN/upDmqSGznezInzfUClh+t4acd/OxyJVtuob0WKsg/vPlT6WRWw==}
+    peerDependencies:
+      vue: ^3.5.40
+
+  '@v-c/collapse@1.0.1':
+    resolution: {integrity: sha512-HL7Cec3HDVgefdx5AtAgWiibKHZJuKkB3l24eU5vLQ5quv+zswrPhJUr2Opx8LcTkfX9Yjwu1NcrZpf56z0Xhw==}
+    peerDependencies:
+      vue: ^3.5.40
+
+  '@v-c/color-picker@1.0.6':
+    resolution: {integrity: sha512-XiTlEMG5p5jkCdKP7nbeo9EJrpdXnoW4uBOA2us8pVgA6m0GxrwMoCg//X+1XsuOaebG/1Swo65mjRuMBM6rZg==}
+    peerDependencies:
+      vue: ^3.5.40
+
+  '@v-c/dialog@1.2.0':
+    resolution: {integrity: sha512-I+ODJyaWTp8/ePuPQUkay70J3wVwKrzG+Eo6k+cEuO7+J93v6tXjUVT//jeY6bhmiaeeGe8BSy9EK5RuBGxTpw==}
+    peerDependencies:
+      vue: ^3.5.40
+
+  '@v-c/drawer@1.0.6':
+    resolution: {integrity: sha512-nW8rCsf7viUsTo+8SAfqcNDO4B0GC4n2VidHV4kJzbERrMvMsHVpDz1LO+UFgLs8Mn9EjpQm40JtF6d/BNkW0g==}
+    peerDependencies:
+      vue: ^3.5.40
+
+  '@v-c/dropdown@1.0.5':
+    resolution: {integrity: sha512-VHtZJ5gyh+VQjJEscqDvCOwSlSXFUwToLfazWBDNSttvZokFr8lUdKgHXyzMve1/003lB6753XaQZcEHD+TLdw==}
+    peerDependencies:
+      vue: ^3.5.40
+
+  '@v-c/image@1.0.12':
+    resolution: {integrity: sha512-SwGOHRSHPiAWlazy+vfwE3dIniIWQLXfl6R0SdlMFbUZ6mbklkym2KqJxj+ZL7psl4tpO+WsgU9IZDMBzXmFPw==}
+    peerDependencies:
+      vue: ^3.5.40
+
+  '@v-c/input-number@1.0.7':
+    resolution: {integrity: sha512-OGLDBh9J29JP8SvOeoOdhB7J7Dk9TLl35wFrckZEA+8P56mspm0I6ssFAzjuXB1nLXNWrBB4d2LwzcicfMcdfw==}
+    peerDependencies:
+      vue: ^3.5.40
+
+  '@v-c/input@1.1.1':
+    resolution: {integrity: sha512-rEqhP6ULovlFCMaLYlMC3axjSU2hlyBJs/+Bw2N+403H2nreJKjS82n6vgvl/9vMAwTHrkm/jdFxk78WwWDRxw==}
+    peerDependencies:
+      vue: ^3.5.40
+
+  '@v-c/listy@1.0.2':
+    resolution: {integrity: sha512-hYC9cGtVeOSbqYDobNOd2BmL6TLMkjtVTVAbNvM3739L8p+2ZcKHKIIHKbofmzTh+aDZIg8646Y1EQfQIlPc7Q==}
+    peerDependencies:
+      vue: ^3.5.40
+
+  '@v-c/mentions@1.2.0':
+    resolution: {integrity: sha512-az3F0bN8anqQEgDtobBKKi0K2wYCu/Z8U51nKZuXacEOEj19hRWG4mkSxOScRW4btwE5k6Pto3R9/53vZ1SNGw==}
+    peerDependencies:
+      vue: ^3.5.40
+
+  '@v-c/menu@1.3.0':
+    resolution: {integrity: sha512-9TViwEIHEsZ2dly8eflVeQyFzpHeRU/5AnvR2eQWYXwH91b9pCrzPmFDIe2e6ixlpA5LZcamFNSsm+f42kDwGA==}
+    peerDependencies:
+      vue: ^3.5.40
+
+  '@v-c/mini-decimal@1.0.1':
+    resolution: {integrity: sha512-76wZLdlkI017iDlaZMNOWZyDCv29YVabUJn5urQgIKtW4dnI5AkNXWtmLyhl/mu/OS7ZGisRi5ai/558QhLQxQ==}
+
+  '@v-c/mutate-observer@1.0.2':
+    resolution: {integrity: sha512-btnmj0NezMcQ/vOlTlP9p47NBOa8q/CIYdDMrpM3W0JrmAHrkAUD7hiWypLXyBuiEko+SQc3U07rcm8StQ5qFA==}
+    peerDependencies:
+      vue: ^3.5.40
+
+  '@v-c/notification@2.0.2':
+    resolution: {integrity: sha512-SkvQfZRuWdNaSAZQOoB12a/kvicpZ4X5lsyDObWyzOmkv5hrZioAixk2QgNhJ7b5jPYfjyYT8JfjeubjEk4BMQ==}
+    peerDependencies:
+      vue: ^3.5.40
+
+  '@v-c/overflow@1.1.1':
+    resolution: {integrity: sha512-Q7EpThPBEa/+eIfacWhyZqfKQVPyDnAelswEXYsmFokXY/aeGkdFe8eUr3m3X5NKTNrFDWZiDDHyXEnInTpxQQ==}
+    peerDependencies:
+      vue: ^3.5.40
+
+  '@v-c/pagination@1.1.0':
+    resolution: {integrity: sha512-3m8hIkuwMS1LoSy+6n16D0I0UQkWt+2zwS0X3ndmgrvU5LfphiQ3UpSdOow0i/qk5TKbbPd5t97xsX5962ceSg==}
+    peerDependencies:
+      vue: ^3.5.40
+
+  '@v-c/picker@1.3.2':
+    resolution: {integrity: sha512-XY9+cXmHBqPtyf7ks4lvc7664/vM5XybbCyeVtIm1Ukrx+0hnVgjnsjdfDN7qJLmjsye6Q/G0pE9ROCPKw7oMw==}
+    peerDependencies:
+      date-fns: '>= 2.x'
+      dayjs: '>= 1.x'
+      luxon: '>= 3.x'
+      moment: '>= 2.x'
+      vue: ^3.5.40
     peerDependenciesMeta:
-      typescript:
+      date-fns:
+        optional: true
+      dayjs:
+        optional: true
+      luxon:
+        optional: true
+      moment:
         optional: true
 
-  '@typescript-eslint/typescript-estree@8.18.1':
-    resolution: {integrity: sha512-z8U21WI5txzl2XYOW7i9hJhxoKKNG1kcU4RzyNvKrdZDmbjkmLBo8bgeiOJmA06kizLI76/CCBAAGlTlEeUfyg==}
-    engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
+  '@v-c/portal@1.0.8':
+    resolution: {integrity: sha512-93elruWfHKrdtRkpFBNpi47YhQjA75tCuG8C/WvcQ9x/dp+H3i+y7h6t0iyyDjZu1w3d2U5+d43vtslmoQXBYg==}
     peerDependencies:
-      typescript: '>=4.8.4 <5.8.0'
+      vue: ^3.5.40
 
-  '@typescript-eslint/utils@7.18.0':
-    resolution: {integrity: sha512-kK0/rNa2j74XuHVcoCZxdFBMF+aq/vH83CXAOHieC+2Gis4mF8jJXT5eAfyD3K0sAxtPuwxaIOIOvhwzVDt/kw==}
-    engines: {node: ^18.18.0 || >=20.0.0}
+  '@v-c/progress@1.0.1':
+    resolution: {integrity: sha512-ZTaXBYfAASPSk9MD/tu3eZUCnB1UhK6s0G/F0AkNwvzPiVcR2kiiDZO12YpfmdZwUjcrg8U7miAg89aSUZ/aPw==}
     peerDependencies:
-      eslint: ^8.56.0
+      vue: ^3.5.40
 
-  '@typescript-eslint/utils@8.18.1':
-    resolution: {integrity: sha512-8vikiIj2ebrC4WRdcAdDcmnu9Q/MXXwg+STf40BVfT8exDqBCUPdypvzcUPxEqRGKg9ALagZ0UWcYCtn+4W2iQ==}
-    engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
+  '@v-c/qrcode@1.0.1':
+    resolution: {integrity: sha512-kPcpjgX5lEj6/vatJOqrUtqj5PGvcAYCs5CAu1kBO0B6FGnSuHM/JXlYQrmMNIOD1sI/GzgYIa9KL6mc8FCHJw==}
     peerDependencies:
-      eslint: ^8.57.0 || ^9.0.0
-      typescript: '>=4.8.4 <5.8.0'
+      vue: ^3.5.40
 
-  '@typescript-eslint/visitor-keys@7.18.0':
-    resolution: {integrity: sha512-cDF0/Gf81QpY3xYyJKDV14Zwdmid5+uuENhjH2EqFaF0ni+yAyq/LzMaIJdhNJXZI7uLzwIlA+V7oWoyn6Curg==}
-    engines: {node: ^18.18.0 || >=20.0.0}
+  '@v-c/rate@1.0.1':
+    resolution: {integrity: sha512-ZWWY01LeKu9S/JncdvSr2gz2Kwwum3bB/AxzzCsuhCyg+9P4BLwX7S2WZDMiJ92uYEpiYladVTCa9XdSCPaCaQ==}
+    peerDependencies:
+      vue: ^3.5.40
 
-  '@typescript-eslint/visitor-keys@8.18.1':
-    resolution: {integrity: sha512-Vj0WLm5/ZsD013YeUKn+K0y8p1M0jPpxOkKdbD1wB0ns53a5piVY02zjf072TblEweAbcYiFiPoSMF3kp+VhhQ==}
-    engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
+  '@v-c/resize-observer@1.1.3':
+    resolution: {integrity: sha512-+b1VJCnUJzcbT/dthgo1GpiY98Y7QEDqI+BkZc/PquQx1cqVgRLEVU/n1vfDx8A6msgwjEAHPoBrPWSiNWZiQA==}
+    peerDependencies:
+      vue: ^3.5.40
 
-  '@vavt/copy2clipboard@1.0.1':
-    resolution: {integrity: sha512-XkULyKbB4KeYOn2q2JxMbhu2+UiSrwMU745dfwaYC/oFPsYaXPdGed/zV34xGP59+fgI2VqeQ2xmfKkMSvRvzw==}
+  '@v-c/segmented@1.0.4':
+    resolution: {integrity: sha512-QNEHEvT37gFlRaNuoO4IcHJvj2xwz+r8Nx/f7x+eLEoVectYn1cJN0b1uzpFeGWPNPUbz7u5TOLUR6VOWzr1qQ==}
+    peerDependencies:
+      vue: ^3.5.40
 
-  '@vavt/util@2.1.0':
-    resolution: {integrity: sha512-YIfAvArSFVXmWvoF+DEGD0FhkhVNcCtVWWkfYtj76eSrwHh/wuEEFhiEubg1XLNM3tChO8FH8xJCT/hnizjgFQ==}
+  '@v-c/select@1.2.0':
+    resolution: {integrity: sha512-N6E7S13Y9Kbw90jZ3NzJmHlikx/K/M5FjkWSJSQ6IN5SgvFmLEHqCJOaXQo5J671Yyc4+YLGFK3at/IBZ2xCwQ==}
+    peerDependencies:
+      vue: ^3.5.40
 
-  '@vee-validate/zod@4.14.7':
-    resolution: {integrity: sha512-UD0Tfyz1cKKd7BinnUztqKL+oeMjg/T4ZEguN/uZV4DsR9z7gdrD0lOuOU7aVl9UpVK6NM7MhDka35Lj7b/DTw==}
+  '@v-c/slick@1.0.2':
+    resolution: {integrity: sha512-8BbPxJgYST+tio9jyeFQgJb/3XSFhfWZN8Am7YVYeqsYsvn3g8wu61UZNSjlkp9ArOEe+ujOgX4izfDHeXh4RA==}
+    peerDependencies:
+      vue: ^3.5.40
 
-  '@vercel/nft@0.27.10':
-    resolution: {integrity: sha512-zbaF9Wp/NsZtKLE4uVmL3FyfFwlpDyuymQM1kPbeT0mVOHKDQQNjnnfslB3REg3oZprmNFJuh3pkHBk2qAaizg==}
-    engines: {node: '>=16'}
+  '@v-c/slider@1.1.0':
+    resolution: {integrity: sha512-W11+HdY7JjpsZA+2x6ZcZLK/z/cwY+o3fbqzCgguWdKY8qwhA2CWQBd6SMidFa8F+L2HU/JupNx6Yu3cVw9piQ==}
+    peerDependencies:
+      vue: ^3.5.40
+
+  '@v-c/steps@1.0.0':
+    resolution: {integrity: sha512-DPL0OOb8pDLlTPZB93b8+Saxiz6V5zEpGXKaCnsbXUuOhimkc7089AuEKfpMw+8x1SrVe+gapWf5RRHWXUm2pg==}
+    peerDependencies:
+      vue: ^3.5.40
+
+  '@v-c/switch@1.0.1':
+    resolution: {integrity: sha512-dWMBfb5/8o3GFGvayyT576YWB6yPW8Aa2Ba5I9hXcYvuIH4JJ5NYI3WJqc8KpFMNA4Y4/MyVIY3NNsXyXa22bw==}
+    peerDependencies:
+      vue: ^3.5.40
+
+  '@v-c/table@1.1.9':
+    resolution: {integrity: sha512-W70JIN8DN5yequ1wLlIpDu8ghj1JePXNHmSoYingW4kCW/Vs43NYQj0qkirqvrFK6ie9GhbXtgm0CneqFNmkVg==}
+    peerDependencies:
+      vue: ^3.5.40
+
+  '@v-c/tabs@1.3.0':
+    resolution: {integrity: sha512-XUH+DD/akTfxCSIVKyxVOsIF2CQHXeXDfGplapRlNu4jDObJYRuP2V1srDyG4/P8ItvR6kopER1oCIDJrYVh1Q==}
+    peerDependencies:
+      vue: ^3.5.40
+
+  '@v-c/textarea@1.1.0':
+    resolution: {integrity: sha512-+E2DZogCNHb/0Jf/DJLqX5BH22/HcdTcHo9dMjmS+X/NDRCGl1sQfeEa+7mGAWnYXAmL4RIS8PS6lwEn90inbA==}
+    peerDependencies:
+      vue: ^3.5.40
+
+  '@v-c/tooltip@1.1.0':
+    resolution: {integrity: sha512-G2GcvbnvWG8nb0OaflDnAevV7v2xOsiGz33HmsOaeQTmqVq/a1apIwe4GvAAoguI5ifunzhbP4G3MUrjsZEVEQ==}
+    peerDependencies:
+      vue: ^3.5.40
+
+  '@v-c/tour@1.1.1':
+    resolution: {integrity: sha512-q8OZjbRNR683xePlyG0Idn/PNWeMtz5MNr66ROnsBpVTY/eScjHUHqpNtJKbTvn2oj9iZf+SbJdpDWxxPh1ZiA==}
+    peerDependencies:
+      vue: ^3.5.40
+
+  '@v-c/tree-select@1.1.1':
+    resolution: {integrity: sha512-jh0Wnj7iO8Exm5DFZHvfkdK1Jowxgs2bZ7/0C/2et9Ko9uUEEbJiDKxtEEKiiUNM8pRyUVVEYMNyndA1/HtMFw==}
+    peerDependencies:
+      vue: ^3.5.40
+
+  '@v-c/tree@1.1.3':
+    resolution: {integrity: sha512-x/Cq8xpu+BRJqywFsVRxqKCv6jYTGDIh3/3WgEbsNd12XoCyWcgwEtqqcxfd0JGtt+TSJDVgu172TPyLsSIMbw==}
+    peerDependencies:
+      vue: ^3.5.40
+
+  '@v-c/trigger@1.1.0':
+    resolution: {integrity: sha512-rey3WPVipw18kfyM5RLMGiFmqdpWkv4nu97xOwe7OLZXti2A3Ns07ELozgU4Hhar5QoibNE4ldkkfFCc9ckWvA==}
+    peerDependencies:
+      vue: ^3.5.40
+
+  '@v-c/upload@1.0.0':
+    resolution: {integrity: sha512-W92PNCD61aM/B5w8oUzHQSDHur1T8484726Ls0IoNMO5nPiF/15eEE3RuuI/t7xXQVP/fA06hNSwzXwGWdDg1w==}
+    peerDependencies:
+      vue: ^3.5.40
+
+  '@v-c/util@1.1.0':
+    resolution: {integrity: sha512-TWIigrRbzWAN1pk+bufB5/dtDWsXYA8v5izcuSPuADaIicJnPqEY0V3NlUx9XVQ4gobqpX/HVpeEMg9ZwqlHiQ==}
+    peerDependencies:
+      vue: ^3.5.40
+
+  '@v-c/virtual-list@1.1.0':
+    resolution: {integrity: sha512-EwOdJVe/lx5O8oKtHXZ7SR19GozuI4o70MN58uZfWrPkzOCiYs0flJslcveyVCxPrdqNE2t8XF3lPN+px1Fbqw==}
+    peerDependencies:
+      vue: ^3.5.40
+
+  '@valibot/to-json-schema@1.7.1':
+    resolution: {integrity: sha512-3qkmU6KXWh8GIThEAW3kuRHPQBMjWkKy+Ppz3WkUucx53DTpOa6siMn4xDGSOhlVyMrDaJTCTMLYPZVAIk1P0A==}
+    peerDependencies:
+      valibot: ^1.4.0
+
+  '@vavt/copy2clipboard@1.0.3':
+    resolution: {integrity: sha512-HtG48r2FBYp9eRvGB3QGmtRBH1zzRRAVvFbGgFstOwz4/DDaNiX0uZc3YVKPydqgOav26pibr9MtoCaWxn7aeA==}
+
+  '@vavt/util@2.1.2':
+    resolution: {integrity: sha512-L3UbSJthJwr3wq0x93O5TrCepimrmVZaIl2ciZbeL18G5++gBhJXNhcH7RcVk/6rr3SavWOvwhig0mqRLoR7dw==}
+
+  '@vercel/nft@1.10.2':
+    resolution: {integrity: sha512-w+WyX5Ulmj4dtTZrxaulqrjaLZHSbnPzx75SJsTNYmotKsqn1JlLnDJa+lz5hn90HJofhl/2MAtw0mCrgM3qYw==}
+    engines: {node: '>=20'}
     hasBin: true
 
-  '@vitejs/plugin-vue-jsx@4.1.1':
-    resolution: {integrity: sha512-uMJqv/7u1zz/9NbWAD3XdjaY20tKTf17XVfQ9zq4wY1BjsB/PjpJPMe2xiG39QpP4ZdhYNhm4Hvo66uJrykNLA==}
-    engines: {node: ^18.0.0 || >=20.0.0}
+  '@vitejs/plugin-vue-jsx@5.1.6':
+    resolution: {integrity: sha512-YXvi4as2clxt6DFw5+a0tTA97ntiQXm/raR8ofNj3aNwwdlVGTiG2gp7EvfZW17P50acL/9bP0ccF4XnqNmlgA==}
+    engines: {node: ^20.19.0 || >=22.12.0}
     peerDependencies:
-      vite: ^5.0.0 || ^6.0.0
-      vue: ^3.5.13
+      vite: ^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0
+      vue: ^3.5.40
 
-  '@vitejs/plugin-vue@5.2.1':
-    resolution: {integrity: sha512-cxh314tzaWwOLqVes2gnnCtvBDcM1UMdn+iFR+UjAn411dPT3tOmqrJjbMd7koZpMAmBM/GqeV4n9ge7JSiJJQ==}
-    engines: {node: ^18.0.0 || >=20.0.0}
+  '@vitejs/plugin-vue@6.0.8':
+    resolution: {integrity: sha512-0ZjgOg7oO6farnNGup7yvoM/YXZV84OZxHAwtflItNa/6zzQyVb5LNxyea3FEKEX2XlagIKzrlH7wwxkKgtiew==}
+    engines: {node: ^20.19.0 || >=22.12.0}
     peerDependencies:
-      vite: ^5.0.0 || ^6.0.0
-      vue: ^3.5.13
+      vite: ^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0
+      vue: ^3.5.40
 
-  '@vitest/expect@2.1.8':
-    resolution: {integrity: sha512-8ytZ/fFHq2g4PJVAtDX57mayemKgDR6X3Oa2Foro+EygiOJHUXhCqBAAKQYYajZpFoIfvBCF1j6R6IYRSIUFuw==}
+  '@vitest/expect@4.1.10':
+    resolution: {integrity: sha512-YsCn+qAk1GWjQOWFEsEcL2gNQ0zmVmQu3T03qP6UyjhtmdtwtbuI+DASn/7iQB3HGTXkdBwGddzxPlmiql5vlA==}
 
-  '@vitest/mocker@2.1.8':
-    resolution: {integrity: sha512-7guJ/47I6uqfttp33mgo6ga5Gr1VnL58rcqYKyShoRK9ebu8T5Rs6HN3s1NABiBeVTdWNrwUMcHH54uXZBN4zA==}
+  '@vitest/mocker@4.1.10':
+    resolution: {integrity: sha512-v0xaezt+DKEmKfaxg133ldzADrwLGd7Ze1MfQQTYfvs8OqZIwbxyxaYURivwV7sWy5fqn3rH5uOrSp07bp44Ow==}
     peerDependencies:
       msw: ^2.4.9
-      vite: ^5.0.0
+      vite: ^6.0.0 || ^7.0.0 || ^8.0.0
     peerDependenciesMeta:
       msw:
         optional: true
       vite:
         optional: true
 
-  '@vitest/pretty-format@2.1.8':
-    resolution: {integrity: sha512-9HiSZ9zpqNLKlbIDRWOnAWqgcA7xu+8YxXSekhr0Ykab7PAYFkhkwoqVArPOtJhPmYeE2YHgKZlj3CP36z2AJQ==}
+  '@vitest/pretty-format@4.1.10':
+    resolution: {integrity: sha512-W1HsjSH4MXQ9YfmmhLAoIYf1HRfekQCGngeIgcei6MP5QQGWUe0gkopdZQaVCFO+JDJMrAJGwa5pRpNpvy4P8Q==}
 
-  '@vitest/runner@2.1.8':
-    resolution: {integrity: sha512-17ub8vQstRnRlIU5k50bG+QOMLHRhYPAna5tw8tYbj+jzjcspnwnwtPtiOlkuKC4+ixDPTuLZiqiWWQ2PSXHVg==}
+  '@vitest/runner@4.1.10':
+    resolution: {integrity: sha512-IKI6kpIH+LmpROplyLwBBaCfMgOZOMsygVa6BARD6ahA04VRuJSa6OaVG7kRvSEMD870Vd91rSSw0eegtWyLGg==}
 
-  '@vitest/snapshot@2.1.8':
-    resolution: {integrity: sha512-20T7xRFbmnkfcmgVEz+z3AU/3b0cEzZOt/zmnvZEctg64/QZbSDJEVm9fLnnlSi74KibmRsO9/Qabi+t0vCRPg==}
+  '@vitest/snapshot@4.1.10':
+    resolution: {integrity: sha512-xRkfOT1qpTAi/Ti4Y1LtfRc3kEuqxGw59eN2jN9pRWMtS/XDevekhcFSqvQqjUNGksfjMJu3Y+oJ+4Ypn2OaJw==}
 
-  '@vitest/spy@2.1.8':
-    resolution: {integrity: sha512-5swjf2q95gXeYPevtW0BLk6H8+bPlMb4Vw/9Em4hFxDcaOxS+e0LOX4yqNxoHzMR2akEB2xfpnWUzkZokmgWDg==}
+  '@vitest/spy@4.1.10':
+    resolution: {integrity: sha512-PLf/Ugvoq5wO/b4rwYCR1h2PSIdXz7wnkQFMiUpLdtM7l6pqVFcQIBEHyT1+l+cj7mNwAfZHzqXqDyjvOuwbDw==}
 
-  '@vitest/utils@2.1.8':
-    resolution: {integrity: sha512-dwSoui6djdwbfFmIgbIjX2ZhIoG7Ex/+xpxyiEgIGzjliY8xGkcpITKTlp6B4MgtGkF2ilvm97cPM96XZaAgcA==}
+  '@vitest/utils@4.1.10':
+    resolution: {integrity: sha512-fy9am/HWxbaGt/Sawrp90vt6Y6jQwf1RX77cz3uwoJwJVMli/e1IEwRPnMNJ7vKfPTwo0diXifkpPvwH9v7nGA==}
 
-  '@volar/language-core@2.4.11':
-    resolution: {integrity: sha512-lN2C1+ByfW9/JRPpqScuZt/4OrUUse57GLI6TbLgTIqBVemdl1wNcZ1qYGEo2+Gw8coYLgCy7SuKqn6IrQcQgg==}
+  '@volar/language-core@2.4.28':
+    resolution: {integrity: sha512-w4qhIJ8ZSitgLAkVay6AbcnC7gP3glYM3fYwKV3srj8m494E3xtrCv6E+bWviiK/8hs6e6t1ij1s2Endql7vzQ==}
 
-  '@volar/source-map@2.4.11':
-    resolution: {integrity: sha512-ZQpmafIGvaZMn/8iuvCFGrW3smeqkq/IIh9F1SdSx9aUl0J4Iurzd6/FhmjNO5g2ejF3rT45dKskgXWiofqlZQ==}
+  '@volar/source-map@2.4.28':
+    resolution: {integrity: sha512-yX2BDBqJkRXfKw8my8VarTyjv48QwxdJtvRgUpNE5erCsgEUdI2DsLbpa+rOQVAJYshY99szEcRDmyHbF10ggQ==}
 
-  '@volar/typescript@2.4.11':
-    resolution: {integrity: sha512-2DT+Tdh88Spp5PyPbqhyoYavYCPDsqbHLFwcUI9K1NlY1YgUJvujGdrqUp0zWxnW7KWNTr3xSpMuv2WnaTKDAw==}
+  '@volar/typescript@2.4.28':
+    resolution: {integrity: sha512-Ja6yvWrbis2QtN4ClAKreeUZPVYMARDYZl9LMEv1iQ1QdepB6wn0jTRxA9MftYmYa4DQ4k/DaSZpFPUfxl8giw==}
 
-  '@vue/babel-helper-vue-transform-on@1.2.5':
-    resolution: {integrity: sha512-lOz4t39ZdmU4DJAa2hwPYmKc8EsuGa2U0L9KaZaOJUt0UwQNjNA3AZTq6uEivhOKhhG1Wvy96SvYBoFmCg3uuw==}
+  '@vue-macros/common@3.1.4':
+    resolution: {integrity: sha512-/5Fv+6DgIcM9ajY05ZmKBv+LMX1M9A0X+IUwDRVdt67ciw8OV9bvG2r34p3RiEadlsQybjhKPRKNXDC8Bp23cw==}
+    engines: {node: '>=20.19.0'}
+    peerDependencies:
+      vue: ^3.5.40
+    peerDependenciesMeta:
+      vue:
+        optional: true
 
-  '@vue/babel-plugin-jsx@1.2.5':
-    resolution: {integrity: sha512-zTrNmOd4939H9KsRIGmmzn3q2zvv1mjxkYZHgqHZgDrXz5B1Q3WyGEjO2f+JrmKghvl1JIRcvo63LgM1kH5zFg==}
+  '@vue/babel-helper-vue-transform-on@1.5.0':
+    resolution: {integrity: sha512-0dAYkerNhhHutHZ34JtTl2czVQHUNWv6xEbkdF5W+Yrv5pCWsqjeORdOgbtW2I9gWlt+wBmVn+ttqN9ZxR5tzA==}
+
+  '@vue/babel-helper-vue-transform-on@2.0.1':
+    resolution: {integrity: sha512-uZ66EaFbnnZSYqYEyplWvn46GhZ1KuYSThdT68p+am7MgBNbQ3hphTL9L+xSIsWkdktwhPYLwPgVWqo96jDdRA==}
+
+  '@vue/babel-plugin-jsx@1.5.0':
+    resolution: {integrity: sha512-mneBhw1oOqCd2247O0Yw/mRwC9jIGACAJUlawkmMBiNmL4dGA2eMzuNZVNqOUfYTa6vqmND4CtOPzmEEEqLKFw==}
     peerDependencies:
       '@babel/core': ^7.0.0-0
     peerDependenciesMeta:
       '@babel/core':
         optional: true
 
-  '@vue/babel-plugin-resolve-type@1.2.5':
-    resolution: {integrity: sha512-U/ibkQrf5sx0XXRnUZD1mo5F7PkpKyTbfXM3a3rC4YnUz6crHEz9Jg09jzzL6QYlXNto/9CePdOg/c87O4Nlfg==}
+  '@vue/babel-plugin-jsx@2.0.1':
+    resolution: {integrity: sha512-a8CaLQjD/s4PVdhrLD/zT574ZNPnZBOY+IhdtKWRB4HRZ0I2tXBi5ne7d9eCfaYwp5gU5+4KIyFTV1W1YL9xZA==}
+    peerDependencies:
+      '@babel/core': ^7.0.0-0
+    peerDependenciesMeta:
+      '@babel/core':
+        optional: true
+
+  '@vue/babel-plugin-resolve-type@1.5.0':
+    resolution: {integrity: sha512-Wm/60o+53JwJODm4Knz47dxJnLDJ9FnKnGZJbUUf8nQRAtt6P+undLUAVU3Ha33LxOJe6IPoifRQ6F/0RrU31w==}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@vue/compiler-core@3.5.13':
-    resolution: {integrity: sha512-oOdAkwqUfW1WqpwSYJce06wvt6HljgY3fGeM9NcVA1HaYOij3mZG9Rkysn0OHuyUAGMbEbARIpsG+LPVlBJ5/Q==}
+  '@vue/babel-plugin-resolve-type@2.0.1':
+    resolution: {integrity: sha512-ybwgIuRGRRBhOU37GImDoWQoz+TlSqap65qVI6iwg/J7FfLTLmMf97TS7xQH9I7Qtr/gp161kYVdhr1ZMraSYQ==}
+    peerDependencies:
+      '@babel/core': ^7.0.0-0
 
-  '@vue/compiler-dom@3.5.13':
-    resolution: {integrity: sha512-ZOJ46sMOKUjO3e94wPdCzQ6P1Lx/vhp2RSvfaab88Ajexs0AHeV0uasYhi99WPaogmBlRHNRuly8xV75cNTMDA==}
+  '@vue/compiler-core@3.5.41':
+    resolution: {integrity: sha512-q0Xtv/F9w2YO/7htQhtiL+Ev2WCJbe5N2hc+XfgyKkEKqWpSxknmT8QOuGdEKNdjPq0c3F7rNpFkTo3Kfrm7pg==}
 
-  '@vue/compiler-sfc@3.5.13':
-    resolution: {integrity: sha512-6VdaljMpD82w6c2749Zhf5T9u5uLBWKnVue6XWxprDobftnletJ8+oel7sexFfM3qIxNmVE7LSFGTpv6obNyaQ==}
+  '@vue/compiler-dom@3.5.41':
+    resolution: {integrity: sha512-oKacVfNglLvGjnS6BXOlGL7EyG2h8X03pqXCjzotRZUaXGjbrTJUnVAQjrCqUnS+lyu31nwQjZY/d817GmCnfw==}
 
-  '@vue/compiler-ssr@3.5.13':
-    resolution: {integrity: sha512-wMH6vrYHxQl/IybKJagqbquvxpWCuVYpoUJfCqFZwa/JY1GdATAQ+TgVtgrwwMZ0D07QhA99rs/EAAWfvG6KpA==}
+  '@vue/compiler-sfc@3.5.41':
+    resolution: {integrity: sha512-XJhip7R2wy6vX3knCxdZN4KracFaZUef58s1KYewqluedHIJaPIVfXoYT7MF1F8nCvv6k8bWWxDC8opMkg1VTQ==}
 
-  '@vue/compiler-vue2@2.7.16':
-    resolution: {integrity: sha512-qYC3Psj9S/mfu9uVi5WvNZIzq+xnXMhOwbTFKKDD7b1lhpnn71jXSFdTQ+WsIEk0ONCd7VV2IMm7ONl6tbQ86A==}
+  '@vue/compiler-ssr@3.5.41':
+    resolution: {integrity: sha512-U3v5OejKEGqOI0Wy0+Sz7hGuIFZHA4LSXzrNM3IMIeDyJEBBfTpX26n3SDgToRpP2bLc9FfI2j/kSgcJ8Emq5A==}
 
   '@vue/devtools-api@6.6.4':
     resolution: {integrity: sha512-sGhTPMuXqZ1rVOk32RylztWkfXTRhuS7vgAKv0zjqk8gbsHkJ7xfFf+jbySxt7tWObEJwyKaHMikV/WGDiQm8g==}
 
-  '@vue/devtools-api@7.6.8':
-    resolution: {integrity: sha512-ma6dY/sZR36zALVsV1W7eC57c6IJPXsy8SNgZn1PLVWU4z4dPn5TIBmnF4stmdJ4sQcixqKaQ8pwjbMPzEZwiA==}
+  '@vue/devtools-api@8.2.1':
+    resolution: {integrity: sha512-6u4vXBlIBAC1wMplIZgpyPn7uh/s4Bf6F5bMzvLv+EdJ0aHs/+4B7Ygv864EStQSjRbsRzTko/kUG1A1IejQ3A==}
 
-  '@vue/devtools-core@7.6.8':
-    resolution: {integrity: sha512-8X4roysTwzQ94o7IobjVcOd1aZF5iunikrMrHPI2uUdigZCi2kFTQc7ffYiFiTNaLElCpjOhCnM7bo7aK1yU7A==}
+  '@vue/devtools-core@8.2.1':
+    resolution: {integrity: sha512-s/VfAY9oDTb/kFEWmy461jaFde2MIV1RO/gi1vwM+PAZBZ/Pc2Ndu3BNBdZUze8QDUuyYvElbEEGA83syjJfzA==}
     peerDependencies:
-      vue: ^3.5.13
+      vue: ^3.5.40
 
-  '@vue/devtools-kit@7.6.8':
-    resolution: {integrity: sha512-JhJ8M3sPU+v0P2iZBF2DkdmR9L0dnT5RXJabJqX6o8KtFs3tebdvfoXV2Dm3BFuqeECuMJIfF1aCzSt+WQ4wrw==}
+  '@vue/devtools-kit@8.2.1':
+    resolution: {integrity: sha512-FIGIuq3AWReEpbAHY/cRGeHDfI0qOb8OCQ3YjbEAX04uaxIDbGc9rhkbVcG7rnfHPXE3RsU5KrWOu9V/okd8AQ==}
 
-  '@vue/devtools-shared@7.6.8':
-    resolution: {integrity: sha512-9MBPO5Z3X1nYGFqTJyohl6Gmf/J7UNN1oicHdyzBVZP4jnhZ4c20MgtaHDIzWmHDHCMYVS5bwKxT3jxh7gOOKA==}
+  '@vue/devtools-shared@8.2.1':
+    resolution: {integrity: sha512-Fkac7lUdGReh6pVOi3AYPRGe82LQqRmAfThW7RRligOAP0ZA/Z1z9XLHDM9dv34pV2HRc79DK8uKPeG2fLnA/g==}
 
-  '@vue/language-core@2.1.10':
-    resolution: {integrity: sha512-DAI289d0K3AB5TUG3xDp9OuQ71CnrujQwJrQnfuZDwo6eGNf0UoRlPuaVNO+Zrn65PC3j0oB2i7mNmVPggeGeQ==}
+  '@vue/language-core@3.3.9':
+    resolution: {integrity: sha512-in/68oAa4BCtVY6n/nkuhLIkV8DHYd2UivedJ6cMZ6UYtlq9jaoaSNUBHYCVO44z3nKg7MdE5OBoHKt5SxeBKQ==}
+
+  '@vue/reactivity@3.5.41':
+    resolution: {integrity: sha512-rznsqKM0np0x18EjzF8x88MpEhdNsffbvFbckLL5+oUKz1BxAImEmO7J1ArRYSyo6aQaVoBDp7jEkT91OOxydA==}
+
+  '@vue/runtime-core@3.5.41':
+    resolution: {integrity: sha512-Vcry58hiAKwGen9Z1jUZE0feFsNArPCMOImYI8el48A9Idf6DuQYD0U05zZIF2Iad1hGhPSvcbBbAOhNr55fhg==}
+
+  '@vue/runtime-dom@3.5.41':
+    resolution: {integrity: sha512-3vVBahVBS9+U6cmXBLyb8nE6/yYo4J/CGI9eVFs3KiMc0YHuudwKyShTD65jtJy/L9PUUxNAFu4cj4LiJ0UFbw==}
+
+  '@vue/server-renderer@3.5.41':
+    resolution: {integrity: sha512-n6hx/pNFfbD6SuyeuMVkvqox8bwf/ET9JlA/kAz/imw8sw++wkqKe2mHX5KutjPpbKE4Z56yTHszoOjGMI9igQ==}
+
+  '@vue/shared@3.5.41':
+    resolution: {integrity: sha512-IOnwSCma8j+9xJT6b8H0dEYidC80NsYmNMlZxRsukYcSoGaDBohog5hDxzeUXdFeGWFA++vWvxqOmrr96VlqMA==}
+
+  '@vue/test-utils@2.4.11':
+    resolution: {integrity: sha512-GDqaqZsA6m2E5vNzej0aYiIb6BX8xV9pNSbbbXKOfEYwg7ZNblVX8suyqmUBThq8VIrgAJNxn+z72hVtUeiWHA==}
     peerDependencies:
-      typescript: '*'
+      '@vue/compiler-dom': 3.x
+      '@vue/server-renderer': 3.x
+      vue: ^3.5.40
     peerDependenciesMeta:
-      typescript:
+      '@vue/server-renderer':
         optional: true
 
-  '@vue/language-core@2.1.6':
-    resolution: {integrity: sha512-MW569cSky9R/ooKMh6xa2g1D0AtRKbL56k83dzus/bx//RDJk24RHWkMzbAlXjMdDNyxAaagKPRquBIxkxlCkg==}
+  '@vueup/vue-quill@1.5.5':
+    resolution: {integrity: sha512-ygA61ZZPaRzTHXi8H1w5td1XCtjwRsO6oBuJHdCbfotGQ7hBQukVp5dsYeVXWKuSiF8hGDKwIlROyNNrMalQCQ==}
     peerDependencies:
-      typescript: '*'
-    peerDependenciesMeta:
-      typescript:
-        optional: true
+      vue: ^3.5.40
 
-  '@vue/reactivity@3.5.13':
-    resolution: {integrity: sha512-NaCwtw8o48B9I6L1zl2p41OHo/2Z4wqYGGIK1Khu5T7yxrn+ATOixn/Udn2m+6kZKB/J7cuT9DbWWhRxqixACg==}
-
-  '@vue/runtime-core@3.5.13':
-    resolution: {integrity: sha512-Fj4YRQ3Az0WTZw1sFe+QDb0aXCerigEpw418pw1HBUKFtnQHWzwojaukAs2X/c9DQz4MQ4bsXTGlcpGxU/RCIw==}
-
-  '@vue/runtime-dom@3.5.13':
-    resolution: {integrity: sha512-dLaj94s93NYLqjLiyFzVs9X6dWhTdAlEAciC3Moq7gzAc13VJUdCnjjRurNM6uTLFATRHexHCTu/Xp3eW6yoog==}
-
-  '@vue/server-renderer@3.5.13':
-    resolution: {integrity: sha512-wAi4IRJV/2SAW3htkTlB+dHeRmpTiVIK1OGLWV1yeStVSebSQQOwGwIq0D3ZIoBj2C2qpgz5+vX9iEBkTdk5YA==}
+  '@vueuse/core@13.9.0':
+    resolution: {integrity: sha512-ts3regBQyURfCE2BcytLqzm8+MmLlo5Ln/KLoxDVcsZ2gzIwVNnQpQOL/UKV8alUqjSZOlpFZcRNsLRqj+OzyA==}
     peerDependencies:
-      vue: ^3.5.13
+      vue: ^3.5.40
 
-  '@vue/shared@3.5.13':
-    resolution: {integrity: sha512-/hnE/qP5ZoGpol0a5mDi45bOd7t3tjYJBjsgCsivow7D48cJeV5l05RD82lPqi7gRiphZM37rnhW1l6ZoCNNnQ==}
-
-  '@vue/test-utils@2.4.6':
-    resolution: {integrity: sha512-FMxEjOpYNYiFe0GkaHsnJPXFHxQ6m4t8vI/ElPGpMWxZKpmRvQ33OIrvRXemy6yha03RxhOlQuy+gZMC3CQSow==}
-
-  '@vueup/vue-quill@1.2.0':
-    resolution: {integrity: sha512-kd5QPSHMDpycklojPXno2Kw2JSiKMYduKYQckTm1RJoVDA557MnyUXgcuuDpry4HY/Rny9nGNcK+m3AHk94wag==}
+  '@vueuse/core@14.4.0':
+    resolution: {integrity: sha512-X4WHz1HlCzCBoYXesUkifzzWBAcZgXG8Fi5iNPQg/epdzOB3gu8Fawj3hvuwYR1nGcXGnvxwYYcUC/71++svtQ==}
     peerDependencies:
-      vue: ^3.5.13
+      vue: ^3.5.40
 
-  '@vueuse/core@10.11.1':
-    resolution: {integrity: sha512-guoy26JQktXPcz+0n3GukWIy/JDNKti9v6VEMu6kV2sYBsWuGiTU8OWdg+ADfUbHg3/3DlqySDe7JmdHrktiww==}
-
-  '@vueuse/core@12.0.0':
-    resolution: {integrity: sha512-C12RukhXiJCbx4MGhjmd/gH52TjJsc3G0E0kQj/kb19H3Nt6n1CA4DRWuTdWWcaFRdlTe0npWDS942mvacvNBw==}
-
-  '@vueuse/integrations@12.0.0':
-    resolution: {integrity: sha512-M16fkVp+i4je75I7uvifMbJKHFrjx2+0LuHEH9++iPJ11zc4SRy5NdRN0z2NR+a54eQ5Gs2Ds7pby5ST96zxCA==}
+  '@vueuse/integrations@14.4.0':
+    resolution: {integrity: sha512-oJz9qTgczvA7L1nXQFRU7h8tQbOCoiceqvMMhT9XYMyOGTqLJ2rEa09PON+nD2t48sZUfeOmg4eaWJXV4sZb/w==}
     peerDependencies:
       async-validator: ^4
       axios: ^1
       change-case: ^5
       drauu: ^0.4
-      focus-trap: ^7
+      focus-trap: ^7 || ^8
       fuse.js: ^7
       idb-keyval: ^6
       jwt-decode: ^4
       nprogress: ^0.2
       qrcode: ^1.5
       sortablejs: ^1
-      universal-cookie: ^7
+      universal-cookie: ^7 || ^8
+      vue: ^3.5.40
     peerDependenciesMeta:
       async-validator:
         optional: true
@@ -4325,31 +6002,183 @@ packages:
       universal-cookie:
         optional: true
 
-  '@vueuse/metadata@10.11.1':
-    resolution: {integrity: sha512-IGa5FXd003Ug1qAZmyE8wF3sJ81xGLSqTqtQ6jaVfkeZ4i5kS2mwQF61yhVqojRnenVew5PldLyRgvdl4YYuSw==}
+  '@vueuse/metadata@13.9.0':
+    resolution: {integrity: sha512-1AFRvuiGphfF7yWixZa0KwjYH8ulyjDCC0aFgrGRz8+P4kvDFSdXLVfTk5xAN9wEuD1J6z4/myMoYbnHoX07zg==}
 
-  '@vueuse/metadata@12.0.0':
-    resolution: {integrity: sha512-Yzimd1D3sjxTDOlF05HekU5aSGdKjxhuhRFHA7gDWLn57PRbBIh+SF5NmjhJ0WRgF3my7T8LBucyxdFJjIfRJQ==}
+  '@vueuse/metadata@14.4.0':
+    resolution: {integrity: sha512-swx/255R6JyHZFJhx845iz5CRWDZdCfvkZOpACWc5+c5WHcG24mv8gUT1WIdFQaHt6dq79rvILd9QnCWiyVm9g==}
 
-  '@vueuse/shared@10.11.1':
-    resolution: {integrity: sha512-LHpC8711VFZlDaYUXEBbFBCQ7GS3dVU9mjOhhMhXP6txTV4EhYQg/KGnQuvt/sPAtoUKq7VVUnL6mVtFoL42sA==}
-
-  '@vueuse/shared@12.0.0':
-    resolution: {integrity: sha512-3i6qtcq2PIio5i/vVYidkkcgvmTjCqrf26u+Fd4LhnbBmIT6FN8y6q/GJERp8lfcB9zVEfjdV0Br0443qZuJpw==}
-
-  '@vxe-ui/core@4.0.23':
-    resolution: {integrity: sha512-1UfRNEnawaCT+OR6RkBv6YPNqKrVd7dfMJbvhzkKvvKYrS3/0/Xmppxt5zjMEzCnfPq0WtUjXJvutu1eWBI8rQ==}
+  '@vueuse/motion@3.0.3':
+    resolution: {integrity: sha512-4B+ITsxCI9cojikvrpaJcLXyq0spj3sdlzXjzesWdMRd99hhtFI6OJ/1JsqwtF73YooLe0hUn/xDR6qCtmn5GQ==}
     peerDependencies:
-      vue: ^3.5.13
+      vue: ^3.5.40
 
-  JSONStream@1.3.5:
-    resolution: {integrity: sha512-E+iruNOY8VV9s4JEbe1aNEm6MiszPRr/UfcHMz0TQh1BXSxHK+ASV1R6W4HpjBhSeS+54PIsAMCBmwD06LLsqQ==}
-    hasBin: true
+  '@vueuse/shared@13.9.0':
+    resolution: {integrity: sha512-e89uuTLMh0U5cZ9iDpEI2senqPGfbPRTHM/0AaQkcxnpqjkZqDYP8rpfm7edOz8s+pOCOROEy1PIveSW8+fL5g==}
+    peerDependencies:
+      vue: ^3.5.40
+
+  '@vueuse/shared@14.4.0':
+    resolution: {integrity: sha512-JRgY90Sz8DDtPMsaDflvPMp9xYk69JZAmbuDvAquUVXKr2gEjqtzGNTTthLfckH0BzBqvnu31gb4a8TGLRe79g==}
+    peerDependencies:
+      vue: ^3.5.40
+
+  '@vxe-ui/core@4.4.19':
+    resolution: {integrity: sha512-Ahx7WWS43tkT6JzVbfZsZ0+81xmVDuzIw0ZXhbUAYqGd98DPX3pnMOdYCHe9OzgpQWkDwsmXF0zuPcEIMnUdQQ==}
+    peerDependencies:
+      vue: ^3.5.40
+
+  '@xmldom/xmldom@0.8.13':
+    resolution: {integrity: sha512-KRYzxepc14G/CEpEGc3Yn+JKaAeT63smlDr+vjB8jRfgTBBI9wRj/nkQEO+ucV8p8I9bfKLWp37uHgFrbntPvw==}
+    engines: {node: '>=10.0.0'}
+
+  '@yuku-codegen/binding-android-arm64@0.8.4':
+    resolution: {integrity: sha512-rsYkGl2kOkDRsh1mxriYnk1qBS78vjlBJ3+T2XwtwKwqOliy2n+2Ae0EDxJ/uX1DZLm3KkBZarGO5isEnmHchA==}
+    cpu: [arm64]
+    os: [android]
+
+  '@yuku-codegen/binding-darwin-arm64@0.8.4':
+    resolution: {integrity: sha512-tNLKzPF3FYmEcHSYvWp/LEpjHHAtDR13hwo6/gdCkYMi9x59CWn2obczKzWNe7kDor4/1AMZuJDEVRpFkTSefw==}
+    cpu: [arm64]
+    os: [darwin]
+
+  '@yuku-codegen/binding-darwin-x64@0.8.4':
+    resolution: {integrity: sha512-tK7LWzXNb5JbZpnoCNHB0nEhPFss/LwwehM6m/f0oYDan+iZgFZXzdoy80JdE7dVxjTZDIhUNPx8X8xbIdaoxA==}
+    cpu: [x64]
+    os: [darwin]
+
+  '@yuku-codegen/binding-freebsd-x64@0.8.4':
+    resolution: {integrity: sha512-5MUV4d7g2p5Hd8GiXW6ynTRgYjm4Dw4eM2gaWRZ4crkGetzNx+HlPxcEfGtVNPqH5Qaa4Z2REtzdsdgvaE6/Ng==}
+    cpu: [x64]
+    os: [freebsd]
+
+  '@yuku-codegen/binding-linux-arm-gnu@0.8.4':
+    resolution: {integrity: sha512-g6LnHrR0Rfqq5cXs7olwR2+LlVDc876pw7Hh7YXbukVSiBxQkaxqsEO/trO25z2g99zWzgXwoYvQZ1TnwA2wEw==}
+    cpu: [arm]
+    os: [linux]
+    libc: [glibc]
+
+  '@yuku-codegen/binding-linux-arm-musl@0.8.4':
+    resolution: {integrity: sha512-7XAPHrROPEFuJWXEGZeLZQN4xR8ENQ65+HSCtCHjSzCwGgnX53GUjM9ExVcHopV0a5g4vu57v2wwtyWIM5iNOQ==}
+    cpu: [arm]
+    os: [linux]
+    libc: [musl]
+
+  '@yuku-codegen/binding-linux-arm64-gnu@0.8.4':
+    resolution: {integrity: sha512-fnBm7NLuuwFXy7F1vRIuyOc+RW9ADUjuCKVGY87Dj8jtr9XgESNrwb+B9VLSFY7nZ0rCdK/Sm1fBqJpI7eLdKQ==}
+    cpu: [arm64]
+    os: [linux]
+    libc: [glibc]
+
+  '@yuku-codegen/binding-linux-arm64-musl@0.8.4':
+    resolution: {integrity: sha512-6vTw4ZHO9nm4SUkw36uG+UE6/qifZ0E8HIef7Mx/U/c2Zxu3JLBfXtU7U/NN2GMkDmcJkgwjXfpQoYw4Ch5Y1w==}
+    cpu: [arm64]
+    os: [linux]
+    libc: [musl]
+
+  '@yuku-codegen/binding-linux-x64-gnu@0.8.4':
+    resolution: {integrity: sha512-+vuC3V3Lw+DB4oJgHV9pVDfQZlsZJnxmbdods7HzxgEALU3P5+czwdAcw3wfh7Ebabt0Ny8eLUb1k9RV5OB/+w==}
+    cpu: [x64]
+    os: [linux]
+    libc: [glibc]
+
+  '@yuku-codegen/binding-linux-x64-musl@0.8.4':
+    resolution: {integrity: sha512-QH60PE4eZecmgNGa1/T1cKPhrfxt6ANtu4lrQ1FZ50F9b0GS9WjGmIjrfdSUeQa+f2Iqk3oEFSJdgVHBg1KPNg==}
+    cpu: [x64]
+    os: [linux]
+    libc: [musl]
+
+  '@yuku-codegen/binding-win32-arm64@0.8.4':
+    resolution: {integrity: sha512-6r68c0nKZPIBRXZIBiD7zjlEukBR+xRxpTOVj4n1Fsjcdh4YbbJfjFfmIzdbo9jXR1xL+dPueDVdsRGOUH5MoQ==}
+    cpu: [arm64]
+    os: [win32]
+
+  '@yuku-codegen/binding-win32-x64@0.8.4':
+    resolution: {integrity: sha512-i+BW77LPjNqe7Apq50J3OeEaVfga3G+eT2bKjb6bj4yO99fil/jnKb4ZDH4JLvby/Q7hRa6VicL2EZ7iS+ifzA==}
+    cpu: [x64]
+    os: [win32]
+
+  '@yuku-parser/binding-android-arm64@0.8.4':
+    resolution: {integrity: sha512-+HIMmv08Zrh9ugIAEMnKBMMePOl7CDxrjc8Vui1+GG2TJHM1yI1+3wo1pnXB6Nj2IiHugDkQw8ycUI6SA2EUkQ==}
+    cpu: [arm64]
+    os: [android]
+
+  '@yuku-parser/binding-darwin-arm64@0.8.4':
+    resolution: {integrity: sha512-Elf/B/2m3OsyvxoQnBk8Dtu+9csHkzBNs5Yv9GbHjT3x0kVKNWjFusyZgm41VwxcPDqdpRi8tWxNX7OqXkmf/A==}
+    cpu: [arm64]
+    os: [darwin]
+
+  '@yuku-parser/binding-darwin-x64@0.8.4':
+    resolution: {integrity: sha512-CjZuMoXnL5XUkVpDqh4WDPwpAw8CwmtHHnTerGkS45So/sNuwkXdyIAEqqIZfaLopi5W/V9NApAT2md9XizjsQ==}
+    cpu: [x64]
+    os: [darwin]
+
+  '@yuku-parser/binding-freebsd-x64@0.8.4':
+    resolution: {integrity: sha512-ibLKORdz71iI4Vs+fyFgvwQ51P5XcxJIyQLa8cSEWqwptRdo+BTcZHIQEcZnFDPUuvmJ19RRH9CoiJdfhr7pZw==}
+    cpu: [x64]
+    os: [freebsd]
+
+  '@yuku-parser/binding-linux-arm-gnu@0.8.4':
+    resolution: {integrity: sha512-Fo3r5fYhGDcFnl+KN+L9PgtiQPS4AIE1n1mG1o5jZ11p7g5yZ/1EjLFmSHAUsoXreun8KjTsFjEL7P1Sb93PZQ==}
+    cpu: [arm]
+    os: [linux]
+    libc: [glibc]
+
+  '@yuku-parser/binding-linux-arm-musl@0.8.4':
+    resolution: {integrity: sha512-BEB31vUEgXPWf7WkoMPSzzJhpC/wWCBXyysRCCPsw47BJ/OtbQsvJbxX9fFDuSRLy3kbyIV/WbdUTgbQ9COxiw==}
+    cpu: [arm]
+    os: [linux]
+    libc: [musl]
+
+  '@yuku-parser/binding-linux-arm64-gnu@0.8.4':
+    resolution: {integrity: sha512-xGLCRcHn9xVz7JVNyyKtiNJSf503qtUmih9XVSsghgzOmiKUMnHObs69OMMwXN3788tg1jsl11fNjjQlB8idMA==}
+    cpu: [arm64]
+    os: [linux]
+    libc: [glibc]
+
+  '@yuku-parser/binding-linux-arm64-musl@0.8.4':
+    resolution: {integrity: sha512-3kNRi8NJT2q6FQRVCUFHIQ99+kXdi8cVJEEUi6+xtFqpMgNrZNnbgAj28ILsDC7zmclaU+v47eUCeJoKLSCbww==}
+    cpu: [arm64]
+    os: [linux]
+    libc: [musl]
+
+  '@yuku-parser/binding-linux-x64-gnu@0.8.4':
+    resolution: {integrity: sha512-isi62oMy94Z3OXwGs2l2rkqRiRyqLmfHeTRHpA/uWZbsNhnm7IdVvkF7e7wHNKAtd5jwGzOqYSroxKv2fOm7Cw==}
+    cpu: [x64]
+    os: [linux]
+    libc: [glibc]
+
+  '@yuku-parser/binding-linux-x64-musl@0.8.4':
+    resolution: {integrity: sha512-9RsEw2xYHqU/pjSRBTOupWN3sF8uz9stjJdARfz6o0llvF+yfrj5QHmTiocGGBeAI80fvKmDtr2RIQClUzAPcA==}
+    cpu: [x64]
+    os: [linux]
+    libc: [musl]
+
+  '@yuku-parser/binding-win32-arm64@0.8.4':
+    resolution: {integrity: sha512-VEZHo9rEGOBKR20sA3vCO00aQvwWND5aLu7YxeX+YupMZJh9hd1f17AbClJN37Q2iL1PCHht+wDTOKX6tZYqXg==}
+    cpu: [arm64]
+    os: [win32]
+
+  '@yuku-parser/binding-win32-x64@0.8.4':
+    resolution: {integrity: sha512-PeH3VzN1feGjPtDpVEAqf000fPT+nxtw/696LKp/5Z9RJi/MaXpB636QC+5QtrAPSoEnIkyEe+c+mq2QLZPWBA==}
+    cpu: [x64]
+    os: [win32]
+
+  '@yuku-toolchain/types@0.8.4':
+    resolution: {integrity: sha512-p7JE8flrj7ijZ/qLjHi4UwKqMarMD6zumbKXhrjp2I2iLJOuTYiQyci2U36VlXcUlNyzsY7E/mLnKCHotbzJVw==}
 
   abbrev@2.0.0:
     resolution: {integrity: sha512-6/mh1E2u2YgEsCHdY0Yx5oW+61gZU+1vXaoiHHrpKeuRNNgFvS+/jrwHiQhB5apAf5oB7UB7E19ol2R2LKH8hQ==}
     engines: {node: ^14.17.0 || ^16.13.0 || >=18.0.0}
 
+  abbrev@3.0.1:
+    resolution: {integrity: sha512-AO2ac6pjRB3SJmGJo+v5/aK6Omggp6fsLrs6wN9bd35ulu4cCwaAU9+7ZhXjeqHVkaHThLuzH0nZr0YpCDhygg==}
+    engines: {node: ^18.17.0 || >=20.5.0}
+
+  abbrev@4.0.0:
+    resolution: {integrity: sha512-a1wflyaL0tHtJSmLSOVybYhy22vRih4eduhhrkcjgrWGnRfrZtovJ2FRjxuTtkkj47O/baf0R86QU5OuYpz8fA==}
+    engines: {node: ^20.17.0 || >=22.9.0}
+
   abort-controller@3.0.0:
     resolution: {integrity: sha512-h8lQ8tacZYnR3vNQTgibj+tODHI5/+l06Au2Pcriv/Gmet0eaj4TwWH41sO9wnHDiQsEj19q0drzdWdeAHtweg==}
     engines: {node: '>=6.5'}
@@ -4364,8 +6193,8 @@ packages:
     peerDependencies:
       acorn: ^6.0.0 || ^7.0.0 || ^8.0.0
 
-  acorn@8.14.0:
-    resolution: {integrity: sha512-cl669nCJTZBsL97OF4kUQm5g5hC2uihk0NxY3WENAC0TYdILVkAyHymAntgxGkl7K+t0cXIrH5siy5S4XkFycA==}
+  acorn@8.18.0:
+    resolution: {integrity: sha512-lGq+9yr1/GuAWaVYIHRjvvySG5/4VfKIvC8EWxStPdcDh/Ka7FG3twP6v4d5BkravUilhIAsG4Qj83t02LWUPQ==}
     engines: {node: '>=0.4.0'}
     hasBin: true
 
@@ -4377,48 +6206,18 @@ packages:
     resolution: {integrity: sha512-RZNwNclF7+MS/8bDg70amg32dyeZGZxiDuQmZxKLAlQjr3jGyLx+4Kkk58UO7D2QdgFIQCovuSuZESne6RG6XQ==}
     engines: {node: '>= 6.0.0'}
 
-  agent-base@7.1.3:
-    resolution: {integrity: sha512-jRR5wdylq8CkOe6hei19GGZnxM6rBGwFl3Bg0YItGDimvjGtAvdZk4Pu6Cl4u4Igsws4a1fd1Vq3ezrhn4KmFw==}
+  agent-base@7.1.4:
+    resolution: {integrity: sha512-MnA+YT8fwfJPgBx3m60MNqakm30XOkyIoH1y6huTQvC0PwZG7ki8NacLBcrPbNoo8vEZy7Jpuk7+jMO+CUovTQ==}
     engines: {node: '>= 14'}
 
-  agentkeepalive@4.5.0:
-    resolution: {integrity: sha512-5GG/5IbQQpC9FpkRGsSvZI5QYeSCzlJHdpBQntCsuTOxhKD8lqKhrleg2Yi7yvMIf82Ycmmqln9U8V9qwEiJew==}
-    engines: {node: '>= 8.0.0'}
+  ajv@6.15.0:
+    resolution: {integrity: sha512-fgFx7Hfoq60ytK2c7DhnF8jIvzYgOMxfugjLOSMHjLIPgenqa7S7oaagATUq99mV6IYvN2tRmC0wnTYX6iPbMw==}
 
-  aggregate-error@3.1.0:
-    resolution: {integrity: sha512-4I7Td01quW/RpocfNayFdFVk1qSuoh0E7JrbRJ16nH01HhKFQ88INq9Sd+nd72zqRySlr9BmDA8xlEJ6vJMrYA==}
-    engines: {node: '>=8'}
+  ajv@8.20.0:
+    resolution: {integrity: sha512-Thbli+OlOj+iMPYFBVBfJ3OmCAnaSyNn4M1vz9T6Gka5Jt9ba/HIR56joy65tY6kx/FCF5VXNB819Y7/GUrBGA==}
 
-  ajv-draft-04@1.0.0:
-    resolution: {integrity: sha512-mv00Te6nmYbRp5DCwclxtt7yV/joXJPGS7nM+97GdxvuttCOfgI3K4U25zboyeX0O+myI8ERluxQe5wljMmVIw==}
-    peerDependencies:
-      ajv: ^8.5.0
-    peerDependenciesMeta:
-      ajv:
-        optional: true
-
-  ajv-formats@3.0.1:
-    resolution: {integrity: sha512-8iUql50EUR+uUcdRQ3HDqa6EVyo3docL8g5WJ3FNcWmu62IbkGUue/pEyLBW8VGKKucTPgqeks4fIU1DA4yowQ==}
-    peerDependencies:
-      ajv: ^8.0.0
-    peerDependenciesMeta:
-      ajv:
-        optional: true
-
-  ajv@6.12.6:
-    resolution: {integrity: sha512-j3fVLgvTo527anyYyJOGTYJbG+vnnQYvE0m5mmkc1TK+nxAppkCLMIL0aZ4dblVCNoGShhm+kzE4ZUykBoMg4g==}
-
-  ajv@8.12.0:
-    resolution: {integrity: sha512-sRu1kpcO9yLtYxBKvqfTeh9KzZEwO3STyX1HT+4CaDzC6HpTGYhIhPIzj9XuKU7KYDwnaeh5hcOwjy1QuJzBPA==}
-
-  ajv@8.13.0:
-    resolution: {integrity: sha512-PRA911Blj99jR5RMeTunVbNXMF6Lp4vZXnk5GQjcnUWUTsrXtekg/pnmFFI2u/I36Y/2bITGS30GZCXei6uNkA==}
-
-  ajv@8.17.1:
-    resolution: {integrity: sha512-B/gBuNg5SiMTrPkC+A2+cW0RszwxYmn6VYxB/inlBStS5nx6xHIt/ehKRhIMhqusl7a8LjQoZnjCs5vhwxOQ1g==}
-
-  alien-signals@0.2.2:
-    resolution: {integrity: sha512-cZIRkbERILsBOXTQmMrxc9hgpxglstn69zm+F1ARf4aPAzdAFYd6sBq87ErO0Fj3DV94tglcyHG5kQz9nDC/8A==}
+  alien-signals@3.2.1:
+    resolution: {integrity: sha512-I8FjmltrfnDFoZedi5CG8DghVYNhzb/Ijluz7tCSJH0xpd0484Kowhbb1XDYOxfJpU1p5wnM2X54dA+IfGyD1g==}
 
   ansi-align@3.0.1:
     resolution: {integrity: sha512-IOfwwBF5iczOjp/WeY4YxyjqAFMQoZufdQWDd19SEExbVLNXqvpzSJ/M7Za4/sCPmQ0+GRquoA7bGcINcxew6w==}
@@ -4427,39 +6226,50 @@ packages:
     resolution: {integrity: sha512-/6w/C21Pm1A7aZitlI5Ni/2J6FFQN8i1Cvz3kHABAAbw93v/NlvKdVOqz7CCWz/3iv/JplRSEEZ83XION15ovw==}
     engines: {node: '>=6'}
 
-  ansi-escapes@7.0.0:
-    resolution: {integrity: sha512-GdYO7a61mR0fOlAsvC9/rIHf7L96sBc6dEWzeOu+KAea5bZyQRPIpojrVoI4AXGJS/ycu/fBTdLrUkA4ODrvjw==}
+  ansi-escapes@7.3.0:
+    resolution: {integrity: sha512-BvU8nYgGQBxcmMuEeUEmNTvrMVjJNSH7RgW24vXexN4Ven6qCvy4TntnvlnwnMLTVlcRQQdbRY8NKnaIoeWDNg==}
     engines: {node: '>=18'}
 
   ansi-regex@5.0.1:
     resolution: {integrity: sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==}
     engines: {node: '>=8'}
 
-  ansi-regex@6.1.0:
-    resolution: {integrity: sha512-7HSX4QQb4CspciLpVFwyRe79O3xsIZDDLER21kERQ71oaPodF8jL725AgJMFAYbooIqolJoRLuM81SpeUkpkvA==}
+  ansi-regex@6.2.2:
+    resolution: {integrity: sha512-Bq3SmSpyFHaWjPk8If9yc6svM8c56dB5BAtW4Qbw5jHTwwXXcTLoRMkpDJp6VL0XzlWaCHTXrkFURMYmD0sLqg==}
     engines: {node: '>=12'}
 
   ansi-styles@4.3.0:
     resolution: {integrity: sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==}
     engines: {node: '>=8'}
 
-  ansi-styles@6.2.1:
-    resolution: {integrity: sha512-bN798gFfQX+viw3R7yrGWRqnrN2oRkEkUjjl4JNn4E8GxxbjtG3FbrEIIY3l8/hrwUwIeCZvi4QuOTP4MErVug==}
+  ansi-styles@6.2.3:
+    resolution: {integrity: sha512-4Dj6M28JB+oAH8kFkTLUo+a2jwOFkuqb3yucU0CANcRRUbxS0cP0nZYCGjcc3BNXwRIsUVmDGgzawme7zvJHvg==}
     engines: {node: '>=12'}
 
+  ansis@4.3.1:
+    resolution: {integrity: sha512-BJ8/l4R5LRE7hW9WdSuGYrLSHi2ynxeFpDFbH0K/CgNeY/tyhk+vO6TYxXC5r5CpUhNVX310xzPsN/H9lCdfOA==}
+    engines: {node: '>=14'}
+
   ant-design-vue@4.2.6:
     resolution: {integrity: sha512-t7eX13Yj3i9+i5g9lqFyYneoIb3OzTvQjq9Tts1i+eiOd3Eva/6GagxBSXM1fOCjqemIu0FYVE1ByZ/38epR3Q==}
     engines: {node: '>=12.22.0'}
     peerDependencies:
-      vue: ^3.5.13
+      vue: ^3.5.40
 
-  any-promise@1.3.0:
-    resolution: {integrity: sha512-7UvmKalWRt1wgjL1RrGxoSJW/0QZFIegpeGvZG9kjp8vrRu55XTHbwnqq2GpXm9uLbcuhxm3IqX9OB4MZR1b2A==}
+  antdv-next@1.5.0:
+    resolution: {integrity: sha512-cUJNQYchAcQS2YOiKlNkzgLxwT0vI5eblex/UXtTdM/0cNwENY3K5VCCC0g5+wkifHR6wCh8y8o4sHouKsxThQ==}
 
   anymatch@3.1.3:
     resolution: {integrity: sha512-KMReFUr0B4t+D+OBkjR3KYqvocp2XaSzO55UcB6mgQMd3KbcE+mWTyvVV7D/zsdEbNnV6acZUutkiHQXvTr1Rw==}
     engines: {node: '>= 8'}
 
+  app-builder-lib@26.15.3:
+    resolution: {integrity: sha512-2VnyWkqsP5v5XbBhL3tD5Syx8iNPBYsoU7kY4S2fz7wg8Rj/nztWKCUzGKaFRTv0Xwf3/H058CR1Kvtd/3lRow==}
+    engines: {node: '>=14.0.0'}
+    peerDependencies:
+      dmg-builder: 26.15.3
+      electron-builder-squirrel-windows: 26.15.3
+
   archiver-utils@2.1.0:
     resolution: {integrity: sha512-bEL/yUb/fNNiNTuUz979Z0Yg5L+LzLxGJz8x79lYmR54fmTIb6ob/hNQgkQnIUDWIFjZVQwl9Xs356I6BAMHfw==}
     engines: {node: '>= 6'}
@@ -4480,12 +6290,9 @@ packages:
     resolution: {integrity: sha512-ZcbTaIqJOfCc03QwD468Unz/5Ir8ATtvAHsK+FdXbDIbGfihqh9mrvdcYunQzqn4HrvWWaFyaxJhGZagaJJpPQ==}
     engines: {node: '>= 14'}
 
-  are-docs-informative@0.0.2:
-    resolution: {integrity: sha512-ixiS0nLNNG5jNQzgZJNoUpBKdo9yTYZMGJ+QgT2jmjR7G7+QHRCc4v6LQ3NgE7EBJq+o0ams3waJwkrlBom8Ig==}
-    engines: {node: '>=14'}
-
-  arg@5.0.2:
-    resolution: {integrity: sha512-PYjyFOLKQ9y57JvQ6QLo8dAgNqswh8M1RMJYdQduT6xbWSgK36P/Z/v+p888pM69jMMfS8Xd8F6I1kQ/I9HUGg==}
+  archiver@8.0.0:
+    resolution: {integrity: sha512-fV1orZfsnPn9BaSByR/qE67rJCLJEy2Ox5bq7nJh+jquWaNh6Sfec75kJ2T6PtdGUbPQlrVoSVCEOa5SdiTQ1g==}
+    engines: {node: '>=18'}
 
   argparse@1.0.10:
     resolution: {integrity: sha512-o5Roy6tNG4SL/FOkCAN6RzjiakZS25RLYFrcMttJqbdd8BWrnA+fGz57iN5Pb06pvBGvl5gQ0B48dJlslXvoTg==}
@@ -4493,21 +6300,18 @@ packages:
   argparse@2.0.1:
     resolution: {integrity: sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==}
 
-  aria-hidden@1.2.4:
-    resolution: {integrity: sha512-y+CcFFwelSXpLZk/7fMB2mUbGtX9lKycf1MWJ7CaTIERyitVlyQx6C+sxcROU2BAJ24OiZyK+8wj2i8AlBoS3A==}
+  argue-cli@3.1.0:
+    resolution: {integrity: sha512-DhBpBfXL4SS2uC0N922MMajKR3CdrTG0u2or1PNYgXMsrSzViJrbtvT0nCLlLGUI0plam/ZZCs7aAauHtW9thw==}
+    engines: {node: '>=22'}
+
+  aria-hidden@1.2.6:
+    resolution: {integrity: sha512-ik3ZgC9dY/lYVVM++OISsaYDeg1tb0VtP5uL3ouh1koGOaUMDPpbFIei4JkFimWUFPn90sbMNMXQAIVOlnYKJA==}
     engines: {node: '>=10'}
 
   array-buffer-byte-length@1.0.2:
     resolution: {integrity: sha512-LHE+8BuR7RYGDKvnrmcuSq3tDcKv9OFEXQt/HpbZhY7V6h0zlUXutnAD82GiFx9rdieCMjkvtcsPqBwgUl1Iiw==}
     engines: {node: '>= 0.4'}
 
-  array-differ@3.0.0:
-    resolution: {integrity: sha512-THtfYS6KtME/yIAhKjZ2ul7XI96lQGHRputJQHO80LAWQnuGP4iCIN8vdMRboGbIEYBwU33q8Tch1os2+X0kMg==}
-    engines: {node: '>=8'}
-
-  array-ify@1.0.0:
-    resolution: {integrity: sha512-c5AMf34bKdvPhQ7tBGhqkgKNUzMr4WUs+WDtC2ZUGOUncbxKMTvqxYctiseW3+L4bA8ec+GcZ6/A/FW4m8ukng==}
-
   array-timsort@1.0.3:
     resolution: {integrity: sha512-/+3GRL7dDAGEfM6TseQk/U+mi18TU2Ms9I3UlLdUMhz2hbvGNTKdj9xniwXfUqgYhHxRx0+8UnKkvlNwVU+cWQ==}
 
@@ -4522,18 +6326,34 @@ packages:
     resolution: {integrity: sha512-BNoCY6SXXPQ7gF2opIP4GBE+Xw7U+pHMYKuzjgCN3GwiaIR09UUeKfheyIry77QtrCBlC0KK0q5/TER/tYh3PQ==}
     engines: {node: '>= 0.4'}
 
-  arrify@2.0.1:
-    resolution: {integrity: sha512-3duEwti880xqi4eAMN8AyR4a0ByT90zoYdLlevfrvU43vb0YZwZVfxOgxWrLXXXpyugL0hNZc9G6BiB5B3nUug==}
-    engines: {node: '>=8'}
+  asn1js@3.0.10:
+    resolution: {integrity: sha512-S2s3aOytiKdFRdulw2qPE51MzjzVOisppcVv7jVFR+Kw0kxwvFrDcYA0h7Ndqbmj0HkMIXYWaoj7fli8kgx1eg==}
+    engines: {node: '>=12.0.0'}
 
   assertion-error@2.0.1:
     resolution: {integrity: sha512-Izi8RQcffqCeNVgFigKli1ssklIbpHnCYc6AknXGYoB6grJqyeby7jv12JUQgmTAnIDnbck1uxksT4dzN3PWBA==}
     engines: {node: '>=12'}
 
+  ast-kit@2.2.0:
+    resolution: {integrity: sha512-m1Q/RaVOnTp9JxPX+F+Zn7IcLYMzM8kZofDImfsKZd8MbR+ikdOzTeztStWqfrqIxZnYWryyI9ePm3NGjnZgGw==}
+    engines: {node: '>=20.19.0'}
+
+  ast-walker-scope@0.9.0:
+    resolution: {integrity: sha512-IJdzo2vLiElBxKzwS36VsCue/62d6IdWjnPB2v3nuPKeWGynp6FF/CYoLa5i/3jXH/z97ZDdsXz6abpgM6w07A==}
+    engines: {node: '>=20.19.0'}
+
   astral-regex@2.0.0:
     resolution: {integrity: sha512-Z7tMw1ytTXt5jqMcOP+OQteU1VuNK9Y02uuJtKQ1Sv69jXQKKg5cibLwGJow8yzZP+eAc18EmLGPal0bp36rvQ==}
     engines: {node: '>=8'}
 
+  async-exit-hook@2.0.1:
+    resolution: {integrity: sha512-NW2cX8m1Q7KPA7a5M2ULQeZ2wR5qI5PAbw5L0UOMxdioVk9PMZ0h1TmyZEkPYrCvYjDlFICusOu1dlEKAAeXBw==}
+    engines: {node: '>=0.12.0'}
+
+  async-function@1.0.0:
+    resolution: {integrity: sha512-hsU18Ae8CDTR6Kgu9DYf0EbCr/a5iGL0rytQDobUcdpYOKokk8LEjVphnXkDkgpi0wYVsqrXuP0bZxJaTqdgoA==}
+    engines: {node: '>= 0.4'}
+
   async-sema@3.1.1:
     resolution: {integrity: sha512-tLRNUXati5MFePdAk8dw7Qt7DpxPB60ofAgn8WRhW6a2rcimZnYBP9oxHiv0OHy+Wz7kPMG+t4LGdt31+4EmGg==}
 
@@ -4550,11 +6370,11 @@ packages:
     resolution: {integrity: sha512-+q/t7Ekv1EDY2l6Gda6LLiX14rU9TV20Wa3ofeQmwPFZbOMo9DXrLbOjFaaclkXKWidIaopwAObQDqwWtGUjqg==}
     engines: {node: '>= 4.0.0'}
 
-  atomically@2.0.3:
-    resolution: {integrity: sha512-kU6FmrwZ3Lx7/7y3hPS5QnbJfaohcIul5fGqf7ok+4KklIEk9tJ0C2IQPdacSbVUWv6zVHXEBWoWd6NrVMT7Cw==}
+  atomically@2.1.1:
+    resolution: {integrity: sha512-P4w9o2dqARji6P7MHprklbfiArZAWvo07yW7qs3pdljb3BWr12FIB7W+p0zJiuiVsUpRO0iZn1kFFcpPegg0tQ==}
 
-  autoprefixer@10.4.20:
-    resolution: {integrity: sha512-XY25y5xSv/wEoqzDyXXME4AFfkZI0P23z6Fs3YgymDnKJkCGOnkL0iTxCa85UTqaSgfcqyf3UA6+c7wUvx/16g==}
+  autoprefixer@10.5.4:
+    resolution: {integrity: sha512-MaU0U/za7N3r6brxD4YB/l4NSrFzLPlANv6wEuQVaIPlD3L4W9rFcQPbL/EilY9BHhHvhfcz3gInDLrEtWT4EA==}
     engines: {node: ^10 || ^12 || >=14}
     hasBin: true
     peerDependencies:
@@ -4564,43 +6384,83 @@ packages:
     resolution: {integrity: sha512-wvUjBtSGN7+7SjNpq/9M2Tg350UZD3q62IFZLbRAR1bSMlCo1ZaeW+BJ+D090e4hIIZLBcTDWe4Mh4jvUDajzQ==}
     engines: {node: '>= 0.4'}
 
+  aws4@1.13.2:
+    resolution: {integrity: sha512-lHe62zvbTB5eEABUVi/AwVh0ZKY9rMMDhmm+eeyuuUQbQ3+J+fONVQOZyj+DdrvD4BY33uYniyRJ4UJIaSKAfw==}
+
   axios-mock-adapter@2.1.0:
     resolution: {integrity: sha512-AZUe4OjECGCNNssH8SOdtneiQELsqTsat3SQQCWLPjN436/H+L9AjWfV7bF+Zg/YL9cgbhrz5671hoh+Tbn98w==}
     peerDependencies:
       axios: '>= 0.17.0'
 
-  axios@1.10.0:
-    resolution: {integrity: sha512-/1xYAC4MP/HEG+3duIhFr4ZQXR4sQXOIe+o6sdqzeykGLx6Upp/1p8MHqhINOvGeP7xyNHe7tsiJByc4SSVUxw==}
+  axios@1.19.0:
+    resolution: {integrity: sha512-ht/iuYZXEjFxLH/Hkezgd7m6JKlHHXEUSneaDz8uZe1Gj5QZtCnpyDsckvAiEnT89OEbCLmnte4R4sn7P0EKFw==}
 
-  axios@1.7.9:
-    resolution: {integrity: sha512-LhLcE7Hbiryz8oMDdDptSrWowmB4Bl6RCt6sIJKpRB4XtVf0iEgewX3au/pJqm+Py1kCASkb/FFKjxQaLtxJvw==}
+  b4a@1.8.1:
+    resolution: {integrity: sha512-aiqre1Nr0B/6DgE2N5vwTc+2/oQZ4Wh1t4NznYY4E00y8LCt6NqdRv81so00oo27D8MVKTpUa/MwUUtBLXCoDw==}
+    peerDependencies:
+      react-native-b4a: '*'
+    peerDependenciesMeta:
+      react-native-b4a:
+        optional: true
 
-  b4a@1.6.7:
-    resolution: {integrity: sha512-OnAYlL5b7LEkALw87fUVafQw5rVR9RjwGd4KUwNQ6DrrNmaVaUCgLipfVlzrPQ4tWOR9P0IXGNOx50jYCCdSJg==}
-
-  babel-plugin-polyfill-corejs2@0.4.12:
-    resolution: {integrity: sha512-CPWT6BwvhrTO2d8QVorhTCQw9Y43zOu7G9HigcfxvepOU6b8o3tcWad6oVgZIsZCTt42FFv97aA7ZJsbM4+8og==}
+  babel-plugin-polyfill-corejs2@0.4.17:
+    resolution: {integrity: sha512-aTyf30K/rqAsNwN76zYrdtx8obu0E4KoUME29B1xj+B3WxgvWkp943vYQ+z8Mv3lw9xHXMHpvSPOBxzAkIa94w==}
     peerDependencies:
       '@babel/core': ^7.4.0 || ^8.0.0-0 <8.0.0
 
-  babel-plugin-polyfill-corejs3@0.10.6:
-    resolution: {integrity: sha512-b37+KR2i/khY5sKmWNVQAnitvquQbNdWy6lJdsr0kmquCKEEUgMKK4SboVM3HtfnZilfjr4MMQ7vY58FVWDtIA==}
+  babel-plugin-polyfill-corejs3@0.14.2:
+    resolution: {integrity: sha512-coWpDLJ410R781Npmn/SIBZEsAetR4xVi0SxLMXPaMO4lSf1MwnkGYMtkFxew0Dn8B3/CpbpYxN0JCgg8mn67g==}
     peerDependencies:
       '@babel/core': ^7.4.0 || ^8.0.0-0 <8.0.0
 
-  babel-plugin-polyfill-regenerator@0.6.3:
-    resolution: {integrity: sha512-LiWSbl4CRSIa5x/JAU6jZiG9eit9w6mz+yVMFwDE83LAWvt0AfGBoZ7HS/mkhrKuh2ZlzfVZYKoLjXdqw6Yt7Q==}
+  babel-plugin-polyfill-regenerator@0.6.8:
+    resolution: {integrity: sha512-M762rNHfSF1EV3SLtnCJXFoQbbIIz0OyRwnCmV0KPC7qosSfCO0QLTSuJX3ayAebubhE6oYBAYPrBA5ljowaZg==}
     peerDependencies:
       '@babel/core': ^7.4.0 || ^8.0.0-0 <8.0.0
 
   balanced-match@1.0.2:
     resolution: {integrity: sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==}
 
-  balanced-match@2.0.0:
-    resolution: {integrity: sha512-1ugUSr8BHXRnK23KfuYS+gVMC3LB8QGH9W1iGtDPsNWoQbgtXSExkBu2aDR4epiGWZOjZsj6lDl/N/AqqTC3UA==}
+  balanced-match@4.0.4:
+    resolution: {integrity: sha512-BLrgEcRTwX2o6gGxGOCNyMvGSp35YofuYzw9h1IMTRmKqttAZZVU67bdb9Pr2vUHA8+j3i2tJfjO6C6+4myGTA==}
+    engines: {node: 18 || 20 || >=22}
 
-  bare-events@2.5.0:
-    resolution: {integrity: sha512-/E8dDe9dsbLyh2qrZ64PEPadOQ0F4gbl1sUJOrmph7xOiIxfY8vwab/4bFLh4Y88/Hk/ujKcrQKc+ps0mv873A==}
+  bare-events@2.9.1:
+    resolution: {integrity: sha512-Z0oHEHAFDZkffN8Qc39zNZjQlMDkPJRyyyZieU1VH7u8c5S+qHZ2S8ixdKIAxEjfHO7FJxXmJWgteOghVanIsg==}
+    peerDependencies:
+      bare-abort-controller: '*'
+    peerDependenciesMeta:
+      bare-abort-controller:
+        optional: true
+
+  bare-fs@4.8.0:
+    resolution: {integrity: sha512-fM+MhCvdQhZ7NV6S95a07gPSqjIYKn6mFaXfx266wN3ajZGl/+1AzH+ubkXQ0fFZvOe2nk9VHkzdYkQE5zMV3Q==}
+    engines: {bare: '>=1.28.0'}
+    peerDependencies:
+      bare-buffer: '*'
+    peerDependenciesMeta:
+      bare-buffer:
+        optional: true
+
+  bare-path@3.1.1:
+    resolution: {integrity: sha512-JprUlveX3QjApC1cTpsUOiscADftCGVWkzitbHsRqv84hzYwYHw2mbluddsq5TvI8mH/8Ov1f4BiMAdcB0oYnQ==}
+
+  bare-stream@2.13.3:
+    resolution: {integrity: sha512-Kc+brLqvEqGkjyfiwJmImAOqLZL7OsoLKuavx+hJjgVV3nLTOjloJyPMFxjUPerGGHrNH0fLU06jjykMLWrERQ==}
+    peerDependencies:
+      bare-abort-controller: '*'
+      bare-buffer: '*'
+      bare-events: '*'
+    peerDependenciesMeta:
+      bare-abort-controller:
+        optional: true
+      bare-buffer:
+        optional: true
+      bare-events:
+        optional: true
+
+  bare-url@2.5.1:
+    resolution: {integrity: sha512-cD5ciQuKlx+eumTCfqbfiL+fhQm+dHbVNB/cX4+d+I/nx4JsVop9VoFEPAs5RJ6I84QR6bZIBjpd2kjDOYeWcg==}
 
   base64-arraybuffer@1.0.2:
     resolution: {integrity: sha512-I3yl4r9QB5ZRY3XuJVEPfc2XhZO6YweFPI+UovAzn+8/hb3oJ6lnysaFcjVpkCPfVWFUDvoZ8kmVDP7WyRtYtQ==}
@@ -4609,6 +6469,11 @@ packages:
   base64-js@1.5.1:
     resolution: {integrity: sha512-AKpaYlHn8t4SVbOHCy+b5+KKgvR4vrsD8vbvrbiQJps7fKDTkjkDry6ji0rUJjC0kzbNePLwzxq8iypo41qeWA==}
 
+  baseline-browser-mapping@2.11.13:
+    resolution: {integrity: sha512-k9HNuUVMlqVjQ9UHzfPjIqiDbWw7WqT1AoT7GL8VwvF3r0ZfArtgiSPAlmupyNquNgOJHTuH4CKYf8ttMTWBTQ==}
+    engines: {node: '>=6.0.0'}
+    hasBin: true
+
   better-path-resolve@1.0.0:
     resolution: {integrity: sha512-pbnl5XzGBdrFU/wT4jqmJVPn2B6UHPBOhzMQkY/SPUPB6QtUXtmBHBIwCbXJol93mOpGMnQyP/+BB19q04xj7g==}
     engines: {node: '>=4'}
@@ -4617,9 +6482,8 @@ packages:
     resolution: {integrity: sha512-QxD8cf2eVqJOOz63z6JIN9BzvVs/dlySa5HGSBH5xtR8dPteIRQnBxxKqkNTiT6jbDTF6jAfrd4oMcND9RGbQg==}
     engines: {node: '>=0.6'}
 
-  binary-extensions@2.3.0:
-    resolution: {integrity: sha512-Ceh+7ox5qe7LJuLHoY0feh3pHuUDHAcRUeyL2VYghZwfpkNIy/+8Ocg0a3UuSoYzavmylwuLWQOf3hl0jjMMIw==}
-    engines: {node: '>=8'}
+  bignumber.js@9.3.1:
+    resolution: {integrity: sha512-Ko0uX15oIUS7wJ3Rb30Fs6SkVbLmPBAKdlm7q9+ak9bbIeFf0MwuBsQV6z7+X768/cHsfg+WlysDWJcmthjsjQ==}
 
   binary@0.3.0:
     resolution: {integrity: sha512-D4H1y5KYwpJgK8wk1Cue5LLPgmwHKYSChkbspQg5JtVuR5ulGckxfR62H3AE9UDkdMC8yyXlqYihuz3Aqg2XZg==}
@@ -4627,11 +6491,11 @@ packages:
   bindings@1.5.0:
     resolution: {integrity: sha512-p2q/t/mhvuOj/UeLlV6566GD/guowlr0hHxClI0W9m7MWYkL1F0hLo+0Aexs9HSPCtR1SXQ0TD3MMKrXZajbiQ==}
 
-  bintrees@1.0.2:
-    resolution: {integrity: sha512-VOMgTMwjAaUG580SXn3LacVgjurrbMme7ZZNYGSSV7mmtY6QQRh0Eg3pwIcntQ77DErK1L0NxkbetjcoXzVwKw==}
+  birpc@2.9.0:
+    resolution: {integrity: sha512-KrayHS5pBi69Xi9JmvoqrIgYGDkD6mcSe/i6YKi3w5kekCLzrX4+nawcXqrj2tIp50Kw/mT/s3p+GVK0A0sKxw==}
 
-  birpc@0.2.19:
-    resolution: {integrity: sha512-5WeXXAvTmitV1RqJFppT5QtUiz2p1mRSYU000Jkft5ZUCLJIk4uQriYNO50HknxKwM6jd8utNc66K1qGIwwWBQ==}
+  birpc@4.1.0:
+    resolution: {integrity: sha512-O8L9vALWGqdEe0cG4HJckauw3WeJETlJnDRPUYpgwB7wrU43b/5NGMdVjdVcRo+4ROgd3ih2wha1glDe4HRVgw==}
 
   bl@4.1.0:
     resolution: {integrity: sha512-1W07cM9gS6DcLperZfFSj+bWLtaPGSOHWhPiGzXmvVJbRLdG82sH/Kn8EtW1VqWVA54AKf2h5k5BbnIbwF3h6w==}
@@ -4639,25 +6503,36 @@ packages:
   bluebird@3.4.7:
     resolution: {integrity: sha512-iD3898SR7sWVRHbiQv+sHUtHnMvC1o3nW5rAcqnq3uOn07DSAppZYUkIGslDz6gXC7HfunPe7YVBgoEJASPcHA==}
 
+  bluebird@3.7.2:
+    resolution: {integrity: sha512-XpNj6GDQzdfW+r2Wnn7xiSAd7TM3jzkxGXBGTtWKuSXv1xUV+azxAm8jdWZN06QTQk+2N2XB9jRDkvbmQmcRtg==}
+
   boolbase@1.0.0:
     resolution: {integrity: sha512-JZOSA7Mo9sNGB8+UjSgzdLtokWAky1zbztM3WRLCbZ70/3cTANmQmOdR7y2g+J0e2WXywy1yS468tY+IruqEww==}
 
+  boolean@3.2.0:
+    resolution: {integrity: sha512-d0II/GO9uf9lfUHH2BQsjxzRJZBdsjgsBiW4BvhWk/3qoKwQFjIDVN19PfX8F2D/r9PCMTtLWjYVCFrpeYUzsw==}
+    deprecated: Package no longer supported. Contact Support at https://www.npmjs.com/support for more info.
+
   boxen@8.0.1:
     resolution: {integrity: sha512-F3PH5k5juxom4xktynS7MoFY+NUWH5LC4CnH11YB8NPew+HLpmBLCybSAEyb2F+4pRXhuhWqFesoQd6DAyc2hw==}
     engines: {node: '>=18'}
 
-  brace-expansion@1.1.11:
-    resolution: {integrity: sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==}
+  brace-expansion@1.1.18:
+    resolution: {integrity: sha512-Edep/X9fGqVNmzKBVsDYIOtD+z1tuezV70LBjdCst9Tqu76lsnvRiZ6oTic1n+/BIwX6QDGAO94PN4N2SADvtw==}
 
-  brace-expansion@2.0.1:
-    resolution: {integrity: sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==}
+  brace-expansion@2.1.4:
+    resolution: {integrity: sha512-hGfVzPxthbf3+2yjg/RBs60cB0FhqBS/zvdV/4wn4/BmN0bNMMHPc4V/BbFieqf1TKAGGAHnY4eSjajCl0f2Xg==}
+
+  brace-expansion@5.0.9:
+    resolution: {integrity: sha512-ScQ4IuvIEF1TMlP7Zt+vjJ//9zlPb2SDcxWxM3bk8s6t6GGdJ7KO1dCcTidOPJKePW30LE/2cT7wCyPho9/Wxg==}
+    engines: {node: 20 || >=22}
 
   braces@3.0.3:
     resolution: {integrity: sha512-yQbXgO/OSZVD2IsiLlro+7Hf6Q18EJrKSEsdoMzKePKXct3gvD8oLcOQdIzGupr5Fj+EDe8gO/lxc1BzfMpxvA==}
     engines: {node: '>=8'}
 
-  browserslist@4.24.3:
-    resolution: {integrity: sha512-1CPmv8iobE2fyRMV97dAcMVegvvWKxmq94hkLiAkUGwKVTyDLw33K+ZxiFrREKmmps4rIw6grcCFCnTMSZ/YiA==}
+  browserslist@4.28.8:
+    resolution: {integrity: sha512-V2NpofLblG64mfOtSgDhOJESZEGogzDMBv/q+W6oc4LXWP/q75eOXoOaaOu1EOadB9U4Bwx/e0yzbvwKH8zalA==}
     engines: {node: ^6 || ^7 || ^8 || ^9 || ^10 || ^11 || ^12 || >=13.7}
     hasBin: true
 
@@ -4671,6 +6546,10 @@ packages:
   buffer-from@1.1.2:
     resolution: {integrity: sha512-E+XQCRwSbaaiChtv6k6Dwgc+bx+Bs6vuKJHHl5kox/BaKbhiXzqQOwK4cO22yElGp2OCmjwVhT3HmxgyPGnJfQ==}
 
+  buffer-image-size@0.6.4:
+    resolution: {integrity: sha512-nEh+kZOPY1w+gcCMobZ6ETUp9WfibndnosbpwB1iJk/8Gt5ZF2bhS6+B6bPYz424KtwsR6Rflc3tCz1/ghX2dQ==}
+    engines: {node: '>=4.0'}
+
   buffer-indexof-polyfill@1.0.2:
     resolution: {integrity: sha512-I7wzHwA3t1/lwXQh+A5PbNvJxgfo5r3xulgpYDB5zckTu/Z9oUK9biouBKQUjEqzaz3HnAT6TYoovmE+GqSf7A==}
     engines: {node: '>=0.10'}
@@ -4685,18 +6564,26 @@ packages:
     resolution: {integrity: sha512-9q/rDEGSb/Qsvv2qvzIzdluL5k7AaJOTrw23z9reQthrbF7is4CtlT0DXyO1oei2DCp4uojjzQ7igaSHp1kAEQ==}
     engines: {node: '>=0.2.0'}
 
-  builtin-modules@3.3.0:
-    resolution: {integrity: sha512-zhaCDicdLuWN5UbN5IMnFqNMhNfo919sH85y2/ea+5Yg9TsTkeZxpL+JLbp6cgYFS4sRLp3YV4S6yDuqVWHYOw==}
-    engines: {node: '>=6'}
+  builder-util-runtime@9.7.0:
+    resolution: {integrity: sha512-g/kR520giAFYkSXTzcmF3kqQq7wi8F6N6SzeDgZrqTBN+VHdmgWOyTdD1yD7AATDId/yXLvuP34CxW46/BwCdw==}
+    engines: {node: '>=12.0.0'}
+
+  builder-util@26.15.3:
+    resolution: {integrity: sha512-q2hn7Mbo2nFNkVekPiHFx6Nfo3hURmES3tfBn+k5Pqxl2RkmP3QGqZUhH/q9Pch/4G05NRhPjDlVj1O8q4Txvw==}
+    engines: {node: '>=14.0.0'}
 
   bundle-name@4.1.0:
     resolution: {integrity: sha512-tjwM5exMg6BGRI+kNmTntNsvdZS1X8BFYS6tnJ2hdH0kVxM6/eVZ2xy+FqStSWvYmtfFMDLIxurorHwDKfDz5Q==}
     engines: {node: '>=18'}
 
-  c12@2.0.1:
-    resolution: {integrity: sha512-Z4JgsKXHG37C6PYUtIxCfLJZvo6FyhHJoClwwb9ftUkLpPSkuYqn6Tr+vnaN8hymm0kIbcg6Ey3kv/Q71k5w/A==}
+  bytestreamjs@2.0.1:
+    resolution: {integrity: sha512-U1Z/ob71V/bXfVABvNr/Kumf5VyeQRBEm6Txb0PQ6S7V5GpBM3w4Cbqz/xPDicR5tN0uvDifng8C+5qECeGwyQ==}
+    engines: {node: '>=6.0.0'}
+
+  c12@3.3.4:
+    resolution: {integrity: sha512-cM0ApFQSBXuourJejzwv/AuPRvAxordTyParRVcHjjtXirtkzM0uK2L9TTn9s0cXZbG7E55jCivRQzoxYmRAlA==}
     peerDependencies:
-      magicast: ^0.3.5
+      magicast: '*'
     peerDependenciesMeta:
       magicast:
         optional: true
@@ -4705,25 +6592,33 @@ packages:
     resolution: {integrity: sha512-b6Ilus+c3RrdDk+JhLKUAQfzzgLEPy6wcXqS7f/xe1EETvsDP6GORG7SFuOs6cID5YkqchW/LXZbX5bc8j7ZcQ==}
     engines: {node: '>=8'}
 
-  cacache@15.3.0:
-    resolution: {integrity: sha512-VVdYzXEn+cnbXpFgWs5hTT7OScegHVmLhJIR8Ufqk3iFD6A6j5iSX1KuBTfNEv4tdJWE2PzA6IVFtcLC7fN9wQ==}
-    engines: {node: '>= 10'}
+  cac@7.0.0:
+    resolution: {integrity: sha512-tixWYgm5ZoOD+3g6UTea91eow5z6AAHaho3g0V9CNSNb45gM8SmflpAc+GRd1InC4AqN/07Unrgp56Y94N9hJQ==}
+    engines: {node: '>=20.19.0'}
 
-  call-bind-apply-helpers@1.0.1:
-    resolution: {integrity: sha512-BhYE+WDaywFg2TBWYNXAE+8B1ATnThNBqXHP5nQu0jWJdVvY2hvkpyB3qOmtmDePiS5/BDQ8wASEWGMWRG148g==}
+  cacheable-lookup@5.0.4:
+    resolution: {integrity: sha512-2/kNscPhpcxrOigMZzbiWF7dz8ilhb/nIHU3EyZiXWXpeq/au8qJ8VhdftMkty3n7Gj6HIGalQG8oiBNB3AJgA==}
+    engines: {node: '>=10.6.0'}
+
+  cacheable-request@7.0.4:
+    resolution: {integrity: sha512-v+p6ongsrp0yTGbJXjgxPow2+DL93DASP4kXCDKb8/bwRtt9OEF3whggkkDkGNzgcWy2XaF4a8nZglC7uElscg==}
+    engines: {node: '>=8'}
+
+  cacheable@2.5.0:
+    resolution: {integrity: sha512-60cyAOytib/OzBw1JNSoSV/boK1AtHryDIjvVBk7XbN4ugfkM3+Sry7fEjNgPMGgOjuaZPAp8ruZ0Cxafwyq9g==}
+
+  call-bind-apply-helpers@1.0.2:
+    resolution: {integrity: sha512-Sp1ablJ0ivDkSzjcaJdxEunN5/XvksFJ2sMBFfq6x0ryhQV/2b/KwFe21cMpmHtPOSij8K99/wSfoEuTObmuMQ==}
     engines: {node: '>= 0.4'}
 
-  call-bind@1.0.8:
-    resolution: {integrity: sha512-oKlSFMcMwpUg2ednkhQ454wfWiU/ul3CkJe/PEHcTKuiX6RpbehUiFMXu13HalGZxfUwCQzZG747YXBn1im9ww==}
+  call-bind@1.0.9:
+    resolution: {integrity: sha512-a/hy+pNsFUTR+Iz8TCJvXudKVLAnz/DyeSUo10I5yvFDQJBFU2s9uqQpoSrJlroHUKoKqzg+epxyP9lqFdzfBQ==}
     engines: {node: '>= 0.4'}
 
-  call-bound@1.0.3:
-    resolution: {integrity: sha512-YTd+6wGlNlPxSuri7Y6X8tY2dmm12UMH66RpKMhiX6rsk5wXXnYgbUcOt8kiS31/AjfoTOvCsE+w8nZQLQnzHA==}
+  call-bound@1.0.4:
+    resolution: {integrity: sha512-+ys997U96po4Kx/ABpBCqhA9EuxJaQWDQg7295H4hBphv3IZg0boBKuwYpt4YXp6MZ5AmZQnU/tyMTlRpaSejg==}
     engines: {node: '>= 0.4'}
 
-  callsite@1.0.0:
-    resolution: {integrity: sha512-0vdNRFXn5q+dtOqjfFtmtlI9N2eVZ7LMyEV2iKC5mEEFvSg/69Ml6b/WU2qF8W1nLRa0wiSrDT3Y5jOHZCwKPQ==}
-
   callsites@3.1.0:
     resolution: {integrity: sha512-P8BjAsXvZS+VIDUI11hHCQEv74YT67YUi5JJFNWIqL235sBmjX4+qx9Muvls5ivyNENctx46xQLQ3aTuE7ssaQ==}
     engines: {node: '>=6'}
@@ -4731,18 +6626,10 @@ packages:
   camel-case@4.1.2:
     resolution: {integrity: sha512-gxGWBrTT1JuMx6R+o5PTXMmUnhnVzLQ9SNutD4YqKtI6ap897t3tKECYla6gCWEkplXnlNybEkZg9GEGxKFCgw==}
 
-  camelcase-css@2.0.1:
-    resolution: {integrity: sha512-QOSvevhslijgYwRx6Rv7zKdMF8lbRmx+uQGx2+vDc+KI/eBnsy9kit5aj23AgGu3pa4t9AgwbnXWqS+iOY+2aA==}
-    engines: {node: '>= 6'}
-
   camelcase@5.3.1:
     resolution: {integrity: sha512-L28STB170nwWS63UjtlEOE3dldQApaJXZkOI1uMFfzf3rRuPegHaHesyee+YxQ+W6SvRDQV6UrdOdRiR153wJg==}
     engines: {node: '>=6'}
 
-  camelcase@6.3.0:
-    resolution: {integrity: sha512-Gmy6FhYlCY7uOElZUSbxo2UCDH8owEk996gkbrpsgGtrJLM3J7jGxl9Ic7Qwwj4ivOE5AWZWRMecDdF7hqGjFA==}
-    engines: {node: '>=10'}
-
   camelcase@8.0.0:
     resolution: {integrity: sha512-8WB3Jcas3swSvjIeA2yvCJ+Miyz5l1ZmB6HFb9R1317dt9LCQoswg/BGrmAmkWVEszSrrg4RwmO46qIm2OEnSA==}
     engines: {node: '>=16'}
@@ -4750,84 +6637,72 @@ packages:
   caniuse-api@3.0.0:
     resolution: {integrity: sha512-bsTwuIg/BZZK/vreVTYYbSWoe2F+71P7K5QGEX+pT250DZbfU1MQ5prOKpPR+LL6uWKK3KMwMCAS74QB3Um1uw==}
 
-  caniuse-lite@1.0.30001690:
-    resolution: {integrity: sha512-5ExiE3qQN6oF8Clf8ifIDcMRCRE/dMGcETG/XGMD8/XiXm6HXQgQTh1yZYLXXpSOsEUlJm1Xr7kGULZTuGtP/w==}
+  caniuse-lite@1.0.30001809:
+    resolution: {integrity: sha512-xxWVywk6a6Arlk+hymeycyn/VgqEfLDxupvhH/xiY5SJ/18kmi9o6MiO320DCUzypORHLtvh0I4i04tUhCNHNQ==}
 
   cfb@1.2.2:
     resolution: {integrity: sha512-KfdUZsSOw19/ObEWasvBP/Ac4reZvAGauZhs6S/gqNhXhI7cKwvlH7ulj+dOEYnca4bm4SGo8C1bTAQvnTjgQA==}
     engines: {node: '>=0.8'}
 
-  chai@5.1.2:
-    resolution: {integrity: sha512-aGtmf24DW6MLHHG5gCx4zaI3uBq3KRtxeVs0DjFH6Z0rDNbsvTxFASFvdj79pxjxZ8/5u3PIiN3IwEIQkiiuPw==}
-    engines: {node: '>=12'}
+  chai@6.2.2:
+    resolution: {integrity: sha512-NUPRluOfOiTKBKvWPtSD4PhFvWCqOi0BGStNWs57X9js7XGTprSmFoz5F0tWhR4WPjNeR9jXqdC7/UpSJTnlRg==}
+    engines: {node: '>=18'}
 
   chainsaw@0.1.0:
     resolution: {integrity: sha512-75kWfWt6MEKNC8xYXIdRpDehRYY/tNSgwKaJq+dbbDcxORuVrrQ+SEHoWsniVn9XPYfP4gmdWIeDk/4YNp1rNQ==}
 
-  chalk-template@1.1.0:
-    resolution: {integrity: sha512-T2VJbcDuZQ0Tb2EWwSotMPJjgpy1/tGee1BTpUNsGZ/qgNjV2t7Mvu+d4600U564nbLesN1x2dPL+xii174Ekg==}
+  chalk-template@1.1.2:
+    resolution: {integrity: sha512-2bxTP2yUH7AJj/VAXfcA+4IcWGdQ87HwBANLt5XxGTeomo8yG0y95N1um9i5StvhT/Bl0/2cARA5v1PpPXUxUA==}
     engines: {node: '>=14.16'}
 
   chalk@4.1.2:
     resolution: {integrity: sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==}
     engines: {node: '>=10'}
 
-  chalk@5.3.0:
-    resolution: {integrity: sha512-dLitG79d+GV1Nb/VYcCDFivJeK1hiukt9QjRNVOsUtTy1rR1YJsmpGGTZ3qJos+uw7WmWF4wUwBd9jxjocFC2w==}
+  chalk@5.6.2:
+    resolution: {integrity: sha512-7NzBL0rN6fMUW+f7A6Io4h40qQlG+xGmtMxfbnH/K7TAtt8JQWVQK+6g0UXKMeVJoyV5EkkNsErQ8pVD3bLHbA==}
     engines: {node: ^12.17.0 || ^14.13 || >=16.0.0}
 
-  chalk@5.4.0:
-    resolution: {integrity: sha512-ZkD35Mx92acjB2yNJgziGqT9oKHEOxjTBTDRpOsRWtdecL/0jM3z5kM/CTzHWvHIen1GvkM85p6TuFfDGfc8/Q==}
-    engines: {node: ^12.17.0 || ^14.13 || >=16.0.0}
-
-  change-case@5.4.4:
-    resolution: {integrity: sha512-HRQyTk2/YPEkt9TnUPbOpr64Uw3KOicFWPVBb+xiHvd6eBx/qPr9xqfBFDT8P2vWsvvz4jbEkfDe71W3VyNu2w==}
-
-  chardet@0.7.0:
-    resolution: {integrity: sha512-mT8iDcrh03qDGRRmoA2hmBJnxpllMR+0/0qlzjqZES6NdiWDcZkCNAk4rPFZ9Q85r27unkiNNg8ZOiwZXBHwcA==}
-
-  check-error@2.1.1:
-    resolution: {integrity: sha512-OAlb+T7V4Op9OwdkjmguYRqncdlx5JiofwOAUkmTF+jNdHwzTaTs4sRAGpzLF3oOz5xAyDGrPgeIDFQmDOTiJw==}
-    engines: {node: '>= 16'}
+  chardet@2.2.0:
+    resolution: {integrity: sha512-rddelWYNPRrXq6PtNEN2S3f6t9ILzvqaN5pVgi4kqt9jHQaXIial9PznB5iSPVlQSLNaaH22ItWz3EJtQ10+OA==}
 
   cheerio-select@2.1.0:
     resolution: {integrity: sha512-9v9kG0LvzrlcungtnJtpGNxY+fzECQKhK4EGJX2vByejiMX84MFNQw4UxPJl3bFbTMw+Dfs37XaIkCwTZfLh4g==}
 
-  cheerio@1.0.0:
-    resolution: {integrity: sha512-quS9HgjQpdaXOvsZz82Oz7uxtXiy6UIsIQcpBj7HRw2M63Skasm9qlDocAM7jNuaxdhpPU7c4kJN+gA5MCu4ww==}
-    engines: {node: '>=18.17'}
+  cheerio@1.2.0:
+    resolution: {integrity: sha512-WDrybc/gKFpTYQutKIK6UvfcuxijIZfMfXaYm8NMsPQxSYvf+13fXUJ4rztGGbJcBQ/GF55gvrZ0Bc0bj/mqvg==}
+    engines: {node: '>=20.18.1'}
 
-  chokidar@3.6.0:
-    resolution: {integrity: sha512-7VT13fmjotKpGipCW9JEQAusEPE+Ei8nl6/g4FBAmIm0GOOLMua9NDDo/DWp0ZAxCr3cPq5ZpBqmPAQgDda2Pw==}
-    engines: {node: '>= 8.10.0'}
-
-  chokidar@4.0.3:
-    resolution: {integrity: sha512-Qgzu8kfBvo+cA4962jnP1KkS6Dop5NS6g7R5LFYJr4b8Ub94PPQXUksCw9PvXoeXPRRddRNC5C1JQUR2SMGtnA==}
-    engines: {node: '>= 14.16.0'}
-
-  chownr@2.0.0:
-    resolution: {integrity: sha512-bIomtDF5KGpdogkLd9VspvFzk9KfpyyGlS8YFVZl7TGPBHL5snIOnxeshwVgPteQ9b4Eydl+pVbIyE1DcvCWgQ==}
-    engines: {node: '>=10'}
+  chokidar@5.0.0:
+    resolution: {integrity: sha512-TQMmc3w+5AxjpL8iIiwebF73dRDF4fBIieAqGn9RGCWaEVwQ6Fb2cGe31Yns0RRIzii5goJ1Y7xbMwo1TxMplw==}
+    engines: {node: '>= 20.19.0'}
 
   chownr@3.0.0:
     resolution: {integrity: sha512-+IxzY9BZOQd/XuYPRmrvEVjF/nqj5kgT4kEq7VofrDoM1MxoRjEWkrCC3EtLi59TVawxTAn+orJwFQcrqEN1+g==}
     engines: {node: '>=18'}
 
-  ci-info@3.9.0:
-    resolution: {integrity: sha512-NIxF55hv4nSqQswkAeiOi1r83xy8JldOFDTWiug55KBu9Jnblncd2U6ViHmYgHf01TPZS77NJBhBMKdWj9HQMQ==}
+  chromium-pickle-js@0.2.0:
+    resolution: {integrity: sha512-1R5Fho+jBq0DDydt+/vHWj5KJNJCKdARKOCwZUen84I5BreWoLqRLANH1U87eJy1tiASPtMnGqJJq0ZsLoRPOw==}
+
+  ci-info@4.3.1:
+    resolution: {integrity: sha512-Wdy2Igu8OcBpI2pZePZ5oWjPC38tmDVx5WKUXKwlLYkA0ozo85sLsLvkBbBn/sZaSCMFOGZJ14fvW9t5/d7kdA==}
     engines: {node: '>=8'}
 
-  ci-info@4.1.0:
-    resolution: {integrity: sha512-HutrvTNsF48wnxkzERIXOe5/mlcfFcbfCmwcg6CJnizbSue78AbDt+1cgl26zwn61WFxhcPykPfZrbqjGmBb4A==}
+  ci-info@4.4.0:
+    resolution: {integrity: sha512-77PSwercCZU2Fc4sX94eF8k8Pxte6JAwL4/ICZLFjJLqegs7kCuAsqqj/70NQF6TvDpgFjkubQB2FW2ZZddvQg==}
     engines: {node: '>=8'}
 
-  circular-dependency-scanner@2.3.0:
-    resolution: {integrity: sha512-J1a6SeOL1pfaVdCVECg4h1cLxZipjnibha2uutY7gG7Ax8lre03sWdK1raJew0P+8AGv9/zRF5DCWHkceOYPBQ==}
+  circular-dependency-scanner@3.1.0:
+    resolution: {integrity: sha512-ZX5bMeMmigY/3L3bLw6ZJ0helpHFsEQmvmNIFopbTwaNdE+W5XmpitpmzTrA8VZSS6Px4NNVQTrUumHFFNB2cg==}
+    engines: {node: '>=22.13'}
     hasBin: true
 
   citty@0.1.6:
     resolution: {integrity: sha512-tskPPKEs8D2KPafUypv2gxwJP8h/OaJmC82QQGGDQcHvXX43xF2VDACcJVmZ0EuSxkpO9Kc4MlrA3q0+FG58AQ==}
 
+  citty@0.2.2:
+    resolution: {integrity: sha512-+6vJA3L98yv+IdfKGZHBNiGW5KHn22e/JwID0Strsz8h4S/csAu/OuICwxrg44k5MRiZHWIo8XXuJgQTriRP4w==}
+
   class-variance-authority@0.7.1:
     resolution: {integrity: sha512-Ka+9Trutv7G8M6WT6SeiRWz792K5qEqIGEGzXKhAE6xOWAY6pPH8U+9IY3oCMv6kqTmLsv7Xh/2w2RigkePMsg==}
 
@@ -4835,18 +6710,6 @@ packages:
     resolution: {integrity: sha512-D5J+kHaVb/wKSFcyyV75uCn8fiY4sV38XJoe4CUyGQ+mOU/fMVYUdH1hJC+CJQ5uY3EnW27SbJYS4X8BiLrAFg==}
     engines: {node: '>= 10.0'}
 
-  clean-regexp@1.0.0:
-    resolution: {integrity: sha512-GfisEZEJvzKrmGWkvfhgzcz/BllN1USeqD2V6tg14OAOgaCD2Z/PUEuxnAZ/nPvmaHRG7a8y77p1T/IRQ4D1Hw==}
-    engines: {node: '>=4'}
-
-  clean-stack@2.2.0:
-    resolution: {integrity: sha512-4diC9HaTE+KRAMWhDhrGOECgWZxoevMc5TlkObMqNSsVU62PYzXZ/SMTjzyGAFF1YusgxGcSWTEXBhp0CPwQ1A==}
-    engines: {node: '>=6'}
-
-  clear-module@4.1.2:
-    resolution: {integrity: sha512-LWAxzHqdHsAZlPlEyJ2Poz6AIs384mPeqLVCru2p0BrP9G/kVGuhNyZYClLO6cXlnuJjzC8xtsJIuMjKqLXoAw==}
-    engines: {node: '>=8'}
-
   cli-boxes@3.0.0:
     resolution: {integrity: sha512-/lzGpEWL/8PfI0BmBOPRwp0c/wFNX1RdUML3jK/RcSBA9T8mZDdQpqYBKtCFTOfQbwPqWEOpjqW+Fnayc0969g==}
     engines: {node: '>=10'}
@@ -4855,42 +6718,38 @@ packages:
     resolution: {integrity: sha512-aCj4O5wKyszjMmDT4tZj93kxyydN/K5zPWSCe6/0AV/AA1pqe5ZBIw0a2ZfPQV7lL5/yb5HsUreJ6UFAF1tEQw==}
     engines: {node: '>=18'}
 
-  cli-spinners@2.9.2:
-    resolution: {integrity: sha512-ywqV+5MmyL4E7ybXgKys4DugZbX0FC6LnwrhjuykIjnK9k8OQacQ7axGKnjDXWNhns0xot3bZI5h55H8yo9cJg==}
-    engines: {node: '>=6'}
+  cli-spinners@3.4.0:
+    resolution: {integrity: sha512-bXfOC4QcT1tKXGorxL3wbJm6XJPDqEnij2gQ2m7ESQuE+/z9YFIWnl/5RpTiKWbMq3EVKR4fRLJGn6DVfu0mpw==}
+    engines: {node: '>=18.20'}
 
-  cli-truncate@4.0.0:
-    resolution: {integrity: sha512-nPdaFdQ0h/GEigbPClz11D0v/ZJEwxmeVZGeMo3Z5StPtUTkA9o1lD6QwoirYiSDzbcwn2XcjwmCp68W1IS4TA==}
-    engines: {node: '>=18'}
-
-  clipboardy@4.0.0:
-    resolution: {integrity: sha512-5mOlNS0mhX0707P2I0aZ2V/cmHUEO/fL7VFLqszkhUsxt7RwnmrInf/eEQKlf5GzvYeHIjT+Ov1HRfNmymlG0w==}
-    engines: {node: '>=18'}
+  cli-truncate@6.1.1:
+    resolution: {integrity: sha512-06p9vyLahLa4zkGcgsGxU6iEkSOiuI4fhCH6Emhe2lPAcoUv73n72DnODsnHA+5wwXGnV0n9M9/qOQJSjYhFhw==}
+    engines: {node: '>=22'}
 
   cliui@6.0.0:
     resolution: {integrity: sha512-t6wbgtoCXvAzst7QgXxJYqPt0usEfbgQdftEPbLL/cvv6HPE5VgvqCuAIDR0NgU52ds6rFwqrgakNLrHEjCbrQ==}
 
-  cliui@7.0.4:
-    resolution: {integrity: sha512-OcRE68cOsVMXp1Yvonl/fzkQOyjLSu/8bhPDfQt0e0/Eb283TKP20Fs2MqoPsr9SwA595rRCA+QMzYc9nBP+JQ==}
-
   cliui@8.0.1:
     resolution: {integrity: sha512-BSeNnyus75C4//NQ9gQt1/csTXyo/8Sb+afLAkzAptFuMsod9HFokGNudZpi/oQV73hnVK+sR+5PVRMd+Dr7YQ==}
     engines: {node: '>=12'}
 
-  clone@2.1.2:
-    resolution: {integrity: sha512-3Pe/CF1Nn94hyhIYpjtiLhdCoEoz0DqQ+988E9gmeEdQZlojxnOb74wctFyuwWQHzqyf9X7C7MG8juUpqBJT8w==}
-    engines: {node: '>=0.8'}
+  cliui@9.0.1:
+    resolution: {integrity: sha512-k7ndgKhwoQveBL+/1tqGJYNz097I7WOvwbmmU2AR5+magtbjPWQTS1C5vzGkBC8Ym8UWRzfKUzUUqFLypY4Q+w==}
+    engines: {node: '>=20'}
+
+  clone-response@1.0.3:
+    resolution: {integrity: sha512-ROoL94jJH2dUVML2Y/5PEDNaSHgeOdSDicUyS7izcF63G6sTc/FTjLub4b8Il9S8S0beOfYt0TaA5qvFK+w0wA==}
 
   clsx@2.1.1:
     resolution: {integrity: sha512-eYm0QWBtUrBWZWG0d386OGAw16Z995PiOVo2B7bjWSbHedGl5e0ZWaq65kOGgUSNesEIDkB9ISbTg/JK9dhCZA==}
     engines: {node: '>=6'}
 
-  cluster-key-slot@1.1.2:
-    resolution: {integrity: sha512-RMr0FhtfXemyinomL4hrWcYJxmX6deFdCxpJzhDttxgO1+bcCnkk+9drydLVDmAMG7NE6aN/fl4F7ucU/90gAA==}
+  cluster-key-slot@1.1.1:
+    resolution: {integrity: sha512-rwHwUfXL40Chm1r08yrhU3qpUvdVlgkKNeyeGPOxnW8/SyVDvgRaed/Uz54AqWNaTCAThlj6QAs3TZcKI0xDEw==}
     engines: {node: '>=0.10.0'}
 
-  codemirror@6.0.1:
-    resolution: {integrity: sha512-J8j+nZ+CdWmIeFIGXEFbFPtpiYacFMDR8GlHK3IyHQJMCaVRfGx9NT+Hxivv1ckLWPvNdZqndbr/7lVhrf/Svg==}
+  codemirror@6.0.2:
+    resolution: {integrity: sha512-VhydHotNW5w1UGK0Qj96BwSk/Zqbp9WbnyK2W/eVMv4QyF41INRGpjUhFJY7/uDNuudSc33a/PKr4iDqRduvHw==}
 
   codepage@1.15.0:
     resolution: {integrity: sha512-3g6NUTPd/YtuuGrhMnOMRjFc+LJw/bnMp3+0r/Wcz3IXUuCosKRJvMphm5+Q+bvTVGcJJuRvVLuYba+WojaFaA==}
@@ -4906,11 +6765,8 @@ packages:
   colord@2.9.3:
     resolution: {integrity: sha512-jeC1axXpnb0/2nn/Y1LPuLdgXBLH7aDcHu4KEKfqw3CUhX7ZpfBSlPKyqXE6btIgEzfWtrX3/tyBCaCvXvMkOw==}
 
-  colorette@1.4.0:
-    resolution: {integrity: sha512-Y2oEozpomLn7Q3HFP7dpww7AtMJplbM9lGZP6RDfHqmbeRjiwRg4n6VM6j4KLmRke85uWEI7JqF17f3pqdRA0g==}
-
-  colorette@2.0.20:
-    resolution: {integrity: sha512-IfEDxwoWIjkeXL1eXcDiow4UbKjhLdq6/EuSVR9GMN7KVH3r9gQ83e73hsz1Nd1T3ijd5xv1wcWRYO+D6kCI2w==}
+  colorjs.io@0.5.2:
+    resolution: {integrity: sha512-twmVoizEW7ylZSN32OgKdXRmo1qg+wT5/6C3xu5b9QsWzSFAhHLn2xd8ro0diCsKfCj1RdaTP/nrcW+vAoQPIw==}
 
   combined-stream@1.0.8:
     resolution: {integrity: sha512-FQN4MRfuJeHf7cBbBMJFXhKSDq+2kAArBlmRBvcvFE5BB1HZKXtSFASDhdlz9zOYwxh8lDdnvmMOe/+5cdoEdg==}
@@ -4920,38 +6776,42 @@ packages:
     resolution: {integrity: sha512-y4Mg2tXshplEbSGzx7amzPwKKOCGuoSRP/CjEdwwk0FOGlUbq6lKuoyDZTNZkmxHdJtp54hdfY/JUrdL7Xfdug==}
     engines: {node: '>=14'}
 
-  commander@12.1.0:
-    resolution: {integrity: sha512-Vw8qHK3bZM9y/P10u3Vib8o/DdkvA2OtPtZvD871QKjy74Wj1WSKFILMPRPSdUSx5RFK1arlJzEtA4PkFgnbuA==}
-    engines: {node: '>=18'}
+  commander@11.1.0:
+    resolution: {integrity: sha512-yPVavfyCcRhmorC7rWlkHn15b4wDVgVmBA7kV4QVBsF7kv/9TKJAbAXVTxvTnwP8HHKjRCJDClKbciiYS7p0DQ==}
+    engines: {node: '>=16'}
+
+  commander@14.0.3:
+    resolution: {integrity: sha512-H+y0Jo/T1RZ9qPP4Eh1pkcQcLRglraJaSLoyOtHxu6AapkjWVCy2Sit1QQ4x3Dng8qDlSsZEet7g5Pq06MvTgw==}
+    engines: {node: '>=20'}
+
+  commander@15.0.0:
+    resolution: {integrity: sha512-z67u4ZhzCL/Tydu1lJARtEZYWbWaN7oYLHbsuzocr6y4N6WZAagG3RQ4FW61V1/0+jImpj293XfrcYnd1qxtPg==}
+    engines: {node: '>=22.12.0'}
 
   commander@2.20.3:
     resolution: {integrity: sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ==}
 
-  commander@4.1.1:
-    resolution: {integrity: sha512-NOKm8xhkzAjzFx8B2v5OAHT+u5pRQc2UCa2Vq9jYL/31o2wi9mxBA7LIFs3sV5VSC49z6pEhfbMULvShKj26WA==}
+  commander@5.1.0:
+    resolution: {integrity: sha512-P0CysNDQ7rtVw4QIQtm+MRxV66vKFSvlsQvGYXZWR3qFU0jlMKHZZZgw8e+8DSah4UDKMqnknRDQz+xuQXQ/Zg==}
     engines: {node: '>= 6'}
 
-  commander@7.2.0:
-    resolution: {integrity: sha512-QrWXB+ZQSVPmIWIhtEO9H+gwHaMGYiF5ChvoJ+K9ZGHG/sVsa6yiesAD1GC/x46sET00Xlwo1u49RVVVzvcSkw==}
-    engines: {node: '>= 10'}
+  commander@9.5.0:
+    resolution: {integrity: sha512-KRs7WVDKg86PWiuAqhDrAQnTXZKraVcCc6vFdL14qrZ/DcWwuRo7VoiYXalXO7S5GKpqYiVEwCbgFDfxNHKJBQ==}
+    engines: {node: ^12.20.0 || >=14}
 
-  commander@8.3.0:
-    resolution: {integrity: sha512-OkTL9umf+He2DZkUq8f8J9of7yL6RJKI24dVITBmNfZBmri9zYZQrKkuXiKhyfPSu8tUhnVBB1iKXevvnlR4Ww==}
-    engines: {node: '>= 12'}
-
-  comment-json@4.2.5:
-    resolution: {integrity: sha512-bKw/r35jR3HGt5PEPm1ljsQQGyCrR8sFGNiN5L+ykDHdpO8Smxkrkla9Yi6NkQyUrb8V54PGhfMs6NrIwtxtdw==}
+  comment-json@5.0.0:
+    resolution: {integrity: sha512-uiqLcOiVDJtBP8WGkZHEP+FZIhTzP1dxvn59EfoYUi9gqupjrBWVQkO2atDrbnKPwLeotFYDsuNb26uBMqB+hw==}
     engines: {node: '>= 6'}
 
-  comment-parser@1.4.1:
-    resolution: {integrity: sha512-buhp5kePrmda3vhc5B9t7pUQXAb2Tnd0qgpkIhPhkHXxJpiPJ11H0ZEU0oBpJ2QztSbzG/ZxMj/CHsYJqRHmyg==}
+  comment-parser@1.4.7:
+    resolution: {integrity: sha512-0h+uSNtQGW3D98eQt3jJ8L06Fves8hncB4V/PKdw/Qb8Hnk19VaKuTr55UNRYiSoVa7WwrFls+rh3ux9agmkeQ==}
     engines: {node: '>= 12.0.0'}
 
-  commitlint-plugin-function-rules@4.0.1:
-    resolution: {integrity: sha512-q3zniafaRo41x0eatCCe1ai9Tge4ArK4Mc5rVXTCtj6D9s0unxYpCnFiyLVOpKyz8za78qlZacCHTErvHnU+dw==}
-    engines: {node: '>=20'}
+  commitlint-plugin-function-rules@5.0.1:
+    resolution: {integrity: sha512-AC8fH83A+soNq9VKTlLptkbg8Zpfx88ng9hKzdiJ0N+GoYgWTWNt6yFA3zEZ0qy3ekQ4Paf1slkaH1UKWRLUvg==}
+    engines: {node: '>=22'}
     peerDependencies:
-      '@commitlint/lint': '>=19 <20'
+      '@commitlint/lint': '>=19 <22'
 
   common-tags@1.8.2:
     resolution: {integrity: sha512-gk/Z852D2Wtb//0I+kRFNKKE9dIIVirjoqPoA1wJU+XePVXZfGeBpk45+A1rKO4Q43prqWBNY/MiIeRLbPWUaA==}
@@ -4960,14 +6820,15 @@ packages:
   commondir@1.0.1:
     resolution: {integrity: sha512-W9pAhw0ja1Edb5GVdIF1mjZw/ASI0AlShXM83UUGe2DVr5TdAPEA1OA8m/g8zWp9x6On7gqufY+FatDbC3MDQg==}
 
-  compare-func@2.0.0:
-    resolution: {integrity: sha512-zHig5N+tPWARooBnb0Zx1MFcdfpyJrfTJ3Y5L+IFvUm8rM74hHz66z0gw0x4tijh5CorKkKUCnW82R2vmpeCRA==}
+  compare-version@0.1.2:
+    resolution: {integrity: sha512-pJDh5/4wrEnXX/VWRZvruAGHkzKdr46z11OlTPN+VrATlWWhSKewNCJ1futCO5C7eJB3nPMFZA1LeYtcFboZ2A==}
+    engines: {node: '>=0.10.0'}
 
   compare-versions@6.1.1:
     resolution: {integrity: sha512-4hm4VPpIecmlg59CHXnRDnqGplJFrbLG4aFEl5vl6cK1u76ws3LLvX7ikFnTDl5vo39sjWD6AaDPYodJp/NNHg==}
 
-  compatx@0.1.8:
-    resolution: {integrity: sha512-jcbsEAR81Bt5s1qOFymBufmCbXCXbk0Ql+K5ouj6gCyx2yHlu6AgmGIi9HxfKixpUDO5bCFJUHQ5uM6ecbTebw==}
+  compatx@0.2.0:
+    resolution: {integrity: sha512-6gLRNt4ygsi5NyMVhceOCFv14CIdDFN7fQjX1U4+47qVE/+kjPoXMK65KWK+dWxmFzMTuKazoQ9sch6pM0p5oA==}
 
   compress-commons@4.1.2:
     resolution: {integrity: sha512-D3uMHtGc/fcO1Gt1/L7i1e33VOvD4A9hfQLP+6ewd+BvG/gQ84Yh4oftEhAdjSMgBgwGL+jsppT7JYNpo6MHHg==}
@@ -4977,11 +6838,15 @@ packages:
     resolution: {integrity: sha512-6FqVXeETqWPoGcfzrXb37E50NP0LXT8kAMu5ooZayhWWdgEY4lBEEcbQNXtkuKQsGduxiIcI4gOTsxTmuq/bSg==}
     engines: {node: '>= 14'}
 
+  compress-commons@7.0.1:
+    resolution: {integrity: sha512-g0S8KAD8qf4+V//pr3BfB1aBnARLXNz2Gx+jmHU0LEriUuoQUOPOulVquHKTJ8+EAIIO7fhseNDr9wK5Q9FKBQ==}
+    engines: {node: '>=18'}
+
   compute-scroll-into-view@1.0.20:
     resolution: {integrity: sha512-UCB0ioiyj8CRjtrvaceBLqqhZCVP+1B8+NWQhmdsm0VXOJtobBCf1dBQmebCCo34qZmUwZfIH2MZLqNHazrfjg==}
 
-  computeds@0.0.1:
-    resolution: {integrity: sha512-7CEBgcMjVmitjYo5q8JTJVra6X5mQ20uTThdK+0kR7UEaDrAWEQcRiBtWJzga4eRpP6afNwwLsX2SET2JhVB1Q==}
+  compute-scroll-into-view@3.1.1:
+    resolution: {integrity: sha512-VRhuHOLoKYOy4UbilLbUzbYg93XLjv2PncJC50EuTWPA3gaja1UjBsUP/D/9/juV3vQFr6XBEzn9KCAHdUvOHw==}
 
   concat-map@0.0.1:
     resolution: {integrity: sha512-/Srv4dswyQNBfohGpz9o6Yb3Gz3SrUDqBH5rTuhGR7ahtlbYKnVxw2bCFMRljaA7EXHaXZ8wsHdodFvbkhKmqg==}
@@ -4989,73 +6854,69 @@ packages:
   confbox@0.1.8:
     resolution: {integrity: sha512-RMtmw0iFkeR4YV+fUOSucriAQNb9g8zFR52MWCtl+cCZOFRNL6zeB395vPzFhEjjn4fMxXudmELnl/KF/WrK6w==}
 
+  confbox@0.2.4:
+    resolution: {integrity: sha512-ysOGlgTFbN2/Y6Cg3Iye8YKulHw+R2fNXHrgSmXISQdMnomY6eNDprVdW9R5xBguEqI954+S6709UyiO7B+6OQ==}
+
   config-chain@1.1.13:
     resolution: {integrity: sha512-qj+f8APARXHrM0hraqXYb2/bOVSV4PvJQlNZ/DVj0QrmNM2q2euizkeuVckQ57J+W0mRH6Hvi+k50M4Jul2VRQ==}
 
-  configstore@7.0.0:
-    resolution: {integrity: sha512-yk7/5PN5im4qwz0WFZW3PXnzHgPu9mX29Y8uZ3aefe2lBPC1FYttWZRcaW9fKkT0pBCJyuQ2HfbmPVaODi9jcQ==}
+  configstore@7.1.0:
+    resolution: {integrity: sha512-N4oog6YJWbR9kGyXvS7jEykLDXIE2C0ILYqNBZBp9iwiJpoCBWYsuAdW6PPFn6w06jjnC+3JstVvWHO4cZqvRg==}
     engines: {node: '>=18'}
 
-  connect-history-api-fallback@1.6.0:
-    resolution: {integrity: sha512-e54B99q/OUoH64zYYRf3HBP5z24G38h5D3qXu23JGRoigpX5Ss4r9ZnDk3g0Z8uQC2x2lPaJ+UlWBc1ZWBWdLg==}
-    engines: {node: '>=0.8'}
-
-  consola@2.15.3:
-    resolution: {integrity: sha512-9vAdYbHj6x2fLKC4+oPH0kFzY/orMZyG2Aj+kNylHxKGJ/Ed4dpNyAQYwJOdqO4zdM7XpVHmyejQDcQHrnuXbw==}
-
-  consola@3.3.0:
-    resolution: {integrity: sha512-kxltocVQCwQNFvw40dlVRYeAkAvtYjMFZYNlOcsF5wExPpGwPxMwgx4IfDJvBRPtBpnQwItd5WkTaR0ZwT/TmQ==}
+  consola@3.4.2:
+    resolution: {integrity: sha512-5IKcdX0nnYavi6G7TtOhwkYzyjfJlatbjMjuLSfE2kYT5pMDOilZ4OvMhi637CcDICTmz3wARPoyhqyX1Y+XvA==}
     engines: {node: ^14.18.0 || >=16.10.0}
 
-  conventional-changelog-angular@7.0.0:
-    resolution: {integrity: sha512-ROjNchA9LgfNMTTFSIWPzebCwOGFdgkEq45EnvvrmSLvCtAw0HSmrCs7/ty+wAeYUZyNay0YMUNYFTRL72PkBQ==}
-    engines: {node: '>=16'}
+  conventional-changelog-angular@9.2.1:
+    resolution: {integrity: sha512-oWSL6ZhnXbYraOFTK3PgRAQJ8fADDAEv5K6AdeyQPLvjFmhG8+ejL0jZZp/R7vTmGJaBvZEE+sE7dB4bCv7sAw==}
+    engines: {node: '>=22'}
 
-  conventional-changelog-conventionalcommits@7.0.2:
-    resolution: {integrity: sha512-NKXYmMR/Hr1DevQegFB4MwfM5Vv0m4UIxKZTTYuD98lpTknaZlSRrDOG4X7wIXpGkfsYxZTghUN+Qq+T0YQI7w==}
-    engines: {node: '>=16'}
+  conventional-changelog-conventionalcommits@10.2.1:
+    resolution: {integrity: sha512-n4Kr1HFMTf3iMbES0TMxKIcYtUUv4rKqyQQp2JwfOEfFCOfGT3Tq4mCyJ8S9/YPyWhydjfKrrvnyl+gCjA+mJQ==}
+    engines: {node: '>=22'}
 
-  conventional-commits-parser@5.0.0:
-    resolution: {integrity: sha512-ZPMl0ZJbw74iS9LuX9YIAiW8pfM5p3yh2o/NbXHbkFuZzY5jvdi5jFycEOkmBW5H5I7nA+D6f3UcsCLP2vvSEA==}
-    engines: {node: '>=16'}
+  conventional-commits-parser@7.1.2:
+    resolution: {integrity: sha512-O+x4N2yH+ijvqWlIyTHsXTAP+algNWgGbjY2duCe8w2vUMvUB95cLRslCPfTMQyLAKlet3bhZTdu6ozn4M+QJQ==}
+    engines: {node: '>=22'}
     hasBin: true
 
   convert-source-map@2.0.0:
     resolution: {integrity: sha512-Kvp459HrV2FEJ1CAsi1Ku+MY3kasH19TFykTz2xWmMeq6bk2NU3XXvfJ+Q61m0xktWwt+1HSYf3JZsTms3aRJg==}
 
-  cookie-es@1.2.2:
-    resolution: {integrity: sha512-+W7VmiVINB+ywl1HGXJXmrqkOhpKrIiVZV6tQuV54ZyQC7MMuBt81Vc336GMLoHBq5hV/F9eXgt5Mnx0Rha5Fg==}
+  cookie-es@1.2.3:
+    resolution: {integrity: sha512-lXVyvUvrNXblMqzIRrxHb57UUVmqsSWlxqt3XIjCkUP0wDAf6uicO6KMbEgYrMNtEvWgWHwe42CKxPu9MYAnWw==}
 
-  copy-anything@2.0.6:
-    resolution: {integrity: sha512-1j20GZTsvKNkc4BY3NpMOM8tt///wY3FpIzozTOFO2ffuZcV61nojHXVKIy3WM+7ADCy5FVhdZYHYDdgTU0yJw==}
+  cookie-es@2.0.1:
+    resolution: {integrity: sha512-aVf4A4hI2w70LnF7GG+7xDQUkliwiXWXFvTjkip4+b64ygDQ2sJPRSKFDHbxn8o0xu9QzPkMuuiWIXyFSE2slA==}
+
+  cookie-es@3.1.1:
+    resolution: {integrity: sha512-UaXxwISYJPTr9hwQxMFYZ7kNhSXboMXP+Z3TRX6f1/NyaGPfuNUZOWP1pUEb75B2HjfklIYLVRfWiFZJyC6Npg==}
 
   copy-anything@3.0.5:
     resolution: {integrity: sha512-yCEafptTtb4bk7GLEQoM8KVJpxAfdBJYaXyzQEgQQQgYrZiDp8SJmGKlYza6CYjEDNstAdNdKA3UuoULlEbS6w==}
     engines: {node: '>=12.13'}
 
-  core-js-compat@3.39.0:
-    resolution: {integrity: sha512-VgEUx3VwlExr5no0tXlBt+silBvhTryPwCXRI2Id1PN8WTKu7MreethvddqOubrYxkFdv/RnYrqlv1sFNAUelw==}
+  core-js-compat@3.50.0:
+    resolution: {integrity: sha512-XGpFGbMLHwSt74YLTKho7Ib242qi6O8MSX+sRokV4oz7iKXvQWGYZthjIhjRGMxjzVkAubBO512dKGYcefmX3Q==}
+    engines: {node: '>=6.4.0'}
 
-  core-js@3.39.0:
-    resolution: {integrity: sha512-raM0ew0/jJUqkJ0E6e8UDtl+y/7ktFivgWvqw8dNSQeNWoSDLvQ1H/RN3aPXB9tBd4/FhyR4RDPGhsNIMsAn7g==}
+  core-js@3.50.0:
+    resolution: {integrity: sha512-BRWgOLKkFeCgRudR6zrs8p9XJZcE14grzKMMssoYrk6krtuEZ7MTKPIY5RzOnqsEKIR9kst7wNzphttraT+Yqw==}
 
   core-util-is@1.0.3:
     resolution: {integrity: sha512-ZQBvi1DcpJ4GDqanjucZ2Hj3wEO5pZDS89BWbkcrvdxksJorwUDDZamX9ldFkp9aw2lmBDLgkObEA4DWNJ9FYQ==}
 
-  cosmiconfig-typescript-loader@6.1.0:
-    resolution: {integrity: sha512-tJ1w35ZRUiM5FeTzT7DtYWAFFv37ZLqSRkGi2oeCK1gPhvaWjkAtfXvLmvE1pRfxxp9aQo6ba/Pvg1dKj05D4g==}
+  cosmiconfig-typescript-loader@6.3.0:
+    resolution: {integrity: sha512-Akr82WH1Wfqatyiqpj8HDkO2o2KmJRu1FhKfSNJP3K4IdXwHfEyL7MOb62i1AGQVLtIQM+iCE9CGOtrfhR+mmA==}
     engines: {node: '>=v18'}
     peerDependencies:
       '@types/node': '*'
       cosmiconfig: '>=9'
       typescript: '>=5'
 
-  cosmiconfig@7.1.0:
-    resolution: {integrity: sha512-AdmX6xUzdNASswsFtmwSt7Vj8po9IuqXm0UXz7QKPuEUmPB4XyjGfaAr2PSuELMwkRMVH1EpIkX5bTZGRB3eCA==}
-    engines: {node: '>=10'}
-
-  cosmiconfig@9.0.0:
-    resolution: {integrity: sha512-itvL5h8RETACmOTFc4UfIyB2RfEHi71Ax6E/PivVxq9NseKbOWpeyHEOIbmAw1rs8Ak0VursQNww7lf7YtUwzg==}
+  cosmiconfig@9.0.2:
+    resolution: {integrity: sha512-gtTZxTDau1wL7Y7zifc2dd8jHSK/k6BTx/2Xp/BpdlAdnlYWFVt7qhJqgwi7637yRwRQ3qL4ZidbB4I8tA5VOg==}
     engines: {node: '>=14'}
     peerDependencies:
       typescript: '>=4.9.5'
@@ -5076,124 +6937,117 @@ packages:
     resolution: {integrity: sha512-piICUB6ei4IlTv1+653yq5+KoqfBYmj9bw6LqXoOneTMDXk5nM1qt12mFW1caG3LlJXEKW1Bp0WggEmIfQB34g==}
     engines: {node: '>= 14'}
 
-  crelt@1.0.6:
-    resolution: {integrity: sha512-VQ2MBenTq1fWZUH9DJNGti7kKv6EeAuYr3cLwxUWhIu1baTaXh4Ib5W2CqHVqib4/MqbYGJqiL3Zb8GJZr3l4g==}
+  crc32-stream@7.0.1:
+    resolution: {integrity: sha512-IBWsY8xznyQrcHn8h4bC8/4ErNke5elzgG8GcqF4RFPw6aHkWWRc7Tgw6upjaTX/CT/yQgqYENkxYsTYN+hW2g==}
+    engines: {node: '>=18'}
 
-  croner@9.0.0:
-    resolution: {integrity: sha512-onMB0OkDjkXunhdW9htFjEhqrD54+M94i6ackoUkjHKbRnXdyEyKRelp4nJ1kAz32+s27jP1FsebpJCVl0BsvA==}
+  crelt@1.0.7:
+    resolution: {integrity: sha512-aK6BbWfhf4U/wCcLHKPJl/xa6VkVstRaPywWtMKGwuOLc/wZTyQYuoxgvZnNsBvv7Kg3YTBQYYBCggcviQczuA==}
+
+  croner@10.0.1:
+    resolution: {integrity: sha512-ixNtAJndqh173VQ4KodSdJEI6nuioBWI0V1ITNKhZZsO0pEMoDxz539T4FTTbSZ/xIOSuDnzxLVRqBVSvPNE2g==}
     engines: {node: '>=18.0'}
 
-  cross-env@7.0.3:
-    resolution: {integrity: sha512-+/HKd6EgcQCJGh2PSjZuUitQBQynKor4wrFbRg4DtAgS1aWO+gU52xpH7M9ScGgXSYmAVS9bIJ8EzuaGw0oNAw==}
-    engines: {node: '>=10.14', npm: '>=6', yarn: '>=1'}
+  cross-dirname@0.1.0:
+    resolution: {integrity: sha512-+R08/oI0nl3vfPcqftZRpytksBXDzOUveBq/NBVx0sUp1axwzPQrKinNx5yd5sxPu8j1wIy8AfnVQ+5eFdha6Q==}
+
+  cross-env@10.1.0:
+    resolution: {integrity: sha512-GsYosgnACZTADcmEyJctkJIoqAhHjttw7RsFrVoJNXbsWWqaq6Ym+7kZjq6mS45O0jij6vtiReppKQEtqWy6Dw==}
+    engines: {node: '>=20'}
     hasBin: true
 
   cross-spawn@7.0.6:
     resolution: {integrity: sha512-uV2QOWP2nWzsy2aMp8aRibhi9dlzF5Hgh5SHaB9OiTGEyDTiJJyx0uy51QXdyWbtAHNua4XJzUKca3OzKUd3vA==}
     engines: {node: '>= 8'}
 
-  crossws@0.3.1:
-    resolution: {integrity: sha512-HsZgeVYaG+b5zA+9PbIPGq4+J/CJynJuearykPsXx4V/eMhyQ5EDVg3Ak2FBZtVXCiOLu/U7IiwDHTr9MA+IKw==}
+  crossws@0.3.5:
+    resolution: {integrity: sha512-ojKiDvcmByhwa8YYqbQI/hg7MEU0NC03+pSdEq4ZUnZR9xXpwk7E43SMNGkn+JxJGPFtNvQ48+vV2p+P1ml5PA==}
+
+  crossws@0.4.10:
+    resolution: {integrity: sha512-pz3oubH/dt12KjqsUB0IuXW4nwRDQ583iDsP4555Cpdqx0NoU7pGlWBcayyFI8f/l/idRpgjMEfwuOxSWJYlIA==}
+    peerDependencies:
+      srvx: '>=0.11.5'
+    peerDependenciesMeta:
+      srvx:
+        optional: true
+
+  crypto-js@4.2.0:
+    resolution: {integrity: sha512-KALDyEYgpY+Rlob/iriUtjV6d5Eq+Y191A5g4UqLAi8CyGP9N1+FdVbkc1SxKc2r4YAYqG8JzO2KGL+AizD70Q==}
+    deprecated: Active development of CryptoJS has been discontinued. This library is no longer maintained.
 
   crypto-random-string@2.0.0:
     resolution: {integrity: sha512-v1plID3y9r/lPhviJ1wrXpLeyUIGAZ2SHNYTEapm7/8A9nLPoyvVp3RK/EPFqn5kEznyWgYZNsRtYYIWbuG8KA==}
     engines: {node: '>=8'}
 
-  cspell-config-lib@8.17.1:
-    resolution: {integrity: sha512-x1S7QWprgUcwuwiJB1Ng0ZTBC4G50qP9qQyg/aroMkcdMsHfk26E8jUGRPNt4ftHFzS4YMhwtXuJQ9IgRUuNPA==}
-    engines: {node: '>=18'}
+  cspell-config-lib@10.0.1:
+    resolution: {integrity: sha512-hMpo/0j6k7pbiqrLDOLJKD2IGP9XwhjKf2miiM6p84Xeo4nyuFZaxxDCQ68R851HSYFrrdltgpoipMbj1h2Tnw==}
+    engines: {node: '>=22.18.0'}
 
-  cspell-dictionary@8.17.1:
-    resolution: {integrity: sha512-zSl9l3wii+x16yc2NVZl/+CMLeLBAiuEd5YoFkOYPcbTJnfPwdjMNcj71u7wBvNJ+qwbF+kGbutEt15yHW3NBw==}
-    engines: {node: '>=18'}
+  cspell-dictionary@10.0.1:
+    resolution: {integrity: sha512-3cZ659vgsZWkzGQJR/sNqGDVt/OnvTSieLKI76V++4t1bHJfochb9ZrrwsuMsb1VPGiyqClUP1/O6WrefF/FVg==}
+    engines: {node: '>=22.18.0'}
 
-  cspell-gitignore@8.17.1:
-    resolution: {integrity: sha512-bk727Zf4FBCjm9Mwvyreyhgjwe+YhPQEW7PldkHiinKd+Irfez4s8GXLQb1EgV0UpvViqaqBqLmngjZdS30BTA==}
-    engines: {node: '>=18'}
+  cspell-gitignore@10.0.1:
+    resolution: {integrity: sha512-wN23U61Mx6qPJN3CesOmBU9vnbJ0jQm/ylK0iaVui3CcnO7Zzl5qLu5mPHUzGQGm8yso6qjyxqo16Ho7LpZGOQ==}
+    engines: {node: '>=22.18.0'}
     hasBin: true
 
-  cspell-glob@8.17.1:
-    resolution: {integrity: sha512-cUwM5auSt0RvLX7UkP2GEArJRWc85l51B1voArl+3ZIKeMZwcJpJgN3qvImtF8yRTZwYeYCs1sgsihb179q+mg==}
-    engines: {node: '>=18'}
+  cspell-glob@10.0.1:
+    resolution: {integrity: sha512-7bII9J3aSSpZDwhx7w+zfQXbMxHZQ3be0ilUp5bHrsjz6o07v/NqOHMGcwKdPn1sw2dxDz9sv057xE5pqXnSdw==}
+    engines: {node: '>=22.18.0'}
 
-  cspell-grammar@8.17.1:
-    resolution: {integrity: sha512-H5tLcBuW7aUj9L0rR+FSbnWPEsWb8lWppHVidtqw9Ll1CUHWOZC9HTB2RdrhJZrsz/8DJbM2yNbok0Xt0VAfdw==}
-    engines: {node: '>=18'}
+  cspell-grammar@10.0.1:
+    resolution: {integrity: sha512-xC9AFYmaI9wsO//a7S5tdDGKGJVD5UEEsTg+Up2fi7lPfXIryisYmV6tePNL1SEg0idYss4ja8LUZ3Mib09BjQ==}
+    engines: {node: '>=22.18.0'}
     hasBin: true
 
-  cspell-io@8.17.1:
-    resolution: {integrity: sha512-liIOsblt7oVItifzRAbuxiYrwlgw1VOqKppMxVKtYoAn2VUuuEpjCj6jLWpoTqSszR/38o7ChsHY1LHakhJZmw==}
-    engines: {node: '>=18'}
+  cspell-io@10.0.1:
+    resolution: {integrity: sha512-8C2ka07faxflnaqEBO3pektS21XViE/SEHT7F5ZD1ou7FyMR5u3xawTBJSczClfsxLt/WYeztBYrpmGAjmjksw==}
+    engines: {node: '>=22.18.0'}
 
-  cspell-lib@8.17.1:
-    resolution: {integrity: sha512-66n83Q7bK5tnvkDH7869/pBY/65AKmZVfCOAlsbhJn3YMDbNHFCHR0d1oNMlqG+n65Aco89VGwYfXxImZY+/mA==}
-    engines: {node: '>=18'}
+  cspell-lib@10.0.1:
+    resolution: {integrity: sha512-RpsIPiLzc4/YMW8BMRKpyJ81x439qjYWcqgdKeXnMkbKM88J9PexzutfFf/4v97v96KzfNitEzMpbI0uj8OeUg==}
+    engines: {node: '>=22.18.0'}
 
-  cspell-trie-lib@8.17.1:
-    resolution: {integrity: sha512-13WNa5s75VwOjlGzWprmfNbBFIfXyA7tYYrbV+LugKkznyNZJeJPojHouEudcLq3SYb2Q6tJ7qyWcuT5bR9qPA==}
-    engines: {node: '>=18'}
-
-  cspell@8.17.1:
-    resolution: {integrity: sha512-D0lw8XTXrTycNzOn5DkfPJNUT00X53OgvFDm+0SzhBr1r+na8LEh3CnQ6zKYVU0fL0x8vU82vs4jmGjDho9mPg==}
-    engines: {node: '>=18'}
-    hasBin: true
-
-  css-blank-pseudo@7.0.1:
-    resolution: {integrity: sha512-jf+twWGDf6LDoXDUode+nc7ZlrqfaNphrBIBrcmeP3D8yw1uPaix1gCC8LUQUGQ6CycuK2opkbFFWFuq/a94ag==}
-    engines: {node: '>=18'}
+  cspell-trie-lib@10.0.1:
+    resolution: {integrity: sha512-BFvhalSkRQFjKrZ//FKK7fRGrZFpifnxB5AwCkzsIsBZqicsfafcQ1xP21qpb0QqyV/IomjNgviG+tRJs+0rMw==}
+    engines: {node: '>=22.18.0'}
     peerDependencies:
-      postcss: ^8.4
+      '@cspell/cspell-types': 10.0.1
 
-  css-declaration-sorter@7.2.0:
-    resolution: {integrity: sha512-h70rUM+3PNFuaBDTLe8wF/cdWu+dOZmb7pJt8Z2sedYbAcQVQV/tEchueg3GWxwqS0cxtbxmaHEdkNACqcvsow==}
+  cspell@10.0.1:
+    resolution: {integrity: sha512-Gg6w/flT3fKfl3la62hfTnhtNnDQ+9mU7kUhVqw/axl/Ms4oENw0oJMkWFIoj4f6nL/SDPz7KcPXd2XbkKFNmQ==}
+    engines: {node: '>=22.18.0'}
+    hasBin: true
+
+  css-declaration-sorter@7.4.0:
+    resolution: {integrity: sha512-LTuzjPoyA2vMGKKcaOqKSp7Ub2eGrNfKiZH4LpezxpNrsICGCSFvsQOI29psISxNZtaXibkC2CXzrQ5enMeGGw==}
     engines: {node: ^14 || ^16 || >=18}
     peerDependencies:
       postcss: ^8.0.9
 
-  css-functions-list@3.2.3:
-    resolution: {integrity: sha512-IQOkD3hbR5KrN93MtcYuad6YPuTSUhntLHDuLEbFWE+ff2/XSZNdZG+LcbbIW5AXKg/WFIfYItIzVoHngHXZzA==}
-    engines: {node: '>=12 || >=16'}
-
-  css-has-pseudo@7.0.2:
-    resolution: {integrity: sha512-nzol/h+E0bId46Kn2dQH5VElaknX2Sr0hFuB/1EomdC7j+OISt2ZzK7EHX9DZDY53WbIVAR7FYKSO2XnSf07MQ==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss: ^8.4
+  css-functions-list@3.3.3:
+    resolution: {integrity: sha512-8HFEBPKhOpJPEPu70wJJetjKta86Gw9+CCyCnB3sui2qQfOvRyqBy4IKLKKAwdMpWb2lHXWk9Wb4Z6AmaUT1Pg==}
+    engines: {node: '>=12'}
 
   css-line-break@2.1.0:
     resolution: {integrity: sha512-FHcKFCZcAha3LwfVBhCQbW2nCNbkZXn7KVUJcsT5/P8YmfsVja0FMPJr0B903j/E69HUphKiV9iQArX8SDYA4w==}
 
-  css-prefers-color-scheme@10.0.0:
-    resolution: {integrity: sha512-VCtXZAWivRglTZditUfB4StnsWr6YVZ2PRtuxQLKTNRdtAf8tpzaVPE9zXIF3VaSc7O70iK/j1+NXxyQCqdPjQ==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss: ^8.4
-
-  css-select@4.3.0:
-    resolution: {integrity: sha512-wPpOYtnsVontu2mODhA19JrqWxNsfdatRKd64kmpRbQgh1KtItko5sTnEpPdpSaJszTOhEMlF/RPz28qj4HqhQ==}
-
-  css-select@5.1.0:
-    resolution: {integrity: sha512-nwoRF1rvRRnnCqqY7updORDsuqKzqYJ28+oSMaJMMgOauh3fvwHqMS7EZpIPqK8GL+g9mKxF1vP/ZjSeNjEVHg==}
+  css-select@5.2.2:
+    resolution: {integrity: sha512-TizTzUddG/xYLA3NXodFM0fSbNizXjOKhqiQQwvhlspadZokn1KDy0NZFS0wuEubIYAV5/c1/lAr0TaaFXEXzw==}
 
   css-tree@2.2.1:
     resolution: {integrity: sha512-OA0mILzGc1kCOCSJerOeqDxDQ4HOh+G8NbOJFOTgOCzpw7fCBubk0fEyxp8AgOL/jvLgYA/uV0cMbe43ElF1JA==}
     engines: {node: ^10 || ^12.20.0 || ^14.13.0 || >=15.0.0, npm: '>=7.0.0'}
 
-  css-tree@2.3.1:
-    resolution: {integrity: sha512-6Fv1DV/TYw//QF5IzQdqsNDjx/wc8TrMBZsqjL9eW01tWb7R7k/mq+/VXfJCl7SoD5emsJop9cOByJZfs8hYIw==}
+  css-tree@3.2.1:
+    resolution: {integrity: sha512-X7sjQzceUhu1u7Y/ylrRZFU2FS6LRiFVp6rKLPg23y3x3c3DOKAwuXGDp+PAGjh6CSnCjYeAul8pcT8bAl+lSA==}
     engines: {node: ^10 || ^12.20.0 || ^14.13.0 || >=15.0.0}
 
-  css-tree@3.1.0:
-    resolution: {integrity: sha512-0eW44TGN5SQXU1mWSkKwFstI/22X2bG1nYzZTYMAWjylYURhse752YgbE4Cx46AC+bAvI+/dYTPRk1LqSUnu6w==}
-    engines: {node: ^10 || ^12.20.0 || ^14.13.0 || >=15.0.0}
-
-  css-what@6.1.0:
-    resolution: {integrity: sha512-HTUrgRJ7r4dsZKU6GjmpfRK1O76h97Z8MfS1G0FozR+oF2kG6Vfe8JE6zwrkbxigziPHinCJ+gCPjA9EaBDtRw==}
+  css-what@6.2.2:
+    resolution: {integrity: sha512-u/O3vwbptzhMs3L1fQE82ZSLHQQfto5gyZzwteVIEyeaY5Fc7R4dapF/BvRoSYFeqfBk4m0V1Vafq5Pjv25wvA==}
     engines: {node: '>= 6'}
 
-  cssdb@8.2.3:
-    resolution: {integrity: sha512-9BDG5XmJrJQQnJ51VFxXCAtpZ5ebDlAREmO8sxMOVU0aSxN/gocbctjIG5LMh3WBUq+xTlb/jw2LoljBEqraTA==}
-
   cssesc@3.0.0:
     resolution: {integrity: sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==}
     engines: {node: '>=4'}
@@ -5202,37 +7056,37 @@ packages:
   cssfilter@0.0.10:
     resolution: {integrity: sha512-FAaLDaplstoRsDR8XGYH51znUN0UY7nMc6Z9/fvE8EXGwvJE9hu7W2vHwx1+bd6gCYnln9nLbzxFTrcO9YQDZw==}
 
-  cssnano-preset-default@7.0.6:
-    resolution: {integrity: sha512-ZzrgYupYxEvdGGuqL+JKOY70s7+saoNlHSCK/OGn1vB2pQK8KSET8jvenzItcY+kA7NoWvfbb/YhlzuzNKjOhQ==}
+  cssnano-preset-default@7.0.17:
+    resolution: {integrity: sha512-11qO63A+czwguQFJCaTdICvbaxn0pJzz/XghLlv+OT7WyToDxAMR0Xb3/26/l0y0hQJywwNbj/SLSQlGBHE1OA==}
     engines: {node: ^18.12.0 || ^20.9.0 || >=22.0}
     peerDependencies:
-      postcss: ^8.4.31
+      postcss: ^8.5.13
 
-  cssnano-utils@5.0.0:
-    resolution: {integrity: sha512-Uij0Xdxc24L6SirFr25MlwC2rCFX6scyUmuKpzI+JQ7cyqDEwD42fJ0xfB3yLfOnRDU5LKGgjQ9FA6LYh76GWQ==}
+  cssnano-utils@5.0.3:
+    resolution: {integrity: sha512-ynIREMICLxkxm7e9bCR9sh75s4Q5drICi0ua1yxo5jH2XPBqSKkl4dOh4EbFqtUmnTMhRffHgYL0EKKkMjtJTg==}
     engines: {node: ^18.12.0 || ^20.9.0 || >=22.0}
     peerDependencies:
-      postcss: ^8.4.31
+      postcss: ^8.5.13
 
-  cssnano@7.0.6:
-    resolution: {integrity: sha512-54woqx8SCbp8HwvNZYn68ZFAepuouZW4lTwiMVnBErM3VkO7/Sd4oTOt3Zz3bPx3kxQ36aISppyXj2Md4lg8bw==}
+  cssnano@7.1.9:
+    resolution: {integrity: sha512-uPR75+5Dk/WJ/YSPR1/YDHdwMM9c5FsaARljfKWgeCKLKOtJ0we21xy/RcCjn53fZnD/f6yYEIZ8pu18+GnbNQ==}
     engines: {node: ^18.12.0 || ^20.9.0 || >=22.0}
     peerDependencies:
-      postcss: ^8.4.31
+      postcss: ^8.5.13
 
   csso@5.0.5:
     resolution: {integrity: sha512-0LrrStPOdJj+SPCCrGhzryycLjwcgUSHBtxNA8aIDxf0GLsRh1cKYhB00Gd1lDOS4yGH69+SNn13+TWbVHETFQ==}
     engines: {node: ^10 || ^12.20.0 || ^14.13.0 || >=15.0.0, npm: '>=7.0.0'}
 
-  csstype@3.1.3:
-    resolution: {integrity: sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==}
+  csstype@3.2.3:
+    resolution: {integrity: sha512-z1HGKcYy2xA8AGQfwrn0PAy+PB7X/GSj3UVJW9qKyn43xWa+gl5nXmU4qqLMRzWVLFC8KusUX8T/0kCiOYpAIQ==}
 
-  cz-git@1.11.0:
-    resolution: {integrity: sha512-FCNkpyVmNPX0P8kHtX8uoFcXsJ4bjivMXVS5vc/qCyM8jj+Tuqo6CXQjGQKwKl0Lk9VNz7o6JfPoU/mM/XhxqA==}
+  cz-git@1.13.1:
+    resolution: {integrity: sha512-xeMA5ci+gkBY6uKmqc6nzhG/Q4pmK1DKbVVUgByOTBgregoiYE0f3otEF0ADelyEWH4vNsO1W2o7QZYEe7Nwlw==}
     engines: {node: '>=v12.20.0'}
 
-  czg@1.11.0:
-    resolution: {integrity: sha512-go39avnHPvDn1HF4LS1qxj5XPGCQexZ9+y8f+0VlE9plZgRyWUOl4rUCwE4vD1azouIhz/KaauB45A7jPfMxpw==}
+  czg@1.13.1:
+    resolution: {integrity: sha512-mCfY4bCAMAdaFSlrQwtUTChzFAv59kD/y2leX5+C7X9inu0mt/VkHT7gkbzwcToh26oJaOaYPA9lcXUX92/6cw==}
     engines: {node: '>=v12.20.0'}
     hasBin: true
 
@@ -5243,10 +7097,6 @@ packages:
   danmu.js@1.2.1:
     resolution: {integrity: sha512-evDEImUBo94c846fC92K//Dzll8jXnZ3zKmYlQHwMzmvw6IW2IyjWL3Ew2SqEAzuqauFnDkwJEgZauu3uW/p1Q==}
 
-  dargs@8.1.0:
-    resolution: {integrity: sha512-wAV9QHOsNbwnWdNW2FYvE1P56wtgSbM+3SZcdGiWQILwVjACCXDCI3Ai8QlCjMDB8YK5zySiXZYBiwGmNY3lnw==}
-    engines: {node: '>=12'}
-
   data-view-buffer@1.0.2:
     resolution: {integrity: sha512-EmKO5V3OLXh1rtK2wgXRansaK1/mtVdTUEiEI0W8RkvgT05kfxaH29PliLnpLP73yYO6142Q72QNa8Wx/A5CqQ==}
     engines: {node: '>= 0.4'}
@@ -5262,17 +7112,18 @@ packages:
   dataloader@1.4.0:
     resolution: {integrity: sha512-68s5jYdlvasItOJnCuI2Q9s4q98g0pCyL3HrcKJu8KNugUl8ahgmZYg38ysLTgQjjXX3H8CJLkAvWrclWfcalw==}
 
-  dayjs@1.11.13:
-    resolution: {integrity: sha512-oaMBel6gjolK862uaPQOVTA7q3TZhuSvuMQAAglQDOWYO9A91IrAOUJEyKVlqJlHE0vq5p5UXxzdPfMH/x6xNg==}
+  dayjs@1.11.21:
+    resolution: {integrity: sha512-98IT+HOahAisibz/yjKbzuOBwYcjJ7BCLPzARyHiyEBmRz4fatF+KPJszEHXsGYjUG234aH/cOjW1wwTbKUZlA==}
 
-  db0@0.2.1:
-    resolution: {integrity: sha512-BWSFmLaCkfyqbSEZBQINMVNjCVfrogi7GQ2RSy1tmtfK9OXlsup6lUMwLsqSD7FbAjD04eWFdXowSHHUp6SE/Q==}
+  db0@0.3.4:
+    resolution: {integrity: sha512-RiXXi4WaNzPTHEOu8UPQKMooIbqOEyqA1t7Z6MsdxSCeb8iUC9ko3LcmsLmeUt2SM5bctfArZKkRQggKZz7JNw==}
     peerDependencies:
       '@electric-sql/pglite': '*'
       '@libsql/client': '*'
       better-sqlite3: '*'
       drizzle-orm: '*'
       mysql2: '*'
+      sqlite3: '*'
     peerDependenciesMeta:
       '@electric-sql/pglite':
         optional: true
@@ -5284,9 +7135,8 @@ packages:
         optional: true
       mysql2:
         optional: true
-
-  de-indent@1.0.2:
-    resolution: {integrity: sha512-e/1zu3xH5MQryN2zdVaF0OrdNLUbvWxzMbi+iNA6Bky7l1RoP8a2fIbRocyHclXt/arDrrR6lL3TqFD9pMQTsg==}
+      sqlite3:
+        optional: true
 
   debug@2.6.9:
     resolution: {integrity: sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==}
@@ -5304,8 +7154,8 @@ packages:
       supports-color:
         optional: true
 
-  debug@4.4.0:
-    resolution: {integrity: sha512-6WTZ/IxCY/T6BALoZHaE4ctp9xm+Z5kY/pzYaCHRFeyVhojxlrm+46y68HA6hr0TcwEssoxNiDEUJQjfPZ/RYA==}
+  debug@4.4.3:
+    resolution: {integrity: sha512-RGwwWnwQvkVfavKVt22FGLw+xYSdzARwm0ru6DhTVA3umU5hZc28V3kO4stgYryrTlLpuvgI9GiijltAjNbcqA==}
     engines: {node: '>=6.0'}
     peerDependencies:
       supports-color: '*'
@@ -5317,13 +7167,9 @@ packages:
     resolution: {integrity: sha512-z2S+W9X73hAUUki+N+9Za2lBlun89zigOyGrsax+KUQ6wKW4ZoWpEYBkGhQjwAjjDCkWxhY0VKEhk8wzY7F5cA==}
     engines: {node: '>=0.10.0'}
 
-  deep-eql@5.0.2:
-    resolution: {integrity: sha512-h5k/5U50IJJFpzfL6nO9jaaumfjO/f2NjK/oYB2Djzm4p9L+3T9qWpZqZ2hAbLPuuYq9wrU08WQyBTL5GbPk5Q==}
-    engines: {node: '>=6'}
-
-  deep-equal@1.1.2:
-    resolution: {integrity: sha512-5tdhKF6DbU7iIzrIOa1AOUt39ZRm13cmL1cGEh//aqR8x9+tNfbywRf0n5FD/18OKMdo7DNEtrX2t22ZAkI+eg==}
-    engines: {node: '>= 0.4'}
+  decompress-response@6.0.0:
+    resolution: {integrity: sha512-aW35yZM6Bb/4oJlZncMH2LCoZtJXTRxES17vE3hoRiowU2kWHaJKFkSBDnDR+cm9J+9QhXmREyIfv0pji9ejCQ==}
+    engines: {node: '>=10'}
 
   deep-extend@0.6.0:
     resolution: {integrity: sha512-LOHxIOaPYdHlJRtCQfDIVZtfw/ufM8+rVj649RIHzcm/vGwQRXFt6OPqIFWsm2XEMrNIEtWR64sY1LEKD2vAOA==}
@@ -5332,29 +7178,26 @@ packages:
   deep-is@0.1.4:
     resolution: {integrity: sha512-oIPzksmTg4/MriiaYGO+okXDT7ztn/w3Eptv/+gSIdMdKsJo0u4CfYNFJPy+4SKMuCqGw2wxnA+URMg3t8a/bQ==}
 
-  deep-pick-omit@1.2.1:
-    resolution: {integrity: sha512-2J6Kc/m3irCeqVG42T+SaUMesaK7oGWaedGnQQK/+O0gYc+2SP5bKh/KKTE7d7SJ+GCA9UUE1GRzh6oDe0EnGw==}
-
   deepmerge@4.3.1:
     resolution: {integrity: sha512-3sUqbMEc77XqpdNO7FRyRog+eW3ph+GYCbj+rK+uYyRMuwsVy0rMiVtPn+QJlKFvWP/1PYpapqYn0Me2knFn+A==}
     engines: {node: '>=0.10.0'}
 
-  default-browser-id@5.0.0:
-    resolution: {integrity: sha512-A6p/pu/6fyBcA1TRz/GqWYPViplrftcW2gZC9q79ngNCKAeR/X3gcEdXQHl4KNXV+3wgIJ1CPkJQ3IHM6lcsyA==}
+  default-browser-id@5.0.1:
+    resolution: {integrity: sha512-x1VCxdX4t+8wVfd1so/9w+vQ4vx7lKd2Qp5tDRutErwmR85OgmfX7RlLRMWafRMY7hbEiXIbudNrjOAPa/hL8Q==}
     engines: {node: '>=18'}
 
-  default-browser@5.2.1:
-    resolution: {integrity: sha512-WY/3TUME0x3KPYdRRxEJJvXRHV4PyPoUsxtZa78lwItwRQRHhd2U9xOscaT/YTf8uCXIAjeJOFBVEh/7FtD8Xg==}
+  default-browser@5.5.0:
+    resolution: {integrity: sha512-H9LMLr5zwIbSxrmvikGuI/5KGhZ8E2zH3stkMgM5LpOWDutGM2JZaj460Udnf1a+946zc7YBgrqEWwbk7zHvGw==}
     engines: {node: '>=18'}
 
+  defer-to-connect@2.0.1:
+    resolution: {integrity: sha512-4tvttepXG1VaYGrRibk5EwJd1t4udunSOVMdLSAL6mId1ix438oPwPZMALY41FCijukO1L0twNcGsdzS7dHgDg==}
+    engines: {node: '>=10'}
+
   define-data-property@1.1.4:
     resolution: {integrity: sha512-rBMvIzlpA8v6E+SJZoo++HAYqsLrkg7MSfIinMPFhmkorw7X+dOXVJQs+QT69zGkzMyfDnIMN2Wid1+NbL3T+A==}
     engines: {node: '>= 0.4'}
 
-  define-lazy-prop@2.0.0:
-    resolution: {integrity: sha512-Ds09qNh8yw3khSjiJjiUInaGX9xlqZDY7JVryGxdxV7NPeuqQfplOpQ66yJFZut3jLa5zOwkXw1g9EI2uKh4Og==}
-    engines: {node: '>=8'}
-
   define-lazy-prop@3.0.0:
     resolution: {integrity: sha512-N+MeXYoqr3pOgn8xfyRPREN7gHakLYjhsHhWGT3fWAiL4IkAt0iDw14QiiEm2bE30c5XX5q0FtAA3CK5f9/BUg==}
     engines: {node: '>=12'}
@@ -5363,8 +7206,8 @@ packages:
     resolution: {integrity: sha512-8QmQKqEASLd5nx0U1B1okLElbUuuttJ/AnYmRXbbbGDWh6uS208EjD4Xqq/I9wK7u0v6O08XhTWnt5XtEbR6Dg==}
     engines: {node: '>= 0.4'}
 
-  defu@6.1.4:
-    resolution: {integrity: sha512-mEQCMmwJu317oSz8CwdIOdwf3xMif1ttiM8LTufzc3g6kR+9Pe236twL8j3IYT1F7GfRgGcW6MWxzZjLIkuHIg==}
+  defu@6.1.7:
+    resolution: {integrity: sha512-7z22QmUWiQ/2d0KkdYmANbRUVABpZ9SNYyH5vx6PZ+nE5bcC0l7uFvEfHlyld/HcGBFTL536ClDt3DEcSlEJAQ==}
 
   delayed-stream@1.0.0:
     resolution: {integrity: sha512-ZySD7Nf91aLB0RxL4KGrKHBXl7Eds1DAmEdcoVawXnLD7SDhpNgtuII2aAkg7a7QS41jxPSZ17p4VdGnMHk3MQ==}
@@ -5377,58 +7220,40 @@ packages:
     resolution: {integrity: sha512-HVQE3AAb/pxF8fQAoiqpvg9i3evqug3hoiwakOyZAwJm+6vZehbkYXZ0l4JxS+I3QxM97v5aaRNhj8v5oBhekw==}
     engines: {node: '>=0.10'}
 
-  depcheck@1.4.7:
-    resolution: {integrity: sha512-1lklS/bV5chOxwNKA/2XUUk/hPORp8zihZsXflr8x0kLwmcZ9Y9BsS6Hs3ssvA+2wUVbG0U2Ciqvm1SokNjPkA==}
-    engines: {node: '>=10'}
-    hasBin: true
-
   depd@2.0.0:
     resolution: {integrity: sha512-g7nH6P6dyDioJogAAGprGpCtVImJhpPk/roCzdb3fIh61/s/nPsfR6onyMwkCAR/OlC3yBC0lESvUoQEAssIrw==}
     engines: {node: '>= 0.8'}
 
-  deps-regex@0.2.0:
-    resolution: {integrity: sha512-PwuBojGMQAYbWkMXOY9Pd/NWCDNHVH12pnS7WHqZkTSeMESe4hwnKKRp0yR87g37113x4JPbo/oIvXY+s/f56Q==}
-
-  destr@2.0.3:
-    resolution: {integrity: sha512-2N3BOUU4gYMpTP24s5rF5iP7BDr7uNTCs4ozw3kf/eKfvWSIu93GEBi5m427YoyJoeOzQ5smuu4nNAPGb8idSQ==}
-
-  destroy@1.2.0:
-    resolution: {integrity: sha512-2sJGJTaXIIaR1w4iJSNoN0hnMY7Gpc/n8D4qSCJw8QqFWXf7cuAgnEHxBpweaVcPevC2l3KpjYCx3NypQQgaJg==}
-    engines: {node: '>= 0.8', npm: 1.2.8000 || >= 1.4.16}
-
-  detect-file@1.0.0:
-    resolution: {integrity: sha512-DtCOLG98P007x7wiiOmfI0fi3eIKyWiLTGJ2MDnVi/E04lWGbf+JzrRHMm0rgIIZJGtHpKpbVgLWHrv8xXpc3Q==}
-    engines: {node: '>=0.10.0'}
+  destr@2.0.5:
+    resolution: {integrity: sha512-ugFTXCtDZunbzasqBxrK93Ik/DRYsO6S/fedkWEMKqt04xZ4csmnmwGDBAb07QWNaGMAmnTIemsYZCksjATwsA==}
 
   detect-indent@6.1.0:
     resolution: {integrity: sha512-reYkTUJAZb9gUuZ2RvVCNhVHdg62RHnJ7WJl8ftMi4diZ6NWlciOzQN88pUhSELEwflJht4oQDv0F0BMlwaYtA==}
     engines: {node: '>=8'}
 
-  detect-libc@1.0.3:
-    resolution: {integrity: sha512-pGjwhsmsp4kL2RTz08wcOlGN83otlqHeD/Z5T8GXZB+/YcpQ/dgo+lbU8ZsGxV0HIvqqxo9l7mqYwyYMD9bKDg==}
-    engines: {node: '>=0.10'}
-    hasBin: true
-
-  detect-libc@2.0.3:
-    resolution: {integrity: sha512-bwy0MGW55bG41VqxxypOsdSdGqLwXPI/focwgTYCFMbdUiBAxLg9CFzG08sz2aqzknwiX7Hkl0bQENjg8iLByw==}
+  detect-libc@2.1.2:
+    resolution: {integrity: sha512-Btj2BOOO83o3WyH59e8MgXsxEQVcarkUOpEYrubB0urwnN10yQ364rsiByU11nZlqWYZm05i/of7io4mzihBtQ==}
     engines: {node: '>=8'}
 
-  didyoumean@1.2.2:
-    resolution: {integrity: sha512-gxtyfqMg7GKyhQmb056K7M3xszy/myH8w+B4RT+QXBQsvAOdc3XymqDDPHx1BgPgsdAA5SIifona89YtRATDzw==}
+  detect-node@2.1.0:
+    resolution: {integrity: sha512-T0NIuQpnTvFDATNuHN5roPwSBG83rFsuO+MXXH9/3N1eFbn4wcPjttvjMLEPWJ0RGUYgQE7cGgS3tNxbqCGM7g==}
+
+  diff-sequences@29.6.3:
+    resolution: {integrity: sha512-EjePK1srD3P08o2j4f0ExnylqRs5B9tJjcp9t1krH2qRi8CCdsYfwe9JgSLurFBWwq4uOlipzfk5fHNvwFKr8Q==}
+    engines: {node: ^14.15.0 || ^16.10.0 || >=18.0.0}
 
   dijkstrajs@1.0.3:
     resolution: {integrity: sha512-qiSlmBq9+BCdCA/L46dw8Uy93mloxsPSbwnm5yrKn2vMPiy8KyAskTF6zuV/j5BMsmOGZDPs7KjU+mjb670kfA==}
 
+  dir-compare@4.2.0:
+    resolution: {integrity: sha512-2xMCmOoMrdQIPHdsTawECdNPwlVFB9zGcz3kuhmBO6U3oU+UQjsue0i8ayLKpgBcm+hcXPMVSGUN9d+pvJ6+VQ==}
+
   dir-glob@3.0.1:
     resolution: {integrity: sha512-WkrWp9GR4KXfKGYzOLmTuGVi1UWFfws377n9cc55/tb6DuqyF6pcQ5AbiHEshaDpY9v6oaSr2XCDidGmMwdzIA==}
     engines: {node: '>=8'}
 
-  dlv@1.1.3:
-    resolution: {integrity: sha512-+HlytyjlPKnIG8XuRG8WvmBP8xs8P71y+SKKS6ZXWoEgLuePxtDoUEiH7WkdePWrQ5JBpE6aoVqfZfJUQkjXwA==}
-
-  doctrine@3.0.0:
-    resolution: {integrity: sha512-yS+Q5i3hBf7GBkd4KG8a7eBNNWNGLTaEwwYWUijIYM7zrlYDM0BFXHjjPWlWZ1Rg7UaddZeIDmi9jF3HmqiQ2w==}
-    engines: {node: '>=6.0.0'}
+  dmg-builder@26.15.3:
+    resolution: {integrity: sha512-O3zJUFUYHJKgzPqioHxfxzBzlSC1eXCSr79gMSBKBP5AgjjpmrydMsMLotEg9fAJF36vdUncb+4ndRNxoPdlSQ==}
 
   dom-align@1.12.4:
     resolution: {integrity: sha512-R8LUSEay/68zE5c8/3BDxiTEvgb4xZTF0RKmAHfiEVN3klfIpXfi2/QCoiWPccVQ0J/ZGdz9OjzL4uJEP/MRAw==}
@@ -5436,59 +7261,58 @@ packages:
   dom-scroll-into-view@2.0.1:
     resolution: {integrity: sha512-bvVTQe1lfaUr1oFzZX80ce9KLDlZ3iU+XGNE/bz9HnGdklTieqsbmsLHe+rT2XWqopvL0PckkYqN7ksmm5pe3w==}
 
-  dom-serializer@1.4.1:
-    resolution: {integrity: sha512-VHwB3KfrcOOkelEG2ZOfxqLZdfkil8PtJi4P8N2MMXucZq2yLp75ClViUlOVwyoHEDjYU433Aq+5zWP61+RGag==}
-
   dom-serializer@2.0.0:
     resolution: {integrity: sha512-wIkAryiqt/nV5EQKqQpo3SToSOV9J0DnbJqwK7Wv/Trc92zIAYZ4FlMu+JPFW1DfGFt81ZTCGgDEabffXeLyJg==}
 
-  dom-zindex@1.0.6:
-    resolution: {integrity: sha512-FKWIhiU96bi3xpP9ewRMgANsoVmMUBnMnmpCT6dPMZOunVYJQmJhSRruoI0XSPoHeIif3kyEuiHbFrOJwEJaEA==}
+  dom-zindex@1.0.7:
+    resolution: {integrity: sha512-cKU/h8v8IPBgdZOTPbPmq3Ib+Ac5C+kKoh9I4LbGR9BM3GwbmB16KYWKJcj5M2BavnA66EbgYzxYDLd1IytnlQ==}
 
   domelementtype@2.3.0:
     resolution: {integrity: sha512-OLETBj6w0OsagBwdXnPdN0cnMfF9opN69co+7ZrbfPGrdpPVNBUj02spi6B1N7wChLQiPn4CSH/zJvXw56gmHw==}
 
-  domhandler@4.3.1:
-    resolution: {integrity: sha512-GrwoxYN+uWlzO8uhUXRl0P+kHE4GtVPfYzVLcUxPL7KNdHKj66vvlhiweIHqYYXWlw+T8iLMp42Lm67ghw4WMQ==}
-    engines: {node: '>= 4'}
-
   domhandler@5.0.3:
     resolution: {integrity: sha512-cgwlv/1iFQiFnU96XXgROh8xTeetsnJiDsTc7TYCLFd9+/WNkIqPTxiM/8pSd8VIrhXGTf1Ny1q1hquVqDJB5w==}
     engines: {node: '>= 4'}
 
-  domutils@2.8.0:
-    resolution: {integrity: sha512-w96Cjofp72M5IIhpjgobBimYEfoPjx1Vx0BSX9P30WBdZW2WIKU0T1Bd0kz2eNZ9ikjKgHbEyKx8BB6H1L3h3A==}
-
-  domutils@3.1.0:
-    resolution: {integrity: sha512-H78uMmQtI2AhgDJjWeQmHwJJ2bLPD3GMmO7Zja/ZZh84wkm+4ut+IUnUdRa8uCGX88DiVx1j6FRe1XfxEgjEZA==}
+  domutils@3.2.2:
+    resolution: {integrity: sha512-6kZKyUajlDuqlHKVX1w7gyslj9MPIXzIFiz/rGu35uC1wMi+kMhQwGhl4lt9unC9Vb9INnY9Z3/ZA3+FhASLaw==}
 
   dot-case@3.0.4:
     resolution: {integrity: sha512-Kv5nKlh6yRrdrGvxeJ2e5y2eRUpkUosIW4A2AS38zwSz27zu7ufDwQPi5Jhs3XAlGNetl3bmnGhQsMtkKJnj3w==}
 
-  dot-prop@5.3.0:
-    resolution: {integrity: sha512-QM8q3zDe58hqUqjraQOmzZ1LIH9SWQJTlEKCH4kJ2oQvLZk7RbQXvtDM2XEq3fwkV9CCvvH4LA0AV+ogFsBM2Q==}
-    engines: {node: '>=8'}
+  dot-prop@10.2.0:
+    resolution: {integrity: sha512-BTJ9aZYL3vCfZlZOBLy9v8TUqWGQ0pzFnygKwFZt5udj6viBoFIBviKPUoZLDCPn1FoXffv6McQFDenrm5Krfw==}
+    engines: {node: '>=20'}
 
   dot-prop@9.0.0:
     resolution: {integrity: sha512-1gxPBJpI/pcjQhKgIU91II6Wkay+dLcN3M6rf2uwP8hRur3HtQXjVrdAK3sjC0piaEuxzMwjXChcETiJl47lAQ==}
     engines: {node: '>=18'}
 
-  dotenv-expand@8.0.3:
-    resolution: {integrity: sha512-SErOMvge0ZUyWd5B0NXMQlDkN+8r+HhVUsxgOO7IoPDOdDRD2JjExpN6y3KnFR66jsJMwSn1pqIivhU5rcJiNg==}
+  dotenv-expand@11.0.7:
+    resolution: {integrity: sha512-zIHwmZPRshsCdpMDyVsqGmgyP0yT8GAgXUnkdAoJisxvf33k7yO6OuoKmcTGuXPWSsm8Oh88nZicRLA9Y0rUeA==}
     engines: {node: '>=12'}
 
-  dotenv@16.0.3:
-    resolution: {integrity: sha512-7GO6HghkA5fYG9TYnNxi14/7K9f5occMlp3zXAuSxn7CKCxt9xbNWG7yF8hTCSUchlfWSe3uLmlPfigevRItzQ==}
+  dotenv@16.6.1:
+    resolution: {integrity: sha512-uBq4egWHTcTt33a72vpSG0z3HnPuIl6NqYcTrKEg2azoEyl2hpW0zqlxysq2pK9HlDIHyHyakeYaYnSAwd8bow==}
     engines: {node: '>=12'}
 
-  dotenv@16.4.7:
-    resolution: {integrity: sha512-47qPchRCykZC03FhkYAhrvwU4xDBFIj1QPqaarj6mdM/hgUzfPHcpkHJOn3mJAufFeeAxAzeGsr5X0M4k6fLZQ==}
+  dotenv@17.4.2:
+    resolution: {integrity: sha512-nI4U3TottKAcAD9LLud4Cb7b2QztQMUEfHbvhTH09bqXTxnSie8WnjPALV/WMCrJZ6UV/qHJ6L03OqO3LcdYZw==}
     engines: {node: '>=12'}
 
   dotenv@8.6.0:
     resolution: {integrity: sha512-IrPdXQsk2BbzvCBGBOTmmSH5SodmqZNt4ERAZDmW4CT+tL8VtvinqywuANaFu4bOMWki16nqf0e4oC0QIaDr/g==}
     engines: {node: '>=10'}
 
+  dts-resolver@3.0.0:
+    resolution: {integrity: sha512-1T1f+z+4tl9XD+m+0HBgWoL/nm0bOIffyWaUuUSBlFg/86IWvfx+wjNaO/ybU0AJzG9/Mi5hBUgGV6zCmWEN7Q==}
+    engines: {node: ^22.18.0 || >=24.0.0}
+    peerDependencies:
+      oxc-resolver: '>=11.0.0'
+    peerDependenciesMeta:
+      oxc-resolver:
+        optional: true
+
   dunder-proto@1.0.1:
     resolution: {integrity: sha512-KIN/nDJBQRcXw0MLVhZE9iQHmG68qAVIBg9CqmUYjmQIhgij9U5MFvrqkUL5FbtyyzZuOeOt0zdeRe4UY7ct+A==}
     engines: {node: '>= 0.4'}
@@ -5502,11 +7326,11 @@ packages:
   eastasianwidth@0.2.0:
     resolution: {integrity: sha512-I88TYZWc9XiYHRQ4/3c5rjjfgkjhLyW2luGIheGERbNQ6OY7yTybanSpDXZa8y7VUP9YmDcYa+eyq4ca7iLqWA==}
 
-  echarts@5.5.1:
-    resolution: {integrity: sha512-Fce8upazaAXUVUVsjgV6mBnGuqgO+JNDlcgF79Dksy4+wgGpQB2lmYoO4TSweFg/mZITdpGHomw/cNBJZj1icA==}
+  echarts@6.1.0:
+    resolution: {integrity: sha512-q0yaFPggC9FUdsWH4blavRWFmxdrIodbkoKNAjJudAI6CA9gNPxHtV2RcZNEepZVlk4yvBYkOkbk6HIVpIyHZA==}
 
-  editorconfig@1.0.4:
-    resolution: {integrity: sha512-L9Qe08KWTlqYMVvMcTIvMAdl1cDUubzRNYL+WfA4bLDMHe4nemKkpmYzkznE1FwLKu0EEmy6obgQKzMJrg4x9Q==}
+  editorconfig@1.0.7:
+    resolution: {integrity: sha512-e0GOtq/aTQhVdNyDU9e02+wz9oDDM+SIOQxWME2QRjzRX5yyLAuHDE+0aE8vHb9XRC8XD37eO2u57+F09JqFhw==}
     engines: {node: '>=14'}
     hasBin: true
 
@@ -5518,11 +7342,49 @@ packages:
     engines: {node: '>=0.10.0'}
     hasBin: true
 
-  electron-to-chromium@1.5.75:
-    resolution: {integrity: sha512-Lf3++DumRE/QmweGjU+ZcKqQ+3bKkU/qjaKYhIJKEOhgIO9Xs6IiAQFkfFoj+RhgDk4LUeNsLo6plExHqSyu6Q==}
+  electron-builder-squirrel-windows@26.15.3:
+    resolution: {integrity: sha512-Jc19XPV9y9+2bAdZPkXuVNGNIEFBq9poHC61l8Kv6FdK7DRG3+Ic0rerC0DXOaeHNz8yW0fg/JnF8GQROOF5MA==}
 
-  emoji-regex@10.4.0:
-    resolution: {integrity: sha512-EC+0oUMY1Rqm4O6LLrgjtYDvcVYTy7chDnM4Q7030tP4Kwj3u/pR6gP9ygnp2CJMK5Gq+9Q2oqmrFJAz01DXjw==}
+  electron-builder@26.15.3:
+    resolution: {integrity: sha512-a1KM5heqS3gQCZzizXEI8RjJy3QVogULPdeSknt76uLDpBIW/HDGsMg/XgP0riP6PI9COsRvFITKKGDqA8fJxA==}
+    engines: {node: '>=14.0.0'}
+    hasBin: true
+
+  electron-log@5.4.4:
+    resolution: {integrity: sha512-istWgaXjBfURBSS8LWVW9C3jsc6+ac+tY1lXrQEOTp0lVj+a4OlO1Tmqb36GgnEUDv92DGC9VI1HNXwJinWpgA==}
+    engines: {node: '>= 14'}
+
+  electron-publish@26.15.3:
+    resolution: {integrity: sha512-g/2bn8YTavY4cuS5F+jOS7zmZbXXBV8KZ8yHKfJjFPoKtzBqrpCdNPxBd3tqdBwP7BVd0lGzf7Bk2s0KesWZ4Q==}
+
+  electron-to-chromium@1.5.403:
+    resolution: {integrity: sha512-MQsYmdaLzvaCX5j+ZZBr5Fm6uCCnPQcRtlvmvRlWqrXy+BH2O4ffXIAScF+JQznQWB9brWp4lSD9Z4yNmaf2BA==}
+
+  electron-updater@6.8.9:
+    resolution: {integrity: sha512-ZhVxM9iGONUpZGI1FxdMRgJjUFXi7AYGVa5PwKlO1tV1/4zDxQmfKpXOHVztKrd6L9rLcFjERvi1Mf2vxyTkig==}
+
+  electron-vite@5.0.0:
+    resolution: {integrity: sha512-OHp/vjdlubNlhNkPkL/+3JD34ii5ov7M0GpuXEVdQeqdQ3ulvVR7Dg/rNBLfS5XPIFwgoBLDf9sjjrL+CuDyRQ==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    hasBin: true
+    peerDependencies:
+      '@swc/core': ^1.0.0
+      vite: ^5.0.0 || ^6.0.0 || ^7.0.0
+    peerDependenciesMeta:
+      '@swc/core':
+        optional: true
+
+  electron-winstaller@5.4.0:
+    resolution: {integrity: sha512-bO3y10YikuUwUuDUQRM4KfwNkKhnpVO7IPdbsrejwN9/AABJzzTQ4GeHwyzNSrVO+tEH3/Np255a3sVZpZDjvg==}
+    engines: {node: '>=8.0.0'}
+
+  electron@43.4.0:
+    resolution: {integrity: sha512-3qxGF0CeQbiox5oWV1JlbWGQ1VerbmDhTFqW4sJ8h7uqTHniFYPObXJcDna0DMh32et0fFyKzz0YY8lJv3t5jg==}
+    engines: {node: '>= 22.12.0'}
+    hasBin: true
+
+  emoji-regex@10.6.0:
+    resolution: {integrity: sha512-toUI84YS5YmxW219erniWD0CIVOo46xGKColeNQRgOzDorgBi1v4D71/OFzgD9GO2UGKIv1C3Sp8DAn0+j5w7A==}
 
   emoji-regex@8.0.0:
     resolution: {integrity: sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==}
@@ -5530,38 +7392,40 @@ packages:
   emoji-regex@9.2.2:
     resolution: {integrity: sha512-L18DaJsXSUk2+42pv8mLs5jJT2hqFkFE4j21wOmgbUqsZ2hL72NsUU785g9RXgo3s0ZNgVl42TiHp3ZtOv/Vyg==}
 
-  encodeurl@1.0.2:
-    resolution: {integrity: sha512-TPJXq8JqFaVYm2CWmPvnP2Iyo4ZSM7/QKcSmuMLDObfpH5fi7RUGmd/rTDf+rut/saiDiQEeVTNgAmJEdAOx0w==}
-    engines: {node: '>= 0.8'}
+  empathic@2.0.1:
+    resolution: {integrity: sha512-YGRs8knHhKHVShLkFET/rWAU8kmHbOV5LwN938RHI0pljAJ1Gf6SzXsSmRaEzcXTtOOmVqJ5+WtQPL5uigY50Q==}
+    engines: {node: '>=14'}
 
   encodeurl@2.0.0:
     resolution: {integrity: sha512-Q0n9HRi4m6JuGIV1eFlmvJB7ZEVxu93IrMyiMsGC0lrMJMWzRgx6WGquyfQgZVb31vhGgXnfmPNNXmxnOkRBrg==}
     engines: {node: '>= 0.8'}
 
-  encoding-sniffer@0.2.0:
-    resolution: {integrity: sha512-ju7Wq1kg04I3HtiYIOrUrdfdDvkyO9s5XM8QAj/bN61Yo/Vb4vgJxy5vi4Yxk01gWHbrofpPtpxM8bKger9jhg==}
-
-  encoding@0.1.13:
-    resolution: {integrity: sha512-ETBauow1T35Y/WZMkio9jiM0Z5xjHHmJ4XmjZOq1l/dXz3lr2sRn87nJy20RupqSh1F2m3HHPSp8ShIPQJrJ3A==}
+  encoding-sniffer@0.2.1:
+    resolution: {integrity: sha512-5gvq20T6vfpekVtqrYQsSCFZ1wEg5+wW0/QaZMWkFr6BqD3NfKs0rLCx4rrVlSWJeZb5NBJgVLswK/w2MWU+Gw==}
 
   end-of-stream@1.4.5:
     resolution: {integrity: sha512-ooEGc6HP26xXq/N+GCGOT0JKCLDGrq2bQUZrQ7gyrJiZANJ/8YDTxTpQBXGMn+WbIQXNVpyWymm7KYVICQnyOg==}
 
-  enhanced-resolve@5.18.0:
-    resolution: {integrity: sha512-0/r0MySGYG8YqlayBZ6MuCfECmHFdJ5qyPh8s8wa5Hnm6SaFLSK1VYCbj+NKp090Nm1caZhD+QTnmxO7esYGyQ==}
+  enhanced-resolve@5.24.5:
+    resolution: {integrity: sha512-L1l8TNvomm6UVW5B253AGxQagSQr+vGwhMlrrfRS2qmhx46AMpMVJKQYLvWYbysTMY8VoicOvzHzoHMbyzB+4A==}
     engines: {node: '>=10.13.0'}
 
   enquirer@2.4.1:
     resolution: {integrity: sha512-rRqJg/6gd538VHvR3PSrdRBb/1Vy2YfzHqzvbhGIQpDRKIa4FgV/54b5Q1xYSxOOwKvjXweS26E0Q+nAMwp2pQ==}
     engines: {node: '>=8.6'}
 
-  entities@2.2.0:
-    resolution: {integrity: sha512-p92if5Nz619I0w+akJrLZH0MX0Pb5DX39XOwQTtXSdQQOaYH03S1uIQp4mhOZtAXrxq4ViO67YTiLBo2638o9A==}
-
   entities@4.5.0:
     resolution: {integrity: sha512-V0hjH4dGPh9Ao5p0MoRY6BVqtwCjhz6vI5LT8AJ55H+4g9/4vbHx1I54fS0XuclLhDHArPQCiMjDxjaL8fPxhw==}
     engines: {node: '>=0.12'}
 
+  entities@6.0.1:
+    resolution: {integrity: sha512-aN97NXWF6AWBTahfVOIrB/NShkzi5H7F9r1s9mD3cDj4Ko5f2qhhVoYMibXF7GlLveb/D2ioWay8lxI97Ven3g==}
+    engines: {node: '>=0.12'}
+
+  entities@7.0.1:
+    resolution: {integrity: sha512-TWrgLOFUQTH994YUyl1yT4uyavY5nNB5muff+RtWaqNVCAK408b5ZnnbNAUEWLTCpum9w6arT70i1XdQ4UeOPA==}
+    engines: {node: '>=0.12'}
+
   env-paths@2.2.1:
     resolution: {integrity: sha512-+h1lkLKhZMTYjog1VEpJNG7NZJWcuc2DDk/qsqSTRRCOXiLjeQ1d1/udrUGhqMxUgAlwKNZ0cf2uqan5GLuS2A==}
     engines: {node: '>=6'}
@@ -5570,6 +7434,10 @@ packages:
     resolution: {integrity: sha512-dtJUTepzMW3Lm/NPxRf3wP4642UWhjL2sQxc+ym2YMj1m/H2zDNQOlezafzkHwn6sMstjHTwG6iQQsctDW/b1A==}
     engines: {node: ^12.20.0 || ^14.13.1 || >=16.0.0}
 
+  env-paths@4.0.0:
+    resolution: {integrity: sha512-pxP8eL2SwwaTRi/KHYwLYXinDs7gL3jxFcBYmEdYfZmZXbaVDvdppd0XBU8qVz03rDfKZMXg1omHCbsJjZrMsw==}
+    engines: {node: '>=20'}
+
   environment@1.1.0:
     resolution: {integrity: sha512-xUtoPkMggbz0MPyPiIWr1Kp4aeWJjDZ6SMvURhimjdZgsRuDplF5/s9hcgGhyXMhs+6vpnuoiZ2kFiu3FMnS8Q==}
     engines: {node: '>=18'}
@@ -5581,14 +7449,21 @@ packages:
     resolution: {integrity: sha512-dJ6oBr5SQ1VSd9qkk7ByRgb/1SH4JZjCHSW/mr63/QcXO9zLVxvJ6Oy13nio03rxpSnVDDjFor75SjVeZWPW/A==}
     hasBin: true
 
-  error-ex@1.3.2:
-    resolution: {integrity: sha512-7dFHNmqeFSEt2ZBsCriorKnn3Z2pj+fd9kmI6QoWw4//DL+icEBfc0U7qJCisqrTsKTjw4fNFy2pW9OqStD84g==}
+  error-ex@1.3.4:
+    resolution: {integrity: sha512-sqQamAnR14VgCr1A618A3sGrygcpK+HEbenA/HiEAkkUwcZIIB/tgWqHFxWgOyDh4nB4JCRimh79dR5Ywc9MDQ==}
 
-  error-stack-parser-es@0.1.5:
-    resolution: {integrity: sha512-xHku1X40RO+fO8yJ8Wh2f2rZWVjqyhb1zgq1yZ8aZRQkv6OOKhKWRUaht3eSCUbAOBaKIgM+ykwFLE+QUxgGeg==}
+  error-stack-parser-es@1.0.5:
+    resolution: {integrity: sha512-5qucVt2XcuGMcEGgWI7i+yZpmpByQ8J1lHhcL7PwqCwu9FPP3VUXzT4ltHe5i2z9dePwEHcDVOAfSnHsOlCXRA==}
 
-  es-abstract@1.23.6:
-    resolution: {integrity: sha512-Ifco6n3yj2tMZDWNLyloZrytt9lqqlwvS83P3HtaETR0NUOYnIULGGHpktqYGObGy+8wc1okO25p8TjemhImvA==}
+  errx@0.1.2:
+    resolution: {integrity: sha512-chfpPHmCerdo/rXr/nNvPZRkV4WwDRwzwnsJ0Uzz3tVi8Z41tDctRjduYy1138ii77AFlts1qvWtX3g/Acg91Q==}
+
+  es-abstract-get@1.0.0:
+    resolution: {integrity: sha512-6PMWXpdhshVvFp+FoWYs1EvG1Nj0tvk0dZM+XcK0xMEM1czRVcP6ohqPWHy6qPagSpC8j4+p89WXlT+xXJs/fg==}
+    engines: {node: '>= 0.4'}
+
+  es-abstract@1.24.2:
+    resolution: {integrity: sha512-2FpH9Q5i2RRwyEP1AylXe6nYLR5OhaJTZwmlcP0dL/+JCbgg7yyEo/sEK6HeGZRf3dFpWwThaRHVApXSkW3xeg==}
     engines: {node: '>= 0.4'}
 
   es-define-property@1.0.1:
@@ -5599,25 +7474,34 @@ packages:
     resolution: {integrity: sha512-Zf5H2Kxt2xjTvbJvP2ZWLEICxA6j+hAmMzIlypy4xcBg1vKVnx89Wy0GbS+kf5cwCVFFzdCFh2XSCFNULS6csw==}
     engines: {node: '>= 0.4'}
 
-  es-module-lexer@1.5.4:
-    resolution: {integrity: sha512-MVNK56NiMrOwitFB7cqDwq0CQutbw+0BvLshJSse0MUNU+y1FC3bUS/AQg7oUng+/wKrrki7JfmwtVHkVfPLlw==}
+  es-module-lexer@1.7.0:
+    resolution: {integrity: sha512-jEQoCwk8hyb2AZziIOLhDqpm5+2ww5uIE6lkO/6jcOCusfk6LhMHpXXfBLXTZ7Ydyt0j4VoUQv6uGNYbdW+kBA==}
 
-  es-object-atoms@1.0.0:
-    resolution: {integrity: sha512-MZ4iQ6JwHOBQjahnjwaC1ZtIBH+2ohjamzAO3oaHcXYup7qxjF2fixyH+Q71voWHeOkI2q/TnJao/KfXYIZWbw==}
+  es-module-lexer@2.3.1:
+    resolution: {integrity: sha512-shc1dbU90Yl/xq1QrC7QRtfcwURZuVRfPhZbDoldJ1cn1gzDvBaBWlv0eFolj5+0znnPJz5TXLxsN77X/12KTA==}
+
+  es-object-atoms@1.1.2:
+    resolution: {integrity: sha512-HWcBoN6NileqtSydK2FqHbS/LoDd2pqrnQHLyJzBj4kOp/ky2MWMN694xOfkK8/SnUsW2DH7EfyVlydKCsm1Zw==}
     engines: {node: '>= 0.4'}
 
-  es-set-tostringtag@2.0.3:
-    resolution: {integrity: sha512-3T8uNMC3OQTHkFUsFq8r/BwAXLHvU/9O9mE0fBc/MY5iq/8H7ncvO947LmYA6ldWw9Uh8Yhf25zu6n7nML5QWQ==}
+  es-set-tostringtag@2.1.0:
+    resolution: {integrity: sha512-j6vWzfrGVfyXxge+O0x5sh6cvxAog0a/4Rdd2K36zCMV5eJ+/+tOAngRO8cODMNWbVRdVlmGZQL2YS3yR8bIUA==}
     engines: {node: '>= 0.4'}
 
-  es-to-primitive@1.3.0:
-    resolution: {integrity: sha512-w+5mJ3GuFL+NjVtJlvydShqE1eN3h3PbI7/5LAsYJP/2qtuMXjfL2LpHSRqo4b4eSF5K/DH1JXKUAHSB2UW50g==}
+  es-to-primitive@1.3.4:
+    resolution: {integrity: sha512-yPDz7wqpg1/mmHLmS3tcfTfbw5f1eryXvyghYBffGdERwe+mV7ZcWzTR8LR17Kvqt3qfPurjlonmnq3MKXIOXw==}
     engines: {node: '>= 0.4'}
 
+  es-toolkit@1.50.0:
+    resolution: {integrity: sha512-OyZKhUVvEep9ITEiwHn8GKnMRQIVqoSIX7WnRbkWgJkllCujilqP2rD0u979tkl8wqyc8ICwlc1UBVv/Sl1G6w==}
+
   es5-ext@0.10.64:
     resolution: {integrity: sha512-p2snDhiLaXe6dahss1LddxqEm+SkuDvV8dnIQG0MWjyHpcMNfXKPE+/Cc0y+PhxJX3A4xGNeFCj5oc0BUh6deg==}
     engines: {node: '>=0.10'}
 
+  es6-error@4.1.1:
+    resolution: {integrity: sha512-Um/+FxMr9CISWh0bi5Zv0iOD+4cFh5qLeks1qhAopKVAJw3drgKbKySikp7wGhDL0HPeaja0P5ULZrxLkniUVg==}
+
   es6-iterator@2.0.3:
     resolution: {integrity: sha512-zw4SRzoUkd+cl+ZoE15A9o1oQd920Bb0iOJMQkQhl3jNc03YqVjAhG7scf9C5KWRU/R13Orf588uCC6525o02g==}
 
@@ -5625,8 +7509,13 @@ packages:
     resolution: {integrity: sha512-U9bFFjX8tFiATgtkJ1zg25+KviIXpgRvRHS8sau3GfhVzThRQrOeksPeT0BWW2MNZs1OEWJ1DPXOQMn0KKRkvg==}
     engines: {node: '>=0.12'}
 
-  esbuild@0.24.0:
-    resolution: {integrity: sha512-FuLPevChGDshgSicjisSooU0cemp/sGXR841D5LHMB7mTVOmsEHcAxaH3irL53+8YDIeVNQEySh4DaYU/iuPqQ==}
+  esbuild@0.25.12:
+    resolution: {integrity: sha512-bbPBYYrtZbkt6Os6FiTLCTFxvq4tt3JKall1vRwshA3fdVztsLAatFaZobhkBC8/BrPetoa0oksYoKXoG4ryJg==}
+    engines: {node: '>=18'}
+    hasBin: true
+
+  esbuild@0.28.2:
+    resolution: {integrity: sha512-HKVLS8dvII+xoKW9kmqxbRKrnWEXfJJr/FZhhJmiqIB0e053QNYFqOBouTMO/k5sID4MvCiUCvv8b9M4h32wIA==}
     engines: {node: '>=18'}
     hasBin: true
 
@@ -5641,10 +7530,6 @@ packages:
   escape-html@1.0.3:
     resolution: {integrity: sha512-NiSupZ4OeuGwr68lGIeym/ksIZMJodUGOSCZ/FSnTxcrekbvqrgdUxlJOMpijaKZVjAJrWrGs/6Jy8OMuyj9ow==}
 
-  escape-string-regexp@1.0.5:
-    resolution: {integrity: sha512-vbRorB5FUQWvla16U8R/qgaFIya2qGzwDrNmCZuYKrbdSUMG6I1ZCGQRefkRVhuOkIGVne7BQ35DSfo1qvJqFg==}
-    engines: {node: '>=0.8.0'}
-
   escape-string-regexp@4.0.0:
     resolution: {integrity: sha512-TtpcNJ3XAzx3Gq8sWRzJaVajRs0uVxA2YAkdb1jm2YkPz4G6egUFAyA3n5vtEIZefPk5Wa4UXbKuS5fKkJWdgA==}
     engines: {node: '>=10'}
@@ -5664,34 +7549,35 @@ packages:
     peerDependencies:
       eslint: '>=6.0.0'
 
-  eslint-compat-utils@0.6.4:
-    resolution: {integrity: sha512-/u+GQt8NMfXO8w17QendT4gvO5acfxQsAKirAt0LVxDnr2N8YLCVbregaNc/Yhp7NM128DwCaRvr8PLDfeNkQw==}
-    engines: {node: '>=12'}
-    peerDependencies:
-      eslint: '>=6.0.0'
-
-  eslint-config-turbo@2.3.3:
-    resolution: {integrity: sha512-cM9wSBYowQIrjx2MPCzFE6jTnG4vpTPJKZ/O+Ps3CqrmGK/wtNOsY6WHGMwLtKY/nNbgRahAJH6jGVF6k2coOg==}
-    peerDependencies:
-      eslint: '>6.6.0'
-
-  eslint-import-resolver-node@0.3.9:
-    resolution: {integrity: sha512-WFj2isz22JahUv+B788TlO3N6zL3nNJGU8CcZbPZvVEkBPaJdCV4vy5wyghty5ROFbCRnm132v8BScu5/1BQ8g==}
-
-  eslint-json-compat-utils@0.2.1:
-    resolution: {integrity: sha512-YzEodbDyW8DX8bImKhAcCeu/L31Dd/70Bidx2Qex9OFUtgzXLqtfWL4Hr5fM/aCCB8QUZLuJur0S9k6UfgFkfg==}
+  eslint-json-compat-utils@0.2.3:
+    resolution: {integrity: sha512-RbBmDFyu7FqnjE8F0ZxPNzx5UaptdeS9Uu50r7A+D7s/+FCX+ybiyViYEgFUaFIFqSWJgZRTpL5d8Kanxxl2lQ==}
     engines: {node: '>=12'}
     peerDependencies:
       '@eslint/json': '*'
       eslint: '*'
-      jsonc-eslint-parser: ^2.4.0
+      jsonc-eslint-parser: ^2.4.0 || ^3.0.0
     peerDependenciesMeta:
       '@eslint/json':
         optional: true
 
-  eslint-plugin-command@0.2.7:
-    resolution: {integrity: sha512-UXJ/1R6kdKDcHhiRqxHJ9RZ3juMR1IWQuSrnwt56qCjxt/am+5+YDt6GKs1FJPnppe6/geEYsO3CR9jc63i0xw==}
+  eslint-plugin-better-tailwindcss@4.7.0:
+    resolution: {integrity: sha512-lrdlVW4pzLPj/zX5HRqMhKPesGijDfRhnSRJMlNcsrCyJHsndmHCLKTiRNa1eREUZ6G3D3QjdLc+G4tlfGrmkw==}
+    engines: {node: ^20.19.0 || ^22.12.0 || >=23.0.0}
     peerDependencies:
+      eslint: ^7.0.0 || ^8.0.0 || ^9.0.0 || ^10.0.0
+      oxlint: ^1.35.0
+      tailwindcss: ^3.3.0 || ^4.1.17
+    peerDependenciesMeta:
+      eslint:
+        optional: true
+      oxlint:
+        optional: true
+
+  eslint-plugin-command@3.5.3:
+    resolution: {integrity: sha512-JIhmUOW2K2Dw1K+p4mtj5potkqTZ4ZaicrTkgCygPZCWErP2+O2F46n7ZwGKapeEjiwcVqoY8u01SxNUUXWPeQ==}
+    peerDependencies:
+      '@typescript-eslint/typescript-estree': '*'
+      '@typescript-eslint/utils': '*'
       eslint: '*'
 
   eslint-plugin-es-x@7.8.0:
@@ -5700,137 +7586,80 @@ packages:
     peerDependencies:
       eslint: '>=8'
 
-  eslint-plugin-eslint-comments@3.2.0:
-    resolution: {integrity: sha512-0jkOl0hfojIHHmEHgmNdqv4fmh7300NdpA9FFpF7zaoLvB/QeXOGNLIo86oAveJFrfB1p05kC8hpEMHM8DwWVQ==}
-    engines: {node: '>=6.5.0'}
+  eslint-plugin-jsonc@3.4.1:
+    resolution: {integrity: sha512-HHWkjAmVJ3QAffCkfo0XKl3CstLtgbIu5EGfFfVDLQT6vqPrxl4pFbUwFwY03nOlvyuDiiBixhHFrlbzn9u09Q==}
+    engines: {node: ^20.19.0 || ^22.13.0 || >=24}
     peerDependencies:
-      eslint: '>=4.19.1'
+      eslint: '>=9.38.0'
 
-  eslint-plugin-import-x@4.6.1:
-    resolution: {integrity: sha512-wluSUifMIb7UfwWXqx7Yx0lE/SGCcGXECLx/9bCmbY2nneLwvAZ4vkd1IXDjPKFvdcdUgr1BaRnaRpx3k2+Pfw==}
-    engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
+  eslint-plugin-n@18.3.0:
+    resolution: {integrity: sha512-cPVguuDe6DrIPb/qUXHf8P89MaVTUmiYWwpt5gX5AILsvRIiZAxMFXcFR6QHYBksqKJpjfUBlL/RleCJUWcD7w==}
+    engines: {node: ^20.19.0 || ^22.13.0 || >=24}
     peerDependencies:
-      eslint: ^8.57.0 || ^9.0.0
-
-  eslint-plugin-jsdoc@50.6.1:
-    resolution: {integrity: sha512-UWyaYi6iURdSfdVVqvfOs2vdCVz0J40O/z/HTsv2sFjdjmdlUI/qlKLOTmwbPQ2tAfQnE5F9vqx+B+poF71DBQ==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      eslint: ^7.0.0 || ^8.0.0 || ^9.0.0
-
-  eslint-plugin-jsonc@2.18.2:
-    resolution: {integrity: sha512-SDhJiSsWt3nItl/UuIv+ti4g3m4gpGkmnUJS9UWR3TrpyNsIcnJoBRD7Kof6cM4Rk3L0wrmY5Tm3z7ZPjR2uGg==}
-    engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
-    peerDependencies:
-      eslint: '>=6.0.0'
-
-  eslint-plugin-n@17.15.1:
-    resolution: {integrity: sha512-KFw7x02hZZkBdbZEFQduRGH4VkIH4MW97ClsbAM4Y4E6KguBJWGfWG1P4HEIpZk2bkoWf0bojpnjNAhYQP8beA==}
-    engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
-    peerDependencies:
-      eslint: '>=8.23.0'
-
-  eslint-plugin-no-only-tests@3.3.0:
-    resolution: {integrity: sha512-brcKcxGnISN2CcVhXJ/kEQlNa0MEfGRtwKtWA16SkqXHKitaKIMrfemJKLKX1YqDU5C/5JY3PvZXd5jEW04e0Q==}
-    engines: {node: '>=5.0.0'}
-
-  eslint-plugin-perfectionist@3.9.1:
-    resolution: {integrity: sha512-9WRzf6XaAxF4Oi5t/3TqKP5zUjERhasHmLFHin2Yw6ZAp/EP/EVA2dr3BhQrrHWCm5SzTMZf0FcjDnBkO2xFkA==}
-    engines: {node: ^18.0.0 || >=20.0.0}
-    peerDependencies:
-      astro-eslint-parser: ^1.0.2
-      eslint: '>=8.0.0'
-      svelte: '>=3.0.0'
-      svelte-eslint-parser: ^0.41.1
-      vue-eslint-parser: '>=9.0.0'
+      eslint: '>=8.57.1'
+      ts-declaration-location: ^1.0.6
+      typescript: '>=5.0.0'
     peerDependenciesMeta:
-      astro-eslint-parser:
+      ts-declaration-location:
         optional: true
-      svelte:
-        optional: true
-      svelte-eslint-parser:
-        optional: true
-      vue-eslint-parser:
+      typescript:
         optional: true
 
-  eslint-plugin-prettier@5.2.1:
-    resolution: {integrity: sha512-gH3iR3g4JfF+yYPaJYkN7jEl9QbweL/YfkoRlNnuIEHEz1vHVlCmWOS+eGGiRuzHQXdJFCOTxRgvju9b8VUmrw==}
-    engines: {node: ^14.18.0 || >=16.0.0}
+  eslint-plugin-perfectionist@5.10.1:
+    resolution: {integrity: sha512-Kprsp9Us0GqAesYaAIzUViw57xYp5WBqzXrcE0Mtww++E5fexWXYBipMuuD7yvyH4vvpBH0+oJ+OMAmZ0oYXkw==}
+    engines: {node: ^20.0.0 || >=22.0.0}
     peerDependencies:
-      '@types/eslint': '>=8.0.0'
-      eslint: '>=8.0.0'
-      eslint-config-prettier: '*'
-      prettier: '>=3.0.0'
-    peerDependenciesMeta:
-      '@types/eslint':
-        optional: true
-      eslint-config-prettier:
-        optional: true
+      eslint: ^8.45.0 || ^9.0.0 || ^10.0.0
 
-  eslint-plugin-regexp@2.7.0:
-    resolution: {integrity: sha512-U8oZI77SBtH8U3ulZ05iu0qEzIizyEDXd+BWHvyVxTOjGwcDcvy/kEpgFG4DYca2ByRLiVPFZ2GeH7j1pdvZTA==}
-    engines: {node: ^18 || >=20}
+  eslint-plugin-pnpm@1.7.0:
+    resolution: {integrity: sha512-SZaPARN1+NMqAjQOlQjHu59SnN/o299N5Z4HTyhwWYnfkQkjdiydayHBegwXER3VecRF/Rf7eHw3sGcTF+uLOQ==}
     peerDependencies:
-      eslint: '>=8.44.0'
+      eslint: ^9.0.0 || ^10.0.0
 
-  eslint-plugin-turbo@2.3.3:
-    resolution: {integrity: sha512-j8UEA0Z+NNCsjZep9G5u5soDQHcXq/x4amrwulk6eHF1U91H2qAjp5I4jQcvJewmccCJbVp734PkHHTRnosjpg==}
-    peerDependencies:
-      eslint: '>6.6.0'
-
-  eslint-plugin-unicorn@56.0.1:
-    resolution: {integrity: sha512-FwVV0Uwf8XPfVnKSGpMg7NtlZh0G0gBarCaFcMUOoqPxXryxdYxTRRv4kH6B9TFCVIrjRXG+emcxIk2ayZilog==}
-    engines: {node: '>=18.18'}
-    peerDependencies:
-      eslint: '>=8.56.0'
-
-  eslint-plugin-unused-imports@4.1.4:
-    resolution: {integrity: sha512-YptD6IzQjDardkl0POxnnRBhU1OEePMV0nd6siHaRBbd+lyh6NAhFEobiznKU7kTsSsDeSD62Pe7kAM1b7dAZQ==}
+  eslint-plugin-unused-imports@4.4.1:
+    resolution: {integrity: sha512-oZGYUz1X3sRMGUB+0cZyK2VcvRX5lm/vB56PgNNcU+7ficUCKm66oZWKUubXWnOuPjQ8PvmXtCViXBMONPe7tQ==}
     peerDependencies:
       '@typescript-eslint/eslint-plugin': ^8.0.0-0 || ^7.0.0 || ^6.0.0 || ^5.0.0
-      eslint: ^9.0.0 || ^8.0.0
+      eslint: ^10.0.0 || ^9.0.0 || ^8.0.0
     peerDependenciesMeta:
       '@typescript-eslint/eslint-plugin':
         optional: true
 
-  eslint-plugin-vitest@0.5.4:
-    resolution: {integrity: sha512-um+odCkccAHU53WdKAw39MY61+1x990uXjSPguUCq3VcEHdqJrOb8OTMrbYlY6f9jAKx7x98kLVlIe3RJeJqoQ==}
-    engines: {node: ^18.0.0 || >= 20.0.0}
-    peerDependencies:
-      '@typescript-eslint/eslint-plugin': '*'
-      eslint: ^8.57.0 || ^9.0.0
-      vitest: '*'
-    peerDependenciesMeta:
-      '@typescript-eslint/eslint-plugin':
-        optional: true
-      vitest:
-        optional: true
-
-  eslint-plugin-vue@9.32.0:
-    resolution: {integrity: sha512-b/Y05HYmnB/32wqVcjxjHZzNpwxj1onBOvqW89W+V+XNG1dRuaFbNd3vT9CLbr2LXjEoq+3vn8DanWf7XU22Ug==}
-    engines: {node: ^14.17.0 || >=16.0.0}
-    peerDependencies:
-      eslint: ^6.2.0 || ^7.0.0 || ^8.0.0 || ^9.0.0
-
-  eslint-scope@7.2.2:
-    resolution: {integrity: sha512-dOt21O7lTMhDM+X9mB4GX+DZrZtCUJPL/wlcTqxyrx5IvO0IYtILdtrQGQp+8n5S0gwSVmOf9NQrjMOgfQZlIg==}
-    engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
-
-  eslint-scope@8.2.0:
-    resolution: {integrity: sha512-PHlWUfG6lvPc3yvP5A4PNyBL1W8fkDUccmI21JUu/+GKZBoH/W5u6usENXUrWFRsyoW5ACUjFGgAFQp5gUlb/A==}
+  eslint-plugin-vue@10.10.0:
+    resolution: {integrity: sha512-dL9x9rBHqqNcByWiLOHK6L0SB97V82/NC0cZRn9cXPjM7pCuWlpQQP9bFH4vjBv80ej1ZpzAkuD8zWH1o9bZbA==}
     engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
+    peerDependencies:
+      '@stylistic/eslint-plugin': ^2.0.0 || ^3.0.0 || ^4.0.0 || ^5.0.0
+      '@typescript-eslint/parser': ^7.0.0 || ^8.0.0
+      eslint: ^8.57.0 || ^9.0.0 || ^10.0.0
+      vue-eslint-parser: ^10.3.0
+    peerDependenciesMeta:
+      '@stylistic/eslint-plugin':
+        optional: true
+      '@typescript-eslint/parser':
+        optional: true
+
+  eslint-plugin-yml@3.8.1:
+    resolution: {integrity: sha512-E/70psRwxz5EJ8dBtzrFfqSiiInuSytbdtFCjueb/GcKjsWzPBfxfhtQePImMAPjHwMA/VDurO7DJwStDJ4wWg==}
+    engines: {node: ^20.19.0 || ^22.13.0 || >=24.0.0}
+    peerDependencies:
+      eslint: '>=9.38.0'
+
+  eslint-scope@9.1.2:
+    resolution: {integrity: sha512-xS90H51cKw0jltxmvmHy2Iai1LIqrfbw57b79w/J7MfvDfkIkFZ+kj6zC3BjtUwh150HsSSdxXZcsuv72miDFQ==}
+    engines: {node: ^20.19.0 || ^22.13.0 || >=24}
 
   eslint-visitor-keys@3.4.3:
     resolution: {integrity: sha512-wpc+LXeiyiisxPlEkUzU6svyS1frIO3Mgxj1fdy7Pm8Ygzguax2N3Fa/D/ag1WqbOprdI+uY6wMUl8/a2G+iag==}
     engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
 
-  eslint-visitor-keys@4.2.0:
-    resolution: {integrity: sha512-UyLnSehNt62FFhSwjZlHmeokpRK59rcz29j+F1/aDgbkbRTk7wIc9XzdoasMUbRNKDM0qQt/+BJ4BrpFeABemw==}
-    engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
+  eslint-visitor-keys@5.0.1:
+    resolution: {integrity: sha512-tD40eHxA35h0PEIZNeIjkHoDR4YjjJp34biM0mDvplBe//mB+IHCqHDGV7pxF+7MklTvighcCPPZC7ynWyjdTA==}
+    engines: {node: ^20.19.0 || ^22.13.0 || >=24}
 
-  eslint@9.17.0:
-    resolution: {integrity: sha512-evtlNcpJg+cZLcnVKwsai8fExnqjGPicK7gnUtlNuzu+Fv9bI0aLpND5T44VLQtoMEnI57LoXO9XAkIXwohKrA==}
-    engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
+  eslint@10.8.1:
+    resolution: {integrity: sha512-wqA7W2jbsC/BnV9Iv1UZpKVFkO1AdNoSmYW8NWG4HNOBbkAMvIqDZ27pI2f07dqn583NcIC44ckjAcOXDL1QbQ==}
+    engines: {node: ^20.19.0 || ^22.13.0 || >=24}
     hasBin: true
     peerDependencies:
       jiti: '*'
@@ -5842,9 +7671,9 @@ packages:
     resolution: {integrity: sha512-kTUIGKQ/mDPFoJ0oVfcmyJn4iBDRptjNVIzwIFR7tqWXdVI9xfA2RMwY/gbSpJG3lkdWNEjLap/NqVHZiJsdfg==}
     engines: {node: '>=0.10'}
 
-  espree@10.3.0:
-    resolution: {integrity: sha512-0QYC8b24HWY8zjRnDTL6RiHfDbAWn63qb4LMj1Z4b076A4une81+z03Kg7l7mn/48PUTqoLptSXez8oknU8Clg==}
-    engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
+  espree@11.2.0:
+    resolution: {integrity: sha512-7p3DrVEIopW1B1avAGLuCSh1jubc01H2JHc8B4qqGblmg5gI9yumBgACjWo4JlIc04ufug4xJ3SQI8HkS/Rgzw==}
+    engines: {node: ^20.19.0 || ^22.13.0 || >=24}
 
   espree@9.6.1:
     resolution: {integrity: sha512-oruZaFkjorTpF32kDSI5/75ViwGeZginGGy2NoOSg3Q9bnwlnmDm4HLnkl0RE3n+njDXR037aY1+x58Z/zFdwQ==}
@@ -5855,8 +7684,8 @@ packages:
     engines: {node: '>=4'}
     hasBin: true
 
-  esquery@1.6.0:
-    resolution: {integrity: sha512-ca9pw9fomFcKPvFLXhBKUK90ZvGibiGOvRJNbjljY7s7uq/5YO4BOzcYtJqExdx99rF6aAcnRxHmcUHcz6sQsg==}
+  esquery@1.7.0:
+    resolution: {integrity: sha512-Ap6G0WQwcU/LHsvLwON1fAQX9Zp0A2Y6Y/cJBl9r/JbW90Zyg4/zbG6zzKa2OTALELarYHmKu0GhpM5EO+7T0g==}
     engines: {node: '>=0.10'}
 
   esrecurse@4.3.0:
@@ -5867,9 +7696,6 @@ packages:
     resolution: {integrity: sha512-MMdARuVEQziNTeJD8DgMqmhwR11BRQ/cBP+pLtYdSTnf3MIO8fFeiINEbX36ZdNlfU/7A9f3gUw49B3oQsvwBA==}
     engines: {node: '>=4.0'}
 
-  estree-walker@1.0.1:
-    resolution: {integrity: sha512-1fMXF3YP4pZZVozF8j/ZLfvnR8NSIljt56UhbZ5PeeDmmGHpgpdwQt7ITlGvYaQukCvuBRMLEiKiYC+oeIg4cg==}
-
   estree-walker@2.0.2:
     resolution: {integrity: sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w==}
 
@@ -5880,6 +7706,10 @@ packages:
     resolution: {integrity: sha512-kVscqXk4OCp68SZ0dkgEKVi6/8ij300KBWTJq32P/dYeWTSwK41WyTxalN1eRmA5Z9UU/LX9D7FWSmV9SAYx6g==}
     engines: {node: '>=0.10.0'}
 
+  eta@4.6.0:
+    resolution: {integrity: sha512-lW6is4T1NFOYnmqGZIfvixqj7A7sSvScF+DN8EK6K58xI5MZ5UvYe0GjopxOXQtZvUn4eDdVuZ8XSoYWTMEKwA==}
+    engines: {node: '>=20'}
+
   etag@1.8.1:
     resolution: {integrity: sha512-aIL5Fx7mawVa300al2BnEE4iNvo1qETxLrPI/o05L7z6go7fCw1J6EQmbK4FmJ2AS7kgVF/KEZWufBfdClMcPg==}
     engines: {node: '>= 0.6'}
@@ -5891,14 +7721,14 @@ packages:
     resolution: {integrity: sha512-i/2XbnSz/uxRCU6+NdVJgKWDTM427+MqYbkQzD321DuCQJUqOuJKIA0IM2+W2xtYHdKOmZ4dR6fExsd4SXL+WQ==}
     engines: {node: '>=6'}
 
-  eventemitter3@2.0.3:
-    resolution: {integrity: sha512-jLN68Dx5kyFHaePoXWPsCGW5qdyZQtLYHkxkg02/Mz6g0kYpDx4FyP6XfArhQdlOC4b8Mv+EMxPo/8La7Tzghg==}
-
   eventemitter3@4.0.7:
     resolution: {integrity: sha512-8guHBZCwKnFhYdHr2ysuRWErTwhoN2X8XELRlrRwpmfeY2jjuUN4taQMsULKUVo1K4DvZl+0pgfyoysHxvmvEw==}
 
-  eventemitter3@5.0.1:
-    resolution: {integrity: sha512-GWkBvjiSZK87ELrYOSESUYeVIc9mvLLf/nXalMOS5dYrgZq9o5OVkbZAVM06CVxYsCwH9BDZFPlQTlPA1j4ahA==}
+  eventemitter3@5.0.4:
+    resolution: {integrity: sha512-mlsTRyGaPBjPedk6Bvw+aqbsXDtoAyAzm5MO7JgU+yVRyMQ5O8bD4Kcci7BS85f93veegeCPkL8R4GLClnjLFw==}
+
+  events-universal@1.0.1:
+    resolution: {integrity: sha512-LUd5euvbMLpwOF8m6ivPCbhQeSiYVNb8Vs0fQ8QjXo0JTkEHpz8pxdQf0gStltaPpw0Cca8b39KxvK9cfKRiAw==}
 
   events@3.3.0:
     resolution: {integrity: sha512-mQw+2fkQbALzQ7V0MY0IqdnXNOeTtP4r0lN9z7AAawCXgqea7bDii20AYrIBrFd/Hx0M2Ocz6S111CaFkUcb0Q==}
@@ -5908,35 +7738,26 @@ packages:
     resolution: {integrity: sha512-XctvKaEMaj1Ii9oDOqbW/6e1gXknSY4g/aLCDicOXqBE4M0nRWkUu0PTp++UPNzoFY12BNHMfs/VadKIS6llvg==}
     engines: {node: '>=8.3.0'}
 
-  execa@8.0.1:
-    resolution: {integrity: sha512-VyhnebXciFV2DESc+p6B+y0LjSm0krU4OgJN44qFAhBY0TJ+1V61tYD2+wHusZ6F9n5K+vl8k0sTy7PEfV4qpg==}
-    engines: {node: '>=16.17'}
+  execa@10.0.1:
+    resolution: {integrity: sha512-ge98qjkRK4IB7tL7Ju/6qmm5LHoH1eEMt5FNZrz3f4UIYhF28lggX20z3FaX1sgc67msLEn0N0BscOs29iuwyw==}
+    engines: {node: '>=22'}
 
-  execa@9.5.2:
-    resolution: {integrity: sha512-EHlpxMCpHWSAh1dgS6bVeoLAXGnJNdR93aabr4QCGbzOM73o5XmRfM/e5FUqsw3aagP8S8XEWUWFAxnRBnAF0Q==}
-    engines: {node: ^18.19.0 || >=20.5.0}
-
-  expand-tilde@2.0.2:
-    resolution: {integrity: sha512-A5EmesHW6rfnZ9ysHQjPdJRni0SRar0tjtG5MNtm9n5TUvsYU8oozprtRD4AqHxcZWWlVuAmQo2nWKfN9oyjTw==}
-    engines: {node: '>=0.10.0'}
-
-  expect-type@1.1.0:
-    resolution: {integrity: sha512-bFi65yM+xZgk+u/KRIpekdSYkTB5W1pEf0Lt8Q8Msh7b+eQ7LXVtIB1Bkm4fvclDEL1b2CZkMhv2mOeF8tMdkA==}
+  expect-type@1.4.0:
+    resolution: {integrity: sha512-KfYbmpRm0VbLjEvVa9yGwCi9GI34xvi7A/HXYWQO65CSD2u3MczUJSuwXKFIxlGsgBQizV9q5J9NHj4VG0n+pA==}
     engines: {node: '>=12.0.0'}
 
+  exponential-backoff@3.1.3:
+    resolution: {integrity: sha512-ZgEeZXj30q+I0EN+CbSSpIyPaJ5HVQD18Z1m+u1FXbAeT94mr1zw50q4q6jiiC447Nl/YTcIYSAftiGqetwXCA==}
+
+  exsolve@1.1.1:
+    resolution: {integrity: sha512-9U/jZUgjnSGyntRr6y5Muu1MJcwFl6kPu7k8qLF0IMNfLqvw0NZ4nnVDq0RVoZ0RvCyumib4Ez3KYrVfilrw+g==}
+
   ext@1.7.0:
     resolution: {integrity: sha512-6hxeJYaL110a9b5TEJSj0gojyHQAmA2ch5Os+ySCiA1QGdS697XWY1pzsrSjqA9LDEEgdB/KypIlR59RcLuHYw==}
 
-  extend@3.0.2:
-    resolution: {integrity: sha512-fjquC59cD7CyW6urNXK0FBufkZcoiGG80wTuPujX590cB5Ttln20E2UB4S/WARVqhXffZl2LNgS+gQdPIIim/g==}
-
   extendable-error@0.1.7:
     resolution: {integrity: sha512-UOiS2in6/Q0FK0R0q6UY9vYpQ21mr/Qn1KOnte7vsACuNJf514WvCCUHSRCPcgjPT2bAhNIJdlE6bVap1GKmeg==}
 
-  external-editor@3.1.0:
-    resolution: {integrity: sha512-hMQ4CX1p1izmuLYyZqLMO/qGNw10wSv9QDCPfzXfyFrOaCSSoRfqE1Kf1s5an66J5JZC62NewG+mK49jOCtQew==}
-    engines: {node: '>=4'}
-
   fast-csv@4.3.6:
     resolution: {integrity: sha512-2RNSpuwwsJGP0frGsOmTb9oUF+VkFSM4SyLTDgwf2ciHWTarN0lQTC+F2f/t5J9QjW+c65VFIAAu85GsvMIusw==}
     engines: {node: '>=10.0.0'}
@@ -5944,24 +7765,18 @@ packages:
   fast-deep-equal@3.1.3:
     resolution: {integrity: sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==}
 
-  fast-diff@1.1.2:
-    resolution: {integrity: sha512-KaJUt+M9t1qaIteSvjc6P3RbMdXsNhK61GRftR6SNxqmhthcd9MGIi4T+o0jD8LUSpSnSKXE20nLtJ3fOHxQig==}
-
-  fast-diff@1.2.0:
-    resolution: {integrity: sha512-xJuoT5+L99XlZ8twedaRf6Ax2TgQVxvgZOYoPKqZufmJib0tL2tegPBOZb1pVNgIhlqDlA0eO0c3wBvQcmzx4w==}
-
   fast-diff@1.3.0:
     resolution: {integrity: sha512-VxPP4NqbUjj6MaAOafWeUn2cXWLcCtljklUtZf0Ind4XQ+QPtmA0b18zZy0jIQx+ExRVCR/ZQpBmik5lXshNsw==}
 
-  fast-equals@5.0.1:
-    resolution: {integrity: sha512-WF1Wi8PwwSY7/6Kx0vKXtw8RwuSGoM1bvDaJbu7MxDlR1vovZjIAKrnzyrThgAjm6JDTu0fVgWXDlMGspodfoQ==}
+  fast-equals@6.0.2:
+    resolution: {integrity: sha512-sAjhj9ZhOxYCGiNMnZLaucOqf5ZeFnHNoKoAZiD9thhJ0N8RP85qJK759/97C/3L7NzzmGVB5uiX9AUpySZmUQ==}
     engines: {node: '>=6.0.0'}
 
   fast-fifo@1.3.2:
     resolution: {integrity: sha512-/d9sfos4yxzpwkDkuN7k2SqFKtYNmCTzgfEpz82x34IM9/zc8KGxQoXg1liNC/izpRM/MBdt44Nmx41ZWqk+FQ==}
 
-  fast-glob@3.3.2:
-    resolution: {integrity: sha512-oX2ruAFQwf/Orj8m737Y5adxDQO0LAB7/S5MnxCdTNDd4p6BsyIVsv9JQsATbTSq8KHRpLwIHbVlUNatxd+1Ow==}
+  fast-glob@3.3.3:
+    resolution: {integrity: sha512-7MptL8U0cqcFdzIzwOTHoilX9x5BrNqye7Z/LuC7kCMRio1EMSyqRK3BEAUD7sXRq4iT4AzTVuZdhgQ2TCvYLg==}
     engines: {node: '>=8.6.0'}
 
   fast-json-stable-stringify@2.1.0:
@@ -5970,54 +7785,61 @@ packages:
   fast-levenshtein@2.0.6:
     resolution: {integrity: sha512-DCXu6Ifhqcks7TZKY3Hxp3y6qphY5SJZmrWMDrKcERSOXWQdMhU9Ig/PYrzyw/ul9jOIyh0N4M0tbC5hodg8dw==}
 
-  fast-string-compare@3.0.0:
-    resolution: {integrity: sha512-PY66/8HelapGo5nqMN17ZTKqJj1nppuS1OoC9Y0aI2jsUDlZDEYhMODTpb68wVCq+xMbaEbPGXRd7qutHzkRXA==}
-    engines: {node: ^14.13.1 || >=16.0.0}
+  fast-string-truncated-width@3.0.3:
+    resolution: {integrity: sha512-0jjjIEL6+0jag3l2XWWizO64/aZVtpiGE3t0Zgqxv0DPuxiMjvB3M24fCyhZUO4KomJQPj3LTSUnDP3GpdwC0g==}
 
-  fast-uri@3.0.3:
-    resolution: {integrity: sha512-aLrHthzCjH5He4Z2H9YZ+v6Ujb9ocRuW6ZzkJQOrTxleEijANq4v1TsaPaVG1PZcuurEzrLcWRyYBYXD5cEiaw==}
+  fast-string-width@3.0.2:
+    resolution: {integrity: sha512-gX8LrtNEI5hq8DVUfRQMbr5lpaS4nMIWV+7XEbXk2b8kiQIizgnlr12B4dA3ZEx3308ze0O4Q1R+cHts8kyUJg==}
+
+  fast-uri@3.1.5:
+    resolution: {integrity: sha512-gHwA1O9LDIcKunMKhObS/HimwtehO1nPUECKAu5TpKgaO19fcWEl4bliWe1jWxVFvIXztJjjQ4L8XQ1EU9f7Jw==}
+
+  fast-wrap-ansi@0.2.2:
+    resolution: {integrity: sha512-7F2Fl+TjRSenLqlU3UjSH0iyqopqoZIu7eZVpEirP2g1GtWa2G/ecEmBdgz31+Mxr+ELclgg6sokpSFIQiZ02Q==}
 
   fastest-levenshtein@1.0.16:
     resolution: {integrity: sha512-eRnCtTTtGZFpQCwhJiUOuxPQWRXVKYDn0b2PeHfXL6/Zi53SLAzAHfVhVWK2AryC/WH05kGfxhFIPvTF0SXQzg==}
     engines: {node: '>= 4.9.1'}
 
-  fastq@1.17.1:
-    resolution: {integrity: sha512-sRVD3lWVIXWg6By68ZN7vho9a1pQcN/WBFaAAsDDFzlJjvoGx0P8z7V1t72grFJfJhu3YPZBuu25f7Kaw2jN1w==}
+  fastq@1.20.1:
+    resolution: {integrity: sha512-GGToxJ/w1x32s/D2EKND7kTil4n8OVk/9mycTc4VDza13lOvpUZTGX3mFSCtV9ksdGBVzvsyAVLM6mHFThxXxw==}
 
-  fdir@6.4.2:
-    resolution: {integrity: sha512-KnhMXsKSPZlAhp7+IjUkRZKPb4fUyccpDrdFXbi4QL1qkmFh9kVY09Yox+n4MaOb3lHZ1Tv829C3oaaXoMYPDQ==}
+  fd-package-json@2.0.0:
+    resolution: {integrity: sha512-jKmm9YtsNXN789RS/0mSzOC1NUq9mkVd65vbSSVsKdjGvYXBuE4oWe2QOEoFeRmJg+lPuZxpmrfFclNhoRMneQ==}
+
+  fdir@6.5.0:
+    resolution: {integrity: sha512-tIbYtZbucOs0BRGqPJkshJUYdL+SDH7dVM8gjy+ERp3WAUjLEFJE+02kanyHtwjWOnwrKYBiwAmM0p4kLJAnXg==}
+    engines: {node: '>=12.0.0'}
     peerDependencies:
       picomatch: ^3 || ^4
     peerDependenciesMeta:
       picomatch:
         optional: true
 
+  fflate@0.8.3:
+    resolution: {integrity: sha512-tbZNuJrLwGUp3zshBtdy4W+ORxZuIh8a5ilyIEQDC5rY1f3U20JMry0Ll3WBzU58EZKsEuJFXhb5gwv8CsPvgA==}
+
   figures@6.1.0:
     resolution: {integrity: sha512-d+l3qxjSesT4V7v2fh+QnmFnUWv9lSpjarhShNTgBOfA0ttejbQUAlHLitbjkoRiDulW0OPoQPYIGhIC8ohejg==}
     engines: {node: '>=18'}
 
+  file-entry-cache@11.1.5:
+    resolution: {integrity: sha512-+PFTHITI08JIGhnNpGNI8T8inUpgZfk3GNEqfT9R2zZV2iFXg3CvqzSl/uEhs7TSGujYRELEANyDvS8Fj7+S7Q==}
+
   file-entry-cache@8.0.0:
     resolution: {integrity: sha512-XXTUwCvisa5oacNGRP9SfNtYBNAMi+RPwBFmblZEF7N7swHYQS6/Zfk7SRwx4D5j3CH211YNRco1DEMNVfZCnQ==}
     engines: {node: '>=16.0.0'}
 
-  file-entry-cache@9.1.0:
-    resolution: {integrity: sha512-/pqPFG+FdxWQj+/WSuzXSDaNzxgTLr/OrR1QuqfEZzDakpdYE70PwUxL7BPUa8hpjbvY1+qvCl8k+8Tq34xJgg==}
-    engines: {node: '>=18'}
-
   file-uri-to-path@1.0.0:
     resolution: {integrity: sha512-0Zt+s3L7Vf1biwWZ29aARiVYLx7iMGnEUl9x33fbB/j3jR81u/O2LbqK+Bm1CDSNDKVtJ/YjwY7TUd5SkeLQLw==}
 
-  filelist@1.0.4:
-    resolution: {integrity: sha512-w1cEuf3S+DrLCQL7ET6kz+gmlJdbq9J7yXCSjK/OZCPA+qEN1WyF4ZAf0YYJa4/shHJra2t/d/r8SV4Ji+x+8Q==}
+  filelist@1.0.6:
+    resolution: {integrity: sha512-5giy2PkLYY1cP39p17Ech+2xlpTRL9HLspOfEgm0L6CwBXBTgsK5ou0JtzYuepxkaQ/tvhCFIJ5uXo0OrM2DxA==}
 
   fill-range@7.1.1:
     resolution: {integrity: sha512-YsGpe3WHLK8ZYi4tWDg2Jy3ebRz2rXowDxnld4bkQB00cc/1Zw9AWnC0i9ztDJitivtQvaI9KaLyKrc+hBW0yg==}
     engines: {node: '>=8'}
 
-  find-up-simple@1.0.0:
-    resolution: {integrity: sha512-q7Us7kcjj2VMePAa02hDAF6d+MzsdsAWEwYyOpwUtlerRBkOEPBCRZrAV4XfcSN8fHAgaD0hP7miwoay6DCprw==}
-    engines: {node: '>=18'}
-
   find-up@4.1.0:
     resolution: {integrity: sha512-PpOwAdQ/YlXQ2vj8a3h8IipDuYRi3wceVQQGYWxNINccq40Anw7BlsEXCMbt1Zt+OLA6Fq9suIpIWD0OsnISlw==}
     engines: {node: '>=8'}
@@ -6026,30 +7848,25 @@ packages:
     resolution: {integrity: sha512-78/PXT1wlLLDgTzDs7sjq9hzz0vXD+zn+7wypEe4fXQxCmdmqfGsEPQxmiCSQI3ajFV91bVSsvNtrJRiW6nGng==}
     engines: {node: '>=10'}
 
-  find-up@7.0.0:
-    resolution: {integrity: sha512-YyZM99iHrqLKjmt4LJDj58KI+fYyufRLBSYcqycxf//KpBk9FoewoGX0450m9nB44qrZnovzC2oeP5hUibxc/g==}
-    engines: {node: '>=18'}
+  find-up@8.0.0:
+    resolution: {integrity: sha512-JGG8pvDi2C+JxidYdIwQDyS/CgcrIdh18cvgxcBge3wSHRQOrooMD3GlFBcmMJAN9M42SAZjDp5zv1dglJjwww==}
+    engines: {node: '>=20'}
 
-  findup-sync@5.0.0:
-    resolution: {integrity: sha512-MzwXju70AuyflbgeOhzvQWAvvQdo1XL0A9bVvlXsYcFEBM87WR4OakL4OfZq+QRmr+duJubio+UtNQCPsVESzQ==}
-    engines: {node: '>= 10.13.0'}
+  fix-dts-default-cjs-exports@1.0.1:
+    resolution: {integrity: sha512-pVIECanWFC61Hzl2+oOCtoJ3F17kglZC/6N94eRWycFgBH35hHx0Li604ZIzhseh97mf2p0cv7vVrOZGoqhlEg==}
 
   flat-cache@4.0.1:
     resolution: {integrity: sha512-f7ccFPK3SXFHpx15UIGyRJ/FJQctuKZ0zVuN3frBo4HnK3cay9VEW0R6yPYFHC0AgqhukPzKjq22t5DmAyqGyw==}
     engines: {node: '>=16'}
 
-  flat-cache@5.0.0:
-    resolution: {integrity: sha512-JrqFmyUl2PnPi1OvLyTVHnQvwQ0S+e6lGSwu8OkAZlSaNIZciTY2H/cOOROxsBA1m/LZNHDsqAgDZt6akWcjsQ==}
-    engines: {node: '>=18'}
+  flat-cache@6.1.23:
+    resolution: {integrity: sha512-f++BY9pTk+983xK1FLzlLpmM0i0z+jHmx3QESGkURMXujQZz1k5wzwX6hjnQ8goaD0B+sYnDK1yZ6MTyZfUaqA==}
 
-  flatted@3.3.2:
-    resolution: {integrity: sha512-AiwGJM8YcNOaobumgtng+6NHuOqC3A7MixFeDafM3X9cIUM+xUXoS5Vfgf+OihAYe20fxqNM9yPBXJzRtZ/4eA==}
+  flatted@3.4.4:
+    resolution: {integrity: sha512-5+ybhBZANEJxaH3X5evAFatUxLfEHSr7n6kYJ+1Qd0mUqr4eu9gIf6GDbWHf8RJijHrjjO8G+la14SlL2SeS1Q==}
 
-  focus-trap@7.6.2:
-    resolution: {integrity: sha512-9FhUxK1hVju2+AiQIDJ5Dd//9R2n2RAfJ0qfhF4IHGHgcoEUTMpbTeG/zbEuwaiYXfuAH6XE0/aCyxDdRM+W5w==}
-
-  follow-redirects@1.15.9:
-    resolution: {integrity: sha512-gew4GsXizNgdoRyqmyfMHyAmXsZDk6mHkSxZFCzW9gwlbtOW44CDtYavM+y+72qD/Vq2l550kMF52DT8fOLJqQ==}
+  follow-redirects@1.16.0:
+    resolution: {integrity: sha512-y5rN/uOsadFT/JfYwhxRS5R7Qce+g3zG97+JrtFZlC9klX/W5hD7iiLzScI4nZqUS7DNUdhPgw4xI8W2LuXlUw==}
     engines: {node: '>=4.0'}
     peerDependencies:
       debug: '*'
@@ -6057,27 +7874,36 @@ packages:
       debug:
         optional: true
 
-  for-each@0.3.3:
-    resolution: {integrity: sha512-jqYfLp7mo9vIyQf8ykW2v7A+2N4QjeCeI5+Dz9XraiO1ign81wjiH7Fb9vSOWvQfNtmSa4H2RoQTrrXivdUZmw==}
+  for-each@0.3.5:
+    resolution: {integrity: sha512-dKx12eRCVIzqCxFGplyFKJMPvLEWgmNtUrpTiJIR5u97zEhRG8ySrtboPHZXx7daLxQVrl643cTzbab2tkQjxg==}
+    engines: {node: '>= 0.4'}
 
-  foreground-child@3.3.0:
-    resolution: {integrity: sha512-Ld2g8rrAyMYFXBhEqMz8ZAHBi4J4uS1i/CxGMDnjyFWddMXLVcDp051DZfu+t7+ab7Wv6SMqpWmyFIj5UbfFvg==}
+  foreground-child@3.3.1:
+    resolution: {integrity: sha512-gIXjKqtFuWEgzFRJA9WCQeSJLZDjgJUOMCMzxtvFq/37KojM1BFGufqsCy0r4qSQmYLsZYMeyRqzIWOMup03sw==}
     engines: {node: '>=14'}
 
-  form-data@4.0.1:
-    resolution: {integrity: sha512-tzN8e4TX8+kkxGPK8D5u0FNmjPUjw3lwC9lSLxxoB/+GtsJG91CO8bSWy73APlgAZzZbXEYZJuxjkHH2w+Ezhw==}
+  form-data@4.0.6:
+    resolution: {integrity: sha512-vKatAh4SlVfgbv+YtmhiRjhEMJsYpsG1Y2rMQtR+SVSbytsSD1YGzDIcrAJmdFec88u/+VoGmxnl+80gL1tRCQ==}
     engines: {node: '>= 6'}
 
+  formatly@0.3.0:
+    resolution: {integrity: sha512-9XNj/o4wrRFyhSMJOvsuyMwy8aUfBaZ1VrqHVfohyXf0Sw0e+yfKG+xZaY3arGCOMdwFsqObtzVOc1gU9KiT9w==}
+    engines: {node: '>=18.3.0'}
+    hasBin: true
+
   frac@1.1.2:
     resolution: {integrity: sha512-w/XBfkibaTl3YDqASwfDUqkna4Z2p9cFSr1aHDt0WoMTECnRfBOv2WArlZILlqgWlmdIlALXGpM2AOhEk5W3IA==}
     engines: {node: '>=0.8'}
 
-  fraction.js@4.3.7:
-    resolution: {integrity: sha512-ZsDfxO51wGAXREY55a7la9LScWpwv9RxIrYABrlvOFBlH/ShPnrtsXeuUIfXKKOVicNxQ+o8JTbJvjS4M89yew==}
+  fraction.js@5.3.4:
+    resolution: {integrity: sha512-1X1NTtiJphryn/uLQz3whtY6jK3fTqoE3ohKs0tT+Ujr1W59oopxmoEh7Lu5p6vBaPbgoM0bzveAW4Qi5RyWDQ==}
 
-  fresh@0.5.2:
-    resolution: {integrity: sha512-zJ2mQYM18rEFOudeV4GShTGIQ7RbzA7ozbU9I/XBpm7kqgMywgmylMwXHxZJmkVoYkna9d2pVXVXPdYTP9ej8Q==}
-    engines: {node: '>= 0.6'}
+  framesync@6.1.2:
+    resolution: {integrity: sha512-jBTqhX6KaQVDyus8muwZbBeGGP0XgujBRbQ7gM7BRdS3CadCZIHiawyzYLnafYcvZIh5j8WE7cxZKFn7dXhu9g==}
+
+  fresh@2.0.0:
+    resolution: {integrity: sha512-Rx/WycZ60HOaqLKAi6cHRKKI7zxWbJ31MhntmtwMoaTeF7XFH9hhBp8vITaMidfljRQ6eYWCKkaTK+ykVJHP2A==}
+    engines: {node: '>= 0.8'}
 
   fs-constants@1.0.0:
     resolution: {integrity: sha512-y6OAwoSIf7FyjMIv94u+b5rdheZEjzR63GTyZJm5qh4Bi+2YgwLCcI/fPFZkL5PSixOt6ZNKm+w+Hfp/Bciwow==}
@@ -6086,8 +7912,12 @@ packages:
     resolution: {integrity: sha512-oRXApq54ETRj4eMiFzGnHWGy+zo5raudjuxN0b8H7s/RU2oW0Wvsx9O0ACRN/kRq9E8Vu/ReskGB5o3ji+FzHQ==}
     engines: {node: '>=12'}
 
-  fs-extra@11.2.0:
-    resolution: {integrity: sha512-PmDi3uwK5nFuXh7XDTlVnS17xJS7vW36is2+w3xcv8SVxiB4NyATf4ctkVY5bkSjX0Y4nbvZCq1/EjtEyr9ktw==}
+  fs-extra@11.3.1:
+    resolution: {integrity: sha512-eXvGGwZ5CL17ZSwHWd3bbgk7UUpF6IFHtP57NYYakPvHOs8GDgDe5KJI36jIJzDkJ6eJjuzRA8eBQb6SkKue0g==}
+    engines: {node: '>=14.14'}
+
+  fs-extra@11.4.0:
+    resolution: {integrity: sha512-EQsFzMUJkCKGr1ePqlYADkIUmHW1s3ZXr5Yqy6wbGrfUCphpl2maM/kyOIRA2HpP3AaFQTZXD4ldjek+nccddA==}
     engines: {node: '>=14.14'}
 
   fs-extra@7.0.1:
@@ -6102,10 +7932,6 @@ packages:
     resolution: {integrity: sha512-hcg3ZmepS30/7BSFqRvoo3DOMQu7IjqxO5nCDt+zM9XWjb33Wg7ziNT+Qvqbuc3+gWpzO02JubVyk2G4Zvo1OQ==}
     engines: {node: '>=10'}
 
-  fs-minipass@2.1.0:
-    resolution: {integrity: sha512-V/JgOLFCS+R6Vcq0slCuaeWEdNC3ouDlJMNIsacH2VtALiu9mV4LPrHc5cDl8k5aw6J8jwgWWpiTo5RYhmIzvg==}
-    engines: {node: '>= 8'}
-
   fs.realpath@1.0.0:
     resolution: {integrity: sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw==}
 
@@ -6127,16 +7953,20 @@ packages:
   function-bind@1.1.2:
     resolution: {integrity: sha512-7XHNxH7qX9xG5mIwxkhumTox/MIRNcOgDrxWsMt2pAr23WHp6MrRlN7FBSFpCpr+oVO0F744iUgR82nJMfG2SA==}
 
-  function.prototype.name@1.1.8:
-    resolution: {integrity: sha512-e5iwyodOHhbMr/yNrc7fDYG4qlbIvI5gajyzPnb5TCwyhjApznQh1BMFou9b30SevY43gCJKXycoCBjMbsuW0Q==}
+  function.prototype.name@1.2.0:
+    resolution: {integrity: sha512-jObKIik1P2QjPHP5nz5BaOtUlfgS0fWo8IUByNXkM+o+02sJOi94em77GwJKQSJ3gfPHdgzLNrHc1uokV4P/ew==}
     engines: {node: '>= 0.4'}
 
   functions-have-names@1.2.3:
     resolution: {integrity: sha512-xckBUXyTIqT97tq2x2AMb+g163b5JFysYk0x4qxNFwbfQkmNZoiRHb6sPzI9/QV33WeuvVYBUIiD4NzNIyqaRQ==}
 
-  gensequence@7.0.0:
-    resolution: {integrity: sha512-47Frx13aZh01afHJTB3zTtKIlFI6vWY+MYCN9Qpew6i52rfKjnhCF/l1YlC8UmEMvvntZZ6z4PiCcmyuedR2aQ==}
-    engines: {node: '>=18'}
+  generator-function@2.0.1:
+    resolution: {integrity: sha512-SFdFmIJi+ybC0vjlHN0ZGVGHc3lgE0DxPAT0djjVg+kjOnSqclqmj0KQ7ykTOLP6YxoqOvuAODGdcHJn+43q3g==}
+    engines: {node: '>= 0.4'}
+
+  gensequence@8.0.8:
+    resolution: {integrity: sha512-omMVniXEXpdx/vKxGnPRoO2394Otlze28TyxECbFVyoSpZ9H3EO7lemjcB12OpQJzRW4e5tt/dL1rOxry6aMHg==}
+    engines: {node: '>=20'}
 
   gensync@1.0.0-beta.2:
     resolution: {integrity: sha512-3hN7NaskYvMDLQY55gnW3NQ+mesEAepTqlg+VEbj7zzqEMBVNhzcGYYeqFo/TlYz6eQiFcp1HcsCZO+nGgS8zg==}
@@ -6146,31 +7976,31 @@ packages:
     resolution: {integrity: sha512-DyFP3BM/3YHTQOCUL/w0OZHR0lpKeGrxotcHWcqNEdnltqFwXVfhEBQ94eIo34AfQpo0rGki4cyIiftY06h2Fg==}
     engines: {node: 6.* || 8.* || >= 10.*}
 
-  get-east-asian-width@1.3.0:
-    resolution: {integrity: sha512-vpeMIQKxczTD/0s2CdEWHcb0eeJe6TFjxb+J5xgX7hScxqrGuyjmv4c1D4A/gelKfyox0gJJwIHF+fLjeaM8kQ==}
+  get-east-asian-width@1.6.0:
+    resolution: {integrity: sha512-QRbvDIbx6YklUe6RxeTeleMR0yv3cYH6PsPZHcnVn7xv7zO1BHN8r0XETu8n6Ye3Q+ahtSarc3WgtNWmehIBfA==}
     engines: {node: '>=18'}
 
-  get-intrinsic@1.2.6:
-    resolution: {integrity: sha512-qxsEs+9A+u85HhllWJJFicJfPDhRmjzoYdl64aMWW9yRIJmSyxdn8IEkuIM530/7T+lv0TIHd8L6Q/ra0tEoeA==}
+  get-intrinsic@1.3.0:
+    resolution: {integrity: sha512-9fSjSaos/fRIVIp+xSJlE6lfwhES7LNtKaCBIamHsjr2na1BiABJPo0mOjjz8GJDURarmCPGqaiVg5mfjb98CQ==}
     engines: {node: '>= 0.4'}
 
   get-own-enumerable-property-symbols@3.0.2:
     resolution: {integrity: sha512-I0UBV/XOz1XkIJHEUDMZAbzCThU/H8DxmSfmdGcKPnVhu2VfFqr34jr9777IyaTYvxjedWhqVIilEDsCdP5G6g==}
 
-  get-port-please@3.1.2:
-    resolution: {integrity: sha512-Gxc29eLs1fbn6LQ4jSU4vXjlwyZhF5HsGuMAa7gqBP4Rw4yxxltyDUuF5MBclFzDTXO+ACchGQoeela4DSfzdQ==}
+  get-port-please@3.2.0:
+    resolution: {integrity: sha512-I9QVvBw5U/hw3RmWpYKRumUeaDgxTPd401x364rLmWBJcOQ753eov1eTgzDqRG9bqFIfDc7gfzcQEWrUri3o1A==}
 
-  get-port@7.1.0:
-    resolution: {integrity: sha512-QB9NKEeDg3xxVwCCwJQ9+xycaz6pBB6iQ76wiWMl1927n0Kir6alPiP+yuiICLLU4jpMe08dXfpebuQppFA2zw==}
+  get-port@7.2.0:
+    resolution: {integrity: sha512-afP4W205ONCuMoPBqcR6PSXnzX35KTcJygfJfcp+QY+uwm3p20p1YczWXhlICIzGMCxYBQcySEcOgsJcrkyobg==}
     engines: {node: '>=16'}
 
-  get-stdin@9.0.0:
-    resolution: {integrity: sha512-dVKBjfWisLAicarI2Sf+JuBE/DghV4UzNAVe9yhEJuzeREd3JhOTE9cUaJTeSa77fsbQUK3pcOpJfM59+VKZaA==}
-    engines: {node: '>=12'}
+  get-proto@1.0.1:
+    resolution: {integrity: sha512-sTSfBjoXBp89JvIKIefqw7U2CCebsc74kiY6awiGogKtoSGbgjYE/G/+l9sF3MWFPNc9IcoOC4ODfKHfxFmp0g==}
+    engines: {node: '>= 0.4'}
 
-  get-stream@8.0.1:
-    resolution: {integrity: sha512-VaUJspBffn/LMCJVoMvSAdmscJyS1auj5Zulnn5UoYcY531UWmdwhRWkcGKnGU93m5HSXP9LP2usOryrBtQowA==}
-    engines: {node: '>=16'}
+  get-stream@5.2.0:
+    resolution: {integrity: sha512-nBF+F1rAZVCu/p7rjzgA+Yb4lfYXrpl7a6VmJrU8wF9I1CKvP/QwPNZHnOlwbTkY6dvtFIzFMSyQXbLoTQPRpA==}
+    engines: {node: '>=8'}
 
   get-stream@9.0.1:
     resolution: {integrity: sha512-kVCxPF3vQM/N0B1PmoqVUqgHP+EeVjmZSQn+1oCRPxd2P21P2F19lIgbR3HBosbB1PUhOAoctJnfEn2GbN2eZA==}
@@ -6180,16 +8010,15 @@ packages:
     resolution: {integrity: sha512-w9UMqWwJxHNOvoNzSJ2oPF5wvYcvP7jUvYzhp67yEhTi17ZDBBC1z9pTdGuzjD+EFIqLSYRweZjqfiPzQ06Ebg==}
     engines: {node: '>= 0.4'}
 
-  get-tsconfig@4.8.1:
-    resolution: {integrity: sha512-k9PN+cFBmaLWtVz29SkUoqU5O0slLuHJXt/2P+tMVFT+phsSGXGkp9t3rQIqdz0e+06EHNGs3oM6ZX1s2zHxRg==}
+  get-tsconfig@4.14.1:
+    resolution: {integrity: sha512-Dz/6HxkrxgNehhxLVeyv8sad9UzF2xBVeaKBQNDfJ5XiSXmp2gTR0eO0RWiT2NCKS5aGP9jjkOMggTN90qU50A==}
 
-  giget@1.2.3:
-    resolution: {integrity: sha512-8EHPljDvs7qKykr6uw8b+lqLiUc/vUg+KVTI0uND4s63TdsZM2Xus3mflvF0DDG9SiM4RlCkFGL+7aAjRmV7KA==}
-    hasBin: true
+  get-tsconfig@5.0.0-beta.5:
+    resolution: {integrity: sha512-/6gFNr0N04nob252sTQxyFLi3eKFRqIg1I87YcqAMT1i6SQrSF6KujUEQrtrjMV0H/eejTCltLdDSTEMzHbnsQ==}
+    engines: {node: '>=20.20.0'}
 
-  git-raw-commits@4.0.0:
-    resolution: {integrity: sha512-ICsMM1Wk8xSGMowkOmPrzo2Fgmfo4bMHLNX6ytHjajRJUqvHOw/TFapQ+QG75c3X/tTDDhOSRPGC52dDbNM8FQ==}
-    engines: {node: '>=16'}
+  giget@3.3.1:
+    resolution: {integrity: sha512-r+mvuDjrjMpsdw46Kmeydb8bdHm7wOKw8wNBtTndkjbPjgAp5oUJUxRE76wZFknxIPokfWvep2qSXK37aXE6zg==}
     hasBin: true
 
   glob-parent@5.1.2:
@@ -6204,54 +8033,45 @@ packages:
     resolution: {integrity: sha512-7Bv8RF0k6xjo7d4A/PxYLbUCfb6c+Vpd2/mB2yRDlew7Jb5hEXiCD9ibfO7wpk8i4sevK6DFny9h7EYbM3/sHg==}
     hasBin: true
 
-  glob@11.0.0:
-    resolution: {integrity: sha512-9UiX/Bl6J2yaBbxKoEBRm4Cipxgok8kQYcOPEhScPwebu2I0HoQOuYdIO6S3hLuWoZgpDpwQZMzTFxgpkyT76g==}
+  glob@11.1.0:
+    resolution: {integrity: sha512-vuNwKSaKiqm7g0THUBu2x7ckSs3XJLXE+2ssL7/MfTGPLLcrJQ/4Uq1CjPTtO5cCIiRxqvN6Twy1qOwhL0Xjcw==}
     engines: {node: 20 || >=22}
     hasBin: true
 
+  glob@13.0.6:
+    resolution: {integrity: sha512-Wjlyrolmm8uDpm/ogGyXZXb1Z+Ca2B8NbJwqBVg0axK9GbBeoS7yGV6vjXnYdGm6X53iehEuxxbyiKp8QmN4Vw==}
+    engines: {node: 18 || 20 || >=22}
+
   glob@7.2.3:
     resolution: {integrity: sha512-nFR0zLpU2YCaRxwoCJvL6UvCH2JFyFVIvwTLsIf21AuHlMskA1hhTdk+LlYJtOlYt9v6dvszD2BGRqBL+iQK9Q==}
     deprecated: Glob versions prior to v9 are no longer supported
 
-  glob@8.1.0:
-    resolution: {integrity: sha512-r8hpEjiQEYlF2QU0df3dS+nxxSIreXQS1qRhMJM0Q5NDdR386C7jb7Hwwod8Fgiuex+k0GFjgft18yvxm5XoCQ==}
-    engines: {node: '>=12'}
-    deprecated: Glob versions prior to v9 are no longer supported
+  global-agent@3.0.0:
+    resolution: {integrity: sha512-PT6XReJ+D07JvGoxQMkT6qji/jVNfX/h364XHZOWeRzy64sSFr+xJ5OX7LI3b4MPQzdL4H8Y8M0xzPpsVMwA8Q==}
+    engines: {node: '>=10.0'}
 
   global-directory@4.0.1:
     resolution: {integrity: sha512-wHTUcDUoZ1H5/0iVqEudYW4/kAlN5cZ3j/bXn0Dpbizl9iaUVeWSHqiOjsgk6OW2bkLclbBjzewBz6weQ1zA2Q==}
     engines: {node: '>=18'}
 
-  global-modules@1.0.0:
-    resolution: {integrity: sha512-sKzpEkf11GpOFuw0Zzjzmt4B4UZwjOcG757PPvrfhxcLFbq0wpsgpOqxpxtxFiCG4DtG93M6XRVbF2oGdev7bg==}
-    engines: {node: '>=0.10.0'}
+  global-directory@5.0.0:
+    resolution: {integrity: sha512-1pgFdhK3J2LeM+dVf2Pd424yHx2ou338lC0ErNP2hPx4j8eW1Sp0XqSjNxtk6Tc4Kr5wlWtSvz8cn2yb7/SG/w==}
+    engines: {node: '>=20'}
 
   global-modules@2.0.0:
     resolution: {integrity: sha512-NGbfmJBp9x8IxyJSd1P+otYK8vonoJactOogrVfFRIAEY1ukil8RSKDz2Yo7wh1oihl51l/r6W4epkeKJHqL8A==}
     engines: {node: '>=6'}
 
-  global-prefix@1.0.2:
-    resolution: {integrity: sha512-5lsx1NUDHtSjfg0eHlmYvZKv8/nVqX4ckFbM+FrGcQ+04KWcWFo9P5MxPZYSzUvyzmdTbI7Eix8Q4IbELDqzKg==}
-    engines: {node: '>=0.10.0'}
-
   global-prefix@3.0.0:
     resolution: {integrity: sha512-awConJSVCHVGND6x3tmMaKcQvwXLhjdkmomy2W+Goaui8YPgYgXJZewhg3fWC+DlfqqQuWg8AwqjGTD2nAPVWg==}
     engines: {node: '>=6'}
 
-  globals@11.12.0:
-    resolution: {integrity: sha512-WOBp/EEGUiIsJSp7wcv/y6MO+lV9UoncWqxuFfm8eBwzWNgyfBd6Gz+IeKQ9jCmyhoH99g15M3T+QaVHFjizVA==}
-    engines: {node: '>=4'}
-
-  globals@13.24.0:
-    resolution: {integrity: sha512-AhO5QUcj8llrbG09iWhPU2B204J1xnPeL8kQmVorSsy+Sjj1sk8gIyh6cUocGmH4L0UuhAJy+hJMRA4mgA4mFQ==}
-    engines: {node: '>=8'}
-
-  globals@14.0.0:
-    resolution: {integrity: sha512-oahGvuMGQlPw/ivIYBjVSrWAfWLBeku5tpPE2fOPLi+WHffIWbuh2tCjhyQhTBPMf5E9jDEH4FOmTYgYwbKwtQ==}
+  globals@15.15.0:
+    resolution: {integrity: sha512-7ACyT3wmyp3I61S4fG682L0VA2RGD9otkqGJIwNUMF1SWUombIIk+af1unuDYgMm082aHYwD+mzJvv9Iu8dsgg==}
     engines: {node: '>=18'}
 
-  globals@15.14.0:
-    resolution: {integrity: sha512-OkToC372DtlQeje9/zHIo5CT8lRP/FUgEOKBEhU4e0abL7J7CD24fD9ohiLN5hagG/kWCYj4K5oaxxtj2Z0Dig==}
+  globals@17.9.0:
+    resolution: {integrity: sha512-m/MvAW61QVU5VDNF1Vj8axt016h8w7L5TU1e9zlab7XIttAT2YAlCwl75K1fOqvMM9apmD7lbCIRhpfkhmxhCg==}
     engines: {node: '>=18'}
 
   globalthis@1.0.4:
@@ -6262,40 +8082,40 @@ packages:
     resolution: {integrity: sha512-jhIXaOzy1sb8IyocaruWSn1TjmnBVs8Ayhcy83rmxNJ8q2uWKCAj3CnJY+KpGSXCueAPc0i05kVvVKtP1t9S3g==}
     engines: {node: '>=10'}
 
-  globby@14.0.2:
-    resolution: {integrity: sha512-s3Fq41ZVh7vbbe2PN3nrW7yC7U7MFVc5c98/iTl9c2GawNMKx/J648KQRW6WKkuU8GIbbh2IXfIRQjOZnXcTnw==}
-    engines: {node: '>=18'}
+  globby@16.2.3:
+    resolution: {integrity: sha512-VZX7TV7jmd/pn71vdnLKtgwy1IWqc3KjI9x1/UtPkwoKk5fKrNLY30ltDe3cAM5xruIN7YuuaulFt133jRrKZg==}
+    engines: {node: '>=20'}
 
   globjoin@0.1.4:
     resolution: {integrity: sha512-xYfnw62CKG8nLkZBfWbhWwDw02CHty86jfPcc2cr3ZfeuK9ysoVPPEUxf21bAD/rWAgk52SuBrLJlefNy8mvFg==}
 
+  globrex@0.1.2:
+    resolution: {integrity: sha512-uHJgbwAMwNFf5mLst7IWLNg14x1CkeqglJb/K3doi4dw6q2IvAAmM/Y81kevy83wP+Sst+nutFTYOGg3d1lsxg==}
+
   gopd@1.2.0:
     resolution: {integrity: sha512-ZUKRh6/kUFoAiTAtTYPZJ3hw9wNxx+BIBOijnlG9PnrJsCcSjs1wyyD6vJpaYtgnzDrKYRSqf3OO6Rfa93xsRg==}
     engines: {node: '>= 0.4'}
 
+  got@11.8.6:
+    resolution: {integrity: sha512-6tfZ91bOr7bOXnK7PRDCGBLa1H4U080YHNaAQ2KsMGlLEzRbk44nsZF2E1IeRc3vtJHPVbKCYgdFbaGO2ljd8g==}
+    engines: {node: '>=10.19.0'}
+
   graceful-fs@4.2.10:
     resolution: {integrity: sha512-9ByhssR2fPVsNZj478qUUbKfmL0+t5BDVyjShtyZZLiK7ZDAArFFfopyOTj0M05wE2tJPisA4iTnnXl2YoPvOA==}
 
   graceful-fs@4.2.11:
     resolution: {integrity: sha512-RbJ5/jmFcNNCcDV5o9eTnBLJ/HszWV0P73bc+Ff4nS/rJj+YaS6IGyiOL0VoBYX+l1Wrl3k63h/KrH+nhJ0XvQ==}
 
-  graph-cycles@3.0.0:
-    resolution: {integrity: sha512-9qxd8BQK0tZJ3cRUW0Yn2q6P/9h+bgz/4UYuscpdxPz6851NNBA1IwoYDRHDpKzCqmr1UHlGHcp5+0WzpY9F7A==}
-    engines: {node: ^14.13.1 || >=16.0.0}
-
-  graphemer@1.4.0:
-    resolution: {integrity: sha512-EtKwoO6kxCL9WO5xipiHTZlSzBm7WLT627TqC/uVRd0HKmq8NXyebnNYxDoBi7wt8eTWrUrKXCOVaFq9x1kgag==}
-
   gzip-size@7.0.0:
     resolution: {integrity: sha512-O1Ld7Dr+nqPnmGpdhzLmMTQ4vAsD+rHwMm1NLUmoUFFymBOMKxCCrtDxqdBRYXdeEPEi3SyoR4TizJLQrnKBNA==}
     engines: {node: ^12.20.0 || ^14.13.1 || >=16.0.0}
 
-  h3@1.13.0:
-    resolution: {integrity: sha512-vFEAu/yf8UMUcB4s43OaDaigcqpQd14yanmOsn+NcRX3/guSKncyE2rOYhq8RIchgJrPSs/QiIddnTTR1ddiAg==}
+  h3@1.15.11:
+    resolution: {integrity: sha512-L3THSe2MPeBwgIZVSH5zLdBBU90TOxarvhK9d04IDY2AmVS8j2Jz2LIWtwsGOU3lu2I5jCN7FNvVfY2+XyF+mg==}
 
-  happy-dom@15.11.7:
-    resolution: {integrity: sha512-KyrFvnl+J9US63TEzwoiJOQzZBJY7KgBushJA8X61DMbNsH+2ONkDuLDnCnwUiPTF42tLoEmrPyoqbenVA5zrg==}
-    engines: {node: '>=18.0.0'}
+  happy-dom@20.11.2:
+    resolution: {integrity: sha512-7MB+bJLkxu3SowAfBJbjW+c55kNz5tkR45gu2qzrxznezhLeN5YIlJbwUgSzlGc+qWoZ8Ykg71H5ezz69xixrw==}
+    engines: {node: '>=20.0.0'}
 
   has-bigints@1.1.0:
     resolution: {integrity: sha512-R3pbpkcIqv2Pm3dUwgjclDRVmWpTJW2DcMzcIhEXEx1oh/CEMObMm3KLmRJOdvhM7o4uQBnwr8pzRK2sJWIqfg==}
@@ -6305,9 +8125,9 @@ packages:
     resolution: {integrity: sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==}
     engines: {node: '>=8'}
 
-  has-own-prop@2.0.0:
-    resolution: {integrity: sha512-Pq0h+hvsVm6dDEa8x82GnLSYHOzNDt7f0ddFa3FqcQlgzEiptPqL+XrOJNavjOzSYiYWIrgeVYYgGlLmnxwilQ==}
-    engines: {node: '>=8'}
+  has-flag@5.0.1:
+    resolution: {integrity: sha512-CsNUt5x9LUdx6hnk/E2SZLsDyvfqANZSUq4+D3D8RzDJ2M+HDTIkF60ibS1vHaK55vzgiZw1bEPFG9yH7l33wA==}
+    engines: {node: '>=12'}
 
   has-property-descriptors@1.0.2:
     resolution: {integrity: sha512-55JNKuIW+vq4Ke1BjOTjM2YctQIvCT7GFzHwmfZPGo5wnrgkid0YQtnAleFSqumZm4az3n2BS+erby5ipJdgrg==}
@@ -6324,66 +8144,71 @@ packages:
     resolution: {integrity: sha512-NqADB8VjPFLM2V0VvHUewwwsw0ZWBaIdgo+ieHtK3hasLz4qeCRjYcqfB6AQrBggRKppKF8L52/VqdVsO47Dlw==}
     engines: {node: '>= 0.4'}
 
-  hash-sum@2.0.0:
-    resolution: {integrity: sha512-WdZTbAByD+pHfl/g9QSsBIIwy8IT+EsPiKDs0KNX+zSHhdDLFKdZu0BQHljvO+0QI/BasbMSUa8wYNCZTvhslg==}
+  hashery@1.5.1:
+    resolution: {integrity: sha512-iZyKG96/JwPz1N55vj2Ie2vXbhu440zfUfJvSwEqEbeLluk7NnapfGqa7LH0mOsnDxTF85Mx8/dyR6HfqcbmbQ==}
+    engines: {node: '>=20'}
 
-  hasown@2.0.2:
-    resolution: {integrity: sha512-0hJU9SCPvmMzIBdZFqNPXWa6dqh7WdH0cII9y+CyS8rG3nL48Bclra9HmKhVVUHyPWNH5Y7xDwAB7bfgSjkUMQ==}
+  hasown@2.0.4:
+    resolution: {integrity: sha512-T2UbfbBEF32wiepXIsMlTW9+dDYC6wMh/t/vYA4tuOMKqWz/n3vr1NFSxQiyP+zk2mXsoMA/i/7qV6LKut1t1A==}
     engines: {node: '>= 0.4'}
 
-  he@1.2.0:
-    resolution: {integrity: sha512-F/1DnUGPopORZi0ni+CvrCgHQ5FyEAHRLSApuYWMmrbSwoN2Mn/7k+Gl38gJnR7yyDZk6WLXwiGod1JOWNDKGw==}
-    hasBin: true
-
-  homedir-polyfill@1.0.3:
-    resolution: {integrity: sha512-eSmmWE5bZTK2Nou4g0AI3zZ9rswp7GRKoKXS1BLUkvPviOqs4YTN1djQIqrXy9k5gEtdLPy86JjRwsNM9tnDcA==}
-    engines: {node: '>=0.10.0'}
+  hey-listen@1.0.8:
+    resolution: {integrity: sha512-COpmrF2NOg4TBWUJ5UVyaCU2A88wEMkUPK4hNqyCkqHbxT92BbvfjoSozkAIIm6XhicGlJHhFdullInrdhwU8Q==}
 
   hookable@5.5.3:
     resolution: {integrity: sha512-Yc+BQe8SvoXH1643Qez1zqLRmbA5rCL+sSmk6TVos0LWVfNIB7PGncdlId77WzLGSIB5KaWgTaNTs2lNVEI6VQ==}
 
-  hosted-git-info@2.8.9:
-    resolution: {integrity: sha512-mxIDAb9Lsm6DoOJ7xH+5+X4y1LU/4Hi50L9C5sIswK3JzULS4bwk1FvjdBgvYR4bzT4tuUQiC15FE2f5HbLvYw==}
+  hookable@6.1.1:
+    resolution: {integrity: sha512-U9LYDy1CwhMCnprUfeAZWZGByVbhd54hwepegYTK7Pi5NvqEj63ifz5z+xukznehT7i6NIZRu89Ay1AZmRsLEQ==}
 
-  html-minifier-terser@6.1.0:
-    resolution: {integrity: sha512-YXxSlJBZTP7RS3tWnQw74ooKa6L9b9i9QYXY21eUEvhZ3u9XLfv6OnFsQq6RxkhHygsaUMvYsZRV5rU/OVNZxw==}
-    engines: {node: '>=12'}
-    hasBin: true
+  hookified@1.15.1:
+    resolution: {integrity: sha512-MvG/clsADq1GPM2KGo2nyfaWVyn9naPiXrqIe4jYjXNZQt238kWyOGrsyc/DmRAQ+Re6yeo6yX/yoNCG5KAEVg==}
+
+  hookified@2.2.0:
+    resolution: {integrity: sha512-p/LgFzRN5FeoD3DLS6bkUapeye6E4SI6yJs6KetENd18S+FBthqYq2amJUWpt5z0EQwwHemidjY5OqJGEKm5uA==}
+
+  hosted-git-info@4.1.0:
+    resolution: {integrity: sha512-kyCuEOWjJqZuDbRHzL8V93NzQhwIB71oFWSyzVo+KPZI+pnQPPxucdkrOZvkLRnrf5URsQM+IJ09Dw29cRALIA==}
+    engines: {node: '>=10'}
 
   html-minifier-terser@7.2.0:
     resolution: {integrity: sha512-tXgn3QfqPIpGl9o+K5tpcj3/MN4SfLtsx2GWwBC3SSd0tXQGyF3gsSqad8loJgKZGM3ZxbYDd5yhiBIdWpmvLA==}
     engines: {node: ^14.13.1 || >=16.0.0}
     hasBin: true
 
-  html-tags@3.3.1:
-    resolution: {integrity: sha512-ztqyC3kLto0e9WbNp0aeP+M3kTt+nbaIveGmUxAtZa+8iFgKLUOD4YKM5j+f3QD89bra7UeumolZHKuOXnTmeQ==}
-    engines: {node: '>=8'}
+  html-tags@5.1.0:
+    resolution: {integrity: sha512-n6l5uca7/y5joxZ3LUePhzmBFUJ+U2YWzhMa8XUTecSeSlQiZdF5XAd/Q3/WUl0VsXgUwWi8I7CNIwdI5WN1SQ==}
+    engines: {node: '>=20.10'}
 
   html2canvas@1.4.1:
     resolution: {integrity: sha512-fPU6BHNpsyIhr8yyMpTLLxAbkaK8ArIBcmZIRiBLiDhjeqvXolaEmDGmELFuX9I4xDcaKKcJl+TKZLqruBbmWA==}
     engines: {node: '>=8.0.0'}
 
+  htmlparser2@10.1.0:
+    resolution: {integrity: sha512-VTZkM9GWRAtEpveh7MSF6SjjrpNVNNVJfFup7xTY3UpFtm67foy9HDVXneLtFVt4pMz5kZtgNcvCniNFb1hlEQ==}
+
   htmlparser2@8.0.2:
     resolution: {integrity: sha512-GYdjWKDkbRLkZ5geuHs5NY1puJ+PXwP7+fHPRz06Eirsb9ugf6d8kkXav6ADhcODhFFPMIXyxkxSuMf3D6NCFA==}
 
-  htmlparser2@9.1.0:
-    resolution: {integrity: sha512-5zfg6mHUoaer/97TxnGpxmbR7zJtPwIYFMZ/H5ucTlPZhKvtum05yiPK3Mgai3a0DyVxv7qYqoweaEd2nrYQzQ==}
+  http-cache-semantics@4.2.0:
+    resolution: {integrity: sha512-dTxcvPXqPvXBQpq5dUr6mEMJX4oIEFv6bwom3FDwKRDsuIjjJGANqhBuoAn9c1RQJIdAKav33ED65E2ys+87QQ==}
 
-  http-cache-semantics@4.1.1:
-    resolution: {integrity: sha512-er295DKPVsV82j5kw1Gjt+ADA/XYHsajl82cGNQG2eyoPkvgUhX+nDIyelzhIWbbsXP39EHcI6l5tYs2FYqYXQ==}
-
-  http-errors@2.0.0:
-    resolution: {integrity: sha512-FtwrG/euBzaEjYeRqOgly7G0qviiXoJWnvEH2Z1plBdXgbyjv34pHTSb9zoeHMyDy33+DWy5Wt9Wo+TURtOYSQ==}
+  http-errors@2.0.1:
+    resolution: {integrity: sha512-4FbRdAX+bSdmo4AUFuS0WNiPz8NgFt+r8ThgNWmlrjQjt1Q7ZR9+zTlce2859x4KSXrwIsaeTqDoKQmtP8pLmQ==}
     engines: {node: '>= 0.8'}
 
-  http-proxy-agent@4.0.1:
-    resolution: {integrity: sha512-k0zdNgqWTGA6aeIRVpvfVob4fL52dTfaehylg0Y4UvSySvOq/Y+BOyPrgpUrA7HylqvU8vIZGsRuXmspskV0Tg==}
-    engines: {node: '>= 6'}
+  http-proxy-agent@7.0.2:
+    resolution: {integrity: sha512-T1gkAiYYDWYx3V5Bmyu7HcfcvL7mUrTWiM6yOfa3PIphViJ/gFPbvidQ+veqSOHci/PxBcDabeUNCzpOODJZig==}
+    engines: {node: '>= 14'}
 
   http-shutdown@1.2.2:
     resolution: {integrity: sha512-S9wWkJ/VSY9/k4qcjG318bqJNruzE4HySUhFYknwmu6LBP97KLLfwNf+n4V1BHurvFNkSKLFnK/RsuUnRTf9Vw==}
     engines: {iojs: '>= 1.0.0', node: '>= 0.12.0'}
 
+  http2-wrapper@1.0.3:
+    resolution: {integrity: sha512-V+23sDMr12Wnz7iTcDeJr3O6AIxlnvT/bmaAAAP/Xda35C90p9599p0F1eHR/N1KILWSoWVAiOMFjBBXaXSMxg==}
+    engines: {node: '>=10.19.0'}
+
   https-proxy-agent@5.0.1:
     resolution: {integrity: sha512-dFcAjpTQFgoLMzC2VwU+C/CbS7uRL0lWmxDITmqm7C+7F0Odmj6s9l6alZc6AELXhrnggM2CeWSXHGOdX2YtwA==}
     engines: {node: '>= 6'}
@@ -6392,23 +8217,17 @@ packages:
     resolution: {integrity: sha512-vK9P5/iUfdl95AI+JVyUuIcVtd4ofvtrOr3HNtM2yxC9bnMbEdp3x01OhQNnjb8IJYi38VlTE3mBXwcfvywuSw==}
     engines: {node: '>= 14'}
 
-  httpxy@0.1.5:
-    resolution: {integrity: sha512-hqLDO+rfststuyEUTWObQK6zHEEmZ/kaIP2/zclGGZn6X8h/ESTWg+WKecQ/e5k4nPswjzZD+q2VqZIbr15CoQ==}
+  httpxy@0.5.5:
+    resolution: {integrity: sha512-uDjmnPyp1q4Sgzf3w+J/Fc6UqcCEj0x4Wjp7OqK5dGhNeDgpyrAmnS6ey8QWrX3SWDon2DMKf9sBa5X9+CVyMA==}
 
-  human-id@1.0.2:
-    resolution: {integrity: sha512-UNopramDEhHJD+VR+ehk8rOslwSfByxPIZyJRfV739NDhN5LF1fa1MqnzKm2lGTQRjNrjK19Q5fhkgIfjlVUKw==}
+  human-id@4.2.0:
+    resolution: {integrity: sha512-K3GbkIWqyvvlpfhBPlbEvD97TtqBpAYA4kt+cn2lD2x2HuohzZCibcA2nOlnJT6exqvJLggoB5nv2dNf192nEA==}
+    hasBin: true
 
-  human-signals@5.0.0:
-    resolution: {integrity: sha512-AXcZb6vzzrFAUE61HnN4mpLqd/cSIwNQjtNWR0euPm6y0iqx3G4gOXaIDdtdDwZmhwe82LA6+zinmW4UBWVePQ==}
-    engines: {node: '>=16.17.0'}
-
-  human-signals@8.0.0:
-    resolution: {integrity: sha512-/1/GPCpDUCCYwlERiYjxoczfP0zfvZMU/OWgQPMya9AbAE24vseigFdhAMObpc8Q4lc/kjutPfUddDYyAmejnA==}
+  human-signals@8.0.1:
+    resolution: {integrity: sha512-eKCa6bwnJhvxj14kZk5NCPc6Hb6BdsU9DZcOnmQKSnO1VKrfV0zCvtttPZUsBvjmNDn8rpcJfpwSYnHBjc95MQ==}
     engines: {node: '>=18.18.0'}
 
-  humanize-ms@1.2.1:
-    resolution: {integrity: sha512-Fl70vYtsAFb/C06PTS9dZBo7ihau+Tu/DNCk/OyHhea07S+aeMWpFFkUaXRa8fI+ScZbEI8dfSxwY7gxZ9SAVQ==}
-
   husky@9.1.7:
     resolution: {integrity: sha512-5gs5ytaNjBrh5Ow3zrvdUUY+0VxIuWVL4i9irt6friV+BqdCfmV11CQTWMiBYWHbXhco+J1kHfTOUkePhCDvMA==}
     engines: {node: '>=18'}
@@ -6422,61 +8241,49 @@ packages:
     resolution: {integrity: sha512-4fCk79wshMdzMp2rH06qWrJE4iolqLhCUH+OiuIgU++RB0+94NlDL81atO7GX55uUKueo0txHNtvEyI6D7WdMw==}
     engines: {node: '>=0.10.0'}
 
+  iconv-lite@0.7.3:
+    resolution: {integrity: sha512-IKXpvIzjnC9XTAUbVBcMfGS0EPaIXtW6v+zr+RRp+hqULEpo0owZax6wyRwPOJbWbzjYspQwusTsfVr0ifh4uQ==}
+    engines: {node: '>=0.10.0'}
+
   idb@7.1.1:
     resolution: {integrity: sha512-gchesWBzyvGHRO9W8tzUWFDycow5gwjvFKfyV9FF32Y7F50yZMp7mP+T2mJIWFx49zicqyC4uefHM17o6xKIVQ==}
 
   ieee754@1.2.1:
     resolution: {integrity: sha512-dcyqhDvX1C46lXZcVqCpK+FtMRQVdIMN6/Df5js2zouUsqG7I6sFxitIC+7KYK29KdXOLHdu9zL4sFnoVQnqaA==}
 
-  ignore-walk@5.0.1:
-    resolution: {integrity: sha512-yemi4pMf51WKT7khInJqAvsIGzoqYXblnsz0ql8tM+yi1EKYTY1evX4NAbJrLL/Aanr2HyZeluqU+Oi7MGHokw==}
-    engines: {node: ^12.13.0 || ^14.15.0 || >=16.0.0}
-
   ignore@5.3.2:
     resolution: {integrity: sha512-hsBTNUqQTDwkWtcdYI2i06Y/nUBEsNEDJKjWdigLvegy8kDuJAS8uRlpkkcQpyEXL0Z/pjDy5HBmMjRCJ2gq+g==}
     engines: {node: '>= 4'}
 
-  ignore@6.0.2:
-    resolution: {integrity: sha512-InwqeHHN2XpumIkMvpl/DCJVrAHgCsG5+cn1XlnLWGwtZBm8QJfSusItfrwx81CTp5agNZqpKU2J/ccC5nGT4A==}
+  ignore@7.0.6:
+    resolution: {integrity: sha512-BAg6QkE8W+TuQLrrw0Ugr7HegXduRuuj8/ti2kSOc+jz1dmx8/WNcjr6XGnq5YpDWxFwwaavqD0+jIUOKelTsw==}
     engines: {node: '>= 4'}
 
-  image-size@0.5.5:
-    resolution: {integrity: sha512-6TDAlDPZxUFCv+fuOkIoXT/V/f3Qbq8e37p+YOiYrUv3v9cc3/6x78VdfPgFVaB9dZYeLUfKgHRebpkm/oP2VQ==}
-    engines: {node: '>=0.10.0'}
-    hasBin: true
-
   immediate@3.0.6:
     resolution: {integrity: sha512-XXOFtyqDjNDAQxVfYxuF7g9Il/IbWmmlQg2MYKOH8ExIT1qg6xc4zyS3HaEEATgs1btfzxq15ciUiY7gjSXRGQ==}
 
-  immutable@4.3.7:
-    resolution: {integrity: sha512-1hqclzwYwjRDFLjcFxOM5AYkkG0rpFPpr1RLPMEuGczoS7YA8gLhy8SWXYRAA/XwfEHpfo3cw5JGioS32fnMRw==}
+  immutable@5.1.9:
+    resolution: {integrity: sha512-m8nVez3rwrgmWxtLMt1ZYXB2Lv7OKYn/disyxAlSDYAlKSlFoPPfIAmAM/M5xqL4m4C/wAPw7S2/CNaUii1Hxg==}
 
-  import-fresh@3.3.0:
-    resolution: {integrity: sha512-veYYhQa+D1QBKznvhUHxb8faxlrwUnxseDAbAp457E0wLNio2bOSKnjYDhMj+YiAq61xrMGhQk9iXVk5FzgQMw==}
+  import-fresh@3.3.1:
+    resolution: {integrity: sha512-TR3KfrTZTYLPB6jUjfx6MF9WcWrHL9su5TObK4ZkYgBdWKPOFoSoQIdEuTuR82pmtxH2spWG9h6etwfr1pLBqQ==}
     engines: {node: '>=6'}
 
-  import-lazy@4.0.0:
-    resolution: {integrity: sha512-rKtvo6a868b5Hu3heneU+L4yEQ4jYKLtjpnPeUdK7h0yzXGmyBTypknlkCvHFBqfX9YlorEiMM6Dnq/5atfHkw==}
-    engines: {node: '>=8'}
+  import-fresh@4.0.0:
+    resolution: {integrity: sha512-Fpi660c7VPDM3fPKYovStd9IP1CPOikf6v/dGxJJMmHPcwYQIMJ4W7kO1avBYEpMqkCh+Dx3Ln6H7VYqgztLjw==}
+    engines: {node: '>=22.15'}
 
-  import-meta-resolve@4.1.0:
-    resolution: {integrity: sha512-I6fiaX09Xivtk+THaMfAwnA3MVA5Big1WHF1Dfx9hFuvNIWpXnorlkzhcQf6ehrqQiiZECRt1poOAkPmer3ruw==}
+  import-meta-resolve@4.2.0:
+    resolution: {integrity: sha512-Iqv2fzaTQN28s/FwZAoFq0ZSs/7hMAHJVX+w8PZl3cY19Pxk6jFFalxQoIfW2826i/fDLXv8IiEZRIT0lDuWcg==}
+
+  import-without-cache@0.4.0:
+    resolution: {integrity: sha512-NkJQA7oZ4YHQhd2+H3BoRFKF3d/XNsiKpHZCQEMH9pDX27hQQLsTyOocyRgaIVtf8gHX3Nt3LPkR4e5EdtPAGQ==}
+    engines: {node: ^22.18.0 || >=24.0.0}
 
   imurmurhash@0.1.4:
     resolution: {integrity: sha512-JmXMZ6wuvDmLiHEml9ykzqO6lwFbof0GG4IkcGaENdCRDDmMVnny7s5HsIgHCbaq0w2MyPhDqkhTUgS2LU2PHA==}
     engines: {node: '>=0.8.19'}
 
-  indent-string@4.0.0:
-    resolution: {integrity: sha512-EdDDZu4A2OyIK7Lr/2zG+w5jmbuk1DVBnEwREQvBzspBJkCEbRa8GxU1lghYcaGJCnRWibjDXlq779X1/y5xwg==}
-    engines: {node: '>=8'}
-
-  index-to-position@0.1.2:
-    resolution: {integrity: sha512-MWDKS3AS1bGCHLBA2VLImJz42f7bJh8wQsTGCzI3j519/CASStoDONUBVz2I/VID0MpiX3SGSnbOD2xUalbE5g==}
-    engines: {node: '>=18'}
-
-  infer-owner@1.0.4:
-    resolution: {integrity: sha512-IClj+Xz94+d7irH5qRyfJonOdfTzuDaifE6ZPWfx0N0+/ATZCbuTPq2prFl526urkQd90WyUKIh1DfBQ2hMz9A==}
-
   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.
@@ -6491,25 +8298,21 @@ packages:
     resolution: {integrity: sha512-QQnnxNyfvmHFIsj7gkPcYymR8Jdw/o7mp5ZFihxn6h8Ci6fh3Dx4E1gPjpQEpIuPo9XVNY/ZUwh4BPMjGyL01g==}
     engines: {node: ^14.17.0 || ^16.13.0 || >=18.0.0}
 
+  ini@6.0.0:
+    resolution: {integrity: sha512-IBTdIkzZNOpqm7q3dRqJvMaldXjDHWkEDfrwGEQTs5eaQMWV+djAhR+wahyNNMAa+qpbDUhBMVt4ZKNwpPm7xQ==}
+    engines: {node: ^20.17.0 || >=22.9.0}
+
   internal-slot@1.1.0:
     resolution: {integrity: sha512-4gd7VpWNQNB4UKKCFFVcp1AVv+FMOgs9NKzjHKusc8jTMhd5eL1NqQqOpE0KzMds804/yHlglp3uxgluOqAPLw==}
     engines: {node: '>= 0.4'}
 
-  ioredis@5.4.2:
-    resolution: {integrity: sha512-0SZXGNGZ+WzISQ67QDyZ2x0+wVxjjUndtD8oSeik/4ajifeiRufed8fCb8QW8VMyi4MXcS+UO1k/0NGhvq1PAg==}
+  ioredis@5.11.1:
+    resolution: {integrity: sha512-ehuGcf94bQXhfagULNXrJdfnWO38v070jxSx/qE87Kjzmu2fU7ro5EFAb+OPituLqgfyuQaym5DlrNydW2sJ9A==}
     engines: {node: '>=12.22.0'}
 
-  ip-address@9.0.5:
-    resolution: {integrity: sha512-zHtQzGojZXTwZTHQqra+ETKd4Sn3vgi7uBmlPoXVWZqYvuKmtI0l/VZTjqGmJY9x88GGOaZ9+G9ES8hC4T4X8g==}
-    engines: {node: '>= 12'}
-
   iron-webcrypto@1.2.1:
     resolution: {integrity: sha512-feOM6FaSr6rEABp/eDfVseKyTMDt+KGpeB35SkVn9Tyn0CqvVsY3EwI0v5i8nMHyJnzCIQf7nsy3p41TPkJZhg==}
 
-  is-arguments@1.2.0:
-    resolution: {integrity: sha512-7bVbi0huj/wrIAOzb8U1aszg9kdi3KN/CyU19CTI7tAoZYEZoL9yCDXpbXN+uPsuWnP02cyug1gleqq+TU+YCA==}
-    engines: {node: '>= 0.4'}
-
   is-array-buffer@3.0.5:
     resolution: {integrity: sha512-DDfANUiiG2wC1qawP66qlTugJeL5HyzMpfr8lLK+jMQirGzNod0B12cFB/9q838Ru27sBwfw78/rdoU7RERz6A==}
     engines: {node: '>= 0.4'}
@@ -6517,30 +8320,22 @@ packages:
   is-arrayish@0.2.1:
     resolution: {integrity: sha512-zz06S8t0ozoDXMG+ube26zeCTNXcKIPJZJi8hBrF4idCLms4CG9QtK7qBl1boi5ODzFpjswb5JPmHCbMpjaYzg==}
 
-  is-async-function@2.0.0:
-    resolution: {integrity: sha512-Y1JXKrfykRJGdlDwdKlLpLyMIiWqWvuSd17TvZk68PLAOGOoF4Xyav1z0Xhoi+gCYjZVeC5SI+hYFOfvXmGRCA==}
+  is-async-function@2.1.1:
+    resolution: {integrity: sha512-9dgM/cZBnNvjzaMYHVoxxfPj2QXt22Ev7SuuPrs+xav0ukGB0S6d4ydZdEiM48kLx5kDV+QBPrpVnFyefL8kkQ==}
     engines: {node: '>= 0.4'}
 
   is-bigint@1.1.0:
     resolution: {integrity: sha512-n4ZT37wG78iz03xPRKJrHTdZbe3IicyucEtdRsV5yglwc3GyUfbAfpSeD0FJ41NbUNSt5wbhqfp1fS+BgnvDFQ==}
     engines: {node: '>= 0.4'}
 
-  is-binary-path@2.1.0:
-    resolution: {integrity: sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==}
-    engines: {node: '>=8'}
-
-  is-boolean-object@1.2.1:
-    resolution: {integrity: sha512-l9qO6eFlUETHtuihLcYOaLKByJ1f+N4kthcU9YjHy3N+B3hWv0y/2Nd0mu/7lTFnRQHTrSdXF50HQ3bl5fEnng==}
+  is-boolean-object@1.2.2:
+    resolution: {integrity: sha512-wa56o2/ElJMYqjCjGkXri7it5FbebW5usLw/nPmCMs5DeZ7eziSYZhSmPRn0txqeW4LnAmQQU7FgqLpsEFKM4A==}
     engines: {node: '>= 0.4'}
 
   is-buffer@2.0.5:
     resolution: {integrity: sha512-i2R6zNFDwgEHJyQUtJEk0XFi1i0dPFn/oqjK3/vPCcDeJvW5NQ83V8QbicfF1SupOaB0h8ntgBC2YiE7dfyctQ==}
     engines: {node: '>=4'}
 
-  is-builtin-module@3.2.1:
-    resolution: {integrity: sha512-BSLE3HnV2syZ0FK0iMA/yUGplUeMmNz4AW5fnTunbCIqZi4vG3WjJT9FHMy5D69xmAYBHXQhJdALdpwVxV501A==}
-    engines: {node: '>=6'}
-
   is-callable@1.2.7:
     resolution: {integrity: sha512-1BC0BVFhS/p0qtw6enp8e+8OD0UrK0oFLztSjNzhcKA3WDuJxxAPXzPuPtKkjEY9UUoEWlX/8fgKeu2S8i9JTA==}
     engines: {node: '>= 0.4'}
@@ -6549,8 +8344,8 @@ packages:
     resolution: {integrity: sha512-Ab9bQDQ11lWootZUI5qxgN2ZXwxNI5hTwnsvOc1wyxQ7zQ8OkEDw79mI0+9jI3x432NfwbVRru+3noJfXF6lSQ==}
     hasBin: true
 
-  is-core-module@2.16.0:
-    resolution: {integrity: sha512-urTSINYfAYgcbLb0yDQ6egFm6h3Mo1DcF9EkyXSRjjzdHbsulg01qhwWuXdOoUBuTkbQ80KDboXa0vFJ+BDH+g==}
+  is-core-module@2.16.2:
+    resolution: {integrity: sha512-evOr8xfXKxE6qSR0hSXL2r3sd7ALj8+7jQEUvPYcm5sgZFdJ+AYzT6yNmJenvIYQBgIGwfwz08sL8zoL7yq2BA==}
     engines: {node: '>= 0.4'}
 
   is-data-view@1.0.2:
@@ -6561,16 +8356,15 @@ packages:
     resolution: {integrity: sha512-PwwhEakHVKTdRNVOw+/Gyh0+MzlCl4R6qKvkhuvLtPMggI1WAHt9sOwZxQLSGpUaDnrdyDsomoRgNnCfKNSXXg==}
     engines: {node: '>= 0.4'}
 
-  is-docker@2.2.1:
-    resolution: {integrity: sha512-F+i2BKsFrH66iaUFc0woD8sLy8getkwTwtOBjvs56Cx4CgJDeKQeqfz8wAYiSb8JOprWhHH5p77PbmYCvvUuXQ==}
-    engines: {node: '>=8'}
-    hasBin: true
-
   is-docker@3.0.0:
     resolution: {integrity: sha512-eljcgEDlEns/7AXFosB5K/2nCM4P7FQPkGc/DWLy5rmFEWvZayGrik1d9/QIY5nJ4f9YsVvBkA6kJpHn9rISdQ==}
     engines: {node: ^12.20.0 || ^14.13.1 || >=16.0.0}
     hasBin: true
 
+  is-document.all@1.0.0:
+    resolution: {integrity: sha512-+XSoyS05OdBbhFuELhgTCpFNHkpBOJqtsZfUFFpe5QTw+9Sjbh8zitxhQkYAo6wV7e1Vb8cAPvpCk9jGam/82g==}
+    engines: {node: '>= 0.4'}
+
   is-extglob@2.1.1:
     resolution: {integrity: sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ==}
     engines: {node: '>=0.10.0'}
@@ -6583,16 +8377,12 @@ packages:
     resolution: {integrity: sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==}
     engines: {node: '>=8'}
 
-  is-fullwidth-code-point@4.0.0:
-    resolution: {integrity: sha512-O4L094N2/dZ7xqVdrXhh9r1KODPJpFms8B5sGdJLPy664AgvXsreZUyCQQNItZRDlYug4xStLjNp/sz3HvBowQ==}
-    engines: {node: '>=12'}
-
-  is-fullwidth-code-point@5.0.0:
-    resolution: {integrity: sha512-OVa3u9kkBbw7b8Xw5F9P+D/T9X+Z4+JruYVNapTjPYZYUznQ5YfWeFkOj606XYYW8yugTfC8Pj0hYqvi4ryAhA==}
+  is-fullwidth-code-point@5.1.0:
+    resolution: {integrity: sha512-5XHYaSyiqADb4RnZ1Bdad6cPp8Toise4TzEjcOYDHZkTCbKgiUl7WTUCpNWHuxmDt91wnsZBc9xinNzopv3JMQ==}
     engines: {node: '>=18'}
 
-  is-generator-function@1.0.10:
-    resolution: {integrity: sha512-jsEjy9l3yiXEQ+PsXdmBwEPcOxaXWLspKdplFUVI9vq1iZgIekeC0L167qeu86czQaxed3q/Uzuw0swL0irL8A==}
+  is-generator-function@1.1.2:
+    resolution: {integrity: sha512-upqt1SkGkODW9tsGNG5mtXTXtECizwtS2kA161M+gJPc1xdb/Ax629af6YrTwcOeQHbewrPNlE5Dx7kzvXTizA==}
     engines: {node: '>= 0.4'}
 
   is-glob@4.0.3:
@@ -6604,6 +8394,10 @@ packages:
     engines: {node: '>=18'}
     hasBin: true
 
+  is-in-ssh@1.0.0:
+    resolution: {integrity: sha512-jYa6Q9rH90kR1vKB6NM7qqd1mge3Fx4Dhw5TVlK1MUBqhEOuCagrEHMevNuCcbECmXZ0ThXkRm+Ymr51HwEPAw==}
+    engines: {node: '>=20'}
+
   is-inside-container@1.0.0:
     resolution: {integrity: sha512-KIYLCCJghfHZxqjYBE7rEy0OBuTd5xCHS7tHVgvCLkx7StIoaxwNW3hCALgEUjFfeRk+MG/Qxmp/vtETEF3tRA==}
     engines: {node: '>=14.16'}
@@ -6617,9 +8411,6 @@ packages:
     resolution: {integrity: sha512-qP1vozQRI+BMOPcjFzrjXuQvdak2pHNUMZoeG2eRbiSqyvbEf/wQtEOTOX1guk6E3t36RkaqiSt8A/6YElNxLQ==}
     engines: {node: '>=12'}
 
-  is-lambda@1.0.1:
-    resolution: {integrity: sha512-z7CMFGNrENq5iFB9Bqo64Xk6Y9sg+epq1myIcdHaGnbMTYOxvzsEtdYqQUylB7LxfkvgrrjP32T6Ywciio9UIQ==}
-
   is-map@2.0.3:
     resolution: {integrity: sha512-1Qed0/Hr2m+YqxnM09CjA2d/i6YZNfF6R2oRAOj36eUdS6qIV/huPJNSEpKbupewFs+ZsJlxsjjPbc0/afW6Lw==}
     engines: {node: '>= 0.4'}
@@ -6631,8 +8422,8 @@ packages:
     resolution: {integrity: sha512-5KoIu2Ngpyek75jXodFvnafB6DJgr3u8uuK0LEZJjrU19DrMD3EVERaR8sjz8CCGgpZvxPl9SuE1GMVPFHx1mw==}
     engines: {node: '>= 0.4'}
 
-  is-npm@6.0.0:
-    resolution: {integrity: sha512-JEjxbSmtPSt1c8XTkVrlujcXdKV1/tvuQ7GwKcAlyiVLeYFQ2VHat8xfrDJsIkhCdF/tZ7CiIR3sy141c6+gPQ==}
+  is-npm@6.1.0:
+    resolution: {integrity: sha512-O2z4/kNgyjhQwVR1Wpkbfc19JIhggF97NZNCpWTnjH7kVcZMUrnut9XSN7txI7VdyIYk5ZatOq3zvSuWpU8hoA==}
     engines: {node: ^12.20.0 || ^14.13.1 || >=16.0.0}
 
   is-number-object@1.1.1:
@@ -6647,10 +8438,6 @@ packages:
     resolution: {integrity: sha512-l4RyHgRqGN4Y3+9JHVrNqO+tN0rV5My76uW5/nuO4K1b6vw5G8d/cmFjP9tRfEsdhZNt0IFdZuK/c2Vr4Nb+Qg==}
     engines: {node: '>=0.10.0'}
 
-  is-obj@2.0.0:
-    resolution: {integrity: sha512-drqDG3cbczxxEJRoOXcOjtdp1J/lyp1mNn0xaznRs8+muBhgQcrnbspox5X5fOw0HnMnbfDzvnEMEtqDEJEo8w==}
-    engines: {node: '>=8'}
-
   is-path-inside@4.0.0:
     resolution: {integrity: sha512-lJJV/5dYS+RcL8uQdBDW9c9uWFLLBNRyFhnAKXw5tVqLlKZ4RMGZKv+YQ/IA3OhD+RpbJa1LLFM1FQPGyIXvOA==}
     engines: {node: '>=12'}
@@ -6678,6 +8465,10 @@ packages:
     resolution: {integrity: sha512-7zjFAPO4/gwyQAAgRRmqeEeyIICSdmCqa3tsVHMdBzaXXRiqopZL4Cyghg/XulGWrtABTpbnYYzzIRffLkP4oA==}
     engines: {node: '>=0.10.0'}
 
+  is-safe-filename@0.1.1:
+    resolution: {integrity: sha512-4SrR7AdnY11LHfDKTZY1u6Ga3RuxZdl3YKWWShO5iyuG5h8QS4GD2tOb04peBJ5I7pXbR+CGBNEhTcwK+FzN3g==}
+    engines: {node: '>=20'}
+
   is-set@2.0.3:
     resolution: {integrity: sha512-iPAjerrse27/ygGLxw+EBR9agv9Y6uLeYVJMu+QNCoouJ1/1ri0mGrcWpfCqFZuzzx3WjtwxG098X+n4OuRkPg==}
     engines: {node: '>= 0.4'}
@@ -6690,10 +8481,6 @@ packages:
     resolution: {integrity: sha512-hFoiJiTl63nn+kstHGBtewWSKnQLpyb155KHheA1l39uvtO9nWIop1p3udqPcUd/xbF1VLMO4n7OI6p7RbngDg==}
     engines: {node: '>=8'}
 
-  is-stream@3.0.0:
-    resolution: {integrity: sha512-LnQR4bZ9IADDRSkvpqMGvt/tEJWclzklNgSw48V5EAaAeDd6qGvN8ei6k5p0tvxSR171VmGyHuTiAOfxAbr8kA==}
-    engines: {node: ^12.20.0 || ^14.13.1 || >=16.0.0}
-
   is-stream@4.0.1:
     resolution: {integrity: sha512-Dnz92NInDqYckGEUJv689RbRiTSEHCQ7wOVeALbkOz999YpqT46yMRIGtSNl2iCL1waAZSx40+h59NV/EwzV/A==}
     engines: {node: '>=18'}
@@ -6710,18 +8497,10 @@ packages:
     resolution: {integrity: sha512-9gGx6GTtCQM73BgmHQXfDmLtfjjTUDSyoxTCbp5WtoixAhfgsDirWIcVQ/IHpvI5Vgd5i/J5F7B9cN/WlVbC/w==}
     engines: {node: '>= 0.4'}
 
-  is-text-path@2.0.0:
-    resolution: {integrity: sha512-+oDTluR6WEjdXEJMnC2z6A4FRwFoYuvShVVEGsS7ewc0UTi2QtAKMDJuL4BDEVt+5T7MjFo12RP8ghOM75oKJw==}
-    engines: {node: '>=8'}
-
   is-typed-array@1.1.15:
     resolution: {integrity: sha512-p3EcsicXjit7SaskXHs1hA91QxgTw46Fv6EFKKGS5DRFLD8yKnohjF3hxoju94b/OcMZoQukzpPpBE9uLVKzgQ==}
     engines: {node: '>= 0.4'}
 
-  is-unicode-supported@1.3.0:
-    resolution: {integrity: sha512-43r2mRvz+8JRIKnWJ+3j8JtjRKZ6GmjzfaE/qiBJnikNnYv/6bagRJ1kUhNk8R5EX/GkobD+r+sfxCPJsiKBLQ==}
-    engines: {node: '>=12'}
-
   is-unicode-supported@2.1.0:
     resolution: {integrity: sha512-mE00Gnza5EEB3Ds0HfMyllZzbBrmLOX3vfWoj9A9PEnTfratQ/BcaJOuMhnkhjXvb2+FkY3VuHqtAGpTPmglFQ==}
     engines: {node: '>=18'}
@@ -6730,17 +8509,14 @@ packages:
     resolution: {integrity: sha512-K5pXYOm9wqY1RgjpL3YTkF39tni1XajUIkawTLUo9EZEVUFga5gSQJF8nNS7ZwJQ02y+1YCNYcMh+HIf1ZqE+w==}
     engines: {node: '>= 0.4'}
 
-  is-weakref@1.1.0:
-    resolution: {integrity: sha512-SXM8Nwyys6nT5WP6pltOwKytLV7FqQ4UiibxVmW+EIosHcmCqkkjViTb5SNssDlkCiEYRP1/pdWUKVvZBmsR2Q==}
+  is-weakref@1.1.1:
+    resolution: {integrity: sha512-6i9mGWSlqzNMEqpCp93KwRS1uUOodk2OJ6b+sq7ZPDSy2WuI5NFIxp/254TytR8ftefexkWn5xNiHUNpPOfSew==}
     engines: {node: '>= 0.4'}
 
   is-weakset@2.0.4:
     resolution: {integrity: sha512-mfcwb6IzQyOKTs84CQMrOwW4gQcaTOAWJ0zzJCl2WSPDrWk/OzDaImWFH3djXhb24g4eudZfLRozAvPGw4d9hQ==}
     engines: {node: '>= 0.4'}
 
-  is-what@3.14.1:
-    resolution: {integrity: sha512-sNxgpk9793nzSs7bA6JQJGeIuRBQhAaNGG77kzYQgMkrID+lS6SlK07K5LaptscDlSaIgH+GPFzf+d75FVxozA==}
-
   is-what@4.1.16:
     resolution: {integrity: sha512-ZhMwEosbFJkA0YhFnNDgTM4ZxDRsS6HqTo7qsZM08fehyRYIYa0yHu5R6mgo1n/8MgaPBXiPimPD77baVFYg+A==}
     engines: {node: '>=12.13'}
@@ -6749,36 +8525,44 @@ packages:
     resolution: {integrity: sha512-eXK1UInq2bPmjyX6e3VHIzMLobc4J94i4AWn+Hpq3OU5KkrRC96OAcR3PRJ/pGu6m8TRnBHP9dkXQVsT/COVIA==}
     engines: {node: '>=0.10.0'}
 
-  is-wsl@2.2.0:
-    resolution: {integrity: sha512-fKzAra0rGJUUBwGBgNkHZuToZcn+TtXHpeCgmkMJMMYx1sQDYaCSyjJBSCa2nH1DGm7s3n1oBnohoVTBaN7Lww==}
-    engines: {node: '>=8'}
-
-  is-wsl@3.1.0:
-    resolution: {integrity: sha512-UcVfVfaK4Sc4m7X3dUSoHoozQGBEFeDC+zVo06t98xe8CzHSZZBekNXH+tu0NalHolcJ/QAGqS46Hef7QXBIMw==}
+  is-wsl@3.1.1:
+    resolution: {integrity: sha512-e6rvdUCiQCAuumZslxRJWR/Doq4VpPR82kqclvcS0efgt430SlGIk05vdCN58+VrzgtIcfNODjozVielycD4Sw==}
     engines: {node: '>=16'}
 
-  is64bit@2.0.0:
-    resolution: {integrity: sha512-jv+8jaWCl0g2lSBkNSVXdzfBA0npK1HGC2KtWM9FumFRoGS94g3NbCCLVnCYHLjp4GrW2KZeeSTMo5ddtznmGw==}
-    engines: {node: '>=18'}
-
   isarray@1.0.0:
     resolution: {integrity: sha512-VLghIWNM6ELQzo7zwmcg0NmTVyWKYjvIeM83yjp0wRDTmUnrM678fQbcKBo6n2CJEF0szoG//ytg+TKla89ALQ==}
 
   isarray@2.0.5:
     resolution: {integrity: sha512-xHjhDr3cNBK0BzdUJSPXZntQUx/mwMS5Rw4A7lPJ90XGAO6ISP/ePDNuo0vhqOZU+UD5JoodwCAAoZQd3FeAKw==}
 
+  isbinaryfile@4.0.10:
+    resolution: {integrity: sha512-iHrqe5shvBUcFbmZq9zOQHBoeOhZJu6RQGrDpBgenUm/Am+F3JM2MgQj+rK3Z601fzrL5gLZWtAPH2OBaSVcyw==}
+    engines: {node: '>= 8.0.0'}
+
+  isbinaryfile@5.0.7:
+    resolution: {integrity: sha512-gnWD14Jh3FzS3CPhF0AxNOJ8CxqeblPTADzI38r0wt8ZyQl5edpy75myt08EG2oKvpyiqSqsx+Wkz9vtkbTqYQ==}
+    engines: {node: '>= 18.0.0'}
+
   isexe@2.0.0:
     resolution: {integrity: sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw==}
 
+  isexe@3.1.5:
+    resolution: {integrity: sha512-6B3tLtFqtQS4ekarvLVMZ+X+VlvQekbe4taUkf/rhVO3d/h0M2rfARm/pXLcPEsjjMsFgrFgSrhQIxcSVrBz8w==}
+    engines: {node: '>=18'}
+
+  isexe@4.0.0:
+    resolution: {integrity: sha512-FFUtZMpoZ8RqHS3XeXEmHWLA4thH+ZxCv2lOiPIn1Xc7CxrqhWzNSDzD+/chS/zbYezmiwWLdQC09JdQKmthOw==}
+    engines: {node: '>=20'}
+
   jackspeak@3.4.3:
     resolution: {integrity: sha512-OGlZQpz2yfahA/Rd1Y8Cd9SIEsqvXkLVoSw/cgwhnhFMDbsQFeZYoJJ7bIZBS9BcamUW96asq/npPWugM+RQBw==}
 
-  jackspeak@4.0.2:
-    resolution: {integrity: sha512-bZsjR/iRjl1Nk1UkjGpAzLNfQtzuijhn2g+pbZb98HQ1Gk8vM9hfbxeMBP+M2/UUdwj0RqGG3mlvk2MsAqwvEw==}
+  jackspeak@4.2.3:
+    resolution: {integrity: sha512-ykkVRwrYvFm1nb2AJfKKYPr0emF6IiXDYUaFx4Zn9ZuIH7MrzEZ3sD5RlqGXNRpHtvUHJyOnCEFxOlNDtGo7wg==}
     engines: {node: 20 || >=22}
 
-  jake@10.9.2:
-    resolution: {integrity: sha512-2P4SQ0HrLQ+fw6llpLnOaGAvN2Zu6778SJMrCUwns4fOoG9ayrTiZk3VV8sCPkVZF8ab0zksVpS8FDY5pRCNBA==}
+  jake@10.9.4:
+    resolution: {integrity: sha512-wpHYzhxiVQL+IV05BLE2Xn34zW1S223hvjtqk0+gsPrwd/8JNLXJgZZM/iPFsYc1xyphF+6M6EvdE5E9MBGkDA==}
     engines: {node: '>=10'}
     hasBin: true
 
@@ -6786,28 +8570,30 @@ packages:
     resolution: {integrity: sha512-/imKNG4EbWNrVjoNC/1H5/9GFy+tqjGBHCaSsN+P2RnPqjsLmv6UD3Ej+Kj8nBWaRAwyk7kK5ZUc+OEatnTR3A==}
     hasBin: true
 
-  jiti@2.4.2:
-    resolution: {integrity: sha512-rg9zJN+G4n2nfJl5MW3BMygZX56zKPNVEYYqq7adpmMh4Jn2QNEwhvQlFy6jPVdcod7txZtKHWnyZiA3a0zP7A==}
+  jiti@2.6.1:
+    resolution: {integrity: sha512-ekilCSN1jwRvIbgeg/57YFh8qQDNbwDb9xT/qu2DAHbFFZUicIl4ygVaAvzveMhMVr3LnpSKTNnwt8PoOfmKhQ==}
+    hasBin: true
+
+  jiti@2.7.0:
+    resolution: {integrity: sha512-AC/7JofJvZGrrneWNaEnJeOLUx+JlGt7tNa0wZiRPT4MY1wmfKjt2+6O2p2uz2+skll8OZZmJMNqeke7kKbNgQ==}
     hasBin: true
 
   jju@1.4.0:
     resolution: {integrity: sha512-8wb9Yw966OSxApiCt0K3yNJL8pnNeIv+OEq2YMidz4FKP6nonSRoOXc80iXY4JaN2FC11B9qsNmDsm+ZOfMROA==}
 
-  js-base64@3.7.7:
-    resolution: {integrity: sha512-7rCnleh0z2CkXhH67J8K1Ytz0b2Y+yxTPL+/KOJoa20hfnVQ/3/T6W/KflYI4bRHRagNeXeU2bkNGI3v1oS/lw==}
+  js-base64@3.9.2:
+    resolution: {integrity: sha512-6zayE8QlUdiweYI6cETD/XBSqFcoCUlufn/29PJR99r82x1yDnIprRca0YvAYpAW+ez0GuQkVBC6xG5QkD7OjA==}
 
-  js-beautify@1.15.1:
-    resolution: {integrity: sha512-ESjNzSlt/sWE8sciZH8kBF8BPlwXPwhR6pWKAw8bw4Bwj+iZcnKW6ONWUutJ7eObuBZQpiIb8S7OYspWrKt7rA==}
+  js-beautify@1.15.4:
+    resolution: {integrity: sha512-9/KXeZUKKJwqCXUdBxFJ3vPh467OCckSBmYDwSK/EtV090K+iMJ7zx2S3HLVDIWFQdqMIsZWbnaGiba18aWhaA==}
     engines: {node: '>=14'}
     hasBin: true
 
-  js-cookie@3.0.5:
-    resolution: {integrity: sha512-cEiJEAEoIbWfCZYKWhVwFuvPX1gETRYPw6LlaTKoxD3s2AkXzkCjnp6h0V77ozyqj0jakteJ4YqDJT830+lVGw==}
-    engines: {node: '>=14'}
+  js-cookie@3.0.8:
+    resolution: {integrity: sha512-yeJd4aNAdYZQjaon2bpD/Gb0B/omw7HQOsynXXcOiWVCacbBcPlgn8S/d1X6blFSaHao7ozqtW7NZW19xpCtIw==}
 
-  js-levenshtein@1.1.6:
-    resolution: {integrity: sha512-X2BB11YZtrRqY4EnQcLX5Rh373zbK4alC1FW7D7MBhL2gtcC17cTnr6DmfHZeS0s2rTHjUTMMHfG7gO8SSdw+g==}
-    engines: {node: '>=0.10.0'}
+  js-tokens@10.0.0:
+    resolution: {integrity: sha512-lM/UBzQmfJRo9ABXbPWemivdCW8V2G8FHaHdypQaIy523snUjog0W71ayWXTjiR+ixeMyVHN2XcpnTd/liPg/Q==}
 
   js-tokens@4.0.0:
     resolution: {integrity: sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==}
@@ -6815,35 +8601,26 @@ packages:
   js-tokens@9.0.1:
     resolution: {integrity: sha512-mxa9E9ITFOt0ban3j6L5MpjwegGz6lBQmM1IJkWeBZGcMxto50+eWdjC/52xDbS2vy0k7vIMK0Fe2wfL9OQSpQ==}
 
-  js-yaml@3.14.1:
-    resolution: {integrity: sha512-okMH7OXXJ7YrN9Ok3/SXrnu4iX9yOk+25nqX4imS2npuvTYDmo/QEZoqwZkYaIDk3jVvBOTOIEgEhaLOynBS9g==}
+  js-yaml@3.15.1:
+    resolution: {integrity: sha512-S99WuO3HlhO3XN41EtYUNl9zzXjoJx7QvmipxsJVxtCBT0YHEFy+iOJhjSvrmV12nYhWpZaM8lPHkJm0yUMbag==}
     hasBin: true
 
-  js-yaml@4.1.0:
-    resolution: {integrity: sha512-wpxZs9NoxZaJESJGIZTyDEaYpl0FKSA+FB9aJiyemKhMwkxQg63h4T1KJgUGHpTqPDNRcmmYLugrRjJlBtWvRA==}
+  js-yaml@4.3.1:
+    resolution: {integrity: sha512-CY6crGq313MX8GkwvB7tzgp99vjQxY1++5y10/BKN/GUfHqWaOGQMNZkBvqSzsZKWk/ijwHlWzzkLulsGHhjWQ==}
     hasBin: true
 
-  jsbn@1.1.0:
-    resolution: {integrity: sha512-4bYVV3aAMtDTTu4+xsDYa6sy9GyJ69/amsu9sYF2zqjiEoZA5xJi3BrfX3uY+/IekIu7MwdObdbDWpoZdBv3/A==}
-
-  jsdoc-type-pratt-parser@4.1.0:
-    resolution: {integrity: sha512-Hicd6JK5Njt2QB6XYFS7ok9e37O8AYk3jTcppG4YVQnYjOemymvTcmc7OWsmq/Qqj5TdRFO5/x/tIPmBeRtGHg==}
-    engines: {node: '>=12.0.0'}
-
-  jsesc@0.5.0:
-    resolution: {integrity: sha512-uZz5UnB7u4T9LvwmFqXii7pZSouaRPorGs5who1Ip7VO0wxanFvBL7GkM6dTHlgX+jhBApRetaWpnDabOeTcnA==}
-    hasBin: true
-
-  jsesc@3.0.2:
-    resolution: {integrity: sha512-xKqzzWXDttJuOcawBt4KnKHHIf5oQ/Cxax+0PWFG+DFDgHNAdi+TXECADI+RYiFUMmx8792xsMbbgXj4CwnP4g==}
-    engines: {node: '>=6'}
-    hasBin: true
+  jsdoc-type-pratt-parser@7.2.0:
+    resolution: {integrity: sha512-dh140MMgjyg3JhJZY/+iEzW+NO5xR2gpbDFKHqotCmexElVntw7GjWjt511+C/Ef02RU5TKYrJo/Xlzk+OLaTw==}
+    engines: {node: '>=20.0.0'}
 
   jsesc@3.1.0:
     resolution: {integrity: sha512-/sM3dO2FOzXjKQhJuo0Q173wf2KOo8t4I8vHy6lF9poUp7bKT0/NHE8fPX23PwfhnykfqnC2xRxOnVw5XuGIaA==}
     engines: {node: '>=6'}
     hasBin: true
 
+  json-bigint@1.0.0:
+    resolution: {integrity: sha512-SiPv/8VpZuWbvLSMtTDU8hEfrZWg/mH/nV/b4o0CYbSxu1UIQPLdwKOCIyLQX+VIPO5vrLX3i8qtqFyhdPSUSQ==}
+
   json-buffer@3.0.1:
     resolution: {integrity: sha512-4bV5BfR2mqfQTJm+V5tPPdf+ZpuhiIvTuAB5g8kcrXOZpTT/QwwVRWBywX1ozr6lEuPdbHxwaJlm9G6mI2sfSQ==}
 
@@ -6856,30 +8633,30 @@ packages:
   json-schema-traverse@1.0.0:
     resolution: {integrity: sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug==}
 
-  json-schema@0.4.0:
-    resolution: {integrity: sha512-es94M3nTIfsEPisRafak+HDLfHXnKBhV3vU5eqPcS3flIWqcxJWgXHXiey3YrpaNsanY5ei1VoYEbOzijuq9BA==}
-
   json-stable-stringify-without-jsonify@1.0.1:
     resolution: {integrity: sha512-Bdboy+l7tA3OGW6FjyFHWkP5LuByj1Tk33Ljyq0axyzdk9//JSi2u3fP1QSmd1KNwq6VOKYGlAu87CisVir6Pw==}
 
+  json-stringify-safe@5.0.1:
+    resolution: {integrity: sha512-ZClg6AaYvamvYEE82d3Iyd3vSSIjQ+odgjaTzRuO3s7toCdFKczob2i0zCh7JE8kWn17yvAWhUVxvqGwUalsRA==}
+
   json5@2.2.3:
     resolution: {integrity: sha512-XmOWe7eyHYH14cLdVPoyg+GOH3rYX++KpzrylJwSW98t3Nk+U8XOl8FWKOgwtzdb8lXGf6zYwDUzeHMWfxasyg==}
     engines: {node: '>=6'}
     hasBin: true
 
-  jsonc-eslint-parser@2.4.0:
-    resolution: {integrity: sha512-WYDyuc/uFcGp6YtM2H0uKmUwieOuzeE/5YocFJLnLfclZ4inf3mRn8ZVy1s7Hxji7Jxm6Ss8gqpexD/GlKoGgg==}
+  jsonc-eslint-parser@2.4.2:
+    resolution: {integrity: sha512-1e4qoRgnn448pRuMvKGsFFymUCquZV0mpGgOyIKNgD3JVDTsVJyRBGH/Fm0tBb8WsWGgmB1mDe6/yJMQM37DUA==}
     engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
 
+  jsonc-eslint-parser@3.3.0:
+    resolution: {integrity: sha512-hYTGkHGNRZnXOFZ1urhINADoqDrGfpy53cjw+dxk84QE0pUDujQzeUeamNs6Mz44/TKD49z2x6/GVSu4ZrtA+Q==}
+    engines: {node: ^20.19.0 || ^22.13.0 || >=24}
+
   jsonfile@4.0.0:
     resolution: {integrity: sha512-m6F1R3z8jjlf2imQHS2Qez5sjKWQzbuuhuJ/FKYFRZvPE3PuHcSMVZzfsLhGVOkfd20obL5SWEBew5ShlquNxg==}
 
-  jsonfile@6.1.0:
-    resolution: {integrity: sha512-5dgndWOriYSm5cnYaJNhalLNDKOqFwyDB/rr1E9ZsGciGvKPs8R2xYGCacuf3z6K1YKDz182fd+fY3cn3pMqXQ==}
-
-  jsonparse@1.3.1:
-    resolution: {integrity: sha512-POQXvpdL69+CluYsillJ7SUhKvytYjW9vG/GKpnf+xP8UWgYEM/RaMzHHofbALDiKbbP1W8UEYmgGl39WkPZsg==}
-    engines: {'0': node >= 0.2.0}
+  jsonfile@6.2.1:
+    resolution: {integrity: sha512-zwOTdL3rFQ/lRdBnntKVOX6k5cKJwEc1HdilT71BWEu7J41gXIB2MRp+vxduPSwZJPWBxEzv4yH1wYLJGUHX4Q==}
 
   jsonpointer@5.0.1:
     resolution: {integrity: sha512-p/nXbhSEcu3pZRdkW1OfJhpsVtW1gd4Wa1fnQc9YLiTfAjn0312eMKimbdIQzuZl9aa9xUGaRlP9T/CJE/ditQ==}
@@ -6891,38 +8668,107 @@ packages:
   keyv@4.5.4:
     resolution: {integrity: sha512-oxVHkHR/EJf2CNXnWxRLW6mg7JyCCUcG0DtEGmL2ctUo1PNTin1PUil+r/+4r5MpVgC/fn1kjsx7mjSujKqIpw==}
 
+  keyv@5.6.0:
+    resolution: {integrity: sha512-CYDD3SOtsHtyXeEORYRx2qBtpDJFjRTGXUtmNEMGyzYOKj1TE3tycdlho7kA1Ufx9OYWZzg52QFBGALTirzDSw==}
+
   kind-of@6.0.3:
     resolution: {integrity: sha512-dcS1ul+9tmeD95T+x28/ehLgd9mENa3LsvDTtzm3vyBEO7RPptvAD+t44WVXaUjTBRcrpFeFlC8WCruUR456hw==}
     engines: {node: '>=0.10.0'}
 
+  kleur@4.1.5:
+    resolution: {integrity: sha512-o+NO+8WrRiQEE4/7nwRJhN1HWpVmJm511pBHUxPLtp0BUISzlBplORYSmTclCnJvQq2tKu/sgl3xVpkc7ZWuQQ==}
+    engines: {node: '>=6'}
+
   klona@2.0.6:
     resolution: {integrity: sha512-dhG34DXATL5hSxJbIexCft8FChFXtmskoZYnoPWjXQuebWYCNkVeV3KkGegCK9CP1oswI/vQibS2GY7Em/sJJA==}
     engines: {node: '>= 8'}
 
-  knitwork@1.2.0:
-    resolution: {integrity: sha512-xYSH7AvuQ6nXkq42x0v5S8/Iry+cfulBz/DJQzhIyESdLD7425jXsPy4vn5cCXU+HhRN2kVw51Vd1K6/By4BQg==}
+  knip@6.32.1:
+    resolution: {integrity: sha512-mIiIHMTJVUgSlz0mxEgPt7wg8DmfbCp1Txqab3WpbMCJF7YHvHtC9jeAHHXfISMl72N8WzhyG71SQlaqCOGZtg==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    hasBin: true
 
-  known-css-properties@0.35.0:
-    resolution: {integrity: sha512-a/RAk2BfKk+WFGhhOCAYqSiFLc34k8Mt/6NWRI4joER0EYUzXIcFivjjnoD3+XU1DggLn/tZc3DOAgke7l8a4A==}
+  knitwork@1.3.0:
+    resolution: {integrity: sha512-4LqMNoONzR43B1W0ek0fhXMsDNW/zxa1NdFAVMY+k28pgZLovR4G3PB5MrpTxCy1QaZCqNoiaKPr5w5qZHfSNw==}
+
+  known-css-properties@0.37.0:
+    resolution: {integrity: sha512-JCDrsP4Z1Sb9JwG0aJ8Eo2r7k4Ou5MwmThS/6lcIe1ICyb7UBJKGRIUUdqc2ASdE/42lgz6zFUnzAIhtXnBVrQ==}
 
   kolorist@1.8.0:
     resolution: {integrity: sha512-Y+60/zizpJ3HRH8DCss+q95yr6145JXZo46OTpFvDZWLfRCE4qChOyk1b26nMaNpfHHgxagk9dXT5OP0Tfe+dQ==}
 
-  ky@1.7.4:
-    resolution: {integrity: sha512-zYEr/gh7uLW2l4su11bmQ2M9xLgQLjyvx58UyNM/6nuqyWFHPX5ktMjvpev3F8QWdjSsHUpnWew4PBCswBNuMQ==}
+  ky@1.14.3:
+    resolution: {integrity: sha512-9zy9lkjac+TR1c2tG+mkNSVlyOpInnWdSMiue4F+kq8TwJSgv6o8jhLRg8Ho6SnZ9wOYUq/yozts9qQCfk7bIw==}
     engines: {node: '>=18'}
 
   latest-version@9.0.0:
     resolution: {integrity: sha512-7W0vV3rqv5tokqkBAFV1LbR7HPOWzXQDpDgEuib/aJ1jsZZx6x3c2mBI+TJhJzOhkGeaLbCKEHXEXLfirtG2JA==}
     engines: {node: '>=18'}
 
+  lazy-val@1.0.5:
+    resolution: {integrity: sha512-0/BnGCCfyUMkBpeDgWihanIAF9JmZhHBgUhEqzvf+adhNGLoP6TaiI5oF8oyb3I45P+PcnrqihSf01M0l0G5+Q==}
+
   lazystream@1.0.1:
     resolution: {integrity: sha512-b94GiNHQNy6JNTrt5w6zNyffMrNkXZb3KTkCZJb2V1xaEGCk093vkZ2jk3tpaeP33/OiXC+WvK9AxUebnf5nbw==}
     engines: {node: '>= 0.6.3'}
 
-  less@4.2.1:
-    resolution: {integrity: sha512-CasaJidTIhWmjcqv0Uj5vccMI7pJgfD9lMkKtlnTHAdJdYK/7l8pM9tumLyJ0zhbD4KJLo/YvTj+xznQd5NBhg==}
-    engines: {node: '>=6'}
+  lefthook-darwin-arm64@2.1.10:
+    resolution: {integrity: sha512-nw+X8wRNDoUUV6WSteyKBbcLySq+fsmZt5WV/s50ZJpysmsDKJOUMln6SllNfP+60dzUahAO7REco/2633BsLg==}
+    cpu: [arm64]
+    os: [darwin]
+
+  lefthook-darwin-x64@2.1.10:
+    resolution: {integrity: sha512-KQ/bHmvpkFdHMn4pZnUdTf+GuSC+aBBgBTxZT4GW+6cSf+qbErKZBhK7cH6BmILsvx43+VzEArvHYY7YOfRFOQ==}
+    cpu: [x64]
+    os: [darwin]
+
+  lefthook-freebsd-arm64@2.1.10:
+    resolution: {integrity: sha512-8su6DwydP7+pv7kG0zCtjphqsw4ouOnfexRUErapy5GTxYBoUOhYz3RSHTSWNRsK6W4jva7FPUh2Lp5/PSn30w==}
+    cpu: [arm64]
+    os: [freebsd]
+
+  lefthook-freebsd-x64@2.1.10:
+    resolution: {integrity: sha512-GeAJEFxko3Lk+AsnS3NleAFrpyMLFUKOlgJvPKuU0xHwVEI/z+ZoCcmuO0BX+4CS0NLbZhC/YQAvBASqDvvVdQ==}
+    cpu: [x64]
+    os: [freebsd]
+
+  lefthook-linux-arm64@2.1.10:
+    resolution: {integrity: sha512-1sHTCmpTWjVMs+yKPBLRNT1kuuIr1yjietlk7rCB6wFPVOS6Ph3o2zPFH2AvW1UymHlqwyHXzBr9EtDpQ7j1mQ==}
+    cpu: [arm64]
+    os: [linux]
+
+  lefthook-linux-x64@2.1.10:
+    resolution: {integrity: sha512-z/VlRB3bh6mBvW3r1rwnJ5vP8z+Krx5gJzkZ4veDXh+6FlRTx8wtd3g3fllOv/yZMxkgmL3fQoFXv05Esa7vBQ==}
+    cpu: [x64]
+    os: [linux]
+
+  lefthook-openbsd-arm64@2.1.10:
+    resolution: {integrity: sha512-430zL8sSIKw5P0YXGG6PB+eAhHa06n0PXuaERaAQE4Ss3odfqwnl5Mq9hQmkEnOS1EGiQEKkd0UHv/i4PtMNIQ==}
+    cpu: [arm64]
+    os: [openbsd]
+
+  lefthook-openbsd-x64@2.1.10:
+    resolution: {integrity: sha512-bgkO8PphGZVDhQgCJ524aYYPI5491pVmCiLPGjBIo1AvOSlIyw4N1Y+1C3QfqwEmechzw+Aq16SNc8pqv6UuXg==}
+    cpu: [x64]
+    os: [openbsd]
+
+  lefthook-windows-arm64@2.1.10:
+    resolution: {integrity: sha512-5Q6etF0Fla2DDA4ilDySrdNgiR5+W7cJZwnZ69Je3kvWCaWm4wnkuc8FEdjp3kiL2x3ZXipdI00f5vpO8aWmog==}
+    cpu: [arm64]
+    os: [win32]
+
+  lefthook-windows-x64@2.1.10:
+    resolution: {integrity: sha512-c/XH8YZtylG4XaxzqFfXluvq2LXq2W/p54Bnzn3+Z7E5X2Fk3JlFJAibulMbIt2+w8T7UI/r97ok5GqE4kGaeA==}
+    cpu: [x64]
+    os: [win32]
+
+  lefthook@2.1.10:
+    resolution: {integrity: sha512-K7mM4WoqMwqfXYK11EHy+lSH1uW8XHni3Yn/bSqyerPkUPygGdf3xn18JoV5HyA06xuQL3ofGAOjG01QX9oJ4w==}
+    hasBin: true
+
+  less@4.8.1:
+    resolution: {integrity: sha512-jQ3lRIo1aUtiWVYXZ7mk4+V4BjCGswF3IxTLJ+4RUta8ZiHh8lhkig2G8dya2eCcyR1dYUvzuV46EkJN8PSwww==}
+    engines: {node: '>=18'}
     hasBin: true
 
   leven@3.1.0:
@@ -6936,6 +8782,154 @@ packages:
   lie@3.3.0:
     resolution: {integrity: sha512-UaiMJzeWRlEujzAuw5LokY1L5ecNQYZKfmyZ9L7wDHb/p5etKaxXhohBcrw0EYby+G/NA52vRSN4N39dxHAIwQ==}
 
+  lightningcss-android-arm64@1.32.0:
+    resolution: {integrity: sha512-YK7/ClTt4kAK0vo6w3X+Pnm0D2cf2vPHbhOXdoNti1Ga0al1P4TBZhwjATvjNwLEBCnKvjJc2jQgHXH0NEwlAg==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [arm64]
+    os: [android]
+
+  lightningcss-android-arm64@1.33.0:
+    resolution: {integrity: sha512-gEpRTalKdosp4Bb8qWtc2iOgE5SeIHlpS1up9bFq2wAyYhl1UdTObYiHe98zEM9SQvSoqQZ1IQD0JNpg3Ml5pg==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [arm64]
+    os: [android]
+
+  lightningcss-darwin-arm64@1.32.0:
+    resolution: {integrity: sha512-RzeG9Ju5bag2Bv1/lwlVJvBE3q6TtXskdZLLCyfg5pt+HLz9BqlICO7LZM7VHNTTn/5PRhHFBSjk5lc4cmscPQ==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [arm64]
+    os: [darwin]
+
+  lightningcss-darwin-arm64@1.33.0:
+    resolution: {integrity: sha512-Sciaz8eenNTKn9b3t7+xr0ipTp9YxKQY4npwQ3mrRuL0BAVHBLyZxofhaKBAVtzmtRZ/zTyo0/to4B1uWG/Djg==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [arm64]
+    os: [darwin]
+
+  lightningcss-darwin-x64@1.32.0:
+    resolution: {integrity: sha512-U+QsBp2m/s2wqpUYT/6wnlagdZbtZdndSmut/NJqlCcMLTWp5muCrID+K5UJ6jqD2BFshejCYXniPDbNh73V8w==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [x64]
+    os: [darwin]
+
+  lightningcss-darwin-x64@1.33.0:
+    resolution: {integrity: sha512-Z5UPAxzrjlWNNyGy6i65cJzzvgJ5D3T6wMvs+gWpY9d7qRhANrxqAp6LhxIgZhWEw18RfJTGcRxjuLIBr+m8XQ==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [x64]
+    os: [darwin]
+
+  lightningcss-freebsd-x64@1.32.0:
+    resolution: {integrity: sha512-JCTigedEksZk3tHTTthnMdVfGf61Fky8Ji2E4YjUTEQX14xiy/lTzXnu1vwiZe3bYe0q+SpsSH/CTeDXK6WHig==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [x64]
+    os: [freebsd]
+
+  lightningcss-freebsd-x64@1.33.0:
+    resolution: {integrity: sha512-QQM/Ti/hQajJwCY+RiWuCZ9sdtI/XQk7nDK5vC8kkdwixezOlDgvDx7+RT+QjK6FcFT4MpsuoBnHIo/O3StRRg==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [x64]
+    os: [freebsd]
+
+  lightningcss-linux-arm-gnueabihf@1.32.0:
+    resolution: {integrity: sha512-x6rnnpRa2GL0zQOkt6rts3YDPzduLpWvwAF6EMhXFVZXD4tPrBkEFqzGowzCsIWsPjqSK+tyNEODUBXeeVHSkw==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [arm]
+    os: [linux]
+
+  lightningcss-linux-arm-gnueabihf@1.33.0:
+    resolution: {integrity: sha512-N7FVBe6iS24MlM6R/4RBTxGhQheZGs7tiQ9U32UtF75NzP5Q7xWPRqLBCKxlRQRk3rY1jCIPLzx7WzOhuUIRLQ==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [arm]
+    os: [linux]
+
+  lightningcss-linux-arm64-gnu@1.32.0:
+    resolution: {integrity: sha512-0nnMyoyOLRJXfbMOilaSRcLH3Jw5z9HDNGfT/gwCPgaDjnx0i8w7vBzFLFR1f6CMLKF8gVbebmkUN3fa/kQJpQ==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [arm64]
+    os: [linux]
+    libc: [glibc]
+
+  lightningcss-linux-arm64-gnu@1.33.0:
+    resolution: {integrity: sha512-j2v/itmy4HlNxlc6voKXYgBqNi0Ng2LShg4z7GufpEgs05P+2suBVyi9I6YHq5uoVFx9ETin3eCEhLVyXGQnKg==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [arm64]
+    os: [linux]
+    libc: [glibc]
+
+  lightningcss-linux-arm64-musl@1.32.0:
+    resolution: {integrity: sha512-UpQkoenr4UJEzgVIYpI80lDFvRmPVg6oqboNHfoH4CQIfNA+HOrZ7Mo7KZP02dC6LjghPQJeBsvXhJod/wnIBg==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [arm64]
+    os: [linux]
+    libc: [musl]
+
+  lightningcss-linux-arm64-musl@1.33.0:
+    resolution: {integrity: sha512-yiO5ROMuYQgXbC60yjZU5CYSFZGKXL0HFATXt9mHJn1+zW55oCtMI9NfcVhYLMFDL7gV7oBPon/EmMMGg2OvtQ==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [arm64]
+    os: [linux]
+    libc: [musl]
+
+  lightningcss-linux-x64-gnu@1.32.0:
+    resolution: {integrity: sha512-V7Qr52IhZmdKPVr+Vtw8o+WLsQJYCTd8loIfpDaMRWGUZfBOYEJeyJIkqGIDMZPwPx24pUMfwSxxI8phr/MbOA==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [x64]
+    os: [linux]
+    libc: [glibc]
+
+  lightningcss-linux-x64-gnu@1.33.0:
+    resolution: {integrity: sha512-ar+Ju7LmcN0Jo4FpL4hpFybwNG9/3A/Br5KW2n2jyODg3MEZXaDYADdemoNS+BDNfMgKvylJLj4S5tyRActuAg==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [x64]
+    os: [linux]
+    libc: [glibc]
+
+  lightningcss-linux-x64-musl@1.32.0:
+    resolution: {integrity: sha512-bYcLp+Vb0awsiXg/80uCRezCYHNg1/l3mt0gzHnWV9XP1W5sKa5/TCdGWaR/zBM2PeF/HbsQv/j2URNOiVuxWg==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [x64]
+    os: [linux]
+    libc: [musl]
+
+  lightningcss-linux-x64-musl@1.33.0:
+    resolution: {integrity: sha512-RYiYbkokw0trfKqqzfF55lginwEPrD3OJDfTuJzFs1MK6iFnDenaz1fqLLtX4ITG3OktJQXOeTaw1awrBAlZPw==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [x64]
+    os: [linux]
+    libc: [musl]
+
+  lightningcss-win32-arm64-msvc@1.32.0:
+    resolution: {integrity: sha512-8SbC8BR40pS6baCM8sbtYDSwEVQd4JlFTOlaD3gWGHfThTcABnNDBda6eTZeqbofalIJhFx0qKzgHJmcPTnGdw==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [arm64]
+    os: [win32]
+
+  lightningcss-win32-arm64-msvc@1.33.0:
+    resolution: {integrity: sha512-1K+MPfLSFVpphzpdbfkhlWk6wBrTObBzS2T6db10PNOZgR9GoVsAWzwNyuhUYYbTp23j+4RrncfujZ4uAzXvwA==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [arm64]
+    os: [win32]
+
+  lightningcss-win32-x64-msvc@1.32.0:
+    resolution: {integrity: sha512-Amq9B/SoZYdDi1kFrojnoqPLxYhQ4Wo5XiL8EVJrVsB8ARoC1PWW6VGtT0WKCemjy8aC+louJnjS7U18x3b06Q==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [x64]
+    os: [win32]
+
+  lightningcss-win32-x64-msvc@1.33.0:
+    resolution: {integrity: sha512-OlEICDx/Xl0FqSp4bry8zFnCvGpig3Gl4gCquvYwHuqJKEC1+n9NgDniFvqHGmMv1ZkqDJrDqKKSykTDX+ehuA==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [x64]
+    os: [win32]
+
+  lightningcss@1.32.0:
+    resolution: {integrity: sha512-NXYBzinNrblfraPGyrbPoD19C1h9lfI/1mzgWYvXUTe414Gz/X1FD2XBZSZM7rRTrMA8JL3OtAaGifrIKhQ5yQ==}
+    engines: {node: '>= 12.0.0'}
+
+  lightningcss@1.33.0:
+    resolution: {integrity: sha512-WkUDrojuJs0xkgGf2udWxa3yGBRxPtxUkB79i6aCZLRgc7PM8fZe9TosfPDcvEpQZbuFASnHYmRLBLUbmLOIIA==}
+    engines: {node: '>= 12.0.0'}
+
   lilconfig@3.1.3:
     resolution: {integrity: sha512-/vlFKAoH5Cgt3Ie+JLhRbwOsCQePABiU3tJ1egGvyQ+33R/vcwM2Zl2QR/LzjsBeItPt3oSVXapn+m4nQDvpzw==}
     engines: {node: '>=14'}
@@ -6943,27 +8937,30 @@ packages:
   lines-and-columns@1.2.4:
     resolution: {integrity: sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg==}
 
-  linkify-it@5.0.0:
-    resolution: {integrity: sha512-5aHCbzQRADcdP+ATqnDuhhJ/MRIqDkZX5pyjFHRRysS8vZ5AbqGEoFIb6pYHPZ+L/OC2Lc+xT8uHVVR5CAK/wQ==}
+  linkify-it@5.0.2:
+    resolution: {integrity: sha512-ONTm2jCMAVZjgQa/Fy1kScXsuOoF5NPTsoFBdE1KVIZ2vAh/r9+Bqo+0jINCBYnavTPQZz38QzFTme79ENoN3Q==}
 
-  lint-staged@15.2.11:
-    resolution: {integrity: sha512-Ev6ivCTYRTGs9ychvpVw35m/bcNDuBN+mnTeObCL5h+boS5WzBEC6LHI4I9F/++sZm1m+J2LEiy0gxL/R9TBqQ==}
-    engines: {node: '>=18.12.0'}
-    hasBin: true
+  linkifyjs@4.3.3:
+    resolution: {integrity: sha512-P8aEP5U/D1/IlTY2OeYsErdwh9bGuLE30NcXtKEjgdHcahveQoQwM2yZNsioQHsWFz0P7KKudisbrzCgR0sDHg==}
 
   listenercount@1.0.1:
     resolution: {integrity: sha512-3mk/Zag0+IJxeDrxSgaDPy4zZ3w05PRZeJNnlWhzFz5OkX49J4krc+A8X2d2M69vGMBEX0uyl8M+W+8gH+kBqQ==}
 
-  listhen@1.9.0:
-    resolution: {integrity: sha512-I8oW2+QL5KJo8zXNWX046M134WchxsXC7SawLPvRQpogCbkyQIaFxPE89A2HiwR7vAK2Dm2ERBAmyjTYGYEpBg==}
+  listhen@1.10.1:
+    resolution: {integrity: sha512-6nt/86SkqUQSLW1ofz8MxC6RhRMqOl3ONISe6qqvJ3xj09aJWQx6DhgSZpugs3PX4PXdOas/WD6A9jx6J2N19A==}
     hasBin: true
+    peerDependencies:
+      '@parcel/watcher': ^2.5.6
+    peerDependenciesMeta:
+      '@parcel/watcher':
+        optional: true
 
-  listr2@8.2.5:
-    resolution: {integrity: sha512-iyAZCeyD+c1gPyE9qpFu8af0Y+MRtmKOncdGoA2S5EY8iFq99dmmvkNnHiWo+pj0s7yH7l3KPIgee77tKpXPWQ==}
-    engines: {node: '>=18.0.0'}
+  listr2@11.0.0:
+    resolution: {integrity: sha512-8K88S0aSrcSXdJfiZtEy5BQMnR+TyjrCGLcgAvQs6ta0NEnIm0RJ72/Pv67Jvg07cfBhDbuN74V81lSSVYEFEw==}
+    engines: {node: '>=22.13.0'}
 
-  local-pkg@0.5.1:
-    resolution: {integrity: sha512-9rrA30MRRP3gBD3HTGnC6cDFpaE1kVDWxWgqWJUN0RvDNAo+Nz/9GxB+nHOH0ifbVFy0hSA1V6vFDvnx54lTEQ==}
+  local-pkg@1.2.1:
+    resolution: {integrity: sha512-++gUqRDEvcnN6Zhqrr+y/CkVEHhlrR96vZn3nZZPYzMcBUyBtTKzB9NadClFIsIVSsu+3i9tfk/erqy9kAmt7Q==}
     engines: {node: '>=14'}
 
   locate-path@5.0.0:
@@ -6974,18 +8971,12 @@ packages:
     resolution: {integrity: sha512-iPZK6eYjbxRu3uB4/WZ3EsEIMJFMqAoopl3R+zuq0UjcAm/MO6KCweDgPfP3elTztoKP3KtnVHxTn2NHBSDVUw==}
     engines: {node: '>=10'}
 
-  locate-path@7.2.0:
-    resolution: {integrity: sha512-gvVijfZvn7R+2qyPX8mAuKcFGDf6Nc61GdvGafQsHL0sBIxfKzA+usWn4GFC/bk+QdwPUD4kWFJLhElipq+0VA==}
-    engines: {node: ^12.20.0 || ^14.13.1 || >=16.0.0}
+  locate-path@8.0.0:
+    resolution: {integrity: sha512-XT9ewWAC43tiAV7xDAPflMkG0qOPn2QjHqlgX8FOqmWa/rxnyYDulF9T0F7tRy1u+TVTmK/M//6VIOye+2zDXg==}
+    engines: {node: '>=20'}
 
-  lodash-es@4.17.21:
-    resolution: {integrity: sha512-mKnC+QJ9pWVzv+C4/U3rRsHapFfHvQFoFB92e52xeyGMcX6/OlIl78je1u8vePzYZSkkogMPJ2yjxxsb89cxyw==}
-
-  lodash.camelcase@4.3.0:
-    resolution: {integrity: sha512-TwuEnCnxbc3rAvhf/LbG7tJUDzhqXyFnv3dtzLOPgCG/hODL7WFnsbwktkD7yUV0RrreP/l1PALq/YSg6VvjlA==}
-
-  lodash.castarray@4.4.0:
-    resolution: {integrity: sha512-aVx8ztPv7/2ULbArGJ2Y42bG1mEQ5mGjpdvrbJcJFU3TbYybe+QlLS4pst9zV52ymy2in1KpFPiZnAOATxD4+Q==}
+  lodash-es@4.18.1:
+    resolution: {integrity: sha512-J8xewKD/Gk22OZbhpOVSwcs60zhd95ESDwezOFuA3/099925PdHJ7OFHNTGtajL3AlZkykD32HykiMo+BIBI8A==}
 
   lodash.clonedeep@4.5.0:
     resolution: {integrity: sha512-H5ZhCF25riFd9uB5UCkVKo61m3S/xZk1x4wA6yp/L3RFP6Z/eHH1ymQcGLo7J3GMPfm0V/7m1tryHuGVxpqEBQ==}
@@ -7005,16 +8996,9 @@ packages:
   lodash.flatten@4.4.0:
     resolution: {integrity: sha512-C5N2Z3DgnnKr0LOpv/hKCgKdb7ZZwafIrsesve6lmzvZIRZRGaZ/l6Q8+2W7NaT+ZwO3fFlSCzCzrDCFdJfZ4g==}
 
-  lodash.get@4.4.2:
-    resolution: {integrity: sha512-z+Uw/vLuy6gQe8cfaFWD7p0wVv8fJl3mbzXh33RS+0oW2wvUqiRXiQ69gLWSLpgB5/6sU+r6BlQR0MBILadqTQ==}
-    deprecated: This package is deprecated. Use the optional chaining (?.) operator instead.
-
   lodash.groupby@4.6.0:
     resolution: {integrity: sha512-5dcWxm23+VAoz+awKmBaiBvzox8+RqMgFhi7UvX9DHZr2HdxHXM/Wrf8cfKpsW37RNrvtPn6hSwNqurSILbmJw==}
 
-  lodash.isarguments@3.1.0:
-    resolution: {integrity: sha512-chi4NHZlZqZD18a0imDHnZPrDeBbTtVN7GXMwuGdRH9qotxAjYs3aVLKc7zNOG9eddR5Ksd8rvFEBc9SsggPpg==}
-
   lodash.isboolean@3.0.3:
     resolution: {integrity: sha512-Bz5mupy2SVbPHURB98VAcw+aHh4vRV5IPNhILUCsOzRmsTmSQ17jIuqopAentWoehktxGd9e/hbIXq980/1QJg==}
 
@@ -7034,24 +9018,12 @@ packages:
   lodash.isundefined@3.0.1:
     resolution: {integrity: sha512-MXB1is3s899/cD8jheYYE2V9qTHwKvt+npCwpD+1Sxm3Q3cECXCiYHjeHWXNwr6Q0SOBPrYUDxendrO6goVTEA==}
 
-  lodash.kebabcase@4.1.1:
-    resolution: {integrity: sha512-N8XRTIMMqqDgSy4VLKPnJ/+hpGZN+PHQiJnSenYqPaVV/NCqEogTnAdZLQiGKhxX+JCs8waWq2t1XHWKOmlY8g==}
-
   lodash.memoize@4.1.2:
     resolution: {integrity: sha512-t7j+NzmgnQzTAYXcsHYLgimltOV1MXHtlOWf6GjL9Kj8GK5FInw5JotxvbOs+IvV1/Dzo04/fCGfLVs7aXb4Ag==}
 
   lodash.merge@4.6.2:
     resolution: {integrity: sha512-0KpjqXRVvrYyCsX1swR/XTK0va6VQkQM6MNo7PqW77ByjAhoARA8EfrP1N4+KlKj8YS0ZUCtRT/YUuhyYDujIQ==}
 
-  lodash.mergewith@4.6.2:
-    resolution: {integrity: sha512-GK3g5RPZWTRSeLSpgP8Xhra+pnjBC56q9FZYe1d5RN3TJ35dbkGy3YqBSMbyCrlbi+CM9Z3Jk5yTL7RCsqboyQ==}
-
-  lodash.snakecase@4.1.1:
-    resolution: {integrity: sha512-QZ1d4xoBHYUeuouhEq3lk3Uq7ldgyFXGBhg04+oRLnIz8o9T65Eh+8YdroUwn846zchkA9yDsDl5CVVaV2nqYw==}
-
-  lodash.sortby@4.7.0:
-    resolution: {integrity: sha512-HDWXG8isMntAyRF5vZ7xKuEvOhT4AhlRt/3czTSjvGUxjYCBVRQY48ViDHyfYz9VIoBkW4TMGQNapx+l3RUwdA==}
-
   lodash.startcase@4.4.0:
     resolution: {integrity: sha512-+WKqsK294HMSc2jEbNgpHpd0JfIBhp7rEV4aqXWqFr6AlXov+SlcgB1Fv01y2kGe3Gc8nMW7VA0SrGuSkRfIEg==}
 
@@ -7064,35 +9036,33 @@ packages:
   lodash.uniq@4.5.0:
     resolution: {integrity: sha512-xfBaXQd9ryd9dlSDvnvI0lvxfLJlYAZzXomUYzLKtUeOQvOP5piqAWuGtrhWeqaXK9hhoM/iyJc5AV+XfsX3HQ==}
 
-  lodash.upperfirst@4.3.1:
-    resolution: {integrity: sha512-sReKOYJIJf74dhJONhU4e0/shzi1trVbSWDOhKYE5XV2O+H7Sb2Dihwuc7xWxVl+DgFPyTqIN3zMfT9cq5iWDg==}
+  lodash@4.18.1:
+    resolution: {integrity: sha512-dMInicTPVE8d1e5otfwmmjlxkZoUpiVLwyeTdUsi/Caj/gfzzblBcCE5sRHV/AsjuCmxWrte2TNGSYuCeCq+0Q==}
 
-  lodash@4.17.21:
-    resolution: {integrity: sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==}
-
-  log-symbols@6.0.0:
-    resolution: {integrity: sha512-i24m8rpwhmPIS4zscNzK6MSEhk0DUWa/8iYQWxhffV8jkI4Phvs3F+quL5xvS0gdQR0FyTCMMH33Y78dDTzzIw==}
+  log-symbols@7.0.1:
+    resolution: {integrity: sha512-ja1E3yCr9i/0hmBVaM0bfwDjnGy8I/s6PP4DFp+yP+a+mrHO4Rm7DtmnqROTUkHIkqffC84YY7AeqX6oFk0WFg==}
     engines: {node: '>=18'}
 
-  log-update@6.1.0:
-    resolution: {integrity: sha512-9ie8ItPR6tjY5uYJh8K/Zrv/RMZ5VOlOWvtZdEHYSTFKZfIBPQa9tOAEeAWhd+AnIneLJ22w5fjOYtoutpWq5w==}
-    engines: {node: '>=18'}
+  log-update@8.0.0:
+    resolution: {integrity: sha512-lddSgOt3bPASrylL54ZSpy8nBHns+vBVSoILlVOx+dei300pnLRN958rj/EdlVLKuWlSESU3qdnDZdAI7FXYGg==}
+    engines: {node: '>=22'}
 
   loose-envify@1.4.0:
     resolution: {integrity: sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==}
     hasBin: true
 
-  loupe@3.1.2:
-    resolution: {integrity: sha512-23I4pFZHmAemUnz8WZXbYRSKYj801VDaNv9ETuMh7IrMc7VuVVSo+Z9iLE3ni30+U48iDWfi30d3twAXBYmnCg==}
-
   lower-case@2.0.2:
     resolution: {integrity: sha512-7fm3l3NAF9WfN6W3JOmf5drwpVqX78JtoGJ3A6W0a6ZnldM41w2fV5D490psKFTpMds8TJse/eHLFFsNHHjHgg==}
 
+  lowercase-keys@2.0.0:
+    resolution: {integrity: sha512-tqNXrS78oMOE73NMxK4EMLQsQowWf8jKooH9g7xPavRT706R6bkQJ6DY2Te7QukaZsulxa30wQ7bk0pm4XiHmA==}
+    engines: {node: '>=8'}
+
   lru-cache@10.4.3:
     resolution: {integrity: sha512-JNAzZcXrCt42VGLuYz0zfAzDfAvJWW6AfYlDBQyDV5DClI2m5sAmK+OIO7s59XfsRsWHp02jAJrRadPRGTt6SQ==}
 
-  lru-cache@11.0.2:
-    resolution: {integrity: sha512-123qHRfJBmo2jXDbo/a5YOQrJoHF/GNQTLzQ5+IdK5pWpceK17yRc6ozlWd25FxvGKQbIUs91fDFkXmDHTKcyA==}
+  lru-cache@11.5.2:
+    resolution: {integrity: sha512-4pfM1Ff0x50o0tQwb5ucw/RzNyD0/YJME6IVcStalZuMWxdt3sR3huStTtxz4PUmvZfRguvDejasvQ2kifR11g==}
     engines: {node: 20 || >=22}
 
   lru-cache@5.1.1:
@@ -7105,34 +9075,36 @@ packages:
   lucide-vue-next@0.453.0:
     resolution: {integrity: sha512-5zmv83vxAs9SVoe22veDBi8Dw0Fh2F+oTngWgKnKOkrZVbZjceXLQ3tescV2boB0zlaf9R2Sd9RuUP2766xvsQ==}
     peerDependencies:
-      vue: ^3.5.13
-
-  lucide-vue-next@0.469.0:
-    resolution: {integrity: sha512-EjOap+vY3xEzCMrnaccDHO4BH3k3Lr+sOyvzRQCaayYxkxKla0w6Jr4h3cHAzA4vMSp63Dcy7vDiGeCPcCY+Gg==}
-    peerDependencies:
-      vue: ^3.5.13
+      vue: ^3.5.40
 
   lucide-vue-next@0.487.0:
     resolution: {integrity: sha512-ilVgu9EHkfId7WSjmoPkzp13cuzpSGO5J16AmltjRHFoj6MlCBGY8BzsBU/ISKVlDheUxM+MsIYjNo/1hSEa6w==}
     peerDependencies:
-      vue: ^3.5.13
+      vue: ^3.5.40
 
-  magic-string@0.25.9:
-    resolution: {integrity: sha512-RmF0AsMzgt25qzqqLc1+MbHmhdx0ojF2Fvs4XnOqz2ZOBXzzkEwc/dJQZCYHAn7v1jbVOjAZfK8msRn4BxO4VQ==}
+  lunar-typescript@1.8.6:
+    resolution: {integrity: sha512-5Eo4T/cnuXfrgO4k5LCpOGHIUOuz5hCF/IfNv0T29WY2shR36Hiz+ecN9WjnUuxUKhql9gbOkPaQoqLFKtPRNA==}
 
-  magic-string@0.30.17:
-    resolution: {integrity: sha512-sNPKHvyjVf7gyjwS4xGTaW/mCnF8wnjtifKBEhxfZ7E/S8tQ0rssrwGNn6q8JH/ohItJfSQp9mBtQYuTlH5QnA==}
+  lz-string@1.5.0:
+    resolution: {integrity: sha512-h5bgJWpxJNswbU7qCrV0tIKQCaS3blPDrqKWx+QxzuzL1zGUzij9XCWLrSLsJPu5t+eWA/ycetzYAO5IOMcWAQ==}
+    hasBin: true
 
-  magicast@0.3.5:
-    resolution: {integrity: sha512-L0WhttDl+2BOsybvEOLK7fW3UA0OQ0IQ2d6Zl2x/a6vVRs3bAY0ECOSHHeL5jD+SbOpOCUEi0y1DgHEn9Qn1AQ==}
+  magic-string-ast@1.0.3:
+    resolution: {integrity: sha512-CvkkH1i81zl7mmb94DsRiFeG9V2fR2JeuK8yDgS8oiZSFa++wWLEgZ5ufEOyLHbvSbD1gTRKv9NdX69Rnvr9JA==}
+    engines: {node: '>=20.19.0'}
 
-  make-dir@2.1.0:
-    resolution: {integrity: sha512-LS9X+dc8KLxXCb8dni79fLIIUA5VyZoyjSMCwTluaXA0o27cCK0bhXkpgw+sTXVpPy/lSO57ilRixqk0vDmtRA==}
-    engines: {node: '>=6'}
+  magic-string@0.30.21:
+    resolution: {integrity: sha512-vd2F4YUyEXKGcLHoq+TEyCjxueSeHnFxyyjNp80yg0XV4vUhnDer/lvvlqM/arB5bXQN5K2/3oinyCRyx8T2CQ==}
 
-  make-fetch-happen@8.0.14:
-    resolution: {integrity: sha512-EsS89h6l4vbfJEtBZnENTOFk8mCRpY5ru36Xe5bcX1KYIli2mkSHqoFsp5O1wMDvTJJzxe/4THpCTtygjeeGWQ==}
-    engines: {node: '>= 10'}
+  magic-string@1.1.0:
+    resolution: {integrity: sha512-kS3VHe0nEPST2saQV4Rbkchcd3UBRkVTQHo1D3h/ZTwFDhai/mfKkmtPAtD129EOI7K3HlHIsFOt0WrI2/oU9g==}
+
+  magicast@0.5.4:
+    resolution: {integrity: sha512-llBEhWm1SacoRwgHUoQJYtwp4PBLF4faQi5TCpIGyGs9n4y5+juI0tDgyKIfpqxckRHaHzouUEph3THklWh03w==}
+
+  make-dir@5.1.0:
+    resolution: {integrity: sha512-IfpFq6UM39dUNiphpA6uDezNx/AvWyhwfICWPR3t1VspkgkMZrL+Rk1RbN1bx+aeNYwOrqGJgEgV3yotk+ZUVw==}
+    engines: {node: '>=18'}
 
   markdown-it-image-figures@2.1.1:
     resolution: {integrity: sha512-mwXSQ2nPeVUzCMIE3HlLvjRioopiqyJLNph0pyx38yf9mpqFDhNGnMpAXF9/A2Xv0oiF2cVyg9xwfF0HNAz05g==}
@@ -7146,50 +9118,44 @@ packages:
   markdown-it-sup@2.0.0:
     resolution: {integrity: sha512-5VgmdKlkBd8sgXuoDoxMpiU+BiEt3I49GItBzzw7Mxq9CxvnhE/k09HFli09zgfFDRixDQDfDxi0mgBCXtaTvA==}
 
-  markdown-it@14.1.0:
-    resolution: {integrity: sha512-a54IwgWPaeBCAAsv13YgmALOF1elABB08FxO9i+r4VFk5Vl4pKokRPeX8u5TCgSsPi6ec1otfLjdOpVcgbpshg==}
+  markdown-it@14.3.0:
+    resolution: {integrity: sha512-RCEsPjR+sr0x+AuYp601tKTkgFG4YEPLCzHST3cQ/fhlJkqAkz1L2/Qbp1j9qw5SBwQHFBoW8+hoN5xssOF0Tw==}
     hasBin: true
 
+  matcher@3.0.0:
+    resolution: {integrity: sha512-OkeDaAZ/bQCxeFAozM55PKcKU0yJMPGifLwV4Qgjitu+5MoAfSQN4lsLJeXZ1b8w0x+/Emda6MZgXS1jvsapng==}
+    engines: {node: '>=10'}
+
   math-intrinsics@1.1.0:
     resolution: {integrity: sha512-/IXtbwEk5HTPyEwyKX6hGkYXxM9nbj64B+ilVJnC/R6B0pH5G4V3b0pVbL7DBj4tkhBAppbQUlf6F6Xl9LHu1g==}
     engines: {node: '>= 0.4'}
 
-  mathml-tag-names@2.1.3:
-    resolution: {integrity: sha512-APMBEanjybaPzUrfqU0IMU5I0AswKMH7k8OTLs0vvV4KZpExkTkY87nR/zpbuTPj+gARop7aGUbl11pnDfW6xg==}
+  mathml-tag-names@4.0.0:
+    resolution: {integrity: sha512-aa6AU2Pcx0VP/XWnh8IGL0SYSgQHDT6Ucror2j2mXeFAlN3ahaNs8EZtG1YiticMkSLj3Gt6VPFfZogt7G5iFQ==}
 
-  md-editor-v3@5.4.5:
-    resolution: {integrity: sha512-Vw0mjlhGArlCt5aG15a2/W3BoQJLCACUGROgR64uVvRzepsh/26Pj1C3oGlU2lis4FrlnX7rzAN+m8g76eVFRA==}
+  md-editor-v3@5.8.5:
+    resolution: {integrity: sha512-NsqAmmAx/ykA1AcwxcHH4Hkn4VAPkqMX7Hd6Lv4FcwQoMQ70wWmJfs/mokyPGkqr4oYqqn8LRMBTqFNfoP0O0A==}
     peerDependencies:
-      vue: ^3.5.13
+      vue: ^3.5.40
 
   mdn-data@2.0.28:
     resolution: {integrity: sha512-aylIc7Z9y4yzHYAJNuESG3hfhC+0Ibp/MAMiaOZgNv4pmEdFyfZhhhny4MNiAfWdBQ1RQ2mfDWmM1x8SvGyp8g==}
 
-  mdn-data@2.0.30:
-    resolution: {integrity: sha512-GaqWWShW4kv/G9IEucWScBx9G1/vsFZZJUO+tD26M8J8z3Kw5RDQjaoZe03YAClgeS/SWPOcb4nkFBTEi5DUEA==}
+  mdn-data@2.27.1:
+    resolution: {integrity: sha512-9Yubnt3e8A0OKwxYSXyhLymGW4sCufcLG6VdiDdUGVkPhpqLxlvP5vl1983gQjJl3tqbrM731mjaZaP68AgosQ==}
 
-  mdn-data@2.12.2:
-    resolution: {integrity: sha512-IEn+pegP1aManZuckezWCO+XZQDplx1366JoVhTpMpBB1sPey/SbveZQUosKiKiGYjg1wH4pMlNgXbCiYgihQA==}
+  mdn-data@2.29.0:
+    resolution: {integrity: sha512-pVxQFCcaYUEAH853+v7yoI/qzhxXSq1bTb9obMYGYAN1c3Hen+XDCEvr296XhstrwlSTNgOR7mCSD4JPjbJe5A==}
 
-  mdn-data@2.14.0:
-    resolution: {integrity: sha512-QjcSiIvUHjmXp5wNLClRjQeU0Zp+I2Dag+AhtQto0nyKYZ3IF/pUzCuHe7Bv77EC92XE5t3EXeEiEv/to2Bwig==}
-
-  mdurl@2.0.0:
-    resolution: {integrity: sha512-Lf+9+2r+Tdp5wXDXC4PcIBjTDtq4UKjCPMQhKIuzpJNW0b96kVqSwW0bT7FhRSfmAiFYgP+SCRvdrDozfh0U5w==}
+  mdurl@2.1.0:
+    resolution: {integrity: sha512-1+HBaOx0zi/dQWht8rNv9MYf9qqpqL/kxI0hXImU6Y547zM6Sni8BQibt7ifgMcYtQg41ao3Ivd6cnSM86inpg==}
 
   medium-zoom@1.1.0:
     resolution: {integrity: sha512-ewyDsp7k4InCUp3jRmwHBRFGyjBimKps/AJLjRSox+2q/2H4p/PNpQf+pwONWlJiOudkBXtbdmVbFjqyybfTmQ==}
 
-  meow@12.1.1:
-    resolution: {integrity: sha512-BhXM0Au22RwUneMPwSCnyhTOizdWoIEPU9sp0Aqa1PnDMR5Wv2FGXYDjuzJEIX+Eo2Rb8xuYe5jrnm5QowQFkw==}
-    engines: {node: '>=16.10'}
-
-  meow@13.2.0:
-    resolution: {integrity: sha512-pxQJQzB6djGPXh08dacEloMFopsOqGVRKFPYvPOt9XDZ1HasbgDZA74CJGreSU4G3Ak7EFJGoiH2auq+yXISgA==}
-    engines: {node: '>=18'}
-
-  merge-stream@2.0.0:
-    resolution: {integrity: sha512-abv/qOcuPfk3URPfDzmZU1LKmuw8kT+0nIHvKrKgFrwifol/doWcdA4ZqsWQ8ENrFKkd67Mfpo/LovbIUsbt3w==}
+  meow@14.1.0:
+    resolution: {integrity: sha512-EDYo6VlmtnumlcBCbh1gLJ//9jvM/ndXHfVXIFrZVr6fGcwTUyCTFNTLCKuY3ffbK8L/+3Mzqnd58RojiZqHVw==}
+    engines: {node: '>=20'}
 
   merge2@1.4.1:
     resolution: {integrity: sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg==}
@@ -7203,104 +9169,69 @@ packages:
     resolution: {integrity: sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg==}
     engines: {node: '>= 0.6'}
 
+  mime-db@1.54.0:
+    resolution: {integrity: sha512-aU5EJuIN2WDemCcAp2vFBfp/m4EAhWJnUNSSw0ixs7/kXbd6Pg64EmwJkNdFhB8aWt1sH2CTXrLxo/iAGV3oPQ==}
+    engines: {node: '>= 0.6'}
+
   mime-types@2.1.35:
     resolution: {integrity: sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw==}
     engines: {node: '>= 0.6'}
 
+  mime-types@3.0.2:
+    resolution: {integrity: sha512-Lbgzdk0h4juoQ9fCKXW4by0UJqj+nOOrI9MJ1sSj4nI8aI2eo1qmvQEie4VD1glsS250n15LsWsYtCugiStS5A==}
+    engines: {node: '>=18'}
+
   mime@1.6.0:
     resolution: {integrity: sha512-x0Vn8spI+wuJ1O6S7gnbaQg8Pxh4NNHb7KSINmEWKiPE4RKOplvijn+NkmYmmRgP68mc70j2EbeTFRsrswaQeg==}
     engines: {node: '>=4'}
     hasBin: true
 
-  mime@3.0.0:
-    resolution: {integrity: sha512-jSCU7/VB1loIWBZe14aEYHU/+1UMEHoaO7qxCOVJOw9GgH72VAWppxNcjU+x9a2k3GSIBXNKxXQFqRvvZ7vr3A==}
-    engines: {node: '>=10.0.0'}
+  mime@2.6.0:
+    resolution: {integrity: sha512-USPkMeET31rOMiarsBNIHZKLGgvKc/LrjofAnBlOttf5ajRvqiRA8QsenbcooctK6d6Ts6aqZXBA+XbkKthiQg==}
+    engines: {node: '>=4.0.0'}
     hasBin: true
 
-  mime@4.0.6:
-    resolution: {integrity: sha512-4rGt7rvQHBbaSOF9POGkk1ocRP16Md1x36Xma8sz8h8/vfCUI2OtEIeCqe4Ofes853x4xDoPiFLIT47J5fI/7A==}
+  mime@4.1.0:
+    resolution: {integrity: sha512-X5ju04+cAzsojXKes0B/S4tcYtFAJ6tTMuSPBEn9CPGlrWr8Fiw7qYeLT0XyH80HSoAoqWCaz+MWKh22P7G1cw==}
     engines: {node: '>=16'}
     hasBin: true
 
-  mimic-fn@4.0.0:
-    resolution: {integrity: sha512-vqiC06CuhBTUdZH+RYl8sFrL096vA45Ok5ISO6sE/Mr1jRbGH4Csnhi8f3wKVl7x8mO4Au7Ir9D3Oyv1VYMFJw==}
-    engines: {node: '>=12'}
-
   mimic-function@5.0.1:
     resolution: {integrity: sha512-VP79XUPxV2CigYP3jWwAUFSku2aKqBH7uTAapFWCBqutsbmDo96KY5o8uh6U+/YSIn5OxJnXp73beVkpqMIGhA==}
     engines: {node: '>=18'}
 
-  min-indent@1.0.1:
-    resolution: {integrity: sha512-I9jwMn07Sy/IwOj3zVkVik2JTvgpaykDZEigL6Rx6N9LbMywwUSMtxET+7lVoDLLd3O3IXwJwvuuns8UB/HeAg==}
+  mimic-response@1.0.1:
+    resolution: {integrity: sha512-j5EctnkH7amfV/q5Hgmoal1g2QHFJRraOtmx0JpIqkxhBhI/lJSl1nMpQ45hVarwNETOoWEimndZ4QK0RHxuxQ==}
     engines: {node: '>=4'}
 
-  minimatch@10.0.1:
-    resolution: {integrity: sha512-ethXTt3SGGR+95gudmqJ1eNhRO7eGEGIgYA9vnPatK4/etz2MEVDno5GMCibdMTuBMyElzIlgxMna3K94XDIDQ==}
-    engines: {node: 20 || >=22}
-
-  minimatch@3.0.8:
-    resolution: {integrity: sha512-6FsRAQsxQ61mw+qP1ZzbL9Bc78x2p5OqNgNpnoAFLTrX8n5Kxph0CsnhmKKNXTWjXqU5L0pGPR7hYk+XWZr60Q==}
-
-  minimatch@3.1.2:
-    resolution: {integrity: sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==}
-
-  minimatch@5.1.6:
-    resolution: {integrity: sha512-lKwV/1brpG6mBUFHtb7NUmtABCb2WZZmm2wNiOA5hAb8VdCS4B3dtMWyvcoViccwAW/COERjXLt0zP1zXUN26g==}
+  mimic-response@3.1.0:
+    resolution: {integrity: sha512-z0yWI+4FDrrweS8Zmt4Ej5HdJmky15+L2e6Wgn3+iK5fWzb6T3fhNFq2+MeTRb064c6Wr4N/wv0DzQTjNzHNGQ==}
     engines: {node: '>=10'}
 
-  minimatch@7.4.6:
-    resolution: {integrity: sha512-sBz8G/YjVniEz6lKPNpKxXwazJe4c19fEfV2GDMX6AjFz+MX9uDWIZW8XreVhkFW3fkIdTv/gxWr/Kks5FFAVw==}
+  minimatch@10.2.6:
+    resolution: {integrity: sha512-vpLQEs+VLCr1nU0BXS07maYoFwlDAH0gngQuuttxIwutDFEMHq2blX+8vpgxDdK3J1PwjCJiep77OitTZ4Ll1A==}
+    engines: {node: 18 || 20 || >=22}
+
+  minimatch@3.1.5:
+    resolution: {integrity: sha512-VgjWUsnnT6n+NUk6eZq77zeFdpW2LWDzP6zFGrCbHXiYNul5Dzqk2HHQ5uFH2DNW5Xbp8+jVzaeNt94ssEEl4w==}
+
+  minimatch@5.1.9:
+    resolution: {integrity: sha512-7o1wEA2RyMP7Iu7GNba9vc0RWWGACJOCZBJX2GJWip0ikV+wcOsgVuY9uE8CPiyQhkGFSlhuSkZPavN7u1c2Fw==}
     engines: {node: '>=10'}
 
-  minimatch@9.0.1:
-    resolution: {integrity: sha512-0jWhJpD/MdhPXwPuiRkCbfYfSKp2qnn2eOc279qI7f+osl/l+prKSrvhg157zSYvx/1nmgn2NqdT6k2Z7zSH9w==}
-    engines: {node: '>=16 || 14 >=14.17'}
-
-  minimatch@9.0.5:
-    resolution: {integrity: sha512-G6T0ZX48xgozx7587koeX9Ys2NYy6Gmv//P89sEte9V9whIapMNF4idKxnW2QtCcLiTWlb/wfCabAtAFWhhBow==}
+  minimatch@9.0.9:
+    resolution: {integrity: sha512-OBwBN9AL4dqmETlpS2zasx+vTeWclWzkblfZk7KTA5j3jeOONz/tRCnZomUyvNg83wL5Zv9Ss6HMJXAgL8R2Yg==}
     engines: {node: '>=16 || 14 >=14.17'}
 
   minimist@1.2.8:
     resolution: {integrity: sha512-2yyAR8qBkN3YuheJanUpWC5U3bb5osDywNB8RzDVlDwDHbocAJveqqj1u8+SVD7jkWT4yvsHCpWqqWqAxb0zCA==}
 
-  minipass-collect@1.0.2:
-    resolution: {integrity: sha512-6T6lH0H8OG9kITm/Jm6tdooIbogG9e0tLgpY6mphXSm/A9u8Nq1ryBG+Qspiub9LjWlBPsPS3tWQ/Botq4FdxA==}
-    engines: {node: '>= 8'}
-
-  minipass-fetch@1.4.1:
-    resolution: {integrity: sha512-CGH1eblLq26Y15+Azk7ey4xh0J/XfJfrCox5LDJiKqI2Q2iwOLOKrlmIaODiSQS8d18jalF6y2K2ePUm0CmShw==}
-    engines: {node: '>=8'}
-
-  minipass-flush@1.0.5:
-    resolution: {integrity: sha512-JmQSYYpPUqX5Jyn1mXaRwOda1uQ8HP5KAT/oDSLCzt1BYRhQU0/hDtsB1ufZfEEzMZ9aAVmsBw8+FWsIXlClWw==}
-    engines: {node: '>= 8'}
-
-  minipass-pipeline@1.2.4:
-    resolution: {integrity: sha512-xuIq7cIOt09RPRJ19gdi4b+RiNvDFYe5JH+ggNvBqGqpQXcru3PcRmOZuHBKWK1Txf9+cQ+HMVN4d6z46LZP7A==}
-    engines: {node: '>=8'}
-
-  minipass-sized@1.0.3:
-    resolution: {integrity: sha512-MbkQQ2CTiBMlA2Dm/5cY+9SWFEN8pzzOXi6rlM5Xxq0Yqbda5ZQy9sU75a673FE9ZK0Zsbr6Y5iP6u9nktfg2g==}
-    engines: {node: '>=8'}
-
-  minipass@3.3.6:
-    resolution: {integrity: sha512-DxiNidxSEK+tHG6zOIklvNOwm3hvCrbUrdtzY74U6HKTJxvIDfOUL5W5P2Ghd3DTkhhKPYGqeNUIh5qcM4YBfw==}
-    engines: {node: '>=8'}
-
-  minipass@5.0.0:
-    resolution: {integrity: sha512-3FnjYuehv9k6ovOEbyOswadCDPX1piCfhV8ncmYtHOjuPwylVWsghTLo7rabjC3Rx5xD4HDx8Wm1xnMF7S5qFQ==}
-    engines: {node: '>=8'}
-
-  minipass@7.1.2:
-    resolution: {integrity: sha512-qOOzS1cBTWYF4BH8fVePDBOO9iptMnGUEZwNc/cMWnTV2nVLZ7VoNWEPHkYczZA0pdoA7dl6e7FL659nX9S2aw==}
+  minipass@7.1.3:
+    resolution: {integrity: sha512-tEBHqDnIoM/1rXME1zgka9g6Q2lcoCkxHLuc7ODJ5BxbP5d4c2Z5cGgtXAku59200Cx7diuHTOYfSBD8n6mm8A==}
     engines: {node: '>=16 || 14 >=14.17'}
 
-  minizlib@2.1.2:
-    resolution: {integrity: sha512-bAxsR8BVfj60DWXHE3u30oHzfl4G7khkSuPW+qvpd7jFRHm7dLxOjUk1EHACJ/hxLY8phGJ0YhYHZo7jil7Qdg==}
-    engines: {node: '>= 8'}
-
-  minizlib@3.0.1:
-    resolution: {integrity: sha512-umcy022ILvb5/3Djuu8LWeqUa8D68JaBzlttKeMWen48SjabqS3iY5w/vzeMzMUNhLDifyhbOwKDSznB1vvrwg==}
+  minizlib@3.1.0:
+    resolution: {integrity: sha512-KZxYo1BUkWD2TVFLr0MQoM8vUUigWD3LlD83a/75BqC+4qE0Hb1Vo5v1FgcfaNXvfXzr+5EhQ6ing/CaBijTlw==}
     engines: {node: '>= 18'}
 
   mitt@3.0.1:
@@ -7310,24 +9241,15 @@ packages:
     resolution: {integrity: sha512-FP+p8RB8OWpF3YZBCrP5gtADmtXApB5AMLn+vdyA+PyxCjrCs00mjyUozssO33cwDeT3wNGdLxJ5M//YqtHAJw==}
     hasBin: true
 
-  mkdirp@1.0.4:
-    resolution: {integrity: sha512-vVqVZQyf3WLx2Shd0qJ9xuvqgAyKPLAiqITEtqW0oIUjzo3PePDd6fW9iFz30ef7Ysp/oiWqbhszeGWW2T6Gzw==}
-    engines: {node: '>=10'}
-    hasBin: true
-
-  mkdirp@3.0.1:
-    resolution: {integrity: sha512-+NsyUUAZDmo6YVHzL/stxSu3t9YS1iljliy3BSDrXJ/dkn1KYdmtZODGGjLcc9XLgVVpH4KshHB8XmZgMhaBXg==}
-    engines: {node: '>=10'}
-    hasBin: true
-
-  mkdist@2.1.0:
-    resolution: {integrity: sha512-FhJRzoA2GEZr7X9S8S8SR5BcuGwgGi6IZKnJUHlMkRHUBJAtTU3xfIIcHnK4t9M/B9zK1ffpE+vGSS1003R7Dw==}
+  mkdist@2.4.1:
+    resolution: {integrity: sha512-Ezk0gi04GJBkqMfsksICU5Rjoemc4biIekwgrONWVPor2EO/N9nBgN6MZXAf7Yw4mDDhrNyKbdETaHNevfumKg==}
     hasBin: true
     peerDependencies:
-      sass: ^1.83.0
-      typescript: '>=5.7.2'
-      vue: ^3.5.13
-      vue-tsc: ^1.8.27 || ^2.0.21
+      sass: ^1.92.1
+      typescript: '>=5.9.2'
+      vue: ^3.5.40
+      vue-sfc-transformer: ^0.1.1
+      vue-tsc: ^1.8.27 || ^2.0.21 || ^3.0.0
     peerDependenciesMeta:
       sass:
         optional: true
@@ -7335,18 +9257,24 @@ packages:
         optional: true
       vue:
         optional: true
+      vue-sfc-transformer:
+        optional: true
       vue-tsc:
         optional: true
 
-  mlly@1.7.3:
-    resolution: {integrity: sha512-xUsx5n/mN0uQf4V548PKQ+YShA4/IW0KI1dZhrNrPCLG+xizETbHTkOa1f8/xut9JRPp8kQuMnz0oqwkTiLo/A==}
+  mlly@1.8.2:
+    resolution: {integrity: sha512-d+ObxMQFmbt10sretNDytwt85VrbkhhUA/JBGm1MPaWJ65Cl4wOgLaB1NYvJSZ0Ef03MMEU/0xpPMXUIQ29UfA==}
+
+  modern-tar@0.7.7:
+    resolution: {integrity: sha512-t9VmxaqrmANnEOBhpSDI6HD192Ge48k8vmWqQQL7hSFEqHEYwZbbsu49+aKLWZeRvFs3j1pMhXOqqF4kPlvjkQ==}
+    engines: {node: '>=18.0.0'}
 
   mri@1.2.0:
     resolution: {integrity: sha512-tzzskb3bG8LvYGFF/mDTpq3jpI6Q9wc3LEmBaghu+DdCssd1FakN7Bc0hVNmEyGq1bq3RgfkCb3cmQLpNPOroA==}
     engines: {node: '>=4'}
 
-  mrmime@2.0.0:
-    resolution: {integrity: sha512-eu38+hdgojoyq63s+yTpN4XMBdt5l8HhMhc4VKLO9KM5caLIBvUm4thi7fFaxyTmCKeNnXZ5pAlBwCUnhA09uw==}
+  mrmime@2.0.1:
+    resolution: {integrity: sha512-Y3wQdFg2Va6etvQ5I82yUhGdsKrcYox6p7FfL1LbK2J4V01F9TGlepTIhnK24t7koZibmg82KGglhA1XK5IsLQ==}
     engines: {node: '>=10'}
 
   ms@2.0.0:
@@ -7358,43 +9286,37 @@ packages:
   muggle-string@0.4.1:
     resolution: {integrity: sha512-VNTrAak/KhO2i8dqqnqnAHOa3cYBwXEZe9h+D5h/1ZqFSTEFHdM65lR7RoIqq3tBBYavsOXV84NoHXZ0AkPyqQ==}
 
-  multimatch@5.0.0:
-    resolution: {integrity: sha512-ypMKuglUrZUD99Tk2bUQ+xNQj43lPEfAeX2o9cTteAmShXy2VHDJpuwu1o0xqoKCt9jLVAvwyFKdLTPXKAfJyA==}
-    engines: {node: '>=10'}
-
-  mz@2.7.0:
-    resolution: {integrity: sha512-z81GNO7nnYMEhrGh9LeymoE4+Yr0Wn5McHIZMK5cfQCl+NDX08sCZgUc9/6MHni9IWuFLm1Z3HTCXu2z9fN62Q==}
-
-  nanoid@3.3.8:
-    resolution: {integrity: sha512-WNLf5Sd8oZxOm+TzppcYk8gVOgP+l58xNy58D0nbUnOxOWRWvlcCV4kUF7ltmI6PsrLl/BgKEyS4mqsGChFN0w==}
+  nanoid@3.3.18:
+    resolution: {integrity: sha512-DTg4MJbGMWkfi6VZFdNt2/caMbQy4Ou+Op/hJQvGEWcnVfoA1QA+xzRKAzw9jD6+GVOOeYr/mIcuDSdug6F6+w==}
     engines: {node: ^10 || ^12 || ^13.7 || ^14 || >=15.0.1}
     hasBin: true
 
-  nanoid@5.0.9:
-    resolution: {integrity: sha512-Aooyr6MXU6HpvvWXKoVoXwKMs/KyVakWwg7xQfv5/S/RIgJMy0Ifa45H9qqYy7pTCszrHzP21Uk4PZq2HpEM8Q==}
-    engines: {node: ^18 || >=20}
-    hasBin: true
-
   nanopop@2.4.2:
     resolution: {integrity: sha512-NzOgmMQ+elxxHeIha+OG/Pv3Oc3p4RU2aBhwWwAqDpXrdTbtRylbRLQztLy8dMMwfl6pclznBdfUhccEn9ZIzw==}
 
-  natural-compare-lite@1.4.0:
-    resolution: {integrity: sha512-Tj+HTDSJJKaZnfiuw+iaF9skdPpTo2GtEly5JHnWV/hfv2Qj/9RKsGISQtLh2ox3l5EAGw487hnBee0sIJ6v2g==}
-
   natural-compare@1.4.0:
     resolution: {integrity: sha512-OWND8ei3VtNC9h7V60qff3SVobHr996CTwgxubgyQYEpg290h9J0buyECNNJexkFm5sOajh5G116RYA1c8ZMSw==}
 
-  needle@3.3.1:
-    resolution: {integrity: sha512-6k0YULvhpw+RoLNiQCRKOl09Rv1dPLr8hHnVjHqdolKwDrdNyk+Hmrthi4lIGPPz3r39dLx0hsF5s40sZ3Us4Q==}
+  natural-orderby@5.0.0:
+    resolution: {integrity: sha512-kKHJhxwpR/Okycz4HhQKKlhWe4ASEfPgkSWNmKFHd7+ezuQlxkA5cM3+XkBPvm1gmHen3w53qsYAv+8GwRrBlg==}
+    engines: {node: '>=18'}
+
+  needle@2.9.1:
+    resolution: {integrity: sha512-6R9fqJ5Zcmf+uYaFgdIHmLwNldn5HbK8L5ybn7Uz+ylX/rnOsSp1AHcvQSrCaFN+qNM1wpymHqD7mVasEOlHGQ==}
+    engines: {node: '>= 4.4.x'}
+    hasBin: true
+
+  needle@3.5.0:
+    resolution: {integrity: sha512-jaQyPKKk2YokHrEg+vFDYxXIHTCBgiZwSHOoVx/8V3GIBS8/VN6NdVRmg8q1ERtPkMvmOvebsgga4sAj5hls/w==}
     engines: {node: '>= 4.4.x'}
     hasBin: true
 
   next-tick@1.1.0:
     resolution: {integrity: sha512-CXdUiJembsNjuToQvxayPZF9Vqht7hewsvy2sOWafLvi2awflj9mOC6bHIg50orX8IJvWKY9wYQ/zB2kogPslQ==}
 
-  nitropack@2.10.4:
-    resolution: {integrity: sha512-sJiG/MIQlZCVSw2cQrFG1H6mLeSqHlYfFerRjLKz69vUfdu0EL2l0WdOxlQbzJr3mMv/l4cOlCCLzVRzjzzF/g==}
-    engines: {node: ^16.11.0 || >=17.0.0}
+  nitropack@2.13.4:
+    resolution: {integrity: sha512-tX7bT6zxNeMwkc6hxHiZeUoTOjVrcjoh1Z3cmxOlodIqjl4HISgqfGOmkWSayky3Nv9Z5+KQH52F8nmXJY5AAA==}
+    engines: {node: ^20.19.0 || >=22.12.0}
     hasBin: true
     peerDependencies:
       xml2js: ^0.6.2
@@ -7405,14 +9327,21 @@ packages:
   no-case@3.0.4:
     resolution: {integrity: sha512-fgAN3jGAh+RoxUGZHTSOLJIqUc2wmoBwGR4tbpNAKmmovFoWq0OdRkb0VkldReO2a2iBT/OEulG9XSUc10r3zg==}
 
+  node-abi@4.33.0:
+    resolution: {integrity: sha512-vLBWCKb+7LWsX+TbfzWOkw0W81m377tyx3hOweBTjO43CXZnRGS1/JPWs20fr0PgZyDXk6ROYrylsEycK8raDA==}
+    engines: {node: '>=22.12.0'}
+
   node-addon-api@7.1.1:
     resolution: {integrity: sha512-5m3bsyrjFWE1xf7nz7YXdN4udnVtXK6/Yfgn5qnahL6bCkf2yKt4k3nuTKAtT4r3IG8JNR2ncsIMdZuAzJjHQQ==}
 
+  node-api-version@0.2.1:
+    resolution: {integrity: sha512-2xP/IGGMmmSQpI1+O/k72jF/ykvZ89JeuKX3TLJAYPDVLUalrshrLHkeVcCCZqG/eEa635cr8IBYzgnDvM2O8Q==}
+
   node-cleanup@2.1.2:
     resolution: {integrity: sha512-qN8v/s2PAJwGUtr1/hYTpNKlD6Y9rc4p8KSmJXyGdYGZsDGKXrGThikLFP9OCHFeLeEpQzPwiAtdIvBLqm//Hw==}
 
-  node-fetch-native@1.6.4:
-    resolution: {integrity: sha512-IhOigYzAKHd244OC0JIMIUrjzctirCmPkaIfhDeGcEETWof5zKYUW7e7MYvChGWh/4CJeXEgsRyGzuF334rOOQ==}
+  node-fetch-native@1.6.7:
+    resolution: {integrity: sha512-g9yhqoedzIUm0nTnTqAQvueMPVOuIY16bqgAJJC8XOOubYFNwz6IER9qs0Gq2Xd0+CecCKFjtdDTMA4u4xG06Q==}
 
   node-fetch@2.7.0:
     resolution: {integrity: sha512-c4FRfUm/dbcWZ7U+1Wq0AwCyFL+3nt2bEw05wfxSz+DWpWsitgmSgYmy2dQdWyKC1694ELPqMs/YzUSNozLt8A==}
@@ -7423,57 +9352,54 @@ packages:
       encoding:
         optional: true
 
-  node-forge@1.3.1:
-    resolution: {integrity: sha512-dPEtOeMvF9VMcYV/1Wb8CPoVAXtp6MKMlcbAt4ddqmGqUJ6fQZFXkNZNkNlfevtNkGtaSoXf/vNNNSvgrdXwtA==}
+  node-forge@1.4.0:
+    resolution: {integrity: sha512-LarFH0+6VfriEhqMMcLX2F7SwSXeWwnEAJEsYm5QKWchiVYVvJyV9v7UDvUv+w5HO23ZpQTXDv/GxdDdMyOuoQ==}
     engines: {node: '>= 6.13.0'}
 
   node-gyp-build@4.8.4:
     resolution: {integrity: sha512-LA4ZjwlnUblHVgq0oBF3Jl/6h/Nvs5fzBLwdEF4nuxnFdsfajde4WfxtJr3CaiH+F6ewcIB/q4jQ4UzPyid+CQ==}
     hasBin: true
 
-  node-html-parser@5.4.2:
-    resolution: {integrity: sha512-RaBPP3+51hPne/OolXxcz89iYvQvKOydaqoePpOgXcrOKZhjVIzmpKZz+Hd/RBO2/zN2q6CNJhQzucVz+u3Jyw==}
+  node-gyp@12.4.0:
+    resolution: {integrity: sha512-OMcPNvqTCFUnNaBlmdgq+lfNqY7gTiSmNRDjY3uAXRyudeKZEZxu3CLtjMQrx4zZxCX2b/mpNqTtwuCJgXhHkw==}
+    engines: {node: ^20.17.0 || >=22.9.0}
+    hasBin: true
 
-  node-releases@2.0.19:
-    resolution: {integrity: sha512-xxOWJsBKtzAq7DY0J+DTzuz58K8e7sJbdgwkbMWQe8UYB6ekmsQ45q0M/tJDsGaZmbC+l7n57UV8Hl5tHxO9uw==}
+  node-int64@0.4.0:
+    resolution: {integrity: sha512-O5lz91xSOeoXP6DulyHfllpq+Eg00MWitZIbtPfoSEvqIHdl5gfcY6hYzDWnj0qD5tz52PI08u9qUvSVeUBeHw==}
+
+  node-mock-http@1.0.5:
+    resolution: {integrity: sha512-KQyt/wLjG3TAc7DOUhpqWzgd4ERxR80JOlTK5VE5R1S12IaPVN5qkj4klBce9HPG1Njuup4Sb5bljaT34lIyjw==}
+
+  node-releases@2.0.53:
+    resolution: {integrity: sha512-D9UOmYG3UH1V+ENW56t5QXBwJw1YEY18ruVeus89Rw+SyIgjPkCO84bRzO3uNIYosJbNwiabWVn48o3uJLjxFQ==}
+    engines: {node: '>=18'}
 
   nopt@7.2.1:
     resolution: {integrity: sha512-taM24ViiimT/XntxbPyJQzCG+p4EKOpgD3mxFwW38mGjVUrfERQOeY4EDHjdnptttfHuHQXFx+lTP08Q+mLa/w==}
     engines: {node: ^14.17.0 || ^16.13.0 || >=18.0.0}
     hasBin: true
 
-  nopt@8.0.0:
-    resolution: {integrity: sha512-1L/fTJ4UmV/lUxT2Uf006pfZKTvAgCF+chz+0OgBHO8u2Z67pE7AaAUUj7CJy0lXqHmymUvGFt6NE9R3HER0yw==}
+  nopt@8.1.0:
+    resolution: {integrity: sha512-ieGu42u/Qsa4TFktmaKEwM6MQH0pOWnaB3htzh0JRtx84+Mebc0cbZYN5bC+6WTZ4+77xrL9Pn5m7CV6VIkV7A==}
     engines: {node: ^18.17.0 || >=20.5.0}
     hasBin: true
 
-  normalize-package-data@2.5.0:
-    resolution: {integrity: sha512-/5CMN3T0R4XTj4DcGaexo+roZSdSFW/0AOOTROrjxzCG1wrWXEsGbRKevjlIL+ZDE4sZlJr5ED4YW0yqmkK+eA==}
+  nopt@9.0.0:
+    resolution: {integrity: sha512-Zhq3a+yFKrYwSBluL4H9XP3m3y5uvQkB/09CwDruCiRmR/UJYnn9W4R48ry0uGC70aeTPKLynBtscP9efFFcPw==}
+    engines: {node: ^20.17.0 || >=22.9.0}
+    hasBin: true
 
   normalize-path@3.0.0:
     resolution: {integrity: sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==}
     engines: {node: '>=0.10.0'}
 
-  normalize-range@0.1.2:
-    resolution: {integrity: sha512-bdok/XvKII3nUpklnV6P2hxtMNrCboOjAcyBuQnWEhO665FwrSNRxU+AqpsyvO6LgGYPspN+lu5CLtw4jPRKNA==}
-    engines: {node: '>=0.10.0'}
+  normalize-url@6.1.0:
+    resolution: {integrity: sha512-DlL+XwOy3NxAQ8xuC0okPgK46iuVNAK01YN7RueYBqqFeGsBjV9XmCAzAdgt+667bCl5kPh9EqKKDwnaPG1I7A==}
+    engines: {node: '>=10'}
 
-  npm-bundled@2.0.1:
-    resolution: {integrity: sha512-gZLxXdjEzE/+mOstGDqR6b0EkhJ+kM6fxM6vUuckuctuVPh80Q6pw/rSZj9s4Gex9GxWtIicO1pc8DB9KZWudw==}
-    engines: {node: ^12.13.0 || ^14.15.0 || >=16.0.0}
-
-  npm-normalize-package-bin@2.0.0:
-    resolution: {integrity: sha512-awzfKUO7v0FscrSpRoogyNm0sajikhBWpU0QMrW09AMi9n1PoKU6WaIqUzuJSQnpciZZmJ/jMZ2Egfmb/9LiWQ==}
-    engines: {node: ^12.13.0 || ^14.15.0 || >=16.0.0}
-
-  npm-packlist@5.1.3:
-    resolution: {integrity: sha512-263/0NGrn32YFYi4J533qzrQ/krmmrWwhKkzwTuM4f/07ug51odoaNjUexxO4vxlzURHcmYMH1QjvHjsNDKLVg==}
-    engines: {node: ^12.13.0 || ^14.15.0 || >=16.0.0}
-    hasBin: true
-
-  npm-run-path@5.3.0:
-    resolution: {integrity: sha512-ppwTtiJZq0O/ai0z7yfudtBpWIoxM8yE6nHi1X47eFR2EWORqfbu6CnPlNsjeN683eT0qG6H/Pyf9fCcvjnnnQ==}
-    engines: {node: ^12.20.0 || ^14.13.1 || >=16.0.0}
+  nostics@1.2.0:
+    resolution: {integrity: sha512-FGqEfhQjrvo1lL8KFifdTQiNwwQHJxC1jtYE1Rc54qF/jxONUNL+kC9gS1krX8Q65PgrQ5fCqH/I4NhWBvdSqg==}
 
   npm-run-path@6.0.0:
     resolution: {integrity: sha512-9qny7Z9DsQU8Ou39ERsPU4OZQlSTP47ShQzuKZ6PRXpYLtIFgl/DEBYEXKlvcEa+9tHVcK8CF81Y2V72qaZhWA==}
@@ -7485,25 +9411,8 @@ packages:
   nth-check@2.1.1:
     resolution: {integrity: sha512-lqjrjmaOoAnWfMmBPL+XNnynZh2+swxiX3WUE0s4yEHI6m+AwrK2UZOimIRl3X/4QctVqS8AiZjFqyOGrMXb/w==}
 
-  nypm@0.3.12:
-    resolution: {integrity: sha512-D3pzNDWIvgA+7IORhD/IuWzEk4uXv6GsgOxiid4UU3h9oq5IqV1KtPDi63n4sZJ/xcWlr88c0QM2RgN5VbOhFA==}
-    engines: {node: ^14.16.0 || >=16.10.0}
-    hasBin: true
-
-  object-assign@4.1.1:
-    resolution: {integrity: sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==}
-    engines: {node: '>=0.10.0'}
-
-  object-hash@3.0.0:
-    resolution: {integrity: sha512-RSn9F68PjH9HqtltsSnqYC1XXoWe9Bju5+213R98cNGttag9q9yAOTzdbsqvIa7aNm5WffBZFpWYr2aWrklWAw==}
-    engines: {node: '>= 6'}
-
-  object-inspect@1.13.3:
-    resolution: {integrity: sha512-kDCGIbxkDSXE3euJZZXzc6to7fCrKHNI/hSRQnRuQ+BWjFNzZwiFF8fj/6o2t2G9/jTj8PSIYTfCLelLZEeRpA==}
-    engines: {node: '>= 0.4'}
-
-  object-is@1.1.6:
-    resolution: {integrity: sha512-F8cZ+KfGlSGi09lJT7/Nd6KJZ9ygtvYC0/UYYLI9nmQKLMnydpB9yvbv9K1uSkEu7FU9vYPmVwLg328tX+ot3Q==}
+  object-inspect@1.13.4:
+    resolution: {integrity: sha512-W67iLl4J2EXEGTbfeHCffrjDfitvLANg0UlX3wFUUSTx92KXRFegMHUVgSqE+wvhAbi4WqjGg9czysTV2Epbew==}
     engines: {node: '>= 0.4'}
 
   object-keys@1.1.1:
@@ -7514,11 +9423,15 @@ packages:
     resolution: {integrity: sha512-nK28WOo+QIjBkDduTINE4JkF/UJJKyf2EJxvJKfblDpyg0Q+pkOHNTL0Qwy6NP6FhE/EnzV73BxxqcJaXY9anw==}
     engines: {node: '>= 0.4'}
 
-  ofetch@1.4.1:
-    resolution: {integrity: sha512-QZj2DfGplQAr2oj9KzceK9Hwz6Whxazmn85yYeVuS3u9XTMOGMRx0kO95MQ+vLsj/S/NwBDMMLU5hpxvI6Tklw==}
+  obug@2.1.4:
+    resolution: {integrity: sha512-4a+OsYv9UktOJKE+l1A4OufDgdRF9PifWj+tJnHURo/P+WOxpG4GzUFL9qCalmWauao6ogiG+QvnCovwPoyAWA==}
+    engines: {node: '>=12.20.0'}
 
-  ohash@1.1.4:
-    resolution: {integrity: sha512-FlDryZAahJmEF3VR3w1KogSEdWX3WhA5GPakFx4J81kEAiHyLMpdLLElS8n8dfNadMgAne/MywcvmogzscVt4g==}
+  ofetch@1.5.1:
+    resolution: {integrity: sha512-2W4oUZlVaqAPAil6FUg/difl6YhqhUR7x2eZY4bQCko22UXg3hptq9KLQdqFClV+Wu85UX7hNtdGTngi/1BxcA==}
+
+  ohash@2.0.11:
+    resolution: {integrity: sha512-RdR9FQrFwNBNXAr4GixM8YaRZRJ5PUWbKYbE5eOsrwAjJW0q2REGcf79oYPsLyskQCZG1PLN+S/K1V00joZAoQ==}
 
   on-finished@2.4.1:
     resolution: {integrity: sha512-oVlzkg3ENAhCk2zdv7IJwd/QUD4z2RxRwpkcGY8psCVcCYZNq4wYnVWALHM+brtuJjePWiYF/ClmuDr8Ch5+kg==}
@@ -7527,43 +9440,73 @@ packages:
   once@1.4.0:
     resolution: {integrity: sha512-lNaJgI+2Q5URQBkccEKHTQOPaXdUxnZZElQTZY0MFUAuaEqe1E+Nyvgdz/aIyNi6Z9MzO5dv1H8n58/GELp3+w==}
 
-  onetime@6.0.0:
-    resolution: {integrity: sha512-1FlR+gjXK7X+AsAHso35MnyN5KqGwJRi/31ft6x0M194ht7S+rWAvd7PHss9xSKMzE0asv1pyIHaJYq+BbacAQ==}
-    engines: {node: '>=12'}
-
   onetime@7.0.0:
     resolution: {integrity: sha512-VXJjc87FScF88uafS3JllDgvAm+c/Slfz06lorj2uAY34rlUu0Nt+v8wreiImcrgAjjIHp1rXpTDlLOGw29WwQ==}
     engines: {node: '>=18'}
 
-  open@10.1.0:
-    resolution: {integrity: sha512-mnkeQ1qP5Ue2wd+aivTD3NHd/lZ96Lu0jgf0pwktLPtx6cTZiH7tyeGRRHs0zX0rbrahXPnXlUnbeXyaBBuIaw==}
-    engines: {node: '>=18'}
-
-  open@8.4.2:
-    resolution: {integrity: sha512-7x81NCL719oNbsq/3mh+hVrAWmFuEYUqrq/Iw3kUzH8ReypT9QQ0BLoJS7/G9k6N81XjW4qHWtjWwe/9eLy1EQ==}
-    engines: {node: '>=12'}
-
-  openapi-typescript@7.4.4:
-    resolution: {integrity: sha512-7j3nktnRzlQdlHnHsrcr6Gqz8f80/RhfA2I8s1clPI+jkY0hLNmnYVKBfuUEli5EEgK1B6M+ibdS5REasPlsUw==}
-    hasBin: true
-    peerDependencies:
-      typescript: ^5.x
+  open@11.0.0:
+    resolution: {integrity: sha512-smsWv2LzFjP03xmvFoJ331ss6h+jixfA4UUV/Bsiyuu4YJPfN+FIQGOIiv4w9/+MoHkfkJ22UIaQWRVFRfH6Vw==}
+    engines: {node: '>=20'}
 
   optionator@0.9.4:
     resolution: {integrity: sha512-6IpQ7mKUxRcZNLIObR0hz7lxsapSSIYNZJwXPGeF0mTVqGKFIXj1DQcMoT22S3ROcLyY/rz0PWaWZ9ayWmad9g==}
     engines: {node: '>= 0.8.0'}
 
-  ora@8.1.1:
-    resolution: {integrity: sha512-YWielGi1XzG1UTvOaCFaNgEnuhZVMSHYkW/FQ7UX8O26PtlpdM84c0f7wLPlkvx2RfiQmnzd61d/MGxmpQeJPw==}
-    engines: {node: '>=18'}
+  ora@9.4.1:
+    resolution: {integrity: sha512-6VlU9MLXbjVQD04AZCMX28hVtA5bUoadvUqO76MUCVA0ilwJbMiHsITRPfyVm6p/BC0Av/BXMujx39WCe1LEqw==}
+    engines: {node: '>=20'}
 
-  os-tmpdir@1.0.2:
-    resolution: {integrity: sha512-D2FR03Vir7FIu45XBY20mTb+/ZSWB00sjU9jdQXt83gDrI4Ztz5Fs7/yy74g2N5SVQY4xY1qDr4rNddwYRVX0g==}
-    engines: {node: '>=0.10.0'}
+  orderedmap@2.1.1:
+    resolution: {integrity: sha512-TvAWxi0nDe1j/rtMcWcIj94+Ffe6n7zhow33h40SKxmsmozs6dz/e+EajymfoFcHd7sxNn8yHM8839uixMOV6g==}
 
   outdent@0.5.0:
     resolution: {integrity: sha512-/jHxFIzoMXdqPzTaCpFzAAWhpkSjZPF4Vsn6jAfNpmbH/ymsmd7Qc6VE9BGn0L6YMj6uwpQLxCECpus4ukKS9Q==}
 
+  own-keys@1.0.2:
+    resolution: {integrity: sha512-19YVAg7T+WTrxggPukVq7DjTv6+PJ867TmhCvBsYwmbFCsZd344rq2Ld1p0wo8f8Qrrhgp82c6FJRqdXWtSEhg==}
+    engines: {node: '>= 0.4'}
+
+  oxc-parser@0.142.0:
+    resolution: {integrity: sha512-kKR+jPiRJYJDexVoziIg/FVGvr1fT1FZSSJOk6tVoMKKSlsf1Cso+cgGCJkOEDWOP174vRntCPFKg+AS7InWvw==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+
+  oxc-resolver@11.24.2:
+    resolution: {integrity: sha512-FY91FiDBj7ls5MsFS9jN3tjz2o0/zsdSsymlakySaBwVJZorHhkWyICLZMKxlu1R9vYo+sd3z1jwb4J8x7bNDw==}
+
+  oxfmt@0.60.0:
+    resolution: {integrity: sha512-fViX6i+gJuZWY+jI/fnR6WRbRj70GZ9RlCd30MygJrHTUNc4DxvKHWw8vBjMjffv3PgU5qWDR0AzmojQByqaZA==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    hasBin: true
+    peerDependencies:
+      svelte: ^5.0.0
+      vite-plus: '*'
+    peerDependenciesMeta:
+      svelte:
+        optional: true
+      vite-plus:
+        optional: true
+
+  oxlint-tsgolint@0.25.0:
+    resolution: {integrity: sha512-7DBpqyLZCfyoXiivyfzt9Xmju/K1RcN+Y1W7buEwrgRCWWF11v9alypPqWGZBmh2erDkKL/kVyhKUH2Px+t13A==}
+    hasBin: true
+
+  oxlint@1.77.0:
+    resolution: {integrity: sha512-qnGh8XJHaQ0dprrDXNQZgS0FgjI6v+V3+X8DwmaV++5Aamy6jGKfDdQ1TUvhUxtmKFAbEf4/WeO5QZX+5WSngg==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    hasBin: true
+    peerDependencies:
+      oxlint-tsgolint: '>=7.0.2001'
+      vite-plus: '*'
+    peerDependenciesMeta:
+      oxlint-tsgolint:
+        optional: true
+      vite-plus:
+        optional: true
+
+  p-cancelable@2.1.1:
+    resolution: {integrity: sha512-BZOr3nRQHOntUjTrH8+Lh54smKHoHyur8We1V8DSMVrl5A2malOOwuJRnKRDjSnkoeBh4at6BwEnb5I7Jl31wg==}
+    engines: {node: '>=8'}
+
   p-filter@2.1.0:
     resolution: {integrity: sha512-ZBxxZ5sL2HghephhpGAQdoskxplTwr7ICaehZwLIlfL6acuVgZPm8yBNuRAFBGEqtD/hmUeq9eqLg2ys9Xr/yw==}
     engines: {node: '>=8'}
@@ -7596,10 +9539,6 @@ packages:
     resolution: {integrity: sha512-y3b8Kpd8OAN444hxfBbFfj1FY/RjtTd8tzYwhUqNYXx0fXx2iX4maP4Qr6qhIKbQXI02wTLAda4fYUbDagTUFw==}
     engines: {node: '>=6'}
 
-  p-map@4.0.0:
-    resolution: {integrity: sha512-/bjOqmgETBYB5BoEeGVea8dmvHb2m9GLy1E9W43yeyfP6QQCZGFNa+XRceJEuDB6zqr+gKpIAmlLebMpykw/MQ==}
-    engines: {node: '>=10'}
-
   p-try@2.2.0:
     resolution: {integrity: sha512-R4nPAVTAU0B9D35/Gk3uJf/7XYbQcyohSKdvAxIRSNghFl4e71hVoGnBNQz9cWaXxO2I10KTC+3jMdvvoKw6dQ==}
     engines: {node: '>=6'}
@@ -7611,38 +9550,32 @@ packages:
     resolution: {integrity: sha512-ua1L4OgXSBdsu1FPb7F3tYH0F48a6kxvod4pLUlGY9COeJAJQNX/sNH2IiEmsxw7lqYiAwrdHMjz1FctOsyDQg==}
     engines: {node: '>=18'}
 
-  package-manager-detector@0.2.7:
-    resolution: {integrity: sha512-g4+387DXDKlZzHkP+9FLt8yKj8+/3tOkPv7DVTJGGRm00RkEWgqbFstX1mXJ4M0VDYhUqsTOiISqNOJnhAu3PQ==}
+  package-manager-detector@0.2.11:
+    resolution: {integrity: sha512-BEnLolu+yuz22S56CU1SUKq3XC3PkwD5wv4ikR4MfGvnRVcmzXR9DwSlW2fEamyTPyXHomBJRzgapeuBvRNzJQ==}
+
+  package-manager-detector@1.8.0:
+    resolution: {integrity: sha512-yQA4H19AmPEoMUeavPMDIe1higySl/gH/yaQrkT/s07Qp+7pp2hYz30N3z2l5BkjVkF9Ow6o0wjJamm2y7Sn0A==}
 
   pako@1.0.11:
     resolution: {integrity: sha512-4hLB8Py4zZce5s4yd9XzopqwVv/yGNhV1Bl8NTmCq1763HeK2+EwVTv+leGeL13Dnh2wfbqowVPXCIO0z4taYw==}
 
+  pako@2.2.0:
+    resolution: {integrity: sha512-zJq6RP/5q+TO2OpFV3FHzlPnFjmkb7Nc99a5SNjJE+uu/PkpChs+NIZSSzbBoD+6kjiISXjfYdwj1ZRQ81dz/w==}
+
   param-case@3.0.4:
     resolution: {integrity: sha512-RXlj7zCYokReqWpOPH9oYivUzLYZ5vAPIfEmCTNViosC78F8F0H9y7T7gG2M39ymgutxF5gcFEsyZQSph9Bp3A==}
 
-  parchment@1.1.4:
-    resolution: {integrity: sha512-J5FBQt/pM2inLzg4hEWmzQx/8h8D0CiDxaG3vyp9rKrQRSDgBlhjdP5jQGgosEajXPSQouXGHOmVdgo7QmJuOg==}
+  parchment@3.0.0:
+    resolution: {integrity: sha512-HUrJFQ/StvgmXRcQ1ftY6VEZUq3jA2t9ncFN4F84J/vN0/FPpQF+8FKXb3l6fLces6q0uOHj6NJn+2xvZnxO6A==}
 
   parent-module@1.0.1:
     resolution: {integrity: sha512-GQ2EWRpQV8/o+Aw8YqtfZZPfNRWZYkbidE9k5rpl/hC3vtHHBfGm2Ifi6qWV+coDGkrUKZAxE3Lot5kcsRlh+g==}
     engines: {node: '>=6'}
 
-  parent-module@2.0.0:
-    resolution: {integrity: sha512-uo0Z9JJeWzv8BG+tRcapBKNJ0dro9cLyczGzulS6EfeyAdeC9sbojtW6XwvYxJkEne9En+J2XEl4zyglVeIwFg==}
-    engines: {node: '>=8'}
-
-  parse-imports@2.2.1:
-    resolution: {integrity: sha512-OL/zLggRp8mFhKL0rNORUTR4yBYujK/uU+xZL+/0Rgm2QE4nLO9v8PzEweSJEbMGKmDRjJE4R3IMJlL2di4JeQ==}
-    engines: {node: '>= 18'}
-
   parse-json@5.2.0:
     resolution: {integrity: sha512-ayCKvm/phCGxOkYRSCM82iDwct8/EonSEgCSxWxD7ve6jHggsFl4fZVQBPRNgQoKiuV/odhFrGzQXZwbifC8Rg==}
     engines: {node: '>=8'}
 
-  parse-json@8.1.0:
-    resolution: {integrity: sha512-rum1bPifK5SSar35Z6EKZuYPJx85pkNaFrxBK3mwdfSJ1/WKbYrjoW/zTPSjRRamfmVX1ACBIdFAO0VRErW/EA==}
-    engines: {node: '>=18'}
-
   parse-ms@4.0.0:
     resolution: {integrity: sha512-TXfryirbmq34y8QBwgqCVLi+8oA3oWx2eAnSn62ITyEhEYaWRlVZ2DvMM9eZbMs/RfxPu/PK/aBLyGj4IrqMHw==}
     engines: {node: '>=18'}
@@ -7651,18 +9584,14 @@ packages:
     resolution: {integrity: sha512-3YHlOa/JgH6Mnpr05jP9eDG254US9ek25LyIxZlDItp2iJtwyaXQb57lBYLdT3MowkUFYEV2XXNAYIPlESvJlA==}
     engines: {node: '>= 0.10'}
 
-  parse-passwd@1.0.0:
-    resolution: {integrity: sha512-1Y1A//QUXEZK7YKz+rD9WydcE1+EuPr6ZBgKecAB8tmoW6UFv0NREVJe1p+jRxtThkcbbKkfwIbWJe/IeE6m2Q==}
-    engines: {node: '>=0.10.0'}
-
   parse5-htmlparser2-tree-adapter@7.1.0:
     resolution: {integrity: sha512-ruw5xyKs6lrpo9x9rCZqZZnIUntICjQAd0Wsmp396Ul9lN/h+ifgVV1x1gZHi8euej6wTfpqX8j+BFQxF0NS/g==}
 
   parse5-parser-stream@7.1.2:
     resolution: {integrity: sha512-JyeQc9iwFLn5TbvvqACIF/VXG6abODeB3Fwmv/TGdLk2LfbWkaySGY72at4+Ty7EkPZj854u4CrICqNk2qIbow==}
 
-  parse5@7.2.1:
-    resolution: {integrity: sha512-BuBYQYlv1ckiPdQi/ohiivi9Sagc9JG+Ozs0r7b/0iK3sKmrb0b9FdWdBbOdx6hBCM/F9Ir82ofnBhtZOjCRPQ==}
+  parse5@7.3.0:
+    resolution: {integrity: sha512-IInvU7fabl34qmi9gY8XOVxhYyMyuH2xUNpb2q8/Y+7552KlejkRvqvD19nMoUW/uQGGbqNpA6Tufu5FL5BZgw==}
 
   parseurl@1.3.3:
     resolution: {integrity: sha512-CiyeOxFT/JZyN5m0z9PfXw4SCBJ6Sygz1Dpl0wqjlhDEGGBP1GnsUVEL0p63hoG1fcj3fHynXi9NYO4nWOL+qQ==}
@@ -7678,10 +9607,6 @@ packages:
     resolution: {integrity: sha512-ak9Qy5Q7jYb2Wwcey5Fpvg2KoAc/ZIhLSLOSBmRmygPsGwkVVt0fZa0qrtMz+m6tJTAHfZQ8FnmB4MG4LWy7/w==}
     engines: {node: '>=8'}
 
-  path-exists@5.0.0:
-    resolution: {integrity: sha512-RjhtfwJOxzcFmNOi6ltcbcu4Iu+FL3zEj83dk4kAS+fVpTxXLO1b38RvJgT/0QwvV/L3aY9TAnyv0EOqW4GoMQ==}
-    engines: {node: ^12.20.0 || ^14.13.1 || >=16.0.0}
-
   path-is-absolute@1.0.1:
     resolution: {integrity: sha512-AVbw3UJ2e9bq64vSaS9Am0fje1Pa8pbGqTTsmXfaIiMpnr5DlDhfJOuLj9Sf95ZPVDAUerDfEk88MPmPe7UCQg==}
     engines: {node: '>=0.10.0'}
@@ -7701,342 +9626,203 @@ packages:
     resolution: {integrity: sha512-Xa4Nw17FS9ApQFJ9umLiJS4orGjm7ZzwUrwamcGQuHSzDyth9boKDaycYdDcZDuqYATXw4HFXgaqWTctW/v1HA==}
     engines: {node: '>=16 || 14 >=14.18'}
 
-  path-scurry@2.0.0:
-    resolution: {integrity: sha512-ypGJsmGtdXUOeM5u93TyeIEfEhM6s+ljAhrk5vAvSx8uyY/02OvrZnA0YNGUrPXfpJMgI1ODd3nwz8Npx4O4cg==}
-    engines: {node: 20 || >=22}
+  path-scurry@2.0.2:
+    resolution: {integrity: sha512-3O/iVVsJAPsOnpwWIeD+d6z/7PmqApyQePUtCndjatj/9I5LylHvt5qluFaBT3I5h3r1ejfR056c+FCv+NnNXg==}
+    engines: {node: 18 || 20 || >=22}
 
   path-type@4.0.0:
     resolution: {integrity: sha512-gDKb8aZMDeD/tZWs9P6+q0J9Mwkdl6xMV8TjnGP3qJVJ06bdMgkbBlLU8IdfOsIsFz2BW1rNVT3XuNEl8zPAvw==}
     engines: {node: '>=8'}
 
-  path-type@5.0.0:
-    resolution: {integrity: sha512-5HviZNaZcfqP95rwpv+1HDgUamezbqdSYTyzjTvwtJSnIH+3vnbmWsItli8OFEndS984VT55M3jduxZbX351gg==}
-    engines: {node: '>=12'}
+  pathe@2.0.3:
+    resolution: {integrity: sha512-WUjGcAqP1gQacoQe+OBJsFA7Ld4DyXuUIjZ5cc75cLHvJ7dtNsTugphxIADwspS+AraAUePCKrSVtPLFj/F88w==}
 
-  pathe@0.2.0:
-    resolution: {integrity: sha512-sTitTPYnn23esFR3RlqYBWn4c45WGeLcsKzQiUpXJAyfcWkolvlYpV8FLo7JishK946oQwMFUCHXQ9AjGPKExw==}
+  pe-library@0.4.1:
+    resolution: {integrity: sha512-eRWB5LBz7PpDu4PUlwT0PhnQfTQJlDDdPa35urV4Osrm0t0AqQFGn+UIkU3klZvwJ8KPO3VbBFsXquA6p6kqZw==}
+    engines: {node: '>=12', npm: '>=6'}
 
-  pathe@1.1.2:
-    resolution: {integrity: sha512-whLdWMYL2TwI08hn8/ZqAbrVemu0LNaNNJZX73O6qaIdCTfXutsLhMkjdENX0qhsQ9uIimo4/aQOmXkoon2nDQ==}
-
-  pathval@2.0.0:
-    resolution: {integrity: sha512-vE7JKRyES09KiunauX7nd2Q9/L7lhok4smP9RZTDeD4MVs72Dp2qNFVz39Nz5a0FVEW0BJR6C0DYrq6unoziZA==}
-    engines: {node: '>= 14.16'}
-
-  perfect-debounce@1.0.0:
-    resolution: {integrity: sha512-xCy9V055GLEqoFaHoC1SoLIaLmWctgCUaBaWxDZ7/Zx4CTyX7cJQLJOok/orfjZAh9kEYpjJa4d0KcJmCbctZA==}
+  perfect-debounce@2.1.0:
+    resolution: {integrity: sha512-LjgdTytVFXeUgtHZr9WYViYSM/g8MkcTPYDlPa3cDqMirHjKiSZPYd6DoL7pK8AJQr+uWkQvCjHNdiMqsrJs+g==}
 
   picocolors@1.1.1:
     resolution: {integrity: sha512-xceH2snhtb5M9liqDsmEw56le376mTZkEX/jEb/RxNFyegNul7eNslCXP9FDj/Lcu0X8KEyMceP2ntpaHrDEVA==}
 
-  picomatch@2.3.1:
-    resolution: {integrity: sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==}
+  picomatch@2.3.2:
+    resolution: {integrity: sha512-V7+vQEJ06Z+c5tSye8S+nHUfI51xoXIXjHQ99cQtKUkQqqO1kO/KCJUfZXuB47h/YBlDhah2H3hdUGXn8ie0oA==}
     engines: {node: '>=8.6'}
 
-  picomatch@4.0.2:
-    resolution: {integrity: sha512-M7BAV6Rlcy5u+m6oPhAPFgJTzAioX/6B0DxyvDlo9l8+T3nLKbrczg2WLUyzd45L8RqfUMyGPzekbMvX2Ldkwg==}
+  picomatch@4.0.5:
+    resolution: {integrity: sha512-RvwwcruNjI1ncT5xRakeyS9Lf8lcItv34KD+aif+VH9kduAyfYBipGh12274xtenIPZ119/R9BdTBa8gAwSh0A==}
     engines: {node: '>=12'}
 
-  pidtree@0.6.0:
-    resolution: {integrity: sha512-eG2dWTVw5bzqGRztnHExczNxt5VGsE6OwTeCG3fdUf9KBsZzO3R5OIIIzWR+iZA0NtZ+RDVdaoE2dK1cn6jH4g==}
-    engines: {node: '>=0.10'}
-    hasBin: true
-
-  pify@2.3.0:
-    resolution: {integrity: sha512-udgsAY+fTnvv7kI7aaxbqwWNb0AHiB0qBO89PZKPkoTmGOgdbrHDKD+0B2X4uTfJ/FT1R09r9gTsjUjNJotuog==}
-    engines: {node: '>=0.10.0'}
-
   pify@4.0.1:
     resolution: {integrity: sha512-uB80kBFb/tfd68bVleG9T5GGsGPjJrLAUpR5PZIrhBnIaRTQRjqdJSsIKkOP6OAIFbj7GOrcudc5pNjZ+geV2g==}
     engines: {node: '>=6'}
 
-  pinia-plugin-persistedstate@4.2.0:
-    resolution: {integrity: sha512-3buhA7ac+ssbOIx3VRCC8oHkoFwhDM9oHRCjo7nj+O8WUqnW+jRqh7eYT5eS/DNa3H28zp3dYf/nd/Vc8zj8eQ==}
+  pinia-plugin-persistedstate@4.7.1:
+    resolution: {integrity: sha512-WHOqh2esDlR3eAaknPbqXrkkj0D24h8shrDPqysgCFR6ghqP/fpFfJmMPJp0gETHsvrh9YNNg6dQfo2OEtDnIQ==}
     peerDependencies:
-      '@pinia/nuxt': '>=0.9.0'
-      pinia: 2.2.2
+      '@nuxt/kit': '>=3.0.0'
+      '@pinia/nuxt': '>=0.10.0'
+      pinia: ^4.0.2
     peerDependenciesMeta:
+      '@nuxt/kit':
+        optional: true
       '@pinia/nuxt':
         optional: true
       pinia:
         optional: true
 
-  pinia@2.2.2:
-    resolution: {integrity: sha512-ja2XqFWZC36mupU4z1ZzxeTApV7DOw44cV4dhQ9sGwun+N89v/XP7+j7q6TanS1u1tdbK4r+1BUx7heMaIdagA==}
+  pinia@4.0.2:
+    resolution: {integrity: sha512-yKVVA7bSj5oRZFp/Ab9wLlmyb5gPUYEiIm4ryiWTe/xe7PtkRdMVOp1X1ggvq0c6Uj7Q0Du1HnV2mtAwM0Ks1g==}
     peerDependencies:
-      '@vue/composition-api': ^1.4.0
-      typescript: '>=4.4.4'
-      vue: ^3.5.13
+      '@vue/devtools-api': ^8.1.5
+      typescript: '>=5.6.0'
+      vue: ^3.5.40
     peerDependenciesMeta:
-      '@vue/composition-api':
-        optional: true
       typescript:
         optional: true
 
-  pirates@4.0.6:
-    resolution: {integrity: sha512-saLsH7WeYYPiD25LDuLRRY/i+6HaPYr6G1OUlN39otzkSTxKnubR9RTxS3/Kk50s1g2JTgFwWQDQyplC5/SHZg==}
-    engines: {node: '>= 6'}
+  pkg-types@1.3.1:
+    resolution: {integrity: sha512-/Jm5M4RvtBFVkKWRu2BLUTNP8/M2a+UwuAX+ae4770q1qVGtfjG+WTCupoZixokjmHiry8uI+dlY8KXYV5HVVQ==}
 
-  pkg-types@1.2.1:
-    resolution: {integrity: sha512-sQoqa8alT3nHjGuTjuKgOnvjo4cljkufdtLMnO2LBP/wRwuDlo1tkaEdMxCRhyGRPacv/ztlZgDPm2b7FAmEvw==}
+  pkg-types@2.3.1:
+    resolution: {integrity: sha512-y+ichcgc2LrADuhLNAx8DFjVfgz91pRxfZdI3UDhxHvcVEZsenLO+7XaU5vOp0u/7V/wZ+plyuQxtrDlZJ+yeg==}
 
-  playwright-core@1.49.1:
-    resolution: {integrity: sha512-BzmpVcs4kE2CH15rWfzpjzVGhWERJfmnXmniSyKeRZUs9Ws65m+RGIi7mjJK/euCegfn3i7jvqWeWyHe9y3Vgg==}
-    engines: {node: '>=18'}
+  pkijs@3.4.0:
+    resolution: {integrity: sha512-emEcLuomt2j03vxD54giVB4SxTjnsqkU692xZOZXHDVoYyypEm+b3jpiTcc+Cf+myooc+/Ly0z01jqeNHVgJGw==}
+    engines: {node: '>=16.0.0'}
+
+  playwright-core@1.62.1:
+    resolution: {integrity: sha512-wPYSwEBJY9GHraISXqyqtx0na0LpO3XEX7jNDhntbex7tzUS7kLnZsOlFruFJB4Hi/rhDMjXGqHewDZ68nYZVw==}
+    engines: {node: '>=20'}
     hasBin: true
 
-  playwright@1.49.1:
-    resolution: {integrity: sha512-VYL8zLoNTBxVOrJBbDuRgDWa3i+mfQgDTrL8Ah9QXZ7ax4Dsj0MSq5bYgytRnDVVe+njoKnfsYkH3HzqVj5UZA==}
-    engines: {node: '>=18'}
+  playwright@1.62.1:
+    resolution: {integrity: sha512-0M+L3LAD8/nm554LOla9Ayx0j0tmFZ0FBcoQ7F1VuVHpM/XpiC8RcDzBQB8W5+hA8L22THxELzeF+2WcUzvcLg==}
+    engines: {node: '>=20'}
     hasBin: true
 
-  please-upgrade-node@3.2.0:
-    resolution: {integrity: sha512-gQR3WpIgNIKwBMVLkpMUeR3e1/E1y42bqDQZfql+kDeXd8COYfM8PQA4X6y7a8u9Ua9FHmsrrmirW2vHs45hWg==}
-
-  pluralize@8.0.0:
-    resolution: {integrity: sha512-Nc3IT5yHzflTfbjgqWcCPpo7DaKy4FnpB0l/zCAW0Tc7jxAiuqSxHasntB3D7887LSrA93kDJ9IXovxJYxyLCA==}
-    engines: {node: '>=4'}
+  plist@3.1.0:
+    resolution: {integrity: sha512-uysumyrvkUX0rX/dEVqt8gC3sTBzd4zoWfLeS29nb53imdaXVvLINYXTI2GNqzaMuvacNx4uJQ8+b3zXR0pkgQ==}
+    engines: {node: '>=10.4.0'}
 
   pngjs@5.0.0:
     resolution: {integrity: sha512-40QW5YalBNfQo5yRYmiw7Yz6TKKVr3h6970B2YE+3fQpsWcrbj1PzJgxeJ19DRQjhMbKPIuMY8rFaXc8moolVw==}
     engines: {node: '>=10.13.0'}
 
-  possible-typed-array-names@1.0.0:
-    resolution: {integrity: sha512-d7Uw+eZoloe0EHDIYoe+bQ5WXnGMOpmiZFTuMWCwpjzzkL2nTjcKiAk4hh8TjnGye2TwWOk3UXucZ+3rbmBa8Q==}
+  pnpm-workspace-yaml@1.7.0:
+    resolution: {integrity: sha512-cgjaozHkjWL4H8oKZydEWE4mg31XydK3/1cLKjHvwnFAXutp45yAlMKljpOdZEq4TtLuzYAMvy9j05wRm3aoPw==}
+
+  popmotion@11.0.5:
+    resolution: {integrity: sha512-la8gPM1WYeFznb/JqF4GiTkRRPZsfaj2+kCxqQgr2MJylMmIKUwBfWW8Wa5fml/8gmtlD5yI01MP1QCZPWmppA==}
+
+  possible-typed-array-names@1.1.0:
+    resolution: {integrity: sha512-/+5VFTchJDoVj3bhoqi6UeymcD00DAwb1nJwamzPvHEszJ4FpF6SNNbUbOS8yI56qHzdV8eK0qEfOSiodkTdxg==}
     engines: {node: '>= 0.4'}
 
-  postcss-antd-fixes@0.2.0:
-    resolution: {integrity: sha512-WuV4Ip5DnLg8q+wmNXUq13wZZcA5Lrj+em3Jznl4cxItZDgFp4wEh+5ba59TvFeHfwNuTEZ6YNDsYP9DG6NurQ==}
-    peerDependencies:
-      postcss: ^8.0.0
-
-  postcss-attribute-case-insensitive@7.0.1:
-    resolution: {integrity: sha512-Uai+SupNSqzlschRyNx3kbCTWgY/2hcwtHEI/ej2LJWc9JJ77qKgGptd8DHwY1mXtZ7Aoh4z4yxfwMBue9eNgw==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss: ^8.4
-
-  postcss-calc@10.0.2:
-    resolution: {integrity: sha512-DT/Wwm6fCKgpYVI7ZEWuPJ4az8hiEHtCUeYjZXqU7Ou4QqYh1Df2yCQ7Ca6N7xqKPFkxN3fhf+u9KSoOCJNAjg==}
+  postcss-calc@10.1.1:
+    resolution: {integrity: sha512-NYEsLHh8DgG/PRH2+G9BTuUdtf9ViS+vdoQ0YA5OQdGsfN4ztiwtDWNtBl9EKeqNMFnIu8IKZ0cLxEQ5r5KVMw==}
     engines: {node: ^18.12 || ^20.9 || >=22.0}
     peerDependencies:
       postcss: ^8.4.38
 
-  postcss-clamp@4.1.0:
-    resolution: {integrity: sha512-ry4b1Llo/9zz+PKC+030KUnPITTJAHeOwjfAyyB60eT0AorGLdzp52s31OsPRHRf8NchkgFoG2y6fCfn1IV1Ow==}
-    engines: {node: '>=7.6.0'}
-    peerDependencies:
-      postcss: ^8.4.6
-
-  postcss-color-functional-notation@7.0.6:
-    resolution: {integrity: sha512-wLXvm8RmLs14Z2nVpB4CWlnvaWPRcOZFltJSlcbYwSJ1EDZKsKDhPKIMecCnuU054KSmlmubkqczmm6qBPCBhA==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss: ^8.4
-
-  postcss-color-hex-alpha@10.0.0:
-    resolution: {integrity: sha512-1kervM2cnlgPs2a8Vt/Qbe5cQ++N7rkYo/2rz2BkqJZIHQwaVuJgQH38REHrAi4uM0b1fqxMkWYmese94iMp3w==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss: ^8.4
-
-  postcss-color-rebeccapurple@10.0.0:
-    resolution: {integrity: sha512-JFta737jSP+hdAIEhk1Vs0q0YF5P8fFcj+09pweS8ktuGuZ8pPlykHsk6mPxZ8awDl4TrcxUqJo9l1IhVr/OjQ==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss: ^8.4
-
-  postcss-colormin@7.0.2:
-    resolution: {integrity: sha512-YntRXNngcvEvDbEjTdRWGU606eZvB5prmHG4BF0yLmVpamXbpsRJzevyy6MZVyuecgzI2AWAlvFi8DAeCqwpvA==}
+  postcss-colormin@7.0.10:
+    resolution: {integrity: sha512-yFr6JezOolHLta/buLE71VKPh2mXursp4saVe98/ol8ZnEWhL+racShqPKlvd/DKWLre/39B6HhcMXf7RZ3hxg==}
     engines: {node: ^18.12.0 || ^20.9.0 || >=22.0}
     peerDependencies:
-      postcss: ^8.4.31
+      postcss: ^8.5.13
 
-  postcss-convert-values@7.0.4:
-    resolution: {integrity: sha512-e2LSXPqEHVW6aoGbjV9RsSSNDO3A0rZLCBxN24zvxF25WknMPpX8Dm9UxxThyEbaytzggRuZxaGXqaOhxQ514Q==}
+  postcss-convert-values@7.0.12:
+    resolution: {integrity: sha512-xurKu5qqk4viR3Cp3p4xBR4KfnZm4w4ys6+UBwBmeuBSNkH7+DtLnYOYnOffgtE4yx8sH9S1VZ6RAAvROXzP2Q==}
     engines: {node: ^18.12.0 || ^20.9.0 || >=22.0}
     peerDependencies:
-      postcss: ^8.4.31
+      postcss: ^8.5.13
 
-  postcss-custom-media@11.0.5:
-    resolution: {integrity: sha512-SQHhayVNgDvSAdX9NQ/ygcDQGEY+aSF4b/96z7QUX6mqL5yl/JgG/DywcF6fW9XbnCRE+aVYk+9/nqGuzOPWeQ==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss: ^8.4
-
-  postcss-custom-properties@14.0.4:
-    resolution: {integrity: sha512-QnW8FCCK6q+4ierwjnmXF9Y9KF8q0JkbgVfvQEMa93x1GT8FvOiUevWCN2YLaOWyByeDX8S6VFbZEeWoAoXs2A==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss: ^8.4
-
-  postcss-custom-selectors@8.0.4:
-    resolution: {integrity: sha512-ASOXqNvDCE0dAJ/5qixxPeL1aOVGHGW2JwSy7HyjWNbnWTQCl+fDc968HY1jCmZI0+BaYT5CxsOiUhavpG/7eg==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss: ^8.4
-
-  postcss-dir-pseudo-class@9.0.1:
-    resolution: {integrity: sha512-tRBEK0MHYvcMUrAuYMEOa0zg9APqirBcgzi6P21OhxtJyJADo/SWBwY1CAwEohQ/6HDaa9jCjLRG7K3PVQYHEA==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss: ^8.4
-
-  postcss-discard-comments@7.0.3:
-    resolution: {integrity: sha512-q6fjd4WU4afNhWOA2WltHgCbkRhZPgQe7cXF74fuVB/ge4QbM9HEaOIzGSiMvM+g/cOsNAUGdf2JDzqA2F8iLA==}
+  postcss-discard-comments@7.0.8:
+    resolution: {integrity: sha512-CvvS5S9WrXblFXCEJ9nVo+4z+eA7zSC7Z88V1HEJuwlQhlFnYTIjg1xJY+BCUiG2bvICap2tXii4mP22BD108Q==}
     engines: {node: ^18.12.0 || ^20.9.0 || >=22.0}
     peerDependencies:
-      postcss: ^8.4.31
+      postcss: ^8.5.13
 
-  postcss-discard-duplicates@7.0.1:
-    resolution: {integrity: sha512-oZA+v8Jkpu1ct/xbbrntHRsfLGuzoP+cpt0nJe5ED2FQF8n8bJtn7Bo28jSmBYwqgqnqkuSXJfSUEE7if4nClQ==}
+  postcss-discard-duplicates@7.0.4:
+    resolution: {integrity: sha512-VBNn1+EuMZkeGVVtz0gRfbNGtx9IFgAsAV+E2pHtXPrp4qfGBkhTIiAuE/wrb+Y6Pakg9NewAlfTpYIFAWODtw==}
     engines: {node: ^18.12.0 || ^20.9.0 || >=22.0}
     peerDependencies:
-      postcss: ^8.4.31
+      postcss: ^8.5.13
 
-  postcss-discard-empty@7.0.0:
-    resolution: {integrity: sha512-e+QzoReTZ8IAwhnSdp/++7gBZ/F+nBq9y6PomfwORfP7q9nBpK5AMP64kOt0bA+lShBFbBDcgpJ3X4etHg4lzA==}
+  postcss-discard-empty@7.0.3:
+    resolution: {integrity: sha512-M2pyjQCU+/7cMHVtL6bKTHjv0lZnPLMpicgr67Dlth7AbuV9gjVTtUqaRwn6Pp6BwSDspUzhz8SaUrRykJU5Dw==}
     engines: {node: ^18.12.0 || ^20.9.0 || >=22.0}
     peerDependencies:
-      postcss: ^8.4.31
+      postcss: ^8.5.13
 
-  postcss-discard-overridden@7.0.0:
-    resolution: {integrity: sha512-GmNAzx88u3k2+sBTZrJSDauR0ccpE24omTQCVmaTTZFz1du6AasspjaUPMJ2ud4RslZpoFKyf+6MSPETLojc6w==}
+  postcss-discard-overridden@7.0.3:
+    resolution: {integrity: sha512-aNovXo9UsZuRNLzHJtp13lHIvinDPfiXBPePpXkSjCbgp++iU2FqE+YxvjIsg6EdyPZsASFbfu+JcBFVsErXIQ==}
     engines: {node: ^18.12.0 || ^20.9.0 || >=22.0}
     peerDependencies:
-      postcss: ^8.4.31
+      postcss: ^8.5.13
 
-  postcss-double-position-gradients@6.0.0:
-    resolution: {integrity: sha512-JkIGah3RVbdSEIrcobqj4Gzq0h53GG4uqDPsho88SgY84WnpkTpI0k50MFK/sX7XqVisZ6OqUfFnoUO6m1WWdg==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss: ^8.4
-
-  postcss-focus-visible@10.0.1:
-    resolution: {integrity: sha512-U58wyjS/I1GZgjRok33aE8juW9qQgQUNwTSdxQGuShHzwuYdcklnvK/+qOWX1Q9kr7ysbraQ6ht6r+udansalA==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss: ^8.4
-
-  postcss-focus-within@9.0.1:
-    resolution: {integrity: sha512-fzNUyS1yOYa7mOjpci/bR+u+ESvdar6hk8XNK/TRR0fiGTp2QT5N+ducP0n3rfH/m9I7H/EQU6lsa2BrgxkEjw==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss: ^8.4
-
-  postcss-font-variant@5.0.0:
-    resolution: {integrity: sha512-1fmkBaCALD72CK2a9i468mA/+tr9/1cBxRRMXOUaZqO43oWPR5imcyPjXwuv7PXbCid4ndlP5zWhidQVVa3hmA==}
-    peerDependencies:
-      postcss: ^8.1.0
-
-  postcss-gap-properties@6.0.0:
-    resolution: {integrity: sha512-Om0WPjEwiM9Ru+VhfEDPZJAKWUd0mV1HmNXqp2C29z80aQ2uP9UVhLc7e3aYMIor/S5cVhoPgYQ7RtfeZpYTRw==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss: ^8.4
-
-  postcss-html@1.7.0:
-    resolution: {integrity: sha512-MfcMpSUIaR/nNgeVS8AyvyDugXlADjN9AcV7e5rDfrF1wduIAGSkL4q2+wgrZgA3sHVAHLDO9FuauHhZYW2nBw==}
+  postcss-html@1.8.1:
+    resolution: {integrity: sha512-OLF6P7qctfAWayOhLpcVnTGqVeJzu2W3WpIYelfz2+JV5oGxfkcEvweN9U4XpeqE0P98dcD9ssusGwlF0TK0uQ==}
     engines: {node: ^12 || >=14}
 
-  postcss-image-set-function@7.0.0:
-    resolution: {integrity: sha512-QL7W7QNlZuzOwBTeXEmbVckNt1FSmhQtbMRvGGqqU4Nf4xk6KUEQhAoWuMzwbSv5jxiRiSZ5Tv7eiDB9U87znA==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss: ^8.4
-
-  postcss-import@15.1.0:
-    resolution: {integrity: sha512-hpr+J05B2FVYUAXHeK1YyI267J/dDDhMU6B6civm8hSY1jYJnBXxzKDKDswzJmtLHryrjhnDjqqp/49t8FALew==}
-    engines: {node: '>=14.0.0'}
-    peerDependencies:
-      postcss: ^8.0.0
-
-  postcss-import@16.1.0:
-    resolution: {integrity: sha512-7hsAZ4xGXl4MW+OKEWCnF6T5jqBw80/EE9aXg1r2yyn1RsVEU8EtKXbijEODa+rg7iih4bKf7vlvTGYR4CnPNg==}
-    engines: {node: '>=18.0.0'}
-    peerDependencies:
-      postcss: ^8.0.0
-
-  postcss-js@4.0.1:
-    resolution: {integrity: sha512-dDLF8pEO191hJMtlHFPRa8xsizHaM82MLfNkUHdUtVEV3tgTp5oj+8qbEqYM57SLfc74KSbw//4SeJma2LRVIw==}
-    engines: {node: ^12 || ^14 || >= 16}
-    peerDependencies:
-      postcss: ^8.4.21
-
-  postcss-lab-function@7.0.6:
-    resolution: {integrity: sha512-HPwvsoK7C949vBZ+eMyvH2cQeMr3UREoHvbtra76/UhDuiViZH6pir+z71UaJQohd7VDSVUdR6TkWYKExEc9aQ==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss: ^8.4
-
-  postcss-load-config@4.0.2:
-    resolution: {integrity: sha512-bSVhyJGL00wMVoPUzAVAnbEoWyqRxkjv64tUl427SKnPrENtq6hJwUojroMz2VB+Q1edmi4IfrAPpami5VVgMQ==}
-    engines: {node: '>= 14'}
+  postcss-load-config@6.0.1:
+    resolution: {integrity: sha512-oPtTM4oerL+UXmx+93ytZVN82RrlY/wPUV8IeDxFrzIjXOLF1pN+EmKPLbubvKHT2HC20xXsCAH2Z+CKV6Oz/g==}
+    engines: {node: '>= 18'}
     peerDependencies:
+      jiti: '>=1.21.0'
       postcss: '>=8.0.9'
-      ts-node: '>=9.0.0'
+      tsx: ^4.8.1
+      yaml: ^2.4.2
     peerDependenciesMeta:
+      jiti:
+        optional: true
       postcss:
         optional: true
-      ts-node:
+      tsx:
+        optional: true
+      yaml:
         optional: true
-
-  postcss-logical@8.0.0:
-    resolution: {integrity: sha512-HpIdsdieClTjXLOyYdUPAX/XQASNIwdKt5hoZW08ZOAiI+tbV0ta1oclkpVkW5ANU+xJvk3KkA0FejkjGLXUkg==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss: ^8.4
 
   postcss-media-query-parser@0.2.3:
     resolution: {integrity: sha512-3sOlxmbKcSHMjlUXQZKQ06jOswE7oVkXPxmZdoB1r5l0q6gTFTQSHxNxOrCccElbW7dxNytifNEo8qidX2Vsig==}
 
-  postcss-merge-longhand@7.0.4:
-    resolution: {integrity: sha512-zer1KoZA54Q8RVHKOY5vMke0cCdNxMP3KBfDerjH/BYHh4nCIh+1Yy0t1pAEQF18ac/4z3OFclO+ZVH8azjR4A==}
+  postcss-merge-longhand@7.0.7:
+    resolution: {integrity: sha512-b3mfYUxR388u5Pt0HPcVIUtUDn/k15UfTY9M+ORW+meCR6JLNxoZffiYvXyOYQoRYQNZyX/UFkMCM/mNHxe1qA==}
     engines: {node: ^18.12.0 || ^20.9.0 || >=22.0}
     peerDependencies:
-      postcss: ^8.4.31
+      postcss: ^8.5.13
 
-  postcss-merge-rules@7.0.4:
-    resolution: {integrity: sha512-ZsaamiMVu7uBYsIdGtKJ64PkcQt6Pcpep/uO90EpLS3dxJi6OXamIobTYcImyXGoW0Wpugh7DSD3XzxZS9JCPg==}
+  postcss-merge-rules@7.0.11:
+    resolution: {integrity: sha512-SJUPM18g2BmPhf8BVlbwqWz4aK3pLu6u6xjfwEzra7xL6IBR10sUaiB++EzqcVfadPHrKBSMlNdP+XieykhI+Q==}
     engines: {node: ^18.12.0 || ^20.9.0 || >=22.0}
     peerDependencies:
-      postcss: ^8.4.31
+      postcss: ^8.5.13
 
-  postcss-minify-font-values@7.0.0:
-    resolution: {integrity: sha512-2ckkZtgT0zG8SMc5aoNwtm5234eUx1GGFJKf2b1bSp8UflqaeFzR50lid4PfqVI9NtGqJ2J4Y7fwvnP/u1cQog==}
+  postcss-minify-font-values@7.0.3:
+    resolution: {integrity: sha512-yilG/VOaNI74IylQvAQQxm3/wZVBkXyYUqNUAdxqwtbWUXPsbK1q8Ms0mL83v+f8YicgcyfYCRZtWACUdYajpA==}
     engines: {node: ^18.12.0 || ^20.9.0 || >=22.0}
     peerDependencies:
-      postcss: ^8.4.31
+      postcss: ^8.5.13
 
-  postcss-minify-gradients@7.0.0:
-    resolution: {integrity: sha512-pdUIIdj/C93ryCHew0UgBnL2DtUS3hfFa5XtERrs4x+hmpMYGhbzo6l/Ir5de41O0GaKVpK1ZbDNXSY6GkXvtg==}
+  postcss-minify-gradients@7.0.5:
+    resolution: {integrity: sha512-YraROyQRg3BI1+Hg8E05B/JPdnTm8EDSVu4P2BxdM+CRiOyfmou809+chGIqo6fQqwjPGQ947nbGncSjmTU1WQ==}
     engines: {node: ^18.12.0 || ^20.9.0 || >=22.0}
     peerDependencies:
-      postcss: ^8.4.31
+      postcss: ^8.5.13
 
-  postcss-minify-params@7.0.2:
-    resolution: {integrity: sha512-nyqVLu4MFl9df32zTsdcLqCFfE/z2+f8GE1KHPxWOAmegSo6lpV2GNy5XQvrzwbLmiU7d+fYay4cwto1oNdAaQ==}
+  postcss-minify-params@7.0.9:
+    resolution: {integrity: sha512-R8itbB8BhlpoYyBm1ou0dD+vJnQ3F6adQipR4UnkCHUwlo+S9WXJaDRg1RHjC8YVAtIdrQzSWvJl40HnGDTKjA==}
     engines: {node: ^18.12.0 || ^20.9.0 || >=22.0}
     peerDependencies:
-      postcss: ^8.4.31
+      postcss: ^8.5.13
 
-  postcss-minify-selectors@7.0.4:
-    resolution: {integrity: sha512-JG55VADcNb4xFCf75hXkzc1rNeURhlo7ugf6JjiiKRfMsKlDzN9CXHZDyiG6x/zGchpjQS+UAgb1d4nqXqOpmA==}
+  postcss-minify-selectors@7.1.2:
+    resolution: {integrity: sha512-aQtrEWKwqafNlExcKHQvPGsXR2+vlUqqJtf5XsCQcgsSb5PL4wlujWBYDJuWsP4UnQX1YHDHU8qRlD+1PzTQ+Q==}
     engines: {node: ^18.12.0 || ^20.9.0 || >=22.0}
     peerDependencies:
-      postcss: ^8.4.31
-
-  postcss-nested@5.0.6:
-    resolution: {integrity: sha512-rKqm2Fk0KbA8Vt3AdGN0FB9OBOMDVajMG6ZCf/GoHgdxUJ4sBFp0A/uMIRm+MJUdo33YXEtjqIz8u7DAp8B7DA==}
-    engines: {node: '>=12.0'}
-    peerDependencies:
-      postcss: ^8.2.14
-
-  postcss-nested@6.2.0:
-    resolution: {integrity: sha512-HQbt28KulC5AJzG+cZtj9kvKB93CFCdLvog1WFLf1D+xmMvPGlBstkpTEZfK5+AN9hfJocyBFCNiqyS48bpgzQ==}
-    engines: {node: '>=12.0'}
-    peerDependencies:
-      postcss: ^8.2.14
+      postcss: ^8.5.13
 
   postcss-nested@7.0.2:
     resolution: {integrity: sha512-5osppouFc0VR9/VYzYxO03VaDa3e8F23Kfd6/9qcZTUI8P58GIYlArOET2Wq0ywSl2o2PjELhYOFI4W7l5QHKw==}
@@ -8044,123 +9830,77 @@ packages:
     peerDependencies:
       postcss: ^8.2.14
 
-  postcss-nesting@13.0.1:
-    resolution: {integrity: sha512-VbqqHkOBOt4Uu3G8Dm8n6lU5+9cJFxiuty9+4rcoyRPO9zZS1JIs6td49VIoix3qYqELHlJIn46Oih9SAKo+yQ==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss: ^8.4
-
-  postcss-normalize-charset@7.0.0:
-    resolution: {integrity: sha512-ABisNUXMeZeDNzCQxPxBCkXexvBrUHV+p7/BXOY+ulxkcjUZO0cp8ekGBwvIh2LbCwnWbyMPNJVtBSdyhM2zYQ==}
+  postcss-normalize-charset@7.0.3:
+    resolution: {integrity: sha512-NoBfZu8PR4c2NlmjvrqQTzCzLY79hwcSRgNQ3ZiNK0ABzf9kYKloE/jNj+/8GQY1wsm8pRRgANk6ydLH8cwo0Q==}
     engines: {node: ^18.12.0 || ^20.9.0 || >=22.0}
     peerDependencies:
-      postcss: ^8.4.31
+      postcss: ^8.5.13
 
-  postcss-normalize-display-values@7.0.0:
-    resolution: {integrity: sha512-lnFZzNPeDf5uGMPYgGOw7v0BfB45+irSRz9gHQStdkkhiM0gTfvWkWB5BMxpn0OqgOQuZG/mRlZyJxp0EImr2Q==}
+  postcss-normalize-display-values@7.0.3:
+    resolution: {integrity: sha512-ldsCX0QIt05pKIOobZtVQ48wXJecr+czw4+e1/YjVhLMqslShgpVxgPtI2CefURR8oyVoYaU/l829MMwExDMLw==}
     engines: {node: ^18.12.0 || ^20.9.0 || >=22.0}
     peerDependencies:
-      postcss: ^8.4.31
+      postcss: ^8.5.13
 
-  postcss-normalize-positions@7.0.0:
-    resolution: {integrity: sha512-I0yt8wX529UKIGs2y/9Ybs2CelSvItfmvg/DBIjTnoUSrPxSV7Z0yZ8ShSVtKNaV/wAY+m7bgtyVQLhB00A1NQ==}
+  postcss-normalize-positions@7.0.4:
+    resolution: {integrity: sha512-VEvlpeGd3Ju1Hqa/oN4jaP3+ms4laYwkEL9N9u+B6k54PZjXbW1n6wI+aVprf1BQXlCYpS5+1pl/7/vHiKgARg==}
     engines: {node: ^18.12.0 || ^20.9.0 || >=22.0}
     peerDependencies:
-      postcss: ^8.4.31
+      postcss: ^8.5.13
 
-  postcss-normalize-repeat-style@7.0.0:
-    resolution: {integrity: sha512-o3uSGYH+2q30ieM3ppu9GTjSXIzOrRdCUn8UOMGNw7Af61bmurHTWI87hRybrP6xDHvOe5WlAj3XzN6vEO8jLw==}
+  postcss-normalize-repeat-style@7.0.4:
+    resolution: {integrity: sha512-6mPKlY/8cSaDHxX502wERADarJsccwlky6yIrOapHH2ZgfoKAV94SbiTKfKEs4EEpdazuc3J72WsqeYk7hp9+Q==}
     engines: {node: ^18.12.0 || ^20.9.0 || >=22.0}
     peerDependencies:
-      postcss: ^8.4.31
+      postcss: ^8.5.13
 
-  postcss-normalize-string@7.0.0:
-    resolution: {integrity: sha512-w/qzL212DFVOpMy3UGyxrND+Kb0fvCiBBujiaONIihq7VvtC7bswjWgKQU/w4VcRyDD8gpfqUiBQ4DUOwEJ6Qg==}
+  postcss-normalize-string@7.0.3:
+    resolution: {integrity: sha512-HnEQPUchi1eznmDKEYrKUTqrprEq97SrpUYClgUkv7V2zRODD9DFoUsYU+m9ZOetmD5ku7fEMZB/lwy8IT6xVQ==}
     engines: {node: ^18.12.0 || ^20.9.0 || >=22.0}
     peerDependencies:
-      postcss: ^8.4.31
+      postcss: ^8.5.13
 
-  postcss-normalize-timing-functions@7.0.0:
-    resolution: {integrity: sha512-tNgw3YV0LYoRwg43N3lTe3AEWZ66W7Dh7lVEpJbHoKOuHc1sLrzMLMFjP8SNULHaykzsonUEDbKedv8C+7ej6g==}
+  postcss-normalize-timing-functions@7.0.3:
+    resolution: {integrity: sha512-zmEzHdvpZBZu0OKlbJSfgASQvaayyAoVuWtvyr34IJ/LyS+DaOKvvR3EvFJ9RWWtNIx+CMvO125OVophaxNYew==}
     engines: {node: ^18.12.0 || ^20.9.0 || >=22.0}
     peerDependencies:
-      postcss: ^8.4.31
+      postcss: ^8.5.13
 
-  postcss-normalize-unicode@7.0.2:
-    resolution: {integrity: sha512-ztisabK5C/+ZWBdYC+Y9JCkp3M9qBv/XFvDtSw0d/XwfT3UaKeW/YTm/MD/QrPNxuecia46vkfEhewjwcYFjkg==}
+  postcss-normalize-unicode@7.0.9:
+    resolution: {integrity: sha512-DRAdWfeh/TjmhLJsw91vdiWCnUod9iwvM7xyS02/nF/sLsCR3A8l3pztrSUrWG8DSBqfX7yEk9FM0USaVJ2mSg==}
     engines: {node: ^18.12.0 || ^20.9.0 || >=22.0}
     peerDependencies:
-      postcss: ^8.4.31
+      postcss: ^8.5.13
 
-  postcss-normalize-url@7.0.0:
-    resolution: {integrity: sha512-+d7+PpE+jyPX1hDQZYG+NaFD+Nd2ris6r8fPTBAjE8z/U41n/bib3vze8x7rKs5H1uEw5ppe9IojewouHk0klQ==}
+  postcss-normalize-url@7.0.3:
+    resolution: {integrity: sha512-CL93wmloq5qsffmFv+bw24MIRbmhHrp53qoh1LDAb/5TtjWEXI/np4xcP/Gw9oWCb2XyWnqHYLDUwiKRoJBA1Q==}
     engines: {node: ^18.12.0 || ^20.9.0 || >=22.0}
     peerDependencies:
-      postcss: ^8.4.31
+      postcss: ^8.5.13
 
-  postcss-normalize-whitespace@7.0.0:
-    resolution: {integrity: sha512-37/toN4wwZErqohedXYqWgvcHUGlT8O/m2jVkAfAe9Bd4MzRqlBmXrJRePH0e9Wgnz2X7KymTgTOaaFizQe3AQ==}
+  postcss-normalize-whitespace@7.0.3:
+    resolution: {integrity: sha512-FdHjjn+Ht5Z2ZRjNOmeCbNq6lq09sUYKpmlF/Aq0XjVNSLTL6fmHlA/3swN2wP2caY9GV/tjSDcIIyS7aN7W0A==}
     engines: {node: ^18.12.0 || ^20.9.0 || >=22.0}
     peerDependencies:
-      postcss: ^8.4.31
+      postcss: ^8.5.13
 
-  postcss-opacity-percentage@3.0.0:
-    resolution: {integrity: sha512-K6HGVzyxUxd/VgZdX04DCtdwWJ4NGLG212US4/LA1TLAbHgmAsTWVR86o+gGIbFtnTkfOpb9sCRBx8K7HO66qQ==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss: ^8.4
-
-  postcss-ordered-values@7.0.1:
-    resolution: {integrity: sha512-irWScWRL6nRzYmBOXReIKch75RRhNS86UPUAxXdmW/l0FcAsg0lvAXQCby/1lymxn/o0gVa6Rv/0f03eJOwHxw==}
+  postcss-ordered-values@7.0.4:
+    resolution: {integrity: sha512-nubSi49hDHQk4E8KIj+IbLY8Bg+8OcSUEhgyolgM+atnOvXjV7EjaR6bac4YGZoFyPa9mWoAF3EaYbWdFkKqVg==}
     engines: {node: ^18.12.0 || ^20.9.0 || >=22.0}
     peerDependencies:
-      postcss: ^8.4.31
+      postcss: ^8.5.13
 
-  postcss-overflow-shorthand@6.0.0:
-    resolution: {integrity: sha512-BdDl/AbVkDjoTofzDQnwDdm/Ym6oS9KgmO7Gr+LHYjNWJ6ExORe4+3pcLQsLA9gIROMkiGVjjwZNoL/mpXHd5Q==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss: ^8.4
-
-  postcss-page-break@3.0.4:
-    resolution: {integrity: sha512-1JGu8oCjVXLa9q9rFTo4MbeeA5FMe00/9C7lN4va606Rdb+HkxXtXsmEDrIraQ11fGz/WvKWa8gMuCKkrXpTsQ==}
-    peerDependencies:
-      postcss: ^8
-
-  postcss-place@10.0.0:
-    resolution: {integrity: sha512-5EBrMzat2pPAxQNWYavwAfoKfYcTADJ8AXGVPcUZ2UkNloUTWzJQExgrzrDkh3EKzmAx1evfTAzF9I8NGcc+qw==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss: ^8.4
-
-  postcss-preset-env@10.1.2:
-    resolution: {integrity: sha512-OqUBZ9ByVfngWhMNuBEMy52Izj07oIFA6K/EOGBlaSv+P12MiE1+S2cqXtS1VuW82demQ/Tzc7typYk3uHunkA==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss: ^8.4
-
-  postcss-pseudo-class-any-link@10.0.1:
-    resolution: {integrity: sha512-3el9rXlBOqTFaMFkWDOkHUTQekFIYnaQY55Rsp8As8QQkpiSgIYEcF/6Ond93oHiDsGb4kad8zjt+NPlOC1H0Q==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss: ^8.4
-
-  postcss-reduce-initial@7.0.2:
-    resolution: {integrity: sha512-pOnu9zqQww7dEKf62Nuju6JgsW2V0KRNBHxeKohU+JkHd/GAH5uvoObqFLqkeB2n20mr6yrlWDvo5UBU5GnkfA==}
+  postcss-reduce-initial@7.0.9:
+    resolution: {integrity: sha512-ztTNPdIxXTxtBcG03E9u8v44M4ElXbMIRT7pf2onlquGula0Y83nKKxqM22FA/hMgkfCjN7ohevkVlaNwI8iOQ==}
     engines: {node: ^18.12.0 || ^20.9.0 || >=22.0}
     peerDependencies:
-      postcss: ^8.4.31
+      postcss: ^8.5.13
 
-  postcss-reduce-transforms@7.0.0:
-    resolution: {integrity: sha512-pnt1HKKZ07/idH8cpATX/ujMbtOGhUfE+m8gbqwJE05aTaNw8gbo34a2e3if0xc0dlu75sUOiqvwCGY3fzOHew==}
+  postcss-reduce-transforms@7.0.3:
+    resolution: {integrity: sha512-FXsnN9ZwcZTT8Yf8cAHA8qIGUXcX6WfLd9JoYhrdDfmvsVhhfqkkv7m4AC3rwFOfz+GzkUa87OCKF9dUcicd+g==}
     engines: {node: ^18.12.0 || ^20.9.0 || >=22.0}
     peerDependencies:
-      postcss: ^8.4.31
-
-  postcss-replace-overflow-wrap@4.0.0:
-    resolution: {integrity: sha512-KmF7SBPphT4gPPcKZc7aDkweHiKEEO8cla/GjcBK+ckKxiZslIu3C4GCRW3DNfL0o7yW7kMQu9xlZ1kXRXLXtw==}
-    peerDependencies:
-      postcss: ^8.0.3
+      postcss: ^8.5.13
 
   postcss-resolve-nested-selector@0.1.6:
     resolution: {integrity: sha512-0sglIs9Wmkzbr8lQwEyIzlDOOC9bGmfVKcJTaxv3vMmd3uo4o4DerC3En0bnmgceeql9BfC8hRkp7cg0fjdVqw==}
@@ -8183,121 +9923,56 @@ packages:
     peerDependencies:
       postcss: ^8.4.29
 
-  postcss-selector-not@8.0.1:
-    resolution: {integrity: sha512-kmVy/5PYVb2UOhy0+LqUYAhKj7DUGDpSWa5LZqlkWJaaAV+dxxsOG3+St0yNLu6vsKD7Dmqx+nWQt0iil89+WA==}
-    engines: {node: '>=18'}
-    peerDependencies:
-      postcss: ^8.4
-
   postcss-selector-parser@6.0.10:
     resolution: {integrity: sha512-IQ7TZdoaqbT+LCpShg46jnZVlhWD2w6iQYAcYXfHARZ7X1t/UGhhceQDs5X0cGqKvYlHNOuv7Oa1xmb0oQuA3w==}
     engines: {node: '>=4'}
 
-  postcss-selector-parser@6.1.2:
-    resolution: {integrity: sha512-Q8qQfPiZ+THO/3ZrOrO0cJJKfpYCagtMUkXbnEfmgUjwXg6z/WBeOyS9APBBPCTSiDV+s4SwQGu8yFsiMRIudg==}
+  postcss-selector-parser@7.1.5:
+    resolution: {integrity: sha512-KvvtD7SrlBP7dlgkBghEE3r84CABm5SmV2aNcG4oCA+qDnJ/tvKonFVvwWAyyWUEwxuNawdfEAZKP9zM3oZ2Uw==}
     engines: {node: '>=4'}
 
-  postcss-selector-parser@7.0.0:
-    resolution: {integrity: sha512-9RbEr1Y7FFfptd/1eEdntyjMwLeghW1bHX9GWjXo19vx4ytPQhANltvVxDggzJl7mnWM+dX28kb6cyS/4iQjlQ==}
-    engines: {node: '>=4'}
-
-  postcss-sorting@8.0.2:
-    resolution: {integrity: sha512-M9dkSrmU00t/jK7rF6BZSZauA5MAaBW4i5EnJXspMwt4iqTh/L9j6fgMnbElEOfyRyfLfVbIHj/R52zHzAPe1Q==}
+  postcss-sorting@10.0.0:
+    resolution: {integrity: sha512-TXbU+h6vVRW+86c/+ewhWq9k7pr7ijASTnepVhCQiC87zAOTkvB1v2dHyWP+ggstSTX/PNvjzS+IOqzejndz9w==}
     peerDependencies:
       postcss: ^8.4.20
 
-  postcss-svgo@7.0.1:
-    resolution: {integrity: sha512-0WBUlSL4lhD9rA5k1e5D8EN5wCEyZD6HJk0jIvRxl+FDVOMlJ7DePHYWGGVc5QRqrJ3/06FTXM0bxjmJpmTPSA==}
+  postcss-svgo@7.1.3:
+    resolution: {integrity: sha512-2QfoFOYMcj8lwcVEf9WeTlkVIAm7u2QvOEhMzkQU3KUhhGX/l8hVV9EtjMv4iq3E9iI3OeeMN0YoMLbGusuigw==}
     engines: {node: ^18.12.0 || ^20.9.0 || >= 18}
     peerDependencies:
-      postcss: ^8.4.31
+      postcss: ^8.5.13
 
-  postcss-unique-selectors@7.0.3:
-    resolution: {integrity: sha512-J+58u5Ic5T1QjP/LDV9g3Cx4CNOgB5vz+kM6+OxHHhFACdcDeKhBXjQmB7fnIZM12YSTvsL0Opwco83DmacW2g==}
+  postcss-unique-selectors@7.0.7:
+    resolution: {integrity: sha512-d+sCkaRnSefghOUdH8CMJZV9yUQhj2ojpe8Nw/lA+LV1UOfeleGkLTl6XdCFFSai9UJ+DJPb69FFuqthXYsY8w==}
     engines: {node: ^18.12.0 || ^20.9.0 || >=22.0}
     peerDependencies:
-      postcss: ^8.4.31
+      postcss: ^8.5.13
 
   postcss-value-parser@4.2.0:
     resolution: {integrity: sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==}
 
-  postcss@8.4.49:
-    resolution: {integrity: sha512-OCVPnIObs4N29kxTjzLfUryOkvZEq+pf8jTF0lg8E7uETuWHA+v7j3c/xJmiqpX450191LlmZfUKkXxkTry7nA==}
+  postcss@8.5.26:
+    resolution: {integrity: sha512-u82N74LFzG8ca+dD8puPnplTXoGH4fTPpVGuIbt36G3qvNlkvfD0lEAZSxaly3KX8TS/L1A1gsCEmvKmBcVbkQ==}
     engines: {node: ^10 || ^12 || >=14}
 
+  postject@1.0.0-alpha.6:
+    resolution: {integrity: sha512-b9Eb8h2eVqNE8edvKdwqkrY6O7kAwmI8kcnBv1NScolYJbo59XUF0noFq+lxbC1yN20bmC0WBEbDC5H/7ASb0A==}
+    engines: {node: '>=14.0.0'}
+    hasBin: true
+
+  powershell-utils@0.1.0:
+    resolution: {integrity: sha512-dM0jVuXJPsDN6DvRpea484tCUaMiXWjuCn++HGTqUWzGDjv5tZkEZldAJ/UMlqRYGFrD/etByo4/xOuC/snX2A==}
+    engines: {node: '>=20'}
+
   prelude-ls@1.2.1:
     resolution: {integrity: sha512-vkcDPrRZo1QZLbn5RLGPpg/WmIQ65qoWWhcGKf/b5eplkkarX0m9z8ppCat4mlOqUsWpyNuYgO3VRyrYHSzX5g==}
     engines: {node: '>= 0.8.0'}
 
-  prettier-linter-helpers@1.0.0:
-    resolution: {integrity: sha512-GbK2cP9nraSSUF9N2XwUwqfzlAFlMNYYl+ShE/V+H8a9uNl/oUqB1w2EL54Jh0OlyRSd8RfWYJ3coVS4TROP2w==}
-    engines: {node: '>=6.0.0'}
-
-  prettier-plugin-tailwindcss@0.6.9:
-    resolution: {integrity: sha512-r0i3uhaZAXYP0At5xGfJH876W3HHGHDp+LCRUJrs57PBeQ6mYHMwr25KH8NPX44F2yGTvdnH7OqCshlQx183Eg==}
-    engines: {node: '>=14.21.3'}
-    peerDependencies:
-      '@ianvs/prettier-plugin-sort-imports': '*'
-      '@prettier/plugin-pug': '*'
-      '@shopify/prettier-plugin-liquid': '*'
-      '@trivago/prettier-plugin-sort-imports': '*'
-      '@zackad/prettier-plugin-twig-melody': '*'
-      prettier: ^3.0
-      prettier-plugin-astro: '*'
-      prettier-plugin-css-order: '*'
-      prettier-plugin-import-sort: '*'
-      prettier-plugin-jsdoc: '*'
-      prettier-plugin-marko: '*'
-      prettier-plugin-multiline-arrays: '*'
-      prettier-plugin-organize-attributes: '*'
-      prettier-plugin-organize-imports: '*'
-      prettier-plugin-sort-imports: '*'
-      prettier-plugin-style-order: '*'
-      prettier-plugin-svelte: '*'
-    peerDependenciesMeta:
-      '@ianvs/prettier-plugin-sort-imports':
-        optional: true
-      '@prettier/plugin-pug':
-        optional: true
-      '@shopify/prettier-plugin-liquid':
-        optional: true
-      '@trivago/prettier-plugin-sort-imports':
-        optional: true
-      '@zackad/prettier-plugin-twig-melody':
-        optional: true
-      prettier-plugin-astro:
-        optional: true
-      prettier-plugin-css-order:
-        optional: true
-      prettier-plugin-import-sort:
-        optional: true
-      prettier-plugin-jsdoc:
-        optional: true
-      prettier-plugin-marko:
-        optional: true
-      prettier-plugin-multiline-arrays:
-        optional: true
-      prettier-plugin-organize-attributes:
-        optional: true
-      prettier-plugin-organize-imports:
-        optional: true
-      prettier-plugin-sort-imports:
-        optional: true
-      prettier-plugin-style-order:
-        optional: true
-      prettier-plugin-svelte:
-        optional: true
-
   prettier@2.8.8:
     resolution: {integrity: sha512-tdN8qQGvNjw4CHbY+XXk0JgCXn9QiF21a55rBe5LJAU+kDyC4WQn4+awm2Xfk2lQMk5fKup9XgzTZtGkjBdP9Q==}
     engines: {node: '>=10.13.0'}
     hasBin: true
 
-  prettier@3.4.2:
-    resolution: {integrity: sha512-e9MewbtFo+Fevyuxn/4rrcDAaq0IYxPGLvObpQjiZBMAzB9IGmzlnG9RZy3FFas+eBMu2vA0CszMeduow5dIuQ==}
-    engines: {node: '>=14'}
-    hasBin: true
-
   pretty-bytes@5.6.0:
     resolution: {integrity: sha512-FFw039TmrBqFK8ma/7OL3sDz/VytdtJr044/QUJtH0wK9lb9jLq9tJyIxUwtQJHwar2BqtiA4iCWSwo9JLkzFg==}
     engines: {node: '>=6'}
@@ -8306,10 +9981,21 @@ packages:
     resolution: {integrity: sha512-mQUvGU6aUFQ+rNvTIAcZuWGRT9a6f6Yrg9bHs4ImKF+HZCEK+plBvnAZYSIQztknZF2qnzNtr6F8s0+IuptdlQ==}
     engines: {node: ^14.13.1 || >=16.0.0}
 
-  pretty-ms@9.2.0:
-    resolution: {integrity: sha512-4yf0QO/sllf/1zbZWYnvWw3NxCQwLXKzIj0G849LSufP15BXKM0rbD2Z3wVnkMfjdn/CB0Dpp444gYAACdsplg==}
+  pretty-bytes@7.1.1:
+    resolution: {integrity: sha512-X+vn9z8nOFZQlxOLmfJ0iKDdMD7jYTsTW12OAlCpdoE3Igik6L37pugIZi+N3usuyp5McfgKPWi12q3zvHLeGQ==}
+    engines: {node: '>=20'}
+
+  pretty-ms@9.3.0:
+    resolution: {integrity: sha512-gjVS5hOP+M3wMm5nmNOucbIrqudzs9v/57bWRHQWLYklXqoXKrVfYW2W9+glfGsqtPgpiz5WwyEEB+ksXIx3gQ==}
     engines: {node: '>=18'}
 
+  probe-image-size@7.3.0:
+    resolution: {integrity: sha512-7CaDeBwiAbh6ohXsvLbAZhO7wzsZAmaevfxe39qvCwRh8LyaZfDlBGGLU1CCTgrTLtCOdwBBhjOrIHaIIimHfQ==}
+
+  proc-log@6.1.0:
+    resolution: {integrity: sha512-iG+GYldRf2BQ0UDUAd6JQ/RwzaQy6mXmsk/IzlYyal4A4SNFw54MeH4/tLkF4I5WoWG9SQwuqWzS99jaFQHBuQ==}
+    engines: {node: ^20.17.0 || >=22.9.0}
+
   process-nextick-args@2.0.1:
     resolution: {integrity: sha512-3ouUOpQhtgrbOa17J7+uxOTpITYWaGP7/AhoR3+A+/1e9skrzelGi/dXzEYyvbxubEF6Wn2ypscTKiKJFFn1ag==}
 
@@ -8317,32 +10003,74 @@ packages:
     resolution: {integrity: sha512-cdGef/drWFoydD1JsMzuFf8100nZl+GT+yacc2bEced5f9Rjk4z+WtFUTBu9PhOi9j/jfmBPu0mMEY4wIdAF8A==}
     engines: {node: '>= 0.6.0'}
 
-  promise-inflight@1.0.1:
-    resolution: {integrity: sha512-6zWPyEOFaQBJYcGMHBKTKJ3u6TBsnMFOIZSa6ce1e/ZrrsOlnHRHbabMjLiBYKp+n44X9eUI6VUPaukCXHuG4g==}
-    peerDependencies:
-      bluebird: '*'
-    peerDependenciesMeta:
-      bluebird:
-        optional: true
+  progress@2.0.3:
+    resolution: {integrity: sha512-7PiHtLll5LdnKIMw100I+8xJXR5gW2QwWYkT6iJva0bXitZKa/XMrSbdmg3r2Xnaidz9Qumd0VPaMrZlF9V9sA==}
+    engines: {node: '>=0.4.0'}
 
   promise-retry@2.0.1:
     resolution: {integrity: sha512-y+WKFlBR8BGXnsNlIHFGPZmyDf3DFMoLhaflAnyZgV6rG6xu+JwesTo2Q9R6XwYmtmwAFCkAk3e35jEdoeh/3g==}
     engines: {node: '>=10'}
 
+  proper-lockfile@4.1.2:
+    resolution: {integrity: sha512-TjNPblN4BwAWMXU8s9AEz4JmQxnD1NNL7bNOY/AKUzyamc379FWASUhc/K1pL2noVb+XmZKLL68cjzLsiOAMaA==}
+
+  prosemirror-changeset@2.4.1:
+    resolution: {integrity: sha512-96WBLhOaYhJ+kPhLg3uW359Tz6I/MfcrQfL4EGv4SrcqKEMC1gmoGrXHecPE8eOwTVCJ4IwgfzM8fFad25wNfw==}
+
+  prosemirror-commands@1.7.2:
+    resolution: {integrity: sha512-q6Q6szxqdu9Xd6EcdKsqXghu5nQdZTpB4Q9yd04WRc7/jt763e/rT60Owh0L1GYY+T46o5rD+9lEN36dZS43tw==}
+
+  prosemirror-dropcursor@1.8.3:
+    resolution: {integrity: sha512-FoYbsJR8gK+DGlqhNoE29Loa38eIZPzQRIb1VMaDNBoo4OLP6vVof/jR8qFY/6XvUd6Dhug8MDCHl2a/h8RTfQ==}
+
+  prosemirror-gapcursor@1.4.1:
+    resolution: {integrity: sha512-pMdYaEnjNMSwl11yjEGtgTmLkR08m/Vl+Jj443167p9eB3HVQKhYCc4gmHVDsLPODfZfjr/MmirsdyZziXbQKw==}
+
+  prosemirror-history@1.5.0:
+    resolution: {integrity: sha512-zlzTiH01eKA55UAf1MEjtssJeHnGxO0j4K4Dpx+gnmX9n+SHNlDqI2oO1Kv1iPN5B1dm5fsljCfqKF9nFL6HRg==}
+
+  prosemirror-inputrules@1.5.1:
+    resolution: {integrity: sha512-7wj4uMjKaXWAQ1CDgxNzNtR9AlsuwzHfdFH1ygEHA2KHF2DOEaXl1CJfNPAKCg9qNEh4rum975QLaCiQPyY6Fw==}
+
+  prosemirror-keymap@1.2.3:
+    resolution: {integrity: sha512-4HucRlpiLd1IPQQXNqeo81BGtkY8Ai5smHhKW9jjPKRc2wQIxksg7Hl1tTI2IfT2B/LgX6bfYvXxEpJl7aKYKw==}
+
+  prosemirror-model@1.25.11:
+    resolution: {integrity: sha512-QWg9RhnpLlogAmp3p96uEFrE5txQpFynd4vhBAELkwgOCWQs/X0yCzB3/hrHqiPwf91RG5KyWq6553zs9JqIOQ==}
+
+  prosemirror-schema-list@1.5.1:
+    resolution: {integrity: sha512-927lFx/uwyQaGwJxLWCZRkjXG0p48KpMj6ueoYiu4JX05GGuGcgzAy62dfiV8eFZftgyBUvLx76RsMe20fJl+Q==}
+
+  prosemirror-state@1.4.4:
+    resolution: {integrity: sha512-6jiYHH2CIGbCfnxdHbXZ12gySFY/fz/ulZE333G6bPqIZ4F+TXo9ifiR86nAHpWnfoNjOb3o5ESi7J8Uz1jXHw==}
+
+  prosemirror-tables@1.8.5:
+    resolution: {integrity: sha512-V/0cDCsHKHe/tfWkeCmthNUcEp1IVO3p6vwN8XtwE9PZQLAZJigbw3QoraAdfJPir4NKJtNvOB8oYGKRl+t0Dw==}
+
+  prosemirror-transform@1.12.0:
+    resolution: {integrity: sha512-GxboyN4AMIsoHNtz5uf2r2Ru551i5hWeCMD6E2Ib4Eogqoub0NflniaBPVQ4MrGE5yZ8JV9tUHg9qcZTTrcN4w==}
+
+  prosemirror-view@1.42.2:
+    resolution: {integrity: sha512-Pdg0l5kXm8aLDquFAnQFTCITg0q44sLqBlHlpsVLD9segdOao8TOfQdAhCrCXyVgPSRr6UDDROOIWA3bIrN9YQ==}
+
   proto-list@1.2.4:
     resolution: {integrity: sha512-vtK/94akxsTMhe0/cbfpR+syPuszcuwhqVjJq26CuNDgFGj682oRBXOP5MJpv2r7JtE8MsiepGIqvvOTBwn2vA==}
 
-  proxy-from-env@1.1.0:
-    resolution: {integrity: sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg==}
+  proxy-from-env@2.1.0:
+    resolution: {integrity: sha512-cJ+oHTW1VAEa8cJslgmUZrc+sjRKgAKl3Zyse6+PV38hZe/V6Z14TbCuXcan9F9ghlz4QrFr2c92TNF82UkYHA==}
+    engines: {node: '>=10'}
 
   prr@1.0.1:
     resolution: {integrity: sha512-yPw4Sng1gWghHQWj0B3ZggWUm4qVbPwPFcRG8KyxiU7J2OHFSoEHKS+EZ3fv5l1t9CyCiop6l/ZYeWbrgoQejw==}
 
-  publint@0.2.12:
-    resolution: {integrity: sha512-YNeUtCVeM4j9nDiTT2OPczmlyzOkIXNtdDZnSuajAxS/nZ6j3t7Vs9SUB4euQNddiltIwu7Tdd3s+hr08fAsMw==}
-    engines: {node: '>=16'}
+  publint@0.3.23:
+    resolution: {integrity: sha512-5MQipUPcB7MWw84zLUkHrg/H/UBtk3LL+A0GngTTBSsiNJLQurMUaSIRG3edlOrRz4UFe0AOKK9TZdIWviV+jQ==}
+    engines: {node: '>=18'}
     hasBin: true
 
+  pump@3.0.4:
+    resolution: {integrity: sha512-VS7sjc6KR7e1ukRFhQSY5LM2uBWAUPiOPa/A3mkKmiMwSmRFUITt0xuj+/lesgnCv+dPIEYlkzrcyXgquIHMcA==}
+
   punycode.js@2.3.1:
     resolution: {integrity: sha512-uxFIHU0YlHYhDQtV4R9J6a52SLx28BCjT+4ieh7IGbgwVJWO+km431c4yRlREUAsAmt/uMjQUyQHNEPf0M39CA==}
     engines: {node: '>=6'}
@@ -8351,63 +10079,68 @@ packages:
     resolution: {integrity: sha512-vYt7UD1U9Wg6138shLtLOvdAu+8DsC/ilFtEVHcH+wydcSpNE20AfSOduf6MkRFahL5FY7X1oU7nKVZFtfq8Fg==}
     engines: {node: '>=6'}
 
-  pupa@3.1.0:
-    resolution: {integrity: sha512-FLpr4flz5xZTSJxSeaheeMKN/EDzMdK7b8PTOC6a5PYFKTucWbdqjgqaEyH0shFiSJrVB1+Qqi4Tk19ccU6Aug==}
+  pupa@3.3.0:
+    resolution: {integrity: sha512-LjgDO2zPtoXP2wJpDjZrGdojii1uqO0cnwKoIoUzkfS98HDmbeiGmYiXo3lXeFlq2xvne1QFQhwYXSUCLKtEuA==}
     engines: {node: '>=12.20'}
 
+  pvtsutils@1.3.6:
+    resolution: {integrity: sha512-PLgQXQ6H2FWCaeRak8vvk1GW462lMxB5s3Jm673N82zI4vqtVUPuZdffdZbPDFRoU8kAhItWFtPCWiPpp4/EDg==}
+
+  pvutils@1.2.0:
+    resolution: {integrity: sha512-BbubeCEyTuQjVMakvJQ/Sxbc93F2pwmbsxONT/ZRrwU7Ua38d8unYTwXpTVLAKJ4BDuH9IGztCjQcd/N/39Dvg==}
+    engines: {node: '>=16.0.0'}
+
+  qified@0.10.1:
+    resolution: {integrity: sha512-+Owyggi9IxT1ePKGafcI87ubSmxol6smwJ+RAHDQlx9+9cPwFWDiKFFCPuWhr9ignlGpZ9vDQLw67N4dcTVFEA==}
+    engines: {node: '>=20'}
+
   qrcode@1.5.4:
     resolution: {integrity: sha512-1ca71Zgiu6ORjHqFBDpnSMTR2ReToX4l1Au1VFLyVeBTFavzQnv5JxMFr3ukHVKpSrSA2MCk0lNJSykjUfz7Zg==}
     engines: {node: '>=10.13.0'}
     hasBin: true
 
+  qs@6.15.3:
+    resolution: {integrity: sha512-O9gl3zCl5h5blw1KGUzQKhA5oUXSl8rwUIM5o0S3nCXMliSvy5Dzx7/DJcI+SwgICv+IneSZwhBh1oSyEHA71A==}
+    engines: {node: '>=0.6'}
+
+  quansync@0.2.11:
+    resolution: {integrity: sha512-AifT7QEbW9Nri4tAwR5M/uzpBuqfZf+zwaEM/QkzEjj7NBuFD2rBuy0K3dE+8wltbezDV7JMA0WfnCPYRSYbXA==}
+
+  quansync@1.0.0:
+    resolution: {integrity: sha512-5xZacEEufv3HSTPQuchrvV6soaiACMFnq1H8wkVioctoH3TRha9Sz66lOxRwPK/qZj7HPiSveih9yAyh98gvqA==}
+
   queue-microtask@1.2.3:
     resolution: {integrity: sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A==}
 
-  queue-tick@1.0.1:
-    resolution: {integrity: sha512-kJt5qhMxoszgU/62PLP1CJytzd2NKetjSRnyuj31fDd3Rlcz3fzlFdFLD1SItunPwyqEOkca6GbV612BWfaBag==}
+  quick-lru@5.1.1:
+    resolution: {integrity: sha512-WuyALRjWPDGtt/wzJiadO5AXY+8hZ80hVpe6MyivgraREW751X3SbhRvG3eLKOYN+8VEvqLcf3wdnt44Z4S4SA==}
+    engines: {node: '>=10'}
 
-  quill-delta@3.6.3:
-    resolution: {integrity: sha512-wdIGBlcX13tCHOXGMVnnTVFtGRLoP0imqxM696fIPwIf5ODIYUHIvHbZcyvGlZFiFhK5XzDC2lpjbxRhnM05Tg==}
-    engines: {node: '>=0.10'}
+  quill-delta@5.1.0:
+    resolution: {integrity: sha512-X74oCeRI4/p0ucjb5Ma8adTXd9Scumz367kkMK5V/IatcX6A0vlgLgKbzXWy5nZmCGeNJm2oQX0d2Eqj+ZIlCA==}
+    engines: {node: '>= 12.0.0'}
 
-  quill-delta@4.2.2:
-    resolution: {integrity: sha512-qjbn82b/yJzOjstBgkhtBjN2TNK+ZHP/BgUQO+j6bRhWQQdmj2lH6hXG7+nwwLF41Xgn//7/83lxs9n2BkTtTg==}
-
-  quill@1.3.7:
-    resolution: {integrity: sha512-hG/DVzh/TiknWtE6QmWAF/pxoZKYxfe3J/d/+ShUWkDvvkZQVTPeVmUJVu1uE6DDooC4fWTiCLh84ul89oNz5g==}
-
-  radix-vue@1.9.11:
-    resolution: {integrity: sha512-C+MtJ66jf8J28DO5bKgNwhGCi6WQYuEosD/tY/Orry9BTDcuF/Mps4HlFd2Tq4YlXF44BEPLQ2Paz89Mz70ZgA==}
-    peerDependencies:
-      vue: ^3.5.13
+  quill@2.0.2:
+    resolution: {integrity: sha512-QfazNrhMakEdRG57IoYFwffUIr04LWJxbS/ZkidRFXYCQt63c1gK6Z7IHUXMx/Vh25WgPBU42oBaNzQ0K1R/xw==}
+    engines: {npm: '>=8.2.3'}
 
   radix3@1.1.2:
     resolution: {integrity: sha512-b484I/7b8rDEdSDKckSSBA8knMpcdsXudlE/LNL639wFoHKwLbEkQFZHWEYwDC0wa0FKUcCY+GAF73Z7wxNVFA==}
 
-  randombytes@2.1.0:
-    resolution: {integrity: sha512-vYl3iOX+4CKUWuxGi9Ukhie6fsqXqS9FE2Zaic4tNFD2N2QQaXOMFbuKK4QmDHC0JO6B1Zp41J0LpT0oR68amQ==}
-
-  range-parser@1.2.1:
-    resolution: {integrity: sha512-Hrgsx+orqoygnmhFbKaHE6c296J+HTAQXoxEF6gNupROmmGJRoyzfG3ccAveqCBrwr/2yxQ5BVd/GTl5agOwSg==}
+  range-parser@1.3.0:
+    resolution: {integrity: sha512-hek2mFQpPuI4E1BBKrSto+BU3e3x4xuarsbiwr3+lf7p44juvFMV0XFWQAP3xUyqXA4RrXLIoaSUGbSt056ZMw==}
     engines: {node: '>= 0.6'}
 
-  rc9@2.1.2:
-    resolution: {integrity: sha512-btXCnMmRIBINM2LDZoEmOogIZU7Qe7zn4BpomSKZ/ykbLObuBdvG+mFq11DL6fjH1DRwHhrlgtYWG96bJiC7Cg==}
+  rc9@3.0.1:
+    resolution: {integrity: sha512-gMDyleLWVE+i6Sgtc0QbbY6pEKqYs97NGi6isHQPqYlLemPoO8dxQ3uGi0f4NiP98c+jMW6cG1Kx9dDwfvqARQ==}
 
   rc@1.2.8:
     resolution: {integrity: sha512-y3bGgqKj3QBdxLbLkomlohkvsA8gdAiUQlSBJnBhfn+BPxg4bc62d8TcBW15wavDfgexCgccckhcZvywyQYPOw==}
     hasBin: true
 
-  read-cache@1.0.0:
-    resolution: {integrity: sha512-Owdv/Ft7IjOgm/i0xvNDZ1LrRANRfew4b2prF3OWMQLxLfu3bS8FVhCsrSCMK4lR56Y9ya+AThoTpDCTxCmpRA==}
-
-  read-pkg-up@7.0.1:
-    resolution: {integrity: sha512-zK0TB7Xd6JpCLmlLmufqykGE+/TlOePD6qKClNW7hHDKFh/J7/7gCWGR7joEQEW1bKq3a3yUZSObOoWLFQ4ohg==}
-    engines: {node: '>=8'}
-
-  read-pkg@5.2.0:
-    resolution: {integrity: sha512-Ug69mNOpfvKDAc2Q8DRpMjjzdtrnv9HcSMX+4VsZxD1aZ6ZzrIE7rlzXBtWTyhULSMKg076AW6WR5iZpD0JiOg==}
-    engines: {node: '>=8'}
+  read-binary-file-arch@1.0.6:
+    resolution: {integrity: sha512-BNg9EN3DD3GsDXX7Aa8O4p92sryjkmzYYgmgTAc6CA4uGLEDzFfxOxugu21akOxpcXHiEgsYkC6nPsQvLLLmEg==}
+    hasBin: true
 
   read-yaml-file@1.1.0:
     resolution: {integrity: sha512-VIMnQi/Z4HT2Fxuwg5KrY174U1VdUIASQVWXXyqtNRtxSr9IYkn1rsI6Tb6HsrHCmB7gVpNwX6JxPTHcH6IoTA==}
@@ -8424,20 +10157,20 @@ packages:
     resolution: {integrity: sha512-9u/sniCrY3D5WdsERHzHE4G2YCXqoG5FTHUiCC4SIbr6XcLZBY05ya9EKjYek9O5xOAwjGq+1JdGBAS7Q9ScoA==}
     engines: {node: '>= 6'}
 
-  readable-stream@4.6.0:
-    resolution: {integrity: sha512-cbAdYt0VcnpN2Bekq7PU+k363ZRsPwJoEEJOEtSJQlJXzwaxt3FIo/uL+KeDSGIjJqtkwyge4KQgD2S2kd+CQw==}
+  readable-stream@4.7.0:
+    resolution: {integrity: sha512-oIGGmcpTLwPga8Bn6/Z75SVaH1z5dUut2ibSyAMVhmUggWpmDn2dapB0n7f8nwaSiRtepAsfJyfXIO5DCVAODg==}
     engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
 
   readdir-glob@1.1.3:
     resolution: {integrity: sha512-v05I2k7xN8zXvPD9N+z/uhXPaj0sUFCe2rcWZIpBsqxfP7xXFQ0tipAd/wjj1YxWyWtUS5IDJpOG82JKt2EAVA==}
 
-  readdirp@3.6.0:
-    resolution: {integrity: sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==}
-    engines: {node: '>=8.10.0'}
+  readdir-glob@3.0.0:
+    resolution: {integrity: sha512-AhNB2KgKeVJr16nK9LLZbJNWnYoT23ZrumNKFDebHBdkC8KHSqWo871JAUhoWC/RtjEVdqNMFpM6qrwRbaUqpw==}
+    engines: {node: '>=18'}
 
-  readdirp@4.0.2:
-    resolution: {integrity: sha512-yDMz9g+VaZkqBYS/ozoBJwaBhTbZo3UNYQHNRw1D3UFQB8oHB4uS/tAODO+ZLjGWmUbKnIlOWO+aaIiAxrUWHA==}
-    engines: {node: '>= 14.16.0'}
+  readdirp@5.1.1:
+    resolution: {integrity: sha512-Kko+Y5XQ6fM+Ce3dq3m9YGxnacYZYl9cA1wZjaF3Vbry2L3i1qVg8+CAgNPsXRArPMUMCaOR7oa9Nqntc43JKA==}
+    engines: {node: '>= 20.19.0'}
 
   redis-errors@1.2.0:
     resolution: {integrity: sha512-1qny3OExCf0UvUV/5wpYKf2YwPcOqXzkwKKSmKHiE6ZMQs5heeE/c8eXK+PNllPvmjgAbfnsbpkGZWy8cBpn9w==}
@@ -8447,45 +10180,27 @@ packages:
     resolution: {integrity: sha512-DJnGAeenTdpMEH6uAJRK/uiyEIH9WVsUmoLwzudwGJUwZPp80PDBWPHXSAGNPwNvIXAbe7MSUB1zQFugFml66A==}
     engines: {node: '>=4'}
 
-  refa@0.12.1:
-    resolution: {integrity: sha512-J8rn6v4DBb2nnFqkqwy6/NnTYMcgLA+sLr0iIO41qpv0n+ngb7ksag2tMRl0inb1bbO/esUwzW1vbJi7K0sI0g==}
-    engines: {node: ^12.0.0 || ^14.0.0 || >=16.0.0}
-
-  reflect.getprototypeof@1.0.9:
-    resolution: {integrity: sha512-r0Ay04Snci87djAsI4U+WNRcSw5S4pOH7qFjd/veA5gC7TbqESR3tcj28ia95L/fYUDw11JKP7uqUKUAfVvV5Q==}
+  reflect.getprototypeof@1.0.10:
+    resolution: {integrity: sha512-00o4I+DVrefhv+nX0ulyi3biSHCPDe+yLv5o/p6d/UVlirijB8E16FtfwSAi4g3tcqrQ4lRAqQSoFEZJehYEcw==}
     engines: {node: '>= 0.4'}
 
-  regenerate-unicode-properties@10.2.0:
-    resolution: {integrity: sha512-DqHn3DwbmmPVzeKj9woBadqmXxLvQoQIwu7nopMc72ztvxVmVk2SBhSnx67zuye5TP+lJsb/TBQsjLKhnDf3MA==}
+  regenerate-unicode-properties@10.2.2:
+    resolution: {integrity: sha512-m03P+zhBeQd1RGnYxrGyDAPpWX/epKirLrp8e3qevZdVkKtnCrjjWczIbYc8+xd6vcTStVlqfycTx1KR4LOr0g==}
     engines: {node: '>=4'}
 
   regenerate@1.4.2:
     resolution: {integrity: sha512-zrceR/XhGYU/d/opr2EKO7aRHUeiBI8qjtfHqADTwZd6Szfy16la6kqD0MIUs5z5hx6AaKa+PixpPrR289+I0A==}
 
-  regenerator-runtime@0.14.1:
-    resolution: {integrity: sha512-dYnhHh0nJoMfnkZs6GmmhFknAGRrLznOu5nc9ML+EJxGvrx6H7teuevqVqCuPcPK//3eDrrjQhehXVx9cnkGdw==}
-
-  regenerator-transform@0.15.2:
-    resolution: {integrity: sha512-hfMp2BoF0qOk3uc5V20ALGDS2ddjQaLrdl7xrGXvAIow7qeWRM2VA2HuCHkUKk9slq3VwEwLNK3DFBqDfPGYtg==}
-
-  regexp-ast-analysis@0.7.1:
-    resolution: {integrity: sha512-sZuz1dYW/ZsfG17WSAG7eS85r5a0dDsvg+7BiiYR5o6lKCAtUrEwdmRmaGF6rwVj3LcmAeYkOWKEPlbPzN3Y3A==}
-    engines: {node: ^12.0.0 || ^14.0.0 || >=16.0.0}
-
-  regexp-tree@0.1.27:
-    resolution: {integrity: sha512-iETxpjK6YoRWJG5o6hXLwvjYAoW+FEZn9os0PD/b6AP6xQwsa/Y7lCVgIixBbUPMfhu+i2LtdeAqVTgGlQarfA==}
-    hasBin: true
-
-  regexp.prototype.flags@1.5.3:
-    resolution: {integrity: sha512-vqlC04+RQoFalODCbCumG2xIOvapzVMHwsyIGM/SIE8fRhFFsXeH8/QQ+s0T0kDAhKc4k30s73/0ydkHQz6HlQ==}
+  regexp.prototype.flags@1.5.4:
+    resolution: {integrity: sha512-dYqgNSZbDwkaJ2ceRd9ojCGjBq+mOm9LmtXnAnEGyHhN/5R7iDW2TRw3h+o/jCFxus3P2LfWIIiwowAjANm7IA==}
     engines: {node: '>= 0.4'}
 
-  regexpu-core@6.2.0:
-    resolution: {integrity: sha512-H66BPQMrv+V16t8xtmq+UC0CBpiTBA60V8ibS1QVReIp8T1z8hwFxqcGzm9K6lgsN7sB5edVH8a+ze6Fqm4weA==}
+  regexpu-core@6.4.0:
+    resolution: {integrity: sha512-0ghuzq67LI9bLXpOX/ISfve/Mq33a4aFRzoQYhnnok1JOFpmE/A2TBGkNVenOGEeSBCjIiWcc6MVOG5HEQv0sA==}
     engines: {node: '>=4'}
 
-  registry-auth-token@5.0.3:
-    resolution: {integrity: sha512-1bpc9IyC+e+CNFRaWyn77tk4xGG4PPUyfakSmA6F6cvUDjrm58dfyJ3II+9yb10EDkHoy1LaPSmHaWLOH3m6HA==}
+  registry-auth-token@5.1.1:
+    resolution: {integrity: sha512-P7B4+jq8DeD2nMsAcdfaqHbssgHtZ7Z5+++a5ask90fvmJ8p5je4mOa+wzu+DB4vQ5tdJV/xywY+UnVFeQLV5Q==}
     engines: {node: '>=14'}
 
   registry-url@6.0.1:
@@ -8495,13 +10210,14 @@ packages:
   regjsgen@0.8.0:
     resolution: {integrity: sha512-RvwtGe3d7LvWiDQXeQw8p5asZUmfU1G/l6WbUXeHta7Y2PEIvBTwH6E2EfmYUK8pxcxEdEmaomqyp0vZZ7C+3Q==}
 
-  regjsparser@0.10.0:
-    resolution: {integrity: sha512-qx+xQGZVsy55CH0a1hiVwHmqjLryfh7wQyF5HO07XJ9f7dQMY/gPQHhlyDkIzJKC+x2fUCpCcUODUUUFrm7SHA==}
+  regjsparser@0.13.2:
+    resolution: {integrity: sha512-NgRBy2Nx/bE+9F27nVHnqcN5HjyLmecqsqx2PJHu3/IEtADD4WuxuXIVExD5PoSDFVrl78dOonfcOe5O+5nbzQ==}
     hasBin: true
 
-  regjsparser@0.12.0:
-    resolution: {integrity: sha512-cnE+y8bz4NhMjISKbgeVJtqNbtf5QpjZP+Bslo+UqkIt9QPnX9q095eiRRASJG1/tz6dlNr6Z5NsBiWYokp6EQ==}
-    hasBin: true
+  reka-ui@2.10.3:
+    resolution: {integrity: sha512-nJGZbwcha8AcP2wbnjodfzsciTKBqp1mIzepC9Pi2xDI/YK3++ej3vpJOSPyxqrkq1Oorj4K+BdJkbVCV6x6ag==}
+    peerDependencies:
+      vue: ^3.5.40
 
   relateurl@0.2.7:
     resolution: {integrity: sha512-G08Dxvm4iDN3MLM0EsP62EDV9IuhXPR6blNz6Utcp7zyV3tr4HVNINt6MpaRWbxoOHT3Q7YN2P+jaHX8vUbgog==}
@@ -8510,10 +10226,6 @@ packages:
   remove-accents@0.5.0:
     resolution: {integrity: sha512-8g3/Otx1eJaVD12e31UbJj1YzdtVvzH85HV7t+9MJYk/u3XmkOUJ5Ys9wQrf9PCPK8+xn4ymzqYCiZl6QWKn+A==}
 
-  repeat-string@1.6.1:
-    resolution: {integrity: sha512-PV0dzCYDNfRi1jCDbJzpW7jNNDRuCOG/jI5ctQcGKt/clZD+YcPS3yIlWuTJMmESC8aevCFmWJy5wjAFgNqN6w==}
-    engines: {node: '>=0.10'}
-
   require-directory@2.1.1:
     resolution: {integrity: sha512-fGxEI7+wsG9xrvdjsrlmL22OMTTiHRwAMroiEeMgq8gzoLC/PQr7RsRDSTLUg/bZAZtF+TVIkHc6/4RIKrui+Q==}
     engines: {node: '>=0.10.0'}
@@ -8525,15 +10237,15 @@ packages:
   require-main-filename@2.0.0:
     resolution: {integrity: sha512-NKN5kMDylKuldxYLSUfrbo5Tuzh4hd+2E8NPPX02mZtn1VuREQToYe/ZdlJy+J3uCpfaiGF05e7B8W0iXbQHmg==}
 
-  require-package-name@2.0.1:
-    resolution: {integrity: sha512-uuoJ1hU/k6M0779t3VMVIYpb2VMJk05cehCaABFhXaibcbvfgR8wKiozLjVFSzJPmQMRqIcO0HMyTFqfV09V6Q==}
+  resedit@1.7.2:
+    resolution: {integrity: sha512-vHjcY2MlAITJhC0eRD/Vv8Vlgmu9Sd3LX9zZvtGzU5ZImdTN3+d6e/4mnTyV8vEbyf1sgNIrWxhWlrys52OkEA==}
+    engines: {node: '>=12', npm: '>=6'}
 
   resize-observer-polyfill@1.5.1:
     resolution: {integrity: sha512-LwZrotdHOo12nQuZlHEmtuXdqGoOD0OhaxopaNFxWzInpEgaLWoVuAMbTzixuosCx2nEG58ngzW3vxdWoxIgdg==}
 
-  resolve-dir@1.0.1:
-    resolution: {integrity: sha512-R7uiTjECzvOsWSfdM0QKFNBVFcK27aHOUwdvK53BcW8zqnGdYp0Fbj82cy54+2A4P2tFM22J5kRfe1R+lM/1yg==}
-    engines: {node: '>=0.10.0'}
+  resolve-alpn@1.2.1:
+    resolution: {integrity: sha512-0a1F4l73/ZFZOakJnQ3FvkJ2+gSTQWz/r2KE5OdDY0TxPm5h4GkqkWWfM47T7HsbnOtcJVEF4epCVy6u7Q3K+g==}
 
   resolve-from@4.0.0:
     resolution: {integrity: sha512-pb/MYmXstAkysRFx8piNI1tGFNQIFA3vkE3Gq4EuA1dF6gHp/+vgZqsCGJapvy8N3Q+4o7FwvquPJcnZ7RYy4g==}
@@ -8550,11 +10262,14 @@ packages:
     resolution: {integrity: sha512-OcXjMsGdhL4XnbShKpAcSqPMzQoYkYyhbEaeSko47MjRP9NfEQMhZkXL1DoFlt9LWQn4YttrdnV6X2OiyzBi+A==}
     engines: {node: '>=10'}
 
-  resolve@1.22.10:
-    resolution: {integrity: sha512-NPRy+/ncIMeDlTAsuqwKIiferiawhefFJtkNSW0qZJEqMEb+qBt/77B/jGeeek+F0uOeN05CDa6HXbbIgtVX4w==}
+  resolve@1.22.12:
+    resolution: {integrity: sha512-TyeJ1zif53BPfHootBGwPRYT1RUt6oGWsaQr8UyZW/eAm9bKoijtvruSDEmZHm92CwS9nj7/fWttqPCgzep8CA==}
     engines: {node: '>= 0.4'}
     hasBin: true
 
+  responselike@2.0.1:
+    resolution: {integrity: sha512-4gl03wn3hj1HP3yzgdI7d3lCkF95F21Pz4BPGvKHinyQzALR5CapwC8yIi0Rh58DEMQ/SguC03wFj2k0M/mHhw==}
+
   restore-cursor@5.1.0:
     resolution: {integrity: sha512-oMA2dcrw6u0YfxJQXm342bFKX/E4sG9rbTzO9ptUcR/e8A33cHuvStiYOwH7fszkZlZ1z/ta9AAoPk2F4qIOHA==}
     engines: {node: '>=18'}
@@ -8563,76 +10278,101 @@ packages:
     resolution: {integrity: sha512-9LkiTwjUh6rT555DtE9rTX+BKByPfrMzEAtnlEtdEwr3Nkffwiihqe2bWADg+OQRjt9gl6ICdmB/ZFDCGAtSow==}
     engines: {node: '>= 4'}
 
-  reusify@1.0.4:
-    resolution: {integrity: sha512-U9nH88a3fc/ekCF1l0/UP1IosiuIjyTh7hBvXVMHYgVcfGvt897Xguj2UOLDeI5BG2m7/uwyaLVT6fbtCwTyzw==}
+  reusify@1.1.0:
+    resolution: {integrity: sha512-g6QUff04oZpHs0eG5p83rFLhHeV00ug/Yf9nZM6fLeUrPguBTkTQOdpAWWspMh55TZfVQDPaN3NQJfbVRAxdIw==}
     engines: {iojs: '>=1.0.0', node: '>=0.10.0'}
 
-  rfdc@1.4.1:
-    resolution: {integrity: sha512-q1b3N5QkRUWUl7iyylaaj3kOpIT0N2i9MqIEQXP73GVsN9cw3fdx8X63cEmWhJGi2PPCF23Ijp7ktmd39rawIA==}
+  rimraf@2.6.3:
+    resolution: {integrity: sha512-mwqeW5XsA2qAejG46gYdENaxXjx9onRNCfn7L0duuP4hCuTIi/QO7PDK07KJfp1d+izWPrzEJDcSqBa0OZQriA==}
+    deprecated: Rimraf versions prior to v4 are no longer supported
+    hasBin: true
 
   rimraf@2.7.1:
     resolution: {integrity: sha512-uWjbaKIK3T1OSVptzX7Nl6PvQ3qAGtKEtVRjRuazjfL3Bx5eI409VZSqgND+4UNnmzLVdPj9FqFJNPqBZFve4w==}
     deprecated: Rimraf versions prior to v4 are no longer supported
     hasBin: true
 
-  rimraf@3.0.2:
-    resolution: {integrity: sha512-JZkJMZkAGFFPP2YqXZXPbMlMBgsxzE8ILs4lMIX/2o0L9UBw9O/Y3o6wFw/i9YLapcUJWwqbi3kdxIPdC62TIA==}
-    deprecated: Rimraf versions prior to v4 are no longer supported
-    hasBin: true
-
-  rimraf@5.0.10:
-    resolution: {integrity: sha512-l0OE8wL34P4nJH/H2ffoaniAokM2qSmrtXHmlpvYr5AVVX8msAyW0l8NVJFDxlSK4u3Uh/f41cQheDVdnYijwQ==}
-    hasBin: true
-
-  rimraf@6.0.1:
-    resolution: {integrity: sha512-9dkvaxAsk/xNXSJzMgFqqMCuFgt2+KsOFek3TMLfo8NCPfWpBmqwyNn5Y+NX56QUYfCtsyhF3ayiboEoUmJk/A==}
+  rimraf@6.1.3:
+    resolution: {integrity: sha512-LKg+Cr2ZF61fkcaK1UdkH2yEBBKnYjTyWzTJT6KNPcSPaiT7HSdhtMXQuN5wkTX0Xu72KQ1l8S42rlmexS2hSA==}
     engines: {node: 20 || >=22}
     hasBin: true
 
-  rollup-plugin-dts@6.1.1:
-    resolution: {integrity: sha512-aSHRcJ6KG2IHIioYlvAOcEq6U99sVtqDDKVhnwt70rW6tsz3tv5OSjEiWcgzfsHdLyGXZ/3b/7b/+Za3Y6r1XA==}
-    engines: {node: '>=16'}
-    peerDependencies:
-      rollup: ^3.29.4 || ^4
-      typescript: ^4.5 || ^5.0
+  roarr@2.15.4:
+    resolution: {integrity: sha512-CHhPh+UNHD2GTXNYhPWLnU8ONHdI+5DI+4EYIAOaiD63rHeYlZvyh8P+in5999TTSFgUYuKUAjzRI4mdh/p+2A==}
+    engines: {node: '>=8.0'}
 
-  rollup-plugin-visualizer@5.12.0:
-    resolution: {integrity: sha512-8/NU9jXcHRs7Nnj07PF2o4gjxmm9lXIrZ8r175bT9dK8qoLlvKTwRMArRCMgpMGlq8CTLugRvEmyMeMXIU2pNQ==}
-    engines: {node: '>=14'}
+  rolldown-plugin-dts@0.27.14:
+    resolution: {integrity: sha512-ZvuDDwoIpRK9RPxDXratCpklFO9QZZWndf/sd0VBFb4LEj0jj07UcHK9OCh7V4XiFz2Z89ziyBC2K6tJiDjrbw==}
+    engines: {node: ^22.18.0 || >=24.11.0}
+    peerDependencies:
+      '@typescript/native-preview': '*'
+      '@volar/typescript': ~2.4.0
+      rolldown: ^1.0.0
+      typescript: ^5.0.0 || ^6.0.0 || ~7.0.0
+      vue-tsc: ~3.2.0 || ~3.3.0
+    peerDependenciesMeta:
+      '@typescript/native-preview':
+        optional: true
+      '@volar/typescript':
+        optional: true
+      typescript:
+        optional: true
+      vue-tsc:
+        optional: true
+
+  rolldown@1.2.3:
+    resolution: {integrity: sha512-rn9wpmxplLf7NLNyCk9FyWh3FM43DbY8jOzCdEPzH7uflhTftRbCEpqi6Ly2osgoU8OwObtmavMbWLaWy4LX7A==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    hasBin: true
+
+  rollup-plugin-dts@6.5.1:
+    resolution: {integrity: sha512-jODTXp3H7MK/Ur/ErtsrQ0G1GvaCmc3du+y5pNrdBMf6d7HlL2Nd/N6TkEr+f75CkUj01zEoEd7y2elH0eHi1Q==}
+    engines: {node: '>=20'}
+    peerDependencies:
+      '@typescript/typescript6': ^6
+      rollup: ^3 || ^4
+      typescript: ^4.5 || ^5 || ^6 || ^7
+    peerDependenciesMeta:
+      '@typescript/typescript6':
+        optional: true
+
+  rollup-plugin-visualizer@7.0.1:
+    resolution: {integrity: sha512-UJUT4+1Ho4OcWmPYU3sYXgUqI8B8Ayfe06MX7y0qCJ1K8aGoKtR/NDd/2nZqM7ADkrzny+I99Ul7GgyoiVNAgg==}
+    engines: {node: '>=22'}
     hasBin: true
     peerDependencies:
+      rolldown: 1.x || ^1.0.0-beta || ^1.0.0-rc
       rollup: 2.x || 3.x || 4.x
     peerDependenciesMeta:
+      rolldown:
+        optional: true
       rollup:
         optional: true
 
-  rollup@2.79.2:
-    resolution: {integrity: sha512-fS6iqSPZDs3dr/y7Od6y5nha8dW1YnbgtsyotCVvoFGKbERG++CVRFv1meyGDE1SNItQA8BrnCw7ScdAhRJ3XQ==}
-    engines: {node: '>=10.0.0'}
-    hasBin: true
-
-  rollup@4.28.1:
-    resolution: {integrity: sha512-61fXYl/qNVinKmGSTHAZ6Yy8I3YIJC/r2m9feHo6SwVAVcLT5MPwOUFe7EuURA/4m0NR8lXG4BBXuo/IZEsjMg==}
+  rollup@4.62.4:
+    resolution: {integrity: sha512-RXOqwaPsBGjMNMa4sQjDjHieHEZDFoj/Rdr46l2MU5DfEs16wHJPC2RPTPHWhNl+M3aI472LLqFkFKut4SblOg==}
     engines: {node: '>=18.0.0', npm: '>=8.0.0'}
     hasBin: true
 
-  rotated-array-set@3.0.0:
-    resolution: {integrity: sha512-G7689wvCM0szMFXUAhi3GfNGcSPlndg077cdRWoq7UegOAwfU2MJ0jD7s7jB+2ppKA75Kr/O0HwAP9+rRdBctg==}
-    engines: {node: ^14.13.1 || >=16.0.0}
+  rope-sequence@1.3.4:
+    resolution: {integrity: sha512-UT5EDe2cu2E/6O4igUr5PSFs23nvvukicWHx6GnOPlHAiiYbzNuCRQCuiUdHJQcqKalLKlrYJnjY0ySGsXNQXQ==}
 
-  run-applescript@7.0.0:
-    resolution: {integrity: sha512-9by4Ij99JUr/MCFBUkDKLWK3G9HVXmabKz9U5MlIAIuvuzkiOicRYs8XJLxX+xahD+mLiiCYDqF9dKAgtzKP1A==}
+  run-applescript@7.1.0:
+    resolution: {integrity: sha512-DPe5pVFaAsinSaV6QjQ6gdiedWDcRCbUuiQfQa2wmWV7+xC9bGulGI8+TdRmoFkAPaBXk8CrAbnlY2ISniJ47Q==}
     engines: {node: '>=18'}
 
   run-parallel@1.2.0:
     resolution: {integrity: sha512-5l4VyZR86LZ/lDxZTR6jqL8AFE2S0IFLMP26AbjsLVADxHdhB/c0GUsH+y39UfCi3dzz8OlQuPmnaJOMoDHQBA==}
 
+  rxjs@7.8.2:
+    resolution: {integrity: sha512-dhKf903U/PQZY6boNNtAGdWbG85WAbjT/1xYoZIC7FAY0yWapOBQVsVrDl58W86//e1VpMNBtRV4MaXfdMySFA==}
+
   sade@1.8.1:
     resolution: {integrity: sha512-xal3CZX1Xlo/k4ApwCFrHVACi9fBqJ7V+mwhBsuf/1IOKbBy098Fex+Wa/5QMubw09pSZ/u8EY8PWgevJsXp1A==}
     engines: {node: '>=6'}
 
-  safe-array-concat@1.1.3:
-    resolution: {integrity: sha512-AURm5f0jYEOydBj7VQlVvDrjeFgthDdEF5H1dP+6mNpoXOMo1quQqJ4wvJDyRZ9+pO3kGWoOdmV08cSv2aJV6Q==}
+  safe-array-concat@1.1.4:
+    resolution: {integrity: sha512-wtZlHyOje6OZTGqAoaDKxFkgRtkF9CnHAVnCHKfuj200wAgL+bSJhdsCD2l0Qx/2ekEXjPWcyKkfGb5CPboslg==}
     engines: {node: '>=0.4'}
 
   safe-buffer@5.1.2:
@@ -8641,6 +10381,10 @@ packages:
   safe-buffer@5.2.1:
     resolution: {integrity: sha512-rp3So07KcdmmKbGvgaNxQSJr7bGVSVk5S9Eq1F+ppbRo70+YeaDxkw5Dd8NPN+GD6bjnYm2VuPuCXmpuYvmCXQ==}
 
+  safe-push-apply@1.0.0:
+    resolution: {integrity: sha512-iKE9w/Z7xCzUMIZqdBsp6pEQvwuEebH4vdpjcDWnyzaI6yl6O9FHvVpmGelvEHNsoY6wGblkxR6Zty/h00WiSA==}
+    engines: {node: '>= 0.4'}
+
   safe-regex-test@1.1.0:
     resolution: {integrity: sha512-x/+Cz4YrimQxQccJf5mKEbIa1NzeCRNI5Ecl/ekmlYaampdNLPalVyIcCZNNH3MvmqBugV5TMYZXv0ljslUlaw==}
     engines: {node: '>= 0.4'}
@@ -8648,13 +10392,139 @@ packages:
   safer-buffer@2.1.2:
     resolution: {integrity: sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==}
 
-  sass@1.80.6:
-    resolution: {integrity: sha512-ccZgdHNiBF1NHBsWvacvT5rju3y1d/Eu+8Ex6c21nHp2lZGLBEtuwc415QfiI1PJa1TpCo3iXwwSRjRpn2Ckjg==}
+  sanitize-filename@1.6.4:
+    resolution: {integrity: sha512-9ZyI08PsvdQl2r/bBIGubpVdR3RR9sY6RDiWFPreA21C/EFlQhmgo20UZlNjZMMZNubusLhAQozkA0Od5J21Eg==}
+
+  sass-embedded-all-unknown@1.100.0:
+    resolution: {integrity: sha512-auFtXY/kwYILmSVjtBDwyj0axcLbYYiffOKWoaXHnI5bsYwiRbBh3EneR1rpbX2ZIZCrwX93i5pxKLTZF/662Q==}
+    cpu: ['!arm', '!arm64', '!riscv64', '!x64']
+
+  sass-embedded-android-arm64@1.100.0:
+    resolution: {integrity: sha512-W+Ru9JwTnfU0UX3jSZcbqFdtKFMcYdfFwytc57h2DgnqCOIiAqI2E06mABZBZC+r3LwXCBuS5GbXAGeVgvVDkA==}
     engines: {node: '>=14.0.0'}
+    cpu: [arm64]
+    os: [android]
+
+  sass-embedded-android-arm@1.100.0:
+    resolution: {integrity: sha512-70f3HgX2pFNmzpGQ86n5e6QfWn2fP4QUQGfFQK0P1XH73ZLIzLo2YqygrGKGKeeqtc5eU2Wl1/xQzhzuKnO4kw==}
+    engines: {node: '>=14.0.0'}
+    cpu: [arm]
+    os: [android]
+
+  sass-embedded-android-riscv64@1.100.0:
+    resolution: {integrity: sha512-icU3o0V/uCSytSpf+tX5Lf51BvyQEbLzDUJfUi9etSauYBGHpPKkdtdZH0si4v98phq11Kl8rSV1SggksxF1Hg==}
+    engines: {node: '>=14.0.0'}
+    cpu: [riscv64]
+    os: [android]
+
+  sass-embedded-android-x64@1.100.0:
+    resolution: {integrity: sha512-mevF9VQk6gEYByy8+jusaHGmd7Usb2ytX/DsEOd0JtOGCtcf1kh575xJ6OUBDIcJ15uLnbau/0iy1eP6WVBvWA==}
+    engines: {node: '>=14.0.0'}
+    cpu: [x64]
+    os: [android]
+
+  sass-embedded-darwin-arm64@1.100.0:
+    resolution: {integrity: sha512-1PVlYi61POo93IT/FfrG1mc1tAHxeSTyUALF2aOFmXGWjVXr3bQzEQiBGCOvQbj/ix+5hNyXFXcEMEyKvtUJJA==}
+    engines: {node: '>=14.0.0'}
+    cpu: [arm64]
+    os: [darwin]
+
+  sass-embedded-darwin-x64@1.100.0:
+    resolution: {integrity: sha512-x97o3JnGyImZNCIVs9wQHJUE5QCvmVIKaH1cwrz/5dK7OT1FpeNiW+u9TUomP9hG6Ekjd8EL8NBHpxTfIhdjmg==}
+    engines: {node: '>=14.0.0'}
+    cpu: [x64]
+    os: [darwin]
+
+  sass-embedded-linux-arm64@1.100.0:
+    resolution: {integrity: sha512-Dwjmj8Z6VRy7rAi53JAdEwIyUjpfl7PhpSc2/LpQPQx+aO5Dp7Spaipkax0ufJl1SoDUdchCsM4y/88YaluorQ==}
+    engines: {node: '>=14.0.0'}
+    cpu: [arm64]
+    os: [linux]
+    libc: glibc
+
+  sass-embedded-linux-arm@1.100.0:
+    resolution: {integrity: sha512-9Ul7O1eKrc5YlhwWjkp8tZPSe3UEwSZ1uwUZOQom1HL0pRlBA6F/IlGZYFTLwnHMIP1fc77MMNaBRfc05mKMpw==}
+    engines: {node: '>=14.0.0'}
+    cpu: [arm]
+    os: [linux]
+    libc: glibc
+
+  sass-embedded-linux-musl-arm64@1.100.0:
+    resolution: {integrity: sha512-XpACJB2KjSLjf2e9uuvGVdOURsoNrFqgRiihhXyUHK9W0t3LIHb7z5MA/7XGPIT9bWSOO2zyw+rH/FHtDV/Yrg==}
+    engines: {node: '>=14.0.0'}
+    cpu: [arm64]
+    os: [linux]
+    libc: musl
+
+  sass-embedded-linux-musl-arm@1.100.0:
+    resolution: {integrity: sha512-sl0JgbGloPyJg66XXx5UDSDScZ0oU85DpMQU4JU/sCUCFj1Z8zZ69SJWKTCNE4/jwnce7WI2zPCV5AG+RHOZJw==}
+    engines: {node: '>=14.0.0'}
+    cpu: [arm]
+    os: [linux]
+    libc: musl
+
+  sass-embedded-linux-musl-riscv64@1.100.0:
+    resolution: {integrity: sha512-ShvI0Kx04mwoCARwZ0UjiT97isQvzO80tAt91zmFyHLN9kelc/IrQi940farSm2xQVPCKdeVyeG0ekBsokSpYQ==}
+    engines: {node: '>=14.0.0'}
+    cpu: [riscv64]
+    os: [linux]
+    libc: musl
+
+  sass-embedded-linux-musl-x64@1.100.0:
+    resolution: {integrity: sha512-TDBCRWNuS4RDLQXvRc1gjZlWiWTWaWGp0Bwu/IKwJxov81lsvrCs3TihTyNXtW7V5aoN4Ky3r0QOkNb3mwmBnA==}
+    engines: {node: '>=14.0.0'}
+    cpu: [x64]
+    os: [linux]
+    libc: musl
+
+  sass-embedded-linux-riscv64@1.100.0:
+    resolution: {integrity: sha512-j4ENJGOheO+fm3j/yorLxCjBP6/XskrZx7dTLlT+lXYwN/qqCqoA/gsNLI0McS3DFM6GBwPiffzWsdWS8t6sEQ==}
+    engines: {node: '>=14.0.0'}
+    cpu: [riscv64]
+    os: [linux]
+    libc: glibc
+
+  sass-embedded-linux-x64@1.100.0:
+    resolution: {integrity: sha512-0vUSN8j0WGtCJIOPh//EmUvYGHW0QOe5iul8qyhPk50MAcw49MA0r34AhftjDdx94ILPF6vApFs0gwHPQRlpVA==}
+    engines: {node: '>=14.0.0'}
+    cpu: [x64]
+    os: [linux]
+    libc: glibc
+
+  sass-embedded-unknown-all@1.100.0:
+    resolution: {integrity: sha512-c+naBgWId4MIpToXcI0DgqetjdAkwTTAxFAuOaBz7HUXLdyG1oZRrEvSsbe41nEdQOKH0vgofVFCeSQgoXOG9A==}
+    os: ['!android', '!darwin', '!linux', '!win32']
+
+  sass-embedded-win32-arm64@1.100.0:
+    resolution: {integrity: sha512-iE+yxj+hUXwwbqpHkXxgAWTzeRfcWxJ7SSTQEPMk48lwq3oCrWLlz5sQuWHbuTK/i0GKQfROdP+hOmPi89yjUg==}
+    engines: {node: '>=14.0.0'}
+    cpu: [arm64]
+    os: [win32]
+
+  sass-embedded-win32-x64@1.100.0:
+    resolution: {integrity: sha512-qI4F8MI7/KYoy9NdjJfhSspG42WPkADSNDvwEV7qWvCSFC83koJssRsKO2/PfY+niZz6BG65Ic/D+A11h959hw==}
+    engines: {node: '>=14.0.0'}
+    cpu: [x64]
+    os: [win32]
+
+  sass-embedded@1.100.0:
+    resolution: {integrity: sha512-Ut8wlQSk19tm7jMK6mz6cF1+e+E7tUnW2tM02zQDPnOTcVbV8qCQG8UWxZkkNlY50+hV3hqP24OOkUlMz8xBpw==}
+    engines: {node: '>=16.0.0'}
     hasBin: true
 
-  sax@1.4.1:
-    resolution: {integrity: sha512-+aWOz7yVScEGoKNd4PA10LZ8sk0A/z5+nXQG5giUO5rprX9jgYsTdov9qCchZiPIZezbZH+jRut8nPodFAX4Jg==}
+  sass@1.100.0:
+    resolution: {integrity: sha512-B5j0rYMlinhhOo9tjQebMVVn0TfyXAF+wB3b2ggZUuJ/is/Y+7+JGjirAMxHZ9Z3hIP98NPfamlAkBHa1lAaXQ==}
+    engines: {node: '>=20.19.0'}
+    hasBin: true
+
+  sass@1.102.0:
+    resolution: {integrity: sha512-NSOyTnaQF7rTAEOtI2fwb386vL+akyiQLBZu8Na7hXCb+umJy0GAqlcMIaqACZ6Z1VgTBS4K9PG6B3IdjHGJsw==}
+    engines: {node: '>=20.19.0'}
+    hasBin: true
+
+  sax@1.6.1:
+    resolution: {integrity: sha512-42tBVwLWnaQvW5zc4HbZrTuWccECCZfBi92FDuwtqxasH+JbPB3/FOKb1m222K42R4WxuxzzMsTswfzgtSu64Q==}
+    engines: {node: '>=11.0.0'}
 
   saxes@5.0.1:
     resolution: {integrity: sha512-5LBh1Tls8c9xgGjw3QrMwETmTMVk0oFgvrFSvWx62llR2hcEInrKNZ2GZCCuuy2lvWrdl5jhbpeqc5hRYKFOcw==}
@@ -8663,13 +10533,16 @@ packages:
   scroll-into-view-if-needed@2.2.31:
     resolution: {integrity: sha512-dGCXy99wZQivjmjIqihaBQNjryrz5rueJY7eHfTdyWEiR4ttYpsajb14rn9s5d4DY4EcY6+4+U/maARBXJedkA==}
 
-  scslre@0.3.0:
-    resolution: {integrity: sha512-3A6sD0WYP7+QrjbfNA2FN3FsOaGGFoekCVgTyypy53gPxhbkCIjtO6YWgdrfM+n/8sI8JeXZOIxsHjMTNxQ4nQ==}
-    engines: {node: ^14.0.0 || >=16.0.0}
+  scroll-into-view-if-needed@3.1.0:
+    resolution: {integrity: sha512-49oNpRjWRvnU8NyGVmUaYG4jtTkNonFZI86MmGRDqBphEK2EXT9gdEUoQPZhuBM8yWHxCWbobltqYO5M4XrUvQ==}
 
   scule@1.3.0:
     resolution: {integrity: sha512-6FtHJEvt+pVMIB9IBY+IcCJ6Z5f1iQnytgyfKMhDKgmzYG+TeH/wx1y3l27rshSbLiSanrR9ffZDrEsmjlQF2g==}
 
+  secure-ls@2.0.0:
+    resolution: {integrity: sha512-Wgtnw0QSm0v7gVKv11nOoeyGS65EThGXnBB7jfd4IhZd2eq3B4AMPcXAL5qJ1h55+Qolun7TONTwX7H5m6e2pQ==}
+    engines: {node: '>=8.0'}
+
   semver-compare@1.0.0:
     resolution: {integrity: sha512-YM3/ITh2MJ5MtzaM429anh+x2jiLVjqILF4m4oyQB18W7Ggea7BfqdH/wGMK7dDiMghv/6WG7znWMwUDzJiXow==}
 
@@ -8681,29 +10554,34 @@ packages:
     resolution: {integrity: sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==}
     hasBin: true
 
-  semver@7.5.4:
-    resolution: {integrity: sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==}
+  semver@7.7.4:
+    resolution: {integrity: sha512-vFKC2IEtQnVhpT78h1Yp8wzwrf8CM+MzKMHGJZfBtzhZNycRFnXsHk6E5TxIkkMsgNS7mdX3AGB7x2QM2di4lA==}
     engines: {node: '>=10'}
     hasBin: true
 
-  semver@7.6.3:
-    resolution: {integrity: sha512-oVekP1cKtI+CTDvHWYFUcMtsK/00wmAEfyqKfNdARm8u1wNVhSgaX7A8d4UuIlUI5e84iEwOhs7ZPYRmzU9U6A==}
+  semver@7.8.5:
+    resolution: {integrity: sha512-Y7/KDsb8LjooZpwaqGyulO6DQlksgCncchHGk+sZIY4SBvUocMBEFH5Ur1fI4dV+Jvl0w6cjvucaIi40puRioA==}
     engines: {node: '>=10'}
     hasBin: true
 
-  send@0.19.0:
-    resolution: {integrity: sha512-dW41u5VfLXu8SJh5bwRmyYUbAoSB3c9uQh6L8h/KtsFREPWpbX1lrljJo186Jc4nmci/sGUZ9a0a0J2zgfq2hw==}
-    engines: {node: '>= 0.8.0'}
+  send@1.2.1:
+    resolution: {integrity: sha512-1gnZf7DFcoIcajTjTwjwuDjzuz4PPcY2StKPlsGAQ1+YH20IRVrBaXSWmdjowTJ6u8Rc01PoYOGHXfP1mYcZNQ==}
+    engines: {node: '>= 18'}
 
-  serialize-javascript@6.0.2:
-    resolution: {integrity: sha512-Saa1xPByTTq2gdeFZYLLo+RFE35NHZkAbqZeWNd3BpzppeVisAqpDjcp8dyf6uIvEqJRd46jemmyA4iFIeVk8g==}
+  serialize-error@7.0.1:
+    resolution: {integrity: sha512-8I8TjW5KMOKsZQTvoxjuSIa7foAwPWGOts+6o7sgjz41/qMD9VQHEDxi6PBvK2l0MXUmqZyNpUK+T2tQaaElvw==}
+    engines: {node: '>=10'}
+
+  serialize-javascript@7.1.0:
+    resolution: {integrity: sha512-RNEqWOyhhUQYN9V1GfHwu9AR/g+NTciH6Z5u3/no6X3/w+04J2lVDL+svFQVXgXrEGBMG2puMVN3gq2SNGuTGw==}
+    engines: {node: '>=20.0.0'}
 
   serve-placeholder@2.0.2:
     resolution: {integrity: sha512-/TMG8SboeiQbZJWRlfTCqMs2DD3SZgWp0kDQePz9yUuCnDfDh/92gf7/PxGhzXTKBIPASIHxFcZndoNbp6QOLQ==}
 
-  serve-static@1.16.2:
-    resolution: {integrity: sha512-VqpjJZKadQB/PEbEwvFdO43Ax5dFBZ2UECszz8bQ7pi7wt//PWe1P6MN7eCnjsatYtBT6EuiClbjSWP2WrIoTw==}
-    engines: {node: '>= 0.8.0'}
+  serve-static@2.2.1:
+    resolution: {integrity: sha512-xRXBn0pPqQTVQiC8wyQrKs2MOlX24zQ0POGaj0kultvoOCstBQM5yvOhAVSUwOMjQtTvsPWoNCHfPGwaaQJhTw==}
+    engines: {node: '>= 18'}
 
   set-blocking@2.0.0:
     resolution: {integrity: sha512-KiKBS8AnWGEyLzofFfmvKwpdPzqiy16LvQfK3yv/fVH7Bj13/wl3JSR1J+rfgRE9q7xUJK4qvgS8raSOeLUehw==}
@@ -8716,6 +10594,10 @@ packages:
     resolution: {integrity: sha512-7PGFlmtwsEADb0WYyvCMa1t+yke6daIG4Wirafur5kcf+MhUnPms1UeR0CKQdTZD81yESwMHbtn+TR+dMviakQ==}
     engines: {node: '>= 0.4'}
 
+  set-proto@1.0.0:
+    resolution: {integrity: sha512-RJRdvCo6IAnPdsvP/7m6bsQqNnn1FCBX5ZNtFL98MmFF/4xAIJTIg1YbHW5DC2W5SKZanrC6i4HsJqlajw/dZw==}
+    engines: {node: '>= 0.4'}
+
   setimmediate@1.0.5:
     resolution: {integrity: sha512-MATJdZp8sLqDl/68LfQmbP8zKPLQNV6BIZoIgrscFDQ+RsvK/BxeDQOgyxKKoh0y/8h3BqVFnCqQ/gd+reiIXA==}
 
@@ -8733,12 +10615,8 @@ packages:
     resolution: {integrity: sha512-7++dFhtcx3353uBaq8DDR4NuxBetBzC7ZQOhmTQInHEd6bSrXdiEyzCvG07Z44UYdLShWUyXt5M/yhz8ekcb1A==}
     engines: {node: '>=8'}
 
-  short-tree@3.0.0:
-    resolution: {integrity: sha512-Yd9NFs/o9QSoH4/wTjxk4Xe0+CIzitDRN1Qg7iBeTSejKjlCg/3PbgiRwDUVuaIxD0RRdv7Iz9jKr7e0HljtUg==}
-    engines: {node: ^14.13.1 || >=16.0.0}
-
-  side-channel-list@1.0.0:
-    resolution: {integrity: sha512-FCLHtRD/gnpCiCHEiJLOwdmFP+wzCmDEkc9y7NsYxeF4u7Btsn1ZuwgwJGxImImHicJArLP4R0yX4c2KCrMrTA==}
+  side-channel-list@1.0.1:
+    resolution: {integrity: sha512-mjn/0bi/oUURjc5Xl7IaWi/OJJJumuoJFQJfDDyO46+hBWsfaVM65TBHq2eoZBhzl9EchxOijpkbRC8SVBQU0w==}
     engines: {node: '>= 0.4'}
 
   side-channel-map@1.0.1:
@@ -8749,19 +10627,26 @@ packages:
     resolution: {integrity: sha512-WPS/HvHQTYnHisLo9McqBHOJk2FkHO/tlpvldyrnem4aeQp4hai3gythswg6p01oSoTl58rcpiFAjF2br2Ak2A==}
     engines: {node: '>= 0.4'}
 
-  side-channel@1.1.0:
-    resolution: {integrity: sha512-ZX99e6tRweoUXqR+VBrslhda51Nh5MTQwou5tnUDgbtyM0dBgmhEDtWGP/xbKn6hqfPRHujUNwz5fy/wbbhnpw==}
+  side-channel@1.1.1:
+    resolution: {integrity: sha512-6x6dK6zJdpTzF4sQeNYxwtvBzf6Eg4GtlesS94HOvTudUeyK2WXAaIfmDgsyslYrRBeFIlsi54AYsFGUuhmvrQ==}
     engines: {node: '>= 0.4'}
 
   siginfo@2.0.0:
     resolution: {integrity: sha512-ybx0WO1/8bSBLEWXZvEd7gMW3Sn3JFlW3TvX1nREbDLRNQNaeNN8WK0meBwPdAaOI7TtRRRJn/Es1zhrrCHu7g==}
 
+  signal-exit@3.0.7:
+    resolution: {integrity: sha512-wnD2ZE+l+SPC/uoS0vXeE9L1+0wuaMqKlfz9AMUo38JsyLSBWSFcHR1Rri62LZc12vLr1gb3jl7iwQhgwpAbGQ==}
+
   signal-exit@4.1.0:
     resolution: {integrity: sha512-bzyZ1e88w9O1iNJbKnOlvYTrWPDl46O1bG0D3XInv+9tkPrxrN8jUUTiFlDkkmKWgn1M6CfIA13SuGqOa9Korw==}
     engines: {node: '>=14'}
 
-  sirv@3.0.0:
-    resolution: {integrity: sha512-BPwJGUeDaDCHihkORDchNyyTvWFhcusy1XMmhEVTQTwGeybFbp8YEmB+njbPnth1FibULBSBVwCQni25XlCUDg==}
+  simple-update-notifier@2.0.0:
+    resolution: {integrity: sha512-a2B9Y0KlNXl9u/vsW6sTIu9vGEpfKu2wRV6l1H3XEas/0gUIzGzBoP/IouTcUQbm9JWZLH3COxyn03TYlFax6w==}
+    engines: {node: '>=10'}
+
+  sirv@3.0.2:
+    resolution: {integrity: sha512-2wcC/oGxHis/BoHkkPwldgiPSYcpZK3JU28WoMVv55yHJgcZ8rlXvuG9iZggz+sU1d4bRgIGASwyWqjxu3FM0g==}
     engines: {node: '>=18'}
 
   sisteransi@1.0.5:
@@ -8775,38 +10660,24 @@ packages:
     resolution: {integrity: sha512-ZA6oR3T/pEyuqwMgAKT0/hAv8oAXckzbkmR0UkUosQ+Mc4RxGoJkRmwHgHufaenlyAgE1Mxgpdcrf75y6XcnDg==}
     engines: {node: '>=14.16'}
 
-  slashes@3.0.12:
-    resolution: {integrity: sha512-Q9VME8WyGkc7pJf6QEkj3wE+2CnvZMI+XJhwdTPR8Z/kWQRXi7boAWLDibRPyHRTUTPx5FaU7MsyrjI3yLB4HA==}
-
   slice-ansi@4.0.0:
     resolution: {integrity: sha512-qMCMfhY040cVHT43K9BFygqYbUPFZKHOg7K73mtTWJRb8pyP3fzf4Ixd5SzdEJQ6MRUg/WBnOLxghZtKKurENQ==}
     engines: {node: '>=10'}
 
-  slice-ansi@5.0.0:
-    resolution: {integrity: sha512-FC+lgizVPfie0kkhqUScwRu1O/lF6NOgJmlCgK+/LYxDCTk8sGelYaHDhFcDN+Sn3Cv+3VSa4Byeo+IMCzpMgQ==}
-    engines: {node: '>=12'}
+  slice-ansi@9.0.0:
+    resolution: {integrity: sha512-SO/3iYL5S3W57LLEniscOGPZgOqZUPCx6d3dB+52B80yJ0XstzsC/eV8gnA4tM3MHDrKz+OCFSLNjswdSC+/bA==}
+    engines: {node: '>=22'}
 
-  slice-ansi@7.1.0:
-    resolution: {integrity: sha512-bSiSngZ/jWeX93BqeIAbImyTbEihizcwNjFoRUIY/T1wWQsfsm2Vw1agPKylXvQTU7iASGdHhyqRlqQzfz+Htg==}
-    engines: {node: '>=18'}
+  smob@1.6.2:
+    resolution: {integrity: sha512-RQsvleCbF8cVHEv+xuDGaA4pOizFqJ0GgjtMSRo6oP8pnN7WsigHgVGey6aILRBKv4W2YOMHLqbKdnB6hpB9fw==}
+    engines: {node: '>=20.0.0'}
 
-  smart-buffer@4.2.0:
-    resolution: {integrity: sha512-94hK0Hh8rPqQl2xXc3HsaBoOXKV20MToPkcXvwbISWLEs+64sBq5kFgn2kJDHb1Pry9yrP0dxrCI9RRci7RXKg==}
-    engines: {node: '>= 6.0.0', npm: '>= 3.0.0'}
+  smol-toml@1.7.1:
+    resolution: {integrity: sha512-PPlsspAZ4jbMBu5DMFhfUGDQLu/vrL4SyBROVS37x8ynnVmFIs1VPBz1Co8Xks3TvpIaZXmU85y4DrQ+UyVFoQ==}
+    engines: {node: '>= 18'}
 
-  smob@1.5.0:
-    resolution: {integrity: sha512-g6T+p7QO8npa+/hNx9ohv1E5pVCmWrVCUzUXJyLdMmftX6ER0oiWY/w9knEonLpnOp6b6FenKnMfR8gqwWdwig==}
-
-  socks-proxy-agent@5.0.1:
-    resolution: {integrity: sha512-vZdmnjb9a2Tz6WEQVIurybSwElwPxMZaIc7PzqbJTrezcKNznv6giT7J7tZDZ1BojVaa1jvO/UiUdhDVB0ACoQ==}
-    engines: {node: '>= 6'}
-
-  socks@2.8.3:
-    resolution: {integrity: sha512-l5x7VUUWbjVFbafGLxPWkYsHIhEvmF85tbIeFZWc8ZPtoMyybuEhL7Jye/ooC4/d48FgOjSJXgsF/AJPYCW8Zw==}
-    engines: {node: '>= 10.0.0', npm: '>= 3.0.0'}
-
-  sortablejs@1.15.6:
-    resolution: {integrity: sha512-aNfiuwMEpfBM/CN6LY0ibyhxPfPbyFeBTYJKCvzkJ2GkUpazIt3H+QIPAMHwqQ7tMKaHz1Qj+rJJCqljnf4p3A==}
+  sortablejs@1.15.7:
+    resolution: {integrity: sha512-Kk8wLQPlS+yi1ZEf48a4+fzHa4yxjC30M/Sr2AnQu+f/MPwvvX9XjZ6OWejiz8crBsLwSq8GHqaxaET7u6ux0A==}
 
   source-map-js@1.2.1:
     resolution: {integrity: sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA==}
@@ -8819,45 +10690,17 @@ packages:
     resolution: {integrity: sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==}
     engines: {node: '>=0.10.0'}
 
-  source-map@0.7.4:
-    resolution: {integrity: sha512-l3BikUxvPOcn5E74dZiq5BGsTb5yEwhaTSzccU6t4sDOH8NWJCstKO5QT2CvtFoK6F0saL7p9xHAqHOlCPJygA==}
-    engines: {node: '>= 8'}
+  source-map@0.7.6:
+    resolution: {integrity: sha512-i5uvt8C3ikiWeNZSVZNWcfZPItFQOsYTUAOkcUPGd8DqDy1uOUikjt5dG+uRlwyvR108Fb9DOd4GvXfT0N2/uQ==}
+    engines: {node: '>= 12'}
 
-  source-map@0.8.0-beta.0:
-    resolution: {integrity: sha512-2ymg6oRBpebeZi9UUNsgQ89bhx01TcTkmNTGnNO88imTmbSgy4nfujrgVEFKWpMTEGA11EDkTt7mqObTPdigIA==}
-    engines: {node: '>= 8'}
-    deprecated: The work that was done in this beta branch won't be included in future versions
-
-  sourcemap-codec@1.4.8:
-    resolution: {integrity: sha512-9NykojV5Uih4lgo5So5dtw+f0JgJX30KCNI8gwhz2J9A15wD0Ml6tjHKwf6fTSa6fAdVBdZeNOs9eJ71qCk8vA==}
-    deprecated: Please use @jridgewell/sourcemap-codec instead
+  source-map@0.8.0:
+    resolution: {integrity: sha512-d8EqvL+k/SOXCreS/SUzg2ciyHqBBLcN/yuRjFsbvVhHTE2pgei7oAhmPM7kWFbkX6OSMQfUq4KbkF3au9lhYQ==}
+    engines: {node: '>= 12'}
 
   spawndamnit@3.0.1:
     resolution: {integrity: sha512-MmnduQUuHCoFckZoWnXsTg7JaiLBJrKFj9UI2MbRPGaJeVpsLcVBu6P/IGZovziM/YBsellCmsprgNA+w0CzVg==}
 
-  spdx-correct@3.2.0:
-    resolution: {integrity: sha512-kN9dJbvnySHULIluDHy32WHRUu3Og7B9sbY7tsFLctQkIqnMh3hErYgdMjTYuqmcXX+lK5T1lnUt3G7zNswmZA==}
-
-  spdx-exceptions@2.5.0:
-    resolution: {integrity: sha512-PiU42r+xO4UbUS1buo3LPJkjlO7430Xn5SVAhdpzzsPHsjbYVflnnFdATgabnLude+Cqu25p6N+g2lw/PFsa4w==}
-
-  spdx-expression-parse@3.0.1:
-    resolution: {integrity: sha512-cbqHunsQWnJNE6KhVSMsMeH5H/L9EpymbzqTQ3uLwNCLZ1Q481oWaofqH7nO6V07xlXwY6PhQdQ2IedWx/ZK4Q==}
-
-  spdx-expression-parse@4.0.0:
-    resolution: {integrity: sha512-Clya5JIij/7C6bRR22+tnGXbc4VKlibKSVj2iHvVeX5iMW7s1SIQlqu699JkODJJIhh/pUu8L0/VLh8xflD+LQ==}
-
-  spdx-license-ids@3.0.20:
-    resolution: {integrity: sha512-jg25NiDV/1fLtSgEgyvVyDunvaNHbuwF9lfNV17gSmPFAlYzdfNBlLtLzXTevwkPj7DhGbmN9VnmJIgLnhvaBw==}
-
-  speakingurl@14.0.1:
-    resolution: {integrity: sha512-1POYv7uv2gXoyGFpBCmpDVSNV74IfsWlDW216UPjbWufNf+bSU6GdbDsxdcxtfwb4xlI3yxzOTKClUosxARYrQ==}
-    engines: {node: '>=0.10.0'}
-
-  split2@4.2.0:
-    resolution: {integrity: sha512-UcjcJOWknrNkF6PLX83qcHM6KHgVKNkV62Y8a5uYDVv9ydGQVwAHMKqHdJje1VTWpljG0WYpCDhrCdAOYH4TWg==}
-    engines: {node: '>= 10.x'}
-
   sprintf-js@1.0.3:
     resolution: {integrity: sha512-D9cPgkvLlV3t3IzL0D0YLvGA9Ahk4PcvVwUbN0dSGr1aP0Nrt4AEnTUbuGvquEC0mA64Gqt1fzirlRs5ibXx8g==}
 
@@ -8868,36 +10711,36 @@ packages:
     resolution: {integrity: sha512-+idbmIXoYET47hH+d7dfm2epdOMUDjqcB4648sTZ+t2JwoyBFL/insLfB/racrDmsKB3diwsDA696pZMieAC5g==}
     engines: {node: '>=0.8'}
 
-  ssri@8.0.1:
-    resolution: {integrity: sha512-97qShzy1AiyxvPNIkLWoGua7xoQzzPjQ0HAH4B0rWKo7SZ6USuPcrUiAFrws0UH8RrbWmgq3LMTObhPIHbbBeQ==}
-    engines: {node: '>= 8'}
-
-  stable-hash@0.0.4:
-    resolution: {integrity: sha512-LjdcbuBeLcdETCrPn9i8AYAZ1eCtu4ECAWtP7UleOiZ9LzVxRzzUZEoZ8zB24nhkQnDWyET0I+3sWokSDS3E7g==}
-
   stackback@0.0.2:
     resolution: {integrity: sha512-1XMJE5fQo1jGH6Y/7ebnwPOBEkIEnT4QF32d5R1+VXdXveM0IBMJt8zfaxX1P3QhVwrYe+576+jkANtSS2mBbw==}
 
   standard-as-callback@2.1.0:
     resolution: {integrity: sha512-qoRRSyROncaz1z0mvYqIE4lCd9p2R90i6GxW3uZv5ucSu8tU7B5HXUP1gG8pVZsYNVaXjk8ClXHPttLyxAL48A==}
 
-  statuses@2.0.1:
-    resolution: {integrity: sha512-RwNA9Z/7PrK06rYLIzFMlaF+l73iwpzsqRIFgbMLbTcLD6cOao82TaWefPXQvB2fOC4AjuYSEndS7N/mTCbkdQ==}
+  stat-mode@1.0.0:
+    resolution: {integrity: sha512-jH9EhtKIjuXZ2cWxmXS8ZP80XyC3iasQxMDV8jzhNJpfDb7VbQLVW4Wvsxz9QZvzV+G4YoSfBUVKDOyxLzi/sg==}
+    engines: {node: '>= 6'}
+
+  statuses@2.0.2:
+    resolution: {integrity: sha512-DvEy55V3DB7uknRo+4iOGT5fP1slR8wQohVdknigZPMpMstaKJQWhwiYBACJE3Ul2pTnATihhBYnRhZQHGBiRw==}
     engines: {node: '>= 0.8'}
 
-  std-env@3.8.0:
-    resolution: {integrity: sha512-Bc3YwwCB+OzldMxOXJIIvC6cPRWr/LxOp48CdQTOkPyk/t4JWWJbrilwBd7RJzKV8QW7tJkcgAmeuLLJugl5/w==}
+  std-env@4.2.0:
+    resolution: {integrity: sha512-oCUKSupKTHX53EyjDtuZQ64pjLJ6yYCtpmEw0goYxtjG9KpbRe8KAsl2tBUGU9DyMcJ0RwJ8GqJAFzMXcXW1Rw==}
 
-  stdin-discarder@0.2.2:
-    resolution: {integrity: sha512-UhDfHmA92YAlNnCfhmq0VeNL5bDbiZGg7sZ2IvPsXubGkiNa9EC+tUTsjBRsYUAz87btI6/1wf4XoVvQ3uRnmQ==}
+  stdin-discarder@0.3.2:
+    resolution: {integrity: sha512-eCPu1qRxPVkl5605OTWF8Wz40b4Mf45NY5LQmVPQ599knfs5QhASUm9GbJ5BDMDOXgrnh0wyEdvzmL//YMlw0A==}
     engines: {node: '>=18'}
 
-  streamx@2.21.1:
-    resolution: {integrity: sha512-PhP9wUnFLa+91CPy3N6tiQsK+gnYyUNuk15S3YG/zjYE7RuPeCjJngqnzpC31ow0lzBHQ+QGO4cNJnd0djYUsw==}
+  stop-iteration-iterator@1.1.0:
+    resolution: {integrity: sha512-eLoXW/DHyl62zxY4SCaIgnRhuMr6ri4juEYARS8E6sCEqzKpOiE521Ucofdx+KnDZl5xmvGYaaKCk5FEOxJCoQ==}
+    engines: {node: '>= 0.4'}
 
-  string-argv@0.3.2:
-    resolution: {integrity: sha512-aqD2Q0144Z+/RqG52NeHEkZauTAUWJO8c6yTftGJKO3Tja5tUgIfmIl6kExvhtxSDP7fXB6DvzkfMpCd/F3G+Q==}
-    engines: {node: '>=0.6.19'}
+  stream-parser@0.3.1:
+    resolution: {integrity: sha512-bJ/HgKq41nlKvlhccD5kaCr/P+Hu0wPNKPJOH7en+YrJu/9EgqUF+88w5Jb6KNcjOFMhfX4B2asfeAtIGuHObQ==}
+
+  streamx@2.28.0:
+    resolution: {integrity: sha512-1Yowhzjf0ivGMrTIkY9hav5TxobO9qIVqUE41fiCGMGgc3CLlf4MY+9AHmZqBWgDTue0fY9zWjYFVyf6Diuobw==}
 
   string-width@4.2.3:
     resolution: {integrity: sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==}
@@ -8911,16 +10754,20 @@ packages:
     resolution: {integrity: sha512-tsaTIkKW9b4N+AEj+SVA+WhJzV7/zMhcSu78mLKWSk7cXMOSHsBKFWUs0fWwq8QyK3MgJBQRX6Gbi4kYbdvGkQ==}
     engines: {node: '>=18'}
 
+  string-width@8.2.2:
+    resolution: {integrity: sha512-GaPUh5gfdrYzqeVNZvUfT23vYYxXzKYidUcnMtJg/3rxRV63EFZy3k6xfKlmfeJD0176lnUV/Usr3XcwSvFzpg==}
+    engines: {node: '>=20'}
+
   string.prototype.matchall@4.0.12:
     resolution: {integrity: sha512-6CC9uyBL+/48dYizRf7H7VAYCMCNTBeM78x/VTUe9bFEaxBepPJDa1Ow99LqI/1yF7kuy7Q3cQsYMrcjGUcskA==}
     engines: {node: '>= 0.4'}
 
-  string.prototype.trim@1.2.10:
-    resolution: {integrity: sha512-Rs66F0P/1kedk5lyYyH9uBzuiI/kNRmwJAR9quK6VOtIpZ2G+hMZd+HQbbv25MgCA6gEffoMZYxlTod4WcdrKA==}
+  string.prototype.trim@1.2.11:
+    resolution: {integrity: sha512-PwvK7BU+CMTJGYQCTZb5RWXIML92lftJLhQz1tBzgKiqGxJaMlBAa48POXaNAC2s4y8jr3EFqrkF9+44neS46w==}
     engines: {node: '>= 0.4'}
 
-  string.prototype.trimend@1.0.9:
-    resolution: {integrity: sha512-G7Ok5C6E/j4SGfyLCloXTrngQIQU3PWtXGst3yM7Bea9FRURf1S42ZHlZZtsNque2FN2PoUhfZXYLNWwEr4dLQ==}
+  string.prototype.trimend@1.0.10:
+    resolution: {integrity: sha512-2+3aDAOmPTmuFwjDnmJG2ctEkQKVki7vOSqaxkv42Mowj1V6PnvuwFCRrR5lChUux1TBskPjfkeTOhqczDMxTw==}
     engines: {node: '>= 0.4'}
 
   string.prototype.trimstart@1.0.8:
@@ -8941,8 +10788,8 @@ packages:
     resolution: {integrity: sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==}
     engines: {node: '>=8'}
 
-  strip-ansi@7.1.0:
-    resolution: {integrity: sha512-iq6eVVI64nQQTRYq2KtEg2d2uU7LElhTJwsH4YzIHZshxlgZms/wIc4VoDQTlG/IvVIrBKG06CrZnp0qv7hkcQ==}
+  strip-ansi@7.2.0:
+    resolution: {integrity: sha512-yDPMNjp4WyfYBkHnjIRLfca1i6KMyGCtsVgoKe/z1+6vukgaENdgGBZt+ZmKPc4gavvEZ5OgHfHdrazhgNyG7w==}
     engines: {node: '>=12'}
 
   strip-bom@3.0.0:
@@ -8957,119 +10804,111 @@ packages:
     resolution: {integrity: sha512-ZprKx+bBLXv067WTCALv8SSz5l2+XhpYCsVtSqlMnkAXMWDq+/ekVbl1ghqP9rUHTzv6sm/DwCOiYutU/yp1fw==}
     engines: {node: '>=10'}
 
-  strip-final-newline@3.0.0:
-    resolution: {integrity: sha512-dOESqjYr96iWYylGObzd39EuNTa5VJxyvVAEm5Jnh7KGo75V43Hk1odPQkNDyXNmUR6k+gEiDVXnjB8HJ3crXw==}
-    engines: {node: '>=12'}
-
   strip-final-newline@4.0.0:
     resolution: {integrity: sha512-aulFJcD6YK8V1G7iRB5tigAP4TsHBZZrOV8pjV++zdUwmeV8uzbY7yn6h9MswN62adStNZFuCIx4haBnRuMDaw==}
     engines: {node: '>=18'}
 
-  strip-indent@3.0.0:
-    resolution: {integrity: sha512-laJTa3Jb+VQpaC6DseHhF7dXVqHTfJPCRDaEbid/drOhgitgYku/letMUqOXFoWV0zIIUbjpdH2t+tYj4bQMRQ==}
-    engines: {node: '>=8'}
-
   strip-json-comments@2.0.1:
     resolution: {integrity: sha512-4gB8na07fecVVkOI6Rs4e7T6NOTki5EmL7TUduTs6bu3EdnSycntVJ4re8kgZA+wx9IueI2Y11bfbgwtzuE0KQ==}
     engines: {node: '>=0.10.0'}
 
-  strip-json-comments@3.1.1:
-    resolution: {integrity: sha512-6fPc+R4ihwqP6N/aIv2f1gMH8lOVtWQHoqC4yK6oSDVVocumAsfCqjkXnqiYMhmMwS/mEHLp7Vehlt3ql6lEig==}
-    engines: {node: '>=8'}
+  strip-json-comments@5.0.3:
+    resolution: {integrity: sha512-1tB5mhVo7U+ETBKNf92xT4hrQa3pm0MZ0PQvuDnWgAAGHDsfp4lPSpiS6psrSiet87wyGPh9ft6wmhOMQ0hDiw==}
+    engines: {node: '>=14.16'}
 
-  strip-literal@2.1.1:
-    resolution: {integrity: sha512-631UJ6O00eNGfMiWG78ck80dfBab8X6IVFB51jZK5Icd7XAs60Z5y7QdSd/wGIklnWvRbUNloVzhOKKmutxQ6Q==}
+  strip-literal@4.0.0:
+    resolution: {integrity: sha512-PaqAvfUZKBwc/SLmNZtHmzK+v19Z4O4eS3cKPeGvbIv/U3pnyEq4Tuw3/4v/FwfM8VQaEawsyCcOQ0P+kpwWWw==}
 
-  stubborn-fs@1.2.5:
-    resolution: {integrity: sha512-H2N9c26eXjzL/S/K+i/RHHcFanE74dptvvjM8iwzwbVcWY/zjBbgRqF3K0DY4+OD+uTTASTBvDoxPDaPN02D7g==}
+  stubborn-fs@2.0.0:
+    resolution: {integrity: sha512-Y0AvSwDw8y+nlSNFXMm2g6L51rBGdAQT20J3YSOqxC53Lo3bjWRtr2BKcfYoAf352WYpsZSTURrA0tqhfgudPA==}
 
-  style-mod@4.1.2:
-    resolution: {integrity: sha512-wnD1HyVqpJUI2+eKZ+eo1UwghftP6yuFheBqqe+bWCotBjC2K1YnteJILRMs3SM4V/0dLEW1SC27MWP5y+mwmw==}
+  stubborn-utils@1.0.2:
+    resolution: {integrity: sha512-zOh9jPYI+xrNOyisSelgym4tolKTJCQd5GBhK0+0xJvcYDcwlOoxF/rnFKQ2KRZknXSG9jWAp66fwP6AxN9STg==}
+
+  style-mod@4.1.3:
+    resolution: {integrity: sha512-i/n8VsZydrugj3Iuzll8+x/00GH2vnYsk1eomD8QiRrSAeW6ItbCQDtfXCeJHd0iwiNagqjQkvpvREEPtW3IoQ==}
 
   style-search@0.1.0:
     resolution: {integrity: sha512-Dj1Okke1C3uKKwQcetra4jSuk0DqbzbYtXipzFlFMZtowbF1x7BKJwB9AayVMyFARvU8EDrZdcax4At/452cAg==}
 
-  stylehacks@7.0.4:
-    resolution: {integrity: sha512-i4zfNrGMt9SB4xRK9L83rlsFCgdGANfeDAYacO1pkqcE7cRHPdWHwnKZVz7WY17Veq/FvyYsRAU++Ga+qDFIww==}
+  style-value-types@5.1.2:
+    resolution: {integrity: sha512-Vs9fNreYF9j6W2VvuDTP7kepALi7sk0xtk2Tu8Yxi9UoajJdEVpNpCov0HsLTqXvNGKX+Uv09pkozVITi1jf3Q==}
+
+  stylehacks@7.0.11:
+    resolution: {integrity: sha512-iODNfhXVLqc5LADs+Y6Oh5wJuK5ZcHbVng8aiK3y9pjMQdc5hLrBW0eFU6FtnpNrE6PoEg/MmFTU4waotj5WNg==}
     engines: {node: ^18.12.0 || ^20.9.0 || >=22.0}
     peerDependencies:
-      postcss: ^8.4.31
+      postcss: ^8.5.13
 
-  stylelint-config-html@1.1.0:
-    resolution: {integrity: sha512-IZv4IVESjKLumUGi+HWeb7skgO6/g4VMuAYrJdlqQFndgbj6WJAXPhaysvBiXefX79upBdQVumgYcdd17gCpjQ==}
-    engines: {node: ^12 || >=14}
+  stylelint-config-html@2.0.0:
+    resolution: {integrity: sha512-Lk1NPEdUxzHkPv3ehktjpiOk4MPaqQ3H8fkvhxdWlQpaZCm9ze0SoMbRQLqkUxEMfPE1G9/x968uxm/+d2njoA==}
+    engines: {node: ^22.12 || >=24}
     peerDependencies:
-      postcss-html: ^1.0.0
-      stylelint: '>=14.0.0'
+      postcss-html: ^2.0.0
+      stylelint: '>=16.0.0'
 
-  stylelint-config-recess-order@5.1.1:
-    resolution: {integrity: sha512-eDAHWVBelzDbMbdMj15pSw0Ycykv5eLeriJdbGCp0zd44yvhgZLI+wyVHegzXp5NrstxTPSxl0fuOVKdMm0XLA==}
+  stylelint-config-recess-order@7.7.0:
+    resolution: {integrity: sha512-TWRkg+BrwHOki4pi9y1emWgx6pFwZXOYZhNsbEObke/mzYUJVJvDEzJJQXhH7ajslQJGcrExy8ZvJqDiUbhFpA==}
     peerDependencies:
-      stylelint: '>=16'
+      stylelint: ^16.18.0 || ^17.0.0
+      stylelint-order: ^7.0.0 || ^8.0.0
 
-  stylelint-config-recommended-scss@14.1.0:
-    resolution: {integrity: sha512-bhaMhh1u5dQqSsf6ri2GVWWQW5iUjBYgcHkh7SgDDn92ijoItC/cfO/W+fpXshgTQWhwFkP1rVcewcv4jaftRg==}
-    engines: {node: '>=18.12.0'}
+  stylelint-config-recommended-scss@17.0.1:
+    resolution: {integrity: sha512-x5DVehzJudcwF0od3sGpgkln2PLLranFE7twwbp7dqDINCyZvwzFkMc6TLhNOvazRiVBJYATQLouJY0xPGB8WA==}
+    engines: {node: '>=20'}
     peerDependencies:
       postcss: ^8.3.3
-      stylelint: ^16.6.1
+      stylelint: ^17.0.0
     peerDependenciesMeta:
       postcss:
         optional: true
 
-  stylelint-config-recommended-vue@1.5.0:
-    resolution: {integrity: sha512-65TAK/clUqkNtkZLcuytoxU0URQYlml+30Nhop7sRkCZ/mtWdXt7T+spPSB3KMKlb+82aEVJ4OrcstyDBdbosg==}
+  stylelint-config-recommended-vue@1.6.1:
+    resolution: {integrity: sha512-lLW7hTIMBiTfjenGuDq2kyHA6fBWd/+Df7MO4/AWOxiFeXP9clbpKgg27kHfwA3H7UNMGC7aeP3mNlZB5LMmEQ==}
     engines: {node: ^12 || >=14}
     peerDependencies:
       postcss-html: ^1.0.0
       stylelint: '>=14.0.0'
 
-  stylelint-config-recommended@14.0.1:
-    resolution: {integrity: sha512-bLvc1WOz/14aPImu/cufKAZYfXs/A/owZfSMZ4N+16WGXLoX5lOir53M6odBxvhgmgdxCVnNySJmZKx73T93cg==}
-    engines: {node: '>=18.12.0'}
+  stylelint-config-recommended@18.0.0:
+    resolution: {integrity: sha512-mxgT2XY6YZ3HWWe3Di8umG6aBmWmHTblTgu/f10rqFXnyWxjKWwNdjSWkgkwCtxIKnqjSJzvFmPT5yabVIRxZg==}
+    engines: {node: '>=20.19.0'}
     peerDependencies:
-      stylelint: ^16.1.0
+      stylelint: ^17.0.0
 
-  stylelint-config-standard@36.0.1:
-    resolution: {integrity: sha512-8aX8mTzJ6cuO8mmD5yon61CWuIM4UD8Q5aBcWKGSf6kg+EC3uhB+iOywpTK4ca6ZL7B49en8yanOFtUW0qNzyw==}
-    engines: {node: '>=18.12.0'}
+  stylelint-config-standard@40.0.0:
+    resolution: {integrity: sha512-EznGJxOUhtWck2r6dJpbgAdPATIzvpLdK9+i5qPd4Lx70es66TkBPljSg4wN3Qnc6c4h2n+WbUrUynQ3fanjHw==}
+    engines: {node: '>=20.19.0'}
     peerDependencies:
-      stylelint: ^16.1.0
+      stylelint: ^17.0.0
 
-  stylelint-order@6.0.4:
-    resolution: {integrity: sha512-0UuKo4+s1hgQ/uAxlYU4h0o0HS4NiQDud0NAUNI0aa8FJdmYHA5ZZTFHiV5FpmE3071e9pZx5j0QpVJW5zOCUA==}
+  stylelint-order@8.1.1:
+    resolution: {integrity: sha512-LqsEB6VggJuu5v10RtkrQsBObcdwBE7GuAOlwfc/LR3VL/w8UqKX2BOLIjhyGt0Gne/njo7gRNGiJAKhfmPMNw==}
+    engines: {node: '>=20.19.0'}
     peerDependencies:
-      stylelint: ^14.0.0 || ^15.0.0 || ^16.0.1
+      stylelint: ^16.18.0 || ^17.0.0
 
-  stylelint-prettier@5.0.2:
-    resolution: {integrity: sha512-qJ+BN+1T2ZcKz9WIrv0x+eFGHzSUnXfXd5gL///T6XoJvr3D8/ztzz2fhtmXef7Vb8P33zBXmLTTveByr0nwBw==}
-    engines: {node: '>=18.12.0'}
+  stylelint-scss@7.2.0:
+    resolution: {integrity: sha512-6E79Bachv0Iz0gqRUZgdqdXCsiq26DWBWIBNHYtjTmAp3wJu6cp/I37VfW7BPntmh2puF3bY09XWl4HZGrLhzw==}
+    engines: {node: '>=20.19.0'}
     peerDependencies:
-      prettier: '>=3.0.0'
-      stylelint: '>=16.0.0'
+      stylelint: ^16.8.2 || ^17.0.0
 
-  stylelint-scss@6.10.0:
-    resolution: {integrity: sha512-y03if6Qw9xBMoVaf7tzp5BbnYhYvudIKzURkhSHzcHG0bW0fAYvQpTUVJOe7DyhHaxeThBil4ObEMvGbV7+M+w==}
-    engines: {node: '>=18.12.0'}
-    peerDependencies:
-      stylelint: ^16.0.2
-
-  stylelint@16.12.0:
-    resolution: {integrity: sha512-F8zZ3L/rBpuoBZRvI4JVT20ZanPLXfQLzMOZg1tzPflRVh9mKpOZ8qcSIhh1my3FjAjZWG4T2POwGnmn6a6hbg==}
-    engines: {node: '>=18.12.0'}
+  stylelint@17.14.1:
+    resolution: {integrity: sha512-xVQwyiuxALUBNB2fBe0tmNemg9KqLtdj3T64mioFDar79B2cU8LIyz+3KL6LdiHs9NkeNfwxpKSaIVOY8f112g==}
+    engines: {node: '>=20.19.0'}
     hasBin: true
 
-  stylis@4.3.4:
-    resolution: {integrity: sha512-osIBl6BGUmSfDkyH2mB7EFvCJntXDrLhKjHTRj/rK6xLH0yuPrHULDRQzKokSOD4VoorhtKpfcfW1GAntu8now==}
+  stylis@4.4.0:
+    resolution: {integrity: sha512-5Z9ZpRzfuH6l/UAvCPAPUo3665Nk2wLaZU3x+TLHKVzIz33+sbJqbtrYoC3KD4/uVOr2Zp+L0LySezP9OHV9yA==}
 
-  sucrase@3.35.0:
-    resolution: {integrity: sha512-8EbVDiu9iN/nESwxeSxDKe0dunta1GOlHufmSSXxMD2z2/tMZpDMpvXQGsc+ajGo8y2uYUmixaSRUc/QPoQ0GA==}
-    engines: {node: '>=16 || 14 >=14.17'}
-    hasBin: true
+  sumchecker@3.0.1:
+    resolution: {integrity: sha512-MvjXzkz/BOfyVDkG0oFOtBxHX2u3gKbMHIF/dXblZsgD3BWOFLmHovIpZY7BykJdAjcqRCBi1WYBNdEC9yI7vg==}
+    engines: {node: '>= 8.0'}
 
-  superjson@2.2.2:
-    resolution: {integrity: sha512-5JRxVqC8I8NuOUjzBbvVJAKNM8qoVuH0O77h4WInc/qC2q5IreqKxYwgkga3PfA22OayK2ikceb/B26dztPl+Q==}
-    engines: {node: '>=16'}
+  supports-color@10.2.2:
+    resolution: {integrity: sha512-SS+jx45GF1QjgEXQx4NJZV9ImqmO2NPz5FNsIHrsDjh2YsHnawpan7SNQ1o8NuhrbHZy9AZhIoCUiCeaW/C80g==}
+    engines: {node: '>=18'}
 
   supports-color@7.2.0:
     resolution: {integrity: sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==}
@@ -9079,84 +10918,100 @@ packages:
     resolution: {integrity: sha512-MpUEN2OodtUzxvKQl72cUF7RQ5EiHsGvSsVG0ia9c5RbWGL2CI4C7EpPS8UTBIplnlzZiNuV56w+FuNxy3ty2Q==}
     engines: {node: '>=10'}
 
-  supports-color@9.4.0:
-    resolution: {integrity: sha512-VL+lNrEoIXww1coLPOmiEmK/0sGigko5COxI09KzHc2VJXJsQ37UaQ+8quuxjDeA7+KnLGTWRyOXSLLR2Wb4jw==}
-    engines: {node: '>=12'}
-
-  supports-hyperlinks@3.1.0:
-    resolution: {integrity: sha512-2rn0BZ+/f7puLOHZm1HOJfwBggfaHXUpPUSSG/SWM4TWp5KCfmNYwnC3hruy2rZlMnmWZ+QAGpZfchu3f3695A==}
-    engines: {node: '>=14.18'}
+  supports-hyperlinks@4.5.0:
+    resolution: {integrity: sha512-ZW2OvfeCXrNTbLakPUzjQG922EeGCOteFSVoek5DKStTh898wf7zgtuFlzQN8HfZCxC3Eh02yJVrRW51hADf+w==}
+    engines: {node: '>=20'}
 
   supports-preserve-symlinks-flag@1.0.0:
     resolution: {integrity: sha512-ot0WnXS9fgdkgIcePe6RHNk1WA8+muPa6cSjeR3V8K27q9BB1rTE3R1p7Hv0z1ZyAc8s6Vvv8DIyWf681MAt0w==}
     engines: {node: '>= 0.4'}
 
-  sver@1.8.4:
-    resolution: {integrity: sha512-71o1zfzyawLfIWBOmw8brleKyvnbn73oVHNCsu51uPMz/HWiKkkXsI31JjHW5zqXEqnPYkIiHd8ZmL7FCimLEA==}
+  sver@2.0.1:
+    resolution: {integrity: sha512-zqIx4tK5+gR8xE8VgLNr+IA0mqKDgMNdsfX86DTfNNnVKyuVUhjGdz6KA0rO3q445WUfGpEeJym1m3Xym7ot6w==}
 
   svg-tags@1.0.0:
     resolution: {integrity: sha512-ovssysQTa+luh7A5Weu3Rta6FJlFBBbInjOh722LIt6klpU2/HtdUbszju/G4devcvk8PGt7FCLv5wftu3THUA==}
 
-  svgo@3.3.2:
-    resolution: {integrity: sha512-OoohrmuUlBs8B8o6MB2Aevn+pRIH9zDALSR+6hhqVfa6fRwG/Qw9VUMSMW9VNg2CFc/MTIfabtdOVl9ODIJjpw==}
-    engines: {node: '>=14.0.0'}
+  svgo@4.0.2:
+    resolution: {integrity: sha512-ekx94z1rRc5LDi6oSUaeRnYhd0UOJxdtQCL2rF8xpWxD3TPAsISWOrxezqGovqS38GRZOdpDfvQe3ts6F7nsng==}
+    engines: {node: '>=16'}
     hasBin: true
 
-  synckit@0.6.2:
-    resolution: {integrity: sha512-Vhf+bUa//YSTYKseDiiEuQmhGCoIF3CVBhunm3r/DQnYiGT4JssmnKQc44BIyOZRK2pKjXXAgbhfmbeoC9CJpA==}
-    engines: {node: '>=12.20'}
+  sync-child-process@1.0.2:
+    resolution: {integrity: sha512-8lD+t2KrrScJ/7KXCSyfhT3/hRq78rC0wBFqNJXv3mZyn6hW2ypM05JmlSvtqRbeq6jqA94oHbxAr2vYsJ8vDA==}
+    engines: {node: '>=16.0.0'}
 
-  synckit@0.9.2:
-    resolution: {integrity: sha512-vrozgXDQwYO72vHjUb/HnFbQx1exDjoKzqx23aXEg2a9VIg2TSFZ8FmeZpTjUCFMYw7mpX4BE2SFu8wI7asYsw==}
+  sync-message-port@1.2.0:
+    resolution: {integrity: sha512-gAQ9qrUN/UCypHtGFbbe7Rc/f9bzO88IwrG8TDo/aMKAApKyD6E3W4Cm0EfhfBb6Z6SKt59tTCTfD+n1xmAvMg==}
+    engines: {node: '>=16.0.0'}
+
+  synckit@0.11.13:
+    resolution: {integrity: sha512-eNRKgb3z66Yp3D2CixVujOUvXLFUTij/zVnV8KRyvFdQwpz7I5DS8UfRkTeLzb64u+dkzDSdelE24izu+zSSUg==}
     engines: {node: ^14.18.0 || >=16.0.0}
 
-  system-architecture@0.1.0:
-    resolution: {integrity: sha512-ulAk51I9UVUyJgxlv9M6lFot2WP3e7t8Kz9+IS6D4rVba1tR9kON+Ey69f+1R4Q8cd45Lod6a4IcJIxnzGc/zA==}
-    engines: {node: '>=18'}
-
-  tabbable@6.2.0:
-    resolution: {integrity: sha512-Cat63mxsVJlzYvN51JmVXIgNoUokrIaT2zLclCXjRd8boZ0004U4KCs/sToJ75C6sdlByWxpYnb5Boif1VSFew==}
-
   table@6.9.0:
     resolution: {integrity: sha512-9kY+CygyYM6j02t5YFHbNz2FN5QmYGv9zAjVp4lCDjlCw7amdckXlEt/bjMhUIfj4ThGRE4gCUH5+yGnNuPo5A==}
     engines: {node: '>=10.0.0'}
 
-  tailwind-merge@2.5.5:
-    resolution: {integrity: sha512-0LXunzzAZzo0tEPxV3I297ffKZPlKDrjj7NXphC8V5ak9yHC5zRmxnOe2m/Rd/7ivsOMJe3JZ2JVocoDdQTRBA==}
+  tagged-tag@1.0.0:
+    resolution: {integrity: sha512-yEFYrVhod+hdNyx7g5Bnkkb0G6si8HJurOoOEgC8B/O0uXLHlaey/65KRv6cuWBNhBgHKAROVpc7QyYqE5gFng==}
+    engines: {node: '>=20'}
 
-  tailwindcss-animate@1.0.7:
-    resolution: {integrity: sha512-bl6mpH3T7I3UFxuvDEXLxy/VuFxBk5bbzplh7tXI68mwMokNYd1t9qPBHlnyTwfa4JGC4zP516I1hYYtQ/vspA==}
+  tailwind-csstree@0.3.3:
+    resolution: {integrity: sha512-je9J5UYRsTJqAjYrIBMMlge8T/rreRd44pJxgG5Zx/zeo4kAC/liUKqzztRZrGlYRJLvIf2Cb1DVJMTXSzEShA==}
+    engines: {node: '>=18.18'}
     peerDependencies:
-      tailwindcss: '>=3.0.0 || insiders'
+      '@eslint/css': '>=1.0.0'
+    peerDependenciesMeta:
+      '@eslint/css':
+        optional: true
 
-  tailwindcss@3.4.17:
-    resolution: {integrity: sha512-w33E2aCvSDP0tW9RZuNXadXlkHXqFzSkQew/aIa2i/Sj8fThxwovwlXHSPXTbAHwEIhBFXAedUhP2tueAKP8Og==}
-    engines: {node: '>=14.0.0'}
-    hasBin: true
+  tailwind-merge@3.6.0:
+    resolution: {integrity: sha512-uxL7qAVQriqRQPAyK3pj66VqskWqoZ37PW94jwOTwNfq/z9oyu1V+eqrZqtR2+fCiXdYOZe/Modt8GtvqNzu+w==}
 
-  tapable@2.2.1:
-    resolution: {integrity: sha512-GNzQvQTOIP6RyTfE2Qxb8ZVlNmw0n88vp1szwWRimP02mnTsx3Wtn5qRdqY9w2XduFNUgvOwhNnQsjwCp+kqaQ==}
+  tailwindcss@4.3.3:
+    resolution: {integrity: sha512-gOhV3P7ufE62QDGg1zVaTgCR+EtPv92k2nIhVcVKcLmxT1sUBsQGhnZj175j+MqRt4zLF7ic+sCYjfhxMxj7YQ==}
+
+  tapable@2.3.3:
+    resolution: {integrity: sha512-uxc/zpqFg6x7C8vOE7lh6Lbda8eEL9zmVm/PLeTPBRhh1xCgdWaQ+J1CUieGpIfm2HdtsUpRv+HshiasBMcc6A==}
     engines: {node: '>=6'}
 
   tar-stream@2.2.0:
     resolution: {integrity: sha512-ujeqbceABgwMZxEJnk2HDY2DlnUZ+9oEcb1KzTVfYHio0UE6dG71n60d8D2I4qNvleWrrXpmjpt7vZeF1LnMZQ==}
     engines: {node: '>=6'}
 
-  tar-stream@3.1.7:
-    resolution: {integrity: sha512-qJj60CXt7IU1Ffyc3NJMjh6EkuCFej46zUqJ4J7pqYlThyd9bO0XBTmcOIhSzZJVWfsLks0+nle/j538YAW9RQ==}
+  tar-stream@3.2.0:
+    resolution: {integrity: sha512-ojzvCvVaNp6aOTFmG7jaRD0meowIAuPc3cMMhSgKiVWws1GyHbGd/xvnyuRKcKlMpt3qvxx6r0hreCNITP9hIg==}
 
-  tar@6.2.1:
-    resolution: {integrity: sha512-DZ4yORTwrbTj/7MZYq2w+/ZFdI6OZ/f9SFHR+71gIVUZhOQPHzVCLpvRnPgyaMpfWxxk/4ONva3GQSyNIKRv6A==}
-    engines: {node: '>=10'}
-
-  tar@7.4.3:
-    resolution: {integrity: sha512-5S7Va8hKfV7W5U6g3aYxXmlPoZVAwUMy9AOKyF2fVuZa2UD3qZjg578OrLRt8PcNN1PleVaL/5/yYATNL0ICUw==}
+  tar@7.5.22:
+    resolution: {integrity: sha512-MFO/QzvtAOmJbkhOaCTvbGcFN9L9b+JunIsDwaKljSOdcLMea3NJ1k9Usz/rjdfSXTq4dfzfeS7W4p4YOAAHeA==}
     engines: {node: '>=18'}
 
+  tdesign-icons-vue-next@0.4.9:
+    resolution: {integrity: sha512-eKt2hBNejz7sX2dseZKe0WU/tTAZBkqM8lOE6iqyifum0wI7/sKJ51roD2UeWBG9vtYhCOFXQNxADs7xr53HLw==}
+    peerDependencies:
+      vue: ^3.5.40
+
+  tdesign-vue-next@1.20.5:
+    resolution: {integrity: sha512-FVCmDBoXOKUDE77ZvRzpaSSs10PXbb4Tikma4wMCJHRqF9NilgkbLh4ympeOKt57wxOtOXsQfs7zU+AcCpsZXw==}
+    engines: {node: '>= 18'}
+    peerDependencies:
+      vue: ^3.5.40
+
+  teex@1.0.1:
+    resolution: {integrity: sha512-eYE6iEI62Ni1H8oIa7KlDU6uQBtqr4Eajni3wX7rpfXD8ysFx8z0+dri+KWEPWpBsxXfxu58x/0jvTVT1ekOSg==}
+
   temp-dir@2.0.0:
     resolution: {integrity: sha512-aoBAniQmmwtcKp/7BzsH8Cxzv8OL736p7v1ihGb5e9DJ9kTwGWHrQrVB5+lfVDzfGrdRzXch+ig7LHaY1JTOrg==}
     engines: {node: '>=8'}
 
+  temp-file@3.4.0:
+    resolution: {integrity: sha512-C5tjlC/HCtVUOi3KWVokd4vHVViOmGjtLwIh4MuzPo/nMYTV/p1urt3RnMz2IWXDdKEGJH3k5+KPxtqRsUYGtg==}
+
+  temp@0.9.4:
+    resolution: {integrity: sha512-yYrrsWnrXMcdsnu/7YMYAofM1ktpL5By7vZhf15CrXijWWrEYZks5AXBudalfSWJLlnen/QUJUB5aoB0kqZUGA==}
+    engines: {node: '>=6.0.0'}
+
   tempy@0.6.0:
     resolution: {integrity: sha512-G13vtMYPT/J8A4X2SjdtBTphZlrp1gKv6hZiOjw14RCWg6GbHuQBGtjlx75xLbYV/wEc0D7G5K4rxKP/cXk8Bw==}
     engines: {node: '>=10'}
@@ -9165,17 +11020,13 @@ packages:
     resolution: {integrity: sha512-wK0Ri4fOGjv/XPy8SBHZChl8CM7uMc5VML7SqiQ0zG7+J5Vr+RMQDoHa2CNT6KHUnTGIXH34UDMkPzAUyapBZg==}
     engines: {node: '>=8'}
 
-  terser@5.37.0:
-    resolution: {integrity: sha512-B8wRRkmre4ERucLM/uXx4MOV5cbnOlVAqUst+1+iLKPI0dOgFO28f84ptoQt9HEI537PMzfYa/d+GEPKTRXmYA==}
+  terser@5.49.2:
+    resolution: {integrity: sha512-rGbJiKeQ4WDe3EXlDAIaQcwftVfv2Q8o1awFNfvXolJYKkb1AuZY1RTOmqx4LJXZENbWZA7eIsYGHuEzHsi1nQ==}
     engines: {node: '>=10'}
     hasBin: true
 
-  text-decoder@1.2.3:
-    resolution: {integrity: sha512-3/o9z3X0X0fTupwsYvR03pJ/DjWuqqrfwBgTQzdWDiQSm9KitAyz/9WqsT2JQW7KV2m+bC2ol/zqpW37NHxLaA==}
-
-  text-extensions@2.4.0:
-    resolution: {integrity: sha512-te/NtwBwfiNRLf9Ijqx3T0nlqZiQ2XrrtBvu+cLL8ZRrGkO0NHTug8MYFKyoSrv/sHTaSKfilUkizV6XhxMJ3g==}
-    engines: {node: '>=8'}
+  text-decoder@1.2.7:
+    resolution: {integrity: sha512-vlLytXkeP4xvEq2otHeJfSQIRyWxo/oZGEbXrtEEF9Hnmrdly59sUbzZ/QgyWuLYHctCHxFF4tRQZNQ9k60ExQ==}
 
   text-segmentation@1.0.3:
     resolution: {integrity: sha512-iOiPUo/BGnZ6+54OsWxZidGCsdU8YbE4PSpdPinp7DeMtUJNJBoJ/ouUSTJjHkh1KntHaltHl/gDs2FC4i5+Nw==}
@@ -9183,45 +11034,47 @@ packages:
   theme-colors@0.1.0:
     resolution: {integrity: sha512-6gTEHQqWlQNiOEGHCSSQmU//E5SnXHJ4H7oHQOD8x77CvNYNQAmt73dqR71mzw5ULV87zaHLxK5pIBnsToFuZw==}
 
-  thenify-all@1.6.0:
-    resolution: {integrity: sha512-RNxQH/qI8/t3thXJDwcstUO4zeqo64+Uy/+sNVRBx4Xn2OX+OZ9oP+iJnNFqplFra2ZUVeKCSa2oVWi3T4uVmA==}
-    engines: {node: '>=0.8'}
-
-  thenify@3.3.1:
-    resolution: {integrity: sha512-RVZSIV5IG10Hk3enotrhvz0T9em6cyHBLkH/YAZuKqd8hRkKhSfCGIcP2KUY0EPxndzANBmNllzWPwak+bheSw==}
-
   throttle-debounce@5.0.2:
     resolution: {integrity: sha512-B71/4oyj61iNH0KeCamLuE2rmKuTO5byTOSVwECM5FA7TiAiAW+UqTKZ9ERueC4qvgSttUhdmq1mXC3kJqGX7A==}
     engines: {node: '>=12.22'}
 
-  through@2.3.8:
-    resolution: {integrity: sha512-w89qg7PI8wAdvX60bMDP+bFoD5Dvhm9oLheFp5O4a2QF0cSBGsBX4qZmadPMvVqlLJBBci+WqGGOAPvcDeNSVg==}
+  tiny-async-pool@1.3.0:
+    resolution: {integrity: sha512-01EAw5EDrcVrdgyCLgoSPvqznC0sVxDSVeiOz09FUpjh71G79VCqneOr+xvt7T1r76CF6ZZfPjHorN2+d+3mqA==}
+
+  tiny-typed-emitter@2.1.0:
+    resolution: {integrity: sha512-qVtvMxeXbVej0cQWKqVSSAHmKZEHAvxdF8HEUBFWts8h+xEo5m/lEiPakuyZ3BnCBjOD8i24kzNOiOLLgsSxhA==}
 
   tinybench@2.9.0:
     resolution: {integrity: sha512-0+DUvqWMValLmha6lr4kD8iAMK1HzV0/aKnCtWb9v9641TnP/MFb7Pc2bxoxQjTXAErryXVgUOfv2YqNllqGeg==}
 
-  tinyexec@0.3.1:
-    resolution: {integrity: sha512-WiCJLEECkO18gwqIp6+hJg0//p23HXp4S+gGtAKu3mI2F2/sXC4FvHvXvB0zJVVaTPhx1/tOwdbRsa1sOBIKqQ==}
+  tinyclip@0.1.15:
+    resolution: {integrity: sha512-uo33abH+Ays0xYaDysoBt494Hb3hsEczMpcC0MwFl773pazORx4fmvKhclhR1wonUbB6vvpRsvVMwnhfqeMc+A==}
+    engines: {node: ^16.14.0 || >= 17.3.0}
 
-  tinyglobby@0.2.10:
-    resolution: {integrity: sha512-Zc+8eJlFMvgatPZTl6A9L/yht8QqdmUNtURHaKZLmKBE12hNPSrqNkUp2cs3M/UKmNVVAMFQYSjYIVHDjW5zew==}
+  tinycolor2@1.6.0:
+    resolution: {integrity: sha512-XPaBkWQJdsf3pLKJV9p4qN/S+fm2Oj8AIPo1BTUhg5oxkvm9+SVEGFdhyOz7tTdUTfvxMiAs4sp6/eZO2Ew+pw==}
+
+  tinyexec@1.3.0:
+    resolution: {integrity: sha512-QKAl9m8gWWGHV8jZcPeym6j+XULi6tOf1mT83WYJ4Lk2ytW/uwAWkrP0uFsdoYMdueVJ0qs26wZ+23xeB4ibNQ==}
+    engines: {node: '>=18'}
+
+  tinyglobby@0.2.17:
+    resolution: {integrity: sha512-wXR/dYpcqKmfWpEdZjiKJOwCNFndD0DMnrW/cYjVGttEkBfVgcLFHoNrlj47mjOVic9yyNu65alsgF4NQyTa2g==}
     engines: {node: '>=12.0.0'}
 
-  tinypool@1.0.2:
-    resolution: {integrity: sha512-al6n+QEANGFOMf/dmUMsuS5/r9B06uwlyNjZZql/zv8J7ybHCgoihBNORZCY2mzUuAnomQa2JdhyHKzZxPCrFA==}
-    engines: {node: ^18.0.0 || >=20.0.0}
+  tinypool@2.1.0:
+    resolution: {integrity: sha512-Pugqs6M0m7Lv1I7FtxN4aoyToKg1C4tu+/381vH35y8oENM/Ai7f7C4StcoK4/+BSw9ebcS8jRiVrORFKCALLw==}
+    engines: {node: ^20.0.0 || >=22.0.0}
 
-  tinyrainbow@1.2.0:
-    resolution: {integrity: sha512-weEDEq7Z5eTHPDh4xjX789+fHfF+P8boiFB+0vbWzpbnbsEr/GRaohi/uMKxg8RZMXnl1ItAi/IUHWMsjDV7kQ==}
+  tinyrainbow@3.1.1:
+    resolution: {integrity: sha512-yau8yJdTt989Mm0Bd/236QnzEiPf2xLLTqUZRUJOo/3CB078LSwzei343DgtJVmfJKJE3TMINY1u42SQsP6mXw==}
     engines: {node: '>=14.0.0'}
 
-  tinyspy@3.0.2:
-    resolution: {integrity: sha512-n1cw8k1k0x4pgA2+9XrOkFydTerNcJ1zWCO5Nn9scWHTD+5tp8dghT2x1uduQePZTZgd3Tupf+x9BxJjeJi77Q==}
-    engines: {node: '>=14.0.0'}
+  tippy.js@6.3.7:
+    resolution: {integrity: sha512-E1d3oP2emgJ9dRQZdf3Kkn0qJgI6ZLpyS5z6ZkY1DF3kaQaBsGZsndEpHwx+eC+tYM41HaSNvNtLx8tU57FzTQ==}
 
-  tmp@0.0.33:
-    resolution: {integrity: sha512-jRCJlojKnZ3addtTOjdIqoRuPEKBvNXcGYqzO6zWZX8KfKEpnGY5jfggJQ3EjKuu8D4bJRr0y+cYJFmYbImXGw==}
-    engines: {node: '>=0.6.0'}
+  tmp-promise@3.0.3:
+    resolution: {integrity: sha512-RwM7MoPojPxsOBYnyd2hy0bxtIlVrihNs9pj5SUvY8Zz1sQcQG2tG1hSr8PDxfgEB8RNKDhqbIlroIarSNDNsQ==}
 
   tmp@0.2.7:
     resolution: {integrity: sha512-e0votIpp4Uo2AJYSzVHV6xCcawuiez3DzqDAbrTc3YxBkplN6e+dM13ZeIcZnDg/QpSuU2zfZ3rzwY8ukEnaXw==}
@@ -9242,85 +11095,100 @@ packages:
   tr46@0.0.3:
     resolution: {integrity: sha512-N3WMsuqV66lT30CrXNbEjx4GEwlow3v6rr4mCcv6prnfwhS01rkgyFdjPNBYd9br7LpXV1+Emh01fHnq2Gdgrw==}
 
-  tr46@1.0.1:
-    resolution: {integrity: sha512-dTpowEjclQ7Kgx5SdBkqRzVhERQXov8/l9Ft9dVM9fmg0W0KQSVaXX9T4i6twCPNtYiZM53lpSSUAwJbFPOHxA==}
-
   traverse@0.3.9:
     resolution: {integrity: sha512-iawgk0hLP3SxGKDfnDJf8wTz4p2qImnyihM5Hh/sGvQ3K37dPi/w8sRhdNIxYA1TwFwc5mDhIJq+O0RsvXBKdQ==}
 
-  ts-api-utils@1.4.3:
-    resolution: {integrity: sha512-i3eMG77UTMD0hZhgRS562pv83RC6ukSAC2GMNWc+9dieh/+jDM5u5YG+NHX6VNDRHQcHwmsTHctP9LhbC3WxVw==}
-    engines: {node: '>=16'}
-    peerDependencies:
-      typescript: '>=4.2.0'
+  tree-kill@1.2.2:
+    resolution: {integrity: sha512-L0Orpi8qGpRG//Nd+H90vFB+3iHnue1zSSGmNOOCh1GLJ7rUKVwV2HvijphGQS2UmhUZewS9VgvxYIdgr+fG1A==}
+    hasBin: true
 
-  ts-interface-checker@0.1.13:
-    resolution: {integrity: sha512-Y/arvbn+rrz3JCKl9C4kVNfTfSm2/mEp5FSz5EsZSANGPSlQrpRI5M4PKF+mJnE52jOO90PnPSc3Ur3bTQw0gA==}
+  truncate-utf8-bytes@1.0.2:
+    resolution: {integrity: sha512-95Pu1QXQvruGEhv62XCMO3Mm90GscOCClvrIUwCM0PYOXK3kaF3l3sIHxx71ThJfcbM2O5Au6SO3AWCSEfW4mQ==}
+
+  ts-api-utils@2.5.0:
+    resolution: {integrity: sha512-OJ/ibxhPlqrMM0UiNHJ/0CKQkoKF243/AEmplt3qpRgkW8VG7IfOS41h7V8TjITqdByHzrjcS/2si+y4lIh8NA==}
+    engines: {node: '>=18.12'}
+    peerDependencies:
+      typescript: '>=4.8.4'
+
+  tsconfig-paths-webpack-plugin@4.2.0:
+    resolution: {integrity: sha512-zbem3rfRS8BgeNK50Zz5SIQgXzLafiHjOwUAvk/38/o1jHn/V5QAgVUcz884or7WYcPaH3N2CIfUc2u0ul7UcA==}
+    engines: {node: '>=10.13.0'}
+
+  tsconfig-paths@4.2.0:
+    resolution: {integrity: sha512-NoZ4roiN7LnbKn9QqE1amc9DJfzvZXxF4xDavcOWt1BPkdx+m+0gJuPM+S0vCe7zTJMYUP0R8pO2XMr+Y8oLIg==}
+    engines: {node: '>=6'}
+
+  tsdown@0.22.14:
+    resolution: {integrity: sha512-ule7Y+fsAN2iZbLDoo7C4KYljFJNJJ+fLshyn+9gozeTspVersWHxwdGB+Dm2hzA38s6muFnUTl0jK3vJm9ifQ==}
+    engines: {node: ^22.18.0 || >=24.11.0}
+    hasBin: true
+    peerDependencies:
+      '@arethetypeswrong/core': ^0.18.1
+      '@tsdown/css': 0.22.14
+      '@tsdown/exe': 0.22.14
+      '@vitejs/devtools': '*'
+      publint: ^0.3.8
+      tsx: '*'
+      typescript: ^5.0.0 || ^6.0.0 || ^7.0.0
+      unplugin-unused: ^0.5.0
+      unrun: '*'
+    peerDependenciesMeta:
+      '@arethetypeswrong/core':
+        optional: true
+      '@tsdown/css':
+        optional: true
+      '@tsdown/exe':
+        optional: true
+      '@vitejs/devtools':
+        optional: true
+      publint:
+        optional: true
+      tsx:
+        optional: true
+      typescript:
+        optional: true
+      unplugin-unused:
+        optional: true
+      unrun:
+        optional: true
 
   tslib@2.3.0:
     resolution: {integrity: sha512-N82ooyxVNm6h1riLCoyS9e3fuJ3AMG2zIZs2Gd1ATcSFjSA23Q0fzjjZeh0jbJvWVDZ0cJT8yaNNaaXHzueNjg==}
 
+  tslib@2.4.0:
+    resolution: {integrity: sha512-d6xOpEDfsi2CZVlPQzGeux8XMwLT9hssAsaPYExaQMuYskwb+x1x7J371tWlbBdWHroy99KnVB6qIkUbs5X3UQ==}
+
   tslib@2.8.1:
     resolution: {integrity: sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==}
 
-  turbo-darwin-64@2.3.3:
-    resolution: {integrity: sha512-bxX82xe6du/3rPmm4aCC5RdEilIN99VUld4HkFQuw+mvFg6darNBuQxyWSHZTtc25XgYjQrjsV05888w1grpaA==}
-    cpu: [x64]
-    os: [darwin]
-
-  turbo-darwin-arm64@2.3.3:
-    resolution: {integrity: sha512-DYbQwa3NsAuWkCUYVzfOUBbSUBVQzH5HWUFy2Kgi3fGjIWVZOFk86ss+xsWu//rlEAfYwEmopigsPYSmW4X15A==}
-    cpu: [arm64]
-    os: [darwin]
-
-  turbo-linux-64@2.3.3:
-    resolution: {integrity: sha512-eHj9OIB0dFaP6BxB88jSuaCLsOQSYWBgmhy2ErCu6D2GG6xW3b6e2UWHl/1Ho9FsTg4uVgo4DB9wGsKa5erjUA==}
-    cpu: [x64]
-    os: [linux]
-
-  turbo-linux-arm64@2.3.3:
-    resolution: {integrity: sha512-NmDE/NjZoDj1UWBhMtOPmqFLEBKhzGS61KObfrDEbXvU3lekwHeoPvAMfcovzswzch+kN2DrtbNIlz+/rp8OCg==}
-    cpu: [arm64]
-    os: [linux]
-
-  turbo-windows-64@2.3.3:
-    resolution: {integrity: sha512-O2+BS4QqjK3dOERscXqv7N2GXNcqHr9hXumkMxDj/oGx9oCatIwnnwx34UmzodloSnJpgSqjl8iRWiY65SmYoQ==}
-    cpu: [x64]
-    os: [win32]
-
-  turbo-windows-arm64@2.3.3:
-    resolution: {integrity: sha512-dW4ZK1r6XLPNYLIKjC4o87HxYidtRRcBeo/hZ9Wng2XM/MqqYkAyzJXJGgRMsc0MMEN9z4+ZIfnSNBrA0b08ag==}
-    cpu: [arm64]
-    os: [win32]
-
-  turbo@2.3.3:
-    resolution: {integrity: sha512-DUHWQAcC8BTiUZDRzAYGvpSpGLiaOQPfYXlCieQbwUvmml/LRGIe3raKdrOPOoiX0DYlzxs2nH6BoWJoZrj8hA==}
+  turbo@2.10.9:
+    resolution: {integrity: sha512-Yl9+ukxH+UmPtKidpDkjn82tvPoEvFNb9UACd9vUomN1Ft0cwl3rx0P8yC1D93W9EOsWRMjllvIDG8y25sFOog==}
     hasBin: true
 
+  tw-animate-css@1.4.0:
+    resolution: {integrity: sha512-7bziOlRqH0hJx80h/3mbicLW7o8qLsH5+RaLR2t+OHM3D0JlWGODQKQ4cxbK7WlvmUxpcj6Kgu6EKqjrGFe3QQ==}
+
   type-check@0.4.0:
     resolution: {integrity: sha512-XleUoc9uwGXqjWwXaUTZAmzMcFZ5858QA2vvx1Ur5xIcixXIP+8LnFDgRplU30us6teqdlskFfu+ae4K79Ooew==}
     engines: {node: '>= 0.8.0'}
 
+  type-fest@0.13.1:
+    resolution: {integrity: sha512-34R7HTnG0XIJcBSn5XhDd7nNFPRcXYRZrBB2O2jdKqYODldSzBAqzsWoZYYvduky73toYS/ESqxPvkDf/F0XMg==}
+    engines: {node: '>=10'}
+
   type-fest@0.16.0:
     resolution: {integrity: sha512-eaBzG6MxNzEn9kiwvtre90cXaNLkmadMWa1zQMs3XORCXNbsH/OewwbxC5ia9dCxIxnTAsSxXJaa/p5y8DlvJg==}
     engines: {node: '>=10'}
 
-  type-fest@0.20.2:
-    resolution: {integrity: sha512-Ne+eE4r0/iWnpAxD852z3A+N0Bt5RN//NjJwRd2VFHEmrywxf5vsZlh4R6lixl6B+wz/8d+maTSAkN1FIkI3LQ==}
-    engines: {node: '>=10'}
-
-  type-fest@0.6.0:
-    resolution: {integrity: sha512-q+MB8nYR1KDLrgr4G5yemftpMC7/QLqVndBmEEdqzmNj5dcFOO4Oo8qlwZE3ULT3+Zim1F8Kq4cBnikNhlCMlg==}
-    engines: {node: '>=8'}
-
-  type-fest@0.8.1:
-    resolution: {integrity: sha512-4dbzIzqvjtgiM5rw1k5rEHtBANKmdudhGyBEajN01fEyhaAIhsoKNy6y7+IN93IfpFtwY9iqi7kD+xwKhQsNJA==}
-    engines: {node: '>=8'}
-
-  type-fest@4.30.2:
-    resolution: {integrity: sha512-UJShLPYi1aWqCdq9HycOL/gwsuqda1OISdBO3t8RlXQC4QvtuIz4b5FCfe2dQIWEpmlRExKmcTBfP1r9bhY7ig==}
+  type-fest@4.41.0:
+    resolution: {integrity: sha512-TeTSQ6H5YHvpqVwBRcnLDCBnDOHWYu7IvGbHT6N8AOymcr9PJGjc1GTtiWZTYg0NCgYwvnYWEkVChQAr9bjfwA==}
     engines: {node: '>=16'}
 
+  type-fest@5.8.0:
+    resolution: {integrity: sha512-YGYEVz3Fm5iy/AybuA0oyNFq7H4CgQNfRp/qfe8nurE1kuCeNm3/vfm9X4Mtl+qLyaKJUh5xrFZwogr41SMjYA==}
+    engines: {node: '>=20'}
+
   type@2.7.3:
     resolution: {integrity: sha512-8j+1QmAbPvLZow5Qpi6NCaN8FB60p/6x8/vfNqOk/hC+HuvFZhL4+WfekuhQLiqFZXOgQdrs3B+XxEmCc6b3FQ==}
 
@@ -9336,59 +11204,69 @@ packages:
     resolution: {integrity: sha512-bTlAFB/FBYMcuX81gbL4OcpH5PmlFHqlCCpAl8AlEzMz5k53oNDvN8p1PNOWLEmI2x4orp3raOFB51tv9X+MFQ==}
     engines: {node: '>= 0.4'}
 
-  typed-array-length@1.0.7:
-    resolution: {integrity: sha512-3KS2b+kL7fsuk/eJZ7EQdnEmQoaho/r6KUef7hxvltNA5DR8NAUM+8wJMbJyZ4G9/7i3v5zPBIMN5aybAh2/Jg==}
+  typed-array-length@1.0.8:
+    resolution: {integrity: sha512-phPGCwqr2+Qo0fwniCE8e4pKnGu/yFb5nD5Y8bf0EEeiI5GklnACYA9GFy/DrAeRrKHXvHn+1SUsOWgJp6RO+g==}
     engines: {node: '>= 0.4'}
 
-  typescript@5.4.2:
-    resolution: {integrity: sha512-+2/g0Fds1ERlP6JsakQQDXjZdZMM+rqpamFZJEKh4kwTIn3iDkgKtby0CeNd5ATNZ4Ry1ax15TMx0W2V+miizQ==}
-    engines: {node: '>=14.17'}
-    hasBin: true
-
-  typescript@5.6.3:
-    resolution: {integrity: sha512-hjcS1mhfuyi4WW8IWtjP7brDrG2cuDZukyrYrSauoXGNgx0S7zceP07adYkJycEr56BOUTNPzbInooiN3fn1qw==}
-    engines: {node: '>=14.17'}
-    hasBin: true
-
-  typescript@5.7.2:
-    resolution: {integrity: sha512-i5t66RHxDvVN40HfDd1PsEThGNnlMCMT3jMUuoh9/0TaqWevNontacunWyN02LA9/fIbEWlcHZcgTKb9QoaLfg==}
+  typescript@6.0.3:
+    resolution: {integrity: sha512-y2TvuxSZPDyQakkFRPZHKFm+KKVqIisdg9/CZwm9ftvKXLP8NRWj38/ODjNbr43SsoXqNuAisEf1GdCxqWcdBw==}
     engines: {node: '>=14.17'}
     hasBin: true
 
   uc.micro@2.1.0:
     resolution: {integrity: sha512-ARDJmphmdvUk6Glw7y9DQ2bFkKBHwQHLi2lsaH6PPmz/Ka9sFOBsBluozhDltWmnv9u/cF6Rt87znRTPV+yp/A==}
 
-  ufo@1.5.4:
-    resolution: {integrity: sha512-UsUk3byDzKd04EyoZ7U4DOlxQaD14JUKQl6/P7wiX4FNvUfm3XL246n9W5AmqwW5RSFJ27NAuM0iLscAOYUiGQ==}
+  ufo@1.6.4:
+    resolution: {integrity: sha512-JFNbkD1Svwe0KvGi8GOeLcP4kAWQ609twvCdcHxq1oSL8svv39ZuSvajcD8B+5D0eL4+s1Is2D/O6KN3qcTeRA==}
+
+  ultrahtml@1.7.0:
+    resolution: {integrity: sha512-2xRd0VHoAQE4M+vF/DvFFB7pUV0ZxTW1TLi7lHQWnF/Sb5TPeEUV/l+hxcNnGO00ZXGnR0voCMmYRKQf+rvJ2g==}
+
+  unbash@4.0.10:
+    resolution: {integrity: sha512-b7zoBQvpWp0vuN5q2vK2RRBR2SvuruQAs50DApdDveBSn3eSYd84IaHodFqQIMlvY9K2VnyBUEXgwOBuGU9GBg==}
+    engines: {node: '>=14'}
 
   unbox-primitive@1.1.0:
     resolution: {integrity: sha512-nWJ91DjeOkej/TA8pXQ3myruKpKEYgqvpw9lz4OPHj/NWFNluYrjbz9j01CJ8yKQd2g4jFoOkINCTW2I5LEEyw==}
     engines: {node: '>= 0.4'}
 
-  unbuild@3.0.1:
-    resolution: {integrity: sha512-03Fv1B8hmJzYCdL4TDgmgBg1WMU0CB5P2tBqPCW7XAvZG/l275m6JU/xf2tJ4yuUeHtmSzg1G387Te9nlsufFA==}
+  unbuild@3.6.1:
+    resolution: {integrity: sha512-+U5CdtrdjfWkZhuO4N9l5UhyiccoeMEXIc2Lbs30Haxb+tRwB3VwB8AoZRxlAzORXunenSo+j6lh45jx+xkKgg==}
     hasBin: true
     peerDependencies:
-      typescript: ^5.7.2
+      typescript: ^5.9.2
     peerDependenciesMeta:
       typescript:
         optional: true
 
+  unconfig-core@7.5.0:
+    resolution: {integrity: sha512-Su3FauozOGP44ZmKdHy2oE6LPjk51M/TRRjHv2HNCWiDvfvCoxC2lno6jevMA91MYAdCdwP05QnWdWpSbncX/w==}
+
   uncrypto@0.1.3:
     resolution: {integrity: sha512-Ql87qFHB3s/De2ClA9e0gsnS6zXG27SkTiSJwjCc9MebbfapQfuPzumMIUMi38ezPZVNFcHI9sUIepeQfw8J8Q==}
 
-  unctx@2.4.1:
-    resolution: {integrity: sha512-AbaYw0Nm4mK4qjhns67C+kgxR2YWiwlDBPzxrN8h8C6VtAdCgditAY5Dezu3IJy4XVqAnbrXt9oQJvsn3fyozg==}
+  unctx@2.5.0:
+    resolution: {integrity: sha512-p+Rz9x0R7X+CYDkT+Xg8/GhpcShTlU8n+cf9OtOEf7zEQsNcCZO1dPKNRDqvUTaq+P32PMMkxWHwfrxkqfqAYg==}
 
-  undici-types@6.20.0:
-    resolution: {integrity: sha512-Ny6QZ2Nju20vw1SRHe3d9jVu6gJ+4e3+MMpqu7pqE5HT6WsTSlce++GQmK5UXS8mzV8DSYHrQH+Xrf2jVcuKNg==}
+  undici-types@7.18.2:
+    resolution: {integrity: sha512-AsuCzffGHJybSaRrmr5eHr81mwJU3kjw6M+uprWvCXiNeN9SOGwQ3Jn8jb8m3Z6izVgknn1R0FTCEAP2QrLY/w==}
 
-  undici@6.21.0:
-    resolution: {integrity: sha512-BUgJXc752Kou3oOIuU1i+yZZypyZRqNPW0vqoMPl8VaoalSfeR0D8/t4iAS3yirs79SSMTxTag+ZC86uswv+Cw==}
+  undici-types@7.24.6:
+    resolution: {integrity: sha512-WRNW+sJgj5OBN4/0JpHFqtqzhpbnV0GuB+OozA9gCL7a993SmU+1JBZCzLNxYsbMfIeDL+lTsphD5jN5N+n0zg==}
+
+  undici-types@8.3.0:
+    resolution: {integrity: sha512-j375ScV60dom+YkPFIfTLcOiPxkN/buHz5GobjLhixFuANaNs3C9l4GmrWqejgXWJ7BbJcFYpTEUkS1Ge8bpZQ==}
+
+  undici@6.28.0:
+    resolution: {integrity: sha512-LIY910g9TI13YS95lrMFrs8Rm/u/irgHeTWoKCoteeJ04CUJ92eEfj0rVn+7VKMPBpUPiUoBKfhNyLI23EE/KA==}
     engines: {node: '>=18.17'}
 
-  unenv@1.10.0:
-    resolution: {integrity: sha512-wY5bskBQFL9n3Eca5XnhH6KbUo/tfvkwm9OpcdCvLaeA7piBNbavbOKJySEwQ1V0RH6HvNlSAFRTpvTqgKRQXQ==}
+  undici@7.29.0:
+    resolution: {integrity: sha512-IDxfleLmmbSskfWSUATiN1nfn2rDuvnMOqb5CWR92iIfojA0Ud+ulOAAEQ57LPr9rWmsreUyf5lwyao+7GNNVw==}
+    engines: {node: '>=20.18.1'}
+
+  unenv@2.0.0-rc.24:
+    resolution: {integrity: sha512-i7qRCmY42zmCwnYlh9H2SvLEypEFGye5iRmEMKjcGi7zk9UquigRjFtTLz0TYqr0ZGLZhaMHl/foy1bZR+Cwlw==}
 
   unicode-canonical-property-names-ecmascript@2.0.1:
     resolution: {integrity: sha512-dA8WbNeb2a6oQzAQ55YlT5vQAWGV9WXOsi3SskE3bcCdM0P4SDd+24zS/OCacdRq5BkdsRj9q3Pg6YyQoxIGqg==}
@@ -9398,30 +11276,33 @@ packages:
     resolution: {integrity: sha512-5kaZCrbp5mmbz5ulBkDkbY0SsPOjKqVS35VpL9ulMPfSl0J0Xsm+9Evphv9CoIZFwre7aJoa94AY6seMKGVN5Q==}
     engines: {node: '>=4'}
 
-  unicode-match-property-value-ecmascript@2.2.0:
-    resolution: {integrity: sha512-4IehN3V/+kkr5YeSSDDQG8QLqO26XpL2XP3GQtqwlT/QYSECAwFztxVHjlbh0+gjJ3XmNLS0zDsbgs9jWKExLg==}
+  unicode-match-property-value-ecmascript@2.2.1:
+    resolution: {integrity: sha512-JQ84qTuMg4nVkx8ga4A16a1epI9H6uTXAknqxkGF/aFfRLw1xC/Bp24HNLaZhHSkWd3+84t8iXnp1J0kYcZHhg==}
     engines: {node: '>=4'}
 
-  unicode-property-aliases-ecmascript@2.1.0:
-    resolution: {integrity: sha512-6t3foTQI9qne+OZoVQB/8x8rk2k1eVy1gRXhV3oFQ5T6R1dqQ1xtin3XqSlx3+ATBkliTaR/hHyJBm+LVPNM8w==}
+  unicode-property-aliases-ecmascript@2.2.0:
+    resolution: {integrity: sha512-hpbDzxUY9BFwX+UeBnxv3Sh1q7HFxj48DTmXchNgRa46lO8uj3/1iEn3MiNUYTg1g9ctIqXCCERn8gYZhHC5lQ==}
     engines: {node: '>=4'}
 
-  unicorn-magic@0.1.0:
-    resolution: {integrity: sha512-lRfVq8fE8gz6QMBuDM6a+LO3IAzTi05H6gCVaUpir2E1Rwpo4ZUog45KpNXKC/Mn3Yb9UDuHumeFTo9iV/D9FQ==}
-    engines: {node: '>=18'}
-
   unicorn-magic@0.3.0:
     resolution: {integrity: sha512-+QBBXBCvifc56fsbuxZQ6Sic3wqqc3WWaqxs58gvJrcOuN83HGTCwz3oS5phzU9LthRNE9VrJCFCLUgHeeFnfA==}
     engines: {node: '>=18'}
 
-  unimport@3.14.5:
-    resolution: {integrity: sha512-tn890SwFFZxqaJSKQPPd+yygfKSATbM8BZWW1aCR2TJBTs1SDrmLamBueaFtYsGjHtQaRgqEbQflOjN2iW12gA==}
+  unicorn-magic@0.4.0:
+    resolution: {integrity: sha512-wH590V9VNgYH9g3lH9wWjTrUoKsjLF6sGLjhR4sH1LWpLmCOH0Zf7PukhDA8BiS7KHe4oPNkcTHqYkj7SOGUOw==}
+    engines: {node: '>=20'}
 
-  unique-filename@1.1.1:
-    resolution: {integrity: sha512-Vmp0jIp2ln35UTXuryvjzkjGdRyf9b2lTXuSYUiPmzRcl3FDtYqAwOnTJkAngD9SWhnoJzDbTKwaOrZ+STtxNQ==}
-
-  unique-slug@2.0.2:
-    resolution: {integrity: sha512-zoWr9ObaxALD3DOPfjPSqxt4fnZiWblxHIgeWqW8x7UqDzEtHEQLzji2cuJYQFCU6KmoJikOYAZlrTHHebjx2w==}
+  unimport@6.4.0:
+    resolution: {integrity: sha512-JJOOuNMFq8b4ZPBKwQUxEcba4MplskDzYI1Lvrf8rJfWphZTWvPNXWa493qsPngHUmub89w6C7j+SeLWTE/UIQ==}
+    engines: {node: '>=18.12.0'}
+    peerDependencies:
+      oxc-parser: '*'
+      rolldown: ^1.0.0
+    peerDependenciesMeta:
+      oxc-parser:
+        optional: true
+      rolldown:
+        optional: true
 
   unique-string@2.0.0:
     resolution: {integrity: sha512-uNaeirEPvpZWSgzwsPGtU2zVSTrn/8L5q/IexZmH0eH6SA73CmAA5U4GwORTxQAZs95TAXLNqeLoPPNO5gZfWg==}
@@ -9435,35 +11316,105 @@ packages:
     resolution: {integrity: sha512-gptHNQghINnc/vTGIk0SOFGFNXw7JVrlRUtConJRlvaw6DuX0wO5Jeko9sWrMBhh+PsYAZ7oXAiOnf/UKogyiw==}
     engines: {node: '>= 10.0.0'}
 
-  unplugin@1.16.0:
-    resolution: {integrity: sha512-5liCNPuJW8dqh3+DM6uNM2EI3MLLpCKp/KY+9pB5M2S2SR2qvvDHhKgBOaTWEbZTAws3CXfB0rKTIolWKL05VQ==}
-    engines: {node: '>=14.0.0'}
+  unplugin-dts@1.0.3:
+    resolution: {integrity: sha512-/GR887wfG4r1cWyt1UZsLRuMIjsmEbGkS9yJrz+0dsToHAYUD5CTyP3JMGVLv25j9K0mJcwAVvZno/aTuSUvNg==}
+    peerDependencies:
+      '@microsoft/api-extractor': '>=7'
+      '@rspack/core': ^1
+      '@vue/language-core': ^3.1.5
+      esbuild: '*'
+      rolldown: '*'
+      rollup: '>=3'
+      typescript: '>=4'
+      vite: '>=3'
+      webpack: ^4 || ^5
+    peerDependenciesMeta:
+      '@microsoft/api-extractor':
+        optional: true
+      '@rspack/core':
+        optional: true
+      '@vue/language-core':
+        optional: true
+      esbuild:
+        optional: true
+      rolldown:
+        optional: true
+      rollup:
+        optional: true
+      vite:
+        optional: true
+      webpack:
+        optional: true
 
-  unplugin@2.1.0:
-    resolution: {integrity: sha512-us4j03/499KhbGP8BU7Hrzrgseo+KdfJYWcbcajCOqsAyb8Gk0Yn2kiUIcZISYCb1JFaZfIuG3b42HmguVOKCQ==}
+  unplugin-utils@0.3.2:
+    resolution: {integrity: sha512-xVToRh2CTmLk2HnEG7ac4rl1MJTT3RFkpS8B++/SnB0kXvuaavD+n3m/vrzyWQOdJNSZQACnbz01pnppbwV5BA==}
+    engines: {node: '>=20.19.0'}
+
+  unplugin-vue@7.2.0:
+    resolution: {integrity: sha512-6JHWcRbLO3bySOsipQSW9n2VRoPqsx9GLSWBfp7QLPCvpUr/edeAXR7pSl44EEJ+FIp9bG8Zm+xm5dnM/yir4Q==}
+    engines: {node: '>=20.19.0'}
+    peerDependencies:
+      vue: ^3.5.40
+
+  unplugin@2.3.11:
+    resolution: {integrity: sha512-5uKD0nqiYVzlmCRs01Fhs2BdkEgBS3SAVP6ndrBsuK42iC2+JHyxM05Rm9G8+5mkmRtzMZGY8Ct5+mliZxU/Ww==}
     engines: {node: '>=18.12.0'}
 
-  unstorage@1.14.1:
-    resolution: {integrity: sha512-0MBKpoVhNLL/Ixvue9lIsrHkwwWW9/f3TRftsYu1R7nZJJyHSdgPMBDjny2op07nirnS3OX6H3u+YDFGld+1Bg==}
+  unplugin@3.3.0:
+    resolution: {integrity: sha512-qa66K+crbfyE6JK10GjvbJeRrOsuC/JpbnHctfyp/i4oBTxWOzJfRZyDiOk1PtErMFRu8JhsU/wPvOdBNWe5Rg==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    peerDependencies:
+      '@farmfe/core': '*'
+      '@rspack/core': '*'
+      bun-types-no-globals: '*'
+      esbuild: '*'
+      rolldown: '*'
+      rollup: '*'
+      unloader: '*'
+      vite: '*'
+      webpack: '*'
+    peerDependenciesMeta:
+      '@farmfe/core':
+        optional: true
+      '@rspack/core':
+        optional: true
+      bun-types-no-globals:
+        optional: true
+      esbuild:
+        optional: true
+      rolldown:
+        optional: true
+      rollup:
+        optional: true
+      unloader:
+        optional: true
+      vite:
+        optional: true
+      webpack:
+        optional: true
+
+  unstorage@1.17.5:
+    resolution: {integrity: sha512-0i3iqvRfx29hkNntHyQvJTpf5W9dQ9ZadSoRU8+xVlhVtT7jAX57fazYO9EHvcRCfBCyi5YRya7XCDOsbTgkPg==}
     peerDependencies:
       '@azure/app-configuration': ^1.8.0
       '@azure/cosmos': ^4.2.0
       '@azure/data-tables': ^13.3.0
-      '@azure/identity': ^4.5.0
+      '@azure/identity': ^4.6.0
       '@azure/keyvault-secrets': ^4.9.0
       '@azure/storage-blob': ^12.26.0
-      '@capacitor/preferences': ^6.0.3
-      '@deno/kv': '>=0.8.4'
-      '@netlify/blobs': ^6.5.0 || ^7.0.0 || ^8.1.0
+      '@capacitor/preferences': ^6 || ^7 || ^8
+      '@deno/kv': '>=0.9.0'
+      '@netlify/blobs': ^6.5.0 || ^7.0.0 || ^8.1.0 || ^9.0.0 || ^10.0.0
       '@planetscale/database': ^1.19.0
       '@upstash/redis': ^1.34.3
-      '@vercel/blob': '>=0.27.0'
-      '@vercel/kv': ^1.0.1
+      '@vercel/blob': '>=0.27.1'
+      '@vercel/functions': ^2.2.12 || ^3.0.0
+      '@vercel/kv': ^1 || ^2 || ^3
       aws4fetch: ^1.0.20
       db0: '>=0.2.1'
       idb-keyval: ^6.2.1
-      ioredis: ^5.4.1
-      uploadthing: ^7.4.1
+      ioredis: ^5.4.2
+      uploadthing: ^7.4.4
     peerDependenciesMeta:
       '@azure/app-configuration':
         optional: true
@@ -9489,6 +11440,8 @@ packages:
         optional: true
       '@vercel/blob':
         optional: true
+      '@vercel/functions':
+        optional: true
       '@vercel/kv':
         optional: true
       aws4fetch:
@@ -9502,26 +11455,29 @@ packages:
       uploadthing:
         optional: true
 
-  untun@0.1.3:
-    resolution: {integrity: sha512-4luGP9LMYszMRZwsvyUd9MrxgEGZdZuZgpVQHEEX0lCYFESasVRvZd0EYpCkOIbJKHMuv0LskpXc/8Un+MJzEQ==}
+  untun@0.2.2:
+    resolution: {integrity: sha512-+NnOJcSiEtYsVgJmXUzQbJeRAFXJC4yPJYuh6kF9B0Rm6zunXcs/3GZOTllyocSbUDIxD6Bj7e/4ATw7sph1Sw==}
     hasBin: true
 
-  untyped@1.5.2:
-    resolution: {integrity: sha512-eL/8PlhLcMmlMDtNPKhyyz9kEBDS3Uk4yMu/ewlkT2WFbtzScjHWPJLdQLmaGPUKjXzwe9MumOtOgc4Fro96Kg==}
+  untyped@2.0.0:
+    resolution: {integrity: sha512-nwNCjxJTjNuLCgFr42fEak5OcLuB3ecca+9ksPFNvtfYSLpjf+iJqSIaSnIile6ZPbKYxI5k2AfXqeopGudK/g==}
     hasBin: true
 
-  unwasm@0.3.9:
-    resolution: {integrity: sha512-LDxTx/2DkFURUd+BU1vUsF/moj0JsoTvl+2tcg2AUOiEzVturhGGx17/IMgGvKUYdZwr33EJHtChCJuhu9Ouvg==}
+  unwasm@0.5.3:
+    resolution: {integrity: sha512-keBgTSfp3r6+s9ZcSma+0chwxQdmLbB5+dAD9vjtB21UTMYuKAxHXCU1K2CbCtnP09EaWeRvACnXk0EJtUx+hw==}
 
   unzipper@0.10.14:
     resolution: {integrity: sha512-ti4wZj+0bQTiX2KmKWuwj7lhV+2n//uXEotUmGuQqrbVZSEGFMbI68+c6JCQ8aAmUWYvtHEz2A8K6wXvueR/6g==}
 
+  unzipper@0.12.5:
+    resolution: {integrity: sha512-tXYOi9R57Uj/2Z25SOs5RRSzq886MBQj2gY8dPL+xl/kv6s6SvByoKfAtvfVeEuhntWDgjd2o9p2lb4TVPAz0A==}
+
   upath@1.2.0:
     resolution: {integrity: sha512-aZwGpamFO61g3OlfT7OQCHqhGnW43ieH9WZeP7QxN/G/jS4jfqUkZxoryvJgVPEcrl5NL/ggHsSmLMHuH64Lhg==}
     engines: {node: '>=4'}
 
-  update-browserslist-db@1.1.1:
-    resolution: {integrity: sha512-R8UzCaa9Az+38REPiJ1tXlImTJXlVfgHZsglwBD/k6nj76ctsH1E3q4doGrukiLQd3sGQYu56r5+lo5r94l29A==}
+  update-browserslist-db@1.3.0:
+    resolution: {integrity: sha512-x/M6q3w4Ybp91CNaS4S69UnliqR3BzRpOT6LWbksjth0S/+jhfaPJsWjt/TewpT8j9eLIojUf5jr29WextHroA==}
     hasBin: true
     peerDependencies:
       browserslist: '>= 4.21.0'
@@ -9530,17 +11486,14 @@ packages:
     resolution: {integrity: sha512-+dwUY4L35XFYEzE+OAL3sarJdUioVovq+8f7lcIJ7wnmnYQV5UD1Y/lcwaMSyaQ6Bj3JMj1XSTjZbNLHn/19yA==}
     engines: {node: '>=18'}
 
-  uqr@0.1.2:
-    resolution: {integrity: sha512-MJu7ypHq6QasgF5YRTjqscSzQp/W11zoUk6kvmlH+fmWEs63Y0Eib13hYFwAzagRJcVY8WVnlV+eBDUGMJ5IbA==}
-
-  uri-js-replace@1.0.1:
-    resolution: {integrity: sha512-W+C9NWNLFOoBI2QWDp4UT9pv65r2w5Cx+3sTYFvtMdDBxkKt1syCqsUdSFAChbEe1uK5TfS04wt/nGwmaeIQ0g==}
+  uqr@0.1.3:
+    resolution: {integrity: sha512-0rjE8iEJe4YmT9TOhwsZtqCMRLc5DXZUI2UEYUUg63ikBkqqE5EYWaI0etFe/5KUcmcYwLih2RND1kq+hrUJXA==}
 
   uri-js@4.4.1:
     resolution: {integrity: sha512-7rKUyy33Q1yc98pQ1DAmLtwX109F7TIfWlW1Ydo8Wl1ii1SeHieeh0HHfPeL2fMXK6z0s8ecKs9frCuLJvndBg==}
 
-  urlpattern-polyfill@8.0.2:
-    resolution: {integrity: sha512-Qp95D4TPJl1kC9SKigDcqgyM2VDVO4RiJc2d4qe5GrYm+zbIQCWWKAFaJNQ4BhdFeDGwBmAxqJBwWSJDb9T3BQ==}
+  utf8-byte-length@1.0.5:
+    resolution: {integrity: sha512-Xn0w3MtiQ6zoz2vFyUVruaCL53O/DwUvkEeOvj+uulMm0BkUGYWmBYVyElqZaSLhY6ZD0ulfU3aBra2aVT4xfA==}
 
   util-deprecate@1.0.2:
     resolution: {integrity: sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==}
@@ -9552,50 +11505,46 @@ packages:
     resolution: {integrity: sha512-+NYs2QeMWy+GWFOEm9xnn6HCDp0l7QBD7ml8zLUmJ+93Q5NF0NocErnwkTkXVFNiX3/fpC6afS8Dhb/gz7R7eg==}
     hasBin: true
 
-  validate-npm-package-license@3.0.4:
-    resolution: {integrity: sha512-DpKm2Ui/xN7/HQKCtpZxoRWBhZ9Z0kqtygG8XCgNQ8ZlDnxuQmWhj566j8fN4Cu3/JmbhsDo7fcAJq4s9h27Ew==}
-
-  vee-validate@4.14.7:
-    resolution: {integrity: sha512-XVb1gBFJR57equ11HEI8uxNqFJkwvCP/b+p+saDPQYaW7k45cdF5jsYPEJud1o29GD6h2y7Awm7Qfm89yKi74A==}
+  valibot@1.4.2:
+    resolution: {integrity: sha512-gjdCvJ6d3RyHAneqxMYMW9QMCwYMb3jpOO0IyHZV1bnRHFBHrX3VkIILt5XYR0WhwHiH7Mty8ovuPZ/O3gamrg==}
     peerDependencies:
-      vue: ^3.5.13
+      typescript: '>=5'
+    peerDependenciesMeta:
+      typescript:
+        optional: true
 
-  vite-hot-client@0.2.4:
-    resolution: {integrity: sha512-a1nzURqO7DDmnXqabFOliz908FRmIppkBKsJthS8rbe8hBEXwEwe4C3Pp33Z1JoFCYfVL4kTOMLKk0ZZxREIeA==}
+  validator@13.15.35:
+    resolution: {integrity: sha512-TQ5pAGhd5whStmqWvYF4OjQROlmv9SMFVt37qoCBdqRffuuklWYQlCNnEs2ZaIBD1kZRNnikiZOS1eqgkar0iw==}
+    engines: {node: '>= 0.10'}
+
+  varint@6.0.0:
+    resolution: {integrity: sha512-cXEIW6cfr15lFv563k4GuVuW/fiwjknytD37jIOLSdSWuOI6WnO/oKwmP2FQTU2l01LP8/M5TSAJpzUaGe3uWg==}
+
+  verkit@0.3.2:
+    resolution: {integrity: sha512-zj/ob3UsvJGN0whEAKFp53REA5X66hvffVqoCtVQAakJKnKlH+/PcOfMoFwIG/o4rElqLv/ycAFlx8ZlXUorCg==}
+    engines: {node: '>=18.12.0'}
+
+  vite-dev-rpc@2.0.0:
+    resolution: {integrity: sha512-yKwbTwdHKSD2k/aGqyWpPHepo45OQc8lH3/6IfT4ZqeKE26ooKvi4WIEKzqWav8v+9Is8u1k8q54hvOmqASazA==}
     peerDependencies:
-      vite: ^2.6.0 || ^3.0.0 || ^4.0.0 || ^5.0.0-0 || ^6.0.0-0
+      vite: ^2.9.0 || ^3.0.0-0 || ^4.0.0-0 || ^5.0.0-0 || ^6.0.1 || ^7.0.0-0 || ^8.0.0
 
-  vite-node@2.1.8:
-    resolution: {integrity: sha512-uPAwSr57kYjAUux+8E2j0q0Fxpn8M9VoyfGiRI8Kfktz9NcYMCenwY5RnZxnF1WTu3TGiYipirIzacLL3VVGFg==}
-    engines: {node: ^18.0.0 || >=20.0.0}
-    hasBin: true
+  vite-hot-client@2.2.0:
+    resolution: {integrity: sha512-76Zs9zrHbH7M7wqeyooGQKdX+yg0pQ0xuQ1PbFp4z5a0Lzn2e5IPFoCswnmqZ4GiwqB4Jo3WcDAMO9jARTJl8w==}
+    peerDependencies:
+      vite: ^2.6.0 || ^3.0.0 || ^4.0.0 || ^5.0.0-0 || ^6.0.0-0 || ^7.0.0-0 || ^8.0.0
 
   vite-plugin-compression@0.5.1:
     resolution: {integrity: sha512-5QJKBDc+gNYVqL/skgFAP81Yuzo9R+EAf19d+EtsMF/i8kFUpNi3J/H01QD3Oo8zBQn+NzoCIFkpPLynoOzaJg==}
     peerDependencies:
       vite: '>=2.0.0'
 
-  vite-plugin-dts@4.2.1:
-    resolution: {integrity: sha512-/QlYvgUMiv8+ZTEerhNCYnYaZMM07cdlX6hQCR/w/g/nTh0tUXPoYwbT6SitizLJ9BybT1lnrcZgqheI6wromQ==}
-    engines: {node: ^14.18.0 || >=16.0.0}
-    peerDependencies:
-      typescript: '*'
-      vite: '*'
-    peerDependenciesMeta:
-      vite:
-        optional: true
-
-  vite-plugin-html@3.2.2:
-    resolution: {integrity: sha512-vb9C9kcdzcIo/Oc3CLZVS03dL5pDlOFuhGlZYDCJ840BhWl/0nGeZWf3Qy7NlOayscY4Cm/QRgULCQkEZige5Q==}
-    peerDependencies:
-      vite: '>=2.0.0'
-
-  vite-plugin-inspect@0.8.9:
-    resolution: {integrity: sha512-22/8qn+LYonzibb1VeFZmISdVao5kC22jmEKm24vfFE8siEn47EpVcCLYMv6iKOYMJfjSvSJfueOwcFCkUnV3A==}
+  vite-plugin-inspect@11.4.1:
+    resolution: {integrity: sha512-ShOFe2PURXGvRS5OrgmOLZOCwDTD7dEBVt0tMpFPKb9AsvqXKCRGM8QgKrUbRbJYFXScHvDPpGRd28rYidC0tA==}
     engines: {node: '>=14'}
     peerDependencies:
       '@nuxt/kit': '*'
-      vite: ^3.1.0 || ^4.0.0 || ^5.0.0-0 || ^6.0.1
+      vite: ^6.0.0 || ^7.0.0-0 || ^8.0.0-0
     peerDependenciesMeta:
       '@nuxt/kit':
         optional: true
@@ -9603,73 +11552,42 @@ packages:
   vite-plugin-lazy-import@1.0.7:
     resolution: {integrity: sha512-mE6oAObOb4wqso4AoUGi9cLjdR+4vay1RCaKJvziBuFPlziZl7J0aw2hsqRTokLVRx3bli0a0VyjMOwsNDv58A==}
 
-  vite-plugin-pwa@0.21.1:
-    resolution: {integrity: sha512-rkTbKFbd232WdiRJ9R3u+hZmf5SfQljX1b45NF6oLA6DSktEKpYllgTo1l2lkiZWMWV78pABJtFjNXfBef3/3Q==}
+  vite-plugin-pwa@1.3.0:
+    resolution: {integrity: sha512-c5kMgN+ITrOtHXp8PAtk2uOIEea6XjP/unCGxOWWBzQ6qa65qj/awHg0wf+QF9E/2u9vh86LqxPwzEPNbM2r5A==}
     engines: {node: '>=16.0.0'}
     peerDependencies:
-      '@vite-pwa/assets-generator': ^0.2.6
-      vite: ^3.1.0 || ^4.0.0 || ^5.0.0 || ^6.0.0
-      workbox-build: ^7.3.0
-      workbox-window: ^7.3.0
+      '@vite-pwa/assets-generator': ^1.0.0
+      vite: ^3.1.0 || ^4.0.0 || ^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0
+      workbox-build: ^7.4.1
+      workbox-window: ^7.4.1
     peerDependenciesMeta:
       '@vite-pwa/assets-generator':
         optional: true
 
-  vite-plugin-vue-devtools@7.6.8:
-    resolution: {integrity: sha512-32aIps8C1Y7UEoqyWf+ES3J1OozsCYMIqTqd+I5qass+R0Tcf8SaA2bX1/rskAzkcKCteVoBjEENmqwTcMebbw==}
+  vite-plugin-vue-devtools@8.2.1:
+    resolution: {integrity: sha512-5JLxXWWCo5lJMw16/xVeNvJ8k2zLwZPf1vITLzya/2IePrCBeGe/p/iAokgXHZpEi39fcYtPXmO8SaKeXmqCAA==}
     engines: {node: '>=v14.21.3'}
     peerDependencies:
-      vite: ^3.1.0 || ^4.0.0-0 || ^5.0.0-0 || ^6.0.0-0
+      vite: ^6.0.0 || ^7.0.0 || ^8.0.0
 
-  vite-plugin-vue-inspector@5.3.1:
-    resolution: {integrity: sha512-cBk172kZKTdvGpJuzCCLg8lJ909wopwsu3Ve9FsL1XsnLBiRT9U3MePcqrgGHgCX2ZgkqZmAGR8taxw+TV6s7A==}
+  vite-plugin-vue-inspector@6.0.0:
+    resolution: {integrity: sha512-OpyITJLgZNibxlrik1EmRtvXHDjLRxNPsWkGFTERZs2LgMEdG4W0WoFt5GIgp3a3jRou+eJR8U1zOBk/XQgEbw==}
     peerDependencies:
-      vite: ^3.0.0-0 || ^4.0.0-0 || ^5.0.0-0 || ^6.0.0-0
+      vite: ^3.0.0 || ^4.0.0 || ^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0
 
-  vite@5.4.11:
-    resolution: {integrity: sha512-c7jFQRklXua0mTzneGW9QVyxFjUgwcihC4bXEtujIo2ouWCe1Ajt/amn2PCxYnhYfd5k09JX3SB7OYWFKYqj8Q==}
-    engines: {node: ^18.0.0 || >=20.0.0}
+  vite@7.3.6:
+    resolution: {integrity: sha512-4XP60spRGjSZFf1qYH+dJIkK2znL3zQfl9KkOV9MkkRR/3Dls0dxaBsQPTloEc5BLXWPL9vsOxopxyKoMmDueg==}
+    engines: {node: ^20.19.0 || >=22.12.0}
     hasBin: true
     peerDependencies:
-      '@types/node': ^18.0.0 || >=20.0.0
-      less: '*'
-      lightningcss: ^1.21.0
-      sass: '*'
-      sass-embedded: '*'
-      stylus: '*'
-      sugarss: '*'
-      terser: ^5.4.0
-    peerDependenciesMeta:
-      '@types/node':
-        optional: true
-      less:
-        optional: true
-      lightningcss:
-        optional: true
-      sass:
-        optional: true
-      sass-embedded:
-        optional: true
-      stylus:
-        optional: true
-      sugarss:
-        optional: true
-      terser:
-        optional: true
-
-  vite@6.0.5:
-    resolution: {integrity: sha512-akD5IAH/ID5imgue2DYhzsEwCi0/4VKY31uhMLEYJwPP4TiUp8pL5PIK+Wo7H8qT8JY9i+pVfPydcFPYD1EL7g==}
-    engines: {node: ^18.0.0 || ^20.0.0 || >=22.0.0}
-    hasBin: true
-    peerDependencies:
-      '@types/node': ^18.0.0 || ^20.0.0 || >=22.0.0
+      '@types/node': ^20.19.0 || >=22.12.0
       jiti: '>=1.21.0'
-      less: '*'
+      less: ^4.0.0
       lightningcss: ^1.21.0
-      sass: '*'
-      sass-embedded: '*'
-      stylus: '*'
-      sugarss: '*'
+      sass: ^1.70.0
+      sass-embedded: ^1.70.0
+      stylus: '>=0.54.8'
+      sugarss: ^5.0.0
       terser: ^5.16.0
       tsx: ^4.8.1
       yaml: ^2.4.2
@@ -9697,23 +11615,82 @@ packages:
       yaml:
         optional: true
 
-  vitest@2.1.8:
-    resolution: {integrity: sha512-1vBKTZskHw/aosXqQUlVWWlGUxSJR8YtiyZDJAFeW2kPAeX6S3Sool0mjspO+kXLuxVWlEDDowBAeqeAQefqLQ==}
-    engines: {node: ^18.0.0 || >=20.0.0}
+  vite@8.2.1:
+    resolution: {integrity: sha512-EU/eS7BH3XROHh2YnBefjM6DBKA6ZeMZEYQbj7NLWg5wHYlhB8B/Mayd5XsgWq+NFYccDOTemRpdETWR6Ka/lw==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    hasBin: true
+    peerDependencies:
+      '@types/node': ^20.19.0 || >=22.12.0
+      '@vitejs/devtools': ^0.4.0
+      esbuild: ^0.27.0 || ^0.28.0
+      jiti: '>=1.21.0'
+      less: ^4.0.0
+      sass: ^1.70.0
+      sass-embedded: ^1.70.0
+      stylus: '>=0.54.8'
+      sugarss: ^5.0.0
+      terser: ^5.16.0
+      tsx: ^4.8.1
+      yaml: ^2.4.2
+    peerDependenciesMeta:
+      '@types/node':
+        optional: true
+      '@vitejs/devtools':
+        optional: true
+      esbuild:
+        optional: true
+      jiti:
+        optional: true
+      less:
+        optional: true
+      sass:
+        optional: true
+      sass-embedded:
+        optional: true
+      stylus:
+        optional: true
+      sugarss:
+        optional: true
+      terser:
+        optional: true
+      tsx:
+        optional: true
+      yaml:
+        optional: true
+
+  vitest@4.1.10:
+    resolution: {integrity: sha512-R9jUTe5S4Qb0HCd4TNqpC7oGcrMssMRGXLW80ubjWsW9VH5GF8y1Y0SFLY9AbqSk6nt0PnOx4H4WNJYZ13GUPw==}
+    engines: {node: ^20.0.0 || ^22.0.0 || >=24.0.0}
     hasBin: true
     peerDependencies:
       '@edge-runtime/vm': '*'
-      '@types/node': ^18.0.0 || >=20.0.0
-      '@vitest/browser': 2.1.8
-      '@vitest/ui': 2.1.8
+      '@opentelemetry/api': ^1.9.0
+      '@types/node': ^20.0.0 || ^22.0.0 || >=24.0.0
+      '@vitest/browser-playwright': 4.1.10
+      '@vitest/browser-preview': 4.1.10
+      '@vitest/browser-webdriverio': 4.1.10
+      '@vitest/coverage-istanbul': 4.1.10
+      '@vitest/coverage-v8': 4.1.10
+      '@vitest/ui': 4.1.10
       happy-dom: '*'
       jsdom: '*'
+      vite: ^6.0.0 || ^7.0.0 || ^8.0.0
     peerDependenciesMeta:
       '@edge-runtime/vm':
         optional: true
+      '@opentelemetry/api':
+        optional: true
       '@types/node':
         optional: true
-      '@vitest/browser':
+      '@vitest/browser-playwright':
+        optional: true
+      '@vitest/browser-preview':
+        optional: true
+      '@vitest/browser-webdriverio':
+        optional: true
+      '@vitest/coverage-istanbul':
+        optional: true
+      '@vitest/coverage-v8':
         optional: true
       '@vitest/ui':
         optional: true
@@ -9725,11 +11702,11 @@ packages:
   vscode-languageserver-textdocument@1.0.12:
     resolution: {integrity: sha512-cxWNPesCnQCcMPeenjKKsOCKQZ/L6Tv19DTRIGuLWe32lyzWhihGVJ/rcckZXJxfdKCFvRLS3fpBIsV/ZGX4zA==}
 
-  vscode-uri@3.0.8:
-    resolution: {integrity: sha512-AyFQ0EVmsOZOlAnxoFOGOq1SQDWAB7C6aqMGS23svWAllfOaxbuFvcT8D1i8z3Gyn8fraVeZNNmN6e9bxxXkKw==}
+  vscode-uri@3.1.0:
+    resolution: {integrity: sha512-/BpdSx+yCQGnCvecbyXdxHDkuk55/G3xwnC0GqY4gmQ3j+A+g8kzzgB4Nk/SINjqn6+waqw3EgbVF2QKExkRxQ==}
 
-  vue-component-type-helpers@2.1.10:
-    resolution: {integrity: sha512-lfgdSLQKrUmADiSV6PbBvYgQ33KF3Ztv6gP85MfGaGaSGMTXORVaHT1EHfsqCgzRNBstPKYDmvAV9Do5CmJ07A==}
+  vue-component-type-helpers@3.3.9:
+    resolution: {integrity: sha512-3c/UfMe0SqyEfcGTyH7mfshHagJ9QTCbppCb0/uGpHZpFug7+If3GeGZN7I0YheKEExemx3xldQPoO7PQSOLQg==}
 
   vue-demi@0.14.10:
     resolution: {integrity: sha512-nMZBOwuzabUO0nLgIcc6rycZEebF6eeUfaiQx9+WSk8e29IbLvPU9feI6tqW4kTo3hvoYAJkMh8n8D0fuISphg==}
@@ -9737,30 +11714,54 @@ packages:
     hasBin: true
     peerDependencies:
       '@vue/composition-api': ^1.0.0-rc.1
-      vue: ^3.5.13
+      vue: ^3.5.40
     peerDependenciesMeta:
       '@vue/composition-api':
         optional: true
 
-  vue-eslint-parser@9.4.3:
-    resolution: {integrity: sha512-2rYRLWlIpaiN8xbPiDyXZXRgLGOtWxERV7ND5fFAv5qo1D2N9Fu9MNajBNc6o13lZ+24DAWCkQCvj4klgmcITg==}
-    engines: {node: ^14.17.0 || >=16.0.0}
+  vue-eslint-parser@10.4.1:
+    resolution: {integrity: sha512-Gk6gRDj0n/fkRa3C3l0bBheoBckUq/Rs0F/TvMWIS6nzzx67amAViMe9CkNgsP2tXyQONvGiHQESHwFtZ3aYDA==}
+    engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
     peerDependencies:
-      eslint: '>=6.0.0'
+      eslint: ^8.57.0 || ^9.0.0 || ^10.0.0
 
-  vue-i18n@10.0.5:
-    resolution: {integrity: sha512-9/gmDlCblz3i8ypu/afiIc/SUIfTTE1mr0mZhb9pk70xo2csHAM9mp2gdQ3KD2O0AM3Hz/5ypb+FycTj/lHlPQ==}
-    engines: {node: '>= 16'}
+  vue-i18n@11.4.8:
+    resolution: {integrity: sha512-0ULeHP6Z9CGvAm67S77ZEp41cfGXIREGL8qfhos2BMgcQQewtQcDKuojt6jjasAD/S8GwfTp2ySPmDSpwvrCMQ==}
+    engines: {node: '>= 22'}
     peerDependencies:
-      vue: ^3.5.13
+      vue: ^3.5.40
 
-  vue-router@4.5.0:
-    resolution: {integrity: sha512-HDuk+PuH5monfNuY+ct49mNmkCRK4xJAV9Ts4z9UFc4rzdDnxQLyCMGGc8pKhZhHTVzfanpNwB/lwqevcBwI4w==}
+  vue-json-pretty@2.6.0:
+    resolution: {integrity: sha512-glz1aBVS35EO8+S9agIl3WOQaW2cJZW192UVKTuGmryx01ZvOVWc4pR3t+5UcyY4jdOfBUgVHjcpRpcnjRhCAg==}
+    engines: {node: '>= 10.0.0', npm: '>= 5.0.0'}
     peerDependencies:
-      vue: ^3.5.13
+      vue: ^3.5.40
 
-  vue-tsc@2.1.10:
-    resolution: {integrity: sha512-RBNSfaaRHcN5uqVqJSZh++Gy/YUzryuv9u1aFWhsammDJXNtUiJMNoJ747lZcQ68wUQFx6E73y4FY3D8E7FGMA==}
+  vue-router@5.2.0:
+    resolution: {integrity: sha512-QAC5i0LEb1GLG0LXDQmHu8L7FX12j0KwU/JTKmLQUJMrn04gQdKP6Du+p0QwpHb3iy71vBlqnHQ8WAfOSAWhqw==}
+    peerDependencies:
+      '@pinia/colada': '>=0.21.2'
+      '@vue/compiler-sfc': ^3.5.34 || ^4.0.0
+      pinia: ^4.0.2
+      vite: ^7.3.0 || ^8.0.0
+      vue: ^3.5.40
+    peerDependenciesMeta:
+      '@pinia/colada':
+        optional: true
+      '@vue/compiler-sfc':
+        optional: true
+      pinia:
+        optional: true
+      vite:
+        optional: true
+
+  vue-tippy@6.7.1:
+    resolution: {integrity: sha512-gdHbBV5/Vc8gH87hQHLA7TN1K4BlLco3MAPrTb70ZYGXxx+55rAU4a4mt0fIoP+gB3etu1khUZ6c29Br1n0CiA==}
+    peerDependencies:
+      vue: ^3.5.40
+
+  vue-tsc@3.3.9:
+    resolution: {integrity: sha512-TS3Y1ux/IRoE8OCP2PpACAeOseuIs0UvWrcr7u+w3PmfY+SlCfEf8zjrBgnQksHUgLpthi5vHlffcQTQTdPBZA==}
     hasBin: true
     peerDependencies:
       typescript: '>=5.0.0'
@@ -9769,48 +11770,48 @@ packages:
     resolution: {integrity: sha512-IwUC0Aq2zwaXqy74h4WCvFCUtoV0iSWr0snWnE9TnU18S66GAQyqQbRf2qfJtUuiFsBf6qp0MEwdonlwznlcrw==}
     engines: {node: '>=10.15.0'}
     peerDependencies:
-      vue: ^3.5.13
+      vue: ^3.5.40
 
-  vue@3.5.13:
-    resolution: {integrity: sha512-wmeiSMxkZCSc+PM2w2VRsOYAZC8GdipNFRTsLSfodVqI9mbejKeXEGr8SckuLnrQPGe3oJN5c3K0vpoU9q/wCQ==}
+  vue@3.5.41:
+    resolution: {integrity: sha512-2laE0p+aK+/AOPG/XL/WepOs/GlK755LJ1XECi9kDUrz1FKNw8rb2Xzlw9JS1rqEV55nb0ttsKxVlTCcd+R5cg==}
     peerDependencies:
       typescript: '*'
     peerDependenciesMeta:
       typescript:
         optional: true
 
-  vxe-pc-ui@4.3.40:
-    resolution: {integrity: sha512-rhHBweoK0iiDqtHSogUprXA5dnSFYEHIYjnKwsp4/Tx5loROpYbBnq6+VcrpZSaJRkpwIsAHbbTHzNxsrCpoQA==}
+  vxe-pc-ui@4.16.27:
+    resolution: {integrity: sha512-6CbBAau0HGnsB8eo3JZvThMhzmNudC+I3i5QsM6y80GITEehV1zxaZt4079GmjbqQ99134ivAWYykg+z0EWlIw==}
 
-  vxe-table@4.9.33:
-    resolution: {integrity: sha512-KhLUYeCSL4319rcSS8SFkWeFf+pzCBtHm8ytmwiGnj45M7pYoXWR2fpmvR10pEdKsQgM8MDHxqrxdMejT6yKyw==}
+  vxe-table@4.20.11:
+    resolution: {integrity: sha512-H9SCcd9fb6LhnHT2lL4YgruPax/aMXOvNgT5ZezbZP4DzkXpPbTN0lp/KFetay6VZjDTWFJtGFtskzkfdXOV3g==}
 
   w3c-keyname@2.2.8:
     resolution: {integrity: sha512-dpojBhNsCNN7T82Tm7k26A6G9ML3NkhDsnw9n/eoxSRlVBB4CEtIQ/KTCLI2Fwf3ataSXRhYFkQi3SlnFwPvPQ==}
 
+  walk-up-path@4.0.0:
+    resolution: {integrity: sha512-3hu+tD8YzSLGuFYtPRb48vdhKMi0KQV5sn+uWr8+7dMEq/2G/dtLrdDinkLjqq5TIbIBjYJ4Ax/n3YiaW7QM8A==}
+    engines: {node: 20 || >=22}
+
   warning@4.0.3:
     resolution: {integrity: sha512-rpJyN222KWIvHJ/F53XSZv0Zl/accqHR8et1kpaMTD/fLCRxtV8iX8czMzY7sVZupTI3zcUTg8eycS2kNF9l6w==}
 
-  watermark-js-plus@1.5.7:
-    resolution: {integrity: sha512-KaQEUnvBX5em2hBeuKcpAASpV+sO1j8NbXY7FL7jb0w1TCKmMSyn8nkj2e+KeleuQ1iwyXHEMFdSWXDIQsACYQ==}
-    engines: {node: '>=20.0.0'}
+  watermark-js-plus@1.6.6:
+    resolution: {integrity: sha512-TReFUESd36dq8KHLeWzw3NAJXTc3/h/Clip+VWE8SxGx6Digfwxy/NPrLYnFDddw/8kUv/7p0Ohgpperzpjjjw==}
+
+  webcrypto-core@1.9.2:
+    resolution: {integrity: sha512-gsXecm82UQNlTBURJGuqOWy1Ww08S3kZUcr3aOJS02Pk0xLtkfeUAVC0u0xhgdonFme80edSJUIJyuvL/7250Q==}
 
   webidl-conversions@3.0.1:
     resolution: {integrity: sha512-2JAn3z8AR6rjK8Sm8orRC0h/bcl/DqL7tRPdGZ4I1CjdF+EaMLmYxBHyXuKL849eucPFhvBoxMsflfOb8kxaeQ==}
 
-  webidl-conversions@4.0.2:
-    resolution: {integrity: sha512-YQ+BmxuTgd6UXZW3+ICGfyqRyHXVlD5GtQr5+qjiNW7bF0cqrzX500HVXPBOvgXb5YnzDd+h0zqyv61KUD7+Sg==}
-
-  webidl-conversions@7.0.0:
-    resolution: {integrity: sha512-VwddBukDzu71offAQR975unBIGqfKZpM+8ZX6ySk8nYhVoo5CYaZyzt3YBvYtRtO+aoGlqxPg/B87NGVZ/fu6g==}
-    engines: {node: '>=12'}
-
   webpack-virtual-modules@0.6.2:
     resolution: {integrity: sha512-66/V2i5hQanC51vBQKPH4aI8NMAcBW59FVBs+rC7eGHupMyfn34q7rZIE+ETlJ+XTevqfUhVVBgSUNSW2flEUQ==}
 
   whatwg-encoding@3.1.1:
     resolution: {integrity: sha512-6qN4hJdMwfYBtE3YBTTHhoeuUrDBPZmbQaxWAqSALV/MeEnR5z1xd8UKud2RAkFoPkmB+hli1TZSnyi84xz1vQ==}
     engines: {node: '>=18'}
+    deprecated: Use @exodus/bytes instead for a more spec-conformant and faster implementation
 
   whatwg-mimetype@3.0.0:
     resolution: {integrity: sha512-nt+N2dzIutVRxARx1nghPKGv1xHikU7HKdfafKkLNLindmPU/ch3U31NOCGGA/dmPcmb1VlofO0vnKAcsm0o/Q==}
@@ -9823,11 +11824,8 @@ packages:
   whatwg-url@5.0.0:
     resolution: {integrity: sha512-saE57nupxk6v3HY35+jzBwYa0rKSy0XR8JSxZPwgLr7ys0IBzhGviA1/TUGJLmSVqs8pb9AnvICXEuOHLprYTw==}
 
-  whatwg-url@7.1.0:
-    resolution: {integrity: sha512-WUu7Rg1DroM7oQvGWfOiAK21n74Gg+T4elXEQYkOhtyLeWiJFoOGLXPKI/9gzIie9CtwVLm8wtw6YJdKyxSjeg==}
-
-  when-exit@2.1.3:
-    resolution: {integrity: sha512-uVieSTccFIr/SFQdFWN/fFaQYmV37OKtuaGphMAzi4DmmUlrvRBJW5WSLkHyjNQY/ePJMz3LoiX9R3yy1Su6Hw==}
+  when-exit@2.1.5:
+    resolution: {integrity: sha512-VGkKJ564kzt6Ms1dbgPP/yuIoQCrsFAnRbptpC5wOEsDaNsbCB2bnfnaA8i/vRs5tjUSEOtIuvl9/MyVsvQZCg==}
 
   which-boxed-primitive@1.1.1:
     resolution: {integrity: sha512-TbX3mj8n0odCBFVlY8AxkqcHASw3L60jIuF8jFP78az3C2YhmGvqbHBpAjTRH2/xqYunrJ9g1jSyjCjpoWzIAA==}
@@ -9841,11 +11839,16 @@ packages:
     resolution: {integrity: sha512-K4jVyjnBdgvc86Y6BkaLZEN933SwYOuBFkdmBu9ZfkcAbdVbpITnDmjvZ/aQjRXQrv5EPkTnD1s39GiiqbngCw==}
     engines: {node: '>= 0.4'}
 
+  which-command@0.1.0:
+    resolution: {integrity: sha512-XZyoF5/5hZtXitIwzrU4NKK+Wtbb9aB9CezUEw2Q0wlYK8NUYQxC1rRXgNueYLtBAJwXIb+/tFVk4dozciNJMA==}
+    engines: {node: '>=22'}
+    hasBin: true
+
   which-module@2.0.1:
     resolution: {integrity: sha512-iBdZ57RDvnOR9AGBhML2vFZf7h8vmBjhoaZqODJBFWHVtKkDmKuHai3cx5PgVMrX5YDNp27AofYbAwctSS+vhQ==}
 
-  which-typed-array@1.1.18:
-    resolution: {integrity: sha512-qEcY+KJYlWyLH9vNbsr6/5j59AXk5ni5aakf8ldzBvGde6Iz4sxZGkJyWSAueTG7QhOvNRYb1lDdFmL5Td0QKA==}
+  which-typed-array@1.1.22:
+    resolution: {integrity: sha512-fvO4ExWMFsqyhG3AiPAObMuY1lxaqgYcxbc49CNdWDDECOJNgQyvsOWVwbZc+qf3rzRtxojBK+CMEv0Ld5CYpw==}
     engines: {node: '>= 0.4'}
 
   which@1.3.1:
@@ -9857,6 +11860,16 @@ packages:
     engines: {node: '>= 8'}
     hasBin: true
 
+  which@5.0.0:
+    resolution: {integrity: sha512-JEdGzHwwkrbWoGOlIHqQ5gtprKGOenpDHpxE9zVR1bWbOtYRyPPHMe9FaP6x61CmNaTThSkb0DAJte5jD+DmzQ==}
+    engines: {node: ^18.17.0 || >=20.5.0}
+    hasBin: true
+
+  which@6.0.1:
+    resolution: {integrity: sha512-oGLe46MIrCRqX7ytPUf66EAYvdeMIZYn3WaocqqKZAxrBpkqHfL/qvTyJ/bTk5+AqHCjXmrv3CEWgy368zhRUg==}
+    engines: {node: ^20.17.0 || >=22.9.0}
+    hasBin: true
+
   why-is-node-running@2.3.0:
     resolution: {integrity: sha512-hUrmaWBdVDcxvYqnyh09zunKzROWjbZTiNy8dBEjkS7ehEDQibXJ7XvlmtbwuTclUiIyN+CyXQD4Vmko8fNm8w==}
     engines: {node: '>=8'}
@@ -9878,54 +11891,58 @@ packages:
     resolution: {integrity: sha512-OELeY0Q61OXpdUfTp+oweA/vtLVg5VDOXh+3he3PNzLGG/y0oylSOC1xRVj0+l4vQ3tj/bB1HVHv1ocXkQceFA==}
     engines: {node: '>=0.8'}
 
-  workbox-background-sync@7.3.0:
-    resolution: {integrity: sha512-PCSk3eK7Mxeuyatb22pcSx9dlgWNv3+M8PqPaYDokks8Y5/FX4soaOqj3yhAZr5k6Q5JWTOMYgaJBpbw11G9Eg==}
+  workbox-background-sync@7.4.1:
+    resolution: {integrity: sha512-HhT7KE8tOWDm02wRNshXUnUPofMlhenF2DBdUnDPOubhizzPeItkYTmAB6td1Z2cjYPa98vzEiPLEuzn5hN66g==}
 
-  workbox-broadcast-update@7.3.0:
-    resolution: {integrity: sha512-T9/F5VEdJVhwmrIAE+E/kq5at2OY6+OXXgOWQevnubal6sO92Gjo24v6dCVwQiclAF5NS3hlmsifRrpQzZCdUA==}
+  workbox-broadcast-update@7.4.1:
+    resolution: {integrity: sha512-uAlgslKLvbQY+suirIdnBCSYrcgBhjp81Nj4l1lj/Jmj0MJO2CJERnCJjT0GFVwmReV0N+zs78K6gqd5gr9/+A==}
 
-  workbox-build@7.3.0:
-    resolution: {integrity: sha512-JGL6vZTPlxnlqZRhR/K/msqg3wKP+m0wfEUVosK7gsYzSgeIxvZLi1ViJJzVL7CEeI8r7rGFV973RiEqkP3lWQ==}
-    engines: {node: '>=16.0.0'}
+  workbox-build@7.4.1:
+    resolution: {integrity: sha512-SDhxIvEAde9Gy/5w4Yo1Jh/M49Z0qE3q0oteyE8zGq0DScxFqVBcCtIXFuLtmtxRQZCMbf0prco4VyEu3KBQuw==}
+    engines: {node: '>=20.0.0'}
 
-  workbox-cacheable-response@7.3.0:
-    resolution: {integrity: sha512-eAFERIg6J2LuyELhLlmeRcJFa5e16Mj8kL2yCDbhWE+HUun9skRQrGIFVUagqWj4DMaaPSMWfAolM7XZZxNmxA==}
+  workbox-cacheable-response@7.4.1:
+    resolution: {integrity: sha512-8xaFoJdDc2OjrlbbL3gEeBO1WKcMwRqwLRupgqahYXu75yXajPLuwrbXMrIGZuWYXrQwk0xDjOxZ/ujCy/oJYw==}
 
-  workbox-core@7.3.0:
-    resolution: {integrity: sha512-Z+mYrErfh4t3zi7NVTvOuACB0A/jA3bgxUN3PwtAVHvfEsZxV9Iju580VEETug3zYJRc0Dmii/aixI/Uxj8fmw==}
+  workbox-core@7.4.1:
+    resolution: {integrity: sha512-DT+vu46eh/2vRsSHTY4Xmc32Z1rr9PRlQUXr1Dx30ZuXRWwOsvZgGgcwxcasubQLQmbTNYZjv44LkBAQ4tT5tQ==}
 
-  workbox-expiration@7.3.0:
-    resolution: {integrity: sha512-lpnSSLp2BM+K6bgFCWc5bS1LR5pAwDWbcKt1iL87/eTSJRdLdAwGQznZE+1czLgn/X05YChsrEegTNxjM067vQ==}
+  workbox-expiration@7.4.1:
+    resolution: {integrity: sha512-lRKUF7b+OGbeXkQk1s6MHXOa3d7Xxf7Of31W6c6hCfipfIyrtdWZ89stq21AHZMaoG7VNFoHply4Ox+rU31TWg==}
 
-  workbox-google-analytics@7.3.0:
-    resolution: {integrity: sha512-ii/tSfFdhjLHZ2BrYgFNTrb/yk04pw2hasgbM70jpZfLk0vdJAXgaiMAWsoE+wfJDNWoZmBYY0hMVI0v5wWDbg==}
+  workbox-google-analytics@7.4.1:
+    resolution: {integrity: sha512-Mks1JwLEt++ZAkF6sS1OpSh9RtAMIsiDgRpK+codiHGIPXeaUOgi4cPc3GFadUl8V5QPeypEk8Oxgl3HlwVzHw==}
 
-  workbox-navigation-preload@7.3.0:
-    resolution: {integrity: sha512-fTJzogmFaTv4bShZ6aA7Bfj4Cewaq5rp30qcxl2iYM45YD79rKIhvzNHiFj1P+u5ZZldroqhASXwwoyusnr2cg==}
+  workbox-navigation-preload@7.4.1:
+    resolution: {integrity: sha512-C4KVsjPcYKJOhr631AxR9XoG2rLF3QiTk5aMv36MXOjtWvm8axwNFAtKUPGsWUwLXXAMgYM1En7fsvndaXeXRQ==}
 
-  workbox-precaching@7.3.0:
-    resolution: {integrity: sha512-ckp/3t0msgXclVAYaNndAGeAoWQUv7Rwc4fdhWL69CCAb2UHo3Cef0KIUctqfQj1p8h6aGyz3w8Cy3Ihq9OmIw==}
+  workbox-precaching@7.4.1:
+    resolution: {integrity: sha512-cdr/9qByww7yzEp7zg/qI4ukUrrNjQLgN+ONQRpjy/VqGQXwkgHwr00KksGJK8v0VifwDXBb8a4cWNZH71jn3Q==}
 
-  workbox-range-requests@7.3.0:
-    resolution: {integrity: sha512-EyFmM1KpDzzAouNF3+EWa15yDEenwxoeXu9bgxOEYnFfCxns7eAxA9WSSaVd8kujFFt3eIbShNqa4hLQNFvmVQ==}
+  workbox-range-requests@7.4.1:
+    resolution: {integrity: sha512-7i2oxAUE82gHdAJBCAQ04JzNOdRPqzuOzGfoUyJpFSmeqBNYGPrAH8GPoPjUQTfp+NycwrD2H68VtuF8qxv0vQ==}
 
-  workbox-recipes@7.3.0:
-    resolution: {integrity: sha512-BJro/MpuW35I/zjZQBcoxsctgeB+kyb2JAP5EB3EYzePg8wDGoQuUdyYQS+CheTb+GhqJeWmVs3QxLI8EBP1sg==}
+  workbox-recipes@7.4.1:
+    resolution: {integrity: sha512-gnbVfmV4/TtmQaM4x9AtuXhcdstJsep3XMVeztOrQVPT+R6+6DeBjGTCQ7fFCXm+4GEHUA5VEBTyi5+4gWGeog==}
 
-  workbox-routing@7.3.0:
-    resolution: {integrity: sha512-ZUlysUVn5ZUzMOmQN3bqu+gK98vNfgX/gSTZ127izJg/pMMy4LryAthnYtjuqcjkN4HEAx1mdgxNiKJMZQM76A==}
+  workbox-routing@7.4.1:
+    resolution: {integrity: sha512-yubJGErZOusuidAenaL5ypfhQOa7urxP/f8E0ws7FPb4039RiWXUWBAyUkmUoOL/BcQGen3h0J8872d51IYxtA==}
 
-  workbox-strategies@7.3.0:
-    resolution: {integrity: sha512-tmZydug+qzDFATwX7QiEL5Hdf7FrkhjaF9db1CbB39sDmEZJg3l9ayDvPxy8Y18C3Y66Nrr9kkN1f/RlkDgllg==}
+  workbox-strategies@7.4.1:
+    resolution: {integrity: sha512-GZxpaw9NbmOelj7667uZ2kpk5BFpOGbO4X0qjwh5ls8XQ8C+Lha5LQchTiUzsTFSS+NlUpftYAyOVXvQUrcqOQ==}
 
-  workbox-streams@7.3.0:
-    resolution: {integrity: sha512-SZnXucyg8x2Y61VGtDjKPO5EgPUG5NDn/v86WYHX+9ZqvAsGOytP0Jxp1bl663YUuMoXSAtsGLL+byHzEuMRpw==}
+  workbox-streams@7.4.1:
+    resolution: {integrity: sha512-HWWtraKUbJknd9kgqGcpQ3G114HOPYvqs8HaJMDs2ebLNAimDkVDaWfAXE6Ybl+m8U6KsCE6pWyLYuigWmnAXw==}
 
-  workbox-sw@7.3.0:
-    resolution: {integrity: sha512-aCUyoAZU9IZtH05mn0ACUpyHzPs0lMeJimAYkQkBsOWiqaJLgusfDCR+yllkPkFRxWpZKF8vSvgHYeG7LwhlmA==}
+  workbox-sw@7.4.1:
+    resolution: {integrity: sha512-fez5f2DUlDJWTFYkCWQpY10N8gtztd849NswCbVFk0QlcSM4HT5A8x4g4ii650yem4I8tHY0R7JZahwp3ltIPw==}
 
-  workbox-window@7.3.0:
-    resolution: {integrity: sha512-qW8PDy16OV1UBaUNGlTVcepzrlzyzNW/ZJvFQQs2j2TzGsg6IKjcpZC1RSquqQnTOafl5pCj5bGfAHlCjOOjdA==}
+  workbox-window@7.4.1:
+    resolution: {integrity: sha512-notZDH2u8VXaqyuD7xaqIfEFi6SRM4SUSd7ewe9PDsVqADuepxX2ZMY3uvuZGxzY5ZOsGC/vD3A/3smFtJt4/A==}
+
+  wrap-ansi@10.0.0:
+    resolution: {integrity: sha512-SGcvg80f0wUy2/fXES19feHMz8E0JoXv2uNgHOu4Dgi2OrCy1lqwFYEJz1BLbDI0exjPMe/ZdzZ/YpGECBG/aQ==}
+    engines: {node: '>=20'}
 
   wrap-ansi@6.2.0:
     resolution: {integrity: sha512-r6lPcBGxZXlIcymEu7InxDMhdW0KDxpLgoFLcguasxCaJ/SOIZwINatK9KY/tf+ZrlywOKU0UDj3ATXUBfxJXA==}
@@ -9939,31 +11956,50 @@ packages:
     resolution: {integrity: sha512-si7QWI6zUMq56bESFvagtmzMdGOtoxfR+Sez11Mobfc7tm+VkUckk9bW2UeffTGVUbOksxmSw0AA2gs8g71NCQ==}
     engines: {node: '>=12'}
 
-  wrap-ansi@9.0.0:
-    resolution: {integrity: sha512-G8ura3S+3Z2G+mkgNRq8dqaFZAuxfsxpBB8OCTGRTCtp+l/v9nbFNmCUP1BZMts3G1142MsZfn6eeUKrr4PD1Q==}
+  wrap-ansi@9.0.2:
+    resolution: {integrity: sha512-42AtmgqjV+X1VpdOfyTGOYRi0/zsoLqtXQckTmqTeybT+BDIbM/Guxo7x3pE2vtpr1ok6xRqM9OpBe+Jyoqyww==}
     engines: {node: '>=18'}
 
   wrappy@1.0.2:
     resolution: {integrity: sha512-l4Sp/DRseor9wL6EvV2+TuQn63dMkPjZ/sp9XkghTEbV9KlPS1xUsZ3u7/IQO4wxtcFB4bgpQPRcR3QCvezPcQ==}
 
-  write-file-atomic@5.0.1:
-    resolution: {integrity: sha512-+QU2zd6OTD8XWIJCbffaiQeH9U73qIqafo1x6V1snCWYGJf6cVE0cDR4D8xRzcEnfI21IFrUPzPGtcPf8AC+Rw==}
-    engines: {node: ^14.17.0 || ^16.13.0 || >=18.0.0}
+  write-file-atomic@7.0.1:
+    resolution: {integrity: sha512-OTIk8iR8/aCRWBqvxrzxR0hgxWpnYBblY1S5hDWBQfk/VFmJwzmJgQFN3WsoUKHISv2eAwe+PpbUzyL1CKTLXg==}
+    engines: {node: ^20.17.0 || >=22.9.0}
+
+  ws@8.21.3:
+    resolution: {integrity: sha512-201TZ/kPWxoPr/OKWjquZR1SWKXcvxdH+e1xrx89b3YbmzLMFCLfnaG1HFIgWzJOEWZ7MvpK++odZufgYR50Rw==}
+    engines: {node: '>=10.0.0'}
+    peerDependencies:
+      bufferutil: ^4.0.1
+      utf-8-validate: '>=5.0.2'
+    peerDependenciesMeta:
+      bufferutil:
+        optional: true
+      utf-8-validate:
+        optional: true
+
+  wsl-utils@0.3.1:
+    resolution: {integrity: sha512-g/eziiSUNBSsdDJtCLB8bdYEUMj4jR7AGeUo96p/3dTafgjHhpF4RiCFPiRILwjQoDXx5MqkBr4fwWtR3Ky4Wg==}
+    engines: {node: '>=20'}
 
   xdg-basedir@5.1.0:
     resolution: {integrity: sha512-GCPAHLvrIH13+c0SuacwvRYj2SxJXQ4kaVTT5xgL3kPrz56XxkF21IGhjSE1+W0aw7gpBWRGXLCPnPby6lSpmQ==}
     engines: {node: '>=12'}
 
-  xe-utils@3.5.32:
-    resolution: {integrity: sha512-R8ZT2lRnRBQO3pchM1za/Aru+/29DVDWD/OmOFODWWGkiQYz0iVIr8Bq8uKXS6zMhEsSqVCrn46bXzfe/Agjcw==}
+  xe-utils@3.9.1:
+    resolution: {integrity: sha512-Ujk5UmoH6Iaqhgz3oGwfCXVcMdUJKlXnfvLABdnMyseMG0eHsX2mcCvLd/8sGlIXtfwsprI9bW7vgcVognLmqQ==}
 
-  xgplayer-subtitles@3.0.24:
-    resolution: {integrity: sha512-yrHROepD9kTGWiTSxBjh+TGaK9orQOHQ1GUxWFOkQzO8BLl/pcIAqqJkHiAoP0j+eU8VdIhpb55oJRIkTTWPsA==}
+  xe-utils@4.0.12:
+    resolution: {integrity: sha512-4y2OXEVlXHoBMSyzdAcXDM9oyb8EL9U4LIEq642JO0liULVpC9U5aEiVv2xbS9hhoebYCMdZZYASqh/7H5Wd0Q==}
+
+  xgplayer-subtitles@3.0.26:
+    resolution: {integrity: sha512-HiHlw3E8emEQCv0xFYHdmNUFgyzyWGBnSNmyI/fkuuvRBb+4IbsCfxg6PF3r1TNCfzOuNzA/OaMbtXBSH8n/Bw==}
     peerDependencies:
       core-js: '>=3.12.1'
 
-  xgplayer@3.0.24:
-    resolution: {integrity: sha512-rK3hoJ+1Pbl9PUCHgeJv1GnOQF28BKLQFTBxdvi0pHsibJeXaDUf51SLFcgNVAPN15aDYcjJgaSf7LQ0RfEFPQ==}
+  xgplayer@3.0.26:
+    resolution: {integrity: sha512-F/urLGIrxCa1DI+wtkPyT0TcRS6Wejbo+OZKOTlSVvg0+SGyN3TfSXddNcu6LL876ZTWzlEwhS4C5nKSUV5FZw==}
     peerDependencies:
       core-js: '>=3.12.1'
 
@@ -9972,9 +12008,13 @@ packages:
     engines: {node: '>=0.8'}
     hasBin: true
 
-  xml-name-validator@4.0.0:
-    resolution: {integrity: sha512-ICP2e+jsHvAj2E2lIHxa5tjXRlKDJo4IdvPvCXbXQGdzSfmSpNVyIKMvoZHjDY9DP0zV17iI85o90vRFXNccRw==}
-    engines: {node: '>=12'}
+  xml-name-validator@5.0.0:
+    resolution: {integrity: sha512-EvGK8EJ3DhaHfbRlETOWAS5pO9MZITeauHKJyb8wyajUfQUenkIg2MvLDTZ4T/TgIcm3HU0TFBgWWboAZ30UHg==}
+    engines: {node: '>=18'}
+
+  xmlbuilder@15.1.1:
+    resolution: {integrity: sha512-yMqGBqtXyeN1e3TGYvgNgDVZ3j84W4cwkOXQswghol6APgZWaff9lnbvN7MHYJOiXsvGPXtjTYJEiC9J2wv9Eg==}
+    engines: {node: '>=8.0'}
 
   xmlchars@2.2.0:
     resolution: {integrity: sha512-JZnDKK8B0RCDw84FNdDAIpZK+JuJw+s7Lz8nksI7SIuU3UXJJslUthsi+uWBUYOwPFwW7W7PRLRfUKpxjtjFCw==}
@@ -10001,58 +12041,70 @@ packages:
     resolution: {integrity: sha512-YgvUTfwqyc7UXVMrB+SImsVYSmTS8X/tSrtdNZMImM+n7+QTriRXyXim0mBrTXNeqzVF0KWGgHPeiyViFFrNDw==}
     engines: {node: '>=18'}
 
-  yaml-ast-parser@0.0.43:
-    resolution: {integrity: sha512-2PTINUwsRqSd+s8XxKaJWQlUuEMHJQyEuh2edBbW8KNJz0SJPwUSD2zRWqezFEdN7IzAgeuYHFUCF7o8zRdZ0A==}
-
-  yaml-eslint-parser@1.2.3:
-    resolution: {integrity: sha512-4wZWvE398hCP7O8n3nXKu/vdq1HcH01ixYlCREaJL5NUMwQ0g3MaGFUBNSlmBtKmhbtVG/Cm6lyYmSVTEVil8A==}
+  yaml-eslint-parser@1.3.2:
+    resolution: {integrity: sha512-odxVsHAkZYYglR30aPYRY4nUGJnoJ2y1ww2HDvZALo0BDETv9kWbi16J52eHs+PWRNmF4ub6nZqfVOeesOvntg==}
     engines: {node: ^14.17.0 || >=16.0.0}
 
-  yaml@1.10.2:
-    resolution: {integrity: sha512-r3vXyErRCYJ7wg28yvBY5VSoAF8ZvlcW9/BwUzEtUsjvX/DKs24dIkuwjtuprwJJHsbyUbLApepYTR1BN4uHrg==}
-    engines: {node: '>= 6'}
+  yaml-eslint-parser@2.1.0:
+    resolution: {integrity: sha512-1zo9KRfp6vIAXBEhWAz09ex3hUwh3T+/6dGbGteHvNseA0Uk4FgQnPES55klZ6cDzSy9FpgKS0D/CoLUvCCj4w==}
+    engines: {node: ^20.19.0 || ^22.13.0 || >=24}
 
-  yaml@2.6.1:
-    resolution: {integrity: sha512-7r0XPzioN/Q9kXBro/XPnA6kznR73DHq+GXh5ON7ZozRO6aMjbmiBuKste2wslTFkC5d1dw0GooOCepZXJ2SAg==}
-    engines: {node: '>= 14'}
+  yaml@2.9.0:
+    resolution: {integrity: sha512-2AvhNX3mb8zd6Zy7INTtSpl1F15HW6Wnqj0srWlkKLcpYl/gMIMJiyuGq2KeI2YFxUPjdlB+3Lc10seMLtL4cA==}
+    engines: {node: '>= 14.6'}
     hasBin: true
 
   yargs-parser@18.1.3:
     resolution: {integrity: sha512-o50j0JeToy/4K6OZcaQmW6lyXXKhq7csREXcDwk2omFPJEwUNOVtJKvmDr9EI1fAJZUyZcRF7kxGBWmRXudrCQ==}
     engines: {node: '>=6'}
 
-  yargs-parser@20.2.9:
-    resolution: {integrity: sha512-y11nGElTIV+CT3Zv9t7VKl+Q3hTQoT9a1Qzezhhl6Rp21gJ/IVTW7Z3y9EWXhuUBC2Shnf+DX0antecpAwSP8w==}
-    engines: {node: '>=10'}
-
   yargs-parser@21.1.1:
     resolution: {integrity: sha512-tVpsJW7DdjecAiFpbIB1e3qxIQsE6NoPc5/eTdrbbIC4h0LVsWhnoa3g+m2HclBIujHzsxZ4VJVA+GUuc2/LBw==}
     engines: {node: '>=12'}
 
+  yargs-parser@22.0.0:
+    resolution: {integrity: sha512-rwu/ClNdSMpkSrUb+d6BRsSkLUq1fmfsY6TOpYzTwvwkg1/NRG85KBy3kq++A8LKQwX6lsu+aWad+2khvuXrqw==}
+    engines: {node: ^20.19.0 || ^22.12.0 || >=23}
+
   yargs@15.4.1:
     resolution: {integrity: sha512-aePbxDmcYW++PaqBsJ+HYUFwCdv4LVvdnhBy78E57PIor8/OVvhMrADFFEDh8DHDFRv/O9i3lPhsENjO7QX0+A==}
     engines: {node: '>=8'}
 
-  yargs@16.2.0:
-    resolution: {integrity: sha512-D1mvvtDG0L5ft/jGWkLpG1+m0eQxOfaBvTNELraWj22wSVUMWxZUvYgJYcKh6jGGIkJFhH4IZPQhR4TKpc8mBw==}
-    engines: {node: '>=10'}
-
-  yargs@17.7.2:
-    resolution: {integrity: sha512-7dSzzRQ++CKnNI/krKnYRV7JKKPUXMEh61soaHKg9mrWEhzFWhFnxPxGl+69cD1Ou63C13NUPCnmIcrvqCuM6w==}
+  yargs@17.7.3:
+    resolution: {integrity: sha512-GZtjxm/J/4TSxuL3FNYjCmLktBTnIw/rVmKSIyKeYAZpmJB2ig9VauCC5xsa82GNKVKDAqpOn3KVzNt0zmrU0g==}
     engines: {node: '>=12'}
 
+  yargs@18.1.0:
+    resolution: {integrity: sha512-2rAgRKu54VsHkqI0/tYkmluGXHD4KW7yZoycuqDQ15QOTnc2VVfy0nN/1eMhnQLO00A+dwtK20xuCnc1YGeUyg==}
+    engines: {node: ^20.19.0 || ^22.12.0 || >=23}
+
   yocto-queue@0.1.0:
     resolution: {integrity: sha512-rVksvsnNCdJ/ohGc6xgPwyN8eheCxsiLM8mxuE/t/mOVqJewPuO1miLpTHQiRgTKCLexL4MeAFVagts7HmNZ2Q==}
     engines: {node: '>=10'}
 
-  yocto-queue@1.1.1:
-    resolution: {integrity: sha512-b4JR1PFR10y1mKjhHY9LaGo6tmrgjit7hxVIeAmyMw3jegXR4dhYqLaQF5zMXZxY7tLpMyJeLjr1C4rLmkVe8g==}
+  yocto-queue@1.2.2:
+    resolution: {integrity: sha512-4LCcse/U2MHZ63HAJVE+v71o7yOdIe4cZ70Wpf8D/IyjDKYQLV5GD46B+hSTjJsvV5PztjvHoU580EftxjDZFQ==}
     engines: {node: '>=12.20'}
 
-  yoctocolors@2.1.1:
-    resolution: {integrity: sha512-GQHQqAopRhwU8Kt1DDM8NjibDXHC8eoh1erhGAJPEyveY9qqVeXvVikNKrDz69sHowPMorbPUrH/mx8c50eiBQ==}
+  yoctocolors@2.2.0:
+    resolution: {integrity: sha512-xYqdZFUK/VYazNl/oCDYN+3WloWQwMfZxBoiNt6qNyk+xfOdi598muWE42rNZFp1kNOiqW936q5RhUdnpqElSg==}
     engines: {node: '>=18'}
 
+  youch-core@0.3.3:
+    resolution: {integrity: sha512-ho7XuGjLaJ2hWHoK8yFnsUGy2Y5uDpqSTq1FkHLK4/oqKtyUU1AFbOOxY4IpC9f0fTLjwYbslUz0Po5BpD1wrA==}
+
+  youch@4.1.1:
+    resolution: {integrity: sha512-mxW3qiSnl+GRxXsaUMzv2Mbada1Y8CDltET9UxejDQe6DBYlSekghl5U5K0ReAikcHDi0G1vKZEmmo/NWAGKLA==}
+
+  yuku-ast@0.8.4:
+    resolution: {integrity: sha512-s7EWfWIQkaGmsGnyr/BU0jli9YTN5TvrKIsSmALyRD9elumDQInuhv0BrVObENKVCxr9W3Ikmnx5u02KvfuUmw==}
+
+  yuku-codegen@0.8.4:
+    resolution: {integrity: sha512-1Rw+NYcmB1xkHAWlsIpbwIv/Fr50idtEbLf7OjDA+90dny6PM4Krz7Fs0TT+w2PBdjaldZpN4ye5wR4Dhlm8vA==}
+
+  yuku-parser@0.8.4:
+    resolution: {integrity: sha512-sw41wouvT5rUmLIp87hmvm5vtF+MRSI3x6yjq6xqpYmtkQj+Ht6N7xRQ8lMhLv8N7JAzughGj0Rfi0jQRSu9HQ==}
+
   zip-stream@4.1.1:
     resolution: {integrity: sha512-9qv4rlDiopXg4E69k+vMHjNN63YFMe9sZMrdlvKnCjlCRWeCBswPPMPUfx+ipsAWq1LXHe70RcbaHdJJpS6hyQ==}
     engines: {node: '>= 10'}
@@ -10061,790 +12113,883 @@ packages:
     resolution: {integrity: sha512-zK7YHHz4ZXpW89AHXUPbQVGKI7uvkd3hzusTdotCg1UxyaVtg0zFJSTfW/Dq5f7OBBVnq6cZIaC8Ti4hb6dtCA==}
     engines: {node: '>= 14'}
 
-  zod-defaults@0.1.3:
-    resolution: {integrity: sha512-Cp4UjuVfXqwaOx8A5LlM0IRBZs8B7AXgF+XOZWF8CjMDhsY/Jki+y7VS4adVtQj9NNSsAPwylUlJp9INuxPEnA==}
+  zip-stream@7.0.5:
+    resolution: {integrity: sha512-dSvYKdvLsAHCDqPOhIwk/q5CvuWtTB3Dgpoe0uVEFjTzIOAmsQpprX25InCvrvJsirEbu1OHyy67n/kAj1Sw/w==}
+    engines: {node: '>=18'}
+
+  zod-defaults@0.2.3:
+    resolution: {integrity: sha512-7pYkOH1/c+Ril5AZUYtsbhMkehkI8CMqzFZ7YZXfC9SMLRvZuLyonQE7BAIVSNxeTpqTZmW5BLxGSzWMnKNdIw==}
     peerDependencies:
-      zod: ^3.23.8
+      zod: ^4.1.12
 
-  zod@3.24.1:
-    resolution: {integrity: sha512-muH7gBL9sI1nciMZV67X5fTKKBLtwpZ5VBp1vsOQzj1MhrBZ4wlVCm3gedKZWLp0Oyel8sIGfeiz54Su+OVT+A==}
+  zod@4.4.3:
+    resolution: {integrity: sha512-ytENFjIJFl2UwYglde2jchW2Hwm4GJFLDiSXWdTrJQBIN9Fcyp7n4DhxJEiWNAJMV1/BqWfW/kkg71UDcHJyTQ==}
 
-  zrender@5.6.0:
-    resolution: {integrity: sha512-uzgraf4njmmHAbEUxMJ8Oxg+P3fT04O+9p7gY+wJRVxo8Ge+KmYv0WJev945EH4wFuc4OY2NLXz46FZrWS9xJg==}
+  zrender@6.1.0:
+    resolution: {integrity: sha512-oEGMDB6pOP2S6OwRR4PdVv610zrjnA3Bh+JnSG12fYJlBKjtNAoEb5fSUoCOOINlH96I2fU38/A2UpRKs67xYQ==}
 
-  zx@8.2.4:
-    resolution: {integrity: sha512-g9wVU+5+M+zVen/3IyAZfsZFmeqb6vDfjqFggakviz5uLK7OAejOirX+jeTOkyvAh/OYRlCgw+SdqzN7F61QVQ==}
+  zx@8.8.5:
+    resolution: {integrity: sha512-SNgDF5L0gfN7FwVOdEFguY3orU5AkfFZm9B5YSHog/UDHv+lvmd82ZAsOenOkQixigwH2+yyH198AwNdKhj+RA==}
     engines: {node: '>= 12.17.0'}
     hasBin: true
 
 snapshots:
 
-  '@alloc/quick-lru@5.2.0': {}
-
-  '@ampproject/remapping@2.3.0':
-    dependencies:
-      '@jridgewell/gen-mapping': 0.3.8
-      '@jridgewell/trace-mapping': 0.3.25
-
   '@ant-design/colors@6.0.0':
     dependencies:
-      '@ctrl/tinycolor': 4.1.0
+      '@ctrl/tinycolor': 4.2.0
 
-  '@ant-design/icons-svg@4.4.2': {}
+  '@ant-design/colors@7.2.1':
+    dependencies:
+      '@ant-design/fast-color': 2.0.6
 
-  '@ant-design/icons-vue@7.0.1(vue@3.5.13(typescript@5.7.2))':
+  '@ant-design/colors@8.0.1':
+    dependencies:
+      '@ant-design/fast-color': 3.0.1
+
+  '@ant-design/fast-color@2.0.6':
+    dependencies:
+      '@babel/runtime': 7.29.7
+
+  '@ant-design/fast-color@3.0.1': {}
+
+  '@ant-design/icons-svg@4.5.0': {}
+
+  '@ant-design/icons-vue@7.0.1(vue@3.5.41(typescript@6.0.3))':
     dependencies:
       '@ant-design/colors': 6.0.0
-      '@ant-design/icons-svg': 4.4.2
-      vue: 3.5.13(typescript@5.7.2)
+      '@ant-design/icons-svg': 4.5.0
+      vue: 3.5.41(typescript@6.0.3)
 
-  '@antfu/utils@0.7.10': {}
-
-  '@apideck/better-ajv-errors@0.3.6(ajv@8.17.1)':
+  '@antdv-next/cssinjs@1.0.6(vue@3.5.41(typescript@6.0.3))':
     dependencies:
-      ajv: 8.17.1
-      json-schema: 0.4.0
+      '@emotion/hash': 0.8.0
+      '@emotion/unitless': 0.7.5
+      '@v-c/util': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      csstype: 3.2.3
+      stylis: 4.4.0
+      vue: 3.5.41(typescript@6.0.3)
+
+  '@antdv-next/icons@1.1.1(vue@3.5.41(typescript@6.0.3))':
+    dependencies:
+      '@ant-design/colors': 7.2.1
+      '@ant-design/icons-svg': 4.5.0
+      '@v-c/util': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      vue: 3.5.41(typescript@6.0.3)
+
+  '@antfu/install-pkg@1.1.0':
+    dependencies:
+      package-manager-detector: 1.8.0
+      tinyexec: 1.3.0
+
+  '@apideck/better-ajv-errors@0.3.7(ajv@8.20.0)':
+    dependencies:
+      ajv: 8.20.0
       jsonpointer: 5.0.1
       leven: 3.1.0
 
-  '@ast-grep/napi-darwin-arm64@0.31.1':
+  '@ast-grep/napi-darwin-arm64@0.44.1':
     optional: true
 
-  '@ast-grep/napi-darwin-x64@0.31.1':
+  '@ast-grep/napi-darwin-x64@0.44.1':
     optional: true
 
-  '@ast-grep/napi-linux-arm64-gnu@0.31.1':
+  '@ast-grep/napi-linux-arm64-gnu@0.44.1':
     optional: true
 
-  '@ast-grep/napi-linux-arm64-musl@0.31.1':
+  '@ast-grep/napi-linux-arm64-musl@0.44.1':
     optional: true
 
-  '@ast-grep/napi-linux-x64-gnu@0.31.1':
+  '@ast-grep/napi-linux-x64-gnu@0.44.1':
     optional: true
 
-  '@ast-grep/napi-linux-x64-musl@0.31.1':
+  '@ast-grep/napi-linux-x64-musl@0.44.1':
     optional: true
 
-  '@ast-grep/napi-win32-arm64-msvc@0.31.1':
+  '@ast-grep/napi-win32-arm64-msvc@0.44.1':
     optional: true
 
-  '@ast-grep/napi-win32-ia32-msvc@0.31.1':
+  '@ast-grep/napi-win32-ia32-msvc@0.44.1':
     optional: true
 
-  '@ast-grep/napi-win32-x64-msvc@0.31.1':
+  '@ast-grep/napi-win32-x64-msvc@0.44.1':
     optional: true
 
-  '@ast-grep/napi@0.31.1':
+  '@ast-grep/napi@0.44.1':
     optionalDependencies:
-      '@ast-grep/napi-darwin-arm64': 0.31.1
-      '@ast-grep/napi-darwin-x64': 0.31.1
-      '@ast-grep/napi-linux-arm64-gnu': 0.31.1
-      '@ast-grep/napi-linux-arm64-musl': 0.31.1
-      '@ast-grep/napi-linux-x64-gnu': 0.31.1
-      '@ast-grep/napi-linux-x64-musl': 0.31.1
-      '@ast-grep/napi-win32-arm64-msvc': 0.31.1
-      '@ast-grep/napi-win32-ia32-msvc': 0.31.1
-      '@ast-grep/napi-win32-x64-msvc': 0.31.1
+      '@ast-grep/napi-darwin-arm64': 0.44.1
+      '@ast-grep/napi-darwin-x64': 0.44.1
+      '@ast-grep/napi-linux-arm64-gnu': 0.44.1
+      '@ast-grep/napi-linux-arm64-musl': 0.44.1
+      '@ast-grep/napi-linux-x64-gnu': 0.44.1
+      '@ast-grep/napi-linux-x64-musl': 0.44.1
+      '@ast-grep/napi-win32-arm64-msvc': 0.44.1
+      '@ast-grep/napi-win32-ia32-msvc': 0.44.1
+      '@ast-grep/napi-win32-x64-msvc': 0.44.1
 
-  '@babel/code-frame@7.26.2':
+  '@babel/code-frame@7.29.7':
     dependencies:
-      '@babel/helper-validator-identifier': 7.25.9
+      '@babel/helper-validator-identifier': 7.29.7
       js-tokens: 4.0.0
       picocolors: 1.1.1
 
-  '@babel/compat-data@7.26.3': {}
-
-  '@babel/core@7.26.0':
+  '@babel/code-frame@8.0.0':
     dependencies:
-      '@ampproject/remapping': 2.3.0
-      '@babel/code-frame': 7.26.2
-      '@babel/generator': 7.26.3
-      '@babel/helper-compilation-targets': 7.25.9
-      '@babel/helper-module-transforms': 7.26.0(@babel/core@7.26.0)
-      '@babel/helpers': 7.26.0
-      '@babel/parser': 7.26.3
-      '@babel/template': 7.25.9
-      '@babel/traverse': 7.26.4
-      '@babel/types': 7.26.3
+      '@babel/helper-validator-identifier': 8.0.4
+      js-tokens: 10.0.0
+    optional: true
+
+  '@babel/compat-data@7.29.7': {}
+
+  '@babel/core@7.29.7(supports-color@10.2.2)':
+    dependencies:
+      '@babel/code-frame': 7.29.7
+      '@babel/generator': 7.29.8
+      '@babel/helper-compilation-targets': 7.29.7
+      '@babel/helper-module-transforms': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
+      '@babel/helpers': 7.29.7
+      '@babel/parser': 7.29.8
+      '@babel/template': 7.29.7
+      '@babel/traverse': 7.29.8(supports-color@10.2.2)
+      '@babel/types': 7.29.8
+      '@jridgewell/remapping': 2.3.5
       convert-source-map: 2.0.0
-      debug: 4.4.0(supports-color@9.4.0)
+      debug: 4.4.3(supports-color@10.2.2)
       gensync: 1.0.0-beta.2
       json5: 2.2.3
       semver: 6.3.1
     transitivePeerDependencies:
       - supports-color
 
-  '@babel/generator@7.26.3':
+  '@babel/generator@7.29.8':
     dependencies:
-      '@babel/parser': 7.26.3
-      '@babel/types': 7.26.3
-      '@jridgewell/gen-mapping': 0.3.8
-      '@jridgewell/trace-mapping': 0.3.25
+      '@babel/parser': 7.29.8
+      '@babel/types': 7.29.8
+      '@jridgewell/gen-mapping': 0.3.13
+      '@jridgewell/trace-mapping': 0.3.31
       jsesc: 3.1.0
 
-  '@babel/helper-annotate-as-pure@7.25.9':
+  '@babel/generator@8.0.0':
     dependencies:
-      '@babel/types': 7.26.3
+      '@babel/parser': 8.0.4
+      '@babel/types': 8.0.4
+      '@jridgewell/gen-mapping': 0.3.13
+      '@jridgewell/trace-mapping': 0.3.31
+      '@types/jsesc': 2.5.1
+      jsesc: 3.1.0
 
-  '@babel/helper-compilation-targets@7.25.9':
+  '@babel/helper-annotate-as-pure@7.29.7':
     dependencies:
-      '@babel/compat-data': 7.26.3
-      '@babel/helper-validator-option': 7.25.9
-      browserslist: 4.24.3
+      '@babel/types': 7.29.8
+
+  '@babel/helper-compilation-targets@7.29.7':
+    dependencies:
+      '@babel/compat-data': 7.29.7
+      '@babel/helper-validator-option': 7.29.7
+      browserslist: 4.28.8
       lru-cache: 5.1.1
       semver: 6.3.1
 
-  '@babel/helper-create-class-features-plugin@7.25.9(@babel/core@7.26.0)':
+  '@babel/helper-create-class-features-plugin@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)':
     dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-annotate-as-pure': 7.25.9
-      '@babel/helper-member-expression-to-functions': 7.25.9
-      '@babel/helper-optimise-call-expression': 7.25.9
-      '@babel/helper-replace-supers': 7.25.9(@babel/core@7.26.0)
-      '@babel/helper-skip-transparent-expression-wrappers': 7.25.9
-      '@babel/traverse': 7.26.4
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-annotate-as-pure': 7.29.7
+      '@babel/helper-member-expression-to-functions': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-optimise-call-expression': 7.29.7
+      '@babel/helper-replace-supers': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
+      '@babel/helper-skip-transparent-expression-wrappers': 7.29.7(supports-color@10.2.2)
+      '@babel/traverse': 7.29.8(supports-color@10.2.2)
       semver: 6.3.1
     transitivePeerDependencies:
       - supports-color
 
-  '@babel/helper-create-regexp-features-plugin@7.26.3(@babel/core@7.26.0)':
+  '@babel/helper-create-regexp-features-plugin@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))':
     dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-annotate-as-pure': 7.25.9
-      regexpu-core: 6.2.0
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-annotate-as-pure': 7.29.7
+      regexpu-core: 6.4.0
       semver: 6.3.1
 
-  '@babel/helper-define-polyfill-provider@0.6.3(@babel/core@7.26.0)':
+  '@babel/helper-define-polyfill-provider@0.6.8(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)':
     dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-compilation-targets': 7.25.9
-      '@babel/helper-plugin-utils': 7.25.9
-      debug: 4.4.0(supports-color@9.4.0)
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-compilation-targets': 7.29.7
+      '@babel/helper-plugin-utils': 7.29.7
+      debug: 4.4.3(supports-color@10.2.2)
       lodash.debounce: 4.0.8
-      resolve: 1.22.10
+      resolve: 1.22.12
     transitivePeerDependencies:
       - supports-color
 
-  '@babel/helper-member-expression-to-functions@7.25.9':
+  '@babel/helper-globals@7.29.7': {}
+
+  '@babel/helper-member-expression-to-functions@7.29.7(supports-color@10.2.2)':
     dependencies:
-      '@babel/traverse': 7.26.4
-      '@babel/types': 7.26.3
+      '@babel/traverse': 7.29.8(supports-color@10.2.2)
+      '@babel/types': 7.29.8
     transitivePeerDependencies:
       - supports-color
 
-  '@babel/helper-module-imports@7.25.9':
+  '@babel/helper-module-imports@7.29.7(supports-color@10.2.2)':
     dependencies:
-      '@babel/traverse': 7.26.4
-      '@babel/types': 7.26.3
+      '@babel/traverse': 7.29.8(supports-color@10.2.2)
+      '@babel/types': 7.29.8
     transitivePeerDependencies:
       - supports-color
 
-  '@babel/helper-module-transforms@7.26.0(@babel/core@7.26.0)':
+  '@babel/helper-module-transforms@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)':
     dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-module-imports': 7.25.9
-      '@babel/helper-validator-identifier': 7.25.9
-      '@babel/traverse': 7.26.4
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-module-imports': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-validator-identifier': 7.29.7
+      '@babel/traverse': 7.29.8(supports-color@10.2.2)
     transitivePeerDependencies:
       - supports-color
 
-  '@babel/helper-optimise-call-expression@7.25.9':
+  '@babel/helper-optimise-call-expression@7.29.7':
     dependencies:
-      '@babel/types': 7.26.3
+      '@babel/types': 7.29.8
 
-  '@babel/helper-plugin-utils@7.25.9': {}
+  '@babel/helper-plugin-utils@7.29.7': {}
 
-  '@babel/helper-remap-async-to-generator@7.25.9(@babel/core@7.26.0)':
+  '@babel/helper-remap-async-to-generator@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)':
     dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-annotate-as-pure': 7.25.9
-      '@babel/helper-wrap-function': 7.25.9
-      '@babel/traverse': 7.26.4
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-annotate-as-pure': 7.29.7
+      '@babel/helper-wrap-function': 7.29.7(supports-color@10.2.2)
+      '@babel/traverse': 7.29.8(supports-color@10.2.2)
     transitivePeerDependencies:
       - supports-color
 
-  '@babel/helper-replace-supers@7.25.9(@babel/core@7.26.0)':
+  '@babel/helper-replace-supers@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)':
     dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-member-expression-to-functions': 7.25.9
-      '@babel/helper-optimise-call-expression': 7.25.9
-      '@babel/traverse': 7.26.4
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-member-expression-to-functions': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-optimise-call-expression': 7.29.7
+      '@babel/traverse': 7.29.8(supports-color@10.2.2)
     transitivePeerDependencies:
       - supports-color
 
-  '@babel/helper-skip-transparent-expression-wrappers@7.25.9':
+  '@babel/helper-skip-transparent-expression-wrappers@7.29.7(supports-color@10.2.2)':
     dependencies:
-      '@babel/traverse': 7.26.4
-      '@babel/types': 7.26.3
+      '@babel/traverse': 7.29.8(supports-color@10.2.2)
+      '@babel/types': 7.29.8
     transitivePeerDependencies:
       - supports-color
 
-  '@babel/helper-string-parser@7.25.9': {}
+  '@babel/helper-string-parser@7.29.7': {}
 
-  '@babel/helper-validator-identifier@7.25.9': {}
+  '@babel/helper-string-parser@8.0.0': {}
 
-  '@babel/helper-validator-option@7.25.9': {}
+  '@babel/helper-validator-identifier@7.29.7': {}
 
-  '@babel/helper-wrap-function@7.25.9':
+  '@babel/helper-validator-identifier@8.0.4': {}
+
+  '@babel/helper-validator-option@7.29.7': {}
+
+  '@babel/helper-wrap-function@7.29.7(supports-color@10.2.2)':
     dependencies:
-      '@babel/template': 7.25.9
-      '@babel/traverse': 7.26.4
-      '@babel/types': 7.26.3
+      '@babel/template': 7.29.7
+      '@babel/traverse': 7.29.8(supports-color@10.2.2)
+      '@babel/types': 7.29.8
     transitivePeerDependencies:
       - supports-color
 
-  '@babel/helpers@7.26.0':
+  '@babel/helpers@7.29.7':
     dependencies:
-      '@babel/template': 7.25.9
-      '@babel/types': 7.26.3
+      '@babel/template': 7.29.7
+      '@babel/types': 7.29.8
 
-  '@babel/parser@7.26.3':
+  '@babel/parser@7.29.8':
     dependencies:
-      '@babel/types': 7.26.3
+      '@babel/types': 7.29.8
 
-  '@babel/plugin-bugfix-firefox-class-in-computed-class-key@7.25.9(@babel/core@7.26.0)':
+  '@babel/parser@8.0.4':
     dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-plugin-utils': 7.25.9
-      '@babel/traverse': 7.26.4
+      '@babel/types': 8.0.4
+
+  '@babel/plugin-bugfix-firefox-class-in-computed-class-key@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)':
+    dependencies:
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
+      '@babel/traverse': 7.29.8(supports-color@10.2.2)
     transitivePeerDependencies:
       - supports-color
 
-  '@babel/plugin-bugfix-safari-class-field-initializer-scope@7.25.9(@babel/core@7.26.0)':
+  '@babel/plugin-bugfix-safari-class-field-initializer-scope@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))':
     dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-plugin-utils': 7.25.9
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
 
-  '@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression@7.25.9(@babel/core@7.26.0)':
+  '@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))':
     dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-plugin-utils': 7.25.9
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
 
-  '@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining@7.25.9(@babel/core@7.26.0)':
+  '@babel/plugin-bugfix-safari-rest-destructuring-rhs-array@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)':
     dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-plugin-utils': 7.25.9
-      '@babel/helper-skip-transparent-expression-wrappers': 7.25.9
-      '@babel/plugin-transform-optional-chaining': 7.25.9(@babel/core@7.26.0)
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
+      '@babel/helper-skip-transparent-expression-wrappers': 7.29.7(supports-color@10.2.2)
     transitivePeerDependencies:
       - supports-color
 
-  '@babel/plugin-bugfix-v8-static-class-fields-redefine-readonly@7.25.9(@babel/core@7.26.0)':
+  '@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)':
     dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-plugin-utils': 7.25.9
-      '@babel/traverse': 7.26.4
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
+      '@babel/helper-skip-transparent-expression-wrappers': 7.29.7(supports-color@10.2.2)
+      '@babel/plugin-transform-optional-chaining': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
     transitivePeerDependencies:
       - supports-color
 
-  '@babel/plugin-proposal-decorators@7.25.9(@babel/core@7.26.0)':
+  '@babel/plugin-bugfix-v8-static-class-fields-redefine-readonly@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)':
     dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-create-class-features-plugin': 7.25.9(@babel/core@7.26.0)
-      '@babel/helper-plugin-utils': 7.25.9
-      '@babel/plugin-syntax-decorators': 7.25.9(@babel/core@7.26.0)
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
+      '@babel/traverse': 7.29.8(supports-color@10.2.2)
     transitivePeerDependencies:
       - supports-color
 
-  '@babel/plugin-proposal-private-property-in-object@7.21.0-placeholder-for-preset-env.2(@babel/core@7.26.0)':
+  '@babel/plugin-proposal-decorators@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)':
     dependencies:
-      '@babel/core': 7.26.0
-
-  '@babel/plugin-syntax-decorators@7.25.9(@babel/core@7.26.0)':
-    dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-plugin-utils': 7.25.9
-
-  '@babel/plugin-syntax-import-assertions@7.26.0(@babel/core@7.26.0)':
-    dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-plugin-utils': 7.25.9
-
-  '@babel/plugin-syntax-import-attributes@7.26.0(@babel/core@7.26.0)':
-    dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-plugin-utils': 7.25.9
-
-  '@babel/plugin-syntax-import-meta@7.10.4(@babel/core@7.26.0)':
-    dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-plugin-utils': 7.25.9
-
-  '@babel/plugin-syntax-jsx@7.25.9(@babel/core@7.26.0)':
-    dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-plugin-utils': 7.25.9
-
-  '@babel/plugin-syntax-typescript@7.25.9(@babel/core@7.26.0)':
-    dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-plugin-utils': 7.25.9
-
-  '@babel/plugin-syntax-unicode-sets-regex@7.18.6(@babel/core@7.26.0)':
-    dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-create-regexp-features-plugin': 7.26.3(@babel/core@7.26.0)
-      '@babel/helper-plugin-utils': 7.25.9
-
-  '@babel/plugin-transform-arrow-functions@7.25.9(@babel/core@7.26.0)':
-    dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-plugin-utils': 7.25.9
-
-  '@babel/plugin-transform-async-generator-functions@7.25.9(@babel/core@7.26.0)':
-    dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-plugin-utils': 7.25.9
-      '@babel/helper-remap-async-to-generator': 7.25.9(@babel/core@7.26.0)
-      '@babel/traverse': 7.26.4
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-create-class-features-plugin': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
+      '@babel/plugin-syntax-decorators': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))
     transitivePeerDependencies:
       - supports-color
 
-  '@babel/plugin-transform-async-to-generator@7.25.9(@babel/core@7.26.0)':
+  '@babel/plugin-proposal-private-property-in-object@7.21.0-placeholder-for-preset-env.2(@babel/core@7.29.7(supports-color@10.2.2))':
     dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-module-imports': 7.25.9
-      '@babel/helper-plugin-utils': 7.25.9
-      '@babel/helper-remap-async-to-generator': 7.25.9(@babel/core@7.26.0)
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+
+  '@babel/plugin-syntax-decorators@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))':
+    dependencies:
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
+
+  '@babel/plugin-syntax-import-assertions@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))':
+    dependencies:
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
+
+  '@babel/plugin-syntax-import-attributes@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))':
+    dependencies:
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
+
+  '@babel/plugin-syntax-import-meta@7.10.4(@babel/core@7.29.7(supports-color@10.2.2))':
+    dependencies:
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
+
+  '@babel/plugin-syntax-jsx@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))':
+    dependencies:
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
+
+  '@babel/plugin-syntax-typescript@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))':
+    dependencies:
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
+
+  '@babel/plugin-syntax-unicode-sets-regex@7.18.6(@babel/core@7.29.7(supports-color@10.2.2))':
+    dependencies:
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-create-regexp-features-plugin': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))
+      '@babel/helper-plugin-utils': 7.29.7
+
+  '@babel/plugin-transform-arrow-functions@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))':
+    dependencies:
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
+
+  '@babel/plugin-transform-async-generator-functions@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)':
+    dependencies:
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
+      '@babel/helper-remap-async-to-generator': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
+      '@babel/traverse': 7.29.8(supports-color@10.2.2)
     transitivePeerDependencies:
       - supports-color
 
-  '@babel/plugin-transform-block-scoped-functions@7.25.9(@babel/core@7.26.0)':
+  '@babel/plugin-transform-async-to-generator@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)':
     dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-plugin-utils': 7.25.9
-
-  '@babel/plugin-transform-block-scoping@7.25.9(@babel/core@7.26.0)':
-    dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-plugin-utils': 7.25.9
-
-  '@babel/plugin-transform-class-properties@7.25.9(@babel/core@7.26.0)':
-    dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-create-class-features-plugin': 7.25.9(@babel/core@7.26.0)
-      '@babel/helper-plugin-utils': 7.25.9
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-module-imports': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
+      '@babel/helper-remap-async-to-generator': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
     transitivePeerDependencies:
       - supports-color
 
-  '@babel/plugin-transform-class-static-block@7.26.0(@babel/core@7.26.0)':
+  '@babel/plugin-transform-block-scoped-functions@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))':
     dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-create-class-features-plugin': 7.25.9(@babel/core@7.26.0)
-      '@babel/helper-plugin-utils': 7.25.9
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
+
+  '@babel/plugin-transform-block-scoping@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))':
+    dependencies:
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
+
+  '@babel/plugin-transform-class-properties@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)':
+    dependencies:
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-create-class-features-plugin': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
     transitivePeerDependencies:
       - supports-color
 
-  '@babel/plugin-transform-classes@7.25.9(@babel/core@7.26.0)':
+  '@babel/plugin-transform-class-static-block@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)':
     dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-annotate-as-pure': 7.25.9
-      '@babel/helper-compilation-targets': 7.25.9
-      '@babel/helper-plugin-utils': 7.25.9
-      '@babel/helper-replace-supers': 7.25.9(@babel/core@7.26.0)
-      '@babel/traverse': 7.26.4
-      globals: 11.12.0
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-create-class-features-plugin': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
     transitivePeerDependencies:
       - supports-color
 
-  '@babel/plugin-transform-computed-properties@7.25.9(@babel/core@7.26.0)':
+  '@babel/plugin-transform-classes@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)':
     dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-plugin-utils': 7.25.9
-      '@babel/template': 7.25.9
-
-  '@babel/plugin-transform-destructuring@7.25.9(@babel/core@7.26.0)':
-    dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-plugin-utils': 7.25.9
-
-  '@babel/plugin-transform-dotall-regex@7.25.9(@babel/core@7.26.0)':
-    dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-create-regexp-features-plugin': 7.26.3(@babel/core@7.26.0)
-      '@babel/helper-plugin-utils': 7.25.9
-
-  '@babel/plugin-transform-duplicate-keys@7.25.9(@babel/core@7.26.0)':
-    dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-plugin-utils': 7.25.9
-
-  '@babel/plugin-transform-duplicate-named-capturing-groups-regex@7.25.9(@babel/core@7.26.0)':
-    dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-create-regexp-features-plugin': 7.26.3(@babel/core@7.26.0)
-      '@babel/helper-plugin-utils': 7.25.9
-
-  '@babel/plugin-transform-dynamic-import@7.25.9(@babel/core@7.26.0)':
-    dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-plugin-utils': 7.25.9
-
-  '@babel/plugin-transform-exponentiation-operator@7.26.3(@babel/core@7.26.0)':
-    dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-plugin-utils': 7.25.9
-
-  '@babel/plugin-transform-export-namespace-from@7.25.9(@babel/core@7.26.0)':
-    dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-plugin-utils': 7.25.9
-
-  '@babel/plugin-transform-for-of@7.25.9(@babel/core@7.26.0)':
-    dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-plugin-utils': 7.25.9
-      '@babel/helper-skip-transparent-expression-wrappers': 7.25.9
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-annotate-as-pure': 7.29.7
+      '@babel/helper-compilation-targets': 7.29.7
+      '@babel/helper-globals': 7.29.7
+      '@babel/helper-plugin-utils': 7.29.7
+      '@babel/helper-replace-supers': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
+      '@babel/traverse': 7.29.8(supports-color@10.2.2)
     transitivePeerDependencies:
       - supports-color
 
-  '@babel/plugin-transform-function-name@7.25.9(@babel/core@7.26.0)':
+  '@babel/plugin-transform-computed-properties@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))':
     dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-compilation-targets': 7.25.9
-      '@babel/helper-plugin-utils': 7.25.9
-      '@babel/traverse': 7.26.4
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
+      '@babel/template': 7.29.7
+
+  '@babel/plugin-transform-destructuring@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)':
+    dependencies:
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
+      '@babel/traverse': 7.29.8(supports-color@10.2.2)
     transitivePeerDependencies:
       - supports-color
 
-  '@babel/plugin-transform-json-strings@7.25.9(@babel/core@7.26.0)':
+  '@babel/plugin-transform-dotall-regex@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))':
     dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-plugin-utils': 7.25.9
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-create-regexp-features-plugin': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))
+      '@babel/helper-plugin-utils': 7.29.7
 
-  '@babel/plugin-transform-literals@7.25.9(@babel/core@7.26.0)':
+  '@babel/plugin-transform-duplicate-keys@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))':
     dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-plugin-utils': 7.25.9
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
 
-  '@babel/plugin-transform-logical-assignment-operators@7.25.9(@babel/core@7.26.0)':
+  '@babel/plugin-transform-duplicate-named-capturing-groups-regex@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))':
     dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-plugin-utils': 7.25.9
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-create-regexp-features-plugin': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))
+      '@babel/helper-plugin-utils': 7.29.7
 
-  '@babel/plugin-transform-member-expression-literals@7.25.9(@babel/core@7.26.0)':
+  '@babel/plugin-transform-dynamic-import@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))':
     dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-plugin-utils': 7.25.9
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
 
-  '@babel/plugin-transform-modules-amd@7.25.9(@babel/core@7.26.0)':
+  '@babel/plugin-transform-explicit-resource-management@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)':
     dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-module-transforms': 7.26.0(@babel/core@7.26.0)
-      '@babel/helper-plugin-utils': 7.25.9
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
+      '@babel/plugin-transform-destructuring': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
     transitivePeerDependencies:
       - supports-color
 
-  '@babel/plugin-transform-modules-commonjs@7.26.3(@babel/core@7.26.0)':
+  '@babel/plugin-transform-exponentiation-operator@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))':
     dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-module-transforms': 7.26.0(@babel/core@7.26.0)
-      '@babel/helper-plugin-utils': 7.25.9
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
+
+  '@babel/plugin-transform-export-namespace-from@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))':
+    dependencies:
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
+
+  '@babel/plugin-transform-for-of@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)':
+    dependencies:
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
+      '@babel/helper-skip-transparent-expression-wrappers': 7.29.7(supports-color@10.2.2)
     transitivePeerDependencies:
       - supports-color
 
-  '@babel/plugin-transform-modules-systemjs@7.25.9(@babel/core@7.26.0)':
+  '@babel/plugin-transform-function-name@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)':
     dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-module-transforms': 7.26.0(@babel/core@7.26.0)
-      '@babel/helper-plugin-utils': 7.25.9
-      '@babel/helper-validator-identifier': 7.25.9
-      '@babel/traverse': 7.26.4
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-compilation-targets': 7.29.7
+      '@babel/helper-plugin-utils': 7.29.7
+      '@babel/traverse': 7.29.8(supports-color@10.2.2)
     transitivePeerDependencies:
       - supports-color
 
-  '@babel/plugin-transform-modules-umd@7.25.9(@babel/core@7.26.0)':
+  '@babel/plugin-transform-json-strings@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))':
     dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-module-transforms': 7.26.0(@babel/core@7.26.0)
-      '@babel/helper-plugin-utils': 7.25.9
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
+
+  '@babel/plugin-transform-literals@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))':
+    dependencies:
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
+
+  '@babel/plugin-transform-logical-assignment-operators@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))':
+    dependencies:
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
+
+  '@babel/plugin-transform-member-expression-literals@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))':
+    dependencies:
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
+
+  '@babel/plugin-transform-modules-amd@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)':
+    dependencies:
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-module-transforms': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
     transitivePeerDependencies:
       - supports-color
 
-  '@babel/plugin-transform-named-capturing-groups-regex@7.25.9(@babel/core@7.26.0)':
+  '@babel/plugin-transform-modules-commonjs@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)':
     dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-create-regexp-features-plugin': 7.26.3(@babel/core@7.26.0)
-      '@babel/helper-plugin-utils': 7.25.9
-
-  '@babel/plugin-transform-new-target@7.25.9(@babel/core@7.26.0)':
-    dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-plugin-utils': 7.25.9
-
-  '@babel/plugin-transform-nullish-coalescing-operator@7.25.9(@babel/core@7.26.0)':
-    dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-plugin-utils': 7.25.9
-
-  '@babel/plugin-transform-numeric-separator@7.25.9(@babel/core@7.26.0)':
-    dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-plugin-utils': 7.25.9
-
-  '@babel/plugin-transform-object-rest-spread@7.25.9(@babel/core@7.26.0)':
-    dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-compilation-targets': 7.25.9
-      '@babel/helper-plugin-utils': 7.25.9
-      '@babel/plugin-transform-parameters': 7.25.9(@babel/core@7.26.0)
-
-  '@babel/plugin-transform-object-super@7.25.9(@babel/core@7.26.0)':
-    dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-plugin-utils': 7.25.9
-      '@babel/helper-replace-supers': 7.25.9(@babel/core@7.26.0)
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-module-transforms': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
     transitivePeerDependencies:
       - supports-color
 
-  '@babel/plugin-transform-optional-catch-binding@7.25.9(@babel/core@7.26.0)':
+  '@babel/plugin-transform-modules-systemjs@7.29.8(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)':
     dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-plugin-utils': 7.25.9
-
-  '@babel/plugin-transform-optional-chaining@7.25.9(@babel/core@7.26.0)':
-    dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-plugin-utils': 7.25.9
-      '@babel/helper-skip-transparent-expression-wrappers': 7.25.9
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-module-transforms': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
+      '@babel/helper-validator-identifier': 7.29.7
+      '@babel/traverse': 7.29.8(supports-color@10.2.2)
     transitivePeerDependencies:
       - supports-color
 
-  '@babel/plugin-transform-parameters@7.25.9(@babel/core@7.26.0)':
+  '@babel/plugin-transform-modules-umd@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)':
     dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-plugin-utils': 7.25.9
-
-  '@babel/plugin-transform-private-methods@7.25.9(@babel/core@7.26.0)':
-    dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-create-class-features-plugin': 7.25.9(@babel/core@7.26.0)
-      '@babel/helper-plugin-utils': 7.25.9
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-module-transforms': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
     transitivePeerDependencies:
       - supports-color
 
-  '@babel/plugin-transform-private-property-in-object@7.25.9(@babel/core@7.26.0)':
+  '@babel/plugin-transform-named-capturing-groups-regex@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))':
     dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-annotate-as-pure': 7.25.9
-      '@babel/helper-create-class-features-plugin': 7.25.9(@babel/core@7.26.0)
-      '@babel/helper-plugin-utils': 7.25.9
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-create-regexp-features-plugin': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))
+      '@babel/helper-plugin-utils': 7.29.7
+
+  '@babel/plugin-transform-new-target@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))':
+    dependencies:
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
+
+  '@babel/plugin-transform-nullish-coalescing-operator@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))':
+    dependencies:
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
+
+  '@babel/plugin-transform-numeric-separator@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))':
+    dependencies:
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
+
+  '@babel/plugin-transform-object-rest-spread@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)':
+    dependencies:
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-compilation-targets': 7.29.7
+      '@babel/helper-plugin-utils': 7.29.7
+      '@babel/plugin-transform-destructuring': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
+      '@babel/plugin-transform-parameters': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))
+      '@babel/traverse': 7.29.8(supports-color@10.2.2)
     transitivePeerDependencies:
       - supports-color
 
-  '@babel/plugin-transform-property-literals@7.25.9(@babel/core@7.26.0)':
+  '@babel/plugin-transform-object-super@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)':
     dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-plugin-utils': 7.25.9
-
-  '@babel/plugin-transform-regenerator@7.25.9(@babel/core@7.26.0)':
-    dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-plugin-utils': 7.25.9
-      regenerator-transform: 0.15.2
-
-  '@babel/plugin-transform-regexp-modifiers@7.26.0(@babel/core@7.26.0)':
-    dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-create-regexp-features-plugin': 7.26.3(@babel/core@7.26.0)
-      '@babel/helper-plugin-utils': 7.25.9
-
-  '@babel/plugin-transform-reserved-words@7.25.9(@babel/core@7.26.0)':
-    dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-plugin-utils': 7.25.9
-
-  '@babel/plugin-transform-shorthand-properties@7.25.9(@babel/core@7.26.0)':
-    dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-plugin-utils': 7.25.9
-
-  '@babel/plugin-transform-spread@7.25.9(@babel/core@7.26.0)':
-    dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-plugin-utils': 7.25.9
-      '@babel/helper-skip-transparent-expression-wrappers': 7.25.9
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
+      '@babel/helper-replace-supers': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
     transitivePeerDependencies:
       - supports-color
 
-  '@babel/plugin-transform-sticky-regex@7.25.9(@babel/core@7.26.0)':
+  '@babel/plugin-transform-optional-catch-binding@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))':
     dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-plugin-utils': 7.25.9
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
 
-  '@babel/plugin-transform-template-literals@7.25.9(@babel/core@7.26.0)':
+  '@babel/plugin-transform-optional-chaining@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)':
     dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-plugin-utils': 7.25.9
-
-  '@babel/plugin-transform-typeof-symbol@7.25.9(@babel/core@7.26.0)':
-    dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-plugin-utils': 7.25.9
-
-  '@babel/plugin-transform-typescript@7.26.3(@babel/core@7.26.0)':
-    dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-annotate-as-pure': 7.25.9
-      '@babel/helper-create-class-features-plugin': 7.25.9(@babel/core@7.26.0)
-      '@babel/helper-plugin-utils': 7.25.9
-      '@babel/helper-skip-transparent-expression-wrappers': 7.25.9
-      '@babel/plugin-syntax-typescript': 7.25.9(@babel/core@7.26.0)
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
+      '@babel/helper-skip-transparent-expression-wrappers': 7.29.7(supports-color@10.2.2)
     transitivePeerDependencies:
       - supports-color
 
-  '@babel/plugin-transform-unicode-escapes@7.25.9(@babel/core@7.26.0)':
+  '@babel/plugin-transform-parameters@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))':
     dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-plugin-utils': 7.25.9
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
 
-  '@babel/plugin-transform-unicode-property-regex@7.25.9(@babel/core@7.26.0)':
+  '@babel/plugin-transform-private-methods@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)':
     dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-create-regexp-features-plugin': 7.26.3(@babel/core@7.26.0)
-      '@babel/helper-plugin-utils': 7.25.9
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-create-class-features-plugin': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
+    transitivePeerDependencies:
+      - supports-color
 
-  '@babel/plugin-transform-unicode-regex@7.25.9(@babel/core@7.26.0)':
+  '@babel/plugin-transform-private-property-in-object@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)':
     dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-create-regexp-features-plugin': 7.26.3(@babel/core@7.26.0)
-      '@babel/helper-plugin-utils': 7.25.9
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-annotate-as-pure': 7.29.7
+      '@babel/helper-create-class-features-plugin': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
+    transitivePeerDependencies:
+      - supports-color
 
-  '@babel/plugin-transform-unicode-sets-regex@7.25.9(@babel/core@7.26.0)':
+  '@babel/plugin-transform-property-literals@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))':
     dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-create-regexp-features-plugin': 7.26.3(@babel/core@7.26.0)
-      '@babel/helper-plugin-utils': 7.25.9
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
 
-  '@babel/preset-env@7.26.0(@babel/core@7.26.0)':
+  '@babel/plugin-transform-regenerator@7.29.8(@babel/core@7.29.7(supports-color@10.2.2))':
     dependencies:
-      '@babel/compat-data': 7.26.3
-      '@babel/core': 7.26.0
-      '@babel/helper-compilation-targets': 7.25.9
-      '@babel/helper-plugin-utils': 7.25.9
-      '@babel/helper-validator-option': 7.25.9
-      '@babel/plugin-bugfix-firefox-class-in-computed-class-key': 7.25.9(@babel/core@7.26.0)
-      '@babel/plugin-bugfix-safari-class-field-initializer-scope': 7.25.9(@babel/core@7.26.0)
-      '@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression': 7.25.9(@babel/core@7.26.0)
-      '@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining': 7.25.9(@babel/core@7.26.0)
-      '@babel/plugin-bugfix-v8-static-class-fields-redefine-readonly': 7.25.9(@babel/core@7.26.0)
-      '@babel/plugin-proposal-private-property-in-object': 7.21.0-placeholder-for-preset-env.2(@babel/core@7.26.0)
-      '@babel/plugin-syntax-import-assertions': 7.26.0(@babel/core@7.26.0)
-      '@babel/plugin-syntax-import-attributes': 7.26.0(@babel/core@7.26.0)
-      '@babel/plugin-syntax-unicode-sets-regex': 7.18.6(@babel/core@7.26.0)
-      '@babel/plugin-transform-arrow-functions': 7.25.9(@babel/core@7.26.0)
-      '@babel/plugin-transform-async-generator-functions': 7.25.9(@babel/core@7.26.0)
-      '@babel/plugin-transform-async-to-generator': 7.25.9(@babel/core@7.26.0)
-      '@babel/plugin-transform-block-scoped-functions': 7.25.9(@babel/core@7.26.0)
-      '@babel/plugin-transform-block-scoping': 7.25.9(@babel/core@7.26.0)
-      '@babel/plugin-transform-class-properties': 7.25.9(@babel/core@7.26.0)
-      '@babel/plugin-transform-class-static-block': 7.26.0(@babel/core@7.26.0)
-      '@babel/plugin-transform-classes': 7.25.9(@babel/core@7.26.0)
-      '@babel/plugin-transform-computed-properties': 7.25.9(@babel/core@7.26.0)
-      '@babel/plugin-transform-destructuring': 7.25.9(@babel/core@7.26.0)
-      '@babel/plugin-transform-dotall-regex': 7.25.9(@babel/core@7.26.0)
-      '@babel/plugin-transform-duplicate-keys': 7.25.9(@babel/core@7.26.0)
-      '@babel/plugin-transform-duplicate-named-capturing-groups-regex': 7.25.9(@babel/core@7.26.0)
-      '@babel/plugin-transform-dynamic-import': 7.25.9(@babel/core@7.26.0)
-      '@babel/plugin-transform-exponentiation-operator': 7.26.3(@babel/core@7.26.0)
-      '@babel/plugin-transform-export-namespace-from': 7.25.9(@babel/core@7.26.0)
-      '@babel/plugin-transform-for-of': 7.25.9(@babel/core@7.26.0)
-      '@babel/plugin-transform-function-name': 7.25.9(@babel/core@7.26.0)
-      '@babel/plugin-transform-json-strings': 7.25.9(@babel/core@7.26.0)
-      '@babel/plugin-transform-literals': 7.25.9(@babel/core@7.26.0)
-      '@babel/plugin-transform-logical-assignment-operators': 7.25.9(@babel/core@7.26.0)
-      '@babel/plugin-transform-member-expression-literals': 7.25.9(@babel/core@7.26.0)
-      '@babel/plugin-transform-modules-amd': 7.25.9(@babel/core@7.26.0)
-      '@babel/plugin-transform-modules-commonjs': 7.26.3(@babel/core@7.26.0)
-      '@babel/plugin-transform-modules-systemjs': 7.25.9(@babel/core@7.26.0)
-      '@babel/plugin-transform-modules-umd': 7.25.9(@babel/core@7.26.0)
-      '@babel/plugin-transform-named-capturing-groups-regex': 7.25.9(@babel/core@7.26.0)
-      '@babel/plugin-transform-new-target': 7.25.9(@babel/core@7.26.0)
-      '@babel/plugin-transform-nullish-coalescing-operator': 7.25.9(@babel/core@7.26.0)
-      '@babel/plugin-transform-numeric-separator': 7.25.9(@babel/core@7.26.0)
-      '@babel/plugin-transform-object-rest-spread': 7.25.9(@babel/core@7.26.0)
-      '@babel/plugin-transform-object-super': 7.25.9(@babel/core@7.26.0)
-      '@babel/plugin-transform-optional-catch-binding': 7.25.9(@babel/core@7.26.0)
-      '@babel/plugin-transform-optional-chaining': 7.25.9(@babel/core@7.26.0)
-      '@babel/plugin-transform-parameters': 7.25.9(@babel/core@7.26.0)
-      '@babel/plugin-transform-private-methods': 7.25.9(@babel/core@7.26.0)
-      '@babel/plugin-transform-private-property-in-object': 7.25.9(@babel/core@7.26.0)
-      '@babel/plugin-transform-property-literals': 7.25.9(@babel/core@7.26.0)
-      '@babel/plugin-transform-regenerator': 7.25.9(@babel/core@7.26.0)
-      '@babel/plugin-transform-regexp-modifiers': 7.26.0(@babel/core@7.26.0)
-      '@babel/plugin-transform-reserved-words': 7.25.9(@babel/core@7.26.0)
-      '@babel/plugin-transform-shorthand-properties': 7.25.9(@babel/core@7.26.0)
-      '@babel/plugin-transform-spread': 7.25.9(@babel/core@7.26.0)
-      '@babel/plugin-transform-sticky-regex': 7.25.9(@babel/core@7.26.0)
-      '@babel/plugin-transform-template-literals': 7.25.9(@babel/core@7.26.0)
-      '@babel/plugin-transform-typeof-symbol': 7.25.9(@babel/core@7.26.0)
-      '@babel/plugin-transform-unicode-escapes': 7.25.9(@babel/core@7.26.0)
-      '@babel/plugin-transform-unicode-property-regex': 7.25.9(@babel/core@7.26.0)
-      '@babel/plugin-transform-unicode-regex': 7.25.9(@babel/core@7.26.0)
-      '@babel/plugin-transform-unicode-sets-regex': 7.25.9(@babel/core@7.26.0)
-      '@babel/preset-modules': 0.1.6-no-external-plugins(@babel/core@7.26.0)
-      babel-plugin-polyfill-corejs2: 0.4.12(@babel/core@7.26.0)
-      babel-plugin-polyfill-corejs3: 0.10.6(@babel/core@7.26.0)
-      babel-plugin-polyfill-regenerator: 0.6.3(@babel/core@7.26.0)
-      core-js-compat: 3.39.0
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
+
+  '@babel/plugin-transform-regexp-modifiers@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))':
+    dependencies:
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-create-regexp-features-plugin': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))
+      '@babel/helper-plugin-utils': 7.29.7
+
+  '@babel/plugin-transform-reserved-words@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))':
+    dependencies:
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
+
+  '@babel/plugin-transform-shorthand-properties@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))':
+    dependencies:
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
+
+  '@babel/plugin-transform-spread@7.29.8(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)':
+    dependencies:
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
+      '@babel/helper-skip-transparent-expression-wrappers': 7.29.7(supports-color@10.2.2)
+    transitivePeerDependencies:
+      - supports-color
+
+  '@babel/plugin-transform-sticky-regex@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))':
+    dependencies:
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
+
+  '@babel/plugin-transform-template-literals@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))':
+    dependencies:
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
+
+  '@babel/plugin-transform-typeof-symbol@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))':
+    dependencies:
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
+
+  '@babel/plugin-transform-typescript@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)':
+    dependencies:
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-annotate-as-pure': 7.29.7
+      '@babel/helper-create-class-features-plugin': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
+      '@babel/helper-skip-transparent-expression-wrappers': 7.29.7(supports-color@10.2.2)
+      '@babel/plugin-syntax-typescript': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))
+    transitivePeerDependencies:
+      - supports-color
+
+  '@babel/plugin-transform-unicode-escapes@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))':
+    dependencies:
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
+
+  '@babel/plugin-transform-unicode-property-regex@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))':
+    dependencies:
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-create-regexp-features-plugin': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))
+      '@babel/helper-plugin-utils': 7.29.7
+
+  '@babel/plugin-transform-unicode-regex@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))':
+    dependencies:
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-create-regexp-features-plugin': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))
+      '@babel/helper-plugin-utils': 7.29.7
+
+  '@babel/plugin-transform-unicode-sets-regex@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))':
+    dependencies:
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-create-regexp-features-plugin': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))
+      '@babel/helper-plugin-utils': 7.29.7
+
+  '@babel/preset-env@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)':
+    dependencies:
+      '@babel/compat-data': 7.29.7
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-compilation-targets': 7.29.7
+      '@babel/helper-plugin-utils': 7.29.7
+      '@babel/helper-validator-option': 7.29.7
+      '@babel/plugin-bugfix-firefox-class-in-computed-class-key': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
+      '@babel/plugin-bugfix-safari-class-field-initializer-scope': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))
+      '@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))
+      '@babel/plugin-bugfix-safari-rest-destructuring-rhs-array': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
+      '@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
+      '@babel/plugin-bugfix-v8-static-class-fields-redefine-readonly': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
+      '@babel/plugin-proposal-private-property-in-object': 7.21.0-placeholder-for-preset-env.2(@babel/core@7.29.7(supports-color@10.2.2))
+      '@babel/plugin-syntax-import-assertions': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))
+      '@babel/plugin-syntax-import-attributes': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))
+      '@babel/plugin-syntax-unicode-sets-regex': 7.18.6(@babel/core@7.29.7(supports-color@10.2.2))
+      '@babel/plugin-transform-arrow-functions': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))
+      '@babel/plugin-transform-async-generator-functions': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
+      '@babel/plugin-transform-async-to-generator': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
+      '@babel/plugin-transform-block-scoped-functions': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))
+      '@babel/plugin-transform-block-scoping': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))
+      '@babel/plugin-transform-class-properties': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
+      '@babel/plugin-transform-class-static-block': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
+      '@babel/plugin-transform-classes': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
+      '@babel/plugin-transform-computed-properties': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))
+      '@babel/plugin-transform-destructuring': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
+      '@babel/plugin-transform-dotall-regex': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))
+      '@babel/plugin-transform-duplicate-keys': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))
+      '@babel/plugin-transform-duplicate-named-capturing-groups-regex': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))
+      '@babel/plugin-transform-dynamic-import': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))
+      '@babel/plugin-transform-explicit-resource-management': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
+      '@babel/plugin-transform-exponentiation-operator': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))
+      '@babel/plugin-transform-export-namespace-from': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))
+      '@babel/plugin-transform-for-of': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
+      '@babel/plugin-transform-function-name': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
+      '@babel/plugin-transform-json-strings': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))
+      '@babel/plugin-transform-literals': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))
+      '@babel/plugin-transform-logical-assignment-operators': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))
+      '@babel/plugin-transform-member-expression-literals': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))
+      '@babel/plugin-transform-modules-amd': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
+      '@babel/plugin-transform-modules-commonjs': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
+      '@babel/plugin-transform-modules-systemjs': 7.29.8(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
+      '@babel/plugin-transform-modules-umd': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
+      '@babel/plugin-transform-named-capturing-groups-regex': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))
+      '@babel/plugin-transform-new-target': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))
+      '@babel/plugin-transform-nullish-coalescing-operator': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))
+      '@babel/plugin-transform-numeric-separator': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))
+      '@babel/plugin-transform-object-rest-spread': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
+      '@babel/plugin-transform-object-super': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
+      '@babel/plugin-transform-optional-catch-binding': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))
+      '@babel/plugin-transform-optional-chaining': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
+      '@babel/plugin-transform-parameters': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))
+      '@babel/plugin-transform-private-methods': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
+      '@babel/plugin-transform-private-property-in-object': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
+      '@babel/plugin-transform-property-literals': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))
+      '@babel/plugin-transform-regenerator': 7.29.8(@babel/core@7.29.7(supports-color@10.2.2))
+      '@babel/plugin-transform-regexp-modifiers': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))
+      '@babel/plugin-transform-reserved-words': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))
+      '@babel/plugin-transform-shorthand-properties': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))
+      '@babel/plugin-transform-spread': 7.29.8(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
+      '@babel/plugin-transform-sticky-regex': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))
+      '@babel/plugin-transform-template-literals': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))
+      '@babel/plugin-transform-typeof-symbol': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))
+      '@babel/plugin-transform-unicode-escapes': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))
+      '@babel/plugin-transform-unicode-property-regex': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))
+      '@babel/plugin-transform-unicode-regex': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))
+      '@babel/plugin-transform-unicode-sets-regex': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))
+      '@babel/preset-modules': 0.1.6-no-external-plugins(@babel/core@7.29.7(supports-color@10.2.2))
+      babel-plugin-polyfill-corejs2: 0.4.17(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
+      babel-plugin-polyfill-corejs3: 0.14.2(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
+      babel-plugin-polyfill-regenerator: 0.6.8(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
+      core-js-compat: 3.50.0
       semver: 6.3.1
     transitivePeerDependencies:
       - supports-color
 
-  '@babel/preset-modules@0.1.6-no-external-plugins(@babel/core@7.26.0)':
+  '@babel/preset-modules@0.1.6-no-external-plugins(@babel/core@7.29.7(supports-color@10.2.2))':
     dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-plugin-utils': 7.25.9
-      '@babel/types': 7.26.3
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
+      '@babel/types': 7.29.8
       esutils: 2.0.3
 
-  '@babel/preset-typescript@7.26.0(@babel/core@7.26.0)':
+  '@babel/preset-typescript@7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)':
     dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-plugin-utils': 7.25.9
-      '@babel/helper-validator-option': 7.25.9
-      '@babel/plugin-syntax-jsx': 7.25.9(@babel/core@7.26.0)
-      '@babel/plugin-transform-modules-commonjs': 7.26.3(@babel/core@7.26.0)
-      '@babel/plugin-transform-typescript': 7.26.3(@babel/core@7.26.0)
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
+      '@babel/helper-validator-option': 7.29.7
+      '@babel/plugin-syntax-jsx': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))
+      '@babel/plugin-transform-modules-commonjs': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
+      '@babel/plugin-transform-typescript': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
     transitivePeerDependencies:
       - supports-color
 
-  '@babel/runtime@7.26.0':
-    dependencies:
-      regenerator-runtime: 0.14.1
+  '@babel/runtime@7.29.7': {}
 
-  '@babel/standalone@7.26.4': {}
-
-  '@babel/template@7.25.9':
+  '@babel/template@7.29.7':
     dependencies:
-      '@babel/code-frame': 7.26.2
-      '@babel/parser': 7.26.3
-      '@babel/types': 7.26.3
+      '@babel/code-frame': 7.29.7
+      '@babel/parser': 7.29.8
+      '@babel/types': 7.29.8
 
-  '@babel/traverse@7.26.4':
+  '@babel/traverse@7.29.8(supports-color@10.2.2)':
     dependencies:
-      '@babel/code-frame': 7.26.2
-      '@babel/generator': 7.26.3
-      '@babel/parser': 7.26.3
-      '@babel/template': 7.25.9
-      '@babel/types': 7.26.3
-      debug: 4.4.0(supports-color@9.4.0)
-      globals: 11.12.0
+      '@babel/code-frame': 7.29.7
+      '@babel/generator': 7.29.8
+      '@babel/helper-globals': 7.29.7
+      '@babel/parser': 7.29.8
+      '@babel/template': 7.29.7
+      '@babel/types': 7.29.8
+      debug: 4.4.3(supports-color@10.2.2)
     transitivePeerDependencies:
       - supports-color
 
-  '@babel/types@7.26.3':
+  '@babel/types@7.29.8':
     dependencies:
-      '@babel/helper-string-parser': 7.25.9
-      '@babel/helper-validator-identifier': 7.25.9
+      '@babel/helper-string-parser': 7.29.7
+      '@babel/helper-validator-identifier': 7.29.7
 
-  '@changesets/apply-release-plan@7.0.7':
+  '@babel/types@8.0.4':
     dependencies:
-      '@changesets/config': 3.0.5
+      '@babel/helper-string-parser': 8.0.0
+      '@babel/helper-validator-identifier': 8.0.4
+
+  '@bufbuild/protobuf@2.13.0': {}
+
+  '@cacheable/memory@2.2.0':
+    dependencies:
+      '@cacheable/utils': 2.5.0
+      '@keyv/bigmap': 1.3.1(keyv@5.6.0)
+      hookified: 1.15.1
+      keyv: 5.6.0
+
+  '@cacheable/utils@2.5.0':
+    dependencies:
+      hashery: 1.5.1
+      keyv: 5.6.0
+
+  '@changesets/apply-release-plan@7.1.1':
+    dependencies:
+      '@changesets/config': 3.1.4
       '@changesets/get-version-range-type': 0.4.0
-      '@changesets/git': 3.0.2
-      '@changesets/should-skip-package': 0.1.1
-      '@changesets/types': 6.0.0
+      '@changesets/git': 3.0.4
+      '@changesets/should-skip-package': 0.1.2
+      '@changesets/types': 6.1.0
       '@manypkg/get-packages': 1.1.3
       detect-indent: 6.1.0
       fs-extra: 7.0.1
@@ -10852,66 +12997,67 @@ snapshots:
       outdent: 0.5.0
       prettier: 2.8.8
       resolve-from: 5.0.0
-      semver: 7.6.3
+      semver: 7.8.5
 
-  '@changesets/assemble-release-plan@6.0.5':
+  '@changesets/assemble-release-plan@6.0.10':
     dependencies:
       '@changesets/errors': 0.2.0
-      '@changesets/get-dependents-graph': 2.1.2
-      '@changesets/should-skip-package': 0.1.1
-      '@changesets/types': 6.0.0
+      '@changesets/get-dependents-graph': 2.1.4
+      '@changesets/should-skip-package': 0.1.2
+      '@changesets/types': 6.1.0
       '@manypkg/get-packages': 1.1.3
-      semver: 7.6.3
+      semver: 7.8.5
 
-  '@changesets/changelog-git@0.2.0':
+  '@changesets/changelog-git@0.2.1':
     dependencies:
-      '@changesets/types': 6.0.0
+      '@changesets/types': 6.1.0
 
-  '@changesets/changelog-github@0.5.0(encoding@0.1.13)':
+  '@changesets/changelog-github@0.7.0':
     dependencies:
-      '@changesets/get-github-info': 0.6.0(encoding@0.1.13)
-      '@changesets/types': 6.0.0
+      '@changesets/get-github-info': 0.8.0
+      '@changesets/types': 6.1.0
       dotenv: 8.6.0
     transitivePeerDependencies:
       - encoding
 
-  '@changesets/cli@2.27.11':
+  '@changesets/cli@2.31.1(@types/node@25.9.5)':
     dependencies:
-      '@changesets/apply-release-plan': 7.0.7
-      '@changesets/assemble-release-plan': 6.0.5
-      '@changesets/changelog-git': 0.2.0
-      '@changesets/config': 3.0.5
+      '@changesets/apply-release-plan': 7.1.1
+      '@changesets/assemble-release-plan': 6.0.10
+      '@changesets/changelog-git': 0.2.1
+      '@changesets/config': 3.1.4
       '@changesets/errors': 0.2.0
-      '@changesets/get-dependents-graph': 2.1.2
-      '@changesets/get-release-plan': 4.0.6
-      '@changesets/git': 3.0.2
+      '@changesets/get-dependents-graph': 2.1.4
+      '@changesets/get-release-plan': 4.0.16
+      '@changesets/git': 3.0.4
       '@changesets/logger': 0.1.1
-      '@changesets/pre': 2.0.1
-      '@changesets/read': 0.6.2
-      '@changesets/should-skip-package': 0.1.1
-      '@changesets/types': 6.0.0
-      '@changesets/write': 0.3.2
+      '@changesets/pre': 2.0.2
+      '@changesets/read': 0.6.7
+      '@changesets/should-skip-package': 0.1.2
+      '@changesets/types': 6.1.0
+      '@changesets/write': 0.4.0
+      '@inquirer/external-editor': 1.0.3(@types/node@25.9.5)
       '@manypkg/get-packages': 1.1.3
       ansi-colors: 4.1.3
-      ci-info: 3.9.0
       enquirer: 2.4.1
-      external-editor: 3.1.0
       fs-extra: 7.0.1
       mri: 1.2.0
-      p-limit: 2.3.0
-      package-manager-detector: 0.2.7
+      package-manager-detector: 0.2.11
       picocolors: 1.1.1
       resolve-from: 5.0.0
-      semver: 7.6.3
+      semver: 7.8.5
       spawndamnit: 3.0.1
       term-size: 2.2.1
+    transitivePeerDependencies:
+      - '@types/node'
 
-  '@changesets/config@3.0.5':
+  '@changesets/config@3.1.4':
     dependencies:
       '@changesets/errors': 0.2.0
-      '@changesets/get-dependents-graph': 2.1.2
+      '@changesets/get-dependents-graph': 2.1.4
       '@changesets/logger': 0.1.1
-      '@changesets/types': 6.0.0
+      '@changesets/should-skip-package': 0.1.2
+      '@changesets/types': 6.1.0
       '@manypkg/get-packages': 1.1.3
       fs-extra: 7.0.1
       micromatch: 4.0.8
@@ -10920,32 +13066,32 @@ snapshots:
     dependencies:
       extendable-error: 0.1.7
 
-  '@changesets/get-dependents-graph@2.1.2':
+  '@changesets/get-dependents-graph@2.1.4':
     dependencies:
-      '@changesets/types': 6.0.0
+      '@changesets/types': 6.1.0
       '@manypkg/get-packages': 1.1.3
       picocolors: 1.1.1
-      semver: 7.6.3
+      semver: 7.8.5
 
-  '@changesets/get-github-info@0.6.0(encoding@0.1.13)':
+  '@changesets/get-github-info@0.8.0':
     dependencies:
       dataloader: 1.4.0
-      node-fetch: 2.7.0(encoding@0.1.13)
+      node-fetch: 2.7.0
     transitivePeerDependencies:
       - encoding
 
-  '@changesets/get-release-plan@4.0.6':
+  '@changesets/get-release-plan@4.0.16':
     dependencies:
-      '@changesets/assemble-release-plan': 6.0.5
-      '@changesets/config': 3.0.5
-      '@changesets/pre': 2.0.1
-      '@changesets/read': 0.6.2
-      '@changesets/types': 6.0.0
+      '@changesets/assemble-release-plan': 6.0.10
+      '@changesets/config': 3.1.4
+      '@changesets/pre': 2.0.2
+      '@changesets/read': 0.6.7
+      '@changesets/types': 6.1.0
       '@manypkg/get-packages': 1.1.3
 
   '@changesets/get-version-range-type@0.4.0': {}
 
-  '@changesets/git@3.0.2':
+  '@changesets/git@3.0.4':
     dependencies:
       '@changesets/errors': 0.2.0
       '@manypkg/get-packages': 1.1.3
@@ -10957,991 +13103,1013 @@ snapshots:
     dependencies:
       picocolors: 1.1.1
 
-  '@changesets/parse@0.4.0':
+  '@changesets/parse@0.4.3':
     dependencies:
-      '@changesets/types': 6.0.0
-      js-yaml: 3.14.1
+      '@changesets/types': 6.1.0
+      js-yaml: 4.3.1
 
-  '@changesets/pre@2.0.1':
+  '@changesets/pre@2.0.2':
     dependencies:
       '@changesets/errors': 0.2.0
-      '@changesets/types': 6.0.0
+      '@changesets/types': 6.1.0
       '@manypkg/get-packages': 1.1.3
       fs-extra: 7.0.1
 
-  '@changesets/read@0.6.2':
+  '@changesets/read@0.6.7':
     dependencies:
-      '@changesets/git': 3.0.2
+      '@changesets/git': 3.0.4
       '@changesets/logger': 0.1.1
-      '@changesets/parse': 0.4.0
-      '@changesets/types': 6.0.0
+      '@changesets/parse': 0.4.3
+      '@changesets/types': 6.1.0
       fs-extra: 7.0.1
       p-filter: 2.1.0
       picocolors: 1.1.1
 
-  '@changesets/should-skip-package@0.1.1':
+  '@changesets/should-skip-package@0.1.2':
     dependencies:
-      '@changesets/types': 6.0.0
+      '@changesets/types': 6.1.0
       '@manypkg/get-packages': 1.1.3
 
   '@changesets/types@4.1.0': {}
 
-  '@changesets/types@6.0.0': {}
+  '@changesets/types@6.1.0': {}
 
-  '@changesets/write@0.3.2':
+  '@changesets/write@0.4.0':
     dependencies:
-      '@changesets/types': 6.0.0
+      '@changesets/types': 6.1.0
       fs-extra: 7.0.1
-      human-id: 1.0.2
+      human-id: 4.2.0
       prettier: 2.8.8
 
-  '@clack/core@0.4.0':
+  '@clack/core@1.4.3':
     dependencies:
-      picocolors: 1.1.1
+      fast-wrap-ansi: 0.2.2
       sisteransi: 1.0.5
 
-  '@clack/prompts@0.9.0':
+  '@clack/prompts@1.7.0':
     dependencies:
-      '@clack/core': 0.4.0
-      picocolors: 1.1.1
+      '@clack/core': 1.4.3
+      fast-string-width: 3.0.2
+      fast-wrap-ansi: 0.2.2
       sisteransi: 1.0.5
 
-  '@cloudflare/kv-asset-handler@0.3.4':
-    dependencies:
-      mime: 3.0.0
+  '@cloudflare/kv-asset-handler@0.4.2': {}
 
-  '@codemirror/autocomplete@6.18.6':
+  '@codemirror/autocomplete@6.20.3':
     dependencies:
-      '@codemirror/language': 6.11.0
-      '@codemirror/state': 6.5.2
-      '@codemirror/view': 6.36.5
-      '@lezer/common': 1.2.3
+      '@codemirror/language': 6.12.4
+      '@codemirror/state': 6.7.1
+      '@codemirror/view': 6.43.8
+      '@lezer/common': 1.5.2
 
-  '@codemirror/commands@6.8.1':
+  '@codemirror/commands@6.10.4':
     dependencies:
-      '@codemirror/language': 6.11.0
-      '@codemirror/state': 6.5.2
-      '@codemirror/view': 6.36.5
-      '@lezer/common': 1.2.3
+      '@codemirror/language': 6.12.4
+      '@codemirror/state': 6.7.1
+      '@codemirror/view': 6.43.8
+      '@lezer/common': 1.5.2
 
-  '@codemirror/lang-angular@0.1.3':
+  '@codemirror/lang-angular@0.1.4':
     dependencies:
-      '@codemirror/lang-html': 6.4.9
-      '@codemirror/lang-javascript': 6.2.3
-      '@codemirror/language': 6.11.0
-      '@lezer/common': 1.2.3
-      '@lezer/highlight': 1.2.1
-      '@lezer/lr': 1.4.2
+      '@codemirror/lang-html': 6.4.12
+      '@codemirror/lang-javascript': 6.2.5
+      '@codemirror/language': 6.12.4
+      '@lezer/common': 1.5.2
+      '@lezer/highlight': 1.2.3
+      '@lezer/lr': 1.4.10
 
-  '@codemirror/lang-cpp@6.0.2':
+  '@codemirror/lang-cpp@6.0.3':
     dependencies:
-      '@codemirror/language': 6.11.0
-      '@lezer/cpp': 1.1.3
+      '@codemirror/language': 6.12.4
+      '@lezer/cpp': 1.1.6
 
   '@codemirror/lang-css@6.3.1':
     dependencies:
-      '@codemirror/autocomplete': 6.18.6
-      '@codemirror/language': 6.11.0
-      '@codemirror/state': 6.5.2
-      '@lezer/common': 1.2.3
-      '@lezer/css': 1.1.11
+      '@codemirror/autocomplete': 6.20.3
+      '@codemirror/language': 6.12.4
+      '@codemirror/state': 6.7.1
+      '@lezer/common': 1.5.2
+      '@lezer/css': 1.3.6
 
   '@codemirror/lang-go@6.0.1':
     dependencies:
-      '@codemirror/autocomplete': 6.18.6
-      '@codemirror/language': 6.11.0
-      '@codemirror/state': 6.5.2
-      '@lezer/common': 1.2.3
-      '@lezer/go': 1.0.0
+      '@codemirror/autocomplete': 6.20.3
+      '@codemirror/language': 6.12.4
+      '@codemirror/state': 6.7.1
+      '@lezer/common': 1.5.2
+      '@lezer/go': 1.0.1
 
-  '@codemirror/lang-html@6.4.9':
+  '@codemirror/lang-html@6.4.12':
     dependencies:
-      '@codemirror/autocomplete': 6.18.6
+      '@codemirror/autocomplete': 6.20.3
       '@codemirror/lang-css': 6.3.1
-      '@codemirror/lang-javascript': 6.2.3
-      '@codemirror/language': 6.11.0
-      '@codemirror/state': 6.5.2
-      '@codemirror/view': 6.36.5
-      '@lezer/common': 1.2.3
-      '@lezer/css': 1.1.11
-      '@lezer/html': 1.3.10
+      '@codemirror/lang-javascript': 6.2.5
+      '@codemirror/language': 6.12.4
+      '@codemirror/state': 6.7.1
+      '@codemirror/view': 6.43.8
+      '@lezer/common': 1.5.2
+      '@lezer/css': 1.3.6
+      '@lezer/html': 1.3.13
 
-  '@codemirror/lang-java@6.0.1':
+  '@codemirror/lang-java@6.0.2':
     dependencies:
-      '@codemirror/language': 6.11.0
+      '@codemirror/language': 6.12.4
       '@lezer/java': 1.1.3
 
-  '@codemirror/lang-javascript@6.2.3':
+  '@codemirror/lang-javascript@6.2.5':
     dependencies:
-      '@codemirror/autocomplete': 6.18.6
-      '@codemirror/language': 6.11.0
-      '@codemirror/lint': 6.8.5
-      '@codemirror/state': 6.5.2
-      '@codemirror/view': 6.36.5
-      '@lezer/common': 1.2.3
-      '@lezer/javascript': 1.4.21
+      '@codemirror/autocomplete': 6.20.3
+      '@codemirror/language': 6.12.4
+      '@codemirror/lint': 6.9.7
+      '@codemirror/state': 6.7.1
+      '@codemirror/view': 6.43.8
+      '@lezer/common': 1.5.2
+      '@lezer/javascript': 1.5.4
 
-  '@codemirror/lang-json@6.0.1':
+  '@codemirror/lang-jinja@6.0.1':
     dependencies:
-      '@codemirror/language': 6.11.0
+      '@codemirror/autocomplete': 6.20.3
+      '@codemirror/lang-html': 6.4.12
+      '@codemirror/language': 6.12.4
+      '@codemirror/state': 6.7.1
+      '@codemirror/view': 6.43.8
+      '@lezer/common': 1.5.2
+      '@lezer/highlight': 1.2.3
+      '@lezer/lr': 1.4.10
+
+  '@codemirror/lang-json@6.0.2':
+    dependencies:
+      '@codemirror/language': 6.12.4
       '@lezer/json': 1.0.3
 
   '@codemirror/lang-less@6.0.2':
     dependencies:
       '@codemirror/lang-css': 6.3.1
-      '@codemirror/language': 6.11.0
-      '@lezer/common': 1.2.3
-      '@lezer/highlight': 1.2.1
-      '@lezer/lr': 1.4.2
+      '@codemirror/language': 6.12.4
+      '@lezer/common': 1.5.2
+      '@lezer/highlight': 1.2.3
+      '@lezer/lr': 1.4.10
 
-  '@codemirror/lang-liquid@6.2.3':
+  '@codemirror/lang-liquid@6.3.2':
     dependencies:
-      '@codemirror/autocomplete': 6.18.6
-      '@codemirror/lang-html': 6.4.9
-      '@codemirror/language': 6.11.0
-      '@codemirror/state': 6.5.2
-      '@codemirror/view': 6.36.5
-      '@lezer/common': 1.2.3
-      '@lezer/highlight': 1.2.1
-      '@lezer/lr': 1.4.2
+      '@codemirror/autocomplete': 6.20.3
+      '@codemirror/lang-html': 6.4.12
+      '@codemirror/language': 6.12.4
+      '@codemirror/state': 6.7.1
+      '@codemirror/view': 6.43.8
+      '@lezer/common': 1.5.2
+      '@lezer/highlight': 1.2.3
+      '@lezer/lr': 1.4.10
 
-  '@codemirror/lang-markdown@6.3.2':
+  '@codemirror/lang-markdown@6.5.2':
     dependencies:
-      '@codemirror/autocomplete': 6.18.6
-      '@codemirror/lang-html': 6.4.9
-      '@codemirror/language': 6.11.0
-      '@codemirror/state': 6.5.2
-      '@codemirror/view': 6.36.5
-      '@lezer/common': 1.2.3
-      '@lezer/markdown': 1.4.2
+      '@codemirror/autocomplete': 6.20.3
+      '@codemirror/lang-html': 6.4.12
+      '@codemirror/language': 6.12.4
+      '@codemirror/state': 6.7.1
+      '@codemirror/view': 6.43.8
+      '@lezer/common': 1.5.2
+      '@lezer/markdown': 1.7.2
 
-  '@codemirror/lang-php@6.0.1':
+  '@codemirror/lang-php@6.0.2':
     dependencies:
-      '@codemirror/lang-html': 6.4.9
-      '@codemirror/language': 6.11.0
-      '@codemirror/state': 6.5.2
-      '@lezer/common': 1.2.3
-      '@lezer/php': 1.0.2
+      '@codemirror/lang-html': 6.4.12
+      '@codemirror/language': 6.12.4
+      '@codemirror/state': 6.7.1
+      '@lezer/common': 1.5.2
+      '@lezer/php': 1.0.5
 
-  '@codemirror/lang-python@6.1.7':
+  '@codemirror/lang-python@6.2.1':
     dependencies:
-      '@codemirror/autocomplete': 6.18.6
-      '@codemirror/language': 6.11.0
-      '@codemirror/state': 6.5.2
-      '@lezer/common': 1.2.3
-      '@lezer/python': 1.1.17
+      '@codemirror/autocomplete': 6.20.3
+      '@codemirror/language': 6.12.4
+      '@codemirror/state': 6.7.1
+      '@lezer/common': 1.5.2
+      '@lezer/python': 1.1.19
 
-  '@codemirror/lang-rust@6.0.1':
+  '@codemirror/lang-rust@6.0.2':
     dependencies:
-      '@codemirror/language': 6.11.0
+      '@codemirror/language': 6.12.4
       '@lezer/rust': 1.0.2
 
   '@codemirror/lang-sass@6.0.2':
     dependencies:
       '@codemirror/lang-css': 6.3.1
-      '@codemirror/language': 6.11.0
-      '@codemirror/state': 6.5.2
-      '@lezer/common': 1.2.3
-      '@lezer/sass': 1.0.7
+      '@codemirror/language': 6.12.4
+      '@codemirror/state': 6.7.1
+      '@lezer/common': 1.5.2
+      '@lezer/sass': 1.1.0
 
-  '@codemirror/lang-sql@6.8.0':
+  '@codemirror/lang-sql@6.10.0':
     dependencies:
-      '@codemirror/autocomplete': 6.18.6
-      '@codemirror/language': 6.11.0
-      '@codemirror/state': 6.5.2
-      '@lezer/common': 1.2.3
-      '@lezer/highlight': 1.2.1
-      '@lezer/lr': 1.4.2
+      '@codemirror/autocomplete': 6.20.3
+      '@codemirror/language': 6.12.4
+      '@codemirror/state': 6.7.1
+      '@lezer/common': 1.5.2
+      '@lezer/highlight': 1.2.3
+      '@lezer/lr': 1.4.10
 
   '@codemirror/lang-vue@0.1.3':
     dependencies:
-      '@codemirror/lang-html': 6.4.9
-      '@codemirror/lang-javascript': 6.2.3
-      '@codemirror/language': 6.11.0
-      '@lezer/common': 1.2.3
-      '@lezer/highlight': 1.2.1
-      '@lezer/lr': 1.4.2
+      '@codemirror/lang-html': 6.4.12
+      '@codemirror/lang-javascript': 6.2.5
+      '@codemirror/language': 6.12.4
+      '@lezer/common': 1.5.2
+      '@lezer/highlight': 1.2.3
+      '@lezer/lr': 1.4.10
 
   '@codemirror/lang-wast@6.0.2':
     dependencies:
-      '@codemirror/language': 6.11.0
-      '@lezer/common': 1.2.3
-      '@lezer/highlight': 1.2.1
-      '@lezer/lr': 1.4.2
+      '@codemirror/language': 6.12.4
+      '@lezer/common': 1.5.2
+      '@lezer/highlight': 1.2.3
+      '@lezer/lr': 1.4.10
 
   '@codemirror/lang-xml@6.1.0':
     dependencies:
-      '@codemirror/autocomplete': 6.18.6
-      '@codemirror/language': 6.11.0
-      '@codemirror/state': 6.5.2
-      '@codemirror/view': 6.36.5
-      '@lezer/common': 1.2.3
+      '@codemirror/autocomplete': 6.20.3
+      '@codemirror/language': 6.12.4
+      '@codemirror/state': 6.7.1
+      '@codemirror/view': 6.43.8
+      '@lezer/common': 1.5.2
       '@lezer/xml': 1.0.6
 
-  '@codemirror/lang-yaml@6.1.2':
+  '@codemirror/lang-yaml@6.1.3':
     dependencies:
-      '@codemirror/autocomplete': 6.18.6
-      '@codemirror/language': 6.11.0
-      '@codemirror/state': 6.5.2
-      '@lezer/common': 1.2.3
-      '@lezer/highlight': 1.2.1
-      '@lezer/lr': 1.4.2
-      '@lezer/yaml': 1.0.3
+      '@codemirror/autocomplete': 6.20.3
+      '@codemirror/language': 6.12.4
+      '@codemirror/state': 6.7.1
+      '@lezer/common': 1.5.2
+      '@lezer/highlight': 1.2.3
+      '@lezer/lr': 1.4.10
+      '@lezer/yaml': 1.0.4
 
-  '@codemirror/language-data@6.5.1':
+  '@codemirror/language-data@6.5.2':
     dependencies:
-      '@codemirror/lang-angular': 0.1.3
-      '@codemirror/lang-cpp': 6.0.2
+      '@codemirror/lang-angular': 0.1.4
+      '@codemirror/lang-cpp': 6.0.3
       '@codemirror/lang-css': 6.3.1
       '@codemirror/lang-go': 6.0.1
-      '@codemirror/lang-html': 6.4.9
-      '@codemirror/lang-java': 6.0.1
-      '@codemirror/lang-javascript': 6.2.3
-      '@codemirror/lang-json': 6.0.1
+      '@codemirror/lang-html': 6.4.12
+      '@codemirror/lang-java': 6.0.2
+      '@codemirror/lang-javascript': 6.2.5
+      '@codemirror/lang-jinja': 6.0.1
+      '@codemirror/lang-json': 6.0.2
       '@codemirror/lang-less': 6.0.2
-      '@codemirror/lang-liquid': 6.2.3
-      '@codemirror/lang-markdown': 6.3.2
-      '@codemirror/lang-php': 6.0.1
-      '@codemirror/lang-python': 6.1.7
-      '@codemirror/lang-rust': 6.0.1
+      '@codemirror/lang-liquid': 6.3.2
+      '@codemirror/lang-markdown': 6.5.2
+      '@codemirror/lang-php': 6.0.2
+      '@codemirror/lang-python': 6.2.1
+      '@codemirror/lang-rust': 6.0.2
       '@codemirror/lang-sass': 6.0.2
-      '@codemirror/lang-sql': 6.8.0
+      '@codemirror/lang-sql': 6.10.0
       '@codemirror/lang-vue': 0.1.3
       '@codemirror/lang-wast': 6.0.2
       '@codemirror/lang-xml': 6.1.0
-      '@codemirror/lang-yaml': 6.1.2
-      '@codemirror/language': 6.11.0
-      '@codemirror/legacy-modes': 6.5.0
+      '@codemirror/lang-yaml': 6.1.3
+      '@codemirror/language': 6.12.4
+      '@codemirror/legacy-modes': 6.5.3
 
-  '@codemirror/language@6.11.0':
+  '@codemirror/language@6.12.4':
     dependencies:
-      '@codemirror/state': 6.5.2
-      '@codemirror/view': 6.36.5
-      '@lezer/common': 1.2.3
-      '@lezer/highlight': 1.2.1
-      '@lezer/lr': 1.4.2
-      style-mod: 4.1.2
+      '@codemirror/state': 6.7.1
+      '@codemirror/view': 6.43.8
+      '@lezer/common': 1.5.2
+      '@lezer/highlight': 1.2.3
+      '@lezer/lr': 1.4.10
+      style-mod: 4.1.3
 
-  '@codemirror/legacy-modes@6.5.0':
+  '@codemirror/legacy-modes@6.5.3':
     dependencies:
-      '@codemirror/language': 6.11.0
+      '@codemirror/language': 6.12.4
 
-  '@codemirror/lint@6.8.5':
+  '@codemirror/lint@6.9.7':
     dependencies:
-      '@codemirror/state': 6.5.2
-      '@codemirror/view': 6.36.5
-      crelt: 1.0.6
+      '@codemirror/state': 6.7.1
+      '@codemirror/view': 6.43.8
+      crelt: 1.0.7
 
-  '@codemirror/search@6.5.10':
+  '@codemirror/search@6.7.1':
     dependencies:
-      '@codemirror/state': 6.5.2
-      '@codemirror/view': 6.36.5
-      crelt: 1.0.6
+      '@codemirror/state': 6.7.1
+      '@codemirror/view': 6.43.8
+      crelt: 1.0.7
 
-  '@codemirror/state@6.5.2':
+  '@codemirror/state@6.7.1':
     dependencies:
-      '@marijn/find-cluster-break': 1.0.2
+      '@marijn/find-cluster-break': 1.0.3
 
-  '@codemirror/view@6.36.5':
+  '@codemirror/view@6.43.8':
     dependencies:
-      '@codemirror/state': 6.5.2
-      style-mod: 4.1.2
+      '@codemirror/state': 6.7.1
+      crelt: 1.0.7
+      style-mod: 4.1.3
       w3c-keyname: 2.2.8
 
-  '@commitlint/cli@19.6.1(@types/node@22.10.2)(typescript@5.7.2)':
+  '@colordx/core@5.5.0': {}
+
+  '@commitlint/cli@21.2.1(@types/node@25.9.5)(conventional-commits-parser@7.1.2)(typescript@6.0.3)':
     dependencies:
-      '@commitlint/format': 19.5.0
-      '@commitlint/lint': 19.6.0
-      '@commitlint/load': 19.6.1(@types/node@22.10.2)(typescript@5.7.2)
-      '@commitlint/read': 19.5.0
-      '@commitlint/types': 19.5.0
-      tinyexec: 0.3.1
-      yargs: 17.7.2
+      '@commitlint/config-conventional': 21.2.0
+      '@commitlint/format': 21.2.0
+      '@commitlint/lint': 21.2.0
+      '@commitlint/load': 21.2.0(@types/node@25.9.5)(typescript@6.0.3)
+      '@commitlint/read': 21.2.1(conventional-commits-parser@7.1.2)
+      '@commitlint/types': 21.2.0
+      tinyexec: 1.3.0
+      yargs: 18.1.0
+    transitivePeerDependencies:
+      - '@types/node'
+      - conventional-commits-filter
+      - conventional-commits-parser
+      - typescript
+
+  '@commitlint/config-conventional@21.2.0':
+    dependencies:
+      '@commitlint/types': 21.2.0
+      conventional-changelog-conventionalcommits: 10.2.1
+
+  '@commitlint/config-validator@21.2.0':
+    dependencies:
+      '@commitlint/types': 21.2.0
+      ajv: 8.20.0
+
+  '@commitlint/ensure@21.2.0':
+    dependencies:
+      '@commitlint/types': 21.2.0
+      es-toolkit: 1.50.0
+
+  '@commitlint/execute-rule@21.0.1': {}
+
+  '@commitlint/format@21.2.0':
+    dependencies:
+      '@commitlint/types': 21.2.0
+      picocolors: 1.1.1
+
+  '@commitlint/is-ignored@21.2.0':
+    dependencies:
+      '@commitlint/types': 21.2.0
+      semver: 7.8.5
+
+  '@commitlint/lint@21.2.0':
+    dependencies:
+      '@commitlint/is-ignored': 21.2.0
+      '@commitlint/parse': 21.2.0
+      '@commitlint/rules': 21.2.0
+      '@commitlint/types': 21.2.0
+
+  '@commitlint/load@21.2.0(@types/node@25.9.5)(typescript@6.0.3)':
+    dependencies:
+      '@commitlint/config-validator': 21.2.0
+      '@commitlint/execute-rule': 21.0.1
+      '@commitlint/resolve-extends': 21.2.0
+      '@commitlint/types': 21.2.0
+      cosmiconfig: 9.0.2(typescript@6.0.3)
+      cosmiconfig-typescript-loader: 6.3.0(@types/node@25.9.5)(cosmiconfig@9.0.2(typescript@6.0.3))(typescript@6.0.3)
+      es-toolkit: 1.50.0
+      is-plain-obj: 4.1.0
+      picocolors: 1.1.1
     transitivePeerDependencies:
       - '@types/node'
       - typescript
 
-  '@commitlint/config-conventional@19.6.0':
-    dependencies:
-      '@commitlint/types': 19.5.0
-      conventional-changelog-conventionalcommits: 7.0.2
+  '@commitlint/message@21.2.0': {}
 
-  '@commitlint/config-validator@19.5.0':
+  '@commitlint/parse@21.2.0':
     dependencies:
-      '@commitlint/types': 19.5.0
-      ajv: 8.17.1
+      '@commitlint/types': 21.2.0
+      conventional-changelog-angular: 9.2.1
+      conventional-commits-parser: 7.1.2
 
-  '@commitlint/ensure@19.5.0':
+  '@commitlint/read@21.2.1(conventional-commits-parser@7.1.2)':
     dependencies:
-      '@commitlint/types': 19.5.0
-      lodash.camelcase: 4.3.0
-      lodash.kebabcase: 4.1.1
-      lodash.snakecase: 4.1.1
-      lodash.startcase: 4.4.0
-      lodash.upperfirst: 4.3.1
-
-  '@commitlint/execute-rule@19.5.0': {}
-
-  '@commitlint/format@19.5.0':
-    dependencies:
-      '@commitlint/types': 19.5.0
-      chalk: 5.4.0
-
-  '@commitlint/is-ignored@19.6.0':
-    dependencies:
-      '@commitlint/types': 19.5.0
-      semver: 7.6.3
-
-  '@commitlint/lint@19.6.0':
-    dependencies:
-      '@commitlint/is-ignored': 19.6.0
-      '@commitlint/parse': 19.5.0
-      '@commitlint/rules': 19.6.0
-      '@commitlint/types': 19.5.0
-
-  '@commitlint/load@19.6.1(@types/node@22.10.2)(typescript@5.7.2)':
-    dependencies:
-      '@commitlint/config-validator': 19.5.0
-      '@commitlint/execute-rule': 19.5.0
-      '@commitlint/resolve-extends': 19.5.0
-      '@commitlint/types': 19.5.0
-      chalk: 5.4.0
-      cosmiconfig: 9.0.0(typescript@5.7.2)
-      cosmiconfig-typescript-loader: 6.1.0(@types/node@22.10.2)(cosmiconfig@9.0.0(typescript@5.7.2))(typescript@5.7.2)
-      lodash.isplainobject: 4.0.6
-      lodash.merge: 4.6.2
-      lodash.uniq: 4.5.0
+      '@commitlint/top-level': 21.2.0
+      '@commitlint/types': 21.2.0
+      '@conventional-changelog/git-client': 3.1.1(conventional-commits-parser@7.1.2)
+      tinyexec: 1.3.0
     transitivePeerDependencies:
-      - '@types/node'
-      - typescript
+      - conventional-commits-filter
+      - conventional-commits-parser
 
-  '@commitlint/message@19.5.0': {}
-
-  '@commitlint/parse@19.5.0':
+  '@commitlint/resolve-extends@21.2.0':
     dependencies:
-      '@commitlint/types': 19.5.0
-      conventional-changelog-angular: 7.0.0
-      conventional-commits-parser: 5.0.0
-
-  '@commitlint/read@19.5.0':
-    dependencies:
-      '@commitlint/top-level': 19.5.0
-      '@commitlint/types': 19.5.0
-      git-raw-commits: 4.0.0
-      minimist: 1.2.8
-      tinyexec: 0.3.1
-
-  '@commitlint/resolve-extends@19.5.0':
-    dependencies:
-      '@commitlint/config-validator': 19.5.0
-      '@commitlint/types': 19.5.0
-      global-directory: 4.0.1
-      import-meta-resolve: 4.1.0
-      lodash.mergewith: 4.6.2
+      '@commitlint/config-validator': 21.2.0
+      '@commitlint/types': 21.2.0
+      es-toolkit: 1.50.0
+      global-directory: 5.0.0
       resolve-from: 5.0.0
 
-  '@commitlint/rules@19.6.0':
+  '@commitlint/rules@21.2.0':
     dependencies:
-      '@commitlint/ensure': 19.5.0
-      '@commitlint/message': 19.5.0
-      '@commitlint/to-lines': 19.5.0
-      '@commitlint/types': 19.5.0
+      '@commitlint/ensure': 21.2.0
+      '@commitlint/message': 21.2.0
+      '@commitlint/to-lines': 21.0.1
+      '@commitlint/types': 21.2.0
 
-  '@commitlint/to-lines@19.5.0': {}
+  '@commitlint/to-lines@21.0.1': {}
 
-  '@commitlint/top-level@19.5.0':
+  '@commitlint/top-level@21.2.0':
     dependencies:
-      find-up: 7.0.0
+      escalade: 3.2.0
 
-  '@commitlint/types@19.5.0':
+  '@commitlint/types@21.2.0':
     dependencies:
-      '@types/conventional-commits-parser': 5.0.1
-      chalk: 5.4.0
+      conventional-commits-parser: 7.1.2
+      picocolors: 1.1.1
 
-  '@cspell/cspell-bundled-dicts@8.17.1':
+  '@conventional-changelog/git-client@3.1.1(conventional-commits-parser@7.1.2)':
     dependencies:
-      '@cspell/dict-ada': 4.0.5
-      '@cspell/dict-al': 1.0.3
-      '@cspell/dict-aws': 4.0.7
-      '@cspell/dict-bash': 4.1.8
-      '@cspell/dict-companies': 3.1.9
-      '@cspell/dict-cpp': 6.0.2
-      '@cspell/dict-cryptocurrencies': 5.0.3
-      '@cspell/dict-csharp': 4.0.5
-      '@cspell/dict-css': 4.0.16
-      '@cspell/dict-dart': 2.2.4
-      '@cspell/dict-django': 4.1.3
-      '@cspell/dict-docker': 1.1.11
-      '@cspell/dict-dotnet': 5.0.8
-      '@cspell/dict-elixir': 4.0.6
-      '@cspell/dict-en-common-misspellings': 2.0.7
-      '@cspell/dict-en-gb': 1.1.33
-      '@cspell/dict-en_us': 4.3.28
-      '@cspell/dict-filetypes': 3.0.9
-      '@cspell/dict-flutter': 1.0.3
-      '@cspell/dict-fonts': 4.0.3
-      '@cspell/dict-fsharp': 1.0.4
-      '@cspell/dict-fullstack': 3.2.3
-      '@cspell/dict-gaming-terms': 1.0.9
-      '@cspell/dict-git': 3.0.3
-      '@cspell/dict-golang': 6.0.17
-      '@cspell/dict-google': 1.0.4
-      '@cspell/dict-haskell': 4.0.4
-      '@cspell/dict-html': 4.0.10
-      '@cspell/dict-html-symbol-entities': 4.0.3
-      '@cspell/dict-java': 5.0.10
-      '@cspell/dict-julia': 1.0.4
-      '@cspell/dict-k8s': 1.0.9
-      '@cspell/dict-latex': 4.0.3
-      '@cspell/dict-lorem-ipsum': 4.0.3
-      '@cspell/dict-lua': 4.0.6
-      '@cspell/dict-makefile': 1.0.3
-      '@cspell/dict-markdown': 2.0.7(@cspell/dict-css@4.0.16)(@cspell/dict-html-symbol-entities@4.0.3)(@cspell/dict-html@4.0.10)(@cspell/dict-typescript@3.1.11)
-      '@cspell/dict-monkeyc': 1.0.9
-      '@cspell/dict-node': 5.0.5
-      '@cspell/dict-npm': 5.1.18
-      '@cspell/dict-php': 4.0.13
-      '@cspell/dict-powershell': 5.0.13
-      '@cspell/dict-public-licenses': 2.0.11
-      '@cspell/dict-python': 4.2.13
-      '@cspell/dict-r': 2.0.4
-      '@cspell/dict-ruby': 5.0.7
-      '@cspell/dict-rust': 4.0.10
-      '@cspell/dict-scala': 5.0.6
-      '@cspell/dict-software-terms': 4.1.20
-      '@cspell/dict-sql': 2.1.8
-      '@cspell/dict-svelte': 1.0.5
-      '@cspell/dict-swift': 2.0.4
-      '@cspell/dict-terraform': 1.0.6
-      '@cspell/dict-typescript': 3.1.11
-      '@cspell/dict-vue': 3.0.3
+      '@simple-libs/child-process-utils': 2.0.0
+      '@simple-libs/stream-utils': 2.0.0
+      semver: 7.8.5
+    optionalDependencies:
+      conventional-commits-parser: 7.1.2
 
-  '@cspell/cspell-json-reporter@8.17.1':
+  '@conventional-changelog/template@1.2.1': {}
+
+  '@cspell/cspell-bundled-dicts@10.0.1':
     dependencies:
-      '@cspell/cspell-types': 8.17.1
+      '@cspell/dict-ada': 4.1.1
+      '@cspell/dict-al': 1.1.1
+      '@cspell/dict-aws': 4.0.17
+      '@cspell/dict-bash': 4.2.3
+      '@cspell/dict-companies': 3.2.12
+      '@cspell/dict-cpp': 7.1.0
+      '@cspell/dict-cryptocurrencies': 5.0.5
+      '@cspell/dict-csharp': 4.0.8
+      '@cspell/dict-css': 4.1.2
+      '@cspell/dict-dart': 2.3.2
+      '@cspell/dict-data-science': 2.0.16
+      '@cspell/dict-django': 4.1.6
+      '@cspell/dict-docker': 1.1.17
+      '@cspell/dict-dotnet': 5.0.13
+      '@cspell/dict-elixir': 4.0.8
+      '@cspell/dict-en-common-misspellings': 2.2.0
+      '@cspell/dict-en-gb-mit': 3.1.25
+      '@cspell/dict-en_us': 4.4.36
+      '@cspell/dict-filetypes': 3.0.18
+      '@cspell/dict-flutter': 1.1.1
+      '@cspell/dict-fonts': 4.0.6
+      '@cspell/dict-fsharp': 1.1.1
+      '@cspell/dict-fullstack': 3.2.9
+      '@cspell/dict-gaming-terms': 1.1.2
+      '@cspell/dict-git': 3.1.0
+      '@cspell/dict-golang': 6.0.26
+      '@cspell/dict-google': 1.0.9
+      '@cspell/dict-haskell': 4.0.6
+      '@cspell/dict-html': 4.0.15
+      '@cspell/dict-html-symbol-entities': 4.0.5
+      '@cspell/dict-java': 5.0.12
+      '@cspell/dict-julia': 1.1.1
+      '@cspell/dict-k8s': 1.0.13
+      '@cspell/dict-kotlin': 1.1.1
+      '@cspell/dict-latex': 5.1.0
+      '@cspell/dict-lorem-ipsum': 4.0.5
+      '@cspell/dict-lua': 4.0.8
+      '@cspell/dict-makefile': 1.0.5
+      '@cspell/dict-markdown': 2.0.17(@cspell/dict-css@4.1.2)(@cspell/dict-html-symbol-entities@4.0.5)(@cspell/dict-html@4.0.15)(@cspell/dict-typescript@3.2.3)
+      '@cspell/dict-monkeyc': 1.1.0
+      '@cspell/dict-node': 5.0.9
+      '@cspell/dict-npm': 5.2.45
+      '@cspell/dict-php': 4.1.1
+      '@cspell/dict-powershell': 5.0.15
+      '@cspell/dict-public-licenses': 2.0.16
+      '@cspell/dict-python': 4.3.0
+      '@cspell/dict-r': 2.1.1
+      '@cspell/dict-ruby': 5.1.1
+      '@cspell/dict-rust': 4.1.2
+      '@cspell/dict-scala': 5.0.9
+      '@cspell/dict-shell': 1.2.0
+      '@cspell/dict-software-terms': 5.3.0
+      '@cspell/dict-sql': 2.2.1
+      '@cspell/dict-svelte': 1.0.7
+      '@cspell/dict-swift': 2.0.6
+      '@cspell/dict-terraform': 1.1.4
+      '@cspell/dict-typescript': 3.2.3
+      '@cspell/dict-vue': 3.0.5
+      '@cspell/dict-zig': 1.0.0
 
-  '@cspell/cspell-pipe@8.17.1': {}
-
-  '@cspell/cspell-resolver@8.17.1':
+  '@cspell/cspell-json-reporter@10.0.1':
     dependencies:
-      global-directory: 4.0.1
+      '@cspell/cspell-types': 10.0.1
 
-  '@cspell/cspell-service-bus@8.17.1': {}
+  '@cspell/cspell-performance-monitor@10.0.1': {}
 
-  '@cspell/cspell-types@8.17.1': {}
+  '@cspell/cspell-pipe@10.0.1': {}
 
-  '@cspell/dict-ada@4.0.5': {}
-
-  '@cspell/dict-al@1.0.3': {}
-
-  '@cspell/dict-aws@4.0.7': {}
-
-  '@cspell/dict-bash@4.1.8': {}
-
-  '@cspell/dict-companies@3.1.9': {}
-
-  '@cspell/dict-cpp@6.0.2': {}
-
-  '@cspell/dict-cryptocurrencies@5.0.3': {}
-
-  '@cspell/dict-csharp@4.0.5': {}
-
-  '@cspell/dict-css@4.0.16': {}
-
-  '@cspell/dict-dart@2.2.4': {}
-
-  '@cspell/dict-data-science@2.0.5': {}
-
-  '@cspell/dict-django@4.1.3': {}
-
-  '@cspell/dict-docker@1.1.11': {}
-
-  '@cspell/dict-dotnet@5.0.8': {}
-
-  '@cspell/dict-elixir@4.0.6': {}
-
-  '@cspell/dict-en-common-misspellings@2.0.7': {}
-
-  '@cspell/dict-en-gb@1.1.33': {}
-
-  '@cspell/dict-en_us@4.3.28': {}
-
-  '@cspell/dict-filetypes@3.0.9': {}
-
-  '@cspell/dict-flutter@1.0.3': {}
-
-  '@cspell/dict-fonts@4.0.3': {}
-
-  '@cspell/dict-fsharp@1.0.4': {}
-
-  '@cspell/dict-fullstack@3.2.3': {}
-
-  '@cspell/dict-gaming-terms@1.0.9': {}
-
-  '@cspell/dict-git@3.0.3': {}
-
-  '@cspell/dict-golang@6.0.17': {}
-
-  '@cspell/dict-google@1.0.4': {}
-
-  '@cspell/dict-haskell@4.0.4': {}
-
-  '@cspell/dict-html-symbol-entities@4.0.3': {}
-
-  '@cspell/dict-html@4.0.10': {}
-
-  '@cspell/dict-java@5.0.10': {}
-
-  '@cspell/dict-julia@1.0.4': {}
-
-  '@cspell/dict-k8s@1.0.9': {}
-
-  '@cspell/dict-latex@4.0.3': {}
-
-  '@cspell/dict-lorem-ipsum@4.0.3': {}
-
-  '@cspell/dict-lua@4.0.6': {}
-
-  '@cspell/dict-makefile@1.0.3': {}
-
-  '@cspell/dict-markdown@2.0.7(@cspell/dict-css@4.0.16)(@cspell/dict-html-symbol-entities@4.0.3)(@cspell/dict-html@4.0.10)(@cspell/dict-typescript@3.1.11)':
+  '@cspell/cspell-resolver@10.0.1':
     dependencies:
-      '@cspell/dict-css': 4.0.16
-      '@cspell/dict-html': 4.0.10
-      '@cspell/dict-html-symbol-entities': 4.0.3
-      '@cspell/dict-typescript': 3.1.11
+      global-directory: 5.0.0
 
-  '@cspell/dict-monkeyc@1.0.9': {}
+  '@cspell/cspell-service-bus@10.0.1': {}
 
-  '@cspell/dict-node@5.0.5': {}
+  '@cspell/cspell-types@10.0.1': {}
 
-  '@cspell/dict-npm@5.1.18': {}
-
-  '@cspell/dict-php@4.0.13': {}
-
-  '@cspell/dict-powershell@5.0.13': {}
-
-  '@cspell/dict-public-licenses@2.0.11': {}
-
-  '@cspell/dict-python@4.2.13':
+  '@cspell/cspell-worker@10.0.1':
     dependencies:
-      '@cspell/dict-data-science': 2.0.5
+      cspell-lib: 10.0.1
 
-  '@cspell/dict-r@2.0.4': {}
+  '@cspell/dict-ada@4.1.1': {}
 
-  '@cspell/dict-ruby@5.0.7': {}
+  '@cspell/dict-al@1.1.1': {}
 
-  '@cspell/dict-rust@4.0.10': {}
+  '@cspell/dict-aws@4.0.17': {}
 
-  '@cspell/dict-scala@5.0.6': {}
-
-  '@cspell/dict-software-terms@4.1.20': {}
-
-  '@cspell/dict-sql@2.1.8': {}
-
-  '@cspell/dict-svelte@1.0.5': {}
-
-  '@cspell/dict-swift@2.0.4': {}
-
-  '@cspell/dict-terraform@1.0.6': {}
-
-  '@cspell/dict-typescript@3.1.11': {}
-
-  '@cspell/dict-vue@3.0.3': {}
-
-  '@cspell/dynamic-import@8.17.1':
+  '@cspell/dict-bash@4.2.3':
     dependencies:
-      '@cspell/url': 8.17.1
-      import-meta-resolve: 4.1.0
+      '@cspell/dict-shell': 1.2.0
 
-  '@cspell/filetypes@8.17.1': {}
+  '@cspell/dict-companies@3.2.12': {}
 
-  '@cspell/strong-weak-map@8.17.1': {}
+  '@cspell/dict-cpp@7.1.0': {}
 
-  '@cspell/url@8.17.1': {}
+  '@cspell/dict-cryptocurrencies@5.0.5': {}
 
-  '@csstools/cascade-layer-name-parser@2.0.4(@csstools/css-parser-algorithms@3.0.4(@csstools/css-tokenizer@3.0.3))(@csstools/css-tokenizer@3.0.3)':
+  '@cspell/dict-csharp@4.0.8': {}
+
+  '@cspell/dict-css@4.1.2': {}
+
+  '@cspell/dict-dart@2.3.2': {}
+
+  '@cspell/dict-data-science@2.0.16': {}
+
+  '@cspell/dict-django@4.1.6': {}
+
+  '@cspell/dict-docker@1.1.17': {}
+
+  '@cspell/dict-dotnet@5.0.13': {}
+
+  '@cspell/dict-elixir@4.0.8': {}
+
+  '@cspell/dict-en-common-misspellings@2.2.0': {}
+
+  '@cspell/dict-en-gb-mit@3.1.25': {}
+
+  '@cspell/dict-en_us@4.4.36': {}
+
+  '@cspell/dict-filetypes@3.0.18': {}
+
+  '@cspell/dict-flutter@1.1.1': {}
+
+  '@cspell/dict-fonts@4.0.6': {}
+
+  '@cspell/dict-fsharp@1.1.1': {}
+
+  '@cspell/dict-fullstack@3.2.9': {}
+
+  '@cspell/dict-gaming-terms@1.1.2': {}
+
+  '@cspell/dict-git@3.1.0': {}
+
+  '@cspell/dict-golang@6.0.26': {}
+
+  '@cspell/dict-google@1.0.9': {}
+
+  '@cspell/dict-haskell@4.0.6': {}
+
+  '@cspell/dict-html-symbol-entities@4.0.5': {}
+
+  '@cspell/dict-html@4.0.15': {}
+
+  '@cspell/dict-java@5.0.12': {}
+
+  '@cspell/dict-julia@1.1.1': {}
+
+  '@cspell/dict-k8s@1.0.13': {}
+
+  '@cspell/dict-kotlin@1.1.1': {}
+
+  '@cspell/dict-latex@5.1.0': {}
+
+  '@cspell/dict-lorem-ipsum@4.0.5': {}
+
+  '@cspell/dict-lua@4.0.8': {}
+
+  '@cspell/dict-makefile@1.0.5': {}
+
+  '@cspell/dict-markdown@2.0.17(@cspell/dict-css@4.1.2)(@cspell/dict-html-symbol-entities@4.0.5)(@cspell/dict-html@4.0.15)(@cspell/dict-typescript@3.2.3)':
     dependencies:
-      '@csstools/css-parser-algorithms': 3.0.4(@csstools/css-tokenizer@3.0.3)
-      '@csstools/css-tokenizer': 3.0.3
+      '@cspell/dict-css': 4.1.2
+      '@cspell/dict-html': 4.0.15
+      '@cspell/dict-html-symbol-entities': 4.0.5
+      '@cspell/dict-typescript': 3.2.3
 
-  '@csstools/color-helpers@5.0.1': {}
+  '@cspell/dict-monkeyc@1.1.0': {}
 
-  '@csstools/css-calc@2.1.0(@csstools/css-parser-algorithms@3.0.4(@csstools/css-tokenizer@3.0.3))(@csstools/css-tokenizer@3.0.3)':
+  '@cspell/dict-node@5.0.9': {}
+
+  '@cspell/dict-npm@5.2.45': {}
+
+  '@cspell/dict-php@4.1.1': {}
+
+  '@cspell/dict-powershell@5.0.15': {}
+
+  '@cspell/dict-public-licenses@2.0.16': {}
+
+  '@cspell/dict-python@4.3.0':
     dependencies:
-      '@csstools/css-parser-algorithms': 3.0.4(@csstools/css-tokenizer@3.0.3)
-      '@csstools/css-tokenizer': 3.0.3
+      '@cspell/dict-data-science': 2.0.16
 
-  '@csstools/css-color-parser@3.0.6(@csstools/css-parser-algorithms@3.0.4(@csstools/css-tokenizer@3.0.3))(@csstools/css-tokenizer@3.0.3)':
+  '@cspell/dict-r@2.1.1': {}
+
+  '@cspell/dict-ruby@5.1.1': {}
+
+  '@cspell/dict-rust@4.1.2': {}
+
+  '@cspell/dict-scala@5.0.9': {}
+
+  '@cspell/dict-shell@1.2.0': {}
+
+  '@cspell/dict-software-terms@5.3.0': {}
+
+  '@cspell/dict-sql@2.2.1': {}
+
+  '@cspell/dict-svelte@1.0.7': {}
+
+  '@cspell/dict-swift@2.0.6': {}
+
+  '@cspell/dict-terraform@1.1.4': {}
+
+  '@cspell/dict-typescript@3.2.3': {}
+
+  '@cspell/dict-vue@3.0.5': {}
+
+  '@cspell/dict-zig@1.0.0': {}
+
+  '@cspell/dynamic-import@10.0.1':
     dependencies:
-      '@csstools/color-helpers': 5.0.1
-      '@csstools/css-calc': 2.1.0(@csstools/css-parser-algorithms@3.0.4(@csstools/css-tokenizer@3.0.3))(@csstools/css-tokenizer@3.0.3)
-      '@csstools/css-parser-algorithms': 3.0.4(@csstools/css-tokenizer@3.0.3)
-      '@csstools/css-tokenizer': 3.0.3
+      '@cspell/url': 10.0.1
+      import-meta-resolve: 4.2.0
 
-  '@csstools/css-parser-algorithms@3.0.4(@csstools/css-tokenizer@3.0.3)':
+  '@cspell/filetypes@10.0.1': {}
+
+  '@cspell/rpc@10.0.1': {}
+
+  '@cspell/strong-weak-map@10.0.1': {}
+
+  '@cspell/url@10.0.1': {}
+
+  '@csstools/css-calc@3.3.0(@csstools/css-parser-algorithms@4.0.0(@csstools/css-tokenizer@4.0.0))(@csstools/css-tokenizer@4.0.0)':
     dependencies:
-      '@csstools/css-tokenizer': 3.0.3
+      '@csstools/css-parser-algorithms': 4.0.0(@csstools/css-tokenizer@4.0.0)
+      '@csstools/css-tokenizer': 4.0.0
 
-  '@csstools/css-tokenizer@3.0.3': {}
-
-  '@csstools/media-query-list-parser@3.0.1(@csstools/css-parser-algorithms@3.0.4(@csstools/css-tokenizer@3.0.3))(@csstools/css-tokenizer@3.0.3)':
+  '@csstools/css-parser-algorithms@4.0.0(@csstools/css-tokenizer@4.0.0)':
     dependencies:
-      '@csstools/css-parser-algorithms': 3.0.4(@csstools/css-tokenizer@3.0.3)
-      '@csstools/css-tokenizer': 3.0.3
+      '@csstools/css-tokenizer': 4.0.0
 
-  '@csstools/media-query-list-parser@4.0.2(@csstools/css-parser-algorithms@3.0.4(@csstools/css-tokenizer@3.0.3))(@csstools/css-tokenizer@3.0.3)':
+  '@csstools/css-syntax-patches-for-csstree@1.1.7(css-tree@3.2.1)':
+    optionalDependencies:
+      css-tree: 3.2.1
+
+  '@csstools/css-tokenizer@4.0.0': {}
+
+  '@csstools/media-query-list-parser@5.0.0(@csstools/css-parser-algorithms@4.0.0(@csstools/css-tokenizer@4.0.0))(@csstools/css-tokenizer@4.0.0)':
     dependencies:
-      '@csstools/css-parser-algorithms': 3.0.4(@csstools/css-tokenizer@3.0.3)
-      '@csstools/css-tokenizer': 3.0.3
+      '@csstools/css-parser-algorithms': 4.0.0(@csstools/css-tokenizer@4.0.0)
+      '@csstools/css-tokenizer': 4.0.0
 
-  '@csstools/postcss-cascade-layers@5.0.1(postcss@8.4.49)':
+  '@csstools/selector-resolve-nested@4.0.1(postcss-selector-parser@7.1.5)':
     dependencies:
-      '@csstools/selector-specificity': 5.0.0(postcss-selector-parser@7.0.0)
-      postcss: 8.4.49
-      postcss-selector-parser: 7.0.0
+      postcss-selector-parser: 7.1.5
 
-  '@csstools/postcss-color-function@4.0.6(postcss@8.4.49)':
+  '@csstools/selector-specificity@6.0.0(postcss-selector-parser@7.1.5)':
     dependencies:
-      '@csstools/css-color-parser': 3.0.6(@csstools/css-parser-algorithms@3.0.4(@csstools/css-tokenizer@3.0.3))(@csstools/css-tokenizer@3.0.3)
-      '@csstools/css-parser-algorithms': 3.0.4(@csstools/css-tokenizer@3.0.3)
-      '@csstools/css-tokenizer': 3.0.3
-      '@csstools/postcss-progressive-custom-properties': 4.0.0(postcss@8.4.49)
-      '@csstools/utilities': 2.0.0(postcss@8.4.49)
-      postcss: 8.4.49
+      postcss-selector-parser: 7.1.5
 
-  '@csstools/postcss-color-mix-function@3.0.6(postcss@8.4.49)':
+  '@ctrl/tinycolor@4.2.0': {}
+
+  '@cyberalien/svg-utils@1.2.19':
     dependencies:
-      '@csstools/css-color-parser': 3.0.6(@csstools/css-parser-algorithms@3.0.4(@csstools/css-tokenizer@3.0.3))(@csstools/css-tokenizer@3.0.3)
-      '@csstools/css-parser-algorithms': 3.0.4(@csstools/css-tokenizer@3.0.3)
-      '@csstools/css-tokenizer': 3.0.3
-      '@csstools/postcss-progressive-custom-properties': 4.0.0(postcss@8.4.49)
-      '@csstools/utilities': 2.0.0(postcss@8.4.49)
-      postcss: 8.4.49
+      '@iconify/types': 2.0.0
 
-  '@csstools/postcss-content-alt-text@2.0.4(postcss@8.4.49)':
+  '@electron-internal/extract-zip@1.0.5': {}
+
+  '@electron/asar@3.4.1':
     dependencies:
-      '@csstools/css-parser-algorithms': 3.0.4(@csstools/css-tokenizer@3.0.3)
-      '@csstools/css-tokenizer': 3.0.3
-      '@csstools/postcss-progressive-custom-properties': 4.0.0(postcss@8.4.49)
-      '@csstools/utilities': 2.0.0(postcss@8.4.49)
-      postcss: 8.4.49
+      commander: 5.1.0
+      glob: 7.2.3
+      minimatch: 3.1.5
 
-  '@csstools/postcss-exponential-functions@2.0.5(postcss@8.4.49)':
+  '@electron/fuses@1.8.0':
     dependencies:
-      '@csstools/css-calc': 2.1.0(@csstools/css-parser-algorithms@3.0.4(@csstools/css-tokenizer@3.0.3))(@csstools/css-tokenizer@3.0.3)
-      '@csstools/css-parser-algorithms': 3.0.4(@csstools/css-tokenizer@3.0.3)
-      '@csstools/css-tokenizer': 3.0.3
-      postcss: 8.4.49
+      chalk: 4.1.2
+      fs-extra: 9.1.0
+      minimist: 1.2.8
 
-  '@csstools/postcss-font-format-keywords@4.0.0(postcss@8.4.49)':
+  '@electron/get@3.1.0(supports-color@10.2.2)':
     dependencies:
-      '@csstools/utilities': 2.0.0(postcss@8.4.49)
-      postcss: 8.4.49
-      postcss-value-parser: 4.2.0
+      debug: 4.4.3(supports-color@10.2.2)
+      env-paths: 2.2.1
+      fs-extra: 8.1.0
+      got: 11.8.6
+      progress: 2.0.3
+      semver: 6.3.1
+      sumchecker: 3.0.1(supports-color@10.2.2)
+    optionalDependencies:
+      global-agent: 3.0.0
+    transitivePeerDependencies:
+      - supports-color
 
-  '@csstools/postcss-gamut-mapping@2.0.6(postcss@8.4.49)':
+  '@electron/get@5.1.0(supports-color@10.2.2)':
     dependencies:
-      '@csstools/css-color-parser': 3.0.6(@csstools/css-parser-algorithms@3.0.4(@csstools/css-tokenizer@3.0.3))(@csstools/css-tokenizer@3.0.3)
-      '@csstools/css-parser-algorithms': 3.0.4(@csstools/css-tokenizer@3.0.3)
-      '@csstools/css-tokenizer': 3.0.3
-      postcss: 8.4.49
+      debug: 4.4.3(supports-color@10.2.2)
+      env-paths: 3.0.0
+      graceful-fs: 4.2.11
+      progress: 2.0.3
+      semver: 7.8.5
+      sumchecker: 3.0.1(supports-color@10.2.2)
+    optionalDependencies:
+      undici: 7.29.0
+    transitivePeerDependencies:
+      - supports-color
 
-  '@csstools/postcss-gradients-interpolation-method@5.0.6(postcss@8.4.49)':
+  '@electron/notarize@2.5.0(supports-color@10.2.2)':
     dependencies:
-      '@csstools/css-color-parser': 3.0.6(@csstools/css-parser-algorithms@3.0.4(@csstools/css-tokenizer@3.0.3))(@csstools/css-tokenizer@3.0.3)
-      '@csstools/css-parser-algorithms': 3.0.4(@csstools/css-tokenizer@3.0.3)
-      '@csstools/css-tokenizer': 3.0.3
-      '@csstools/postcss-progressive-custom-properties': 4.0.0(postcss@8.4.49)
-      '@csstools/utilities': 2.0.0(postcss@8.4.49)
-      postcss: 8.4.49
+      debug: 4.4.3(supports-color@10.2.2)
+      fs-extra: 9.1.0
+      promise-retry: 2.0.1
+    transitivePeerDependencies:
+      - supports-color
 
-  '@csstools/postcss-hwb-function@4.0.6(postcss@8.4.49)':
+  '@electron/osx-sign@1.3.3(supports-color@10.2.2)':
     dependencies:
-      '@csstools/css-color-parser': 3.0.6(@csstools/css-parser-algorithms@3.0.4(@csstools/css-tokenizer@3.0.3))(@csstools/css-tokenizer@3.0.3)
-      '@csstools/css-parser-algorithms': 3.0.4(@csstools/css-tokenizer@3.0.3)
-      '@csstools/css-tokenizer': 3.0.3
-      '@csstools/postcss-progressive-custom-properties': 4.0.0(postcss@8.4.49)
-      '@csstools/utilities': 2.0.0(postcss@8.4.49)
-      postcss: 8.4.49
+      compare-version: 0.1.2
+      debug: 4.4.3(supports-color@10.2.2)
+      fs-extra: 10.1.0
+      isbinaryfile: 4.0.10
+      minimist: 1.2.8
+      plist: 3.1.0
+    transitivePeerDependencies:
+      - supports-color
 
-  '@csstools/postcss-ic-unit@4.0.0(postcss@8.4.49)':
+  '@electron/rebuild@4.2.0(supports-color@10.2.2)':
     dependencies:
-      '@csstools/postcss-progressive-custom-properties': 4.0.0(postcss@8.4.49)
-      '@csstools/utilities': 2.0.0(postcss@8.4.49)
-      postcss: 8.4.49
-      postcss-value-parser: 4.2.0
+      '@malept/cross-spawn-promise': 2.0.0
+      debug: 4.4.3(supports-color@10.2.2)
+      node-abi: 4.33.0
+      node-api-version: 0.2.1
+      node-gyp: 12.4.0
+      read-binary-file-arch: 1.0.6(supports-color@10.2.2)
+    transitivePeerDependencies:
+      - supports-color
 
-  '@csstools/postcss-initial@2.0.0(postcss@8.4.49)':
+  '@electron/universal@2.0.3(supports-color@10.2.2)':
     dependencies:
-      postcss: 8.4.49
+      '@electron/asar': 3.4.1
+      '@malept/cross-spawn-promise': 2.0.0
+      debug: 4.4.3(supports-color@10.2.2)
+      dir-compare: 4.2.0
+      fs-extra: 11.4.0
+      minimatch: 9.0.9
+      plist: 3.1.0
+    transitivePeerDependencies:
+      - supports-color
 
-  '@csstools/postcss-is-pseudo-class@5.0.1(postcss@8.4.49)':
+  '@electron/windows-sign@1.2.2(supports-color@10.2.2)':
     dependencies:
-      '@csstools/selector-specificity': 5.0.0(postcss-selector-parser@7.0.0)
-      postcss: 8.4.49
-      postcss-selector-parser: 7.0.0
+      cross-dirname: 0.1.0
+      debug: 4.4.3(supports-color@10.2.2)
+      fs-extra: 11.4.0
+      minimist: 1.2.8
+      postject: 1.0.0-alpha.6
+    transitivePeerDependencies:
+      - supports-color
+    optional: true
 
-  '@csstools/postcss-light-dark-function@2.0.7(postcss@8.4.49)':
+  '@emnapi/core@1.11.2':
     dependencies:
-      '@csstools/css-parser-algorithms': 3.0.4(@csstools/css-tokenizer@3.0.3)
-      '@csstools/css-tokenizer': 3.0.3
-      '@csstools/postcss-progressive-custom-properties': 4.0.0(postcss@8.4.49)
-      '@csstools/utilities': 2.0.0(postcss@8.4.49)
-      postcss: 8.4.49
+      '@emnapi/wasi-threads': 1.2.2
+      tslib: 2.8.1
+    optional: true
 
-  '@csstools/postcss-logical-float-and-clear@3.0.0(postcss@8.4.49)':
+  '@emnapi/runtime@1.11.2':
     dependencies:
-      postcss: 8.4.49
+      tslib: 2.8.1
+    optional: true
 
-  '@csstools/postcss-logical-overflow@2.0.0(postcss@8.4.49)':
+  '@emnapi/wasi-threads@1.2.2':
     dependencies:
-      postcss: 8.4.49
+      tslib: 2.8.1
+    optional: true
 
-  '@csstools/postcss-logical-overscroll-behavior@2.0.0(postcss@8.4.49)':
-    dependencies:
-      postcss: 8.4.49
-
-  '@csstools/postcss-logical-resize@3.0.0(postcss@8.4.49)':
-    dependencies:
-      postcss: 8.4.49
-      postcss-value-parser: 4.2.0
-
-  '@csstools/postcss-logical-viewport-units@3.0.3(postcss@8.4.49)':
-    dependencies:
-      '@csstools/css-tokenizer': 3.0.3
-      '@csstools/utilities': 2.0.0(postcss@8.4.49)
-      postcss: 8.4.49
-
-  '@csstools/postcss-media-minmax@2.0.5(postcss@8.4.49)':
-    dependencies:
-      '@csstools/css-calc': 2.1.0(@csstools/css-parser-algorithms@3.0.4(@csstools/css-tokenizer@3.0.3))(@csstools/css-tokenizer@3.0.3)
-      '@csstools/css-parser-algorithms': 3.0.4(@csstools/css-tokenizer@3.0.3)
-      '@csstools/css-tokenizer': 3.0.3
-      '@csstools/media-query-list-parser': 4.0.2(@csstools/css-parser-algorithms@3.0.4(@csstools/css-tokenizer@3.0.3))(@csstools/css-tokenizer@3.0.3)
-      postcss: 8.4.49
-
-  '@csstools/postcss-media-queries-aspect-ratio-number-values@3.0.4(postcss@8.4.49)':
-    dependencies:
-      '@csstools/css-parser-algorithms': 3.0.4(@csstools/css-tokenizer@3.0.3)
-      '@csstools/css-tokenizer': 3.0.3
-      '@csstools/media-query-list-parser': 4.0.2(@csstools/css-parser-algorithms@3.0.4(@csstools/css-tokenizer@3.0.3))(@csstools/css-tokenizer@3.0.3)
-      postcss: 8.4.49
-
-  '@csstools/postcss-nested-calc@4.0.0(postcss@8.4.49)':
-    dependencies:
-      '@csstools/utilities': 2.0.0(postcss@8.4.49)
-      postcss: 8.4.49
-      postcss-value-parser: 4.2.0
-
-  '@csstools/postcss-normalize-display-values@4.0.0(postcss@8.4.49)':
-    dependencies:
-      postcss: 8.4.49
-      postcss-value-parser: 4.2.0
-
-  '@csstools/postcss-oklab-function@4.0.6(postcss@8.4.49)':
-    dependencies:
-      '@csstools/css-color-parser': 3.0.6(@csstools/css-parser-algorithms@3.0.4(@csstools/css-tokenizer@3.0.3))(@csstools/css-tokenizer@3.0.3)
-      '@csstools/css-parser-algorithms': 3.0.4(@csstools/css-tokenizer@3.0.3)
-      '@csstools/css-tokenizer': 3.0.3
-      '@csstools/postcss-progressive-custom-properties': 4.0.0(postcss@8.4.49)
-      '@csstools/utilities': 2.0.0(postcss@8.4.49)
-      postcss: 8.4.49
-
-  '@csstools/postcss-progressive-custom-properties@4.0.0(postcss@8.4.49)':
-    dependencies:
-      postcss: 8.4.49
-      postcss-value-parser: 4.2.0
-
-  '@csstools/postcss-random-function@1.0.1(postcss@8.4.49)':
-    dependencies:
-      '@csstools/css-calc': 2.1.0(@csstools/css-parser-algorithms@3.0.4(@csstools/css-tokenizer@3.0.3))(@csstools/css-tokenizer@3.0.3)
-      '@csstools/css-parser-algorithms': 3.0.4(@csstools/css-tokenizer@3.0.3)
-      '@csstools/css-tokenizer': 3.0.3
-      postcss: 8.4.49
-
-  '@csstools/postcss-relative-color-syntax@3.0.6(postcss@8.4.49)':
-    dependencies:
-      '@csstools/css-color-parser': 3.0.6(@csstools/css-parser-algorithms@3.0.4(@csstools/css-tokenizer@3.0.3))(@csstools/css-tokenizer@3.0.3)
-      '@csstools/css-parser-algorithms': 3.0.4(@csstools/css-tokenizer@3.0.3)
-      '@csstools/css-tokenizer': 3.0.3
-      '@csstools/postcss-progressive-custom-properties': 4.0.0(postcss@8.4.49)
-      '@csstools/utilities': 2.0.0(postcss@8.4.49)
-      postcss: 8.4.49
-
-  '@csstools/postcss-scope-pseudo-class@4.0.1(postcss@8.4.49)':
-    dependencies:
-      postcss: 8.4.49
-      postcss-selector-parser: 7.0.0
-
-  '@csstools/postcss-sign-functions@1.1.0(postcss@8.4.49)':
-    dependencies:
-      '@csstools/css-calc': 2.1.0(@csstools/css-parser-algorithms@3.0.4(@csstools/css-tokenizer@3.0.3))(@csstools/css-tokenizer@3.0.3)
-      '@csstools/css-parser-algorithms': 3.0.4(@csstools/css-tokenizer@3.0.3)
-      '@csstools/css-tokenizer': 3.0.3
-      postcss: 8.4.49
-
-  '@csstools/postcss-stepped-value-functions@4.0.5(postcss@8.4.49)':
-    dependencies:
-      '@csstools/css-calc': 2.1.0(@csstools/css-parser-algorithms@3.0.4(@csstools/css-tokenizer@3.0.3))(@csstools/css-tokenizer@3.0.3)
-      '@csstools/css-parser-algorithms': 3.0.4(@csstools/css-tokenizer@3.0.3)
-      '@csstools/css-tokenizer': 3.0.3
-      postcss: 8.4.49
-
-  '@csstools/postcss-text-decoration-shorthand@4.0.1(postcss@8.4.49)':
-    dependencies:
-      '@csstools/color-helpers': 5.0.1
-      postcss: 8.4.49
-      postcss-value-parser: 4.2.0
-
-  '@csstools/postcss-trigonometric-functions@4.0.5(postcss@8.4.49)':
-    dependencies:
-      '@csstools/css-calc': 2.1.0(@csstools/css-parser-algorithms@3.0.4(@csstools/css-tokenizer@3.0.3))(@csstools/css-tokenizer@3.0.3)
-      '@csstools/css-parser-algorithms': 3.0.4(@csstools/css-tokenizer@3.0.3)
-      '@csstools/css-tokenizer': 3.0.3
-      postcss: 8.4.49
-
-  '@csstools/postcss-unset-value@4.0.0(postcss@8.4.49)':
-    dependencies:
-      postcss: 8.4.49
-
-  '@csstools/selector-resolve-nested@3.0.0(postcss-selector-parser@7.0.0)':
-    dependencies:
-      postcss-selector-parser: 7.0.0
-
-  '@csstools/selector-specificity@5.0.0(postcss-selector-parser@7.0.0)':
-    dependencies:
-      postcss-selector-parser: 7.0.0
-
-  '@csstools/utilities@2.0.0(postcss@8.4.49)':
-    dependencies:
-      postcss: 8.4.49
-
-  '@ctrl/tinycolor@4.1.0': {}
-
-  '@dual-bundle/import-meta-resolve@4.1.0': {}
+  '@emotion/hash@0.8.0': {}
 
   '@emotion/hash@0.9.2': {}
 
+  '@emotion/unitless@0.7.5': {}
+
   '@emotion/unitless@0.8.1': {}
 
-  '@es-joy/jsdoccomment@0.49.0':
+  '@epic-web/invariant@1.0.0': {}
+
+  '@es-joy/jsdoccomment@0.88.0':
     dependencies:
-      comment-parser: 1.4.1
-      esquery: 1.6.0
-      jsdoc-type-pratt-parser: 4.1.0
+      '@types/estree': 1.0.9
+      '@typescript-eslint/types': 8.66.0
+      comment-parser: 1.4.7
+      esquery: 1.7.0
+      jsdoc-type-pratt-parser: 7.2.0
 
-  '@esbuild/aix-ppc64@0.24.0':
+  '@esbuild/aix-ppc64@0.25.12':
     optional: true
 
-  '@esbuild/android-arm64@0.24.0':
+  '@esbuild/aix-ppc64@0.28.2':
     optional: true
 
-  '@esbuild/android-arm@0.24.0':
+  '@esbuild/android-arm64@0.25.12':
     optional: true
 
-  '@esbuild/android-x64@0.24.0':
+  '@esbuild/android-arm64@0.28.2':
     optional: true
 
-  '@esbuild/darwin-arm64@0.24.0':
+  '@esbuild/android-arm@0.25.12':
     optional: true
 
-  '@esbuild/darwin-x64@0.24.0':
+  '@esbuild/android-arm@0.28.2':
     optional: true
 
-  '@esbuild/freebsd-arm64@0.24.0':
+  '@esbuild/android-x64@0.25.12':
     optional: true
 
-  '@esbuild/freebsd-x64@0.24.0':
+  '@esbuild/android-x64@0.28.2':
     optional: true
 
-  '@esbuild/linux-arm64@0.24.0':
+  '@esbuild/darwin-arm64@0.25.12':
     optional: true
 
-  '@esbuild/linux-arm@0.24.0':
+  '@esbuild/darwin-arm64@0.28.2':
     optional: true
 
-  '@esbuild/linux-ia32@0.24.0':
+  '@esbuild/darwin-x64@0.25.12':
     optional: true
 
-  '@esbuild/linux-loong64@0.24.0':
+  '@esbuild/darwin-x64@0.28.2':
     optional: true
 
-  '@esbuild/linux-mips64el@0.24.0':
+  '@esbuild/freebsd-arm64@0.25.12':
     optional: true
 
-  '@esbuild/linux-ppc64@0.24.0':
+  '@esbuild/freebsd-arm64@0.28.2':
     optional: true
 
-  '@esbuild/linux-riscv64@0.24.0':
+  '@esbuild/freebsd-x64@0.25.12':
     optional: true
 
-  '@esbuild/linux-s390x@0.24.0':
+  '@esbuild/freebsd-x64@0.28.2':
     optional: true
 
-  '@esbuild/linux-x64@0.24.0':
+  '@esbuild/linux-arm64@0.25.12':
     optional: true
 
-  '@esbuild/netbsd-x64@0.24.0':
+  '@esbuild/linux-arm64@0.28.2':
     optional: true
 
-  '@esbuild/openbsd-arm64@0.24.0':
+  '@esbuild/linux-arm@0.25.12':
     optional: true
 
-  '@esbuild/openbsd-x64@0.24.0':
+  '@esbuild/linux-arm@0.28.2':
     optional: true
 
-  '@esbuild/sunos-x64@0.24.0':
+  '@esbuild/linux-ia32@0.25.12':
     optional: true
 
-  '@esbuild/win32-arm64@0.24.0':
+  '@esbuild/linux-ia32@0.28.2':
     optional: true
 
-  '@esbuild/win32-ia32@0.24.0':
+  '@esbuild/linux-loong64@0.25.12':
     optional: true
 
-  '@esbuild/win32-x64@0.24.0':
+  '@esbuild/linux-loong64@0.28.2':
     optional: true
 
-  '@eslint-community/eslint-utils@4.4.1(eslint@9.17.0(jiti@2.4.2))':
+  '@esbuild/linux-mips64el@0.25.12':
+    optional: true
+
+  '@esbuild/linux-mips64el@0.28.2':
+    optional: true
+
+  '@esbuild/linux-ppc64@0.25.12':
+    optional: true
+
+  '@esbuild/linux-ppc64@0.28.2':
+    optional: true
+
+  '@esbuild/linux-riscv64@0.25.12':
+    optional: true
+
+  '@esbuild/linux-riscv64@0.28.2':
+    optional: true
+
+  '@esbuild/linux-s390x@0.25.12':
+    optional: true
+
+  '@esbuild/linux-s390x@0.28.2':
+    optional: true
+
+  '@esbuild/linux-x64@0.25.12':
+    optional: true
+
+  '@esbuild/linux-x64@0.28.2':
+    optional: true
+
+  '@esbuild/netbsd-arm64@0.25.12':
+    optional: true
+
+  '@esbuild/netbsd-arm64@0.28.2':
+    optional: true
+
+  '@esbuild/netbsd-x64@0.25.12':
+    optional: true
+
+  '@esbuild/netbsd-x64@0.28.2':
+    optional: true
+
+  '@esbuild/openbsd-arm64@0.25.12':
+    optional: true
+
+  '@esbuild/openbsd-arm64@0.28.2':
+    optional: true
+
+  '@esbuild/openbsd-x64@0.25.12':
+    optional: true
+
+  '@esbuild/openbsd-x64@0.28.2':
+    optional: true
+
+  '@esbuild/openharmony-arm64@0.25.12':
+    optional: true
+
+  '@esbuild/openharmony-arm64@0.28.2':
+    optional: true
+
+  '@esbuild/sunos-x64@0.25.12':
+    optional: true
+
+  '@esbuild/sunos-x64@0.28.2':
+    optional: true
+
+  '@esbuild/win32-arm64@0.25.12':
+    optional: true
+
+  '@esbuild/win32-arm64@0.28.2':
+    optional: true
+
+  '@esbuild/win32-ia32@0.25.12':
+    optional: true
+
+  '@esbuild/win32-ia32@0.28.2':
+    optional: true
+
+  '@esbuild/win32-x64@0.25.12':
+    optional: true
+
+  '@esbuild/win32-x64@0.28.2':
+    optional: true
+
+  '@eslint-community/eslint-plugin-eslint-comments@4.7.2(eslint@10.8.1(jiti@2.7.0)(supports-color@10.2.2))':
     dependencies:
-      eslint: 9.17.0(jiti@2.4.2)
+      escape-string-regexp: 4.0.0
+      eslint: 10.8.1(jiti@2.7.0)(supports-color@10.2.2)
+      ignore: 7.0.6
+
+  '@eslint-community/eslint-utils@4.10.1(eslint@10.8.1(jiti@2.7.0)(supports-color@10.2.2))':
+    dependencies:
+      eslint: 10.8.1(jiti@2.7.0)(supports-color@10.2.2)
       eslint-visitor-keys: 3.4.3
 
-  '@eslint-community/regexpp@4.12.1': {}
+  '@eslint-community/regexpp@4.12.2': {}
 
-  '@eslint/config-array@0.19.1':
+  '@eslint/config-array@0.23.5(supports-color@10.2.2)':
     dependencies:
-      '@eslint/object-schema': 2.1.5
-      debug: 4.4.0(supports-color@9.4.0)
-      minimatch: 3.1.2
+      '@eslint/object-schema': 3.0.5
+      debug: 4.4.3(supports-color@10.2.2)
+      minimatch: 10.2.6
     transitivePeerDependencies:
       - supports-color
 
-  '@eslint/core@0.9.1':
+  '@eslint/config-helpers@0.7.0':
+    dependencies:
+      '@eslint/core': 1.2.1
+
+  '@eslint/core@1.2.1':
     dependencies:
       '@types/json-schema': 7.0.15
 
-  '@eslint/eslintrc@3.2.0':
+  '@eslint/css-tree@4.0.5':
     dependencies:
-      ajv: 6.12.6
-      debug: 4.4.0(supports-color@9.4.0)
-      espree: 10.3.0
-      globals: 14.0.0
-      ignore: 5.3.2
-      import-fresh: 3.3.0
-      js-yaml: 4.1.0
-      minimatch: 3.1.2
-      strip-json-comments: 3.1.1
-    transitivePeerDependencies:
-      - supports-color
+      mdn-data: 2.29.0
+      source-map-js: 1.2.1
 
-  '@eslint/js@9.17.0': {}
+  '@eslint/js@10.0.1(eslint@10.8.1(jiti@2.7.0)(supports-color@10.2.2))':
+    optionalDependencies:
+      eslint: 10.8.1(jiti@2.7.0)(supports-color@10.2.2)
 
-  '@eslint/object-schema@2.1.5': {}
+  '@eslint/object-schema@3.0.5': {}
 
-  '@eslint/plugin-kit@0.2.4':
+  '@eslint/plugin-kit@0.7.2':
     dependencies:
+      '@eslint/core': 1.2.1
       levn: 0.4.1
 
   '@fast-csv/format@4.3.5':
@@ -11963,122 +14131,144 @@ snapshots:
       lodash.isundefined: 3.0.1
       lodash.uniq: 4.5.0
 
-  '@floating-ui/core@1.6.8':
+  '@floating-ui/core@1.8.0':
     dependencies:
-      '@floating-ui/utils': 0.2.8
+      '@floating-ui/utils': 0.2.12
 
-  '@floating-ui/dom@1.6.12':
+  '@floating-ui/dom@1.8.0':
     dependencies:
-      '@floating-ui/core': 1.6.8
-      '@floating-ui/utils': 0.2.8
+      '@floating-ui/core': 1.8.0
+      '@floating-ui/utils': 0.2.12
 
-  '@floating-ui/utils@0.2.8': {}
+  '@floating-ui/utils@0.2.12': {}
 
-  '@floating-ui/vue@1.1.5(vue@3.5.13(typescript@5.7.2))':
+  '@floating-ui/vue@1.1.11(vue@3.5.41(typescript@6.0.3))':
     dependencies:
-      '@floating-ui/dom': 1.6.12
-      '@floating-ui/utils': 0.2.8
-      vue-demi: 0.14.10(vue@3.5.13(typescript@5.7.2))
+      '@floating-ui/dom': 1.8.0
+      '@floating-ui/utils': 0.2.12
+      vue-demi: 0.14.10(vue@3.5.41(typescript@6.0.3))
     transitivePeerDependencies:
       - '@vue/composition-api'
       - vue
 
   '@fortawesome/fontawesome-free@6.7.2': {}
 
-  '@gar/promisify@1.1.3': {}
-
-  '@humanfs/core@0.19.1': {}
-
-  '@humanfs/node@0.16.6':
+  '@humanfs/core@0.19.2':
     dependencies:
-      '@humanfs/core': 0.19.1
-      '@humanwhocodes/retry': 0.3.1
+      '@humanfs/types': 0.15.0
+
+  '@humanfs/node@0.16.8':
+    dependencies:
+      '@humanfs/core': 0.19.2
+      '@humanfs/types': 0.15.0
+      '@humanwhocodes/retry': 0.4.3
+
+  '@humanfs/types@0.15.0': {}
 
   '@humanwhocodes/module-importer@1.0.1': {}
 
-  '@humanwhocodes/retry@0.3.1': {}
+  '@humanwhocodes/retry@0.4.3': {}
 
-  '@humanwhocodes/retry@0.4.1': {}
-
-  '@iconify/json@2.2.286':
+  '@iconify/json@2.2.513':
     dependencies:
       '@iconify/types': 2.0.0
-      pathe: 1.1.2
+      pathe: 2.0.3
 
-  '@iconify/tailwind@1.2.0':
+  '@iconify/tailwind4@1.2.3(tailwindcss@4.3.3)':
     dependencies:
+      '@iconify/tools': 5.0.12
       '@iconify/types': 2.0.0
+      '@iconify/utils': 3.1.4
+      tailwindcss: 4.3.3
+
+  '@iconify/tools@5.0.12':
+    dependencies:
+      '@cyberalien/svg-utils': 1.2.19
+      '@iconify/types': 2.0.0
+      '@iconify/utils': 3.1.4
+      fflate: 0.8.3
+      modern-tar: 0.7.7
+      pathe: 2.0.3
+      svgo: 4.0.2
 
   '@iconify/types@2.0.0': {}
 
-  '@iconify/vue@4.2.0(vue@3.5.13(typescript@5.7.2))':
+  '@iconify/utils@3.1.4':
+    dependencies:
+      '@antfu/install-pkg': 1.1.0
+      '@iconify/types': 2.0.0
+      import-meta-resolve: 4.2.0
+
+  '@iconify/vue@5.0.1(vue@3.5.41(typescript@6.0.3))':
     dependencies:
       '@iconify/types': 2.0.0
-      vue: 3.5.13(typescript@5.7.2)
+      vue: 3.5.41(typescript@6.0.3)
 
-  '@internationalized/date@3.6.0':
+  '@inquirer/external-editor@1.0.3(@types/node@25.9.5)':
     dependencies:
-      '@swc/helpers': 0.5.15
+      chardet: 2.2.0
+      iconv-lite: 0.7.3
+    optionalDependencies:
+      '@types/node': 25.9.5
 
-  '@internationalized/number@3.6.0':
+  '@internationalized/date@3.12.3':
     dependencies:
-      '@swc/helpers': 0.5.15
+      '@swc/helpers': 0.5.23
 
-  '@intlify/bundle-utils@10.0.0(vue-i18n@10.0.5(vue@3.5.13(typescript@5.7.2)))':
+  '@internationalized/number@3.6.7':
     dependencies:
-      '@intlify/message-compiler': 12.0.0-alpha.4
-      '@intlify/shared': 12.0.0-alpha.4
-      acorn: 8.14.0
+      '@swc/helpers': 0.5.23
+
+  '@intlify/bundle-utils@11.2.4(vue-i18n@11.4.8(vue@3.5.41(typescript@6.0.3)))':
+    dependencies:
+      '@intlify/message-compiler': 11.4.8
+      '@intlify/shared': 11.4.8
+      acorn: 8.18.0
+      esbuild: 0.25.12
       escodegen: 2.1.0
       estree-walker: 2.0.2
-      jsonc-eslint-parser: 2.4.0
-      mlly: 1.7.3
+      jsonc-eslint-parser: 2.4.2
       source-map-js: 1.2.1
-      yaml-eslint-parser: 1.2.3
+      yaml-eslint-parser: 1.3.2
     optionalDependencies:
-      vue-i18n: 10.0.5(vue@3.5.13(typescript@5.7.2))
+      vue-i18n: 11.4.8(vue@3.5.41(typescript@6.0.3))
 
-  '@intlify/core-base@10.0.5':
+  '@intlify/core-base@11.4.8':
     dependencies:
-      '@intlify/message-compiler': 10.0.5
-      '@intlify/shared': 10.0.5
+      '@intlify/devtools-types': 11.4.8
+      '@intlify/message-compiler': 11.4.8
+      '@intlify/shared': 11.4.8
 
-  '@intlify/message-compiler@10.0.5':
+  '@intlify/devtools-types@11.4.8':
     dependencies:
-      '@intlify/shared': 10.0.5
+      '@intlify/core-base': 11.4.8
+      '@intlify/shared': 11.4.8
+
+  '@intlify/message-compiler@11.4.8':
+    dependencies:
+      '@intlify/shared': 11.4.8
       source-map-js: 1.2.1
 
-  '@intlify/message-compiler@12.0.0-alpha.4':
+  '@intlify/shared@11.4.8': {}
+
+  '@intlify/unplugin-vue-i18n@11.2.4(@vue/compiler-dom@3.5.41)(eslint@10.8.1(jiti@2.7.0)(supports-color@10.2.2))(rollup@4.62.4)(supports-color@10.2.2)(typescript@6.0.3)(vite@8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0))(vue-i18n@11.4.8(vue@3.5.41(typescript@6.0.3)))(vue@3.5.41(typescript@6.0.3))':
     dependencies:
-      '@intlify/shared': 12.0.0-alpha.4
-      source-map-js: 1.2.1
-
-  '@intlify/shared@10.0.5': {}
-
-  '@intlify/shared@11.4.6': {}
-
-  '@intlify/shared@12.0.0-alpha.4': {}
-
-  '@intlify/unplugin-vue-i18n@6.0.1(@vue/compiler-dom@3.5.13)(eslint@9.17.0(jiti@2.4.2))(rollup@4.28.1)(typescript@5.7.2)(vue-i18n@10.0.5(vue@3.5.13(typescript@5.7.2)))(vue@3.5.13(typescript@5.7.2))':
-    dependencies:
-      '@eslint-community/eslint-utils': 4.4.1(eslint@9.17.0(jiti@2.4.2))
-      '@intlify/bundle-utils': 10.0.0(vue-i18n@10.0.5(vue@3.5.13(typescript@5.7.2)))
-      '@intlify/shared': 11.4.6
-      '@intlify/vue-i18n-extensions': 7.0.0(@intlify/shared@11.4.6)(@vue/compiler-dom@3.5.13)(vue-i18n@10.0.5(vue@3.5.13(typescript@5.7.2)))(vue@3.5.13(typescript@5.7.2))
-      '@rollup/pluginutils': 5.1.4(rollup@4.28.1)
-      '@typescript-eslint/scope-manager': 8.18.1
-      '@typescript-eslint/typescript-estree': 8.18.1(typescript@5.7.2)
-      debug: 4.4.0(supports-color@9.4.0)
-      fast-glob: 3.3.2
-      js-yaml: 4.1.0
-      json5: 2.2.3
-      pathe: 1.1.2
+      '@eslint-community/eslint-utils': 4.10.1(eslint@10.8.1(jiti@2.7.0)(supports-color@10.2.2))
+      '@intlify/bundle-utils': 11.2.4(vue-i18n@11.4.8(vue@3.5.41(typescript@6.0.3)))
+      '@intlify/shared': 11.4.8
+      '@intlify/vue-i18n-extensions': 8.0.0(@intlify/shared@11.4.8)(@vue/compiler-dom@3.5.41)(vue-i18n@11.4.8(vue@3.5.41(typescript@6.0.3)))(vue@3.5.41(typescript@6.0.3))
+      '@rollup/pluginutils': 5.4.0(rollup@4.62.4)
+      '@typescript-eslint/scope-manager': 8.66.0
+      '@typescript-eslint/typescript-estree': 8.66.0(supports-color@10.2.2)(typescript@6.0.3)
+      debug: 4.4.3(supports-color@10.2.2)
+      fast-glob: 3.3.3
+      pathe: 2.0.3
       picocolors: 1.1.1
-      source-map-js: 1.2.1
-      unplugin: 1.16.0
-      vue: 3.5.13(typescript@5.7.2)
+      unplugin: 2.3.11
+      vue: 3.5.41(typescript@6.0.3)
     optionalDependencies:
-      vue-i18n: 10.0.5(vue@3.5.13(typescript@5.7.2))
+      vite: 8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0)
+      vue-i18n: 11.4.8(vue@3.5.41(typescript@6.0.3))
     transitivePeerDependencies:
       - '@vue/compiler-dom'
       - eslint
@@ -12086,251 +14276,255 @@ snapshots:
       - supports-color
       - typescript
 
-  '@intlify/vue-i18n-extensions@7.0.0(@intlify/shared@11.4.6)(@vue/compiler-dom@3.5.13)(vue-i18n@10.0.5(vue@3.5.13(typescript@5.7.2)))(vue@3.5.13(typescript@5.7.2))':
+  '@intlify/vue-i18n-extensions@8.0.0(@intlify/shared@11.4.8)(@vue/compiler-dom@3.5.41)(vue-i18n@11.4.8(vue@3.5.41(typescript@6.0.3)))(vue@3.5.41(typescript@6.0.3))':
     dependencies:
-      '@babel/parser': 7.26.3
+      '@babel/parser': 7.29.8
     optionalDependencies:
-      '@intlify/shared': 11.4.6
-      '@vue/compiler-dom': 3.5.13
-      vue: 3.5.13(typescript@5.7.2)
-      vue-i18n: 10.0.5(vue@3.5.13(typescript@5.7.2))
+      '@intlify/shared': 11.4.8
+      '@vue/compiler-dom': 3.5.41
+      vue: 3.5.41(typescript@6.0.3)
+      vue-i18n: 11.4.8(vue@3.5.41(typescript@6.0.3))
 
-  '@ioredis/commands@1.2.0': {}
+  '@ioredis/commands@1.10.0': {}
 
   '@isaacs/cliui@8.0.2':
     dependencies:
       string-width: 5.1.2
       string-width-cjs: string-width@4.2.3
-      strip-ansi: 7.1.0
+      strip-ansi: 7.2.0
       strip-ansi-cjs: strip-ansi@6.0.1
       wrap-ansi: 8.1.0
       wrap-ansi-cjs: wrap-ansi@7.0.0
 
+  '@isaacs/cliui@9.0.0': {}
+
   '@isaacs/fs-minipass@4.0.1':
     dependencies:
-      minipass: 7.1.2
+      minipass: 7.1.3
 
-  '@jridgewell/gen-mapping@0.3.8':
+  '@jridgewell/gen-mapping@0.3.13':
     dependencies:
-      '@jridgewell/set-array': 1.2.1
-      '@jridgewell/sourcemap-codec': 1.5.0
-      '@jridgewell/trace-mapping': 0.3.25
+      '@jridgewell/sourcemap-codec': 1.5.5
+      '@jridgewell/trace-mapping': 0.3.31
+
+  '@jridgewell/remapping@2.3.5':
+    dependencies:
+      '@jridgewell/gen-mapping': 0.3.13
+      '@jridgewell/trace-mapping': 0.3.31
 
   '@jridgewell/resolve-uri@3.1.2': {}
 
-  '@jridgewell/set-array@1.2.1': {}
-
-  '@jridgewell/source-map@0.3.6':
+  '@jridgewell/source-map@0.3.11':
     dependencies:
-      '@jridgewell/gen-mapping': 0.3.8
-      '@jridgewell/trace-mapping': 0.3.25
+      '@jridgewell/gen-mapping': 0.3.13
+      '@jridgewell/trace-mapping': 0.3.31
 
-  '@jridgewell/sourcemap-codec@1.5.0': {}
+  '@jridgewell/sourcemap-codec@1.5.5': {}
 
-  '@jridgewell/trace-mapping@0.3.25':
+  '@jridgewell/trace-mapping@0.3.31':
     dependencies:
       '@jridgewell/resolve-uri': 3.1.2
-      '@jridgewell/sourcemap-codec': 1.5.0
+      '@jridgewell/sourcemap-codec': 1.5.5
 
-  '@jspm/generator@2.4.1':
+  '@jspm/fetch@0.1.0': {}
+
+  '@jspm/generator@2.16.3(supports-color@10.2.2)':
     dependencies:
-      '@babel/core': 7.26.0
-      '@babel/plugin-syntax-import-attributes': 7.26.0(@babel/core@7.26.0)
-      '@babel/preset-typescript': 7.26.0(@babel/core@7.26.0)
-      '@jspm/import-map': 1.1.0
-      es-module-lexer: 1.5.4
-      make-fetch-happen: 8.0.14
-      sver: 1.8.4
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/plugin-syntax-import-attributes': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))
+      '@babel/preset-typescript': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
+      '@jspm/fetch': 0.1.0
+      '@jspm/import-map': 1.5.0
+      es-module-lexer: 2.3.1
+      minimatch: 10.2.6
+      pako: 2.2.0
+      sver: 2.0.1
+      tar-stream: 3.2.0
     transitivePeerDependencies:
-      - bluebird
+      - bare-abort-controller
+      - bare-buffer
+      - react-native-b4a
       - supports-color
 
-  '@jspm/import-map@1.1.0': {}
+  '@jspm/import-map@1.5.0': {}
 
-  '@lezer/common@1.2.3': {}
-
-  '@lezer/cpp@1.1.3':
+  '@keyv/bigmap@1.3.1(keyv@5.6.0)':
     dependencies:
-      '@lezer/common': 1.2.3
-      '@lezer/highlight': 1.2.1
-      '@lezer/lr': 1.4.2
+      hashery: 1.5.1
+      hookified: 1.15.1
+      keyv: 5.6.0
 
-  '@lezer/css@1.1.11':
-    dependencies:
-      '@lezer/common': 1.2.3
-      '@lezer/highlight': 1.2.1
-      '@lezer/lr': 1.4.2
+  '@keyv/serialize@1.1.1': {}
 
-  '@lezer/go@1.0.0':
-    dependencies:
-      '@lezer/common': 1.2.3
-      '@lezer/highlight': 1.2.1
-      '@lezer/lr': 1.4.2
+  '@lezer/common@1.5.2': {}
 
-  '@lezer/highlight@1.2.1':
+  '@lezer/cpp@1.1.6':
     dependencies:
-      '@lezer/common': 1.2.3
+      '@lezer/common': 1.5.2
+      '@lezer/highlight': 1.2.3
+      '@lezer/lr': 1.4.10
 
-  '@lezer/html@1.3.10':
+  '@lezer/css@1.3.6':
     dependencies:
-      '@lezer/common': 1.2.3
-      '@lezer/highlight': 1.2.1
-      '@lezer/lr': 1.4.2
+      '@lezer/common': 1.5.2
+      '@lezer/highlight': 1.2.3
+      '@lezer/lr': 1.4.10
+
+  '@lezer/go@1.0.1':
+    dependencies:
+      '@lezer/common': 1.5.2
+      '@lezer/highlight': 1.2.3
+      '@lezer/lr': 1.4.10
+
+  '@lezer/highlight@1.2.3':
+    dependencies:
+      '@lezer/common': 1.5.2
+
+  '@lezer/html@1.3.13':
+    dependencies:
+      '@lezer/common': 1.5.2
+      '@lezer/highlight': 1.2.3
+      '@lezer/lr': 1.4.10
 
   '@lezer/java@1.1.3':
     dependencies:
-      '@lezer/common': 1.2.3
-      '@lezer/highlight': 1.2.1
-      '@lezer/lr': 1.4.2
+      '@lezer/common': 1.5.2
+      '@lezer/highlight': 1.2.3
+      '@lezer/lr': 1.4.10
 
-  '@lezer/javascript@1.4.21':
+  '@lezer/javascript@1.5.4':
     dependencies:
-      '@lezer/common': 1.2.3
-      '@lezer/highlight': 1.2.1
-      '@lezer/lr': 1.4.2
+      '@lezer/common': 1.5.2
+      '@lezer/highlight': 1.2.3
+      '@lezer/lr': 1.4.10
 
   '@lezer/json@1.0.3':
     dependencies:
-      '@lezer/common': 1.2.3
-      '@lezer/highlight': 1.2.1
-      '@lezer/lr': 1.4.2
+      '@lezer/common': 1.5.2
+      '@lezer/highlight': 1.2.3
+      '@lezer/lr': 1.4.10
 
-  '@lezer/lr@1.4.2':
+  '@lezer/lr@1.4.10':
     dependencies:
-      '@lezer/common': 1.2.3
+      '@lezer/common': 1.5.2
 
-  '@lezer/markdown@1.4.2':
+  '@lezer/markdown@1.7.2':
     dependencies:
-      '@lezer/common': 1.2.3
-      '@lezer/highlight': 1.2.1
+      '@lezer/common': 1.5.2
+      '@lezer/highlight': 1.2.3
 
-  '@lezer/php@1.0.2':
+  '@lezer/php@1.0.5':
     dependencies:
-      '@lezer/common': 1.2.3
-      '@lezer/highlight': 1.2.1
-      '@lezer/lr': 1.4.2
+      '@lezer/common': 1.5.2
+      '@lezer/highlight': 1.2.3
+      '@lezer/lr': 1.4.10
 
-  '@lezer/python@1.1.17':
+  '@lezer/python@1.1.19':
     dependencies:
-      '@lezer/common': 1.2.3
-      '@lezer/highlight': 1.2.1
-      '@lezer/lr': 1.4.2
+      '@lezer/common': 1.5.2
+      '@lezer/highlight': 1.2.3
+      '@lezer/lr': 1.4.10
 
   '@lezer/rust@1.0.2':
     dependencies:
-      '@lezer/common': 1.2.3
-      '@lezer/highlight': 1.2.1
-      '@lezer/lr': 1.4.2
+      '@lezer/common': 1.5.2
+      '@lezer/highlight': 1.2.3
+      '@lezer/lr': 1.4.10
 
-  '@lezer/sass@1.0.7':
+  '@lezer/sass@1.1.0':
     dependencies:
-      '@lezer/common': 1.2.3
-      '@lezer/highlight': 1.2.1
-      '@lezer/lr': 1.4.2
+      '@lezer/common': 1.5.2
+      '@lezer/highlight': 1.2.3
+      '@lezer/lr': 1.4.10
 
   '@lezer/xml@1.0.6':
     dependencies:
-      '@lezer/common': 1.2.3
-      '@lezer/highlight': 1.2.1
-      '@lezer/lr': 1.4.2
+      '@lezer/common': 1.5.2
+      '@lezer/highlight': 1.2.3
+      '@lezer/lr': 1.4.10
 
-  '@lezer/yaml@1.0.3':
+  '@lezer/yaml@1.0.4':
     dependencies:
-      '@lezer/common': 1.2.3
-      '@lezer/highlight': 1.2.1
-      '@lezer/lr': 1.4.2
+      '@lezer/common': 1.5.2
+      '@lezer/highlight': 1.2.3
+      '@lezer/lr': 1.4.10
+
+  '@lucide/vue@1.31.0(vue@3.5.41(typescript@6.0.3))':
+    dependencies:
+      vue: 3.5.41(typescript@6.0.3)
+
+  '@malept/cross-spawn-promise@2.0.0':
+    dependencies:
+      cross-spawn: 7.0.6
+
+  '@malept/flatpak-bundler@0.4.0(supports-color@10.2.2)':
+    dependencies:
+      debug: 4.4.3(supports-color@10.2.2)
+      fs-extra: 9.1.0
+      lodash: 4.18.1
+      tmp-promise: 3.0.3
+    transitivePeerDependencies:
+      - supports-color
 
   '@manypkg/find-root@1.1.0':
     dependencies:
-      '@babel/runtime': 7.26.0
+      '@babel/runtime': 7.29.7
       '@types/node': 12.20.55
       find-up: 4.1.0
       fs-extra: 8.1.0
 
-  '@manypkg/find-root@2.2.3':
+  '@manypkg/find-root@3.1.0':
     dependencies:
-      '@manypkg/tools': 1.1.2
+      '@manypkg/tools': 2.1.2
 
   '@manypkg/get-packages@1.1.3':
     dependencies:
-      '@babel/runtime': 7.26.0
+      '@babel/runtime': 7.29.7
       '@changesets/types': 4.1.0
       '@manypkg/find-root': 1.1.0
       fs-extra: 8.1.0
       globby: 11.1.0
       read-yaml-file: 1.1.0
 
-  '@manypkg/get-packages@2.2.2':
+  '@manypkg/get-packages@3.1.0':
     dependencies:
-      '@manypkg/find-root': 2.2.3
-      '@manypkg/tools': 1.1.2
+      '@manypkg/find-root': 3.1.0
+      '@manypkg/tools': 2.1.2
 
-  '@manypkg/tools@1.1.2':
+  '@manypkg/tools@2.1.2':
     dependencies:
-      fast-glob: 3.3.2
       jju: 1.4.0
-      js-yaml: 4.1.0
+      tinyglobby: 0.2.17
+      yaml: 2.9.0
 
-  '@mapbox/node-pre-gyp@2.0.0-rc.0(encoding@0.1.13)':
+  '@mapbox/node-pre-gyp@2.0.3(supports-color@10.2.2)':
     dependencies:
-      consola: 3.3.0
-      detect-libc: 2.0.3
-      https-proxy-agent: 7.0.6(supports-color@9.4.0)
-      node-fetch: 2.7.0(encoding@0.1.13)
-      nopt: 8.0.0
-      semver: 7.6.3
-      tar: 7.4.3
+      consola: 3.4.2
+      detect-libc: 2.1.2
+      https-proxy-agent: 7.0.6(supports-color@10.2.2)
+      node-fetch: 2.7.0
+      nopt: 8.1.0
+      semver: 7.8.5
+      tar: 7.5.22
     transitivePeerDependencies:
       - encoding
       - supports-color
 
-  '@marijn/find-cluster-break@1.0.2': {}
+  '@marijn/find-cluster-break@1.0.3': {}
 
-  '@microsoft/api-extractor-model@7.29.6(@types/node@22.10.2)':
+  '@napi-rs/lzma-linux-x64-gnu@1.5.1':
+    optional: true
+
+  '@napi-rs/wasm-runtime@1.2.2(@emnapi/core@1.11.2)(@emnapi/runtime@1.11.2)':
     dependencies:
-      '@microsoft/tsdoc': 0.15.1
-      '@microsoft/tsdoc-config': 0.17.1
-      '@rushstack/node-core-library': 5.7.0(@types/node@22.10.2)
-    transitivePeerDependencies:
-      - '@types/node'
+      '@emnapi/core': 1.11.2
+      '@emnapi/runtime': 1.11.2
+      '@tybys/wasm-util': 0.10.3
+    optional: true
 
-  '@microsoft/api-extractor@7.47.7(@types/node@22.10.2)':
-    dependencies:
-      '@microsoft/api-extractor-model': 7.29.6(@types/node@22.10.2)
-      '@microsoft/tsdoc': 0.15.1
-      '@microsoft/tsdoc-config': 0.17.1
-      '@rushstack/node-core-library': 5.7.0(@types/node@22.10.2)
-      '@rushstack/rig-package': 0.5.3
-      '@rushstack/terminal': 0.14.0(@types/node@22.10.2)
-      '@rushstack/ts-command-line': 4.22.6(@types/node@22.10.2)
-      lodash: 4.17.21
-      minimatch: 3.0.8
-      resolve: 1.22.10
-      semver: 7.5.4
-      source-map: 0.6.1
-      typescript: 5.4.2
-    transitivePeerDependencies:
-      - '@types/node'
+  '@noble/hashes@1.4.0': {}
 
-  '@microsoft/tsdoc-config@0.17.1':
-    dependencies:
-      '@microsoft/tsdoc': 0.15.1
-      ajv: 8.12.0
-      jju: 1.4.0
-      resolve: 1.22.10
-
-  '@microsoft/tsdoc@0.15.1': {}
-
-  '@netlify/functions@2.8.2':
-    dependencies:
-      '@netlify/serverless-functions-api': 1.26.1
-
-  '@netlify/node-cookies@0.1.0': {}
-
-  '@netlify/serverless-functions-api@1.26.1':
-    dependencies:
-      '@netlify/node-cookies': 0.1.0
-      urlpattern-polyfill: 8.0.2
+  '@noble/hashes@2.3.0': {}
 
   '@nodelib/fs.scandir@2.1.5':
     dependencies:
@@ -12342,535 +14536,1101 @@ snapshots:
   '@nodelib/fs.walk@1.2.8':
     dependencies:
       '@nodelib/fs.scandir': 2.1.5
-      fastq: 1.17.1
+      fastq: 1.20.1
 
-  '@npmcli/fs@1.1.1':
+  '@nuxt/kit@3.21.11(magicast@0.5.4)':
     dependencies:
-      '@gar/promisify': 1.1.3
-      semver: 7.6.3
-
-  '@npmcli/move-file@1.1.2':
-    dependencies:
-      mkdirp: 1.0.4
-      rimraf: 3.0.2
-
-  '@nuxt/kit@3.14.1592(magicast@0.3.5)(rollup@4.28.1)':
-    dependencies:
-      '@nuxt/schema': 3.14.1592(magicast@0.3.5)(rollup@4.28.1)
-      c12: 2.0.1(magicast@0.3.5)
-      consola: 3.3.0
-      defu: 6.1.4
-      destr: 2.0.3
-      globby: 14.0.2
-      hash-sum: 2.0.0
-      ignore: 6.0.2
-      jiti: 2.4.2
+      c12: 3.3.4(magicast@0.5.4)
+      consola: 3.4.2
+      defu: 6.1.7
+      destr: 2.0.5
+      errx: 0.1.2
+      exsolve: 1.1.1
+      ignore: 7.0.6
+      jiti: 2.7.0
       klona: 2.0.6
-      knitwork: 1.2.0
-      mlly: 1.7.3
-      pathe: 1.1.2
-      pkg-types: 1.2.1
+      knitwork: 1.3.0
+      mlly: 1.8.2
+      ohash: 2.0.11
+      pathe: 2.0.3
+      pkg-types: 2.3.1
+      rc9: 3.0.1
       scule: 1.3.0
-      semver: 7.6.3
-      ufo: 1.5.4
-      unctx: 2.4.1
-      unimport: 3.14.5(rollup@4.28.1)
-      untyped: 1.5.2
+      semver: 7.8.5
+      tinyglobby: 0.2.17
+      ufo: 1.6.4
+      unctx: 2.5.0
+      untyped: 2.0.0
     transitivePeerDependencies:
       - magicast
-      - rollup
-      - supports-color
-
-  '@nuxt/schema@3.14.1592(magicast@0.3.5)(rollup@4.28.1)':
-    dependencies:
-      c12: 2.0.1(magicast@0.3.5)
-      compatx: 0.1.8
-      consola: 3.3.0
-      defu: 6.1.4
-      hookable: 5.5.3
-      pathe: 1.1.2
-      pkg-types: 1.2.1
-      scule: 1.3.0
-      std-env: 3.8.0
-      ufo: 1.5.4
-      uncrypto: 0.1.3
-      unimport: 3.14.5(rollup@4.28.1)
-      untyped: 1.5.2
-    transitivePeerDependencies:
-      - magicast
-      - rollup
-      - supports-color
+    optional: true
 
   '@one-ini/wasm@0.1.1': {}
 
-  '@parcel/watcher-android-arm64@2.5.0':
+  '@ota-meshi/ast-token-store@0.3.0': {}
+
+  '@oxc-parser/binding-android-arm-eabi@0.142.0':
     optional: true
 
-  '@parcel/watcher-darwin-arm64@2.5.0':
+  '@oxc-parser/binding-android-arm64@0.142.0':
     optional: true
 
-  '@parcel/watcher-darwin-x64@2.5.0':
+  '@oxc-parser/binding-darwin-arm64@0.142.0':
     optional: true
 
-  '@parcel/watcher-freebsd-x64@2.5.0':
+  '@oxc-parser/binding-darwin-x64@0.142.0':
     optional: true
 
-  '@parcel/watcher-linux-arm-glibc@2.5.0':
+  '@oxc-parser/binding-freebsd-x64@0.142.0':
     optional: true
 
-  '@parcel/watcher-linux-arm-musl@2.5.0':
+  '@oxc-parser/binding-linux-arm-gnueabihf@0.142.0':
     optional: true
 
-  '@parcel/watcher-linux-arm64-glibc@2.5.0':
+  '@oxc-parser/binding-linux-arm-musleabihf@0.142.0':
     optional: true
 
-  '@parcel/watcher-linux-arm64-musl@2.5.0':
+  '@oxc-parser/binding-linux-arm64-gnu@0.142.0':
     optional: true
 
-  '@parcel/watcher-linux-x64-glibc@2.5.0':
+  '@oxc-parser/binding-linux-arm64-musl@0.142.0':
     optional: true
 
-  '@parcel/watcher-linux-x64-musl@2.5.0':
+  '@oxc-parser/binding-linux-ppc64-gnu@0.142.0':
     optional: true
 
-  '@parcel/watcher-wasm@2.5.0':
+  '@oxc-parser/binding-linux-riscv64-gnu@0.142.0':
+    optional: true
+
+  '@oxc-parser/binding-linux-riscv64-musl@0.142.0':
+    optional: true
+
+  '@oxc-parser/binding-linux-s390x-gnu@0.142.0':
+    optional: true
+
+  '@oxc-parser/binding-linux-x64-gnu@0.142.0':
+    optional: true
+
+  '@oxc-parser/binding-linux-x64-musl@0.142.0':
+    optional: true
+
+  '@oxc-parser/binding-openharmony-arm64@0.142.0':
+    optional: true
+
+  '@oxc-parser/binding-wasm32-wasi@0.142.0':
+    dependencies:
+      '@emnapi/core': 1.11.2
+      '@emnapi/runtime': 1.11.2
+      '@napi-rs/wasm-runtime': 1.2.2(@emnapi/core@1.11.2)(@emnapi/runtime@1.11.2)
+    optional: true
+
+  '@oxc-parser/binding-win32-arm64-msvc@0.142.0':
+    optional: true
+
+  '@oxc-parser/binding-win32-ia32-msvc@0.142.0':
+    optional: true
+
+  '@oxc-parser/binding-win32-x64-msvc@0.142.0':
+    optional: true
+
+  '@oxc-project/types@0.142.0': {}
+
+  '@oxc-project/types@0.143.0': {}
+
+  '@oxc-resolver/binding-android-arm-eabi@11.24.2':
+    optional: true
+
+  '@oxc-resolver/binding-android-arm64@11.24.2':
+    optional: true
+
+  '@oxc-resolver/binding-darwin-arm64@11.24.2':
+    optional: true
+
+  '@oxc-resolver/binding-darwin-x64@11.24.2':
+    optional: true
+
+  '@oxc-resolver/binding-freebsd-x64@11.24.2':
+    optional: true
+
+  '@oxc-resolver/binding-linux-arm-gnueabihf@11.24.2':
+    optional: true
+
+  '@oxc-resolver/binding-linux-arm-musleabihf@11.24.2':
+    optional: true
+
+  '@oxc-resolver/binding-linux-arm64-gnu@11.24.2':
+    optional: true
+
+  '@oxc-resolver/binding-linux-arm64-musl@11.24.2':
+    optional: true
+
+  '@oxc-resolver/binding-linux-ppc64-gnu@11.24.2':
+    optional: true
+
+  '@oxc-resolver/binding-linux-riscv64-gnu@11.24.2':
+    optional: true
+
+  '@oxc-resolver/binding-linux-riscv64-musl@11.24.2':
+    optional: true
+
+  '@oxc-resolver/binding-linux-s390x-gnu@11.24.2':
+    optional: true
+
+  '@oxc-resolver/binding-linux-x64-gnu@11.24.2':
+    optional: true
+
+  '@oxc-resolver/binding-linux-x64-musl@11.24.2':
+    optional: true
+
+  '@oxc-resolver/binding-openharmony-arm64@11.24.2':
+    optional: true
+
+  '@oxc-resolver/binding-wasm32-wasi@11.24.2':
+    dependencies:
+      '@emnapi/core': 1.11.2
+      '@emnapi/runtime': 1.11.2
+      '@napi-rs/wasm-runtime': 1.2.2(@emnapi/core@1.11.2)(@emnapi/runtime@1.11.2)
+    optional: true
+
+  '@oxc-resolver/binding-win32-arm64-msvc@11.24.2':
+    optional: true
+
+  '@oxc-resolver/binding-win32-x64-msvc@11.24.2':
+    optional: true
+
+  '@oxfmt/binding-android-arm-eabi@0.60.0':
+    optional: true
+
+  '@oxfmt/binding-android-arm64@0.60.0':
+    optional: true
+
+  '@oxfmt/binding-darwin-arm64@0.60.0':
+    optional: true
+
+  '@oxfmt/binding-darwin-x64@0.60.0':
+    optional: true
+
+  '@oxfmt/binding-freebsd-x64@0.60.0':
+    optional: true
+
+  '@oxfmt/binding-linux-arm-gnueabihf@0.60.0':
+    optional: true
+
+  '@oxfmt/binding-linux-arm-musleabihf@0.60.0':
+    optional: true
+
+  '@oxfmt/binding-linux-arm64-gnu@0.60.0':
+    optional: true
+
+  '@oxfmt/binding-linux-arm64-musl@0.60.0':
+    optional: true
+
+  '@oxfmt/binding-linux-ppc64-gnu@0.60.0':
+    optional: true
+
+  '@oxfmt/binding-linux-riscv64-gnu@0.60.0':
+    optional: true
+
+  '@oxfmt/binding-linux-riscv64-musl@0.60.0':
+    optional: true
+
+  '@oxfmt/binding-linux-s390x-gnu@0.60.0':
+    optional: true
+
+  '@oxfmt/binding-linux-x64-gnu@0.60.0':
+    optional: true
+
+  '@oxfmt/binding-linux-x64-musl@0.60.0':
+    optional: true
+
+  '@oxfmt/binding-openharmony-arm64@0.60.0':
+    optional: true
+
+  '@oxfmt/binding-win32-arm64-msvc@0.60.0':
+    optional: true
+
+  '@oxfmt/binding-win32-ia32-msvc@0.60.0':
+    optional: true
+
+  '@oxfmt/binding-win32-x64-msvc@0.60.0':
+    optional: true
+
+  '@oxlint-tsgolint/darwin-arm64@0.25.0':
+    optional: true
+
+  '@oxlint-tsgolint/darwin-x64@0.25.0':
+    optional: true
+
+  '@oxlint-tsgolint/linux-arm64@0.25.0':
+    optional: true
+
+  '@oxlint-tsgolint/linux-x64@0.25.0':
+    optional: true
+
+  '@oxlint-tsgolint/win32-arm64@0.25.0':
+    optional: true
+
+  '@oxlint-tsgolint/win32-x64@0.25.0':
+    optional: true
+
+  '@oxlint/binding-android-arm-eabi@1.77.0':
+    optional: true
+
+  '@oxlint/binding-android-arm64@1.77.0':
+    optional: true
+
+  '@oxlint/binding-darwin-arm64@1.77.0':
+    optional: true
+
+  '@oxlint/binding-darwin-x64@1.77.0':
+    optional: true
+
+  '@oxlint/binding-freebsd-x64@1.77.0':
+    optional: true
+
+  '@oxlint/binding-linux-arm-gnueabihf@1.77.0':
+    optional: true
+
+  '@oxlint/binding-linux-arm-musleabihf@1.77.0':
+    optional: true
+
+  '@oxlint/binding-linux-arm64-gnu@1.77.0':
+    optional: true
+
+  '@oxlint/binding-linux-arm64-musl@1.77.0':
+    optional: true
+
+  '@oxlint/binding-linux-ppc64-gnu@1.77.0':
+    optional: true
+
+  '@oxlint/binding-linux-riscv64-gnu@1.77.0':
+    optional: true
+
+  '@oxlint/binding-linux-riscv64-musl@1.77.0':
+    optional: true
+
+  '@oxlint/binding-linux-s390x-gnu@1.77.0':
+    optional: true
+
+  '@oxlint/binding-linux-x64-gnu@1.77.0':
+    optional: true
+
+  '@oxlint/binding-linux-x64-musl@1.77.0':
+    optional: true
+
+  '@oxlint/binding-openharmony-arm64@1.77.0':
+    optional: true
+
+  '@oxlint/binding-win32-arm64-msvc@1.77.0':
+    optional: true
+
+  '@oxlint/binding-win32-ia32-msvc@1.77.0':
+    optional: true
+
+  '@oxlint/binding-win32-x64-msvc@1.77.0':
+    optional: true
+
+  '@parcel/watcher-android-arm64@2.6.0':
+    optional: true
+
+  '@parcel/watcher-darwin-arm64@2.6.0':
+    optional: true
+
+  '@parcel/watcher-darwin-x64@2.6.0':
+    optional: true
+
+  '@parcel/watcher-freebsd-x64@2.6.0':
+    optional: true
+
+  '@parcel/watcher-linux-arm-glibc@2.6.0':
+    optional: true
+
+  '@parcel/watcher-linux-arm-musl@2.6.0':
+    optional: true
+
+  '@parcel/watcher-linux-arm64-glibc@2.6.0':
+    optional: true
+
+  '@parcel/watcher-linux-arm64-musl@2.6.0':
+    optional: true
+
+  '@parcel/watcher-linux-x64-glibc@2.6.0':
+    optional: true
+
+  '@parcel/watcher-linux-x64-musl@2.6.0':
+    optional: true
+
+  '@parcel/watcher-wasm@2.6.0':
     dependencies:
       is-glob: 4.0.3
-      micromatch: 4.0.8
+      picomatch: 4.0.5
 
-  '@parcel/watcher-win32-arm64@2.5.0':
+  '@parcel/watcher-win32-arm64@2.6.0':
     optional: true
 
-  '@parcel/watcher-win32-ia32@2.5.0':
+  '@parcel/watcher-win32-x64@2.6.0':
     optional: true
 
-  '@parcel/watcher-win32-x64@2.5.0':
-    optional: true
-
-  '@parcel/watcher@2.5.0':
+  '@parcel/watcher@2.6.0':
     dependencies:
-      detect-libc: 1.0.3
+      detect-libc: 2.1.2
       is-glob: 4.0.3
-      micromatch: 4.0.8
       node-addon-api: 7.1.1
+      picomatch: 4.0.5
     optionalDependencies:
-      '@parcel/watcher-android-arm64': 2.5.0
-      '@parcel/watcher-darwin-arm64': 2.5.0
-      '@parcel/watcher-darwin-x64': 2.5.0
-      '@parcel/watcher-freebsd-x64': 2.5.0
-      '@parcel/watcher-linux-arm-glibc': 2.5.0
-      '@parcel/watcher-linux-arm-musl': 2.5.0
-      '@parcel/watcher-linux-arm64-glibc': 2.5.0
-      '@parcel/watcher-linux-arm64-musl': 2.5.0
-      '@parcel/watcher-linux-x64-glibc': 2.5.0
-      '@parcel/watcher-linux-x64-musl': 2.5.0
-      '@parcel/watcher-win32-arm64': 2.5.0
-      '@parcel/watcher-win32-ia32': 2.5.0
-      '@parcel/watcher-win32-x64': 2.5.0
+      '@parcel/watcher-android-arm64': 2.6.0
+      '@parcel/watcher-darwin-arm64': 2.6.0
+      '@parcel/watcher-darwin-x64': 2.6.0
+      '@parcel/watcher-freebsd-x64': 2.6.0
+      '@parcel/watcher-linux-arm-glibc': 2.6.0
+      '@parcel/watcher-linux-arm-musl': 2.6.0
+      '@parcel/watcher-linux-arm64-glibc': 2.6.0
+      '@parcel/watcher-linux-arm64-musl': 2.6.0
+      '@parcel/watcher-linux-x64-glibc': 2.6.0
+      '@parcel/watcher-linux-x64-musl': 2.6.0
+      '@parcel/watcher-win32-arm64': 2.6.0
+      '@parcel/watcher-win32-x64': 2.6.0
+    optional: true
+
+  '@peculiar/asn1-schema@2.8.0':
+    dependencies:
+      '@peculiar/utils': 2.0.3
+      asn1js: 3.0.10
+      tslib: 2.8.1
+
+  '@peculiar/json-schema@1.1.12':
+    dependencies:
+      tslib: 2.8.1
+
+  '@peculiar/utils@2.0.3':
+    dependencies:
+      tslib: 2.8.1
+
+  '@peculiar/webcrypto@1.7.1':
+    dependencies:
+      '@peculiar/asn1-schema': 2.8.0
+      '@peculiar/json-schema': 1.1.12
+      '@peculiar/utils': 2.0.3
+      tslib: 2.8.1
+      webcrypto-core: 1.9.2
 
   '@pkgjs/parseargs@0.11.0':
     optional: true
 
-  '@pkgr/core@0.1.1': {}
+  '@pkgr/core@0.3.6': {}
 
-  '@playwright/test@1.49.1':
+  '@playwright/test@1.62.1':
     dependencies:
-      playwright: 1.49.1
+      playwright: 1.62.1
 
   '@pnpm/config.env-replace@1.1.0': {}
 
-  '@pnpm/constants@1001.0.0': {}
+  '@pnpm/constants@1001.3.1': {}
 
-  '@pnpm/error@1000.0.1':
+  '@pnpm/error@1000.1.0':
     dependencies:
-      '@pnpm/constants': 1001.0.0
+      '@pnpm/constants': 1001.3.1
 
   '@pnpm/network.ca-file@1.0.2':
     dependencies:
       graceful-fs: 4.2.10
 
-  '@pnpm/npm-conf@2.3.1':
+  '@pnpm/npm-conf@3.0.3':
     dependencies:
       '@pnpm/config.env-replace': 1.1.0
       '@pnpm/network.ca-file': 1.0.2
       config-chain: 1.1.13
 
-  '@pnpm/workspace.read-manifest@1000.0.1':
+  '@pnpm/types@1001.3.0': {}
+
+  '@pnpm/workspace.read-manifest@1000.3.1':
     dependencies:
-      '@pnpm/constants': 1001.0.0
-      '@pnpm/error': 1000.0.1
+      '@pnpm/constants': 1001.3.1
+      '@pnpm/error': 1000.1.0
+      '@pnpm/types': 1001.3.0
       read-yaml-file: 2.1.0
 
-  '@polka/url@1.0.0-next.28': {}
+  '@polka/url@1.0.0-next.29': {}
 
-  '@redocly/ajv@8.11.2':
+  '@popperjs/core@2.11.8': {}
+
+  '@poppinss/colors@4.1.6':
     dependencies:
-      fast-deep-equal: 3.1.3
-      json-schema-traverse: 1.0.0
-      require-from-string: 2.0.2
-      uri-js-replace: 1.0.1
+      kleur: 4.1.5
 
-  '@redocly/config@0.17.1': {}
-
-  '@redocly/openapi-core@1.26.1(encoding@0.1.13)(supports-color@9.4.0)':
+  '@poppinss/dumper@0.7.0':
     dependencies:
-      '@redocly/ajv': 8.11.2
-      '@redocly/config': 0.17.1
-      colorette: 1.4.0
-      https-proxy-agent: 7.0.6(supports-color@9.4.0)
-      js-levenshtein: 1.1.6
-      js-yaml: 4.1.0
-      minimatch: 5.1.6
-      node-fetch: 2.7.0(encoding@0.1.13)
-      pluralize: 8.0.0
-      yaml-ast-parser: 0.0.43
-    transitivePeerDependencies:
-      - encoding
-      - supports-color
+      '@poppinss/colors': 4.1.6
+      '@sindresorhus/is': 7.2.0
+      supports-color: 10.2.2
 
-  '@rollup/plugin-alias@5.1.1(rollup@4.28.1)':
+  '@poppinss/exception@1.2.3': {}
+
+  '@publint/pack@0.1.6':
+    dependencies:
+      tinyexec: 1.3.0
+
+  '@quansync/fs@1.0.0':
+    dependencies:
+      quansync: 1.0.0
+
+  '@rolldown/binding-android-arm64@1.2.3':
+    optional: true
+
+  '@rolldown/binding-darwin-arm64@1.2.3':
+    optional: true
+
+  '@rolldown/binding-darwin-x64@1.2.3':
+    optional: true
+
+  '@rolldown/binding-freebsd-x64@1.2.3':
+    optional: true
+
+  '@rolldown/binding-linux-arm-gnueabihf@1.2.3':
+    optional: true
+
+  '@rolldown/binding-linux-arm64-gnu@1.2.3':
+    optional: true
+
+  '@rolldown/binding-linux-arm64-musl@1.2.3':
+    optional: true
+
+  '@rolldown/binding-linux-ppc64-gnu@1.2.3':
+    optional: true
+
+  '@rolldown/binding-linux-s390x-gnu@1.2.3':
+    optional: true
+
+  '@rolldown/binding-linux-x64-gnu@1.2.3':
+    optional: true
+
+  '@rolldown/binding-linux-x64-musl@1.2.3':
+    optional: true
+
+  '@rolldown/binding-openharmony-arm64@1.2.3':
+    optional: true
+
+  '@rolldown/binding-win32-arm64-msvc@1.2.3':
+    optional: true
+
+  '@rolldown/binding-win32-x64-msvc@1.2.3':
+    optional: true
+
+  '@rolldown/pluginutils@1.0.1': {}
+
+  '@rollup/plugin-alias@5.1.1(rollup@4.62.4)':
     optionalDependencies:
-      rollup: 4.28.1
+      rollup: 4.62.4
 
-  '@rollup/plugin-babel@5.3.1(@babel/core@7.26.0)(rollup@2.79.2)':
+  '@rollup/plugin-alias@6.0.0(rollup@4.62.4)':
+    optionalDependencies:
+      rollup: 4.62.4
+
+  '@rollup/plugin-babel@6.1.0(@babel/core@7.29.7(supports-color@10.2.2))(rollup@4.62.4)(supports-color@10.2.2)':
     dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-module-imports': 7.25.9
-      '@rollup/pluginutils': 3.1.0(rollup@2.79.2)
-      rollup: 2.79.2
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-module-imports': 7.29.7(supports-color@10.2.2)
+      '@rollup/pluginutils': 5.4.0(rollup@4.62.4)
+    optionalDependencies:
+      rollup: 4.62.4
     transitivePeerDependencies:
       - supports-color
 
-  '@rollup/plugin-commonjs@28.0.2(rollup@4.28.1)':
+  '@rollup/plugin-commonjs@28.0.9(rollup@4.62.4)':
     dependencies:
-      '@rollup/pluginutils': 5.1.4(rollup@4.28.1)
+      '@rollup/pluginutils': 5.4.0(rollup@4.62.4)
       commondir: 1.0.1
       estree-walker: 2.0.2
-      fdir: 6.4.2(picomatch@4.0.2)
+      fdir: 6.5.0(picomatch@4.0.5)
       is-reference: 1.2.1
-      magic-string: 0.30.17
-      picomatch: 4.0.2
+      magic-string: 0.30.21
+      picomatch: 4.0.5
     optionalDependencies:
-      rollup: 4.28.1
+      rollup: 4.62.4
 
-  '@rollup/plugin-inject@5.0.5(rollup@4.28.1)':
+  '@rollup/plugin-commonjs@29.0.3(rollup@4.62.4)':
     dependencies:
-      '@rollup/pluginutils': 5.1.4(rollup@4.28.1)
+      '@rollup/pluginutils': 5.4.0(rollup@4.62.4)
+      commondir: 1.0.1
       estree-walker: 2.0.2
-      magic-string: 0.30.17
+      fdir: 6.5.0(picomatch@4.0.5)
+      is-reference: 1.2.1
+      magic-string: 0.30.21
+      picomatch: 4.0.5
     optionalDependencies:
-      rollup: 4.28.1
+      rollup: 4.62.4
 
-  '@rollup/plugin-json@6.1.0(rollup@4.28.1)':
+  '@rollup/plugin-inject@5.0.5(rollup@4.62.4)':
     dependencies:
-      '@rollup/pluginutils': 5.1.4(rollup@4.28.1)
+      '@rollup/pluginutils': 5.4.0(rollup@4.62.4)
+      estree-walker: 2.0.2
+      magic-string: 0.30.21
     optionalDependencies:
-      rollup: 4.28.1
+      rollup: 4.62.4
 
-  '@rollup/plugin-node-resolve@15.3.1(rollup@2.79.2)':
+  '@rollup/plugin-json@6.1.0(rollup@4.62.4)':
     dependencies:
-      '@rollup/pluginutils': 5.1.4(rollup@2.79.2)
+      '@rollup/pluginutils': 5.4.0(rollup@4.62.4)
+    optionalDependencies:
+      rollup: 4.62.4
+
+  '@rollup/plugin-node-resolve@16.0.3(rollup@4.62.4)':
+    dependencies:
+      '@rollup/pluginutils': 5.4.0(rollup@4.62.4)
       '@types/resolve': 1.20.2
       deepmerge: 4.3.1
       is-module: 1.0.0
-      resolve: 1.22.10
+      resolve: 1.22.12
     optionalDependencies:
-      rollup: 2.79.2
+      rollup: 4.62.4
 
-  '@rollup/plugin-node-resolve@15.3.1(rollup@4.28.1)':
+  '@rollup/plugin-replace@6.0.3(rollup@4.62.4)':
     dependencies:
-      '@rollup/pluginutils': 5.1.4(rollup@4.28.1)
-      '@types/resolve': 1.20.2
-      deepmerge: 4.3.1
-      is-module: 1.0.0
-      resolve: 1.22.10
+      '@rollup/pluginutils': 5.4.0(rollup@4.62.4)
+      magic-string: 0.30.21
     optionalDependencies:
-      rollup: 4.28.1
+      rollup: 4.62.4
 
-  '@rollup/plugin-replace@2.4.2(rollup@2.79.2)':
+  '@rollup/plugin-terser@1.0.0(rollup@4.62.4)':
     dependencies:
-      '@rollup/pluginutils': 3.1.0(rollup@2.79.2)
-      magic-string: 0.25.9
-      rollup: 2.79.2
-
-  '@rollup/plugin-replace@6.0.2(rollup@4.28.1)':
-    dependencies:
-      '@rollup/pluginutils': 5.1.4(rollup@4.28.1)
-      magic-string: 0.30.17
+      serialize-javascript: 7.1.0
+      smob: 1.6.2
+      terser: 5.49.2
     optionalDependencies:
-      rollup: 4.28.1
+      rollup: 4.62.4
 
-  '@rollup/plugin-terser@0.4.4(rollup@2.79.2)':
-    dependencies:
-      serialize-javascript: 6.0.2
-      smob: 1.5.0
-      terser: 5.37.0
-    optionalDependencies:
-      rollup: 2.79.2
-
-  '@rollup/plugin-terser@0.4.4(rollup@4.28.1)':
-    dependencies:
-      serialize-javascript: 6.0.2
-      smob: 1.5.0
-      terser: 5.37.0
-    optionalDependencies:
-      rollup: 4.28.1
-
-  '@rollup/pluginutils@3.1.0(rollup@2.79.2)':
-    dependencies:
-      '@types/estree': 0.0.39
-      estree-walker: 1.0.1
-      picomatch: 2.3.1
-      rollup: 2.79.2
-
-  '@rollup/pluginutils@4.2.1':
+  '@rollup/pluginutils@5.4.0(rollup@4.62.4)':
     dependencies:
+      '@types/estree': 1.0.9
       estree-walker: 2.0.2
-      picomatch: 2.3.1
-
-  '@rollup/pluginutils@5.1.4(rollup@2.79.2)':
-    dependencies:
-      '@types/estree': 1.0.6
-      estree-walker: 2.0.2
-      picomatch: 4.0.2
+      picomatch: 4.0.5
     optionalDependencies:
-      rollup: 2.79.2
+      rollup: 4.62.4
 
-  '@rollup/pluginutils@5.1.4(rollup@4.28.1)':
-    dependencies:
-      '@types/estree': 1.0.6
-      estree-walker: 2.0.2
-      picomatch: 4.0.2
-    optionalDependencies:
-      rollup: 4.28.1
-
-  '@rollup/rollup-android-arm-eabi@4.28.1':
+  '@rollup/rollup-android-arm-eabi@4.62.4':
     optional: true
 
-  '@rollup/rollup-android-arm64@4.28.1':
+  '@rollup/rollup-android-arm64@4.62.4':
     optional: true
 
-  '@rollup/rollup-darwin-arm64@4.28.1':
+  '@rollup/rollup-darwin-arm64@4.62.4':
     optional: true
 
-  '@rollup/rollup-darwin-x64@4.28.1':
+  '@rollup/rollup-darwin-x64@4.62.4':
     optional: true
 
-  '@rollup/rollup-freebsd-arm64@4.28.1':
+  '@rollup/rollup-freebsd-arm64@4.62.4':
     optional: true
 
-  '@rollup/rollup-freebsd-x64@4.28.1':
+  '@rollup/rollup-freebsd-x64@4.62.4':
     optional: true
 
-  '@rollup/rollup-linux-arm-gnueabihf@4.28.1':
+  '@rollup/rollup-linux-arm-gnueabihf@4.62.4':
     optional: true
 
-  '@rollup/rollup-linux-arm-musleabihf@4.28.1':
+  '@rollup/rollup-linux-arm-musleabihf@4.62.4':
     optional: true
 
-  '@rollup/rollup-linux-arm64-gnu@4.28.1':
+  '@rollup/rollup-linux-arm64-gnu@4.62.4':
     optional: true
 
-  '@rollup/rollup-linux-arm64-musl@4.28.1':
+  '@rollup/rollup-linux-arm64-musl@4.62.4':
     optional: true
 
-  '@rollup/rollup-linux-loongarch64-gnu@4.28.1':
+  '@rollup/rollup-linux-loong64-gnu@4.62.4':
     optional: true
 
-  '@rollup/rollup-linux-powerpc64le-gnu@4.28.1':
+  '@rollup/rollup-linux-loong64-musl@4.62.4':
     optional: true
 
-  '@rollup/rollup-linux-riscv64-gnu@4.28.1':
+  '@rollup/rollup-linux-ppc64-gnu@4.62.4':
     optional: true
 
-  '@rollup/rollup-linux-s390x-gnu@4.28.1':
+  '@rollup/rollup-linux-ppc64-musl@4.62.4':
     optional: true
 
-  '@rollup/rollup-linux-x64-gnu@4.28.1':
+  '@rollup/rollup-linux-riscv64-gnu@4.62.4':
     optional: true
 
-  '@rollup/rollup-linux-x64-musl@4.28.1':
+  '@rollup/rollup-linux-riscv64-musl@4.62.4':
     optional: true
 
-  '@rollup/rollup-win32-arm64-msvc@4.28.1':
+  '@rollup/rollup-linux-s390x-gnu@4.62.4':
     optional: true
 
-  '@rollup/rollup-win32-ia32-msvc@4.28.1':
+  '@rollup/rollup-linux-x64-gnu@4.62.4':
     optional: true
 
-  '@rollup/rollup-win32-x64-msvc@4.28.1':
+  '@rollup/rollup-linux-x64-musl@4.62.4':
     optional: true
 
-  '@rushstack/node-core-library@5.7.0(@types/node@22.10.2)':
-    dependencies:
-      ajv: 8.13.0
-      ajv-draft-04: 1.0.0(ajv@8.13.0)
-      ajv-formats: 3.0.1(ajv@8.13.0)
-      fs-extra: 7.0.1
-      import-lazy: 4.0.0
-      jju: 1.4.0
-      resolve: 1.22.10
-      semver: 7.5.4
-    optionalDependencies:
-      '@types/node': 22.10.2
+  '@rollup/rollup-openbsd-x64@4.62.4':
+    optional: true
 
-  '@rushstack/rig-package@0.5.3':
-    dependencies:
-      resolve: 1.22.10
-      strip-json-comments: 3.1.1
+  '@rollup/rollup-openharmony-arm64@4.62.4':
+    optional: true
 
-  '@rushstack/terminal@0.14.0(@types/node@22.10.2)':
-    dependencies:
-      '@rushstack/node-core-library': 5.7.0(@types/node@22.10.2)
-      supports-color: 8.1.1
-    optionalDependencies:
-      '@types/node': 22.10.2
+  '@rollup/rollup-win32-arm64-msvc@4.62.4':
+    optional: true
 
-  '@rushstack/ts-command-line@4.22.6(@types/node@22.10.2)':
-    dependencies:
-      '@rushstack/terminal': 0.14.0(@types/node@22.10.2)
-      '@types/argparse': 1.0.38
-      argparse: 1.0.10
-      string-argv: 0.3.2
-    transitivePeerDependencies:
-      - '@types/node'
+  '@rollup/rollup-win32-ia32-msvc@4.62.4':
+    optional: true
+
+  '@rollup/rollup-win32-x64-gnu@4.62.4':
+    optional: true
+
+  '@rollup/rollup-win32-x64-msvc@4.62.4':
+    optional: true
 
   '@sec-ant/readable-stream@0.4.1': {}
 
   '@simonwep/pickr@1.8.2':
     dependencies:
-      core-js: 3.39.0
+      core-js: 3.50.0
       nanopop: 2.4.2
 
-  '@sindresorhus/merge-streams@2.3.0': {}
+  '@simple-libs/child-process-utils@2.0.0':
+    dependencies:
+      '@simple-libs/stream-utils': 2.0.0
+
+  '@simple-libs/stream-utils@2.0.0': {}
+
+  '@sindresorhus/is@4.6.0': {}
+
+  '@sindresorhus/is@7.2.0': {}
 
   '@sindresorhus/merge-streams@4.0.0': {}
 
-  '@stylistic/stylelint-plugin@3.1.1(stylelint@16.12.0(typescript@5.7.2))':
+  '@speed-highlight/core@1.2.24': {}
+
+  '@standard-schema/spec@1.1.0': {}
+
+  '@stylistic/stylelint-plugin@5.3.0(stylelint@17.14.1(supports-color@10.2.2)(typescript@6.0.3))':
     dependencies:
-      '@csstools/css-parser-algorithms': 3.0.4(@csstools/css-tokenizer@3.0.3)
-      '@csstools/css-tokenizer': 3.0.3
-      '@csstools/media-query-list-parser': 3.0.1(@csstools/css-parser-algorithms@3.0.4(@csstools/css-tokenizer@3.0.3))(@csstools/css-tokenizer@3.0.3)
-      is-plain-object: 5.0.0
-      postcss-selector-parser: 6.1.2
+      '@csstools/css-parser-algorithms': 4.0.0(@csstools/css-tokenizer@4.0.0)
+      '@csstools/css-tokenizer': 4.0.0
+      '@csstools/media-query-list-parser': 5.0.0(@csstools/css-parser-algorithms@4.0.0(@csstools/css-tokenizer@4.0.0))(@csstools/css-tokenizer@4.0.0)
+      postcss: 8.5.26
+      postcss-selector-parser: 7.1.5
       postcss-value-parser: 4.2.0
       style-search: 0.1.0
-      stylelint: 16.12.0(typescript@5.7.2)
+      stylelint: 17.14.1(supports-color@10.2.2)(typescript@6.0.3)
 
-  '@surma/rollup-plugin-off-main-thread@2.2.3':
-    dependencies:
-      ejs: 3.1.10
-      json5: 2.2.3
-      magic-string: 0.25.9
-      string.prototype.matchall: 4.0.12
-
-  '@swc/helpers@0.5.15':
+  '@swc/helpers@0.5.23':
     dependencies:
       tslib: 2.8.1
 
-  '@tailwindcss/nesting@0.0.0-insiders.565cd3e(postcss@8.4.49)':
+  '@szmarczak/http-timer@4.0.6':
     dependencies:
-      postcss: 8.4.49
-      postcss-nested: 5.0.6(postcss@8.4.49)
+      defer-to-connect: 2.0.1
 
-  '@tailwindcss/typography@0.5.15(tailwindcss@3.4.17)':
+  '@tailwindcss/node@4.3.3':
+    dependencies:
+      '@jridgewell/remapping': 2.3.5
+      enhanced-resolve: 5.24.5
+      jiti: 2.7.0
+      lightningcss: 1.32.0
+      magic-string: 0.30.21
+      source-map-js: 1.2.1
+      tailwindcss: 4.3.3
+
+  '@tailwindcss/oxide-android-arm64@4.3.3':
+    optional: true
+
+  '@tailwindcss/oxide-darwin-arm64@4.3.3':
+    optional: true
+
+  '@tailwindcss/oxide-darwin-x64@4.3.3':
+    optional: true
+
+  '@tailwindcss/oxide-freebsd-x64@4.3.3':
+    optional: true
+
+  '@tailwindcss/oxide-linux-arm-gnueabihf@4.3.3':
+    optional: true
+
+  '@tailwindcss/oxide-linux-arm64-gnu@4.3.3':
+    optional: true
+
+  '@tailwindcss/oxide-linux-arm64-musl@4.3.3':
+    optional: true
+
+  '@tailwindcss/oxide-linux-x64-gnu@4.3.3':
+    optional: true
+
+  '@tailwindcss/oxide-linux-x64-musl@4.3.3':
+    optional: true
+
+  '@tailwindcss/oxide-wasm32-wasi@4.3.3':
+    optional: true
+
+  '@tailwindcss/oxide-win32-arm64-msvc@4.3.3':
+    optional: true
+
+  '@tailwindcss/oxide-win32-x64-msvc@4.3.3':
+    optional: true
+
+  '@tailwindcss/oxide@4.3.3':
+    optionalDependencies:
+      '@tailwindcss/oxide-android-arm64': 4.3.3
+      '@tailwindcss/oxide-darwin-arm64': 4.3.3
+      '@tailwindcss/oxide-darwin-x64': 4.3.3
+      '@tailwindcss/oxide-freebsd-x64': 4.3.3
+      '@tailwindcss/oxide-linux-arm-gnueabihf': 4.3.3
+      '@tailwindcss/oxide-linux-arm64-gnu': 4.3.3
+      '@tailwindcss/oxide-linux-arm64-musl': 4.3.3
+      '@tailwindcss/oxide-linux-x64-gnu': 4.3.3
+      '@tailwindcss/oxide-linux-x64-musl': 4.3.3
+      '@tailwindcss/oxide-wasm32-wasi': 4.3.3
+      '@tailwindcss/oxide-win32-arm64-msvc': 4.3.3
+      '@tailwindcss/oxide-win32-x64-msvc': 4.3.3
+
+  '@tailwindcss/typography@0.5.20(tailwindcss@4.3.3)':
     dependencies:
-      lodash.castarray: 4.4.0
-      lodash.isplainobject: 4.0.6
-      lodash.merge: 4.6.2
       postcss-selector-parser: 6.0.10
-      tailwindcss: 3.4.17
+      tailwindcss: 4.3.3
+
+  '@tailwindcss/vite@4.3.3(vite@8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0))':
+    dependencies:
+      '@tailwindcss/node': 4.3.3
+      '@tailwindcss/oxide': 4.3.3
+      tailwindcss: 4.3.3
+      vite: 8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0)
+
+  '@tanstack/devtools-event-client@0.4.4': {}
+
+  '@tanstack/form-core@1.33.4':
+    dependencies:
+      '@tanstack/devtools-event-client': 0.4.4
+      '@tanstack/pacer-lite': 0.1.1
+      '@tanstack/store': 0.11.1
 
   '@tanstack/match-sorter-utils@8.19.4':
     dependencies:
       remove-accents: 0.5.0
 
-  '@tanstack/query-core@5.62.8': {}
+  '@tanstack/pacer-lite@0.1.1': {}
 
-  '@tanstack/store@0.6.0': {}
+  '@tanstack/query-core@5.101.4': {}
 
-  '@tanstack/virtual-core@3.11.2': {}
+  '@tanstack/store@0.11.1': {}
 
-  '@tanstack/vue-query@5.62.8(vue@3.5.13(typescript@5.7.2))':
+  '@tanstack/virtual-core@3.17.7': {}
+
+  '@tanstack/vue-form@1.33.4(vue@3.5.41(typescript@6.0.3))':
+    dependencies:
+      '@tanstack/form-core': 1.33.4
+      '@tanstack/vue-store': 0.11.1(vue@3.5.41(typescript@6.0.3))
+      vue: 3.5.41(typescript@6.0.3)
+    transitivePeerDependencies:
+      - '@vue/composition-api'
+
+  '@tanstack/vue-query@5.101.4(vue@3.5.41(typescript@6.0.3))':
     dependencies:
       '@tanstack/match-sorter-utils': 8.19.4
-      '@tanstack/query-core': 5.62.8
+      '@tanstack/query-core': 5.101.4
       '@vue/devtools-api': 6.6.4
-      vue: 3.5.13(typescript@5.7.2)
-      vue-demi: 0.14.10(vue@3.5.13(typescript@5.7.2))
+      vue: 3.5.41(typescript@6.0.3)
+      vue-demi: 0.14.10(vue@3.5.41(typescript@6.0.3))
 
-  '@tanstack/vue-store@0.6.0(vue@3.5.13(typescript@5.7.2))':
+  '@tanstack/vue-store@0.11.1(vue@3.5.41(typescript@6.0.3))':
     dependencies:
-      '@tanstack/store': 0.6.0
-      vue: 3.5.13(typescript@5.7.2)
-      vue-demi: 0.14.10(vue@3.5.13(typescript@5.7.2))
+      '@tanstack/store': 0.11.1
+      vue: 3.5.41(typescript@6.0.3)
+      vue-demi: 0.14.10(vue@3.5.41(typescript@6.0.3))
 
-  '@tanstack/vue-virtual@3.11.2(vue@3.5.13(typescript@5.7.2))':
+  '@tanstack/vue-virtual@3.13.35(vue@3.5.41(typescript@6.0.3))':
     dependencies:
-      '@tanstack/virtual-core': 3.11.2
-      vue: 3.5.13(typescript@5.7.2)
+      '@tanstack/virtual-core': 3.17.7
+      vue: 3.5.41(typescript@6.0.3)
 
-  '@tootallnate/once@1.1.2': {}
-
-  '@trysound/sax@0.2.0': {}
-
-  '@types/archiver@6.0.3':
+  '@tiptap/core@3.29.2(@tiptap/pm@3.29.2)':
     dependencies:
+      '@tiptap/pm': 3.29.2
+
+  '@tiptap/extension-blockquote@3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))(@tiptap/pm@3.29.2)':
+    dependencies:
+      '@tiptap/core': 3.29.2(@tiptap/pm@3.29.2)
+      '@tiptap/pm': 3.29.2
+
+  '@tiptap/extension-bold@3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))':
+    dependencies:
+      '@tiptap/core': 3.29.2(@tiptap/pm@3.29.2)
+
+  '@tiptap/extension-bubble-menu@3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))(@tiptap/pm@3.29.2)':
+    dependencies:
+      '@floating-ui/dom': 1.8.0
+      '@tiptap/core': 3.29.2(@tiptap/pm@3.29.2)
+      '@tiptap/pm': 3.29.2
+    optional: true
+
+  '@tiptap/extension-bullet-list@3.29.2(@tiptap/extension-list@3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))(@tiptap/pm@3.29.2))':
+    dependencies:
+      '@tiptap/extension-list': 3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))(@tiptap/pm@3.29.2)
+
+  '@tiptap/extension-code-block@3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))(@tiptap/pm@3.29.2)':
+    dependencies:
+      '@tiptap/core': 3.29.2(@tiptap/pm@3.29.2)
+      '@tiptap/pm': 3.29.2
+
+  '@tiptap/extension-code@3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))':
+    dependencies:
+      '@tiptap/core': 3.29.2(@tiptap/pm@3.29.2)
+
+  '@tiptap/extension-document@3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))':
+    dependencies:
+      '@tiptap/core': 3.29.2(@tiptap/pm@3.29.2)
+
+  '@tiptap/extension-dropcursor@3.29.2(@tiptap/extensions@3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))(@tiptap/pm@3.29.2))':
+    dependencies:
+      '@tiptap/extensions': 3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))(@tiptap/pm@3.29.2)
+
+  '@tiptap/extension-floating-menu@3.29.2(@floating-ui/dom@1.8.0)(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))(@tiptap/pm@3.29.2)':
+    dependencies:
+      '@floating-ui/dom': 1.8.0
+      '@tiptap/core': 3.29.2(@tiptap/pm@3.29.2)
+      '@tiptap/pm': 3.29.2
+    optional: true
+
+  '@tiptap/extension-gapcursor@3.29.2(@tiptap/extensions@3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))(@tiptap/pm@3.29.2))':
+    dependencies:
+      '@tiptap/extensions': 3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))(@tiptap/pm@3.29.2)
+
+  '@tiptap/extension-hard-break@3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))':
+    dependencies:
+      '@tiptap/core': 3.29.2(@tiptap/pm@3.29.2)
+
+  '@tiptap/extension-heading@3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))':
+    dependencies:
+      '@tiptap/core': 3.29.2(@tiptap/pm@3.29.2)
+
+  '@tiptap/extension-highlight@3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))':
+    dependencies:
+      '@tiptap/core': 3.29.2(@tiptap/pm@3.29.2)
+
+  '@tiptap/extension-horizontal-rule@3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))(@tiptap/pm@3.29.2)':
+    dependencies:
+      '@tiptap/core': 3.29.2(@tiptap/pm@3.29.2)
+      '@tiptap/pm': 3.29.2
+
+  '@tiptap/extension-image@3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))':
+    dependencies:
+      '@tiptap/core': 3.29.2(@tiptap/pm@3.29.2)
+
+  '@tiptap/extension-italic@3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))':
+    dependencies:
+      '@tiptap/core': 3.29.2(@tiptap/pm@3.29.2)
+
+  '@tiptap/extension-link@3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))(@tiptap/pm@3.29.2)':
+    dependencies:
+      '@tiptap/core': 3.29.2(@tiptap/pm@3.29.2)
+      '@tiptap/pm': 3.29.2
+      linkifyjs: 4.3.3
+
+  '@tiptap/extension-list-item@3.29.2(@tiptap/extension-list@3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))(@tiptap/pm@3.29.2))':
+    dependencies:
+      '@tiptap/extension-list': 3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))(@tiptap/pm@3.29.2)
+
+  '@tiptap/extension-list-keymap@3.29.2(@tiptap/extension-list@3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))(@tiptap/pm@3.29.2))':
+    dependencies:
+      '@tiptap/extension-list': 3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))(@tiptap/pm@3.29.2)
+
+  '@tiptap/extension-list@3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))(@tiptap/pm@3.29.2)':
+    dependencies:
+      '@tiptap/core': 3.29.2(@tiptap/pm@3.29.2)
+      '@tiptap/pm': 3.29.2
+
+  '@tiptap/extension-ordered-list@3.29.2(@tiptap/extension-list@3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))(@tiptap/pm@3.29.2))':
+    dependencies:
+      '@tiptap/extension-list': 3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))(@tiptap/pm@3.29.2)
+
+  '@tiptap/extension-paragraph@3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))':
+    dependencies:
+      '@tiptap/core': 3.29.2(@tiptap/pm@3.29.2)
+
+  '@tiptap/extension-placeholder@3.29.2(@tiptap/extensions@3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))(@tiptap/pm@3.29.2))':
+    dependencies:
+      '@tiptap/extensions': 3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))(@tiptap/pm@3.29.2)
+
+  '@tiptap/extension-strike@3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))':
+    dependencies:
+      '@tiptap/core': 3.29.2(@tiptap/pm@3.29.2)
+
+  '@tiptap/extension-text-align@3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))':
+    dependencies:
+      '@tiptap/core': 3.29.2(@tiptap/pm@3.29.2)
+
+  '@tiptap/extension-text-style@3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))':
+    dependencies:
+      '@tiptap/core': 3.29.2(@tiptap/pm@3.29.2)
+
+  '@tiptap/extension-text@3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))':
+    dependencies:
+      '@tiptap/core': 3.29.2(@tiptap/pm@3.29.2)
+
+  '@tiptap/extension-underline@3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))':
+    dependencies:
+      '@tiptap/core': 3.29.2(@tiptap/pm@3.29.2)
+
+  '@tiptap/extensions@3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))(@tiptap/pm@3.29.2)':
+    dependencies:
+      '@tiptap/core': 3.29.2(@tiptap/pm@3.29.2)
+      '@tiptap/pm': 3.29.2
+
+  '@tiptap/pm@3.29.2':
+    dependencies:
+      prosemirror-changeset: 2.4.1
+      prosemirror-commands: 1.7.2
+      prosemirror-dropcursor: 1.8.3
+      prosemirror-gapcursor: 1.4.1
+      prosemirror-history: 1.5.0
+      prosemirror-inputrules: 1.5.1
+      prosemirror-keymap: 1.2.3
+      prosemirror-model: 1.25.11
+      prosemirror-schema-list: 1.5.1
+      prosemirror-state: 1.4.4
+      prosemirror-tables: 1.8.5
+      prosemirror-transform: 1.12.0
+      prosemirror-view: 1.42.2
+
+  '@tiptap/starter-kit@3.29.2':
+    dependencies:
+      '@tiptap/core': 3.29.2(@tiptap/pm@3.29.2)
+      '@tiptap/extension-blockquote': 3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))(@tiptap/pm@3.29.2)
+      '@tiptap/extension-bold': 3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))
+      '@tiptap/extension-bullet-list': 3.29.2(@tiptap/extension-list@3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))(@tiptap/pm@3.29.2))
+      '@tiptap/extension-code': 3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))
+      '@tiptap/extension-code-block': 3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))(@tiptap/pm@3.29.2)
+      '@tiptap/extension-document': 3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))
+      '@tiptap/extension-dropcursor': 3.29.2(@tiptap/extensions@3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))(@tiptap/pm@3.29.2))
+      '@tiptap/extension-gapcursor': 3.29.2(@tiptap/extensions@3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))(@tiptap/pm@3.29.2))
+      '@tiptap/extension-hard-break': 3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))
+      '@tiptap/extension-heading': 3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))
+      '@tiptap/extension-horizontal-rule': 3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))(@tiptap/pm@3.29.2)
+      '@tiptap/extension-italic': 3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))
+      '@tiptap/extension-link': 3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))(@tiptap/pm@3.29.2)
+      '@tiptap/extension-list': 3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))(@tiptap/pm@3.29.2)
+      '@tiptap/extension-list-item': 3.29.2(@tiptap/extension-list@3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))(@tiptap/pm@3.29.2))
+      '@tiptap/extension-list-keymap': 3.29.2(@tiptap/extension-list@3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))(@tiptap/pm@3.29.2))
+      '@tiptap/extension-ordered-list': 3.29.2(@tiptap/extension-list@3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))(@tiptap/pm@3.29.2))
+      '@tiptap/extension-paragraph': 3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))
+      '@tiptap/extension-strike': 3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))
+      '@tiptap/extension-text': 3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))
+      '@tiptap/extension-underline': 3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))
+      '@tiptap/extensions': 3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))(@tiptap/pm@3.29.2)
+      '@tiptap/pm': 3.29.2
+
+  '@tiptap/vue-3@3.29.2(@floating-ui/dom@1.8.0)(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))(@tiptap/pm@3.29.2)(vue@3.5.41(typescript@6.0.3))':
+    dependencies:
+      '@floating-ui/dom': 1.8.0
+      '@tiptap/core': 3.29.2(@tiptap/pm@3.29.2)
+      '@tiptap/pm': 3.29.2
+      vue: 3.5.41(typescript@6.0.3)
+    optionalDependencies:
+      '@tiptap/extension-bubble-menu': 3.29.2(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))(@tiptap/pm@3.29.2)
+      '@tiptap/extension-floating-menu': 3.29.2(@floating-ui/dom@1.8.0)(@tiptap/core@3.29.2(@tiptap/pm@3.29.2))(@tiptap/pm@3.29.2)
+
+  '@trickfilm400/rollup-plugin-off-main-thread@3.0.0-pre1':
+    dependencies:
+      ejs: 3.1.10
+      json5: 2.2.3
+      magic-string: 0.30.21
+      string.prototype.matchall: 4.0.12
+
+  '@tsdown/css@0.22.14(jiti@2.7.0)(postcss@8.5.26)(sass-embedded@1.100.0)(sass@1.102.0)(tsdown@0.22.14)(yaml@2.9.0)':
+    dependencies:
+      lightningcss: 1.33.0
+      postcss-load-config: 6.0.1(jiti@2.7.0)(postcss@8.5.26)(yaml@2.9.0)
+      rolldown: 1.2.3
+      tsdown: 0.22.14(@tsdown/css@0.22.14)(@volar/typescript@2.4.28)(oxc-resolver@11.24.2)(publint@0.3.23)(typescript@6.0.3)(vue-tsc@3.3.9(typescript@6.0.3))
+    optionalDependencies:
+      postcss: 8.5.26
+      sass: 1.102.0
+      sass-embedded: 1.100.0
+    transitivePeerDependencies:
+      - jiti
+      - tsx
+      - yaml
+
+  '@turbo/darwin-64@2.10.9':
+    optional: true
+
+  '@turbo/darwin-arm64@2.10.9':
+    optional: true
+
+  '@turbo/linux-64@2.10.9':
+    optional: true
+
+  '@turbo/linux-arm64@2.10.9':
+    optional: true
+
+  '@turbo/windows-64@2.10.9':
+    optional: true
+
+  '@turbo/windows-arm64@2.10.9':
+    optional: true
+
+  '@tybys/wasm-util@0.10.3':
+    dependencies:
+      tslib: 2.8.1
+    optional: true
+
+  '@types/archiver@8.0.0':
+    dependencies:
+      '@types/node': 26.2.0
       '@types/readdir-glob': 1.1.5
 
-  '@types/argparse@1.0.38': {}
-
-  '@types/bintrees@1.0.6': {}
-
-  '@types/conventional-commits-parser@5.0.1':
+  '@types/cacheable-request@6.0.3':
     dependencies:
-      '@types/node': 22.10.2
+      '@types/http-cache-semantics': 4.2.0
+      '@types/keyv': 3.1.4
+      '@types/node': 26.2.0
+      '@types/responselike': 1.0.3
 
-  '@types/doctrine@0.0.9': {}
-
-  '@types/eslint@9.6.1':
+  '@types/chai@5.2.3':
     dependencies:
-      '@types/estree': 1.0.6
-      '@types/json-schema': 7.0.15
+      '@types/deep-eql': 4.0.2
+      assertion-error: 2.0.1
 
-  '@types/estree@0.0.39': {}
-
-  '@types/estree@1.0.6': {}
-
-  '@types/fs-extra@11.0.4':
+  '@types/debug@4.1.13':
     dependencies:
-      '@types/jsonfile': 6.1.4
-      '@types/node': 22.10.2
-    optional: true
+      '@types/ms': 2.1.0
+
+  '@types/deep-eql@4.0.2': {}
+
+  '@types/esrecurse@4.3.1': {}
+
+  '@types/estree@1.0.9': {}
+
+  '@types/fs-extra@9.0.13':
+    dependencies:
+      '@types/node': 26.2.0
 
   '@types/html-minifier-terser@7.0.2': {}
 
-  '@types/http-proxy@1.17.15':
-    dependencies:
-      '@types/node': 22.10.2
+  '@types/http-cache-semantics@4.2.0': {}
+
+  '@types/jsesc@2.5.1': {}
+
+  '@types/json-bigint@1.0.4': {}
 
   '@types/json-schema@7.0.15': {}
 
-  '@types/jsonfile@6.1.4':
+  '@types/keyv@3.1.4':
     dependencies:
-      '@types/node': 22.10.2
-    optional: true
+      '@types/node': 26.2.0
 
   '@types/linkify-it@5.0.0': {}
 
+  '@types/lodash-es@4.17.12':
+    dependencies:
+      '@types/lodash': 4.17.25
+
   '@types/lodash.clonedeep@4.5.9':
     dependencies:
-      '@types/lodash': 4.17.13
+      '@types/lodash': 4.17.25
 
-  '@types/lodash.get@4.4.9':
-    dependencies:
-      '@types/lodash': 4.17.13
-
-  '@types/lodash.isequal@4.5.8':
-    dependencies:
-      '@types/lodash': 4.17.13
-
-  '@types/lodash@4.17.13': {}
+  '@types/lodash@4.17.25': {}
 
   '@types/markdown-it@14.1.2':
     dependencies:
@@ -12879,569 +15639,834 @@ snapshots:
 
   '@types/mdurl@2.0.0': {}
 
-  '@types/minimatch@3.0.5': {}
+  '@types/ms@2.1.0': {}
 
   '@types/node@12.20.55': {}
 
   '@types/node@14.18.63': {}
 
-  '@types/node@22.10.2':
+  '@types/node@24.13.3':
     dependencies:
-      undici-types: 6.20.0
+      undici-types: 7.18.2
 
-  '@types/normalize-package-data@2.4.4': {}
+  '@types/node@25.9.5':
+    dependencies:
+      undici-types: 7.24.6
+
+  '@types/node@26.2.0':
+    dependencies:
+      undici-types: 8.3.0
 
   '@types/nprogress@0.2.3': {}
 
-  '@types/parse-json@4.0.2': {}
-
-  '@types/postcss-import@14.0.3':
+  '@types/qrcode@1.5.6':
     dependencies:
-      postcss: 8.4.49
+      '@types/node': 26.2.0
 
-  '@types/qrcode@1.5.5':
-    dependencies:
-      '@types/node': 22.10.2
+  '@types/qs@6.15.1': {}
 
   '@types/readdir-glob@1.1.5':
     dependencies:
-      '@types/node': 22.10.2
+      '@types/node': 26.2.0
 
   '@types/resolve@1.20.2': {}
 
-  '@types/sortablejs@1.15.8': {}
+  '@types/responselike@1.0.3':
+    dependencies:
+      '@types/node': 26.2.0
+
+  '@types/sortablejs@1.15.9': {}
+
+  '@types/tinycolor2@1.4.6': {}
 
   '@types/trusted-types@2.0.7': {}
 
-  '@types/web-bluetooth@0.0.20': {}
+  '@types/validator@13.15.10': {}
 
-  '@typescript-eslint/eslint-plugin@8.18.1(@typescript-eslint/parser@8.18.1(eslint@9.17.0(jiti@2.4.2))(typescript@5.7.2))(eslint@9.17.0(jiti@2.4.2))(typescript@5.7.2)':
+  '@types/web-bluetooth@0.0.21': {}
+
+  '@types/whatwg-mimetype@3.0.2': {}
+
+  '@types/ws@8.18.1':
     dependencies:
-      '@eslint-community/regexpp': 4.12.1
-      '@typescript-eslint/parser': 8.18.1(eslint@9.17.0(jiti@2.4.2))(typescript@5.7.2)
-      '@typescript-eslint/scope-manager': 8.18.1
-      '@typescript-eslint/type-utils': 8.18.1(eslint@9.17.0(jiti@2.4.2))(typescript@5.7.2)
-      '@typescript-eslint/utils': 8.18.1(eslint@9.17.0(jiti@2.4.2))(typescript@5.7.2)
-      '@typescript-eslint/visitor-keys': 8.18.1
-      eslint: 9.17.0(jiti@2.4.2)
-      graphemer: 1.4.0
-      ignore: 5.3.2
-      natural-compare: 1.4.0
-      ts-api-utils: 1.4.3(typescript@5.7.2)
-      typescript: 5.7.2
+      '@types/node': 26.2.0
+
+  '@typescript-eslint/parser@8.66.0(eslint@10.8.1(jiti@2.7.0)(supports-color@10.2.2))(supports-color@10.2.2)(typescript@6.0.3)':
+    dependencies:
+      '@typescript-eslint/scope-manager': 8.66.0
+      '@typescript-eslint/types': 8.66.0
+      '@typescript-eslint/typescript-estree': 8.66.0(supports-color@10.2.2)(typescript@6.0.3)
+      '@typescript-eslint/visitor-keys': 8.66.0
+      debug: 4.4.3(supports-color@10.2.2)
+      eslint: 10.8.1(jiti@2.7.0)(supports-color@10.2.2)
+      typescript: 6.0.3
     transitivePeerDependencies:
       - supports-color
 
-  '@typescript-eslint/parser@8.18.1(eslint@9.17.0(jiti@2.4.2))(typescript@5.7.2)':
+  '@typescript-eslint/project-service@8.66.0(supports-color@10.2.2)(typescript@6.0.3)':
     dependencies:
-      '@typescript-eslint/scope-manager': 8.18.1
-      '@typescript-eslint/types': 8.18.1
-      '@typescript-eslint/typescript-estree': 8.18.1(typescript@5.7.2)
-      '@typescript-eslint/visitor-keys': 8.18.1
-      debug: 4.4.0(supports-color@9.4.0)
-      eslint: 9.17.0(jiti@2.4.2)
-      typescript: 5.7.2
+      '@typescript-eslint/tsconfig-utils': 8.66.0(typescript@6.0.3)
+      '@typescript-eslint/types': 8.66.0
+      debug: 4.4.3(supports-color@10.2.2)
+      typescript: 6.0.3
     transitivePeerDependencies:
       - supports-color
 
-  '@typescript-eslint/scope-manager@7.18.0':
+  '@typescript-eslint/scope-manager@8.66.0':
     dependencies:
-      '@typescript-eslint/types': 7.18.0
-      '@typescript-eslint/visitor-keys': 7.18.0
+      '@typescript-eslint/types': 8.66.0
+      '@typescript-eslint/visitor-keys': 8.66.0
 
-  '@typescript-eslint/scope-manager@8.18.1':
+  '@typescript-eslint/tsconfig-utils@8.66.0(typescript@6.0.3)':
     dependencies:
-      '@typescript-eslint/types': 8.18.1
-      '@typescript-eslint/visitor-keys': 8.18.1
+      typescript: 6.0.3
 
-  '@typescript-eslint/type-utils@8.18.1(eslint@9.17.0(jiti@2.4.2))(typescript@5.7.2)':
+  '@typescript-eslint/types@8.66.0': {}
+
+  '@typescript-eslint/typescript-estree@8.66.0(supports-color@10.2.2)(typescript@6.0.3)':
     dependencies:
-      '@typescript-eslint/typescript-estree': 8.18.1(typescript@5.7.2)
-      '@typescript-eslint/utils': 8.18.1(eslint@9.17.0(jiti@2.4.2))(typescript@5.7.2)
-      debug: 4.4.0(supports-color@9.4.0)
-      eslint: 9.17.0(jiti@2.4.2)
-      ts-api-utils: 1.4.3(typescript@5.7.2)
-      typescript: 5.7.2
+      '@typescript-eslint/project-service': 8.66.0(supports-color@10.2.2)(typescript@6.0.3)
+      '@typescript-eslint/tsconfig-utils': 8.66.0(typescript@6.0.3)
+      '@typescript-eslint/types': 8.66.0
+      '@typescript-eslint/visitor-keys': 8.66.0
+      debug: 4.4.3(supports-color@10.2.2)
+      minimatch: 10.2.6
+      semver: 7.8.5
+      tinyglobby: 0.2.17
+      ts-api-utils: 2.5.0(typescript@6.0.3)
+      typescript: 6.0.3
     transitivePeerDependencies:
       - supports-color
 
-  '@typescript-eslint/types@7.18.0': {}
-
-  '@typescript-eslint/types@8.18.1': {}
-
-  '@typescript-eslint/typescript-estree@7.18.0(typescript@5.7.2)':
+  '@typescript-eslint/utils@8.66.0(eslint@10.8.1(jiti@2.7.0)(supports-color@10.2.2))(supports-color@10.2.2)(typescript@6.0.3)':
     dependencies:
-      '@typescript-eslint/types': 7.18.0
-      '@typescript-eslint/visitor-keys': 7.18.0
-      debug: 4.4.0(supports-color@9.4.0)
-      globby: 11.1.0
-      is-glob: 4.0.3
-      minimatch: 9.0.5
-      semver: 7.6.3
-      ts-api-utils: 1.4.3(typescript@5.7.2)
+      '@eslint-community/eslint-utils': 4.10.1(eslint@10.8.1(jiti@2.7.0)(supports-color@10.2.2))
+      '@typescript-eslint/scope-manager': 8.66.0
+      '@typescript-eslint/types': 8.66.0
+      '@typescript-eslint/typescript-estree': 8.66.0(supports-color@10.2.2)(typescript@6.0.3)
+      eslint: 10.8.1(jiti@2.7.0)(supports-color@10.2.2)
+      typescript: 6.0.3
+    transitivePeerDependencies:
+      - supports-color
+
+  '@typescript-eslint/visitor-keys@8.66.0':
+    dependencies:
+      '@typescript-eslint/types': 8.66.0
+      eslint-visitor-keys: 5.0.1
+
+  '@v-c/async-validator@1.0.1': {}
+
+  '@v-c/cascader@1.1.2(vue@3.5.41(typescript@6.0.3))':
+    dependencies:
+      '@v-c/select': 1.2.0(vue@3.5.41(typescript@6.0.3))
+      '@v-c/tree': 1.1.3(vue@3.5.41(typescript@6.0.3))
+      '@v-c/util': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      vue: 3.5.41(typescript@6.0.3)
+
+  '@v-c/checkbox@1.0.1(vue@3.5.41(typescript@6.0.3))':
+    dependencies:
+      '@v-c/util': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      vue: 3.5.41(typescript@6.0.3)
+
+  '@v-c/collapse@1.0.1(vue@3.5.41(typescript@6.0.3))':
+    dependencies:
+      '@v-c/util': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      vue: 3.5.41(typescript@6.0.3)
+
+  '@v-c/color-picker@1.0.6(vue@3.5.41(typescript@6.0.3))':
+    dependencies:
+      '@ant-design/fast-color': 3.0.1
+      '@v-c/util': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      vue: 3.5.41(typescript@6.0.3)
+
+  '@v-c/dialog@1.2.0(vue@3.5.41(typescript@6.0.3))':
+    dependencies:
+      '@v-c/portal': 1.0.8(vue@3.5.41(typescript@6.0.3))
+      '@v-c/util': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      vue: 3.5.41(typescript@6.0.3)
+
+  '@v-c/drawer@1.0.6(vue@3.5.41(typescript@6.0.3))':
+    dependencies:
+      '@v-c/portal': 1.0.8(vue@3.5.41(typescript@6.0.3))
+      '@v-c/util': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      vue: 3.5.41(typescript@6.0.3)
+
+  '@v-c/dropdown@1.0.5(vue@3.5.41(typescript@6.0.3))':
+    dependencies:
+      '@v-c/trigger': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      '@v-c/util': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      vue: 3.5.41(typescript@6.0.3)
+
+  '@v-c/image@1.0.12(vue@3.5.41(typescript@6.0.3))':
+    dependencies:
+      '@v-c/portal': 1.0.8(vue@3.5.41(typescript@6.0.3))
+      '@v-c/util': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      vue: 3.5.41(typescript@6.0.3)
+
+  '@v-c/input-number@1.0.7(vue@3.5.41(typescript@6.0.3))':
+    dependencies:
+      '@v-c/input': 1.1.1(vue@3.5.41(typescript@6.0.3))
+      '@v-c/mini-decimal': 1.0.1
+      '@v-c/util': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      vue: 3.5.41(typescript@6.0.3)
+
+  '@v-c/input@1.1.1(vue@3.5.41(typescript@6.0.3))':
+    dependencies:
+      '@v-c/util': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      vue: 3.5.41(typescript@6.0.3)
+
+  '@v-c/listy@1.0.2(vue@3.5.41(typescript@6.0.3))':
+    dependencies:
+      '@v-c/portal': 1.0.8(vue@3.5.41(typescript@6.0.3))
+      '@v-c/resize-observer': 1.1.3(vue@3.5.41(typescript@6.0.3))
+      '@v-c/util': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      '@v-c/virtual-list': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      vue: 3.5.41(typescript@6.0.3)
+
+  '@v-c/mentions@1.2.0(vue@3.5.41(typescript@6.0.3))':
+    dependencies:
+      '@v-c/input': 1.1.1(vue@3.5.41(typescript@6.0.3))
+      '@v-c/menu': 1.3.0(vue@3.5.41(typescript@6.0.3))
+      '@v-c/textarea': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      '@v-c/trigger': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      '@v-c/util': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      vue: 3.5.41(typescript@6.0.3)
+
+  '@v-c/menu@1.3.0(vue@3.5.41(typescript@6.0.3))':
+    dependencies:
+      '@v-c/overflow': 1.1.1(vue@3.5.41(typescript@6.0.3))
+      '@v-c/trigger': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      '@v-c/util': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      vue: 3.5.41(typescript@6.0.3)
+
+  '@v-c/mini-decimal@1.0.1': {}
+
+  '@v-c/mutate-observer@1.0.2(vue@3.5.41(typescript@6.0.3))':
+    dependencies:
+      '@v-c/resize-observer': 1.1.3(vue@3.5.41(typescript@6.0.3))
+      '@v-c/util': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      vue: 3.5.41(typescript@6.0.3)
+
+  '@v-c/notification@2.0.2(vue@3.5.41(typescript@6.0.3))':
+    dependencies:
+      '@v-c/util': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      vue: 3.5.41(typescript@6.0.3)
+
+  '@v-c/overflow@1.1.1(vue@3.5.41(typescript@6.0.3))':
+    dependencies:
+      '@v-c/resize-observer': 1.1.3(vue@3.5.41(typescript@6.0.3))
+      '@v-c/util': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      vue: 3.5.41(typescript@6.0.3)
+
+  '@v-c/pagination@1.1.0(vue@3.5.41(typescript@6.0.3))':
+    dependencies:
+      '@v-c/util': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      vue: 3.5.41(typescript@6.0.3)
+
+  '@v-c/picker@1.3.2(dayjs@1.11.21)(vue@3.5.41(typescript@6.0.3))':
+    dependencies:
+      '@v-c/overflow': 1.1.1(vue@3.5.41(typescript@6.0.3))
+      '@v-c/resize-observer': 1.1.3(vue@3.5.41(typescript@6.0.3))
+      '@v-c/trigger': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      '@v-c/util': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      vue: 3.5.41(typescript@6.0.3)
     optionalDependencies:
-      typescript: 5.7.2
-    transitivePeerDependencies:
-      - supports-color
+      dayjs: 1.11.21
 
-  '@typescript-eslint/typescript-estree@8.18.1(typescript@5.7.2)':
+  '@v-c/portal@1.0.8(vue@3.5.41(typescript@6.0.3))':
     dependencies:
-      '@typescript-eslint/types': 8.18.1
-      '@typescript-eslint/visitor-keys': 8.18.1
-      debug: 4.4.0(supports-color@9.4.0)
-      fast-glob: 3.3.2
-      is-glob: 4.0.3
-      minimatch: 9.0.5
-      semver: 7.6.3
-      ts-api-utils: 1.4.3(typescript@5.7.2)
-      typescript: 5.7.2
-    transitivePeerDependencies:
-      - supports-color
+      '@v-c/util': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      vue: 3.5.41(typescript@6.0.3)
 
-  '@typescript-eslint/utils@7.18.0(eslint@9.17.0(jiti@2.4.2))(typescript@5.7.2)':
+  '@v-c/progress@1.0.1(vue@3.5.41(typescript@6.0.3))':
     dependencies:
-      '@eslint-community/eslint-utils': 4.4.1(eslint@9.17.0(jiti@2.4.2))
-      '@typescript-eslint/scope-manager': 7.18.0
-      '@typescript-eslint/types': 7.18.0
-      '@typescript-eslint/typescript-estree': 7.18.0(typescript@5.7.2)
-      eslint: 9.17.0(jiti@2.4.2)
-    transitivePeerDependencies:
-      - supports-color
-      - typescript
+      '@v-c/util': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      vue: 3.5.41(typescript@6.0.3)
 
-  '@typescript-eslint/utils@8.18.1(eslint@9.17.0(jiti@2.4.2))(typescript@5.7.2)':
+  '@v-c/qrcode@1.0.1(vue@3.5.41(typescript@6.0.3))':
     dependencies:
-      '@eslint-community/eslint-utils': 4.4.1(eslint@9.17.0(jiti@2.4.2))
-      '@typescript-eslint/scope-manager': 8.18.1
-      '@typescript-eslint/types': 8.18.1
-      '@typescript-eslint/typescript-estree': 8.18.1(typescript@5.7.2)
-      eslint: 9.17.0(jiti@2.4.2)
-      typescript: 5.7.2
-    transitivePeerDependencies:
-      - supports-color
+      '@v-c/util': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      vue: 3.5.41(typescript@6.0.3)
 
-  '@typescript-eslint/visitor-keys@7.18.0':
+  '@v-c/rate@1.0.1(vue@3.5.41(typescript@6.0.3))':
     dependencies:
-      '@typescript-eslint/types': 7.18.0
-      eslint-visitor-keys: 3.4.3
+      '@v-c/util': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      vue: 3.5.41(typescript@6.0.3)
 
-  '@typescript-eslint/visitor-keys@8.18.1':
+  '@v-c/resize-observer@1.1.3(vue@3.5.41(typescript@6.0.3))':
     dependencies:
-      '@typescript-eslint/types': 8.18.1
-      eslint-visitor-keys: 4.2.0
+      '@v-c/util': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      resize-observer-polyfill: 1.5.1
+      vue: 3.5.41(typescript@6.0.3)
 
-  '@vavt/copy2clipboard@1.0.1': {}
-
-  '@vavt/util@2.1.0': {}
-
-  '@vee-validate/zod@4.14.7(vue@3.5.13(typescript@5.7.2))':
+  '@v-c/segmented@1.0.4(vue@3.5.41(typescript@6.0.3))':
     dependencies:
-      type-fest: 4.30.2
-      vee-validate: 4.14.7(vue@3.5.13(typescript@5.7.2))
-      zod: 3.24.1
-    transitivePeerDependencies:
-      - vue
+      '@v-c/util': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      vue: 3.5.41(typescript@6.0.3)
 
-  '@vercel/nft@0.27.10(encoding@0.1.13)(rollup@4.28.1)':
+  '@v-c/select@1.2.0(vue@3.5.41(typescript@6.0.3))':
     dependencies:
-      '@mapbox/node-pre-gyp': 2.0.0-rc.0(encoding@0.1.13)
-      '@rollup/pluginutils': 5.1.4(rollup@4.28.1)
-      acorn: 8.14.0
-      acorn-import-attributes: 1.9.5(acorn@8.14.0)
+      '@v-c/overflow': 1.1.1(vue@3.5.41(typescript@6.0.3))
+      '@v-c/trigger': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      '@v-c/util': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      '@v-c/virtual-list': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      vue: 3.5.41(typescript@6.0.3)
+
+  '@v-c/slick@1.0.2(vue@3.5.41(typescript@6.0.3))':
+    dependencies:
+      '@v-c/util': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      es-toolkit: 1.50.0
+      vue: 3.5.41(typescript@6.0.3)
+
+  '@v-c/slider@1.1.0(vue@3.5.41(typescript@6.0.3))':
+    dependencies:
+      '@v-c/util': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      vue: 3.5.41(typescript@6.0.3)
+
+  '@v-c/steps@1.0.0(vue@3.5.41(typescript@6.0.3))':
+    dependencies:
+      '@v-c/util': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      vue: 3.5.41(typescript@6.0.3)
+
+  '@v-c/switch@1.0.1(vue@3.5.41(typescript@6.0.3))':
+    dependencies:
+      '@v-c/util': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      vue: 3.5.41(typescript@6.0.3)
+
+  '@v-c/table@1.1.9(vue@3.5.41(typescript@6.0.3))':
+    dependencies:
+      '@v-c/resize-observer': 1.1.3(vue@3.5.41(typescript@6.0.3))
+      '@v-c/util': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      '@v-c/virtual-list': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      vue: 3.5.41(typescript@6.0.3)
+
+  '@v-c/tabs@1.3.0(vue@3.5.41(typescript@6.0.3))':
+    dependencies:
+      '@v-c/dropdown': 1.0.5(vue@3.5.41(typescript@6.0.3))
+      '@v-c/menu': 1.3.0(vue@3.5.41(typescript@6.0.3))
+      '@v-c/overflow': 1.1.1(vue@3.5.41(typescript@6.0.3))
+      '@v-c/resize-observer': 1.1.3(vue@3.5.41(typescript@6.0.3))
+      '@v-c/util': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      vue: 3.5.41(typescript@6.0.3)
+
+  '@v-c/textarea@1.1.0(vue@3.5.41(typescript@6.0.3))':
+    dependencies:
+      '@v-c/input': 1.1.1(vue@3.5.41(typescript@6.0.3))
+      '@v-c/resize-observer': 1.1.3(vue@3.5.41(typescript@6.0.3))
+      '@v-c/util': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      vue: 3.5.41(typescript@6.0.3)
+
+  '@v-c/tooltip@1.1.0(vue@3.5.41(typescript@6.0.3))':
+    dependencies:
+      '@v-c/trigger': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      '@v-c/util': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      vue: 3.5.41(typescript@6.0.3)
+
+  '@v-c/tour@1.1.1(vue@3.5.41(typescript@6.0.3))':
+    dependencies:
+      '@v-c/portal': 1.0.8(vue@3.5.41(typescript@6.0.3))
+      '@v-c/trigger': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      '@v-c/util': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      vue: 3.5.41(typescript@6.0.3)
+
+  '@v-c/tree-select@1.1.1(vue@3.5.41(typescript@6.0.3))':
+    dependencies:
+      '@v-c/select': 1.2.0(vue@3.5.41(typescript@6.0.3))
+      '@v-c/tree': 1.1.3(vue@3.5.41(typescript@6.0.3))
+      '@v-c/util': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      vue: 3.5.41(typescript@6.0.3)
+
+  '@v-c/tree@1.1.3(vue@3.5.41(typescript@6.0.3))':
+    dependencies:
+      '@v-c/util': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      '@v-c/virtual-list': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      vue: 3.5.41(typescript@6.0.3)
+
+  '@v-c/trigger@1.1.0(vue@3.5.41(typescript@6.0.3))':
+    dependencies:
+      '@v-c/portal': 1.0.8(vue@3.5.41(typescript@6.0.3))
+      '@v-c/resize-observer': 1.1.3(vue@3.5.41(typescript@6.0.3))
+      '@v-c/util': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      vue: 3.5.41(typescript@6.0.3)
+
+  '@v-c/upload@1.0.0(vue@3.5.41(typescript@6.0.3))':
+    dependencies:
+      '@v-c/util': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      vue: 3.5.41(typescript@6.0.3)
+
+  '@v-c/util@1.1.0(vue@3.5.41(typescript@6.0.3))':
+    dependencies:
+      vue: 3.5.41(typescript@6.0.3)
+
+  '@v-c/virtual-list@1.1.0(vue@3.5.41(typescript@6.0.3))':
+    dependencies:
+      '@v-c/resize-observer': 1.1.3(vue@3.5.41(typescript@6.0.3))
+      '@v-c/util': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      vue: 3.5.41(typescript@6.0.3)
+
+  '@valibot/to-json-schema@1.7.1(valibot@1.4.2(typescript@6.0.3))':
+    dependencies:
+      valibot: 1.4.2(typescript@6.0.3)
+
+  '@vavt/copy2clipboard@1.0.3': {}
+
+  '@vavt/util@2.1.2': {}
+
+  '@vercel/nft@1.10.2(rollup@4.62.4)(supports-color@10.2.2)':
+    dependencies:
+      '@mapbox/node-pre-gyp': 2.0.3(supports-color@10.2.2)
+      '@rollup/pluginutils': 5.4.0(rollup@4.62.4)
+      acorn: 8.18.0
+      acorn-import-attributes: 1.9.5(acorn@8.18.0)
       async-sema: 3.1.1
       bindings: 1.5.0
       estree-walker: 2.0.2
-      glob: 7.2.3
+      glob: 13.0.6
       graceful-fs: 4.2.11
       node-gyp-build: 4.8.4
-      picomatch: 4.0.2
+      picomatch: 4.0.5
       resolve-from: 5.0.0
     transitivePeerDependencies:
       - encoding
       - rollup
       - supports-color
 
-  '@vitejs/plugin-vue-jsx@4.1.1(vite@6.0.5(@types/node@22.10.2)(jiti@2.4.2)(less@4.2.1)(sass@1.80.6)(terser@5.37.0)(yaml@2.6.1))(vue@3.5.13(typescript@5.7.2))':
+  '@vitejs/plugin-vue-jsx@5.1.6(supports-color@10.2.2)(vite@8.2.1(@types/node@25.9.5)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0))(vue@3.5.41(typescript@6.0.3))':
     dependencies:
-      '@babel/core': 7.26.0
-      '@babel/plugin-transform-typescript': 7.26.3(@babel/core@7.26.0)
-      '@vue/babel-plugin-jsx': 1.2.5(@babel/core@7.26.0)
-      vite: 6.0.5(@types/node@22.10.2)(jiti@2.4.2)(less@4.2.1)(sass@1.80.6)(terser@5.37.0)(yaml@2.6.1)
-      vue: 3.5.13(typescript@5.7.2)
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/plugin-syntax-typescript': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))
+      '@babel/plugin-transform-typescript': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
+      '@rolldown/pluginutils': 1.0.1
+      '@vue/babel-plugin-jsx': 2.0.1(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
+      vite: 8.2.1(@types/node@25.9.5)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0)
+      vue: 3.5.41(typescript@6.0.3)
     transitivePeerDependencies:
       - supports-color
 
-  '@vitejs/plugin-vue-jsx@4.1.1(vite@6.0.5(@types/node@22.10.2)(jiti@2.4.2)(less@4.2.1)(terser@5.37.0)(yaml@2.6.1))(vue@3.5.13(typescript@5.6.3))':
+  '@vitejs/plugin-vue-jsx@5.1.6(supports-color@10.2.2)(vite@8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0))(vue@3.5.41(typescript@6.0.3))':
     dependencies:
-      '@babel/core': 7.26.0
-      '@babel/plugin-transform-typescript': 7.26.3(@babel/core@7.26.0)
-      '@vue/babel-plugin-jsx': 1.2.5(@babel/core@7.26.0)
-      vite: 6.0.5(@types/node@22.10.2)(jiti@2.4.2)(less@4.2.1)(sass@1.80.6)(terser@5.37.0)(yaml@2.6.1)
-      vue: 3.5.13(typescript@5.6.3)
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/plugin-syntax-typescript': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))
+      '@babel/plugin-transform-typescript': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
+      '@rolldown/pluginutils': 1.0.1
+      '@vue/babel-plugin-jsx': 2.0.1(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
+      vite: 8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0)
+      vue: 3.5.41(typescript@6.0.3)
     transitivePeerDependencies:
       - supports-color
 
-  '@vitejs/plugin-vue@5.2.1(vite@6.0.5(@types/node@22.10.2)(jiti@2.4.2)(less@4.2.1)(sass@1.80.6)(terser@5.37.0)(yaml@2.6.1))(vue@3.5.13(typescript@5.7.2))':
+  '@vitejs/plugin-vue@6.0.8(vite@8.2.1(@types/node@25.9.5)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0))(vue@3.5.41(typescript@6.0.3))':
     dependencies:
-      vite: 6.0.5(@types/node@22.10.2)(jiti@2.4.2)(less@4.2.1)(sass@1.80.6)(terser@5.37.0)(yaml@2.6.1)
-      vue: 3.5.13(typescript@5.7.2)
+      '@rolldown/pluginutils': 1.0.1
+      vite: 8.2.1(@types/node@25.9.5)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0)
+      vue: 3.5.41(typescript@6.0.3)
 
-  '@vitejs/plugin-vue@5.2.1(vite@6.0.5(@types/node@22.10.2)(jiti@2.4.2)(less@4.2.1)(terser@5.37.0)(yaml@2.6.1))(vue@3.5.13(typescript@5.6.3))':
+  '@vitejs/plugin-vue@6.0.8(vite@8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0))(vue@3.5.41(typescript@6.0.3))':
     dependencies:
-      vite: 6.0.5(@types/node@22.10.2)(jiti@2.4.2)(less@4.2.1)(sass@1.80.6)(terser@5.37.0)(yaml@2.6.1)
-      vue: 3.5.13(typescript@5.6.3)
+      '@rolldown/pluginutils': 1.0.1
+      vite: 8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0)
+      vue: 3.5.41(typescript@6.0.3)
 
-  '@vitest/expect@2.1.8':
+  '@vitest/expect@4.1.10':
     dependencies:
-      '@vitest/spy': 2.1.8
-      '@vitest/utils': 2.1.8
-      chai: 5.1.2
-      tinyrainbow: 1.2.0
+      '@standard-schema/spec': 1.1.0
+      '@types/chai': 5.2.3
+      '@vitest/spy': 4.1.10
+      '@vitest/utils': 4.1.10
+      chai: 6.2.2
+      tinyrainbow: 3.1.1
 
-  '@vitest/mocker@2.1.8(vite@5.4.11(@types/node@22.10.2)(less@4.2.1)(sass@1.80.6)(terser@5.37.0))':
+  '@vitest/mocker@4.1.10(vite@8.2.1(@types/node@25.9.5)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0))':
     dependencies:
-      '@vitest/spy': 2.1.8
+      '@vitest/spy': 4.1.10
       estree-walker: 3.0.3
-      magic-string: 0.30.17
+      magic-string: 0.30.21
     optionalDependencies:
-      vite: 5.4.11(@types/node@22.10.2)(less@4.2.1)(sass@1.80.6)(terser@5.37.0)
+      vite: 8.2.1(@types/node@25.9.5)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0)
 
-  '@vitest/pretty-format@2.1.8':
+  '@vitest/pretty-format@4.1.10':
     dependencies:
-      tinyrainbow: 1.2.0
+      tinyrainbow: 3.1.1
 
-  '@vitest/runner@2.1.8':
+  '@vitest/runner@4.1.10':
     dependencies:
-      '@vitest/utils': 2.1.8
-      pathe: 1.1.2
+      '@vitest/utils': 4.1.10
+      pathe: 2.0.3
 
-  '@vitest/snapshot@2.1.8':
+  '@vitest/snapshot@4.1.10':
     dependencies:
-      '@vitest/pretty-format': 2.1.8
-      magic-string: 0.30.17
-      pathe: 1.1.2
+      '@vitest/pretty-format': 4.1.10
+      '@vitest/utils': 4.1.10
+      magic-string: 0.30.21
+      pathe: 2.0.3
 
-  '@vitest/spy@2.1.8':
+  '@vitest/spy@4.1.10': {}
+
+  '@vitest/utils@4.1.10':
     dependencies:
-      tinyspy: 3.0.2
+      '@vitest/pretty-format': 4.1.10
+      convert-source-map: 2.0.0
+      tinyrainbow: 3.1.1
 
-  '@vitest/utils@2.1.8':
+  '@volar/language-core@2.4.28':
     dependencies:
-      '@vitest/pretty-format': 2.1.8
-      loupe: 3.1.2
-      tinyrainbow: 1.2.0
+      '@volar/source-map': 2.4.28
 
-  '@volar/language-core@2.4.11':
+  '@volar/source-map@2.4.28': {}
+
+  '@volar/typescript@2.4.28':
     dependencies:
-      '@volar/source-map': 2.4.11
-
-  '@volar/source-map@2.4.11': {}
-
-  '@volar/typescript@2.4.11':
-    dependencies:
-      '@volar/language-core': 2.4.11
+      '@volar/language-core': 2.4.28
       path-browserify: 1.0.1
-      vscode-uri: 3.0.8
+      vscode-uri: 3.1.0
 
-  '@vue/babel-helper-vue-transform-on@1.2.5': {}
-
-  '@vue/babel-plugin-jsx@1.2.5(@babel/core@7.26.0)':
+  '@vue-macros/common@3.1.4(vue@3.5.41(typescript@6.0.3))':
     dependencies:
-      '@babel/helper-module-imports': 7.25.9
-      '@babel/helper-plugin-utils': 7.25.9
-      '@babel/plugin-syntax-jsx': 7.25.9(@babel/core@7.26.0)
-      '@babel/template': 7.25.9
-      '@babel/traverse': 7.26.4
-      '@babel/types': 7.26.3
-      '@vue/babel-helper-vue-transform-on': 1.2.5
-      '@vue/babel-plugin-resolve-type': 1.2.5(@babel/core@7.26.0)
-      html-tags: 3.3.1
-      svg-tags: 1.0.0
+      '@vue/compiler-sfc': 3.5.41
+      ast-kit: 2.2.0
+      local-pkg: 1.2.1
+      magic-string-ast: 1.0.3
+      unplugin-utils: 0.3.2
     optionalDependencies:
-      '@babel/core': 7.26.0
+      vue: 3.5.41(typescript@6.0.3)
+
+  '@vue/babel-helper-vue-transform-on@1.5.0': {}
+
+  '@vue/babel-helper-vue-transform-on@2.0.1': {}
+
+  '@vue/babel-plugin-jsx@1.5.0(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)':
+    dependencies:
+      '@babel/helper-module-imports': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
+      '@babel/plugin-syntax-jsx': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))
+      '@babel/template': 7.29.7
+      '@babel/traverse': 7.29.8(supports-color@10.2.2)
+      '@babel/types': 7.29.8
+      '@vue/babel-helper-vue-transform-on': 1.5.0
+      '@vue/babel-plugin-resolve-type': 1.5.0(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
+      '@vue/shared': 3.5.41
+    optionalDependencies:
+      '@babel/core': 7.29.7(supports-color@10.2.2)
     transitivePeerDependencies:
       - supports-color
 
-  '@vue/babel-plugin-resolve-type@1.2.5(@babel/core@7.26.0)':
+  '@vue/babel-plugin-jsx@2.0.1(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)':
     dependencies:
-      '@babel/code-frame': 7.26.2
-      '@babel/core': 7.26.0
-      '@babel/helper-module-imports': 7.25.9
-      '@babel/helper-plugin-utils': 7.25.9
-      '@babel/parser': 7.26.3
-      '@vue/compiler-sfc': 3.5.13
+      '@babel/helper-module-imports': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
+      '@babel/plugin-syntax-jsx': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))
+      '@babel/template': 7.29.7
+      '@babel/traverse': 7.29.8(supports-color@10.2.2)
+      '@babel/types': 7.29.8
+      '@vue/babel-helper-vue-transform-on': 2.0.1
+      '@vue/babel-plugin-resolve-type': 2.0.1(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
+      '@vue/shared': 3.5.41
+    optionalDependencies:
+      '@babel/core': 7.29.7(supports-color@10.2.2)
     transitivePeerDependencies:
       - supports-color
 
-  '@vue/compiler-core@3.5.13':
+  '@vue/babel-plugin-resolve-type@1.5.0(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)':
     dependencies:
-      '@babel/parser': 7.26.3
-      '@vue/shared': 3.5.13
-      entities: 4.5.0
+      '@babel/code-frame': 7.29.7
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-module-imports': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
+      '@babel/parser': 7.29.8
+      '@vue/compiler-sfc': 3.5.41
+    transitivePeerDependencies:
+      - supports-color
+
+  '@vue/babel-plugin-resolve-type@2.0.1(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)':
+    dependencies:
+      '@babel/code-frame': 7.29.7
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-module-imports': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-plugin-utils': 7.29.7
+      '@babel/parser': 7.29.8
+      '@vue/compiler-sfc': 3.5.41
+    transitivePeerDependencies:
+      - supports-color
+
+  '@vue/compiler-core@3.5.41':
+    dependencies:
+      '@babel/parser': 7.29.8
+      '@vue/shared': 3.5.41
+      entities: 7.0.1
       estree-walker: 2.0.2
       source-map-js: 1.2.1
 
-  '@vue/compiler-dom@3.5.13':
+  '@vue/compiler-dom@3.5.41':
     dependencies:
-      '@vue/compiler-core': 3.5.13
-      '@vue/shared': 3.5.13
+      '@vue/compiler-core': 3.5.41
+      '@vue/shared': 3.5.41
 
-  '@vue/compiler-sfc@3.5.13':
+  '@vue/compiler-sfc@3.5.41':
     dependencies:
-      '@babel/parser': 7.26.3
-      '@vue/compiler-core': 3.5.13
-      '@vue/compiler-dom': 3.5.13
-      '@vue/compiler-ssr': 3.5.13
-      '@vue/shared': 3.5.13
+      '@babel/parser': 7.29.8
+      '@vue/compiler-core': 3.5.41
+      '@vue/compiler-dom': 3.5.41
+      '@vue/compiler-ssr': 3.5.41
+      '@vue/shared': 3.5.41
       estree-walker: 2.0.2
-      magic-string: 0.30.17
-      postcss: 8.4.49
+      magic-string: 0.30.21
+      postcss: 8.5.26
       source-map-js: 1.2.1
 
-  '@vue/compiler-ssr@3.5.13':
+  '@vue/compiler-ssr@3.5.41':
     dependencies:
-      '@vue/compiler-dom': 3.5.13
-      '@vue/shared': 3.5.13
-
-  '@vue/compiler-vue2@2.7.16':
-    dependencies:
-      de-indent: 1.0.2
-      he: 1.2.0
+      '@vue/compiler-dom': 3.5.41
+      '@vue/shared': 3.5.41
 
   '@vue/devtools-api@6.6.4': {}
 
-  '@vue/devtools-api@7.6.8':
+  '@vue/devtools-api@8.2.1':
     dependencies:
-      '@vue/devtools-kit': 7.6.8
+      '@vue/devtools-kit': 8.2.1
 
-  '@vue/devtools-core@7.6.8(vite@6.0.5(@types/node@22.10.2)(jiti@2.4.2)(less@4.2.1)(sass@1.80.6)(terser@5.37.0)(yaml@2.6.1))(vue@3.5.13(typescript@5.7.2))':
+  '@vue/devtools-core@8.2.1(vue@3.5.41(typescript@6.0.3))':
     dependencies:
-      '@vue/devtools-kit': 7.6.8
-      '@vue/devtools-shared': 7.6.8
-      mitt: 3.0.1
-      nanoid: 5.0.9
-      pathe: 1.1.2
-      vite-hot-client: 0.2.4(vite@6.0.5(@types/node@22.10.2)(jiti@2.4.2)(less@4.2.1)(sass@1.80.6)(terser@5.37.0)(yaml@2.6.1))
-      vue: 3.5.13(typescript@5.7.2)
-    transitivePeerDependencies:
-      - vite
+      '@vue/devtools-kit': 8.2.1
+      '@vue/devtools-shared': 8.2.1
+      vue: 3.5.41(typescript@6.0.3)
 
-  '@vue/devtools-kit@7.6.8':
+  '@vue/devtools-kit@8.2.1':
     dependencies:
-      '@vue/devtools-shared': 7.6.8
-      birpc: 0.2.19
+      '@vue/devtools-shared': 8.2.1
+      birpc: 2.9.0
       hookable: 5.5.3
-      mitt: 3.0.1
-      perfect-debounce: 1.0.0
-      speakingurl: 14.0.1
-      superjson: 2.2.2
+      perfect-debounce: 2.1.0
 
-  '@vue/devtools-shared@7.6.8':
-    dependencies:
-      rfdc: 1.4.1
+  '@vue/devtools-shared@8.2.1': {}
 
-  '@vue/language-core@2.1.10(typescript@5.6.3)':
+  '@vue/language-core@3.3.9':
     dependencies:
-      '@volar/language-core': 2.4.11
-      '@vue/compiler-dom': 3.5.13
-      '@vue/compiler-vue2': 2.7.16
-      '@vue/shared': 3.5.13
-      alien-signals: 0.2.2
-      minimatch: 9.0.5
+      '@volar/language-core': 2.4.28
+      '@vue/compiler-dom': 3.5.41
+      '@vue/shared': 3.5.41
+      alien-signals: 3.2.1
       muggle-string: 0.4.1
       path-browserify: 1.0.1
+      picomatch: 4.0.5
+
+  '@vue/reactivity@3.5.41':
+    dependencies:
+      '@vue/shared': 3.5.41
+
+  '@vue/runtime-core@3.5.41':
+    dependencies:
+      '@vue/reactivity': 3.5.41
+      '@vue/shared': 3.5.41
+
+  '@vue/runtime-dom@3.5.41':
+    dependencies:
+      '@vue/reactivity': 3.5.41
+      '@vue/runtime-core': 3.5.41
+      '@vue/shared': 3.5.41
+      csstype: 3.2.3
+
+  '@vue/server-renderer@3.5.41':
+    dependencies:
+      '@vue/compiler-ssr': 3.5.41
+      '@vue/runtime-dom': 3.5.41
+      '@vue/shared': 3.5.41
+
+  '@vue/shared@3.5.41': {}
+
+  '@vue/test-utils@2.4.11(@vue/compiler-dom@3.5.41)(@vue/server-renderer@3.5.41)(vue@3.5.41(typescript@6.0.3))':
+    dependencies:
+      '@vue/compiler-dom': 3.5.41
+      js-beautify: 1.15.4
+      vue: 3.5.41(typescript@6.0.3)
+      vue-component-type-helpers: 3.3.9
     optionalDependencies:
-      typescript: 5.6.3
+      '@vue/server-renderer': 3.5.41
 
-  '@vue/language-core@2.1.6(typescript@5.7.2)':
+  '@vueup/vue-quill@1.5.5(vue@3.5.41(typescript@6.0.3))':
     dependencies:
-      '@volar/language-core': 2.4.11
-      '@vue/compiler-dom': 3.5.13
-      '@vue/compiler-vue2': 2.7.16
-      '@vue/shared': 3.5.13
-      computeds: 0.0.1
-      minimatch: 9.0.5
-      muggle-string: 0.4.1
-      path-browserify: 1.0.1
-    optionalDependencies:
-      typescript: 5.7.2
+      quill: 2.0.2
+      quill-delta: 5.1.0
+      vue: 3.5.41(typescript@6.0.3)
 
-  '@vue/reactivity@3.5.13':
+  '@vueuse/core@13.9.0(vue@3.5.41(typescript@6.0.3))':
     dependencies:
-      '@vue/shared': 3.5.13
+      '@types/web-bluetooth': 0.0.21
+      '@vueuse/metadata': 13.9.0
+      '@vueuse/shared': 13.9.0(vue@3.5.41(typescript@6.0.3))
+      vue: 3.5.41(typescript@6.0.3)
 
-  '@vue/runtime-core@3.5.13':
+  '@vueuse/core@14.4.0(vue@3.5.41(typescript@6.0.3))':
     dependencies:
-      '@vue/reactivity': 3.5.13
-      '@vue/shared': 3.5.13
+      '@types/web-bluetooth': 0.0.21
+      '@vueuse/metadata': 14.4.0
+      '@vueuse/shared': 14.4.0(vue@3.5.41(typescript@6.0.3))
+      vue: 3.5.41(typescript@6.0.3)
 
-  '@vue/runtime-dom@3.5.13':
+  '@vueuse/integrations@14.4.0(async-validator@4.2.5)(axios@1.19.0(debug@4.4.3(supports-color@10.2.2))(supports-color@10.2.2))(nprogress@0.2.0)(qrcode@1.5.4)(sortablejs@1.15.7)(vue@3.5.41(typescript@6.0.3))':
     dependencies:
-      '@vue/reactivity': 3.5.13
-      '@vue/runtime-core': 3.5.13
-      '@vue/shared': 3.5.13
-      csstype: 3.1.3
-
-  '@vue/server-renderer@3.5.13(vue@3.5.13(typescript@5.6.3))':
-    dependencies:
-      '@vue/compiler-ssr': 3.5.13
-      '@vue/shared': 3.5.13
-      vue: 3.5.13(typescript@5.6.3)
-
-  '@vue/server-renderer@3.5.13(vue@3.5.13(typescript@5.7.2))':
-    dependencies:
-      '@vue/compiler-ssr': 3.5.13
-      '@vue/shared': 3.5.13
-      vue: 3.5.13(typescript@5.7.2)
-
-  '@vue/shared@3.5.13': {}
-
-  '@vue/test-utils@2.4.6':
-    dependencies:
-      js-beautify: 1.15.1
-      vue-component-type-helpers: 2.1.10
-
-  '@vueup/vue-quill@1.2.0(vue@3.5.13(typescript@5.6.3))':
-    dependencies:
-      quill: 1.3.7
-      quill-delta: 4.2.2
-      vue: 3.5.13(typescript@5.6.3)
-
-  '@vueuse/core@10.11.1(vue@3.5.13(typescript@5.7.2))':
-    dependencies:
-      '@types/web-bluetooth': 0.0.20
-      '@vueuse/metadata': 10.11.1
-      '@vueuse/shared': 10.11.1(vue@3.5.13(typescript@5.7.2))
-      vue-demi: 0.14.10(vue@3.5.13(typescript@5.7.2))
-    transitivePeerDependencies:
-      - '@vue/composition-api'
-      - vue
-
-  '@vueuse/core@12.0.0(typescript@5.7.2)':
-    dependencies:
-      '@types/web-bluetooth': 0.0.20
-      '@vueuse/metadata': 12.0.0
-      '@vueuse/shared': 12.0.0(typescript@5.7.2)
-      vue: 3.5.13(typescript@5.7.2)
-    transitivePeerDependencies:
-      - typescript
-
-  '@vueuse/integrations@12.0.0(async-validator@4.2.5)(axios@1.10.0)(change-case@5.4.4)(focus-trap@7.6.2)(nprogress@0.2.0)(qrcode@1.5.4)(sortablejs@1.15.6)(typescript@5.7.2)':
-    dependencies:
-      '@vueuse/core': 12.0.0(typescript@5.7.2)
-      '@vueuse/shared': 12.0.0(typescript@5.7.2)
-      vue: 3.5.13(typescript@5.7.2)
+      '@vueuse/core': 14.4.0(vue@3.5.41(typescript@6.0.3))
+      '@vueuse/shared': 14.4.0(vue@3.5.41(typescript@6.0.3))
+      vue: 3.5.41(typescript@6.0.3)
     optionalDependencies:
       async-validator: 4.2.5
-      axios: 1.10.0
-      change-case: 5.4.4
-      focus-trap: 7.6.2
+      axios: 1.19.0(debug@4.4.3(supports-color@10.2.2))(supports-color@10.2.2)
       nprogress: 0.2.0
       qrcode: 1.5.4
-      sortablejs: 1.15.6
+      sortablejs: 1.15.7
+
+  '@vueuse/metadata@13.9.0': {}
+
+  '@vueuse/metadata@14.4.0': {}
+
+  '@vueuse/motion@3.0.3(magicast@0.5.4)(vue@3.5.41(typescript@6.0.3))':
+    dependencies:
+      '@vueuse/core': 13.9.0(vue@3.5.41(typescript@6.0.3))
+      '@vueuse/shared': 13.9.0(vue@3.5.41(typescript@6.0.3))
+      defu: 6.1.7
+      framesync: 6.1.2
+      popmotion: 11.0.5
+      style-value-types: 5.1.2
+      vue: 3.5.41(typescript@6.0.3)
+    optionalDependencies:
+      '@nuxt/kit': 3.21.11(magicast@0.5.4)
     transitivePeerDependencies:
-      - typescript
+      - magicast
 
-  '@vueuse/metadata@10.11.1': {}
-
-  '@vueuse/metadata@12.0.0': {}
-
-  '@vueuse/shared@10.11.1(vue@3.5.13(typescript@5.7.2))':
+  '@vueuse/shared@13.9.0(vue@3.5.41(typescript@6.0.3))':
     dependencies:
-      vue-demi: 0.14.10(vue@3.5.13(typescript@5.7.2))
-    transitivePeerDependencies:
-      - '@vue/composition-api'
-      - vue
+      vue: 3.5.41(typescript@6.0.3)
 
-  '@vueuse/shared@12.0.0(typescript@5.7.2)':
+  '@vueuse/shared@14.4.0(vue@3.5.41(typescript@6.0.3))':
     dependencies:
-      vue: 3.5.13(typescript@5.7.2)
-    transitivePeerDependencies:
-      - typescript
+      vue: 3.5.41(typescript@6.0.3)
 
-  '@vxe-ui/core@4.0.23(vue@3.5.13(typescript@5.7.2))':
+  '@vxe-ui/core@4.4.19(vue@3.5.41(typescript@6.0.3))':
     dependencies:
-      dom-zindex: 1.0.6
-      vue: 3.5.13(typescript@5.7.2)
-      xe-utils: 3.5.32
+      dom-zindex: 1.0.7
+      vue: 3.5.41(typescript@6.0.3)
+      xe-utils: 4.0.12
 
-  JSONStream@1.3.5:
-    dependencies:
-      jsonparse: 1.3.1
-      through: 2.3.8
+  '@xmldom/xmldom@0.8.13': {}
+
+  '@yuku-codegen/binding-android-arm64@0.8.4':
+    optional: true
+
+  '@yuku-codegen/binding-darwin-arm64@0.8.4':
+    optional: true
+
+  '@yuku-codegen/binding-darwin-x64@0.8.4':
+    optional: true
+
+  '@yuku-codegen/binding-freebsd-x64@0.8.4':
+    optional: true
+
+  '@yuku-codegen/binding-linux-arm-gnu@0.8.4':
+    optional: true
+
+  '@yuku-codegen/binding-linux-arm-musl@0.8.4':
+    optional: true
+
+  '@yuku-codegen/binding-linux-arm64-gnu@0.8.4':
+    optional: true
+
+  '@yuku-codegen/binding-linux-arm64-musl@0.8.4':
+    optional: true
+
+  '@yuku-codegen/binding-linux-x64-gnu@0.8.4':
+    optional: true
+
+  '@yuku-codegen/binding-linux-x64-musl@0.8.4':
+    optional: true
+
+  '@yuku-codegen/binding-win32-arm64@0.8.4':
+    optional: true
+
+  '@yuku-codegen/binding-win32-x64@0.8.4':
+    optional: true
+
+  '@yuku-parser/binding-android-arm64@0.8.4':
+    optional: true
+
+  '@yuku-parser/binding-darwin-arm64@0.8.4':
+    optional: true
+
+  '@yuku-parser/binding-darwin-x64@0.8.4':
+    optional: true
+
+  '@yuku-parser/binding-freebsd-x64@0.8.4':
+    optional: true
+
+  '@yuku-parser/binding-linux-arm-gnu@0.8.4':
+    optional: true
+
+  '@yuku-parser/binding-linux-arm-musl@0.8.4':
+    optional: true
+
+  '@yuku-parser/binding-linux-arm64-gnu@0.8.4':
+    optional: true
+
+  '@yuku-parser/binding-linux-arm64-musl@0.8.4':
+    optional: true
+
+  '@yuku-parser/binding-linux-x64-gnu@0.8.4':
+    optional: true
+
+  '@yuku-parser/binding-linux-x64-musl@0.8.4':
+    optional: true
+
+  '@yuku-parser/binding-win32-arm64@0.8.4':
+    optional: true
+
+  '@yuku-parser/binding-win32-x64@0.8.4':
+    optional: true
+
+  '@yuku-toolchain/types@0.8.4': {}
 
   abbrev@2.0.0: {}
 
+  abbrev@3.0.1: {}
+
+  abbrev@4.0.0: {}
+
   abort-controller@3.0.0:
     dependencies:
       event-target-shim: 5.0.1
 
-  acorn-import-attributes@1.9.5(acorn@8.14.0):
+  acorn-import-attributes@1.9.5(acorn@8.18.0):
     dependencies:
-      acorn: 8.14.0
+      acorn: 8.18.0
 
-  acorn-jsx@5.3.2(acorn@8.14.0):
+  acorn-jsx@5.3.2(acorn@8.18.0):
     dependencies:
-      acorn: 8.14.0
+      acorn: 8.18.0
 
-  acorn@8.14.0: {}
+  acorn@8.18.0: {}
 
   adler-32@1.3.1: {}
 
-  agent-base@6.0.2:
+  agent-base@6.0.2(supports-color@10.2.2):
     dependencies:
-      debug: 4.4.0(supports-color@9.4.0)
+      debug: 4.4.3(supports-color@10.2.2)
     transitivePeerDependencies:
       - supports-color
 
-  agent-base@7.1.3: {}
+  agent-base@7.1.4: {}
 
-  agentkeepalive@4.5.0:
-    dependencies:
-      humanize-ms: 1.2.1
-
-  aggregate-error@3.1.0:
-    dependencies:
-      clean-stack: 2.2.0
-      indent-string: 4.0.0
-
-  ajv-draft-04@1.0.0(ajv@8.13.0):
-    optionalDependencies:
-      ajv: 8.13.0
-
-  ajv-formats@3.0.1(ajv@8.13.0):
-    optionalDependencies:
-      ajv: 8.13.0
-
-  ajv@6.12.6:
+  ajv@6.15.0:
     dependencies:
       fast-deep-equal: 3.1.3
       fast-json-stable-stringify: 2.1.0
       json-schema-traverse: 0.4.1
       uri-js: 4.4.1
 
-  ajv@8.12.0:
+  ajv@8.20.0:
     dependencies:
       fast-deep-equal: 3.1.3
-      json-schema-traverse: 1.0.0
-      require-from-string: 2.0.2
-      uri-js: 4.4.1
-
-  ajv@8.13.0:
-    dependencies:
-      fast-deep-equal: 3.1.3
-      json-schema-traverse: 1.0.0
-      require-from-string: 2.0.2
-      uri-js: 4.4.1
-
-  ajv@8.17.1:
-    dependencies:
-      fast-deep-equal: 3.1.3
-      fast-uri: 3.0.3
+      fast-uri: 3.1.5
       json-schema-traverse: 1.0.0
       require-from-string: 2.0.2
 
-  alien-signals@0.2.2: {}
+  alien-signals@3.2.1: {}
 
   ansi-align@3.0.1:
     dependencies:
@@ -13449,52 +16474,156 @@ snapshots:
 
   ansi-colors@4.1.3: {}
 
-  ansi-escapes@7.0.0:
+  ansi-escapes@7.3.0:
     dependencies:
       environment: 1.1.0
 
   ansi-regex@5.0.1: {}
 
-  ansi-regex@6.1.0: {}
+  ansi-regex@6.2.2: {}
 
   ansi-styles@4.3.0:
     dependencies:
       color-convert: 2.0.1
 
-  ansi-styles@6.2.1: {}
+  ansi-styles@6.2.3: {}
 
-  ant-design-vue@4.2.6(vue@3.5.13(typescript@5.7.2)):
+  ansis@4.3.1: {}
+
+  ant-design-vue@4.2.6(vue@3.5.41(typescript@6.0.3)):
     dependencies:
       '@ant-design/colors': 6.0.0
-      '@ant-design/icons-vue': 7.0.1(vue@3.5.13(typescript@5.7.2))
-      '@babel/runtime': 7.26.0
-      '@ctrl/tinycolor': 4.1.0
+      '@ant-design/icons-vue': 7.0.1(vue@3.5.41(typescript@6.0.3))
+      '@babel/runtime': 7.29.7
+      '@ctrl/tinycolor': 4.2.0
       '@emotion/hash': 0.9.2
       '@emotion/unitless': 0.8.1
       '@simonwep/pickr': 1.8.2
       array-tree-filter: 2.1.0
       async-validator: 4.2.5
-      csstype: 3.1.3
-      dayjs: 1.11.13
+      csstype: 3.2.3
+      dayjs: 1.11.21
       dom-align: 1.12.4
       dom-scroll-into-view: 2.0.1
-      lodash: 4.17.21
-      lodash-es: 4.17.21
+      lodash: 4.18.1
+      lodash-es: 4.18.1
       resize-observer-polyfill: 1.5.1
       scroll-into-view-if-needed: 2.2.31
       shallow-equal: 1.2.1
-      stylis: 4.3.4
+      stylis: 4.4.0
       throttle-debounce: 5.0.2
-      vue: 3.5.13(typescript@5.7.2)
-      vue-types: 3.0.2(vue@3.5.13(typescript@5.7.2))
+      vue: 3.5.41(typescript@6.0.3)
+      vue-types: 3.0.2(vue@3.5.41(typescript@6.0.3))
       warning: 4.0.3
 
-  any-promise@1.3.0: {}
+  antdv-next@1.5.0(vue@3.5.41(typescript@6.0.3)):
+    dependencies:
+      '@ant-design/colors': 8.0.1
+      '@ant-design/fast-color': 3.0.1
+      '@antdv-next/cssinjs': 1.0.6(vue@3.5.41(typescript@6.0.3))
+      '@antdv-next/icons': 1.1.1(vue@3.5.41(typescript@6.0.3))
+      '@v-c/async-validator': 1.0.1
+      '@v-c/cascader': 1.1.2(vue@3.5.41(typescript@6.0.3))
+      '@v-c/checkbox': 1.0.1(vue@3.5.41(typescript@6.0.3))
+      '@v-c/collapse': 1.0.1(vue@3.5.41(typescript@6.0.3))
+      '@v-c/color-picker': 1.0.6(vue@3.5.41(typescript@6.0.3))
+      '@v-c/dialog': 1.2.0(vue@3.5.41(typescript@6.0.3))
+      '@v-c/drawer': 1.0.6(vue@3.5.41(typescript@6.0.3))
+      '@v-c/dropdown': 1.0.5(vue@3.5.41(typescript@6.0.3))
+      '@v-c/image': 1.0.12(vue@3.5.41(typescript@6.0.3))
+      '@v-c/input': 1.1.1(vue@3.5.41(typescript@6.0.3))
+      '@v-c/input-number': 1.0.7(vue@3.5.41(typescript@6.0.3))
+      '@v-c/listy': 1.0.2(vue@3.5.41(typescript@6.0.3))
+      '@v-c/mentions': 1.2.0(vue@3.5.41(typescript@6.0.3))
+      '@v-c/menu': 1.3.0(vue@3.5.41(typescript@6.0.3))
+      '@v-c/mutate-observer': 1.0.2(vue@3.5.41(typescript@6.0.3))
+      '@v-c/notification': 2.0.2(vue@3.5.41(typescript@6.0.3))
+      '@v-c/pagination': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      '@v-c/picker': 1.3.2(dayjs@1.11.21)(vue@3.5.41(typescript@6.0.3))
+      '@v-c/progress': 1.0.1(vue@3.5.41(typescript@6.0.3))
+      '@v-c/qrcode': 1.0.1(vue@3.5.41(typescript@6.0.3))
+      '@v-c/rate': 1.0.1(vue@3.5.41(typescript@6.0.3))
+      '@v-c/resize-observer': 1.1.3(vue@3.5.41(typescript@6.0.3))
+      '@v-c/segmented': 1.0.4(vue@3.5.41(typescript@6.0.3))
+      '@v-c/select': 1.2.0(vue@3.5.41(typescript@6.0.3))
+      '@v-c/slick': 1.0.2(vue@3.5.41(typescript@6.0.3))
+      '@v-c/slider': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      '@v-c/steps': 1.0.0(vue@3.5.41(typescript@6.0.3))
+      '@v-c/switch': 1.0.1(vue@3.5.41(typescript@6.0.3))
+      '@v-c/table': 1.1.9(vue@3.5.41(typescript@6.0.3))
+      '@v-c/tabs': 1.3.0(vue@3.5.41(typescript@6.0.3))
+      '@v-c/textarea': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      '@v-c/tooltip': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      '@v-c/tour': 1.1.1(vue@3.5.41(typescript@6.0.3))
+      '@v-c/tree': 1.1.3(vue@3.5.41(typescript@6.0.3))
+      '@v-c/tree-select': 1.1.1(vue@3.5.41(typescript@6.0.3))
+      '@v-c/trigger': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      '@v-c/upload': 1.0.0(vue@3.5.41(typescript@6.0.3))
+      '@v-c/util': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      '@v-c/virtual-list': 1.1.0(vue@3.5.41(typescript@6.0.3))
+      '@vueuse/core': 14.4.0(vue@3.5.41(typescript@6.0.3))
+      dayjs: 1.11.21
+      es-toolkit: 1.50.0
+      scroll-into-view-if-needed: 3.1.0
+      throttle-debounce: 5.0.2
+    transitivePeerDependencies:
+      - date-fns
+      - luxon
+      - moment
+      - vue
 
   anymatch@3.1.3:
     dependencies:
       normalize-path: 3.0.0
-      picomatch: 2.3.1
+      picomatch: 2.3.2
+
+  app-builder-lib@26.15.3(dmg-builder@26.15.3)(electron-builder-squirrel-windows@26.15.3)(supports-color@10.2.2):
+    dependencies:
+      '@electron/asar': 3.4.1
+      '@electron/fuses': 1.8.0
+      '@electron/get': 3.1.0(supports-color@10.2.2)
+      '@electron/notarize': 2.5.0(supports-color@10.2.2)
+      '@electron/osx-sign': 1.3.3(supports-color@10.2.2)
+      '@electron/rebuild': 4.2.0(supports-color@10.2.2)
+      '@electron/universal': 2.0.3(supports-color@10.2.2)
+      '@malept/flatpak-bundler': 0.4.0(supports-color@10.2.2)
+      '@noble/hashes': 2.3.0
+      '@peculiar/webcrypto': 1.7.1
+      '@types/fs-extra': 9.0.13
+      ajv: 8.20.0
+      asn1js: 3.0.10
+      async-exit-hook: 2.0.1
+      builder-util: 26.15.3(supports-color@10.2.2)
+      builder-util-runtime: 9.7.0(supports-color@10.2.2)
+      chromium-pickle-js: 0.2.0
+      ci-info: 4.3.1
+      debug: 4.4.3(supports-color@10.2.2)
+      dmg-builder: 26.15.3(electron-builder-squirrel-windows@26.15.3)(supports-color@10.2.2)
+      dotenv: 16.6.1
+      dotenv-expand: 11.0.7
+      ejs: 3.1.10
+      electron-builder-squirrel-windows: 26.15.3(dmg-builder@26.15.3)(supports-color@10.2.2)
+      electron-publish: 26.15.3(supports-color@10.2.2)
+      fs-extra: 10.1.0
+      hosted-git-info: 4.1.0
+      isbinaryfile: 5.0.7
+      jiti: 2.7.0
+      js-yaml: 4.3.1
+      json5: 2.2.3
+      lazy-val: 1.0.5
+      minimatch: 10.2.6
+      pkijs: 3.4.0
+      plist: 3.1.0
+      proper-lockfile: 4.1.2
+      resedit: 1.7.2
+      semver: 7.7.4
+      tar: 7.5.22
+      temp-file: 3.4.0
+      tiny-async-pool: 1.3.0
+      unzipper: 0.12.5
+      which: 5.0.0
+    transitivePeerDependencies:
+      - supports-color
 
   archiver-utils@2.1.0:
     dependencies:
@@ -13528,9 +16657,9 @@ snapshots:
       graceful-fs: 4.2.11
       is-stream: 2.0.1
       lazystream: 1.0.1
-      lodash: 4.17.21
+      lodash: 4.18.1
       normalize-path: 3.0.0
-      readable-stream: 4.6.0
+      readable-stream: 4.7.0
 
   archiver@5.3.2:
     dependencies:
@@ -13547,14 +16676,30 @@ snapshots:
       archiver-utils: 5.0.2
       async: 3.2.6
       buffer-crc32: 1.0.0
-      readable-stream: 4.6.0
+      readable-stream: 4.7.0
       readdir-glob: 1.1.3
-      tar-stream: 3.1.7
+      tar-stream: 3.2.0
       zip-stream: 6.0.1
+    transitivePeerDependencies:
+      - bare-abort-controller
+      - bare-buffer
+      - react-native-b4a
 
-  are-docs-informative@0.0.2: {}
-
-  arg@5.0.2: {}
+  archiver@8.0.0:
+    dependencies:
+      async: 3.2.6
+      buffer-crc32: 1.0.0
+      is-stream: 4.0.1
+      lazystream: 1.0.1
+      normalize-path: 3.0.0
+      readable-stream: 4.7.0
+      readdir-glob: 3.0.0
+      tar-stream: 3.2.0
+      zip-stream: 7.0.5
+    transitivePeerDependencies:
+      - bare-abort-controller
+      - bare-buffer
+      - react-native-b4a
 
   argparse@1.0.10:
     dependencies:
@@ -13562,19 +16707,17 @@ snapshots:
 
   argparse@2.0.1: {}
 
-  aria-hidden@1.2.4:
+  argue-cli@3.1.0: {}
+
+  aria-hidden@1.2.6:
     dependencies:
       tslib: 2.8.1
 
   array-buffer-byte-length@1.0.2:
     dependencies:
-      call-bound: 1.0.3
+      call-bound: 1.0.4
       is-array-buffer: 3.0.5
 
-  array-differ@3.0.0: {}
-
-  array-ify@1.0.0: {}
-
   array-timsort@1.0.3: {}
 
   array-tree-filter@2.1.0: {}
@@ -13584,19 +16727,38 @@ snapshots:
   arraybuffer.prototype.slice@1.0.4:
     dependencies:
       array-buffer-byte-length: 1.0.2
-      call-bind: 1.0.8
+      call-bind: 1.0.9
       define-properties: 1.2.1
-      es-abstract: 1.23.6
+      es-abstract: 1.24.2
       es-errors: 1.3.0
-      get-intrinsic: 1.2.6
+      get-intrinsic: 1.3.0
       is-array-buffer: 3.0.5
 
-  arrify@2.0.1: {}
+  asn1js@3.0.10:
+    dependencies:
+      pvtsutils: 1.3.6
+      pvutils: 1.2.0
+      tslib: 2.8.1
 
   assertion-error@2.0.1: {}
 
+  ast-kit@2.2.0:
+    dependencies:
+      '@babel/parser': 7.29.8
+      pathe: 2.0.3
+
+  ast-walker-scope@0.9.0:
+    dependencies:
+      '@babel/parser': 7.29.8
+      '@babel/types': 7.29.8
+      ast-kit: 2.2.0
+
   astral-regex@2.0.0: {}
 
+  async-exit-hook@2.0.1: {}
+
+  async-function@1.0.0: {}
+
   async-sema@3.1.1: {}
 
   async-validator@4.2.5: {}
@@ -13607,91 +16769,114 @@ snapshots:
 
   at-least-node@1.0.0: {}
 
-  atomically@2.0.3:
+  atomically@2.1.1:
     dependencies:
-      stubborn-fs: 1.2.5
-      when-exit: 2.1.3
+      stubborn-fs: 2.0.0
+      when-exit: 2.1.5
 
-  autoprefixer@10.4.20(postcss@8.4.49):
+  autoprefixer@10.5.4(postcss@8.5.26):
     dependencies:
-      browserslist: 4.24.3
-      caniuse-lite: 1.0.30001690
-      fraction.js: 4.3.7
-      normalize-range: 0.1.2
+      browserslist: 4.28.8
+      caniuse-lite: 1.0.30001809
+      fraction.js: 5.3.4
       picocolors: 1.1.1
-      postcss: 8.4.49
+      postcss: 8.5.26
       postcss-value-parser: 4.2.0
 
   available-typed-arrays@1.0.7:
     dependencies:
-      possible-typed-array-names: 1.0.0
+      possible-typed-array-names: 1.1.0
 
-  axios-mock-adapter@2.1.0(axios@1.7.9):
+  aws4@1.13.2: {}
+
+  axios-mock-adapter@2.1.0(axios@1.19.0(debug@4.4.3(supports-color@10.2.2))(supports-color@10.2.2)):
     dependencies:
-      axios: 1.7.9
+      axios: 1.19.0(debug@4.4.3(supports-color@10.2.2))(supports-color@10.2.2)
       fast-deep-equal: 3.1.3
       is-buffer: 2.0.5
 
-  axios@1.10.0:
+  axios@1.19.0(debug@4.4.3(supports-color@10.2.2))(supports-color@10.2.2):
     dependencies:
-      follow-redirects: 1.15.9
-      form-data: 4.0.1
-      proxy-from-env: 1.1.0
+      follow-redirects: 1.16.0(debug@4.4.3(supports-color@10.2.2))
+      form-data: 4.0.6
+      https-proxy-agent: 5.0.1(supports-color@10.2.2)
+      proxy-from-env: 2.1.0
     transitivePeerDependencies:
       - debug
+      - supports-color
 
-  axios@1.7.9:
+  b4a@1.8.1: {}
+
+  babel-plugin-polyfill-corejs2@0.4.17(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2):
     dependencies:
-      follow-redirects: 1.15.9
-      form-data: 4.0.1
-      proxy-from-env: 1.1.0
-    transitivePeerDependencies:
-      - debug
-
-  b4a@1.6.7: {}
-
-  babel-plugin-polyfill-corejs2@0.4.12(@babel/core@7.26.0):
-    dependencies:
-      '@babel/compat-data': 7.26.3
-      '@babel/core': 7.26.0
-      '@babel/helper-define-polyfill-provider': 0.6.3(@babel/core@7.26.0)
+      '@babel/compat-data': 7.29.7
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-define-polyfill-provider': 0.6.8(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
       semver: 6.3.1
     transitivePeerDependencies:
       - supports-color
 
-  babel-plugin-polyfill-corejs3@0.10.6(@babel/core@7.26.0):
+  babel-plugin-polyfill-corejs3@0.14.2(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2):
     dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-define-polyfill-provider': 0.6.3(@babel/core@7.26.0)
-      core-js-compat: 3.39.0
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-define-polyfill-provider': 0.6.8(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
+      core-js-compat: 3.50.0
     transitivePeerDependencies:
       - supports-color
 
-  babel-plugin-polyfill-regenerator@0.6.3(@babel/core@7.26.0):
+  babel-plugin-polyfill-regenerator@0.6.8(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2):
     dependencies:
-      '@babel/core': 7.26.0
-      '@babel/helper-define-polyfill-provider': 0.6.3(@babel/core@7.26.0)
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/helper-define-polyfill-provider': 0.6.8(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
     transitivePeerDependencies:
       - supports-color
 
   balanced-match@1.0.2: {}
 
-  balanced-match@2.0.0: {}
+  balanced-match@4.0.4: {}
 
-  bare-events@2.5.0:
-    optional: true
+  bare-events@2.9.1: {}
+
+  bare-fs@4.8.0:
+    dependencies:
+      bare-events: 2.9.1
+      bare-path: 3.1.1
+      bare-stream: 2.13.3(bare-events@2.9.1)
+      bare-url: 2.5.1
+      fast-fifo: 1.3.2
+    transitivePeerDependencies:
+      - bare-abort-controller
+      - react-native-b4a
+
+  bare-path@3.1.1: {}
+
+  bare-stream@2.13.3(bare-events@2.9.1):
+    dependencies:
+      b4a: 1.8.1
+      streamx: 2.28.0
+      teex: 1.0.1
+    optionalDependencies:
+      bare-events: 2.9.1
+    transitivePeerDependencies:
+      - react-native-b4a
+
+  bare-url@2.5.1:
+    dependencies:
+      bare-path: 3.1.1
 
   base64-arraybuffer@1.0.2: {}
 
   base64-js@1.5.1: {}
 
+  baseline-browser-mapping@2.11.13: {}
+
   better-path-resolve@1.0.0:
     dependencies:
       is-windows: 1.0.2
 
   big-integer@1.6.52: {}
 
-  binary-extensions@2.3.0: {}
+  bignumber.js@9.3.1: {}
 
   binary@0.3.0:
     dependencies:
@@ -13702,9 +16887,9 @@ snapshots:
     dependencies:
       file-uri-to-path: 1.0.0
 
-  bintrees@1.0.2: {}
+  birpc@2.9.0: {}
 
-  birpc@0.2.19: {}
+  birpc@4.1.0: {}
 
   bl@4.1.0:
     dependencies:
@@ -13714,38 +16899,48 @@ snapshots:
 
   bluebird@3.4.7: {}
 
+  bluebird@3.7.2: {}
+
   boolbase@1.0.0: {}
 
+  boolean@3.2.0:
+    optional: true
+
   boxen@8.0.1:
     dependencies:
       ansi-align: 3.0.1
       camelcase: 8.0.0
-      chalk: 5.4.0
+      chalk: 5.6.2
       cli-boxes: 3.0.0
       string-width: 7.2.0
-      type-fest: 4.30.2
+      type-fest: 4.41.0
       widest-line: 5.0.0
-      wrap-ansi: 9.0.0
+      wrap-ansi: 9.0.2
 
-  brace-expansion@1.1.11:
+  brace-expansion@1.1.18:
     dependencies:
       balanced-match: 1.0.2
       concat-map: 0.0.1
 
-  brace-expansion@2.0.1:
+  brace-expansion@2.1.4:
     dependencies:
       balanced-match: 1.0.2
 
+  brace-expansion@5.0.9:
+    dependencies:
+      balanced-match: 4.0.4
+
   braces@3.0.3:
     dependencies:
       fill-range: 7.1.1
 
-  browserslist@4.24.3:
+  browserslist@4.28.8:
     dependencies:
-      caniuse-lite: 1.0.30001690
-      electron-to-chromium: 1.5.75
-      node-releases: 2.0.19
-      update-browserslist-db: 1.1.1(browserslist@4.24.3)
+      baseline-browser-mapping: 2.11.13
+      caniuse-lite: 1.0.30001809
+      electron-to-chromium: 1.5.403
+      node-releases: 2.0.53
+      update-browserslist-db: 1.3.0(browserslist@4.28.8)
 
   buffer-crc32@0.2.13: {}
 
@@ -13753,6 +16948,10 @@ snapshots:
 
   buffer-from@1.1.2: {}
 
+  buffer-image-size@0.6.4:
+    dependencies:
+      '@types/node': 26.2.0
+
   buffer-indexof-polyfill@1.0.2: {}
 
   buffer@5.7.1:
@@ -13767,72 +16966,95 @@ snapshots:
 
   buffers@0.1.1: {}
 
-  builtin-modules@3.3.0: {}
+  builder-util-runtime@9.7.0(supports-color@10.2.2):
+    dependencies:
+      debug: 4.4.3(supports-color@10.2.2)
+      sax: 1.6.1
+    transitivePeerDependencies:
+      - supports-color
+
+  builder-util@26.15.3(supports-color@10.2.2):
+    dependencies:
+      '@types/debug': 4.1.13
+      builder-util-runtime: 9.7.0(supports-color@10.2.2)
+      chalk: 4.1.2
+      cross-spawn: 7.0.6
+      debug: 4.4.3(supports-color@10.2.2)
+      fs-extra: 10.1.0
+      http-proxy-agent: 7.0.2(supports-color@10.2.2)
+      https-proxy-agent: 7.0.6(supports-color@10.2.2)
+      js-yaml: 4.3.1
+      sanitize-filename: 1.6.4
+      source-map-support: 0.5.21
+      stat-mode: 1.0.0
+      temp-file: 3.4.0
+      tiny-async-pool: 1.3.0
+    transitivePeerDependencies:
+      - supports-color
 
   bundle-name@4.1.0:
     dependencies:
-      run-applescript: 7.0.0
+      run-applescript: 7.1.0
 
-  c12@2.0.1(magicast@0.3.5):
+  bytestreamjs@2.0.1: {}
+
+  c12@3.3.4(magicast@0.5.4):
     dependencies:
-      chokidar: 4.0.3
-      confbox: 0.1.8
-      defu: 6.1.4
-      dotenv: 16.4.7
-      giget: 1.2.3
-      jiti: 2.4.2
-      mlly: 1.7.3
-      ohash: 1.1.4
-      pathe: 1.1.2
-      perfect-debounce: 1.0.0
-      pkg-types: 1.2.1
-      rc9: 2.1.2
+      chokidar: 5.0.0
+      confbox: 0.2.4
+      defu: 6.1.7
+      dotenv: 17.4.2
+      exsolve: 1.1.1
+      giget: 3.3.1
+      jiti: 2.7.0
+      ohash: 2.0.11
+      pathe: 2.0.3
+      perfect-debounce: 2.1.0
+      pkg-types: 2.3.1
+      rc9: 3.0.1
     optionalDependencies:
-      magicast: 0.3.5
+      magicast: 0.5.4
 
   cac@6.7.14: {}
 
-  cacache@15.3.0:
-    dependencies:
-      '@npmcli/fs': 1.1.1
-      '@npmcli/move-file': 1.1.2
-      chownr: 2.0.0
-      fs-minipass: 2.1.0
-      glob: 7.2.3
-      infer-owner: 1.0.4
-      lru-cache: 6.0.0
-      minipass: 3.3.6
-      minipass-collect: 1.0.2
-      minipass-flush: 1.0.5
-      minipass-pipeline: 1.2.4
-      mkdirp: 1.0.4
-      p-map: 4.0.0
-      promise-inflight: 1.0.1
-      rimraf: 3.0.2
-      ssri: 8.0.1
-      tar: 6.2.1
-      unique-filename: 1.1.1
-    transitivePeerDependencies:
-      - bluebird
+  cac@7.0.0: {}
 
-  call-bind-apply-helpers@1.0.1:
+  cacheable-lookup@5.0.4: {}
+
+  cacheable-request@7.0.4:
+    dependencies:
+      clone-response: 1.0.3
+      get-stream: 5.2.0
+      http-cache-semantics: 4.2.0
+      keyv: 4.5.4
+      lowercase-keys: 2.0.0
+      normalize-url: 6.1.0
+      responselike: 2.0.1
+
+  cacheable@2.5.0:
+    dependencies:
+      '@cacheable/memory': 2.2.0
+      '@cacheable/utils': 2.5.0
+      hookified: 1.15.1
+      keyv: 5.6.0
+      qified: 0.10.1
+
+  call-bind-apply-helpers@1.0.2:
     dependencies:
       es-errors: 1.3.0
       function-bind: 1.1.2
 
-  call-bind@1.0.8:
+  call-bind@1.0.9:
     dependencies:
-      call-bind-apply-helpers: 1.0.1
+      call-bind-apply-helpers: 1.0.2
       es-define-property: 1.0.1
-      get-intrinsic: 1.2.6
+      get-intrinsic: 1.3.0
       set-function-length: 1.2.2
 
-  call-bound@1.0.3:
+  call-bound@1.0.4:
     dependencies:
-      call-bind-apply-helpers: 1.0.1
-      get-intrinsic: 1.2.6
-
-  callsite@1.0.0: {}
+      call-bind-apply-helpers: 1.0.2
+      get-intrinsic: 1.3.0
 
   callsites@3.1.0: {}
 
@@ -13841,123 +17063,95 @@ snapshots:
       pascal-case: 3.1.2
       tslib: 2.8.1
 
-  camelcase-css@2.0.1: {}
-
   camelcase@5.3.1: {}
 
-  camelcase@6.3.0: {}
-
   camelcase@8.0.0: {}
 
   caniuse-api@3.0.0:
     dependencies:
-      browserslist: 4.24.3
-      caniuse-lite: 1.0.30001690
+      browserslist: 4.28.8
+      caniuse-lite: 1.0.30001809
       lodash.memoize: 4.1.2
       lodash.uniq: 4.5.0
 
-  caniuse-lite@1.0.30001690: {}
+  caniuse-lite@1.0.30001809: {}
 
   cfb@1.2.2:
     dependencies:
       adler-32: 1.3.1
       crc-32: 1.2.2
 
-  chai@5.1.2:
-    dependencies:
-      assertion-error: 2.0.1
-      check-error: 2.1.1
-      deep-eql: 5.0.2
-      loupe: 3.1.2
-      pathval: 2.0.0
+  chai@6.2.2: {}
 
   chainsaw@0.1.0:
     dependencies:
       traverse: 0.3.9
 
-  chalk-template@1.1.0:
+  chalk-template@1.1.2:
     dependencies:
-      chalk: 5.4.0
+      chalk: 5.6.2
 
   chalk@4.1.2:
     dependencies:
       ansi-styles: 4.3.0
       supports-color: 7.2.0
 
-  chalk@5.3.0: {}
+  chalk@5.6.2: {}
 
-  chalk@5.4.0: {}
-
-  change-case@5.4.4: {}
-
-  chardet@0.7.0: {}
-
-  check-error@2.1.1: {}
+  chardet@2.2.0: {}
 
   cheerio-select@2.1.0:
     dependencies:
       boolbase: 1.0.0
-      css-select: 5.1.0
-      css-what: 6.1.0
+      css-select: 5.2.2
+      css-what: 6.2.2
       domelementtype: 2.3.0
       domhandler: 5.0.3
-      domutils: 3.1.0
+      domutils: 3.2.2
 
-  cheerio@1.0.0:
+  cheerio@1.2.0:
     dependencies:
       cheerio-select: 2.1.0
       dom-serializer: 2.0.0
       domhandler: 5.0.3
-      domutils: 3.1.0
-      encoding-sniffer: 0.2.0
-      htmlparser2: 9.1.0
-      parse5: 7.2.1
+      domutils: 3.2.2
+      encoding-sniffer: 0.2.1
+      htmlparser2: 10.1.0
+      parse5: 7.3.0
       parse5-htmlparser2-tree-adapter: 7.1.0
       parse5-parser-stream: 7.1.2
-      undici: 6.21.0
+      undici: 7.29.0
       whatwg-mimetype: 4.0.0
 
-  chokidar@3.6.0:
+  chokidar@5.0.0:
     dependencies:
-      anymatch: 3.1.3
-      braces: 3.0.3
-      glob-parent: 5.1.2
-      is-binary-path: 2.1.0
-      is-glob: 4.0.3
-      normalize-path: 3.0.0
-      readdirp: 3.6.0
-    optionalDependencies:
-      fsevents: 2.3.3
-
-  chokidar@4.0.3:
-    dependencies:
-      readdirp: 4.0.2
-
-  chownr@2.0.0: {}
+      readdirp: 5.1.1
 
   chownr@3.0.0: {}
 
-  ci-info@3.9.0: {}
+  chromium-pickle-js@0.2.0: {}
 
-  ci-info@4.1.0: {}
+  ci-info@4.3.1: {}
 
-  circular-dependency-scanner@2.3.0:
+  ci-info@4.4.0: {}
+
+  circular-dependency-scanner@3.1.0:
     dependencies:
-      '@ast-grep/napi': 0.31.1
-      '@vue/compiler-sfc': 3.5.13
-      commander: 12.1.0
-      get-tsconfig: 4.8.1
-      graph-cycles: 3.0.0
-      listr2: 8.2.5
-      minimatch: 9.0.5
+      '@ast-grep/napi': 0.44.1
+      '@vue/compiler-sfc': 3.5.41
+      commander: 15.0.0
+      get-tsconfig: 4.14.1
+      listr2: 11.0.0
+      minimatch: 10.2.6
       node-cleanup: 2.1.2
-      typescript: 5.7.2
       update-notifier: 7.3.1
-      zx: 8.2.4
+      zx: 8.8.5
 
   citty@0.1.6:
     dependencies:
-      consola: 3.3.0
+      consola: 3.4.2
+
+  citty@0.2.2: {}
 
   class-variance-authority@0.7.1:
     dependencies:
@@ -13967,35 +17161,18 @@ snapshots:
     dependencies:
       source-map: 0.6.1
 
-  clean-regexp@1.0.0:
-    dependencies:
-      escape-string-regexp: 1.0.5
-
-  clean-stack@2.2.0: {}
-
-  clear-module@4.1.2:
-    dependencies:
-      parent-module: 2.0.0
-      resolve-from: 5.0.0
-
   cli-boxes@3.0.0: {}
 
   cli-cursor@5.0.0:
     dependencies:
       restore-cursor: 5.1.0
 
-  cli-spinners@2.9.2: {}
+  cli-spinners@3.4.0: {}
 
-  cli-truncate@4.0.0:
+  cli-truncate@6.1.1:
     dependencies:
-      slice-ansi: 5.0.0
-      string-width: 7.2.0
-
-  clipboardy@4.0.0:
-    dependencies:
-      execa: 8.0.1
-      is-wsl: 3.1.0
-      is64bit: 2.0.0
+      slice-ansi: 9.0.0
+      string-width: 8.2.2
 
   cliui@6.0.0:
     dependencies:
@@ -14003,33 +17180,35 @@ snapshots:
       strip-ansi: 6.0.1
       wrap-ansi: 6.2.0
 
-  cliui@7.0.4:
-    dependencies:
-      string-width: 4.2.3
-      strip-ansi: 6.0.1
-      wrap-ansi: 7.0.0
-
   cliui@8.0.1:
     dependencies:
       string-width: 4.2.3
       strip-ansi: 6.0.1
       wrap-ansi: 7.0.0
 
-  clone@2.1.2: {}
+  cliui@9.0.1:
+    dependencies:
+      string-width: 7.2.0
+      strip-ansi: 7.2.0
+      wrap-ansi: 9.0.2
+
+  clone-response@1.0.3:
+    dependencies:
+      mimic-response: 1.0.1
 
   clsx@2.1.1: {}
 
-  cluster-key-slot@1.1.2: {}
+  cluster-key-slot@1.1.1: {}
 
-  codemirror@6.0.1:
+  codemirror@6.0.2:
     dependencies:
-      '@codemirror/autocomplete': 6.18.6
-      '@codemirror/commands': 6.8.1
-      '@codemirror/language': 6.11.0
-      '@codemirror/lint': 6.8.5
-      '@codemirror/search': 6.5.10
-      '@codemirror/state': 6.5.2
-      '@codemirror/view': 6.36.5
+      '@codemirror/autocomplete': 6.20.3
+      '@codemirror/commands': 6.10.4
+      '@codemirror/language': 6.12.4
+      '@codemirror/lint': 6.9.7
+      '@codemirror/search': 6.7.1
+      '@codemirror/state': 6.7.1
+      '@codemirror/view': 6.43.8
 
   codepage@1.15.0: {}
 
@@ -14041,9 +17220,7 @@ snapshots:
 
   colord@2.9.3: {}
 
-  colorette@1.4.0: {}
-
-  colorette@2.0.20: {}
+  colorjs.io@0.5.2: {}
 
   combined-stream@1.0.8:
     dependencies:
@@ -14051,42 +17228,39 @@ snapshots:
 
   commander@10.0.1: {}
 
-  commander@12.1.0: {}
+  commander@11.1.0: {}
+
+  commander@14.0.3: {}
+
+  commander@15.0.0: {}
 
   commander@2.20.3: {}
 
-  commander@4.1.1: {}
+  commander@5.1.0: {}
 
-  commander@7.2.0: {}
+  commander@9.5.0:
+    optional: true
 
-  commander@8.3.0: {}
-
-  comment-json@4.2.5:
+  comment-json@5.0.0:
     dependencies:
       array-timsort: 1.0.3
-      core-util-is: 1.0.3
       esprima: 4.0.1
-      has-own-prop: 2.0.0
-      repeat-string: 1.6.1
 
-  comment-parser@1.4.1: {}
+  comment-parser@1.4.7: {}
 
-  commitlint-plugin-function-rules@4.0.1(@commitlint/lint@19.6.0):
+  commitlint-plugin-function-rules@5.0.1(@commitlint/lint@21.2.0):
     dependencies:
-      '@commitlint/lint': 19.6.0
+      '@commitlint/lint': 21.2.0
 
   common-tags@1.8.2: {}
 
   commondir@1.0.1: {}
 
-  compare-func@2.0.0:
-    dependencies:
-      array-ify: 1.0.0
-      dot-prop: 5.3.0
+  compare-version@0.1.2: {}
 
   compare-versions@6.1.1: {}
 
-  compatx@0.1.8: {}
+  compatx@0.2.0: {}
 
   compress-commons@4.1.2:
     dependencies:
@@ -14101,93 +17275,89 @@ snapshots:
       crc32-stream: 6.0.0
       is-stream: 2.0.1
       normalize-path: 3.0.0
-      readable-stream: 4.6.0
+      readable-stream: 4.7.0
+
+  compress-commons@7.0.1:
+    dependencies:
+      crc-32: 1.2.2
+      crc32-stream: 7.0.1
+      is-stream: 4.0.1
+      normalize-path: 3.0.0
+      readable-stream: 4.7.0
 
   compute-scroll-into-view@1.0.20: {}
 
-  computeds@0.0.1: {}
+  compute-scroll-into-view@3.1.1: {}
 
   concat-map@0.0.1: {}
 
   confbox@0.1.8: {}
 
+  confbox@0.2.4: {}
+
   config-chain@1.1.13:
     dependencies:
       ini: 1.3.8
       proto-list: 1.2.4
 
-  configstore@7.0.0:
+  configstore@7.1.0:
     dependencies:
-      atomically: 2.0.3
+      atomically: 2.1.1
       dot-prop: 9.0.0
       graceful-fs: 4.2.11
       xdg-basedir: 5.1.0
 
-  connect-history-api-fallback@1.6.0: {}
+  consola@3.4.2: {}
 
-  consola@2.15.3: {}
-
-  consola@3.3.0: {}
-
-  conventional-changelog-angular@7.0.0:
+  conventional-changelog-angular@9.2.1:
     dependencies:
-      compare-func: 2.0.0
+      '@conventional-changelog/template': 1.2.1
 
-  conventional-changelog-conventionalcommits@7.0.2:
+  conventional-changelog-conventionalcommits@10.2.1:
     dependencies:
-      compare-func: 2.0.0
+      '@conventional-changelog/template': 1.2.1
 
-  conventional-commits-parser@5.0.0:
+  conventional-commits-parser@7.1.2:
     dependencies:
-      JSONStream: 1.3.5
-      is-text-path: 2.0.0
-      meow: 12.1.1
-      split2: 4.2.0
+      '@simple-libs/stream-utils': 2.0.0
+      argue-cli: 3.1.0
 
   convert-source-map@2.0.0: {}
 
-  cookie-es@1.2.2: {}
+  cookie-es@1.2.3: {}
 
-  copy-anything@2.0.6:
-    dependencies:
-      is-what: 3.14.1
-    optional: true
+  cookie-es@2.0.1: {}
+
+  cookie-es@3.1.1: {}
 
   copy-anything@3.0.5:
     dependencies:
       is-what: 4.1.16
+    optional: true
 
-  core-js-compat@3.39.0:
+  core-js-compat@3.50.0:
     dependencies:
-      browserslist: 4.24.3
+      browserslist: 4.28.8
 
-  core-js@3.39.0: {}
+  core-js@3.50.0: {}
 
   core-util-is@1.0.3: {}
 
-  cosmiconfig-typescript-loader@6.1.0(@types/node@22.10.2)(cosmiconfig@9.0.0(typescript@5.7.2))(typescript@5.7.2):
+  cosmiconfig-typescript-loader@6.3.0(@types/node@25.9.5)(cosmiconfig@9.0.2(typescript@6.0.3))(typescript@6.0.3):
     dependencies:
-      '@types/node': 22.10.2
-      cosmiconfig: 9.0.0(typescript@5.7.2)
-      jiti: 2.4.2
-      typescript: 5.7.2
+      '@types/node': 25.9.5
+      cosmiconfig: 9.0.2(typescript@6.0.3)
+      jiti: 2.6.1
+      typescript: 6.0.3
 
-  cosmiconfig@7.1.0:
-    dependencies:
-      '@types/parse-json': 4.0.2
-      import-fresh: 3.3.0
-      parse-json: 5.2.0
-      path-type: 4.0.0
-      yaml: 1.10.2
-
-  cosmiconfig@9.0.0(typescript@5.7.2):
+  cosmiconfig@9.0.2(typescript@6.0.3):
     dependencies:
       env-paths: 2.2.1
-      import-fresh: 3.3.0
-      js-yaml: 4.1.0
+      import-fresh: 3.3.1
+      js-yaml: 4.3.1
       parse-json: 5.2.0
     optionalDependencies:
-      typescript: 5.7.2
+      typescript: 6.0.3
 
   crc-32@1.2.2: {}
 
@@ -14199,14 +17369,23 @@ snapshots:
   crc32-stream@6.0.0:
     dependencies:
       crc-32: 1.2.2
-      readable-stream: 4.6.0
+      readable-stream: 4.7.0
 
-  crelt@1.0.6: {}
-
-  croner@9.0.0: {}
-
-  cross-env@7.0.3:
+  crc32-stream@7.0.1:
     dependencies:
+      crc-32: 1.2.2
+      readable-stream: 4.7.0
+
+  crelt@1.0.7: {}
+
+  croner@10.0.1: {}
+
+  cross-dirname@0.1.0:
+    optional: true
+
+  cross-env@10.1.0:
+    dependencies:
+      '@epic-web/invariant': 1.0.0
       cross-spawn: 7.0.6
 
   cross-spawn@7.0.6:
@@ -14215,141 +17394,122 @@ snapshots:
       shebang-command: 2.0.0
       which: 2.0.2
 
-  crossws@0.3.1:
+  crossws@0.3.5:
     dependencies:
       uncrypto: 0.1.3
 
+  crossws@0.4.10: {}
+
+  crypto-js@4.2.0: {}
+
   crypto-random-string@2.0.0: {}
 
-  cspell-config-lib@8.17.1:
+  cspell-config-lib@10.0.1:
     dependencies:
-      '@cspell/cspell-types': 8.17.1
-      comment-json: 4.2.5
-      yaml: 2.6.1
+      '@cspell/cspell-types': 10.0.1
+      comment-json: 5.0.0
+      smol-toml: 1.7.1
+      yaml: 2.9.0
 
-  cspell-dictionary@8.17.1:
+  cspell-dictionary@10.0.1:
     dependencies:
-      '@cspell/cspell-pipe': 8.17.1
-      '@cspell/cspell-types': 8.17.1
-      cspell-trie-lib: 8.17.1
-      fast-equals: 5.0.1
+      '@cspell/cspell-performance-monitor': 10.0.1
+      '@cspell/cspell-pipe': 10.0.1
+      '@cspell/cspell-types': 10.0.1
+      cspell-trie-lib: 10.0.1(@cspell/cspell-types@10.0.1)
+      fast-equals: 6.0.2
 
-  cspell-gitignore@8.17.1:
+  cspell-gitignore@10.0.1:
     dependencies:
-      '@cspell/url': 8.17.1
-      cspell-glob: 8.17.1
-      cspell-io: 8.17.1
-      find-up-simple: 1.0.0
+      '@cspell/url': 10.0.1
+      cspell-glob: 10.0.1
+      cspell-io: 10.0.1
 
-  cspell-glob@8.17.1:
+  cspell-glob@10.0.1:
     dependencies:
-      '@cspell/url': 8.17.1
-      micromatch: 4.0.8
+      '@cspell/url': 10.0.1
+      picomatch: 4.0.5
 
-  cspell-grammar@8.17.1:
+  cspell-grammar@10.0.1:
     dependencies:
-      '@cspell/cspell-pipe': 8.17.1
-      '@cspell/cspell-types': 8.17.1
+      '@cspell/cspell-pipe': 10.0.1
+      '@cspell/cspell-types': 10.0.1
 
-  cspell-io@8.17.1:
+  cspell-io@10.0.1:
     dependencies:
-      '@cspell/cspell-service-bus': 8.17.1
-      '@cspell/url': 8.17.1
+      '@cspell/cspell-service-bus': 10.0.1
+      '@cspell/url': 10.0.1
 
-  cspell-lib@8.17.1:
+  cspell-lib@10.0.1:
     dependencies:
-      '@cspell/cspell-bundled-dicts': 8.17.1
-      '@cspell/cspell-pipe': 8.17.1
-      '@cspell/cspell-resolver': 8.17.1
-      '@cspell/cspell-types': 8.17.1
-      '@cspell/dynamic-import': 8.17.1
-      '@cspell/filetypes': 8.17.1
-      '@cspell/strong-weak-map': 8.17.1
-      '@cspell/url': 8.17.1
-      clear-module: 4.1.2
-      comment-json: 4.2.5
-      cspell-config-lib: 8.17.1
-      cspell-dictionary: 8.17.1
-      cspell-glob: 8.17.1
-      cspell-grammar: 8.17.1
-      cspell-io: 8.17.1
-      cspell-trie-lib: 8.17.1
-      env-paths: 3.0.0
-      fast-equals: 5.0.1
-      gensequence: 7.0.0
-      import-fresh: 3.3.0
+      '@cspell/cspell-bundled-dicts': 10.0.1
+      '@cspell/cspell-performance-monitor': 10.0.1
+      '@cspell/cspell-pipe': 10.0.1
+      '@cspell/cspell-resolver': 10.0.1
+      '@cspell/cspell-types': 10.0.1
+      '@cspell/dynamic-import': 10.0.1
+      '@cspell/filetypes': 10.0.1
+      '@cspell/rpc': 10.0.1
+      '@cspell/strong-weak-map': 10.0.1
+      '@cspell/url': 10.0.1
+      cspell-config-lib: 10.0.1
+      cspell-dictionary: 10.0.1
+      cspell-glob: 10.0.1
+      cspell-grammar: 10.0.1
+      cspell-io: 10.0.1
+      cspell-trie-lib: 10.0.1(@cspell/cspell-types@10.0.1)
+      env-paths: 4.0.0
+      gensequence: 8.0.8
+      import-fresh: 4.0.0
       resolve-from: 5.0.0
       vscode-languageserver-textdocument: 1.0.12
-      vscode-uri: 3.0.8
+      vscode-uri: 3.1.0
       xdg-basedir: 5.1.0
 
-  cspell-trie-lib@8.17.1:
+  cspell-trie-lib@10.0.1(@cspell/cspell-types@10.0.1):
     dependencies:
-      '@cspell/cspell-pipe': 8.17.1
-      '@cspell/cspell-types': 8.17.1
-      gensequence: 7.0.0
+      '@cspell/cspell-types': 10.0.1
 
-  cspell@8.17.1:
+  cspell@10.0.1:
     dependencies:
-      '@cspell/cspell-json-reporter': 8.17.1
-      '@cspell/cspell-pipe': 8.17.1
-      '@cspell/cspell-types': 8.17.1
-      '@cspell/dynamic-import': 8.17.1
-      '@cspell/url': 8.17.1
-      chalk: 5.4.0
-      chalk-template: 1.1.0
-      commander: 12.1.0
-      cspell-dictionary: 8.17.1
-      cspell-gitignore: 8.17.1
-      cspell-glob: 8.17.1
-      cspell-io: 8.17.1
-      cspell-lib: 8.17.1
+      '@cspell/cspell-json-reporter': 10.0.1
+      '@cspell/cspell-performance-monitor': 10.0.1
+      '@cspell/cspell-pipe': 10.0.1
+      '@cspell/cspell-types': 10.0.1
+      '@cspell/cspell-worker': 10.0.1
+      '@cspell/dynamic-import': 10.0.1
+      '@cspell/url': 10.0.1
+      ansi-regex: 6.2.2
+      chalk: 5.6.2
+      chalk-template: 1.1.2
+      commander: 14.0.3
+      cspell-config-lib: 10.0.1
+      cspell-dictionary: 10.0.1
+      cspell-gitignore: 10.0.1
+      cspell-glob: 10.0.1
+      cspell-io: 10.0.1
+      cspell-lib: 10.0.1
       fast-json-stable-stringify: 2.1.0
-      file-entry-cache: 9.1.0
-      get-stdin: 9.0.0
-      semver: 7.6.3
-      tinyglobby: 0.2.10
+      flatted: 3.4.4
+      semver: 7.8.5
+      tinyglobby: 0.2.17
 
-  css-blank-pseudo@7.0.1(postcss@8.4.49):
+  css-declaration-sorter@7.4.0(postcss@8.5.26):
     dependencies:
-      postcss: 8.4.49
-      postcss-selector-parser: 7.0.0
+      postcss: 8.5.26
 
-  css-declaration-sorter@7.2.0(postcss@8.4.49):
-    dependencies:
-      postcss: 8.4.49
-
-  css-functions-list@3.2.3: {}
-
-  css-has-pseudo@7.0.2(postcss@8.4.49):
-    dependencies:
-      '@csstools/selector-specificity': 5.0.0(postcss-selector-parser@7.0.0)
-      postcss: 8.4.49
-      postcss-selector-parser: 7.0.0
-      postcss-value-parser: 4.2.0
+  css-functions-list@3.3.3: {}
 
   css-line-break@2.1.0:
     dependencies:
       utrie: 1.0.2
 
-  css-prefers-color-scheme@10.0.0(postcss@8.4.49):
-    dependencies:
-      postcss: 8.4.49
-
-  css-select@4.3.0:
+  css-select@5.2.2:
     dependencies:
       boolbase: 1.0.0
-      css-what: 6.1.0
-      domhandler: 4.3.1
-      domutils: 2.8.0
-      nth-check: 2.1.1
-
-  css-select@5.1.0:
-    dependencies:
-      boolbase: 1.0.0
-      css-what: 6.1.0
+      css-what: 6.2.2
       domhandler: 5.0.3
-      domutils: 3.1.0
+      domutils: 3.2.2
       nth-check: 2.1.1
 
   css-tree@2.2.1:
@@ -14357,77 +17517,70 @@ snapshots:
       mdn-data: 2.0.28
       source-map-js: 1.2.1
 
-  css-tree@2.3.1:
+  css-tree@3.2.1:
     dependencies:
-      mdn-data: 2.0.30
+      mdn-data: 2.27.1
       source-map-js: 1.2.1
 
-  css-tree@3.1.0:
-    dependencies:
-      mdn-data: 2.12.2
-      source-map-js: 1.2.1
-
-  css-what@6.1.0: {}
-
-  cssdb@8.2.3: {}
+  css-what@6.2.2: {}
 
   cssesc@3.0.0: {}
 
   cssfilter@0.0.10: {}
 
-  cssnano-preset-default@7.0.6(postcss@8.4.49):
+  cssnano-preset-default@7.0.17(postcss@8.5.26):
     dependencies:
-      browserslist: 4.24.3
-      css-declaration-sorter: 7.2.0(postcss@8.4.49)
-      cssnano-utils: 5.0.0(postcss@8.4.49)
-      postcss: 8.4.49
-      postcss-calc: 10.0.2(postcss@8.4.49)
-      postcss-colormin: 7.0.2(postcss@8.4.49)
-      postcss-convert-values: 7.0.4(postcss@8.4.49)
-      postcss-discard-comments: 7.0.3(postcss@8.4.49)
-      postcss-discard-duplicates: 7.0.1(postcss@8.4.49)
-      postcss-discard-empty: 7.0.0(postcss@8.4.49)
-      postcss-discard-overridden: 7.0.0(postcss@8.4.49)
-      postcss-merge-longhand: 7.0.4(postcss@8.4.49)
-      postcss-merge-rules: 7.0.4(postcss@8.4.49)
-      postcss-minify-font-values: 7.0.0(postcss@8.4.49)
-      postcss-minify-gradients: 7.0.0(postcss@8.4.49)
-      postcss-minify-params: 7.0.2(postcss@8.4.49)
-      postcss-minify-selectors: 7.0.4(postcss@8.4.49)
-      postcss-normalize-charset: 7.0.0(postcss@8.4.49)
-      postcss-normalize-display-values: 7.0.0(postcss@8.4.49)
-      postcss-normalize-positions: 7.0.0(postcss@8.4.49)
-      postcss-normalize-repeat-style: 7.0.0(postcss@8.4.49)
-      postcss-normalize-string: 7.0.0(postcss@8.4.49)
-      postcss-normalize-timing-functions: 7.0.0(postcss@8.4.49)
-      postcss-normalize-unicode: 7.0.2(postcss@8.4.49)
-      postcss-normalize-url: 7.0.0(postcss@8.4.49)
-      postcss-normalize-whitespace: 7.0.0(postcss@8.4.49)
-      postcss-ordered-values: 7.0.1(postcss@8.4.49)
-      postcss-reduce-initial: 7.0.2(postcss@8.4.49)
-      postcss-reduce-transforms: 7.0.0(postcss@8.4.49)
-      postcss-svgo: 7.0.1(postcss@8.4.49)
-      postcss-unique-selectors: 7.0.3(postcss@8.4.49)
+      browserslist: 4.28.8
+      css-declaration-sorter: 7.4.0(postcss@8.5.26)
+      cssnano-utils: 5.0.3(postcss@8.5.26)
+      postcss: 8.5.26
+      postcss-calc: 10.1.1(postcss@8.5.26)
+      postcss-colormin: 7.0.10(postcss@8.5.26)
+      postcss-convert-values: 7.0.12(postcss@8.5.26)
+      postcss-discard-comments: 7.0.8(postcss@8.5.26)
+      postcss-discard-duplicates: 7.0.4(postcss@8.5.26)
+      postcss-discard-empty: 7.0.3(postcss@8.5.26)
+      postcss-discard-overridden: 7.0.3(postcss@8.5.26)
+      postcss-merge-longhand: 7.0.7(postcss@8.5.26)
+      postcss-merge-rules: 7.0.11(postcss@8.5.26)
+      postcss-minify-font-values: 7.0.3(postcss@8.5.26)
+      postcss-minify-gradients: 7.0.5(postcss@8.5.26)
+      postcss-minify-params: 7.0.9(postcss@8.5.26)
+      postcss-minify-selectors: 7.1.2(postcss@8.5.26)
+      postcss-normalize-charset: 7.0.3(postcss@8.5.26)
+      postcss-normalize-display-values: 7.0.3(postcss@8.5.26)
+      postcss-normalize-positions: 7.0.4(postcss@8.5.26)
+      postcss-normalize-repeat-style: 7.0.4(postcss@8.5.26)
+      postcss-normalize-string: 7.0.3(postcss@8.5.26)
+      postcss-normalize-timing-functions: 7.0.3(postcss@8.5.26)
+      postcss-normalize-unicode: 7.0.9(postcss@8.5.26)
+      postcss-normalize-url: 7.0.3(postcss@8.5.26)
+      postcss-normalize-whitespace: 7.0.3(postcss@8.5.26)
+      postcss-ordered-values: 7.0.4(postcss@8.5.26)
+      postcss-reduce-initial: 7.0.9(postcss@8.5.26)
+      postcss-reduce-transforms: 7.0.3(postcss@8.5.26)
+      postcss-svgo: 7.1.3(postcss@8.5.26)
+      postcss-unique-selectors: 7.0.7(postcss@8.5.26)
 
-  cssnano-utils@5.0.0(postcss@8.4.49):
+  cssnano-utils@5.0.3(postcss@8.5.26):
     dependencies:
-      postcss: 8.4.49
+      postcss: 8.5.26
 
-  cssnano@7.0.6(postcss@8.4.49):
+  cssnano@7.1.9(postcss@8.5.26):
     dependencies:
-      cssnano-preset-default: 7.0.6(postcss@8.4.49)
+      cssnano-preset-default: 7.0.17(postcss@8.5.26)
       lilconfig: 3.1.3
-      postcss: 8.4.49
+      postcss: 8.5.26
 
   csso@5.0.5:
     dependencies:
       css-tree: 2.2.1
 
-  csstype@3.1.3: {}
+  csstype@3.2.3: {}
 
-  cz-git@1.11.0: {}
+  cz-git@1.13.1: {}
 
-  czg@1.11.0: {}
+  czg@1.13.1: {}
 
   d@1.0.2:
     dependencies:
@@ -14438,75 +17591,70 @@ snapshots:
     dependencies:
       event-emitter: 0.3.5
 
-  dargs@8.1.0: {}
-
   data-view-buffer@1.0.2:
     dependencies:
-      call-bound: 1.0.3
+      call-bound: 1.0.4
       es-errors: 1.3.0
       is-data-view: 1.0.2
 
   data-view-byte-length@1.0.2:
     dependencies:
-      call-bound: 1.0.3
+      call-bound: 1.0.4
       es-errors: 1.3.0
       is-data-view: 1.0.2
 
   data-view-byte-offset@1.0.1:
     dependencies:
-      call-bound: 1.0.3
+      call-bound: 1.0.4
       es-errors: 1.3.0
       is-data-view: 1.0.2
 
   dataloader@1.4.0: {}
 
-  dayjs@1.11.13: {}
+  dayjs@1.11.21: {}
 
-  db0@0.2.1: {}
+  db0@0.3.4: {}
 
-  de-indent@1.0.2: {}
-
-  debug@2.6.9:
+  debug@2.6.9(supports-color@10.2.2):
     dependencies:
       ms: 2.0.0
+    optionalDependencies:
+      supports-color: 10.2.2
+    optional: true
 
-  debug@3.2.7:
-    dependencies:
-      ms: 2.1.3
-
-  debug@4.4.0(supports-color@9.4.0):
+  debug@3.2.7(supports-color@10.2.2):
     dependencies:
       ms: 2.1.3
     optionalDependencies:
-      supports-color: 9.4.0
+      supports-color: 10.2.2
+    optional: true
+
+  debug@4.4.3(supports-color@10.2.2):
+    dependencies:
+      ms: 2.1.3
+    optionalDependencies:
+      supports-color: 10.2.2
 
   decamelize@1.2.0: {}
 
-  deep-eql@5.0.2: {}
-
-  deep-equal@1.1.2:
+  decompress-response@6.0.0:
     dependencies:
-      is-arguments: 1.2.0
-      is-date-object: 1.1.0
-      is-regex: 1.2.1
-      object-is: 1.1.6
-      object-keys: 1.1.1
-      regexp.prototype.flags: 1.5.3
+      mimic-response: 3.1.0
 
   deep-extend@0.6.0: {}
 
   deep-is@0.1.4: {}
 
-  deep-pick-omit@1.2.1: {}
-
   deepmerge@4.3.1: {}
 
-  default-browser-id@5.0.0: {}
+  default-browser-id@5.0.1: {}
 
-  default-browser@5.2.1:
+  default-browser@5.5.0:
     dependencies:
       bundle-name: 4.1.0
-      default-browser-id: 5.0.0
+      default-browser-id: 5.0.1
+
+  defer-to-connect@2.0.1: {}
 
   define-data-property@1.1.4:
     dependencies:
@@ -14514,8 +17662,6 @@ snapshots:
       es-errors: 1.3.0
       gopd: 1.2.0
 
-  define-lazy-prop@2.0.0: {}
-
   define-lazy-prop@3.0.0: {}
 
   define-properties@1.2.1:
@@ -14524,7 +17670,7 @@ snapshots:
       has-property-descriptors: 1.0.2
       object-keys: 1.1.1
 
-  defu@6.1.4: {}
+  defu@6.1.7: {}
 
   delayed-stream@1.0.0: {}
 
@@ -14532,99 +17678,59 @@ snapshots:
 
   denque@2.1.0: {}
 
-  depcheck@1.4.7:
-    dependencies:
-      '@babel/parser': 7.26.3
-      '@babel/traverse': 7.26.4
-      '@vue/compiler-sfc': 3.5.13
-      callsite: 1.0.0
-      camelcase: 6.3.0
-      cosmiconfig: 7.1.0
-      debug: 4.4.0(supports-color@9.4.0)
-      deps-regex: 0.2.0
-      findup-sync: 5.0.0
-      ignore: 5.3.2
-      is-core-module: 2.16.0
-      js-yaml: 3.14.1
-      json5: 2.2.3
-      lodash: 4.17.21
-      minimatch: 7.4.6
-      multimatch: 5.0.0
-      please-upgrade-node: 3.2.0
-      readdirp: 3.6.0
-      require-package-name: 2.0.1
-      resolve: 1.22.10
-      resolve-from: 5.0.0
-      semver: 7.6.3
-      yargs: 16.2.0
-    transitivePeerDependencies:
-      - supports-color
-
   depd@2.0.0: {}
 
-  deps-regex@0.2.0: {}
-
-  destr@2.0.3: {}
-
-  destroy@1.2.0: {}
-
-  detect-file@1.0.0: {}
+  destr@2.0.5: {}
 
   detect-indent@6.1.0: {}
 
-  detect-libc@1.0.3: {}
+  detect-libc@2.1.2: {}
 
-  detect-libc@2.0.3: {}
+  detect-node@2.1.0:
+    optional: true
 
-  didyoumean@1.2.2: {}
+  diff-sequences@29.6.3: {}
 
   dijkstrajs@1.0.3: {}
 
+  dir-compare@4.2.0:
+    dependencies:
+      minimatch: 3.1.5
+      p-limit: 3.1.0
+
   dir-glob@3.0.1:
     dependencies:
       path-type: 4.0.0
 
-  dlv@1.1.3: {}
-
-  doctrine@3.0.0:
+  dmg-builder@26.15.3(electron-builder-squirrel-windows@26.15.3)(supports-color@10.2.2):
     dependencies:
-      esutils: 2.0.3
+      app-builder-lib: 26.15.3(dmg-builder@26.15.3)(electron-builder-squirrel-windows@26.15.3)(supports-color@10.2.2)
+      builder-util: 26.15.3(supports-color@10.2.2)
+      fs-extra: 10.1.0
+      js-yaml: 4.3.1
+    transitivePeerDependencies:
+      - electron-builder-squirrel-windows
+      - supports-color
 
   dom-align@1.12.4: {}
 
   dom-scroll-into-view@2.0.1: {}
 
-  dom-serializer@1.4.1:
-    dependencies:
-      domelementtype: 2.3.0
-      domhandler: 4.3.1
-      entities: 2.2.0
-
   dom-serializer@2.0.0:
     dependencies:
       domelementtype: 2.3.0
       domhandler: 5.0.3
       entities: 4.5.0
 
-  dom-zindex@1.0.6: {}
+  dom-zindex@1.0.7: {}
 
   domelementtype@2.3.0: {}
 
-  domhandler@4.3.1:
-    dependencies:
-      domelementtype: 2.3.0
-
   domhandler@5.0.3:
     dependencies:
       domelementtype: 2.3.0
 
-  domutils@2.8.0:
-    dependencies:
-      dom-serializer: 1.4.1
-      domelementtype: 2.3.0
-      domhandler: 4.3.1
-
-  domutils@3.1.0:
+  domutils@3.2.2:
     dependencies:
       dom-serializer: 2.0.0
       domelementtype: 2.3.0
@@ -14635,25 +17741,31 @@ snapshots:
       no-case: 3.0.4
       tslib: 2.8.1
 
-  dot-prop@5.3.0:
+  dot-prop@10.2.0:
     dependencies:
-      is-obj: 2.0.0
+      type-fest: 5.8.0
 
   dot-prop@9.0.0:
     dependencies:
-      type-fest: 4.30.2
+      type-fest: 4.41.0
 
-  dotenv-expand@8.0.3: {}
+  dotenv-expand@11.0.7:
+    dependencies:
+      dotenv: 16.6.1
 
-  dotenv@16.0.3: {}
+  dotenv@16.6.1: {}
 
-  dotenv@16.4.7: {}
+  dotenv@17.4.2: {}
 
   dotenv@8.6.0: {}
 
+  dts-resolver@3.0.0(oxc-resolver@11.24.2):
+    optionalDependencies:
+      oxc-resolver: 11.24.2
+
   dunder-proto@1.0.1:
     dependencies:
-      call-bind-apply-helpers: 1.0.1
+      call-bind-apply-helpers: 1.0.2
       es-errors: 1.3.0
       gopd: 1.2.0
 
@@ -14665,68 +17777,155 @@ snapshots:
 
   eastasianwidth@0.2.0: {}
 
-  echarts@5.5.1:
+  echarts@6.1.0:
     dependencies:
       tslib: 2.3.0
-      zrender: 5.6.0
+      zrender: 6.1.0
 
-  editorconfig@1.0.4:
+  editorconfig@1.0.7:
     dependencies:
       '@one-ini/wasm': 0.1.1
       commander: 10.0.1
-      minimatch: 9.0.1
-      semver: 7.6.3
+      minimatch: 9.0.9
+      semver: 7.8.5
 
   ee-first@1.1.1: {}
 
   ejs@3.1.10:
     dependencies:
-      jake: 10.9.2
+      jake: 10.9.4
 
-  electron-to-chromium@1.5.75: {}
+  electron-builder-squirrel-windows@26.15.3(dmg-builder@26.15.3)(supports-color@10.2.2):
+    dependencies:
+      app-builder-lib: 26.15.3(dmg-builder@26.15.3)(electron-builder-squirrel-windows@26.15.3)(supports-color@10.2.2)
+      builder-util: 26.15.3(supports-color@10.2.2)
+      electron-winstaller: 5.4.0(supports-color@10.2.2)
+    transitivePeerDependencies:
+      - dmg-builder
+      - supports-color
 
-  emoji-regex@10.4.0: {}
+  electron-builder@26.15.3(electron-builder-squirrel-windows@26.15.3)(supports-color@10.2.2):
+    dependencies:
+      app-builder-lib: 26.15.3(dmg-builder@26.15.3)(electron-builder-squirrel-windows@26.15.3)(supports-color@10.2.2)
+      builder-util: 26.15.3(supports-color@10.2.2)
+      builder-util-runtime: 9.7.0(supports-color@10.2.2)
+      chalk: 4.1.2
+      ci-info: 4.4.0
+      dmg-builder: 26.15.3(electron-builder-squirrel-windows@26.15.3)(supports-color@10.2.2)
+      fs-extra: 10.1.0
+      lazy-val: 1.0.5
+      simple-update-notifier: 2.0.0
+      yargs: 17.7.3
+    transitivePeerDependencies:
+      - electron-builder-squirrel-windows
+      - supports-color
+
+  electron-log@5.4.4: {}
+
+  electron-publish@26.15.3(supports-color@10.2.2):
+    dependencies:
+      '@types/fs-extra': 9.0.13
+      aws4: 1.13.2
+      builder-util: 26.15.3(supports-color@10.2.2)
+      builder-util-runtime: 9.7.0(supports-color@10.2.2)
+      chalk: 4.1.2
+      form-data: 4.0.6
+      fs-extra: 10.1.0
+      lazy-val: 1.0.5
+      mime: 2.6.0
+    transitivePeerDependencies:
+      - supports-color
+
+  electron-to-chromium@1.5.403: {}
+
+  electron-updater@6.8.9(supports-color@10.2.2):
+    dependencies:
+      builder-util-runtime: 9.7.0(supports-color@10.2.2)
+      fs-extra: 10.1.0
+      js-yaml: 4.3.1
+      lazy-val: 1.0.5
+      lodash.escaperegexp: 4.1.2
+      lodash.isequal: 4.5.0
+      semver: 7.7.4
+      tiny-typed-emitter: 2.1.0
+    transitivePeerDependencies:
+      - supports-color
+
+  electron-vite@5.0.0(supports-color@10.2.2)(vite@7.3.6(@types/node@25.9.5)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(lightningcss@1.33.0)(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0)):
+    dependencies:
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/plugin-transform-arrow-functions': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))
+      cac: 6.7.14
+      esbuild: 0.25.12
+      magic-string: 0.30.21
+      picocolors: 1.1.1
+      vite: 7.3.6(@types/node@25.9.5)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(lightningcss@1.33.0)(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0)
+    transitivePeerDependencies:
+      - supports-color
+
+  electron-winstaller@5.4.0(supports-color@10.2.2):
+    dependencies:
+      '@electron/asar': 3.4.1
+      debug: 4.4.3(supports-color@10.2.2)
+      fs-extra: 7.0.1
+      lodash: 4.18.1
+      temp: 0.9.4
+    optionalDependencies:
+      '@electron/windows-sign': 1.2.2(supports-color@10.2.2)
+    transitivePeerDependencies:
+      - supports-color
+
+  electron@43.4.0(supports-color@10.2.2):
+    dependencies:
+      '@electron-internal/extract-zip': 1.0.5
+      '@electron/get': 5.1.0(supports-color@10.2.2)
+      '@types/node': 24.13.3
+    transitivePeerDependencies:
+      - supports-color
+
+  emoji-regex@10.6.0: {}
 
   emoji-regex@8.0.0: {}
 
   emoji-regex@9.2.2: {}
 
-  encodeurl@1.0.2: {}
+  empathic@2.0.1: {}
 
   encodeurl@2.0.0: {}
 
-  encoding-sniffer@0.2.0:
+  encoding-sniffer@0.2.1:
     dependencies:
       iconv-lite: 0.6.3
       whatwg-encoding: 3.1.1
 
-  encoding@0.1.13:
-    dependencies:
-      iconv-lite: 0.6.3
-    optional: true
-
   end-of-stream@1.4.5:
     dependencies:
       once: 1.4.0
 
-  enhanced-resolve@5.18.0:
+  enhanced-resolve@5.24.5:
     dependencies:
       graceful-fs: 4.2.11
-      tapable: 2.2.1
+      tapable: 2.3.3
 
   enquirer@2.4.1:
     dependencies:
       ansi-colors: 4.1.3
       strip-ansi: 6.0.1
 
-  entities@2.2.0: {}
-
   entities@4.5.0: {}
 
+  entities@6.0.1: {}
+
+  entities@7.0.1: {}
+
   env-paths@2.2.1: {}
 
   env-paths@3.0.0: {}
 
+  env-paths@4.0.0:
+    dependencies:
+      is-safe-filename: 0.1.1
+
   environment@1.1.0: {}
 
   err-code@2.0.3: {}
@@ -14736,85 +17935,109 @@ snapshots:
       prr: 1.0.1
     optional: true
 
-  error-ex@1.3.2:
+  error-ex@1.3.4:
     dependencies:
       is-arrayish: 0.2.1
 
-  error-stack-parser-es@0.1.5: {}
+  error-stack-parser-es@1.0.5: {}
 
-  es-abstract@1.23.6:
+  errx@0.1.2:
+    optional: true
+
+  es-abstract-get@1.0.0:
+    dependencies:
+      es-errors: 1.3.0
+      es-object-atoms: 1.1.2
+      is-callable: 1.2.7
+      object-inspect: 1.13.4
+
+  es-abstract@1.24.2:
     dependencies:
       array-buffer-byte-length: 1.0.2
       arraybuffer.prototype.slice: 1.0.4
       available-typed-arrays: 1.0.7
-      call-bind: 1.0.8
-      call-bound: 1.0.3
+      call-bind: 1.0.9
+      call-bound: 1.0.4
       data-view-buffer: 1.0.2
       data-view-byte-length: 1.0.2
       data-view-byte-offset: 1.0.1
       es-define-property: 1.0.1
       es-errors: 1.3.0
-      es-object-atoms: 1.0.0
-      es-set-tostringtag: 2.0.3
-      es-to-primitive: 1.3.0
-      function.prototype.name: 1.1.8
-      get-intrinsic: 1.2.6
+      es-object-atoms: 1.1.2
+      es-set-tostringtag: 2.1.0
+      es-to-primitive: 1.3.4
+      function.prototype.name: 1.2.0
+      get-intrinsic: 1.3.0
+      get-proto: 1.0.1
       get-symbol-description: 1.1.0
       globalthis: 1.0.4
       gopd: 1.2.0
       has-property-descriptors: 1.0.2
       has-proto: 1.2.0
       has-symbols: 1.1.0
-      hasown: 2.0.2
+      hasown: 2.0.4
       internal-slot: 1.1.0
       is-array-buffer: 3.0.5
       is-callable: 1.2.7
       is-data-view: 1.0.2
       is-negative-zero: 2.0.3
       is-regex: 1.2.1
+      is-set: 2.0.3
       is-shared-array-buffer: 1.0.4
       is-string: 1.1.1
       is-typed-array: 1.1.15
-      is-weakref: 1.1.0
+      is-weakref: 1.1.1
       math-intrinsics: 1.1.0
-      object-inspect: 1.13.3
+      object-inspect: 1.13.4
       object-keys: 1.1.1
       object.assign: 4.1.7
-      regexp.prototype.flags: 1.5.3
-      safe-array-concat: 1.1.3
+      own-keys: 1.0.2
+      regexp.prototype.flags: 1.5.4
+      safe-array-concat: 1.1.4
+      safe-push-apply: 1.0.0
       safe-regex-test: 1.1.0
-      string.prototype.trim: 1.2.10
-      string.prototype.trimend: 1.0.9
+      set-proto: 1.0.0
+      stop-iteration-iterator: 1.1.0
+      string.prototype.trim: 1.2.11
+      string.prototype.trimend: 1.0.10
       string.prototype.trimstart: 1.0.8
       typed-array-buffer: 1.0.3
       typed-array-byte-length: 1.0.3
       typed-array-byte-offset: 1.0.4
-      typed-array-length: 1.0.7
+      typed-array-length: 1.0.8
       unbox-primitive: 1.1.0
-      which-typed-array: 1.1.18
+      which-typed-array: 1.1.22
 
   es-define-property@1.0.1: {}
 
   es-errors@1.3.0: {}
 
-  es-module-lexer@1.5.4: {}
+  es-module-lexer@1.7.0: {}
 
-  es-object-atoms@1.0.0:
+  es-module-lexer@2.3.1: {}
+
+  es-object-atoms@1.1.2:
     dependencies:
       es-errors: 1.3.0
 
-  es-set-tostringtag@2.0.3:
+  es-set-tostringtag@2.1.0:
     dependencies:
-      get-intrinsic: 1.2.6
+      es-errors: 1.3.0
+      get-intrinsic: 1.3.0
       has-tostringtag: 1.0.2
-      hasown: 2.0.2
+      hasown: 2.0.4
 
-  es-to-primitive@1.3.0:
+  es-to-primitive@1.3.4:
     dependencies:
+      es-abstract-get: 1.0.0
+      es-define-property: 1.0.1
+      es-errors: 1.3.0
       is-callable: 1.2.7
       is-date-object: 1.1.0
       is-symbol: 1.1.1
 
+  es-toolkit@1.50.0: {}
+
   es5-ext@0.10.64:
     dependencies:
       es6-iterator: 2.0.3
@@ -14822,6 +18045,9 @@ snapshots:
       esniff: 2.0.1
       next-tick: 1.1.0
 
+  es6-error@4.1.1:
+    optional: true
+
   es6-iterator@2.0.3:
     dependencies:
       d: 1.0.2
@@ -14833,32 +18059,63 @@ snapshots:
       d: 1.0.2
       ext: 1.7.0
 
-  esbuild@0.24.0:
+  esbuild@0.25.12:
     optionalDependencies:
-      '@esbuild/aix-ppc64': 0.24.0
-      '@esbuild/android-arm': 0.24.0
-      '@esbuild/android-arm64': 0.24.0
-      '@esbuild/android-x64': 0.24.0
-      '@esbuild/darwin-arm64': 0.24.0
-      '@esbuild/darwin-x64': 0.24.0
-      '@esbuild/freebsd-arm64': 0.24.0
-      '@esbuild/freebsd-x64': 0.24.0
-      '@esbuild/linux-arm': 0.24.0
-      '@esbuild/linux-arm64': 0.24.0
-      '@esbuild/linux-ia32': 0.24.0
-      '@esbuild/linux-loong64': 0.24.0
-      '@esbuild/linux-mips64el': 0.24.0
-      '@esbuild/linux-ppc64': 0.24.0
-      '@esbuild/linux-riscv64': 0.24.0
-      '@esbuild/linux-s390x': 0.24.0
-      '@esbuild/linux-x64': 0.24.0
-      '@esbuild/netbsd-x64': 0.24.0
-      '@esbuild/openbsd-arm64': 0.24.0
-      '@esbuild/openbsd-x64': 0.24.0
-      '@esbuild/sunos-x64': 0.24.0
-      '@esbuild/win32-arm64': 0.24.0
-      '@esbuild/win32-ia32': 0.24.0
-      '@esbuild/win32-x64': 0.24.0
+      '@esbuild/aix-ppc64': 0.25.12
+      '@esbuild/android-arm': 0.25.12
+      '@esbuild/android-arm64': 0.25.12
+      '@esbuild/android-x64': 0.25.12
+      '@esbuild/darwin-arm64': 0.25.12
+      '@esbuild/darwin-x64': 0.25.12
+      '@esbuild/freebsd-arm64': 0.25.12
+      '@esbuild/freebsd-x64': 0.25.12
+      '@esbuild/linux-arm': 0.25.12
+      '@esbuild/linux-arm64': 0.25.12
+      '@esbuild/linux-ia32': 0.25.12
+      '@esbuild/linux-loong64': 0.25.12
+      '@esbuild/linux-mips64el': 0.25.12
+      '@esbuild/linux-ppc64': 0.25.12
+      '@esbuild/linux-riscv64': 0.25.12
+      '@esbuild/linux-s390x': 0.25.12
+      '@esbuild/linux-x64': 0.25.12
+      '@esbuild/netbsd-arm64': 0.25.12
+      '@esbuild/netbsd-x64': 0.25.12
+      '@esbuild/openbsd-arm64': 0.25.12
+      '@esbuild/openbsd-x64': 0.25.12
+      '@esbuild/openharmony-arm64': 0.25.12
+      '@esbuild/sunos-x64': 0.25.12
+      '@esbuild/win32-arm64': 0.25.12
+      '@esbuild/win32-ia32': 0.25.12
+      '@esbuild/win32-x64': 0.25.12
+
+  esbuild@0.28.2:
+    optionalDependencies:
+      '@esbuild/aix-ppc64': 0.28.2
+      '@esbuild/android-arm': 0.28.2
+      '@esbuild/android-arm64': 0.28.2
+      '@esbuild/android-x64': 0.28.2
+      '@esbuild/darwin-arm64': 0.28.2
+      '@esbuild/darwin-x64': 0.28.2
+      '@esbuild/freebsd-arm64': 0.28.2
+      '@esbuild/freebsd-x64': 0.28.2
+      '@esbuild/linux-arm': 0.28.2
+      '@esbuild/linux-arm64': 0.28.2
+      '@esbuild/linux-ia32': 0.28.2
+      '@esbuild/linux-loong64': 0.28.2
+      '@esbuild/linux-mips64el': 0.28.2
+      '@esbuild/linux-ppc64': 0.28.2
+      '@esbuild/linux-riscv64': 0.28.2
+      '@esbuild/linux-s390x': 0.28.2
+      '@esbuild/linux-x64': 0.28.2
+      '@esbuild/netbsd-arm64': 0.28.2
+      '@esbuild/netbsd-x64': 0.28.2
+      '@esbuild/openbsd-arm64': 0.28.2
+      '@esbuild/openbsd-x64': 0.28.2
+      '@esbuild/openharmony-arm64': 0.28.2
+      '@esbuild/sunos-x64': 0.28.2
+      '@esbuild/win32-arm64': 0.28.2
+      '@esbuild/win32-ia32': 0.28.2
+      '@esbuild/win32-x64': 0.28.2
 
   escalade@3.2.0: {}
 
@@ -14866,8 +18123,6 @@ snapshots:
 
   escape-html@1.0.3: {}
 
-  escape-string-regexp@1.0.5: {}
-
   escape-string-regexp@4.0.0: {}
 
   escape-string-regexp@5.0.0: {}
@@ -14880,244 +18135,157 @@ snapshots:
     optionalDependencies:
       source-map: 0.6.1
 
-  eslint-compat-utils@0.5.1(eslint@9.17.0(jiti@2.4.2)):
+  eslint-compat-utils@0.5.1(eslint@10.8.1(jiti@2.7.0)(supports-color@10.2.2)):
     dependencies:
-      eslint: 9.17.0(jiti@2.4.2)
-      semver: 7.6.3
+      eslint: 10.8.1(jiti@2.7.0)(supports-color@10.2.2)
+      semver: 7.8.5
 
-  eslint-compat-utils@0.6.4(eslint@9.17.0(jiti@2.4.2)):
+  eslint-json-compat-utils@0.2.3(eslint@10.8.1(jiti@2.7.0)(supports-color@10.2.2))(jsonc-eslint-parser@3.3.0):
     dependencies:
-      eslint: 9.17.0(jiti@2.4.2)
-      semver: 7.6.3
+      eslint: 10.8.1(jiti@2.7.0)(supports-color@10.2.2)
+      esquery: 1.7.0
+      jsonc-eslint-parser: 3.3.0
 
-  eslint-config-turbo@2.3.3(eslint@9.17.0(jiti@2.4.2)):
+  eslint-plugin-better-tailwindcss@4.7.0(eslint@10.8.1(jiti@2.7.0)(supports-color@10.2.2))(oxlint@1.77.0(oxlint-tsgolint@0.25.0))(tailwindcss@4.3.3)(typescript@6.0.3):
     dependencies:
-      eslint: 9.17.0(jiti@2.4.2)
-      eslint-plugin-turbo: 2.3.3(eslint@9.17.0(jiti@2.4.2))
-
-  eslint-import-resolver-node@0.3.9:
-    dependencies:
-      debug: 3.2.7
-      is-core-module: 2.16.0
-      resolve: 1.22.10
+      '@eslint/css-tree': 4.0.5
+      '@valibot/to-json-schema': 1.7.1(valibot@1.4.2(typescript@6.0.3))
+      enhanced-resolve: 5.24.5
+      jiti: 2.7.0
+      synckit: 0.11.13
+      tailwind-csstree: 0.3.3
+      tailwindcss: 4.3.3
+      tsconfig-paths-webpack-plugin: 4.2.0
+      valibot: 1.4.2(typescript@6.0.3)
+    optionalDependencies:
+      eslint: 10.8.1(jiti@2.7.0)(supports-color@10.2.2)
+      oxlint: 1.77.0(oxlint-tsgolint@0.25.0)
     transitivePeerDependencies:
-      - supports-color
-
-  eslint-json-compat-utils@0.2.1(eslint@9.17.0(jiti@2.4.2))(jsonc-eslint-parser@2.4.0):
-    dependencies:
-      eslint: 9.17.0(jiti@2.4.2)
-      esquery: 1.6.0
-      jsonc-eslint-parser: 2.4.0
-
-  eslint-plugin-command@0.2.7(eslint@9.17.0(jiti@2.4.2)):
-    dependencies:
-      '@es-joy/jsdoccomment': 0.49.0
-      eslint: 9.17.0(jiti@2.4.2)
-
-  eslint-plugin-es-x@7.8.0(eslint@9.17.0(jiti@2.4.2)):
-    dependencies:
-      '@eslint-community/eslint-utils': 4.4.1(eslint@9.17.0(jiti@2.4.2))
-      '@eslint-community/regexpp': 4.12.1
-      eslint: 9.17.0(jiti@2.4.2)
-      eslint-compat-utils: 0.5.1(eslint@9.17.0(jiti@2.4.2))
-
-  eslint-plugin-eslint-comments@3.2.0(eslint@9.17.0(jiti@2.4.2)):
-    dependencies:
-      escape-string-regexp: 1.0.5
-      eslint: 9.17.0(jiti@2.4.2)
-      ignore: 5.3.2
-
-  eslint-plugin-import-x@4.6.1(eslint@9.17.0(jiti@2.4.2))(typescript@5.7.2):
-    dependencies:
-      '@types/doctrine': 0.0.9
-      '@typescript-eslint/scope-manager': 8.18.1
-      '@typescript-eslint/utils': 8.18.1(eslint@9.17.0(jiti@2.4.2))(typescript@5.7.2)
-      debug: 4.4.0(supports-color@9.4.0)
-      doctrine: 3.0.0
-      enhanced-resolve: 5.18.0
-      eslint: 9.17.0(jiti@2.4.2)
-      eslint-import-resolver-node: 0.3.9
-      get-tsconfig: 4.8.1
-      is-glob: 4.0.3
-      minimatch: 9.0.5
-      semver: 7.6.3
-      stable-hash: 0.0.4
-      tslib: 2.8.1
-    transitivePeerDependencies:
-      - supports-color
+      - '@eslint/css'
       - typescript
 
-  eslint-plugin-jsdoc@50.6.1(eslint@9.17.0(jiti@2.4.2)):
+  eslint-plugin-command@3.5.3(@typescript-eslint/typescript-estree@8.66.0(supports-color@10.2.2)(typescript@6.0.3))(@typescript-eslint/utils@8.66.0(eslint@10.8.1(jiti@2.7.0)(supports-color@10.2.2))(supports-color@10.2.2)(typescript@6.0.3))(eslint@10.8.1(jiti@2.7.0)(supports-color@10.2.2)):
     dependencies:
-      '@es-joy/jsdoccomment': 0.49.0
-      are-docs-informative: 0.0.2
-      comment-parser: 1.4.1
-      debug: 4.4.0(supports-color@9.4.0)
-      escape-string-regexp: 4.0.0
-      eslint: 9.17.0(jiti@2.4.2)
-      espree: 10.3.0
-      esquery: 1.6.0
-      parse-imports: 2.2.1
-      semver: 7.6.3
-      spdx-expression-parse: 4.0.0
-      synckit: 0.9.2
-    transitivePeerDependencies:
-      - supports-color
+      '@es-joy/jsdoccomment': 0.88.0
+      '@typescript-eslint/typescript-estree': 8.66.0(supports-color@10.2.2)(typescript@6.0.3)
+      '@typescript-eslint/utils': 8.66.0(eslint@10.8.1(jiti@2.7.0)(supports-color@10.2.2))(supports-color@10.2.2)(typescript@6.0.3)
+      eslint: 10.8.1(jiti@2.7.0)(supports-color@10.2.2)
 
-  eslint-plugin-jsonc@2.18.2(eslint@9.17.0(jiti@2.4.2)):
+  eslint-plugin-es-x@7.8.0(eslint@10.8.1(jiti@2.7.0)(supports-color@10.2.2)):
     dependencies:
-      '@eslint-community/eslint-utils': 4.4.1(eslint@9.17.0(jiti@2.4.2))
-      eslint: 9.17.0(jiti@2.4.2)
-      eslint-compat-utils: 0.6.4(eslint@9.17.0(jiti@2.4.2))
-      eslint-json-compat-utils: 0.2.1(eslint@9.17.0(jiti@2.4.2))(jsonc-eslint-parser@2.4.0)
-      espree: 9.6.1
-      graphemer: 1.4.0
-      jsonc-eslint-parser: 2.4.0
+      '@eslint-community/eslint-utils': 4.10.1(eslint@10.8.1(jiti@2.7.0)(supports-color@10.2.2))
+      '@eslint-community/regexpp': 4.12.2
+      eslint: 10.8.1(jiti@2.7.0)(supports-color@10.2.2)
+      eslint-compat-utils: 0.5.1(eslint@10.8.1(jiti@2.7.0)(supports-color@10.2.2))
+
+  eslint-plugin-jsonc@3.4.1(eslint@10.8.1(jiti@2.7.0)(supports-color@10.2.2)):
+    dependencies:
+      '@eslint-community/eslint-utils': 4.10.1(eslint@10.8.1(jiti@2.7.0)(supports-color@10.2.2))
+      '@eslint/core': 1.2.1
+      '@eslint/plugin-kit': 0.7.2
+      '@ota-meshi/ast-token-store': 0.3.0
+      diff-sequences: 29.6.3
+      eslint: 10.8.1(jiti@2.7.0)(supports-color@10.2.2)
+      eslint-json-compat-utils: 0.2.3(eslint@10.8.1(jiti@2.7.0)(supports-color@10.2.2))(jsonc-eslint-parser@3.3.0)
+      jsonc-eslint-parser: 3.3.0
       natural-compare: 1.4.0
-      synckit: 0.6.2
+      synckit: 0.11.13
     transitivePeerDependencies:
       - '@eslint/json'
 
-  eslint-plugin-n@17.15.1(eslint@9.17.0(jiti@2.4.2)):
+  eslint-plugin-n@18.3.0(eslint@10.8.1(jiti@2.7.0)(supports-color@10.2.2))(typescript@6.0.3):
     dependencies:
-      '@eslint-community/eslint-utils': 4.4.1(eslint@9.17.0(jiti@2.4.2))
-      enhanced-resolve: 5.18.0
-      eslint: 9.17.0(jiti@2.4.2)
-      eslint-plugin-es-x: 7.8.0(eslint@9.17.0(jiti@2.4.2))
-      get-tsconfig: 4.8.1
-      globals: 15.14.0
+      '@eslint-community/eslint-utils': 4.10.1(eslint@10.8.1(jiti@2.7.0)(supports-color@10.2.2))
+      enhanced-resolve: 5.24.5
+      eslint: 10.8.1(jiti@2.7.0)(supports-color@10.2.2)
+      eslint-plugin-es-x: 7.8.0(eslint@10.8.1(jiti@2.7.0)(supports-color@10.2.2))
+      get-tsconfig: 4.14.1
+      globals: 15.15.0
+      globrex: 0.1.2
       ignore: 5.3.2
-      minimatch: 9.0.5
-      semver: 7.6.3
-
-  eslint-plugin-no-only-tests@3.3.0: {}
-
-  eslint-plugin-perfectionist@3.9.1(eslint@9.17.0(jiti@2.4.2))(typescript@5.7.2)(vue-eslint-parser@9.4.3(eslint@9.17.0(jiti@2.4.2))):
-    dependencies:
-      '@typescript-eslint/types': 8.18.1
-      '@typescript-eslint/utils': 8.18.1(eslint@9.17.0(jiti@2.4.2))(typescript@5.7.2)
-      eslint: 9.17.0(jiti@2.4.2)
-      minimatch: 9.0.5
-      natural-compare-lite: 1.4.0
+      semver: 7.8.5
     optionalDependencies:
-      vue-eslint-parser: 9.4.3(eslint@9.17.0(jiti@2.4.2))
+      typescript: 6.0.3
+
+  eslint-plugin-perfectionist@5.10.1(eslint@10.8.1(jiti@2.7.0)(supports-color@10.2.2))(supports-color@10.2.2)(typescript@6.0.3):
+    dependencies:
+      '@typescript-eslint/utils': 8.66.0(eslint@10.8.1(jiti@2.7.0)(supports-color@10.2.2))(supports-color@10.2.2)(typescript@6.0.3)
+      eslint: 10.8.1(jiti@2.7.0)(supports-color@10.2.2)
+      natural-orderby: 5.0.0
     transitivePeerDependencies:
       - supports-color
       - typescript
 
-  eslint-plugin-prettier@5.2.1(@types/eslint@9.6.1)(eslint@9.17.0(jiti@2.4.2))(prettier@3.4.2):
+  eslint-plugin-pnpm@1.7.0(eslint@10.8.1(jiti@2.7.0)(supports-color@10.2.2)):
     dependencies:
-      eslint: 9.17.0(jiti@2.4.2)
-      prettier: 3.4.2
-      prettier-linter-helpers: 1.0.0
-      synckit: 0.9.2
-    optionalDependencies:
-      '@types/eslint': 9.6.1
+      empathic: 2.0.1
+      eslint: 10.8.1(jiti@2.7.0)(supports-color@10.2.2)
+      jsonc-eslint-parser: 3.3.0
+      pathe: 2.0.3
+      pnpm-workspace-yaml: 1.7.0
+      tinyglobby: 0.2.17
+      yaml: 2.9.0
+      yaml-eslint-parser: 2.1.0
 
-  eslint-plugin-regexp@2.7.0(eslint@9.17.0(jiti@2.4.2)):
+  eslint-plugin-unused-imports@4.4.1(eslint@10.8.1(jiti@2.7.0)(supports-color@10.2.2)):
     dependencies:
-      '@eslint-community/eslint-utils': 4.4.1(eslint@9.17.0(jiti@2.4.2))
-      '@eslint-community/regexpp': 4.12.1
-      comment-parser: 1.4.1
-      eslint: 9.17.0(jiti@2.4.2)
-      jsdoc-type-pratt-parser: 4.1.0
-      refa: 0.12.1
-      regexp-ast-analysis: 0.7.1
-      scslre: 0.3.0
+      eslint: 10.8.1(jiti@2.7.0)(supports-color@10.2.2)
 
-  eslint-plugin-turbo@2.3.3(eslint@9.17.0(jiti@2.4.2)):
+  eslint-plugin-vue@10.10.0(@typescript-eslint/parser@8.66.0(eslint@10.8.1(jiti@2.7.0)(supports-color@10.2.2))(supports-color@10.2.2)(typescript@6.0.3))(eslint@10.8.1(jiti@2.7.0)(supports-color@10.2.2))(vue-eslint-parser@10.4.1(eslint@10.8.1(jiti@2.7.0)(supports-color@10.2.2))(supports-color@10.2.2)):
     dependencies:
-      dotenv: 16.0.3
-      eslint: 9.17.0(jiti@2.4.2)
-
-  eslint-plugin-unicorn@56.0.1(eslint@9.17.0(jiti@2.4.2)):
-    dependencies:
-      '@babel/helper-validator-identifier': 7.25.9
-      '@eslint-community/eslint-utils': 4.4.1(eslint@9.17.0(jiti@2.4.2))
-      ci-info: 4.1.0
-      clean-regexp: 1.0.0
-      core-js-compat: 3.39.0
-      eslint: 9.17.0(jiti@2.4.2)
-      esquery: 1.6.0
-      globals: 15.14.0
-      indent-string: 4.0.0
-      is-builtin-module: 3.2.1
-      jsesc: 3.1.0
-      pluralize: 8.0.0
-      read-pkg-up: 7.0.1
-      regexp-tree: 0.1.27
-      regjsparser: 0.10.0
-      semver: 7.6.3
-      strip-indent: 3.0.0
-
-  eslint-plugin-unused-imports@4.1.4(@typescript-eslint/eslint-plugin@8.18.1(@typescript-eslint/parser@8.18.1(eslint@9.17.0(jiti@2.4.2))(typescript@5.7.2))(eslint@9.17.0(jiti@2.4.2))(typescript@5.7.2))(eslint@9.17.0(jiti@2.4.2)):
-    dependencies:
-      eslint: 9.17.0(jiti@2.4.2)
-    optionalDependencies:
-      '@typescript-eslint/eslint-plugin': 8.18.1(@typescript-eslint/parser@8.18.1(eslint@9.17.0(jiti@2.4.2))(typescript@5.7.2))(eslint@9.17.0(jiti@2.4.2))(typescript@5.7.2)
-
-  eslint-plugin-vitest@0.5.4(@typescript-eslint/eslint-plugin@8.18.1(@typescript-eslint/parser@8.18.1(eslint@9.17.0(jiti@2.4.2))(typescript@5.7.2))(eslint@9.17.0(jiti@2.4.2))(typescript@5.7.2))(eslint@9.17.0(jiti@2.4.2))(typescript@5.7.2)(vitest@2.1.8(@types/node@22.10.2)(happy-dom@15.11.7)(less@4.2.1)(sass@1.80.6)(terser@5.37.0)):
-    dependencies:
-      '@typescript-eslint/utils': 7.18.0(eslint@9.17.0(jiti@2.4.2))(typescript@5.7.2)
-      eslint: 9.17.0(jiti@2.4.2)
-    optionalDependencies:
-      '@typescript-eslint/eslint-plugin': 8.18.1(@typescript-eslint/parser@8.18.1(eslint@9.17.0(jiti@2.4.2))(typescript@5.7.2))(eslint@9.17.0(jiti@2.4.2))(typescript@5.7.2)
-      vitest: 2.1.8(@types/node@22.10.2)(happy-dom@15.11.7)(less@4.2.1)(sass@1.80.6)(terser@5.37.0)
-    transitivePeerDependencies:
-      - supports-color
-      - typescript
-
-  eslint-plugin-vue@9.32.0(eslint@9.17.0(jiti@2.4.2)):
-    dependencies:
-      '@eslint-community/eslint-utils': 4.4.1(eslint@9.17.0(jiti@2.4.2))
-      eslint: 9.17.0(jiti@2.4.2)
-      globals: 13.24.0
+      '@eslint-community/eslint-utils': 4.10.1(eslint@10.8.1(jiti@2.7.0)(supports-color@10.2.2))
+      eslint: 10.8.1(jiti@2.7.0)(supports-color@10.2.2)
       natural-compare: 1.4.0
       nth-check: 2.1.1
-      postcss-selector-parser: 6.1.2
-      semver: 7.6.3
-      vue-eslint-parser: 9.4.3(eslint@9.17.0(jiti@2.4.2))
-      xml-name-validator: 4.0.0
-    transitivePeerDependencies:
-      - supports-color
+      postcss-selector-parser: 7.1.5
+      semver: 7.8.5
+      vue-eslint-parser: 10.4.1(eslint@10.8.1(jiti@2.7.0)(supports-color@10.2.2))(supports-color@10.2.2)
+      xml-name-validator: 5.0.0
+    optionalDependencies:
+      '@typescript-eslint/parser': 8.66.0(eslint@10.8.1(jiti@2.7.0)(supports-color@10.2.2))(supports-color@10.2.2)(typescript@6.0.3)
 
-  eslint-scope@7.2.2:
+  eslint-plugin-yml@3.8.1(eslint@10.8.1(jiti@2.7.0)(supports-color@10.2.2)):
     dependencies:
-      esrecurse: 4.3.0
-      estraverse: 5.3.0
+      '@eslint/core': 1.2.1
+      '@eslint/plugin-kit': 0.7.2
+      '@ota-meshi/ast-token-store': 0.3.0
+      diff-sequences: 29.6.3
+      escape-string-regexp: 5.0.0
+      eslint: 10.8.1(jiti@2.7.0)(supports-color@10.2.2)
+      natural-compare: 1.4.0
+      yaml-eslint-parser: 2.1.0
 
-  eslint-scope@8.2.0:
+  eslint-scope@9.1.2:
     dependencies:
+      '@types/esrecurse': 4.3.1
+      '@types/estree': 1.0.9
       esrecurse: 4.3.0
       estraverse: 5.3.0
 
   eslint-visitor-keys@3.4.3: {}
 
-  eslint-visitor-keys@4.2.0: {}
+  eslint-visitor-keys@5.0.1: {}
 
-  eslint@9.17.0(jiti@2.4.2):
+  eslint@10.8.1(jiti@2.7.0)(supports-color@10.2.2):
     dependencies:
-      '@eslint-community/eslint-utils': 4.4.1(eslint@9.17.0(jiti@2.4.2))
-      '@eslint-community/regexpp': 4.12.1
-      '@eslint/config-array': 0.19.1
-      '@eslint/core': 0.9.1
-      '@eslint/eslintrc': 3.2.0
-      '@eslint/js': 9.17.0
-      '@eslint/plugin-kit': 0.2.4
-      '@humanfs/node': 0.16.6
+      '@eslint-community/eslint-utils': 4.10.1(eslint@10.8.1(jiti@2.7.0)(supports-color@10.2.2))
+      '@eslint-community/regexpp': 4.12.2
+      '@eslint/config-array': 0.23.5(supports-color@10.2.2)
+      '@eslint/config-helpers': 0.7.0
+      '@eslint/core': 1.2.1
+      '@eslint/plugin-kit': 0.7.2
+      '@humanfs/node': 0.16.8
       '@humanwhocodes/module-importer': 1.0.1
-      '@humanwhocodes/retry': 0.4.1
-      '@types/estree': 1.0.6
-      '@types/json-schema': 7.0.15
-      ajv: 6.12.6
-      chalk: 4.1.2
+      '@humanwhocodes/retry': 0.4.3
+      '@types/estree': 1.0.9
+      ajv: 6.15.0
       cross-spawn: 7.0.6
-      debug: 4.4.0(supports-color@9.4.0)
+      debug: 4.4.3(supports-color@10.2.2)
       escape-string-regexp: 4.0.0
-      eslint-scope: 8.2.0
-      eslint-visitor-keys: 4.2.0
-      espree: 10.3.0
-      esquery: 1.6.0
+      eslint-scope: 9.1.2
+      eslint-visitor-keys: 5.0.1
+      espree: 11.2.0
+      esquery: 1.7.0
       esutils: 2.0.3
       fast-deep-equal: 3.1.3
       file-entry-cache: 8.0.0
@@ -15127,12 +18295,11 @@ snapshots:
       imurmurhash: 0.1.4
       is-glob: 4.0.3
       json-stable-stringify-without-jsonify: 1.0.1
-      lodash.merge: 4.6.2
-      minimatch: 3.1.2
+      minimatch: 10.2.6
       natural-compare: 1.4.0
       optionator: 0.9.4
     optionalDependencies:
-      jiti: 2.4.2
+      jiti: 2.7.0
     transitivePeerDependencies:
       - supports-color
 
@@ -15143,21 +18310,21 @@ snapshots:
       event-emitter: 0.3.5
       type: 2.7.3
 
-  espree@10.3.0:
+  espree@11.2.0:
     dependencies:
-      acorn: 8.14.0
-      acorn-jsx: 5.3.2(acorn@8.14.0)
-      eslint-visitor-keys: 4.2.0
+      acorn: 8.18.0
+      acorn-jsx: 5.3.2(acorn@8.18.0)
+      eslint-visitor-keys: 5.0.1
 
   espree@9.6.1:
     dependencies:
-      acorn: 8.14.0
-      acorn-jsx: 5.3.2(acorn@8.14.0)
+      acorn: 8.18.0
+      acorn-jsx: 5.3.2(acorn@8.18.0)
       eslint-visitor-keys: 3.4.3
 
   esprima@4.0.1: {}
 
-  esquery@1.6.0:
+  esquery@1.7.0:
     dependencies:
       estraverse: 5.3.0
 
@@ -15167,16 +18334,16 @@ snapshots:
 
   estraverse@5.3.0: {}
 
-  estree-walker@1.0.1: {}
-
   estree-walker@2.0.2: {}
 
   estree-walker@3.0.3:
     dependencies:
-      '@types/estree': 1.0.6
+      '@types/estree': 1.0.9
 
   esutils@2.0.3: {}
 
+  eta@4.6.0: {}
+
   etag@1.8.1: {}
 
   event-emitter@0.3.5:
@@ -15186,18 +18353,22 @@ snapshots:
 
   event-target-shim@5.0.1: {}
 
-  eventemitter3@2.0.3: {}
-
   eventemitter3@4.0.7: {}
 
-  eventemitter3@5.0.1: {}
+  eventemitter3@5.0.4: {}
+
+  events-universal@1.0.1:
+    dependencies:
+      bare-events: 2.9.1
+    transitivePeerDependencies:
+      - bare-abort-controller
 
   events@3.3.0: {}
 
   exceljs@4.4.0:
     dependencies:
       archiver: 5.3.2
-      dayjs: 1.11.13
+      dayjs: 1.11.21
       fast-csv: 4.3.6
       jszip: 3.10.1
       readable-stream: 3.6.2
@@ -15206,53 +18377,33 @@ snapshots:
       unzipper: 0.10.14
       uuid: 8.3.2
 
-  execa@8.0.1:
-    dependencies:
-      cross-spawn: 7.0.6
-      get-stream: 8.0.1
-      human-signals: 5.0.0
-      is-stream: 3.0.0
-      merge-stream: 2.0.0
-      npm-run-path: 5.3.0
-      onetime: 6.0.0
-      signal-exit: 4.1.0
-      strip-final-newline: 3.0.0
-
-  execa@9.5.2:
+  execa@10.0.1:
     dependencies:
       '@sindresorhus/merge-streams': 4.0.0
-      cross-spawn: 7.0.6
       figures: 6.1.0
       get-stream: 9.0.1
-      human-signals: 8.0.0
+      human-signals: 8.0.1
       is-plain-obj: 4.1.0
       is-stream: 4.0.1
       npm-run-path: 6.0.0
-      pretty-ms: 9.2.0
+      pretty-ms: 9.3.0
       signal-exit: 4.1.0
       strip-final-newline: 4.0.0
-      yoctocolors: 2.1.1
+      which-command: 0.1.0
+      yoctocolors: 2.2.0
 
-  expand-tilde@2.0.2:
-    dependencies:
-      homedir-polyfill: 1.0.3
+  expect-type@1.4.0: {}
 
-  expect-type@1.1.0: {}
+  exponential-backoff@3.1.3: {}
+
+  exsolve@1.1.1: {}
 
   ext@1.7.0:
     dependencies:
       type: 2.7.3
 
-  extend@3.0.2: {}
-
   extendable-error@0.1.7: {}
 
-  external-editor@3.1.0:
-    dependencies:
-      chardet: 0.7.0
-      iconv-lite: 0.4.24
-      tmp: 0.0.33
-
   fast-csv@4.3.6:
     dependencies:
       '@fast-csv/format': 4.3.5
@@ -15260,17 +18411,13 @@ snapshots:
 
   fast-deep-equal@3.1.3: {}
 
-  fast-diff@1.1.2: {}
-
-  fast-diff@1.2.0: {}
-
   fast-diff@1.3.0: {}
 
-  fast-equals@5.0.1: {}
+  fast-equals@6.0.2: {}
 
   fast-fifo@1.3.2: {}
 
-  fast-glob@3.3.2:
+  fast-glob@3.3.3:
     dependencies:
       '@nodelib/fs.stat': 2.0.5
       '@nodelib/fs.walk': 1.2.8
@@ -15282,44 +18429,56 @@ snapshots:
 
   fast-levenshtein@2.0.6: {}
 
-  fast-string-compare@3.0.0: {}
+  fast-string-truncated-width@3.0.3: {}
 
-  fast-uri@3.0.3: {}
+  fast-string-width@3.0.2:
+    dependencies:
+      fast-string-truncated-width: 3.0.3
+
+  fast-uri@3.1.5: {}
+
+  fast-wrap-ansi@0.2.2:
+    dependencies:
+      fast-string-width: 3.0.2
 
   fastest-levenshtein@1.0.16: {}
 
-  fastq@1.17.1:
+  fastq@1.20.1:
     dependencies:
-      reusify: 1.0.4
+      reusify: 1.1.0
 
-  fdir@6.4.2(picomatch@4.0.2):
+  fd-package-json@2.0.0:
+    dependencies:
+      walk-up-path: 4.0.0
+
+  fdir@6.5.0(picomatch@4.0.5):
     optionalDependencies:
-      picomatch: 4.0.2
+      picomatch: 4.0.5
+
+  fflate@0.8.3: {}
 
   figures@6.1.0:
     dependencies:
       is-unicode-supported: 2.1.0
 
+  file-entry-cache@11.1.5:
+    dependencies:
+      flat-cache: 6.1.23
+
   file-entry-cache@8.0.0:
     dependencies:
       flat-cache: 4.0.1
 
-  file-entry-cache@9.1.0:
-    dependencies:
-      flat-cache: 5.0.0
-
   file-uri-to-path@1.0.0: {}
 
-  filelist@1.0.4:
+  filelist@1.0.6:
     dependencies:
-      minimatch: 5.1.6
+      minimatch: 5.1.9
 
   fill-range@7.1.1:
     dependencies:
       to-regex-range: 5.0.1
 
-  find-up-simple@1.0.0: {}
-
   find-up@4.1.0:
     dependencies:
       locate-path: 5.0.0
@@ -15330,71 +18489,83 @@ snapshots:
       locate-path: 6.0.0
       path-exists: 4.0.0
 
-  find-up@7.0.0:
+  find-up@8.0.0:
     dependencies:
-      locate-path: 7.2.0
-      path-exists: 5.0.0
-      unicorn-magic: 0.1.0
+      locate-path: 8.0.0
+      unicorn-magic: 0.3.0
 
-  findup-sync@5.0.0:
+  fix-dts-default-cjs-exports@1.0.1:
     dependencies:
-      detect-file: 1.0.0
-      is-glob: 4.0.3
-      micromatch: 4.0.8
-      resolve-dir: 1.0.1
+      magic-string: 0.30.21
+      mlly: 1.8.2
+      rollup: 4.62.4
 
   flat-cache@4.0.1:
     dependencies:
-      flatted: 3.3.2
+      flatted: 3.4.4
       keyv: 4.5.4
 
-  flat-cache@5.0.0:
+  flat-cache@6.1.23:
     dependencies:
-      flatted: 3.3.2
-      keyv: 4.5.4
+      cacheable: 2.5.0
+      flatted: 3.4.4
+      hookified: 1.15.1
 
-  flatted@3.3.2: {}
+  flatted@3.4.4: {}
 
-  focus-trap@7.6.2:
-    dependencies:
-      tabbable: 6.2.0
-    optional: true
+  follow-redirects@1.16.0(debug@4.4.3(supports-color@10.2.2)):
+    optionalDependencies:
+      debug: 4.4.3(supports-color@10.2.2)
 
-  follow-redirects@1.15.9: {}
-
-  for-each@0.3.3:
+  for-each@0.3.5:
     dependencies:
       is-callable: 1.2.7
 
-  foreground-child@3.3.0:
+  foreground-child@3.3.1:
     dependencies:
       cross-spawn: 7.0.6
       signal-exit: 4.1.0
 
-  form-data@4.0.1:
+  form-data@4.0.6:
     dependencies:
       asynckit: 0.4.0
       combined-stream: 1.0.8
+      es-set-tostringtag: 2.1.0
+      hasown: 2.0.4
       mime-types: 2.1.35
 
+  formatly@0.3.0:
+    dependencies:
+      fd-package-json: 2.0.0
+
   frac@1.1.2: {}
 
-  fraction.js@4.3.7: {}
+  fraction.js@5.3.4: {}
 
-  fresh@0.5.2: {}
+  framesync@6.1.2:
+    dependencies:
+      tslib: 2.4.0
+
+  fresh@2.0.0: {}
 
   fs-constants@1.0.0: {}
 
   fs-extra@10.1.0:
     dependencies:
       graceful-fs: 4.2.11
-      jsonfile: 6.1.0
+      jsonfile: 6.2.1
       universalify: 2.0.1
 
-  fs-extra@11.2.0:
+  fs-extra@11.3.1:
     dependencies:
       graceful-fs: 4.2.11
-      jsonfile: 6.1.0
+      jsonfile: 6.2.1
+      universalify: 2.0.1
+
+  fs-extra@11.4.0:
+    dependencies:
+      graceful-fs: 4.2.11
+      jsonfile: 6.2.1
       universalify: 2.0.1
 
   fs-extra@7.0.1:
@@ -15413,13 +18584,9 @@ snapshots:
     dependencies:
       at-least-node: 1.0.0
       graceful-fs: 4.2.11
-      jsonfile: 6.1.0
+      jsonfile: 6.2.1
       universalify: 2.0.1
 
-  fs-minipass@2.1.0:
-    dependencies:
-      minipass: 3.3.6
-
   fs.realpath@1.0.0: {}
 
   fsevents@2.3.2:
@@ -15437,47 +18604,57 @@ snapshots:
 
   function-bind@1.1.2: {}
 
-  function.prototype.name@1.1.8:
+  function.prototype.name@1.2.0:
     dependencies:
-      call-bind: 1.0.8
-      call-bound: 1.0.3
-      define-properties: 1.2.1
+      call-bind: 1.0.9
+      call-bound: 1.0.4
+      es-define-property: 1.0.1
+      es-errors: 1.3.0
       functions-have-names: 1.2.3
-      hasown: 2.0.2
+      has-property-descriptors: 1.0.2
+      hasown: 2.0.4
       is-callable: 1.2.7
+      is-document.all: 1.0.0
 
   functions-have-names@1.2.3: {}
 
-  gensequence@7.0.0: {}
+  generator-function@2.0.1: {}
+
+  gensequence@8.0.8: {}
 
   gensync@1.0.0-beta.2: {}
 
   get-caller-file@2.0.5: {}
 
-  get-east-asian-width@1.3.0: {}
+  get-east-asian-width@1.6.0: {}
 
-  get-intrinsic@1.2.6:
+  get-intrinsic@1.3.0:
     dependencies:
-      call-bind-apply-helpers: 1.0.1
-      dunder-proto: 1.0.1
+      call-bind-apply-helpers: 1.0.2
       es-define-property: 1.0.1
       es-errors: 1.3.0
-      es-object-atoms: 1.0.0
+      es-object-atoms: 1.1.2
       function-bind: 1.1.2
+      get-proto: 1.0.1
       gopd: 1.2.0
       has-symbols: 1.1.0
-      hasown: 2.0.2
+      hasown: 2.0.4
       math-intrinsics: 1.1.0
 
   get-own-enumerable-property-symbols@3.0.2: {}
 
-  get-port-please@3.1.2: {}
+  get-port-please@3.2.0: {}
 
-  get-port@7.1.0: {}
+  get-port@7.2.0: {}
 
-  get-stdin@9.0.0: {}
+  get-proto@1.0.1:
+    dependencies:
+      dunder-proto: 1.0.1
+      es-object-atoms: 1.1.2
 
-  get-stream@8.0.1: {}
+  get-stream@5.2.0:
+    dependencies:
+      pump: 3.0.4
 
   get-stream@9.0.1:
     dependencies:
@@ -15486,30 +18663,19 @@ snapshots:
 
   get-symbol-description@1.1.0:
     dependencies:
-      call-bound: 1.0.3
+      call-bound: 1.0.4
       es-errors: 1.3.0
-      get-intrinsic: 1.2.6
+      get-intrinsic: 1.3.0
 
-  get-tsconfig@4.8.1:
+  get-tsconfig@4.14.1:
     dependencies:
       resolve-pkg-maps: 1.0.0
 
-  giget@1.2.3:
+  get-tsconfig@5.0.0-beta.5:
     dependencies:
-      citty: 0.1.6
-      consola: 3.3.0
-      defu: 6.1.4
-      node-fetch-native: 1.6.4
-      nypm: 0.3.12
-      ohash: 1.1.4
-      pathe: 1.1.2
-      tar: 6.2.1
+      resolve-pkg-maps: 1.0.0
 
-  git-raw-commits@4.0.0:
-    dependencies:
-      dargs: 8.1.0
-      meow: 12.1.1
-      split2: 4.2.0
+  giget@3.3.1: {}
 
   glob-parent@5.1.2:
     dependencies:
@@ -15521,76 +18687,68 @@ snapshots:
 
   glob@10.4.5:
     dependencies:
-      foreground-child: 3.3.0
+      foreground-child: 3.3.1
       jackspeak: 3.4.3
-      minimatch: 9.0.5
-      minipass: 7.1.2
+      minimatch: 9.0.9
+      minipass: 7.1.3
       package-json-from-dist: 1.0.1
       path-scurry: 1.11.1
 
-  glob@11.0.0:
+  glob@11.1.0:
     dependencies:
-      foreground-child: 3.3.0
-      jackspeak: 4.0.2
-      minimatch: 10.0.1
-      minipass: 7.1.2
+      foreground-child: 3.3.1
+      jackspeak: 4.2.3
+      minimatch: 10.2.6
+      minipass: 7.1.3
       package-json-from-dist: 1.0.1
-      path-scurry: 2.0.0
+      path-scurry: 2.0.2
+
+  glob@13.0.6:
+    dependencies:
+      minimatch: 10.2.6
+      minipass: 7.1.3
+      path-scurry: 2.0.2
 
   glob@7.2.3:
     dependencies:
       fs.realpath: 1.0.0
       inflight: 1.0.6
       inherits: 2.0.4
-      minimatch: 3.1.2
+      minimatch: 3.1.5
       once: 1.4.0
       path-is-absolute: 1.0.1
 
-  glob@8.1.0:
+  global-agent@3.0.0:
     dependencies:
-      fs.realpath: 1.0.0
-      inflight: 1.0.6
-      inherits: 2.0.4
-      minimatch: 5.1.6
-      once: 1.4.0
+      boolean: 3.2.0
+      es6-error: 4.1.1
+      matcher: 3.0.0
+      roarr: 2.15.4
+      semver: 7.8.5
+      serialize-error: 7.0.1
+    optional: true
 
   global-directory@4.0.1:
     dependencies:
       ini: 4.1.1
 
-  global-modules@1.0.0:
+  global-directory@5.0.0:
     dependencies:
-      global-prefix: 1.0.2
-      is-windows: 1.0.2
-      resolve-dir: 1.0.1
+      ini: 6.0.0
 
   global-modules@2.0.0:
     dependencies:
       global-prefix: 3.0.0
 
-  global-prefix@1.0.2:
-    dependencies:
-      expand-tilde: 2.0.2
-      homedir-polyfill: 1.0.3
-      ini: 1.3.8
-      is-windows: 1.0.2
-      which: 1.3.1
-
   global-prefix@3.0.0:
     dependencies:
       ini: 1.3.8
       kind-of: 6.0.3
       which: 1.3.1
 
-  globals@11.12.0: {}
+  globals@15.15.0: {}
 
-  globals@13.24.0:
-    dependencies:
-      type-fest: 0.20.2
-
-  globals@14.0.0: {}
-
-  globals@15.14.0: {}
+  globals@17.9.0: {}
 
   globalthis@1.0.4:
     dependencies:
@@ -15601,64 +18759,78 @@ snapshots:
     dependencies:
       array-union: 2.1.0
       dir-glob: 3.0.1
-      fast-glob: 3.3.2
+      fast-glob: 3.3.3
       ignore: 5.3.2
       merge2: 1.4.1
       slash: 3.0.0
 
-  globby@14.0.2:
+  globby@16.2.3:
     dependencies:
-      '@sindresorhus/merge-streams': 2.3.0
-      fast-glob: 3.3.2
-      ignore: 5.3.2
-      path-type: 5.0.0
+      '@sindresorhus/merge-streams': 4.0.0
+      fast-glob: 3.3.3
+      ignore: 7.0.6
+      is-path-inside: 4.0.0
       slash: 5.1.0
-      unicorn-magic: 0.1.0
+      unicorn-magic: 0.4.0
 
   globjoin@0.1.4: {}
 
+  globrex@0.1.2: {}
+
   gopd@1.2.0: {}
 
+  got@11.8.6:
+    dependencies:
+      '@sindresorhus/is': 4.6.0
+      '@szmarczak/http-timer': 4.0.6
+      '@types/cacheable-request': 6.0.3
+      '@types/responselike': 1.0.3
+      cacheable-lookup: 5.0.4
+      cacheable-request: 7.0.4
+      decompress-response: 6.0.0
+      http2-wrapper: 1.0.3
+      lowercase-keys: 2.0.0
+      p-cancelable: 2.1.1
+      responselike: 2.0.1
+
   graceful-fs@4.2.10: {}
 
   graceful-fs@4.2.11: {}
 
-  graph-cycles@3.0.0:
-    dependencies:
-      fast-string-compare: 3.0.0
-      rotated-array-set: 3.0.0
-      short-tree: 3.0.0
-
-  graphemer@1.4.0: {}
-
   gzip-size@7.0.0:
     dependencies:
       duplexer: 0.1.2
 
-  h3@1.13.0:
+  h3@1.15.11:
     dependencies:
-      cookie-es: 1.2.2
-      crossws: 0.3.1
-      defu: 6.1.4
-      destr: 2.0.3
+      cookie-es: 1.2.3
+      crossws: 0.3.5
+      defu: 6.1.7
+      destr: 2.0.5
       iron-webcrypto: 1.2.1
-      ohash: 1.1.4
+      node-mock-http: 1.0.5
       radix3: 1.1.2
-      ufo: 1.5.4
+      ufo: 1.6.4
       uncrypto: 0.1.3
-      unenv: 1.10.0
 
-  happy-dom@15.11.7:
+  happy-dom@20.11.2:
     dependencies:
-      entities: 4.5.0
-      webidl-conversions: 7.0.0
+      '@types/node': 25.9.5
+      '@types/whatwg-mimetype': 3.0.2
+      '@types/ws': 8.18.1
+      buffer-image-size: 0.6.4
+      entities: 7.0.1
       whatwg-mimetype: 3.0.0
+      ws: 8.21.3
+    transitivePeerDependencies:
+      - bufferutil
+      - utf-8-validate
 
   has-bigints@1.1.0: {}
 
   has-flag@4.0.0: {}
 
-  has-own-prop@2.0.0: {}
+  has-flag@5.0.1: {}
 
   has-property-descriptors@1.0.2:
     dependencies:
@@ -15674,31 +18846,27 @@ snapshots:
     dependencies:
       has-symbols: 1.1.0
 
-  hash-sum@2.0.0: {}
+  hashery@1.5.1:
+    dependencies:
+      hookified: 1.15.1
 
-  hasown@2.0.2:
+  hasown@2.0.4:
     dependencies:
       function-bind: 1.1.2
 
-  he@1.2.0: {}
-
-  homedir-polyfill@1.0.3:
-    dependencies:
-      parse-passwd: 1.0.0
+  hey-listen@1.0.8: {}
 
   hookable@5.5.3: {}
 
-  hosted-git-info@2.8.9: {}
+  hookable@6.1.1: {}
 
-  html-minifier-terser@6.1.0:
+  hookified@1.15.1: {}
+
+  hookified@2.2.0: {}
+
+  hosted-git-info@4.1.0:
     dependencies:
-      camel-case: 4.1.2
-      clean-css: 5.3.3
-      commander: 8.3.0
-      he: 1.2.0
-      param-case: 3.0.4
-      relateurl: 0.2.7
-      terser: 5.37.0
+      lru-cache: 6.0.0
 
   html-minifier-terser@7.2.0:
     dependencies:
@@ -15708,121 +18876,113 @@ snapshots:
       entities: 4.5.0
       param-case: 3.0.4
       relateurl: 0.2.7
-      terser: 5.37.0
+      terser: 5.49.2
 
-  html-tags@3.3.1: {}
+  html-tags@5.1.0: {}
 
   html2canvas@1.4.1:
     dependencies:
       css-line-break: 2.1.0
       text-segmentation: 1.0.3
 
+  htmlparser2@10.1.0:
+    dependencies:
+      domelementtype: 2.3.0
+      domhandler: 5.0.3
+      domutils: 3.2.2
+      entities: 7.0.1
+
   htmlparser2@8.0.2:
     dependencies:
       domelementtype: 2.3.0
       domhandler: 5.0.3
-      domutils: 3.1.0
+      domutils: 3.2.2
       entities: 4.5.0
 
-  htmlparser2@9.1.0:
-    dependencies:
-      domelementtype: 2.3.0
-      domhandler: 5.0.3
-      domutils: 3.1.0
-      entities: 4.5.0
+  http-cache-semantics@4.2.0: {}
 
-  http-cache-semantics@4.1.1: {}
-
-  http-errors@2.0.0:
+  http-errors@2.0.1:
     dependencies:
       depd: 2.0.0
       inherits: 2.0.4
       setprototypeof: 1.2.0
-      statuses: 2.0.1
+      statuses: 2.0.2
       toidentifier: 1.0.1
 
-  http-proxy-agent@4.0.1:
+  http-proxy-agent@7.0.2(supports-color@10.2.2):
     dependencies:
-      '@tootallnate/once': 1.1.2
-      agent-base: 6.0.2
-      debug: 4.4.0(supports-color@9.4.0)
+      agent-base: 7.1.4
+      debug: 4.4.3(supports-color@10.2.2)
     transitivePeerDependencies:
       - supports-color
 
   http-shutdown@1.2.2: {}
 
-  https-proxy-agent@5.0.1:
+  http2-wrapper@1.0.3:
     dependencies:
-      agent-base: 6.0.2
-      debug: 4.4.0(supports-color@9.4.0)
+      quick-lru: 5.1.1
+      resolve-alpn: 1.2.1
+
+  https-proxy-agent@5.0.1(supports-color@10.2.2):
+    dependencies:
+      agent-base: 6.0.2(supports-color@10.2.2)
+      debug: 4.4.3(supports-color@10.2.2)
     transitivePeerDependencies:
       - supports-color
 
-  https-proxy-agent@7.0.6(supports-color@9.4.0):
+  https-proxy-agent@7.0.6(supports-color@10.2.2):
     dependencies:
-      agent-base: 7.1.3
-      debug: 4.4.0(supports-color@9.4.0)
+      agent-base: 7.1.4
+      debug: 4.4.3(supports-color@10.2.2)
     transitivePeerDependencies:
       - supports-color
 
-  httpxy@0.1.5: {}
+  httpxy@0.5.5: {}
 
-  human-id@1.0.2: {}
+  human-id@4.2.0: {}
 
-  human-signals@5.0.0: {}
-
-  human-signals@8.0.0: {}
-
-  humanize-ms@1.2.1:
-    dependencies:
-      ms: 2.1.3
+  human-signals@8.0.1: {}
 
   husky@9.1.7: {}
 
   iconv-lite@0.4.24:
     dependencies:
       safer-buffer: 2.1.2
+    optional: true
 
   iconv-lite@0.6.3:
     dependencies:
       safer-buffer: 2.1.2
 
+  iconv-lite@0.7.3:
+    dependencies:
+      safer-buffer: 2.1.2
+
   idb@7.1.1: {}
 
   ieee754@1.2.1: {}
 
-  ignore-walk@5.0.1:
-    dependencies:
-      minimatch: 5.1.6
-
   ignore@5.3.2: {}
 
-  ignore@6.0.2: {}
-
-  image-size@0.5.5:
-    optional: true
+  ignore@7.0.6: {}
 
   immediate@3.0.6: {}
 
-  immutable@4.3.7: {}
+  immutable@5.1.9: {}
 
-  import-fresh@3.3.0:
+  import-fresh@3.3.1:
     dependencies:
       parent-module: 1.0.1
       resolve-from: 4.0.0
 
-  import-lazy@4.0.0: {}
+  import-fresh@4.0.0: {}
 
-  import-meta-resolve@4.1.0: {}
+  import-meta-resolve@4.2.0: {}
+
+  import-without-cache@0.4.0: {}
 
   imurmurhash@0.1.4: {}
 
-  indent-string@4.0.0: {}
-
-  index-to-position@0.1.2: {}
-
-  infer-owner@1.0.4: {}
-
   inflight@1.0.6:
     dependencies:
       once: 1.4.0
@@ -15834,111 +18994,101 @@ snapshots:
 
   ini@4.1.1: {}
 
+  ini@6.0.0: {}
+
   internal-slot@1.1.0:
     dependencies:
       es-errors: 1.3.0
-      hasown: 2.0.2
-      side-channel: 1.1.0
+      hasown: 2.0.4
+      side-channel: 1.1.1
 
-  ioredis@5.4.2:
+  ioredis@5.11.1(supports-color@10.2.2):
     dependencies:
-      '@ioredis/commands': 1.2.0
-      cluster-key-slot: 1.1.2
-      debug: 4.4.0(supports-color@9.4.0)
+      '@ioredis/commands': 1.10.0
+      cluster-key-slot: 1.1.1
+      debug: 4.4.3(supports-color@10.2.2)
       denque: 2.1.0
-      lodash.defaults: 4.2.0
-      lodash.isarguments: 3.1.0
       redis-errors: 1.2.0
       redis-parser: 3.0.0
       standard-as-callback: 2.1.0
     transitivePeerDependencies:
       - supports-color
 
-  ip-address@9.0.5:
-    dependencies:
-      jsbn: 1.1.0
-      sprintf-js: 1.1.3
-
   iron-webcrypto@1.2.1: {}
 
-  is-arguments@1.2.0:
-    dependencies:
-      call-bound: 1.0.3
-      has-tostringtag: 1.0.2
-
   is-array-buffer@3.0.5:
     dependencies:
-      call-bind: 1.0.8
-      call-bound: 1.0.3
-      get-intrinsic: 1.2.6
+      call-bind: 1.0.9
+      call-bound: 1.0.4
+      get-intrinsic: 1.3.0
 
   is-arrayish@0.2.1: {}
 
-  is-async-function@2.0.0:
+  is-async-function@2.1.1:
     dependencies:
+      async-function: 1.0.0
+      call-bound: 1.0.4
+      get-proto: 1.0.1
       has-tostringtag: 1.0.2
+      safe-regex-test: 1.1.0
 
   is-bigint@1.1.0:
     dependencies:
       has-bigints: 1.1.0
 
-  is-binary-path@2.1.0:
+  is-boolean-object@1.2.2:
     dependencies:
-      binary-extensions: 2.3.0
-
-  is-boolean-object@1.2.1:
-    dependencies:
-      call-bound: 1.0.3
+      call-bound: 1.0.4
       has-tostringtag: 1.0.2
 
   is-buffer@2.0.5: {}
 
-  is-builtin-module@3.2.1:
-    dependencies:
-      builtin-modules: 3.3.0
-
   is-callable@1.2.7: {}
 
   is-ci@4.1.0:
     dependencies:
-      ci-info: 4.1.0
+      ci-info: 4.4.0
 
-  is-core-module@2.16.0:
+  is-core-module@2.16.2:
     dependencies:
-      hasown: 2.0.2
+      hasown: 2.0.4
 
   is-data-view@1.0.2:
     dependencies:
-      call-bound: 1.0.3
-      get-intrinsic: 1.2.6
+      call-bound: 1.0.4
+      get-intrinsic: 1.3.0
       is-typed-array: 1.1.15
 
   is-date-object@1.1.0:
     dependencies:
-      call-bound: 1.0.3
+      call-bound: 1.0.4
       has-tostringtag: 1.0.2
 
-  is-docker@2.2.1: {}
-
   is-docker@3.0.0: {}
 
+  is-document.all@1.0.0:
+    dependencies:
+      call-bound: 1.0.4
+
   is-extglob@2.1.1: {}
 
   is-finalizationregistry@1.1.1:
     dependencies:
-      call-bound: 1.0.3
+      call-bound: 1.0.4
 
   is-fullwidth-code-point@3.0.0: {}
 
-  is-fullwidth-code-point@4.0.0: {}
-
-  is-fullwidth-code-point@5.0.0:
+  is-fullwidth-code-point@5.1.0:
     dependencies:
-      get-east-asian-width: 1.3.0
+      get-east-asian-width: 1.6.0
 
-  is-generator-function@1.0.10:
+  is-generator-function@1.1.2:
     dependencies:
+      call-bound: 1.0.4
+      generator-function: 2.0.1
+      get-proto: 1.0.1
       has-tostringtag: 1.0.2
+      safe-regex-test: 1.1.0
 
   is-glob@4.0.3:
     dependencies:
@@ -15946,6 +19096,8 @@ snapshots:
 
   is-in-ci@1.0.0: {}
 
+  is-in-ssh@1.0.0: {}
+
   is-inside-container@1.0.0:
     dependencies:
       is-docker: 3.0.0
@@ -15957,27 +19109,23 @@ snapshots:
 
   is-interactive@2.0.0: {}
 
-  is-lambda@1.0.1: {}
-
   is-map@2.0.3: {}
 
   is-module@1.0.0: {}
 
   is-negative-zero@2.0.3: {}
 
-  is-npm@6.0.0: {}
+  is-npm@6.1.0: {}
 
   is-number-object@1.1.1:
     dependencies:
-      call-bound: 1.0.3
+      call-bound: 1.0.4
       has-tostringtag: 1.0.2
 
   is-number@7.0.0: {}
 
   is-obj@1.0.1: {}
 
-  is-obj@2.0.0: {}
-
   is-path-inside@4.0.0: {}
 
   is-plain-obj@4.1.0: {}
@@ -15988,32 +19136,32 @@ snapshots:
 
   is-reference@1.2.1:
     dependencies:
-      '@types/estree': 1.0.6
+      '@types/estree': 1.0.9
 
   is-regex@1.2.1:
     dependencies:
-      call-bound: 1.0.3
+      call-bound: 1.0.4
       gopd: 1.2.0
       has-tostringtag: 1.0.2
-      hasown: 2.0.2
+      hasown: 2.0.4
 
   is-regexp@1.0.0: {}
 
+  is-safe-filename@0.1.1: {}
+
   is-set@2.0.3: {}
 
   is-shared-array-buffer@1.0.4:
     dependencies:
-      call-bound: 1.0.3
+      call-bound: 1.0.4
 
   is-stream@2.0.1: {}
 
-  is-stream@3.0.0: {}
-
   is-stream@4.0.1: {}
 
   is-string@1.1.1:
     dependencies:
-      call-bound: 1.0.3
+      call-bound: 1.0.4
       has-tostringtag: 1.0.2
 
   is-subdir@1.2.0:
@@ -16022,118 +19170,109 @@ snapshots:
 
   is-symbol@1.1.1:
     dependencies:
-      call-bound: 1.0.3
+      call-bound: 1.0.4
       has-symbols: 1.1.0
       safe-regex-test: 1.1.0
 
-  is-text-path@2.0.0:
-    dependencies:
-      text-extensions: 2.4.0
-
   is-typed-array@1.1.15:
     dependencies:
-      which-typed-array: 1.1.18
-
-  is-unicode-supported@1.3.0: {}
+      which-typed-array: 1.1.22
 
   is-unicode-supported@2.1.0: {}
 
   is-weakmap@2.0.2: {}
 
-  is-weakref@1.1.0:
+  is-weakref@1.1.1:
     dependencies:
-      call-bound: 1.0.3
+      call-bound: 1.0.4
 
   is-weakset@2.0.4:
     dependencies:
-      call-bound: 1.0.3
-      get-intrinsic: 1.2.6
+      call-bound: 1.0.4
+      get-intrinsic: 1.3.0
 
-  is-what@3.14.1:
+  is-what@4.1.16:
     optional: true
 
-  is-what@4.1.16: {}
-
   is-windows@1.0.2: {}
 
-  is-wsl@2.2.0:
-    dependencies:
-      is-docker: 2.2.1
-
-  is-wsl@3.1.0:
+  is-wsl@3.1.1:
     dependencies:
       is-inside-container: 1.0.0
 
-  is64bit@2.0.0:
-    dependencies:
-      system-architecture: 0.1.0
-
   isarray@1.0.0: {}
 
   isarray@2.0.5: {}
 
+  isbinaryfile@4.0.10: {}
+
+  isbinaryfile@5.0.7: {}
+
   isexe@2.0.0: {}
 
+  isexe@3.1.5: {}
+
+  isexe@4.0.0: {}
+
   jackspeak@3.4.3:
     dependencies:
       '@isaacs/cliui': 8.0.2
     optionalDependencies:
       '@pkgjs/parseargs': 0.11.0
 
-  jackspeak@4.0.2:
+  jackspeak@4.2.3:
     dependencies:
-      '@isaacs/cliui': 8.0.2
+      '@isaacs/cliui': 9.0.0
 
-  jake@10.9.2:
+  jake@10.9.4:
     dependencies:
       async: 3.2.6
-      chalk: 4.1.2
-      filelist: 1.0.4
-      minimatch: 3.1.2
+      filelist: 1.0.6
+      picocolors: 1.1.1
 
   jiti@1.21.7: {}
 
-  jiti@2.4.2: {}
+  jiti@2.6.1: {}
+
+  jiti@2.7.0: {}
 
   jju@1.4.0: {}
 
-  js-base64@3.7.7: {}
+  js-base64@3.9.2: {}
 
-  js-beautify@1.15.1:
+  js-beautify@1.15.4:
     dependencies:
       config-chain: 1.1.13
-      editorconfig: 1.0.4
+      editorconfig: 1.0.7
       glob: 10.4.5
-      js-cookie: 3.0.5
+      js-cookie: 3.0.8
       nopt: 7.2.1
 
-  js-cookie@3.0.5: {}
+  js-cookie@3.0.8: {}
 
-  js-levenshtein@1.1.6: {}
+  js-tokens@10.0.0: {}
 
   js-tokens@4.0.0: {}
 
   js-tokens@9.0.1: {}
 
-  js-yaml@3.14.1:
+  js-yaml@3.15.1:
     dependencies:
       argparse: 1.0.10
       esprima: 4.0.1
 
-  js-yaml@4.1.0:
+  js-yaml@4.3.1:
     dependencies:
       argparse: 2.0.1
 
-  jsbn@1.1.0: {}
-
-  jsdoc-type-pratt-parser@4.1.0: {}
-
-  jsesc@0.5.0: {}
-
-  jsesc@3.0.2: {}
+  jsdoc-type-pratt-parser@7.2.0: {}
 
   jsesc@3.1.0: {}
 
+  json-bigint@1.0.0:
+    dependencies:
+      bignumber.js: 9.3.1
+
   json-buffer@3.0.1: {}
 
   json-parse-even-better-errors@2.3.1: {}
@@ -16142,31 +19281,36 @@ snapshots:
 
   json-schema-traverse@1.0.0: {}
 
-  json-schema@0.4.0: {}
-
   json-stable-stringify-without-jsonify@1.0.1: {}
 
+  json-stringify-safe@5.0.1:
+    optional: true
+
   json5@2.2.3: {}
 
-  jsonc-eslint-parser@2.4.0:
+  jsonc-eslint-parser@2.4.2:
     dependencies:
-      acorn: 8.14.0
+      acorn: 8.18.0
       eslint-visitor-keys: 3.4.3
       espree: 9.6.1
-      semver: 7.6.3
+      semver: 7.8.5
+
+  jsonc-eslint-parser@3.3.0:
+    dependencies:
+      acorn: 8.18.0
+      eslint-visitor-keys: 5.0.1
+      verkit: 0.3.2
 
   jsonfile@4.0.0:
     optionalDependencies:
       graceful-fs: 4.2.11
 
-  jsonfile@6.1.0:
+  jsonfile@6.2.1:
     dependencies:
       universalify: 2.0.1
     optionalDependencies:
       graceful-fs: 4.2.11
 
-  jsonparse@1.3.1: {}
-
   jsonpointer@5.0.1: {}
 
   jszip@3.10.1:
@@ -16180,39 +19324,107 @@ snapshots:
     dependencies:
       json-buffer: 3.0.1
 
+  keyv@5.6.0:
+    dependencies:
+      '@keyv/serialize': 1.1.1
+
   kind-of@6.0.3: {}
 
+  kleur@4.1.5: {}
+
   klona@2.0.6: {}
 
-  knitwork@1.2.0: {}
+  knip@6.32.1:
+    dependencies:
+      fdir: 6.5.0(picomatch@4.0.5)
+      formatly: 0.3.0
+      get-tsconfig: 4.14.1
+      jiti: 2.7.0
+      oxc-parser: 0.142.0
+      oxc-resolver: 11.24.2
+      picomatch: 4.0.5
+      smol-toml: 1.7.1
+      strip-json-comments: 5.0.3
+      tinyglobby: 0.2.17
+      unbash: 4.0.10
+      yaml: 2.9.0
+      zod: 4.4.3
 
-  known-css-properties@0.35.0: {}
+  knitwork@1.3.0: {}
+
+  known-css-properties@0.37.0: {}
 
   kolorist@1.8.0: {}
 
-  ky@1.7.4: {}
+  ky@1.14.3: {}
 
   latest-version@9.0.0:
     dependencies:
       package-json: 10.0.1
 
+  lazy-val@1.0.5: {}
+
   lazystream@1.0.1:
     dependencies:
       readable-stream: 2.3.8
 
-  less@4.2.1:
+  lefthook-darwin-arm64@2.1.10:
+    optional: true
+
+  lefthook-darwin-x64@2.1.10:
+    optional: true
+
+  lefthook-freebsd-arm64@2.1.10:
+    optional: true
+
+  lefthook-freebsd-x64@2.1.10:
+    optional: true
+
+  lefthook-linux-arm64@2.1.10:
+    optional: true
+
+  lefthook-linux-x64@2.1.10:
+    optional: true
+
+  lefthook-openbsd-arm64@2.1.10:
+    optional: true
+
+  lefthook-openbsd-x64@2.1.10:
+    optional: true
+
+  lefthook-windows-arm64@2.1.10:
+    optional: true
+
+  lefthook-windows-x64@2.1.10:
+    optional: true
+
+  lefthook@2.1.10:
+    optionalDependencies:
+      lefthook-darwin-arm64: 2.1.10
+      lefthook-darwin-x64: 2.1.10
+      lefthook-freebsd-arm64: 2.1.10
+      lefthook-freebsd-x64: 2.1.10
+      lefthook-linux-arm64: 2.1.10
+      lefthook-linux-x64: 2.1.10
+      lefthook-openbsd-arm64: 2.1.10
+      lefthook-openbsd-x64: 2.1.10
+      lefthook-windows-arm64: 2.1.10
+      lefthook-windows-x64: 2.1.10
+
+  less@4.8.1(supports-color@10.2.2):
     dependencies:
-      copy-anything: 2.0.6
+      copy-anything: 3.0.5
       parse-node-version: 1.0.1
-      tslib: 2.8.1
     optionalDependencies:
       errno: 0.1.8
       graceful-fs: 4.2.11
-      image-size: 0.5.5
-      make-dir: 2.1.0
+      make-dir: 5.1.0
       mime: 1.6.0
-      needle: 3.3.1
+      needle: 3.5.0
+      probe-image-size: 7.3.0(supports-color@10.2.2)
       source-map: 0.6.1
+    transitivePeerDependencies:
+      - supports-color
     optional: true
 
   leven@3.1.0: {}
@@ -16226,65 +19438,150 @@ snapshots:
     dependencies:
       immediate: 3.0.6
 
+  lightningcss-android-arm64@1.32.0:
+    optional: true
+
+  lightningcss-android-arm64@1.33.0:
+    optional: true
+
+  lightningcss-darwin-arm64@1.32.0:
+    optional: true
+
+  lightningcss-darwin-arm64@1.33.0:
+    optional: true
+
+  lightningcss-darwin-x64@1.32.0:
+    optional: true
+
+  lightningcss-darwin-x64@1.33.0:
+    optional: true
+
+  lightningcss-freebsd-x64@1.32.0:
+    optional: true
+
+  lightningcss-freebsd-x64@1.33.0:
+    optional: true
+
+  lightningcss-linux-arm-gnueabihf@1.32.0:
+    optional: true
+
+  lightningcss-linux-arm-gnueabihf@1.33.0:
+    optional: true
+
+  lightningcss-linux-arm64-gnu@1.32.0:
+    optional: true
+
+  lightningcss-linux-arm64-gnu@1.33.0:
+    optional: true
+
+  lightningcss-linux-arm64-musl@1.32.0:
+    optional: true
+
+  lightningcss-linux-arm64-musl@1.33.0:
+    optional: true
+
+  lightningcss-linux-x64-gnu@1.32.0:
+    optional: true
+
+  lightningcss-linux-x64-gnu@1.33.0:
+    optional: true
+
+  lightningcss-linux-x64-musl@1.32.0:
+    optional: true
+
+  lightningcss-linux-x64-musl@1.33.0:
+    optional: true
+
+  lightningcss-win32-arm64-msvc@1.32.0:
+    optional: true
+
+  lightningcss-win32-arm64-msvc@1.33.0:
+    optional: true
+
+  lightningcss-win32-x64-msvc@1.32.0:
+    optional: true
+
+  lightningcss-win32-x64-msvc@1.33.0:
+    optional: true
+
+  lightningcss@1.32.0:
+    dependencies:
+      detect-libc: 2.1.2
+    optionalDependencies:
+      lightningcss-android-arm64: 1.32.0
+      lightningcss-darwin-arm64: 1.32.0
+      lightningcss-darwin-x64: 1.32.0
+      lightningcss-freebsd-x64: 1.32.0
+      lightningcss-linux-arm-gnueabihf: 1.32.0
+      lightningcss-linux-arm64-gnu: 1.32.0
+      lightningcss-linux-arm64-musl: 1.32.0
+      lightningcss-linux-x64-gnu: 1.32.0
+      lightningcss-linux-x64-musl: 1.32.0
+      lightningcss-win32-arm64-msvc: 1.32.0
+      lightningcss-win32-x64-msvc: 1.32.0
+
+  lightningcss@1.33.0:
+    dependencies:
+      detect-libc: 2.1.2
+    optionalDependencies:
+      lightningcss-android-arm64: 1.33.0
+      lightningcss-darwin-arm64: 1.33.0
+      lightningcss-darwin-x64: 1.33.0
+      lightningcss-freebsd-x64: 1.33.0
+      lightningcss-linux-arm-gnueabihf: 1.33.0
+      lightningcss-linux-arm64-gnu: 1.33.0
+      lightningcss-linux-arm64-musl: 1.33.0
+      lightningcss-linux-x64-gnu: 1.33.0
+      lightningcss-linux-x64-musl: 1.33.0
+      lightningcss-win32-arm64-msvc: 1.33.0
+      lightningcss-win32-x64-msvc: 1.33.0
+
   lilconfig@3.1.3: {}
 
   lines-and-columns@1.2.4: {}
 
-  linkify-it@5.0.0:
+  linkify-it@5.0.2:
     dependencies:
       uc.micro: 2.1.0
 
-  lint-staged@15.2.11:
-    dependencies:
-      chalk: 5.3.0
-      commander: 12.1.0
-      debug: 4.4.0(supports-color@9.4.0)
-      execa: 8.0.1
-      lilconfig: 3.1.3
-      listr2: 8.2.5
-      micromatch: 4.0.8
-      pidtree: 0.6.0
-      string-argv: 0.3.2
-      yaml: 2.6.1
-    transitivePeerDependencies:
-      - supports-color
+  linkifyjs@4.3.3: {}
 
   listenercount@1.0.1: {}
 
-  listhen@1.9.0:
+  listhen@1.10.1(@parcel/watcher@2.6.0):
     dependencies:
-      '@parcel/watcher': 2.5.0
-      '@parcel/watcher-wasm': 2.5.0
-      citty: 0.1.6
-      clipboardy: 4.0.0
-      consola: 3.3.0
-      crossws: 0.3.1
-      defu: 6.1.4
-      get-port-please: 3.1.2
-      h3: 1.13.0
+      '@parcel/watcher-wasm': 2.6.0
+      citty: 0.2.2
+      consola: 3.4.2
+      crossws: 0.4.10
+      defu: 6.1.7
+      get-port-please: 3.2.0
+      h3: 1.15.11
       http-shutdown: 1.2.2
-      jiti: 2.4.2
-      mlly: 1.7.3
-      node-forge: 1.3.1
-      pathe: 1.1.2
-      std-env: 3.8.0
-      ufo: 1.5.4
-      untun: 0.1.3
-      uqr: 0.1.2
+      jiti: 2.7.0
+      node-forge: 1.4.0
+      pathe: 2.0.3
+      std-env: 4.2.0
+      tinyclip: 0.1.15
+      ufo: 1.6.4
+      untun: 0.2.2
+      uqr: 0.1.3
+    optionalDependencies:
+      '@parcel/watcher': 2.6.0
+    transitivePeerDependencies:
+      - srvx
 
-  listr2@8.2.5:
+  listr2@11.0.0:
     dependencies:
-      cli-truncate: 4.0.0
-      colorette: 2.0.20
-      eventemitter3: 5.0.1
-      log-update: 6.1.0
-      rfdc: 1.4.1
-      wrap-ansi: 9.0.0
+      cli-truncate: 6.1.1
+      log-update: 8.0.0
+      wrap-ansi: 10.0.0
 
-  local-pkg@0.5.1:
+  local-pkg@1.2.1:
     dependencies:
-      mlly: 1.7.3
-      pkg-types: 1.2.1
+      mlly: 1.8.2
+      pkg-types: 2.3.1
+      quansync: 0.2.11
 
   locate-path@5.0.0:
     dependencies:
@@ -16294,15 +19591,11 @@ snapshots:
     dependencies:
       p-locate: 5.0.0
 
-  locate-path@7.2.0:
+  locate-path@8.0.0:
     dependencies:
       p-locate: 6.0.0
 
-  lodash-es@4.17.21: {}
-
-  lodash.camelcase@4.3.0: {}
-
-  lodash.castarray@4.4.0: {}
+  lodash-es@4.18.1: {}
 
   lodash.clonedeep@4.5.0: {}
 
@@ -16316,12 +19609,8 @@ snapshots:
 
   lodash.flatten@4.4.0: {}
 
-  lodash.get@4.4.2: {}
-
   lodash.groupby@4.6.0: {}
 
-  lodash.isarguments@3.1.0: {}
-
   lodash.isboolean@3.0.3: {}
 
   lodash.isequal@4.5.0: {}
@@ -16334,17 +19623,10 @@ snapshots:
 
   lodash.isundefined@3.0.1: {}
 
-  lodash.kebabcase@4.1.1: {}
-
   lodash.memoize@4.1.2: {}
 
-  lodash.merge@4.6.2: {}
-
-  lodash.mergewith@4.6.2: {}
-
-  lodash.snakecase@4.1.1: {}
-
-  lodash.sortby@4.7.0: {}
+  lodash.merge@4.6.2:
+    optional: true
 
   lodash.startcase@4.4.0: {}
 
@@ -16354,36 +19636,35 @@ snapshots:
 
   lodash.uniq@4.5.0: {}
 
-  lodash.upperfirst@4.3.1: {}
+  lodash@4.18.1: {}
 
-  lodash@4.17.21: {}
-
-  log-symbols@6.0.0:
+  log-symbols@7.0.1:
     dependencies:
-      chalk: 5.4.0
-      is-unicode-supported: 1.3.0
+      is-unicode-supported: 2.1.0
+      yoctocolors: 2.2.0
 
-  log-update@6.1.0:
+  log-update@8.0.0:
     dependencies:
-      ansi-escapes: 7.0.0
+      ansi-escapes: 7.3.0
       cli-cursor: 5.0.0
-      slice-ansi: 7.1.0
-      strip-ansi: 7.1.0
-      wrap-ansi: 9.0.0
+      slice-ansi: 9.0.0
+      string-width: 8.2.2
+      strip-ansi: 7.2.0
+      wrap-ansi: 10.0.0
 
   loose-envify@1.4.0:
     dependencies:
       js-tokens: 4.0.0
 
-  loupe@3.1.2: {}
-
   lower-case@2.0.2:
     dependencies:
       tslib: 2.8.1
 
+  lowercase-keys@2.0.0: {}
+
   lru-cache@10.4.3: {}
 
-  lru-cache@11.0.2: {}
+  lru-cache@11.5.2: {}
 
   lru-cache@5.1.1:
     dependencies:
@@ -16393,212 +19674,157 @@ snapshots:
     dependencies:
       yallist: 4.0.0
 
-  lucide-vue-next@0.453.0(vue@3.5.13(typescript@5.6.3)):
+  lucide-vue-next@0.453.0(vue@3.5.41(typescript@6.0.3)):
     dependencies:
-      vue: 3.5.13(typescript@5.6.3)
+      vue: 3.5.41(typescript@6.0.3)
 
-  lucide-vue-next@0.469.0(vue@3.5.13(typescript@5.7.2)):
+  lucide-vue-next@0.487.0(vue@3.5.41(typescript@6.0.3)):
     dependencies:
-      vue: 3.5.13(typescript@5.7.2)
+      vue: 3.5.41(typescript@6.0.3)
 
-  lucide-vue-next@0.487.0(vue@3.5.13(typescript@5.6.3)):
-    dependencies:
-      vue: 3.5.13(typescript@5.6.3)
+  lunar-typescript@1.8.6: {}
 
-  magic-string@0.25.9:
-    dependencies:
-      sourcemap-codec: 1.4.8
+  lz-string@1.5.0: {}
 
-  magic-string@0.30.17:
+  magic-string-ast@1.0.3:
     dependencies:
-      '@jridgewell/sourcemap-codec': 1.5.0
+      magic-string: 0.30.21
 
-  magicast@0.3.5:
+  magic-string@0.30.21:
     dependencies:
-      '@babel/parser': 7.26.3
-      '@babel/types': 7.26.3
+      '@jridgewell/sourcemap-codec': 1.5.5
+
+  magic-string@1.1.0:
+    dependencies:
+      '@jridgewell/sourcemap-codec': 1.5.5
+
+  magicast@0.5.4:
+    dependencies:
+      '@babel/parser': 7.29.8
+      '@babel/types': 7.29.8
       source-map-js: 1.2.1
 
-  make-dir@2.1.0:
-    dependencies:
-      pify: 4.0.1
-      semver: 5.7.2
+  make-dir@5.1.0:
     optional: true
 
-  make-fetch-happen@8.0.14:
+  markdown-it-image-figures@2.1.1(markdown-it@14.3.0):
     dependencies:
-      agentkeepalive: 4.5.0
-      cacache: 15.3.0
-      http-cache-semantics: 4.1.1
-      http-proxy-agent: 4.0.1
-      https-proxy-agent: 5.0.1
-      is-lambda: 1.0.1
-      lru-cache: 6.0.0
-      minipass: 3.3.6
-      minipass-collect: 1.0.2
-      minipass-fetch: 1.4.1
-      minipass-flush: 1.0.5
-      minipass-pipeline: 1.2.4
-      promise-retry: 2.0.1
-      socks-proxy-agent: 5.0.1
-      ssri: 8.0.1
-    transitivePeerDependencies:
-      - bluebird
-      - supports-color
-
-  markdown-it-image-figures@2.1.1(markdown-it@14.1.0):
-    dependencies:
-      markdown-it: 14.1.0
+      markdown-it: 14.3.0
 
   markdown-it-sub@2.0.0: {}
 
   markdown-it-sup@2.0.0: {}
 
-  markdown-it@14.1.0:
+  markdown-it@14.3.0:
     dependencies:
       argparse: 2.0.1
       entities: 4.5.0
-      linkify-it: 5.0.0
-      mdurl: 2.0.0
+      linkify-it: 5.0.2
+      mdurl: 2.1.0
       punycode.js: 2.3.1
       uc.micro: 2.1.0
 
+  matcher@3.0.0:
+    dependencies:
+      escape-string-regexp: 4.0.0
+    optional: true
+
   math-intrinsics@1.1.0: {}
 
-  mathml-tag-names@2.1.3: {}
+  mathml-tag-names@4.0.0: {}
 
-  md-editor-v3@5.4.5(vue@3.5.13(typescript@5.6.3)):
+  md-editor-v3@5.8.5(vue@3.5.41(typescript@6.0.3)):
     dependencies:
-      '@codemirror/lang-markdown': 6.3.2
-      '@codemirror/language-data': 6.5.1
+      '@codemirror/autocomplete': 6.20.3
+      '@codemirror/commands': 6.10.4
+      '@codemirror/lang-markdown': 6.5.2
+      '@codemirror/language': 6.12.4
+      '@codemirror/language-data': 6.5.2
+      '@codemirror/search': 6.7.1
+      '@codemirror/state': 6.7.1
+      '@codemirror/view': 6.43.8
+      '@lezer/highlight': 1.2.3
       '@types/markdown-it': 14.1.2
-      '@vavt/copy2clipboard': 1.0.1
-      '@vavt/util': 2.1.0
-      codemirror: 6.0.1
-      lru-cache: 11.0.2
-      lucide-vue-next: 0.453.0(vue@3.5.13(typescript@5.6.3))
-      markdown-it: 14.1.0
-      markdown-it-image-figures: 2.1.1(markdown-it@14.1.0)
+      '@vavt/copy2clipboard': 1.0.3
+      '@vavt/util': 2.1.2
+      codemirror: 6.0.2
+      lru-cache: 11.5.2
+      lucide-vue-next: 0.453.0(vue@3.5.41(typescript@6.0.3))
+      markdown-it: 14.3.0
+      markdown-it-image-figures: 2.1.1(markdown-it@14.3.0)
       markdown-it-sub: 2.0.0
       markdown-it-sup: 2.0.0
       medium-zoom: 1.1.0
-      vue: 3.5.13(typescript@5.6.3)
+      vue: 3.5.41(typescript@6.0.3)
       xss: 1.0.15
 
   mdn-data@2.0.28: {}
 
-  mdn-data@2.0.30: {}
+  mdn-data@2.27.1: {}
 
-  mdn-data@2.12.2: {}
+  mdn-data@2.29.0: {}
 
-  mdn-data@2.14.0: {}
-
-  mdurl@2.0.0: {}
+  mdurl@2.1.0: {}
 
   medium-zoom@1.1.0: {}
 
-  meow@12.1.1: {}
-
-  meow@13.2.0: {}
-
-  merge-stream@2.0.0: {}
+  meow@14.1.0: {}
 
   merge2@1.4.1: {}
 
   micromatch@4.0.8:
     dependencies:
       braces: 3.0.3
-      picomatch: 2.3.1
+      picomatch: 2.3.2
 
   mime-db@1.52.0: {}
 
+  mime-db@1.54.0: {}
+
   mime-types@2.1.35:
     dependencies:
       mime-db: 1.52.0
 
-  mime@1.6.0: {}
+  mime-types@3.0.2:
+    dependencies:
+      mime-db: 1.54.0
 
-  mime@3.0.0: {}
+  mime@1.6.0:
+    optional: true
 
-  mime@4.0.6: {}
+  mime@2.6.0: {}
 
-  mimic-fn@4.0.0: {}
+  mime@4.1.0: {}
 
   mimic-function@5.0.1: {}
 
-  min-indent@1.0.1: {}
+  mimic-response@1.0.1: {}
 
-  minimatch@10.0.1:
-    dependencies:
-      brace-expansion: 2.0.1
+  mimic-response@3.1.0: {}
 
-  minimatch@3.0.8:
+  minimatch@10.2.6:
     dependencies:
-      brace-expansion: 1.1.11
+      brace-expansion: 5.0.9
 
-  minimatch@3.1.2:
+  minimatch@3.1.5:
     dependencies:
-      brace-expansion: 1.1.11
+      brace-expansion: 1.1.18
 
-  minimatch@5.1.6:
+  minimatch@5.1.9:
     dependencies:
-      brace-expansion: 2.0.1
+      brace-expansion: 2.1.4
 
-  minimatch@7.4.6:
+  minimatch@9.0.9:
     dependencies:
-      brace-expansion: 2.0.1
-
-  minimatch@9.0.1:
-    dependencies:
-      brace-expansion: 2.0.1
-
-  minimatch@9.0.5:
-    dependencies:
-      brace-expansion: 2.0.1
+      brace-expansion: 2.1.4
 
   minimist@1.2.8: {}
 
-  minipass-collect@1.0.2:
+  minipass@7.1.3: {}
+
+  minizlib@3.1.0:
     dependencies:
-      minipass: 3.3.6
-
-  minipass-fetch@1.4.1:
-    dependencies:
-      minipass: 3.3.6
-      minipass-sized: 1.0.3
-      minizlib: 2.1.2
-    optionalDependencies:
-      encoding: 0.1.13
-
-  minipass-flush@1.0.5:
-    dependencies:
-      minipass: 3.3.6
-
-  minipass-pipeline@1.2.4:
-    dependencies:
-      minipass: 3.3.6
-
-  minipass-sized@1.0.3:
-    dependencies:
-      minipass: 3.3.6
-
-  minipass@3.3.6:
-    dependencies:
-      yallist: 4.0.0
-
-  minipass@5.0.0: {}
-
-  minipass@7.1.2: {}
-
-  minizlib@2.1.2:
-    dependencies:
-      minipass: 3.3.6
-      yallist: 4.0.0
-
-  minizlib@3.0.1:
-    dependencies:
-      minipass: 7.1.2
-      rimraf: 5.0.10
+      minipass: 7.1.3
 
   mitt@3.0.1: {}
 
@@ -16606,149 +19832,144 @@ snapshots:
     dependencies:
       minimist: 1.2.8
 
-  mkdirp@1.0.4: {}
-
-  mkdirp@3.0.1: {}
-
-  mkdist@2.1.0(typescript@5.6.3)(vue-tsc@2.1.10(typescript@5.6.3))(vue@3.5.13(typescript@5.6.3)):
+  mkdist@2.4.1(sass@1.102.0)(typescript@6.0.3)(vue-tsc@3.3.9(typescript@6.0.3))(vue@3.5.41(typescript@6.0.3)):
     dependencies:
-      autoprefixer: 10.4.20(postcss@8.4.49)
+      autoprefixer: 10.5.4(postcss@8.5.26)
       citty: 0.1.6
-      cssnano: 7.0.6(postcss@8.4.49)
-      defu: 6.1.4
-      esbuild: 0.24.0
+      cssnano: 7.1.9(postcss@8.5.26)
+      defu: 6.1.7
+      esbuild: 0.25.12
       jiti: 1.21.7
-      mlly: 1.7.3
-      pathe: 1.1.2
-      pkg-types: 1.2.1
-      postcss: 8.4.49
-      postcss-nested: 7.0.2(postcss@8.4.49)
-      semver: 7.6.3
-      tinyglobby: 0.2.10
+      mlly: 1.8.2
+      pathe: 2.0.3
+      pkg-types: 2.3.1
+      postcss: 8.5.26
+      postcss-nested: 7.0.2(postcss@8.5.26)
+      semver: 7.8.5
+      tinyglobby: 0.2.17
     optionalDependencies:
-      typescript: 5.6.3
-      vue: 3.5.13(typescript@5.6.3)
-      vue-tsc: 2.1.10(typescript@5.6.3)
+      sass: 1.102.0
+      typescript: 6.0.3
+      vue: 3.5.41(typescript@6.0.3)
+      vue-tsc: 3.3.9(typescript@6.0.3)
 
-  mlly@1.7.3:
+  mlly@1.8.2:
     dependencies:
-      acorn: 8.14.0
-      pathe: 1.1.2
-      pkg-types: 1.2.1
-      ufo: 1.5.4
+      acorn: 8.18.0
+      pathe: 2.0.3
+      pkg-types: 1.3.1
+      ufo: 1.6.4
+
+  modern-tar@0.7.7: {}
 
   mri@1.2.0: {}
 
-  mrmime@2.0.0: {}
+  mrmime@2.0.1: {}
 
-  ms@2.0.0: {}
+  ms@2.0.0:
+    optional: true
 
   ms@2.1.3: {}
 
   muggle-string@0.4.1: {}
 
-  multimatch@5.0.0:
-    dependencies:
-      '@types/minimatch': 3.0.5
-      array-differ: 3.0.0
-      array-union: 2.1.0
-      arrify: 2.0.1
-      minimatch: 3.1.2
-
-  mz@2.7.0:
-    dependencies:
-      any-promise: 1.3.0
-      object-assign: 4.1.1
-      thenify-all: 1.6.0
-
-  nanoid@3.3.8: {}
-
-  nanoid@5.0.9: {}
+  nanoid@3.3.18: {}
 
   nanopop@2.4.2: {}
 
-  natural-compare-lite@1.4.0: {}
-
   natural-compare@1.4.0: {}
 
-  needle@3.3.1:
+  natural-orderby@5.0.0: {}
+
+  needle@2.9.1(supports-color@10.2.2):
+    dependencies:
+      debug: 3.2.7(supports-color@10.2.2)
+      iconv-lite: 0.4.24
+      sax: 1.6.1
+    transitivePeerDependencies:
+      - supports-color
+    optional: true
+
+  needle@3.5.0:
     dependencies:
       iconv-lite: 0.6.3
-      sax: 1.4.1
+      sax: 1.6.1
     optional: true
 
   next-tick@1.1.0: {}
 
-  nitropack@2.10.4(encoding@0.1.13)(typescript@5.7.2):
+  nitropack@2.13.4(@parcel/watcher@2.6.0)(oxc-parser@0.142.0)(rolldown@1.2.3)(supports-color@10.2.2)(vite@8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0)):
     dependencies:
-      '@cloudflare/kv-asset-handler': 0.3.4
-      '@netlify/functions': 2.8.2
-      '@rollup/plugin-alias': 5.1.1(rollup@4.28.1)
-      '@rollup/plugin-commonjs': 28.0.2(rollup@4.28.1)
-      '@rollup/plugin-inject': 5.0.5(rollup@4.28.1)
-      '@rollup/plugin-json': 6.1.0(rollup@4.28.1)
-      '@rollup/plugin-node-resolve': 15.3.1(rollup@4.28.1)
-      '@rollup/plugin-replace': 6.0.2(rollup@4.28.1)
-      '@rollup/plugin-terser': 0.4.4(rollup@4.28.1)
-      '@rollup/pluginutils': 5.1.4(rollup@4.28.1)
-      '@types/http-proxy': 1.17.15
-      '@vercel/nft': 0.27.10(encoding@0.1.13)(rollup@4.28.1)
+      '@cloudflare/kv-asset-handler': 0.4.2
+      '@rollup/plugin-alias': 6.0.0(rollup@4.62.4)
+      '@rollup/plugin-commonjs': 29.0.3(rollup@4.62.4)
+      '@rollup/plugin-inject': 5.0.5(rollup@4.62.4)
+      '@rollup/plugin-json': 6.1.0(rollup@4.62.4)
+      '@rollup/plugin-node-resolve': 16.0.3(rollup@4.62.4)
+      '@rollup/plugin-replace': 6.0.3(rollup@4.62.4)
+      '@rollup/plugin-terser': 1.0.0(rollup@4.62.4)
+      '@vercel/nft': 1.10.2(rollup@4.62.4)(supports-color@10.2.2)
       archiver: 7.0.1
-      c12: 2.0.1(magicast@0.3.5)
-      chokidar: 3.6.0
-      citty: 0.1.6
-      compatx: 0.1.8
-      confbox: 0.1.8
-      consola: 3.3.0
-      cookie-es: 1.2.2
-      croner: 9.0.0
-      crossws: 0.3.1
-      db0: 0.2.1
-      defu: 6.1.4
-      destr: 2.0.3
-      dot-prop: 9.0.0
-      esbuild: 0.24.0
+      c12: 3.3.4(magicast@0.5.4)
+      chokidar: 5.0.0
+      citty: 0.2.2
+      compatx: 0.2.0
+      confbox: 0.2.4
+      consola: 3.4.2
+      cookie-es: 2.0.1
+      croner: 10.0.1
+      crossws: 0.3.5
+      db0: 0.3.4
+      defu: 6.1.7
+      destr: 2.0.5
+      dot-prop: 10.2.0
+      esbuild: 0.28.2
       escape-string-regexp: 5.0.0
       etag: 1.8.1
-      fs-extra: 11.2.0
-      globby: 14.0.2
+      exsolve: 1.1.1
+      globby: 16.2.3
       gzip-size: 7.0.0
-      h3: 1.13.0
+      h3: 1.15.11
       hookable: 5.5.3
-      httpxy: 0.1.5
-      ioredis: 5.4.2
-      jiti: 2.4.2
+      httpxy: 0.5.5
+      ioredis: 5.11.1(supports-color@10.2.2)
+      jiti: 2.7.0
       klona: 2.0.6
-      knitwork: 1.2.0
-      listhen: 1.9.0
-      magic-string: 0.30.17
-      magicast: 0.3.5
-      mime: 4.0.6
-      mlly: 1.7.3
-      node-fetch-native: 1.6.4
-      ofetch: 1.4.1
-      ohash: 1.1.4
-      openapi-typescript: 7.4.4(encoding@0.1.13)(typescript@5.7.2)
-      pathe: 1.1.2
-      perfect-debounce: 1.0.0
-      pkg-types: 1.2.1
-      pretty-bytes: 6.1.1
+      knitwork: 1.3.0
+      listhen: 1.10.1(@parcel/watcher@2.6.0)
+      magic-string: 0.30.21
+      magicast: 0.5.4
+      mime: 4.1.0
+      mlly: 1.8.2
+      node-fetch-native: 1.6.7
+      node-mock-http: 1.0.5
+      ofetch: 1.5.1
+      ohash: 2.0.11
+      pathe: 2.0.3
+      perfect-debounce: 2.1.0
+      pkg-types: 2.3.1
+      pretty-bytes: 7.1.1
       radix3: 1.1.2
-      rollup: 4.28.1
-      rollup-plugin-visualizer: 5.12.0(rollup@4.28.1)
+      rollup: 4.62.4
+      rollup-plugin-visualizer: 7.0.1(rolldown@1.2.3)(rollup@4.62.4)
       scule: 1.3.0
-      semver: 7.6.3
+      semver: 7.8.5
       serve-placeholder: 2.0.2
-      serve-static: 1.16.2
-      std-env: 3.8.0
-      ufo: 1.5.4
+      serve-static: 2.2.1(supports-color@10.2.2)
+      source-map: 0.7.6
+      std-env: 4.2.0
+      ufo: 1.6.4
+      ultrahtml: 1.7.0
       uncrypto: 0.1.3
-      unctx: 2.4.1
-      unenv: 1.10.0
-      unimport: 3.14.5(rollup@4.28.1)
-      unstorage: 1.14.1(db0@0.2.1)(ioredis@5.4.2)
-      untyped: 1.5.2
-      unwasm: 0.3.9
+      unctx: 2.5.0
+      unenv: 2.0.0-rc.24
+      unimport: 6.4.0(esbuild@0.28.2)(oxc-parser@0.142.0)(rolldown@1.2.3)(rollup@4.62.4)(vite@8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0))
+      unplugin-utils: 0.3.2
+      unstorage: 1.17.5(db0@0.3.4)(ioredis@5.11.1(supports-color@10.2.2))
+      untyped: 2.0.0
+      unwasm: 0.5.3
+      youch: 4.1.1
+      youch-core: 0.3.3
     transitivePeerDependencies:
       - '@azure/app-configuration'
       - '@azure/cosmos'
@@ -16759,85 +19980,100 @@ snapshots:
       - '@capacitor/preferences'
       - '@deno/kv'
       - '@electric-sql/pglite'
+      - '@farmfe/core'
       - '@libsql/client'
       - '@netlify/blobs'
+      - '@parcel/watcher'
       - '@planetscale/database'
+      - '@rspack/core'
       - '@upstash/redis'
       - '@vercel/blob'
+      - '@vercel/functions'
       - '@vercel/kv'
       - aws4fetch
+      - bare-abort-controller
+      - bare-buffer
       - better-sqlite3
+      - bun-types-no-globals
       - drizzle-orm
       - encoding
       - idb-keyval
       - mysql2
+      - oxc-parser
+      - react-native-b4a
+      - rolldown
+      - sqlite3
+      - srvx
       - supports-color
-      - typescript
+      - unloader
       - uploadthing
+      - vite
+      - webpack
 
   no-case@3.0.4:
     dependencies:
       lower-case: 2.0.2
       tslib: 2.8.1
 
-  node-addon-api@7.1.1: {}
+  node-abi@4.33.0:
+    dependencies:
+      semver: 7.8.5
+
+  node-addon-api@7.1.1:
+    optional: true
+
+  node-api-version@0.2.1:
+    dependencies:
+      semver: 7.8.5
 
   node-cleanup@2.1.2: {}
 
-  node-fetch-native@1.6.4: {}
+  node-fetch-native@1.6.7: {}
 
-  node-fetch@2.7.0(encoding@0.1.13):
+  node-fetch@2.7.0:
     dependencies:
       whatwg-url: 5.0.0
-    optionalDependencies:
-      encoding: 0.1.13
 
-  node-forge@1.3.1: {}
+  node-forge@1.4.0: {}
 
   node-gyp-build@4.8.4: {}
 
-  node-html-parser@5.4.2:
+  node-gyp@12.4.0:
     dependencies:
-      css-select: 4.3.0
-      he: 1.2.0
+      env-paths: 2.2.1
+      exponential-backoff: 3.1.3
+      graceful-fs: 4.2.11
+      nopt: 9.0.0
+      proc-log: 6.1.0
+      semver: 7.8.5
+      tar: 7.5.22
+      tinyglobby: 0.2.17
+      undici: 6.28.0
+      which: 6.0.1
 
-  node-releases@2.0.19: {}
+  node-int64@0.4.0: {}
+
+  node-mock-http@1.0.5: {}
+
+  node-releases@2.0.53: {}
 
   nopt@7.2.1:
     dependencies:
       abbrev: 2.0.0
 
-  nopt@8.0.0:
+  nopt@8.1.0:
     dependencies:
-      abbrev: 2.0.0
+      abbrev: 3.0.1
 
-  normalize-package-data@2.5.0:
+  nopt@9.0.0:
     dependencies:
-      hosted-git-info: 2.8.9
-      resolve: 1.22.10
-      semver: 5.7.2
-      validate-npm-package-license: 3.0.4
+      abbrev: 4.0.0
 
   normalize-path@3.0.0: {}
 
-  normalize-range@0.1.2: {}
+  normalize-url@6.1.0: {}
 
-  npm-bundled@2.0.1:
-    dependencies:
-      npm-normalize-package-bin: 2.0.0
-
-  npm-normalize-package-bin@2.0.0: {}
-
-  npm-packlist@5.1.3:
-    dependencies:
-      glob: 8.1.0
-      ignore-walk: 5.0.1
-      npm-bundled: 2.0.1
-      npm-normalize-package-bin: 2.0.0
-
-  npm-run-path@5.3.0:
-    dependencies:
-      path-key: 4.0.0
+  nostics@1.2.0: {}
 
   npm-run-path@6.0.0:
     dependencies:
@@ -16850,44 +20086,28 @@ snapshots:
     dependencies:
       boolbase: 1.0.0
 
-  nypm@0.3.12:
-    dependencies:
-      citty: 0.1.6
-      consola: 3.3.0
-      execa: 8.0.1
-      pathe: 1.1.2
-      pkg-types: 1.2.1
-      ufo: 1.5.4
-
-  object-assign@4.1.1: {}
-
-  object-hash@3.0.0: {}
-
-  object-inspect@1.13.3: {}
-
-  object-is@1.1.6:
-    dependencies:
-      call-bind: 1.0.8
-      define-properties: 1.2.1
+  object-inspect@1.13.4: {}
 
   object-keys@1.1.1: {}
 
   object.assign@4.1.7:
     dependencies:
-      call-bind: 1.0.8
-      call-bound: 1.0.3
+      call-bind: 1.0.9
+      call-bound: 1.0.4
       define-properties: 1.2.1
-      es-object-atoms: 1.0.0
+      es-object-atoms: 1.1.2
       has-symbols: 1.1.0
       object-keys: 1.1.1
 
-  ofetch@1.4.1:
-    dependencies:
-      destr: 2.0.3
-      node-fetch-native: 1.6.4
-      ufo: 1.5.4
+  obug@2.1.4: {}
 
-  ohash@1.1.4: {}
+  ofetch@1.5.1:
+    dependencies:
+      destr: 2.0.5
+      node-fetch-native: 1.6.7
+      ufo: 1.6.4
+
+  ohash@2.0.11: {}
 
   on-finished@2.4.1:
     dependencies:
@@ -16897,38 +20117,18 @@ snapshots:
     dependencies:
       wrappy: 1.0.2
 
-  onetime@6.0.0:
-    dependencies:
-      mimic-fn: 4.0.0
-
   onetime@7.0.0:
     dependencies:
       mimic-function: 5.0.1
 
-  open@10.1.0:
+  open@11.0.0:
     dependencies:
-      default-browser: 5.2.1
+      default-browser: 5.5.0
       define-lazy-prop: 3.0.0
+      is-in-ssh: 1.0.0
       is-inside-container: 1.0.0
-      is-wsl: 3.1.0
-
-  open@8.4.2:
-    dependencies:
-      define-lazy-prop: 2.0.0
-      is-docker: 2.2.1
-      is-wsl: 2.2.0
-
-  openapi-typescript@7.4.4(encoding@0.1.13)(typescript@5.7.2):
-    dependencies:
-      '@redocly/openapi-core': 1.26.1(encoding@0.1.13)(supports-color@9.4.0)
-      ansi-colors: 4.1.3
-      change-case: 5.4.4
-      parse-json: 8.1.0
-      supports-color: 9.4.0
-      typescript: 5.7.2
-      yargs-parser: 21.1.1
-    transitivePeerDependencies:
-      - encoding
+      powershell-utils: 0.1.0
+      wsl-utils: 0.3.1
 
   optionator@0.9.4:
     dependencies:
@@ -16939,22 +20139,133 @@ snapshots:
       type-check: 0.4.0
       word-wrap: 1.2.5
 
-  ora@8.1.1:
+  ora@9.4.1:
     dependencies:
-      chalk: 5.4.0
+      chalk: 5.6.2
       cli-cursor: 5.0.0
-      cli-spinners: 2.9.2
+      cli-spinners: 3.4.0
       is-interactive: 2.0.0
       is-unicode-supported: 2.1.0
-      log-symbols: 6.0.0
-      stdin-discarder: 0.2.2
-      string-width: 7.2.0
-      strip-ansi: 7.1.0
+      log-symbols: 7.0.1
+      stdin-discarder: 0.3.2
+      string-width: 8.2.2
 
-  os-tmpdir@1.0.2: {}
+  orderedmap@2.1.1: {}
 
   outdent@0.5.0: {}
 
+  own-keys@1.0.2:
+    dependencies:
+      call-bound: 1.0.4
+      get-intrinsic: 1.3.0
+      object-keys: 1.1.1
+      safe-push-apply: 1.0.0
+
+  oxc-parser@0.142.0:
+    dependencies:
+      '@oxc-project/types': 0.142.0
+    optionalDependencies:
+      '@oxc-parser/binding-android-arm-eabi': 0.142.0
+      '@oxc-parser/binding-android-arm64': 0.142.0
+      '@oxc-parser/binding-darwin-arm64': 0.142.0
+      '@oxc-parser/binding-darwin-x64': 0.142.0
+      '@oxc-parser/binding-freebsd-x64': 0.142.0
+      '@oxc-parser/binding-linux-arm-gnueabihf': 0.142.0
+      '@oxc-parser/binding-linux-arm-musleabihf': 0.142.0
+      '@oxc-parser/binding-linux-arm64-gnu': 0.142.0
+      '@oxc-parser/binding-linux-arm64-musl': 0.142.0
+      '@oxc-parser/binding-linux-ppc64-gnu': 0.142.0
+      '@oxc-parser/binding-linux-riscv64-gnu': 0.142.0
+      '@oxc-parser/binding-linux-riscv64-musl': 0.142.0
+      '@oxc-parser/binding-linux-s390x-gnu': 0.142.0
+      '@oxc-parser/binding-linux-x64-gnu': 0.142.0
+      '@oxc-parser/binding-linux-x64-musl': 0.142.0
+      '@oxc-parser/binding-openharmony-arm64': 0.142.0
+      '@oxc-parser/binding-wasm32-wasi': 0.142.0
+      '@oxc-parser/binding-win32-arm64-msvc': 0.142.0
+      '@oxc-parser/binding-win32-ia32-msvc': 0.142.0
+      '@oxc-parser/binding-win32-x64-msvc': 0.142.0
+
+  oxc-resolver@11.24.2:
+    optionalDependencies:
+      '@oxc-resolver/binding-android-arm-eabi': 11.24.2
+      '@oxc-resolver/binding-android-arm64': 11.24.2
+      '@oxc-resolver/binding-darwin-arm64': 11.24.2
+      '@oxc-resolver/binding-darwin-x64': 11.24.2
+      '@oxc-resolver/binding-freebsd-x64': 11.24.2
+      '@oxc-resolver/binding-linux-arm-gnueabihf': 11.24.2
+      '@oxc-resolver/binding-linux-arm-musleabihf': 11.24.2
+      '@oxc-resolver/binding-linux-arm64-gnu': 11.24.2
+      '@oxc-resolver/binding-linux-arm64-musl': 11.24.2
+      '@oxc-resolver/binding-linux-ppc64-gnu': 11.24.2
+      '@oxc-resolver/binding-linux-riscv64-gnu': 11.24.2
+      '@oxc-resolver/binding-linux-riscv64-musl': 11.24.2
+      '@oxc-resolver/binding-linux-s390x-gnu': 11.24.2
+      '@oxc-resolver/binding-linux-x64-gnu': 11.24.2
+      '@oxc-resolver/binding-linux-x64-musl': 11.24.2
+      '@oxc-resolver/binding-openharmony-arm64': 11.24.2
+      '@oxc-resolver/binding-wasm32-wasi': 11.24.2
+      '@oxc-resolver/binding-win32-arm64-msvc': 11.24.2
+      '@oxc-resolver/binding-win32-x64-msvc': 11.24.2
+
+  oxfmt@0.60.0:
+    dependencies:
+      tinypool: 2.1.0
+    optionalDependencies:
+      '@oxfmt/binding-android-arm-eabi': 0.60.0
+      '@oxfmt/binding-android-arm64': 0.60.0
+      '@oxfmt/binding-darwin-arm64': 0.60.0
+      '@oxfmt/binding-darwin-x64': 0.60.0
+      '@oxfmt/binding-freebsd-x64': 0.60.0
+      '@oxfmt/binding-linux-arm-gnueabihf': 0.60.0
+      '@oxfmt/binding-linux-arm-musleabihf': 0.60.0
+      '@oxfmt/binding-linux-arm64-gnu': 0.60.0
+      '@oxfmt/binding-linux-arm64-musl': 0.60.0
+      '@oxfmt/binding-linux-ppc64-gnu': 0.60.0
+      '@oxfmt/binding-linux-riscv64-gnu': 0.60.0
+      '@oxfmt/binding-linux-riscv64-musl': 0.60.0
+      '@oxfmt/binding-linux-s390x-gnu': 0.60.0
+      '@oxfmt/binding-linux-x64-gnu': 0.60.0
+      '@oxfmt/binding-linux-x64-musl': 0.60.0
+      '@oxfmt/binding-openharmony-arm64': 0.60.0
+      '@oxfmt/binding-win32-arm64-msvc': 0.60.0
+      '@oxfmt/binding-win32-ia32-msvc': 0.60.0
+      '@oxfmt/binding-win32-x64-msvc': 0.60.0
+
+  oxlint-tsgolint@0.25.0:
+    optionalDependencies:
+      '@oxlint-tsgolint/darwin-arm64': 0.25.0
+      '@oxlint-tsgolint/darwin-x64': 0.25.0
+      '@oxlint-tsgolint/linux-arm64': 0.25.0
+      '@oxlint-tsgolint/linux-x64': 0.25.0
+      '@oxlint-tsgolint/win32-arm64': 0.25.0
+      '@oxlint-tsgolint/win32-x64': 0.25.0
+
+  oxlint@1.77.0(oxlint-tsgolint@0.25.0):
+    optionalDependencies:
+      '@oxlint/binding-android-arm-eabi': 1.77.0
+      '@oxlint/binding-android-arm64': 1.77.0
+      '@oxlint/binding-darwin-arm64': 1.77.0
+      '@oxlint/binding-darwin-x64': 1.77.0
+      '@oxlint/binding-freebsd-x64': 1.77.0
+      '@oxlint/binding-linux-arm-gnueabihf': 1.77.0
+      '@oxlint/binding-linux-arm-musleabihf': 1.77.0
+      '@oxlint/binding-linux-arm64-gnu': 1.77.0
+      '@oxlint/binding-linux-arm64-musl': 1.77.0
+      '@oxlint/binding-linux-ppc64-gnu': 1.77.0
+      '@oxlint/binding-linux-riscv64-gnu': 1.77.0
+      '@oxlint/binding-linux-riscv64-musl': 1.77.0
+      '@oxlint/binding-linux-s390x-gnu': 1.77.0
+      '@oxlint/binding-linux-x64-gnu': 1.77.0
+      '@oxlint/binding-linux-x64-musl': 1.77.0
+      '@oxlint/binding-openharmony-arm64': 1.77.0
+      '@oxlint/binding-win32-arm64-msvc': 1.77.0
+      '@oxlint/binding-win32-ia32-msvc': 1.77.0
+      '@oxlint/binding-win32-x64-msvc': 1.77.0
+      oxlint-tsgolint: 0.25.0
+
+  p-cancelable@2.1.1: {}
+
   p-filter@2.1.0:
     dependencies:
       p-map: 2.1.0
@@ -16969,7 +20280,7 @@ snapshots:
 
   p-limit@4.0.0:
     dependencies:
-      yocto-queue: 1.1.1
+      yocto-queue: 1.2.2
 
   p-locate@4.1.0:
     dependencies:
@@ -16985,77 +20296,62 @@ snapshots:
 
   p-map@2.1.0: {}
 
-  p-map@4.0.0:
-    dependencies:
-      aggregate-error: 3.1.0
-
   p-try@2.2.0: {}
 
   package-json-from-dist@1.0.1: {}
 
   package-json@10.0.1:
     dependencies:
-      ky: 1.7.4
-      registry-auth-token: 5.0.3
+      ky: 1.14.3
+      registry-auth-token: 5.1.1
       registry-url: 6.0.1
-      semver: 7.6.3
+      semver: 7.8.5
 
-  package-manager-detector@0.2.7: {}
+  package-manager-detector@0.2.11:
+    dependencies:
+      quansync: 0.2.11
+
+  package-manager-detector@1.8.0: {}
 
   pako@1.0.11: {}
 
+  pako@2.2.0: {}
+
   param-case@3.0.4:
     dependencies:
       dot-case: 3.0.4
       tslib: 2.8.1
 
-  parchment@1.1.4: {}
+  parchment@3.0.0: {}
 
   parent-module@1.0.1:
     dependencies:
       callsites: 3.1.0
 
-  parent-module@2.0.0:
-    dependencies:
-      callsites: 3.1.0
-
-  parse-imports@2.2.1:
-    dependencies:
-      es-module-lexer: 1.5.4
-      slashes: 3.0.12
-
   parse-json@5.2.0:
     dependencies:
-      '@babel/code-frame': 7.26.2
-      error-ex: 1.3.2
+      '@babel/code-frame': 7.29.7
+      error-ex: 1.3.4
       json-parse-even-better-errors: 2.3.1
       lines-and-columns: 1.2.4
 
-  parse-json@8.1.0:
-    dependencies:
-      '@babel/code-frame': 7.26.2
-      index-to-position: 0.1.2
-      type-fest: 4.30.2
-
   parse-ms@4.0.0: {}
 
   parse-node-version@1.0.1:
     optional: true
 
-  parse-passwd@1.0.0: {}
-
   parse5-htmlparser2-tree-adapter@7.1.0:
     dependencies:
       domhandler: 5.0.3
-      parse5: 7.2.1
+      parse5: 7.3.0
 
   parse5-parser-stream@7.1.2:
     dependencies:
-      parse5: 7.2.1
+      parse5: 7.3.0
 
-  parse5@7.2.1:
+  parse5@7.3.0:
     dependencies:
-      entities: 4.5.0
+      entities: 6.0.1
 
   parseurl@1.3.3: {}
 
@@ -17068,8 +20364,6 @@ snapshots:
 
   path-exists@4.0.0: {}
 
-  path-exists@5.0.0: {}
-
   path-is-absolute@1.0.1: {}
 
   path-key@3.1.1: {}
@@ -17081,654 +20375,503 @@ snapshots:
   path-scurry@1.11.1:
     dependencies:
       lru-cache: 10.4.3
-      minipass: 7.1.2
+      minipass: 7.1.3
 
-  path-scurry@2.0.0:
+  path-scurry@2.0.2:
     dependencies:
-      lru-cache: 11.0.2
-      minipass: 7.1.2
+      lru-cache: 11.5.2
+      minipass: 7.1.3
 
   path-type@4.0.0: {}
 
-  path-type@5.0.0: {}
+  pathe@2.0.3: {}
 
-  pathe@0.2.0: {}
+  pe-library@0.4.1: {}
 
-  pathe@1.1.2: {}
-
-  pathval@2.0.0: {}
-
-  perfect-debounce@1.0.0: {}
+  perfect-debounce@2.1.0: {}
 
   picocolors@1.1.1: {}
 
-  picomatch@2.3.1: {}
+  picomatch@2.3.2: {}
 
-  picomatch@4.0.2: {}
-
-  pidtree@0.6.0: {}
-
-  pify@2.3.0: {}
+  picomatch@4.0.5: {}
 
   pify@4.0.1: {}
 
-  pinia-plugin-persistedstate@4.2.0(magicast@0.3.5)(pinia@2.2.2(typescript@5.7.2)(vue@3.5.13(typescript@5.7.2)))(rollup@4.28.1):
+  pinia-plugin-persistedstate@4.7.1(@nuxt/kit@3.21.11(magicast@0.5.4))(pinia@4.0.2(@vue/devtools-api@8.2.1)(typescript@6.0.3)(vue@3.5.41(typescript@6.0.3))):
     dependencies:
-      '@nuxt/kit': 3.14.1592(magicast@0.3.5)(rollup@4.28.1)
-      deep-pick-omit: 1.2.1
-      defu: 6.1.4
-      destr: 2.0.3
+      defu: 6.1.7
     optionalDependencies:
-      pinia: 2.2.2(typescript@5.7.2)(vue@3.5.13(typescript@5.7.2))
-    transitivePeerDependencies:
-      - magicast
-      - rollup
-      - supports-color
+      '@nuxt/kit': 3.21.11(magicast@0.5.4)
+      pinia: 4.0.2(@vue/devtools-api@8.2.1)(typescript@6.0.3)(vue@3.5.41(typescript@6.0.3))
 
-  pinia@2.2.2(typescript@5.7.2)(vue@3.5.13(typescript@5.7.2)):
+  pinia@4.0.2(@vue/devtools-api@8.2.1)(typescript@6.0.3)(vue@3.5.41(typescript@6.0.3)):
     dependencies:
-      '@vue/devtools-api': 6.6.4
-      vue: 3.5.13(typescript@5.7.2)
-      vue-demi: 0.14.10(vue@3.5.13(typescript@5.7.2))
+      '@vue/devtools-api': 8.2.1
+      nostics: 1.2.0
+      vue: 3.5.41(typescript@6.0.3)
     optionalDependencies:
-      typescript: 5.7.2
+      typescript: 6.0.3
 
-  pirates@4.0.6: {}
-
-  pkg-types@1.2.1:
+  pkg-types@1.3.1:
     dependencies:
       confbox: 0.1.8
-      mlly: 1.7.3
-      pathe: 1.1.2
+      mlly: 1.8.2
+      pathe: 2.0.3
 
-  playwright-core@1.49.1: {}
-
-  playwright@1.49.1:
+  pkg-types@2.3.1:
     dependencies:
-      playwright-core: 1.49.1
+      confbox: 0.2.4
+      exsolve: 1.1.1
+      pathe: 2.0.3
+
+  pkijs@3.4.0:
+    dependencies:
+      '@noble/hashes': 1.4.0
+      asn1js: 3.0.10
+      bytestreamjs: 2.0.1
+      pvtsutils: 1.3.6
+      pvutils: 1.2.0
+      tslib: 2.8.1
+
+  playwright-core@1.62.1: {}
+
+  playwright@1.62.1:
+    dependencies:
+      playwright-core: 1.62.1
     optionalDependencies:
       fsevents: 2.3.2
 
-  please-upgrade-node@3.2.0:
+  plist@3.1.0:
     dependencies:
-      semver-compare: 1.0.0
-
-  pluralize@8.0.0: {}
+      '@xmldom/xmldom': 0.8.13
+      base64-js: 1.5.1
+      xmlbuilder: 15.1.1
 
   pngjs@5.0.0: {}
 
-  possible-typed-array-names@1.0.0: {}
-
-  postcss-antd-fixes@0.2.0(postcss@8.4.49):
+  pnpm-workspace-yaml@1.7.0:
     dependencies:
-      postcss: 8.4.49
+      yaml: 2.9.0
 
-  postcss-attribute-case-insensitive@7.0.1(postcss@8.4.49):
+  popmotion@11.0.5:
     dependencies:
-      postcss: 8.4.49
-      postcss-selector-parser: 7.0.0
+      framesync: 6.1.2
+      hey-listen: 1.0.8
+      style-value-types: 5.1.2
+      tslib: 2.4.0
 
-  postcss-calc@10.0.2(postcss@8.4.49):
+  possible-typed-array-names@1.1.0: {}
+
+  postcss-calc@10.1.1(postcss@8.5.26):
     dependencies:
-      postcss: 8.4.49
-      postcss-selector-parser: 6.1.2
+      postcss: 8.5.26
+      postcss-selector-parser: 7.1.5
       postcss-value-parser: 4.2.0
 
-  postcss-clamp@4.1.0(postcss@8.4.49):
+  postcss-colormin@7.0.10(postcss@8.5.26):
     dependencies:
-      postcss: 8.4.49
-      postcss-value-parser: 4.2.0
-
-  postcss-color-functional-notation@7.0.6(postcss@8.4.49):
-    dependencies:
-      '@csstools/css-color-parser': 3.0.6(@csstools/css-parser-algorithms@3.0.4(@csstools/css-tokenizer@3.0.3))(@csstools/css-tokenizer@3.0.3)
-      '@csstools/css-parser-algorithms': 3.0.4(@csstools/css-tokenizer@3.0.3)
-      '@csstools/css-tokenizer': 3.0.3
-      '@csstools/postcss-progressive-custom-properties': 4.0.0(postcss@8.4.49)
-      '@csstools/utilities': 2.0.0(postcss@8.4.49)
-      postcss: 8.4.49
-
-  postcss-color-hex-alpha@10.0.0(postcss@8.4.49):
-    dependencies:
-      '@csstools/utilities': 2.0.0(postcss@8.4.49)
-      postcss: 8.4.49
-      postcss-value-parser: 4.2.0
-
-  postcss-color-rebeccapurple@10.0.0(postcss@8.4.49):
-    dependencies:
-      '@csstools/utilities': 2.0.0(postcss@8.4.49)
-      postcss: 8.4.49
-      postcss-value-parser: 4.2.0
-
-  postcss-colormin@7.0.2(postcss@8.4.49):
-    dependencies:
-      browserslist: 4.24.3
+      '@colordx/core': 5.5.0
+      browserslist: 4.28.8
       caniuse-api: 3.0.0
-      colord: 2.9.3
-      postcss: 8.4.49
+      postcss: 8.5.26
       postcss-value-parser: 4.2.0
 
-  postcss-convert-values@7.0.4(postcss@8.4.49):
+  postcss-convert-values@7.0.12(postcss@8.5.26):
     dependencies:
-      browserslist: 4.24.3
-      postcss: 8.4.49
+      browserslist: 4.28.8
+      postcss: 8.5.26
       postcss-value-parser: 4.2.0
 
-  postcss-custom-media@11.0.5(postcss@8.4.49):
+  postcss-discard-comments@7.0.8(postcss@8.5.26):
     dependencies:
-      '@csstools/cascade-layer-name-parser': 2.0.4(@csstools/css-parser-algorithms@3.0.4(@csstools/css-tokenizer@3.0.3))(@csstools/css-tokenizer@3.0.3)
-      '@csstools/css-parser-algorithms': 3.0.4(@csstools/css-tokenizer@3.0.3)
-      '@csstools/css-tokenizer': 3.0.3
-      '@csstools/media-query-list-parser': 4.0.2(@csstools/css-parser-algorithms@3.0.4(@csstools/css-tokenizer@3.0.3))(@csstools/css-tokenizer@3.0.3)
-      postcss: 8.4.49
+      postcss: 8.5.26
+      postcss-selector-parser: 7.1.5
 
-  postcss-custom-properties@14.0.4(postcss@8.4.49):
+  postcss-discard-duplicates@7.0.4(postcss@8.5.26):
     dependencies:
-      '@csstools/cascade-layer-name-parser': 2.0.4(@csstools/css-parser-algorithms@3.0.4(@csstools/css-tokenizer@3.0.3))(@csstools/css-tokenizer@3.0.3)
-      '@csstools/css-parser-algorithms': 3.0.4(@csstools/css-tokenizer@3.0.3)
-      '@csstools/css-tokenizer': 3.0.3
-      '@csstools/utilities': 2.0.0(postcss@8.4.49)
-      postcss: 8.4.49
-      postcss-value-parser: 4.2.0
+      postcss: 8.5.26
 
-  postcss-custom-selectors@8.0.4(postcss@8.4.49):
+  postcss-discard-empty@7.0.3(postcss@8.5.26):
     dependencies:
-      '@csstools/cascade-layer-name-parser': 2.0.4(@csstools/css-parser-algorithms@3.0.4(@csstools/css-tokenizer@3.0.3))(@csstools/css-tokenizer@3.0.3)
-      '@csstools/css-parser-algorithms': 3.0.4(@csstools/css-tokenizer@3.0.3)
-      '@csstools/css-tokenizer': 3.0.3
-      postcss: 8.4.49
-      postcss-selector-parser: 7.0.0
+      postcss: 8.5.26
 
-  postcss-dir-pseudo-class@9.0.1(postcss@8.4.49):
+  postcss-discard-overridden@7.0.3(postcss@8.5.26):
     dependencies:
-      postcss: 8.4.49
-      postcss-selector-parser: 7.0.0
+      postcss: 8.5.26
 
-  postcss-discard-comments@7.0.3(postcss@8.4.49):
-    dependencies:
-      postcss: 8.4.49
-      postcss-selector-parser: 6.1.2
-
-  postcss-discard-duplicates@7.0.1(postcss@8.4.49):
-    dependencies:
-      postcss: 8.4.49
-
-  postcss-discard-empty@7.0.0(postcss@8.4.49):
-    dependencies:
-      postcss: 8.4.49
-
-  postcss-discard-overridden@7.0.0(postcss@8.4.49):
-    dependencies:
-      postcss: 8.4.49
-
-  postcss-double-position-gradients@6.0.0(postcss@8.4.49):
-    dependencies:
-      '@csstools/postcss-progressive-custom-properties': 4.0.0(postcss@8.4.49)
-      '@csstools/utilities': 2.0.0(postcss@8.4.49)
-      postcss: 8.4.49
-      postcss-value-parser: 4.2.0
-
-  postcss-focus-visible@10.0.1(postcss@8.4.49):
-    dependencies:
-      postcss: 8.4.49
-      postcss-selector-parser: 7.0.0
-
-  postcss-focus-within@9.0.1(postcss@8.4.49):
-    dependencies:
-      postcss: 8.4.49
-      postcss-selector-parser: 7.0.0
-
-  postcss-font-variant@5.0.0(postcss@8.4.49):
-    dependencies:
-      postcss: 8.4.49
-
-  postcss-gap-properties@6.0.0(postcss@8.4.49):
-    dependencies:
-      postcss: 8.4.49
-
-  postcss-html@1.7.0:
+  postcss-html@1.8.1:
     dependencies:
       htmlparser2: 8.0.2
       js-tokens: 9.0.1
-      postcss: 8.4.49
-      postcss-safe-parser: 6.0.0(postcss@8.4.49)
+      postcss: 8.5.26
+      postcss-safe-parser: 6.0.0(postcss@8.5.26)
 
-  postcss-image-set-function@7.0.0(postcss@8.4.49):
-    dependencies:
-      '@csstools/utilities': 2.0.0(postcss@8.4.49)
-      postcss: 8.4.49
-      postcss-value-parser: 4.2.0
-
-  postcss-import@15.1.0(postcss@8.4.49):
-    dependencies:
-      postcss: 8.4.49
-      postcss-value-parser: 4.2.0
-      read-cache: 1.0.0
-      resolve: 1.22.10
-
-  postcss-import@16.1.0(postcss@8.4.49):
-    dependencies:
-      postcss: 8.4.49
-      postcss-value-parser: 4.2.0
-      read-cache: 1.0.0
-      resolve: 1.22.10
-
-  postcss-js@4.0.1(postcss@8.4.49):
-    dependencies:
-      camelcase-css: 2.0.1
-      postcss: 8.4.49
-
-  postcss-lab-function@7.0.6(postcss@8.4.49):
-    dependencies:
-      '@csstools/css-color-parser': 3.0.6(@csstools/css-parser-algorithms@3.0.4(@csstools/css-tokenizer@3.0.3))(@csstools/css-tokenizer@3.0.3)
-      '@csstools/css-parser-algorithms': 3.0.4(@csstools/css-tokenizer@3.0.3)
-      '@csstools/css-tokenizer': 3.0.3
-      '@csstools/postcss-progressive-custom-properties': 4.0.0(postcss@8.4.49)
-      '@csstools/utilities': 2.0.0(postcss@8.4.49)
-      postcss: 8.4.49
-
-  postcss-load-config@4.0.2(postcss@8.4.49):
+  postcss-load-config@6.0.1(jiti@2.7.0)(postcss@8.5.26)(yaml@2.9.0):
     dependencies:
       lilconfig: 3.1.3
-      yaml: 2.6.1
     optionalDependencies:
-      postcss: 8.4.49
-
-  postcss-logical@8.0.0(postcss@8.4.49):
-    dependencies:
-      postcss: 8.4.49
-      postcss-value-parser: 4.2.0
+      jiti: 2.7.0
+      postcss: 8.5.26
+      yaml: 2.9.0
 
   postcss-media-query-parser@0.2.3: {}
 
-  postcss-merge-longhand@7.0.4(postcss@8.4.49):
+  postcss-merge-longhand@7.0.7(postcss@8.5.26):
     dependencies:
-      postcss: 8.4.49
+      postcss: 8.5.26
       postcss-value-parser: 4.2.0
-      stylehacks: 7.0.4(postcss@8.4.49)
+      stylehacks: 7.0.11(postcss@8.5.26)
 
-  postcss-merge-rules@7.0.4(postcss@8.4.49):
+  postcss-merge-rules@7.0.11(postcss@8.5.26):
     dependencies:
-      browserslist: 4.24.3
+      browserslist: 4.28.8
       caniuse-api: 3.0.0
-      cssnano-utils: 5.0.0(postcss@8.4.49)
-      postcss: 8.4.49
-      postcss-selector-parser: 6.1.2
+      cssnano-utils: 5.0.3(postcss@8.5.26)
+      postcss: 8.5.26
+      postcss-selector-parser: 7.1.5
 
-  postcss-minify-font-values@7.0.0(postcss@8.4.49):
+  postcss-minify-font-values@7.0.3(postcss@8.5.26):
     dependencies:
-      postcss: 8.4.49
+      postcss: 8.5.26
       postcss-value-parser: 4.2.0
 
-  postcss-minify-gradients@7.0.0(postcss@8.4.49):
+  postcss-minify-gradients@7.0.5(postcss@8.5.26):
     dependencies:
-      colord: 2.9.3
-      cssnano-utils: 5.0.0(postcss@8.4.49)
-      postcss: 8.4.49
+      '@colordx/core': 5.5.0
+      cssnano-utils: 5.0.3(postcss@8.5.26)
+      postcss: 8.5.26
       postcss-value-parser: 4.2.0
 
-  postcss-minify-params@7.0.2(postcss@8.4.49):
+  postcss-minify-params@7.0.9(postcss@8.5.26):
     dependencies:
-      browserslist: 4.24.3
-      cssnano-utils: 5.0.0(postcss@8.4.49)
-      postcss: 8.4.49
+      browserslist: 4.28.8
+      cssnano-utils: 5.0.3(postcss@8.5.26)
+      postcss: 8.5.26
       postcss-value-parser: 4.2.0
 
-  postcss-minify-selectors@7.0.4(postcss@8.4.49):
+  postcss-minify-selectors@7.1.2(postcss@8.5.26):
     dependencies:
+      browserslist: 4.28.8
+      caniuse-api: 3.0.0
       cssesc: 3.0.0
-      postcss: 8.4.49
-      postcss-selector-parser: 6.1.2
+      postcss: 8.5.26
+      postcss-selector-parser: 7.1.5
 
-  postcss-nested@5.0.6(postcss@8.4.49):
+  postcss-nested@7.0.2(postcss@8.5.26):
     dependencies:
-      postcss: 8.4.49
-      postcss-selector-parser: 6.1.2
+      postcss: 8.5.26
+      postcss-selector-parser: 7.1.5
 
-  postcss-nested@6.2.0(postcss@8.4.49):
+  postcss-normalize-charset@7.0.3(postcss@8.5.26):
     dependencies:
-      postcss: 8.4.49
-      postcss-selector-parser: 6.1.2
+      postcss: 8.5.26
 
-  postcss-nested@7.0.2(postcss@8.4.49):
+  postcss-normalize-display-values@7.0.3(postcss@8.5.26):
     dependencies:
-      postcss: 8.4.49
-      postcss-selector-parser: 7.0.0
-
-  postcss-nesting@13.0.1(postcss@8.4.49):
-    dependencies:
-      '@csstools/selector-resolve-nested': 3.0.0(postcss-selector-parser@7.0.0)
-      '@csstools/selector-specificity': 5.0.0(postcss-selector-parser@7.0.0)
-      postcss: 8.4.49
-      postcss-selector-parser: 7.0.0
-
-  postcss-normalize-charset@7.0.0(postcss@8.4.49):
-    dependencies:
-      postcss: 8.4.49
-
-  postcss-normalize-display-values@7.0.0(postcss@8.4.49):
-    dependencies:
-      postcss: 8.4.49
+      postcss: 8.5.26
       postcss-value-parser: 4.2.0
 
-  postcss-normalize-positions@7.0.0(postcss@8.4.49):
+  postcss-normalize-positions@7.0.4(postcss@8.5.26):
     dependencies:
-      postcss: 8.4.49
+      postcss: 8.5.26
       postcss-value-parser: 4.2.0
 
-  postcss-normalize-repeat-style@7.0.0(postcss@8.4.49):
+  postcss-normalize-repeat-style@7.0.4(postcss@8.5.26):
     dependencies:
-      postcss: 8.4.49
+      postcss: 8.5.26
       postcss-value-parser: 4.2.0
 
-  postcss-normalize-string@7.0.0(postcss@8.4.49):
+  postcss-normalize-string@7.0.3(postcss@8.5.26):
     dependencies:
-      postcss: 8.4.49
+      postcss: 8.5.26
       postcss-value-parser: 4.2.0
 
-  postcss-normalize-timing-functions@7.0.0(postcss@8.4.49):
+  postcss-normalize-timing-functions@7.0.3(postcss@8.5.26):
     dependencies:
-      postcss: 8.4.49
+      postcss: 8.5.26
       postcss-value-parser: 4.2.0
 
-  postcss-normalize-unicode@7.0.2(postcss@8.4.49):
+  postcss-normalize-unicode@7.0.9(postcss@8.5.26):
     dependencies:
-      browserslist: 4.24.3
-      postcss: 8.4.49
+      browserslist: 4.28.8
+      postcss: 8.5.26
       postcss-value-parser: 4.2.0
 
-  postcss-normalize-url@7.0.0(postcss@8.4.49):
+  postcss-normalize-url@7.0.3(postcss@8.5.26):
     dependencies:
-      postcss: 8.4.49
+      postcss: 8.5.26
       postcss-value-parser: 4.2.0
 
-  postcss-normalize-whitespace@7.0.0(postcss@8.4.49):
+  postcss-normalize-whitespace@7.0.3(postcss@8.5.26):
     dependencies:
-      postcss: 8.4.49
+      postcss: 8.5.26
       postcss-value-parser: 4.2.0
 
-  postcss-opacity-percentage@3.0.0(postcss@8.4.49):
+  postcss-ordered-values@7.0.4(postcss@8.5.26):
     dependencies:
-      postcss: 8.4.49
-
-  postcss-ordered-values@7.0.1(postcss@8.4.49):
-    dependencies:
-      cssnano-utils: 5.0.0(postcss@8.4.49)
-      postcss: 8.4.49
+      cssnano-utils: 5.0.3(postcss@8.5.26)
+      postcss: 8.5.26
       postcss-value-parser: 4.2.0
 
-  postcss-overflow-shorthand@6.0.0(postcss@8.4.49):
+  postcss-reduce-initial@7.0.9(postcss@8.5.26):
     dependencies:
-      postcss: 8.4.49
-      postcss-value-parser: 4.2.0
-
-  postcss-page-break@3.0.4(postcss@8.4.49):
-    dependencies:
-      postcss: 8.4.49
-
-  postcss-place@10.0.0(postcss@8.4.49):
-    dependencies:
-      postcss: 8.4.49
-      postcss-value-parser: 4.2.0
-
-  postcss-preset-env@10.1.2(postcss@8.4.49):
-    dependencies:
-      '@csstools/postcss-cascade-layers': 5.0.1(postcss@8.4.49)
-      '@csstools/postcss-color-function': 4.0.6(postcss@8.4.49)
-      '@csstools/postcss-color-mix-function': 3.0.6(postcss@8.4.49)
-      '@csstools/postcss-content-alt-text': 2.0.4(postcss@8.4.49)
-      '@csstools/postcss-exponential-functions': 2.0.5(postcss@8.4.49)
-      '@csstools/postcss-font-format-keywords': 4.0.0(postcss@8.4.49)
-      '@csstools/postcss-gamut-mapping': 2.0.6(postcss@8.4.49)
-      '@csstools/postcss-gradients-interpolation-method': 5.0.6(postcss@8.4.49)
-      '@csstools/postcss-hwb-function': 4.0.6(postcss@8.4.49)
-      '@csstools/postcss-ic-unit': 4.0.0(postcss@8.4.49)
-      '@csstools/postcss-initial': 2.0.0(postcss@8.4.49)
-      '@csstools/postcss-is-pseudo-class': 5.0.1(postcss@8.4.49)
-      '@csstools/postcss-light-dark-function': 2.0.7(postcss@8.4.49)
-      '@csstools/postcss-logical-float-and-clear': 3.0.0(postcss@8.4.49)
-      '@csstools/postcss-logical-overflow': 2.0.0(postcss@8.4.49)
-      '@csstools/postcss-logical-overscroll-behavior': 2.0.0(postcss@8.4.49)
-      '@csstools/postcss-logical-resize': 3.0.0(postcss@8.4.49)
-      '@csstools/postcss-logical-viewport-units': 3.0.3(postcss@8.4.49)
-      '@csstools/postcss-media-minmax': 2.0.5(postcss@8.4.49)
-      '@csstools/postcss-media-queries-aspect-ratio-number-values': 3.0.4(postcss@8.4.49)
-      '@csstools/postcss-nested-calc': 4.0.0(postcss@8.4.49)
-      '@csstools/postcss-normalize-display-values': 4.0.0(postcss@8.4.49)
-      '@csstools/postcss-oklab-function': 4.0.6(postcss@8.4.49)
-      '@csstools/postcss-progressive-custom-properties': 4.0.0(postcss@8.4.49)
-      '@csstools/postcss-random-function': 1.0.1(postcss@8.4.49)
-      '@csstools/postcss-relative-color-syntax': 3.0.6(postcss@8.4.49)
-      '@csstools/postcss-scope-pseudo-class': 4.0.1(postcss@8.4.49)
-      '@csstools/postcss-sign-functions': 1.1.0(postcss@8.4.49)
-      '@csstools/postcss-stepped-value-functions': 4.0.5(postcss@8.4.49)
-      '@csstools/postcss-text-decoration-shorthand': 4.0.1(postcss@8.4.49)
-      '@csstools/postcss-trigonometric-functions': 4.0.5(postcss@8.4.49)
-      '@csstools/postcss-unset-value': 4.0.0(postcss@8.4.49)
-      autoprefixer: 10.4.20(postcss@8.4.49)
-      browserslist: 4.24.3
-      css-blank-pseudo: 7.0.1(postcss@8.4.49)
-      css-has-pseudo: 7.0.2(postcss@8.4.49)
-      css-prefers-color-scheme: 10.0.0(postcss@8.4.49)
-      cssdb: 8.2.3
-      postcss: 8.4.49
-      postcss-attribute-case-insensitive: 7.0.1(postcss@8.4.49)
-      postcss-clamp: 4.1.0(postcss@8.4.49)
-      postcss-color-functional-notation: 7.0.6(postcss@8.4.49)
-      postcss-color-hex-alpha: 10.0.0(postcss@8.4.49)
-      postcss-color-rebeccapurple: 10.0.0(postcss@8.4.49)
-      postcss-custom-media: 11.0.5(postcss@8.4.49)
-      postcss-custom-properties: 14.0.4(postcss@8.4.49)
-      postcss-custom-selectors: 8.0.4(postcss@8.4.49)
-      postcss-dir-pseudo-class: 9.0.1(postcss@8.4.49)
-      postcss-double-position-gradients: 6.0.0(postcss@8.4.49)
-      postcss-focus-visible: 10.0.1(postcss@8.4.49)
-      postcss-focus-within: 9.0.1(postcss@8.4.49)
-      postcss-font-variant: 5.0.0(postcss@8.4.49)
-      postcss-gap-properties: 6.0.0(postcss@8.4.49)
-      postcss-image-set-function: 7.0.0(postcss@8.4.49)
-      postcss-lab-function: 7.0.6(postcss@8.4.49)
-      postcss-logical: 8.0.0(postcss@8.4.49)
-      postcss-nesting: 13.0.1(postcss@8.4.49)
-      postcss-opacity-percentage: 3.0.0(postcss@8.4.49)
-      postcss-overflow-shorthand: 6.0.0(postcss@8.4.49)
-      postcss-page-break: 3.0.4(postcss@8.4.49)
-      postcss-place: 10.0.0(postcss@8.4.49)
-      postcss-pseudo-class-any-link: 10.0.1(postcss@8.4.49)
-      postcss-replace-overflow-wrap: 4.0.0(postcss@8.4.49)
-      postcss-selector-not: 8.0.1(postcss@8.4.49)
-
-  postcss-pseudo-class-any-link@10.0.1(postcss@8.4.49):
-    dependencies:
-      postcss: 8.4.49
-      postcss-selector-parser: 7.0.0
-
-  postcss-reduce-initial@7.0.2(postcss@8.4.49):
-    dependencies:
-      browserslist: 4.24.3
+      browserslist: 4.28.8
       caniuse-api: 3.0.0
-      postcss: 8.4.49
+      postcss: 8.5.26
 
-  postcss-reduce-transforms@7.0.0(postcss@8.4.49):
+  postcss-reduce-transforms@7.0.3(postcss@8.5.26):
     dependencies:
-      postcss: 8.4.49
+      postcss: 8.5.26
       postcss-value-parser: 4.2.0
 
-  postcss-replace-overflow-wrap@4.0.0(postcss@8.4.49):
-    dependencies:
-      postcss: 8.4.49
-
   postcss-resolve-nested-selector@0.1.6: {}
 
-  postcss-safe-parser@6.0.0(postcss@8.4.49):
+  postcss-safe-parser@6.0.0(postcss@8.5.26):
     dependencies:
-      postcss: 8.4.49
+      postcss: 8.5.26
 
-  postcss-safe-parser@7.0.1(postcss@8.4.49):
+  postcss-safe-parser@7.0.1(postcss@8.5.26):
     dependencies:
-      postcss: 8.4.49
+      postcss: 8.5.26
 
-  postcss-scss@4.0.9(postcss@8.4.49):
+  postcss-scss@4.0.9(postcss@8.5.26):
     dependencies:
-      postcss: 8.4.49
-
-  postcss-selector-not@8.0.1(postcss@8.4.49):
-    dependencies:
-      postcss: 8.4.49
-      postcss-selector-parser: 7.0.0
+      postcss: 8.5.26
 
   postcss-selector-parser@6.0.10:
     dependencies:
       cssesc: 3.0.0
       util-deprecate: 1.0.2
 
-  postcss-selector-parser@6.1.2:
+  postcss-selector-parser@7.1.5:
     dependencies:
       cssesc: 3.0.0
       util-deprecate: 1.0.2
 
-  postcss-selector-parser@7.0.0:
+  postcss-sorting@10.0.0(postcss@8.5.26):
     dependencies:
-      cssesc: 3.0.0
-      util-deprecate: 1.0.2
+      postcss: 8.5.26
 
-  postcss-sorting@8.0.2(postcss@8.4.49):
+  postcss-svgo@7.1.3(postcss@8.5.26):
     dependencies:
-      postcss: 8.4.49
-
-  postcss-svgo@7.0.1(postcss@8.4.49):
-    dependencies:
-      postcss: 8.4.49
+      postcss: 8.5.26
       postcss-value-parser: 4.2.0
-      svgo: 3.3.2
+      svgo: 4.0.2
 
-  postcss-unique-selectors@7.0.3(postcss@8.4.49):
+  postcss-unique-selectors@7.0.7(postcss@8.5.26):
     dependencies:
-      postcss: 8.4.49
-      postcss-selector-parser: 6.1.2
+      postcss: 8.5.26
+      postcss-selector-parser: 7.1.5
 
   postcss-value-parser@4.2.0: {}
 
-  postcss@8.4.49:
+  postcss@8.5.26:
     dependencies:
-      nanoid: 3.3.8
+      nanoid: 3.3.18
       picocolors: 1.1.1
       source-map-js: 1.2.1
 
+  postject@1.0.0-alpha.6:
+    dependencies:
+      commander: 9.5.0
+    optional: true
+
+  powershell-utils@0.1.0: {}
+
   prelude-ls@1.2.1: {}
 
-  prettier-linter-helpers@1.0.0:
-    dependencies:
-      fast-diff: 1.3.0
-
-  prettier-plugin-tailwindcss@0.6.9(prettier@3.4.2):
-    dependencies:
-      prettier: 3.4.2
-
   prettier@2.8.8: {}
 
-  prettier@3.4.2: {}
-
   pretty-bytes@5.6.0: {}
 
   pretty-bytes@6.1.1: {}
 
-  pretty-ms@9.2.0:
+  pretty-bytes@7.1.1: {}
+
+  pretty-ms@9.3.0:
     dependencies:
       parse-ms: 4.0.0
 
+  probe-image-size@7.3.0(supports-color@10.2.2):
+    dependencies:
+      lodash.merge: 4.6.2
+      needle: 2.9.1(supports-color@10.2.2)
+      stream-parser: 0.3.1(supports-color@10.2.2)
+    transitivePeerDependencies:
+      - supports-color
+    optional: true
+
+  proc-log@6.1.0: {}
+
   process-nextick-args@2.0.1: {}
 
   process@0.11.10: {}
 
-  promise-inflight@1.0.1: {}
+  progress@2.0.3: {}
 
   promise-retry@2.0.1:
     dependencies:
       err-code: 2.0.3
       retry: 0.12.0
 
+  proper-lockfile@4.1.2:
+    dependencies:
+      graceful-fs: 4.2.11
+      retry: 0.12.0
+      signal-exit: 3.0.7
+
+  prosemirror-changeset@2.4.1:
+    dependencies:
+      prosemirror-transform: 1.12.0
+
+  prosemirror-commands@1.7.2:
+    dependencies:
+      prosemirror-model: 1.25.11
+      prosemirror-state: 1.4.4
+      prosemirror-transform: 1.12.0
+
+  prosemirror-dropcursor@1.8.3:
+    dependencies:
+      prosemirror-state: 1.4.4
+      prosemirror-transform: 1.12.0
+      prosemirror-view: 1.42.2
+
+  prosemirror-gapcursor@1.4.1:
+    dependencies:
+      prosemirror-keymap: 1.2.3
+      prosemirror-model: 1.25.11
+      prosemirror-state: 1.4.4
+      prosemirror-view: 1.42.2
+
+  prosemirror-history@1.5.0:
+    dependencies:
+      prosemirror-state: 1.4.4
+      prosemirror-transform: 1.12.0
+      prosemirror-view: 1.42.2
+      rope-sequence: 1.3.4
+
+  prosemirror-inputrules@1.5.1:
+    dependencies:
+      prosemirror-state: 1.4.4
+      prosemirror-transform: 1.12.0
+
+  prosemirror-keymap@1.2.3:
+    dependencies:
+      prosemirror-state: 1.4.4
+      w3c-keyname: 2.2.8
+
+  prosemirror-model@1.25.11:
+    dependencies:
+      orderedmap: 2.1.1
+
+  prosemirror-schema-list@1.5.1:
+    dependencies:
+      prosemirror-model: 1.25.11
+      prosemirror-state: 1.4.4
+      prosemirror-transform: 1.12.0
+
+  prosemirror-state@1.4.4:
+    dependencies:
+      prosemirror-model: 1.25.11
+      prosemirror-transform: 1.12.0
+      prosemirror-view: 1.42.2
+
+  prosemirror-tables@1.8.5:
+    dependencies:
+      prosemirror-keymap: 1.2.3
+      prosemirror-model: 1.25.11
+      prosemirror-state: 1.4.4
+      prosemirror-transform: 1.12.0
+      prosemirror-view: 1.42.2
+
+  prosemirror-transform@1.12.0:
+    dependencies:
+      prosemirror-model: 1.25.11
+
+  prosemirror-view@1.42.2:
+    dependencies:
+      prosemirror-model: 1.25.11
+      prosemirror-state: 1.4.4
+      prosemirror-transform: 1.12.0
+
   proto-list@1.2.4: {}
 
-  proxy-from-env@1.1.0: {}
+  proxy-from-env@2.1.0: {}
 
   prr@1.0.1:
     optional: true
 
-  publint@0.2.12:
+  publint@0.3.23:
     dependencies:
-      npm-packlist: 5.1.3
+      '@publint/pack': 0.1.6
+      package-manager-detector: 1.8.0
       picocolors: 1.1.1
       sade: 1.8.1
 
+  pump@3.0.4:
+    dependencies:
+      end-of-stream: 1.4.5
+      once: 1.4.0
+
   punycode.js@2.3.1: {}
 
   punycode@2.3.1: {}
 
-  pupa@3.1.0:
+  pupa@3.3.0:
     dependencies:
       escape-goat: 4.0.0
 
+  pvtsutils@1.3.6:
+    dependencies:
+      tslib: 2.8.1
+
+  pvutils@1.2.0: {}
+
+  qified@0.10.1:
+    dependencies:
+      hookified: 2.2.0
+
   qrcode@1.5.4:
     dependencies:
       dijkstrajs: 1.0.3
       pngjs: 5.0.0
       yargs: 15.4.1
 
+  qs@6.15.3:
+    dependencies:
+      es-define-property: 1.0.1
+      side-channel: 1.1.1
+
+  quansync@0.2.11: {}
+
+  quansync@1.0.0: {}
+
   queue-microtask@1.2.3: {}
 
-  queue-tick@1.0.1: {}
+  quick-lru@5.1.1: {}
 
-  quill-delta@3.6.3:
+  quill-delta@5.1.0:
     dependencies:
-      deep-equal: 1.1.2
-      extend: 3.0.2
-      fast-diff: 1.1.2
-
-  quill-delta@4.2.2:
-    dependencies:
-      fast-diff: 1.2.0
+      fast-diff: 1.3.0
       lodash.clonedeep: 4.5.0
       lodash.isequal: 4.5.0
 
-  quill@1.3.7:
+  quill@2.0.2:
     dependencies:
-      clone: 2.1.2
-      deep-equal: 1.1.2
-      eventemitter3: 2.0.3
-      extend: 3.0.2
-      parchment: 1.1.4
-      quill-delta: 3.6.3
-
-  radix-vue@1.9.11(vue@3.5.13(typescript@5.7.2)):
-    dependencies:
-      '@floating-ui/dom': 1.6.12
-      '@floating-ui/vue': 1.1.5(vue@3.5.13(typescript@5.7.2))
-      '@internationalized/date': 3.6.0
-      '@internationalized/number': 3.6.0
-      '@tanstack/vue-virtual': 3.11.2(vue@3.5.13(typescript@5.7.2))
-      '@vueuse/core': 10.11.1(vue@3.5.13(typescript@5.7.2))
-      '@vueuse/shared': 10.11.1(vue@3.5.13(typescript@5.7.2))
-      aria-hidden: 1.2.4
-      defu: 6.1.4
-      fast-deep-equal: 3.1.3
-      nanoid: 5.0.9
-      vue: 3.5.13(typescript@5.7.2)
-    transitivePeerDependencies:
-      - '@vue/composition-api'
+      eventemitter3: 5.0.4
+      lodash-es: 4.18.1
+      parchment: 3.0.0
+      quill-delta: 5.1.0
 
   radix3@1.1.2: {}
 
-  randombytes@2.1.0:
-    dependencies:
-      safe-buffer: 5.2.1
+  range-parser@1.3.0: {}
 
-  range-parser@1.2.1: {}
-
-  rc9@2.1.2:
+  rc9@3.0.1:
     dependencies:
-      defu: 6.1.4
-      destr: 2.0.3
+      defu: 6.1.7
+      destr: 2.0.5
 
   rc@1.2.8:
     dependencies:
@@ -17737,33 +20880,22 @@ snapshots:
       minimist: 1.2.8
       strip-json-comments: 2.0.1
 
-  read-cache@1.0.0:
+  read-binary-file-arch@1.0.6(supports-color@10.2.2):
     dependencies:
-      pify: 2.3.0
-
-  read-pkg-up@7.0.1:
-    dependencies:
-      find-up: 4.1.0
-      read-pkg: 5.2.0
-      type-fest: 0.8.1
-
-  read-pkg@5.2.0:
-    dependencies:
-      '@types/normalize-package-data': 2.4.4
-      normalize-package-data: 2.5.0
-      parse-json: 5.2.0
-      type-fest: 0.6.0
+      debug: 4.4.3(supports-color@10.2.2)
+    transitivePeerDependencies:
+      - supports-color
 
   read-yaml-file@1.1.0:
     dependencies:
       graceful-fs: 4.2.11
-      js-yaml: 3.14.1
+      js-yaml: 3.15.1
       pify: 4.0.1
       strip-bom: 3.0.0
 
   read-yaml-file@2.1.0:
     dependencies:
-      js-yaml: 4.1.0
+      js-yaml: 4.3.1
       strip-bom: 4.0.0
 
   readable-stream@2.3.8:
@@ -17782,7 +20914,7 @@ snapshots:
       string_decoder: 1.3.0
       util-deprecate: 1.0.2
 
-  readable-stream@4.6.0:
+  readable-stream@4.7.0:
     dependencies:
       abort-controller: 3.0.0
       buffer: 6.0.3
@@ -17792,13 +20924,13 @@ snapshots:
 
   readdir-glob@1.1.3:
     dependencies:
-      minimatch: 5.1.6
+      minimatch: 5.1.9
 
-  readdirp@3.6.0:
+  readdir-glob@3.0.0:
     dependencies:
-      picomatch: 2.3.1
+      minimatch: 10.2.6
 
-  readdirp@4.0.2: {}
+  readdirp@5.1.1: {}
 
   redis-errors@1.2.0: {}
 
@@ -17806,59 +20938,44 @@ snapshots:
     dependencies:
       redis-errors: 1.2.0
 
-  refa@0.12.1:
+  reflect.getprototypeof@1.0.10:
     dependencies:
-      '@eslint-community/regexpp': 4.12.1
-
-  reflect.getprototypeof@1.0.9:
-    dependencies:
-      call-bind: 1.0.8
+      call-bind: 1.0.9
       define-properties: 1.2.1
-      dunder-proto: 1.0.1
-      es-abstract: 1.23.6
+      es-abstract: 1.24.2
       es-errors: 1.3.0
-      get-intrinsic: 1.2.6
-      gopd: 1.2.0
+      es-object-atoms: 1.1.2
+      get-intrinsic: 1.3.0
+      get-proto: 1.0.1
       which-builtin-type: 1.2.1
 
-  regenerate-unicode-properties@10.2.0:
+  regenerate-unicode-properties@10.2.2:
     dependencies:
       regenerate: 1.4.2
 
   regenerate@1.4.2: {}
 
-  regenerator-runtime@0.14.1: {}
-
-  regenerator-transform@0.15.2:
+  regexp.prototype.flags@1.5.4:
     dependencies:
-      '@babel/runtime': 7.26.0
-
-  regexp-ast-analysis@0.7.1:
-    dependencies:
-      '@eslint-community/regexpp': 4.12.1
-      refa: 0.12.1
-
-  regexp-tree@0.1.27: {}
-
-  regexp.prototype.flags@1.5.3:
-    dependencies:
-      call-bind: 1.0.8
+      call-bind: 1.0.9
       define-properties: 1.2.1
       es-errors: 1.3.0
+      get-proto: 1.0.1
+      gopd: 1.2.0
       set-function-name: 2.0.2
 
-  regexpu-core@6.2.0:
+  regexpu-core@6.4.0:
     dependencies:
       regenerate: 1.4.2
-      regenerate-unicode-properties: 10.2.0
+      regenerate-unicode-properties: 10.2.2
       regjsgen: 0.8.0
-      regjsparser: 0.12.0
+      regjsparser: 0.13.2
       unicode-match-property-ecmascript: 2.0.0
-      unicode-match-property-value-ecmascript: 2.2.0
+      unicode-match-property-value-ecmascript: 2.2.1
 
-  registry-auth-token@5.0.3:
+  registry-auth-token@5.1.1:
     dependencies:
-      '@pnpm/npm-conf': 2.3.1
+      '@pnpm/npm-conf': 3.0.3
 
   registry-url@6.0.1:
     dependencies:
@@ -17866,34 +20983,43 @@ snapshots:
 
   regjsgen@0.8.0: {}
 
-  regjsparser@0.10.0:
+  regjsparser@0.13.2:
     dependencies:
-      jsesc: 0.5.0
+      jsesc: 3.1.0
 
-  regjsparser@0.12.0:
+  reka-ui@2.10.3(vue@3.5.41(typescript@6.0.3)):
     dependencies:
-      jsesc: 3.0.2
+      '@floating-ui/dom': 1.8.0
+      '@floating-ui/vue': 1.1.11(vue@3.5.41(typescript@6.0.3))
+      '@internationalized/date': 3.12.3
+      '@internationalized/number': 3.6.7
+      '@tanstack/vue-virtual': 3.13.35(vue@3.5.41(typescript@6.0.3))
+      '@vueuse/core': 14.4.0(vue@3.5.41(typescript@6.0.3))
+      '@vueuse/shared': 14.4.0(vue@3.5.41(typescript@6.0.3))
+      aria-hidden: 1.2.6
+      defu: 6.1.7
+      ohash: 2.0.11
+      vue: 3.5.41(typescript@6.0.3)
+    transitivePeerDependencies:
+      - '@vue/composition-api'
 
   relateurl@0.2.7: {}
 
   remove-accents@0.5.0: {}
 
-  repeat-string@1.6.1: {}
-
   require-directory@2.1.1: {}
 
   require-from-string@2.0.2: {}
 
   require-main-filename@2.0.0: {}
 
-  require-package-name@2.0.1: {}
+  resedit@1.7.2:
+    dependencies:
+      pe-library: 0.4.1
 
   resize-observer-polyfill@1.5.1: {}
 
-  resolve-dir@1.0.1:
-    dependencies:
-      expand-tilde: 2.0.2
-      global-modules: 1.0.0
+  resolve-alpn@1.2.1: {}
 
   resolve-from@4.0.0: {}
 
@@ -17903,12 +21029,17 @@ snapshots:
 
   resolve.exports@2.0.3: {}
 
-  resolve@1.22.10:
+  resolve@1.22.12:
     dependencies:
-      is-core-module: 2.16.0
+      es-errors: 1.3.0
+      is-core-module: 2.16.2
       path-parse: 1.0.7
       supports-preserve-symlinks-flag: 1.0.0
 
+  responselike@2.0.1:
+    dependencies:
+      lowercase-keys: 2.0.0
+
   restore-cursor@5.1.0:
     dependencies:
       onetime: 7.0.0
@@ -17916,90 +21047,141 @@ snapshots:
 
   retry@0.12.0: {}
 
-  reusify@1.0.4: {}
+  reusify@1.1.0: {}
 
-  rfdc@1.4.1: {}
+  rimraf@2.6.3:
+    dependencies:
+      glob: 7.2.3
 
   rimraf@2.7.1:
     dependencies:
       glob: 7.2.3
 
-  rimraf@3.0.2:
+  rimraf@6.1.3:
     dependencies:
-      glob: 7.2.3
-
-  rimraf@5.0.10:
-    dependencies:
-      glob: 10.4.5
-
-  rimraf@6.0.1:
-    dependencies:
-      glob: 11.0.0
+      glob: 13.0.6
       package-json-from-dist: 1.0.1
 
-  rollup-plugin-dts@6.1.1(rollup@4.28.1)(typescript@5.6.3):
+  roarr@2.15.4:
     dependencies:
-      magic-string: 0.30.17
-      rollup: 4.28.1
-      typescript: 5.6.3
-    optionalDependencies:
-      '@babel/code-frame': 7.26.2
+      boolean: 3.2.0
+      detect-node: 2.1.0
+      globalthis: 1.0.4
+      json-stringify-safe: 5.0.1
+      semver-compare: 1.0.0
+      sprintf-js: 1.1.3
+    optional: true
 
-  rollup-plugin-visualizer@5.12.0(rollup@4.28.1):
+  rolldown-plugin-dts@0.27.14(@volar/typescript@2.4.28)(oxc-resolver@11.24.2)(rolldown@1.2.3)(typescript@6.0.3)(vue-tsc@3.3.9(typescript@6.0.3)):
     dependencies:
-      open: 8.4.2
-      picomatch: 2.3.1
-      source-map: 0.7.4
-      yargs: 17.7.2
+      dts-resolver: 3.0.0(oxc-resolver@11.24.2)
+      get-tsconfig: 5.0.0-beta.5
+      obug: 2.1.4
+      rolldown: 1.2.3
+      yuku-ast: 0.8.4
+      yuku-codegen: 0.8.4
+      yuku-parser: 0.8.4
     optionalDependencies:
-      rollup: 4.28.1
+      '@volar/typescript': 2.4.28
+      typescript: 6.0.3
+      vue-tsc: 3.3.9(typescript@6.0.3)
+    transitivePeerDependencies:
+      - oxc-resolver
 
-  rollup@2.79.2:
+  rolldown@1.2.3:
+    dependencies:
+      '@oxc-project/types': 0.143.0
+      '@rolldown/pluginutils': 1.0.1
     optionalDependencies:
+      '@rolldown/binding-android-arm64': 1.2.3
+      '@rolldown/binding-darwin-arm64': 1.2.3
+      '@rolldown/binding-darwin-x64': 1.2.3
+      '@rolldown/binding-freebsd-x64': 1.2.3
+      '@rolldown/binding-linux-arm-gnueabihf': 1.2.3
+      '@rolldown/binding-linux-arm64-gnu': 1.2.3
+      '@rolldown/binding-linux-arm64-musl': 1.2.3
+      '@rolldown/binding-linux-ppc64-gnu': 1.2.3
+      '@rolldown/binding-linux-s390x-gnu': 1.2.3
+      '@rolldown/binding-linux-x64-gnu': 1.2.3
+      '@rolldown/binding-linux-x64-musl': 1.2.3
+      '@rolldown/binding-openharmony-arm64': 1.2.3
+      '@rolldown/binding-win32-arm64-msvc': 1.2.3
+      '@rolldown/binding-win32-x64-msvc': 1.2.3
+
+  rollup-plugin-dts@6.5.1(rollup@4.62.4)(typescript@6.0.3):
+    dependencies:
+      '@jridgewell/remapping': 2.3.5
+      '@jridgewell/sourcemap-codec': 1.5.5
+      convert-source-map: 2.0.0
+      magic-string: 0.30.21
+      rollup: 4.62.4
+      typescript: 6.0.3
+    optionalDependencies:
+      '@babel/code-frame': 8.0.0
+
+  rollup-plugin-visualizer@7.0.1(rolldown@1.2.3)(rollup@4.62.4):
+    dependencies:
+      open: 11.0.0
+      picomatch: 4.0.5
+      source-map: 0.7.6
+      yargs: 18.1.0
+    optionalDependencies:
+      rolldown: 1.2.3
+      rollup: 4.62.4
+
+  rollup@4.62.4:
+    dependencies:
+      '@types/estree': 1.0.9
+    optionalDependencies:
+      '@napi-rs/lzma-linux-x64-gnu': 1.5.1
+      '@rollup/rollup-android-arm-eabi': 4.62.4
+      '@rollup/rollup-android-arm64': 4.62.4
+      '@rollup/rollup-darwin-arm64': 4.62.4
+      '@rollup/rollup-darwin-x64': 4.62.4
+      '@rollup/rollup-freebsd-arm64': 4.62.4
+      '@rollup/rollup-freebsd-x64': 4.62.4
+      '@rollup/rollup-linux-arm-gnueabihf': 4.62.4
+      '@rollup/rollup-linux-arm-musleabihf': 4.62.4
+      '@rollup/rollup-linux-arm64-gnu': 4.62.4
+      '@rollup/rollup-linux-arm64-musl': 4.62.4
+      '@rollup/rollup-linux-loong64-gnu': 4.62.4
+      '@rollup/rollup-linux-loong64-musl': 4.62.4
+      '@rollup/rollup-linux-ppc64-gnu': 4.62.4
+      '@rollup/rollup-linux-ppc64-musl': 4.62.4
+      '@rollup/rollup-linux-riscv64-gnu': 4.62.4
+      '@rollup/rollup-linux-riscv64-musl': 4.62.4
+      '@rollup/rollup-linux-s390x-gnu': 4.62.4
+      '@rollup/rollup-linux-x64-gnu': 4.62.4
+      '@rollup/rollup-linux-x64-musl': 4.62.4
+      '@rollup/rollup-openbsd-x64': 4.62.4
+      '@rollup/rollup-openharmony-arm64': 4.62.4
+      '@rollup/rollup-win32-arm64-msvc': 4.62.4
+      '@rollup/rollup-win32-ia32-msvc': 4.62.4
+      '@rollup/rollup-win32-x64-gnu': 4.62.4
+      '@rollup/rollup-win32-x64-msvc': 4.62.4
       fsevents: 2.3.3
 
-  rollup@4.28.1:
-    dependencies:
-      '@types/estree': 1.0.6
-    optionalDependencies:
-      '@rollup/rollup-android-arm-eabi': 4.28.1
-      '@rollup/rollup-android-arm64': 4.28.1
-      '@rollup/rollup-darwin-arm64': 4.28.1
-      '@rollup/rollup-darwin-x64': 4.28.1
-      '@rollup/rollup-freebsd-arm64': 4.28.1
-      '@rollup/rollup-freebsd-x64': 4.28.1
-      '@rollup/rollup-linux-arm-gnueabihf': 4.28.1
-      '@rollup/rollup-linux-arm-musleabihf': 4.28.1
-      '@rollup/rollup-linux-arm64-gnu': 4.28.1
-      '@rollup/rollup-linux-arm64-musl': 4.28.1
-      '@rollup/rollup-linux-loongarch64-gnu': 4.28.1
-      '@rollup/rollup-linux-powerpc64le-gnu': 4.28.1
-      '@rollup/rollup-linux-riscv64-gnu': 4.28.1
-      '@rollup/rollup-linux-s390x-gnu': 4.28.1
-      '@rollup/rollup-linux-x64-gnu': 4.28.1
-      '@rollup/rollup-linux-x64-musl': 4.28.1
-      '@rollup/rollup-win32-arm64-msvc': 4.28.1
-      '@rollup/rollup-win32-ia32-msvc': 4.28.1
-      '@rollup/rollup-win32-x64-msvc': 4.28.1
-      fsevents: 2.3.3
+  rope-sequence@1.3.4: {}
 
-  rotated-array-set@3.0.0: {}
-
-  run-applescript@7.0.0: {}
+  run-applescript@7.1.0: {}
 
   run-parallel@1.2.0:
     dependencies:
       queue-microtask: 1.2.3
 
+  rxjs@7.8.2:
+    dependencies:
+      tslib: 2.8.1
+
   sade@1.8.1:
     dependencies:
       mri: 1.2.0
 
-  safe-array-concat@1.1.3:
+  safe-array-concat@1.1.4:
     dependencies:
-      call-bind: 1.0.8
-      call-bound: 1.0.3
-      get-intrinsic: 1.2.6
+      call-bind: 1.0.9
+      call-bound: 1.0.4
+      get-intrinsic: 1.3.0
       has-symbols: 1.1.0
       isarray: 2.0.5
 
@@ -18007,25 +21189,129 @@ snapshots:
 
   safe-buffer@5.2.1: {}
 
+  safe-push-apply@1.0.0:
+    dependencies:
+      es-errors: 1.3.0
+      isarray: 2.0.5
+
   safe-regex-test@1.1.0:
     dependencies:
-      call-bound: 1.0.3
+      call-bound: 1.0.4
       es-errors: 1.3.0
       is-regex: 1.2.1
 
   safer-buffer@2.1.2: {}
 
-  sass@1.80.6:
+  sanitize-filename@1.6.4:
     dependencies:
-      chokidar: 4.0.3
-      immutable: 4.3.7
+      truncate-utf8-bytes: 1.0.2
+
+  sass-embedded-all-unknown@1.100.0:
+    dependencies:
+      sass: 1.100.0
+    optional: true
+
+  sass-embedded-android-arm64@1.100.0:
+    optional: true
+
+  sass-embedded-android-arm@1.100.0:
+    optional: true
+
+  sass-embedded-android-riscv64@1.100.0:
+    optional: true
+
+  sass-embedded-android-x64@1.100.0:
+    optional: true
+
+  sass-embedded-darwin-arm64@1.100.0:
+    optional: true
+
+  sass-embedded-darwin-x64@1.100.0:
+    optional: true
+
+  sass-embedded-linux-arm64@1.100.0:
+    optional: true
+
+  sass-embedded-linux-arm@1.100.0:
+    optional: true
+
+  sass-embedded-linux-musl-arm64@1.100.0:
+    optional: true
+
+  sass-embedded-linux-musl-arm@1.100.0:
+    optional: true
+
+  sass-embedded-linux-musl-riscv64@1.100.0:
+    optional: true
+
+  sass-embedded-linux-musl-x64@1.100.0:
+    optional: true
+
+  sass-embedded-linux-riscv64@1.100.0:
+    optional: true
+
+  sass-embedded-linux-x64@1.100.0:
+    optional: true
+
+  sass-embedded-unknown-all@1.100.0:
+    dependencies:
+      sass: 1.100.0
+    optional: true
+
+  sass-embedded-win32-arm64@1.100.0:
+    optional: true
+
+  sass-embedded-win32-x64@1.100.0:
+    optional: true
+
+  sass-embedded@1.100.0:
+    dependencies:
+      '@bufbuild/protobuf': 2.13.0
+      colorjs.io: 0.5.2
+      immutable: 5.1.9
+      rxjs: 7.8.2
+      supports-color: 8.1.1
+      sync-child-process: 1.0.2
+      varint: 6.0.0
+    optionalDependencies:
+      sass-embedded-all-unknown: 1.100.0
+      sass-embedded-android-arm: 1.100.0
+      sass-embedded-android-arm64: 1.100.0
+      sass-embedded-android-riscv64: 1.100.0
+      sass-embedded-android-x64: 1.100.0
+      sass-embedded-darwin-arm64: 1.100.0
+      sass-embedded-darwin-x64: 1.100.0
+      sass-embedded-linux-arm: 1.100.0
+      sass-embedded-linux-arm64: 1.100.0
+      sass-embedded-linux-musl-arm: 1.100.0
+      sass-embedded-linux-musl-arm64: 1.100.0
+      sass-embedded-linux-musl-riscv64: 1.100.0
+      sass-embedded-linux-musl-x64: 1.100.0
+      sass-embedded-linux-riscv64: 1.100.0
+      sass-embedded-linux-x64: 1.100.0
+      sass-embedded-unknown-all: 1.100.0
+      sass-embedded-win32-arm64: 1.100.0
+      sass-embedded-win32-x64: 1.100.0
+
+  sass@1.100.0:
+    dependencies:
+      chokidar: 5.0.0
+      immutable: 5.1.9
       source-map-js: 1.2.1
     optionalDependencies:
-      '@parcel/watcher': 2.5.0
-
-  sax@1.4.1:
+      '@parcel/watcher': 2.6.0
     optional: true
 
+  sass@1.102.0:
+    dependencies:
+      chokidar: 5.0.0
+      immutable: 5.1.9
+      source-map-js: 1.2.1
+    optionalDependencies:
+      '@parcel/watcher': 2.6.0
+
+  sax@1.6.1: {}
+
   saxes@5.0.1:
     dependencies:
       xmlchars: 2.2.0
@@ -18034,58 +21320,61 @@ snapshots:
     dependencies:
       compute-scroll-into-view: 1.0.20
 
-  scslre@0.3.0:
+  scroll-into-view-if-needed@3.1.0:
     dependencies:
-      '@eslint-community/regexpp': 4.12.1
-      refa: 0.12.1
-      regexp-ast-analysis: 0.7.1
+      compute-scroll-into-view: 3.1.1
 
   scule@1.3.0: {}
 
-  semver-compare@1.0.0: {}
+  secure-ls@2.0.0:
+    dependencies:
+      crypto-js: 4.2.0
+      lz-string: 1.5.0
+
+  semver-compare@1.0.0:
+    optional: true
 
   semver@5.7.2: {}
 
   semver@6.3.1: {}
 
-  semver@7.5.4:
-    dependencies:
-      lru-cache: 6.0.0
+  semver@7.7.4: {}
 
-  semver@7.6.3: {}
+  semver@7.8.5: {}
 
-  send@0.19.0:
+  send@1.2.1(supports-color@10.2.2):
     dependencies:
-      debug: 2.6.9
-      depd: 2.0.0
-      destroy: 1.2.0
-      encodeurl: 1.0.2
+      debug: 4.4.3(supports-color@10.2.2)
+      encodeurl: 2.0.0
       escape-html: 1.0.3
       etag: 1.8.1
-      fresh: 0.5.2
-      http-errors: 2.0.0
-      mime: 1.6.0
+      fresh: 2.0.0
+      http-errors: 2.0.1
+      mime-types: 3.0.2
       ms: 2.1.3
       on-finished: 2.4.1
-      range-parser: 1.2.1
-      statuses: 2.0.1
+      range-parser: 1.3.0
+      statuses: 2.0.2
     transitivePeerDependencies:
       - supports-color
 
-  serialize-javascript@6.0.2:
+  serialize-error@7.0.1:
     dependencies:
-      randombytes: 2.1.0
+      type-fest: 0.13.1
+    optional: true
+
+  serialize-javascript@7.1.0: {}
 
   serve-placeholder@2.0.2:
     dependencies:
-      defu: 6.1.4
+      defu: 6.1.7
 
-  serve-static@1.16.2:
+  serve-static@2.2.1(supports-color@10.2.2):
     dependencies:
       encodeurl: 2.0.0
       escape-html: 1.0.3
       parseurl: 1.3.3
-      send: 0.19.0
+      send: 1.2.1(supports-color@10.2.2)
     transitivePeerDependencies:
       - supports-color
 
@@ -18096,7 +21385,7 @@ snapshots:
       define-data-property: 1.1.4
       es-errors: 1.3.0
       function-bind: 1.1.2
-      get-intrinsic: 1.2.6
+      get-intrinsic: 1.3.0
       gopd: 1.2.0
       has-property-descriptors: 1.0.2
 
@@ -18107,6 +21396,12 @@ snapshots:
       functions-have-names: 1.2.3
       has-property-descriptors: 1.0.2
 
+  set-proto@1.0.0:
+    dependencies:
+      dunder-proto: 1.0.1
+      es-errors: 1.3.0
+      es-object-atoms: 1.1.2
+
   setimmediate@1.0.5: {}
 
   setprototypeof@1.2.0: {}
@@ -18119,47 +21414,48 @@ snapshots:
 
   shebang-regex@3.0.0: {}
 
-  short-tree@3.0.0:
-    dependencies:
-      '@types/bintrees': 1.0.6
-      bintrees: 1.0.2
-
-  side-channel-list@1.0.0:
+  side-channel-list@1.0.1:
     dependencies:
       es-errors: 1.3.0
-      object-inspect: 1.13.3
+      object-inspect: 1.13.4
 
   side-channel-map@1.0.1:
     dependencies:
-      call-bound: 1.0.3
+      call-bound: 1.0.4
       es-errors: 1.3.0
-      get-intrinsic: 1.2.6
-      object-inspect: 1.13.3
+      get-intrinsic: 1.3.0
+      object-inspect: 1.13.4
 
   side-channel-weakmap@1.0.2:
     dependencies:
-      call-bound: 1.0.3
+      call-bound: 1.0.4
       es-errors: 1.3.0
-      get-intrinsic: 1.2.6
-      object-inspect: 1.13.3
+      get-intrinsic: 1.3.0
+      object-inspect: 1.13.4
       side-channel-map: 1.0.1
 
-  side-channel@1.1.0:
+  side-channel@1.1.1:
     dependencies:
       es-errors: 1.3.0
-      object-inspect: 1.13.3
-      side-channel-list: 1.0.0
+      object-inspect: 1.13.4
+      side-channel-list: 1.0.1
       side-channel-map: 1.0.1
       side-channel-weakmap: 1.0.2
 
   siginfo@2.0.0: {}
 
+  signal-exit@3.0.7: {}
+
   signal-exit@4.1.0: {}
 
-  sirv@3.0.0:
+  simple-update-notifier@2.0.0:
     dependencies:
-      '@polka/url': 1.0.0-next.28
-      mrmime: 2.0.0
+      semver: 7.8.5
+
+  sirv@3.0.2:
+    dependencies:
+      '@polka/url': 1.0.0-next.29
+      mrmime: 2.0.1
       totalist: 3.0.1
 
   sisteransi@1.0.5: {}
@@ -18168,42 +21464,22 @@ snapshots:
 
   slash@5.1.0: {}
 
-  slashes@3.0.12: {}
-
   slice-ansi@4.0.0:
     dependencies:
       ansi-styles: 4.3.0
       astral-regex: 2.0.0
       is-fullwidth-code-point: 3.0.0
 
-  slice-ansi@5.0.0:
+  slice-ansi@9.0.0:
     dependencies:
-      ansi-styles: 6.2.1
-      is-fullwidth-code-point: 4.0.0
+      ansi-styles: 6.2.3
+      is-fullwidth-code-point: 5.1.0
 
-  slice-ansi@7.1.0:
-    dependencies:
-      ansi-styles: 6.2.1
-      is-fullwidth-code-point: 5.0.0
+  smob@1.6.2: {}
 
-  smart-buffer@4.2.0: {}
+  smol-toml@1.7.1: {}
 
-  smob@1.5.0: {}
-
-  socks-proxy-agent@5.0.1:
-    dependencies:
-      agent-base: 6.0.2
-      debug: 4.4.0(supports-color@9.4.0)
-      socks: 2.8.3
-    transitivePeerDependencies:
-      - supports-color
-
-  socks@2.8.3:
-    dependencies:
-      ip-address: 9.0.5
-      smart-buffer: 4.2.0
-
-  sortablejs@1.15.6: {}
+  sortablejs@1.15.7: {}
 
   source-map-js@1.2.1: {}
 
@@ -18214,75 +21490,56 @@ snapshots:
 
   source-map@0.6.1: {}
 
-  source-map@0.7.4: {}
+  source-map@0.7.6: {}
 
-  source-map@0.8.0-beta.0:
-    dependencies:
-      whatwg-url: 7.1.0
-
-  sourcemap-codec@1.4.8: {}
+  source-map@0.8.0: {}
 
   spawndamnit@3.0.1:
     dependencies:
       cross-spawn: 7.0.6
       signal-exit: 4.1.0
 
-  spdx-correct@3.2.0:
-    dependencies:
-      spdx-expression-parse: 3.0.1
-      spdx-license-ids: 3.0.20
-
-  spdx-exceptions@2.5.0: {}
-
-  spdx-expression-parse@3.0.1:
-    dependencies:
-      spdx-exceptions: 2.5.0
-      spdx-license-ids: 3.0.20
-
-  spdx-expression-parse@4.0.0:
-    dependencies:
-      spdx-exceptions: 2.5.0
-      spdx-license-ids: 3.0.20
-
-  spdx-license-ids@3.0.20: {}
-
-  speakingurl@14.0.1: {}
-
-  split2@4.2.0: {}
-
   sprintf-js@1.0.3: {}
 
-  sprintf-js@1.1.3: {}
+  sprintf-js@1.1.3:
+    optional: true
 
   ssf@0.11.2:
     dependencies:
       frac: 1.1.2
 
-  ssri@8.0.1:
-    dependencies:
-      minipass: 3.3.6
-
-  stable-hash@0.0.4: {}
-
   stackback@0.0.2: {}
 
   standard-as-callback@2.1.0: {}
 
-  statuses@2.0.1: {}
+  stat-mode@1.0.0: {}
 
-  std-env@3.8.0: {}
+  statuses@2.0.2: {}
 
-  stdin-discarder@0.2.2: {}
+  std-env@4.2.0: {}
 
-  streamx@2.21.1:
+  stdin-discarder@0.3.2: {}
+
+  stop-iteration-iterator@1.1.0:
     dependencies:
-      fast-fifo: 1.3.2
-      queue-tick: 1.0.1
-      text-decoder: 1.2.3
-    optionalDependencies:
-      bare-events: 2.5.0
+      es-errors: 1.3.0
+      internal-slot: 1.1.0
 
-  string-argv@0.3.2: {}
+  stream-parser@0.3.1(supports-color@10.2.2):
+    dependencies:
+      debug: 2.6.9(supports-color@10.2.2)
+    transitivePeerDependencies:
+      - supports-color
+    optional: true
+
+  streamx@2.28.0:
+    dependencies:
+      events-universal: 1.0.1
+      fast-fifo: 1.3.2
+      text-decoder: 1.2.7
+    transitivePeerDependencies:
+      - bare-abort-controller
+      - react-native-b4a
 
   string-width@4.2.3:
     dependencies:
@@ -18294,52 +21551,58 @@ snapshots:
     dependencies:
       eastasianwidth: 0.2.0
       emoji-regex: 9.2.2
-      strip-ansi: 7.1.0
+      strip-ansi: 7.2.0
 
   string-width@7.2.0:
     dependencies:
-      emoji-regex: 10.4.0
-      get-east-asian-width: 1.3.0
-      strip-ansi: 7.1.0
+      emoji-regex: 10.6.0
+      get-east-asian-width: 1.6.0
+      strip-ansi: 7.2.0
+
+  string-width@8.2.2:
+    dependencies:
+      get-east-asian-width: 1.6.0
+      strip-ansi: 7.2.0
 
   string.prototype.matchall@4.0.12:
     dependencies:
-      call-bind: 1.0.8
-      call-bound: 1.0.3
+      call-bind: 1.0.9
+      call-bound: 1.0.4
       define-properties: 1.2.1
-      es-abstract: 1.23.6
+      es-abstract: 1.24.2
       es-errors: 1.3.0
-      es-object-atoms: 1.0.0
-      get-intrinsic: 1.2.6
+      es-object-atoms: 1.1.2
+      get-intrinsic: 1.3.0
       gopd: 1.2.0
       has-symbols: 1.1.0
       internal-slot: 1.1.0
-      regexp.prototype.flags: 1.5.3
+      regexp.prototype.flags: 1.5.4
       set-function-name: 2.0.2
-      side-channel: 1.1.0
+      side-channel: 1.1.1
 
-  string.prototype.trim@1.2.10:
+  string.prototype.trim@1.2.11:
     dependencies:
-      call-bind: 1.0.8
-      call-bound: 1.0.3
+      call-bind: 1.0.9
+      call-bound: 1.0.4
       define-data-property: 1.1.4
       define-properties: 1.2.1
-      es-abstract: 1.23.6
-      es-object-atoms: 1.0.0
+      es-abstract: 1.24.2
+      es-object-atoms: 1.1.2
       has-property-descriptors: 1.0.2
+      safe-regex-test: 1.1.0
 
-  string.prototype.trimend@1.0.9:
+  string.prototype.trimend@1.0.10:
     dependencies:
-      call-bind: 1.0.8
-      call-bound: 1.0.3
+      call-bind: 1.0.9
+      call-bound: 1.0.4
       define-properties: 1.2.1
-      es-object-atoms: 1.0.0
+      es-object-atoms: 1.1.2
 
   string.prototype.trimstart@1.0.8:
     dependencies:
-      call-bind: 1.0.8
+      call-bind: 1.0.9
       define-properties: 1.2.1
-      es-object-atoms: 1.0.0
+      es-object-atoms: 1.1.2
 
   string_decoder@1.1.1:
     dependencies:
@@ -18359,9 +21622,9 @@ snapshots:
     dependencies:
       ansi-regex: 5.0.1
 
-  strip-ansi@7.1.0:
+  strip-ansi@7.2.0:
     dependencies:
-      ansi-regex: 6.1.0
+      ansi-regex: 6.2.2
 
   strip-bom@3.0.0: {}
 
@@ -18369,153 +21632,144 @@ snapshots:
 
   strip-comments@2.0.1: {}
 
-  strip-final-newline@3.0.0: {}
-
   strip-final-newline@4.0.0: {}
 
-  strip-indent@3.0.0:
-    dependencies:
-      min-indent: 1.0.1
-
   strip-json-comments@2.0.1: {}
 
-  strip-json-comments@3.1.1: {}
+  strip-json-comments@5.0.3: {}
 
-  strip-literal@2.1.1:
+  strip-literal@4.0.0:
     dependencies:
-      js-tokens: 9.0.1
+      js-tokens: 10.0.0
 
-  stubborn-fs@1.2.5: {}
+  stubborn-fs@2.0.0:
+    dependencies:
+      stubborn-utils: 1.0.2
 
-  style-mod@4.1.2: {}
+  stubborn-utils@1.0.2: {}
+
+  style-mod@4.1.3: {}
 
   style-search@0.1.0: {}
 
-  stylehacks@7.0.4(postcss@8.4.49):
+  style-value-types@5.1.2:
     dependencies:
-      browserslist: 4.24.3
-      postcss: 8.4.49
-      postcss-selector-parser: 6.1.2
+      hey-listen: 1.0.8
+      tslib: 2.4.0
 
-  stylelint-config-html@1.1.0(postcss-html@1.7.0)(stylelint@16.12.0(typescript@5.7.2)):
+  stylehacks@7.0.11(postcss@8.5.26):
     dependencies:
-      postcss-html: 1.7.0
-      stylelint: 16.12.0(typescript@5.7.2)
+      browserslist: 4.28.8
+      postcss: 8.5.26
+      postcss-selector-parser: 7.1.5
 
-  stylelint-config-recess-order@5.1.1(stylelint@16.12.0(typescript@5.7.2)):
+  stylelint-config-html@2.0.0(postcss-html@1.8.1)(stylelint@17.14.1(supports-color@10.2.2)(typescript@6.0.3)):
     dependencies:
-      stylelint: 16.12.0(typescript@5.7.2)
-      stylelint-order: 6.0.4(stylelint@16.12.0(typescript@5.7.2))
+      postcss-html: 1.8.1
+      stylelint: 17.14.1(supports-color@10.2.2)(typescript@6.0.3)
 
-  stylelint-config-recommended-scss@14.1.0(postcss@8.4.49)(stylelint@16.12.0(typescript@5.7.2)):
+  stylelint-config-recess-order@7.7.0(stylelint-order@8.1.1(stylelint@17.14.1(supports-color@10.2.2)(typescript@6.0.3)))(stylelint@17.14.1(supports-color@10.2.2)(typescript@6.0.3)):
     dependencies:
-      postcss-scss: 4.0.9(postcss@8.4.49)
-      stylelint: 16.12.0(typescript@5.7.2)
-      stylelint-config-recommended: 14.0.1(stylelint@16.12.0(typescript@5.7.2))
-      stylelint-scss: 6.10.0(stylelint@16.12.0(typescript@5.7.2))
+      stylelint: 17.14.1(supports-color@10.2.2)(typescript@6.0.3)
+      stylelint-order: 8.1.1(stylelint@17.14.1(supports-color@10.2.2)(typescript@6.0.3))
+
+  stylelint-config-recommended-scss@17.0.1(postcss@8.5.26)(stylelint@17.14.1(supports-color@10.2.2)(typescript@6.0.3)):
+    dependencies:
+      postcss-scss: 4.0.9(postcss@8.5.26)
+      stylelint: 17.14.1(supports-color@10.2.2)(typescript@6.0.3)
+      stylelint-config-recommended: 18.0.0(stylelint@17.14.1(supports-color@10.2.2)(typescript@6.0.3))
+      stylelint-scss: 7.2.0(stylelint@17.14.1(supports-color@10.2.2)(typescript@6.0.3))
     optionalDependencies:
-      postcss: 8.4.49
+      postcss: 8.5.26
 
-  stylelint-config-recommended-vue@1.5.0(postcss-html@1.7.0)(stylelint@16.12.0(typescript@5.7.2)):
+  stylelint-config-recommended-vue@1.6.1(postcss-html@1.8.1)(stylelint@17.14.1(supports-color@10.2.2)(typescript@6.0.3)):
     dependencies:
-      postcss-html: 1.7.0
-      semver: 7.6.3
-      stylelint: 16.12.0(typescript@5.7.2)
-      stylelint-config-html: 1.1.0(postcss-html@1.7.0)(stylelint@16.12.0(typescript@5.7.2))
-      stylelint-config-recommended: 14.0.1(stylelint@16.12.0(typescript@5.7.2))
+      postcss-html: 1.8.1
+      semver: 7.8.5
+      stylelint: 17.14.1(supports-color@10.2.2)(typescript@6.0.3)
+      stylelint-config-html: 2.0.0(postcss-html@1.8.1)(stylelint@17.14.1(supports-color@10.2.2)(typescript@6.0.3))
+      stylelint-config-recommended: 18.0.0(stylelint@17.14.1(supports-color@10.2.2)(typescript@6.0.3))
 
-  stylelint-config-recommended@14.0.1(stylelint@16.12.0(typescript@5.7.2)):
+  stylelint-config-recommended@18.0.0(stylelint@17.14.1(supports-color@10.2.2)(typescript@6.0.3)):
     dependencies:
-      stylelint: 16.12.0(typescript@5.7.2)
+      stylelint: 17.14.1(supports-color@10.2.2)(typescript@6.0.3)
 
-  stylelint-config-standard@36.0.1(stylelint@16.12.0(typescript@5.7.2)):
+  stylelint-config-standard@40.0.0(stylelint@17.14.1(supports-color@10.2.2)(typescript@6.0.3)):
     dependencies:
-      stylelint: 16.12.0(typescript@5.7.2)
-      stylelint-config-recommended: 14.0.1(stylelint@16.12.0(typescript@5.7.2))
+      stylelint: 17.14.1(supports-color@10.2.2)(typescript@6.0.3)
+      stylelint-config-recommended: 18.0.0(stylelint@17.14.1(supports-color@10.2.2)(typescript@6.0.3))
 
-  stylelint-order@6.0.4(stylelint@16.12.0(typescript@5.7.2)):
+  stylelint-order@8.1.1(stylelint@17.14.1(supports-color@10.2.2)(typescript@6.0.3)):
     dependencies:
-      postcss: 8.4.49
-      postcss-sorting: 8.0.2(postcss@8.4.49)
-      stylelint: 16.12.0(typescript@5.7.2)
+      postcss: 8.5.26
+      postcss-sorting: 10.0.0(postcss@8.5.26)
+      stylelint: 17.14.1(supports-color@10.2.2)(typescript@6.0.3)
 
-  stylelint-prettier@5.0.2(prettier@3.4.2)(stylelint@16.12.0(typescript@5.7.2)):
+  stylelint-scss@7.2.0(stylelint@17.14.1(supports-color@10.2.2)(typescript@6.0.3)):
     dependencies:
-      prettier: 3.4.2
-      prettier-linter-helpers: 1.0.0
-      stylelint: 16.12.0(typescript@5.7.2)
-
-  stylelint-scss@6.10.0(stylelint@16.12.0(typescript@5.7.2)):
-    dependencies:
-      css-tree: 3.1.0
+      '@csstools/css-calc': 3.3.0(@csstools/css-parser-algorithms@4.0.0(@csstools/css-tokenizer@4.0.0))(@csstools/css-tokenizer@4.0.0)
+      '@csstools/css-parser-algorithms': 4.0.0(@csstools/css-tokenizer@4.0.0)
+      '@csstools/css-syntax-patches-for-csstree': 1.1.7(css-tree@3.2.1)
+      '@csstools/css-tokenizer': 4.0.0
+      css-tree: 3.2.1
       is-plain-object: 5.0.0
-      known-css-properties: 0.35.0
-      mdn-data: 2.14.0
+      known-css-properties: 0.37.0
       postcss-media-query-parser: 0.2.3
       postcss-resolve-nested-selector: 0.1.6
-      postcss-selector-parser: 7.0.0
+      postcss-selector-parser: 7.1.5
       postcss-value-parser: 4.2.0
-      stylelint: 16.12.0(typescript@5.7.2)
+      stylelint: 17.14.1(supports-color@10.2.2)(typescript@6.0.3)
 
-  stylelint@16.12.0(typescript@5.7.2):
+  stylelint@17.14.1(supports-color@10.2.2)(typescript@6.0.3):
     dependencies:
-      '@csstools/css-parser-algorithms': 3.0.4(@csstools/css-tokenizer@3.0.3)
-      '@csstools/css-tokenizer': 3.0.3
-      '@csstools/media-query-list-parser': 4.0.2(@csstools/css-parser-algorithms@3.0.4(@csstools/css-tokenizer@3.0.3))(@csstools/css-tokenizer@3.0.3)
-      '@csstools/selector-specificity': 5.0.0(postcss-selector-parser@7.0.0)
-      '@dual-bundle/import-meta-resolve': 4.1.0
-      balanced-match: 2.0.0
+      '@csstools/css-calc': 3.3.0(@csstools/css-parser-algorithms@4.0.0(@csstools/css-tokenizer@4.0.0))(@csstools/css-tokenizer@4.0.0)
+      '@csstools/css-parser-algorithms': 4.0.0(@csstools/css-tokenizer@4.0.0)
+      '@csstools/css-syntax-patches-for-csstree': 1.1.7(css-tree@3.2.1)
+      '@csstools/css-tokenizer': 4.0.0
+      '@csstools/media-query-list-parser': 5.0.0(@csstools/css-parser-algorithms@4.0.0(@csstools/css-tokenizer@4.0.0))(@csstools/css-tokenizer@4.0.0)
+      '@csstools/selector-resolve-nested': 4.0.1(postcss-selector-parser@7.1.5)
+      '@csstools/selector-specificity': 6.0.0(postcss-selector-parser@7.1.5)
       colord: 2.9.3
-      cosmiconfig: 9.0.0(typescript@5.7.2)
-      css-functions-list: 3.2.3
-      css-tree: 3.1.0
-      debug: 4.4.0(supports-color@9.4.0)
-      fast-glob: 3.3.2
+      cosmiconfig: 9.0.2(typescript@6.0.3)
+      css-functions-list: 3.3.3
+      css-tree: 3.2.1
+      debug: 4.4.3(supports-color@10.2.2)
+      fast-glob: 3.3.3
       fastest-levenshtein: 1.0.16
-      file-entry-cache: 9.1.0
+      file-entry-cache: 11.1.5
       global-modules: 2.0.0
-      globby: 11.1.0
+      globby: 16.2.3
       globjoin: 0.1.4
-      html-tags: 3.3.1
-      ignore: 6.0.2
-      imurmurhash: 0.1.4
-      is-plain-object: 5.0.0
-      known-css-properties: 0.35.0
-      mathml-tag-names: 2.1.3
-      meow: 13.2.0
+      html-tags: 5.1.0
+      ignore: 7.0.6
+      import-meta-resolve: 4.2.0
+      mathml-tag-names: 4.0.0
+      meow: 14.1.0
       micromatch: 4.0.8
       normalize-path: 3.0.0
       picocolors: 1.1.1
-      postcss: 8.4.49
-      postcss-resolve-nested-selector: 0.1.6
-      postcss-safe-parser: 7.0.1(postcss@8.4.49)
-      postcss-selector-parser: 7.0.0
+      postcss: 8.5.26
+      postcss-safe-parser: 7.0.1(postcss@8.5.26)
+      postcss-selector-parser: 7.1.5
       postcss-value-parser: 4.2.0
-      resolve-from: 5.0.0
-      string-width: 4.2.3
-      supports-hyperlinks: 3.1.0
+      string-width: 8.2.2
+      supports-hyperlinks: 4.5.0
       svg-tags: 1.0.0
       table: 6.9.0
-      write-file-atomic: 5.0.1
+      write-file-atomic: 7.0.1
     transitivePeerDependencies:
       - supports-color
       - typescript
 
-  stylis@4.3.4: {}
+  stylis@4.4.0: {}
 
-  sucrase@3.35.0:
+  sumchecker@3.0.1(supports-color@10.2.2):
     dependencies:
-      '@jridgewell/gen-mapping': 0.3.8
-      commander: 4.1.1
-      glob: 10.4.5
-      lines-and-columns: 1.2.4
-      mz: 2.7.0
-      pirates: 4.0.6
-      ts-interface-checker: 0.1.13
+      debug: 4.4.3(supports-color@10.2.2)
+    transitivePeerDependencies:
+      - supports-color
 
-  superjson@2.2.2:
-    dependencies:
-      copy-anything: 3.0.5
+  supports-color@10.2.2: {}
 
   supports-color@7.2.0:
     dependencies:
@@ -18525,87 +21779,54 @@ snapshots:
     dependencies:
       has-flag: 4.0.0
 
-  supports-color@9.4.0: {}
-
-  supports-hyperlinks@3.1.0:
+  supports-hyperlinks@4.5.0:
     dependencies:
-      has-flag: 4.0.0
-      supports-color: 7.2.0
+      has-flag: 5.0.1
+      supports-color: 10.2.2
 
   supports-preserve-symlinks-flag@1.0.0: {}
 
-  sver@1.8.4:
-    optionalDependencies:
-      semver: 6.3.1
+  sver@2.0.1: {}
 
   svg-tags@1.0.0: {}
 
-  svgo@3.3.2:
+  svgo@4.0.2:
     dependencies:
-      '@trysound/sax': 0.2.0
-      commander: 7.2.0
-      css-select: 5.1.0
-      css-tree: 2.3.1
-      css-what: 6.1.0
+      commander: 11.1.0
+      css-select: 5.2.2
+      css-tree: 3.2.1
+      css-what: 6.2.2
       csso: 5.0.5
       picocolors: 1.1.1
+      sax: 1.6.1
 
-  synckit@0.6.2:
+  sync-child-process@1.0.2:
     dependencies:
-      tslib: 2.8.1
+      sync-message-port: 1.2.0
 
-  synckit@0.9.2:
+  sync-message-port@1.2.0: {}
+
+  synckit@0.11.13:
     dependencies:
-      '@pkgr/core': 0.1.1
-      tslib: 2.8.1
-
-  system-architecture@0.1.0: {}
-
-  tabbable@6.2.0:
-    optional: true
+      '@pkgr/core': 0.3.6
 
   table@6.9.0:
     dependencies:
-      ajv: 8.17.1
+      ajv: 8.20.0
       lodash.truncate: 4.4.2
       slice-ansi: 4.0.0
       string-width: 4.2.3
       strip-ansi: 6.0.1
 
-  tailwind-merge@2.5.5: {}
+  tagged-tag@1.0.0: {}
 
-  tailwindcss-animate@1.0.7(tailwindcss@3.4.17):
-    dependencies:
-      tailwindcss: 3.4.17
+  tailwind-csstree@0.3.3: {}
 
-  tailwindcss@3.4.17:
-    dependencies:
-      '@alloc/quick-lru': 5.2.0
-      arg: 5.0.2
-      chokidar: 3.6.0
-      didyoumean: 1.2.2
-      dlv: 1.1.3
-      fast-glob: 3.3.2
-      glob-parent: 6.0.2
-      is-glob: 4.0.3
-      jiti: 1.21.7
-      lilconfig: 3.1.3
-      micromatch: 4.0.8
-      normalize-path: 3.0.0
-      object-hash: 3.0.0
-      picocolors: 1.1.1
-      postcss: 8.4.49
-      postcss-import: 15.1.0(postcss@8.4.49)
-      postcss-js: 4.0.1(postcss@8.4.49)
-      postcss-load-config: 4.0.2(postcss@8.4.49)
-      postcss-nested: 6.2.0(postcss@8.4.49)
-      postcss-selector-parser: 6.1.2
-      resolve: 1.22.10
-      sucrase: 3.35.0
-    transitivePeerDependencies:
-      - ts-node
+  tailwind-merge@3.6.0: {}
 
-  tapable@2.2.1: {}
+  tailwindcss@4.3.3: {}
+
+  tapable@2.3.3: {}
 
   tar-stream@2.2.0:
     dependencies:
@@ -18615,32 +21836,66 @@ snapshots:
       inherits: 2.0.4
       readable-stream: 3.6.2
 
-  tar-stream@3.1.7:
+  tar-stream@3.2.0:
     dependencies:
-      b4a: 1.6.7
+      b4a: 1.8.1
+      bare-fs: 4.8.0
       fast-fifo: 1.3.2
-      streamx: 2.21.1
+      streamx: 2.28.0
+    transitivePeerDependencies:
+      - bare-abort-controller
+      - bare-buffer
+      - react-native-b4a
 
-  tar@6.2.1:
-    dependencies:
-      chownr: 2.0.0
-      fs-minipass: 2.1.0
-      minipass: 5.0.0
-      minizlib: 2.1.2
-      mkdirp: 1.0.4
-      yallist: 4.0.0
-
-  tar@7.4.3:
+  tar@7.5.22:
     dependencies:
       '@isaacs/fs-minipass': 4.0.1
       chownr: 3.0.0
-      minipass: 7.1.2
-      minizlib: 3.0.1
-      mkdirp: 3.0.1
+      minipass: 7.1.3
+      minizlib: 3.1.0
       yallist: 5.0.0
 
+  tdesign-icons-vue-next@0.4.9(vue@3.5.41(typescript@6.0.3)):
+    dependencies:
+      '@babel/runtime': 7.29.7
+      vue: 3.5.41(typescript@6.0.3)
+
+  tdesign-vue-next@1.20.5(vue@3.5.41(typescript@6.0.3)):
+    dependencies:
+      '@babel/runtime': 7.29.7
+      '@popperjs/core': 2.11.8
+      '@types/lodash-es': 4.17.12
+      '@types/sortablejs': 1.15.9
+      '@types/tinycolor2': 1.4.6
+      '@types/validator': 13.15.10
+      dayjs: 1.11.21
+      lodash-es: 4.18.1
+      mitt: 3.0.1
+      sortablejs: 1.15.7
+      tdesign-icons-vue-next: 0.4.9(vue@3.5.41(typescript@6.0.3))
+      tinycolor2: 1.6.0
+      validator: 13.15.35
+      vue: 3.5.41(typescript@6.0.3)
+
+  teex@1.0.1:
+    dependencies:
+      streamx: 2.28.0
+    transitivePeerDependencies:
+      - bare-abort-controller
+      - react-native-b4a
+
   temp-dir@2.0.0: {}
 
+  temp-file@3.4.0:
+    dependencies:
+      async-exit-hook: 2.0.1
+      fs-extra: 10.1.0
+
+  temp@0.9.4:
+    dependencies:
+      mkdirp: 0.5.6
+      rimraf: 2.6.3
+
   tempy@0.6.0:
     dependencies:
       is-stream: 2.0.1
@@ -18650,18 +21905,18 @@ snapshots:
 
   term-size@2.2.1: {}
 
-  terser@5.37.0:
+  terser@5.49.2:
     dependencies:
-      '@jridgewell/source-map': 0.3.6
-      acorn: 8.14.0
+      '@jridgewell/source-map': 0.3.11
+      acorn: 8.18.0
       commander: 2.20.3
       source-map-support: 0.5.21
 
-  text-decoder@1.2.3:
+  text-decoder@1.2.7:
     dependencies:
-      b4a: 1.6.7
-
-  text-extensions@2.4.0: {}
+      b4a: 1.8.1
+    transitivePeerDependencies:
+      - react-native-b4a
 
   text-segmentation@1.0.3:
     dependencies:
@@ -18669,36 +21924,38 @@ snapshots:
 
   theme-colors@0.1.0: {}
 
-  thenify-all@1.6.0:
-    dependencies:
-      thenify: 3.3.1
-
-  thenify@3.3.1:
-    dependencies:
-      any-promise: 1.3.0
-
   throttle-debounce@5.0.2: {}
 
-  through@2.3.8: {}
+  tiny-async-pool@1.3.0:
+    dependencies:
+      semver: 5.7.2
+
+  tiny-typed-emitter@2.1.0: {}
 
   tinybench@2.9.0: {}
 
-  tinyexec@0.3.1: {}
+  tinyclip@0.1.15: {}
 
-  tinyglobby@0.2.10:
+  tinycolor2@1.6.0: {}
+
+  tinyexec@1.3.0: {}
+
+  tinyglobby@0.2.17:
     dependencies:
-      fdir: 6.4.2(picomatch@4.0.2)
-      picomatch: 4.0.2
+      fdir: 6.5.0(picomatch@4.0.5)
+      picomatch: 4.0.5
 
-  tinypool@1.0.2: {}
+  tinypool@2.1.0: {}
 
-  tinyrainbow@1.2.0: {}
+  tinyrainbow@3.1.1: {}
 
-  tinyspy@3.0.2: {}
-
-  tmp@0.0.33:
+  tippy.js@6.3.7:
     dependencies:
-      os-tmpdir: 1.0.2
+      '@popperjs/core': 2.11.8
+
+  tmp-promise@3.0.3:
+    dependencies:
+      tmp: 0.2.7
 
   tmp@0.2.7: {}
 
@@ -18712,75 +21969,102 @@ snapshots:
 
   tr46@0.0.3: {}
 
-  tr46@1.0.1:
-    dependencies:
-      punycode: 2.3.1
-
   traverse@0.3.9: {}
 
-  ts-api-utils@1.4.3(typescript@5.7.2):
-    dependencies:
-      typescript: 5.7.2
+  tree-kill@1.2.2: {}
 
-  ts-interface-checker@0.1.13: {}
+  truncate-utf8-bytes@1.0.2:
+    dependencies:
+      utf8-byte-length: 1.0.5
+
+  ts-api-utils@2.5.0(typescript@6.0.3):
+    dependencies:
+      typescript: 6.0.3
+
+  tsconfig-paths-webpack-plugin@4.2.0:
+    dependencies:
+      chalk: 4.1.2
+      enhanced-resolve: 5.24.5
+      tapable: 2.3.3
+      tsconfig-paths: 4.2.0
+
+  tsconfig-paths@4.2.0:
+    dependencies:
+      json5: 2.2.3
+      minimist: 1.2.8
+      strip-bom: 3.0.0
+
+  tsdown@0.22.14(@tsdown/css@0.22.14)(@volar/typescript@2.4.28)(oxc-resolver@11.24.2)(publint@0.3.23)(typescript@6.0.3)(vue-tsc@3.3.9(typescript@6.0.3)):
+    dependencies:
+      ansis: 4.3.1
+      cac: 7.0.0
+      defu: 6.1.7
+      empathic: 2.0.1
+      hookable: 6.1.1
+      import-without-cache: 0.4.0
+      obug: 2.1.4
+      picomatch: 4.0.5
+      rolldown: 1.2.3
+      rolldown-plugin-dts: 0.27.14(@volar/typescript@2.4.28)(oxc-resolver@11.24.2)(rolldown@1.2.3)(typescript@6.0.3)(vue-tsc@3.3.9(typescript@6.0.3))
+      tinyexec: 1.3.0
+      tinyglobby: 0.2.17
+      tree-kill: 1.2.2
+      unconfig-core: 7.5.0
+      verkit: 0.3.2
+    optionalDependencies:
+      '@tsdown/css': 0.22.14(jiti@2.7.0)(postcss@8.5.26)(sass-embedded@1.100.0)(sass@1.102.0)(tsdown@0.22.14)(yaml@2.9.0)
+      publint: 0.3.23
+      typescript: 6.0.3
+    transitivePeerDependencies:
+      - '@typescript/native-preview'
+      - '@volar/typescript'
+      - oxc-resolver
+      - vue-tsc
 
   tslib@2.3.0: {}
 
+  tslib@2.4.0: {}
+
   tslib@2.8.1: {}
 
-  turbo-darwin-64@2.3.3:
-    optional: true
-
-  turbo-darwin-arm64@2.3.3:
-    optional: true
-
-  turbo-linux-64@2.3.3:
-    optional: true
-
-  turbo-linux-arm64@2.3.3:
-    optional: true
-
-  turbo-windows-64@2.3.3:
-    optional: true
-
-  turbo-windows-arm64@2.3.3:
-    optional: true
-
-  turbo@2.3.3:
+  turbo@2.10.9:
     optionalDependencies:
-      turbo-darwin-64: 2.3.3
-      turbo-darwin-arm64: 2.3.3
-      turbo-linux-64: 2.3.3
-      turbo-linux-arm64: 2.3.3
-      turbo-windows-64: 2.3.3
-      turbo-windows-arm64: 2.3.3
+      '@turbo/darwin-64': 2.10.9
+      '@turbo/darwin-arm64': 2.10.9
+      '@turbo/linux-64': 2.10.9
+      '@turbo/linux-arm64': 2.10.9
+      '@turbo/windows-64': 2.10.9
+      '@turbo/windows-arm64': 2.10.9
+
+  tw-animate-css@1.4.0: {}
 
   type-check@0.4.0:
     dependencies:
       prelude-ls: 1.2.1
 
+  type-fest@0.13.1:
+    optional: true
+
   type-fest@0.16.0: {}
 
-  type-fest@0.20.2: {}
+  type-fest@4.41.0: {}
 
-  type-fest@0.6.0: {}
-
-  type-fest@0.8.1: {}
-
-  type-fest@4.30.2: {}
+  type-fest@5.8.0:
+    dependencies:
+      tagged-tag: 1.0.0
 
   type@2.7.3: {}
 
   typed-array-buffer@1.0.3:
     dependencies:
-      call-bound: 1.0.3
+      call-bound: 1.0.4
       es-errors: 1.3.0
       is-typed-array: 1.1.15
 
   typed-array-byte-length@1.0.3:
     dependencies:
-      call-bind: 1.0.8
-      for-each: 0.3.3
+      call-bind: 1.0.9
+      for-each: 0.3.5
       gopd: 1.2.0
       has-proto: 1.2.0
       is-typed-array: 1.1.15
@@ -18788,135 +22072,145 @@ snapshots:
   typed-array-byte-offset@1.0.4:
     dependencies:
       available-typed-arrays: 1.0.7
-      call-bind: 1.0.8
-      for-each: 0.3.3
+      call-bind: 1.0.9
+      for-each: 0.3.5
       gopd: 1.2.0
       has-proto: 1.2.0
       is-typed-array: 1.1.15
-      reflect.getprototypeof: 1.0.9
+      reflect.getprototypeof: 1.0.10
 
-  typed-array-length@1.0.7:
+  typed-array-length@1.0.8:
     dependencies:
-      call-bind: 1.0.8
-      for-each: 0.3.3
+      call-bind: 1.0.9
+      for-each: 0.3.5
       gopd: 1.2.0
       is-typed-array: 1.1.15
-      possible-typed-array-names: 1.0.0
-      reflect.getprototypeof: 1.0.9
+      possible-typed-array-names: 1.1.0
+      reflect.getprototypeof: 1.0.10
 
-  typescript@5.4.2: {}
-
-  typescript@5.6.3: {}
-
-  typescript@5.7.2: {}
+  typescript@6.0.3: {}
 
   uc.micro@2.1.0: {}
 
-  ufo@1.5.4: {}
+  ufo@1.6.4: {}
+
+  ultrahtml@1.7.0: {}
+
+  unbash@4.0.10: {}
 
   unbox-primitive@1.1.0:
     dependencies:
-      call-bound: 1.0.3
+      call-bound: 1.0.4
       has-bigints: 1.1.0
       has-symbols: 1.1.0
       which-boxed-primitive: 1.1.1
 
-  unbuild@3.0.1(typescript@5.6.3)(vue-tsc@2.1.10(typescript@5.6.3))(vue@3.5.13(typescript@5.6.3)):
+  unbuild@3.6.1(sass@1.102.0)(typescript@6.0.3)(vue-tsc@3.3.9(typescript@6.0.3))(vue@3.5.41(typescript@6.0.3)):
     dependencies:
-      '@rollup/plugin-alias': 5.1.1(rollup@4.28.1)
-      '@rollup/plugin-commonjs': 28.0.2(rollup@4.28.1)
-      '@rollup/plugin-json': 6.1.0(rollup@4.28.1)
-      '@rollup/plugin-node-resolve': 15.3.1(rollup@4.28.1)
-      '@rollup/plugin-replace': 6.0.2(rollup@4.28.1)
-      '@rollup/pluginutils': 5.1.4(rollup@4.28.1)
+      '@rollup/plugin-alias': 5.1.1(rollup@4.62.4)
+      '@rollup/plugin-commonjs': 28.0.9(rollup@4.62.4)
+      '@rollup/plugin-json': 6.1.0(rollup@4.62.4)
+      '@rollup/plugin-node-resolve': 16.0.3(rollup@4.62.4)
+      '@rollup/plugin-replace': 6.0.3(rollup@4.62.4)
+      '@rollup/pluginutils': 5.4.0(rollup@4.62.4)
       citty: 0.1.6
-      consola: 3.3.0
-      defu: 6.1.4
-      esbuild: 0.24.0
+      consola: 3.4.2
+      defu: 6.1.7
+      esbuild: 0.25.12
+      fix-dts-default-cjs-exports: 1.0.1
       hookable: 5.5.3
-      jiti: 2.4.2
-      magic-string: 0.30.17
-      mkdist: 2.1.0(typescript@5.6.3)(vue-tsc@2.1.10(typescript@5.6.3))(vue@3.5.13(typescript@5.6.3))
-      mlly: 1.7.3
-      pathe: 1.1.2
-      pkg-types: 1.2.1
-      pretty-bytes: 6.1.1
-      rollup: 4.28.1
-      rollup-plugin-dts: 6.1.1(rollup@4.28.1)(typescript@5.6.3)
+      jiti: 2.7.0
+      magic-string: 0.30.21
+      mkdist: 2.4.1(sass@1.102.0)(typescript@6.0.3)(vue-tsc@3.3.9(typescript@6.0.3))(vue@3.5.41(typescript@6.0.3))
+      mlly: 1.8.2
+      pathe: 2.0.3
+      pkg-types: 2.3.1
+      pretty-bytes: 7.1.1
+      rollup: 4.62.4
+      rollup-plugin-dts: 6.5.1(rollup@4.62.4)(typescript@6.0.3)
       scule: 1.3.0
-      tinyglobby: 0.2.10
-      ufo: 1.5.4
-      untyped: 1.5.2
+      tinyglobby: 0.2.17
+      untyped: 2.0.0
     optionalDependencies:
-      typescript: 5.6.3
+      typescript: 6.0.3
     transitivePeerDependencies:
+      - '@typescript/typescript6'
       - sass
-      - supports-color
       - vue
+      - vue-sfc-transformer
       - vue-tsc
 
+  unconfig-core@7.5.0:
+    dependencies:
+      '@quansync/fs': 1.0.0
+      quansync: 1.0.0
+
   uncrypto@0.1.3: {}
 
-  unctx@2.4.1:
+  unctx@2.5.0:
     dependencies:
-      acorn: 8.14.0
+      acorn: 8.18.0
       estree-walker: 3.0.3
-      magic-string: 0.30.17
-      unplugin: 2.1.0
+      magic-string: 0.30.21
+      unplugin: 2.3.11
 
-  undici-types@6.20.0: {}
+  undici-types@7.18.2: {}
 
-  undici@6.21.0: {}
+  undici-types@7.24.6: {}
 
-  unenv@1.10.0:
+  undici-types@8.3.0: {}
+
+  undici@6.28.0: {}
+
+  undici@7.29.0: {}
+
+  unenv@2.0.0-rc.24:
     dependencies:
-      consola: 3.3.0
-      defu: 6.1.4
-      mime: 3.0.0
-      node-fetch-native: 1.6.4
-      pathe: 1.1.2
+      pathe: 2.0.3
 
   unicode-canonical-property-names-ecmascript@2.0.1: {}
 
   unicode-match-property-ecmascript@2.0.0:
     dependencies:
       unicode-canonical-property-names-ecmascript: 2.0.1
-      unicode-property-aliases-ecmascript: 2.1.0
+      unicode-property-aliases-ecmascript: 2.2.0
 
-  unicode-match-property-value-ecmascript@2.2.0: {}
+  unicode-match-property-value-ecmascript@2.2.1: {}
 
-  unicode-property-aliases-ecmascript@2.1.0: {}
-
-  unicorn-magic@0.1.0: {}
+  unicode-property-aliases-ecmascript@2.2.0: {}
 
   unicorn-magic@0.3.0: {}
 
-  unimport@3.14.5(rollup@4.28.1):
+  unicorn-magic@0.4.0: {}
+
+  unimport@6.4.0(esbuild@0.28.2)(oxc-parser@0.142.0)(rolldown@1.2.3)(rollup@4.62.4)(vite@8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0)):
     dependencies:
-      '@rollup/pluginutils': 5.1.4(rollup@4.28.1)
-      acorn: 8.14.0
+      acorn: 8.18.0
       escape-string-regexp: 5.0.0
       estree-walker: 3.0.3
-      fast-glob: 3.3.2
-      local-pkg: 0.5.1
-      magic-string: 0.30.17
-      mlly: 1.7.3
-      pathe: 1.1.2
-      picomatch: 4.0.2
-      pkg-types: 1.2.1
+      local-pkg: 1.2.1
+      magic-string: 1.1.0
+      mlly: 1.8.2
+      pathe: 2.0.3
+      picomatch: 4.0.5
+      pkg-types: 2.3.1
       scule: 1.3.0
-      strip-literal: 2.1.1
-      unplugin: 1.16.0
+      strip-literal: 4.0.0
+      tinyglobby: 0.2.17
+      unplugin: 3.3.0(esbuild@0.28.2)(rolldown@1.2.3)(rollup@4.62.4)(vite@8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0))
+      unplugin-utils: 0.3.2
+    optionalDependencies:
+      oxc-parser: 0.142.0
+      rolldown: 1.2.3
     transitivePeerDependencies:
+      - '@farmfe/core'
+      - '@rspack/core'
+      - bun-types-no-globals
+      - esbuild
       - rollup
-
-  unique-filename@1.1.1:
-    dependencies:
-      unique-slug: 2.0.2
-
-  unique-slug@2.0.2:
-    dependencies:
-      imurmurhash: 0.1.4
+      - unloader
+      - vite
+      - webpack
 
   unique-string@2.0.0:
     dependencies:
@@ -18926,59 +22220,111 @@ snapshots:
 
   universalify@2.0.1: {}
 
-  unplugin@1.16.0:
+  unplugin-dts@1.0.3(@vue/language-core@3.3.9)(esbuild@0.28.2)(rolldown@1.2.3)(rollup@4.62.4)(supports-color@10.2.2)(typescript@6.0.3)(vite@8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0)):
     dependencies:
-      acorn: 8.14.0
-      webpack-virtual-modules: 0.6.2
-
-  unplugin@2.1.0:
-    dependencies:
-      acorn: 8.14.0
-      webpack-virtual-modules: 0.6.2
-
-  unstorage@1.14.1(db0@0.2.1)(ioredis@5.4.2):
-    dependencies:
-      anymatch: 3.1.3
-      chokidar: 3.6.0
-      citty: 0.1.6
-      destr: 2.0.3
-      h3: 1.13.0
-      listhen: 1.9.0
-      lru-cache: 10.4.3
-      node-fetch-native: 1.6.4
-      ofetch: 1.4.1
-      ufo: 1.5.4
+      '@rollup/pluginutils': 5.4.0(rollup@4.62.4)
+      '@volar/typescript': 2.4.28
+      compare-versions: 6.1.1
+      debug: 4.4.3(supports-color@10.2.2)
+      kolorist: 1.8.0
+      local-pkg: 1.2.1
+      magic-string: 0.30.21
+      typescript: 6.0.3
+      unplugin: 2.3.11
     optionalDependencies:
-      db0: 0.2.1
-      ioredis: 5.4.2
-
-  untun@0.1.3:
-    dependencies:
-      citty: 0.1.6
-      consola: 3.3.0
-      pathe: 1.1.2
-
-  untyped@1.5.2:
-    dependencies:
-      '@babel/core': 7.26.0
-      '@babel/standalone': 7.26.4
-      '@babel/types': 7.26.3
-      citty: 0.1.6
-      defu: 6.1.4
-      jiti: 2.4.2
-      knitwork: 1.2.0
-      scule: 1.3.0
+      '@vue/language-core': 3.3.9
+      esbuild: 0.28.2
+      rolldown: 1.2.3
+      rollup: 4.62.4
+      vite: 8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0)
     transitivePeerDependencies:
       - supports-color
 
-  unwasm@0.3.9:
+  unplugin-utils@0.3.2:
     dependencies:
-      knitwork: 1.2.0
-      magic-string: 0.30.17
-      mlly: 1.7.3
-      pathe: 1.1.2
-      pkg-types: 1.2.1
-      unplugin: 1.16.0
+      pathe: 2.0.3
+      picomatch: 4.0.5
+
+  unplugin-vue@7.2.0(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(rolldown@1.2.3)(rollup@4.62.4)(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(vue@3.5.41(typescript@6.0.3))(yaml@2.9.0):
+    dependencies:
+      '@jridgewell/gen-mapping': 0.3.13
+      '@jridgewell/trace-mapping': 0.3.31
+      '@vue/reactivity': 3.5.41
+      obug: 2.1.4
+      unplugin: 3.3.0(esbuild@0.28.2)(rolldown@1.2.3)(rollup@4.62.4)(vite@8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0))
+      vite: 8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0)
+      vue: 3.5.41(typescript@6.0.3)
+    transitivePeerDependencies:
+      - '@farmfe/core'
+      - '@rspack/core'
+      - '@types/node'
+      - '@vitejs/devtools'
+      - bun-types-no-globals
+      - esbuild
+      - jiti
+      - less
+      - rolldown
+      - rollup
+      - sass
+      - sass-embedded
+      - stylus
+      - sugarss
+      - terser
+      - tsx
+      - unloader
+      - webpack
+      - yaml
+
+  unplugin@2.3.11:
+    dependencies:
+      '@jridgewell/remapping': 2.3.5
+      acorn: 8.18.0
+      picomatch: 4.0.5
+      webpack-virtual-modules: 0.6.2
+
+  unplugin@3.3.0(esbuild@0.28.2)(rolldown@1.2.3)(rollup@4.62.4)(vite@8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0)):
+    dependencies:
+      '@jridgewell/remapping': 2.3.5
+      picomatch: 4.0.5
+      webpack-virtual-modules: 0.6.2
+    optionalDependencies:
+      esbuild: 0.28.2
+      rolldown: 1.2.3
+      rollup: 4.62.4
+      vite: 8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0)
+
+  unstorage@1.17.5(db0@0.3.4)(ioredis@5.11.1(supports-color@10.2.2)):
+    dependencies:
+      anymatch: 3.1.3
+      chokidar: 5.0.0
+      destr: 2.0.5
+      h3: 1.15.11
+      lru-cache: 11.5.2
+      node-fetch-native: 1.6.7
+      ofetch: 1.5.1
+      ufo: 1.6.4
+    optionalDependencies:
+      db0: 0.3.4
+      ioredis: 5.11.1(supports-color@10.2.2)
+
+  untun@0.2.2: {}
+
+  untyped@2.0.0:
+    dependencies:
+      citty: 0.1.6
+      defu: 6.1.7
+      jiti: 2.7.0
+      knitwork: 1.3.0
+      scule: 1.3.0
+
+  unwasm@0.5.3:
+    dependencies:
+      exsolve: 1.1.1
+      knitwork: 1.3.0
+      magic-string: 0.30.21
+      mlly: 1.8.2
+      pathe: 2.0.3
+      pkg-types: 2.3.1
 
   unzipper@0.10.14:
     dependencies:
@@ -18993,36 +22339,42 @@ snapshots:
       readable-stream: 2.3.8
       setimmediate: 1.0.5
 
+  unzipper@0.12.5:
+    dependencies:
+      bluebird: 3.7.2
+      duplexer2: 0.1.4
+      fs-extra: 11.3.1
+      graceful-fs: 4.2.11
+      node-int64: 0.4.0
+
   upath@1.2.0: {}
 
-  update-browserslist-db@1.1.1(browserslist@4.24.3):
+  update-browserslist-db@1.3.0(browserslist@4.28.8):
     dependencies:
-      browserslist: 4.24.3
+      browserslist: 4.28.8
       escalade: 3.2.0
       picocolors: 1.1.1
 
   update-notifier@7.3.1:
     dependencies:
       boxen: 8.0.1
-      chalk: 5.4.0
-      configstore: 7.0.0
+      chalk: 5.6.2
+      configstore: 7.1.0
       is-in-ci: 1.0.0
       is-installed-globally: 1.0.0
-      is-npm: 6.0.0
+      is-npm: 6.1.0
       latest-version: 9.0.0
-      pupa: 3.1.0
-      semver: 7.6.3
+      pupa: 3.3.0
+      semver: 7.8.5
       xdg-basedir: 5.1.0
 
-  uqr@0.1.2: {}
-
-  uri-js-replace@1.0.1: {}
+  uqr@0.1.3: {}
 
   uri-js@4.4.1:
     dependencies:
       punycode: 2.3.1
 
-  urlpattern-polyfill@8.0.2: {}
+  utf8-byte-length@1.0.5: {}
 
   util-deprecate@1.0.2: {}
 
@@ -19032,303 +22384,303 @@ snapshots:
 
   uuid@8.3.2: {}
 
-  validate-npm-package-license@3.0.4:
-    dependencies:
-      spdx-correct: 3.2.0
-      spdx-expression-parse: 3.0.1
+  valibot@1.4.2(typescript@6.0.3):
+    optionalDependencies:
+      typescript: 6.0.3
 
-  vee-validate@4.14.7(vue@3.5.13(typescript@5.7.2)):
-    dependencies:
-      '@vue/devtools-api': 7.6.8
-      type-fest: 4.30.2
-      vue: 3.5.13(typescript@5.7.2)
+  validator@13.15.35: {}
 
-  vite-hot-client@0.2.4(vite@6.0.5(@types/node@22.10.2)(jiti@2.4.2)(less@4.2.1)(sass@1.80.6)(terser@5.37.0)(yaml@2.6.1)):
-    dependencies:
-      vite: 6.0.5(@types/node@22.10.2)(jiti@2.4.2)(less@4.2.1)(sass@1.80.6)(terser@5.37.0)(yaml@2.6.1)
+  varint@6.0.0: {}
 
-  vite-node@2.1.8(@types/node@22.10.2)(less@4.2.1)(sass@1.80.6)(terser@5.37.0):
-    dependencies:
-      cac: 6.7.14
-      debug: 4.4.0(supports-color@9.4.0)
-      es-module-lexer: 1.5.4
-      pathe: 1.1.2
-      vite: 5.4.11(@types/node@22.10.2)(less@4.2.1)(sass@1.80.6)(terser@5.37.0)
-    transitivePeerDependencies:
-      - '@types/node'
-      - less
-      - lightningcss
-      - sass
-      - sass-embedded
-      - stylus
-      - sugarss
-      - supports-color
-      - terser
+  verkit@0.3.2: {}
 
-  vite-plugin-compression@0.5.1(vite@6.0.5(@types/node@22.10.2)(jiti@2.4.2)(less@4.2.1)(sass@1.80.6)(terser@5.37.0)(yaml@2.6.1)):
+  vite-dev-rpc@2.0.0(vite@8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0)):
+    dependencies:
+      birpc: 4.1.0
+      vite: 8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0)
+      vite-hot-client: 2.2.0(vite@8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0))
+
+  vite-hot-client@2.2.0(vite@8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0)):
+    dependencies:
+      vite: 8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0)
+
+  vite-plugin-compression@0.5.1(supports-color@10.2.2)(vite@8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0)):
     dependencies:
       chalk: 4.1.2
-      debug: 4.4.0(supports-color@9.4.0)
+      debug: 4.4.3(supports-color@10.2.2)
       fs-extra: 10.1.0
-      vite: 6.0.5(@types/node@22.10.2)(jiti@2.4.2)(less@4.2.1)(sass@1.80.6)(terser@5.37.0)(yaml@2.6.1)
+      vite: 8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0)
     transitivePeerDependencies:
       - supports-color
 
-  vite-plugin-dts@4.2.1(@types/node@22.10.2)(rollup@4.28.1)(typescript@5.7.2)(vite@6.0.5(@types/node@22.10.2)(jiti@2.4.2)(less@4.2.1)(sass@1.80.6)(terser@5.37.0)(yaml@2.6.1)):
+  vite-plugin-inspect@11.4.1(@nuxt/kit@3.21.11(magicast@0.5.4))(vite@8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0)):
     dependencies:
-      '@microsoft/api-extractor': 7.47.7(@types/node@22.10.2)
-      '@rollup/pluginutils': 5.1.4(rollup@4.28.1)
-      '@volar/typescript': 2.4.11
-      '@vue/language-core': 2.1.6(typescript@5.7.2)
-      compare-versions: 6.1.1
-      debug: 4.4.0(supports-color@9.4.0)
-      kolorist: 1.8.0
-      local-pkg: 0.5.1
-      magic-string: 0.30.17
-      typescript: 5.7.2
+      ansis: 4.3.1
+      error-stack-parser-es: 1.0.5
+      obug: 2.1.4
+      ohash: 2.0.11
+      open: 11.0.0
+      perfect-debounce: 2.1.0
+      sirv: 3.0.2
+      unplugin-utils: 0.3.2
+      vite: 8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0)
+      vite-dev-rpc: 2.0.0(vite@8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0))
     optionalDependencies:
-      vite: 6.0.5(@types/node@22.10.2)(jiti@2.4.2)(less@4.2.1)(sass@1.80.6)(terser@5.37.0)(yaml@2.6.1)
-    transitivePeerDependencies:
-      - '@types/node'
-      - rollup
-      - supports-color
-
-  vite-plugin-html@3.2.2(vite@6.0.5(@types/node@22.10.2)(jiti@2.4.2)(less@4.2.1)(sass@1.80.6)(terser@5.37.0)(yaml@2.6.1)):
-    dependencies:
-      '@rollup/pluginutils': 4.2.1
-      colorette: 2.0.20
-      connect-history-api-fallback: 1.6.0
-      consola: 2.15.3
-      dotenv: 16.4.7
-      dotenv-expand: 8.0.3
-      ejs: 3.1.10
-      fast-glob: 3.3.2
-      fs-extra: 10.1.0
-      html-minifier-terser: 6.1.0
-      node-html-parser: 5.4.2
-      pathe: 0.2.0
-      vite: 6.0.5(@types/node@22.10.2)(jiti@2.4.2)(less@4.2.1)(sass@1.80.6)(terser@5.37.0)(yaml@2.6.1)
-
-  vite-plugin-inspect@0.8.9(rollup@4.28.1)(vite@6.0.5(@types/node@22.10.2)(jiti@2.4.2)(less@4.2.1)(sass@1.80.6)(terser@5.37.0)(yaml@2.6.1)):
-    dependencies:
-      '@antfu/utils': 0.7.10
-      '@rollup/pluginutils': 5.1.4(rollup@4.28.1)
-      debug: 4.4.0(supports-color@9.4.0)
-      error-stack-parser-es: 0.1.5
-      fs-extra: 11.2.0
-      open: 10.1.0
-      perfect-debounce: 1.0.0
-      picocolors: 1.1.1
-      sirv: 3.0.0
-      vite: 6.0.5(@types/node@22.10.2)(jiti@2.4.2)(less@4.2.1)(sass@1.80.6)(terser@5.37.0)(yaml@2.6.1)
-    transitivePeerDependencies:
-      - rollup
-      - supports-color
+      '@nuxt/kit': 3.21.11(magicast@0.5.4)
 
   vite-plugin-lazy-import@1.0.7:
     dependencies:
-      '@rollup/pluginutils': 5.1.4(rollup@4.28.1)
-      es-module-lexer: 1.5.4
-      rollup: 4.28.1
-      xe-utils: 3.5.32
+      '@rollup/pluginutils': 5.4.0(rollup@4.62.4)
+      es-module-lexer: 1.7.0
+      rollup: 4.62.4
+      xe-utils: 3.9.1
 
-  vite-plugin-pwa@0.21.1(vite@6.0.5(@types/node@22.10.2)(jiti@2.4.2)(less@4.2.1)(sass@1.80.6)(terser@5.37.0)(yaml@2.6.1))(workbox-build@7.3.0)(workbox-window@7.3.0):
+  vite-plugin-pwa@1.3.0(supports-color@10.2.2)(vite@8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0))(workbox-build@7.4.1(supports-color@10.2.2))(workbox-window@7.4.1):
     dependencies:
-      debug: 4.4.0(supports-color@9.4.0)
+      debug: 4.4.3(supports-color@10.2.2)
       pretty-bytes: 6.1.1
-      tinyglobby: 0.2.10
-      vite: 6.0.5(@types/node@22.10.2)(jiti@2.4.2)(less@4.2.1)(sass@1.80.6)(terser@5.37.0)(yaml@2.6.1)
-      workbox-build: 7.3.0
-      workbox-window: 7.3.0
+      tinyglobby: 0.2.17
+      vite: 8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0)
+      workbox-build: 7.4.1(supports-color@10.2.2)
+      workbox-window: 7.4.1
     transitivePeerDependencies:
       - supports-color
 
-  vite-plugin-vue-devtools@7.6.8(rollup@4.28.1)(vite@6.0.5(@types/node@22.10.2)(jiti@2.4.2)(less@4.2.1)(sass@1.80.6)(terser@5.37.0)(yaml@2.6.1))(vue@3.5.13(typescript@5.7.2)):
+  vite-plugin-vue-devtools@8.2.1(@nuxt/kit@3.21.11(magicast@0.5.4))(supports-color@10.2.2)(vite@8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0))(vue@3.5.41(typescript@6.0.3)):
     dependencies:
-      '@vue/devtools-core': 7.6.8(vite@6.0.5(@types/node@22.10.2)(jiti@2.4.2)(less@4.2.1)(sass@1.80.6)(terser@5.37.0)(yaml@2.6.1))(vue@3.5.13(typescript@5.7.2))
-      '@vue/devtools-kit': 7.6.8
-      '@vue/devtools-shared': 7.6.8
-      execa: 9.5.2
-      sirv: 3.0.0
-      vite: 6.0.5(@types/node@22.10.2)(jiti@2.4.2)(less@4.2.1)(sass@1.80.6)(terser@5.37.0)(yaml@2.6.1)
-      vite-plugin-inspect: 0.8.9(rollup@4.28.1)(vite@6.0.5(@types/node@22.10.2)(jiti@2.4.2)(less@4.2.1)(sass@1.80.6)(terser@5.37.0)(yaml@2.6.1))
-      vite-plugin-vue-inspector: 5.3.1(vite@6.0.5(@types/node@22.10.2)(jiti@2.4.2)(less@4.2.1)(sass@1.80.6)(terser@5.37.0)(yaml@2.6.1))
+      '@vue/devtools-core': 8.2.1(vue@3.5.41(typescript@6.0.3))
+      '@vue/devtools-kit': 8.2.1
+      '@vue/devtools-shared': 8.2.1
+      sirv: 3.0.2
+      vite: 8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0)
+      vite-plugin-inspect: 11.4.1(@nuxt/kit@3.21.11(magicast@0.5.4))(vite@8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0))
+      vite-plugin-vue-inspector: 6.0.0(supports-color@10.2.2)(vite@8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0))
     transitivePeerDependencies:
       - '@nuxt/kit'
-      - rollup
       - supports-color
       - vue
 
-  vite-plugin-vue-inspector@5.3.1(vite@6.0.5(@types/node@22.10.2)(jiti@2.4.2)(less@4.2.1)(sass@1.80.6)(terser@5.37.0)(yaml@2.6.1)):
+  vite-plugin-vue-inspector@6.0.0(supports-color@10.2.2)(vite@8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0)):
     dependencies:
-      '@babel/core': 7.26.0
-      '@babel/plugin-proposal-decorators': 7.25.9(@babel/core@7.26.0)
-      '@babel/plugin-syntax-import-attributes': 7.26.0(@babel/core@7.26.0)
-      '@babel/plugin-syntax-import-meta': 7.10.4(@babel/core@7.26.0)
-      '@babel/plugin-transform-typescript': 7.26.3(@babel/core@7.26.0)
-      '@vue/babel-plugin-jsx': 1.2.5(@babel/core@7.26.0)
-      '@vue/compiler-dom': 3.5.13
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/plugin-proposal-decorators': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
+      '@babel/plugin-syntax-import-attributes': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))
+      '@babel/plugin-syntax-import-meta': 7.10.4(@babel/core@7.29.7(supports-color@10.2.2))
+      '@babel/plugin-transform-typescript': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
+      '@vue/babel-plugin-jsx': 1.5.0(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
+      '@vue/compiler-dom': 3.5.41
       kolorist: 1.8.0
-      magic-string: 0.30.17
-      vite: 6.0.5(@types/node@22.10.2)(jiti@2.4.2)(less@4.2.1)(sass@1.80.6)(terser@5.37.0)(yaml@2.6.1)
+      magic-string: 0.30.21
+      vite: 8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0)
     transitivePeerDependencies:
       - supports-color
 
-  vite@5.4.11(@types/node@22.10.2)(less@4.2.1)(sass@1.80.6)(terser@5.37.0):
+  vite@7.3.6(@types/node@25.9.5)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(lightningcss@1.33.0)(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0):
     dependencies:
-      esbuild: 0.24.0
-      postcss: 8.4.49
-      rollup: 4.28.1
+      esbuild: 0.28.2
+      fdir: 6.5.0(picomatch@4.0.5)
+      picomatch: 4.0.5
+      postcss: 8.5.26
+      rollup: 4.62.4
+      tinyglobby: 0.2.17
     optionalDependencies:
-      '@types/node': 22.10.2
+      '@types/node': 25.9.5
       fsevents: 2.3.3
-      less: 4.2.1
-      sass: 1.80.6
-      terser: 5.37.0
+      jiti: 2.7.0
+      less: 4.8.1(supports-color@10.2.2)
+      lightningcss: 1.33.0
+      sass: 1.102.0
+      sass-embedded: 1.100.0
+      terser: 5.49.2
+      yaml: 2.9.0
 
-  vite@6.0.5(@types/node@22.10.2)(jiti@2.4.2)(less@4.2.1)(sass@1.80.6)(terser@5.37.0)(yaml@2.6.1):
+  vite@8.2.1(@types/node@25.9.5)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0):
     dependencies:
-      esbuild: 0.24.0
-      postcss: 8.4.49
-      rollup: 4.28.1
+      lightningcss: 1.33.0
+      picomatch: 4.0.5
+      postcss: 8.5.26
+      rolldown: 1.2.3
+      tinyglobby: 0.2.17
     optionalDependencies:
-      '@types/node': 22.10.2
+      '@types/node': 25.9.5
+      esbuild: 0.28.2
       fsevents: 2.3.3
-      jiti: 2.4.2
-      less: 4.2.1
-      sass: 1.80.6
-      terser: 5.37.0
-      yaml: 2.6.1
+      jiti: 2.7.0
+      less: 4.8.1(supports-color@10.2.2)
+      sass: 1.102.0
+      sass-embedded: 1.100.0
+      terser: 5.49.2
+      yaml: 2.9.0
 
-  vitest@2.1.8(@types/node@22.10.2)(happy-dom@15.11.7)(less@4.2.1)(sass@1.80.6)(terser@5.37.0):
+  vite@8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0):
     dependencies:
-      '@vitest/expect': 2.1.8
-      '@vitest/mocker': 2.1.8(vite@5.4.11(@types/node@22.10.2)(less@4.2.1)(sass@1.80.6)(terser@5.37.0))
-      '@vitest/pretty-format': 2.1.8
-      '@vitest/runner': 2.1.8
-      '@vitest/snapshot': 2.1.8
-      '@vitest/spy': 2.1.8
-      '@vitest/utils': 2.1.8
-      chai: 5.1.2
-      debug: 4.4.0(supports-color@9.4.0)
-      expect-type: 1.1.0
-      magic-string: 0.30.17
-      pathe: 1.1.2
-      std-env: 3.8.0
+      lightningcss: 1.33.0
+      picomatch: 4.0.5
+      postcss: 8.5.26
+      rolldown: 1.2.3
+      tinyglobby: 0.2.17
+    optionalDependencies:
+      '@types/node': 26.2.0
+      esbuild: 0.28.2
+      fsevents: 2.3.3
+      jiti: 2.7.0
+      less: 4.8.1(supports-color@10.2.2)
+      sass: 1.102.0
+      sass-embedded: 1.100.0
+      terser: 5.49.2
+      yaml: 2.9.0
+
+  vitest@4.1.10(@types/node@25.9.5)(happy-dom@20.11.2)(vite@8.2.1(@types/node@25.9.5)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0)):
+    dependencies:
+      '@vitest/expect': 4.1.10
+      '@vitest/mocker': 4.1.10(vite@8.2.1(@types/node@25.9.5)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0))
+      '@vitest/pretty-format': 4.1.10
+      '@vitest/runner': 4.1.10
+      '@vitest/snapshot': 4.1.10
+      '@vitest/spy': 4.1.10
+      '@vitest/utils': 4.1.10
+      es-module-lexer: 2.3.1
+      expect-type: 1.4.0
+      magic-string: 0.30.21
+      obug: 2.1.4
+      pathe: 2.0.3
+      picomatch: 4.0.5
+      std-env: 4.2.0
       tinybench: 2.9.0
-      tinyexec: 0.3.1
-      tinypool: 1.0.2
-      tinyrainbow: 1.2.0
-      vite: 5.4.11(@types/node@22.10.2)(less@4.2.1)(sass@1.80.6)(terser@5.37.0)
-      vite-node: 2.1.8(@types/node@22.10.2)(less@4.2.1)(sass@1.80.6)(terser@5.37.0)
+      tinyexec: 1.3.0
+      tinyglobby: 0.2.17
+      tinyrainbow: 3.1.1
+      vite: 8.2.1(@types/node@25.9.5)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0)
       why-is-node-running: 2.3.0
     optionalDependencies:
-      '@types/node': 22.10.2
-      happy-dom: 15.11.7
+      '@types/node': 25.9.5
+      happy-dom: 20.11.2
     transitivePeerDependencies:
-      - less
-      - lightningcss
       - msw
-      - sass
-      - sass-embedded
-      - stylus
-      - sugarss
-      - supports-color
-      - terser
 
   vscode-languageserver-textdocument@1.0.12: {}
 
-  vscode-uri@3.0.8: {}
+  vscode-uri@3.1.0: {}
 
-  vue-component-type-helpers@2.1.10: {}
+  vue-component-type-helpers@3.3.9: {}
 
-  vue-demi@0.14.10(vue@3.5.13(typescript@5.7.2)):
+  vue-demi@0.14.10(vue@3.5.41(typescript@6.0.3)):
     dependencies:
-      vue: 3.5.13(typescript@5.7.2)
+      vue: 3.5.41(typescript@6.0.3)
 
-  vue-eslint-parser@9.4.3(eslint@9.17.0(jiti@2.4.2)):
+  vue-eslint-parser@10.4.1(eslint@10.8.1(jiti@2.7.0)(supports-color@10.2.2))(supports-color@10.2.2):
     dependencies:
-      debug: 4.4.0(supports-color@9.4.0)
-      eslint: 9.17.0(jiti@2.4.2)
-      eslint-scope: 7.2.2
-      eslint-visitor-keys: 3.4.3
-      espree: 9.6.1
-      esquery: 1.6.0
-      lodash: 4.17.21
-      semver: 7.6.3
+      debug: 4.4.3(supports-color@10.2.2)
+      eslint: 10.8.1(jiti@2.7.0)(supports-color@10.2.2)
+      eslint-scope: 9.1.2
+      eslint-visitor-keys: 5.0.1
+      espree: 11.2.0
+      esquery: 1.7.0
+      semver: 7.8.5
     transitivePeerDependencies:
       - supports-color
 
-  vue-i18n@10.0.5(vue@3.5.13(typescript@5.7.2)):
+  vue-i18n@11.4.8(vue@3.5.41(typescript@6.0.3)):
     dependencies:
-      '@intlify/core-base': 10.0.5
-      '@intlify/shared': 10.0.5
+      '@intlify/core-base': 11.4.8
+      '@intlify/devtools-types': 11.4.8
+      '@intlify/shared': 11.4.8
       '@vue/devtools-api': 6.6.4
-      vue: 3.5.13(typescript@5.7.2)
+      vue: 3.5.41(typescript@6.0.3)
 
-  vue-router@4.5.0(vue@3.5.13(typescript@5.7.2)):
+  vue-json-pretty@2.6.0(vue@3.5.41(typescript@6.0.3)):
     dependencies:
-      '@vue/devtools-api': 6.6.4
-      vue: 3.5.13(typescript@5.7.2)
+      vue: 3.5.41(typescript@6.0.3)
 
-  vue-tsc@2.1.10(typescript@5.6.3):
+  vue-router@5.2.0(@vue/compiler-sfc@3.5.41)(esbuild@0.28.2)(pinia@4.0.2(@vue/devtools-api@8.2.1)(typescript@6.0.3)(vue@3.5.41(typescript@6.0.3)))(rolldown@1.2.3)(rollup@4.62.4)(vite@8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0))(vue@3.5.41(typescript@6.0.3)):
     dependencies:
-      '@volar/typescript': 2.4.11
-      '@vue/language-core': 2.1.10(typescript@5.6.3)
-      semver: 7.6.3
-      typescript: 5.6.3
+      '@babel/generator': 8.0.0
+      '@vue-macros/common': 3.1.4(vue@3.5.41(typescript@6.0.3))
+      '@vue/devtools-api': 8.2.1
+      ast-walker-scope: 0.9.0
+      chokidar: 5.0.0
+      json5: 2.2.3
+      local-pkg: 1.2.1
+      magic-string: 0.30.21
+      mlly: 1.8.2
+      muggle-string: 0.4.1
+      nostics: 1.2.0
+      pathe: 2.0.3
+      picomatch: 4.0.5
+      scule: 1.3.0
+      tinyglobby: 0.2.17
+      unplugin: 3.3.0(esbuild@0.28.2)(rolldown@1.2.3)(rollup@4.62.4)(vite@8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0))
+      unplugin-utils: 0.3.2
+      vue: 3.5.41(typescript@6.0.3)
+      yaml: 2.9.0
+    optionalDependencies:
+      '@vue/compiler-sfc': 3.5.41
+      pinia: 4.0.2(@vue/devtools-api@8.2.1)(typescript@6.0.3)(vue@3.5.41(typescript@6.0.3))
+      vite: 8.2.1(@types/node@26.2.0)(esbuild@0.28.2)(jiti@2.7.0)(less@4.8.1(supports-color@10.2.2))(sass-embedded@1.100.0)(sass@1.102.0)(terser@5.49.2)(yaml@2.9.0)
+    transitivePeerDependencies:
+      - '@farmfe/core'
+      - '@rspack/core'
+      - bun-types-no-globals
+      - esbuild
+      - rolldown
+      - rollup
+      - unloader
+      - webpack
 
-  vue-types@3.0.2(vue@3.5.13(typescript@5.7.2)):
+  vue-tippy@6.7.1(vue@3.5.41(typescript@6.0.3)):
+    dependencies:
+      tippy.js: 6.3.7
+      vue: 3.5.41(typescript@6.0.3)
+
+  vue-tsc@3.3.9(typescript@6.0.3):
+    dependencies:
+      '@volar/typescript': 2.4.28
+      '@vue/language-core': 3.3.9
+      typescript: 6.0.3
+
+  vue-types@3.0.2(vue@3.5.41(typescript@6.0.3)):
     dependencies:
       is-plain-object: 3.0.1
-      vue: 3.5.13(typescript@5.7.2)
+      vue: 3.5.41(typescript@6.0.3)
 
-  vue@3.5.13(typescript@5.6.3):
+  vue@3.5.41(typescript@6.0.3):
     dependencies:
-      '@vue/compiler-dom': 3.5.13
-      '@vue/compiler-sfc': 3.5.13
-      '@vue/runtime-dom': 3.5.13
-      '@vue/server-renderer': 3.5.13(vue@3.5.13(typescript@5.6.3))
-      '@vue/shared': 3.5.13
+      '@vue/compiler-dom': 3.5.41
+      '@vue/compiler-sfc': 3.5.41
+      '@vue/runtime-dom': 3.5.41
+      '@vue/server-renderer': 3.5.41
+      '@vue/shared': 3.5.41
     optionalDependencies:
-      typescript: 5.6.3
+      typescript: 6.0.3
 
-  vue@3.5.13(typescript@5.7.2):
+  vxe-pc-ui@4.16.27(vue@3.5.41(typescript@6.0.3)):
     dependencies:
-      '@vue/compiler-dom': 3.5.13
-      '@vue/compiler-sfc': 3.5.13
-      '@vue/runtime-dom': 3.5.13
-      '@vue/server-renderer': 3.5.13(vue@3.5.13(typescript@5.7.2))
-      '@vue/shared': 3.5.13
-    optionalDependencies:
-      typescript: 5.7.2
-
-  vxe-pc-ui@4.3.40(vue@3.5.13(typescript@5.7.2)):
-    dependencies:
-      '@vxe-ui/core': 4.0.23(vue@3.5.13(typescript@5.7.2))
+      '@vxe-ui/core': 4.4.19(vue@3.5.41(typescript@6.0.3))
     transitivePeerDependencies:
       - vue
 
-  vxe-table@4.9.33(vue@3.5.13(typescript@5.7.2)):
-    dependencies:
-      vxe-pc-ui: 4.3.40(vue@3.5.13(typescript@5.7.2))
-    transitivePeerDependencies:
-      - vue
+  vxe-table@4.20.11: {}
 
   w3c-keyname@2.2.8: {}
 
+  walk-up-path@4.0.0: {}
+
   warning@4.0.3:
     dependencies:
       loose-envify: 1.4.0
 
-  watermark-js-plus@1.5.7: {}
+  watermark-js-plus@1.6.6: {}
+
+  webcrypto-core@1.9.2:
+    dependencies:
+      '@peculiar/asn1-schema': 2.8.0
+      '@peculiar/json-schema': 1.1.12
+      '@peculiar/utils': 2.0.3
+      asn1js: 3.0.10
+      tslib: 2.8.1
 
   webidl-conversions@3.0.1: {}
 
-  webidl-conversions@4.0.2: {}
-
-  webidl-conversions@7.0.0: {}
-
   webpack-virtual-modules@0.6.2: {}
 
   whatwg-encoding@3.1.1:
@@ -19344,37 +22696,31 @@ snapshots:
       tr46: 0.0.3
       webidl-conversions: 3.0.1
 
-  whatwg-url@7.1.0:
-    dependencies:
-      lodash.sortby: 4.7.0
-      tr46: 1.0.1
-      webidl-conversions: 4.0.2
-
-  when-exit@2.1.3: {}
+  when-exit@2.1.5: {}
 
   which-boxed-primitive@1.1.1:
     dependencies:
       is-bigint: 1.1.0
-      is-boolean-object: 1.2.1
+      is-boolean-object: 1.2.2
       is-number-object: 1.1.1
       is-string: 1.1.1
       is-symbol: 1.1.1
 
   which-builtin-type@1.2.1:
     dependencies:
-      call-bound: 1.0.3
-      function.prototype.name: 1.1.8
+      call-bound: 1.0.4
+      function.prototype.name: 1.2.0
       has-tostringtag: 1.0.2
-      is-async-function: 2.0.0
+      is-async-function: 2.1.1
       is-date-object: 1.1.0
       is-finalizationregistry: 1.1.1
-      is-generator-function: 1.0.10
+      is-generator-function: 1.1.2
       is-regex: 1.2.1
-      is-weakref: 1.1.0
+      is-weakref: 1.1.1
       isarray: 2.0.5
       which-boxed-primitive: 1.1.1
       which-collection: 1.0.2
-      which-typed-array: 1.1.18
+      which-typed-array: 1.1.22
 
   which-collection@1.0.2:
     dependencies:
@@ -19383,14 +22729,17 @@ snapshots:
       is-weakmap: 2.0.2
       is-weakset: 2.0.4
 
+  which-command@0.1.0: {}
+
   which-module@2.0.1: {}
 
-  which-typed-array@1.1.18:
+  which-typed-array@1.1.22:
     dependencies:
       available-typed-arrays: 1.0.7
-      call-bind: 1.0.8
-      call-bound: 1.0.3
-      for-each: 0.3.3
+      call-bind: 1.0.9
+      call-bound: 1.0.4
+      for-each: 0.3.5
+      get-proto: 1.0.1
       gopd: 1.2.0
       has-tostringtag: 1.0.2
 
@@ -19402,6 +22751,14 @@ snapshots:
     dependencies:
       isexe: 2.0.0
 
+  which@5.0.0:
+    dependencies:
+      isexe: 3.1.5
+
+  which@6.0.1:
+    dependencies:
+      isexe: 4.0.0
+
   why-is-node-running@2.3.0:
     dependencies:
       siginfo: 2.0.0
@@ -19417,118 +22774,124 @@ snapshots:
 
   word@0.3.0: {}
 
-  workbox-background-sync@7.3.0:
+  workbox-background-sync@7.4.1:
     dependencies:
       idb: 7.1.1
-      workbox-core: 7.3.0
+      workbox-core: 7.4.1
 
-  workbox-broadcast-update@7.3.0:
+  workbox-broadcast-update@7.4.1:
     dependencies:
-      workbox-core: 7.3.0
+      workbox-core: 7.4.1
 
-  workbox-build@7.3.0:
+  workbox-build@7.4.1(supports-color@10.2.2):
     dependencies:
-      '@apideck/better-ajv-errors': 0.3.6(ajv@8.17.1)
-      '@babel/core': 7.26.0
-      '@babel/preset-env': 7.26.0(@babel/core@7.26.0)
-      '@babel/runtime': 7.26.0
-      '@rollup/plugin-babel': 5.3.1(@babel/core@7.26.0)(rollup@2.79.2)
-      '@rollup/plugin-node-resolve': 15.3.1(rollup@2.79.2)
-      '@rollup/plugin-replace': 2.4.2(rollup@2.79.2)
-      '@rollup/plugin-terser': 0.4.4(rollup@2.79.2)
-      '@surma/rollup-plugin-off-main-thread': 2.2.3
-      ajv: 8.17.1
+      '@apideck/better-ajv-errors': 0.3.7(ajv@8.20.0)
+      '@babel/core': 7.29.7(supports-color@10.2.2)
+      '@babel/preset-env': 7.29.7(@babel/core@7.29.7(supports-color@10.2.2))(supports-color@10.2.2)
+      '@babel/runtime': 7.29.7
+      '@rollup/plugin-babel': 6.1.0(@babel/core@7.29.7(supports-color@10.2.2))(rollup@4.62.4)(supports-color@10.2.2)
+      '@rollup/plugin-node-resolve': 16.0.3(rollup@4.62.4)
+      '@rollup/plugin-replace': 6.0.3(rollup@4.62.4)
+      '@rollup/plugin-terser': 1.0.0(rollup@4.62.4)
+      '@trickfilm400/rollup-plugin-off-main-thread': 3.0.0-pre1
+      ajv: 8.20.0
       common-tags: 1.8.2
+      eta: 4.6.0
       fast-json-stable-stringify: 2.1.0
       fs-extra: 9.1.0
-      glob: 7.2.3
-      lodash: 4.17.21
+      glob: 11.1.0
       pretty-bytes: 5.6.0
-      rollup: 2.79.2
-      source-map: 0.8.0-beta.0
+      rollup: 4.62.4
+      source-map: 0.8.0
       stringify-object: 3.3.0
       strip-comments: 2.0.1
       tempy: 0.6.0
       upath: 1.2.0
-      workbox-background-sync: 7.3.0
-      workbox-broadcast-update: 7.3.0
-      workbox-cacheable-response: 7.3.0
-      workbox-core: 7.3.0
-      workbox-expiration: 7.3.0
-      workbox-google-analytics: 7.3.0
-      workbox-navigation-preload: 7.3.0
-      workbox-precaching: 7.3.0
-      workbox-range-requests: 7.3.0
-      workbox-recipes: 7.3.0
-      workbox-routing: 7.3.0
-      workbox-strategies: 7.3.0
-      workbox-streams: 7.3.0
-      workbox-sw: 7.3.0
-      workbox-window: 7.3.0
+      workbox-background-sync: 7.4.1
+      workbox-broadcast-update: 7.4.1
+      workbox-cacheable-response: 7.4.1
+      workbox-core: 7.4.1
+      workbox-expiration: 7.4.1
+      workbox-google-analytics: 7.4.1
+      workbox-navigation-preload: 7.4.1
+      workbox-precaching: 7.4.1
+      workbox-range-requests: 7.4.1
+      workbox-recipes: 7.4.1
+      workbox-routing: 7.4.1
+      workbox-strategies: 7.4.1
+      workbox-streams: 7.4.1
+      workbox-sw: 7.4.1
+      workbox-window: 7.4.1
     transitivePeerDependencies:
       - '@types/babel__core'
       - supports-color
 
-  workbox-cacheable-response@7.3.0:
+  workbox-cacheable-response@7.4.1:
     dependencies:
-      workbox-core: 7.3.0
+      workbox-core: 7.4.1
 
-  workbox-core@7.3.0: {}
+  workbox-core@7.4.1: {}
 
-  workbox-expiration@7.3.0:
+  workbox-expiration@7.4.1:
     dependencies:
       idb: 7.1.1
-      workbox-core: 7.3.0
+      workbox-core: 7.4.1
 
-  workbox-google-analytics@7.3.0:
+  workbox-google-analytics@7.4.1:
     dependencies:
-      workbox-background-sync: 7.3.0
-      workbox-core: 7.3.0
-      workbox-routing: 7.3.0
-      workbox-strategies: 7.3.0
+      workbox-background-sync: 7.4.1
+      workbox-core: 7.4.1
+      workbox-routing: 7.4.1
+      workbox-strategies: 7.4.1
 
-  workbox-navigation-preload@7.3.0:
+  workbox-navigation-preload@7.4.1:
     dependencies:
-      workbox-core: 7.3.0
+      workbox-core: 7.4.1
 
-  workbox-precaching@7.3.0:
+  workbox-precaching@7.4.1:
     dependencies:
-      workbox-core: 7.3.0
-      workbox-routing: 7.3.0
-      workbox-strategies: 7.3.0
+      workbox-core: 7.4.1
+      workbox-routing: 7.4.1
+      workbox-strategies: 7.4.1
 
-  workbox-range-requests@7.3.0:
+  workbox-range-requests@7.4.1:
     dependencies:
-      workbox-core: 7.3.0
+      workbox-core: 7.4.1
 
-  workbox-recipes@7.3.0:
+  workbox-recipes@7.4.1:
     dependencies:
-      workbox-cacheable-response: 7.3.0
-      workbox-core: 7.3.0
-      workbox-expiration: 7.3.0
-      workbox-precaching: 7.3.0
-      workbox-routing: 7.3.0
-      workbox-strategies: 7.3.0
+      workbox-cacheable-response: 7.4.1
+      workbox-core: 7.4.1
+      workbox-expiration: 7.4.1
+      workbox-precaching: 7.4.1
+      workbox-routing: 7.4.1
+      workbox-strategies: 7.4.1
 
-  workbox-routing@7.3.0:
+  workbox-routing@7.4.1:
     dependencies:
-      workbox-core: 7.3.0
+      workbox-core: 7.4.1
 
-  workbox-strategies@7.3.0:
+  workbox-strategies@7.4.1:
     dependencies:
-      workbox-core: 7.3.0
+      workbox-core: 7.4.1
 
-  workbox-streams@7.3.0:
+  workbox-streams@7.4.1:
     dependencies:
-      workbox-core: 7.3.0
-      workbox-routing: 7.3.0
+      workbox-core: 7.4.1
+      workbox-routing: 7.4.1
 
-  workbox-sw@7.3.0: {}
+  workbox-sw@7.4.1: {}
 
-  workbox-window@7.3.0:
+  workbox-window@7.4.1:
     dependencies:
       '@types/trusted-types': 2.0.7
-      workbox-core: 7.3.0
+      workbox-core: 7.4.1
+
+  wrap-ansi@10.0.0:
+    dependencies:
+      ansi-styles: 6.2.3
+      string-width: 8.2.2
+      strip-ansi: 7.2.0
 
   wrap-ansi@6.2.0:
     dependencies:
@@ -19544,39 +22907,47 @@ snapshots:
 
   wrap-ansi@8.1.0:
     dependencies:
-      ansi-styles: 6.2.1
+      ansi-styles: 6.2.3
       string-width: 5.1.2
-      strip-ansi: 7.1.0
+      strip-ansi: 7.2.0
 
-  wrap-ansi@9.0.0:
+  wrap-ansi@9.0.2:
     dependencies:
-      ansi-styles: 6.2.1
+      ansi-styles: 6.2.3
       string-width: 7.2.0
-      strip-ansi: 7.1.0
+      strip-ansi: 7.2.0
 
   wrappy@1.0.2: {}
 
-  write-file-atomic@5.0.1:
+  write-file-atomic@7.0.1:
     dependencies:
-      imurmurhash: 0.1.4
       signal-exit: 4.1.0
 
+  ws@8.21.3: {}
+
+  wsl-utils@0.3.1:
+    dependencies:
+      is-wsl: 3.1.1
+      powershell-utils: 0.1.0
+
   xdg-basedir@5.1.0: {}
 
-  xe-utils@3.5.32: {}
+  xe-utils@3.9.1: {}
 
-  xgplayer-subtitles@3.0.24(core-js@3.39.0):
+  xe-utils@4.0.12: {}
+
+  xgplayer-subtitles@3.0.26(core-js@3.50.0):
     dependencies:
-      core-js: 3.39.0
+      core-js: 3.50.0
       eventemitter3: 4.0.7
 
-  xgplayer@3.0.24(core-js@3.39.0):
+  xgplayer@3.0.26(core-js@3.50.0):
     dependencies:
-      core-js: 3.39.0
+      core-js: 3.50.0
       danmu.js: 1.2.1
       delegate: 3.2.0
       eventemitter3: 4.0.7
-      xgplayer-subtitles: 3.0.24(core-js@3.39.0)
+      xgplayer-subtitles: 3.0.26(core-js@3.50.0)
 
   xlsx@0.18.5:
     dependencies:
@@ -19588,7 +22959,9 @@ snapshots:
       wmf: 1.0.2
       word: 0.3.0
 
-  xml-name-validator@4.0.0: {}
+  xml-name-validator@5.0.0: {}
+
+  xmlbuilder@15.1.1: {}
 
   xmlchars@2.2.0: {}
 
@@ -19607,27 +22980,27 @@ snapshots:
 
   yallist@5.0.0: {}
 
-  yaml-ast-parser@0.0.43: {}
-
-  yaml-eslint-parser@1.2.3:
+  yaml-eslint-parser@1.3.2:
     dependencies:
       eslint-visitor-keys: 3.4.3
-      lodash: 4.17.21
-      yaml: 2.6.1
+      yaml: 2.9.0
 
-  yaml@1.10.2: {}
+  yaml-eslint-parser@2.1.0:
+    dependencies:
+      eslint-visitor-keys: 5.0.1
+      yaml: 2.9.0
 
-  yaml@2.6.1: {}
+  yaml@2.9.0: {}
 
   yargs-parser@18.1.3:
     dependencies:
       camelcase: 5.3.1
       decamelize: 1.2.0
 
-  yargs-parser@20.2.9: {}
-
   yargs-parser@21.1.1: {}
 
+  yargs-parser@22.0.0: {}
+
   yargs@15.4.1:
     dependencies:
       cliui: 6.0.0
@@ -19642,17 +23015,7 @@ snapshots:
       y18n: 4.0.3
       yargs-parser: 18.1.3
 
-  yargs@16.2.0:
-    dependencies:
-      cliui: 7.0.4
-      escalade: 3.2.0
-      get-caller-file: 2.0.5
-      require-directory: 2.1.1
-      string-width: 4.2.3
-      y18n: 5.0.8
-      yargs-parser: 20.2.9
-
-  yargs@17.7.2:
+  yargs@17.7.3:
     dependencies:
       cliui: 8.0.1
       escalade: 3.2.0
@@ -19662,11 +23025,72 @@ snapshots:
       y18n: 5.0.8
       yargs-parser: 21.1.1
 
+  yargs@18.1.0:
+    dependencies:
+      cliui: 9.0.1
+      escalade: 3.2.0
+      get-caller-file: 2.0.5
+      string-width: 8.2.2
+      y18n: 5.0.8
+      yargs-parser: 22.0.0
+
   yocto-queue@0.1.0: {}
 
-  yocto-queue@1.1.1: {}
+  yocto-queue@1.2.2: {}
 
-  yoctocolors@2.1.1: {}
+  yoctocolors@2.2.0: {}
+
+  youch-core@0.3.3:
+    dependencies:
+      '@poppinss/exception': 1.2.3
+      error-stack-parser-es: 1.0.5
+
+  youch@4.1.1:
+    dependencies:
+      '@poppinss/colors': 4.1.6
+      '@poppinss/dumper': 0.7.0
+      '@speed-highlight/core': 1.2.24
+      cookie-es: 3.1.1
+      youch-core: 0.3.3
+
+  yuku-ast@0.8.4:
+    dependencies:
+      '@yuku-toolchain/types': 0.8.4
+
+  yuku-codegen@0.8.4:
+    dependencies:
+      '@yuku-toolchain/types': 0.8.4
+    optionalDependencies:
+      '@yuku-codegen/binding-android-arm64': 0.8.4
+      '@yuku-codegen/binding-darwin-arm64': 0.8.4
+      '@yuku-codegen/binding-darwin-x64': 0.8.4
+      '@yuku-codegen/binding-freebsd-x64': 0.8.4
+      '@yuku-codegen/binding-linux-arm-gnu': 0.8.4
+      '@yuku-codegen/binding-linux-arm-musl': 0.8.4
+      '@yuku-codegen/binding-linux-arm64-gnu': 0.8.4
+      '@yuku-codegen/binding-linux-arm64-musl': 0.8.4
+      '@yuku-codegen/binding-linux-x64-gnu': 0.8.4
+      '@yuku-codegen/binding-linux-x64-musl': 0.8.4
+      '@yuku-codegen/binding-win32-arm64': 0.8.4
+      '@yuku-codegen/binding-win32-x64': 0.8.4
+
+  yuku-parser@0.8.4:
+    dependencies:
+      '@yuku-toolchain/types': 0.8.4
+      yuku-ast: 0.8.4
+    optionalDependencies:
+      '@yuku-parser/binding-android-arm64': 0.8.4
+      '@yuku-parser/binding-darwin-arm64': 0.8.4
+      '@yuku-parser/binding-darwin-x64': 0.8.4
+      '@yuku-parser/binding-freebsd-x64': 0.8.4
+      '@yuku-parser/binding-linux-arm-gnu': 0.8.4
+      '@yuku-parser/binding-linux-arm-musl': 0.8.4
+      '@yuku-parser/binding-linux-arm64-gnu': 0.8.4
+      '@yuku-parser/binding-linux-arm64-musl': 0.8.4
+      '@yuku-parser/binding-linux-x64-gnu': 0.8.4
+      '@yuku-parser/binding-linux-x64-musl': 0.8.4
+      '@yuku-parser/binding-win32-arm64': 0.8.4
+      '@yuku-parser/binding-win32-x64': 0.8.4
 
   zip-stream@4.1.1:
     dependencies:
@@ -19678,19 +23102,22 @@ snapshots:
     dependencies:
       archiver-utils: 5.0.2
       compress-commons: 6.0.2
-      readable-stream: 4.6.0
+      readable-stream: 4.7.0
 
-  zod-defaults@0.1.3(zod@3.24.1):
+  zip-stream@7.0.5:
     dependencies:
-      zod: 3.24.1
+      compress-commons: 7.0.1
+      normalize-path: 3.0.0
+      readable-stream: 4.7.0
 
-  zod@3.24.1: {}
+  zod-defaults@0.2.3(zod@4.4.3):
+    dependencies:
+      zod: 4.4.3
 
-  zrender@5.6.0:
+  zod@4.4.3: {}
+
+  zrender@6.1.0:
     dependencies:
       tslib: 2.3.0
 
-  zx@8.2.4:
-    optionalDependencies:
-      '@types/fs-extra': 11.0.4
-      '@types/node': 22.10.2
+  zx@8.8.5: {}
diff --git a/pnpm-workspace.yaml b/pnpm-workspace.yaml
index c75ff8f3..16f98529 100644
--- a/pnpm-workspace.yaml
+++ b/pnpm-workspace.yaml
@@ -12,172 +12,233 @@ packages:
   - scripts/*
   - docs
   - playground
+
+publicHoistPattern:
+  - lefthook
+  - eslint
+  - oxfmt
+  - oxlint
+  - stylelint
+  - '*postcss*'
+  - '@commitlint/*'
+  - czg
+
+strictPeerDependencies: false
+autoInstallPeers: true
+dedupePeerDependents: true
+verifyDepsBeforeRun: false
+minimumReleaseAge: 0
+
+overrides:
+  '@ast-grep/napi': 'catalog:'
+  '@ctrl/tinycolor': 'catalog:'
+  clsx: 'catalog:'
+  pinia: 'catalog:'
+  vue: 'catalog:'
+
 catalog:
-  '@ast-grep/napi': ^0.31.1
-  '@changesets/changelog-github': ^0.5.0
-  '@changesets/cli': ^2.27.11
-  '@changesets/git': ^3.0.2
-  '@clack/prompts': ^0.9.0
-  '@commitlint/cli': ^19.6.1
-  '@commitlint/config-conventional': ^19.6.0
-  '@ctrl/tinycolor': ^4.1.0
-  '@eslint/js': ^9.17.0
-  '@faker-js/faker': ^9.3.0
-  '@iconify/json': ^2.2.286
-  '@iconify/tailwind': ^1.2.0
-  '@iconify/vue': ^4.2.0
-  '@intlify/core-base': ^10.0.5
-  '@intlify/unplugin-vue-i18n': ^6.0.1
-  '@jspm/generator': ^2.4.1
-  '@manypkg/get-packages': ^2.2.2
-  '@nolebase/vitepress-plugin-git-changelog': ^2.11.1
-  '@playwright/test': ^1.49.1
-  '@pnpm/workspace.read-manifest': ^1000.0.1
-  '@stylistic/stylelint-plugin': ^3.1.1
-  '@tailwindcss/nesting': 0.0.0-insiders.565cd3e
-  '@tailwindcss/typography': ^0.5.15
-  '@tanstack/vue-query': ^5.62.8
-  '@tanstack/vue-store': ^0.6.0
-  '@types/archiver': ^6.0.3
-  '@types/eslint': ^9.6.1
+  # ===== 你原有 catalog（全部保留，一个字不改） =====
+  '@ast-grep/napi': ^0.44.1
+  '@changesets/changelog-github': ^0.7.0
+  '@changesets/cli': ^2.31.1
+  '@changesets/git': ^3.0.4
+  '@clack/prompts': ^1.7.0
+  '@commitlint/cli': ^21.2.1
+  '@commitlint/config-conventional': ^21.2.0
+  '@ctrl/tinycolor': ^4.2.0
+  '@eslint-community/eslint-plugin-eslint-comments': ^4.7.2
+  '@eslint/js': ^10.0.1
+  '@faker-js/faker': ^10.5.0
+  '@iconify/json': ^2.2.504
+  '@iconify/tailwind4': ^1.2.3
+  '@iconify/vue': ^5.0.1
+  '@intlify/core-base': ^11.4.7
+  '@intlify/unplugin-vue-i18n': ^11.2.4
+  '@jspm/generator': ^2.16.3
+  '@lucide/vue': ^1.26.0
+  '@manypkg/get-packages': ^3.1.0
+  '@nolebase/vitepress-plugin-git-changelog': ^2.18.2
+  '@playwright/test': ^1.61.1
+  '@pnpm/workspace.read-manifest': ^1000.3.1
+  '@stylistic/stylelint-plugin': ^5.2.1
+  '@tailwindcss/typography': ^0.5.20
+  '@tailwindcss/vite': ^4.3.3
+  '@tanstack/store': ^0.11.0
+  '@tanstack/vue-form': ^1.33.2
+  '@tanstack/vue-query': ^5.101.4
+  '@tanstack/vue-store': ^0.11.0
+  '@tiptap/core': ^3.28.0
+  '@tiptap/extension-document': ^3.28.0
+  '@tiptap/extension-highlight': ^3.28.0
+  '@tiptap/extension-image': ^3.28.0
+  '@tiptap/extension-link': ^3.28.0
+  '@tiptap/extension-placeholder': ^3.28.0
+  '@tiptap/extension-text-align': ^3.28.0
+  '@tiptap/extension-text-style': ^3.28.0
+  '@tiptap/extension-underline': ^3.28.0
+  '@tiptap/pm': ^3.28.0
+  '@tiptap/starter-kit': ^3.28.0
+  '@tiptap/vue-3': ^3.28.0
+  '@tsdown/css': ^0.22.13
+  '@types/archiver': ^8.0.0
   '@types/html-minifier-terser': ^7.0.2
-  '@types/jsonwebtoken': ^9.0.7
+  '@types/json-bigint': ^1.0.4
+  '@types/jsonwebtoken': ^9.0.10
   '@types/lodash.clonedeep': ^4.5.9
-  '@types/lodash.get': ^4.4.9
-  '@types/lodash.isequal': ^4.5.8
-  '@types/node': ^22.10.2
+  '@types/node': ^25.9.5
   '@types/nprogress': ^0.2.3
-  '@types/postcss-import': ^14.0.3
-  '@types/qrcode': ^1.5.5
-  '@types/sortablejs': ^1.15.8
-  '@typescript-eslint/eslint-plugin': ^8.18.1
-  '@typescript-eslint/parser': ^8.18.1
-  '@vee-validate/zod': ^4.14.7
-  '@vite-pwa/vitepress': ^0.5.3
-  '@vitejs/plugin-vue': ^5.2.1
-  '@vitejs/plugin-vue-jsx': ^4.1.1
-  '@vue/reactivity': ^3.5.13
-  '@vue/shared': ^3.5.13
-  '@vue/test-utils': ^2.4.6
-  '@vueuse/core': ^12.0.0
-  '@vueuse/integrations': ^12.0.0
+  '@types/qrcode': ^1.5.6
+  '@types/qs': ^6.15.1
+  '@types/sortablejs': ^1.15.9
+  '@typescript-eslint/parser': ^8.65.0
+  '@vite-pwa/vitepress': ^1.1.0
+  '@vitejs/plugin-vue': ^6.0.8
+  '@vitejs/plugin-vue-jsx': ^5.1.6
+  '@vue/shared': ^3.5.40
+  '@vue/test-utils': ^2.4.11
+  '@vueuse/core': ^14.3.0
+  '@vueuse/integrations': ^14.3.0
+  '@vueuse/motion': ^3.0.3
   ant-design-vue: ^4.2.6
-  archiver: ^7.0.1
-  autoprefixer: ^10.4.20
-  axios: ^1.7.9
+  antdv-next: ^1.4.5
+  archiver: ^8.0.0
+  axios: ^1.18.1
   axios-mock-adapter: ^2.1.0
-  cac: ^6.7.14
-  chalk: ^5.4.0
-  cheerio: 1.0.0
-  circular-dependency-scanner: ^2.3.0
+  cac: ^7.0.0
+  chalk: ^5.6.2
+  cheerio: ^1.2.0
+  circular-dependency-scanner: ^3.0.1
   class-variance-authority: ^0.7.1
   clsx: ^2.1.1
-  commitlint-plugin-function-rules: ^4.0.1
-  consola: ^3.3.0
-  cross-env: ^7.0.3
-  cspell: ^8.17.1
-  cssnano: ^7.0.6
-  cz-git: ^1.11.0
-  czg: ^1.11.0
-  dayjs: ^1.11.13
-  defu: ^6.1.4
-  depcheck: ^1.4.7
-  dotenv: ^16.4.7
-  echarts: ^5.5.1
-  element-plus: ^2.9.1
-  eslint: ^9.17.0
-  eslint-config-turbo: ^2.3.3
-  eslint-plugin-command: ^0.2.7
-  eslint-plugin-eslint-comments: ^3.2.0
-  eslint-plugin-import-x: ^4.6.1
-  eslint-plugin-jsdoc: ^50.6.1
-  eslint-plugin-jsonc: ^2.18.2
-  eslint-plugin-n: ^17.15.1
-  eslint-plugin-no-only-tests: ^3.3.0
-  eslint-plugin-perfectionist: ^3.9.1
-  eslint-plugin-prettier: ^5.2.1
-  eslint-plugin-regexp: ^2.7.0
-  eslint-plugin-unicorn: ^56.0.1
-  eslint-plugin-unused-imports: ^4.1.4
-  eslint-plugin-vitest: ^0.5.4
-  eslint-plugin-vue: ^9.32.0
-  execa: ^9.5.2
-  find-up: ^7.0.0
-  get-port: ^7.1.0
-  globals: ^15.14.0
-  h3: ^1.13.0
-  happy-dom: ^15.11.7
+  commitlint-plugin-function-rules: ^5.0.1
+  consola: ^3.4.2
+  cross-env: ^10.1.0
+  cspell: ^10.0.1
+  cz-git: ^1.13.1
+  czg: ^1.13.1
+  dayjs: ^1.11.21
+  defu: ^6.1.7
+  dotenv: ^17.4.2
+  echarts: ^6.1.0
+  element-plus: ^2.14.3
+  es-toolkit: ^1.49.0
+  eslint: ^10.7.0
+  eslint-plugin-better-tailwindcss: ^4.7.0
+  eslint-plugin-command: ^3.5.3
+  eslint-plugin-jsonc: ^3.3.0
+  eslint-plugin-n: ^18.2.2
+  eslint-plugin-perfectionist: ^5.10.0
+  eslint-plugin-pnpm: ^1.7.0
+  eslint-plugin-unused-imports: ^4.4.1
+  eslint-plugin-vue: ^10.10.0
+  eslint-plugin-yml: ^3.6.0
+  execa: ^10.0.0
+  find-up: ^8.0.0
+  get-port: ^7.2.0
+  globals: ^17.7.0
+  h3: ^1.15.11
+  happy-dom: ^20.11.1
   html-minifier-terser: ^7.2.0
-  husky: ^9.1.7
   is-ci: ^4.1.0
-  jsonc-eslint-parser: ^2.4.0
-  jsonwebtoken: ^9.0.2
-  lint-staged: ^15.2.11
+  json-bigint: ^1.0.0
+  jsonwebtoken: ^9.0.3
+  knip: ^6.29.0
+  lefthook: ^2.1.10
   lodash.clonedeep: ^4.5.0
-  lodash.get: ^4.4.2
-  lodash.isequal: ^4.5.0
-  lucide-vue-next: ^0.469.0
   medium-zoom: ^1.1.0
-  naive-ui: ^2.40.4
-  nitropack: ^2.10.4
+  naive-ui: ^2.44.1
+  nitropack: ^2.13.4
   nprogress: ^0.2.0
-  ora: ^8.1.1
-  pinia: 2.2.2
-  pinia-plugin-persistedstate: ^4.2.0
-  pkg-types: ^1.2.1
-  playwright: ^1.49.1
-  postcss: ^8.4.49
-  postcss-antd-fixes: ^0.2.0
-  postcss-html: ^1.7.0
-  postcss-import: ^16.1.0
-  postcss-preset-env: ^10.1.2
+  ora: ^9.4.1
+  oxfmt: ^0.60.0
+  oxlint: ^1.75.0
+  oxlint-tsgolint: ^0.25.0
+  pinia: ^4.0.2
+  pinia-plugin-persistedstate: ^4.7.1
+  pkg-types: ^2.3.1
+  'pnpm/workspace.read-manifest': ^1000.3.1
+  playwright: ^1.61.1
+  postcss: ^8.5.22
+  postcss-html: ^1.8.1
   postcss-scss: ^4.0.9
-  prettier: ^3.4.2
-  prettier-plugin-tailwindcss: ^0.6.9
-  publint: ^0.2.12
+  publint: ^0.3.22
   qrcode: ^1.5.4
-  radix-vue: ^1.9.11
+  qs: ^6.15.3
+  reka-ui: ^2.10.1
   resolve.exports: ^2.0.3
-  rimraf: ^6.0.1
-  rollup: ^4.28.1
-  rollup-plugin-visualizer: ^5.12.0
-  sass: 1.80.6
-  sortablejs: ^1.15.6
-  stylelint: ^16.12.0
-  stylelint-config-recess-order: ^5.1.1
-  stylelint-config-recommended: ^14.0.1
-  stylelint-config-recommended-scss: ^14.1.0
-  stylelint-config-recommended-vue: ^1.5.0
-  stylelint-config-standard: ^36.0.1
-  stylelint-order: ^6.0.4
-  stylelint-prettier: ^5.0.2
-  stylelint-scss: ^6.10.0
-  tailwind-merge: ^2.5.5
-  tailwindcss: ^3.4.17
-  tailwindcss-animate: ^1.0.7
+  rimraf: ^6.1.3
+  rollup-plugin-visualizer: ^7.0.1
+  sass: ^1.101.6
+  sass-embedded: ^1.100.0
+  secure-ls: ^2.0.0
+  sortablejs: ^1.15.7
+  stylelint: ^17.14.1
+  stylelint-config-recess-order: ^7.7.0
+  stylelint-config-recommended: ^18.0.0
+  stylelint-config-recommended-scss: ^17.0.1
+  stylelint-config-recommended-vue: ^1.6.1
+  stylelint-config-standard: ^40.0.0
+  stylelint-order: ^8.1.1
+  stylelint-scss: ^7.2.0
+  tailwind-merge: ^3.6.0
+  tailwindcss: ^4.3.3
+  tdesign-vue-next: ^1.20.3
   theme-colors: ^0.1.0
-  turbo: ^2.3.3
-  typescript: 5.6.3
-  unbuild: ^3.0.1
-  unplugin-element-plus: ^0.8.0
-  vee-validate: ^4.14.7
-  vite: ^6.0.5
+  tippy.js: ^6.3.7
+  tsdown: ^0.22.13
+  turbo: ^2.10.6
+  tw-animate-css: ^1.4.0
+  typescript: ^6.0.3
+  unplugin-dts: ^1.0.3
+  unplugin-element-plus: ^0.11.2
+  unplugin-vue: ^7.2.0
+  vite: ^8.1.5
   vite-plugin-compression: ^0.5.1
-  vite-plugin-dts: 4.2.1
-  vite-plugin-html: ^3.2.2
   vite-plugin-lazy-import: ^1.0.7
-  vite-plugin-pwa: ^0.21.1
-  vite-plugin-vue-devtools: ^7.6.8
-  vitepress: ^1.5.0
-  vitepress-plugin-group-icons: ^1.3.2
-  vitest: ^2.1.8
-  vue: ^3.5.13
-  vue-eslint-parser: ^9.4.3
-  vue-i18n: ^10.0.5
-  vue-router: ^4.5.0
-  vue-tsc: ^2.1.10
-  vxe-pc-ui: ^4.3.40
-  vxe-table: ^4.9.33
-  watermark-js-plus: ^1.5.7
-  zod: ^3.24.1
-  zod-defaults: ^0.1.3
+  vite-plugin-pwa: ^1.3.0
+  vite-plugin-vue-devtools: ^8.1.5
+  vitepress: ^2.0.0-alpha.18
+  vitepress-plugin-group-icons: ^1.7.5
+  vitest: ^4.1.10
+  vue: ^3.5.40
+  vue-eslint-parser: ^10.4.1
+  vue-i18n: ^11.4.7
+  vue-json-pretty: ^2.6.0
+  vue-router: ^5.2.0
+  vue-tippy: ^6.7.1
+  vue-tsc: ^3.3.8
+  vxe-pc-ui: ^4.16.19
+  vxe-table: ^4.20.6
+  watermark-js-plus: ^1.6.6
+  yaml-eslint-parser: ^2.1.0
+  zod: ^4.4.3
+  zod-defaults: ^0.2.3
+  autoprefixer: ^10.4.19
+  husky: ^9.1.7
+  unbuild: ^3.5.0
+
+  # ===== 本次补齐的业务依赖 =====
+  '@fortawesome/fontawesome-free': ^6.7.2
+  '@vueup/vue-quill': ^1.2.0
+  html2canvas: ^1.4.1
+  js-base64: ^3.7.7
+  lodash-es: ^4.17.21
+  'lucide-vue-next': ^0.487.0
+  'md-editor-v3': ^5.4.5
+  xgplayer: ^3.0.24
+
+  # ===== 桌面端 Electron 依赖（apps/desktop 专用） =====
+  # 注意：electron / electron-updater 在 apps/desktop 里必须写显式 semver，
+  # electron-builder 打包时会解析这两个版本号，不认识 catalog: 写法
+  electron-builder: ^26.15.3
+  electron-log: ^5.4.4
+  electron-vite: ^5.0.0
+
+allowBuilds:
+  '@parcel/watcher': true
+  core-js: true
+  esbuild: true
+  lefthook: true
+  vue-demi: true
+  # electron 依赖 postinstall 下载平台二进制（走 .npmrc 的 electron_mirror 镜像），不放行会导致 electron 命令不可用
+  electron: true
diff --git a/scripts/clean.mjs b/scripts/clean.mjs
index e2840d38..2049e45d 100644
--- a/scripts/clean.mjs
+++ b/scripts/clean.mjs
@@ -1,31 +1,107 @@
 import { promises as fs } from 'node:fs';
-import { join } from 'node:path';
+import { join, normalize } from 'node:path';
 
 const rootDir = process.cwd();
 
-/**
- * 递归查找并删除目标目录
- * @param {string} currentDir - 当前遍历的目录路径
- */
-async function cleanTargetsRecursively(currentDir, targets) {
-  const items = await fs.readdir(currentDir);
+// 控制并发数量，避免创建过多的并发任务
+const CONCURRENCY_LIMIT = 10;
 
-  for (const item of items) {
-    try {
-      const itemPath = join(currentDir, item);
-      if (targets.includes(item)) {
-        // 匹配到目标目录或文件时直接删除
-        await fs.rm(itemPath, { force: true, recursive: true });
-        console.log(`Deleted: ${itemPath}`);
+// 需要跳过的目录，避免进入这些目录进行清理
+const SKIP_DIRS = new Set(['.DS_Store', '.git', '.idea', '.vscode']);
+
+/**
+ * 处理单个文件/目录项
+ * @param {string} currentDir - 当前目录路径
+ * @param {string} item - 文件/目录名
+ * @param {string[]} targets - 要删除的目标列表
+ * @param {number} _depth - 当前递归深度
+ * @returns {Promise<boolean>} - 是否需要进一步递归处理
+ */
+async function processItem(currentDir, item, targets, _depth) {
+  // 跳过特殊目录
+  if (SKIP_DIRS.has(item)) {
+    return false;
+  }
+
+  try {
+    const itemPath = normalize(join(currentDir, item));
+
+    if (targets.includes(item)) {
+      // 匹配到目标目录或文件时直接删除
+      await fs.rm(itemPath, { force: true, recursive: true });
+      console.log(`✅ Deleted: ${itemPath}`);
+      return false; // 已删除，无需递归
+    }
+
+    // 使用 readdir 的 withFileTypes 选项，避免额外的 lstat 调用
+    return true; // 可能需要递归，由调用方决定
+  } catch (error) {
+    // 更详细的错误信息
+    if (error.code === 'ENOENT') {
+      // 文件不存在，可能已被删除，这是正常情况
+      return false;
+    } else if (error.code === 'EPERM' || error.code === 'EACCES') {
+      console.error(`❌ Permission denied: ${item} in ${currentDir}`);
+    } else {
+      console.error(
+        `❌ Error handling item ${item} in ${currentDir}: ${error.message}`,
+      );
+    }
+    return false;
+  }
+}
+
+/**
+ * 递归查找并删除目标目录（并发优化版本）
+ * @param {string} currentDir - 当前遍历的目录路径
+ * @param {string[]} targets - 要删除的目标列表
+ * @param {number} depth - 当前递归深度，避免过深递归
+ */
+async function cleanTargetsRecursively(currentDir, targets, depth = 0) {
+  // 限制递归深度，避免无限递归
+  if (depth > 10) {
+    console.warn(`Max recursion depth reached at: ${currentDir}`);
+    return;
+  }
+
+  let dirents;
+  try {
+    // 使用 withFileTypes 选项，一次性获取文件类型信息，避免后续 lstat 调用
+    dirents = await fs.readdir(currentDir, { withFileTypes: true });
+  } catch (error) {
+    // 如果无法读取目录，可能已被删除或权限不足
+    console.warn(`Cannot read directory ${currentDir}: ${error.message}`);
+    return;
+  }
+
+  // 分批处理，控制并发数量
+  for (let i = 0; i < dirents.length; i += CONCURRENCY_LIMIT) {
+    const batch = dirents.slice(i, i + CONCURRENCY_LIMIT);
+
+    const tasks = batch.map(async (dirent) => {
+      const item = dirent.name;
+      const shouldRecurse = await processItem(currentDir, item, targets, depth);
+
+      // 如果是目录且没有被删除，则递归处理
+      if (shouldRecurse && dirent.isDirectory()) {
+        const itemPath = normalize(join(currentDir, item));
+        return cleanTargetsRecursively(itemPath, targets, depth + 1);
       }
-      const stat = await fs.lstat(itemPath);
-      if (stat.isDirectory()) {
-        await cleanTargetsRecursively(itemPath, targets);
-      }
-    } catch {
-      // console.error(
-      //   `Error handling item ${item} in ${currentDir}: ${error.message}`,
-      // );
+
+      return null;
+    });
+
+    // 并发执行当前批次的任务
+    const results = await Promise.allSettled(tasks);
+
+    // 检查是否有失败的任务（可选：用于调试）
+    const failedTasks = results.filter(
+      (result) => result.status === 'rejected',
+    );
+    if (failedTasks.length > 0) {
+      console.warn(
+        `${failedTasks.length} tasks failed in batch starting at index ${i} in directory: ${currentDir}`,
+      );
     }
   }
 }
@@ -33,21 +109,33 @@ async function cleanTargetsRecursively(currentDir, targets) {
 (async function startCleanup() {
   // 要删除的目录及文件名称
   const targets = ['node_modules', 'dist', '.turbo', 'dist.zip'];
-
   const deleteLockFile = process.argv.includes('--del-lock');
   const cleanupTargets = [...targets];
+
   if (deleteLockFile) {
     cleanupTargets.push('pnpm-lock.yaml');
   }
 
   console.log(
-    `Starting cleanup of targets: ${cleanupTargets.join(', ')} from root: ${rootDir}`,
+    `🚀 Starting cleanup of targets: ${cleanupTargets.join(', ')} from root: ${rootDir}`,
   );
 
+  const startTime = Date.now();
+
   try {
+    // 先统计要删除的目标数量
+    console.log('📊 Scanning for cleanup targets...');
+
     await cleanTargetsRecursively(rootDir, cleanupTargets);
-    console.log('Cleanup process completed.');
+
+    const endTime = Date.now();
+    const duration = (endTime - startTime) / 1000;
+
+    console.log(
+      `✨ Cleanup process completed successfully in ${duration.toFixed(2)}s`,
+    );
   } catch (error) {
-    console.error(`Unexpected error during cleanup: ${error.message}`);
+    console.error(`💥 Unexpected error during cleanup: ${error.message}`);
+    process.exit(1);
   }
 })();
diff --git a/scripts/deploy/Dockerfile b/scripts/deploy/Dockerfile
index 9fd15199..862673c1 100644
--- a/scripts/deploy/Dockerfile
+++ b/scripts/deploy/Dockerfile
@@ -1,18 +1,20 @@
-FROM node:20-slim AS builder
+FROM node:22-slim AS builder
 
 # --max-old-space-size
 ENV PNPM_HOME="/pnpm"
 ENV PATH="$PNPM_HOME:$PATH"
 ENV NODE_OPTIONS=--max-old-space-size=8192
 ENV TZ=Asia/Shanghai
+ENV CI=true
 
-RUN corepack enable
+RUN npm i -g corepack
 
 WORKDIR /app
 
 # copy package.json and pnpm-lock.yaml to workspace
 COPY . /app
 
+# 安装依赖
 RUN --mount=type=cache,id=pnpm,target=/pnpm/store pnpm install --frozen-lockfile
 RUN pnpm run build --filter=\!./docs
 
@@ -20,12 +22,17 @@ RUN echo "Builder Success 🎉"
 
 FROM nginx:stable-alpine AS production
 
-RUN echo "types { application/javascript js mjs; }" > /etc/nginx/conf.d/mjs.conf
+# 配置 nginx
+RUN echo "types { application/javascript js mjs; }" > /etc/nginx/conf.d/mjs.conf \
+    && rm -rf /etc/nginx/conf.d/default.conf
+
+# 复制构建产物
 COPY --from=builder /app/playground/dist /usr/share/nginx/html
 
+# 复制 nginx 配置
 COPY --from=builder /app/scripts/deploy/nginx.conf /etc/nginx/nginx.conf
 
 EXPOSE 8080
 
-# start nginx
+# 启动 nginx
 CMD ["nginx", "-g", "daemon off;"]
diff --git a/scripts/deploy/build-local-docker-image.sh b/scripts/deploy/build-local-docker-image.sh
index 4881487f..b6372810 100755
--- a/scripts/deploy/build-local-docker-image.sh
+++ b/scripts/deploy/build-local-docker-image.sh
@@ -13,7 +13,7 @@ function stop_and_remove_container() {
 
 function remove_image() {
     # Remove the existing image
-    docker rmi vben-admin-pro >/dev/null 2>&1
+    docker rmi ${IMAGE_NAME} >/dev/null 2>&1
 }
 
 function install_dependencies() {
diff --git a/scripts/turbo-run/README.md b/scripts/turbo-run/README.md
index 65ffcf4f..4f90a59b 100644
--- a/scripts/turbo-run/README.md
+++ b/scripts/turbo-run/README.md
@@ -1,3 +1,59 @@
 # @vben/turbo-run
 
-turbo-run is a command line tool that allows you to run multiple commands in parallel.
+`turbo-run` 是一个命令行工具，允许你在多个包中并行运行命令。它提供了一个交互式的界面，让你可以选择要运行命令的包。
+
+## 特性
+
+- 🚀 交互式选择要运行的包
+- 📦 支持 monorepo 项目结构
+- 🔍 自动检测可用的命令
+- 🎯 精确过滤目标包
+
+## 安装
+
+```bash
+pnpm add -D @vben/turbo-run
+```
+
+## 使用方法
+
+基本语法：
+
+```bash
+turbo-run [script]
+```
+
+例如，如果你想运行 `dev` 命令：
+
+```bash
+turbo-run dev
+```
+
+工具会自动检测哪些包有 `dev` 命令，并提供一个交互式界面让你选择要运行的包。
+
+## 示例
+
+假设你的项目中有以下包：
+
+- `@vben/app`
+- `@vben/admin`
+- `@vben/website`
+
+当你运行：
+
+```bash
+turbo-run dev
+```
+
+工具会：
+
+1. 检测哪些包有 `dev` 命令
+2. 显示一个交互式选择界面
+3. 让你选择要运行命令的包
+4. 使用 `pnpm --filter` 在选定的包中运行命令
+
+## 注意事项
+
+- 确保你的项目使用 pnpm 作为包管理器
+- 确保目标包在 `package.json` 中定义了相应的脚本命令
+- 该工具需要在 monorepo 项目的根目录下运行
diff --git a/scripts/turbo-run/build.config.ts b/scripts/turbo-run/build.config.ts
deleted file mode 100644
index 97e572c5..00000000
--- a/scripts/turbo-run/build.config.ts
+++ /dev/null
@@ -1,7 +0,0 @@
-import { defineBuildConfig } from 'unbuild';
-
-export default defineBuildConfig({
-  clean: true,
-  declaration: true,
-  entries: ['src/index'],
-});
diff --git a/scripts/turbo-run/package.json b/scripts/turbo-run/package.json
index 1690720f..0ab451fd 100644
--- a/scripts/turbo-run/package.json
+++ b/scripts/turbo-run/package.json
@@ -1,11 +1,11 @@
 {
   "name": "@vben/turbo-run",
-  "version": "5.5.1",
+  "version": "5.7.0",
   "private": true,
   "license": "MIT",
   "type": "module",
   "scripts": {
-    "stub": "pnpm unbuild --stub"
+    "stub": "pnpm exec tsdown"
   },
   "files": [
     "dist"
diff --git a/scripts/turbo-run/src/index.ts b/scripts/turbo-run/src/index.ts
index 2f8dad0f..62b11d0e 100644
--- a/scripts/turbo-run/src/index.ts
+++ b/scripts/turbo-run/src/index.ts
@@ -1,4 +1,4 @@
-import { colors, consola } from '@vben/node-utils';
+import { consola } from '@vben/node-utils';
 
 import { cac } from 'cac';
 
@@ -14,12 +14,6 @@ try {
       run({ command });
     });
 
-  // Invalid command
-  turboRun.on('command:*', () => {
-    consola.error(colors.red('Invalid command!'));
-    process.exit(1);
-  });
-
   turboRun.usage('turbo-run');
   turboRun.help();
   turboRun.parse();
diff --git a/scripts/turbo-run/src/run.ts b/scripts/turbo-run/src/run.ts
index 6a8762fa..c8f4b787 100644
--- a/scripts/turbo-run/src/run.ts
+++ b/scripts/turbo-run/src/run.ts
@@ -1,4 +1,4 @@
-import { execaCommand, getPackages } from '@vben/node-utils';
+import { execa, getPackages } from '@vben/node-utils';
 
 import { cancel, isCancel, select } from '@clack/prompts';
 
@@ -25,7 +25,7 @@ export async function run(options: RunOptions) {
 
   let selectPkg: string | symbol;
   if (selectPkgs.length > 1) {
-    selectPkg = await select<any, string>({
+    selectPkg = await select<string>({
       message: `Select the app you need to run [${command}]:`,
       options: selectPkgs.map((item) => ({
         label: item?.packageJson.name,
@@ -46,9 +46,13 @@ export async function run(options: RunOptions) {
     process.exit(1);
   }
 
-  execaCommand(`pnpm --filter=${selectPkg} run ${command}`, {
-    stdio: 'inherit',
-  });
+  try {
+    await execa('pnpm', [`--filter=${selectPkg}`, 'run', command], {
+      stdio: 'inherit',
+    });
+  } catch (error: any) {
+    process.exit(error.exitCode || 1);
+  }
 }
 
 /**
diff --git a/scripts/turbo-run/tsdown.config.ts b/scripts/turbo-run/tsdown.config.ts
new file mode 100644
index 00000000..c4f51c5e
--- /dev/null
+++ b/scripts/turbo-run/tsdown.config.ts
@@ -0,0 +1,11 @@
+import { defineConfig } from 'tsdown';
+
+export default defineConfig({
+  clean: true,
+  dts: true,
+  entry: ['src/index.ts'],
+  format: ['esm'],
+  outExtensions: () => ({
+    dts: '.d.ts',
+  }),
+});
diff --git a/scripts/vsh/README.md b/scripts/vsh/README.md
index 7cc8fbf5..61140d65 100644
--- a/scripts/vsh/README.md
+++ b/scripts/vsh/README.md
@@ -1,3 +1,56 @@
 # @vben/vsh
 
-shell 脚本工具集合
+一个 Shell 脚本工具集合，用于 Vue Vben Admin 项目的开发和管理。
+
+## 功能特性
+
+- 🚀 基于 Node.js 的现代化 Shell 工具
+- 📦 支持模块化开发和按需加载
+- 🔍 提供依赖检查和分析功能
+- 🔄 支持循环依赖扫描
+- 📝 提供包发布检查功能
+
+## 安装
+
+```bash
+# 使用 pnpm 安装
+pnpm add -D @vben/vsh
+
+# 或者使用 npm
+npm install -D @vben/vsh
+
+# 或者使用 yarn
+yarn add -D @vben/vsh
+```
+
+## 使用方法
+
+### 全局安装
+
+```bash
+# 全局安装
+pnpm add -g @vben/vsh
+
+# 使用 vsh 命令
+vsh [command]
+```
+
+### 本地使用
+
+```bash
+# 在 package.json 中添加脚本
+{
+  "scripts": {
+    "vsh": "vsh"
+  }
+}
+
+# 运行命令
+pnpm vsh [command]
+```
+
+## 命令列表
+
+- `vsh check-deps`: 检查项目依赖
+- `vsh scan-circular`: 扫描循环依赖
+- `vsh publish-check`: 检查包发布配置
diff --git a/scripts/vsh/build.config.ts b/scripts/vsh/build.config.ts
deleted file mode 100644
index 97e572c5..00000000
--- a/scripts/vsh/build.config.ts
+++ /dev/null
@@ -1,7 +0,0 @@
-import { defineBuildConfig } from 'unbuild';
-
-export default defineBuildConfig({
-  clean: true,
-  declaration: true,
-  entries: ['src/index'],
-});
diff --git a/scripts/vsh/env.d.ts b/scripts/vsh/env.d.ts
new file mode 100644
index 00000000..6c21162b
--- /dev/null
+++ b/scripts/vsh/env.d.ts
@@ -0,0 +1 @@
+declare module 'circular-dependency-scanner';
diff --git a/scripts/vsh/package.json b/scripts/vsh/package.json
index 04123e2e..cb74cee3 100644
--- a/scripts/vsh/package.json
+++ b/scripts/vsh/package.json
@@ -1,11 +1,11 @@
 {
   "name": "@vben/vsh",
-  "version": "5.5.1",
+  "version": "5.7.0",
   "private": true,
   "license": "MIT",
   "type": "module",
   "scripts": {
-    "stub": "pnpm unbuild --stub"
+    "stub": "pnpm exec tsdown"
   },
   "files": [
     "dist"
@@ -25,7 +25,7 @@
     "@vben/node-utils": "workspace:*",
     "cac": "catalog:",
     "circular-dependency-scanner": "catalog:",
-    "depcheck": "catalog:",
+    "knip": "catalog:",
     "publint": "catalog:"
   }
 }
diff --git a/scripts/vsh/src/check-circular/index.ts b/scripts/vsh/src/check-circular/index.ts
index 8af97894..999f7f24 100644
--- a/scripts/vsh/src/check-circular/index.ts
+++ b/scripts/vsh/src/check-circular/index.ts
@@ -1,80 +1,217 @@
 import type { CAC } from 'cac';
 
-import { extname } from 'node:path';
+import { access, mkdtemp, readFile, rm } from 'node:fs/promises';
+import { createRequire } from 'node:module';
+import { tmpdir } from 'node:os';
+import { extname, join } from 'node:path';
 
-import { getStagedFiles } from '@vben/node-utils';
+import { execa, getStagedFiles } from '@vben/node-utils';
 
-import { circularDepsDetect, printCircles } from 'circular-dependency-scanner';
+const require = createRequire(import.meta.url);
+const circularScannerCli =
+  require.resolve('circular-dependency-scanner/dist/cli.js');
 
-const IGNORE_DIR = [
-  'dist',
-  '.turbo',
-  'output',
-  '.cache',
-  'scripts',
-  'internal',
-  'packages/effects/request/src/',
-  'packages/@core/ui-kit/menu-ui/src/',
-  'packages/@core/ui-kit/popup-ui/src/',
-].join(',');
+// 默认配置
+const DEFAULT_CONFIG = {
+  allowedExtensions: ['.cjs', '.js', '.jsx', '.mjs', '.ts', '.tsx', '.vue'],
+  ignoreDirs: [
+    'dist',
+    '.turbo',
+    'output',
+    '.cache',
+    'scripts',
+    'internal',
+    'packages/effects/request/src/',
+    'packages/@core/ui-kit/menu-ui/src/',
+    'packages/@core/ui-kit/popup-ui/src/',
+  ],
+  threshold: 0, // 循环依赖的阈值
+} as const;
 
-const IGNORE = [`**/{${IGNORE_DIR}}/**`];
+// 类型定义
+type CircularDependencyResult = string[];
+
+interface CheckCircularConfig {
+  allowedExtensions?: string[];
+  ignoreDirs?: string[];
+  threshold?: number;
+}
 
 interface CommandOptions {
+  config?: CheckCircularConfig;
   staged: boolean;
   verbose: boolean;
 }
 
-async function checkCircular({ staged, verbose }: CommandOptions) {
-  const results = await circularDepsDetect({
-    absolute: staged,
-    cwd: process.cwd(),
-    ignore: IGNORE,
-  });
+// 缓存机制
+const cache = new Map<string, CircularDependencyResult[]>();
 
-  if (staged) {
-    let files = await getStagedFiles();
+async function detectCircularDependencies({
+  cwd,
+  ignorePattern,
+  staged,
+}: {
+  cwd: string;
+  ignorePattern: string;
+  staged: boolean;
+}): Promise<CircularDependencyResult[]> {
+  const tempDir = await mkdtemp(join(tmpdir(), 'vsh-check-circular-'));
+  const outputFile = join(tempDir, 'circles.json');
 
-    const allowedExtensions = new Set([
-      '.cjs',
-      '.js',
-      '.jsx',
-      '.mjs',
-      '.ts',
-      '.tsx',
-      '.vue',
-    ]);
+  try {
+    const args = [circularScannerCli, cwd, '--output', outputFile];
 
-    // 过滤文件列表
-    files = files.filter((file) => allowedExtensions.has(extname(file)));
-
-    const circularFiles: string[][] = [];
-
-    for (const file of files) {
-      for (const result of results) {
-        const resultFiles = result.flat();
-        if (resultFiles.includes(file)) {
-          circularFiles.push(result);
-        }
-      }
+    if (staged) {
+      args.push('--absolute');
     }
-    verbose && printCircles(circularFiles);
-  } else {
-    verbose && printCircles(results);
+
+    args.push('--ignore', ignorePattern);
+
+    await execa(process.execPath, args, {
+      cwd,
+    });
+
+    await access(outputFile);
+    const output = await readFile(outputFile, 'utf8');
+    return JSON.parse(output) as CircularDependencyResult[];
+  } catch (error) {
+    if ((error as NodeJS.ErrnoException)?.code === 'ENOENT') {
+      return [];
+    }
+    throw error;
+  } finally {
+    await rm(tempDir, { force: true, recursive: true });
   }
 }
 
-function defineCheckCircularCommand(cac: CAC) {
+/**
+ * 格式化循环依赖的输出
+ * @param circles - 循环依赖结果
+ */
+function formatCircles(circles: CircularDependencyResult[]): void {
+  if (circles.length === 0) {
+    console.log('✅ No circular dependencies found');
+    return;
+  }
+
+  console.log('⚠️ Circular dependencies found:');
+  circles.forEach((circle, index) => {
+    console.log(`\nCircular dependency #${index + 1}:`);
+    circle.forEach((file) => console.log(`  → ${file}`));
+  });
+}
+
+/**
+ * 检查项目中的循环依赖
+ * @param options - 检查选项
+ * @param options.staged - 是否只检查暂存区文件
+ * @param options.verbose - 是否显示详细信息
+ * @param options.config - 自定义配置
+ * @returns Promise<void>
+ */
+async function checkCircular({
+  config = {},
+  staged,
+  verbose,
+}: CommandOptions): Promise<void> {
+  try {
+    // 合并配置
+    const finalConfig = {
+      ...DEFAULT_CONFIG,
+      ...config,
+    };
+
+    // 生成忽略模式
+    const ignorePattern = `**/{${finalConfig.ignoreDirs.join(',')}}/**`;
+
+    // 检查缓存
+    const cacheKey = `${staged}-${process.cwd()}-${ignorePattern}`;
+    if (cache.has(cacheKey)) {
+      const cachedResults = cache.get(cacheKey);
+      if (cachedResults && verbose) {
+        formatCircles(cachedResults);
+      }
+      return;
+    }
+
+    // 检测循环依赖
+    const results = await detectCircularDependencies({
+      cwd: process.cwd(),
+      ignorePattern,
+      staged,
+    });
+
+    if (staged) {
+      let files = await getStagedFiles();
+      const allowedExtensions = new Set(finalConfig.allowedExtensions);
+
+      // 过滤文件列表
+      files = files.filter((file) => allowedExtensions.has(extname(file)));
+
+      const circularFiles: CircularDependencyResult[] = [];
+
+      for (const file of files) {
+        for (const result of results) {
+          const resultFiles = result.flat();
+          if (resultFiles.includes(file)) {
+            circularFiles.push(result);
+          }
+        }
+      }
+
+      // 更新缓存
+      cache.set(cacheKey, circularFiles);
+      if (verbose) {
+        formatCircles(circularFiles);
+      }
+    } else {
+      // 更新缓存
+      cache.set(cacheKey, results);
+      if (verbose) {
+        formatCircles(results);
+      }
+    }
+
+    // 如果发现循环依赖，只输出警告信息
+    if (results.length > 0) {
+      console.log(
+        '\n⚠️ Warning: Circular dependencies found, please check and fix',
+      );
+    }
+  } catch (error) {
+    console.error(
+      '❌ Error checking circular dependencies:',
+      error instanceof Error ? error.message : error,
+    );
+  }
+}
+
+/**
+ * 定义检查循环依赖的命令
+ * @param cac - CAC实例
+ */
+function defineCheckCircularCommand(cac: CAC): void {
   cac
     .command('check-circular')
-    .option(
-      '--staged',
-      'Whether it is the staged commit mode, in which mode, if there is a circular dependency, an alarm will be given.',
-    )
-    .usage(`Analysis of project circular dependencies.`)
-    .action(async ({ staged }) => {
-      await checkCircular({ staged, verbose: true });
+    .option('--staged', 'Only check staged files')
+    .option('--verbose', 'Show detailed information')
+    .option('--threshold <number>', 'Threshold for circular dependencies', {
+      default: 0,
+    })
+    .option('--ignore-dirs <dirs>', 'Directories to ignore, comma separated')
+    .usage('Analyze project circular dependencies')
+    .action(async ({ ignoreDirs, staged, threshold, verbose }) => {
+      const config: CheckCircularConfig = {
+        threshold: Number(threshold),
+        ...(ignoreDirs && { ignoreDirs: ignoreDirs.split(',') }),
+      };
+
+      await checkCircular({
+        config,
+        staged,
+        verbose: verbose ?? true,
+      });
     });
 }
 
-export { defineCheckCircularCommand };
+export { type CheckCircularConfig, defineCheckCircularCommand };
diff --git a/scripts/vsh/src/check-dep/index.ts b/scripts/vsh/src/check-dep/index.ts
index 76262299..15259af6 100644
--- a/scripts/vsh/src/check-dep/index.ts
+++ b/scripts/vsh/src/check-dep/index.ts
@@ -1,85 +1,147 @@
 import type { CAC } from 'cac';
 
-import { getPackages } from '@vben/node-utils';
+import { mkdtemp, rm, writeFile } from 'node:fs/promises';
+import { createRequire } from 'node:module';
+import { tmpdir } from 'node:os';
+import { dirname, join } from 'node:path';
 
-import depcheck from 'depcheck';
+import { execa } from '@vben/node-utils';
 
-async function runDepcheck() {
-  const { packages } = await getPackages();
-  await Promise.all(
-    packages.map(async (pkg) => {
-      if (
-        [
-          '@vben/backend-mock',
-          '@vben/commitlint-config',
-          '@vben/eslint-config',
-          '@vben/lint-staged-config',
-          '@vben/node-utils',
-          '@vben/prettier-config',
-          '@vben/stylelint-config',
-          '@vben/tailwind-config',
-          '@vben/tsconfig',
-          '@vben/vite-config',
-          '@vben/vite-config',
-          '@vben/vsh',
-        ].includes(pkg.packageJson.name)
-      ) {
-        return;
-      }
+const require = createRequire(import.meta.url);
+const knipMain = require.resolve('knip');
+const knipCli = join(dirname(knipMain), '..', 'bin', 'knip.js');
 
-      const unused = await depcheck(pkg.dir, {
-        ignoreMatches: [
-          'vite',
-          'vitest',
-          'unbuild',
-          '@vben/tsconfig',
-          '@vben/vite-config',
-          '@vben/tailwind-config',
-          '@types/*',
-          '@vben-core/design',
-        ],
-        ignorePatterns: ['dist', 'node_modules', 'public'],
-      });
+const DEFAULT_CONFIG = {
+  ignore: ['dist/**', 'docs/**', 'node_modules/**', 'public/**'],
+  ignoreBinaries: [] as string[],
+  ignoreDependencies: [
+    '@iconify/json',
+    '@vben-core/design',
+    '@vben/commitlint-config',
+    '@vben/eslint-config',
+    '@vben/stylelint-config',
+    '@vben/tailwind-config',
+    '@vben/vite-config',
+    '@vben/oxlint-config',
+    'playwright',
+    'rimraf',
+    'tailwindcss',
+  ],
+  ignoreWorkspaces: ['internal/lint-configs/*', 'scripts/*'],
+};
 
-      // 删除file:前缀的依赖提示，该依赖是本地依赖
-      Reflect.deleteProperty(unused.missing, 'file:');
-      Object.keys(unused.missing).forEach((key) => {
-        unused.missing[key] = (unused.missing[key] || []).filter(
-          (item: string) => !item.startsWith('/'),
-        );
-        if (unused.missing[key].length === 0) {
-          Reflect.deleteProperty(unused.missing, key);
-        }
-      });
-
-      if (
-        Object.keys(unused.missing).length === 0 &&
-        unused.dependencies.length === 0 &&
-        unused.devDependencies.length === 0
-      ) {
-        return;
-      }
-      console.error(
-        '\n',
-        pkg.packageJson.name,
-        '\n missing:',
-        unused.missing,
-        '\n dependencies:',
-        unused.dependencies,
-        '\n devDependencies:',
-        unused.devDependencies,
-      );
-    }),
-  );
+interface KnipDependency {
+  col: number;
+  line: number;
+  name: string;
+  pos: number;
 }
 
-function defineDepcheckCommand(cac: CAC) {
+interface KnipFileIssue {
+  dependencies: KnipDependency[];
+  devDependencies: KnipDependency[];
+  file: string;
+  optionalPeerDependencies: KnipDependency[];
+}
+
+interface KnipResult {
+  issues: KnipFileIssue[];
+}
+
+/**
+ * 格式化依赖检查结果
+ * @param result - 依赖检查结果
+ */
+function formatResult(result: KnipResult): void {
+  let hasIssues = false;
+
+  for (const issue of result.issues) {
+    const hasDeps = issue.dependencies.length > 0;
+    const hasDevDeps = issue.devDependencies.length > 0;
+
+    if (!hasDeps && !hasDevDeps) {
+      continue;
+    }
+
+    hasIssues = true;
+    console.log(`\n📦 ${issue.file}`);
+
+    if (hasDeps) {
+      console.log('⚠️ Unused dependencies:');
+      for (const dep of issue.dependencies) {
+        console.log(`  - ${dep.name}`);
+      }
+    }
+
+    if (hasDevDeps) {
+      console.log('⚠️ Unused devDependencies:');
+      for (const dep of issue.devDependencies) {
+        console.log(`  - ${dep.name}`);
+      }
+    }
+  }
+
+  if (!hasIssues) {
+    console.log('\n✅ Dependency check completed, no issues found');
+  }
+}
+
+/**
+ * 运行依赖检查
+ */
+async function runKnipCheck(): Promise<void> {
+  const cwd = process.cwd();
+  const tempDir = await mkdtemp(join(tmpdir(), 'vsh-check-dep-'));
+  const configFile = join(tempDir, 'knip.json');
+
+  try {
+    await writeFile(configFile, JSON.stringify(DEFAULT_CONFIG));
+
+    const args = [
+      knipCli,
+      '--config',
+      configFile,
+      '--include',
+      'dependencies',
+      '--reporter',
+      'json',
+      '--no-config-hints',
+    ];
+
+    await execa(process.execPath, args, { cwd });
+    console.log('\n✅ Dependency check completed, no issues found');
+  } catch (error: unknown) {
+    const execaError = error as {
+      exitCode?: number;
+      stdout?: string;
+    };
+
+    if (execaError.exitCode === 1 && execaError.stdout) {
+      const result: KnipResult = JSON.parse(execaError.stdout);
+      formatResult(result);
+      return;
+    }
+
+    console.error(
+      '❌ Dependency check failed:',
+      error instanceof Error ? error.message : error,
+    );
+  } finally {
+    await rm(tempDir, { force: true, recursive: true });
+  }
+}
+
+/**
+ * 定义依赖检查命令
+ * @param cac - CAC实例
+ */
+function defineCheckDepCommand(cac: CAC): void {
   cac
     .command('check-dep')
-    .usage(`Analysis of project circular dependencies.`)
+    .usage('Analyze project dependencies using knip')
     .action(async () => {
-      await runDepcheck();
+      await runKnipCheck();
     });
 }
 
-export { defineDepcheckCommand };
+export { defineCheckDepCommand };
diff --git a/scripts/vsh/src/code-workspace/index.ts b/scripts/vsh/src/code-workspace/index.ts
index d5ec4ee9..02706db4 100644
--- a/scripts/vsh/src/code-workspace/index.ts
+++ b/scripts/vsh/src/code-workspace/index.ts
@@ -6,10 +6,10 @@ import {
   colors,
   consola,
   findMonorepoRoot,
+  formatFile,
   getPackages,
   gitAdd,
   outputJSON,
-  prettierFormat,
   toPosixPath,
 } from '@vben/node-utils';
 
@@ -40,7 +40,7 @@ async function createCodeWorkspace({
   const outputPath = join(monorepoRoot, CODE_WORKSPACE_FILE);
   await outputJSON(outputPath, { folders }, spaces);
 
-  await prettierFormat(outputPath);
+  await formatFile(outputPath);
   if (autoCommit) {
     await gitAdd(CODE_WORKSPACE_FILE, monorepoRoot);
   }
diff --git a/scripts/vsh/src/index.ts b/scripts/vsh/src/index.ts
index 2b00448c..ed9eb6c9 100644
--- a/scripts/vsh/src/index.ts
+++ b/scripts/vsh/src/index.ts
@@ -2,40 +2,76 @@ import { colors, consola } from '@vben/node-utils';
 
 import { cac } from 'cac';
 
+import { version } from '../package.json';
 import { defineCheckCircularCommand } from './check-circular';
-import { defineDepcheckCommand } from './check-dep';
+import { defineCheckDepCommand } from './check-dep';
 import { defineCodeWorkspaceCommand } from './code-workspace';
 import { defineLintCommand } from './lint';
 import { definePubLintCommand } from './publint';
 
-try {
-  const vsh = cac('vsh');
+// 命令描述
+const COMMAND_DESCRIPTIONS = {
+  'check-circular': 'Check for circular dependencies',
+  'check-dep': 'Check for unused dependencies',
+  'code-workspace': 'Manage VS Code workspace settings',
+  lint: 'Run linting on the project',
+  publint: 'Check package.json files for publishing standards',
+} as const;
 
-  // vsh lint
-  defineLintCommand(vsh);
+/**
+ * Initialize and run the CLI
+ */
+async function main(): Promise<void> {
+  try {
+    const vsh = cac('vsh');
 
-  // vsh publint
-  definePubLintCommand(vsh);
+    // Register commands
+    defineLintCommand(vsh);
+    definePubLintCommand(vsh);
+    defineCodeWorkspaceCommand(vsh);
+    defineCheckCircularCommand(vsh);
+    defineCheckDepCommand(vsh);
 
-  // vsh code-workspace
-  defineCodeWorkspaceCommand(vsh);
+    // Set up CLI
+    vsh.usage('vsh <command> [options]');
+    vsh.help();
+    vsh.version(version);
 
-  // vsh check-circular
-  defineCheckCircularCommand(vsh);
+    // Parse arguments without auto-running to detect unknown commands
+    // Note: cac v7 removed EventEmitter; use matchedCommand after parse instead
+    vsh.parse(undefined, { run: false });
 
-  // vsh check-dep
-  defineDepcheckCommand(vsh);
+    if (!vsh.matchedCommand && vsh.args.length > 0) {
+      const unknownCmd = String(vsh.args[0]);
+      consola.error(
+        colors.red(`Invalid command: ${unknownCmd}`),
+        '\n',
+        colors.yellow('Available commands:'),
+        '\n',
+        Object.entries(COMMAND_DESCRIPTIONS)
+          .map(([name, desc]) => `  ${colors.cyan(name)} - ${desc}`)
+          .join('\n'),
+      );
+      process.exit(1);
+    }
 
-  // Invalid command
-  vsh.on('command:*', () => {
-    consola.error(colors.red('Invalid command!'));
+    await vsh.runMatchedCommand();
+  } catch (error) {
+    consola.error(
+      colors.red('An unexpected error occurred:'),
+      '\n',
+      error instanceof Error ? error.message : error,
+    );
     process.exit(1);
-  });
-
-  vsh.usage('vsh');
-  vsh.help();
-  vsh.parse();
-} catch (error) {
-  consola.error(error);
-  process.exit(1);
+  }
 }
+
+// Run the CLI
+main().catch((error) => {
+  consola.error(
+    colors.red('Failed to start CLI:'),
+    '\n',
+    error instanceof Error ? error.message : error,
+  );
+  process.exit(1);
+});
diff --git a/scripts/vsh/src/lint/index.ts b/scripts/vsh/src/lint/index.ts
index 5d381e81..e19c8f6f 100644
--- a/scripts/vsh/src/lint/index.ts
+++ b/scripts/vsh/src/lint/index.ts
@@ -1,40 +1,137 @@
 import type { CAC } from 'cac';
 
-import { execaCommand } from '@vben/node-utils';
+import { execSync } from 'node:child_process';
+import { availableParallelism, freemem } from 'node:os';
+
+import { execa } from '@vben/node-utils';
 
 interface LintCommandOptions {
   /**
    * Format lint problem.
    */
   format?: boolean;
+  /**
+   * Number of threads for oxfmt and oxlint (default: 2).
+   */
+  threads?: number;
 }
 
-async function runLint({ format }: LintCommandOptions) {
+/**
+ * CPU 逻辑核心数阈值 4 核。
+ * - 小于等于该值：视为低配机器，检查命令串行执行，避免瞬时占用飙升。
+ */
+const CPU_CORE_THRESHOLD = 4;
+
+/**
+ * 可用内存阈值 8 GB。
+ * 仅当空余内存大于阈值且当前可用内存大于该值时，
+ * oxfmt / oxlint 默认线程数才提升到 4，否则使用 2。
+ */
+const FREE_MEMORY_THRESHOLD = 8 * 1024 ** 3;
+
+/**
+ * 一条命令：可执行文件名 + 参数数组。
+ *
+ * execa v10 移除了 execaCommand，execa(file, args?, options?) 的第一个参数是
+ * 「可执行文件名」而非整条命令行；且默认不走 shell。因此统一用 [file, args] 数组形式，
+ * 参数逐个传入、无需 shell 转义，跨平台行为一致（避免把整条字符串误当文件名）。
+ */
+type Command = [file: string, args: string[]];
+
+/** 执行单条命令。 */
+function runCommand([file, args]: Command) {
+  return execa(file, args, { stdio: 'inherit' });
+}
+
+/** 将命令还原为可读字符串，用于失败信息展示。 */
+function formatCommand([file, args]: Command) {
+  return [file, ...args].join(' ');
+}
+
+/**
+ * 串行执行所有命令：一次只运行一个进程。
+ * 保证一次能看到所有工具的报错（配置低的机器更友好）。
+ */
+async function runSerial(commands: Command[]) {
+  const failed: Command[] = [];
+
+  for (const command of commands) {
+    try {
+      await runCommand(command);
+    } catch {
+      failed.push(command);
+    }
+  }
+
+  if (failed.length > 0) {
+    throw new Error(
+      `Lint failed:\n${failed
+        .map((command) => `  - ${formatCommand(command)}`)
+        .join('\n')}`,
+    );
+  }
+}
+
+/**
+ * 并行执行所有命令：同时启动全部进程。
+ * 任一进程失败时，强制结束其余仍在运行的进程，避免产生遗漏进程。
+ */
+async function runParallel(commands: Command[]) {
+  const subprocesses = commands.map((command) => runCommand(command));
+
+  try {
+    await Promise.all(subprocesses);
+  } catch (error) {
+    for (const subprocess of subprocesses) {
+      try {
+        if (process.platform === 'win32' && subprocess.pid) {
+          execSync(`taskkill /F /T /PID ${subprocess.pid}`, {
+            stdio: 'ignore',
+          });
+        } else {
+          subprocess.kill('SIGKILL');
+        }
+      } catch {
+        // process may have already exited
+      }
+    }
+    await Promise.allSettled(subprocesses);
+    throw error;
+  }
+}
+
+async function runLint({ format, threads }: LintCommandOptions) {
   // process.env.FORCE_COLOR = '3';
+  const cpuCores = availableParallelism();
+
+  // CPU 核心数充足且可用内存充足时，默认线程数提升到 4，否则维持 2；
+  // 用户通过 --threads 显式指定时优先使用其值。
+  const defaultThreads =
+    cpuCores > CPU_CORE_THRESHOLD && freemem() > FREE_MEMORY_THRESHOLD ? 4 : 2;
+  const threadsArg = `--threads=${threads || defaultThreads}`;
 
   if (format) {
-    await execaCommand(`stylelint "**/*.{vue,css,less.scss}" --cache --fix`, {
-      stdio: 'inherit',
-    });
-    await execaCommand(`eslint . --cache --fix`, {
-      stdio: 'inherit',
-    });
-    await execaCommand(`prettier . --write --cache --log-level warn`, {
-      stdio: 'inherit',
-    });
+    await runSerial([
+      ['oxlint', ['--fix', '--type-aware', threadsArg]],
+      ['oxfmt', [threadsArg]],
+      ['eslint', ['.', '--cache', '--fix']],
+      ['stylelint', ['**/*.{vue,css,less,scss}', '--cache', '--fix']],
+    ]);
     return;
   }
-  await Promise.all([
-    execaCommand(`eslint . --cache`, {
-      stdio: 'inherit',
-    }),
-    execaCommand(`prettier . --ignore-unknown --check --cache`, {
-      stdio: 'inherit',
-    }),
-    execaCommand(`stylelint "**/*.{vue,css,less.scss}" --cache`, {
-      stdio: 'inherit',
-    }),
-  ]);
+
+  const commands: Command[] = [
+    ['oxlint', ['--type-aware', threadsArg]],
+    ['oxfmt', ['--check', threadsArg]],
+    ['eslint', ['.', '--cache']],
+    ['stylelint', ['**/*.{vue,css,less,scss}', '--cache']],
+  ];
+
+  // 低配机器（CPU 核心数较少）串行执行，避免多进程并发导致瞬时占用飙升；
+  // 高配机器并行执行以缩短整体耗时。
+  await (cpuCores <= CPU_CORE_THRESHOLD
+    ? runSerial(commands)
+    : runParallel(commands));
 }
 
 function defineLintCommand(cac: CAC) {
@@ -42,6 +139,7 @@ function defineLintCommand(cac: CAC) {
     .command('lint')
     .usage('Batch execute project lint check.')
     .option('--format', 'Format lint problem.')
+    .option('--threads <count>', 'Number of threads for oxfmt and oxlint.')
     .action(runLint);
 }
 
diff --git a/scripts/vsh/src/publint/index.ts b/scripts/vsh/src/publint/index.ts
index 658c0c5c..d0786737 100644
--- a/scripts/vsh/src/publint/index.ts
+++ b/scripts/vsh/src/publint/index.ts
@@ -113,11 +113,11 @@ async function runPublint(files: string[], { check }: PubLintCommandOptions) {
 }
 
 function printResult(
-  results: Array<{
+  results: Array<null | {
     pkgJson: Record<string, number | string>;
     pkgPath: string;
     publintResult: Result;
-  } | null>,
+  }>,
   check?: boolean,
 ) {
   let errorCount = 0;
diff --git a/scripts/vsh/tsconfig.json b/scripts/vsh/tsconfig.json
index b2ec3b61..f4d397ad 100644
--- a/scripts/vsh/tsconfig.json
+++ b/scripts/vsh/tsconfig.json
@@ -1,6 +1,6 @@
 {
   "$schema": "https://json.schemastore.org/tsconfig",
   "extends": "@vben/tsconfig/node.json",
-  "include": ["src"],
+  "include": ["src", "env.d.ts"],
   "exclude": ["node_modules"]
 }
diff --git a/scripts/vsh/tsdown.config.ts b/scripts/vsh/tsdown.config.ts
new file mode 100644
index 00000000..c4f51c5e
--- /dev/null
+++ b/scripts/vsh/tsdown.config.ts
@@ -0,0 +1,11 @@
+import { defineConfig } from 'tsdown';
+
+export default defineConfig({
+  clean: true,
+  dts: true,
+  entry: ['src/index.ts'],
+  format: ['esm'],
+  outExtensions: () => ({
+    dts: '.d.ts',
+  }),
+});
diff --git a/turbo.json b/turbo.json
index 3443e27c..92431f51 100644
--- a/turbo.json
+++ b/turbo.json
@@ -6,7 +6,6 @@
     "**/tsconfig*.json",
     "internal/node-utils/*.json",
     "internal/node-utils/src/**/*.ts",
-    "internal/tailwind-config/src/**/*.ts",
     "internal/vite-config/*.json",
     "internal/vite-config/src/**/*.ts",
     "scripts/*/src/**/*.ts",
@@ -20,7 +19,8 @@
         "dist/**",
         "dist.zip",
         ".vitepress/dist.zip",
-        ".vitepress/dist/**"
+        ".vitepress/dist/**",
+        "out/**"
       ]
     },
     "preview": {
diff --git a/vben-admin.code-workspace b/vben-admin.code-workspace
index b083daae..df2ecc43 100644
--- a/vben-admin.code-workspace
+++ b/vben-admin.code-workspace
@@ -2,155 +2,179 @@
   "folders": [
     {
       "name": "@vben/web-antd",
-      "path": "apps/web-antd",
+      "path": "apps/web-antd"
+    },
+    {
+      "name": "@vben/web-antdv-next",
+      "path": "apps/web-antdv-next"
+    },
+    {
+      "name": "@vben/web-ele",
+      "path": "apps/web-ele"
+    },
+    {
+      "name": "@vben/web-naive",
+      "path": "apps/web-naive"
+    },
+    {
+      "name": "@vben/web-tdesign",
+      "path": "apps/web-tdesign"
+    },
+    {
+      "name": "@vben/docs",
+      "path": "docs"
     },
     {
       "name": "@vben/commitlint-config",
-      "path": "internal/lint-configs/commitlint-config",
+      "path": "internal/lint-configs/commitlint-config"
     },
     {
       "name": "@vben/eslint-config",
-      "path": "internal/lint-configs/eslint-config",
+      "path": "internal/lint-configs/eslint-config"
     },
     {
-      "name": "@vben/prettier-config",
-      "path": "internal/lint-configs/prettier-config",
+      "name": "@vben/oxfmt-config",
+      "path": "internal/lint-configs/oxfmt-config"
+    },
+    {
+      "name": "@vben/oxlint-config",
+      "path": "internal/lint-configs/oxlint-config"
     },
     {
       "name": "@vben/stylelint-config",
-      "path": "internal/lint-configs/stylelint-config",
+      "path": "internal/lint-configs/stylelint-config"
     },
     {
       "name": "@vben/node-utils",
-      "path": "internal/node-utils",
+      "path": "internal/node-utils"
     },
     {
       "name": "@vben/tailwind-config",
-      "path": "internal/tailwind-config",
+      "path": "internal/tailwind-config"
     },
     {
       "name": "@vben/tsconfig",
-      "path": "internal/tsconfig",
+      "path": "internal/tsconfig"
     },
     {
       "name": "@vben/vite-config",
-      "path": "internal/vite-config",
+      "path": "internal/vite-config"
     },
     {
       "name": "@vben-core/design",
-      "path": "packages/@core/base/design",
+      "path": "packages/@core/base/design"
     },
     {
       "name": "@vben-core/icons",
-      "path": "packages/@core/base/icons",
+      "path": "packages/@core/base/icons"
     },
     {
       "name": "@vben-core/shared",
-      "path": "packages/@core/base/shared",
+      "path": "packages/@core/base/shared"
     },
     {
       "name": "@vben-core/typings",
-      "path": "packages/@core/base/typings",
+      "path": "packages/@core/base/typings"
     },
     {
       "name": "@vben-core/composables",
-      "path": "packages/@core/composables",
+      "path": "packages/@core/composables"
     },
     {
       "name": "@vben-core/preferences",
-      "path": "packages/@core/preferences",
+      "path": "packages/@core/preferences"
     },
     {
       "name": "@vben-core/form-ui",
-      "path": "packages/@core/ui-kit/form-ui",
+      "path": "packages/@core/ui-kit/form-ui"
     },
     {
       "name": "@vben-core/layout-ui",
-      "path": "packages/@core/ui-kit/layout-ui",
+      "path": "packages/@core/ui-kit/layout-ui"
     },
     {
       "name": "@vben-core/menu-ui",
-      "path": "packages/@core/ui-kit/menu-ui",
+      "path": "packages/@core/ui-kit/menu-ui"
     },
     {
       "name": "@vben-core/popup-ui",
-      "path": "packages/@core/ui-kit/popup-ui",
+      "path": "packages/@core/ui-kit/popup-ui"
     },
     {
       "name": "@vben-core/shadcn-ui",
-      "path": "packages/@core/ui-kit/shadcn-ui",
+      "path": "packages/@core/ui-kit/shadcn-ui"
     },
     {
       "name": "@vben-core/tabs-ui",
-      "path": "packages/@core/ui-kit/tabs-ui",
+      "path": "packages/@core/ui-kit/tabs-ui"
     },
     {
       "name": "@vben/constants",
-      "path": "packages/constants",
+      "path": "packages/constants"
     },
     {
       "name": "@vben/access",
-      "path": "packages/effects/access",
+      "path": "packages/effects/access"
     },
     {
       "name": "@vben/common-ui",
-      "path": "packages/effects/common-ui",
+      "path": "packages/effects/common-ui"
     },
     {
       "name": "@vben/hooks",
-      "path": "packages/effects/hooks",
+      "path": "packages/effects/hooks"
     },
     {
       "name": "@vben/layouts",
-      "path": "packages/effects/layouts",
+      "path": "packages/effects/layouts"
     },
     {
       "name": "@vben/plugins",
-      "path": "packages/effects/plugins",
+      "path": "packages/effects/plugins"
     },
     {
       "name": "@vben/request",
-      "path": "packages/effects/request",
+      "path": "packages/effects/request"
     },
     {
       "name": "@vben/icons",
-      "path": "packages/icons",
+      "path": "packages/icons"
     },
     {
       "name": "@vben/locales",
-      "path": "packages/locales",
+      "path": "packages/locales"
     },
     {
       "name": "@vben/preferences",
-      "path": "packages/preferences",
+      "path": "packages/preferences"
     },
     {
       "name": "@vben/stores",
-      "path": "packages/stores",
+      "path": "packages/stores"
     },
     {
       "name": "@vben/styles",
-      "path": "packages/styles",
+      "path": "packages/styles"
     },
     {
       "name": "@vben/types",
-      "path": "packages/types",
+      "path": "packages/types"
     },
     {
       "name": "@vben/utils",
-      "path": "packages/utils",
+      "path": "packages/utils"
     },
     {
       "name": "@vben/playground",
-      "path": "playground",
+      "path": "playground"
     },
     {
       "name": "@vben/turbo-run",
-      "path": "scripts/turbo-run",
+      "path": "scripts/turbo-run"
     },
     {
       "name": "@vben/vsh",
-      "path": "scripts/vsh",
-    },
-  ],
+      "path": "scripts/vsh"
+    }
+  ]
 }
diff --git a/vitest.config.ts b/vitest.config.ts
index a10b5fa3..67d6c229 100644
--- a/vitest.config.ts
+++ b/vitest.config.ts
@@ -6,6 +6,23 @@ export default defineConfig({
   plugins: [Vue(), VueJsx()],
   test: {
     environment: 'happy-dom',
-    exclude: [...configDefaults.exclude, '**/e2e/**'],
+    environmentOptions: {
+      happyDOM: {
+        settings: {
+          // happy-dom v20+ disables JS evaluation by default (security fix).
+          // Treat disabled script loading as success to preserve test behavior.
+          handleDisabledFileLoadingAsSuccess: true,
+        },
+      },
+    },
+    exclude: [
+      ...configDefaults.exclude,
+      '**/e2e/**',
+      '**/dist/**',
+      '**/.{idea,git,cache,output,temp}/**',
+      '**/node_modules/**',
+      '**/{stylelint,eslint}.config.*',
+      '**/{oxfmt,oxlint}.config.*',
+    ],
   },
 });
diff --git a/vitest.workspace.ts b/vitest.workspace.ts
deleted file mode 100644
index f00d6f68..00000000
--- a/vitest.workspace.ts
+++ /dev/null
@@ -1,3 +0,0 @@
-import { defineWorkspace } from 'vitest/config';
-
-export default defineWorkspace(['vitest.config.ts']);