"use strict";

function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _react = _interopRequireWildcard(require("react"));
var _Button = _interopRequireDefault(require("../Button/Button"));
var _Ellipses = _interopRequireDefault(require("./Ellipses"));
var _Page = _interopRequireDefault(require("./Page"));
var _classnames = _interopRequireDefault(require("classnames"));
var _Icons = require("../Icons");
var _i18n = require("../i18n");
var _excluded = ["ariaLabel", "className", "compact", "currentPage", "renderHref", "onPageChange", "headingLevel", "isNavigationHidden", "startLabelText", "startAriaLabel", "endLabelText", "endAriaLabel", "totalPages"];
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
function _extends() { _extends = Object.assign ? Object.assign.bind() : 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; }; return _extends.apply(this, arguments); }
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
// Determines number of pages visible to either side of active page.
var overflow = 1;

// Determines total number of visible pages without Ellipses.
var maxVisiblePages = 7;
function paginationBuilder(page, pages) {
  var paginationRange = [];
  var start = page - overflow;
  var end = page + overflow;
  var availableSlots = maxVisiblePages - 2;

  /**
   * If the current page is < `maxVisiblePages`,
   * add 1 - 5 pages.
   */
  if (page < availableSlots) {
    start = 1;
    end = availableSlots;
  }

  /**
   * If the current page equals `pages` - 1,
   * make sure `start` begins one page earlier.
   */
  if (page === pages - 2) {
    start -= 1;
    end += 1;
  }

  /**
   * If `end` page is two from the end,
   * make sure the last page shows instead of ellipsis.
   */
  if (end === pages - 2) {
    end += 1;
  }

  /**
   * If `end` > `pages`,
   * add last pages to `paginationRange[]`.
   */
  if (end >= pages) {
    start = pages - (availableSlots - 1);
    end = pages;
  }

  /**
   * If `pages` is 5 or fewer,
   * all pages added to `paginationRange[]`
   */
  if (pages <= maxVisiblePages) {
    start = 1;
    end = pages;
  }
  for (var i = start; i <= end; i++) {
    paginationRange.push(i);
  }
  return paginationRange;
}

/**
 * For information about how and when to use this component,
 * [refer to its full documentation page](https://design.cms.gov/components/pagination/).
 */
