@guardian/stand 0.0.72 → 0.0.73

package/dist/AlertBanner.d.cts

@@ -1,5 +1,5 @@
 import { ComponentAlertBanner, componentAlertBanner } from "./styleD/build/typescript/component/alertBanner.cjs";
-import { AlertBannerTheme } from "./components/AlertBanner/styles.cjs";
+import { PartialAlertBannerTheme } from "./components/AlertBanner/styles.cjs";
 import { AlertBannerProps } from "./components/AlertBanner/types.cjs";
 import { AlertBanner } from "./components/AlertBanner/AlertBanner.cjs";
-export { AlertBanner, type AlertBannerProps, type AlertBannerTheme, type ComponentAlertBanner, componentAlertBanner };
+export { AlertBanner, type AlertBannerProps, type PartialAlertBannerTheme as AlertBannerTheme, type ComponentAlertBanner, componentAlertBanner };

package/dist/AlertBanner.d.ts

@@ -1,5 +1,5 @@
 import { ComponentAlertBanner, componentAlertBanner } from "./styleD/build/typescript/component/alertBanner.js";
-import { AlertBannerTheme } from "./components/AlertBanner/styles.js";
+import { PartialAlertBannerTheme } from "./components/AlertBanner/styles.js";
 import { AlertBannerProps } from "./components/AlertBanner/types.js";
 import { AlertBanner } from "./components/AlertBanner/AlertBanner.js";
-export { AlertBanner, type AlertBannerProps, type AlertBannerTheme, type ComponentAlertBanner, componentAlertBanner };
+export { AlertBanner, type AlertBannerProps, type PartialAlertBannerTheme as AlertBannerTheme, type ComponentAlertBanner, componentAlertBanner };

package/dist/Grid.d.cts

@@ -1,5 +1,5 @@
 import { ComponentGrid, componentGrid } from "./styleD/build/typescript/component/grid.cjs";
 import { PartialGridTheme } from "./components/Grid/styles.cjs";
-import { GridProps, ItemProps } from "./components/Grid/types.cjs";
+import { GridOffsetValue, GridProps, GridSizeValue, ItemProps, ResponsiveGridValue } from "./components/Grid/types.cjs";
 import { Grid, Item } from "./components/Grid/Grid.cjs";
-export { type ComponentGrid, Grid, type GridProps, type PartialGridTheme as GridTheme, Item, type ItemProps, componentGrid };
+export { type ComponentGrid, Grid, type GridOffsetValue, type GridProps, type GridSizeValue, type PartialGridTheme as GridTheme, Item, type ItemProps, type ResponsiveGridValue, componentGrid };

package/dist/Grid.d.ts

@@ -1,5 +1,5 @@
 import { ComponentGrid, componentGrid } from "./styleD/build/typescript/component/grid.js";
 import { PartialGridTheme } from "./components/Grid/styles.js";
-import { GridProps, ItemProps } from "./components/Grid/types.js";
+import { GridOffsetValue, GridProps, GridSizeValue, ItemProps, ResponsiveGridValue } from "./components/Grid/types.js";
 import { Grid, Item } from "./components/Grid/Grid.js";
-export { type ComponentGrid, Grid, type GridProps, type PartialGridTheme as GridTheme, Item, type ItemProps, componentGrid };
+export { type ComponentGrid, Grid, type GridOffsetValue, type GridProps, type GridSizeValue, type PartialGridTheme as GridTheme, Item, type ItemProps, type ResponsiveGridValue, componentGrid };

package/dist/HtmlPreviewLoader.d.cts

@@ -1,4 +1,6 @@
 import { ComponentHtmlPreviewLoader, componentHtmlPreviewLoader } from "./styleD/build/typescript/component/htmlPreviewLoader.cjs";
+import { PartialHtmlPreviewLoaderTheme } from "./components/HtmlPreviewLoader/styles.cjs";
+import { HtmlPreviewLoaderProps, HtmlPreviewProps } from "./components/HtmlPreviewLoader/types.cjs";
 import { HtmlPreviewLoader } from "./components/HtmlPreviewLoader/HtmlPreviewLoader.cjs";
 import { HtmlPreview } from "./components/HtmlPreviewLoader/HtmlPreview.cjs";
-export { type ComponentHtmlPreviewLoader, HtmlPreview, HtmlPreviewLoader, componentHtmlPreviewLoader };
+export { type ComponentHtmlPreviewLoader, HtmlPreview, HtmlPreviewLoader, type HtmlPreviewLoaderProps, type PartialHtmlPreviewLoaderTheme as HtmlPreviewLoaderTheme, type HtmlPreviewProps, componentHtmlPreviewLoader };

