title: Tabbing to First Element when react-virtualized is scrolled to the bottom
body: <p>I am using <a href="https://github.com/bvaughn/react-virtualized/blob/master/docs/List.md" rel="nofollow noreferrer">react-virtualized</a> library. And I need to be able to tab through the list.</p>
  
  <p>Since not all the items are rendered, I am not able to tab to the <strong>last row</strong></p>
  
  <p>Similar issue will happen if I want to tab to the <strong>first row</strong> when <strong>virtual list is scrolled to the bottom of the list</strong></p>
  
  <p>If I was able to <strong>always render first row and last</strong> row, no matter scrolling position, I would be able to tab to the <strong>last</strong> and <strong>first</strong> element.</p>
  
  <p><strong>Use case:</strong></p>
  
  <p>Imagine current focus is on input box which is situated above the virtual list, and imagine virtual list is scrolled to the bottom. </p>
  
  <p>If I press on my keyboard tab I expect my focus to be on the first element. But because the first element is not rendered,the focus will be on the first rendered row by virtual list. I hope this makes sense.</p>
  
  <p><strong>This is my current code:</strong></p>
  
  <pre><code>class Locations extends React.Component {
  
    setListElementRef = (ref) =&gt; {
      this.listRef = ref;
    }
  
    rowRenderer = ({ index, style }) =&gt; {
      return (
        &lt;div style={style} key={index} &gt;
          &lt;CheckBoxContainer /&gt;
        &lt;/div&gt;
      );
    }
  
    render() {
      const {
        filteredLocations, onSearchValueChange,
      } = this.props;
  
      return (
            &lt;List
              tabIndex={-1}
              isScrollingOptOut
              ref={this.setListElementRef}
              rowRenderer={this.rowRenderer}
              rowCount={filteredLocations.length}
              rowHeight={32}
              height={300}
              width={218}
              overscanRowCount={5}
            /&gt;
      );
    }
  }
  </code></pre>