Inline dialog

popover-ui card-ui field-ui button-ui

Anchored, non-modal dialog — popover-ui content given dialog semantics (heading + body + actions). Atlassian-style affordance for in-context decisions that don't warrant blocking the page. Distinct from modal-ui (page-blocking, focus-trapped, role=dialog) and popover-ui bare (general anchored surface).

When to use

Confirm-in-context micro-decisions: rename a row, set a status, pick a label, schedule a thing. The decision belongs here (anchored to the trigger), not over there (centered modal). Three signals it's the right pattern: the action is reversible, the user must still see the surrounding context, and the form is one to three fields. Anything bigger goes in a drawer or modal; anything smaller is a menu-ui or inline edit.

Rename in context

Click "Rename" → popover-ui opens anchored to the trigger, carrying a card-ui with a heading, single input, and Cancel + Save actions. The rest of the page stays interactive (no backdrop, no focus trap). Click outside or press Escape to dismiss.

Q4-budget-draft.xlsx
Rename file

Set status

Status-picker pattern: trigger shows the current state, popover carries a select + a short note field. Closes on save; the trigger updates to reflect the new state.

PR #3247 — Add cursor pagination In review
Change status

Schedule send

Two-field scheduling popover anchored to a split-button (primary action + caret for alternatives). Date + time pickers fit in the popover; the primary send button stays interactive while the user is choosing.

Schedule send Picks the next available slot in your timezone

Composition rules

Cross-references