Keyboard Navigation

Managing the Focus

• Initial focus - When opened, the Window should be focused.
• Action buttons are accessed with Tab key
• Tab Key Trap is implemented for modal windows

Keyboard Shortcuts

Shortcut	Behavior
Alt/Opt(Mac) + DownArrow	Minimizes or restores the state, if the focused element is the window
Alt/Opt(Mac) + UpArrow	Maximizes or restores the state, if the focused element is the window
Arrow Keys	Move the window to the respective direction (UP
Ctrl/Cmd(Mac) + UpArrow	Decreases the height of the window triggering the resizing capabilities. Applicable only when the component is resizable.
Ctrl/Cmd(Mac) + DownArrow	Increases the height of the window triggering the resizing capabilities. Applicable only when the component is resizable.
Ctrl/Cmd(Mac) + LeftArrow	Decreases the width of the window triggering the resizing capabilities. Applicable only when the component is resizable.
Ctrl/Cmd(Mac) + RightArrow	Increases the width of the window triggering the resizing capabilities. Applicable only when the component is resizable.
Escape	Closes the window. When the window is modal, the focus should be returned to the element that triggered the open.

Resources

ARIA Authoring Practices: Modal Dialog Pattern

Change Theme

Theme

Loading ...

See Also

• Accessibility in KendoReact
• Accessibility Compliance and Keyboard Support in KendoReact