@yahoo/uds-mobile 2.18.0 → 2.19.0

package/dist/components/Pagination/Pagination.cjs

@@ -0,0 +1,75 @@
+/*! © 2026 Yahoo, Inc. UDS Mobile v0.0.0-development */
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+require("../../_virtual/_rolldown/runtime.cjs");
+const require_components_HStack = require("../HStack.cjs");
+const require_components_Pagination_paginationContext = require("./paginationContext.cjs");
+const require_components_Pagination_paginationTheme = require("./paginationTheme.cjs");
+let react = require("react");
+let react_jsx_runtime = require("react/jsx-runtime");
+let react_native_unistyles = require("react-native-unistyles");
+//#region src/components/Pagination/Pagination.tsx
+/**
+* **Pagination — numbered page navigation component**
+*
+* @description
+* Compose with `PaginationPrev`, `PaginationNumbers`, and `PaginationNext`.
+* The consumer owns `activePage` state.
+*
+* @category Navigation
+* @platform mobile
+*
+* @example
+* ```tsx
+* import {
+*   Pagination,
+*   PaginationNext,
+*   PaginationNumbers,
+*   PaginationPrev,
+* } from '@yahoo/uds-mobile/Pagination';
+*
+* <Pagination activePage={page} totalPages={10} onPageChange={setPage} accessibilityLabel="Results">
+*   <PaginationPrev />
+*   <PaginationNumbers />
+*   <PaginationNext />
+* </Pagination>
+* ```
+*/
+const Pagination = (0, react.memo)(function Pagination({ activePage, totalPages, maxVisiblePageNumbers = 7, ellipsisPlacement = "none", size = "md", variant = "default", getPageHref, getItemAriaLabel = require_components_Pagination_paginationContext.defaultGetItemAriaLabel, onPageChange, children, accessibilityLabel = "Pagination", ...rest }) {
+	const { theme } = (0, react_native_unistyles.useUnistyles)();
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_Pagination_paginationContext.PaginationProvider, {
+		value: (0, react.useMemo)(() => ({
+			activePage,
+			totalPages,
+			maxVisiblePageNumbers,
+			ellipsisPlacement,
+			size,
+			variant,
+			getPageHref,
+			getItemAriaLabel,
+			onPageChange
+		}), [
+			activePage,
+			totalPages,
+			maxVisiblePageNumbers,
+			ellipsisPlacement,
+			size,
+			variant,
+			getPageHref,
+			getItemAriaLabel,
+			onPageChange
+		]),
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_HStack.HStack, {
+			alignItems: "center",
+			justifyContent: "center",
+			accessibilityLabel,
+			accessibilityRole: "none",
+			gap: (0, react.useMemo)(() => require_components_Pagination_paginationTheme.getPaginationRootGapStyle(theme, size), [size, theme]).gap,
+			alignSelf: "stretch",
+			...rest,
+			children
+		})
+	});
+});
+Pagination.displayName = "Pagination";
+//#endregion
+exports.Pagination = Pagination;

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

@@ -0,0 +1,40 @@
+
+import { UniversalPaginationProps } from "../../types/dist/index.cjs";
+import * as _$react from "react";
+import { ViewProps } from "react-native";
+
+//#region src/components/Pagination/Pagination.d.ts
+interface PaginationProps extends Omit<UniversalPaginationProps, 'className' | 'children'>, Pick<ViewProps, 'children'> {
+  /** Accessible label for the pagination control group. @default 'Pagination' */
+  accessibilityLabel?: string;
+}
+/**
+ * **Pagination — numbered page navigation component**
+ *
+ * @description
+ * Compose with `PaginationPrev`, `PaginationNumbers`, and `PaginationNext`.
+ * The consumer owns `activePage` state.
+ *
+ * @category Navigation
+ * @platform mobile
+ *
+ * @example
+ * ```tsx
+ * import {
+ *   Pagination,
+ *   PaginationNext,
+ *   PaginationNumbers,
+ *   PaginationPrev,
+ * } from '@yahoo/uds-mobile/Pagination';
+ *
+ * <Pagination activePage={page} totalPages={10} onPageChange={setPage} accessibilityLabel="Results">
+ *   <PaginationPrev />
+ *   <PaginationNumbers />
+ *   <PaginationNext />
+ * </Pagination>
+ * ```
+ */
+declare const Pagination: _$react.NamedExoticComponent<PaginationProps>;
+//#endregion
+export { Pagination, type PaginationProps };
+//# sourceMappingURL=Pagination.d.cts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Pagination.d.cts","names":[],"sources":["../../../src/components/Pagination/Pagination.tsx"],"mappings":";;;;;;UAWU,eAAA,SACA,IAAA,CAAK,wBAAA,6BAAqD,IAAA,CAAK,SAAA;;EAEvE,kBAAA;AAAA;;;;;;;;;;;;;;;;AAAkB;;;;;;;;;;;cA6Bd,UAAA,EAAU,OAAA,CAAA,oBAAA,CAAA,eAAA"}

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

