@atlaskit/dynamic-table/dist/esm/components/table-head.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 _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
import _createClass from "@babel/runtime/helpers/createClass";
import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
import _inherits from "@babel/runtime/helpers/inherits";
var _excluded = ["cells"],
  _excluded2 = ["ascendingSortTooltip", "buttonAriaRoleDescription", "colSpan", "content", "descendingSortTooltip", "isIconOnlyHeader", "isSortable", "key", "shouldTruncate", "testId", "width"];
function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
import React from 'react';
import { validateSortKey } from '../internal/validate-sort-key';
import { Head } from '../styled/head';
import RankableHeadCell from './rankable/table-head-cell';
import HeadCell from './table-head-cell';
// eslint-disable-next-line @repo/internal/react/no-class-components
var TableHead = /*#__PURE__*/function (_React$Component) {
  function TableHead(props) {
    var _this;
    _classCallCheck(this, TableHead);
    _this = _callSuper(this, TableHead, [props]);
    _this.state = {
      activeSortButtonId: null
    };
    return _this;
  }
  _inherits(TableHead, _React$Component);
  return _createClass(TableHead, [{
    key: "UNSAFE_componentWillMount",
    value: function UNSAFE_componentWillMount() {
      validateSortKey(this.props.sortKey, this.props.head);
    }
  }, {
    key: "UNSAFE_componentWillReceiveProps",
    value: function UNSAFE_componentWillReceiveProps(nextProps) {
      if (this.props.sortKey !== nextProps.sortKey || this.props.head !== nextProps.head) {
        validateSortKey(nextProps.sortKey, nextProps.head);
      }
    }
  }, {
    key: "render",
    value: function render() {
      var _this2 = this;
      var _this$props = this.props,
        head = _this$props.head,
        sortKey = _this$props.sortKey,
        sortOrder = _this$props.sortOrder,
        isFixedSize = _this$props.isFixedSize,
        onSort = _this$props.onSort,
        isRanking = _this$props.isRanking,
        isRankable = _this$props.isRankable,
        testId = _this$props.testId;
      var activeSortButtonId = this.state.activeSortButtonId;
      if (!head) {
        return null;
      }
      var HeadCellComponent = isRankable ? RankableHeadCell : HeadCell;

      // TODO: Remove `rest` props and use only what is explicitly in the API.
      // Some tests use this to pass in onClick and other stuff within the `head`
      // variable here, but considering it's not in the API, it should probably
      // be removed.
      var cells = head.cells,
        rest = _objectWithoutProperties(head, _excluded);
      return /*#__PURE__*/React.createElement(Head, _extends({}, rest, {
        isRanking: isRanking,
        testId: testId && "".concat(testId, "--head")
      }), /*#__PURE__*/React.createElement("tr", null, cells.map(function (cell, index) {
        var ascendingSortTooltip = cell.ascendingSortTooltip,
          buttonAriaRoleDescription = cell.buttonAriaRoleDescription,
          colSpan = cell.colSpan,
          content = cell.content,
          descendingSortTooltip = cell.descendingSortTooltip,
          isIconOnlyHeader = cell.isIconOnlyHeader,
          isSortable = cell.isSortable,
          key = cell.key,
          shouldTruncate = cell.shouldTruncate,
          cellTestId = cell.testId,
          width = cell.width,
          restCellProps = _objectWithoutProperties(cell, _excluded2);
        var headCellId = "head-cell-".concat(index);
        var handleClick = function handleClick() {
          _this2.setState({
            activeSortButtonId: headCellId
          });
          if (isSortable) {
            onSort(cell)();
          }
        };
        return /*#__PURE__*/React.createElement(HeadCellComponent, _extends({
          colSpan: colSpan,
          content: content,
          isFixedSize: isFixedSize,
          isIconOnlyHeader: isIconOnlyHeader,
          isSortable: !!isSortable,
          isRanking: isRanking,
          key: key || index,
          headCellId: headCellId,
          activeSortButtonId: activeSortButtonId,
          onClick: handleClick,
          testId: cellTestId || testId,
          shouldTruncate: shouldTruncate,
          sortOrder: key === sortKey ? sortOrder : undefined,
          width: width,
          ascendingSortTooltip: ascendingSortTooltip,
          descendingSortTooltip: descendingSortTooltip,
          buttonAriaRoleDescription: buttonAriaRoleDescription
        }, restCellProps));
      })));
    }
  }]);
}(React.Component); // eslint-disable-next-line @repo/internal/react/require-jsdoc
export default TableHead;