Skip to content
fandhe-frontendcore v0.4.3
GitHub

Menu

fandhe-frontend-wireframe-ui のドロップダウン風メニューのプレースホルダーです。検索欄(任意)と、有効・無効が混在する項目リストからなるパネルの配置イメージを示します。API は menu(items, active, search, size) の 4 引数(詳細は下の引数表を参照)で、項目は MenuItem::new/MenuItem::disabled で構築します。

視覚的な参照元は blocks.pm の Menu 部品ですが、ライセンス上の理由によりスクリーンショットは掲載していません(詳細は docs/design/wireframe-ui-architecture.md §2)。参照したい場合は外部リンク先を直接確認してください。

本部品は表示専用のため、role="menu"/menuitem・開閉・キーボードナビゲーションは実装しません。実際に操作できるメニューが必要な場合は Menu(Themes)・Menu(Primitives) を検討してください。

Demo

検索あり + 先頭項目を強調

検索...
プロフィール
設定
請求情報

検索なし

プロフィール
設定
請求情報

強調なし

検索...
プロフィール
設定
請求情報

無効項目を指す active(強調は付与されない)

プロフィール
設定
請求情報

Sm

検索...
プロフィール
設定
請求情報

Lg

検索...
プロフィール
設定
請求情報

引数表

引数型既定値説明
items&[MenuItem<'_>]-メニュー項目のスライス。MenuItem::new/MenuItem::disabled で構築する。
activeOption<usize>None強調(選択中)項目の添字。範囲外・無効項目を指す値は付与しない。
searchOption<&str>None省略可能な検索欄プレースホルダー文言。Some のときのみ検索行を出力する。
sizeSizeSize::Mdサイズ段階(xs〜xl)。

原案差分メモ

  • API は独自設計: docs/design/wireframe-ui-architecture.md §6 と既存部品(tabs の active: Option<usize>、nav_item の Option<&str> 内部パート、select の固定パートによる指示子)から独立設計しました。同文書 §2 の保留(イシュー #2602)に従い、blocks.pm の Option1〜Option5 個別 bool+text スロット構成は参照・書き写していません。
  • 項目はスライスへ畳む: 固定 5 スロットの bool+text ではなく、公開の MenuItem 構造体(ラベル + 無効状態)のスライス items: &[MenuItem] で受けています。項目数に上限は設けていません。
  • 強調状態は Option<usize>、無効項目を優先: tabs と同じく「強調中は高々 1 件」を型で保証します。active が無効項目を指している場合は強調を付与しません(決定的で見た目の矛盾を避けるため)。範囲外の添字・None も同様に安全側へ倒します。
  • 検索欄は Option<&str> + 固定アイコン: bool ではなく検索行のプレースホルダー文言を持つ内部パートとしました。先頭には常に固定パートの icon::search を出力し、アイコンスロットにはしていません(select のドロップダウン指示子と同じ判断: 利用者が省略・差し替えできない部品の同一性を担う要素のため)。<input> は出力しません。
  • アイコンスロットは非採用: docs/design/wireframe-ui-architecture.md §11.4 は Menu をこの規約の適用先の例に挙げていますが、本イシューでは項目ごとのアイコン差し替えを対応範囲外としました。将来必要になった場合は別イシューで検討します。
  • Orientation/Bold/Primary/全体の Disabled は持たない: イシューの要求範囲外です。
  • スクリーンショット非掲載: docs/design/reference-screenshots/ への blocks.pm 画像取り込みは #2602 で fail-closed に非掲載と確定しています。本ページも画像は置かず、上記の外部リンクのみで代替します。
  • 非インタラクティブ: role="menu"/aria-expanded/aria-haspopup・tabindex・実際の開閉は一切出力しません(同文書 §7 の非対話制約)。