Как добавить горизонтальную полосу прокрутки в таблицу в реагируемой виртуализации (CodeSandBox)

Question

В этой таблице я хочу добавить несколько столбцов с шириной. Если столбцы имеют большую ширину, чем страница, горизонтальная полоса прокрутки не отображается.

Как переделать пример из песочницы и добавить горизонтальную полосу прокрутки? Возможно ли это сделать с помощью Table компонентов?

https://codesandbox.io/s/k9km4qjkk5

Реагировать:

import React from "react";
import ReactDOM from "react-dom";
import { AutoSizer, Column, Table } from "react-virtualized";

import "./styles.css";

export default class List extends React.Component {
  state = {
    list: [
      {
        name: "Brian Vaughn",
        description: "Software engineer",
        aa: "aaaaaaaaa",
        bb: "bbbbbbbbbbb",
        cc: "cccccccccccccc"
      },
      {
        name: "Brian Vaughn",
        description: "Software engineer",
        aa: "aaaaaaaaa",
        bb: "bbbbbbbbbbb",
        cc: "cccccccccccccc"
      },
      ...
    ]
  };
  render() {
    return (
      <AutoSizer>
        {({ height, width }) => (
          <Table
            width={width}
            height={height}
            headerHeight={20}
            rowHeight={35}
            overscanRowCount={100}
            rowCount={this.state.list.length}
            rowGetter={function({ index }) {
              return this.state.list[index];
            }.bind(this)}
          >
            <Column label="Name" dataKey="name" width={500} flexShrink={0} />
            <Column
              width={500}
              flexShrink={0}
              label="Description"
              dataKey="description"
            />
            <Column width={500} flexShrink={0} label="aa" dataKey="aa" />
            <Column width={500} flexShrink={0} label="bb" dataKey="bb" />
            <Column width={500} flexShrink={0} label="cc" dataKey="cc" />
          </Table>
        )}
      </AutoSizer>
    );
  }
}

const rootElement = document.getElementById("root");
ReactDOM.render(<List />, rootElement);