How to use the @airbnb/lunar/src/components/DataTable/helpers.getRowColor function in @airbnb/lunar
To help you get started, we’ve selected a few @airbnb/lunar examples, based on popular ways it is used in public projects.
Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
airbnb / lunar / .storybook / components / DataTable / DataTableRenderers / ColSpanRenderer.jsx View on Github 
export default function ColspanRenderer({ row, zebra, theme }) {
const { rowData, rowIndex } = row;
const { data, metadata } = rowData;
const color = getRowColor(rowData, rowIndex, zebra, theme);
const colSpanStyle = {
width: '100%',
background: color,
zIndex: 100,
position: 'absolute',
height: '100%',
left: 0,
top: 0,
alignItems: 'center',
display: 'flex',
};
return (
metadata.colSpanKey && (
<div style="{colSpanStyle}">
</div>@airbnb/lunar
React toolkit and design language for Airbnb open source and internal projects.
Package Health Score
57 / 100Popular @airbnb/lunar functions
- @airbnb/lunar.initialize
- @airbnb/lunar.settings
- @airbnb/lunar/lib.initialize
- @airbnb/lunar/lib/components/DataTable/constants.HEIGHT_TO_PX.micro
- @airbnb/lunar/lib/components/ErrorMessage.getErrorMessage
- @airbnb/lunar/lib/components/Translate.phrase
- @airbnb/lunar/lib/composers/withBoundary
- @airbnb/lunar/lib/hooks/useStyles
- @airbnb/lunar/lib/prop-types/componentName.isRequired
- @airbnb/lunar/lib/prop-types/iconComponent.isRequired
- @airbnb/lunar/lib/utils/finishHOC
- @airbnb/lunar/lib/utils/renderElementOrFunction
- @airbnb/lunar/src/components/DataTable/constants.STATUS_OPTIONS.ALERT
- @airbnb/lunar/src/components/DataTable/helpers.getRowColor