Search…
⌃K
Links

Table

A table component.

Usage

import { Table, TableHeader, TableRow, TableCell, Text } from '@aragon/ui'
const App = () => (
<Table
header={
<TableRow>
<TableHeader title="Activity" />
</TableRow>
}
>
<TableRow>
<TableCell>
<Text>January</Text>
</TableCell>
<TableCell>
<Text>February</Text>
</TableCell>
</TableRow>
<TableRow>
<TableCell>
<Text>10 commits</Text>
</TableCell>
<TableCell>
<Text>32 commits</Text>
</TableCell>
</TableRow>
</Table>
)

Demonstration

Props

  • Type: Node
This is a table row containing a header of your choice.

Example:

const MyTable = (props) => (
<Table
header={
<TableRow>
<TableHeader title="Records" />
</TableRow>
}
>
{/* Table content */}
</Table>
)

noSideBorders

  • Type: Boolean
  • Default: false
Set this to true to remove the borders on the side of the table. Useful when the table need to take the full width of the screen.