wix-style-react/src/Table/DataTable/docs/ExampleWithoutHeader.js

wix-style-react

import React from 'react';
import DataTable from '..';

const style = {
  width: '966px',
};

const baseData = [
  { firstName: 'Meghan', lastName: 'Bishop' },
  { firstName: 'Sara', lastName: 'Porter' },
  { firstName: 'Deborah', lastName: 'Rhodes' },
  { firstName: 'Walter', lastName: 'Jenning' },
];

class DataTableExampleWithoutHeader extends React.Component {
  render() {
    return (
      <div style={style}>
        <DataTable
          dataHook="story-data-table-without-header"
          hideHeader
          data={baseData}
          columns={[
            {
              title: 'Row Number',
              render: (row, rowNum) => '#' + (rowNum + 1),
              width: '20%',
              important: true,
            },
            {
              title: 'First Name',
              render: row => <span>{row.firstName}</span>,
              width: '40%',
            },
            {
              title: 'Last Name',
              render: row => <span>{row.lastName}</span>,
              width: '40%',
            },
          ]}
        />
      </div>
    );
  }
}

export default DataTableExampleWithoutHeader;