"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = Pagination;
var _clsx = _interopRequireDefault(require("clsx"));
var _components = require("@wordpress/components");
var _i18n = require("@wordpress/i18n");
var _icons = require("@wordpress/icons");
var _jsxRuntime = require("react/jsx-runtime");
/**
 * External dependencies
 */

/**
 * WordPress dependencies
 */

function Pagination({
  currentPage,
  numPages,
  changePage,
  totalItems,
  className,
  disabled = false,
  buttonVariant = 'tertiary',
  label = (0, _i18n.__)('Pagination Navigation')
}) {
  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_components.__experimentalHStack, {
    expanded: false,
    as: "nav",
    "aria-label": label,
    spacing: 3,
    justify: "flex-start",
    className: (0, _clsx.default)('edit-site-pagination', className),
    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_components.__experimentalText, {
      variant: "muted",
      className: "edit-site-pagination__total",
      children:
      // translators: %s: Total number of patterns.
      (0, _i18n.sprintf)(
      // translators: %s: Total number of patterns.
      (0, _i18n._n)('%s item', '%s items', totalItems), totalItems)
    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_components.__experimentalHStack, {
      expanded: false,
      spacing: 1,
      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Button, {
        variant: buttonVariant,
        onClick: () => changePage(1),
        accessibleWhenDisabled: true,
        disabled: disabled || currentPage === 1,
        label: (0, _i18n.__)('First page'),
        icon: (0, _i18n.isRTL)() ? _icons.next : _icons.previous,
        size: "compact"
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Button, {
        variant: buttonVariant,
        onClick: () => changePage(currentPage - 1),
        accessibleWhenDisabled: true,
        disabled: disabled || currentPage === 1,
        label: (0, _i18n.__)('Previous page'),
        icon: (0, _i18n.isRTL)() ? _icons.chevronRight : _icons.chevronLeft,
        size: "compact"
      })]
    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.__experimentalText, {
      variant: "muted",
      children: (0, _i18n.sprintf)(
      // translators: 1: Current page number. 2: Total number of pages.
      (0, _i18n._x)('%1$s of %2$s', 'paging'), currentPage, numPages)
    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_components.__experimentalHStack, {
      expanded: false,
      spacing: 1,
      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Button, {
        variant: buttonVariant,
        onClick: () => changePage(currentPage + 1),
        accessibleWhenDisabled: true,
        disabled: disabled || currentPage === numPages,
        label: (0, _i18n.__)('Next page'),
        icon: (0, _i18n.isRTL)() ? _icons.chevronLeft : _icons.chevronRight,
        size: "compact"
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Button, {
        variant: buttonVariant,
        onClick: () => changePage(numPages),
        accessibleWhenDisabled: true,
        disabled: disabled || currentPage === numPages,
        label: (0, _i18n.__)('Last page'),
        icon: (0, _i18n.isRTL)() ? _icons.previous : _icons.next,
        size: "compact"
      })]
    })]
  });
}
//# sourceMappingURL=index.js.map