@@ -0,0 +1,40 @@
+
+import { UniversalPaginationProps } from "../../types/dist/index.js";
+import * as _$react from "react";
+import { ViewProps } from "react-native";
+
+//#region src/components/Pagination/Pagination.d.ts
+interface PaginationProps extends Omit<UniversalPaginationProps, 'className' | 'children'>, Pick<ViewProps, 'children'> {
+  /** Accessible label for the pagination control group. @default 'Pagination' */
+  accessibilityLabel?: string;
+}
+/**
+ * **Pagination — numbered page navigation component**
+ *
+ * @description
+ * Compose with `PaginationPrev`, `PaginationNumbers`, and `PaginationNext`.
+ * The consumer owns `activePage` state.
+ *
+ * @category Navigation
+ * @platform mobile
+ *
+ * @example
+ * ```tsx
+ * import {
+ *   Pagination,
+ *   PaginationNext,
+ *   PaginationNumbers,
+ *   PaginationPrev,
+ * } from '@yahoo/uds-mobile/Pagination';
+ *
+ * <Pagination activePage={page} totalPages={10} onPageChange={setPage} accessibilityLabel="Results">
+ *   <PaginationPrev />
+ *   <PaginationNumbers />
+ *   <PaginationNext />
+ * </Pagination>
+ * ```
+ */
+declare const Pagination: _$react.NamedExoticComponent<PaginationProps>;
+//#endregion
+export { Pagination, type PaginationProps };
+//# sourceMappingURL=Pagination.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Pagination.d.ts","names":[],"sources":["../../../src/components/Pagination/Pagination.tsx"],"mappings":";;;;;;UAWU,eAAA,SACA,IAAA,CAAK,wBAAA,6BAAqD,IAAA,CAAK,SAAA;;EAEvE,kBAAA;AAAA;;;;;;;;;;;;;;;;AAAkB;;;;;;;;;;;cA6Bd,UAAA,EAAU,OAAA,CAAA,oBAAA,CAAA,eAAA"}

package/dist/components/Pagination/Pagination.js

@@ -0,0 +1,75 @@
+/*! © 2026 Yahoo, Inc. UDS Mobile v0.0.0-development */
+import { HStack } from "../HStack.js";
+import { PaginationProvider, defaultGetItemAriaLabel } from "./paginationContext.js";
+import { getPaginationRootGapStyle } from "./paginationTheme.js";
+import { memo, useMemo } from "react";
+import { jsx } from "react/jsx-runtime";
+import { useUnistyles } from "react-native-unistyles";
+//#region src/components/Pagination/Pagination.tsx
+/**
+* **Pagination — numbered page navigation component**
+*
+* @description
+* Compose with `PaginationPrev`, `PaginationNumbers`, and `PaginationNext`.
+* The consumer owns `activePage` state.
+*
+* @category Navigation
+* @platform mobile
+*
+* @example
+* ```tsx
+* import {
+*   Pagination,
+*   PaginationNext,
+*   PaginationNumbers,
+*   PaginationPrev,
+* } from '@yahoo/uds-mobile/Pagination';
+*
+* <Pagination activePage={page} totalPages={10} onPageChange={setPage} accessibilityLabel="Results">
+*   <PaginationPrev />
+*   <PaginationNumbers />
+*   <PaginationNext />
+* </Pagination>
+* ```
+*/
+const Pagination = memo(function Pagination({ activePage, totalPages, maxVisiblePageNumbers = 7, ellipsisPlacement = "none", size = "md", variant = "default", getPageHref, getItemAriaLabel = defaultGetItemAriaLabel, onPageChange, children, accessibilityLabel = "Pagination", ...rest }) {
+	const { theme } = useUnistyles();
+	return /* @__PURE__ */ jsx(PaginationProvider, {
+		value: useMemo(() => ({
+			activePage,
+			totalPages,
+			maxVisiblePageNumbers,
+			ellipsisPlacement,
+			size,
+			variant,
+			getPageHref,
+			getItemAriaLabel,
+			onPageChange
+		}), [
+			activePage,
+			totalPages,
+			maxVisiblePageNumbers,
+			ellipsisPlacement,
+			size,
+			variant,
+			getPageHref,
+			getItemAriaLabel,
+			onPageChange
+		]),
+		children: /* @__PURE__ */ jsx(HStack, {
+			alignItems: "center",
+			justifyContent: "center",
+			accessibilityLabel,
+			accessibilityRole: "none",
+			gap: useMemo(() => getPaginationRootGapStyle(theme, size), [size, theme]).gap,
+			alignSelf: "stretch",
+			...rest,
+			children
+		})
+	});
+});
+Pagination.displayName = "Pagination";
+//#endregion
+export { Pagination };
+
+//# sourceMappingURL=Pagination.js.map

