@atlaskit/dynamic-table/dist/es2019/components/rankable/table-row.js

A dynamic table displays rows of data with built-in pagination, sorting, and re-ordering functionality.

import _extends from "@babel/runtime/helpers/extends";
import _defineProperty from "@babel/runtime/helpers/defineProperty";
import React from 'react';

// Allowing existing usage of non Pragmatic drag and drop solution
import { Draggable } from '@atlaskit/pragmatic-drag-and-drop-react-beautiful-dnd-migration';
import withDimensions from '../../hoc/with-dimensions';
import { inlineStylesIfRanking } from '../../internal/inline-styles-if-ranking';
import { RankableTableBodyRow } from '../../styled/rankable/table-row';
import TableCell from './table-cell';
// eslint-disable-next-line @repo/internal/react/no-class-components
class RankableTableRow extends React.Component {
  constructor(...args) {
    super(...args);
    _defineProperty(this, "innerRef", innerRefFn => ref => {
      innerRefFn(ref);
      if (typeof this.props.innerRef === 'function') {
        this.props.innerRef(ref);
      }
    });
  }
  render() {
    const {
      row,
      head,
      isFixedSize,
      isRanking,
      refWidth,
      rowIndex,
      isRankingDisabled,
      isHighlighted,
      testId
    } = this.props;
    const {
      cells,
      testId: rowTestId,
      key,
      isHighlighted: isRowHighlighted,
      // TODO: Remove `rest` props and use only what is explicitly in the API.
      ...restRowProps
    } = row;
    const inlineStyles = inlineStylesIfRanking(isRanking, refWidth);
    if (typeof key !== 'string' && !isRankingDisabled) {
      throw new Error('dynamic-table: ranking is not possible because table row does not have a key. Add the key to the row or disable ranking.');
    }
    return /*#__PURE__*/React.createElement(Draggable, {
      draggableId: key || rowIndex.toString(),
      index: rowIndex,
      isDragDisabled: isRankingDisabled
    }, (provided, snapshot) => {
      var _provided$dragHandleP;
      return /*#__PURE__*/React.createElement(RankableTableBodyRow, _extends({}, restRowProps, provided.dragHandleProps, provided.draggableProps, {
        /**
         * `provided.dragHandleProps` provides `role="button"` which we don't want to apply to table rows.
         *
         * Providing `role="button"` is the RBD 13 behavior which the migration layer emulates.
         * Previously we used RBD 12 which did not provide a role to the drag handle.
         */
        role: undefined
        // It is necessary to prevent the passing of aria-labelledby
        ,
        "aria-labelledby": undefined,
        "aria-describedby": (_provided$dragHandleP = provided.dragHandleProps) === null || _provided$dragHandleP === void 0 ? void 0 : _provided$dragHandleP['aria-describedby'],
        ref: this.innerRef(provided.innerRef)
        // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
        ,
        style: {
          ...provided.draggableProps.style,
          ...inlineStyles
        },
        isHighlighted: isHighlighted || isRowHighlighted,
        isRanking: isRanking,
        isRankingItem: snapshot.isDragging,
        testId: rowTestId || testId && `${testId}--rankable--table--body--row`
      }), cells.map((cell, cellIndex) => {
        const headCell = (head || {
          cells: []
        }).cells[cellIndex];
        return /*#__PURE__*/React.createElement(TableCell, {
          head: headCell,
          cell: cell,
          isRanking: isRanking,
          key: cell.key || cellIndex,
          isFixedSize: isFixedSize,
          testId: testId
        });
      }));
    });
  }
}

// eslint-disable-next-line import/no-anonymous-default-export
const _default_1 = withDimensions(RankableTableRow);
export default _default_1;