Cb 3910 focus fix (#1962)

* CB-3910: fix focusable elements selector

* CB-3910: update focus when ref changed

---------

Co-authored-by: EvgeniaBzzz <139753579+EvgeniaBzzz@users.noreply.github.com>
This commit is contained in:
Dmitriy Osipov
2023-09-13 12:54:36 +03:00
committed by GitHub
co-authored by EvgeniaBzzz
parent 751a9c7893
commit 4a04023062
+7 -7
View File
@@ -38,8 +38,6 @@ export function useFocus<T extends HTMLElement>({ autofocus, focusFirstChild, on
setRef(ref: T | null) {
if (this.reference !== ref) {
this.reference = ref;
this.updateFocus();
}
},
updateFocus() {
@@ -64,12 +62,12 @@ export function useFocus<T extends HTMLElement>({ autofocus, focusFirstChild, on
focusFirstChild() {
if (this.reference !== null && optionsRef.focusFirstChild) {
const firstFocusable = this.reference.querySelectorAll<T>(`
button:not([disabled=disabled]),
button:not([disabled]):not([disabled=disabled]),
[href],
input:not([disabled=disabled]):not([readonly=readonly]),
select:not([disabled=disabled]):not([readonly=readonly]),
textarea:not([disabled=disabled]):not([readonly=readonly]),
[tabndex]:not([tabndex="-1"])`);
input:not([disabled]):not([readonly]):not([disabled=disabled]):not([readonly=readonly]),
select:not([disabled]):not([readonly]):not([disabled=disabled]):not([readonly=readonly]),
textarea:not([disabled]):not([readonly]):not([disabled=disabled]):not([readonly=readonly]),
[tabindex]:not([tabindex="-1"])`);
let tabIndex = -1;
let lastElement: T | undefined;
@@ -134,6 +132,8 @@ export function useFocus<T extends HTMLElement>({ autofocus, focusFirstChild, on
reference.addEventListener('focusin', focusHandler);
reference.addEventListener('focusout', blurHandler);
state.updateFocus();
return () => {
reference.removeEventListener('focusin', focusHandler);
reference.removeEventListener('focusout', blurHandler);