Press n or j to go to the next uncovered block, b, p or k for the previous block.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 | 5x 42x 42x 5x 5x 5x 42x 42x 42x 41x 1x 1x 1x 1x 1x 5x 5x 5x | import React from 'react';
import PropTypes from 'prop-types';
import styled from 'styled-components';
import { removeSomeProps } from 'src/utils/componentHelpers';
import { getGlobalOverrides } from 'src/global-styles';
import { colorCore, resolveColor } from 'src/utils/styledHelpers';
import {
defaultTableBodyProps,
defaultTableStylesBase,
defaultTableStylesPropsToTrim,
defaultTableStripedProps,
defaultTableStripedPropTypes,
tableBodyPropTypes,
} from '../..';
const propsToTrim = [
...defaultTableStylesPropsToTrim,
'tableStriped',
];
function StyledTableBodyComponent(props) {
const { children, ...otherProps } = props;
return <tbody {...removeSomeProps(otherProps, propsToTrim)}>{children}</tbody>;
}
StyledTableBodyComponent.propTypes = {
children: PropTypes.node,
};
StyledTableBodyComponent.defaultProps = {
children: '',
};
const trNthChild = props => {
const nextGlobalOverrides = getGlobalOverrides(props);
const { tableStriped } = props;
if (!tableStriped) {
return null;
}
const stripedProps = tableStriped === true ? defaultTableStripedProps : tableStriped;
const { even, odd } = stripedProps;
const bgEven = even.bg;
const bgOdd = odd.bg;
return {
'tr:nth-child(even)': {
'background-color': resolveColor(bgEven, nextGlobalOverrides),
},
'tr:nth-child(odd)': {
'background-color': resolveColor(bgOdd, nextGlobalOverrides),
},
};
};
const StyledTableBody = styled(StyledTableBodyComponent)`
${defaultTableStylesBase}
${colorCore}
${trNthChild}
`;
StyledTableBody.propTypes = {
...tableBodyPropTypes,
tableStriped: PropTypes.oneOfType([
PropTypes.bool,
PropTypes.shape(defaultTableStripedPropTypes),
]),
};
StyledTableBody.defaultProps = {
...defaultTableBodyProps,
tableStriped: false,
};
export { StyledTableBody };
|