60 lines
1.2 KiB
JavaScript
60 lines
1.2 KiB
JavaScript
import { classes, pureComponentHooks } from 'common/react';
|
|
import { Box } from './Box';
|
|
|
|
export const Table = props => {
|
|
const { collapsing, className, content, children, ...rest } = props;
|
|
return (
|
|
<Box
|
|
as="table"
|
|
className={classes([
|
|
'Table',
|
|
collapsing && 'Table--collapsing',
|
|
className,
|
|
])}
|
|
{...rest}>
|
|
<tbody>
|
|
{content}
|
|
{children}
|
|
</tbody>
|
|
</Box>
|
|
);
|
|
};
|
|
|
|
Table.defaultHooks = pureComponentHooks;
|
|
|
|
export const TableRow = props => {
|
|
const { className, header, ...rest } = props;
|
|
return (
|
|
<Box
|
|
as="tr"
|
|
className={classes([
|
|
'Table__row',
|
|
header && 'Table__row--header',
|
|
className,
|
|
])}
|
|
{...rest} />
|
|
);
|
|
};
|
|
|
|
TableRow.defaultHooks = pureComponentHooks;
|
|
|
|
export const TableCell = props => {
|
|
const { className, collapsing, header, ...rest } = props;
|
|
return (
|
|
<Box
|
|
as="td"
|
|
className={classes([
|
|
'Table__cell',
|
|
collapsing && 'Table__cell--collapsing',
|
|
header && 'Table__cell--header',
|
|
className,
|
|
])}
|
|
{...rest} />
|
|
);
|
|
};
|
|
|
|
TableCell.defaultHooks = pureComponentHooks;
|
|
|
|
Table.Row = TableRow;
|
|
Table.Cell = TableCell;
|