Document the VSCode-like local-first product shape, demote Convex to a control-plane role, and retire stale architecture drafts. Add local workspace migration/export references plus smoke coverage for no-Convex managed workspace startup, local markdown title/body/options persistence, asset upload behavior, and Convex fixture export. Verification: git diff --cached --check; node scripts/check-local-first-convex-guard.js --staged; node scripts/task444-convex-workspace-export-local-fixture-smoke.js; node scripts/task166-local-first-managed-workspace-no-convex-smoke.js; node scripts/task167-local-markdown-title-body-options-no-convex-smoke.js
4.1 KiB
4.1 KiB
基本编辑能力
来源:https://www.wolai.com/wolai/qN1Bh9YjLAXs8bxCJoAJ6C 用途:mnote 编辑器基础交互行为参考
实现状态:大部分已实现 ✅ 11/18 🔧 3/18 ❌ 4/18
实现对照
核心概念
wolai 的编辑能力基于**块编辑器(Block Editor)**模式而非传统的富文本编辑器。
一段文本、一个列表项、一个图片、一个文件等,都被称为"块"。不同的块承担不同的角色,组合在一起组成一篇文章或一个主页。
功能清单
块操作
| 操作 | 说明 |
|---|---|
| 拖动块 | 所有块可通过左侧 :: 图标拖动,拖动时出现辅助线指示位置。拖到另一个块的左/右侧可形成分栏结构 |
| 选中块 | 光标输入状态按 Esc 选中当前块;上下方向键切换选中块;Shift+上下 多选块 |
| 块选中后 Enter | 回到光标编辑状态 |
| 块选中后 Ctrl+A | 第一次选中当前块全部文本,第二次选中所有块 |
| 在上方/下方插入块 | 鼠标悬停 :: 上方/下方点击 +;或 Esc 选中块后按 a(上方)/ b(下方) |
| 块布局显示 | Ctrl+Shift+U 显示/隐藏所有块的虚线框布局 |
分栏
将一个块拖到另一个块的左边或右边,拖拽辅助线从横线变竖线时放开,即可实现分栏。分栏的块可继续拖动调整位置关系。
块转换
所有文本类块可互相转换:文本↔标题、待办列表↔数字列表、引述文字↔代码片段。文本类块转换为页面时,缩进结构变为页面内容。
三种转换方式:
- 块菜单:点击
::→ 转换为 → 选择类型 - 快捷键:平台特定快捷键
- 快捷命令菜单:按
/→ 选择"转换为xxx",或输入/zh + 块名拼音首字母(如/zhlb转换为列表)
复制/粘贴
Ctrl+C / Ctrl+V标准复制粘贴Ctrl+Shift+V粘贴并匹配样式
缩进/取消缩进
Tab缩进(成为上一个块的子元素)Shift+Tab取消缩进
文本样式
选中文字后出现文本样式工具条,支持:粗体、斜体、下划线、删除线、行内代码、行内数学公式、文字颜色/背景颜色。
超链接
Ctrl+K创建超链接- 选中文字后直接粘贴 URL 可快速创建超链接
在页面中添加更多块
- 键入
/唤起快捷命令菜单选择块类型 - 点击空行前面的
+图标选择创建块类型
mnote 实现状态
✅ 已实现
| 功能 | 证据 |
|---|---|
| 块概念(Block Editor 模式) | EditorBlockType 枚举定义 14 种块类型(core-protocol/src/editor/model.rs:7) |
| 文本输入/换行/方向键 | leptos-tiptap island(rust/spikes/leptos-tiptap-spike/src/lib.rs) |
拖动块(:: 手柄) |
HANDLE_SHELL_SELECTOR 常量,拖拽事件处理(lib.rs:45-47) |
| 选中块(Esc / 方向键 / Shift 多选) | TiptapSelectionState 选择状态管理 |
| 上方/下方插入块(a / b 快捷键) | 块手柄菜单中的插入操作 |
| 块转换(文本↔标题↔列表等) | EditorCommand 中的 ReplaceBlock 命令(editor/command.rs:22-26) |
| 复制/粘贴(含匹配样式) | write_mnote_text_to_clipboard 剪贴板操作 |
| 缩进/取消缩进(Tab/Shift+Tab) | Tiptap 原生 indent/outdent |
| 文本样式工具条(粗体/斜体/下划线/删除线/行内代码) | TextMark::{Bold, Italic, Underline, Strike, Code}(editor/model.rs:33-39) |
| 超链接(Ctrl+K) | TiptapLinkResource + TiptapMarkName::Link |
| 行内数学公式 | TiptapExtension 中包含数学公式扩展 |
| 选中文字颜色/背景色 | TiptapColorAttributes / TiptapHighlightAttributes |
❌ / 🔧 未实现/待完善
| 功能 | 状态 | 说明 |
|---|---|---|
| 分栏 | ❌ | columnsLayout Tiptap 扩展未注册 |
| 块布局显示(Ctrl+Shift+U) | ❌ | 无对应功能 |
| 选中文字→页面引用 | 🔧 | PageReference 类型存在但快捷创建交互未实现 |
| 脚注与注释 | ❌ | 无脚注/注释 Tiptap 扩展 |