package/dist/HtmlPreviewLoader.d.ts

@@ -1,4 +1,6 @@
 import { ComponentHtmlPreviewLoader, componentHtmlPreviewLoader } from "./styleD/build/typescript/component/htmlPreviewLoader.js";
+import { PartialHtmlPreviewLoaderTheme } from "./components/HtmlPreviewLoader/styles.js";
+import { HtmlPreviewLoaderProps, HtmlPreviewProps } from "./components/HtmlPreviewLoader/types.js";
 import { HtmlPreviewLoader } from "./components/HtmlPreviewLoader/HtmlPreviewLoader.js";
 import { HtmlPreview } from "./components/HtmlPreviewLoader/HtmlPreview.js";
-export { type ComponentHtmlPreviewLoader, HtmlPreview, HtmlPreviewLoader, componentHtmlPreviewLoader };
+export { type ComponentHtmlPreviewLoader, HtmlPreview, HtmlPreviewLoader, type HtmlPreviewLoaderProps, type PartialHtmlPreviewLoaderTheme as HtmlPreviewLoaderTheme, type HtmlPreviewProps, componentHtmlPreviewLoader };

package/dist/Pagination.cjs

@@ -0,0 +1,5 @@
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const require_pagination = require("./styleD/build/typescript/component/pagination.cjs");
+const require_Pagination = require("./components/Pagination/Pagination.cjs");
+exports.Pagination = require_Pagination.Pagination;
+exports.componentPagination = require_pagination.componentPagination;

package/dist/Pagination.d.cts

@@ -0,0 +1,5 @@
+import { ComponentPagination, componentPagination } from "./styleD/build/typescript/component/pagination.cjs";
+import { PartialPaginationTheme } from "./components/Pagination/styles.cjs";
+import { PaginationLabels, PaginationProps, PaginationSummaryInfo } from "./components/Pagination/types.cjs";
+import { Pagination } from "./components/Pagination/Pagination.cjs";
+export { type ComponentPagination, Pagination, type PaginationLabels, type PaginationProps, type PaginationSummaryInfo, type PartialPaginationTheme as PaginationTheme, componentPagination };

package/dist/Pagination.d.ts

@@ -0,0 +1,5 @@
+import { ComponentPagination, componentPagination } from "./styleD/build/typescript/component/pagination.js";
+import { PartialPaginationTheme } from "./components/Pagination/styles.js";
+import { PaginationLabels, PaginationProps, PaginationSummaryInfo } from "./components/Pagination/types.js";
+import { Pagination } from "./components/Pagination/Pagination.js";
+export { type ComponentPagination, Pagination, type PaginationLabels, type PaginationProps, type PaginationSummaryInfo, type PartialPaginationTheme as PaginationTheme, componentPagination };

package/dist/Pagination.js

@@ -0,0 +1,3 @@
+import { componentPagination } from "./styleD/build/typescript/component/pagination.js";
+import { Pagination } from "./components/Pagination/Pagination.js";
+export { Pagination, componentPagination };

package/dist/Typography.d.cts

@@ -1,5 +1,5 @@
 import { ComponentTypography, componentTypography } from "./styleD/build/typescript/component/typography.cjs";
 import { PartialTypographyTheme } from "./components/Typography/styles.cjs";
-import { TypographyProps } from "./components/Typography/types.cjs";
+import { TypographyElement, TypographyProps, TypographyVariant } from "./components/Typography/types.cjs";
 import { Typography } from "./components/Typography/Typography.cjs";
-export { type ComponentTypography, Typography, type TypographyProps, type PartialTypographyTheme as TypographyTheme, componentTypography };
+export { type ComponentTypography, Typography, type TypographyElement, type TypographyProps, type PartialTypographyTheme as TypographyTheme, type TypographyVariant, componentTypography };

package/dist/Typography.d.ts

@@ -1,5 +1,5 @@
 import { ComponentTypography, componentTypography } from "./styleD/build/typescript/component/typography.js";
 import { PartialTypographyTheme } from "./components/Typography/styles.js";
-import { TypographyProps } from "./components/Typography/types.js";
+import { TypographyElement, TypographyProps, TypographyVariant } from "./components/Typography/types.js";
 import { Typography } from "./components/Typography/Typography.js";
