Mirror: React hooks for accessible, common web interactions. UI super powers without the UI.
Force dialog focus to unfocus on tabbing to no focus target
+3
-5
+3
-5
src/useDialogFocus.ts
+3
-5
src/useDialogFocus.ts
···
64
64
contains(ref.current, event.target)
65
65
) {
66
66
event.preventDefault();
67
+
focusMovesForward = true;
67
68
// Get the next focus target of the container
68
-
const focusTarget = getNextFocusTarget(element, !focusMovesForward);
69
-
focusMovesForward = true;
70
-
focus(focusTarget);
69
+
focus(getNextFocusTarget(element, !focusMovesForward));
71
70
}
72
71
}
73
72
···
96
95
// Skip over the listbox via the parent if we press tab
97
96
event.preventDefault();
98
97
const currentTarget = contains(owner, active) ? owner! : element;
99
-
const newTarget = getNextFocusTarget(currentTarget, event.shiftKey);
100
-
if (newTarget) focus(newTarget);
98
+
focus(getNextFocusTarget(currentTarget, event.shiftKey));
101
99
} else if (
102
100
(!isInputElement(active) && event.code === 'ArrowRight') ||
103
101
event.code === 'ArrowDown'