UNPKG

@wordpress/block-editor

Version:
95 lines (93 loc) 3.73 kB
"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, { variant: "tertiary", onClick: () => changePage(1), disabled: currentPage === 1, "aria-label": (0, _i18n.__)('First page'), size: "compact", accessibleWhenDisabled: true, className: "block-editor-patterns__grid-pagination-button", children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", { children: "\xAB" }) }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Button, { variant: "tertiary", onClick: () => changePage(currentPage - 1), disabled: currentPage === 1, "aria-label": (0, _i18n.__)('Previous page'), size: "compact", accessibleWhenDisabled: true, className: "block-editor-patterns__grid-pagination-button", 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, { variant: "tertiary", onClick: () => changePage(currentPage + 1), disabled: currentPage === numPages, "aria-label": (0, _i18n.__)('Next page'), size: "compact", accessibleWhenDisabled: true, className: "block-editor-patterns__grid-pagination-button", 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: "compact", accessibleWhenDisabled: true, className: "block-editor-patterns__grid-pagination-button", children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", { children: "\xBB" }) })] })] })] }); } //# sourceMappingURL=index.js.map