Menubar

複数の Menu を水平（または垂直）に並べたアプリケーションメニューバーです。fandhe-frontend-headless-ui の menubar mod が構造・アクセシビリティ（WAI-ARIA・キーボード操作）・表示状態（data-*）のみを提供する unstyled 部品であり、Themes 版と異なりスタイル（CSS）は一切持ちません。開いている Menu を跨いだ左右移動の状態遷移 API（MenubarAction）を持ちますが、実 DOM のキー配線は wasm ランタイム層の責務です。

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

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

Demo

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

Features

複数 Menu を水平（または垂直）に並べるコンテナ。Root / Menu / Trigger / Positioner / Content / Item / ItemGroup / ItemGroupLabel / Separator / SubTrigger / SubContent の 11 anatomy パーツを持つ（menubar.rs モジュール doc）。
roving tabindex（focused/trigger_count/open/loop_focus/orientation の複合状態機械 Menubar）。フォーカス対象のトリガーのみ tabindex="0"、それ以外は tabindex="-1" になる。
開いている Menu を跨いだ左右移動: ある Menu が開いた状態で Next/Prev/First/Last/Focus を dispatch すると、フォーカス移動と同時に開く Menu も隣へ移る（menubar 特有の挙動、toolbar の roving tabindex にはない）。
menu パーツは role="none" を固定付与し、role="menubar" の子として menuitem/group 以外の要素を挟まないようにする（WAI-ARIA APG の menubar パターン）。
既存の menu モジュールの anatomy はそのまま再利用せず data-scope="menubar" を独自に持つ。状態機械の値語彙（OpenState/aria/data-* ヘルパ）のみを再利用する。

Anatomy

root
  menu
    trigger
    positioner
      content
        item-group
          item-group-label
          item
        separator

API Reference

Arguments

Name	Type	Default	Description
root(orientation)	Orientation	Orientation::Horizontal	role="menubar" に付与する向き。aria-orientation/data-orientation の両方へ反映される。
root(label)	&str		root に付与する aria-label（空文字列のときは省略）。
trigger(focused)	bool		true のとき tabindex="0"、false のとき tabindex="-1"（roving tabindex）。
trigger(state)	OpenState		この Menu 自身の開閉状態。aria-expanded/data-state へ反映される。

Data Attributes

Part	Attribute	Observed Values
content	data-state	open
item	data-value	new
menu	data-state	open
positioner	data-state	open
root	data-orientation	horizontal
trigger	data-state	open
trigger	data-value	0

Examples

File（open）/ Edit（closed）の 2 つの Menu を並べ、複数 Menu をまたぐ roving tabindex の構造を示します。

Accessibility

Keyboard Interactions

Key	Description
Tab / Shift+Tab	ネイティブ button 要素の暗黙フォーカス移動（roving tabindex により tabindex="0" のトリガーのみが Tab 順序に含まれる）。
(矢印キー等)	ArrowRight/Left・Home/End・Enter/Space・Escape 等のキーイベント配線は headless-ui の対象外。MenubarAction（Next/Prev/First/Last/Focus/Open/Close/Toggle）として状態遷移 API を提供し、実 DOM のキー配線は wasm ランタイム層の責務とする（menubar.rs「スコープ外」節）。

WAI-ARIA

Attribute	Description
role="menubar" / aria-orientation	root に固定付与。orientation 引数の値を反映する。
role="none"	menu に固定付与（menubar の子として menuitem/group 以外を挟まないための WAI-ARIA APG 慣行）。
role="menuitem" / aria-haspopup="menu" / aria-expanded	trigger/sub-trigger に付与。開閉状態（この Menu の state、もしくはサブメニューの sub_state）を反映する。
role="menu"	content/sub-content に固定付与。aria-labelledby は labelledby が Some のときのみ出力される。