"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = Pagination;
var _components = require("@wordpress/components");
var _i18n = require("@wordpress/i18n");
var _jsxRuntime = require("react/jsx-runtime");
/**
 * WordPress dependencies
 */

function Pagination({
  currentPage,
  numPages,
  changePage,
  totalItems
}) {
  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_components.__experimentalVStack, {
    className: "block-editor-patterns__grid-pagination-wrapper",
    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_components.__experimentalText, {
      variant: "muted",
      children: (0, _i18n.sprintf)(
      // translators: %s: Total number of patterns.
      (0, _i18n._n)('%s item', '%s items', totalItems), totalItems)
    }), numPages > 1 && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_components.__experimentalHStack, {
      expanded: false,
      spacing: 3,
      justify: "flex-start",
      className: "block-editor-patterns__grid-pagination",
      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_components.__experimentalHStack, {
        expanded: false,
        spacing: 1,
        className: "block-editor-patterns__grid-pagination-previous",
        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Button
        // TODO: Switch to `true` (40px size) if possible
        , {
          __next40pxDefaultSize: false,
          variant: "tertiary",
          onClick: () => changePage(1),
          disabled: currentPage === 1,
          "aria-label": (0, _i18n.__)('First page'),
          accessibleWhenDisabled: true,
          children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
            children: "\xAB"
          })
        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Button
        // TODO: Switch to `true` (40px size) if possible
        , {
          __next40pxDefaultSize: false,
          variant: "tertiary",
          onClick: () => changePage(currentPage - 1),
          disabled: currentPage === 1,
          "aria-label": (0, _i18n.__)('Previous page'),
          accessibleWhenDisabled: true,
          children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
            children: "\u2039"
          })
        })]
      }), /*#__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,
        className: "block-editor-patterns__grid-pagination-next",
        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Button
        // TODO: Switch to `true` (40px size) if possible
        , {
          __next40pxDefaultSize: false,
          variant: "tertiary",
          onClick: () => changePage(currentPage + 1),
          disabled: currentPage === numPages,
          "aria-label": (0, _i18n.__)('Next page'),
          accessibleWhenDisabled: true,
          children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
            children: "\u203A"
          })
        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Button, {
          variant: "tertiary",
          onClick: () => changePage(numPages),
          disabled: currentPage === numPages,
          "aria-label": (0, _i18n.__)('Last page'),
          size: "default",
          accessibleWhenDisabled: true,
          children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
            children: "\xBB"
          })
        })]
      })]
    })]
  });
}
//# sourceMappingURL=index.js.map