package/dist/components/Pagination/Pagination.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Pagination.js","names":[],"sources":["../../../src/components/Pagination/Pagination.tsx"],"sourcesContent":["import type { UniversalPaginationProps } from '@yahoo/uds-types';\nimport { memo, useMemo } from 'react';\nimport type { ViewProps } from 'react-native';\n// eslint-disable-next-line uds/no-use-unistyles -- root gap from pagination size tokens\nimport { useUnistyles } from 'react-native-unistyles';\n\nimport type { StyleProps } from '../../../generated/styles';\nimport { HStack } from '../HStack';\nimport { defaultGetItemAriaLabel, PaginationProvider } from './paginationContext';\nimport { getPaginationRootGapStyle } from './paginationTheme';\n\ninterface PaginationProps\n  extends Omit<UniversalPaginationProps, 'className' | 'children'>, Pick<ViewProps, 'children'> {\n  /** Accessible label for the pagination control group. @default 'Pagination' */\n  accessibilityLabel?: string;\n}\n\n/**\n * **Pagination — numbered page navigation component**\n *\n * @description\n * Compose with `PaginationPrev`, `PaginationNumbers`, and `PaginationNext`.\n * The consumer owns `activePage` state.\n *\n * @category Navigation\n * @platform mobile\n *\n * @example\n * ```tsx\n * import {\n *   Pagination,\n *   PaginationNext,\n *   PaginationNumbers,\n *   PaginationPrev,\n * } from '@yahoo/uds-mobile/Pagination';\n *\n * <Pagination activePage={page} totalPages={10} onPageChange={setPage} accessibilityLabel=\"Results\">\n *   <PaginationPrev />\n *   <PaginationNumbers />\n *   <PaginationNext />\n * </Pagination>\n * ```\n */\nconst Pagination = memo(function Pagination({\n  activePage,\n  totalPages,\n  maxVisiblePageNumbers = 7,\n  ellipsisPlacement = 'none',\n  size = 'md',\n  variant = 'default',\n  getPageHref,\n  getItemAriaLabel = defaultGetItemAriaLabel,\n  onPageChange,\n  children,\n  accessibilityLabel = 'Pagination',\n  ...rest\n}: PaginationProps) {\n  const { theme } = useUnistyles();\n\n  const contextValue = useMemo(\n    () => ({\n      activePage,\n      totalPages,\n      maxVisiblePageNumbers,\n      ellipsisPlacement,\n      size,\n      variant,\n      getPageHref,\n      getItemAriaLabel,\n      onPageChange,\n    }),\n    [\n      activePage,\n      totalPages,\n      maxVisiblePageNumbers,\n      ellipsisPlacement,\n      size,\n      variant,\n      getPageHref,\n      getItemAriaLabel,\n      onPageChange,\n    ],\n  );\n\n  const rootGapStyle = useMemo(() => getPaginationRootGapStyle(theme, size), [size, theme]);\n\n  return (\n    <PaginationProvider value={contextValue}>\n      <HStack\n        alignItems=\"center\"\n        justifyContent=\"center\"\n        accessibilityLabel={accessibilityLabel}\n        accessibilityRole=\"none\"\n        gap={rootGapStyle.gap as StyleProps['columnGap'] | undefined}\n        alignSelf=\"stretch\"\n        {...rest}\n      >\n        {children}\n      </HStack>\n    </PaginationProvider>\n  );\n});\n\nPagination.displayName = 'Pagination';\n\nexport { Pagination, type PaginationProps };\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2CA,MAAM,aAAa,KAAK,SAAS,WAAW,EAC1C,YACA,YACA,wBAAwB,GACxB,oBAAoB,QACpB,OAAO,MACP,UAAU,WACV,aACA,mBAAmB,yBACnB,cACA,UACA,qBAAqB,cACrB,GAAG,QACe;CAClB,MAAM,EAAE,UAAU,cAAc;CA6BhC,OACE,oBAAC,oBAAD;EAAoB,OA5BD,eACZ;GACL;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACD,GACD;GACE;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACD,CAMsC;YACrC,oBAAC,QAAD;GACE,YAAW;GACX,gBAAe;GACK;GACpB,mBAAkB;GAClB,KATe,cAAc,0BAA0B,OAAO,KAAK,EAAE,CAAC,MAAM,MAAM,CASjE,CAAC;GAClB,WAAU;GACV,GAAI;GAEH;GACM,CAAA;EACU,CAAA;EAEvB;AAEF,WAAW,cAAc"}

package/dist/components/Pagination/PaginationEllipsis.cjs

