title: How to use keyboard shortcuts globally
body: <p>I use the react-hotkeys library.</p>
  
  <p>I have this:</p>
  
  <pre><code>class App extends React.Component {
    ...
    render(){
       return &lt;Page /&gt;
    };
  
  }
  
  class Page extends React.Component {
     ...
     render(){
       return &lt;DataTable /&gt;
     };
  }
  
  class DataTable extends React.Component {
     ...
     shortCutsKeymap = {
        'MOVE_NEXT_PAGE': ['right'],
        'MOVE_PREV_PAGE': ['left']
     };
  
     handleShortCuts = {
        'MOVE_NEXT_PAGE': (event) =&gt; {console.log('next')},
        'MOVE_PREV_PAGE': (event) =&gt; {console.log('prev')},
     };
  
     render(){
        return (
           &lt;HotKeys keyMap={this.shortCutsKeymap} handlers={this.handleShortCuts}&gt;
              ...
           &lt;/HotKeys&gt;
        );
     };
  }
  </code></pre>
  
  <p>Shortcuts only work when I click on a data table - that is, I set focus. I need the keyboard shortcuts to work anywhere in my application without having to click on a data table.</p>
  
  <p>Can you help me, please?</p>