Status
fandhe-frontend-pre-styled-ui の status mod が提供するスタイル済み Status 部品です。
オンライン/オフライン等の状態を示す最小部品です。colorPalette 軸でセマンティック色を選択でき、root/indicator の 2 パーツのみで構成します。role="status" は付与しない設計で、非同期の状態遷移を伴う場合は呼び出し側が明示的に role/aria-live を足す契約です。
Demo
ドット(indicator)+ ラベルで状態を示す静的表示。colorPalette で色を切り替えます。
AccentInfoSuccessWarningDanger
Features
- colorPalette 軸(crates/pre-styled-ui/src/status.rs:77-81)でセマンティック色を選択する
- root/indicator の 2 パーツのみで構成する最小部品
- role="status"(WAI-ARIA live region)は付与しない設計(status.rs:9-12、非同期の状態遷移がある場合は呼び出し側が明示的に足す)
Anatomy
root
indicatorAPI Reference
Arguments
| Name | Type | Default | Description |
|---|---|---|---|
| palette | ColorPalette | Accent | colorPalette 軸(status.rs:77-90)。 |
CSS Variables
| Variable | Default |
|---|---|
| --fandhe-status-dot-size | 0.5rem |
Examples
Success
Success パレットで "Online" を表示する例です。
OnlineAccessibility
WAI-ARIA
| Attribute | Description |
|---|---|
| (該当なし) | role="status" は付与しない設計。非同期の状態遷移を伴う場合は呼び出し側が明示的に role/aria-live を足す契約(status.rs:9-12、テストで role= の非出現を固定)。 |