@@ -0,0 +1,64 @@
+/*! © 2026 Yahoo, Inc. UDS Mobile v0.0.0-development */
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+require("../../_virtual/_rolldown/runtime.cjs");
+const require_components_Text = require("../Text.cjs");
+const require_components_Pagination_paginationContext = require("./paginationContext.cjs");
+const require_components_Pagination_paginationTheme = require("./paginationTheme.cjs");
+let react = require("react");
+let react_native = require("react-native");
+let react_jsx_runtime = require("react/jsx-runtime");
+let react_native_unistyles = require("react-native-unistyles");
+//#region src/components/Pagination/PaginationEllipsis.tsx
+/**
+* **PaginationEllipsis — truncated page range indicator**
+*
+* @description
+* Non-interactive ellipsis shown when page numbers are collapsed.
+*
+* @category Navigation
+* @platform mobile
+*/
+const PaginationEllipsis = (0, react.memo)(function PaginationEllipsis({ style }) {
+	const { size, variant } = require_components_Pagination_paginationContext.usePaginationContext();
+	const { theme } = (0, react_native_unistyles.useUnistyles)();
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_native.View, {
+		accessibilityElementsHidden: true,
+		importantForAccessibility: "no-hide-descendants",
+		style: (0, react.useMemo)(() => {
+			const { controlSize, borderRadius } = require_components_Pagination_paginationTheme.getPaginationControlMetrics(theme, size);
+			return [
+				paginationStaticStyles.root,
+				require_components_Pagination_paginationTheme.getMergedPaginationControlRootStyle(theme, size, variant, "off", "rest"),
+				{
+					borderRadius,
+					height: controlSize,
+					width: controlSize
+				},
+				style
+			];
+		}, [
+			size,
+			style,
+			theme,
+			variant
+		]),
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_Text.Text, {
+			color: "inherit",
+			variant: "inherit",
+			style: (0, react.useMemo)(() => require_components_Pagination_paginationTheme.getMergedPaginationTextStyle(theme, size, variant, "off", "rest"), [
+				size,
+				theme,
+				variant
+			]),
+			children: "…"
+		})
+	});
+});
+PaginationEllipsis.displayName = "PaginationEllipsis";
+const paginationStaticStyles = react_native.StyleSheet.create({ root: {
+	alignItems: "center",
+	justifyContent: "center",
+	flexShrink: 0
+} });
+//#endregion
+exports.PaginationEllipsis = PaginationEllipsis;

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

@@ -0,0 +1,21 @@
+
+import * as _$react from "react";
+import { StyleProp, ViewStyle } from "react-native";
+
+//#region src/components/Pagination/PaginationEllipsis.d.ts
+interface PaginationEllipsisProps {
+  style?: StyleProp<ViewStyle>;
+}
+/**
+ * **PaginationEllipsis — truncated page range indicator**
+ *
+ * @description
+ * Non-interactive ellipsis shown when page numbers are collapsed.
+ *
+ * @category Navigation
+ * @platform mobile
+ */
+declare const PaginationEllipsis: _$react.NamedExoticComponent<PaginationEllipsisProps>;
+//#endregion
+export { PaginationEllipsis, type PaginationEllipsisProps };
+//# sourceMappingURL=PaginationEllipsis.d.cts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"PaginationEllipsis.d.cts","names":[],"sources":["../../../src/components/Pagination/PaginationEllipsis.tsx"],"mappings":";;;;;UAcU,uBAAA;EACR,KAAA,GAAQ,SAAA,CAAU,SAAA;AAAA;AAdqC;;;;;;;;;AAAA,cA0BnD,kBAAA,EAAkB,OAAA,CAAA,oBAAA,CAAA,uBAAA"}

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

@@ -0,0 +1,21 @@
+
+import * as _$react from "react";
+import { StyleProp, ViewStyle } from "react-native";
+
+//#region src/components/Pagination/PaginationEllipsis.d.ts
+interface PaginationEllipsisProps {
+  style?: StyleProp<ViewStyle>;
+}
+/**
+ * **PaginationEllipsis — truncated page range indicator**
+ *
+ * @description
+ * Non-interactive ellipsis shown when page numbers are collapsed.
+ *
+ * @category Navigation
+ * @platform mobile
+ */
+declare const PaginationEllipsis: _$react.NamedExoticComponent<PaginationEllipsisProps>;
+//#endregion
+export { PaginationEllipsis, type PaginationEllipsisProps };
+//# sourceMappingURL=PaginationEllipsis.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"PaginationEllipsis.d.ts","names":[],"sources":["../../../src/components/Pagination/PaginationEllipsis.tsx"],"mappings":";;;;;UAcU,uBAAA;EACR,KAAA,GAAQ,SAAA,CAAU,SAAA;AAAA;AAdqC;;;;;;;;;AAAA,cA0BnD,kBAAA,EAAkB,OAAA,CAAA,oBAAA,CAAA,uBAAA"}

package/dist/components/Pagination/PaginationEllipsis.js

