es-grid-template/es/table-component/body/TableBodyRow.js

es-grid-template

import _extends from "@babel/runtime/helpers/esm/extends";
import TableBodyCell from "./TableBodyCell";
import TableBodyCellEdit from "./TableBodyCellEdit";
import React from "react";
import { TableContext } from "../useContext";
import classNames from "classnames";
const TableBodyRow = ({
  tableId,
  table,
  columnVirtualizer,
  row,
  rowVirtualizer,
  virtualPaddingLeft,
  virtualPaddingRight,
  virtualRow,
  fixedLeftColumns,
  fixedRightColumns,
  commandClick,
  editAble,
  isEditing,
  contextMenuItems,
  ...rest
}) => {
  const {
    prefix,
    recordDoubleClick,
    onContextMenu
  } = React.useContext(TableContext);
  const visibleCells = row.getVisibleCells();
  const virtualColumns = columnVirtualizer.getVirtualItems();

  // table.options.set

  return /*#__PURE__*/React.createElement("tr", {
    "data-index": virtualRow.index //needed for dynamic row height measurement
    ,
    ref: node => rowVirtualizer.measureElement(node) //measure dynamic row height
    ,
    key: row.id

    // className={} ui-rc-table-row-selected
    ,
    className: classNames(`${prefix}-grid-row`, {
      [`${prefix}-grid-row-selected`]: row.getIsSelected()
    }),
    style: {
      // display: 'flex',
      // position: 'absolute',
      transform: `translateY(${virtualRow.start}px)`,
      //this should always be a `style` as it changes on scroll
      // width: '100%',
      // height: isEditing ? '36px' : undefined,
      height: isEditing ? virtualRow.size : undefined,
      minHeight: isEditing ? undefined : virtualRow.size
    },
    onDoubleClick: e => {
      recordDoubleClick?.({
        e,
        rowData: row.original,
        rowIndex: row.index
      });
    },
    onContextMenu: e => {
      if (contextMenuItems && contextMenuItems.length) {
        onContextMenu?.(row.original)(e);
      }
    }

    // onContextMenu={onContextMenu(row.original)}
  }, fixedLeftColumns.length > 0 ? fixedLeftColumns.map(column => {
    const cell = row.getVisibleCells().find(c => c.column.id === column.id);
    if (editAble) {
      return /*#__PURE__*/React.createElement(TableBodyCellEdit, _extends({}, rest, {
        table: table,
        tableId: tableId,
        key: cell.id,
        cell: cell,
        commandClick: commandClick,
        isEditing: isEditing,
        rowVirtualizer: rowVirtualizer,
        columnVirtualizer: columnVirtualizer
      }));
    }
    return /*#__PURE__*/React.createElement(TableBodyCell, {
      key: column.id,
      table: table,
      cell: row.getVisibleCells().find(c => c.column.id === column.id),
      commandClick: commandClick
    });
  }) : null, virtualPaddingLeft ? /*#__PURE__*/React.createElement("td", {
    className: "",
    style: {
      display: "flex",
      width: virtualPaddingLeft
    }
  }) : null, virtualColumns.map(vc => {
    const cell = visibleCells[vc.index];
    const isFixed = table.getState().columnPinning.left?.includes(cell.column.id) || table.getState().columnPinning.right?.includes(cell.column.id);
    if (cell && !isFixed) {
      if (editAble) {
        return /*#__PURE__*/React.createElement(TableBodyCellEdit, _extends({}, rest, {
          table: table,
          key: cell.id,
          tableId: tableId,
          cell: cell,
          commandClick: commandClick,
          isEditing: isEditing,
          rowVirtualizer: rowVirtualizer,
          columnVirtualizer: columnVirtualizer
        }));
      }
      return /*#__PURE__*/React.createElement(TableBodyCell, {
        table: table,
        key: cell.id,
        cell: cell,
        commandClick: commandClick
      });
    }
  }), fixedRightColumns.length > 0 ? fixedRightColumns.map(column => {
    if (editAble) {
      return /*#__PURE__*/React.createElement(TableBodyCellEdit, _extends({}, rest, {
        table: table,
        key: column.id,
        tableId: tableId,
        cell: row.getVisibleCells().find(c => c.column.id === column.id),
        commandClick: commandClick,
        isEditing: isEditing,
        rowVirtualizer: rowVirtualizer,
        columnVirtualizer: columnVirtualizer
      }));
    }
    return /*#__PURE__*/React.createElement(TableBodyCell, {
      key: column.id,
      table: table,
      cell: row.getVisibleCells().find(c => c.column.id === column.id),
      commandClick: commandClick
    });
  }) : null, virtualPaddingRight ? /*#__PURE__*/React.createElement("td", {
    className: "",
    style: {
      display: "flex",
      width: virtualPaddingRight
    }
  }) : null);
};
export default TableBodyRow;