-export { type ComponentTypography, Typography, type TypographyProps, type PartialTypographyTheme as TypographyTheme, componentTypography };
+export { type ComponentTypography, Typography, type TypographyElement, type TypographyProps, type PartialTypographyTheme as TypographyTheme, type TypographyVariant, componentTypography };

package/dist/UserMenu.d.cts

@@ -1,3 +1,4 @@
 import { ComponentUserMenu, componentUserMenu } from "./styleD/build/typescript/component/userMenu.cjs";
+import { PartialUserMenuTheme } from "./components/UserMenu/theme.cjs";
 import { UserMenu } from "./components/UserMenu/UserMenu.cjs";
-export { type ComponentUserMenu, UserMenu, componentUserMenu };
+export { type ComponentUserMenu, UserMenu, type PartialUserMenuTheme as UserMenuTheme, componentUserMenu };

package/dist/UserMenu.d.ts

@@ -1,3 +1,4 @@
 import { ComponentUserMenu, componentUserMenu } from "./styleD/build/typescript/component/userMenu.js";
+import { PartialUserMenuTheme } from "./components/UserMenu/theme.js";
 import { UserMenu } from "./components/UserMenu/UserMenu.js";
-export { type ComponentUserMenu, UserMenu, componentUserMenu };
+export { type ComponentUserMenu, UserMenu, type PartialUserMenuTheme as UserMenuTheme, componentUserMenu };

package/dist/components/AlertBanner/styles.d.cts

@@ -1,8 +1,9 @@
-import { Prettify } from "../../util/types.cjs";
+import { DeepPartial, Prettify } from "../../util/types.cjs";
 import { ComponentAlertBanner } from "../../styleD/build/typescript/component/alertBanner.cjs";
 import "./types.cjs";
 import { SerializedStyles } from "@emotion/react";
 //#region src/components/AlertBanner/styles.d.ts
 type AlertBannerTheme = Prettify<ComponentAlertBanner>;
+type PartialAlertBannerTheme = Prettify<DeepPartial<AlertBannerTheme>>;
 //#endregion
-export { AlertBannerTheme };
+export { AlertBannerTheme, PartialAlertBannerTheme };

package/dist/components/AlertBanner/styles.d.ts

@@ -1,8 +1,9 @@
-import { Prettify } from "../../util/types.js";
+import { DeepPartial, Prettify } from "../../util/types.js";
 import { ComponentAlertBanner } from "../../styleD/build/typescript/component/alertBanner.js";
 import "./types.js";
 import { SerializedStyles } from "@emotion/react";
 //#region src/components/AlertBanner/styles.d.ts
 type AlertBannerTheme = Prettify<ComponentAlertBanner>;
+type PartialAlertBannerTheme = Prettify<DeepPartial<AlertBannerTheme>>;
 //#endregion
-export { AlertBannerTheme };
+export { AlertBannerTheme, PartialAlertBannerTheme };

package/dist/components/Badge/types.d.cts

@@ -20,4 +20,4 @@ interface BadgeProps extends DefaultPropsWithChildren<BadgeTheme> {
   weight?: BadgeWeights;
 }
 //#endregion
-export { BadgeColors, BadgeProps, BadgeSizes, BadgeWeights };
+export { BadgeColors, BadgeProps, BadgeSizes };

package/dist/components/Badge/types.d.ts

@@ -20,4 +20,4 @@ interface BadgeProps extends DefaultPropsWithChildren<BadgeTheme> {
   weight?: BadgeWeights;
 }
 //#endregion
-export { BadgeColors, BadgeProps, BadgeSizes, BadgeWeights };
+export { BadgeColors, BadgeProps, BadgeSizes };

package/dist/components/Byline/lib.cjs

@@ -175,4 +175,3 @@ exports.convertNodeToBylineModel = convertNodeToBylineModel;
 exports.detectNameInText = detectNameInText;
 exports.getCurrentText = getCurrentText;
 exports.hasHitContributorLimit = hasHitContributorLimit;
-exports.insertChip = insertChip;

package/dist/components/Byline/lib.d.cts

@@ -1,5 +1,4 @@
 import "prosemirror-model";