@@ -0,0 +1,64 @@
+/*! © 2026 Yahoo, Inc. UDS Mobile v0.0.0-development */
+import { Text as Text$1 } from "../Text.js";
+import { usePaginationContext } from "./paginationContext.js";
+import { getMergedPaginationControlRootStyle, getMergedPaginationTextStyle, getPaginationControlMetrics } from "./paginationTheme.js";
+import { memo, useMemo } from "react";
+import { StyleSheet, View } from "react-native";
+import { jsx } from "react/jsx-runtime";
+import { useUnistyles } from "react-native-unistyles";
+//#region src/components/Pagination/PaginationEllipsis.tsx
+/**
+* **PaginationEllipsis — truncated page range indicator**
+*
+* @description
+* Non-interactive ellipsis shown when page numbers are collapsed.
+*
+* @category Navigation
+* @platform mobile
+*/
+const PaginationEllipsis = memo(function PaginationEllipsis({ style }) {
+	const { size, variant } = usePaginationContext();
+	const { theme } = useUnistyles();
+	return /* @__PURE__ */ jsx(View, {
+		accessibilityElementsHidden: true,
+		importantForAccessibility: "no-hide-descendants",
+		style: useMemo(() => {
+			const { controlSize, borderRadius } = getPaginationControlMetrics(theme, size);
+			return [
+				paginationStaticStyles.root,
+				getMergedPaginationControlRootStyle(theme, size, variant, "off", "rest"),
+				{
+					borderRadius,
+					height: controlSize,
+					width: controlSize
+				},
+				style
+			];
+		}, [
+			size,
+			style,
+			theme,
+			variant
+		]),
+		children: /* @__PURE__ */ jsx(Text$1, {
+			color: "inherit",
+			variant: "inherit",
+			style: useMemo(() => getMergedPaginationTextStyle(theme, size, variant, "off", "rest"), [
+				size,
+				theme,
+				variant
+			]),
+			children: "…"
+		})
+	});
+});
+PaginationEllipsis.displayName = "PaginationEllipsis";
+const paginationStaticStyles = StyleSheet.create({ root: {
+	alignItems: "center",
+	justifyContent: "center",
+	flexShrink: 0
+} });
+//#endregion
+export { PaginationEllipsis };
+
+//# sourceMappingURL=PaginationEllipsis.js.map

package/dist/components/Pagination/PaginationEllipsis.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PaginationEllipsis.js","names":["Text"],"sources":["../../../src/components/Pagination/PaginationEllipsis.tsx"],"sourcesContent":["import { memo, useMemo } from 'react';\nimport type { StyleProp, ViewStyle } from 'react-native';\nimport { StyleSheet, View } from 'react-native';\n// eslint-disable-next-line uds/no-use-unistyles -- pagination token lookups\nimport { useUnistyles } from 'react-native-unistyles';\n\nimport { Text } from '../Text';\nimport { usePaginationContext } from './paginationContext';\nimport {\n  getMergedPaginationControlRootStyle,\n  getMergedPaginationTextStyle,\n  getPaginationControlMetrics,\n} from './paginationTheme';\n\ninterface PaginationEllipsisProps {\n  style?: StyleProp<ViewStyle>;\n}\n\n/**\n * **PaginationEllipsis — truncated page range indicator**\n *\n * @description\n * Non-interactive ellipsis shown when page numbers are collapsed.\n *\n * @category Navigation\n * @platform mobile\n */\nconst PaginationEllipsis = memo(function PaginationEllipsis({ style }: PaginationEllipsisProps) {\n  const { size, variant } = usePaginationContext();\n  const { theme } = useUnistyles();\n\n  const rootStyle = useMemo<StyleProp<ViewStyle>>(() => {\n    const { controlSize, borderRadius } = getPaginationControlMetrics(theme, size);\n\n    return [\n      paginationStaticStyles.root,\n      getMergedPaginationControlRootStyle(theme, size, variant, 'off', 'rest'),\n      {\n        borderRadius,\n        height: controlSize,\n        width: controlSize,\n      },\n      style,\n    ];\n  }, [size, style, theme, variant]);\n\n  const textStyle = useMemo(\n    () => getMergedPaginationTextStyle(theme, size, variant, 'off', 'rest'),\n    [size, theme, variant],\n  );\n\n  return (\n    <View\n      accessibilityElementsHidden\n      importantForAccessibility=\"no-hide-descendants\"\n      style={rootStyle}\n    >\n      <Text color=\"inherit\" variant=\"inherit\" style={textStyle}>\n        …\n      </Text>\n    </View>\n  );\n});\n\nPaginationEllipsis.displayName = 'PaginationEllipsis';\n\nconst paginationStaticStyles = StyleSheet.create({\n  root: {\n    alignItems: 'center',\n    justifyContent: 'center',\n    flexShrink: 0,\n  },\n});\n\nexport { PaginationEllipsis, type PaginationEllipsisProps };\n"],"mappings":";;;;;;;;;;;;;;;;;;AA2BA,MAAM,qBAAqB,KAAK,SAAS,mBAAmB,EAAE,SAAkC;CAC9F,MAAM,EAAE,MAAM,YAAY,sBAAsB;CAChD,MAAM,EAAE,UAAU,cAAc;CAsBhC,OACE,oBAAC,MAAD;EACE,6BAAA;EACA,2BAA0B;EAC1B,OAxBc,cAAoC;GACpD,MAAM,EAAE,aAAa,iBAAiB,4BAA4B,OAAO,KAAK;GAE9E,OAAO;IACL,uBAAuB;IACvB,oCAAoC,OAAO,MAAM,SAAS,OAAO,OAAO;IACxE;KACE;KACA,QAAQ;KACR,OAAO;KACR;IACD;IACD;KACA;GAAC;GAAM;GAAO;GAAO;GAAQ,CAWZ;YAEhB,oBAACA,QAAD;GAAM,OAAM;GAAU,SAAQ;GAAU,OAX1B,cACV,6BAA6B,OAAO,MAAM,SAAS,OAAO,OAAO,EACvE;IAAC;IAAM;IAAO;IAAQ,CASoC;aAAE;GAEnD,CAAA;EACF,CAAA;EAET;AAEF,mBAAmB,cAAc;AAEjC,MAAM,yBAAyB,WAAW,OAAO,EAC/C,MAAM;CACJ,YAAY;CACZ,gBAAgB;CAChB,YAAY;CACb,EACF,CAAC"}

