@yahoo/uds-mobile 2.17.0 → 2.19.0

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"}

package/dist/components/Pagination/PaginationLink.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/PaginationLink.tsx
+/**
+* **PaginationLink — link-style page control**
+*
+* @description
+* Used when `getPageHref` is provided on {@link Pagination}. Invokes `onPageChange` on press.
+*
+* @category Navigation
+* @platform mobile
+*/
+const PaginationLink = (0, react.memo)(function PaginationLink({ page, href: _href, 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: "link",
+		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
+	});
+});
+PaginationLink.displayName = "PaginationLink";
+//#endregion
+exports.PaginationLink = PaginationLink;

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

@@ -0,0 +1,25 @@
+
+import { UniversalPaginationLinkProps } from "../../types/dist/index.cjs";
+import * as _$react from "react";
+import { PressableProps } from "react-native";
+
+//#region src/components/Pagination/PaginationLink.d.ts
+/** RN Pressable types differ from web anchor HTML attributes; keep parity fields only. */
+interface PaginationLinkProps extends Omit<PressableProps, 'children' | 'style' | 'disabled'> {
+  page: UniversalPaginationLinkProps['page'];
+  href: UniversalPaginationLinkProps['href'];
+  children?: UniversalPaginationLinkProps['children'];
+}
+/**
+ * **PaginationLink — link-style page control**
+ *
+ * @description
+ * Used when `getPageHref` is provided on {@link Pagination}. Invokes `onPageChange` on press.
+ *
+ * @category Navigation
+ * @platform mobile
+ */
+declare const PaginationLink: _$react.NamedExoticComponent<PaginationLinkProps>;
+//#endregion
+export { PaginationLink, type PaginationLinkProps };
+//# sourceMappingURL=PaginationLink.d.cts.map

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

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

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

@@ -0,0 +1,25 @@
+
+import { UniversalPaginationLinkProps } from "../../types/dist/index.js";
+import * as _$react from "react";
+import { PressableProps } from "react-native";
+
+//#region src/components/Pagination/PaginationLink.d.ts
+/** RN Pressable types differ from web anchor HTML attributes; keep parity fields only. */
+interface PaginationLinkProps extends Omit<PressableProps, 'children' | 'style' | 'disabled'> {
+  page: UniversalPaginationLinkProps['page'];
+  href: UniversalPaginationLinkProps['href'];
+  children?: UniversalPaginationLinkProps['children'];
+}
+/**
+ * **PaginationLink — link-style page control**
+ *
+ * @description
+ * Used when `getPageHref` is provided on {@link Pagination}. Invokes `onPageChange` on press.
+ *
+ * @category Navigation
+ * @platform mobile
+ */
+declare const PaginationLink: _$react.NamedExoticComponent<PaginationLinkProps>;
+//#endregion
+export { PaginationLink, type PaginationLinkProps };
+//# sourceMappingURL=PaginationLink.d.ts.map

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

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

package/dist/components/Pagination/PaginationLink.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/PaginationLink.tsx
+/**
+* **PaginationLink — link-style page control**
+*
+* @description
+* Used when `getPageHref` is provided on {@link Pagination}. Invokes `onPageChange` on press.
+*
+* @category Navigation
+* @platform mobile
+*/
+const PaginationLink = memo(function PaginationLink({ page, href: _href, 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: "link",
+		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
+	});
+});
+PaginationLink.displayName = "PaginationLink";
+//#endregion
+export { PaginationLink };
+
+//# sourceMappingURL=PaginationLink.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"PaginationLink.js","names":["Text"],"sources":["../../../src/components/Pagination/PaginationLink.tsx"],"sourcesContent":["import type { UniversalPaginationLinkProps } 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 anchor HTML attributes; keep parity fields only. */\ninterface PaginationLinkProps extends Omit<PressableProps, 'children' | 'style' | 'disabled'> {\n  page: UniversalPaginationLinkProps['page'];\n  href: UniversalPaginationLinkProps['href'];\n  children?: UniversalPaginationLinkProps['children'];\n}\n\n/**\n * **PaginationLink — link-style page control**\n *\n * @description\n * Used when `getPageHref` is provided on {@link Pagination}. Invokes `onPageChange` on press.\n *\n * @category Navigation\n * @platform mobile\n */\nconst PaginationLink = memo(function PaginationLink({\n  page,\n  href: _href,\n  children,\n  onPress,\n  ...rest\n}: PaginationLinkProps) {\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=\"link\"\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\nPaginationLink.displayName = 'PaginationLink';\n\nexport { PaginationLink, type PaginationLinkProps };\n"],"mappings":";;;;;;;;;;;;;;;;;AAyBA,MAAM,iBAAiB,KAAK,SAAS,eAAe,EAClD,MACA,MAAM,OACN,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"}

