第四轮 · 内容创作组件
视频号脚本 / 文章 / 商品描述的编辑工具。
本轮 5 个：① Editor（富文本编辑器）② MediaUploader（媒体上传）③ MarkdownRenderer（内容渲染）④ TagInput（标签输入）⑤ SplitPane（可拖拽分栏）
1Editor · 富文本编辑器
基于 TipTap（ProseMirror）。工具栏：加粗/斜体/标题/列表/链接/代码/引用。支持图片插入、Markdown 快捷输入。文章/脚本/描述编辑。
props: { value; onChange; toolbar?: string[]; maxLength?; placeholder?; onImageUpload? } | 基于 TipTap，可扩展自定义节点
2MediaUploader · 媒体上传
拖拽/点击上传，视频+图片+音频。进度条、预览缩略图、类型角标、删除。替换 ops-console 自造 VideoPlayer 上传逻辑。
props: { accept?: string; multiple?; maxCount?; maxSize?; value: File[]; onChange; onUpload } | 受控组件，上传逻辑由业务层注入
3MarkdownRenderer · 内容渲染
Markdown 渲染为格式化 HTML。支持标题/引用/列表/代码块/表格/链接/图片。用于知识库、审核规则、内容预览。
品牌内容规范
所有视频号内容须遵循：
- 真实优先，不夸大效果
- 产品标明
price_tag - 结尾须有 CTA
一致性比创意更重要。
| 渠道 | 时长 | 节奏 |
|---|---|---|
| 视频号 | 60s | 明快 |
| 公众号 | - | 沉稳 |
props: { content: string; className? } | 基于 remark/rehype，支持 GFM（表格/任务列表/删除线）
4TagInput · 标签输入
输入即生成标签，回车确认，可删除，支持建议（autocomplete）。内容分类、关键词、场景标签。
家居好物北欧
props: { value: string[]; onChange; suggestions?: string[]; placeholder?; maxTags?; allowCustom? }
5SplitPane · 可拖拽分栏
可拖拽调整左右栏宽度。编辑器/预览、文件树/编辑区、列表/详情双栏布局。
脚本列表
家居好物
美妆推荐
数码评测
家居好物推荐
本期推荐 3 款北欧风单品，聚焦实用性与设计感。
时长 60s，节奏明快，配轻快 BGM。
props: { children: [left, right]; defaultSize?; minSize?; maxSize?; direction?: 'horizontal'|'vertical'; onResize? }