fixing behaviour when pressing the enter key breaks behaviour when
pressing space to activate the buttons. So we are now handling enter
onKeyDown and space onKeyUp. Also briefly explained the situation with
comments.
was also activating normal button that might just have received the
system focus as a result of the key press and the other way round.
The most obvious occurence of this issue is that dialogs were
reappearing when dismissed by pressing the enter key.
leaving it in the Modal manager.
We are using Modal manager to load other components not just BaseDialog
and its subclasses and they might require different keyboard handling.
Also depend on focus-trap-react rather than react-focus-trap for locking
keyboard focus inside the dialog. The experience is much nicer and even
the FocusTrap element it-self no longer gains the focus.
On a side note using the FocusTrap element outside the dialog (on
its parent) stops it from working properly.
- Wrapped all the modals inside a react-focus-trap component disabling
keyboard navigation outside the modal dialogs
- Disabled our custom key handling at dialog level. Cancelling on esc
key is now handled via FocusTrap component.
- Removed onEnter prop from the BaseDialog component. Dialogs that
submit data all now embed a form with onSubmit handler. And since
keyboard focus is now managed better via FocusTrap it no longer makes
sense for the other dialog types. Fixes
https://github.com/vector-im/riot-web/issues/5736
- Set aria-hidden on the matrixChat outer node when showing dialogs to
disable navigating outside the modals by using screen reader specific
features.
This allows for filtering of the RoomList by group. When a group is selected, the room list will show:
- Rooms in the group
- Direct messages with members in the group
A button at the bottom of the TagPanel allows for creating new groups, which will appear in the panel following creation.
