From 16677dddd18c9482a241943ada9f83214eab3e1f Mon Sep 17 00:00:00 2001
From: "Anthony Fu (via agent)" <reg-github-bot@antfu.me>
Date: Fri, 17 Jul 2026 07:29:29 +0000
Subject: [PATCH] chore: upgrade @antfu/design to 0.3.0 and finish
 data-inspector icon TODO

---
 plugins/data-inspector/package.json           |  1 +
 plugins/data-inspector/src/spa/App.vue        |  7 +++
 .../src/spa/components/DataShapePanel.vue     |  2 +-
 .../src/spa/components/DataSourceSelect.vue   |  9 ++--
 .../src/spa/components/ResultViewer.vue       |  2 +-
 .../src/spa/components/SavedQueriesPanel.vue  |  3 +-
 plugins/inspect/src/spa/App.vue               |  2 +-
 pnpm-lock.yaml                                | 54 +++++++++++--------
 pnpm-workspace.yaml                           |  5 +-
 9 files changed, 53 insertions(+), 32 deletions(-)

diff --git a/plugins/data-inspector/package.json b/plugins/data-inspector/package.json
index b4c8812d..21b8eafb 100644
--- a/plugins/data-inspector/package.json
+++ b/plugins/data-inspector/package.json
@@ -69,6 +69,7 @@
     "@types/codemirror": "catalog:",
     "@vitejs/plugin-vue": "catalog:build",
     "devframe": "workspace:*",
+    "dompurify": "catalog:frontend",
     "floating-vue": "catalog:frontend",
     "reka-ui": "catalog:frontend",
     "splitpanes": "catalog:",
diff --git a/plugins/data-inspector/src/spa/App.vue b/plugins/data-inspector/src/spa/App.vue
index edfc36e5..89401544 100644
--- a/plugins/data-inspector/src/spa/App.vue
+++ b/plugins/data-inspector/src/spa/App.vue
@@ -1,6 +1,7 @@
 <script setup lang="ts">
 import type { SavedQueryScope } from '../engine'
 import LayoutSplitPane from '@antfu/design/components/Layout/LayoutSplitPane.vue'
+import { provideColorScheme } from '@antfu/design/composables/colorScheme'
 import { Pane } from 'splitpanes'
 import { onMounted, provide } from 'vue'
 import AppHeader from './components/AppHeader.vue'
@@ -10,6 +11,7 @@ import ResultViewer from './components/ResultViewer.vue'
 import SavedQueriesPanel from './components/SavedQueriesPanel.vue'
 import { backend, connect, connection } from './composables/rpc'
 import { useSavedQueries } from './composables/saved'
+import { colorScheme } from './composables/scheme'
 import { useWorkbench, workbenchKey } from './composables/workbench'
 import '@antfu/design/styles.css'
 
@@ -20,6 +22,11 @@ const savedApi = useSavedQueries()
 // receiving it (and mutating it) through props.
 provide(workbenchKey, wb)
 