package/dist/components/Pagination/PaginationItem.cjs

@@ -0,0 +1,68 @@
+/*! © 2026 Yahoo, Inc. UDS Mobile v0.0.0-development */
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+require("../../_virtual/_rolldown/runtime.cjs");
+const require_components_Text = require("../Text.cjs");
+const require_components_Pagination_paginationContext = require("./paginationContext.cjs");
+const require_components_Pagination_usePaginationControlStyles = require("./usePaginationControlStyles.cjs");
+let react = require("react");
+let react_native = require("react-native");
+let react_jsx_runtime = require("react/jsx-runtime");
+//#region src/components/Pagination/PaginationItem.tsx
+/**
+* **PaginationItem — single page control**
+*
+* @description
+* Renders a page number control. Usually composed via {@link PaginationNumbers}.
+*
+* @category Navigation
+* @platform mobile
+*/
+const PaginationItem = (0, react.memo)(function PaginationItem({ page, children, onPress, ...rest }) {
+	const { activePage, size, variant, getItemAriaLabel, onPageChange } = require_components_Pagination_paginationContext.usePaginationContext();
+	const isActive = page === activePage;
+	const [pressed, setPressed] = (0, react.useState)(false);
+	const { rootStyle, textStyle } = require_components_Pagination_usePaginationControlStyles.usePaginationControlStyles({
+		size,
+		variant,
+		isActive,
+		pressed
+	});
+	const handlePress = (0, react.useCallback)((event) => {
+		onPress?.(event);
+		if (!isActive) onPageChange?.(page);
+	}, [
+		isActive,
+		onPageChange,
+		onPress,
+		page
+	]);
+	const label = children ?? page;
+	const resolvedTextColor = (0, react.useMemo)(() => {
+		const flat = react_native.StyleSheet.flatten(textStyle);
+		return typeof flat?.color === "string" ? flat.color : void 0;
+	}, [textStyle]);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_native.Pressable, {
+		accessibilityLabel: getItemAriaLabel(page, isActive),
+		accessibilityRole: "button",
+		accessibilityState: {
+			disabled: isActive,
+			selected: isActive
+		},
+		disabled: isActive,
+		onPress: isActive ? void 0 : handlePress,
+		onPressIn: () => setPressed(true),
+		onPressOut: () => setPressed(false),
+		style: rootStyle,
+		...rest,
+		children: typeof label === "string" || typeof label === "number" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_Text.Text, {
+			color: "inherit",
+			variant: "inherit",
+			style: textStyle,
+			dangerouslySetColor: resolvedTextColor,
+			children: label
+		}) : label
+	});
+});
+PaginationItem.displayName = "PaginationItem";
+//#endregion
+exports.PaginationItem = PaginationItem;

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

@@ -0,0 +1,24 @@
+
+import { UniversalPaginationItemProps } from "../../types/dist/index.cjs";
+import * as _$react from "react";
+import { PressableProps } from "react-native";
+
+//#region src/components/Pagination/PaginationItem.d.ts
+/** RN Pressable types differ from web button HTML attributes; keep parity fields only. */
+interface PaginationItemProps extends Omit<PressableProps, 'children' | 'style' | 'disabled'> {
+  page: UniversalPaginationItemProps['page'];
+  children?: UniversalPaginationItemProps['children'];
+}
+/**
+ * **PaginationItem — single page control**
+ *
+ * @description
+ * Renders a page number control. Usually composed via {@link PaginationNumbers}.
+ *
+ * @category Navigation
+ * @platform mobile
+ */
+declare const PaginationItem: _$react.NamedExoticComponent<PaginationItemProps>;
+//#endregion
+export { PaginationItem, type PaginationItemProps };
+//# sourceMappingURL=PaginationItem.d.cts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"PaginationItem.d.cts","names":[],"sources":["../../../src/components/Pagination/PaginationItem.tsx"],"mappings":";;;;;;;UAUU,mBAAA,SAA4B,IAAA,CAAK,cAAA;EACzC,IAAA,EAAM,4BAAA;EACN,QAAA,GAAW,4BAAA;AAAA;;;;;;;;;;cAYP,cAAA,EAAc,OAAA,CAAA,oBAAA,CAAA,mBAAA"}

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