package/dist/components/Pagination/PaginationNext.cjs

@@ -0,0 +1,72 @@
+/*! © 2026 Yahoo, Inc. UDS Mobile v0.0.0-development */
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+require("../../_virtual/_rolldown/runtime.cjs");
+const require_components_Icon = require("../Icon.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/PaginationNext.tsx
+/**
+* **PaginationNext — next page control**
+*
+* @description
+* Hidden on the last page. Moves to the next page when pressed.
+*
+* @category Navigation
+* @platform mobile
+*/
+const PaginationNext = (0, react.memo)(function PaginationNext({ label = "Next", children, onPress, ...rest }) {
+	const { activePage, totalPages, size, variant, onPageChange } = require_components_Pagination_paginationContext.usePaginationContext();
+	const [pressed, setPressed] = (0, react.useState)(false);
+	(0, react.useEffect)(() => {
+		setPressed(false);
+	}, [activePage]);
+	const { rootStyle, textStyle, iconStyle } = require_components_Pagination_usePaginationControlStyles.usePaginationControlStyles({
+		size,
+		variant,
+		isActive: false,
+		pressed,
+		layout: "prevNext"
+	});
+	const handlePress = (0, react.useCallback)((event) => {
+		onPress?.(event);
+		onPageChange?.(activePage + 1);
+	}, [
+		activePage,
+		onPageChange,
+		onPress
+	]);
+	const resolvedTextColor = (0, react.useMemo)(() => {
+		const flat = react_native.StyleSheet.flatten(textStyle);
+		return typeof flat?.color === "string" ? flat.color : void 0;
+	}, [textStyle]);
+	if (activePage >= totalPages) return null;
+	const content = children ?? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_Text.Text, {
+		color: "inherit",
+		variant: "inherit",
+		style: textStyle,
+		dangerouslySetColor: resolvedTextColor,
+		children: label
+	}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_Icon.Icon, {
+		name: "ChevronRight",
+		size: "sm",
+		color: iconStyle?.color,
+		style: iconStyle
+	})] });
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_native.Pressable, {
+		accessibilityLabel: "Go to next page",
+		accessibilityRole: "button",
+		onPress: handlePress,
+		onPressIn: () => setPressed(true),
+		onPressOut: () => setPressed(false),
+		style: rootStyle,
+		...rest,
+		children: content
+	});
+});
+PaginationNext.displayName = "PaginationNext";
+//#endregion
+exports.PaginationNext = PaginationNext;

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

@@ -0,0 +1,24 @@
+
+import { UniversalPaginationNextProps } from "../../types/dist/index.cjs";
+import * as _$react from "react";
+import { PressableProps } from "react-native";
+
+//#region src/components/Pagination/PaginationNext.d.ts
+/** RN Pressable types differ from web button HTML attributes; keep parity fields only. */
+interface PaginationNextProps extends Omit<PressableProps, 'children' | 'style'> {
+  label?: UniversalPaginationNextProps['label'];
+  children?: UniversalPaginationNextProps['children'];
+}
+/**
+ * **PaginationNext — next page control**
+ *
+ * @description
+ * Hidden on the last page. Moves to the next page when pressed.
+ *
+ * @category Navigation
+ * @platform mobile
+ */
+declare const PaginationNext: _$react.NamedExoticComponent<PaginationNextProps>;
+//#endregion
+export { PaginationNext, type PaginationNextProps };
+//# sourceMappingURL=PaginationNext.d.cts.map

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

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

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