+// The app owns the color scheme; feed it to @antfu/design's opt-in context so
+// the JS-colored surfaces (hash/hue `DisplayBadge`) tune their contrast to the
+// active mode without threading a `colorScheme` prop through every panel.
+provideColorScheme(() => colorScheme.value)
+
 onMounted(async () => {
   await connect()
   if (!connection.connected)
diff --git a/plugins/data-inspector/src/spa/components/DataShapePanel.vue b/plugins/data-inspector/src/spa/components/DataShapePanel.vue
index 680daf1e..fa7c207b 100644
--- a/plugins/data-inspector/src/spa/components/DataShapePanel.vue
+++ b/plugins/data-inspector/src/spa/components/DataShapePanel.vue
@@ -70,7 +70,7 @@ const rootLabel = computed(() => {
       </div>
       <div class="flex-auto" />
       <ActionIconButton
-        size="sm"
+        class="text-sm"
         :icon="loading ? 'i-ph:arrows-clockwise animate-spin' : 'i-ph:arrows-clockwise'"
         label="Refresh data shape"
         tooltip="Refresh"
diff --git a/plugins/data-inspector/src/spa/components/DataSourceSelect.vue b/plugins/data-inspector/src/spa/components/DataSourceSelect.vue
index 3e787e04..e95d07a3 100644
--- a/plugins/data-inspector/src/spa/components/DataSourceSelect.vue
+++ b/plugins/data-inspector/src/spa/components/DataSourceSelect.vue
@@ -1,5 +1,6 @@
 <script setup lang="ts">
 import type { DataSourceMeta } from '../../engine'
+import DisplayIconifyRemoteIcon from '@antfu/design/components/Display/DisplayIconifyRemoteIcon.vue'
 import { SelectContent, SelectIcon, SelectItem, SelectItemIndicator, SelectPortal, SelectRoot, SelectTrigger, SelectViewport } from 'reka-ui'
 import { computed } from 'vue'
 
@@ -26,8 +27,9 @@ function iconOf(source: DataSourceMeta | undefined): string {
       class="text-sm px-2.5 outline-none border border-base rounded bg-base inline-flex gap-2 h-9 min-w-52 max-w-80 transition items-center justify-between data-[disabled]:op50 focus-visible:ring-2 focus-visible:ring-primary-500/40"
     >
       <span class="inline-flex items-center gap-2 min-w-0">
-        <!-- TODO: migrate to IconifyIcon.vue in @antfu/design 0.3 -->
-        <span class="shrink-0 color-active" :class="iconOf(active)" aria-hidden="true" />
+        <!-- Source icons are declared per-source at runtime, so render them via
+             the remote-icon component rather than a static (build-extracted) class. -->
+        <DisplayIconifyRemoteIcon :icon="iconOf(active)" class="shrink-0 w-3.5 h-3.5 color-active [&_svg]:h-full [&_svg]:w-full" aria-hidden="true" />
         <span class="truncate font-semibold text-primary">{{ active?.title ?? placeholder ?? 'Data source' }}</span>
       </span>
       <SelectIcon class="op-fade shrink-0">
@@ -47,8 +49,7 @@ function iconOf(source: DataSourceMeta | undefined): string {
             :value="source.id"
             class="text-sm color-base py-1.5 pl-2 pr-2 outline-none rounded-md flex gap-2 cursor-pointer select-none transition items-start relative data-[highlighted]:bg-active"
           >
-            <!-- TODO: migrate to IconifyIcon.vue in @antfu/design 0.3 -->
-            <span class="shrink-0 mt-0.5 color-active" :class="iconOf(source)" aria-hidden="true" />
+            <DisplayIconifyRemoteIcon :icon="iconOf(source)" class="shrink-0 mt-0.5 w-3.5 h-3.5 color-active [&_svg]:h-full [&_svg]:w-full" aria-hidden="true" />
             <span class="flex flex-col min-w-0 flex-1">
               <span class="flex items-center gap-1.5">
                 <span class="truncate font-medium">{{ source.title }}</span>
diff --git a/plugins/data-inspector/src/spa/components/ResultViewer.vue b/plugins/data-inspector/src/spa/components/ResultViewer.vue
index 1315ce16..334c6ab2 100644
--- a/plugins/data-inspector/src/spa/components/ResultViewer.vue
+++ b/plugins/data-inspector/src/spa/components/ResultViewer.vue
@@ -64,7 +64,7 @@ watch(() => props.result, (value) => {
         running
       </span>
       <ActionIconButton
-        size="sm"
+        class="text-sm"
         :icon="running ? 'i-ph:arrows-clockwise animate-spin' : 'i-ph:arrows-clockwise'"
         label="Re-run query"
         tooltip="Re-run against the live object"
diff --git a/plugins/data-inspector/src/spa/components/SavedQueriesPanel.vue b/plugins/data-inspector/src/spa/components/SavedQueriesPanel.vue
index ce07eddf..397e00b4 100644
--- a/plugins/data-inspector/src/spa/components/SavedQueriesPanel.vue
+++ b/plugins/data-inspector/src/spa/components/SavedQueriesPanel.vue
@@ -132,11 +132,10 @@ function filterBadges(entry: Query): FilterBadge[] {
         >{{ badge.label }}</span>
         <ActionIconButton
           v-if="entry.saved && !readonly"
-          size="sm"
           icon="i-ph:trash-duotone"
           label="Delete"
           tooltip="Delete"
-          class="op0 group-hover:op100 transition-opacity"
+          class="text-sm op0 group-hover:op100 transition-opacity"
           @click.stop="emit('remove', entry.saved)"
         />
       </div>
diff --git a/plugins/inspect/src/spa/App.vue b/plugins/inspect/src/spa/App.vue
index bfc110e0..f0c97bd4 100644
--- a/plugins/inspect/src/spa/App.vue
+++ b/plugins/inspect/src/spa/App.vue
@@ -58,7 +58,7 @@ function reload(): void {
         </div>
 
         <ActionIconButton
-          size="sm"
+          class="text-sm"
           :icon="loading ? 'i-ph-arrows-clockwise animate-spin' : 'i-ph-arrows-clockwise'"
           :tooltip="loading ? 'Refreshing…' : 'Refresh'"
           label="Refresh"
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 26025e88..bc76e796 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -140,8 +140,8 @@ catalogs:
       version: 2.0.17
   frontend:
     '@antfu/design':
-      specifier: ^0.2.2
-      version: 0.2.2
+      specifier: ^0.3.0
+      version: 0.3.0
     '@floating-ui/react':
       specifier: ^0.27.20
       version: 0.27.20
@@ -196,6 +196,9 @@ catalogs:
     colorjs.io:
       specifier: ^0.7.0
       version: 0.7.0
+    dompurify:
+      specifier: ^3.4.2
+      version: 3.4.2
     floating-vue:
       specifier: ^5.2.2
       version: 5.2.2
@@ -403,7 +406,7 @@ importers:
     dependencies:
       '@antfu/design':
         specifier: catalog:frontend
-        version: 0.2.2(@antfu/utils@9.3.0)(@iconify-json/catppuccin@1.2.17)(@tanstack/vue-virtual@3.13.30(vue@3.5.39(typescript@6.0.3)))(@unocss/core@66.7.5)(colorjs.io@0.7.0)(floating-vue@5.2.2(vue@3.5.39(typescript@6.0.3)))(playwright@1.61.1)(reka-ui@2.10.1(vue@3.5.39(typescript@6.0.3)))(splitpanes@4.1.2(vue@3.5.39(typescript@6.0.3)))(unocss@66.7.5(@unocss/postcss@66.7.5(postcss@8.5.16))(vite@8.1.4(@types/node@26.1.1)(esbuild@0.28.0)(jiti@2.7.0)(terser@5.47.1)(tsx@4.23.1)(yaml@2.9.0)))(vue@3.5.39(typescript@6.0.3))
+        version: 0.3.0(@antfu/utils@9.3.0)(@iconify-json/catppuccin@1.2.17)(@tanstack/vue-virtual@3.13.30(vue@3.5.39(typescript@6.0.3)))(@unocss/core@66.7.5)(colorjs.io@0.7.0)(dompurify@3.4.2)(floating-vue@5.2.2(vue@3.5.39(typescript@6.0.3)))(playwright@1.61.1)(reka-ui@2.10.1(vue@3.5.39(typescript@6.0.3)))(splitpanes@4.1.2(vue@3.5.39(typescript@6.0.3)))(unocss@66.7.5(@unocss/postcss@66.7.5(postcss@8.5.16))(vite@8.1.4(@types/node@26.1.1)(esbuild@0.28.0)(jiti@2.7.0)(terser@5.47.1)(tsx@4.23.1)(yaml@2.9.0)))(vue@3.5.39(typescript@6.0.3))
       cac:
         specifier: catalog:deps
         version: 7.0.0
@@ -446,7 +449,7 @@ importers:
     dependencies:
       '@antfu/design':
         specifier: catalog:frontend
-        version: 0.2.2(@antfu/utils@9.3.0)(@iconify-json/catppuccin@1.2.17)(@tanstack/vue-virtual@3.13.30(vue@3.5.39(typescript@6.0.3)))(@unocss/core@66.7.5)(colorjs.io@0.7.0)(floating-vue@5.2.2(vue@3.5.39(typescript@6.0.3)))(playwright@1.61.1)(reka-ui@2.10.1(vue@3.5.39(typescript@6.0.3)))(splitpanes@4.1.2(vue@3.5.39(typescript@6.0.3)))(unocss@66.7.5(@unocss/postcss@66.7.5(postcss@8.5.16))(vite@8.1.4(@types/node@26.1.1)(esbuild@0.28.0)(jiti@2.7.0)(terser@5.47.1)(tsx@4.23.1)(yaml@2.9.0)))(vue@3.5.39(typescript@6.0.3))
+        version: 0.3.0(@antfu/utils@9.3.0)(@iconify-json/catppuccin@1.2.17)(@tanstack/vue-virtual@3.13.30(vue@3.5.39(typescript@6.0.3)))(@unocss/core@66.7.5)(colorjs.io@0.7.0)(dompurify@3.4.2)(floating-vue@5.2.2(vue@3.5.39(typescript@6.0.3)))(playwright@1.61.1)(reka-ui@2.10.1(vue@3.5.39(typescript@6.0.3)))(splitpanes@4.1.2(vue@3.5.39(typescript@6.0.3)))(unocss@66.7.5(@unocss/postcss@66.7.5(postcss@8.5.16))(vite@8.1.4(@types/node@26.1.1)(esbuild@0.28.0)(jiti@2.7.0)(terser@5.47.1)(tsx@4.23.1)(yaml@2.9.0)))(vue@3.5.39(typescript@6.0.3))
       '@devframes/hub':
         specifier: workspace:*
         version: link:../../packages/hub
@@ -516,7 +519,7 @@ importers:
     dependencies:
       '@antfu/design':
         specifier: catalog:frontend
-        version: 0.2.2(@antfu/utils@9.3.0)(@iconify-json/catppuccin@1.2.17)(@tanstack/vue-virtual@3.13.30(vue@3.5.39(typescript@6.0.3)))(@unocss/core@66.7.5)(colorjs.io@0.7.0)(floating-vue@5.2.2(vue@3.5.39(typescript@6.0.3)))(playwright@1.61.1)(reka-ui@2.10.1(vue@3.5.39(typescript@6.0.3)))(splitpanes@4.1.2(vue@3.5.39(typescript@6.0.3)))(unocss@66.7.5(@unocss/postcss@66.7.5(postcss@8.5.16))(vite@8.1.4(@types/node@26.1.1)(esbuild@0.28.0)(jiti@2.7.0)(terser@5.47.1)(tsx@4.23.1)(yaml@2.9.0)))(vue@3.5.39(typescript@6.0.3))
+        version: 0.3.0(@antfu/utils@9.3.0)(@iconify-json/catppuccin@1.2.17)(@tanstack/vue-virtual@3.13.30(vue@3.5.39(typescript@6.0.3)))(@unocss/core@66.7.5)(colorjs.io@0.7.0)(dompurify@3.4.2)(floating-vue@5.2.2(vue@3.5.39(typescript@6.0.3)))(playwright@1.61.1)(reka-ui@2.10.1(vue@3.5.39(typescript@6.0.3)))(splitpanes@4.1.2(vue@3.5.39(typescript@6.0.3)))(unocss@66.7.5(@unocss/postcss@66.7.5(postcss@8.5.16))(vite@8.1.4(@types/node@26.1.1)(esbuild@0.28.0)(jiti@2.7.0)(terser@5.47.1)(tsx@4.23.1)(yaml@2.9.0)))(vue@3.5.39(typescript@6.0.3))
       '@devframes/hub':
         specifier: workspace:*
         version: link:../../packages/hub
@@ -568,7 +571,7 @@ importers:
     dependencies:
       '@antfu/design':
         specifier: catalog:frontend
-        version: 0.2.2(@antfu/utils@9.3.0)(@iconify-json/catppuccin@1.2.17)(@tanstack/vue-virtual@3.13.30(vue@3.5.39(typescript@6.0.3)))(@unocss/core@66.7.5)(colorjs.io@0.7.0)(floating-vue@5.2.2(vue@3.5.39(typescript@6.0.3)))(playwright@1.61.1)(reka-ui@2.10.1(vue@3.5.39(typescript@6.0.3)))(splitpanes@4.1.2(vue@3.5.39(typescript@6.0.3)))(unocss@66.7.5(@unocss/postcss@66.7.5(postcss@8.5.16))(vite@8.1.4(@types/node@26.1.1)(esbuild@0.28.0)(jiti@2.7.0)(terser@5.47.1)(tsx@4.23.1)(yaml@2.9.0)))(vue@3.5.39(typescript@6.0.3))
+        version: 0.3.0(@antfu/utils@9.3.0)(@iconify-json/catppuccin@1.2.17)(@tanstack/vue-virtual@3.13.30(vue@3.5.39(typescript@6.0.3)))(@unocss/core@66.7.5)(colorjs.io@0.7.0)(dompurify@3.4.2)(floating-vue@5.2.2(vue@3.5.39(typescript@6.0.3)))(playwright@1.61.1)(reka-ui@2.10.1(vue@3.5.39(typescript@6.0.3)))(splitpanes@4.1.2(vue@3.5.39(typescript@6.0.3)))(unocss@66.7.5(@unocss/postcss@66.7.5(postcss@8.5.16))(vite@8.1.4(@types/node@26.1.1)(esbuild@0.28.0)(jiti@2.7.0)(terser@5.47.1)(tsx@4.23.1)(yaml@2.9.0)))(vue@3.5.39(typescript@6.0.3))
       cac:
         specifier: catalog:deps
         version: 7.0.0
@@ -617,7 +620,7 @@ importers:
     dependencies:
       '@antfu/design':
         specifier: catalog:frontend
-        version: 0.2.2(@antfu/utils@9.3.0)(@iconify-json/catppuccin@1.2.17)(@tanstack/vue-virtual@3.13.30(vue@3.5.39(typescript@6.0.3)))(@unocss/core@66.7.5)(colorjs.io@0.7.0)(floating-vue@5.2.2(vue@3.5.39(typescript@6.0.3)))(playwright@1.61.1)(reka-ui@2.10.1(vue@3.5.39(typescript@6.0.3)))(splitpanes@4.1.2(vue@3.5.39(typescript@6.0.3)))(unocss@66.7.5(@unocss/postcss@66.7.5(postcss@8.5.16))(vite@8.1.4(@types/node@26.1.1)(esbuild@0.28.0)(jiti@2.7.0)(terser@5.47.1)(tsx@4.23.1)(yaml@2.9.0)))(vue@3.5.39(typescript@6.0.3))
+        version: 0.3.0(@antfu/utils@9.3.0)(@iconify-json/catppuccin@1.2.17)(@tanstack/vue-virtual@3.13.30(vue@3.5.39(typescript@6.0.3)))(@unocss/core@66.7.5)(colorjs.io@0.7.0)(dompurify@3.4.2)(floating-vue@5.2.2(vue@3.5.39(typescript@6.0.3)))(playwright@1.61.1)(reka-ui@2.10.1(vue@3.5.39(typescript@6.0.3)))(splitpanes@4.1.2(vue@3.5.39(typescript@6.0.3)))(unocss@66.7.5(@unocss/postcss@66.7.5(postcss@8.5.16))(vite@8.1.4(@types/node@26.1.1)(esbuild@0.28.0)(jiti@2.7.0)(terser@5.47.1)(tsx@4.23.1)(yaml@2.9.0)))(vue@3.5.39(typescript@6.0.3))
       '@devframes/hub':
         specifier: workspace:*
         version: link:../../packages/hub
@@ -657,7 +660,7 @@ importers:
     dependencies:
       '@antfu/design':
         specifier: catalog:frontend
-        version: 0.2.2(@antfu/utils@9.3.0)(@iconify-json/catppuccin@1.2.17)(@tanstack/vue-virtual@3.13.30(vue@3.5.39(typescript@6.0.3)))(@unocss/core@66.7.5)(colorjs.io@0.7.0)(floating-vue@5.2.2(vue@3.5.39(typescript@6.0.3)))(playwright@1.61.1)(reka-ui@2.10.1(vue@3.5.39(typescript@6.0.3)))(splitpanes@4.1.2(vue@3.5.39(typescript@6.0.3)))(unocss@66.7.5(@unocss/postcss@66.7.5(postcss@8.5.16))(vite@8.1.4(@types/node@26.1.1)(esbuild@0.28.0)(jiti@2.7.0)(terser@5.47.1)(tsx@4.23.1)(yaml@2.9.0)))(vue@3.5.39(typescript@6.0.3))
+        version: 0.3.0(@antfu/utils@9.3.0)(@iconify-json/catppuccin@1.2.17)(@tanstack/vue-virtual@3.13.30(vue@3.5.39(typescript@6.0.3)))(@unocss/core@66.7.5)(colorjs.io@0.7.0)(dompurify@3.4.2)(floating-vue@5.2.2(vue@3.5.39(typescript@6.0.3)))(playwright@1.61.1)(reka-ui@2.10.1(vue@3.5.39(typescript@6.0.3)))(splitpanes@4.1.2(vue@3.5.39(typescript@6.0.3)))(unocss@66.7.5(@unocss/postcss@66.7.5(postcss@8.5.16))(vite@8.1.4(@types/node@26.1.1)(esbuild@0.28.0)(jiti@2.7.0)(terser@5.47.1)(tsx@4.23.1)(yaml@2.9.0)))(vue@3.5.39(typescript@6.0.3))
       cac:
         specifier: catalog:deps
         version: 7.0.0
@@ -847,7 +850,7 @@ importers:
     devDependencies:
       '@antfu/design':
         specifier: catalog:frontend
-        version: 0.2.2(@antfu/utils@9.3.0)(@iconify-json/catppuccin@1.2.17)(@tanstack/vue-virtual@3.13.30(vue@3.5.39(typescript@6.0.3)))(@unocss/core@66.7.5)(colorjs.io@0.7.0)(floating-vue@5.2.2(vue@3.5.39(typescript@6.0.3)))(playwright@1.61.1)(reka-ui@2.10.1(vue@3.5.39(typescript@6.0.3)))(splitpanes@4.1.2(vue@3.5.39(typescript@6.0.3)))(unocss@66.7.5(@unocss/postcss@66.7.5(postcss@8.5.16))(vite@8.1.4(@types/node@26.1.1)(esbuild@0.28.0)(jiti@2.7.0)(terser@5.47.1)(tsx@4.23.1)(yaml@2.9.0)))(vue@3.5.39(typescript@6.0.3))
+        version: 0.3.0(@antfu/utils@9.3.0)(@iconify-json/catppuccin@1.2.17)(@tanstack/vue-virtual@3.13.30(vue@3.5.39(typescript@6.0.3)))(@unocss/core@66.7.5)(colorjs.io@0.7.0)(dompurify@3.4.2)(floating-vue@5.2.2(vue@3.5.39(typescript@6.0.3)))(playwright@1.61.1)(reka-ui@2.10.1(vue@3.5.39(typescript@6.0.3)))(splitpanes@4.1.2(vue@3.5.39(typescript@6.0.3)))(unocss@66.7.5(@unocss/postcss@66.7.5(postcss@8.5.16))(vite@8.1.4(@types/node@26.1.1)(esbuild@0.28.0)(jiti@2.7.0)(terser@5.47.1)(tsx@4.23.1)(yaml@2.9.0)))(vue@3.5.39(typescript@6.0.3))
       colorjs.io:
         specifier: catalog:frontend
         version: 0.7.0
@@ -902,7 +905,7 @@ importers:
     devDependencies:
       '@antfu/design':
         specifier: catalog:frontend
-        version: 0.2.2(@antfu/utils@9.3.0)(@iconify-json/catppuccin@1.2.17)(@tanstack/vue-virtual@3.13.30(vue@3.5.39(typescript@6.0.3)))(@unocss/core@66.7.5)(colorjs.io@0.7.0)(floating-vue@5.2.2(vue@3.5.39(typescript@6.0.3)))(playwright@1.61.1)(reka-ui@2.10.1(vue@3.5.39(typescript@6.0.3)))(splitpanes@4.1.2(vue@3.5.39(typescript@6.0.3)))(unocss@66.7.5(@unocss/postcss@66.7.5(postcss@8.5.16))(vite@8.1.4(@types/node@26.1.1)(esbuild@0.28.0)(jiti@2.7.0)(terser@5.47.1)(tsx@4.23.1)(yaml@2.9.0)))(vue@3.5.39(typescript@6.0.3))
+        version: 0.3.0(@antfu/utils@9.3.0)(@iconify-json/catppuccin@1.2.17)(@tanstack/vue-virtual@3.13.30(vue@3.5.39(typescript@6.0.3)))(@unocss/core@66.7.5)(colorjs.io@0.7.0)(dompurify@3.4.2)(floating-vue@5.2.2(vue@3.5.39(typescript@6.0.3)))(playwright@1.61.1)(reka-ui@2.10.1(vue@3.5.39(typescript@6.0.3)))(splitpanes@4.1.2(vue@3.5.39(typescript@6.0.3)))(unocss@66.7.5(@unocss/postcss@66.7.5(postcss@8.5.16))(vite@8.1.4(@types/node@26.1.1)(esbuild@0.28.0)(jiti@2.7.0)(terser@5.47.1)(tsx@4.23.1)(yaml@2.9.0)))(vue@3.5.39(typescript@6.0.3))
       '@iconify-json/ph':
         specifier: catalog:frontend
         version: 1.2.2
@@ -957,7 +960,7 @@ importers:
     devDependencies:
       '@antfu/design':
         specifier: catalog:frontend
-        version: 0.2.2(@antfu/utils@9.3.0)(@iconify-json/catppuccin@1.2.17)(@tanstack/vue-virtual@3.13.30(vue@3.5.39(typescript@6.0.3)))(@unocss/core@66.7.5)(colorjs.io@0.6.1)(floating-vue@5.2.2(vue@3.5.39(typescript@6.0.3)))(playwright@1.61.1)(reka-ui@2.10.1(vue@3.5.39(typescript@6.0.3)))(splitpanes@4.1.2(vue@3.5.39(typescript@6.0.3)))(unocss@66.7.5(@unocss/postcss@66.7.5(postcss@8.5.16))(vite@8.1.4(@types/node@26.1.1)(esbuild@0.28.0)(jiti@2.7.0)(terser@5.47.1)(tsx@4.23.1)(yaml@2.9.0)))(vue@3.5.39(typescript@6.0.3))
+        version: 0.3.0(@antfu/utils@9.3.0)(@iconify-json/catppuccin@1.2.17)(@tanstack/vue-virtual@3.13.30(vue@3.5.39(typescript@6.0.3)))(@unocss/core@66.7.5)(colorjs.io@0.6.1)(dompurify@3.4.2)(floating-vue@5.2.2(vue@3.5.39(typescript@6.0.3)))(playwright@1.61.1)(reka-ui@2.10.1(vue@3.5.39(typescript@6.0.3)))(splitpanes@4.1.2(vue@3.5.39(typescript@6.0.3)))(unocss@66.7.5(@unocss/postcss@66.7.5(postcss@8.5.16))(vite@8.1.4(@types/node@26.1.1)(esbuild@0.28.0)(jiti@2.7.0)(terser@5.47.1)(tsx@4.23.1)(yaml@2.9.0)))(vue@3.5.39(typescript@6.0.3))
       '@discoveryjs/discovery':
         specifier: 'catalog:'
         version: 1.0.0-beta.99
@@ -973,6 +976,9 @@ importers:
       devframe:
         specifier: workspace:*
         version: link:../../packages/devframe
+      dompurify:
+        specifier: catalog:frontend
+        version: 3.4.2
       floating-vue:
         specifier: catalog:frontend
         version: 5.2.2(vue@3.5.39(typescript@6.0.3))
@@ -1012,7 +1018,7 @@ importers:
     devDependencies:
       '@antfu/design':
         specifier: catalog:frontend
-        version: 0.2.2(@antfu/utils@9.3.0)(@iconify-json/catppuccin@1.2.17)(@tanstack/vue-virtual@3.13.30(vue@3.5.39(typescript@6.0.3)))(@unocss/core@66.7.5)(colorjs.io@0.7.0)(floating-vue@5.2.2(vue@3.5.39(typescript@6.0.3)))(playwright@1.61.1)(reka-ui@2.10.1(vue@3.5.39(typescript@6.0.3)))(splitpanes@4.1.2(vue@3.5.39(typescript@6.0.3)))(unocss@66.7.5(@unocss/postcss@66.7.5(postcss@8.5.16))(vite@8.1.4(@types/node@26.1.1)(esbuild@0.28.0)(jiti@2.7.0)(terser@5.47.1)(tsx@4.23.1)(yaml@2.9.0)))(vue@3.5.39(typescript@6.0.3))
+        version: 0.3.0(@antfu/utils@9.3.0)(@iconify-json/catppuccin@1.2.17)(@tanstack/vue-virtual@3.13.30(vue@3.5.39(typescript@6.0.3)))(@unocss/core@66.7.5)(colorjs.io@0.7.0)(dompurify@3.4.2)(floating-vue@5.2.2(vue@3.5.39(typescript@6.0.3)))(playwright@1.61.1)(reka-ui@2.10.1(vue@3.5.39(typescript@6.0.3)))(splitpanes@4.1.2(vue@3.5.39(typescript@6.0.3)))(unocss@66.7.5(@unocss/postcss@66.7.5(postcss@8.5.16))(vite@8.1.4(@types/node@26.1.1)(esbuild@0.28.0)(jiti@2.7.0)(terser@5.47.1)(tsx@4.23.1)(yaml@2.9.0)))(vue@3.5.39(typescript@6.0.3))
       '@floating-ui/react':
         specifier: catalog:frontend
         version: 0.27.20(react-dom@19.2.7(react@19.2.7))(react@19.2.7)
@@ -1112,7 +1118,7 @@ importers:
     devDependencies:
       '@antfu/design':
         specifier: catalog:frontend
-        version: 0.2.2(@antfu/utils@9.3.0)(@iconify-json/catppuccin@1.2.17)(@tanstack/vue-virtual@3.13.30(vue@3.5.39(typescript@5.9.3)))(@unocss/core@66.7.5)(colorjs.io@0.7.0)(floating-vue@5.2.2(vue@3.5.39(typescript@5.9.3)))(playwright@1.61.1)(reka-ui@2.10.1(vue@3.5.39(typescript@5.9.3)))(splitpanes@4.1.2(vue@3.5.39(typescript@5.9.3)))(unocss@66.7.5(@unocss/postcss@66.7.5(postcss@8.5.16))(vite@8.1.4(@types/node@26.1.1)(esbuild@0.28.0)(jiti@2.7.0)(terser@5.47.1)(tsx@4.23.1)(yaml@2.9.0)))(vue@3.5.39(typescript@5.9.3))
+        version: 0.3.0(@antfu/utils@9.3.0)(@iconify-json/catppuccin@1.2.17)(@tanstack/vue-virtual@3.13.30(vue@3.5.39(typescript@5.9.3)))(@unocss/core@66.7.5)(colorjs.io@0.7.0)(dompurify@3.4.2)(floating-vue@5.2.2(vue@3.5.39(typescript@5.9.3)))(playwright@1.61.1)(reka-ui@2.10.1(vue@3.5.39(typescript@5.9.3)))(splitpanes@4.1.2(vue@3.5.39(typescript@5.9.3)))(unocss@66.7.5(@unocss/postcss@66.7.5(postcss@8.5.16))(vite@8.1.4(@types/node@26.1.1)(esbuild@0.28.0)(jiti@2.7.0)(terser@5.47.1)(tsx@4.23.1)(yaml@2.9.0)))(vue@3.5.39(typescript@5.9.3))
       '@iconify-json/ph':
         specifier: catalog:frontend
         version: 1.2.2
@@ -1179,7 +1185,7 @@ importers:
     devDependencies:
       '@antfu/design':
         specifier: catalog:frontend
-        version: 0.2.2(@antfu/utils@9.3.0)(@iconify-json/catppuccin@1.2.17)(@tanstack/vue-virtual@3.13.30(vue@3.5.39(typescript@6.0.3)))(@unocss/core@66.7.5)(colorjs.io@0.7.0)(floating-vue@5.2.2(vue@3.5.39(typescript@6.0.3)))(playwright@1.61.1)(reka-ui@2.10.1(vue@3.5.39(typescript@6.0.3)))(splitpanes@4.1.2(vue@3.5.39(typescript@6.0.3)))(unocss@66.7.5(@unocss/postcss@66.7.5(postcss@8.5.16))(vite@8.1.4(@types/node@26.1.1)(esbuild@0.28.0)(jiti@2.7.0)(terser@5.47.1)(tsx@4.23.1)(yaml@2.9.0)))(vue@3.5.39(typescript@6.0.3))
+        version: 0.3.0(@antfu/utils@9.3.0)(@iconify-json/catppuccin@1.2.17)(@tanstack/vue-virtual@3.13.30(vue@3.5.39(typescript@6.0.3)))(@unocss/core@66.7.5)(colorjs.io@0.7.0)(dompurify@3.4.2)(floating-vue@5.2.2(vue@3.5.39(typescript@6.0.3)))(playwright@1.61.1)(reka-ui@2.10.1(vue@3.5.39(typescript@6.0.3)))(splitpanes@4.1.2(vue@3.5.39(typescript@6.0.3)))(unocss@66.7.5(@unocss/postcss@66.7.5(postcss@8.5.16))(vite@8.1.4(@types/node@26.1.1)(esbuild@0.28.0)(jiti@2.7.0)(terser@5.47.1)(tsx@4.23.1)(yaml@2.9.0)))(vue@3.5.39(typescript@6.0.3))
       '@devframes/hub':
         specifier: workspace:*
         version: link:../../packages/hub
@@ -1264,7 +1270,7 @@ importers:
     devDependencies:
       '@antfu/design':
         specifier: catalog:frontend
-        version: 0.2.2(@antfu/utils@9.3.0)(@iconify-json/catppuccin@1.2.17)(@tanstack/vue-virtual@3.13.30(vue@3.5.39(typescript@6.0.3)))(@unocss/core@66.7.5)(colorjs.io@0.7.0)(floating-vue@5.2.2(vue@3.5.39(typescript@6.0.3)))(playwright@1.61.1)(reka-ui@2.10.1(vue@3.5.39(typescript@6.0.3)))(splitpanes@4.1.2(vue@3.5.39(typescript@6.0.3)))(unocss@66.7.5(@unocss/postcss@66.7.5(postcss@8.5.16))(vite@8.1.4(@types/node@26.1.1)(esbuild@0.28.0)(jiti@2.7.0)(terser@5.47.1)(tsx@4.23.1)(yaml@2.9.0)))(vue@3.5.39(typescript@6.0.3))
+        version: 0.3.0(@antfu/utils@9.3.0)(@iconify-json/catppuccin@1.2.17)(@tanstack/vue-virtual@3.13.30(vue@3.5.39(typescript@6.0.3)))(@unocss/core@66.7.5)(colorjs.io@0.7.0)(dompurify@3.4.2)(floating-vue@5.2.2(vue@3.5.39(typescript@6.0.3)))(playwright@1.61.1)(reka-ui@2.10.1(vue@3.5.39(typescript@6.0.3)))(splitpanes@4.1.2(vue@3.5.39(typescript@6.0.3)))(unocss@66.7.5(@unocss/postcss@66.7.5(postcss@8.5.16))(vite@8.1.4(@types/node@26.1.1)(esbuild@0.28.0)(jiti@2.7.0)(terser@5.47.1)(tsx@4.23.1)(yaml@2.9.0)))(vue@3.5.39(typescript@6.0.3))
       '@iconify-json/ph':
         specifier: catalog:frontend
         version: 1.2.2
@@ -1321,7 +1327,7 @@ importers:
     devDependencies:
       '@antfu/design':
         specifier: catalog:frontend
-        version: 0.2.2(@antfu/utils@9.3.0)(@iconify-json/catppuccin@1.2.17)(@tanstack/vue-virtual@3.13.30(vue@3.5.39(typescript@6.0.3)))(@unocss/core@66.7.5)(colorjs.io@0.6.1)(floating-vue@5.2.2(vue@3.5.39(typescript@6.0.3)))(playwright@1.61.1)(reka-ui@2.10.1(vue@3.5.39(typescript@6.0.3)))(splitpanes@4.1.2(vue@3.5.39(typescript@6.0.3)))(unocss@66.7.5(@unocss/postcss@66.7.5(postcss@8.5.16))(vite@8.1.4(@types/node@26.1.1)(esbuild@0.28.0)(jiti@2.7.0)(terser@5.47.1)(tsx@4.23.1)(yaml@2.9.0)))(vue@3.5.39(typescript@6.0.3))
+        version: 0.3.0(@antfu/utils@9.3.0)(@iconify-json/catppuccin@1.2.17)(@tanstack/vue-virtual@3.13.30(vue@3.5.39(typescript@6.0.3)))(@unocss/core@66.7.5)(colorjs.io@0.6.1)(dompurify@3.4.2)(floating-vue@5.2.2(vue@3.5.39(typescript@6.0.3)))(playwright@1.61.1)(reka-ui@2.10.1(vue@3.5.39(typescript@6.0.3)))(splitpanes@4.1.2(vue@3.5.39(typescript@6.0.3)))(unocss@66.7.5(@unocss/postcss@66.7.5(postcss@8.5.16))(vite@8.1.4(@types/node@26.1.1)(esbuild@0.28.0)(jiti@2.7.0)(terser@5.47.1)(tsx@4.23.1)(yaml@2.9.0)))(vue@3.5.39(typescript@6.0.3))
       '@iconify-json/ph':
         specifier: catalog:frontend
         version: 1.2.2
@@ -1343,8 +1349,8 @@ packages:
   '@adobe/css-tools@4.5.0':
     resolution: {integrity: sha512-6OzddxPio9UiWTCemp4N8cYLV2ZN1ncRnV1cVGtve7dhPOtRkleRyx32GQCYSwDYgaHU3USMm84tNsvKzRCa1Q==}
 
-  '@antfu/design@0.2.2':
-    resolution: {integrity: sha512-5EFnKrZXwmtHfM9BnptN9rVS7eJ8zMX24xJbYYe4A7yN6+FNjj9inPL/39nlDEWWOuMpZdvOXNvxbG08LYO+Tw==}
+  '@antfu/design@0.3.0':
+    resolution: {integrity: sha512-0h4kRWSJlnU7xsLueWtojMDIgb7oR40pcWcHxXiuEd+mwh/YSB8inghwd6ZK5vC+wWBaOgixoiGIcC2bmyOMug==}
     peerDependencies:
       '@antfu/utils': ^9.0.0
       '@axe-core/playwright': ^4.0.0
@@ -1352,6 +1358,7 @@ packages:
       '@tanstack/vue-virtual': ^3.0.0
       '@unocss/core': '>=66.0.0'
       colorjs.io: ^0.6.0
+      dompurify: ^3.0.0
       floating-vue: ^5.0.0
       playwright: ^1.0.0
       reka-ui: ^2.0.0
@@ -1371,6 +1378,8 @@ packages:
         optional: true
       colorjs.io:
         optional: true
+      dompurify:
+        optional: true
       floating-vue:
         optional: true
       playwright:
@@ -9622,7 +9631,7 @@ snapshots:
 
   '@adobe/css-tools@4.5.0': {}
 
-  '@antfu/design@0.2.2(@antfu/utils@9.3.0)(@iconify-json/catppuccin@1.2.17)(@tanstack/vue-virtual@3.13.30(vue@3.5.39(typescript@5.9.3)))(@unocss/core@66.7.5)(colorjs.io@0.7.0)(floating-vue@5.2.2(vue@3.5.39(typescript@5.9.3)))(playwright@1.61.1)(reka-ui@2.10.1(vue@3.5.39(typescript@5.9.3)))(splitpanes@4.1.2(vue@3.5.39(typescript@5.9.3)))(unocss@66.7.5(@unocss/postcss@66.7.5(postcss@8.5.16))(vite@8.1.4(@types/node@26.1.1)(esbuild@0.28.0)(jiti@2.7.0)(terser@5.47.1)(tsx@4.23.1)(yaml@2.9.0)))(vue@3.5.39(typescript@5.9.3))':
+  '@antfu/design@0.3.0(@antfu/utils@9.3.0)(@iconify-json/catppuccin@1.2.17)(@tanstack/vue-virtual@3.13.30(vue@3.5.39(typescript@5.9.3)))(@unocss/core@66.7.5)(colorjs.io@0.7.0)(dompurify@3.4.2)(floating-vue@5.2.2(vue@3.5.39(typescript@5.9.3)))(playwright@1.61.1)(reka-ui@2.10.1(vue@3.5.39(typescript@5.9.3)))(splitpanes@4.1.2(vue@3.5.39(typescript@5.9.3)))(unocss@66.7.5(@unocss/postcss@66.7.5(postcss@8.5.16))(vite@8.1.4(@types/node@26.1.1)(esbuild@0.28.0)(jiti@2.7.0)(terser@5.47.1)(tsx@4.23.1)(yaml@2.9.0)))(vue@3.5.39(typescript@5.9.3))':
     dependencies:
       '@vueuse/core': 14.3.0(vue@3.5.39(typescript@5.9.3))
       unocss: 66.7.5(@unocss/postcss@66.7.5(postcss@8.5.16))(vite@8.1.4(@types/node@26.1.1)(esbuild@0.28.0)(jiti@2.7.0)(terser@5.47.1)(tsx@4.23.1)(yaml@2.9.0))
@@ -9633,12 +9642,13 @@ snapshots:
       '@tanstack/vue-virtual': 3.13.30(vue@3.5.39(typescript@5.9.3))
       '@unocss/core': 66.7.5
       colorjs.io: 0.7.0
+      dompurify: 3.4.2
       floating-vue: 5.2.2(vue@3.5.39(typescript@5.9.3))
       playwright: 1.61.1
       reka-ui: 2.10.1(vue@3.5.39(typescript@5.9.3))
       splitpanes: 4.1.2(vue@3.5.39(typescript@5.9.3))
 
-  '@antfu/design@0.2.2(@antfu/utils@9.3.0)(@iconify-json/catppuccin@1.2.17)(@tanstack/vue-virtual@3.13.30(vue@3.5.39(typescript@6.0.3)))(@unocss/core@66.7.5)(colorjs.io@0.6.1)(floating-vue@5.2.2(vue@3.5.39(typescript@6.0.3)))(playwright@1.61.1)(reka-ui@2.10.1(vue@3.5.39(typescript@6.0.3)))(splitpanes@4.1.2(vue@3.5.39(typescript@6.0.3)))(unocss@66.7.5(@unocss/postcss@66.7.5(postcss@8.5.16))(vite@8.1.4(@types/node@26.1.1)(esbuild@0.28.0)(jiti@2.7.0)(terser@5.47.1)(tsx@4.23.1)(yaml@2.9.0)))(vue@3.5.39(typescript@6.0.3))':
+  '@antfu/design@0.3.0(@antfu/utils@9.3.0)(@iconify-json/catppuccin@1.2.17)(@tanstack/vue-virtual@3.13.30(vue@3.5.39(typescript@6.0.3)))(@unocss/core@66.7.5)(colorjs.io@0.6.1)(dompurify@3.4.2)(floating-vue@5.2.2(vue@3.5.39(typescript@6.0.3)))(playwright@1.61.1)(reka-ui@2.10.1(vue@3.5.39(typescript@6.0.3)))(splitpanes@4.1.2(vue@3.5.39(typescript@6.0.3)))(unocss@66.7.5(@unocss/postcss@66.7.5(postcss@8.5.16))(vite@8.1.4(@types/node@26.1.1)(esbuild@0.28.0)(jiti@2.7.0)(terser@5.47.1)(tsx@4.23.1)(yaml@2.9.0)))(vue@3.5.39(typescript@6.0.3))':
     dependencies:
       '@vueuse/core': 14.3.0(vue@3.5.39(typescript@6.0.3))
       unocss: 66.7.5(@unocss/postcss@66.7.5(postcss@8.5.16))(vite@8.1.4(@types/node@26.1.1)(esbuild@0.28.0)(jiti@2.7.0)(terser@5.47.1)(tsx@4.23.1)(yaml@2.9.0))
@@ -9649,12 +9659,13 @@ snapshots:
       '@tanstack/vue-virtual': 3.13.30(vue@3.5.39(typescript@6.0.3))
       '@unocss/core': 66.7.5
       colorjs.io: 0.6.1
+      dompurify: 3.4.2
       floating-vue: 5.2.2(vue@3.5.39(typescript@6.0.3))
       playwright: 1.61.1
       reka-ui: 2.10.1(vue@3.5.39(typescript@6.0.3))
       splitpanes: 4.1.2(vue@3.5.39(typescript@6.0.3))
 
-  '@antfu/design@0.2.2(@antfu/utils@9.3.0)(@iconify-json/catppuccin@1.2.17)(@tanstack/vue-virtual@3.13.30(vue@3.5.39(typescript@6.0.3)))(@unocss/core@66.7.5)(colorjs.io@0.7.0)(floating-vue@5.2.2(vue@3.5.39(typescript@6.0.3)))(playwright@1.61.1)(reka-ui@2.10.1(vue@3.5.39(typescript@6.0.3)))(splitpanes@4.1.2(vue@3.5.39(typescript@6.0.3)))(unocss@66.7.5(@unocss/postcss@66.7.5(postcss@8.5.16))(vite@8.1.4(@types/node@26.1.1)(esbuild@0.28.0)(jiti@2.7.0)(terser@5.47.1)(tsx@4.23.1)(yaml@2.9.0)))(vue@3.5.39(typescript@6.0.3))':
+  '@antfu/design@0.3.0(@antfu/utils@9.3.0)(@iconify-json/catppuccin@1.2.17)(@tanstack/vue-virtual@3.13.30(vue@3.5.39(typescript@6.0.3)))(@unocss/core@66.7.5)(colorjs.io@0.7.0)(dompurify@3.4.2)(floating-vue@5.2.2(vue@3.5.39(typescript@6.0.3)))(playwright@1.61.1)(reka-ui@2.10.1(vue@3.5.39(typescript@6.0.3)))(splitpanes@4.1.2(vue@3.5.39(typescript@6.0.3)))(unocss@66.7.5(@unocss/postcss@66.7.5(postcss@8.5.16))(vite@8.1.4(@types/node@26.1.1)(esbuild@0.28.0)(jiti@2.7.0)(terser@5.47.1)(tsx@4.23.1)(yaml@2.9.0)))(vue@3.5.39(typescript@6.0.3))':
     dependencies:
       '@vueuse/core': 14.3.0(vue@3.5.39(typescript@6.0.3))
       unocss: 66.7.5(@unocss/postcss@66.7.5(postcss@8.5.16))(vite@8.1.4(@types/node@26.1.1)(esbuild@0.28.0)(jiti@2.7.0)(terser@5.47.1)(tsx@4.23.1)(yaml@2.9.0))
@@ -9665,6 +9676,7 @@ snapshots:
       '@tanstack/vue-virtual': 3.13.30(vue@3.5.39(typescript@6.0.3))
       '@unocss/core': 66.7.5
       colorjs.io: 0.7.0
+      dompurify: 3.4.2
       floating-vue: 5.2.2(vue@3.5.39(typescript@6.0.3))
       playwright: 1.61.1
       reka-ui: 2.10.1(vue@3.5.39(typescript@6.0.3))
diff --git a/pnpm-workspace.yaml b/pnpm-workspace.yaml
index 4c3f11de..39f82c9c 100644
--- a/pnpm-workspace.yaml
+++ b/pnpm-workspace.yaml
@@ -10,7 +10,7 @@ cleanupUnusedCatalogs: true
 ignoreWorkspaceRootCheck: true
 minimumReleaseAgeExclude:
   - nostics@1.1.4
-  - '@antfu/design@0.2.1'
+  - '@antfu/design@0.3.0'
   - crossws@0.4.8
   - iframe-pane@1.1.0
 shamefullyHoist: true
@@ -81,7 +81,7 @@ catalogs:
     vitepress: ^2.0.0-alpha.18
     vitepress-plugin-mermaid: ^2.0.17
   frontend:
-    '@antfu/design': ^0.2.2
+    '@antfu/design': ^0.3.0
     '@floating-ui/react': ^0.27.20
     '@iconify-json/catppuccin': ^1.2.17
     '@iconify-json/ph': ^1.2.2
@@ -100,6 +100,7 @@ catalogs:
     class-variance-authority: ^0.7.1
     clsx: ^2.1.1
     colorjs.io: ^0.7.0
+    dompurify: ^3.4.2
     floating-vue: ^5.2.2
     iframe-pane: ^1.1.0
     next: ^16.2.10