階梯層級 <StackBars />
3–6 條橫條從上到下逐層向右錯開，顏色從主題色逐漸變深，每條左邊名稱、右邊一句說明。為號外風格設計，其他風格也能用。配 build: 'reveal' 逐層出現。
- 分組
- 結構 · 一層層錯開的橫條
- 元件
StackBars·#stack-bars- 互動
- 按 → 逐層出現
適合
- 分層結構：技術棧、組織層級、優先順序
- 上層依賴下層的關係
不適合
- 層與層之間有數量關係：用 Funnel 或 Pyramid
- 每層要詳細說明：用 LayerStack
內容上限
| 1 | layers 3–6 層，從上到下 |
| 2 | name ≤ 8 字 |
| 3 | note ≤ 20 字 |
| 4 | 頁標題 ≤ 22 字 |
欄位
| 欄位 | 型別 | |
|---|---|---|
kicker · 必填 | string | 小節名 |
title · 必填 | string | string[] | 標題 |
lead | string | 導語 |
layers · 必填 | { name, note }[] | 層，從上到下 |
source | string | 出處 |
範例程式碼
<StackBars
kicker="分層"
title="一份簡報由五層疊成"
layers={[{ name: '內容', note: 'src/decks 裡的 deck 檔案' }, …]}
/>