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

Changed files
+3 -5
src
+3 -5
src/useDialogFocus.ts
···
contains(ref.current, event.target)
) {
event.preventDefault();
+
focusMovesForward = true;
// Get the next focus target of the container
-
const focusTarget = getNextFocusTarget(element, !focusMovesForward);
-
focusMovesForward = true;
-
focus(focusTarget);
+
focus(getNextFocusTarget(element, !focusMovesForward));
}
}
···
// Skip over the listbox via the parent if we press tab
event.preventDefault();
const currentTarget = contains(owner, active) ? owner! : element;
-
const newTarget = getNextFocusTarget(currentTarget, event.shiftKey);
-
if (newTarget) focus(newTarget);
+
focus(getNextFocusTarget(currentTarget, event.shiftKey));
} else if (
(!isInputElement(active) && event.code === 'ArrowRight') ||
event.code === 'ArrowDown'