'use strict';

exports.__esModule = true;

var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _styledComponents = require('styled-components');

var _styledComponents2 = _interopRequireDefault(_styledComponents);

var _grommet = require('grommet');

var _grommetIcons = require('grommet-icons');

var _NumberInput = require('../../NumberInput');

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }

function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }

function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }

var defaultButton = function defaultButton(_ref) {
  var disabled = _ref.disabled,
      Icon = _ref.Icon,
      onClick = _ref.onClick,
      label = _ref.label,
      other = _objectWithoutProperties(_ref, ['disabled', 'Icon', 'onClick', 'label']);

  return _react2.default.createElement(_grommet.Button, _extends({
    icon: _react2.default.createElement(Icon, null),
    disabled: disabled,
    onClick: onClick,
    label: label,
    plain: true
  }, other));
};

var StyledButton = (0, _styledComponents2.default)(defaultButton).withConfig({
  displayName: 'Pagination__StyledButton',
  componentId: 'bjf6y1-0'
})(['width:150px;padding:10px 0;']);

var StyledPageInput = (0, _styledComponents2.default)(_NumberInput.NumberInput).withConfig({
  displayName: 'Pagination__StyledPageInput',
  componentId: 'bjf6y1-1'
})(['max-width:180px;']);

var StyledSelect = (0, _styledComponents2.default)(_grommet.Select).withConfig({
  displayName: 'Pagination__StyledSelect',
  componentId: 'bjf6y1-2'
})(['max-width:150px;']);

var ReactTablePagination = function (_Component) {
  _inherits(ReactTablePagination, _Component);

  function ReactTablePagination(props, context) {
    _classCallCheck(this, ReactTablePagination);

    var _this = _possibleConstructorReturn(this, _Component.call(this, props, context));

    _this.getSafePage = function (page) {
      var pg = Number.isNaN(page) ? _this.props.page : page;
      return Math.min(Math.max(pg, 0), _this.props.pages - 1);
    };

    _this.changePage = function (page) {
      var pg = _this.getSafePage(page);
      _this.setState({ page: pg });
      if (_this.props.page !== pg) {
        _this.props.onPageChange(pg);
      }
    };

    _this.applyPage = function (e) {
      if (e) {
        e.preventDefault();
      }
      var page = _this.state.page;

      _this.changePage(page === '' ? _this.props.page : page);
    };

    _this.state = { page: props.page };
    return _this;
  }

  ReactTablePagination.prototype.componentWillReceiveProps = function componentWillReceiveProps(nextProps) {
    this.setState({ page: nextProps.page });
  };

  ReactTablePagination.prototype.renderPaging = function renderPaging() {
    var _this2 = this;

    var _props = this.props,
        page = _props.page,
        showPageJump = _props.showPageJump,
        pageText = _props.pageText,
        ofText = _props.ofText,
        pages = _props.pages;

    var pageJump = void 0;
    if (showPageJump) {
      pageJump = _react2.default.createElement(StyledPageInput, {
        'aria-label': 'Select page to jump to',
        onChange: function onChange(e) {
          var val = e.target.value;
          var pg = val - 1;
          if (val === '') {
            return _this2.setState({ page: val });
          }
          _this2.setState({ page: _this2.getSafePage(pg) });
          return false;
        },
        value: this.state.page === '' ? '' : this.state.page + 1,
        onBlur: this.applyPage,
        onKeyPress: function onKeyPress(e) {
          if (e.which === 13 || e.keyCode === 13) {
            _this2.applyPage();
          }
        }
      });
    } else {
      pageJump = _react2.default.createElement(
        _grommet.Text,
        null,
        page + 1
      );
    }
    return _react2.default.createElement(
      _grommet.Box,
      { direction: 'row', align: 'center', gap: 'small' },
      _react2.default.createElement(
        _grommet.Text,
        null,
        pageText + ' '
      ),
      pageJump,
      _react2.default.createElement(
        'span',
        { style: { whiteSpace: 'nowrap' } },
        ofText + ' ' + (pages || 1)
      )
    );
  };

  ReactTablePagination.prototype.renderPageSize = function renderPageSize() {
    var _this3 = this;

    var _props2 = this.props,
        showPageSizeOptions = _props2.showPageSizeOptions,
        onPageSizeChange = _props2.onPageSizeChange,
        pageSizeOptions = _props2.pageSizeOptions,
        pageSize = _props2.pageSize;

    if (showPageSizeOptions) {
      return _react2.default.createElement(
        _grommet.Box,
        { direction: 'row' },
        _react2.default.createElement(StyledSelect, {
          'aria-label': 'Select rows per page',
          onChange: function onChange(e) {
            return onPageSizeChange(Number(e.option.split(' ')[0]));
          },
          value: pageSize + ' ' + this.props.rowsText,
          options: pageSizeOptions.map(function (option) {
            return option + ' ' + _this3.props.rowsText;
          })
        })
      );
    }
    return null;
  };

  ReactTablePagination.prototype.renderPrevious = function renderPrevious() {
    var _this4 = this;

    var _props3 = this.props,
        _props3$PreviousCompo = _props3.PreviousComponent,
        PreviousComponent = _props3$PreviousCompo === undefined ? StyledButton : _props3$PreviousCompo,
        canPrevious = _props3.canPrevious,
        page = _props3.page;

    return _react2.default.createElement(
      _grommet.Box,
      { direction: 'row' },
      _react2.default.createElement(PreviousComponent, {
        'aria-label': 'Move to previous page',
        Icon: _grommetIcons.Previous,
        label: this.props.previousText,
        onClick: canPrevious ? function () {
          return _this4.changePage(page - 1);
        } : null,
        disabled: !canPrevious
      })
    );
  };

  ReactTablePagination.prototype.renderNext = function renderNext() {
    var _this5 = this;

    var _props4 = this.props,
        page = _props4.page,
        canNext = _props4.canNext,
        _props4$NextComponent = _props4.NextComponent,
        NextComponent = _props4$NextComponent === undefined ? StyledButton : _props4$NextComponent;

    return _react2.default.createElement(
      _grommet.Box,
      { direction: 'row' },
      _react2.default.createElement(NextComponent, {
        'aria-label': 'Move to next page',
        reverse: true,
        Icon: _grommetIcons.Next,
        label: this.props.nextText,
        onClick: canNext ? function () {
          return _this5.changePage(page + 1);
        } : null,
        disabled: !canNext
      })
    );
  };

  ReactTablePagination.prototype.render = function render() {
    var props = this.props.getPaginationProps(this.props);
    return _react2.default.createElement(
      _grommet.Box,
      _extends({
        direction: 'row', align: 'center', justify: 'between', fill: 'horizontal'
      }, props),
      this.renderPrevious(),
      this.renderPaging(),
      this.renderPageSize(),
      this.renderNext()
    );
  };

  return ReactTablePagination;
}(_react.Component);

exports.default = ReactTablePagination;