function Pagination(_ref) {
  var ariaLabel = _ref.ariaLabel,
    className = _ref.className,
    compact = _ref.compact,
    currentPage = _ref.currentPage,
    renderHref = _ref.renderHref,
    onPageChange = _ref.onPageChange,
    headingLevel = _ref.headingLevel,
    isNavigationHidden = _ref.isNavigationHidden,
    startLabelText = _ref.startLabelText,
    startAriaLabel = _ref.startAriaLabel,
    endLabelText = _ref.endLabelText,
    endAriaLabel = _ref.endAriaLabel,
    totalPages = _ref.totalPages,
    rest = _objectWithoutProperties(_ref, _excluded);
  var classes = (0, _classnames.default)('ds-c-pagination', {
    'ds-c-pagination--compact': compact
  }, className);

  /**
   * `useState` and `useEffect` determine if
   * mobile layout of component is rendered.
   */

  var pageChange = (0, _react.useCallback)(function (page) {
    return function (evt) {
      return onPageChange(evt, page);
    };
  }, [onPageChange]);
  var pages = [];

  /**
   * If `compact` is true, don't run code to populate `pages[]`.
   */
  if (!compact) {
    var pageRange = paginationBuilder(currentPage, totalPages);
    if (pageRange[0] >= 2) {
      /**
       * If `pageRange` begins with a page of 2 or greater,
       * begin Pagination with Page 1
       */
      pages.push( /*#__PURE__*/_react.default.createElement(_Page.default, {
        href: renderHref(1),
        key: "page-1",
        index: 1,
        isActive: currentPage === 1,
        onPageChange: pageChange(1)
      }));

      /**
       * If `pageRange` doesn't equal 2, second Pagination element is Ellipses,
       * otherwise page count continues.
       */
      if (pageRange[0] !== 2) {
        pages.push( /*#__PURE__*/_react.default.createElement(_Ellipses.default, {
          key: "ellipses-1"
        }));
      }
    }

    /**
     * Renders all Page components in range (3 pages) to Pagination component.
     */

    pageRange.map(function (page) {
      pages.push( /*#__PURE__*/_react.default.createElement(_Page.default, {
        href: renderHref(page),
        key: "page-".concat(page),
        index: page,
        isActive: currentPage === page,
        onPageChange: pageChange(page)
      }));
    });

    /**
     * Defines if/when the Ellipses component appears
     * at the end of the Pagination component -
     * as long as there are fewer than 7 pages.
     */
    if (currentPage <= totalPages - 3 && totalPages > maxVisiblePages) {
      if (currentPage < totalPages - 3) {
        pages.push( /*#__PURE__*/_react.default.createElement(_Ellipses.default, {
          key: "ellipses-2"
        }));
      }
      pages.push( /*#__PURE__*/_react.default.createElement(_Page.default, {
        href: renderHref(totalPages),
        key: "page-".concat(totalPages),
        index: totalPages,
        isActive: currentPage === totalPages,
        onPageChange: pageChange(totalPages)
      }));
    }
  }
  var startIcon = /*#__PURE__*/_react.default.createElement(_Icons.ArrowIcon, {
    direction: "left",
    className: "ds-c-pagination__nav--image"
  });
  var endIcon = /*#__PURE__*/_react.default.createElement(_Icons.ArrowIcon, {
    direction: "right",
    className: "ds-c-pagination__nav--image"
  });
  var Heading = "h".concat(headingLevel);
  var headingElement = /*#__PURE__*/_react.default.createElement(Heading, {
    id: "pagination-heading"
  }, ariaLabel !== null && ariaLabel !== void 0 ? ariaLabel : (0, _i18n.t)('pagination.ariaLabel'), " -", ' ', (0, _i18n.t)('pagination.pageXOfY', {
    number: "".concat(currentPage),
    total: "".concat(totalPages)
  }));
  return /*#__PURE__*/_react.default.createElement("nav", _extends({
    className: classes,
    "aria-labelledby": "pagination-heading"
  }, rest), /*#__PURE__*/_react.default.createElement("span", {
    "aria-live": "polite",
    role: "status",
    className: "ds-u-visibility--screen-reader"
  }, headingElement), /*#__PURE__*/_react.default.createElement(_Button.default, {
    variation: "ghost",
    href: renderHref(currentPage - 1),
    onClick: pageChange(currentPage - 1),
    "aria-label": startAriaLabel !== null && startAriaLabel !== void 0 ? startAriaLabel : (0, _i18n.t)('pagination.startAriaLabel'),
    className: "ds-c-pagination__nav",
    disabled: currentPage === 1,
    style: {
      visibility: currentPage === 1 && isNavigationHidden ? 'hidden' : 'visible'
    },
    "aria-hidden": currentPage === 1 ? isNavigationHidden : false
  }, /*#__PURE__*/_react.default.createElement("span", {
    className: "ds-c-pagination__nav--img-container ds-c-pagination__nav--img-container-previous"
  }, startIcon), startLabelText !== null && startLabelText !== void 0 ? startLabelText : (0, _i18n.t)('pagination.startLabelText')), /*#__PURE__*/_react.default.createElement("span", {
    className: "ds-c-pagination__page-count",
    dangerouslySetInnerHTML: {
      __html: (0, _i18n.t)('pagination.pageXOfY', {
        number: "<strong>".concat(currentPage, "</strong>"),
        total: "<strong>".concat(totalPages, "</strong>")
      })
    }
  }), /*#__PURE__*/_react.default.createElement("div", {
    className: "ds-c-pagination__pages"
  }, pages), /*#__PURE__*/_react.default.createElement(_Button.default, {
    variation: "ghost",
    href: renderHref(currentPage + 1),
    onClick: pageChange(currentPage + 1),
    "aria-label": endAriaLabel !== null && endAriaLabel !== void 0 ? endAriaLabel : (0, _i18n.t)('pagination.endAriaLabel'),
    className: "ds-c-pagination__nav",
    disabled: currentPage === totalPages,
    style: {
      visibility: currentPage === totalPages && isNavigationHidden ? 'hidden' : 'visible'
    },
    "aria-hidden": currentPage === totalPages ? isNavigationHidden : false
  }, endLabelText !== null && endLabelText !== void 0 ? endLabelText : (0, _i18n.t)('pagination.endLabelText'), /*#__PURE__*/_react.default.createElement("span", {
    className: "ds-c-pagination__nav--img-container ds-c-pagination__nav--img-container-next"
  }, endIcon)));
}
Pagination.defaultProps = {
  compact: false,
  headingLevel: '2',
  isNavigationHidden: false
};
var _default = Pagination;
exports.default = _default;