@equinor/eds-data-grid-react/dist/esm/components/TableRow.js

A feature-rich data-grid written in React, implementing the Equinor Design System

import { Table } from '@equinor/eds-core-react';
import styled from 'styled-components';
import { useTableContext } from '../EdsDataGridContext.js';
import { TableBodyCell } from './TableBodyCell.js';
import { jsx } from 'react/jsx-runtime';

function TableRow({
  row,
  onCellClick,
  onClick,
  onDoubleClick,
  onContextMenu
}) {
  const {
    rowClass,
    rowStyle
  } = useTableContext();
  return /*#__PURE__*/jsx(StyledTableRow, {
    style: {
      ...(rowStyle?.(row) ?? {})
    },
    className: `${row.getIsSelected() ? 'selected' : ''} ${rowClass?.(row)}`,
    onClick: onClick,
    onDoubleClick: onDoubleClick,
    onContextMenu: onContextMenu,
    children: row.getVisibleCells().map(cell => /*#__PURE__*/jsx(TableBodyCell, {
      cell: cell,
      onClick: onCellClick ? event => onCellClick(cell, event) : undefined
    }, cell.id))
  });
}

// Neccessary to have this attribute as class to prevent overriding hover color
const StyledTableRow = styled(Table.Row).withConfig({
  displayName: "TableRow__StyledTableRow",
  componentId: "sc-1vjfq5p-0"
})(["background-color:inherit;"]);

export { TableRow };