Action Bar

複数選択（チェックボックス等）に対する一括操作を提示する画面下部固定の操作バーです。fandhe-frontend-headless-ui の action_bar mod が構造・アクセシビリティ（WAI-ARIA・キーボード操作）・表示状態（data-*）のみを提供する unstyled 部品であり、Themes 版と異なりスタイル（CSS）は一切持ちません。開閉状態は Disclosure を埋め込んだ状態機械が管理しますが、「選択操作から開閉状態を決定する」判断自体は呼び出し側アプリケーションの責務です。

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

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

Demo

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

Features

複数選択操作バー（chakra-ui ActionBar 相当）。Root / Positioner / Content / SelectionTrigger / Separator / CloseTrigger の 6 anatomy パーツを持つ（action_bar.rs モジュール doc）。
開閉は Disclosure を埋め込んだ状態機械 ActionBar が管理する。選択件数から open を自動導出する糖衣 API は持たず、「選択操作 → 開閉状態の決定」は呼び出し側の責務とする（action_bar.rs「選択件数から open を導出する糖衣 API は持たない」節）。
content に role="toolbar" と aria-label（読み上げ用ラベル、呼び出し側が指定する必須引数）を固定付与する（content 関数）。
closed のとき positioner/content の双方に hidden 存在属性を付与し、SSR/no-JS でも閉状態を表現する（positioner/content 関数）。

Anatomy

root
  positioner
    content
      selection-trigger
      separator
      close-trigger

API Reference

Arguments

Name	Type	Description
root(state)	OpenState	開閉状態（Open/Closed）。data-state へ反映される。
content(label)	&str	role="toolbar" の aria-label（選択操作バーの読み上げ名、必須引数）。
selection_trigger	fn	type="button" を固定付与するボタンパーツ。選択件数テキストは呼び出し側が children で渡す。

Data Attributes

Part	Attribute	Observed Values
content	data-state	open
positioner	data-state	open
root	data-state	open

Examples

CloseTrigger のみの最小構成

SelectionTrigger/Separator を省き、Content 直下に CloseTrigger だけを配置した例です。

Accessibility

WAI-ARIA

Attribute	Description
role="toolbar"	content に固定付与。aria-label とセットで出力される。
role="separator" / aria-orientation="vertical"	separator に固定付与（ActionBar のボタン列は横並びのため区切り線は縦向きになる）。