@@ -0,0 +1,24 @@
+
+import { UniversalPaginationNextProps } from "../../types/dist/index.js";
+import * as _$react from "react";
+import { PressableProps } from "react-native";
+
+//#region src/components/Pagination/PaginationNext.d.ts
+/** RN Pressable types differ from web button HTML attributes; keep parity fields only. */
+interface PaginationNextProps extends Omit<PressableProps, 'children' | 'style'> {
+  label?: UniversalPaginationNextProps['label'];
+  children?: UniversalPaginationNextProps['children'];
+}
+/**
+ * **PaginationNext — next page control**
+ *
+ * @description
+ * Hidden on the last page. Moves to the next page when pressed.
+ *
+ * @category Navigation
+ * @platform mobile
+ */
+declare const PaginationNext: _$react.NamedExoticComponent<PaginationNextProps>;
+//#endregion
+export { PaginationNext, type PaginationNextProps };
+//# sourceMappingURL=PaginationNext.d.ts.map

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

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

package/dist/components/Pagination/PaginationNext.js

@@ -0,0 +1,72 @@
+/*! © 2026 Yahoo, Inc. UDS Mobile v0.0.0-development */
+import { Icon } from "../Icon.js";
+import { Text as Text$1 } from "../Text.js";
+import { usePaginationContext } from "./paginationContext.js";
+import { usePaginationControlStyles } from "./usePaginationControlStyles.js";
+import { memo, useCallback, useEffect, useMemo, useState } from "react";
+import { Pressable, StyleSheet } from "react-native";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/Pagination/PaginationNext.tsx
+/**
+* **PaginationNext — next page control**
+*
+* @description
+* Hidden on the last page. Moves to the next page when pressed.
+*
+* @category Navigation
+* @platform mobile
+*/
+const PaginationNext = memo(function PaginationNext({ label = "Next", children, onPress, ...rest }) {
+	const { activePage, totalPages, size, variant, onPageChange } = usePaginationContext();
+	const [pressed, setPressed] = useState(false);
+	useEffect(() => {
+		setPressed(false);
+	}, [activePage]);
+	const { rootStyle, textStyle, iconStyle } = usePaginationControlStyles({
+		size,
+		variant,
+		isActive: false,
+		pressed,
+		layout: "prevNext"
+	});
+	const handlePress = useCallback((event) => {
+		onPress?.(event);
+		onPageChange?.(activePage + 1);
+	}, [
+		activePage,
+		onPageChange,
+		onPress
+	]);
+	const resolvedTextColor = useMemo(() => {
+		const flat = StyleSheet.flatten(textStyle);
+		return typeof flat?.color === "string" ? flat.color : void 0;
+	}, [textStyle]);
+	if (activePage >= totalPages) return null;
+	const content = children ?? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(Text$1, {
+		color: "inherit",
+		variant: "inherit",
+		style: textStyle,
+		dangerouslySetColor: resolvedTextColor,
+		children: label
+	}), /* @__PURE__ */ jsx(Icon, {
+		name: "ChevronRight",
+		size: "sm",
+		color: iconStyle?.color,
+		style: iconStyle
+	})] });
+	return /* @__PURE__ */ jsx(Pressable, {
+		accessibilityLabel: "Go to next page",
+		accessibilityRole: "button",
+		onPress: handlePress,
+		onPressIn: () => setPressed(true),
+		onPressOut: () => setPressed(false),
+		style: rootStyle,
+		...rest,
+		children: content
+	});
+});
+PaginationNext.displayName = "PaginationNext";
+//#endregion
+export { PaginationNext };
+
+//# sourceMappingURL=PaginationNext.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"PaginationNext.js","names":["Text"],"sources":["../../../src/components/Pagination/PaginationNext.tsx"],"sourcesContent":["import type { UniversalPaginationNextProps } from '@yahoo/uds-types';\nimport { memo, useCallback, useEffect, useMemo, useState } from 'react';\nimport type { PressableProps, TextStyle } from 'react-native';\nimport { Pressable, StyleSheet } from 'react-native';\n\nimport type { StyleProps } from '../../../generated/styles';\nimport { Icon } from '../Icon';\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 PaginationNextProps extends Omit<PressableProps, 'children' | 'style'> {\n  label?: UniversalPaginationNextProps['label'];\n  children?: UniversalPaginationNextProps['children'];\n}\n\n/**\n * **PaginationNext — next page control**\n *\n * @description\n * Hidden on the last page. Moves to the next page when pressed.\n *\n * @category Navigation\n * @platform mobile\n */\nconst PaginationNext = memo(function PaginationNext({\n  label = 'Next',\n  children,\n  onPress,\n  ...rest\n}: PaginationNextProps) {\n  const { activePage, totalPages, size, variant, onPageChange } = usePaginationContext();\n  const [pressed, setPressed] = useState(false);\n\n  // Pressable unmounts when we return null before onPressOut runs; reset on page change.\n  useEffect(() => {\n    setPressed(false);\n  }, [activePage]);\n  const { rootStyle, textStyle, iconStyle } = usePaginationControlStyles({\n    size,\n    variant,\n    isActive: false,\n    pressed,\n    layout: 'prevNext',\n  });\n\n  const handlePress = useCallback(\n    (event: Parameters<NonNullable<PressableProps['onPress']>>[0]) => {\n      onPress?.(event);\n      onPageChange?.(activePage + 1);\n    },\n    [activePage, onPageChange, onPress],\n  );\n\n  const resolvedTextColor = useMemo(() => {\n    const flat = StyleSheet.flatten(textStyle);\n    return typeof flat?.color === 'string' ? flat.color : undefined;\n  }, [textStyle]);\n\n  if (activePage >= totalPages) {\n    return null;\n  }\n\n  const content = children ?? (\n    <>\n      <Text\n        color=\"inherit\"\n        variant=\"inherit\"\n        style={textStyle}\n        dangerouslySetColor={resolvedTextColor}\n      >\n        {label}\n      </Text>\n      <Icon\n        name=\"ChevronRight\"\n        size=\"sm\"\n        color={(iconStyle as TextStyle)?.color as StyleProps['color'] | undefined}\n        style={iconStyle}\n      />\n    </>\n  );\n\n  return (\n    <Pressable\n      accessibilityLabel=\"Go to next page\"\n      accessibilityRole=\"button\"\n      onPress={handlePress}\n      onPressIn={() => setPressed(true)}\n      onPressOut={() => setPressed(false)}\n      style={rootStyle}\n      {...rest}\n    >\n      {content}\n    </Pressable>\n  );\n});\n\nPaginationNext.displayName = 'PaginationNext';\n\nexport { PaginationNext, type PaginationNextProps };\n"],"mappings":";;;;;;;;;;;;;;;;;;AA0BA,MAAM,iBAAiB,KAAK,SAAS,eAAe,EAClD,QAAQ,QACR,UACA,SACA,GAAG,QACmB;CACtB,MAAM,EAAE,YAAY,YAAY,MAAM,SAAS,iBAAiB,sBAAsB;CACtF,MAAM,CAAC,SAAS,cAAc,SAAS,MAAM;CAG7C,gBAAgB;EACd,WAAW,MAAM;IAChB,CAAC,WAAW,CAAC;CAChB,MAAM,EAAE,WAAW,WAAW,cAAc,2BAA2B;EACrE;EACA;EACA,UAAU;EACV;EACA,QAAQ;EACT,CAAC;CAEF,MAAM,cAAc,aACjB,UAAiE;EAChE,UAAU,MAAM;EAChB,eAAe,aAAa,EAAE;IAEhC;EAAC;EAAY;EAAc;EAAQ,CACpC;CAED,MAAM,oBAAoB,cAAc;EACtC,MAAM,OAAO,WAAW,QAAQ,UAAU;EAC1C,OAAO,OAAO,MAAM,UAAU,WAAW,KAAK,QAAQ,KAAA;IACrD,CAAC,UAAU,CAAC;CAEf,IAAI,cAAc,YAChB,OAAO;CAGT,MAAM,UAAU,YACd,qBAAA,UAAA,EAAA,UAAA,CACE,oBAACA,QAAD;EACE,OAAM;EACN,SAAQ;EACR,OAAO;EACP,qBAAqB;YAEpB;EACI,CAAA,EACP,oBAAC,MAAD;EACE,MAAK;EACL,MAAK;EACL,OAAQ,WAAyB;EACjC,OAAO;EACP,CAAA,CACD,EAAA,CAAA;CAGL,OACE,oBAAC,WAAD;EACE,oBAAmB;EACnB,mBAAkB;EAClB,SAAS;EACT,iBAAiB,WAAW,KAAK;EACjC,kBAAkB,WAAW,MAAM;EACnC,OAAO;EACP,GAAI;YAEH;EACS,CAAA;EAEd;AAEF,eAAe,cAAc"}

