Merge pull request 'fix(sw): restore dropdown focus after position calculation' (#33) from fix/sw-property-layer-keyboard-focus into main
Deploy Storybook / deploy (push) Successful in 1m20s
Deploy Storybook / deploy (push) Successful in 1m20s
Reviewed-on: #33
This commit was merged in pull request #33.
This commit is contained in:
commit
2690a160e9
1 file changed
+8
-3
@@ -109,11 +109,16 @@ export function useSWHeaderDropdown({ open: openProp, onOpenChange, disabled = f
|
||||
/** Focusable entries of the panel in DOM order (rows, inputs, footer). */
|
||||
const entries = () => Array.from(panelRef.current?.querySelectorAll<HTMLElement>("button:not(:disabled), input:not(:disabled)") ?? [])
|
||||
|
||||
// ArrowDown on the closed trigger asks for the entry focus. A fixed overlay (property window, SW popup) stays
|
||||
// visibility: hidden until its position is measured, and focus() on it is a no-op: the request stays pending and is
|
||||
// retried on the render that shows the list (the position update), then cleared once focus moved; closing drops it.
|
||||
useEffect(() => {
|
||||
if (open && focusEntryRef.current) {
|
||||
focusEntryRef.current = false
|
||||
if (!open) { focusEntryRef.current = false; return }
|
||||
if (focusEntryRef.current) {
|
||||
const current = panelRef.current?.querySelector<HTMLElement>('[aria-current="true"]:not(:disabled), [aria-pressed="true"]:not(:disabled)')
|
||||
;(current ?? entries()[0])?.focus()
|
||||
const target = current ?? entries()[0]
|
||||
target?.focus()
|
||||
if (!target || document.activeElement === target) focusEntryRef.current = false
|
||||
}
|
||||
})
|
||||
|
||||
|
||||
Reference in new issue
Block a user