-import "prosemirror-state";
 import "prosemirror-view";
 //#region src/components/Byline/lib.d.ts
 type TaggedContributor = {

package/dist/components/Byline/lib.d.ts

@@ -1,4 +1,3 @@
-import "prosemirror-state";
 import { EditorView } from "prosemirror-view";
 import "prosemirror-model";
 //#region src/components/Byline/lib.d.ts

package/dist/components/Byline/lib.js

@@ -168,4 +168,4 @@ const convertNodeToBylineModel = (doc) => {
 	return model;
 };
 //#endregion
-export { addTaggedContributor, addUntaggedContributor, convertBylineModelToNode, convertNodeToBylineModel, detectNameInText, getCurrentText, hasHitContributorLimit, insertChip };
+export { addTaggedContributor, addUntaggedContributor, convertBylineModelToNode, convertNodeToBylineModel, detectNameInText, getCurrentText, hasHitContributorLimit };

package/dist/components/HtmlPreviewLoader/styles.d.cts

@@ -1,7 +1,8 @@
-import { Prettify } from "../../util/types.cjs";
+import { DeepPartial, Prettify } from "../../util/types.cjs";
 import { ComponentHtmlPreviewLoader } from "../../styleD/build/typescript/component/htmlPreviewLoader.cjs";
 import { SerializedStyles } from "@emotion/react";
 //#region src/components/HtmlPreviewLoader/styles.d.ts
 type HtmlPreviewLoaderTheme = Prettify<ComponentHtmlPreviewLoader>;
+type PartialHtmlPreviewLoaderTheme = Prettify<DeepPartial<HtmlPreviewLoaderTheme>>;
 //#endregion
-export { HtmlPreviewLoaderTheme };
+export { HtmlPreviewLoaderTheme, PartialHtmlPreviewLoaderTheme };

package/dist/components/HtmlPreviewLoader/styles.d.ts

@@ -1,7 +1,8 @@
-import { Prettify } from "../../util/types.js";
+import { DeepPartial, Prettify } from "../../util/types.js";
 import { ComponentHtmlPreviewLoader } from "../../styleD/build/typescript/component/htmlPreviewLoader.js";
 import { SerializedStyles } from "@emotion/react";
 //#region src/components/HtmlPreviewLoader/styles.d.ts
 type HtmlPreviewLoaderTheme = Prettify<ComponentHtmlPreviewLoader>;
+type PartialHtmlPreviewLoaderTheme = Prettify<DeepPartial<HtmlPreviewLoaderTheme>>;
 //#endregion
-export { HtmlPreviewLoaderTheme };
+export { HtmlPreviewLoaderTheme, PartialHtmlPreviewLoaderTheme };

package/dist/components/Pagination/Pagination.cjs

@@ -0,0 +1,97 @@
+const require_mergeDeep = require("../../util/mergeDeep.cjs");
+const require_IconButton = require("../IconButton/IconButton.cjs");
+const require_lib = require("./lib.cjs");
+const require_styles = require("./styles.cjs");
+let _emotion_react_jsx_runtime = require("@emotion/react/jsx-runtime");
+let react_aria_components = require("react-aria-components");
+//#region src/components/Pagination/Pagination.tsx
+const defaultLabels = {
+	nav: "Pagination",
+	previous: "Go to previous page",
+	next: "Go to next page",
+	page: (page) => `Go to page ${page}`,
+	status: (currentPage, totalPages) => `Page ${currentPage} of ${totalPages}`
+};
+const clamp = (value, min, max) => Math.min(Math.max(value, min), max);
+const Pagination = ({ currentPage, totalItems, pageSize, onPageChange, siblingCount = 1, boundaryCount = 1, showSummary = true, renderSummary, collapseBelow = "md", labels, theme, cssOverrides, className }) => {
+	const mergedTheme = require_mergeDeep.mergeDeep(require_styles.defaultPaginationTheme, theme ?? {});
+	const mergedLabels = {
+		...defaultLabels,
+		...labels
+	};
+	const safePageSize = Math.max(1, pageSize);
+	const totalPages = require_lib.getTotalPages(totalItems, safePageSize);
+	const page = clamp(currentPage, 1, totalPages);
+	const items = require_lib.getPageRange({
+		currentPage: page,
+		totalPages,
+		siblingCount,
+		boundaryCount
+	});
+	const goTo = (next) => onPageChange(clamp(next, 1, totalPages));
+	const startItem = totalItems === 0 ? 0 : (page - 1) * safePageSize + 1;
+	const endItem = Math.min(page * safePageSize, totalItems);
+	const summary = renderSummary ? renderSummary({
+		currentPage: page,
+		totalPages,
+		totalItems,
+		pageSize: safePageSize,
+		startItem,
+		endItem
+	}) : `Results: ${startItem}\u2013${endItem} of ${totalItems}`;
+	return /* @__PURE__ */ (0, _emotion_react_jsx_runtime.jsxs)("nav", {
+		"aria-label": mergedLabels.nav,
+		className,
+		css: [require_styles.paginationStyles(mergedTheme), cssOverrides],
+		children: [
+			/* @__PURE__ */ (0, _emotion_react_jsx_runtime.jsx)(require_IconButton.IconButton, {
+				variant: "secondary",
+				size: "xs",
+				symbol: "chevron_left",
+				ariaLabel: mergedLabels.previous,
+				isDisabled: page <= 1,
+				onPress: () => goTo(page - 1),
+				cssOverrides: require_styles.arrowStyles(mergedTheme)
+			}),
+			/* @__PURE__ */ (0, _emotion_react_jsx_runtime.jsx)("ul", {
+				css: require_styles.listStyles(mergedTheme, collapseBelow),
+				children: items.map((item, index) => {
+					if (item === "ellipsis") return /* @__PURE__ */ (0, _emotion_react_jsx_runtime.jsx)("li", {
+						"aria-hidden": "true",
+						children: /* @__PURE__ */ (0, _emotion_react_jsx_runtime.jsx)("span", {
+							css: require_styles.ellipsisStyles(mergedTheme),
+							children: "…"
+						})
+					}, `ellipsis-${index}`);
+					const isCurrent = item === page;
+					return /* @__PURE__ */ (0, _emotion_react_jsx_runtime.jsx)("li", { children: /* @__PURE__ */ (0, _emotion_react_jsx_runtime.jsx)(react_aria_components.Button, {
+						"aria-label": mergedLabels.page(item),
+						"aria-current": isCurrent ? "page" : void 0,
+						onPress: () => !isCurrent && goTo(item),
+						css: require_styles.itemStyles(mergedTheme, isCurrent),
+						children: item
+					}) }, item);
+				})
+			}),
+			/* @__PURE__ */ (0, _emotion_react_jsx_runtime.jsx)("span", {
+				css: require_styles.compactStatusStyles(mergedTheme, collapseBelow),
+				children: mergedLabels.status(page, totalPages)
+			}),
+			/* @__PURE__ */ (0, _emotion_react_jsx_runtime.jsx)(require_IconButton.IconButton, {
+				variant: "secondary",
+				size: "xs",
+				symbol: "chevron_right",
+				ariaLabel: mergedLabels.next,
+				isDisabled: page >= totalPages,
+				onPress: () => goTo(page + 1),
+				cssOverrides: require_styles.arrowStyles(mergedTheme)
+			}),
+			showSummary && /* @__PURE__ */ (0, _emotion_react_jsx_runtime.jsx)("span", {
+				css: require_styles.summaryStyles(mergedTheme, collapseBelow),
+				children: summary
+			})
+		]
+	});
+};
+//#endregion
+exports.Pagination = Pagination;

package/dist/components/Pagination/Pagination.d.cts

@@ -0,0 +1,5 @@
+import { PaginationProps } from "./types.cjs";
+//#region src/components/Pagination/Pagination.d.ts
+declare const Pagination: ({ currentPage, totalItems, pageSize, onPageChange, siblingCount, boundaryCount, showSummary, renderSummary, collapseBelow, labels, theme, cssOverrides, className }: PaginationProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+//#endregion
+export { Pagination };

package/dist/components/Pagination/Pagination.d.ts

@@ -0,0 +1,5 @@
+import { PaginationProps } from "./types.js";
+//#region src/components/Pagination/Pagination.d.ts
+declare const Pagination: ({ currentPage, totalItems, pageSize, onPageChange, siblingCount, boundaryCount, showSummary, renderSummary, collapseBelow, labels, theme, cssOverrides, className }: PaginationProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+//#endregion
+export { Pagination };

package/dist/components/Pagination/Pagination.js

@@ -0,0 +1,97 @@
+import { mergeDeep } from "../../util/mergeDeep.js";
+import { IconButton } from "../IconButton/IconButton.js";
+import { getPageRange, getTotalPages } from "./lib.js";
+import { arrowStyles, compactStatusStyles, defaultPaginationTheme, ellipsisStyles, itemStyles, listStyles, paginationStyles, summaryStyles } from "./styles.js";
+import { jsx, jsxs } from "@emotion/react/jsx-runtime";
+import { Button } from "react-aria-components";
+//#region src/components/Pagination/Pagination.tsx
+const defaultLabels = {
+	nav: "Pagination",
+	previous: "Go to previous page",
+	next: "Go to next page",
+	page: (page) => `Go to page ${page}`,
+	status: (currentPage, totalPages) => `Page ${currentPage} of ${totalPages}`
+};
+const clamp = (value, min, max) => Math.min(Math.max(value, min), max);
+const Pagination = ({ currentPage, totalItems, pageSize, onPageChange, siblingCount = 1, boundaryCount = 1, showSummary = true, renderSummary, collapseBelow = "md", labels, theme, cssOverrides, className }) => {
+	const mergedTheme = mergeDeep(defaultPaginationTheme, theme ?? {});
+	const mergedLabels = {
+		...defaultLabels,
+		...labels
+	};
+	const safePageSize = Math.max(1, pageSize);
+	const totalPages = getTotalPages(totalItems, safePageSize);
+	const page = clamp(currentPage, 1, totalPages);
+	const items = getPageRange({
+		currentPage: page,
+		totalPages,
+		siblingCount,
+		boundaryCount
+	});
+	const goTo = (next) => onPageChange(clamp(next, 1, totalPages));
+	const startItem = totalItems === 0 ? 0 : (page - 1) * safePageSize + 1;
+	const endItem = Math.min(page * safePageSize, totalItems);
+	const summary = renderSummary ? renderSummary({
+		currentPage: page,
+		totalPages,
+		totalItems,
+		pageSize: safePageSize,
+		startItem,
+		endItem
+	}) : `Results: ${startItem}\u2013${endItem} of ${totalItems}`;
+	return /* @__PURE__ */ jsxs("nav", {
+		"aria-label": mergedLabels.nav,
+		className,
+		css: [paginationStyles(mergedTheme), cssOverrides],
+		children: [
+			/* @__PURE__ */ jsx(IconButton, {
+				variant: "secondary",
+				size: "xs",
+				symbol: "chevron_left",
+				ariaLabel: mergedLabels.previous,
+				isDisabled: page <= 1,
+				onPress: () => goTo(page - 1),
+				cssOverrides: arrowStyles(mergedTheme)
+			}),
+			/* @__PURE__ */ jsx("ul", {
+				css: listStyles(mergedTheme, collapseBelow),
+				children: items.map((item, index) => {
+					if (item === "ellipsis") return /* @__PURE__ */ jsx("li", {
+						"aria-hidden": "true",
+						children: /* @__PURE__ */ jsx("span", {
+							css: ellipsisStyles(mergedTheme),
+							children: "…"
+						})
+					}, `ellipsis-${index}`);
+					const isCurrent = item === page;
+					return /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(Button, {
+						"aria-label": mergedLabels.page(item),
+						"aria-current": isCurrent ? "page" : void 0,
+						onPress: () => !isCurrent && goTo(item),
+						css: itemStyles(mergedTheme, isCurrent),
+						children: item
+					}) }, item);
+				})
+			}),
+			/* @__PURE__ */ jsx("span", {
+				css: compactStatusStyles(mergedTheme, collapseBelow),
+				children: mergedLabels.status(page, totalPages)
+			}),
+			/* @__PURE__ */ jsx(IconButton, {
+				variant: "secondary",
+				size: "xs",
+				symbol: "chevron_right",
+				ariaLabel: mergedLabels.next,
+				isDisabled: page >= totalPages,
+				onPress: () => goTo(page + 1),
+				cssOverrides: arrowStyles(mergedTheme)
+			}),
+			showSummary && /* @__PURE__ */ jsx("span", {
+				css: summaryStyles(mergedTheme, collapseBelow),
+				children: summary
+			})
+		]
+	});
+};
+//#endregion
+export { Pagination };

package/dist/components/Pagination/lib.cjs

@@ -0,0 +1,30 @@
+//#region src/components/Pagination/lib.ts
+const ELLIPSIS = "ellipsis";
+const range = (start, end) => Array.from({ length: Math.max(0, end - start + 1) }, (_, i) => start + i);
+/** Derive the total number of pages from a total item count and page size. */
+const getTotalPages = (totalItems, pageSize) => Math.max(1, Math.ceil(Math.max(0, totalItems) / Math.max(1, pageSize)));
+/**
+* Build the list of page numbers and ellipsis markers to render, keeping the
+* first/last boundary pages and a window of siblings around the current page.
+*/
+const getPageRange = ({ currentPage, totalPages, siblingCount = 1, boundaryCount = 1 }) => {
+	if (totalPages <= 1) return range(1, totalPages);
+	if (siblingCount * 2 + 3 + boundaryCount * 2 >= totalPages) return range(1, totalPages);
+	const startPages = range(1, boundaryCount);
+	const endPages = range(totalPages - boundaryCount + 1, totalPages);
+	const siblingsStart = Math.max(Math.min(currentPage - siblingCount, totalPages - boundaryCount - siblingCount * 2 - 1), boundaryCount + 2);
+	const siblingsEnd = Math.min(Math.max(currentPage + siblingCount, boundaryCount + siblingCount * 2 + 2), endPages.length > 0 ? endPages[0] - 2 : totalPages - 1);
+	const startEllipsis = siblingsStart > boundaryCount + 2 ? [ELLIPSIS] : boundaryCount + 1 < totalPages - boundaryCount ? [boundaryCount + 1] : [];
+	const endEllipsis = siblingsEnd < totalPages - boundaryCount - 1 ? [ELLIPSIS] : totalPages - boundaryCount > boundaryCount ? [totalPages - boundaryCount] : [];
+	return [
+		...startPages,
+		...startEllipsis,
+		...range(siblingsStart, siblingsEnd),
+		...endEllipsis,
+		...endPages
+	];
+};
+//#endregion
+exports.ELLIPSIS = ELLIPSIS;
+exports.getPageRange = getPageRange;
+exports.getTotalPages = getTotalPages;

package/dist/components/Pagination/lib.js

@@ -0,0 +1,28 @@
+//#region src/components/Pagination/lib.ts
+const ELLIPSIS = "ellipsis";
+const range = (start, end) => Array.from({ length: Math.max(0, end - start + 1) }, (_, i) => start + i);
+/** Derive the total number of pages from a total item count and page size. */
+const getTotalPages = (totalItems, pageSize) => Math.max(1, Math.ceil(Math.max(0, totalItems) / Math.max(1, pageSize)));
+/**
+* Build the list of page numbers and ellipsis markers to render, keeping the
+* first/last boundary pages and a window of siblings around the current page.
+*/
+const getPageRange = ({ currentPage, totalPages, siblingCount = 1, boundaryCount = 1 }) => {
+	if (totalPages <= 1) return range(1, totalPages);
+	if (siblingCount * 2 + 3 + boundaryCount * 2 >= totalPages) return range(1, totalPages);
+	const startPages = range(1, boundaryCount);
+	const endPages = range(totalPages - boundaryCount + 1, totalPages);
+	const siblingsStart = Math.max(Math.min(currentPage - siblingCount, totalPages - boundaryCount - siblingCount * 2 - 1), boundaryCount + 2);
+	const siblingsEnd = Math.min(Math.max(currentPage + siblingCount, boundaryCount + siblingCount * 2 + 2), endPages.length > 0 ? endPages[0] - 2 : totalPages - 1);
+	const startEllipsis = siblingsStart > boundaryCount + 2 ? [ELLIPSIS] : boundaryCount + 1 < totalPages - boundaryCount ? [boundaryCount + 1] : [];
+	const endEllipsis = siblingsEnd < totalPages - boundaryCount - 1 ? [ELLIPSIS] : totalPages - boundaryCount > boundaryCount ? [totalPages - boundaryCount] : [];
+	return [
+		...startPages,
+		...startEllipsis,
+		...range(siblingsStart, siblingsEnd),
+		...endEllipsis,
+		...endPages
+	];
+};
+//#endregion
+export { ELLIPSIS, getPageRange, getTotalPages };

package/dist/components/Pagination/styles.cjs

@@ -0,0 +1,112 @@
+const require_typography = require("../../styleD/utils/semantic/typography.cjs");
+const require_mq = require("../../styleD/utils/semantic/mq.cjs");
+const require_pagination = require("../../styleD/build/typescript/component/pagination.cjs");
+let _emotion_react = require("@emotion/react");
+//#region src/components/Pagination/styles.ts
+const defaultPaginationTheme = require_pagination.componentPagination;
+const paginationStyles = (theme) => _emotion_react.css`
+	display: ${theme.shared.display};
+	align-items: ${theme.shared.alignItems};
+	gap: ${theme.shared.gap};
+`;
+const listStyles = (theme, collapseBelow) => _emotion_react.css`
+	display: ${theme.shared.display};
+	align-items: ${theme.shared.alignItems};
+	gap: ${theme.shared.gap};
+	margin: 0;
+	padding: 0;
+	list-style: none;
+
+	${require_mq.until[collapseBelow]} {
+		display: none;
+	}
+`;
+const itemStyles = (theme, isCurrent) => {
+	const item = theme.item;
+	const typography = isCurrent ? item.current.typography : item.typography;
+	return _emotion_react.css`
+		display: inline-flex;
+		align-items: center;
+		justify-content: center;
+		box-sizing: border-box;
+		min-width: ${item.minWidth};
+		height: ${item.height};
+		padding: ${item.paddingY} ${item.paddingX};
+		border-radius: ${item.borderRadius};
+		border: ${item.borderWidth} ${item.borderStyle}
+			${isCurrent ? item.current.borderColor : item.borderColor};
+		background-color: ${isCurrent ? item.current.backgroundColor : item.backgroundColor};
+		color: ${isCurrent ? item.current.color : item.color};
+		cursor: ${isCurrent ? "default" : item.cursor};
+		${require_typography.convertTypographyToEmotionStringStyle(typography)}
+
+		&[data-hovered]:not([aria-current='page']) {
+			background-color: ${item.hover.backgroundColor};
+			border-color: ${item.hover.borderColor};
+		}
+
+		&[data-pressed]:not([aria-current='page']) {
+			background-color: ${item.active.backgroundColor};
+		}
+
+		&[data-focus-visible] {
+			outline: ${item.focusVisible.outlineWidth} solid
+				${item.focusVisible.outlineColor};
+			outline-offset: ${item.focusVisible.outlineOffset};
+		}
+
+		&[data-disabled] {
+			color: ${item.disabled.color};
+			background-color: ${item.disabled.backgroundColor};
+			border-color: ${item.disabled.borderColor};
+			cursor: ${item.disabled.cursor};
+		}
+	`;
+};
+const ellipsisStyles = (theme) => _emotion_react.css`
+	box-sizing: border-box;
+	display: inline-flex;
+	align-items: center;
+	justify-content: center;
+	width: ${theme.ellipsis.minWidth};
+	min-width: ${theme.ellipsis.minWidth};
+	height: ${theme.item.height};
+	color: ${theme.ellipsis.color};
+`;
+const arrowStyles = (theme) => _emotion_react.css`
+	box-sizing: border-box;
+	width: ${theme.item.height};
+	min-width: ${theme.item.height};
+	height: ${theme.item.height};
+`;
+const summaryStyles = (theme, collapseBelow) => _emotion_react.css`
+	margin-left: ${theme.summary.marginLeft};
+	color: ${theme.summary.color};
+	white-space: nowrap;
+	${require_typography.convertTypographyToEmotionStringStyle(theme.summary.typography)}
+
+	${require_mq.until[collapseBelow]} {
+		display: none;
+	}
+`;
+const compactStatusStyles = (theme, collapseBelow) => _emotion_react.css`
+	display: none;
+	flex: 1;
+	text-align: center;
+	white-space: nowrap;
+	color: ${theme.summary.color};
+	${require_typography.convertTypographyToEmotionStringStyle(theme.summary.typography)}
+
+	${require_mq.until[collapseBelow]} {
+		display: block;
+	}
+`;
+//#endregion
+exports.arrowStyles = arrowStyles;
+exports.compactStatusStyles = compactStatusStyles;
+exports.defaultPaginationTheme = defaultPaginationTheme;
+exports.ellipsisStyles = ellipsisStyles;
+exports.itemStyles = itemStyles;
+exports.listStyles = listStyles;
+exports.paginationStyles = paginationStyles;
+exports.summaryStyles = summaryStyles;

package/dist/components/Pagination/styles.d.cts

@@ -0,0 +1,8 @@
+import { DeepPartial, Prettify } from "../../util/types.cjs";
+import { ComponentPagination } from "../../styleD/build/typescript/component/pagination.cjs";
+import { SerializedStyles } from "@emotion/react";
+//#region src/components/Pagination/styles.d.ts
+type PaginationTheme = Prettify<ComponentPagination>;
+type PartialPaginationTheme = Prettify<DeepPartial<PaginationTheme>>;
+//#endregion
+export { PaginationTheme, PartialPaginationTheme };

package/dist/components/Pagination/styles.d.ts

@@ -0,0 +1,8 @@
+import { DeepPartial, Prettify } from "../../util/types.js";
+import { ComponentPagination } from "../../styleD/build/typescript/component/pagination.js";
+import { SerializedStyles } from "@emotion/react";
+//#region src/components/Pagination/styles.d.ts
+type PaginationTheme = Prettify<ComponentPagination>;
+type PartialPaginationTheme = Prettify<DeepPartial<PaginationTheme>>;
+//#endregion
+export { PaginationTheme, PartialPaginationTheme };