@atlaskit/dynamic-table/dist/cjs/components/stateful.js

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

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var _react = _interopRequireDefault(require("react"));
var _noop = _interopRequireDefault(require("@atlaskit/ds-lib/noop"));
var _reorderRows = require("../internal/reorder-rows");
var _stateless = _interopRequireDefault(require("./stateless"));
function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2.default)(o), (0, _possibleConstructorReturn2.default)(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2.default)(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; })(); }
/**
 * __Dynamic Table__
 *
 * A table displays rows of data with built-in pagination, sorting, and re-ordering functionality.
 *
 * - [Examples](https://atlaskit.atlassian.com/packages/design-system/dynamic-table)
 * - [Code](https://bitbucket.org/atlassian/atlassian-frontend/packages/design-system/dynamic-table)
 *
 * @example
 * ```jsx
 * import DynamicTable from '@atlaskit/dynamic-table';
 *
 * export default function TableUncontrolled() {
 *  return (
 *   <DynamicTable
 *    head={head}
 *    rows={rows}
 *    rowsPerPage={10}
 *    defaultPage={1}
 *    loadingSpinnerSize="large"
 *    isLoading={false}
 *   />
 *  );
 * }
 * ```
 */
// eslint-disable-next-line @repo/internal/react/no-class-components
var DynamicTable = exports.default = /*#__PURE__*/function (_React$Component) {
  function DynamicTable() {
    var _this;
    (0, _classCallCheck2.default)(this, DynamicTable);
    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
      args[_key] = arguments[_key];
    }
    _this = _callSuper(this, DynamicTable, [].concat(args));
    (0, _defineProperty2.default)(_this, "state", {
      page: _this.props.defaultPage,
      sortKey: _this.props.defaultSortKey,
      sortOrder: _this.props.defaultSortOrder,
      rows: _this.props.rows
    });
    (0, _defineProperty2.default)(_this, "onSetPageHandler", function (page, analyticsEvent) {
      var onSetPage = _this.props.onSetPage;
      if (onSetPage) {
        onSetPage(page, analyticsEvent);
        _this.setState({
          page: page
        });
      }
    });
    (0, _defineProperty2.default)(_this, "onSortHandler", function (_ref, analyticsEvent) {
      var key = _ref.key,
        item = _ref.item,
        sortOrder = _ref.sortOrder;
      var onSort = _this.props.onSort;
      if (onSort) {
        onSort({
          key: key,
          item: item,
          sortOrder: sortOrder
        }, analyticsEvent);
        _this.setState({
          sortKey: key,
          sortOrder: sortOrder
        });
      }
    });
    (0, _defineProperty2.default)(_this, "onRankEndIfExistsHandler", function (params) {
      if (_this.props.onRankEnd) {
        _this.props.onRankEnd(params);
      }
    });
    (0, _defineProperty2.default)(_this, "onRankEndHandler", function (params) {
      var destination = params.destination;
      var _this$state = _this.state,
        rows = _this$state.rows,
        page = _this$state.page;
      var rowsPerPage = _this.props.rowsPerPage;
      if (!destination || !rows) {
        _this.onRankEndIfExistsHandler(params);
        return;
      }
      var reordered = (0, _reorderRows.reorderRows)(params, rows, page, rowsPerPage);
      _this.setState({
        rows: reordered
      });
      _this.onRankEndIfExistsHandler(params);
    });
    return _this;
  }
  (0, _inherits2.default)(DynamicTable, _React$Component);
  return (0, _createClass2.default)(DynamicTable, [{
    key: "UNSAFE_componentWillReceiveProps",
    value: function UNSAFE_componentWillReceiveProps(newProps) {
      var sortKey = newProps.sortKey || this.state.sortKey;
      var sortOrder = newProps.sortOrder || this.state.sortOrder;
      var page = newProps.page || this.state.page;
      this.setState({
        page: page,
        sortKey: sortKey,
        sortOrder: sortOrder,
        rows: newProps.rows
      });
    }
  }, {
    key: "render",
    value: function render() {
      var _this$state2 = this.state,
        page = _this$state2.page,
        sortKey = _this$state2.sortKey,
        sortOrder = _this$state2.sortOrder,
        rows = _this$state2.rows;
      var _this$props = this.props,
        caption = _this$props.caption,
        emptyView = _this$props.emptyView,
        head = _this$props.head,
        highlightedRowIndex = _this$props.highlightedRowIndex,
        loadingSpinnerSize = _this$props.loadingSpinnerSize,
        isLoading = _this$props.isLoading,
        loadingLabel = _this$props.loadingLabel,
        isFixedSize = _this$props.isFixedSize,
        isRankable = _this$props.isRankable,
        isRankingDisabled = _this$props.isRankingDisabled,
        rowsPerPage = _this$props.rowsPerPage,
        paginationi18n = _this$props.paginationi18n,
        onRankStart = _this$props.onRankStart,
        onPageRowsUpdate = _this$props.onPageRowsUpdate,
        testId = _this$props.testId,
        label = _this$props.label;
      return /*#__PURE__*/_react.default.createElement(_stateless.default, {
        paginationi18n: paginationi18n,
        caption: caption,
        emptyView: emptyView,
        head: head,
        highlightedRowIndex: highlightedRowIndex,
        loadingSpinnerSize: loadingSpinnerSize,
        isLoading: isLoading,
        loadingLabel: loadingLabel,
        isFixedSize: isFixedSize,
        onSetPage: this.onSetPageHandler,
        onSort: this.onSortHandler,
        page: page,
        rows: rows,
        rowsPerPage: rowsPerPage,
        sortKey: sortKey,
        sortOrder: sortOrder,
        isRankable: isRankable,
        isRankingDisabled: isRankingDisabled,
        onRankEnd: this.onRankEndHandler,
        onRankStart: onRankStart,
        onPageRowsUpdate: onPageRowsUpdate,
        testId: testId,
        label: label
      });
    }
  }]);
}(_react.default.Component);
(0, _defineProperty2.default)(DynamicTable, "defaultProps", {
  defaultPage: 1,
  isLoading: false,
  isFixedSize: false,
  isRankable: false,
  onSetPage: _noop.default,
  onSort: _noop.default,
  rowsPerPage: Infinity
});