@@ -0,0 +1,24 @@
+
+import { UniversalPaginationItemProps } from "../../types/dist/index.js";
+import * as _$react from "react";
+import { PressableProps } from "react-native";
+
+//#region src/components/Pagination/PaginationItem.d.ts
+/** RN Pressable types differ from web button HTML attributes; keep parity fields only. */
+interface PaginationItemProps extends Omit<PressableProps, 'children' | 'style' | 'disabled'> {
+  page: UniversalPaginationItemProps['page'];
+  children?: UniversalPaginationItemProps['children'];
+}
+/**
+ * **PaginationItem — single page control**
+ *
+ * @description
+ * Renders a page number control. Usually composed via {@link PaginationNumbers}.
+ *
+ * @category Navigation
+ * @platform mobile
+ */
+declare const PaginationItem: _$react.NamedExoticComponent<PaginationItemProps>;
+//#endregion
+export { PaginationItem, type PaginationItemProps };
+//# sourceMappingURL=PaginationItem.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"PaginationItem.d.ts","names":[],"sources":["../../../src/components/Pagination/PaginationItem.tsx"],"mappings":";;;;;;;UAUU,mBAAA,SAA4B,IAAA,CAAK,cAAA;EACzC,IAAA,EAAM,4BAAA;EACN,QAAA,GAAW,4BAAA;AAAA;;;;;;;;;;cAYP,cAAA,EAAc,OAAA,CAAA,oBAAA,CAAA,mBAAA"}

package/dist/components/Pagination/PaginationItem.js

@@ -0,0 +1,68 @@
+/*! © 2026 Yahoo, Inc. UDS Mobile v0.0.0-development */
+import { Text as Text$1 } from "../Text.js";
+import { usePaginationContext } from "./paginationContext.js";
+import { usePaginationControlStyles } from "./usePaginationControlStyles.js";
+import { memo, useCallback, useMemo, useState } from "react";
+import { Pressable, StyleSheet } from "react-native";
+import { jsx } from "react/jsx-runtime";
+//#region src/components/Pagination/PaginationItem.tsx
+/**
+* **PaginationItem — single page control**
+*
+* @description
+* Renders a page number control. Usually composed via {@link PaginationNumbers}.
+*
+* @category Navigation
+* @platform mobile
+*/
+const PaginationItem = memo(function PaginationItem({ page, children, onPress, ...rest }) {
+	const { activePage, size, variant, getItemAriaLabel, onPageChange } = usePaginationContext();
+	const isActive = page === activePage;
+	const [pressed, setPressed] = useState(false);
+	const { rootStyle, textStyle } = usePaginationControlStyles({
+		size,
+		variant,
+		isActive,
+		pressed
+	});
+	const handlePress = useCallback((event) => {
+		onPress?.(event);
+		if (!isActive) onPageChange?.(page);
+	}, [
+		isActive,
+		onPageChange,
+		onPress,
+		page
+	]);
+	const label = children ?? page;
+	const resolvedTextColor = useMemo(() => {
+		const flat = StyleSheet.flatten(textStyle);
+		return typeof flat?.color === "string" ? flat.color : void 0;
+	}, [textStyle]);
+	return /* @__PURE__ */ jsx(Pressable, {
+		accessibilityLabel: getItemAriaLabel(page, isActive),
+		accessibilityRole: "button",
+		accessibilityState: {
+			disabled: isActive,
+			selected: isActive
+		},
+		disabled: isActive,
+		onPress: isActive ? void 0 : handlePress,
+		onPressIn: () => setPressed(true),
+		onPressOut: () => setPressed(false),
+		style: rootStyle,
+		...rest,
+		children: typeof label === "string" || typeof label === "number" ? /* @__PURE__ */ jsx(Text$1, {
+			color: "inherit",
+			variant: "inherit",
+			style: textStyle,
+			dangerouslySetColor: resolvedTextColor,
+			children: label
+		}) : label
+	});
+});
+PaginationItem.displayName = "PaginationItem";
+//#endregion
+export { PaginationItem };
+
+//# sourceMappingURL=PaginationItem.js.map