package/dist/components/Pagination/PaginationNumbers.cjs

@@ -0,0 +1,50 @@
+/*! © 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");
+const require_components_Pagination_PaginationEllipsis = require("./PaginationEllipsis.cjs");
+const require_components_Pagination_PaginationItem = require("./PaginationItem.cjs");
+const require_components_Pagination_PaginationLink = require("./PaginationLink.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/PaginationNumbers.tsx
+/**
+* **PaginationNumbers — page number list**
+*
+* @description
+* Renders visible page numbers and ellipses based on overflow rules.
+*
+* @category Navigation
+* @platform mobile
+*/
+const PaginationNumbers = (0, react.memo)(function PaginationNumbers({ renderItem, style, ...rest }) {
+	const { activePage, getPageHref, size } = require_components_Pagination_paginationContext.usePaginationContext();
+	const visiblePages = require_components_Pagination_paginationContext.useVisiblePages();
+	const { theme } = (0, react_native_unistyles.useUnistyles)();
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_HStack.HStack, {
+		alignItems: "center",
+		justifyContent: "center",
+		gap: (0, react.useMemo)(() => require_components_Pagination_paginationTheme.getPaginationRootGapStyle(theme, size), [size, theme]).gap,
+		style,
+		...rest,
+		children: visiblePages.map((item, index) => {
+			const key = item === "ellipsis" ? `ellipsis-${index}` : `page-${item}`;
+			if (item === "ellipsis") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_Pagination_PaginationEllipsis.PaginationEllipsis, {}, key);
+			const isActive = item === activePage;
+			const href = getPageHref?.(item);
+			if (renderItem) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_native.View, { children: renderItem(item, { isActive }) }, key);
+			if (href && !isActive) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_Pagination_PaginationLink.PaginationLink, {
+				page: item,
+				href
+			}, key);
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_Pagination_PaginationItem.PaginationItem, { page: item }, key);
+		})
+	});
+});
+PaginationNumbers.displayName = "PaginationNumbers";
+//#endregion
+exports.PaginationNumbers = PaginationNumbers;

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

