# 文档编辑器 - UI 交互规范

> **版本**: v1.0
> **最后更新**: 2026-01-15
> **维护者**: 前端团队

> **参考标准**: [设计系统（权威）](../../../.agents/skills/frontend-main/references/design-system-standards.md)

---

## ✅ 机器读取区（必填）

### 页面清单

| 页面 | 路由 | 说明 | 状态 |
|------|------|------|------|
| 嵌入式编辑器组件 | N/A | 业务页面内嵌组件 | ✅ |

### 元素清单（最小）

| 元素 | 选择器 | 类型 | 说明 |
|------|--------|------|------|
| 编辑器容器 | `.document-editor` | 容器 | 根容器 |
| 编辑区 | `.document-editor__prosemirror` | 编辑区 | ProseMirror 挂载点 |
| 工具栏容器 | `.document-editor__toolbar` | 容器 | 顶部工具栏（可选） |
| 字数统计 | `.document-editor__footer` | 文本 | 字数/词/段落统计 |

### 交互清单（最小）

| 交互 | 触发 | API | 结果 |
|------|------|-----|------|
| 内容编辑 | 用户输入 | `onChange` | 输出 ProseMirror JSON |
| 斜杠菜单 | 输入 `/` | 无 | 显示命令菜单并可插入块级结构 |
| 浮动工具栏 | 选中文本 | 无 | 展示格式化入口 |
| 链接编辑 | 触发链接入口 | 无 | 打开链接编辑器并更新链接 |
| 图片插入 | 触发上传 | `onUploadImage` | 上传成功后插入图片节点 |

### 国际化与文案规范

- 所有用户可见文案必须使用 i18n key，不允许硬编码
- 动态内容使用插值，不拼接字符串
- 日期/数字必须本地化格式化

---

## 🧭 人类阅读区（可选）

### 交互流程（示例）

- 进入业务页面 → 聚焦编辑器 → 输入内容 → 触发 `onChange` → 业务侧保存

### 异常处理

- 上传失败：由业务侧捕获并提示用户重试
- 内容校验失败：由业务侧决定校验规则与提示方式