ts-ui-comparelisted

对比原版 TS renderer 组件（`../claude-devtools/src/renderer/`）与 Rust 版 Svelte 组件（`ui/src/`）的功能 / 样式 / 交互差距，输出差异报告 + 移植建议。**仅**用户显式 `/ts-ui-compare <组件名>` 时触发——模型不能自主调用，因为这是一个需要逐文件细读的开销大动作，且 CLAUDE.md 已默认 UI 改动"优先对齐原版"（feedback_align_with_original 记忆），通常不需要专门跑这个 skill 才能知道方向。
snowzhaozhj/claude-devtools-rs · ★ 1 · Web & Frontend · score 70

Install: claude install-skill snowzhaozhj/claude-devtools-rs

# ts-ui-compare 只在用户显式调用时跑——这是个慢、读多、写少的对比 skill，平时改 UI 直接 grep 原版即可。 ## 输入一个组件 / 功能名，例如 `Sidebar`、`BaseItem`、`ToolViewer`、`SearchBar`。无参数时列出可对比的组件清单（下方映射表）。 ## 路径约定 - Rust 版前端：`/Users/zhaohejie/RustroverProjects/Project/claude-devtools-rs/ui/src/` - 原版 renderer：`/Users/zhaohejie/RustroverProjects/claude-devtools/src/renderer/` - 原版 shared utils：`/Users/zhaohejie/RustroverProjects/claude-devtools/src/shared/utils/` ## 常见组件映射（持续维护——发现漂移就更新表格） | 功能 | 原版 TS (renderer/) | Rust 版 Svelte (ui/src/) | |------|---------------------|--------------------------| | Sidebar | components/sidebar/ | components/Sidebar.svelte | | Session item | components/sidebar/SessionItem.tsx | components/Sidebar.svelte（内嵌）| | BaseItem | components/session/BaseItem.tsx | components/BaseItem.svelte | | Tool viewers | components/session/tools/ | components/tool-viewers/ | | Session detail | components/session/ | routes/SessionDetail.svelte | | Search | components/search/ | components/SearchBar.svelte + CommandPalette.svelte | | Settings | components/settings/ | routes/SettingsView.svelte | | Notifications | components/notifications/ | routes/NotificationsView.svelte | | Context panel | components/context/ | components/ContextPanel.svelte + DirectoryTree.svelte | | Tab system | components/layout/TabBar.tsx | components/TabBar.svelte | | Dashboard | components/dashboard/（若有）| routes/DashboardView.svelte | | Content sanitizer | shared/utils/contentSanitizer.ts | lib/toolHelpers.ts | | Markdown render |