Claude-Code-Workflow/.claude/skills/text-formatter/specs/element-mapping.md

Element Mapping

内容元素到 BBCode + Markdown 混合格式的映射表。

When to Use

Phase	Usage	Section
Phase 2	元素识别	Detection patterns
Phase 3	格式转换	Conversion rules

---

Element Detection Patterns

标题检测

类型	Pattern	示例
ATX 标题	/^#{1,6}\s+(.+)$/	# Title, ## Subtitle
Setext H1	/^(.+)\n={3,}$/	Title\n====
Setext H2	/^(.+)\n-{3,}$/	Subtitle\n----

列表检测

类型	Pattern	示例
无序列表	/^[\s]*[-*+]\s+(.+)$/	- item, * item
有序列表	/^[\s]*\d+\.\s+(.+)$/	1. item, 2. item
任务列表	/^[\s]*[-*]\s+\[([ x])\]\s+(.+)$/	- [ ] todo, - [x] done

Callout 检测

类型	Pattern	示例
Callout 开始	/^>\s*\[!(\w+)\](?:\s+(.+))?$/	> [!NOTE] 标题
Callout 内容	/^>\s*(.*)$/	> 内容行
可折叠展开	/^>\s*\[!(\w+)\]\+/	> [!NOTE]+
可折叠收起	/^>\s*\[!(\w+)\]-/	> [!NOTE]-

代码检测

类型	Pattern	示例
代码块开始	/^```(\w*)$/	```js
代码块结束	/^```$/	```
行内代码	/([^]+)/`	`code`

其他元素

类型	Pattern	示例
链接	/\[([^\]]+)\]\(([^)]+)\)/	[text](url)
图片	/!\[([^\]]*)\]\(([^)]+)\)/	
普通引用	/^>\s+(.+)$/	> quote
分隔线	/^[-*_]{3,}$/	---, ***
高亮	/==(.+?)==/	==highlight==
粗体	/\*\*(.+?)\*\*/	**bold**
斜体	/\*(.+?)\*/	*italic*
删除线	/~~(.+?)~~/	~~strike~~

---

Element Conversion Matrix

标题映射 (Pixel-Based)

Element	Markdown	BBCode Output
H1	# text	[size=150][color=#2196F3][b]text[/b][/color][/size]
H2	## text	[size=120][color=#2196F3][b]text[/b][/color][/size]
H3	### text	[size=100][color=#333][b]text[/b][/color][/size]
H4	#### text	[b]text[/b]
H5	##### text	[b]text[/b]
H6	###### text	[b]text[/b]

文本样式映射

Element	Markdown	BBCode
Bold	**text**	[b]text[/b]
Italic	*text*	[i]text[/i]
Bold+Italic	***text***	[b][i]text[/i][/b]
Strike	~~text~~	[s]text[/s]
Highlight	==text==	[color=yellow]text[/color]
Code (inline)	`text`	保持原样

块级元素映射

Element	Markdown	BBCode
Code Block	```lang\ncode\n```	[code]code[/code]
Quote	> text	[quote]text[/quote]
HR	---	--- (保持 Markdown)
List Item	- text	• text
Paragraph	text\n\ntext	text\n\ntext

链接和媒体映射

Element	Markdown	BBCode
Link	[text](url)	[url=url]text[/url]
Image		[img]url[/img]

---

Callout Mapping

类型到样式映射

Callout Type	Color	Icon	Label
note	#2196F3	📝	注意
info	#2196F3	ℹ️	信息
tip	#4CAF50	💡	提示
hint	#4CAF50	💡	提示
success	#4CAF50	✅	成功
check	#4CAF50	✅	完成
done	#4CAF50	✅	完成
warning	#FF9800	⚠️	警告
caution	#FF9800	⚠️	注意
attention	#FF9800	⚠️	注意
danger	#F44336	❌	危险
error	#F44336	❌	错误
bug	#F44336	🐛	Bug
example	#9C27B0	📋	示例
question	#FF9800	❓	问题
help	#FF9800	❓	帮助
faq	#FF9800	❓	FAQ
quote	gray	💬	引用
cite	gray	💬	引用
abstract	#2196F3	📄	摘要
summary	#2196F3	📄	摘要
tldr	#2196F3	📄	摘要
todo	#FF9800	📋	待办
important	#F44336	⭐	重要

Callout 输出模板

[quote]
[size=100][color={color}][b]{icon} {title}[/b][/color][/size]

{content}
[/quote]

---

Unsupported Elements

不支持转换的元素

元素	原因	降级方案
表格	BBCode 表格支持有限	转为代码块或列表
脚注	不支持	转为括号注释 (注: ...)
数学公式	不支持	保留原始文本
嵌入内容	不支持	转为链接
任务列表	复选框不支持	转为普通列表 ☐/☑

降级示例

表格:

| A | B |
|---|---|
| 1 | 2 |

→ 降级为:

A: 1
B: 2

脚注:

文本[^1]

[^1]: 脚注内容

→ 降级为:

文本 (注: 脚注内容)

任务列表:

- [ ] 待办
- [x] 已完成

→ 降级为:

☐ 待办
☑ 已完成

---

Validation Rules

转换验证

• 所有 H1-H3 使用像素值 size (150/120/100)
• 未使用 [align] 标签
• 未使用 [hr] 标签
• 分隔线保持 ---
• Callout 正确识别并转换
• 颜色值使用 hex 格式