@@ -0,0 +1,23 @@
+
+import { UniversalPaginationNumbersProps } from "../../types/dist/index.cjs";
+import * as _$react from "react";
+import { ViewProps } from "react-native";
+
+//#region src/components/Pagination/PaginationNumbers.d.ts
+interface PaginationNumbersProps extends Omit<UniversalPaginationNumbersProps, 'className'>, Pick<ViewProps, 'style'> {
+  /** Custom render for each page number. */
+  renderItem?: UniversalPaginationNumbersProps['renderItem'];
+}
+/**
+ * **PaginationNumbers — page number list**
+ *
+ * @description
+ * Renders visible page numbers and ellipses based on overflow rules.
+ *
+ * @category Navigation
+ * @platform mobile
+ */
+declare const PaginationNumbers: _$react.NamedExoticComponent<PaginationNumbersProps>;
+//#endregion
+export { PaginationNumbers, type PaginationNumbersProps };
+//# sourceMappingURL=PaginationNumbers.d.cts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"PaginationNumbers.d.cts","names":[],"sources":["../../../src/components/Pagination/PaginationNumbers.tsx"],"mappings":";;;;;;UAeU,sBAAA,SACA,IAAA,CAAK,+BAAA,gBAA+C,IAAA,CAAK,SAAA;;EAEjE,UAAA,GAAa,+BAAA;AAAA;;;;;;;;;;cAYT,iBAAA,EAAiB,OAAA,CAAA,oBAAA,CAAA,sBAAA"}

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

