@yahoo/uds-mobile 2.24.0-beta.5 → 2.24.0-beta.7

package/dist/components/Link.cjs

@@ -1,6 +1,8 @@
 /*! © 2026 Yahoo, Inc. UDS Mobile v0.0.0-development */
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const require_runtime = require("../_virtual/_rolldown/runtime.cjs");
+const require_fontScaling_constants = require("../fontScaling/constants.cjs");
+const require_fontScaling_useMaxFontSizeMultiplier = require("../fontScaling/useMaxFontSizeMultiplier.cjs");
 const require_components_IconSlot = require("./IconSlot.cjs");
 let react = require("react");
 let react_native = require("react-native");
@@ -50,8 +52,11 @@ const noUnderline = { textDecorationLine: "none" };
 * @see {@link Button} for primary actions
 * @see {@link Text} for non-interactive text
 */
-const Link = (0, react.memo)(function Link({ children, variant = "primary", textVariant, alwaysUnderline = false, startIcon, endIcon, onPress, style, ref, ...rest }) {
+const Link = (0, react.memo)(function Link({ children, variant = "primary", textVariant, alwaysUnderline = false, startIcon, endIcon, maxFontSizeMultiplier, onPress, style, ref, ...rest }) {
 	const [pressed, setPressed] = (0, react.useState)(false);
+	const resolvedTextVariant = textVariant;
+	const resolvedMaxFontSizeMultiplier = require_fontScaling_useMaxFontSizeMultiplier.useMaxFontSizeMultiplier(resolvedTextVariant, maxFontSizeMultiplier);
+	const dynamicTypeRamp = resolvedTextVariant ? require_fontScaling_constants.DEFAULT_DYNAMIC_TYPE_RAMPS[resolvedTextVariant] : void 0;
 	const handlePressIn = (0, react.useCallback)(() => {
 		setPressed(true);
 	}, []);
@@ -125,12 +130,15 @@ const Link = (0, react.memo)(function Link({ children, variant = "primary", text
 		onPressIn: handlePressIn,
 		onPressOut: handlePressOut,
 		suppressHighlighting: true,
+		maxFontSizeMultiplier: resolvedMaxFontSizeMultiplier,
+		dynamicTypeRamp,
 		style: textStyles,
 		...rest,
 		children: [
 			startIcon && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_IconSlot.IconSlot, {
 				icon: startIcon,
 				variant: "outline",
+				maxFontSizeMultiplier: resolvedMaxFontSizeMultiplier,
 				style: startIconStyles
 			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_native.Text, {
 				style: noUnderline,
@@ -143,6 +151,7 @@ const Link = (0, react.memo)(function Link({ children, variant = "primary", text
 			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_IconSlot.IconSlot, {
 				icon: endIcon,
 				variant: "outline",
+				maxFontSizeMultiplier: resolvedMaxFontSizeMultiplier,
 				style: endIconStyles
 			})] })
 		]

package/dist/components/Link.d.cts

@@ -16,6 +16,12 @@ interface LinkProps extends UniversalLinkProps<IconSlotType> {
   ref?: Ref<Text>;
   /** Link content, typically text */
   children?: ReactNode;
+  /**
+   * Caps how far the link text and inline icons grow with the OS text-size
+   * setting. Set null to remove the cap; override app-wide via
+   * UDSFontScalingProvider.
+   */
+  maxFontSizeMultiplier?: number | null;
 }
 /**
  * **🔗 A navigation link component**

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

@@ -1 +1 @@
-{"version":3,"file":"Link.d.cts","names":[],"sources":["../../src/components/Link.tsx"],"mappings":";;;;;;;;;UAwBU,SAAA,SAAkB,kBAAA,CAAmB,YAAA;;EAE7C,KAAA,GAAQ,SAAA;EAFU;EAIlB,OAAA,GAAU,WAAA;EAJmC;EAM7C,GAAA,GAAM,GAAA,CAAI,IAAA;EAFA;EAIV,QAAA,GAAW,SAAA;AAAA;;;;;;;;;;;;;;;;;;AAAS;;;;;;;;;;;;;;;;;;;;;cAyChB,IAAA,EAAI,OAAA,CAAA,oBAAA,CAAA,SAAA"}
+{"version":3,"file":"Link.d.cts","names":[],"sources":["../../src/components/Link.tsx"],"mappings":";;;;;;;;;UA0BU,SAAA,SAAkB,kBAAA,CAAmB,YAAA;;EAE7C,KAAA,GAAQ,SAAA;EAFU;EAIlB,OAAA,GAAU,WAAA;EAJmC;EAM7C,GAAA,GAAM,GAAA,CAAI,IAAA;EAFA;EAIV,QAAA,GAAW,SAAA;EAFL;;;;;EAQN,qBAAA;AAAA;;;;;;;;;;;;;AAAqB;;;;;;;;;;;;;;;;;;;;;;;;;;cAyCjB,IAAA,EAAI,OAAA,CAAA,oBAAA,CAAA,SAAA"}

package/dist/components/Link.d.ts

@@ -16,6 +16,12 @@ interface LinkProps extends UniversalLinkProps<IconSlotType> {
   ref?: Ref<Text>;
   /** Link content, typically text */
   children?: ReactNode;
+  /**
+   * Caps how far the link text and inline icons grow with the OS text-size
+   * setting. Set null to remove the cap; override app-wide via
+   * UDSFontScalingProvider.
+   */
+  maxFontSizeMultiplier?: number | null;
 }
 /**
  * **🔗 A navigation link component**

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

@@ -1 +1 @@
-{"version":3,"file":"Link.d.ts","names":[],"sources":["../../src/components/Link.tsx"],"mappings":";;;;;;;;;UAwBU,SAAA,SAAkB,kBAAA,CAAmB,YAAA;;EAE7C,KAAA,GAAQ,SAAA;EAFU;EAIlB,OAAA,GAAU,WAAA;EAJmC;EAM7C,GAAA,GAAM,GAAA,CAAI,IAAA;EAFA;EAIV,QAAA,GAAW,SAAA;AAAA;;;;;;;;;;;;;;;;;;AAAS;;;;;;;;;;;;;;;;;;;;;cAyChB,IAAA,EAAI,OAAA,CAAA,oBAAA,CAAA,SAAA"}
+{"version":3,"file":"Link.d.ts","names":[],"sources":["../../src/components/Link.tsx"],"mappings":";;;;;;;;;UA0BU,SAAA,SAAkB,kBAAA,CAAmB,YAAA;;EAE7C,KAAA,GAAQ,SAAA;EAFU;EAIlB,OAAA,GAAU,WAAA;EAJmC;EAM7C,GAAA,GAAM,GAAA,CAAI,IAAA;EAFA;EAIV,QAAA,GAAW,SAAA;EAFL;;;;;EAQN,qBAAA;AAAA;;;;;;;;;;;;;AAAqB;;;;;;;;;;;;;;;;;;;;;;;;;;cAyCjB,IAAA,EAAI,OAAA,CAAA,oBAAA,CAAA,SAAA"}

package/dist/components/Link.js

@@ -1,4 +1,6 @@
 /*! © 2026 Yahoo, Inc. UDS Mobile v0.0.0-development */
+import { DEFAULT_DYNAMIC_TYPE_RAMPS } from "../fontScaling/constants.js";
+import { useMaxFontSizeMultiplier } from "../fontScaling/useMaxFontSizeMultiplier.js";
 import { IconSlot } from "./IconSlot.js";
 import { memo, useCallback, useMemo, useState } from "react";
 import { Text } from "react-native";
@@ -47,8 +49,11 @@ const noUnderline = { textDecorationLine: "none" };
 * @see {@link Button} for primary actions
 * @see {@link Text} for non-interactive text
 */
-const Link = memo(function Link({ children, variant = "primary", textVariant, alwaysUnderline = false, startIcon, endIcon, onPress, style, ref, ...rest }) {
+const Link = memo(function Link({ children, variant = "primary", textVariant, alwaysUnderline = false, startIcon, endIcon, maxFontSizeMultiplier, onPress, style, ref, ...rest }) {
 	const [pressed, setPressed] = useState(false);
+	const resolvedTextVariant = textVariant;
+	const resolvedMaxFontSizeMultiplier = useMaxFontSizeMultiplier(resolvedTextVariant, maxFontSizeMultiplier);
+	const dynamicTypeRamp = resolvedTextVariant ? DEFAULT_DYNAMIC_TYPE_RAMPS[resolvedTextVariant] : void 0;
 	const handlePressIn = useCallback(() => {
 		setPressed(true);
 	}, []);
@@ -122,12 +127,15 @@ const Link = memo(function Link({ children, variant = "primary", textVariant, al
 		onPressIn: handlePressIn,
 		onPressOut: handlePressOut,
 		suppressHighlighting: true,
+		maxFontSizeMultiplier: resolvedMaxFontSizeMultiplier,
+		dynamicTypeRamp,
 		style: textStyles,
 		...rest,
 		children: [
 			startIcon && /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(IconSlot, {
 				icon: startIcon,
 				variant: "outline",
+				maxFontSizeMultiplier: resolvedMaxFontSizeMultiplier,
 				style: startIconStyles
 			}), /* @__PURE__ */ jsx(Text, {
 				style: noUnderline,
@@ -140,6 +148,7 @@ const Link = memo(function Link({ children, variant = "primary", textVariant, al
 			}), /* @__PURE__ */ jsx(IconSlot, {
 				icon: endIcon,
 				variant: "outline",
+				maxFontSizeMultiplier: resolvedMaxFontSizeMultiplier,
 				style: endIconStyles
 			})] })
 		]

package/dist/components/Link.js.map

@@ -1 +1 @@
-{"version":3,"file":"Link.js","names":["RNText"],"sources":["../../src/components/Link.tsx"],"sourcesContent":["import type { UniversalLinkProps } from '@yahoo/uds-types';\nimport type { ReactNode, Ref } from 'react';\nimport { memo, useCallback, useMemo, useState } from 'react';\nimport type { GestureResponderEvent, TextStyle } from 'react-native';\nimport { Text as RNText } from 'react-native';\nimport Animated, {\n  Easing,\n  interpolateColor,\n  useAnimatedStyle,\n  useDerivedValue,\n  withTiming,\n} from 'react-native-reanimated';\nimport { useAnimatedTheme } from 'react-native-unistyles/reanimated';\n\nimport { linkStyles } from '../../generated/styles';\nimport type { IconSlotType } from './IconSlot';\nimport { IconSlot } from './IconSlot';\nimport type { TextProps } from './Text';\n\nconst AnimatedText = Animated.Text;\n\n// Prevent icons from inheriting underline from parent/theme (matches web behavior)\nconst noUnderline: TextStyle = { textDecorationLine: 'none' };\n\ninterface LinkProps extends UniversalLinkProps<IconSlotType> {\n  /** Style override for the link text */\n  style?: TextStyle;\n  /** Callback fired when the link is pressed */\n  onPress?: TextProps['onPress'];\n  /** Ref to the underlying Text element */\n  ref?: Ref<RNText>;\n  /** Link content, typically text */\n  children?: ReactNode;\n}\n\n/**\n * **🔗 A navigation link component**\n *\n * @description\n * A styled link component for navigation. Rendered as Text so it can be\n * nested inline within other Text. Supports optional start/end icons.\n *\n * @category Interactive\n * @platform mobile\n *\n * @example\n * ```tsx\n * import { Link } from '@yahoo/uds-mobile/Link';\n *\n * // Standalone link\n * <Link onPress={() => navigate('/profile')}>Go to Profile</Link>\n *\n * // Inline within text\n * <Text>Read our <Link>Terms of Service</Link> and <Link>Privacy Policy</Link>.</Text>\n *\n * // With icons\n * <Link startIcon=\"AffiliateLink\">External link</Link>\n * <Link endIcon=\"ChevronRight\">Navigate forward</Link>\n * ```\n *\n * @usage\n * - Use for navigation actions\n * - Can be nested within Text for inline links\n * - Use alwaysUnderline for links that need to be visually distinct\n *\n * @accessibility\n * - Link text is the accessible name\n * - Shows underline on press for visual feedback\n * - Use descriptive link text (avoid \"click here\")\n *\n * @see {@link Button} for primary actions\n * @see {@link Text} for non-interactive text\n */\nconst Link = memo(function Link({\n  children,\n  variant = 'primary',\n  textVariant,\n  alwaysUnderline = false,\n  startIcon,\n  endIcon,\n  onPress,\n  style,\n  ref,\n  ...rest\n}: LinkProps) {\n  const [pressed, setPressed] = useState(false);\n\n  const handlePressIn = useCallback(() => {\n    setPressed(true);\n  }, []);\n\n  const handlePressOut = useCallback(() => {\n    setPressed(false);\n  }, []);\n\n  // Must have onPress for touch events to register (RN requirement)\n  // Even without a user-provided handler, we need a function to make text touchable\n  const handlePress = useCallback(\n    (event: GestureResponderEvent) => {\n      onPress?.(event);\n    },\n    [onPress],\n  );\n\n  linkStyles.useVariants({\n    textStyle: textVariant,\n    variant,\n    pressed,\n  });\n\n  // Get theme as SharedValue for worklet access (zero re-renders)\n  const animatedTheme = useAnimatedTheme();\n\n  // Derive underline visibility from pressed state\n  // useDerivedValue handles the animation automatically when deps change\n  const underlineProgress = useDerivedValue(() => {\n    const targetValue = pressed || alwaysUnderline ? 1 : 0;\n    return withTiming(targetValue, {\n      duration: 150,\n      easing: Easing.bezier(0, 0, 0.2, 1),\n    });\n  }, [pressed, alwaysUnderline]);\n\n  // Combined animated style for color and underline\n  const animatedTextStyle = useAnimatedStyle(() => {\n    // Access text color from theme using variant path\n    const components = animatedTheme.value.components;\n    const state = pressed ? 'pressed' : 'rest';\n    const textVariantPath = `link/variant/${variant}/rootText/${state}` as const;\n    const textColor = components[textVariantPath]?.color;\n\n    if (!textColor) {\n      return {};\n    }\n\n    const color = withTiming(textColor, {\n      duration: 150,\n      easing: Easing.bezier(0, 0, 0.2, 1),\n    });\n\n    // Interpolate underline opacity: 0 = transparent, 1 = text color\n    const underlineColor = interpolateColor(\n      underlineProgress.value,\n      [0, 1],\n      ['transparent', textColor],\n    );\n\n    return {\n      color,\n      textDecorationColor: underlineColor,\n    };\n  });\n\n  const textStyles = useMemo(() => {\n    return [linkStyles.root, linkStyles.text, animatedTextStyle, style];\n  }, [linkStyles.text, animatedTextStyle, style, linkStyles.root]);\n\n  const startIconStyles = useMemo(() => {\n    return [linkStyles.icon, linkStyles.iconStart, noUnderline];\n  }, [linkStyles.icon, linkStyles.iconStart, noUnderline]);\n\n  const endIconStyles = useMemo(() => {\n    return [linkStyles.icon, linkStyles.iconEnd, noUnderline];\n  }, [linkStyles.icon, linkStyles.iconEnd, noUnderline]);\n\n  return (\n    <AnimatedText\n      ref={ref}\n      onPress={handlePress}\n      onPressIn={handlePressIn}\n      onPressOut={handlePressOut}\n      suppressHighlighting\n      style={textStyles}\n      {...rest}\n    >\n      {startIcon && (\n        <>\n          <IconSlot icon={startIcon} variant=\"outline\" style={startIconStyles} />\n          {/* TODO: need to add hairline space character to icon font so we can have space between icon and text https://hybridheroes.de/blog/2022-11-17-text-with-inline-icons-in-react-native/ */}\n          <RNText style={noUnderline}>{' \\u200A'}</RNText>\n        </>\n      )}\n      {children}\n      {endIcon && (\n        <>\n          {/* TODO: need to add hairline space character to icon font so we can have space between icon and text https://hybridheroes.de/blog/2022-11-17-text-with-inline-icons-in-react-native/ */}\n          <RNText style={noUnderline}>{' \\u200A'}</RNText>\n          <IconSlot icon={endIcon} variant=\"outline\" style={endIconStyles} />\n        </>\n      )}\n    </AnimatedText>\n  );\n});\n\nLink.displayName = 'Link';\n\nexport { Link, type LinkProps };\n"],"mappings":";;;;;;;;;AAmBA,MAAM,eAAe,SAAS;AAG9B,MAAM,cAAyB,EAAE,oBAAoB,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmD7D,MAAM,OAAO,KAAK,SAAS,KAAK,EAC9B,UACA,UAAU,WACV,aACA,kBAAkB,OAClB,WACA,SACA,SACA,OACA,KACA,GAAG,QACS;CACZ,MAAM,CAAC,SAAS,cAAc,SAAS,MAAM;CAE7C,MAAM,gBAAgB,kBAAkB;EACtC,WAAW,KAAK;IACf,EAAE,CAAC;CAEN,MAAM,iBAAiB,kBAAkB;EACvC,WAAW,MAAM;IAChB,EAAE,CAAC;CAIN,MAAM,cAAc,aACjB,UAAiC;EAChC,UAAU,MAAM;IAElB,CAAC,QAAQ,CACV;CAED,WAAW,YAAY;EACrB,WAAW;EACX;EACA;EACD,CAAC;CAGF,MAAM,gBAAgB,kBAAkB;CAIxC,MAAM,oBAAoB,sBAAsB;EAE9C,OAAO,WADa,WAAW,kBAAkB,IAAI,GACtB;GAC7B,UAAU;GACV,QAAQ,OAAO,OAAO,GAAG,GAAG,IAAK,EAAE;GACpC,CAAC;IACD,CAAC,SAAS,gBAAgB,CAAC;CAG9B,MAAM,oBAAoB,uBAAuB;EAK/C,MAAM,YAHa,cAAc,MAAM,WAGV,gBADW,QAAQ,YADlC,UAAU,YAAY,WAEW;EAE/C,IAAI,CAAC,WACH,OAAO,EAAE;EAeX,OAAO;GACL,OAbY,WAAW,WAAW;IAClC,UAAU;IACV,QAAQ,OAAO,OAAO,GAAG,GAAG,IAAK,EAAE;IACpC,CAUM;GACL,qBARqB,iBACrB,kBAAkB,OAClB,CAAC,GAAG,EAAE,EACN,CAAC,eAAe,UAAU,CAKS;GACpC;GACD;CAEF,MAAM,aAAa,cAAc;EAC/B,OAAO;GAAC,WAAW;GAAM,WAAW;GAAM;GAAmB;GAAM;IAClE;EAAC,WAAW;EAAM;EAAmB;EAAO,WAAW;EAAK,CAAC;CAEhE,MAAM,kBAAkB,cAAc;EACpC,OAAO;GAAC,WAAW;GAAM,WAAW;GAAW;GAAY;IAC1D;EAAC,WAAW;EAAM,WAAW;EAAW;EAAY,CAAC;CAExD,MAAM,gBAAgB,cAAc;EAClC,OAAO;GAAC,WAAW;GAAM,WAAW;GAAS;GAAY;IACxD;EAAC,WAAW;EAAM,WAAW;EAAS;EAAY,CAAC;CAEtD,OACE,qBAAC,cAAD;EACO;EACL,SAAS;EACT,WAAW;EACX,YAAY;EACZ,sBAAA;EACA,OAAO;EACP,GAAI;YAPN;GASG,aACC,qBAAA,UAAA,EAAA,UAAA,CACE,oBAAC,UAAD;IAAU,MAAM;IAAW,SAAQ;IAAU,OAAO;IAAmB,CAAA,EAEvE,oBAACA,MAAD;IAAQ,OAAO;cAAc;IAAmB,CAAA,CAC/C,EAAA,CAAA;GAEJ;GACA,WACC,qBAAA,UAAA,EAAA,UAAA,CAEE,oBAACA,MAAD;IAAQ,OAAO;cAAc;IAAmB,CAAA,EAChD,oBAAC,UAAD;IAAU,MAAM;IAAS,SAAQ;IAAU,OAAO;IAAiB,CAAA,CAClE,EAAA,CAAA;GAEQ;;EAEjB;AAEF,KAAK,cAAc"}
+{"version":3,"file":"Link.js","names":["RNText"],"sources":["../../src/components/Link.tsx"],"sourcesContent":["import type { UniversalLinkProps } from '@yahoo/uds-types';\nimport type { ReactNode, Ref } from 'react';\nimport { memo, useCallback, useMemo, useState } from 'react';\nimport type { GestureResponderEvent, TextStyle } from 'react-native';\nimport { Text as RNText } from 'react-native';\nimport Animated, {\n  Easing,\n  interpolateColor,\n  useAnimatedStyle,\n  useDerivedValue,\n  withTiming,\n} from 'react-native-reanimated';\nimport { useAnimatedTheme } from 'react-native-unistyles/reanimated';\n\nimport { linkStyles } from '../../generated/styles';\nimport { DEFAULT_DYNAMIC_TYPE_RAMPS } from '../fontScaling/constants';\nimport { useMaxFontSizeMultiplier } from '../fontScaling/useMaxFontSizeMultiplier';\nimport type { IconSlotType } from './IconSlot';\nimport { IconSlot } from './IconSlot';\nimport type { TextProps, TextVariant } from './Text';\n\nconst AnimatedText = Animated.Text;\n\n// Prevent icons from inheriting underline from parent/theme (matches web behavior)\nconst noUnderline: TextStyle = { textDecorationLine: 'none' };\n\ninterface LinkProps extends UniversalLinkProps<IconSlotType> {\n  /** Style override for the link text */\n  style?: TextStyle;\n  /** Callback fired when the link is pressed */\n  onPress?: TextProps['onPress'];\n  /** Ref to the underlying Text element */\n  ref?: Ref<RNText>;\n  /** Link content, typically text */\n  children?: ReactNode;\n  /**\n   * Caps how far the link text and inline icons grow with the OS text-size\n   * setting. Set null to remove the cap; override app-wide via\n   * UDSFontScalingProvider.\n   */\n  maxFontSizeMultiplier?: number | null;\n}\n\n/**\n * **🔗 A navigation link component**\n *\n * @description\n * A styled link component for navigation. Rendered as Text so it can be\n * nested inline within other Text. Supports optional start/end icons.\n *\n * @category Interactive\n * @platform mobile\n *\n * @example\n * ```tsx\n * import { Link } from '@yahoo/uds-mobile/Link';\n *\n * // Standalone link\n * <Link onPress={() => navigate('/profile')}>Go to Profile</Link>\n *\n * // Inline within text\n * <Text>Read our <Link>Terms of Service</Link> and <Link>Privacy Policy</Link>.</Text>\n *\n * // With icons\n * <Link startIcon=\"AffiliateLink\">External link</Link>\n * <Link endIcon=\"ChevronRight\">Navigate forward</Link>\n * ```\n *\n * @usage\n * - Use for navigation actions\n * - Can be nested within Text for inline links\n * - Use alwaysUnderline for links that need to be visually distinct\n *\n * @accessibility\n * - Link text is the accessible name\n * - Shows underline on press for visual feedback\n * - Use descriptive link text (avoid \"click here\")\n *\n * @see {@link Button} for primary actions\n * @see {@link Text} for non-interactive text\n */\nconst Link = memo(function Link({\n  children,\n  variant = 'primary',\n  textVariant,\n  alwaysUnderline = false,\n  startIcon,\n  endIcon,\n  maxFontSizeMultiplier,\n  onPress,\n  style,\n  ref,\n  ...rest\n}: LinkProps) {\n  const [pressed, setPressed] = useState(false);\n  const resolvedTextVariant = textVariant as TextVariant | undefined;\n  const resolvedMaxFontSizeMultiplier = useMaxFontSizeMultiplier(\n    resolvedTextVariant,\n    maxFontSizeMultiplier,\n  );\n  const dynamicTypeRamp = resolvedTextVariant\n    ? DEFAULT_DYNAMIC_TYPE_RAMPS[resolvedTextVariant]\n    : undefined;\n\n  const handlePressIn = useCallback(() => {\n    setPressed(true);\n  }, []);\n\n  const handlePressOut = useCallback(() => {\n    setPressed(false);\n  }, []);\n\n  // Must have onPress for touch events to register (RN requirement)\n  // Even without a user-provided handler, we need a function to make text touchable\n  const handlePress = useCallback(\n    (event: GestureResponderEvent) => {\n      onPress?.(event);\n    },\n    [onPress],\n  );\n\n  linkStyles.useVariants({\n    textStyle: textVariant,\n    variant,\n    pressed,\n  });\n\n  // Get theme as SharedValue for worklet access (zero re-renders)\n  const animatedTheme = useAnimatedTheme();\n\n  // Derive underline visibility from pressed state\n  // useDerivedValue handles the animation automatically when deps change\n  const underlineProgress = useDerivedValue(() => {\n    const targetValue = pressed || alwaysUnderline ? 1 : 0;\n    return withTiming(targetValue, {\n      duration: 150,\n      easing: Easing.bezier(0, 0, 0.2, 1),\n    });\n  }, [pressed, alwaysUnderline]);\n\n  // Combined animated style for color and underline\n  const animatedTextStyle = useAnimatedStyle(() => {\n    // Access text color from theme using variant path\n    const components = animatedTheme.value.components;\n    const state = pressed ? 'pressed' : 'rest';\n    const textVariantPath = `link/variant/${variant}/rootText/${state}` as const;\n    const textColor = components[textVariantPath]?.color;\n\n    if (!textColor) {\n      return {};\n    }\n\n    const color = withTiming(textColor, {\n      duration: 150,\n      easing: Easing.bezier(0, 0, 0.2, 1),\n    });\n\n    // Interpolate underline opacity: 0 = transparent, 1 = text color\n    const underlineColor = interpolateColor(\n      underlineProgress.value,\n      [0, 1],\n      ['transparent', textColor],\n    );\n\n    return {\n      color,\n      textDecorationColor: underlineColor,\n    };\n  });\n\n  const textStyles = useMemo(() => {\n    return [linkStyles.root, linkStyles.text, animatedTextStyle, style];\n  }, [linkStyles.text, animatedTextStyle, style, linkStyles.root]);\n\n  const startIconStyles = useMemo(() => {\n    return [linkStyles.icon, linkStyles.iconStart, noUnderline];\n  }, [linkStyles.icon, linkStyles.iconStart, noUnderline]);\n\n  const endIconStyles = useMemo(() => {\n    return [linkStyles.icon, linkStyles.iconEnd, noUnderline];\n  }, [linkStyles.icon, linkStyles.iconEnd, noUnderline]);\n\n  return (\n    <AnimatedText\n      ref={ref}\n      onPress={handlePress}\n      onPressIn={handlePressIn}\n      onPressOut={handlePressOut}\n      suppressHighlighting\n      maxFontSizeMultiplier={resolvedMaxFontSizeMultiplier}\n      dynamicTypeRamp={dynamicTypeRamp}\n      style={textStyles}\n      {...rest}\n    >\n      {startIcon && (\n        <>\n          <IconSlot\n            icon={startIcon}\n            variant=\"outline\"\n            maxFontSizeMultiplier={resolvedMaxFontSizeMultiplier}\n            style={startIconStyles}\n          />\n          {/* TODO: need to add hairline space character to icon font so we can have space between icon and text https://hybridheroes.de/blog/2022-11-17-text-with-inline-icons-in-react-native/ */}\n          <RNText style={noUnderline}>{' \\u200A'}</RNText>\n        </>\n      )}\n      {children}\n      {endIcon && (\n        <>\n          {/* TODO: need to add hairline space character to icon font so we can have space between icon and text https://hybridheroes.de/blog/2022-11-17-text-with-inline-icons-in-react-native/ */}\n          <RNText style={noUnderline}>{' \\u200A'}</RNText>\n          <IconSlot\n            icon={endIcon}\n            variant=\"outline\"\n            maxFontSizeMultiplier={resolvedMaxFontSizeMultiplier}\n            style={endIconStyles}\n          />\n        </>\n      )}\n    </AnimatedText>\n  );\n});\n\nLink.displayName = 'Link';\n\nexport { Link, type LinkProps };\n"],"mappings":";;;;;;;;;;;AAqBA,MAAM,eAAe,SAAS;AAG9B,MAAM,cAAyB,EAAE,oBAAoB,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyD7D,MAAM,OAAO,KAAK,SAAS,KAAK,EAC9B,UACA,UAAU,WACV,aACA,kBAAkB,OAClB,WACA,SACA,uBACA,SACA,OACA,KACA,GAAG,QACS;CACZ,MAAM,CAAC,SAAS,cAAc,SAAS,MAAM;CAC7C,MAAM,sBAAsB;CAC5B,MAAM,gCAAgC,yBACpC,qBACA,sBACD;CACD,MAAM,kBAAkB,sBACpB,2BAA2B,uBAC3B,KAAA;CAEJ,MAAM,gBAAgB,kBAAkB;EACtC,WAAW,KAAK;IACf,EAAE,CAAC;CAEN,MAAM,iBAAiB,kBAAkB;EACvC,WAAW,MAAM;IAChB,EAAE,CAAC;CAIN,MAAM,cAAc,aACjB,UAAiC;EAChC,UAAU,MAAM;IAElB,CAAC,QAAQ,CACV;CAED,WAAW,YAAY;EACrB,WAAW;EACX;EACA;EACD,CAAC;CAGF,MAAM,gBAAgB,kBAAkB;CAIxC,MAAM,oBAAoB,sBAAsB;EAE9C,OAAO,WADa,WAAW,kBAAkB,IAAI,GACtB;GAC7B,UAAU;GACV,QAAQ,OAAO,OAAO,GAAG,GAAG,IAAK,EAAE;GACpC,CAAC;IACD,CAAC,SAAS,gBAAgB,CAAC;CAG9B,MAAM,oBAAoB,uBAAuB;EAK/C,MAAM,YAHa,cAAc,MAAM,WAGV,gBADW,QAAQ,YADlC,UAAU,YAAY,WAEW;EAE/C,IAAI,CAAC,WACH,OAAO,EAAE;EAeX,OAAO;GACL,OAbY,WAAW,WAAW;IAClC,UAAU;IACV,QAAQ,OAAO,OAAO,GAAG,GAAG,IAAK,EAAE;IACpC,CAUM;GACL,qBARqB,iBACrB,kBAAkB,OAClB,CAAC,GAAG,EAAE,EACN,CAAC,eAAe,UAAU,CAKS;GACpC;GACD;CAEF,MAAM,aAAa,cAAc;EAC/B,OAAO;GAAC,WAAW;GAAM,WAAW;GAAM;GAAmB;GAAM;IAClE;EAAC,WAAW;EAAM;EAAmB;EAAO,WAAW;EAAK,CAAC;CAEhE,MAAM,kBAAkB,cAAc;EACpC,OAAO;GAAC,WAAW;GAAM,WAAW;GAAW;GAAY;IAC1D;EAAC,WAAW;EAAM,WAAW;EAAW;EAAY,CAAC;CAExD,MAAM,gBAAgB,cAAc;EAClC,OAAO;GAAC,WAAW;GAAM,WAAW;GAAS;GAAY;IACxD;EAAC,WAAW;EAAM,WAAW;EAAS;EAAY,CAAC;CAEtD,OACE,qBAAC,cAAD;EACO;EACL,SAAS;EACT,WAAW;EACX,YAAY;EACZ,sBAAA;EACA,uBAAuB;EACN;EACjB,OAAO;EACP,GAAI;YATN;GAWG,aACC,qBAAA,UAAA,EAAA,UAAA,CACE,oBAAC,UAAD;IACE,MAAM;IACN,SAAQ;IACR,uBAAuB;IACvB,OAAO;IACP,CAAA,EAEF,oBAACA,MAAD;IAAQ,OAAO;cAAc;IAAmB,CAAA,CAC/C,EAAA,CAAA;GAEJ;GACA,WACC,qBAAA,UAAA,EAAA,UAAA,CAEE,oBAACA,MAAD;IAAQ,OAAO;cAAc;IAAmB,CAAA,EAChD,oBAAC,UAAD;IACE,MAAM;IACN,SAAQ;IACR,uBAAuB;IACvB,OAAO;IACP,CAAA,CACD,EAAA,CAAA;GAEQ;;EAEjB;AAEF,KAAK,cAAc"}

package/dist/components/Pagination/Pagination.cjs

@@ -1,7 +1,9 @@
 /*! © 2026 Yahoo, Inc. UDS Mobile v0.0.0-development */
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 require("../../_virtual/_rolldown/runtime.cjs");
+const require_fontScaling_FontScalingContext = require("../../fontScaling/FontScalingContext.cjs");
 const require_components_HStack = require("../HStack.cjs");
+const require_fontScaling_useMaxFontSizeMultiplier = require("../../fontScaling/useMaxFontSizeMultiplier.cjs");
 const require_components_Pagination_paginationContext = require("./paginationContext.cjs");
 const require_components_Pagination_paginationTheme = require("./paginationTheme.cjs");
 let react = require("react");
@@ -34,8 +36,9 @@ let react_native_unistyles = require("react-native-unistyles");
 * </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 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", maxFontSizeMultiplier, ...rest }) {
 	const { theme } = (0, react_native_unistyles.useUnistyles)();
+	const resolvedMaxFontSizeMultiplier = require_fontScaling_useMaxFontSizeMultiplier.useMaxFontSizeMultiplier("control", maxFontSizeMultiplier) ?? 0;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_Pagination_paginationContext.PaginationProvider, {
 		value: (0, react.useMemo)(() => ({
 			activePage,
@@ -44,6 +47,7 @@ const Pagination = (0, react.memo)(function Pagination({ activePage, totalPages,
 			ellipsisPlacement,
 			size,
 			variant,
+			maxFontSizeMultiplier: resolvedMaxFontSizeMultiplier,
 			getPageHref,
 			getItemAriaLabel,
 			onPageChange
@@ -54,19 +58,23 @@ const Pagination = (0, react.memo)(function Pagination({ activePage, totalPages,
 			ellipsisPlacement,
 			size,
 			variant,
+			resolvedMaxFontSizeMultiplier,
 			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
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_fontScaling_FontScalingContext.ResolvedControlFontScalingProvider, {
+			maxFontSizeMultiplier: resolvedMaxFontSizeMultiplier,
+			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
+			})
 		})
 	});
 });

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

@@ -7,6 +7,8 @@ import { ViewProps } from "react-native";
 interface PaginationProps extends Omit<UniversalPaginationProps, 'className' | 'children'>, Pick<ViewProps, 'children'> {
   /** Accessible label for the pagination control group. @default 'Pagination' */
   accessibilityLabel?: string;
+  /** Caps page labels, icons, and control geometry. Set null to remove the cap. @default 2 */
+  maxFontSizeMultiplier?: number | null;
 }
 /**
  * **Pagination — numbered page navigation component**

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

@@ -1 +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"}
+{"version":3,"file":"Pagination.d.cts","names":[],"sources":["../../../src/components/Pagination/Pagination.tsx"],"mappings":";;;;;;UAaU,eAAA,SACA,IAAA,CAAK,wBAAA,6BAAqD,IAAA,CAAK,SAAA;;EAEvE,kBAAA;EAHQ;EAKR,qBAAA;AAAA;;;;;;;;;;;;;;;AAAqB;;;;;;;;;;;;cA6BjB,UAAA,EAAU,OAAA,CAAA,oBAAA,CAAA,eAAA"}

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

@@ -7,6 +7,8 @@ import { ViewProps } from "react-native";
 interface PaginationProps extends Omit<UniversalPaginationProps, 'className' | 'children'>, Pick<ViewProps, 'children'> {
   /** Accessible label for the pagination control group. @default 'Pagination' */
   accessibilityLabel?: string;
+  /** Caps page labels, icons, and control geometry. Set null to remove the cap. @default 2 */
+  maxFontSizeMultiplier?: number | null;
 }
 /**
  * **Pagination — numbered page navigation component**

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

@@ -1 +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"}
+{"version":3,"file":"Pagination.d.ts","names":[],"sources":["../../../src/components/Pagination/Pagination.tsx"],"mappings":";;;;;;UAaU,eAAA,SACA,IAAA,CAAK,wBAAA,6BAAqD,IAAA,CAAK,SAAA;;EAEvE,kBAAA;EAHQ;EAKR,qBAAA;AAAA;;;;;;;;;;;;;;;AAAqB;;;;;;;;;;;;cA6BjB,UAAA,EAAU,OAAA,CAAA,oBAAA,CAAA,eAAA"}

package/dist/components/Pagination/Pagination.js

@@ -1,5 +1,7 @@
 /*! © 2026 Yahoo, Inc. UDS Mobile v0.0.0-development */
+import { ResolvedControlFontScalingProvider } from "../../fontScaling/FontScalingContext.js";
 import { HStack } from "../HStack.js";
+import { useMaxFontSizeMultiplier } from "../../fontScaling/useMaxFontSizeMultiplier.js";
 import { PaginationProvider, defaultGetItemAriaLabel } from "./paginationContext.js";
 import { getPaginationRootGapStyle } from "./paginationTheme.js";
 import { memo, useMemo } from "react";
@@ -32,8 +34,9 @@ import { useUnistyles } from "react-native-unistyles";
 * </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 Pagination = memo(function Pagination({ activePage, totalPages, maxVisiblePageNumbers = 7, ellipsisPlacement = "none", size = "md", variant = "default", getPageHref, getItemAriaLabel = defaultGetItemAriaLabel, onPageChange, children, accessibilityLabel = "Pagination", maxFontSizeMultiplier, ...rest }) {
 	const { theme } = useUnistyles();
+	const resolvedMaxFontSizeMultiplier = useMaxFontSizeMultiplier("control", maxFontSizeMultiplier) ?? 0;
 	return /* @__PURE__ */ jsx(PaginationProvider, {
 		value: useMemo(() => ({
 			activePage,
@@ -42,6 +45,7 @@ const Pagination = memo(function Pagination({ activePage, totalPages, maxVisible
 			ellipsisPlacement,
 			size,
 			variant,
+			maxFontSizeMultiplier: resolvedMaxFontSizeMultiplier,
 			getPageHref,
 			getItemAriaLabel,
 			onPageChange
@@ -52,19 +56,23 @@ const Pagination = memo(function Pagination({ activePage, totalPages, maxVisible
 			ellipsisPlacement,
 			size,
 			variant,
+			resolvedMaxFontSizeMultiplier,
 			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
+		children: /* @__PURE__ */ jsx(ResolvedControlFontScalingProvider, {
+			maxFontSizeMultiplier: resolvedMaxFontSizeMultiplier,
+			children: /* @__PURE__ */ jsx(HStack, {
+				alignItems: "center",
+				justifyContent: "center",
+				accessibilityLabel,
+				accessibilityRole: "none",
+				gap: useMemo(() => getPaginationRootGapStyle(theme, size), [size, theme]).gap,
+				alignSelf: "stretch",
+				...rest,
+				children
+			})
 		})
 	});
 });

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

@@ -1 +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"}
+{"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 { ResolvedControlFontScalingProvider } from '../../fontScaling/FontScalingContext';\nimport { useMaxFontSizeMultiplier } from '../../fontScaling/useMaxFontSizeMultiplier';\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  /** Caps page labels, icons, and control geometry. Set null to remove the cap. @default 2 */\n  maxFontSizeMultiplier?: number | null;\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  maxFontSizeMultiplier,\n  ...rest\n}: PaginationProps) {\n  const { theme } = useUnistyles();\n  const resolvedMaxFontSizeMultiplier =\n    useMaxFontSizeMultiplier('control', maxFontSizeMultiplier) ?? 0;\n\n  const contextValue = useMemo(\n    () => ({\n      activePage,\n      totalPages,\n      maxVisiblePageNumbers,\n      ellipsisPlacement,\n      size,\n      variant,\n      maxFontSizeMultiplier: resolvedMaxFontSizeMultiplier,\n      getPageHref,\n      getItemAriaLabel,\n      onPageChange,\n    }),\n    [\n      activePage,\n      totalPages,\n      maxVisiblePageNumbers,\n      ellipsisPlacement,\n      size,\n      variant,\n      resolvedMaxFontSizeMultiplier,\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      <ResolvedControlFontScalingProvider maxFontSizeMultiplier={resolvedMaxFontSizeMultiplier}>\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      </ResolvedControlFontScalingProvider>\n    </PaginationProvider>\n  );\n});\n\nPagination.displayName = 'Pagination';\n\nexport { Pagination, type PaginationProps };\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA+CA,MAAM,aAAa,KAAK,SAAS,WAAW,EAC1C,YACA,YACA,wBAAwB,GACxB,oBAAoB,QACpB,OAAO,MACP,UAAU,WACV,aACA,mBAAmB,yBACnB,cACA,UACA,qBAAqB,cACrB,uBACA,GAAG,QACe;CAClB,MAAM,EAAE,UAAU,cAAc;CAChC,MAAM,gCACJ,yBAAyB,WAAW,sBAAsB,IAAI;CA+BhE,OACE,oBAAC,oBAAD;EAAoB,OA9BD,eACZ;GACL;GACA;GACA;GACA;GACA;GACA;GACA,uBAAuB;GACvB;GACA;GACA;GACD,GACD;GACE;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACD,CAMsC;YACrC,oBAAC,oCAAD;GAAoC,uBAAuB;aACzD,oBAAC,QAAD;IACE,YAAW;IACX,gBAAe;IACK;IACpB,mBAAkB;IAClB,KAVa,cAAc,0BAA0B,OAAO,KAAK,EAAE,CAAC,MAAM,MAAM,CAU/D,CAAC;IAClB,WAAU;IACV,GAAI;IAEH;IACM,CAAA;GAC0B,CAAA;EAClB,CAAA;EAEvB;AAEF,WAAW,cAAc"}

package/dist/components/Pagination/PaginationEllipsis.cjs

@@ -1,6 +1,7 @@
 /*! © 2026 Yahoo, Inc. UDS Mobile v0.0.0-development */
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 require("../../_virtual/_rolldown/runtime.cjs");
+const require_fontScaling_useFontScale = require("../../fontScaling/useFontScale.cjs");
 const require_components_Text = require("../Text.cjs");
 const require_components_Pagination_paginationContext = require("./paginationContext.cjs");
 const require_components_Pagination_paginationTheme = require("./paginationTheme.cjs");
@@ -19,13 +20,16 @@ let react_native_unistyles = require("react-native-unistyles");
 * @platform mobile
 */
 const PaginationEllipsis = (0, react.memo)(function PaginationEllipsis({ style }) {
-	const { size, variant } = require_components_Pagination_paginationContext.usePaginationContext();
+	const { size, variant, maxFontSizeMultiplier } = require_components_Pagination_paginationContext.usePaginationContext();
 	const { theme } = (0, react_native_unistyles.useUnistyles)();
+	const sizeTextStyle = require_components_Pagination_paginationTheme.getPaginationSizeLayerStyle(theme, size, "text");
+	const fontScaleFactor = require_fontScaling_useFontScale.useFontScale(maxFontSizeMultiplier, typeof sizeTextStyle.lineHeight === "number" ? sizeTextStyle.lineHeight : sizeTextStyle.fontSize);
 	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);
+			const { controlSize: baseControlSize, borderRadius } = require_components_Pagination_paginationTheme.getPaginationControlMetrics(theme, size);
+			const controlSize = Math.round(baseControlSize * fontScaleFactor);
 			return [
 				paginationStaticStyles.root,
 				require_components_Pagination_paginationTheme.getMergedPaginationControlRootStyle(theme, size, variant, "off", "rest"),
@@ -37,6 +41,7 @@ const PaginationEllipsis = (0, react.memo)(function PaginationEllipsis({ style }
 				style
 			];
 		}, [
+			fontScaleFactor,
 			size,
 			style,
 			theme,
@@ -45,6 +50,7 @@ const PaginationEllipsis = (0, react.memo)(function PaginationEllipsis({ style }
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_Text.Text, {
 			color: "inherit",
 			variant: "inherit",
+			maxFontSizeMultiplier,
 			style: (0, react.useMemo)(() => require_components_Pagination_paginationTheme.getMergedPaginationTextStyle(theme, size, variant, "off", "rest"), [
 				size,
 				theme,

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

@@ -1 +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"}
+{"version":3,"file":"PaginationEllipsis.d.cts","names":[],"sources":["../../../src/components/Pagination/PaginationEllipsis.tsx"],"mappings":";;;;;UAgBU,uBAAA;EACR,KAAA,GAAQ,SAAA,CAAU,SAAA;AAAA;AAhBgD;;;;;;;;;AAAA,cA4B9D,kBAAA,EAAkB,OAAA,CAAA,oBAAA,CAAA,uBAAA"}

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

@@ -1 +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"}
+{"version":3,"file":"PaginationEllipsis.d.ts","names":[],"sources":["../../../src/components/Pagination/PaginationEllipsis.tsx"],"mappings":";;;;;UAgBU,uBAAA;EACR,KAAA,GAAQ,SAAA,CAAU,SAAA;AAAA;AAhBgD;;;;;;;;;AAAA,cA4B9D,kBAAA,EAAkB,OAAA,CAAA,oBAAA,CAAA,uBAAA"}

package/dist/components/Pagination/PaginationEllipsis.js

@@ -1,7 +1,8 @@
 /*! © 2026 Yahoo, Inc. UDS Mobile v0.0.0-development */
+import { useFontScale } from "../../fontScaling/useFontScale.js";
 import { Text as Text$1 } from "../Text.js";
 import { usePaginationContext } from "./paginationContext.js";
-import { getMergedPaginationControlRootStyle, getMergedPaginationTextStyle, getPaginationControlMetrics } from "./paginationTheme.js";
+import { getMergedPaginationControlRootStyle, getMergedPaginationTextStyle, getPaginationControlMetrics, getPaginationSizeLayerStyle } from "./paginationTheme.js";
 import { memo, useMemo } from "react";
 import { StyleSheet, View } from "react-native";
 import { jsx } from "react/jsx-runtime";
@@ -17,13 +18,16 @@ import { useUnistyles } from "react-native-unistyles";
 * @platform mobile
 */
 const PaginationEllipsis = memo(function PaginationEllipsis({ style }) {
-	const { size, variant } = usePaginationContext();
+	const { size, variant, maxFontSizeMultiplier } = usePaginationContext();
 	const { theme } = useUnistyles();
+	const sizeTextStyle = getPaginationSizeLayerStyle(theme, size, "text");
+	const fontScaleFactor = useFontScale(maxFontSizeMultiplier, typeof sizeTextStyle.lineHeight === "number" ? sizeTextStyle.lineHeight : sizeTextStyle.fontSize);
 	return /* @__PURE__ */ jsx(View, {
 		accessibilityElementsHidden: true,
 		importantForAccessibility: "no-hide-descendants",
 		style: useMemo(() => {
-			const { controlSize, borderRadius } = getPaginationControlMetrics(theme, size);
+			const { controlSize: baseControlSize, borderRadius } = getPaginationControlMetrics(theme, size);
+			const controlSize = Math.round(baseControlSize * fontScaleFactor);
 			return [
 				paginationStaticStyles.root,
 				getMergedPaginationControlRootStyle(theme, size, variant, "off", "rest"),
@@ -35,6 +39,7 @@ const PaginationEllipsis = memo(function PaginationEllipsis({ style }) {
 				style
 			];
 		}, [
+			fontScaleFactor,
 			size,
 			style,
 			theme,
@@ -43,6 +48,7 @@ const PaginationEllipsis = memo(function PaginationEllipsis({ style }) {
 		children: /* @__PURE__ */ jsx(Text$1, {
 			color: "inherit",
 			variant: "inherit",
+			maxFontSizeMultiplier,
 			style: useMemo(() => getMergedPaginationTextStyle(theme, size, variant, "off", "rest"), [
 				size,
 				theme,

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

@@ -1 +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"}
+{"version":3,"file":"PaginationEllipsis.js","names":["Text"],"sources":["../../../src/components/Pagination/PaginationEllipsis.tsx"],"sourcesContent":["import { memo, useMemo } from 'react';\nimport type { StyleProp, TextStyle, 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 { useFontScale } from '../../fontScaling/useFontScale';\nimport { Text } from '../Text';\nimport { usePaginationContext } from './paginationContext';\nimport {\n  getMergedPaginationControlRootStyle,\n  getMergedPaginationTextStyle,\n  getPaginationControlMetrics,\n  getPaginationSizeLayerStyle,\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, maxFontSizeMultiplier } = usePaginationContext();\n  const { theme } = useUnistyles();\n  const sizeTextStyle = getPaginationSizeLayerStyle(theme, size, 'text') as TextStyle;\n  const fontScaleFactor = useFontScale(\n    maxFontSizeMultiplier,\n    typeof sizeTextStyle.lineHeight === 'number'\n      ? sizeTextStyle.lineHeight\n      : sizeTextStyle.fontSize,\n  );\n\n  const rootStyle = useMemo<StyleProp<ViewStyle>>(() => {\n    const { controlSize: baseControlSize, borderRadius } = getPaginationControlMetrics(theme, size);\n    const controlSize = Math.round(baseControlSize * fontScaleFactor);\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  }, [fontScaleFactor, 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\n        color=\"inherit\"\n        variant=\"inherit\"\n        maxFontSizeMultiplier={maxFontSizeMultiplier}\n        style={textStyle}\n      >\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":";;;;;;;;;;;;;;;;;;;AA6BA,MAAM,qBAAqB,KAAK,SAAS,mBAAmB,EAAE,SAAkC;CAC9F,MAAM,EAAE,MAAM,SAAS,0BAA0B,sBAAsB;CACvE,MAAM,EAAE,UAAU,cAAc;CAChC,MAAM,gBAAgB,4BAA4B,OAAO,MAAM,OAAO;CACtE,MAAM,kBAAkB,aACtB,uBACA,OAAO,cAAc,eAAe,WAChC,cAAc,aACd,cAAc,SACnB;CAuBD,OACE,oBAAC,MAAD;EACE,6BAAA;EACA,2BAA0B;EAC1B,OAzBc,cAAoC;GACpD,MAAM,EAAE,aAAa,iBAAiB,iBAAiB,4BAA4B,OAAO,KAAK;GAC/F,MAAM,cAAc,KAAK,MAAM,kBAAkB,gBAAgB;GAEjE,OAAO;IACL,uBAAuB;IACvB,oCAAoC,OAAO,MAAM,SAAS,OAAO,OAAO;IACxE;KACE;KACA,QAAQ;KACR,OAAO;KACR;IACD;IACD;KACA;GAAC;GAAiB;GAAM;GAAO;GAAO;GAAQ,CAW7B;YAEhB,oBAACA,QAAD;GACE,OAAM;GACN,SAAQ;GACe;GACvB,OAfY,cACV,6BAA6B,OAAO,MAAM,SAAS,OAAO,OAAO,EACvE;IAAC;IAAM;IAAO;IAAQ,CAaF;aACjB;GAEM,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

@@ -18,7 +18,7 @@ let react_jsx_runtime = require("react/jsx-runtime");
 * @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 { activePage, size, variant, maxFontSizeMultiplier, 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({
@@ -57,6 +57,7 @@ const PaginationItem = (0, react.memo)(function PaginationItem({ page, children,
 		children: typeof label === "string" || typeof label === "number" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_Text.Text, {
 			color: "inherit",
 			variant: "inherit",
+			maxFontSizeMultiplier,
 			style: textStyle,
 			dangerouslySetColor: resolvedTextColor,
 			children: label

package/dist/components/Pagination/PaginationItem.js

@@ -16,7 +16,7 @@ import { jsx } from "react/jsx-runtime";
 * @platform mobile
 */
 const PaginationItem = memo(function PaginationItem({ page, children, onPress, ...rest }) {
-	const { activePage, size, variant, getItemAriaLabel, onPageChange } = usePaginationContext();
+	const { activePage, size, variant, maxFontSizeMultiplier, getItemAriaLabel, onPageChange } = usePaginationContext();
 	const isActive = page === activePage;
 	const [pressed, setPressed] = useState(false);
 	const { rootStyle, textStyle } = usePaginationControlStyles({
@@ -55,6 +55,7 @@ const PaginationItem = memo(function PaginationItem({ page, children, onPress, .
 		children: typeof label === "string" || typeof label === "number" ? /* @__PURE__ */ jsx(Text$1, {
 			color: "inherit",
 			variant: "inherit",
+			maxFontSizeMultiplier,
 			style: textStyle,
 			dangerouslySetColor: resolvedTextColor,
 			children: label

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

@@ -1 +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"}
+{"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, maxFontSizeMultiplier, getItemAriaLabel, onPageChange } =\n    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          maxFontSizeMultiplier={maxFontSizeMultiplier}\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,uBAAuB,kBAAkB,iBAC1E,sBAAsB;CACxB,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;GACe;GACvB,OAAO;GACP,qBAAqB;aAEpB;GACI,CAAA,GAEP;EAEQ,CAAA;EAEd;AAEF,eAAe,cAAc"}

package/dist/components/Pagination/PaginationLink.cjs

@@ -18,7 +18,7 @@ let react_jsx_runtime = require("react/jsx-runtime");
 * @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 { activePage, size, variant, maxFontSizeMultiplier, 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({
@@ -57,6 +57,7 @@ const PaginationLink = (0, react.memo)(function PaginationLink({ page, href: _hr
 		children: typeof label === "string" || typeof label === "number" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_Text.Text, {
 			color: "inherit",
 			variant: "inherit",
+			maxFontSizeMultiplier,
 			style: textStyle,
 			dangerouslySetColor: resolvedTextColor,
 			children: label

package/dist/components/Pagination/PaginationLink.js

@@ -16,7 +16,7 @@ import { jsx } from "react/jsx-runtime";
 * @platform mobile
 */
 const PaginationLink = memo(function PaginationLink({ page, href: _href, children, onPress, ...rest }) {
-	const { activePage, size, variant, getItemAriaLabel, onPageChange } = usePaginationContext();
+	const { activePage, size, variant, maxFontSizeMultiplier, getItemAriaLabel, onPageChange } = usePaginationContext();
 	const isActive = page === activePage;
 	const [pressed, setPressed] = useState(false);
 	const { rootStyle, textStyle } = usePaginationControlStyles({
@@ -55,6 +55,7 @@ const PaginationLink = memo(function PaginationLink({ page, href: _href, childre
 		children: typeof label === "string" || typeof label === "number" ? /* @__PURE__ */ jsx(Text$1, {
 			color: "inherit",
 			variant: "inherit",
+			maxFontSizeMultiplier,
 			style: textStyle,
 			dangerouslySetColor: resolvedTextColor,
 			children: label

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

@@ -1 +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"}
+{"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, maxFontSizeMultiplier, getItemAriaLabel, onPageChange } =\n    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          maxFontSizeMultiplier={maxFontSizeMultiplier}\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,uBAAuB,kBAAkB,iBAC1E,sBAAsB;CACxB,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;GACe;GACvB,OAAO;GACP,qBAAqB;aAEpB;GACI,CAAA,GAEP;EAEQ,CAAA;EAEd;AAEF,eAAe,cAAc"}

package/dist/components/Pagination/PaginationNext.cjs

@@ -19,7 +19,7 @@ let react_jsx_runtime = require("react/jsx-runtime");
 * @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 { activePage, totalPages, size, variant, maxFontSizeMultiplier, onPageChange } = require_components_Pagination_paginationContext.usePaginationContext();
 	const [pressed, setPressed] = (0, react.useState)(false);
 	(0, react.useEffect)(() => {
 		setPressed(false);
@@ -47,6 +47,7 @@ const PaginationNext = (0, react.memo)(function PaginationNext({ label = "Next",
 	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",
+		maxFontSizeMultiplier,
 		style: textStyle,
 		dangerouslySetColor: resolvedTextColor,
 		children: label
@@ -54,6 +55,7 @@ const PaginationNext = (0, react.memo)(function PaginationNext({ label = "Next",
 		name: "ChevronRight",
 		size: "sm",
 		color: iconStyle?.color,
+		maxFontSizeMultiplier,
 		style: iconStyle
 	})] });
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_native.Pressable, {