diff --git a/js/package.json b/js/package.json
index bb2722f67..8ae2133ad 100644
--- a/js/package.json
+++ b/js/package.json
@@ -175,6 +175,7 @@
"react-dom": "15.4.1",
"react-dropzone": "3.7.3",
"react-element-to-jsx-string": "6.0.0",
+ "react-event-listener": "0.4.1",
"react-intl": "2.1.5",
"react-portal": "3.0.0",
"react-redux": "4.4.6",
diff --git a/js/src/ui/Portal/portal.js b/js/src/ui/Portal/portal.js
index 53c4324c2..6c823b5ce 100644
--- a/js/src/ui/Portal/portal.js
+++ b/js/src/ui/Portal/portal.js
@@ -14,6 +14,7 @@
// You should have received a copy of the GNU General Public License
// along with Parity. If not, see .
+import EventListener from 'react-event-listener';
import React, { Component, PropTypes } from 'react';
import ReactDOM from 'react-dom';
import ReactPortal from 'react-portal';
@@ -85,6 +86,7 @@ export default class Portal extends Component {
onKeyDown={ this.handleKeyDown }
>
+ { this.renderBindings() }
{ this.renderCloseIcon() }
{ children }
@@ -93,6 +95,21 @@ export default class Portal extends Component {
);
}
+ renderBindings () {
+ const { expanded } = this.state;
+
+ if (!expanded) {
+ return null;
+ }
+
+ return (
+
+ );
+ }
+
renderCloseIcon () {
const { expanded } = this.state;
@@ -121,18 +138,20 @@ export default class Portal extends Component {
handleKeyDown = (event) => {
const { onKeyDown } = this.props;
+
+ event.persist();
+ return onKeyDown
+ ? onKeyDown(event)
+ : false;
+ }
+
+ handleKeyUp = (event) => {
const codeName = keycode(event);
switch (codeName) {
case 'esc':
event.preventDefault();
return this.handleClose();
-
- default:
- event.persist();
- return onKeyDown
- ? onKeyDown(event)
- : false;
}
}