SegGroup 分段選擇
少量互斥選項，一眼看完、一下點完。
在 Storybook 開啟何時用、何時不要用
✅ 這樣做
選項 2–5 個、標籤短、清單固定。
🚫 不要這樣
選項超過 5 個、標籤長、或會動態增減 → 用 Select。 分段列一旦換行就失去「一眼看完」的優勢，反而比下拉更亂。
狀態
已改動未送出
鎖定（可聚焦，hover 有原因）
無障礙：這才是重點
role="radiogroup"＋ 每項role="radio"aria-checked- Roving tabindex：整組只佔一個 Tab 停留點。四個選項各佔一個停留點， 對鍵盤使用者是災難——他要按四次 Tab 才能離開一個欄位。
- 方向鍵在選項間移動、Space/Enter 選定、Esc 取消
- 選中項同時打勾與填色，不只靠顏色
取用
npx shadcn@latest add https://kielchang.github.io/dooping-design-book/r/seg-group.json