@itwin/itwinui-react/cjs/core/Table/TableRowMemoized.js

A react component library for iTwinUI

'use strict';
Object.defineProperty(exports, '__esModule', {
  value: true,
});
function _export(target, all) {
  for (var name in all)
    Object.defineProperty(target, name, {
      enumerable: true,
      get: all[name],
    });
}
_export(exports, {
  TableRow: function () {
    return TableRow;
  },
  TableRowMemoized: function () {
    return TableRowMemoized;
  },
});
const _interop_require_default = require('@swc/helpers/_/_interop_require_default');
const _interop_require_wildcard = require('@swc/helpers/_/_interop_require_wildcard');
const _react = /*#__PURE__*/ _interop_require_wildcard._(require('react'));
const _classnames = /*#__PURE__*/ _interop_require_default._(
  require('classnames'),
);
const _index = require('../../utils/index.js');
const _TableCell = require('./TableCell.js');
const TableRow = (props) => {
  let {
    row,
    rowProps,
    isLast,
    onRowInViewport,
    onBottomReached,
    intersectionMargin,
    onClick,
    subComponent,
    isDisabled,
    tableHasSubRows,
    tableInstance,
    expanderCell,
    scrollContainerRef,
    tableRowRef,
    density,
    virtualItem,
    virtualizer,
  } = props;
  let onIntersect = _react.useCallback(() => {
    onRowInViewport.current?.(row.original);
    isLast && onBottomReached.current?.();
  }, [isLast, onBottomReached, onRowInViewport, row.original]);
  let intersectionRoot = _react.useMemo(() => {
    let isTableScrollable =
      (scrollContainerRef?.scrollHeight ?? 0) >
      (scrollContainerRef?.offsetHeight ?? 0);
    if (isTableScrollable) return scrollContainerRef;
  }, [scrollContainerRef]);
  let intersectionRef = (0, _index.useIntersection)(onIntersect, {
    rootMargin: `${intersectionMargin}px`,
    root: intersectionRoot,
  });
  let userRowProps = rowProps?.(row) ?? {};
  let { status, isLoading, ...restUserRowProps } = userRowProps;
  let mergedProps = {
    ...row.getRowProps({
      style: {
        flex: '0 0 auto',
        minWidth: '100%',
        ...(null != virtualItem
          ? {
              transform: `translateY(${virtualItem.start}px)`,
            }
          : {}),
      },
    }),
    ...restUserRowProps,
    ...{
      className: (0, _classnames.default)(
        'iui-table-row',
        {
          'iui-table-row-expanded': row.isExpanded && subComponent,
          'iui-loading': isLoading,
        },
        userRowProps?.className,
      ),
      'aria-selected': row.isSelected || void 0,
      'aria-disabled': isDisabled || void 0,
      'data-iui-status': status,
      'data-iui-index': virtualItem?.index,
      ...(null != virtualItem && {
        'data-iui-virtualizer': 'item',
      }),
    },
  };
  let refs = (0, _index.useMergedRefs)(
    intersectionRef,
    mergedProps.ref,
    tableRowRef,
    virtualizer?.measureElement,
  );
  return _react.createElement(
    _react.Fragment,
    null,
    _react.createElement(
      _index.Box,
      {
        ...mergedProps,
        key: mergedProps.key,
        ref: refs,
        onClick: (event) => {
          mergedProps?.onClick?.(event);
          onClick?.(event, row);
        },
      },
      row.cells.map((cell, index) =>
        _react.createElement(_TableCell.TableCell, {
          key: cell.getCellProps().key,
          cell: cell,
          cellIndex: index,
          isDisabled: isDisabled,
          tableHasSubRows: tableHasSubRows,
          tableInstance: tableInstance,
          expanderCell: expanderCell,
          density: density,
        }),
      ),
    ),
  );
};
const hasAnySelectedSubRow = (row, selectedRowIds) => {
  if (selectedRowIds?.[row.id]) return true;
  return row.subRows.some((subRow) =>
    hasAnySelectedSubRow(subRow, selectedRowIds),
  );
};
const TableRowMemoized = _react.memo(
  TableRow,
  (prevProp, nextProp) =>
    prevProp.isLast === nextProp.isLast &&
    prevProp.state.hiddenColumns?.length ===
      nextProp.state.hiddenColumns?.length &&
    !!prevProp.state.hiddenColumns?.every(
      (column, index) => nextProp.state.hiddenColumns?.[index] === column,
    ) &&
    prevProp.onRowInViewport === nextProp.onRowInViewport &&
    prevProp.onBottomReached === nextProp.onBottomReached &&
    prevProp.onClick === nextProp.onClick &&
    prevProp.row.original === nextProp.row.original &&
    prevProp.state.selectedRowIds?.[prevProp.row.id] ===
      nextProp.state.selectedRowIds?.[nextProp.row.id] &&
    prevProp.row.subRows.some((subRow) =>
      hasAnySelectedSubRow(subRow, prevProp.state.selectedRowIds),
    ) ===
      nextProp.row.subRows.some((subRow) =>
        hasAnySelectedSubRow(subRow, nextProp.state.selectedRowIds),
      ) &&
    prevProp.state.expanded?.[prevProp.row.id] ===
      nextProp.state.expanded?.[nextProp.row.id] &&
    prevProp.subComponent === nextProp.subComponent &&
    prevProp.row.cells.every(
      (cell, index) => nextProp.row.cells[index].column === cell.column,
    ) &&
    prevProp.isDisabled === nextProp.isDisabled &&
    prevProp.rowProps === nextProp.rowProps &&
    prevProp.expanderCell === nextProp.expanderCell &&
    prevProp.tableHasSubRows === nextProp.tableHasSubRows &&
    prevProp.scrollContainerRef === nextProp.scrollContainerRef &&
    prevProp.state.columnOrder === nextProp.state.columnOrder &&
    !nextProp.state.columnResizing.isResizingColumn &&
    prevProp.state.isTableResizing === nextProp.state.isTableResizing &&
    prevProp.state.sticky.isScrolledToLeft ===
      nextProp.state.sticky.isScrolledToLeft &&
    prevProp.state.sticky.isScrolledToRight ===
      nextProp.state.sticky.isScrolledToRight &&
    prevProp.density === nextProp.density &&
    prevProp.virtualizer === nextProp.virtualizer &&
    prevProp.virtualItem?.index === nextProp.virtualItem?.index &&
    prevProp.virtualItem?.start === nextProp.virtualItem?.start,
);