javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-08-19 19:57:22 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(overlays): declarative modals now work properly with the hardware back button (#24165)

Browse Source
This commit is contained in:
Liam DeBeasi
2021-11-05 10:04:13 -04:00
committed by GitHub
parent 5bd905d5e9
commit b3759aed5b
9 changed files with 235 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
core/src/utils/overlays.ts
View File

@ -256,7 +256,7 @@ export const connectListeners = (doc: Document) => {
// handle back-button click
doc.addEventListener('ionBackButton', ev => {
const lastOverlay = getOverlay(doc);
const lastOverlay = getTopOpenOverlay(doc);
if (lastOverlay && lastOverlay.backdropDismiss) {
(ev as BackButtonEvent).detail.register(OVERLAY_BACK_BUTTON_PRIORITY, () => {
return lastOverlay.dismiss(undefined, BACKDROP);
@ -267,7 +267,7 @@ export const connectListeners = (doc: Document) => {
// handle ESC to close overlay
doc.addEventListener('keyup', ev => {
if (ev.key === 'Escape') {
const lastOverlay = getOverlay(doc);
const lastOverlay = getTopOpenOverlay(doc);
if (lastOverlay && lastOverlay.backdropDismiss) {
lastOverlay.dismiss(undefined, BACKDROP);
}
@ -292,6 +292,29 @@ export const getOverlays = (doc: Document, selector?: string): HTMLIonOverlayEle
.filter(c => c.overlayIndex > 0);
};
/**
* Gets the top-most/last opened
* overlay that is currently presented.
*/
const getTopOpenOverlay = (doc: Document): HTMLIonOverlayElement | undefined => {
const overlays = getOverlays(doc);
for (let i = overlays.length - 1; i >= 0; i--) {
const overlay = overlays[i];
/**
* Only consider overlays that
* are presented. Presented overlays
* will not have the .overlay-hidden
* class on the host.
*/
if (!overlay.classList.contains('overlay-hidden')) {
return overlay;
}
}
return;
}
export const getOverlay = (doc: Document, overlayTag?: string, id?: string): HTMLIonOverlayElement | undefined => {
const overlays = getOverlays(doc, overlayTag);
return (id === undefined)