Pattern

Overlay / command palette

Go somewhere

Required if overlay existsSource pattern
ContractOverlay / command palette
Job
Go somewhere
Requirement
must specify if overlay exists
States / rules
Dialog a11y
Specified means
Not separately stated in this row.
Hardest context
Focus trap

Flow

Trigger: The product needs a fast overlay for finding destinations or commands from many places in the application.

  1. Invoke from a visible command surface and/or documented shortcut.Invoke from a visible command surface and/or documented shortcut.
  2. Move focus into the overlay and announce its purpose.Move focus into the overlay and announce its purpose.
  3. Filter destinations or commands without conflating unrelated search domains.Filter destinations or commands without conflating unrelated search domains.
  4. Make keyboard movement and current selection explicit.Make keyboard movement and current selection explicit.
  5. Execute the chosen command or destination once.Execute the chosen command or destination once.
  6. Close on Escape/cancel and return focus to the invoking context when no navigation occurs.Close on Escape/cancel and return focus to the invoking context when no navigation occurs.

Typical Building Blocks composition

Composition below is baseline guidance for the pattern; it does not rename or add source checklist rows.

Dialog / overlaySearch or combobox behaviorList rows / commandsKeyboard focus management

Flow rules

  • Catalog search, command destinations, and Settings search remain separate jobs unless the product explicitly specifies otherwise.
  • Escape closes without side effects.
  • The overlay cannot trap focus after it is dismissed.

Responsive behavior

On small screens the palette may occupy most of the viewport, but focus entry, filtering, selection, Escape/cancel, and return behavior remain the same.

Accessibility is tested across the sequence.

Keyboard order, focus movement, state announcements, touch targets, cancellation, and recovery must be verified for the whole flow—not only for each participating component in isolation.

Recovery is part of the pattern.

A complete pattern defines what the user sees when the happy path breaks, what is preserved, where focus goes, and how the user safely resumes or exits.

Catalog connection

A product Catalog can show this pattern only when the product actually implements the flow. If it is absent, keep the section honestly Not yet rather than mounting a fictional working pattern.