@not-govuk/table

Table

The GDS Table component.

Preview

Using this package

First install the package into your project:

npm install -S @not-govuk/table

Then use it in your code as follows:

import React, { createElement as h } from 'react';
import Table from '@not-govuk/table';

export const MyComponent = props => (
  <Table
    keys={['date', 'amount']}
    headings={{
      amount: 'Amount',
      date: 'Date'
    }}
    data={[
      {
        amount: '£109.80 per week',
        date: 'First 6 weeks'
      },
      {
        amount: '£109.80 per week',
        date: 'Next 33 weeks'
      },
      {
        amount: '£4,282.20',
        date: 'Total estimated pay'
      },
    ]}
  />
);

export default MyComponent;

Working on this package

Before working on this package you must install its dependencies using the following command:

pnpm install

Testing

npm test

Building

npm run build

Clean-up

npm run clean