package/dist/components/Pagination/PaginationItem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PaginationItem.js","names":["Text"],"sources":["../../../src/components/Pagination/PaginationItem.tsx"],"sourcesContent":["import type { UniversalPaginationItemProps } from '@yahoo/uds-types';\nimport { memo, useCallback, useMemo, useState } from 'react';\nimport type { PressableProps } from 'react-native';\nimport { Pressable, StyleSheet } from 'react-native';\n\nimport { Text } from '../Text';\nimport { usePaginationContext } from './paginationContext';\nimport { usePaginationControlStyles } from './usePaginationControlStyles';\n\n/** RN Pressable types differ from web button HTML attributes; keep parity fields only. */\ninterface PaginationItemProps extends Omit<PressableProps, 'children' | 'style' | 'disabled'> {\n  page: UniversalPaginationItemProps['page'];\n  children?: UniversalPaginationItemProps['children'];\n}\n\n/**\n * **PaginationItem — single page control**\n *\n * @description\n * Renders a page number control. Usually composed via {@link PaginationNumbers}.\n *\n * @category Navigation\n * @platform mobile\n */\nconst PaginationItem = memo(function PaginationItem({\n  page,\n  children,\n  onPress,\n  ...rest\n}: PaginationItemProps) {\n  const { activePage, size, variant, getItemAriaLabel, onPageChange } = usePaginationContext();\n  const isActive = page === activePage;\n  const [pressed, setPressed] = useState(false);\n  const { rootStyle, textStyle } = usePaginationControlStyles({\n    size,\n    variant,\n    isActive,\n    pressed,\n  });\n\n  const handlePress = useCallback(\n    (event: Parameters<NonNullable<PressableProps['onPress']>>[0]) => {\n      onPress?.(event);\n      if (!isActive) {\n        onPageChange?.(page);\n      }\n    },\n    [isActive, onPageChange, onPress, page],\n  );\n\n  const label = children ?? page;\n  const resolvedTextColor = useMemo(() => {\n    const flat = StyleSheet.flatten(textStyle);\n    return typeof flat?.color === 'string' ? flat.color : undefined;\n  }, [textStyle]);\n\n  return (\n    <Pressable\n      accessibilityLabel={getItemAriaLabel(page, isActive)}\n      accessibilityRole=\"button\"\n      accessibilityState={{ disabled: isActive, selected: isActive }}\n      disabled={isActive}\n      onPress={isActive ? undefined : handlePress}\n      onPressIn={() => setPressed(true)}\n      onPressOut={() => setPressed(false)}\n      style={rootStyle}\n      {...rest}\n    >\n      {typeof label === 'string' || typeof label === 'number' ? (\n        <Text\n          color=\"inherit\"\n          variant=\"inherit\"\n          style={textStyle}\n          dangerouslySetColor={resolvedTextColor}\n        >\n          {label}\n        </Text>\n      ) : (\n        label\n      )}\n    </Pressable>\n  );\n});\n\nPaginationItem.displayName = 'PaginationItem';\n\nexport { PaginationItem, type PaginationItemProps };\n"],"mappings":";;;;;;;;;;;;;;;;;AAwBA,MAAM,iBAAiB,KAAK,SAAS,eAAe,EAClD,MACA,UACA,SACA,GAAG,QACmB;CACtB,MAAM,EAAE,YAAY,MAAM,SAAS,kBAAkB,iBAAiB,sBAAsB;CAC5F,MAAM,WAAW,SAAS;CAC1B,MAAM,CAAC,SAAS,cAAc,SAAS,MAAM;CAC7C,MAAM,EAAE,WAAW,cAAc,2BAA2B;EAC1D;EACA;EACA;EACA;EACD,CAAC;CAEF,MAAM,cAAc,aACjB,UAAiE;EAChE,UAAU,MAAM;EAChB,IAAI,CAAC,UACH,eAAe,KAAK;IAGxB;EAAC;EAAU;EAAc;EAAS;EAAK,CACxC;CAED,MAAM,QAAQ,YAAY;CAC1B,MAAM,oBAAoB,cAAc;EACtC,MAAM,OAAO,WAAW,QAAQ,UAAU;EAC1C,OAAO,OAAO,MAAM,UAAU,WAAW,KAAK,QAAQ,KAAA;IACrD,CAAC,UAAU,CAAC;CAEf,OACE,oBAAC,WAAD;EACE,oBAAoB,iBAAiB,MAAM,SAAS;EACpD,mBAAkB;EAClB,oBAAoB;GAAE,UAAU;GAAU,UAAU;GAAU;EAC9D,UAAU;EACV,SAAS,WAAW,KAAA,IAAY;EAChC,iBAAiB,WAAW,KAAK;EACjC,kBAAkB,WAAW,MAAM;EACnC,OAAO;EACP,GAAI;YAEH,OAAO,UAAU,YAAY,OAAO,UAAU,WAC7C,oBAACA,QAAD;GACE,OAAM;GACN,SAAQ;GACR,OAAO;GACP,qBAAqB;aAEpB;GACI,CAAA,GAEP;EAEQ,CAAA;EAEd;AAEF,eAAe,cAAc"}