Tag
fandhe-frontend-pre-styled-ui の tag mod が提供するスタイル済み Tag 部品です。
削除可能なラベル表示部品です。close_trigger(type="button")を組み合わせることで削除操作を持つ Tag を構成できますが、aria-label・視覚内容(×等)は呼び出し側が渡す責務です。削除操作を持たない単純なラベル表示には Badge を検討してください。
Demo
ラベル・分類・除去可能なチップ表示。variant / size / colorPalette を組み合わせます。close-trigger は data-action 属性の出力のみを担い、実際のクリック処理は wasm 層のスコープです。
SolidSubtleOutline
TagTagTag
AccentInfoSuccessWarningDanger
Removable
Features
- TagVariant(Solid/Subtle/Outline、crates/pre-styled-ui/src/tag.rs:34-58)で塗り方を切り替える
- close_trigger(<button type="button">)で削除可能な Tag を構成できる(tag.rs:238-262)
- close_trigger 自体は children/aria-label を持たないため呼び出し側が視覚内容とアクセシブルネームを渡す責務を持つ(tag.rs:231)
Anatomy
root
label
close-triggerAPI Reference
Arguments
| Name | Type | Default | Description |
|---|---|---|---|
| variant | TagVariant | Subtle | 塗り方(tag.rs:70-82)。 |
Data Attributes
| Part | Attribute | Observed Values |
|---|---|---|
| close-trigger | data-action | remove_tag |
Examples
Removable
close_trigger を付与した削除可能な Tag の例です。
betaAccessibility
WAI-ARIA
| Attribute | Description |
|---|---|
| (呼び出し側責務) | close_trigger の aria-label・視覚内容(×等)は呼び出し側が渡す責務であり、本部品自体は固有の ARIA を固定出力しない(tag.rs:231)。 |