@wordpress/block-editor
Version:
117 lines (116 loc) • 4.12 kB
JavaScript
// packages/block-editor/src/components/block-patterns-paging/index.js
import {
__experimentalVStack as VStack,
__experimentalHStack as HStack,
__experimentalText as Text,
Button
} from "@wordpress/components";
import { __, _x, _n, sprintf } from "@wordpress/i18n";
import { jsx, jsxs } from "react/jsx-runtime";
function Pagination({
currentPage,
numPages,
changePage,
totalItems
}) {
return /* @__PURE__ */ jsxs(VStack, { className: "block-editor-patterns__grid-pagination-wrapper", children: [
/* @__PURE__ */ jsx(Text, { variant: "muted", children: sprintf(
// translators: %s: Total number of patterns.
_n("%s item", "%s items", totalItems),
totalItems
) }),
numPages > 1 && /* @__PURE__ */ jsxs(
HStack,
{
expanded: false,
spacing: 3,
justify: "flex-start",
className: "block-editor-patterns__grid-pagination",
children: [
/* @__PURE__ */ jsxs(
HStack,
{
expanded: false,
spacing: 1,
className: "block-editor-patterns__grid-pagination-previous",
children: [
/* @__PURE__ */ jsx(
Button,
{
variant: "tertiary",
onClick: () => changePage(1),
disabled: currentPage === 1,
"aria-label": __("First page"),
size: "compact",
accessibleWhenDisabled: true,
className: "block-editor-patterns__grid-pagination-button",
children: /* @__PURE__ */ jsx("span", { children: "\xAB" })
}
),
/* @__PURE__ */ jsx(
Button,
{
variant: "tertiary",
onClick: () => changePage(currentPage - 1),
disabled: currentPage === 1,
"aria-label": __("Previous page"),
size: "compact",
accessibleWhenDisabled: true,
className: "block-editor-patterns__grid-pagination-button",
children: /* @__PURE__ */ jsx("span", { children: "\u2039" })
}
)
]
}
),
/* @__PURE__ */ jsx(Text, { variant: "muted", children: sprintf(
// translators: 1: Current page number. 2: Total number of pages.
_x("%1$s of %2$s", "paging"),
currentPage,
numPages
) }),
/* @__PURE__ */ jsxs(
HStack,
{
expanded: false,
spacing: 1,
className: "block-editor-patterns__grid-pagination-next",
children: [
/* @__PURE__ */ jsx(
Button,
{
variant: "tertiary",
onClick: () => changePage(currentPage + 1),
disabled: currentPage === numPages,
"aria-label": __("Next page"),
size: "compact",
accessibleWhenDisabled: true,
className: "block-editor-patterns__grid-pagination-button",
children: /* @__PURE__ */ jsx("span", { children: "\u203A" })
}
),
/* @__PURE__ */ jsx(
Button,
{
variant: "tertiary",
onClick: () => changePage(numPages),
disabled: currentPage === numPages,
"aria-label": __("Last page"),
size: "compact",
accessibleWhenDisabled: true,
className: "block-editor-patterns__grid-pagination-button",
children: /* @__PURE__ */ jsx("span", { children: "\xBB" })
}
)
]
}
)
]
}
)
] });
}
export {
Pagination as default
};
//# sourceMappingURL=index.js.map