会话时序图 <SessionSequence />

2–3 个会话各占一列，事件按时间从上往下排，左侧标 t1、t2…；等待用虚线框，最终结果用强调色。

Template and style descriptions are currently available in Chinese only.

See it in the demo deck →

Group: 技术 · 并发 · 谁先谁后
Component: SessionSequence · #session-sequence
Interaction: build 模式下每按一次 → 出现下一个事件

Good for

讲事务隔离、锁等待、竞态
讲两三方之间的调用先后

Avoid when

事件超过 7 个
只有一方：用 StepTrack 或 Timeline
要讲跨部门流程：用 Swimlane

Content limits

1	lanes 2–3 个，每个 ≤ 10 字
2	events 3–7 个：text ≤ 30 个字符，note ≤ 12 字
3	axis ≤ 4 字

Fields

Field	Type
`kicker` · required	`string`	标题上方的小节名，2–8 字
`title` · required	`string \| string[]`	页面标题；传数组可手动断行，每项一行
`lead`	`string`	一到两句导语，≤ 60 字
`source`	`string`	事实出处；页面上有任何数据或事实时必填
`hint`	`ReactNode`	页眉中间的操作提示，可用 <kbd>
`lanes` · required	`string[]`	会话名
`events` · required	`{ lane, text, note?, kind?: 'wait' \| 'ok' }[]`	按时间排序的事件
`axis`	`string`	时间轴标签，默认“时间”

Example

<SessionSequence kicker="隔离" title="…" lanes={['会话 A', '会话 B']} events={[{ lane: 0, text: 'BEGIN;' }, { lane: 1, text: 'UPDATE …', note: '等待 A', kind: 'wait' }, …]} />