Skip to content

Add API for bringing the overlay as visually frontmost #168

@tomivirkki

Description

@tomivirkki

The bringToFront (naming tbd) API is needed by <vaadin-dialog>s upcoming modeless property (exposed from overlay).

The current overlay visual stacking order based on DOM order isn't enough by itself when there are more than one modeless dialogs open at once. Whenever a modeless dialog behind the currently frontmost dialog gets focused (by click for example), it's expected to be shifted as the new frontmost dialog.

dialog-stacking-order

An early implementation of the feature handles this by updating the DOM order of the dialog overlays, but that has a side-effect of active scroll positions of all content to get reset.

dialog-scroll-reset

Visual stacking order should be changed to rely on z-index instead of DOM order.

The bringToFront function should then set the target overlay's z-index as the currently frontmost overlay's z-index + 1. It should also be invoked upon every overlay open making sure that any newly opened overlay gets displayed as the frontmost one.

Notification uses separate z-index space (on top of everything) & overlay implementation and thus shouldn't be affected by this change.

Metadata

Metadata

Assignees

Labels

No labels
No labels

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions