Components / Text Outputs
Inline Citations
行内引用：正文 [n] 角标（hover 玻璃 tooltip）+ 底部来源列表。仅入库不接入，已移植（1:1 aicss.dev）。
① 活体演示
角标 hover 出 tooltip，来源行 hover 出跳转箭头（真实可点，外链到来源）。四态：running（与 ok 同貌）/ ok / error / empty。
empty 态：组件不渲染（无引用数据）
② 对比台
左：wb-ui 活体（上游演示数据）；右：aicss.dev 原站截图存档（2026-08-13 采集，可滚动）。
wb-ui 活体
aicss.dev 原站截图（design/reference/aicss/inline-citations/screenshot.png）
③ 真实字段说明
无真实事件，仅入库不接入（契约 3.C.1 / 要素 4.4）：run event 里没有引用（citation）类事件（字段真源 packages/contracts/workbench-events.mjs:11-77，9 个 type 均无结构化来源字段）。日后可能的数据来源：runner 若透传联网搜索的结构化引用（如 claude 的 citations 块），另立需求接真字段后再进对话时间线。
| 数据源 | 形态 | 说明 |
|---|---|---|
| （现状） | — | 无引用类 run event，不接入 workbench |
| （日后）runner citations 透传 | [{n, label, host, url}] | 另立需求；本组件 API 已按此形态设计 |
④ 用在 workbench 哪个位置
暂不接入。若日后接真字段，候选位置是 renderAssistantAnswer(:4857) 正文尾部的来源区；在此之前仅作为库组件存档与展示。
⑤ 复制即用代码
引入 tokens + 组件 CSS/JS。全部相对路径、零依赖。
<link rel="stylesheet" href="design/wb-ui/lib/tokens.css"> <link rel="stylesheet" href="design/wb-ui/lib/components/inline-citations.css"> <script src="design/wb-ui/lib/components/inline-citations.js"></script>
WbUI.inlineCitations.render(el, {
text: "Transformers scale well with data and compute[1].",
refs: [{ n: 1, label: "Attention Is All You Need", host: "arxiv.org", url: "https://…" }]
});
Ported from aicss.dev/components/inline-citations, fetched 2026-08-13. Internal use only（上游无 license 声明，对外使用前须确认授权——docs/86 R1）。