Listen for keys combinations on document element
The use-hotkeys hook accepts an array of hotkeys and handler tuples as its first argument:
The second argument is a list of HTML tags on which hotkeys should be ignored. By default, hotkey events are ignored if the focus is in input , textarea , and select elements.
The use-hotkeys hook can only work with the document element; you will need to create your own event listener if you need to support other elements. For this purpose, the @mantine/hooks package exports a getHotkeyHandler function that should be used with onKeyDown :
With getHotkeyHandler you can also add events to any DOM node using .addEventListener :
The @mantine/hooks package exports HotkeyItemOptions and HotkeyItem types:
HotkeyItemOptions provides the usePhysicalKeys option to force physical key assignment. This is useful for non-QWERTY keyboard layouts.
The HotkeyItem type can be used to create hotkey items outside of the use-hotkeys hook:
The HotkeyItemOptions and HotkeyItem types are exported from @mantine/hooks ;