@@ -0,0 +1,23 @@
+
+import { UniversalPaginationNumbersProps } from "../../types/dist/index.js";
+import * as _$react from "react";
+import { ViewProps } from "react-native";
+
+//#region src/components/Pagination/PaginationNumbers.d.ts
+interface PaginationNumbersProps extends Omit<UniversalPaginationNumbersProps, 'className'>, Pick<ViewProps, 'style'> {
+  /** Custom render for each page number. */
+  renderItem?: UniversalPaginationNumbersProps['renderItem'];
+}
+/**
+ * **PaginationNumbers — page number list**
+ *
+ * @description
+ * Renders visible page numbers and ellipses based on overflow rules.
+ *
+ * @category Navigation
+ * @platform mobile
+ */
+declare const PaginationNumbers: _$react.NamedExoticComponent<PaginationNumbersProps>;
+//#endregion
+export { PaginationNumbers, type PaginationNumbersProps };
+//# sourceMappingURL=PaginationNumbers.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"PaginationNumbers.d.ts","names":[],"sources":["../../../src/components/Pagination/PaginationNumbers.tsx"],"mappings":";;;;;;UAeU,sBAAA,SACA,IAAA,CAAK,+BAAA,gBAA+C,IAAA,CAAK,SAAA;;EAEjE,UAAA,GAAa,+BAAA;AAAA;;;;;;;;;;cAYT,iBAAA,EAAiB,OAAA,CAAA,oBAAA,CAAA,sBAAA"}

package/dist/components/Pagination/PaginationNumbers.js

@@ -0,0 +1,50 @@
+/*! © 2026 Yahoo, Inc. UDS Mobile v0.0.0-development */
+import { HStack } from "../HStack.js";
+import { usePaginationContext, useVisiblePages } from "./paginationContext.js";
+import { getPaginationRootGapStyle } from "./paginationTheme.js";
+import { PaginationEllipsis } from "./PaginationEllipsis.js";
+import { PaginationItem } from "./PaginationItem.js";
+import { PaginationLink } from "./PaginationLink.js";
+import { memo, useMemo } from "react";
+import { View } from "react-native";
+import { jsx } from "react/jsx-runtime";
+import { useUnistyles } from "react-native-unistyles";
+//#region src/components/Pagination/PaginationNumbers.tsx
+/**
+* **PaginationNumbers — page number list**
+*
+* @description
+* Renders visible page numbers and ellipses based on overflow rules.
+*
+* @category Navigation
+* @platform mobile
+*/
+const PaginationNumbers = memo(function PaginationNumbers({ renderItem, style, ...rest }) {
+	const { activePage, getPageHref, size } = usePaginationContext();
+	const visiblePages = useVisiblePages();
+	const { theme } = useUnistyles();
+	return /* @__PURE__ */ jsx(HStack, {
+		alignItems: "center",
+		justifyContent: "center",
+		gap: useMemo(() => getPaginationRootGapStyle(theme, size), [size, theme]).gap,
+		style,
+		...rest,
+		children: visiblePages.map((item, index) => {
+			const key = item === "ellipsis" ? `ellipsis-${index}` : `page-${item}`;
+			if (item === "ellipsis") return /* @__PURE__ */ jsx(PaginationEllipsis, {}, key);
+			const isActive = item === activePage;
+			const href = getPageHref?.(item);
+			if (renderItem) return /* @__PURE__ */ jsx(View, { children: renderItem(item, { isActive }) }, key);
+			if (href && !isActive) return /* @__PURE__ */ jsx(PaginationLink, {
+				page: item,
+				href
+			}, key);
+			return /* @__PURE__ */ jsx(PaginationItem, { page: item }, key);
+		})
+	});
+});
+PaginationNumbers.displayName = "PaginationNumbers";
+//#endregion
+export { PaginationNumbers };
+
+//# sourceMappingURL=PaginationNumbers.js.map