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

fix(inputs): keyboard focus improvements (#16838)

Browse Source 
fixes #16815
fixes #16872
fixes #13978
fixes #16610
This commit is contained in:
Manu MA
2019-01-11 19:36:02 +01:00
committed by GitHub
parent 275d385c17
commit 6364e4e2a1
38 changed files with 263 additions and 234 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@ -25,6 +25,18 @@ export function createOverlay<T extends HTMLIonOverlayElement>(element: T, opts:
export function connectListeners(doc: Document) {
if (lastId === 0) {
lastId = 1;
// trap focus inside overlays
doc.addEventListener('focusin', ev => {
const lastOverlay = getOverlay(doc);
if (lastOverlay && lastOverlay.backdropDismiss && !isDescendant(lastOverlay, ev.target as HTMLElement)) {
const firstInput = lastOverlay.querySelector('input,button') as HTMLElement | null;
if (firstInput) {
firstInput.focus();
}
}
});
// handle back-button click
doc.addEventListener('ionBackButton', ev => {
const lastOverlay = getOverlay(doc);
if (lastOverlay && lastOverlay.backdropDismiss) {
@ -34,6 +46,7 @@ export function connectListeners(doc: Document) {
}
});
// handle ESC to close overlay
doc.addEventListener('keyup', ev => {
if (ev.key === 'Escape') {
const lastOverlay = getOverlay(doc);
@ -195,4 +208,14 @@ export function isCancel(role: string | undefined): boolean {
return role === 'cancel' || role === BACKDROP;
}
function isDescendant(parent: HTMLElement, child: HTMLElement | null) {
while (child) {
if (child === parent) {
return true;
}
child = child.parentElement;
}
return false;
}
export const BACKDROP = 'backdrop';