Table:

This is currently a work in progress...Check back soon! :)

# Table
Column 1Column 2Column 3
Cell 1Cell 2Cell 3
Cell 1Cell 2Cell 3
Cell 1Cell 2Cell 3
Cell 1Cell 2Cell 3
Cell 1Cell 2Cell 3
Cell 1Cell 2Cell 3
Cell 1Cell 2Cell 3
Column 1Column 2Column 3
<Table
  columnsList={[{ key: 1, value'Column 1' }, { key: 2, value'Column 2' }, { key: 3, value'Column 3' }]}
  pinColumns
  footerLabels
>
  <TableRow
    rowCells={[{ key: 1, value: '1' }, { key: 2, value: 'Cell 2' { key: 3, value: 'Cell 3' }]}
    hover
  />
  <TableRow
    rowCells={[{ key: 1, value: '1' }, { key: 2, value: 'Cell 2' { key: 3, value: 'Cell 3' }]}
    hover
  />
  <TableRow
    rowCells={[{ key: 1, value: '1' }, { key: 2, value: 'Cell 2' { key: 3, value: 'Cell 3' }]}
    hover
  />
  <TableRow
    rowCells={[{ key: 1, value: '1' }, { key: 2, value: 'Cell 2' { key: 3, value: 'Cell 3' }]}
    hover
  />
  <TableRow
    rowCells={[{ key: 1, value: '1' }, { key: 2, value: 'Cell 2' { key: 3, value: 'Cell 3' }]}
    hover
  />
  <TableRow
    rowCells={[{ key: 1, value: '1' }, { key: 2, value: 'Cell 2' { key: 3, value: 'Cell 3' }]}
    hover
  /><TableRow
    rowCells={[{ key: 1, value: '1' }, { key: 2, value: 'Cell 2' { key: 3, value: 'Cell 3' }]}
    hover
  />
</Table>
Column 1Column 2Column 3