Components

Fab

Fab — a floating action button that pins the single most important action to the bottom-right of a view, then fans out into a speed-dial of related actions on focus or hover. Reach for it on task-focused screens (a reservation, a folio, a housekeeping board) where one action dominates — compose, add, check in — and a few supporting ones should stay one tap away without crowding the layout. Pass `icon` for the trigger glyph and `triggerLabel` for its accessible name; feed `actions` to reveal labelled buttons, and set `mainAction` when a primary affordance should slide into the trigger's place as the dial opens. The reveal is CSS-driven via `:focus-within`, so it is keyboard-reachable by default. Keep one Fab per view so the main action stays unmistakable.