Popover
A floating container that holds richer content than a menu — a mini form, a chart, a date range picker.
Canonical floating-surface primitive.
Per audit-reuse D-5, .popover is the single rich-content floating surface. Legacy .hover-card / .pop-card markup keeps working via deprecation aliases in components.css; new code uses .popover. For a list of actions instead of rich content, use Dropdown menu.
Default
Cash differences within this range close without supervisor sign-off.
With mini-form
Quick-edit a value without leaving the page.
Do & don't
Use a popover when the user is editing one related field. Reach for a sheet when there are three or more.
Put primary navigation in a popover. The user can’t come back to it.
Anchor to the trigger; flip placement on edge collisions.
Block the page with a popover. If the user can’t click outside, it’s a modal.