63 lines
1.2 KiB
JavaScript
63 lines
1.2 KiB
JavaScript
import React from 'react';
|
|
import PropTypes from 'prop-types';
|
|
import classnames from 'classnames';
|
|
|
|
const TableCell = ({
|
|
children,
|
|
className,
|
|
colSpan,
|
|
// ignored because we don't wan't to expose this prop
|
|
// eslint-disable-next-line react/prop-types
|
|
cellsNum,
|
|
isTableHead,
|
|
align,
|
|
style,
|
|
}) => {
|
|
const classes = {
|
|
align: {
|
|
left: 'text-left',
|
|
center: 'text-center',
|
|
right: 'text-right',
|
|
justify: 'text-justify',
|
|
},
|
|
isTableHead: {
|
|
true: '',
|
|
false: 'border-r border-secondary-light',
|
|
},
|
|
};
|
|
|
|
return (
|
|
<div
|
|
className={classnames(
|
|
'px-2 last:border-r-0 break-all',
|
|
`w-${colSpan}/${cellsNum}`,
|
|
classes.align[align],
|
|
classes.isTableHead[isTableHead],
|
|
className
|
|
)}
|
|
style={style}
|
|
>
|
|
{children}
|
|
</div>
|
|
);
|
|
};
|
|
|
|
TableCell.defaultProps = {
|
|
align: 'left',
|
|
className: '',
|
|
colSpan: 1,
|
|
isTableHead: false,
|
|
style: {},
|
|
};
|
|
|
|
TableCell.propTypes = {
|
|
align: PropTypes.oneOf(['left', 'center', 'right', 'justify']),
|
|
children: PropTypes.node.isRequired,
|
|
className: PropTypes.string,
|
|
colSpan: PropTypes.number,
|
|
isTableHead: PropTypes.bool,
|
|
style: PropTypes.object,
|
|
};
|
|
|
|
export default TableCell;
|