Several changes improving accessibility of the dialogs

- 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.

src/Modal.js

@@ -19,6 +19,7 @@ limitations under the License.
 
 const React = require('react');
 const ReactDOM = require('react-dom');
+import FocusTrap from 'react-focus-trap';
 import Analytics from './Analytics';
 import sdk from './index';
 
@@ -164,6 +165,7 @@ class ModalManager {
         );
         modal.onFinished = props ? props.onFinished : null;
         modal.className = className;
+        modal.closeDialog = closeDialog;
 
         this._modals.unshift(modal);
 
@@ -194,9 +196,9 @@ class ModalManager {
         const modal = this._modals[0];
         const dialog = (
             <div className={"mx_Dialog_wrapper " + (modal.className ? modal.className : '')}>
-                <div className="mx_Dialog">
+                <FocusTrap className="mx_Dialog" onExit={modal.closeDialog}>
                     { modal.elem }
-                </div>
+                </FocusTrap>
                 <div className="mx_Dialog_background" onClick={this.closeAll}></div>
             </div>
         );