[BUG] keyup events get lost when React app is re-rendered on keydown

[greena13]

Describe the bug

When an React application has an action bound to the keydown event of a particular key and a handler for that action that causes the React application to re-render in such a way that there are temporarily no <HotKeys /> components mounted when the keyup event occurs, then the keyup event goes unregistered and react-hotkeys continues to act as if that the key is still held down.

This issue has been uncovered by #186: Now submatches are ignored by default, react-hotkeys thinking the first key is still held down prevents any future key combinations being correctly matched.

How are you using react hotkeys components? (HotKeys, GlobalHotKeys, IgnoreKeys etc)

import { React }, { Component } from 'react';
import { HotKeys } from 'react-hotkeys';

class MyComponent extends Component {
  constructor(props, context) {
    super(props, context);
    
    this.state = {
      tab: 0
    }
  }

  renderActiveTab() {
    const { tab } = this.state;
    
    if (tab === 0) {
      return (
        <HotKeys 
          keyMap={{ NEXT: 'n' }} 
          handlers={{ NEXT: () => this.setState({tab: tab+1}) }}
          >
          <div>
            Tab 1
          </div>
        </HotKeys>      
      );
    } else {
      return (
        <HotKeys 
          keyMap={{ NEXT: 'n', PREVIOUS: 'p' }} 
          handlers={{
            PREVIOUS: () => this.setState({tab: tab-1}),
          }}
          >
          <div>
            Tab 1
          </div>
        </HotKeys>
      );
    }
  }
  
  render () {
    return (
      <div>
        { this.renderActiveTab() }
      </div>      
    );
  }
}

[greena13]

Fix should be available in v2.0.0-pre7.