Files
mnote/design/06-mindmap/process/6-mindmap-phase6-leptos-ui-shell-reuse-checklist-v1.md
T

485 lines
42 KiB
Markdown
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
# Mindmap Phase 6 leptos-mindmap UI Shell Reuse Checklist v1
> **For agentic workers:** REQUIRED SUB-SKILL: Use `superpowers:subagent-driven-development` for independent code slices, or `superpowers:executing-plans` when executing this checklist in order. Steps use checkbox (`- [ ]`) syntax for tracking. 每完成一个节点,必须基于代码、截图或测试证据勾选对应项。
**Goal:** 在不恢复旧 React 主链、不直接嵌入 lx-doc Vue 应用的前提下,把当前 `leptos-mindmap + simple-mind-map runtime` 从“无头 runtime + 手写 chrome”推进到接近 KMind/lx-doc 可用度的 floating overlay canvas UI shell。
**Architecture:** Rust kernel 继续持有导图事实源和命令语义,`simple-mind-map` 继续作为编辑 runtime。UI schema 只描述 toolbar、sidebar、navigator、context menu 的项目和动作,不负责布局;默认宿主必须采用接近 lx-doc/KMind 的画布承载模型:runtime 作为块内无限画布底层,toolbar/sidebar/navigator/count/minimap 作为 overlay 浮在画布上,不挤压画布尺寸。当前 TypeScript NodeView 只是过渡桥接层,后续 UI shell 应迁到 Leptos/Rust 组件,避免引入更多长期前端语言/框架边界。
**Tech Stack:** Rust `core-protocol` / `bridge-runtime` / `mnote-web``leptos-tiptap` NodeView、`simple-mind-map`、历史 React `MindmapBlock` 组件族、lx-doc `mind-map` 参考代码、Playwright smoke。
---
## 0. 当前判断
当前 Phase 6 的方向不需要改成“直接嵌入 lx-doc/mind-map”。应该继续采用:
```text
Rust kernel truth
-> mindmap.simple_mind_map_scene.v1
-> leptos-tiptap NodeView
-> simple-mind-map runtime
-> UI shell schema / action bridge
-> kernel command / compatPayload.patch
```
本 checklist 修正的是下一阶段执行重心:
- 不再把“接入 `simple-mind-map` runtime”当作可用导图编辑器完成。
- 不再继续手写一次性的功能键、选项栏和底部栏。
- 优先复用本仓历史自研 UI 壳的配置、按钮分组、右侧栏、导航栏、MiniMap、统计、右键菜单经验。
- lx-doc/KMind 作为视觉、命令和交互基线;历史 React 组件作为最直接的迁移素材。
- 2026-05-11 修正:此前 schema UI 已能显示工具项,但仍采用 grid/flex 文档流布局,和 `https://wanglin2.github.io/mind-map/#/`、KMind 截图的“无限画布 + 浮动 UI”不一致。后续必须先迁移到 floating overlay canvas shell,再继续扩展功能语义。
- 2026-05-11 方向约束:mnote 主体是 Rust,`leptos-tiptap` 也是嵌入式 Leptos 路线;mindmap UI shell 不应继续沉淀为 TypeScript DOM UI。TS 只保留 `tiptap NodeView mount + simple-mind-map bridge + event/command forwarding`,真正的 toolbar/sidebar/navigator/context menu 应迁移到 Leptos/Rust。
## 1. 参考材料
### 当前主线文档
- `design/06-mindmap/process/6-mindmap-kernel-phase6-projection-editor-v1.md`
- `design/06-mindmap/process/6-mindmap-leptos-adapter-reference-notes-v1.md`
- `docs/superpowers/plans/2026-05-10-mindmap-phase6-projection-editor-checklist.md`
### lx-doc / KMind 参考
- `design/05-editor-mainline/reference-code/lx-doc/mind-map/src/pages/Edit/components/Edit.vue`
- `design/05-editor-mainline/reference-code/lx-doc/mind-map/src/pages/Edit/components/ToolbarNodeBtnList.vue`
- `design/05-editor-mainline/reference-code/lx-doc/mind-map/src/pages/Edit/components/SidebarTrigger.vue`
- `design/05-editor-mainline/reference-code/lx-doc/mind-map/src/pages/Edit/components/NavigatorToolbar.vue`
- `design/05-editor-mainline/reference-code/lx-doc/mind-map/src/config/zh.js`
- `design/05-editor-mainline/reference-code/kmind-plugin`
### 本仓历史 UI 壳
- `wolai-frontend/src/components/editor/blocks/MindmapBlock.tsx`
- `wolai-frontend/src/components/editor/blocks/MindmapToolbar.tsx`
- `wolai-frontend/src/components/editor/blocks/mindmapToolbarConfig.ts`
- `wolai-frontend/src/components/editor/blocks/MindmapSidebar.tsx`
- `wolai-frontend/src/components/editor/blocks/mindmapSidebarConfig.ts`
- `wolai-frontend/src/components/editor/blocks/MindmapNavigator.tsx`
- `wolai-frontend/src/components/editor/blocks/MindmapMiniMap.tsx`
- `wolai-frontend/src/components/editor/blocks/MindmapCount.tsx`
- `wolai-frontend/src/components/editor/blocks/MindmapContextMenu.tsx`
### 历史简化宿主参考
- `/mnt/Data1T/mnote-rust/components/editor/blocks/MindmapRuntimeEditor.tsx`
- `/mnt/Data1T/mnote-rust/components/editor/blocks/MindmapToolbar.tsx`
- `/mnt/Data1T/mnote-rust/components/editor/blocks/MindmapNavigator.tsx`
- `/mnt/Data1T/mnote-rust/components/editor/blocks/MindmapMiniMap.tsx`
- `/mnt/Data1T/mnote-rust/components/editor/blocks/MindmapSidebarTrigger.tsx`
## 2. 文件职责图
- `wolai-frontend/src/lib/mindmap/mindmap-ui-schema.ts`
- 新增:toolbar、sidebar、navigator、context menu 的中立 UI schema。
- `wolai-frontend/src/lib/mindmap/mindmap-action-map.ts`
- 新增:UI action 到 `simple-mind-map` command、kernel command、`compatPayload.patch` 的映射。
- `wolai-frontend/src/lib/mindmap/mindmap-ui-state.ts`
- 新增:active node、selection、readonly、scale、panel open state、disabled state 的派生逻辑。
- `wolai-frontend/src/lib/mindmap/leptos-mindmap-adapter.ts`
- 修改:暴露 UI shell 需要的 runtime action、state subscribe、command result。
- `wolai-frontend/src/lib/mindmap/simple-mind-map-bridge.ts`
- 修改:补齐 `execCommand`、插件能力探测、scale/view 操作、销毁清理。
- `wolai-frontend/src/lib/mindmap/mindmap-command-diff.ts`
- 修改:补齐 toolbar/sidebar/context menu 产生的变更到 kernel command / compat patch 的转换。
- `design/05-editor-mainline/reference-code/leptos-tiptap/tiptap/src/extensions/tiptap_paragraph.ts`
- 过渡修改:NodeView 只负责挂载 runtime、Leptos/Rust UI shell 宿主和最小桥接,不再继续扩散硬编码按钮逻辑。
- `rust/spikes/leptos-tiptap-spike/generated/island/snippets/leptos-tiptap-c355e6ec24c3df4c/src/js/generated/tiptap_paragraph.js`
- 修改:同步生成后的 browser-side bridge,保持与 TS source 行为一致。
- `scripts/task166-mindmap-phase6-block-smoke.js`
- 修改:从 runtime 存在 smoke 升级为 UI shell、交互、保存、reload、截图 smoke。
### Floating overlay canvas shell 约束
- 默认 DOM 应为 `canvas-layer + overlay-layer``simple-mind-map` runtime 充满块内画布,toolbar/sidebar/navigator/count/minimap 都位于 overlay layer。
- toolbar 顶部居中浮动,视觉上接近 lx-doc `Toolbar.vue` 的 fixed toolbar,而不是文档流顶部栏。
- sidebar trigger / panel 右侧浮动,打开 panel 时不改变 runtime 宽度,只覆盖画布右侧安全区域。
- navigator 右下浮动,count 左下浮动,MiniMap 后续在右下 navigator 上方浮动。
- smoke 必须断言 overlay layer 存在,runtime rect 与 editor root rect 高度/宽度接近,不因 sidebar/toolbar/navigator 被 grid/flex 挤压。
### Leptos/Rust UI shell 收口约束
- `mindmap-ui-schema.ts` / `mindmap-action-map.ts` / `mindmap-ui-state.ts` 当前是过渡资产;新增长期 UI 行为时应优先设计 Rust/Leptos 可消费的 schema 和 signal/state 边界。
- `tiptap_paragraph.ts` 不应继续成为 toolbar/sidebar/navigator 的长期实现文件;新增复杂 UI 面板前,应先迁出到 Leptos/Rust 组件或生成的 island 组件边界。
- 禁止恢复旧 React `MindmapBlock.tsx` 为默认主链,禁止直接嵌入 lx-doc Vue app,禁止新增第三套 JS UI 框架。
- `simple-mind-map` 可以继续作为 runtime engine,但 UI shell 的宿主语言方向应是 Leptos/Rust。
---
### Task 1: 冻结新阶段边界
**Files:**
- Modify: `design/06-mindmap/process/6-mindmap-kernel-phase6-projection-editor-v1.md`
- Modify: `docs/superpowers/plans/2026-05-10-mindmap-phase6-projection-editor-checklist.md`
- Create/Modify: `design/06-mindmap/process/6-mindmap-phase6-leptos-ui-shell-reuse-checklist-v1.md`
- [x] 明确当前 Phase 6 不是“Rust 重写 lx-doc/mind-map”,也不是“直接嵌入 lx-doc Vue app”。
- 2026-05-11 记录:本文件“当前判断”和总设计稿第 3 节均保留三路线定位,Phase 6 主线为 `leptos-mindmap`
- [x] 明确下一阶段目标是“当前 simple-mind-map runtime + 可复用 UI shell + kernel command bridge”。
- 2026-05-11 记录:本文件 Goal/Architecture 与总设计稿 `10.2` 均明确 floating overlay UI shell + command bridge。
- [x] 在旧 checklist 中标记:已完成项如果只覆盖 runtime 接入和最小 smoke,不代表 KMind-like UI 可用性完成。
- 2026-05-11 更新:旧 checklist 新增 `Task 13: UI Shell Reuse 后续收口`,指向本文件。
- [x] 在设计稿中补一段“UI shell 复用策略”,指向本 checklist。
- 2026-05-11 更新:`6-mindmap-kernel-phase6-projection-editor-v1.md` 新增 `10.2 2026-05-11 UI shell reuse 收口状态`
- [x] 验证:`rg -n "UI shell|MindmapBlock.tsx|mindmap-ui-schema|直接嵌入 lx-doc" design/06-mindmap docs/superpowers/plans/2026-05-10-mindmap-phase6-projection-editor-checklist.md`
- 2026-05-11 通过:命令能检索到本 checklist、总设计稿、reference notes 和旧执行 checklist 的对应口径。
### Task 2: 抽取历史 React UI 能力清单
**Files:**
- Inspect: `wolai-frontend/src/components/editor/blocks/MindmapBlock.tsx`
- Inspect: `wolai-frontend/src/components/editor/blocks/MindmapToolbar.tsx`
- Inspect: `wolai-frontend/src/components/editor/blocks/mindmapToolbarConfig.ts`
- Inspect: `wolai-frontend/src/components/editor/blocks/MindmapSidebar.tsx`
- Inspect: `wolai-frontend/src/components/editor/blocks/mindmapSidebarConfig.ts`
- Inspect: `wolai-frontend/src/components/editor/blocks/MindmapNavigator.tsx`
- Inspect: `wolai-frontend/src/components/editor/blocks/MindmapMiniMap.tsx`
- Inspect: `wolai-frontend/src/components/editor/blocks/MindmapCount.tsx`
- Inspect: `wolai-frontend/src/components/editor/blocks/MindmapContextMenu.tsx`
- Output: `design/06-mindmap/process/6-mindmap-leptos-adapter-reference-notes-v1.md`
- [x] 列出历史 toolbar 分组:历史操作、节点操作、插入扩展、样式、结构、导入导出、视图操作。
- [x] 列出每个 toolbar action 的旧实现来源、旧 runtime 调用、禁用条件、是否需要 active node。
- [x] 列出历史 sidebar panel:节点样式、基础样式、主题、结构、大纲、快捷键或设置。
- [x] 列出历史 navigator 能力:缩放、回根、适应画布、MiniMap、节点数/字数、只读/全屏。
- [x] 列出历史 context menu 能力:插入、删除、复制、粘贴、展开折叠、概要、关联线、样式。
- [x] 标注哪些能力第一阶段必须迁移,哪些只保留 schema 但暂不显示。
- [x] 验证:输出表格至少覆盖 toolbar、sidebar、navigator、context menu 四类能力,并能追溯到具体文件名。
- 2026-05-11 输出:`design/06-mindmap/process/6-mindmap-leptos-adapter-reference-notes-v1.md` 第 8 节。
### Task 3: 建立中立 UI Schema
**Files:**
- Create: `wolai-frontend/src/lib/mindmap/mindmap-ui-schema.ts`
- Create: `wolai-frontend/src/lib/mindmap/mindmap-ui-schema.test.ts`
- [x] 定义 `MindmapUiActionId`,覆盖第一阶段 action`undo``redo``editNode``insertSiblingAfter``insertChild``deleteNode``tag``hyperlink``note``image``icon``summary``associativeLine``formula``painter``import``export``setTheme``setLayout``zoomIn``zoomOut``fitView``centerRoot``search``readonly`
- [x] 定义 `MindmapToolbarGroup`,字段包含 `id``label``actions``collapsePriority`
- [x] 定义 `MindmapSidebarPanel`,字段包含 `id``label``icon``runtimeCapability``phase`
- [x] 定义 `MindmapNavigatorItem`,字段包含 `id``label``actionId``readOnly``displayMode`
- [x] 定义 `MindmapContextMenuItem`,字段包含 `id``label``actionId``requiresNode``phase`
- [x] 导出 `mindmapDefaultUiSchema`,只包含第一阶段需要显示的功能。
- [x] 单测断言 action id 不重复、每个 toolbar action 都能在 action map 中找到占位映射、第一阶段 panel 数量不超过 5 个。
- [x] 验证:`cd /mnt/Data1T/mnote/wolai-frontend && pnpm test -- mindmap-ui-schema`
### Task 4: 建立 Action Map 与禁用状态
**Files:**
- Create: `wolai-frontend/src/lib/mindmap/mindmap-action-map.ts`
- Create: `wolai-frontend/src/lib/mindmap/mindmap-action-map.test.ts`
- Create: `wolai-frontend/src/lib/mindmap/mindmap-ui-state.ts`
- Create: `wolai-frontend/src/lib/mindmap/mindmap-ui-state.test.ts`
- Modify: `wolai-frontend/src/lib/mindmap/leptos-mindmap-adapter.ts`
- [x] 定义 `MindmapActionTarget``runtimeCommand``kernelCommand``compatPatch``localView`
- [x]`insertChild` 映射到 `simple-mind-map` 插入子节点命令,并在成功后走 `mindmap.node.insert_child` 或 diff。
- [x]`insertSiblingAfter` 映射到同级插入命令,并在成功后走 `mindmap.node.insert_sibling_after` 或 diff。
- [x]`deleteNode` 映射到删除命令,并在成功后走 `mindmap.node.delete` 或 diff。
- [x]`centerRoot``zoomIn``zoomOut``fitView` 映射为 runtime view action,同时产生 `mindmap.view.patch`
- [x]`setTheme``setLayout` 映射为 `mindmap.theme.set``mindmap.layout.set`
- [x]`tag``hyperlink``note``image``icon``formula``painter` 第一阶段映射为 `compatPayload.patch`,并记录字段路径。
- [x] 实现 `deriveMindmapUiState()`,根据 active node、readonly、runtime capabilities、selection 派生 disabled state。
- [x] 单测覆盖:无 active node 时节点操作禁用;readonly 时编辑类 action 禁用;view action 不依赖 active node。
- [x] 验证:`cd /mnt/Data1T/mnote/wolai-frontend && pnpm test -- mindmap-action-map mindmap-ui-state`
- 2026-05-11 补充验证:`pnpm test -- mindmap-ui-schema mindmap-action-map mindmap-ui-state` 通过。
### Task 5: 替换 NodeView 中的硬编码 Chrome
**Files:**
- Modify: `design/05-editor-mainline/reference-code/leptos-tiptap/tiptap/src/extensions/tiptap_paragraph.ts`
- Modify: `rust/spikes/leptos-tiptap-spike/generated/island/snippets/leptos-tiptap-c355e6ec24c3df4c/src/js/generated/tiptap_paragraph.js`
- Modify: `wolai-frontend/src/lib/mindmap/leptos-mindmap-adapter.ts`
- [x] 移除默认主链中的手写 toolbar button 列表,改为从 `mindmapDefaultUiSchema.toolbarGroups` 渲染。
- 2026-05-11 验证:默认 DOM `data-testid="mindmap-schema-toolbar"``data-schema-source="mindmapDefaultUiSchema"`;截图 `tmp/task166-mindmap-phase6-block-smoke/toolbar-actions.png`
- [x] 移除默认主链中的手写 sidebar trigger 列表,改为从 `mindmapDefaultUiSchema.sidebarPanels` 渲染。
- 2026-05-11 验证:默认 DOM `data-testid="mindmap-schema-sidebar"``data-schema-source="mindmapDefaultUiSchema"`;截图 `tmp/task166-mindmap-phase6-block-smoke/sidebar-node-style.png`
- [x] 移除默认主链中的固定 bottom bar 文案,改为从 navigator schema 和 runtime state 渲染。
- 2026-05-11 验证:默认 DOM `data-testid="mindmap-schema-navigator"`,显示节点数、字数与缩放百分比;截图 `tmp/task166-mindmap-phase6-block-smoke/navigator-default.png`
- [x] 保留最小错误层:`projection_load_failed``adapter_init_failed``runtime_render_failed``command_failed`
- [x] 保留 debug fallback,但必须通过显式 debug flag 才能显示,不作为默认主链。
- [x] 确保 NodeView 销毁时仍调用 adapter `destroy()`
- [x] 验证:页面 DOM 中默认不再出现旧 `.mnote-mindmap-node` 手写节点主链;`data-testid="mnote-mindmap-editor-root"` 仍存在。
- 2026-05-11 验证:`node scripts/task166-mindmap-phase6-block-smoke.js` 通过;`tmp/task166-mindmap-phase6-block-smoke/result.json``ok=true`,默认 `debugChrome=false` 且无手写 toolbar/sidebar/bottom bar。
### Task 5A: 修正为 Floating Overlay Canvas Shell
**Files:**
- Modify: `design/05-editor-mainline/reference-code/leptos-tiptap/tiptap/src/extensions/tiptap_paragraph.ts`
- Modify: `rust/spikes/leptos-tiptap-spike/src/lib.rs`
- Modify: `rust/spikes/leptos-tiptap-spike/generated/island/snippets/leptos-tiptap-c355e6ec24c3df4c/src/js/generated/tiptap_paragraph.js`
- Modify: `scripts/task166-mindmap-phase6-block-smoke.js`
- [x] NodeView 默认 DOM 改为 `canvas-layer + overlay-layer`runtime 不再和 sidebar 组成 grid。
- 2026-05-11 实现:默认路径挂载 `mindmap-canvas-layer``mindmap-overlay-layer`debug fallback 仍保留旧布局。
- [x] toolbar 顶部居中浮动,sidebar 右侧浮动,navigator 右下浮动,count 左下浮动。
- 2026-05-11 截图:`tmp/task166-mindmap-phase6-block-smoke/01-after-insert-floating-overlay.png`
- [x] sidebar 打开或切换 panel 时不改变 runtime 宽度。
- 2026-05-11 验证:sidebar 已从 workspace grid 移到 overlay layersmoke 覆盖 panel 切换截图。
- [x] smoke 断言 `data-testid="mindmap-overlay-layer"` 存在,且 `runtimeBox.width / rootBox.width >= 0.9`
- 2026-05-11 验证:`node scripts/task166-mindmap-phase6-block-smoke.js` 通过。
- [x] smoke 保存 `01-after-insert-floating-overlay.png`,截图能看到画布底层和浮动 UI。
- 2026-05-11 截图:`tmp/task166-mindmap-phase6-block-smoke/01-after-insert-floating-overlay.png`
- [x] 验证:`cd /mnt/Data1T/mnote/design/05-editor-mainline/reference-code/leptos-tiptap/tiptap && npm run typecheck && npm run build`
- 2026-05-11 通过。
- [x] 验证:`cd /mnt/Data1T/mnote/wolai-frontend && node scripts/build-leptos-tiptap-island.js`
- 2026-05-11 已重新生成 island。
- [x] 验证:`cd /mnt/Data1T/mnote && node scripts/task166-mindmap-phase6-block-smoke.js`
- 2026-05-11 通过;`tmp/task166-mindmap-phase6-block-smoke/result.json``ok=true`
### Task 5B: 收口到 Leptos/Rust UI Shell 宿主
**Files:**
- Modify/Create: `rust/spikes/leptos-tiptap-spike/src/lib.rs`
- Modify/Create: `rust/spikes/leptos-tiptap-spike/src/mindmap_shell.rs` 或同等 Leptos 组件文件
- Modify: `design/05-editor-mainline/reference-code/leptos-tiptap/tiptap/src/extensions/tiptap_paragraph.ts`
- Modify: `wolai-frontend/src/lib/mindmap/leptos-mindmap-adapter.ts`
- Modify: `scripts/task166-mindmap-phase6-block-smoke.js`
- [x] 明确 `tiptap_paragraph.ts` 只创建 mount 容器、加载 runtime bridge、转发事件,不再直接渲染 toolbar/sidebar/navigator 长期 UI。
- 2026-05-11 实现:默认路径只挂载 `mindmap-rust-shell-mount`TS 负责 `simple-mind-map` runtime、projection/command bridge、`mnote:mindmap-shell:*` 事件转发;debug fallback 仍需显式 debug flag。
- [x] 将 floating overlay shell 的 toolbar/sidebar/count/navigator 渲染迁到 Leptos/Rust 组件边界。
- 2026-05-11 实现:`rust/spikes/leptos-tiptap-spike/src/lib.rs` 导出 `mount_mindmap_shell` / `unmount_mindmap_shell`Leptos 组件输出 `mindmap-rust-shell`、toolbar、sidebar、count、navigator。
- [x] Leptos/Rust UI shell 消费同等 schema/state/action 能力;若仍需 TS schema,必须作为临时 adapter 输入,不作为长期事实源。
- 2026-05-11 实现:当前 TS adapter 将 `mindmapDefaultUiSchema``deriveMindmapUiState()` 转为 Rust shell options;后续新增长期 UI 能力应继续迁到 Rust/Leptos schema 边界。
- [x] Leptos/Rust UI shell 触发 action 时仍经由 adapter command bridge,不绕过 kernel command。
- 2026-05-11 验证:Rust shell 派发 `mnote:mindmap-shell:action` / `mnote:mindmap-shell:panel`NodeView 统一转到 `executeSchemaAction()``applyCommandsAndRefresh()``patchView`
- [x] smoke 断言默认 UI shell 来源为 `leptos-rust-shell` 或等价稳定标记,而不是 `typescript-nodeview-dom`
- 2026-05-11 验证:`scripts/task166-mindmap-phase6-block-smoke.js` 断言 `data-ui-shell-source="leptos-rust-shell"``data-ui-source="leptos-rust-shell"`
- [x] 验证:`cd /mnt/Data1T/mnote/design/05-editor-mainline/reference-code/leptos-tiptap/tiptap && npm run typecheck && npm run build`
- 2026-05-11 通过。
- [x] 验证:`cd /mnt/Data1T/mnote/wolai-frontend && node scripts/build-leptos-tiptap-island.js`
- 2026-05-11 通过,island 入口包含 `mount_mindmap_shell` / `unmount_mindmap_shell`
- [x] 验证:`cd /mnt/Data1T/mnote && node scripts/task166-mindmap-phase6-block-smoke.js`
- 2026-05-11 通过;`tmp/task166-mindmap-phase6-block-smoke/result.json``ok=true`,默认入口 `http://127.0.0.1:3000`;截图 `tmp/task166-mindmap-phase6-block-smoke/01-after-insert-floating-overlay.png`
### Task 6: Toolbar 第一阶段迁移
**Files:**
- Modify: `wolai-frontend/src/lib/mindmap/mindmap-ui-schema.ts`
- Modify: `wolai-frontend/src/lib/mindmap/mindmap-action-map.ts`
- Modify: `wolai-frontend/src/lib/mindmap/leptos-mindmap-adapter.ts`
- Modify: `scripts/task166-mindmap-phase6-block-smoke.js`
- [x] 顶部 toolbar 显示:撤销、重做、同级节点、子节点、删除、标签、超链接、备注、图片、图标、概要、关联线、公式、格式刷、导入、导出。
- 2026-05-11 验证:`node scripts/task166-mindmap-phase6-block-smoke.js` 断言上述 action id 均存在;截图 `tmp/task166-mindmap-phase6-block-smoke/toolbar-actions.png`
- [x] toolbar 分组、图标尺寸、按钮间距对齐 KMind/lx-doc 的工作台密度,不做大卡片式按钮。
- 2026-05-11 实现:`rust/spikes/leptos-tiptap-spike/src/lib.rs` 新增 schema toolbar group、tool icon/label 紧凑样式;截图 `tmp/task166-mindmap-phase6-block-smoke/01-after-insert-schema-ui.png`
- [x] active node 为空时禁用节点相关按钮。
- 2026-05-11 实现:Rust shell 消费 `deriveMindmapUiState()` 派生的 disabled state;节点类 action 依赖 `activeNodeId`
- [x] readonly 时禁用所有编辑类按钮,保留缩放、搜索、回根。
- 2026-05-11 验证:`node scripts/task166-mindmap-phase6-block-smoke.js``verifyReadonlyToolbarState()` 覆盖 readonly 开关后编辑按钮禁用、view 按钮保留可用。
- [x] 点击“子节点”后真实插入节点,截图可见新增节点。
- 2026-05-11 验证:`toolbarActions.insertChildOk=true`,截图 `tmp/task166-mindmap-phase6-block-smoke/03-after-toolbar-actions.png`
- [x] 点击“同级节点”后真实插入同级节点,截图可见新增节点。
- 2026-05-11 验证:`toolbarActions.insertSiblingOk=true`,节点数从 5 增至 6。
- [x] 点击“删除”后真实删除选中节点,并能 reload 后保持。
- 2026-05-11 验证:`toolbarActions.deleteOk=true`,删除后节点数为 5,reload 后仍为 5。
- [x] 验证:smoke 输出 toolbar action 结果 JSON,包含 `insertChildOk``insertSiblingOk``deleteOk`
- 2026-05-11 通过:`tmp/task166-mindmap-phase6-block-smoke/result.json``toolbarActions={insertChildOk:true,insertSiblingOk:true,deleteOk:true}`
### Task 7: Sidebar 第一阶段迁移
**Files:**
- Modify: `wolai-frontend/src/lib/mindmap/mindmap-ui-schema.ts`
- Modify: `wolai-frontend/src/lib/mindmap/mindmap-action-map.ts`
- Modify: `wolai-frontend/src/lib/mindmap/leptos-mindmap-adapter.ts`
- Modify: `scripts/task166-mindmap-phase6-block-smoke.js`
- [x] 右侧栏触发器显示:节点样式、导图样式、主题、结构、大纲。
- 2026-05-11 验证:smoke 断言 `nodeStyle``baseStyle``theme``structure``outline` 均存在。
- [x] 打开一个 panel 时不挤压或遮挡主要画布节点。
- 2026-05-11 验证:Task 5A/5B smoke 断言 `runtimeBox.width / rootBox.width >= 0.9``runtimeBox.height / rootBox.height >= 0.85`sidebar 位于 floating overlay,不改变 runtime 尺寸。
- [x] 主题 panel 第一阶段至少提供默认主题和 KMind-like 主题切换。
- 2026-05-11 实现:Rust/Leptos sidebar body 渲染 `theme-classic``theme-classic4`NodeView bridge 将选择转为 `setTheme` kernel command。验证:`node scripts/task166-mindmap-phase6-block-smoke.js``sidebarActions.themeOk=true`reload 后 `theme=classic4` 保持;截图 `tmp/task166-mindmap-phase6-block-smoke/sidebar-theme.png``sidebar-actions.png`
- [x] 结构 panel 第一阶段至少提供逻辑结构、右侧结构、鱼骨或树形结构中的可用子集。
- 2026-05-11 实现:Rust/Leptos sidebar body 渲染 `logicalStructure``mindMap``fishbone` 结构选项;NodeView bridge 将选择转为 `setLayout` kernel command。验证:`node scripts/task166-mindmap-phase6-block-smoke.js``sidebarActions.layoutOk=true`reload 后 `layout=mindMap` 保持;截图 `tmp/task166-mindmap-phase6-block-smoke/sidebar-structure.png`
- [x] 大纲 panel 只从 projection/runtime 派生,不创建第二份树真相。
- 2026-05-11 实现:NodeView 每次 mount Rust shell 时从当前 runtime snapshot / projection root 派生 `bodyItems`,Rust shell 只渲染传入列表,不维护第二份树状态。验证:`sidebarActions.outlineDerivedOk=true`,输出 outline items 包含当前导图节点文本;截图 `tmp/task166-mindmap-phase6-block-smoke/sidebar-outline.png`
- [x] 节点样式和导图样式的暂未语义化字段走 `compatPayload.patch`
- 2026-05-11 实现:sidebar option 派发 `source=sidebar``compatPath`;节点样式写入 `nodes.$active.data.fillColor`,导图样式写入 `compatPayload.style.map.lineStyle`。验证:`sidebarActions.nodeStyleCompatOk=true``sidebarActions.baseStyleCompatOk=true`reload 后保持;截图 `tmp/task166-mindmap-phase6-block-smoke/sidebar-node-style.png``sidebar-base-style.png`
- [x] 验证:smoke 能打开每个 panel,并保存 `sidebar-node-style.png``sidebar-theme.png``sidebar-structure.png``sidebar-outline.png`
- 2026-05-11 通过:`node scripts/task166-mindmap-phase6-block-smoke.js` 保存四张 sidebar 截图。
### Task 8: Navigator / MiniMap / Count 迁移
**Files:**
- Modify: `wolai-frontend/src/lib/mindmap/mindmap-ui-schema.ts`
- Modify: `wolai-frontend/src/lib/mindmap/leptos-mindmap-adapter.ts`
- Modify: `scripts/task166-mindmap-phase6-block-smoke.js`
- [x] 底部栏显示节点数、字数、当前缩放百分比。
- 2026-05-11 验证:smoke 断言 navigator stats 包含“节点”,zoom 包含 `%`;截图 `tmp/task166-mindmap-phase6-block-smoke/navigator-default.png`
- [x] “回根节点”调用 runtime center root,并写入 view patch。
- 2026-05-11 验证:`node scripts/task166-mindmap-phase6-block-smoke.js` 通过;`navigatorActions.centerRootOk=true`,通过浮动 navigator 按钮触发并观测到 `patchView` POST。
- [x] 缩放加减按钮调用 runtime zoom,并写入 view patch。
- 2026-05-11 验证:`navigatorActions.zoomOk=true``viewScale=1.2`,截图 `tmp/task166-mindmap-phase6-block-smoke/navigator-zoomed.png`
- [x] 搜索入口调用 `simple-mind-map` Search 插件或当前 adapter 搜索入口。
- 2026-05-11 实现:Rust/Leptos navigator search input 派发 `search` actionNodeView adapter 记录当前搜索入口状态与 query;后续可替换为 Search 插件面板。验证:`navigatorActions.searchOk=true`
- [x] MiniMap 第一阶段可折叠显示,但按钮和容器状态必须稳定。
- 2026-05-11 实现:Rust/Leptos shell 增加 MiniMap 开关和稳定 overlay 容器;不恢复旧 React MiniMap。验证:`navigatorActions.minimapOk=true`,截图 `tmp/task166-mindmap-phase6-block-smoke/navigator-minimap.png`
- [x] 底部栏在窄屏下不覆盖节点编辑区域。
- 2026-05-11 验证:当前 smoke 断言 runtime 仍保持 `runtimeBox.width/rootBox.width >= 0.9``runtimeBox.height/rootBox.height >= 0.85`navigator/MiniMap 均在 overlay layer,不改变 runtime 尺寸。
- [x] 验证:smoke 保存 `navigator-default.png``navigator-zoomed.png``navigator-minimap.png`
- 2026-05-11 通过:`node scripts/task166-mindmap-phase6-block-smoke.js` 输出 `ok=true`,截图路径包含三张 navigator 截图。
### Task 9: Context Menu 迁移
**Files:**
- Modify: `wolai-frontend/src/lib/mindmap/mindmap-ui-schema.ts`
- Modify: `wolai-frontend/src/lib/mindmap/mindmap-action-map.ts`
- Modify: `wolai-frontend/src/lib/mindmap/leptos-mindmap-adapter.ts`
- Modify: `scripts/task166-mindmap-phase6-block-smoke.js`
- [x] 右键节点时显示节点 context menu。
- 2026-05-11 实现:NodeView capture 阶段监听 `contextmenu`,检测 `.smm-node` 后打开节点菜单。验证:`node scripts/task166-mindmap-phase6-block-smoke.js``contextMenuActions.nodeMenuOk=true`;截图 `tmp/task166-mindmap-phase6-block-smoke/context-menu-actions.png`
- [x] 右键画布时显示画布 context menu,节点专属操作禁用或隐藏。
- 2026-05-11 验证:smoke 右键 runtime 空白区后 `contextMenuActions.canvasMenuOk=true`,且 canvas 菜单不包含 `insertChild`
- [x] 节点 menu 第一阶段包含:插入子节点、插入同级节点、删除、展开/收起、概要、关联线、复制文本。
- 2026-05-11 验证:smoke 断言节点菜单包含 `insertChild``insertSiblingAfter``deleteNode``summary``associativeLine``expandCollapse``copyNodeText``copyTextOk=true``insertChildOk=true`
- [x] 画布 menu 第一阶段包含:回根节点、适应画布、搜索、只读切换。
- 2026-05-11 验证:smoke 断言画布菜单包含 `centerRoot``fitView``search``readonly`
- [x] 所有 context menu action 复用 `mindmap-action-map.ts`,不新增第二套动作逻辑。
- 2026-05-11 实现:`mindmap-ui-schema.ts` 新增 `expandCollapse``copyNodeText``mindmap-action-map.ts` 将其映射为 `localView`;菜单点击统一调用 `executeSchemaAction()`。说明:context menu DOM 当前仍由 NodeView 过渡渲染,后续可按 Task 5B 同样迁入 Rust/Leptos shell。
- [x] 验证:smoke 能打开节点右键菜单和画布右键菜单,并保存截图。
- 2026-05-11 通过:`node scripts/task166-mindmap-phase6-block-smoke.js` 输出 `ok=true`;截图 `tmp/task166-mindmap-phase6-block-smoke/context-menu-actions.png`
### Task 10: Command Bridge 与保存闭环补齐
**Files:**
- Modify: `wolai-frontend/src/lib/mindmap/mindmap-command-diff.ts`
- Modify: `wolai-frontend/src/lib/mindmap/leptos-mindmap-adapter.ts`
- Modify: `rust/crates/bridge-runtime/src/lib.rs`
- Modify: `rust/crates/core-protocol/src/mindmap.rs`
- Modify: `scripts/task166-mindmap-phase6-block-smoke.js`
- [x] `data_change` 能识别文本更新、插入子节点、插入同级节点、删除节点、移动节点。
- 2026-05-11 验证:`mindmap-command-diff.test.ts` 覆盖文本、插入、删除、移动 diff;`node scripts/task166-mindmap-phase6-block-smoke.js` 覆盖 toolbar/context menu 插入与删除保存闭环。
- [x] `view_data_change` 能转成 `mindmap.view.patch`
- 2026-05-11 验证:navigator 回根与缩放触发 view patchsmoke 输出 `navigatorActions.centerRootOk=true``navigatorActions.zoomOk=true``viewScale=1.2`
- [x] toolbar/sidebar/context menu 触发的动作都能落到 `kernel command``compatPayload.patch`
- 2026-05-11 验证:toolbar 插入/删除、sidebar 主题/结构、context menu 插入均通过 smokesidebar 节点样式/导图样式走 compat patch,结果为 `nodeStyleCompatOk=true``baseStyleCompatOk=true`
- [x] 每个 `compatPayload.patch` 记录字段路径、来源 action、runtime revision、kernel revision。
- 2026-05-11 实现:`mindmap-command-diff.ts``MindmapCompatPayloadPatch` 增加 `actionId``runtimeRevision``kernelRevision`NodeView bridge 注入 action/revision 元信息。
- [x] command 失败时显示 `command_failed`,并保留失败 action id 和错误消息。
- 2026-05-11 实现:NodeView command 失败时写入 `data-command-failed-action``data-command-failed-message`;本轮 smoke 未再复现删除节点 400。
- [x] reload 后仍能看到 toolbar 插入/删除/主题/结构/view 的已保存结果。
- 2026-05-11 验证:smoke 保存并校验 `04-after-reload.png`;输出 `toolbarActions.deleteOk=true``sidebarActions.themeOk=true``sidebarActions.layoutOk=true``viewScale=1.2`
- [x] 验证:`cd /mnt/Data1T/mnote/rust && cargo test -p core-protocol mindmap`
- 2026-05-11 通过:3 passed。
- [x] 验证:`cd /mnt/Data1T/mnote/rust && cargo test -p bridge-runtime mindmap`
- 2026-05-11 通过:14 passed。
- [x] 验证:`cd /mnt/Data1T/mnote/wolai-frontend && pnpm test -- mindmap-command-diff leptos-mindmap-adapter`
- 2026-05-11 通过:实际匹配全量 106 files416 tests passed。
### Task 11: KMind/lx-doc 视觉对齐
**Files:**
- Modify: `design/05-editor-mainline/reference-code/leptos-tiptap/tiptap/src/extensions/tiptap_paragraph.ts`
- Modify: relevant generated JS island file
- Modify: `wolai-frontend/src/lib/mindmap/mindmap-ui-schema.ts`
- Modify: `scripts/task166-mindmap-phase6-block-smoke.js`
- Reference Image: `tmp/image copy 60.png`
- Reference Image: `tmp/image copy 70.png`
- Current Evidence: `tmp/image copy 79.png`
- [x] 默认根节点、二级节点、分支节点、概要线的视觉结果接近 KMind/lx-doc,而不是只显示基础节点和错位连线。
- 2026-05-11 实现:真实 `simple-mind-map` runtime 负责节点、连线、概要线渲染;当前截图能看到根节点、二级节点、分支主题和概要括号线。剩余差异:默认主题色仍未完全等同 `image copy 60.png` 的红/蓝 KMind 配色,后续可继续细化 themeConfig。
- [x] toolbar、右侧触发器、底部栏呈现为编辑工作台 chrome,不占据画布主体。
- 2026-05-11 实现:Leptos/Rust shell 的 toolbar、sidebar、navigator、count 均为 floating overlay;新截图 `tmp/task166-mindmap-phase6-block-smoke/01-after-insert-floating-overlay.png` 显示 UI 浮在画布上,不再挤压 runtime。
- [x] 连线对齐节点中心或 runtime 默认锚点,无明显错位。
- 2026-05-11 验证:当前连线由 `simple-mind-map` runtime 生成;人工查看 `04-after-reload.png` 未见此前手写线条错位问题。
- [x] 画布初始视口能看到完整示例导图,不需要用户手动拖拽才能判断是否渲染成功。
- 2026-05-11 修复:`simple-mind-map-bridge.ts` 不再用固定 `fit:false` 覆盖 runtimeOptions;默认 `fit:true``01-after-insert-floating-overlay.png` 中示例导图完整可见。
- [x] 禁止用说明性大字、调试文案或状态卡片占据导图首屏。
- 2026-05-11 验证:默认首屏为真实 runtime + floating UIdebug fallback 仍需显式 debug flag。
- [x] 验证:人工对照 `image copy 60.png` / `image copy 70.png` / 当前 smoke 截图,记录剩余差异到 checklist 或 reference notes。
- 2026-05-11 对照:当前已具备无限画布底层、浮动 toolbar、右侧栏、底部 navigator、概要线和完整初始视口;剩余差异为图标体系、默认主题色、工具栏按钮分组密度和高级面板内容仍未完全复刻 lx-doc/KMind。
### Task 12: Browser Smoke 升级
**Files:**
- Modify: `scripts/task166-mindmap-phase6-block-smoke.js`
- Output: `tmp/task166-mindmap-phase6-block-smoke/result.json`
- Output: `tmp/task166-mindmap-phase6-block-smoke/*.png`
- [x] smoke 使用真实测试账号登录 `http://127.0.0.1:3000/`
- 2026-05-11 验证:`tree-shell-smoke-helpers.js` 使用 `mnote.e2e@example.com` / “测试账号快速登录”,本轮 smoke baseUrl 为 `http://127.0.0.1:3000`
- [x] smoke 插入或打开 mindmap block 后断言 `simple-mind-map` canvas/SVG 容器非零尺寸。
- 2026-05-11 验证:`assertMindmapReady()` 断言 `simple-mind-map-runtime`、runtime box、节点数和边数。
- [x] smoke 断言 toolbar、sidebar trigger、bottom navigator、context menu 入口存在。
- 2026-05-11 验证:smoke 断言 `mindmap-schema-toolbar``mindmap-schema-sidebar``mindmap-schema-navigator``mindmap-schema-count`,并打开节点/画布 context menu。
- [x] smoke 执行插入子节点、插入同级节点、删除节点、缩放、回根节点。
- 2026-05-11 验证:输出 `toolbarActions.insertChildOk/insertSiblingOk/deleteOk=true``navigatorActions.centerRootOk/zoomOk=true`
- [x] smoke 打开右侧栏的主题、结构、大纲 panel。
- 2026-05-11 验证:截图包含 `sidebar-theme.png``sidebar-structure.png``sidebar-outline.png`
- [x] smoke reload 后断言已编辑文本、节点数量、view state 至少一项保持。
- 2026-05-11 验证:reload 后断言编辑文本、节点数量、主题、结构、节点样式、导图样式;view scale 输出为 `1.2`
- [x] smoke 输出 `ok``documentId``mindmapId``nodeCount``edgeCount``toolbarActions``sidebarPanels``navigatorActions``contextMenuActions``screenshots`
- 2026-05-11 验证:`tmp/task166-mindmap-phase6-block-smoke/result.json` 输出 `ok=true``documentId``mindmapId``nodeCount=6``edgeCount=5``toolbarActions``sidebarActions``navigatorActions``contextMenuActions``screenshots`
- [x] smoke 失败时必须标出阶段:`projection_load_failed``adapter_init_failed``runtime_render_failed``ui_shell_missing``command_failed``reload_mismatch`
- 2026-05-11 实现:失败分支从 error message / error layer 归类 `failureStage`,并保存 `99-failure.png`
- [x] 验证:`node /mnt/Data1T/mnote/scripts/task166-mindmap-phase6-block-smoke.js`
- 2026-05-11 通过:`ok=true`,截图已刷新。
### Task 13: 旧实现边界收口
**Files:**
- Modify: `wolai-frontend/src/components/editor/blocks/MindmapBlock.tsx`
- Modify: `wolai-frontend/src/components/editor/blocks/MindmapToolbar.tsx`
- Modify: `wolai-frontend/src/components/editor/blocks/MindmapSidebar.tsx`
- Modify: `wolai-frontend/src/components/editor/blocks/MindmapNavigator.tsx`
- Modify: `wolai-frontend/src/components/editor/blocks/MindmapContextMenu.tsx`
- Modify: `wolai-frontend/src/components/editor/editor-host-config.test.ts`
- [x] 给旧 React mindmap 组件族补清晰注释:legacy/reference/compat,不是 3000 文档页默认主链。
- 2026-05-11 实现:`MindmapBlock.tsx``MindmapToolbar.tsx``MindmapSidebar.tsx``MindmapNavigator.tsx``MindmapContextMenu.tsx``MindmapMiniMap.tsx``MindmapCount.tsx``MindmapSidebarTrigger.tsx` 顶部均标注 legacy/reference/compat 边界。
- [x] 默认文档页 host 为 `leptos_tiptap_island` 时,不加载旧 React `MindmapBlock` 作为主编辑路径。
- 2026-05-11 验证:`editor-host-config.test.ts` 断言默认 host 为 `leptos_tiptap_island``blocknote`/旧 debug host 均折返 island。
- [x] 历史 toolbar/sidebar/navigator/context menu 只能作为 schema 抽取来源,不在运行时并行挂两套 UI。
- 2026-05-11 验证:smoke 断言默认不存在旧 `mindmap-command-toolbar``mindmap-sidebar``mindmap-bottom-bar` fallback。
- [x] 保留旧组件用于对照、独立迁移或回收,不在本任务中删除。
- 2026-05-11 处理:旧 React 组件族仍被独立导图页 `/mindmap/[docId]/[mindmapId]` 引用,暂不移动;已删除重复的 `wolai-frontend/src/app/dev/mindmap/page.tsx`,对应副本保留在 `recycle/wolai-frontend/src/app/dev/mindmap/page.tsx`
- [x] 静态测试禁止把 `.mnote-mindmap-react-mount``window.__mindmapInstance` 作为 Phase 6 成功条件。
- 2026-05-11 实现:`editor-host-config.test.ts` 新增 Phase 6 mindmap 成功选择器断言,成功条件限定为 `mnote-mindmap-editor-root``simple-mind-map-runtime``mindmap-rust-shell`
- [x] 验证:`cd /mnt/Data1T/mnote/wolai-frontend && pnpm test -- editor-host-config`
- 2026-05-11 通过:实际匹配全量 106 files418 tests passed。
### Task 14: 文档与执行记录
**Files:**
- Modify: `design/06-mindmap/process/6-mindmap-kernel-phase6-projection-editor-v1.md`
- Modify: `design/06-mindmap/process/6-mindmap-leptos-adapter-reference-notes-v1.md`
- Modify: `design/06-mindmap/process/6-mindmap-phase6-leptos-ui-shell-reuse-checklist-v1.md`
- Modify: `docs/superpowers/plans/2026-05-10-mindmap-phase6-projection-editor-checklist.md`
- [x] 在总设计稿中明确:UI shell reuse 是 `leptos-mindmap` 的 Phase 6 后续收口,不改变 kernel-first 主合同。
- 2026-05-11 更新:`6-mindmap-kernel-phase6-projection-editor-v1.md` 新增 `10.2 UI shell reuse 收口状态`,指向本 checklist。
- [x] 在 reference notes 中补历史 React UI 壳能力表。
- 2026-05-11 已完成:`6-mindmap-leptos-adapter-reference-notes-v1.md` 第 8 节覆盖 toolbar、sidebar、navigator/MiniMap/count、context menu。
- [x] 在旧执行 checklist 中补一条链接,说明后续 UI 可用度按本 checklist 继续。
- 2026-05-11 更新:`docs/superpowers/plans/2026-05-10-mindmap-phase6-projection-editor-checklist.md` 新增 `Task 13: UI Shell Reuse 后续收口`
- [x] 每完成一个 task,在本文件勾选对应节点,并附验证命令或截图路径。
- 2026-05-11 已按 Task 10-13 补充命令、截图和 result.json 证据。
- [x] 如果某项被后续实现废弃,移动到“暂不做项”并写明原因,不静默删除。
- 2026-05-11 当前没有静默删除项;context menu DOM 仍标记为 NodeView 过渡层,未误报为纯 Rust shell。
## 退出标准
- [x] 当前文档页 mindmap block 默认使用真实 `simple-mind-map` runtime,而不是手写 SVG/DOM 假导图。
- [x] toolbar、sidebar、navigator、context menu 都来自可复用 UI schema 或等价配置,不再散落为 NodeView 内硬编码按钮。
- [x] 第一阶段常用操作可用:插入子节点、插入同级节点、删除、编辑文本、缩放、回根、主题切换、结构切换、大纲查看。
- [x] 所有编辑动作都经过 kernel command 或 `compatPayload.patch`,不把整棵 runtime data 作为 canonical truth。
- [x] smoke 有插入后、操作后、打开侧栏后、打开右键菜单后、reload 后截图。
- [x] 人工对照 `tmp/image copy 60.png``tmp/image copy 70.png`,当前实现已经呈现为可用工作台,而不是“无头 runtime + 临时按钮”。
## 暂不做项
- [ ] 不直接把 lx-doc Vue2 应用作为 mnote 文档页内嵌主链。
- [ ] 不恢复旧 React `MindmapBlock.tsx` 为默认编辑器主链。
- [ ] 不在本阶段 Rust-native 重写 `simple-mind-map` layout / hit-test / renderer。
- [ ] 不在本阶段完整复刻 KMind 多根、MOC、思源块镜像、PDF 标注、全量导入导出、主题设计器。
- [ ] 不删除历史 React mindmap 文件;先作为迁移参考和 compat 资产保留。
- [ ] 旧 React `MindmapBlock.tsx` 组件族暂不移动到 recycle,直到 `/mindmap/[docId]/[mindmapId]` 独立页切到同一 `leptos-mindmap` adapter contract;当前只回收重复 dev 路由。