ドロップダウンメニュー

StimulusとTailwind CSSで構築された完全にアクセシブルなドロップダウンメニューコンポーネント。 カスタムトリガー、メニューヘッダー、区切り線、アイコン、破壊的アクションに対応しています。 スムーズなスケール+フェードアニメーションと完全なキーボードナビゲーションを備えています。

プレビュー & コード

オプション

名前 デフォルト 説明
label String Text label for the trigger button (optional if using custom trigger block)
position Symbol :bottom_right Menu position: :bottom_right, :bottom_left, :top_right, :top_left
header Hash Header with :title and optional :subtitle keys
items * Array 必須 Array of item hashes with :label, :href, :icon, :method, :destructive keys. Use { type: :divider } for separators.

変更履歴 v2.0.0

- v2.0.0: Major expansion with custom triggers, headers, dividers, icons, animations
- v1.1.0: Added ViewComponent format support
- v1.0.0: Initial release with full keyboard support

フルアクセスを取得

このコンポーネントと他のすべてのソースコードをアンロックしましょう。一回のお支払いで永久アクセス。

今すぐアクセスを取得