上下文窗口 <ContextWindow />

一条很长的容量条加刻度，几段长度从左边起逐步填进来（例如训练长度、最大输出、窗口上限），下方每段一个大数字和说明。

分组: AI · 容量与长度标记
组件: ContextWindow · #context-window
交互: 每按一次 → 填入一段长度

适合

介绍上下文长度、最大输出、训练长度这些“从 0 起算”的长度
比较几种长度相差多少倍

不适合

长度之间是并列而不是包含关系：用 BarChart
超过 4 段

内容上限

1	spans 1–4 段，label ≤ 8 个字符，note ≤ 20 字
2	ticks 3–6 个，label ≤ 6 个字符
3	totalLabel ≤ 8 个字符

字段

字段	类型
`kicker` · 必填	`string`	标题上方的小节名，2–8 字
`title` · 必填	`string \| string[]`	页面标题；传数组可手动断行，每项一行
`lead`	`string`	一到两句导语，≤ 60 字
`source`	`string`	事实出处；页面上有任何数据或事实时必填
`hint`	`ReactNode`	页眉中间的操作提示，可用 <kbd>
`total` · 必填	`number`	窗口容量（与 spans 同单位）
`totalLabel` · 必填	`string`	容量的大字标注
`ticks` · 必填	`{ value, label }[]`	刻度
`spans` · 必填	`{ value, label, note }[]`	从 0 起的长度段，每段一个 build 步骤

示例代码

<ContextWindow kicker="上下文" title="1M 窗口" total={1000} totalLabel="1M tokens" ticks={[{ value: 0, label: '0' }, { value: 1000, label: '1M' }]} spans={[{ value: 384, label: '384K', note: '单次最大输出' }]} />