Sets up keyboard event handlers for accessibility focus management
Handles Escape, Tab, and Arrow key events for managing focus within/outside an element. Particularly useful for modal dialogs, dropdown menus, and other interactive components.
The element to manage focus for
Cleanup function to remove event listeners
const cleanup = handleKeyboardNavigation({ element: dialogElement, action: (event) => { // Close dialog when focus leaves dialog.close(); }, shadowDomContext: shadowRoot});// Later, cleanup when component unmountscleanup(); Copy
const cleanup = handleKeyboardNavigation({ element: dialogElement, action: (event) => { // Close dialog when focus leaves dialog.close(); }, shadowDomContext: shadowRoot});// Later, cleanup when component unmountscleanup();
Sets up keyboard event handlers for accessibility focus management
Handles Escape, Tab, and Arrow key events for managing focus within/outside an element. Particularly useful for modal dialogs, dropdown menus, and other interactive components.