Toolbar

ボタン・リンク・ToggleGroup を横方向（または縦方向）にグループ化する操作バーです。fandhe-frontend-headless-ui の toolbar mod が構造・アクセシビリティ（WAI-ARIA・キーボード操作）・表示状態（data-*）のみを提供する unstyled 部品であり、Themes 版と異なりスタイル（CSS）は一切持ちません。roving tabindex により disabled 項目もフォーカス順序から除外しない WAI-ARIA APG 準拠の設計です。

スタイル済みの表示例は Toolbar を参照してください。

関連 API: fandhe-frontend-headless-ui API

Demo

枠線・余白は docs サイト側のデモ枠であり、fandhe-frontend-headless-ui 自体はスタイルを持ちません。

Features

ボタン・リンク・セパレータ・ToggleGroup を横方向（または縦方向）にグループ化する操作バー。Root / Button / Link / Separator / ToggleGroup / ToggleItem の 6 anatomy パーツを持つ（toolbar.rs モジュール doc）。
roving tabindex（focused/item_count/loop_focus/orientation の複合状態機械 Toolbar）。フォーカス対象の項目のみ tabindex="0"、それ以外は tabindex="-1" になる。
disabled 項目もフォーカス順序から除外しない（WAI-ARIA APG の toolbar パターン推奨に従う意図的な設計。aria-disabled/data-disabled で操作不能のみを表す）。
link パーツは既存の link::root へ完全委譲し、external 時の target="_blank"/rel="noopener noreferrer" の不可分付与ロジックを再導出しない。
separator は toolbar 自身の向きと直交する aria-orientation を出力する（横向き toolbar のセパレータは縦線になる）。

Anatomy

root
  button
  link
  separator
  toggle-group
    toggle-item

API Reference

Arguments

Name	Type	Default	Description
root(orientation)	Orientation	Orientation::Horizontal	role="toolbar" に付与する向き。aria-orientation/data-orientation の両方へ反映される。
root(label)	&str		root に付与する aria-label（空文字列のときは省略）。
button(focused)	bool		true のとき tabindex="0"、false のとき tabindex="-1"（roving tabindex）。button/link/toggle_item 共通の引数。
toggle_item(pressed)	bool		aria-pressed/data-state（pressed_data_state 経由）へ反映される押下状態。

Data Attributes

Part	Attribute	Observed Values
root	data-orientation	horizontal
toggle-item	data-pressed
toggle-item	data-state	on
toggle-item	data-value	align-left

Examples

Vertical orientation の構成

縦方向の Toolbar で Separator の aria-orientation が水平（直交）に切り替わる例です。

Accessibility

Keyboard Interactions

Key	Description
Tab / Shift+Tab	ネイティブ button/a 要素の暗黙フォーカス移動（roving tabindex により tabindex="0" の項目のみが Tab 順序に含まれる）。
(矢印キー等)	項目間移動のキーイベント配線は headless-ui の対象外。ToolbarAction（Next/Prev/First/Last/Focus）として状態遷移 API を提供し、実 DOM のキー配線は wasm ランタイム層の責務とする（toolbar.rs モジュール doc「呼び出し文脈」節）。

WAI-ARIA

Attribute	Description
role="toolbar" / aria-orientation	root に固定付与。orientation 引数の値を反映する。
role="separator" / aria-orientation	separator に固定付与。toolbar 自身の向きと直交する値になる。
role="group"	toggle-group に固定付与（aria-orientation は role="group" に許可されないため付与しない）。
aria-pressed	toggle-item に付与。押下状態（true/false）を表す。