improve keyboard navigation with escape to close

components/BackgroundSelect.js

@@ -38,6 +38,8 @@ class BackgroundSelect extends React.PureComponent {
           selected={isVisible}
           className={`bg-select-display ${isVisible ? 'is-visible' : ''}`}
           onClick={toggleVisibility}
+          background="white"
+          hoverBackground="white"
         >
           <div className="bg-color-alpha" />
           <div className="bg-color" />

components/Popout.js

@@ -15,6 +15,20 @@ export const managePopout = WrappedComponent => {
 
     handleClickOutside = () => this.setState({ isVisible: false })
 
+    handleKeyDown = e => {
+      if (e.key === 'Escape') {
+        this.handleClickOutside()
+      }
+    }
+
+    componentDidMount() {
+      document.addEventListener('keydown', this.handleKeyDown)
+    }
+
+    componentWillUnmount() {
+      document.removeEventListener('keydown', this.handleKeyDown)
+    }
+
     render() {
       return (
         <WrappedComponent