@yahoo/uds-mobile 2.24.0-beta.4 → 2.24.0-beta.6

package/dist/components/Select/SelectTrigger.cjs

@@ -1,6 +1,7 @@
 /*! © 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_useFontScale = require("../../fontScaling/useFontScale.cjs");
 const require_components_IconSlot = require("../IconSlot.cjs");
 const require_components_internal_Overlay_measureTrigger = require("../internal/Overlay/measureTrigger.cjs");
 const require_components_Select_selectContext = require("./selectContext.cjs");
@@ -13,7 +14,7 @@ react_native_reanimated = require_runtime.__toESM(react_native_reanimated);
 //#region src/components/Select/SelectTrigger.tsx
 const SelectTrigger = (0, react.memo)(function SelectTrigger({ startIcon, endIcon }) {
 	const { value, open, setOpen, triggerRef, triggerRect, setTriggerRect, getItemLabel, setHighlightedValue, reduceMotion } = require_components_Select_selectContext.useSelectContext();
-	const { size, disabled, readOnly, hasError, placeholder, uid, width } = require_components_Select_selectContext.useSelectFieldContext();
+	const { size, disabled, readOnly, hasError, placeholder, uid, width, maxFontSizeMultiplier } = require_components_Select_selectContext.useSelectFieldContext();
 	const hasValue = value.length > 0;
 	const valueState = hasValue ? "filled" : "empty";
 	const isInteractive = !readOnly && !disabled;
@@ -26,17 +27,27 @@ const SelectTrigger = (0, react.memo)(function SelectTrigger({ startIcon, endIco
 		readonly: readOnly,
 		invalid: hasError
 	});
-	const inputWrapperStyle = (0, react.useMemo)(() => [
-		generated_styles.inputStyles.inputWrapper,
-		generated_styles.inputStyles.inputWrapperStatic,
-		generated_styles.inputStyles.inputWrapperDynamic,
-		{
-			flexDirection: "row",
-			alignItems: "center",
-			width,
-			alignSelf: "stretch"
-		}
-	], [
+	const fontScaleFactor = require_fontScaling_useFontScale.useFontScale(maxFontSizeMultiplier, (typeof generated_styles.inputStyles.inputWrapperStatic.lineHeight === "number" ? generated_styles.inputStyles.inputWrapperStatic.lineHeight : void 0) ?? (typeof generated_styles.inputStyles.inputWrapperStatic.fontSize === "number" ? generated_styles.inputStyles.inputWrapperStatic.fontSize : void 0));
+	const inputWrapperStyle = (0, react.useMemo)(() => {
+		const { gap, paddingVertical } = generated_styles.inputStyles.inputWrapperStatic;
+		const scaledMetrics = fontScaleFactor === 1 ? void 0 : {
+			...typeof gap === "number" && { gap: Math.round(gap * fontScaleFactor) },
+			...typeof paddingVertical === "number" && { paddingVertical: Math.round(paddingVertical * fontScaleFactor) }
+		};
+		return [
+			generated_styles.inputStyles.inputWrapper,
+			generated_styles.inputStyles.inputWrapperStatic,
+			generated_styles.inputStyles.inputWrapperDynamic,
+			scaledMetrics,
+			{
+				flexDirection: "row",
+				alignItems: "center",
+				width,
+				alignSelf: "stretch"
+			}
+		];
+	}, [
+		fontScaleFactor,
 		generated_styles.inputStyles.inputWrapper,
 		generated_styles.inputStyles.inputWrapperDynamic,
 		generated_styles.inputStyles.inputWrapperStatic,
@@ -45,7 +56,7 @@ const SelectTrigger = (0, react.memo)(function SelectTrigger({ startIcon, endIco
 	const textContainerStyle = (0, react.useMemo)(() => [{
 		flex: 1,
 		justifyContent: "center"
-	}, typeof generated_styles.inputStyles.input.height === "number" ? { minHeight: generated_styles.inputStyles.input.height } : null], [generated_styles.inputStyles.input]);
+	}, typeof generated_styles.inputStyles.input.height === "number" ? { minHeight: Math.round(generated_styles.inputStyles.input.height * fontScaleFactor) } : null], [fontScaleFactor, generated_styles.inputStyles.input]);
 	const textInputStyle = (0, react.useMemo)(() => [
 		{
 			fontFamily: generated_styles.inputStyles.inputWrapperStatic.fontFamily,
@@ -111,12 +122,15 @@ const SelectTrigger = (0, react.memo)(function SelectTrigger({ startIcon, endIco
 				startIcon ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_IconSlot.IconSlot, {
 					icon: startIcon,
 					variant: "outline",
+					maxFontSizeMultiplier,
 					style: generated_styles.inputStyles.startIcon
 				}) : null,
 				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_native.View, {
 					style: textContainerStyle,
 					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_native.Text, {
 						numberOfLines: 1,
+						maxFontSizeMultiplier,
+						dynamicTypeRamp: "body",
 						style: textInputStyle,
 						children: displayText
 					})
@@ -128,6 +142,7 @@ const SelectTrigger = (0, react.memo)(function SelectTrigger({ startIcon, endIco
 						icon: useAnimatedChevron ? "ChevronDown" : endIcon,
 						size: "sm",
 						variant: "outline",
+						maxFontSizeMultiplier,
 						style: generated_styles.inputStyles.endIcon
 					})
 				}) : null

package/dist/components/Select/SelectTrigger.d.cts.map

@@ -1 +1 @@
-{"version":3,"file":"SelectTrigger.d.cts","names":[],"sources":["../../../src/components/Select/SelectTrigger.tsx"],"mappings":";;;;;UAgBU,kBAAA;EACR,SAAA,GAAY,YAAA;EACZ,OAAA,GAAU,YAAA;AAAA;AAAA,cAGN,aAAA,EAAa,OAAA,CAAA,oBAAA,CAAA,kBAAA"}
+{"version":3,"file":"SelectTrigger.d.cts","names":[],"sources":["../../../src/components/Select/SelectTrigger.tsx"],"mappings":";;;;;UAiBU,kBAAA;EACR,SAAA,GAAY,YAAA;EACZ,OAAA,GAAU,YAAA;AAAA;AAAA,cAGN,aAAA,EAAa,OAAA,CAAA,oBAAA,CAAA,kBAAA"}

package/dist/components/Select/SelectTrigger.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SelectTrigger.d.ts","names":[],"sources":["../../../src/components/Select/SelectTrigger.tsx"],"mappings":";;;;;UAgBU,kBAAA;EACR,SAAA,GAAY,YAAA;EACZ,OAAA,GAAU,YAAA;AAAA;AAAA,cAGN,aAAA,EAAa,OAAA,CAAA,oBAAA,CAAA,kBAAA"}
+{"version":3,"file":"SelectTrigger.d.ts","names":[],"sources":["../../../src/components/Select/SelectTrigger.tsx"],"mappings":";;;;;UAiBU,kBAAA;EACR,SAAA,GAAY,YAAA;EACZ,OAAA,GAAU,YAAA;AAAA;AAAA,cAGN,aAAA,EAAa,OAAA,CAAA,oBAAA,CAAA,kBAAA"}

package/dist/components/Select/SelectTrigger.js

@@ -1,4 +1,5 @@
 /*! © 2026 Yahoo, Inc. UDS Mobile v0.0.0-development */
+import { useFontScale } from "../../fontScaling/useFontScale.js";
 import { IconSlot } from "../IconSlot.js";
 import { measureTrigger } from "../internal/Overlay/measureTrigger.js";
 import { useSelectContext, useSelectFieldContext } from "./selectContext.js";
@@ -10,7 +11,7 @@ import Animated, { Easing, useAnimatedStyle, useDerivedValue, withTiming } from
 //#region src/components/Select/SelectTrigger.tsx
 const SelectTrigger = memo(function SelectTrigger({ startIcon, endIcon }) {
 	const { value, open, setOpen, triggerRef, triggerRect, setTriggerRect, getItemLabel, setHighlightedValue, reduceMotion } = useSelectContext();
-	const { size, disabled, readOnly, hasError, placeholder, uid, width } = useSelectFieldContext();
+	const { size, disabled, readOnly, hasError, placeholder, uid, width, maxFontSizeMultiplier } = useSelectFieldContext();
 	const hasValue = value.length > 0;
 	const valueState = hasValue ? "filled" : "empty";
 	const isInteractive = !readOnly && !disabled;
@@ -23,17 +24,27 @@ const SelectTrigger = memo(function SelectTrigger({ startIcon, endIcon }) {
 		readonly: readOnly,
 		invalid: hasError
 	});
-	const inputWrapperStyle = useMemo(() => [
-		inputStyles.inputWrapper,
-		inputStyles.inputWrapperStatic,
-		inputStyles.inputWrapperDynamic,
-		{
-			flexDirection: "row",
-			alignItems: "center",
-			width,
-			alignSelf: "stretch"
-		}
-	], [
+	const fontScaleFactor = useFontScale(maxFontSizeMultiplier, (typeof inputStyles.inputWrapperStatic.lineHeight === "number" ? inputStyles.inputWrapperStatic.lineHeight : void 0) ?? (typeof inputStyles.inputWrapperStatic.fontSize === "number" ? inputStyles.inputWrapperStatic.fontSize : void 0));
+	const inputWrapperStyle = useMemo(() => {
+		const { gap, paddingVertical } = inputStyles.inputWrapperStatic;
+		const scaledMetrics = fontScaleFactor === 1 ? void 0 : {
+			...typeof gap === "number" && { gap: Math.round(gap * fontScaleFactor) },
+			...typeof paddingVertical === "number" && { paddingVertical: Math.round(paddingVertical * fontScaleFactor) }
+		};
+		return [
+			inputStyles.inputWrapper,
+			inputStyles.inputWrapperStatic,
+			inputStyles.inputWrapperDynamic,
+			scaledMetrics,
+			{
+				flexDirection: "row",
+				alignItems: "center",
+				width,
+				alignSelf: "stretch"
+			}
+		];
+	}, [
+		fontScaleFactor,
 		inputStyles.inputWrapper,
 		inputStyles.inputWrapperDynamic,
 		inputStyles.inputWrapperStatic,
@@ -42,7 +53,7 @@ const SelectTrigger = memo(function SelectTrigger({ startIcon, endIcon }) {
 	const textContainerStyle = useMemo(() => [{
 		flex: 1,
 		justifyContent: "center"
-	}, typeof inputStyles.input.height === "number" ? { minHeight: inputStyles.input.height } : null], [inputStyles.input]);
+	}, typeof inputStyles.input.height === "number" ? { minHeight: Math.round(inputStyles.input.height * fontScaleFactor) } : null], [fontScaleFactor, inputStyles.input]);
 	const textInputStyle = useMemo(() => [
 		{
 			fontFamily: inputStyles.inputWrapperStatic.fontFamily,
@@ -108,12 +119,15 @@ const SelectTrigger = memo(function SelectTrigger({ startIcon, endIcon }) {
 				startIcon ? /* @__PURE__ */ jsx(IconSlot, {
 					icon: startIcon,
 					variant: "outline",
+					maxFontSizeMultiplier,
 					style: inputStyles.startIcon
 				}) : null,
 				/* @__PURE__ */ jsx(View, {
 					style: textContainerStyle,
 					children: /* @__PURE__ */ jsx(Text, {
 						numberOfLines: 1,
+						maxFontSizeMultiplier,
+						dynamicTypeRamp: "body",
 						style: textInputStyle,
 						children: displayText
 					})
@@ -125,6 +139,7 @@ const SelectTrigger = memo(function SelectTrigger({ startIcon, endIcon }) {
 						icon: useAnimatedChevron ? "ChevronDown" : endIcon,
 						size: "sm",
 						variant: "outline",
+						maxFontSizeMultiplier,
 						style: inputStyles.endIcon
 					})
 				}) : null

package/dist/components/Select/SelectTrigger.js.map

@@ -1 +1 @@
-{"version":3,"file":"SelectTrigger.js","names":["RNPressable","RNView","RNText"],"sources":["../../../src/components/Select/SelectTrigger.tsx"],"sourcesContent":["import { memo, useCallback, useMemo } from 'react';\nimport type { View } from 'react-native';\nimport { Pressable as RNPressable, Text as RNText, View as RNView } from 'react-native';\nimport Animated, {\n  Easing,\n  useAnimatedStyle,\n  useDerivedValue,\n  withTiming,\n} from 'react-native-reanimated';\n\nimport { inputStyles } from '../../../generated/styles';\nimport type { IconSlotType } from '../IconSlot';\nimport { IconSlot } from '../IconSlot';\nimport { measureTrigger } from '../internal/Overlay';\nimport { useSelectContext, useSelectFieldContext } from './selectContext';\n\ninterface SelectTriggerProps {\n  startIcon?: IconSlotType;\n  endIcon?: IconSlotType;\n}\n\nconst SelectTrigger = memo(function SelectTrigger({ startIcon, endIcon }: SelectTriggerProps) {\n  const {\n    value,\n    open,\n    setOpen,\n    triggerRef,\n    triggerRect,\n    setTriggerRect,\n    getItemLabel,\n    setHighlightedValue,\n    reduceMotion,\n  } = useSelectContext();\n  const { size, disabled, readOnly, hasError, placeholder, uid, width } = useSelectFieldContext();\n\n  const hasValue = value.length > 0;\n  const valueState = hasValue ? 'filled' : 'empty';\n  const isInteractive = !readOnly && !disabled;\n  const useAnimatedChevron = endIcon === undefined;\n  const displayText = hasValue ? (getItemLabel(value) ?? value) : (placeholder ?? '');\n\n  inputStyles.useVariants({\n    size,\n    value: valueState,\n    pressed: open,\n    readonly: readOnly,\n    invalid: hasError,\n  });\n\n  const inputWrapperStyle = useMemo(\n    () => [\n      inputStyles.inputWrapper,\n      inputStyles.inputWrapperStatic,\n      inputStyles.inputWrapperDynamic,\n      {\n        flexDirection: 'row' as const,\n        alignItems: 'center' as const,\n        width,\n        alignSelf: 'stretch' as const,\n      },\n    ],\n    [\n      inputStyles.inputWrapper,\n      inputStyles.inputWrapperDynamic,\n      inputStyles.inputWrapperStatic,\n      width,\n    ],\n  );\n\n  const textContainerStyle = useMemo(\n    () => [\n      {\n        flex: 1,\n        justifyContent: 'center' as const,\n      },\n      typeof inputStyles.input.height === 'number' ? { minHeight: inputStyles.input.height } : null,\n    ],\n    [inputStyles.input],\n  );\n\n  const textInputStyle = useMemo(\n    () => [\n      {\n        fontFamily: inputStyles.inputWrapperStatic.fontFamily,\n        fontSize: inputStyles.inputWrapperStatic.fontSize,\n        letterSpacing: inputStyles.inputWrapperStatic.letterSpacing,\n        // Match TextInput vertical centering: wrapper lineHeight is for layout, not single-line text.\n        lineHeight: inputStyles.inputWrapperStatic.fontSize,\n        paddingVertical: 0,\n      },\n      inputStyles.input,\n      { height: undefined },\n      !hasValue ? inputStyles.inputPlaceholder : null,\n    ],\n    [hasValue, inputStyles.input, inputStyles.inputPlaceholder, inputStyles.inputWrapperStatic],\n  );\n\n  const chevronProgress = useDerivedValue(\n    () =>\n      withTiming(open ? 1 : 0, {\n        duration: reduceMotion ? 0 : 200,\n        easing: Easing.out(Easing.ease),\n      }),\n    [open, reduceMotion],\n  );\n\n  const chevronAnimatedStyle = useAnimatedStyle(() => ({\n    transform: [{ rotate: `${chevronProgress.value * 180}deg` }],\n  }));\n\n  const handleRef = useCallback(\n    (node: View | null) => {\n      triggerRef.current = node;\n    },\n    [triggerRef],\n  );\n\n  const handlePress = useCallback(() => {\n    if (!isInteractive) {\n      return;\n    }\n\n    if (open) {\n      setOpen(false);\n      setHighlightedValue(null);\n      return;\n    }\n\n    measureTrigger(triggerRef.current, triggerRect, setTriggerRect);\n    setHighlightedValue(null);\n    setOpen(true);\n  }, [isInteractive, open, setHighlightedValue, setOpen, setTriggerRect, triggerRect, triggerRef]);\n\n  return (\n    <RNPressable\n      ref={handleRef}\n      testID=\"select-trigger\"\n      onPress={handlePress}\n      disabled={!isInteractive}\n      style={{ width, alignSelf: 'stretch' }}\n      accessibilityRole=\"button\"\n      accessibilityLabel={displayText || uid}\n      accessibilityState={{\n        disabled: !isInteractive,\n        expanded: open,\n        selected: hasValue,\n      }}\n    >\n      <RNView style={inputWrapperStyle} pointerEvents=\"none\">\n        {startIcon ? (\n          <IconSlot icon={startIcon} variant=\"outline\" style={inputStyles.startIcon} />\n        ) : null}\n\n        <RNView style={textContainerStyle}>\n          <RNText numberOfLines={1} style={textInputStyle}>\n            {displayText}\n          </RNText>\n        </RNView>\n\n        {useAnimatedChevron || endIcon ? (\n          <Animated.View\n            style={useAnimatedChevron ? chevronAnimatedStyle : undefined}\n            testID=\"select-chevron\"\n          >\n            <IconSlot\n              icon={useAnimatedChevron ? 'ChevronDown' : endIcon!}\n              size=\"sm\"\n              variant=\"outline\"\n              style={inputStyles.endIcon}\n            />\n          </Animated.View>\n        ) : null}\n      </RNView>\n    </RNPressable>\n  );\n});\n\nSelectTrigger.displayName = 'SelectTrigger';\n\nexport { SelectTrigger, type SelectTriggerProps };\n"],"mappings":";;;;;;;;;;AAqBA,MAAM,gBAAgB,KAAK,SAAS,cAAc,EAAE,WAAW,WAA+B;CAC5F,MAAM,EACJ,OACA,MACA,SACA,YACA,aACA,gBACA,cACA,qBACA,iBACE,kBAAkB;CACtB,MAAM,EAAE,MAAM,UAAU,UAAU,UAAU,aAAa,KAAK,UAAU,uBAAuB;CAE/F,MAAM,WAAW,MAAM,SAAS;CAChC,MAAM,aAAa,WAAW,WAAW;CACzC,MAAM,gBAAgB,CAAC,YAAY,CAAC;CACpC,MAAM,qBAAqB,YAAY,KAAA;CACvC,MAAM,cAAc,WAAY,aAAa,MAAM,IAAI,QAAU,eAAe;CAEhF,YAAY,YAAY;EACtB;EACA,OAAO;EACP,SAAS;EACT,UAAU;EACV,SAAS;EACV,CAAC;CAEF,MAAM,oBAAoB,cAClB;EACJ,YAAY;EACZ,YAAY;EACZ,YAAY;EACZ;GACE,eAAe;GACf,YAAY;GACZ;GACA,WAAW;GACZ;EACF,EACD;EACE,YAAY;EACZ,YAAY;EACZ,YAAY;EACZ;EACD,CACF;CAED,MAAM,qBAAqB,cACnB,CACJ;EACE,MAAM;EACN,gBAAgB;EACjB,EACD,OAAO,YAAY,MAAM,WAAW,WAAW,EAAE,WAAW,YAAY,MAAM,QAAQ,GAAG,KAC1F,EACD,CAAC,YAAY,MAAM,CACpB;CAED,MAAM,iBAAiB,cACf;EACJ;GACE,YAAY,YAAY,mBAAmB;GAC3C,UAAU,YAAY,mBAAmB;GACzC,eAAe,YAAY,mBAAmB;GAE9C,YAAY,YAAY,mBAAmB;GAC3C,iBAAiB;GAClB;EACD,YAAY;EACZ,EAAE,QAAQ,KAAA,GAAW;EACrB,CAAC,WAAW,YAAY,mBAAmB;EAC5C,EACD;EAAC;EAAU,YAAY;EAAO,YAAY;EAAkB,YAAY;EAAmB,CAC5F;CAED,MAAM,kBAAkB,sBAEpB,WAAW,OAAO,IAAI,GAAG;EACvB,UAAU,eAAe,IAAI;EAC7B,QAAQ,OAAO,IAAI,OAAO,KAAK;EAChC,CAAC,EACJ,CAAC,MAAM,aAAa,CACrB;CAED,MAAM,uBAAuB,wBAAwB,EACnD,WAAW,CAAC,EAAE,QAAQ,GAAG,gBAAgB,QAAQ,IAAI,MAAM,CAAC,EAC7D,EAAE;CAyBH,OACE,oBAACA,WAAD;EACE,KAzBc,aACf,SAAsB;GACrB,WAAW,UAAU;KAEvB,CAAC,WAAW,CAqBI;EACd,QAAO;EACP,SApBgB,kBAAkB;GACpC,IAAI,CAAC,eACH;GAGF,IAAI,MAAM;IACR,QAAQ,MAAM;IACd,oBAAoB,KAAK;IACzB;;GAGF,eAAe,WAAW,SAAS,aAAa,eAAe;GAC/D,oBAAoB,KAAK;GACzB,QAAQ,KAAK;KACZ;GAAC;GAAe;GAAM;GAAqB;GAAS;GAAgB;GAAa;GAAW,CAMvE;EACpB,UAAU,CAAC;EACX,OAAO;GAAE;GAAO,WAAW;GAAW;EACtC,mBAAkB;EAClB,oBAAoB,eAAe;EACnC,oBAAoB;GAClB,UAAU,CAAC;GACX,UAAU;GACV,UAAU;GACX;YAED,qBAACC,MAAD;GAAQ,OAAO;GAAmB,eAAc;aAAhD;IACG,YACC,oBAAC,UAAD;KAAU,MAAM;KAAW,SAAQ;KAAU,OAAO,YAAY;KAAa,CAAA,GAC3E;IAEJ,oBAACA,MAAD;KAAQ,OAAO;eACb,oBAACC,MAAD;MAAQ,eAAe;MAAG,OAAO;gBAC9B;MACM,CAAA;KACF,CAAA;IAER,sBAAsB,UACrB,oBAAC,SAAS,MAAV;KACE,OAAO,qBAAqB,uBAAuB,KAAA;KACnD,QAAO;eAEP,oBAAC,UAAD;MACE,MAAM,qBAAqB,gBAAgB;MAC3C,MAAK;MACL,SAAQ;MACR,OAAO,YAAY;MACnB,CAAA;KACY,CAAA,GACd;IACG;;EACG,CAAA;EAEhB;AAEF,cAAc,cAAc"}
+{"version":3,"file":"SelectTrigger.js","names":["RNPressable","RNView","RNText"],"sources":["../../../src/components/Select/SelectTrigger.tsx"],"sourcesContent":["import { memo, useCallback, useMemo } from 'react';\nimport type { View } from 'react-native';\nimport { Pressable as RNPressable, Text as RNText, View as RNView } from 'react-native';\nimport Animated, {\n  Easing,\n  useAnimatedStyle,\n  useDerivedValue,\n  withTiming,\n} from 'react-native-reanimated';\n\nimport { inputStyles } from '../../../generated/styles';\nimport { useFontScale } from '../../fontScaling/useFontScale';\nimport type { IconSlotType } from '../IconSlot';\nimport { IconSlot } from '../IconSlot';\nimport { measureTrigger } from '../internal/Overlay';\nimport { useSelectContext, useSelectFieldContext } from './selectContext';\n\ninterface SelectTriggerProps {\n  startIcon?: IconSlotType;\n  endIcon?: IconSlotType;\n}\n\nconst SelectTrigger = memo(function SelectTrigger({ startIcon, endIcon }: SelectTriggerProps) {\n  const {\n    value,\n    open,\n    setOpen,\n    triggerRef,\n    triggerRect,\n    setTriggerRect,\n    getItemLabel,\n    setHighlightedValue,\n    reduceMotion,\n  } = useSelectContext();\n  const { size, disabled, readOnly, hasError, placeholder, uid, width, maxFontSizeMultiplier } =\n    useSelectFieldContext();\n\n  const hasValue = value.length > 0;\n  const valueState = hasValue ? 'filled' : 'empty';\n  const isInteractive = !readOnly && !disabled;\n  const useAnimatedChevron = endIcon === undefined;\n  const displayText = hasValue ? (getItemLabel(value) ?? value) : (placeholder ?? '');\n\n  inputStyles.useVariants({\n    size,\n    value: valueState,\n    pressed: open,\n    readonly: readOnly,\n    invalid: hasError,\n  });\n  const fontScaleFactor = useFontScale(\n    maxFontSizeMultiplier,\n    (typeof inputStyles.inputWrapperStatic.lineHeight === 'number'\n      ? inputStyles.inputWrapperStatic.lineHeight\n      : undefined) ??\n      (typeof inputStyles.inputWrapperStatic.fontSize === 'number'\n        ? inputStyles.inputWrapperStatic.fontSize\n        : undefined),\n  );\n\n  const inputWrapperStyle = useMemo(() => {\n    const { gap, paddingVertical } = inputStyles.inputWrapperStatic;\n    const scaledMetrics =\n      fontScaleFactor === 1\n        ? undefined\n        : {\n            ...(typeof gap === 'number' && { gap: Math.round(gap * fontScaleFactor) }),\n            ...(typeof paddingVertical === 'number' && {\n              paddingVertical: Math.round(paddingVertical * fontScaleFactor),\n            }),\n          };\n\n    return [\n      inputStyles.inputWrapper,\n      inputStyles.inputWrapperStatic,\n      inputStyles.inputWrapperDynamic,\n      scaledMetrics,\n      {\n        flexDirection: 'row' as const,\n        alignItems: 'center' as const,\n        width,\n        alignSelf: 'stretch' as const,\n      },\n    ];\n  }, [\n    fontScaleFactor,\n    inputStyles.inputWrapper,\n    inputStyles.inputWrapperDynamic,\n    inputStyles.inputWrapperStatic,\n    width,\n  ]);\n\n  const textContainerStyle = useMemo(\n    () => [\n      {\n        flex: 1,\n        justifyContent: 'center' as const,\n      },\n      typeof inputStyles.input.height === 'number'\n        ? { minHeight: Math.round(inputStyles.input.height * fontScaleFactor) }\n        : null,\n    ],\n    [fontScaleFactor, inputStyles.input],\n  );\n\n  const textInputStyle = useMemo(\n    () => [\n      {\n        fontFamily: inputStyles.inputWrapperStatic.fontFamily,\n        fontSize: inputStyles.inputWrapperStatic.fontSize,\n        letterSpacing: inputStyles.inputWrapperStatic.letterSpacing,\n        // Match TextInput vertical centering: wrapper lineHeight is for layout, not single-line text.\n        lineHeight: inputStyles.inputWrapperStatic.fontSize,\n        paddingVertical: 0,\n      },\n      inputStyles.input,\n      { height: undefined },\n      !hasValue ? inputStyles.inputPlaceholder : null,\n    ],\n    [hasValue, inputStyles.input, inputStyles.inputPlaceholder, inputStyles.inputWrapperStatic],\n  );\n\n  const chevronProgress = useDerivedValue(\n    () =>\n      withTiming(open ? 1 : 0, {\n        duration: reduceMotion ? 0 : 200,\n        easing: Easing.out(Easing.ease),\n      }),\n    [open, reduceMotion],\n  );\n\n  const chevronAnimatedStyle = useAnimatedStyle(() => ({\n    transform: [{ rotate: `${chevronProgress.value * 180}deg` }],\n  }));\n\n  const handleRef = useCallback(\n    (node: View | null) => {\n      triggerRef.current = node;\n    },\n    [triggerRef],\n  );\n\n  const handlePress = useCallback(() => {\n    if (!isInteractive) {\n      return;\n    }\n\n    if (open) {\n      setOpen(false);\n      setHighlightedValue(null);\n      return;\n    }\n\n    measureTrigger(triggerRef.current, triggerRect, setTriggerRect);\n    setHighlightedValue(null);\n    setOpen(true);\n  }, [isInteractive, open, setHighlightedValue, setOpen, setTriggerRect, triggerRect, triggerRef]);\n\n  return (\n    <RNPressable\n      ref={handleRef}\n      testID=\"select-trigger\"\n      onPress={handlePress}\n      disabled={!isInteractive}\n      style={{ width, alignSelf: 'stretch' }}\n      accessibilityRole=\"button\"\n      accessibilityLabel={displayText || uid}\n      accessibilityState={{\n        disabled: !isInteractive,\n        expanded: open,\n        selected: hasValue,\n      }}\n    >\n      <RNView style={inputWrapperStyle} pointerEvents=\"none\">\n        {startIcon ? (\n          <IconSlot\n            icon={startIcon}\n            variant=\"outline\"\n            maxFontSizeMultiplier={maxFontSizeMultiplier}\n            style={inputStyles.startIcon}\n          />\n        ) : null}\n\n        <RNView style={textContainerStyle}>\n          <RNText\n            numberOfLines={1}\n            maxFontSizeMultiplier={maxFontSizeMultiplier}\n            dynamicTypeRamp=\"body\"\n            style={textInputStyle}\n          >\n            {displayText}\n          </RNText>\n        </RNView>\n\n        {useAnimatedChevron || endIcon ? (\n          <Animated.View\n            style={useAnimatedChevron ? chevronAnimatedStyle : undefined}\n            testID=\"select-chevron\"\n          >\n            <IconSlot\n              icon={useAnimatedChevron ? 'ChevronDown' : endIcon!}\n              size=\"sm\"\n              variant=\"outline\"\n              maxFontSizeMultiplier={maxFontSizeMultiplier}\n              style={inputStyles.endIcon}\n            />\n          </Animated.View>\n        ) : null}\n      </RNView>\n    </RNPressable>\n  );\n});\n\nSelectTrigger.displayName = 'SelectTrigger';\n\nexport { SelectTrigger, type SelectTriggerProps };\n"],"mappings":";;;;;;;;;;;AAsBA,MAAM,gBAAgB,KAAK,SAAS,cAAc,EAAE,WAAW,WAA+B;CAC5F,MAAM,EACJ,OACA,MACA,SACA,YACA,aACA,gBACA,cACA,qBACA,iBACE,kBAAkB;CACtB,MAAM,EAAE,MAAM,UAAU,UAAU,UAAU,aAAa,KAAK,OAAO,0BACnE,uBAAuB;CAEzB,MAAM,WAAW,MAAM,SAAS;CAChC,MAAM,aAAa,WAAW,WAAW;CACzC,MAAM,gBAAgB,CAAC,YAAY,CAAC;CACpC,MAAM,qBAAqB,YAAY,KAAA;CACvC,MAAM,cAAc,WAAY,aAAa,MAAM,IAAI,QAAU,eAAe;CAEhF,YAAY,YAAY;EACtB;EACA,OAAO;EACP,SAAS;EACT,UAAU;EACV,SAAS;EACV,CAAC;CACF,MAAM,kBAAkB,aACtB,wBACC,OAAO,YAAY,mBAAmB,eAAe,WAClD,YAAY,mBAAmB,aAC/B,KAAA,OACD,OAAO,YAAY,mBAAmB,aAAa,WAChD,YAAY,mBAAmB,WAC/B,KAAA,GACP;CAED,MAAM,oBAAoB,cAAc;EACtC,MAAM,EAAE,KAAK,oBAAoB,YAAY;EAC7C,MAAM,gBACJ,oBAAoB,IAChB,KAAA,IACA;GACE,GAAI,OAAO,QAAQ,YAAY,EAAE,KAAK,KAAK,MAAM,MAAM,gBAAgB,EAAE;GACzE,GAAI,OAAO,oBAAoB,YAAY,EACzC,iBAAiB,KAAK,MAAM,kBAAkB,gBAAgB,EAC/D;GACF;EAEP,OAAO;GACL,YAAY;GACZ,YAAY;GACZ,YAAY;GACZ;GACA;IACE,eAAe;IACf,YAAY;IACZ;IACA,WAAW;IACZ;GACF;IACA;EACD;EACA,YAAY;EACZ,YAAY;EACZ,YAAY;EACZ;EACD,CAAC;CAEF,MAAM,qBAAqB,cACnB,CACJ;EACE,MAAM;EACN,gBAAgB;EACjB,EACD,OAAO,YAAY,MAAM,WAAW,WAChC,EAAE,WAAW,KAAK,MAAM,YAAY,MAAM,SAAS,gBAAgB,EAAE,GACrE,KACL,EACD,CAAC,iBAAiB,YAAY,MAAM,CACrC;CAED,MAAM,iBAAiB,cACf;EACJ;GACE,YAAY,YAAY,mBAAmB;GAC3C,UAAU,YAAY,mBAAmB;GACzC,eAAe,YAAY,mBAAmB;GAE9C,YAAY,YAAY,mBAAmB;GAC3C,iBAAiB;GAClB;EACD,YAAY;EACZ,EAAE,QAAQ,KAAA,GAAW;EACrB,CAAC,WAAW,YAAY,mBAAmB;EAC5C,EACD;EAAC;EAAU,YAAY;EAAO,YAAY;EAAkB,YAAY;EAAmB,CAC5F;CAED,MAAM,kBAAkB,sBAEpB,WAAW,OAAO,IAAI,GAAG;EACvB,UAAU,eAAe,IAAI;EAC7B,QAAQ,OAAO,IAAI,OAAO,KAAK;EAChC,CAAC,EACJ,CAAC,MAAM,aAAa,CACrB;CAED,MAAM,uBAAuB,wBAAwB,EACnD,WAAW,CAAC,EAAE,QAAQ,GAAG,gBAAgB,QAAQ,IAAI,MAAM,CAAC,EAC7D,EAAE;CAyBH,OACE,oBAACA,WAAD;EACE,KAzBc,aACf,SAAsB;GACrB,WAAW,UAAU;KAEvB,CAAC,WAAW,CAqBI;EACd,QAAO;EACP,SApBgB,kBAAkB;GACpC,IAAI,CAAC,eACH;GAGF,IAAI,MAAM;IACR,QAAQ,MAAM;IACd,oBAAoB,KAAK;IACzB;;GAGF,eAAe,WAAW,SAAS,aAAa,eAAe;GAC/D,oBAAoB,KAAK;GACzB,QAAQ,KAAK;KACZ;GAAC;GAAe;GAAM;GAAqB;GAAS;GAAgB;GAAa;GAAW,CAMvE;EACpB,UAAU,CAAC;EACX,OAAO;GAAE;GAAO,WAAW;GAAW;EACtC,mBAAkB;EAClB,oBAAoB,eAAe;EACnC,oBAAoB;GAClB,UAAU,CAAC;GACX,UAAU;GACV,UAAU;GACX;YAED,qBAACC,MAAD;GAAQ,OAAO;GAAmB,eAAc;aAAhD;IACG,YACC,oBAAC,UAAD;KACE,MAAM;KACN,SAAQ;KACe;KACvB,OAAO,YAAY;KACnB,CAAA,GACA;IAEJ,oBAACA,MAAD;KAAQ,OAAO;eACb,oBAACC,MAAD;MACE,eAAe;MACQ;MACvB,iBAAgB;MAChB,OAAO;gBAEN;MACM,CAAA;KACF,CAAA;IAER,sBAAsB,UACrB,oBAAC,SAAS,MAAV;KACE,OAAO,qBAAqB,uBAAuB,KAAA;KACnD,QAAO;eAEP,oBAAC,UAAD;MACE,MAAM,qBAAqB,gBAAgB;MAC3C,MAAK;MACL,SAAQ;MACe;MACvB,OAAO,YAAY;MACnB,CAAA;KACY,CAAA,GACd;IACG;;EACG,CAAA;EAEhB;AAEF,cAAc,cAAc"}

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

@@ -19,6 +19,8 @@ interface SelectFieldContextValue {
   reduceMotion?: boolean;
   placeholder?: string;
   uid: string;
+  /** Resolved React Native control cap (0 means explicitly uncapped). */
+  maxFontSizeMultiplier: number;
 }
 interface SelectContextValue {
   value: string;

package/dist/components/Select/types.d.cts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.cts","names":[],"sources":["../../../src/components/Select/types.ts"],"mappings":";;;;;;;KAMY,iBAAA;AAAA,KACA,oBAAA;AAAA,KACA,cAAA;AAAA,KACA,iBAAA;AAAA,UAEK,uBAAA;EACf,IAAA,EAAM,SAAA;EACN,QAAA;EACA,QAAA;EACA,QAAA;EACA,QAAA;EACA,KAAA;EACA,YAAA;EACA,WAAA;EACA,GAAA;AAAA;AAAA,UAGe,kBAAA;EACf,KAAA;EACA,QAAA,GAAW,KAAA;EACX,IAAA;EACA,OAAA,GAAU,IAAA;EACV,UAAA,EAAY,SAAA,CAAU,IAAA;EACtB,WAAA,EAAa,YAAA;EACb,cAAA,GAAiB,IAAA,EAAM,YAAA;EACvB,YAAA,GAAe,KAAA,UAAe,KAAA;EAC9B,cAAA,GAAiB,KAAA;EACjB,YAAA,GAAe,KAAA;EACf,gBAAA;EACA,mBAAA,GAAsB,KAAA;EACtB,KAAA,EAAO,uBAAA;EACP,YAAA;AAAA;AAAA,KAGU,0BAAA;AAAA,KAEA,eAAA"}
+{"version":3,"file":"types.d.cts","names":[],"sources":["../../../src/components/Select/types.ts"],"mappings":";;;;;;;KAMY,iBAAA;AAAA,KACA,oBAAA;AAAA,KACA,cAAA;AAAA,KACA,iBAAA;AAAA,UAEK,uBAAA;EACf,IAAA,EAAM,SAAA;EACN,QAAA;EACA,QAAA;EACA,QAAA;EACA,QAAA;EACA,KAAA;EACA,YAAA;EACA,WAAA;EACA,GAAA;EAZwB;EAcxB,qBAAA;AAAA;AAAA,UAGe,kBAAA;EACf,KAAA;EACA,QAAA,GAAW,KAAA;EACX,IAAA;EACA,OAAA,GAAU,IAAA;EACV,UAAA,EAAY,SAAA,CAAU,IAAA;EACtB,WAAA,EAAa,YAAA;EACb,cAAA,GAAiB,IAAA,EAAM,YAAA;EACvB,YAAA,GAAe,KAAA,UAAe,KAAA;EAC9B,cAAA,GAAiB,KAAA;EACjB,YAAA,GAAe,KAAA;EACf,gBAAA;EACA,mBAAA,GAAsB,KAAA;EACtB,KAAA,EAAO,uBAAA;EACP,YAAA;AAAA;AAAA,KAGU,0BAAA;AAAA,KAEA,eAAA"}

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

@@ -19,6 +19,8 @@ interface SelectFieldContextValue {
   reduceMotion?: boolean;
   placeholder?: string;
   uid: string;
+  /** Resolved React Native control cap (0 means explicitly uncapped). */
+  maxFontSizeMultiplier: number;
 }
 interface SelectContextValue {
   value: string;

package/dist/components/Select/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","names":[],"sources":["../../../src/components/Select/types.ts"],"mappings":";;;;;;;KAMY,iBAAA;AAAA,KACA,oBAAA;AAAA,KACA,cAAA;AAAA,KACA,iBAAA;AAAA,UAEK,uBAAA;EACf,IAAA,EAAM,SAAA;EACN,QAAA;EACA,QAAA;EACA,QAAA;EACA,QAAA;EACA,KAAA;EACA,YAAA;EACA,WAAA;EACA,GAAA;AAAA;AAAA,UAGe,kBAAA;EACf,KAAA;EACA,QAAA,GAAW,KAAA;EACX,IAAA;EACA,OAAA,GAAU,IAAA;EACV,UAAA,EAAY,SAAA,CAAU,IAAA;EACtB,WAAA,EAAa,YAAA;EACb,cAAA,GAAiB,IAAA,EAAM,YAAA;EACvB,YAAA,GAAe,KAAA,UAAe,KAAA;EAC9B,cAAA,GAAiB,KAAA;EACjB,YAAA,GAAe,KAAA;EACf,gBAAA;EACA,mBAAA,GAAsB,KAAA;EACtB,KAAA,EAAO,uBAAA;EACP,YAAA;AAAA;AAAA,KAGU,0BAAA;AAAA,KAEA,eAAA"}
+{"version":3,"file":"types.d.ts","names":[],"sources":["../../../src/components/Select/types.ts"],"mappings":";;;;;;;KAMY,iBAAA;AAAA,KACA,oBAAA;AAAA,KACA,cAAA;AAAA,KACA,iBAAA;AAAA,UAEK,uBAAA;EACf,IAAA,EAAM,SAAA;EACN,QAAA;EACA,QAAA;EACA,QAAA;EACA,QAAA;EACA,KAAA;EACA,YAAA;EACA,WAAA;EACA,GAAA;EAZwB;EAcxB,qBAAA;AAAA;AAAA,UAGe,kBAAA;EACf,KAAA;EACA,QAAA,GAAW,KAAA;EACX,IAAA;EACA,OAAA,GAAU,IAAA;EACV,UAAA,EAAY,SAAA,CAAU,IAAA;EACtB,WAAA,EAAa,YAAA;EACb,cAAA,GAAiB,IAAA,EAAM,YAAA;EACvB,YAAA,GAAe,KAAA,UAAe,KAAA;EAC9B,cAAA,GAAiB,KAAA;EACjB,YAAA,GAAe,KAAA;EACf,gBAAA;EACA,mBAAA,GAAsB,KAAA;EACtB,KAAA,EAAO,uBAAA;EACP,YAAA;AAAA;AAAA,KAGU,0BAAA;AAAA,KAEA,eAAA"}

package/dist/components/Switch.cjs

@@ -10,7 +10,6 @@ let react_native = require("react-native");
 let react_jsx_runtime = require("react/jsx-runtime");
 let generated_styles = require("../../generated/styles");
 let react_native_unistyles = require("react-native-unistyles");
-let _yahoo_uds_icons_tokens = require("@yahoo/uds-icons/tokens");
 let react_native_reanimated = require("react-native-reanimated");
 react_native_reanimated = require_runtime.__toESM(react_native_reanimated);
 let react_native_unistyles_reanimated = require("react-native-unistyles/reanimated");
@@ -57,8 +56,6 @@ const Switch = (0, react.memo)(function Switch({ isOn: isOnProp, defaultIsOn = f
 	const activeVariant = isOn ? "on" : "off";
 	const { theme } = (0, react_native_unistyles.useUnistyles)();
 	const resolvedMaxFontSizeMultiplier = require_fontScaling_useMaxFontSizeMultiplier.useMaxFontSizeMultiplier("control", maxFontSizeMultiplier) ?? 0;
-	const fontScaleFactor = require_fontScaling_useFontScale.useFontScale(resolvedMaxFontSizeMultiplier);
-	const scaledHandleIconSize = Math.round(_yahoo_uds_icons_tokens.ICON_SIZE_MAP.sm * fontScaleFactor);
 	(0, react.useEffect)(() => {
 		const checkReducedMotion = async () => {
 			setPrefersReducedMotion(await react_native.AccessibilityInfo.isReduceMotionEnabled());
@@ -84,6 +81,11 @@ const Switch = (0, react.memo)(function Switch({ isOn: isOnProp, defaultIsOn = f
 		size,
 		variant: activeVariant
 	}) ?? generated_styles.switchStyles;
+	const labelBaseSize = resolvedSwitchStyles.text.lineHeight ?? resolvedSwitchStyles.text.fontSize;
+	const fontScaleFactor = require_fontScaling_useFontScale.useFontScale(resolvedMaxFontSizeMultiplier, typeof labelBaseSize === "number" ? labelBaseSize : void 0);
+	const handleIconSize = resolvedSwitchStyles.handleIcon.fontSize;
+	const handleIconScaleFactor = require_fontScaling_useFontScale.useFontScale(resolvedMaxFontSizeMultiplier, typeof handleIconSize === "number" ? handleIconSize : void 0);
+	const scaledHandleIconSize = typeof handleIconSize === "number" ? Math.round(handleIconSize * handleIconScaleFactor) : void 0;
 	const scaledTrackWidth = Math.round(resolvedSwitchStyles.switch.width * fontScaleFactor);
 	const scaledTrackPadding = Math.round(resolvedSwitchStyles.switch.padding * fontScaleFactor);
 	const scaledHandleWidth = Math.round(resolvedSwitchStyles.handle.width * fontScaleFactor);

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

@@ -1 +1 @@
-{"version":3,"file":"Switch.d.cts","names":[],"sources":["../../src/components/Switch.tsx"],"mappings":";;;;;;;;UAyBU,WAAA,SAAoB,IAAA,CAAK,SAAA,YAAqB,oBAAA,CAAqB,YAAA;;EAE3E,GAAA,GAAM,GAAA,CAAI,IAAA;EAFF;EAIR,QAAA,IAAY,KAAA;;EAEZ,QAAA;EAN2E;EAQ3E,QAAA;EANM;;;;;;EAaN,qBAAA;EAfiC;EAiBjC,iBAAA,GAAoB,kBAAA;AAAA;;;;;;;;;;;;;AAAkB;;;;;;;;;;;;;;;;;;;;;cAsClC,MAAA,EAAM,OAAA,CAAA,oBAAA,CAAA,WAAA"}
+{"version":3,"file":"Switch.d.cts","names":[],"sources":["../../src/components/Switch.tsx"],"mappings":";;;;;;;;UAwBU,WAAA,SAAoB,IAAA,CAAK,SAAA,YAAqB,oBAAA,CAAqB,YAAA;;EAE3E,GAAA,GAAM,GAAA,CAAI,IAAA;EAFF;EAIR,QAAA,IAAY,KAAA;;EAEZ,QAAA;EAN2E;EAQ3E,QAAA;EANM;;;;;;EAaN,qBAAA;EAfiC;EAiBjC,iBAAA,GAAoB,kBAAA;AAAA;;;;;;;;;;;;;AAAkB;;;;;;;;;;;;;;;;;;;;;cAsClC,MAAA,EAAM,OAAA,CAAA,oBAAA,CAAA,WAAA"}

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

@@ -1 +1 @@
-{"version":3,"file":"Switch.d.ts","names":[],"sources":["../../src/components/Switch.tsx"],"mappings":";;;;;;;;UAyBU,WAAA,SAAoB,IAAA,CAAK,SAAA,YAAqB,oBAAA,CAAqB,YAAA;;EAE3E,GAAA,GAAM,GAAA,CAAI,IAAA;EAFF;EAIR,QAAA,IAAY,KAAA;;EAEZ,QAAA;EAN2E;EAQ3E,QAAA;EANM;;;;;;EAaN,qBAAA;EAfiC;EAiBjC,iBAAA,GAAoB,kBAAA;AAAA;;;;;;;;;;;;;AAAkB;;;;;;;;;;;;;;;;;;;;;cAsClC,MAAA,EAAM,OAAA,CAAA,oBAAA,CAAA,WAAA"}
+{"version":3,"file":"Switch.d.ts","names":[],"sources":["../../src/components/Switch.tsx"],"mappings":";;;;;;;;UAwBU,WAAA,SAAoB,IAAA,CAAK,SAAA,YAAqB,oBAAA,CAAqB,YAAA;;EAE3E,GAAA,GAAM,GAAA,CAAI,IAAA;EAFF;EAIR,QAAA,IAAY,KAAA;;EAEZ,QAAA;EAN2E;EAQ3E,QAAA;EANM;;;;;;EAaN,qBAAA;EAfiC;EAiBjC,iBAAA,GAAoB,kBAAA;AAAA;;;;;;;;;;;;;AAAkB;;;;;;;;;;;;;;;;;;;;;cAsClC,MAAA,EAAM,OAAA,CAAA,oBAAA,CAAA,WAAA"}

package/dist/components/Switch.js

@@ -8,7 +8,6 @@ import { AccessibilityInfo, I18nManager, Platform, Pressable } from "react-nativ
 import { jsx, jsxs } from "react/jsx-runtime";
 import { switchStyles } from "../../generated/styles";
 import { StyleSheet as StyleSheet$1, useUnistyles } from "react-native-unistyles";
-import { ICON_SIZE_MAP } from "@yahoo/uds-icons/tokens";
 import Animated, { useAnimatedStyle, useDerivedValue, withTiming } from "react-native-reanimated";
 import { useAnimatedVariantColor } from "react-native-unistyles/reanimated";
 //#region src/components/Switch.tsx
@@ -54,8 +53,6 @@ const Switch = memo(function Switch({ isOn: isOnProp, defaultIsOn = false, onCha
 	const activeVariant = isOn ? "on" : "off";
 	const { theme } = useUnistyles();
 	const resolvedMaxFontSizeMultiplier = useMaxFontSizeMultiplier("control", maxFontSizeMultiplier) ?? 0;
-	const fontScaleFactor = useFontScale(resolvedMaxFontSizeMultiplier);
-	const scaledHandleIconSize = Math.round(ICON_SIZE_MAP.sm * fontScaleFactor);
 	useEffect(() => {
 		const checkReducedMotion = async () => {
 			setPrefersReducedMotion(await AccessibilityInfo.isReduceMotionEnabled());
@@ -81,6 +78,11 @@ const Switch = memo(function Switch({ isOn: isOnProp, defaultIsOn = false, onCha
 		size,
 		variant: activeVariant
 	}) ?? switchStyles;
+	const labelBaseSize = resolvedSwitchStyles.text.lineHeight ?? resolvedSwitchStyles.text.fontSize;
+	const fontScaleFactor = useFontScale(resolvedMaxFontSizeMultiplier, typeof labelBaseSize === "number" ? labelBaseSize : void 0);
+	const handleIconSize = resolvedSwitchStyles.handleIcon.fontSize;
+	const handleIconScaleFactor = useFontScale(resolvedMaxFontSizeMultiplier, typeof handleIconSize === "number" ? handleIconSize : void 0);
+	const scaledHandleIconSize = typeof handleIconSize === "number" ? Math.round(handleIconSize * handleIconScaleFactor) : void 0;
 	const scaledTrackWidth = Math.round(resolvedSwitchStyles.switch.width * fontScaleFactor);
 	const scaledTrackPadding = Math.round(resolvedSwitchStyles.switch.padding * fontScaleFactor);
 	const scaledHandleWidth = Math.round(resolvedSwitchStyles.handle.width * fontScaleFactor);

package/dist/components/Switch.js.map

@@ -1 +1 @@
-{"version":3,"file":"Switch.js","names":["StyleSheet"],"sources":["../../src/components/Switch.tsx"],"sourcesContent":["import { ICON_SIZE_MAP } from '@yahoo/uds-icons/tokens';\nimport type { UniversalSwitchProps } from '@yahoo/uds-types';\nimport type { Ref } from 'react';\nimport { memo, useCallback, useEffect, useMemo, useState } from 'react';\nimport type {\n  AccessibilityProps,\n  StyleProp,\n  TextStyle,\n  View,\n  ViewProps,\n  ViewStyle,\n} from 'react-native';\nimport { AccessibilityInfo, I18nManager, Platform, Pressable } from 'react-native';\nimport Animated, { useAnimatedStyle, useDerivedValue, withTiming } from 'react-native-reanimated';\n// eslint-disable-next-line uds/no-use-unistyles -- switch variant layers need concrete web styles\nimport { StyleSheet, useUnistyles } from 'react-native-unistyles';\nimport { useAnimatedVariantColor } from 'react-native-unistyles/reanimated';\n\nimport { switchStyles } from '../../generated/styles';\nimport { useFontScale } from '../fontScaling/useFontScale';\nimport { useMaxFontSizeMultiplier } from '../fontScaling/useMaxFontSizeMultiplier';\nimport { FormLabel } from './FormLabel';\nimport type { IconSlotType } from './IconSlot';\nimport { IconSlot } from './IconSlot';\n\ninterface SwitchProps extends Omit<ViewProps, 'style'>, UniversalSwitchProps<IconSlotType> {\n  /** Ref to the underlying View */\n  ref?: Ref<View>;\n  /** Callback when the switch value changes */\n  onChange?: (value: boolean) => void;\n  /** Whether the switch is disabled */\n  disabled?: boolean;\n  /** Whether the switch is required (shows asterisk with label) */\n  required?: boolean;\n  /**\n   * Caps how far the track, handle, and label grow with the OS text-size\n   * setting; all scale by the same factor. Set null to remove the cap;\n   * override app-wide via UDSFontScalingProvider.\n   * @default 2\n   */\n  maxFontSizeMultiplier?: number | null;\n  /** Accessibility hint describing what happens when activated */\n  accessibilityHint?: AccessibilityProps['accessibilityHint'];\n}\n\nconst ANIMATION_DURATION = 120;\n\n/**\n * **Switch component for toggling options**\n *\n * @description\n * A switch (also called a toggle) is a binary on/off input control.\n * It allows users to pick between two clearly opposite choices.\n *\n * @category Form\n * @platform mobile\n *\n * @example\n * ```tsx\n * import { Switch } from '@yahoo/uds-mobile/Switch';\n *\n * <Switch label=\"Notifications\" />\n * <Switch isOn={enabled} onChange={setEnabled} label=\"Dark mode\" />\n * <Switch onIcon=\"Check\" offIcon=\"Cross\" label=\"Sync\" />\n * ```\n *\n * @usage\n * - Settings: For toggling preferences on/off\n * - Feature flags: For enabling/disabling features\n * - Immediate effect toggles (no submit button needed)\n *\n * @accessibility\n * - Sets `accessibilityRole=\"switch\"` automatically\n * - Announces on/off state to screen readers\n * - Respects system reduce motion preference\n * - Supports `reduceMotion` prop to disable animations\n *\n * @see {@link Checkbox} for forms with submit actions\n * @see {@link Radio} for single-select options\n */\nconst Switch = memo(function Switch({\n  isOn: isOnProp,\n  defaultIsOn = false,\n  onChange,\n  label,\n  labelPosition = 'start',\n  size = 'md',\n  onIcon,\n  offIcon,\n  disabled = false,\n  required,\n  maxFontSizeMultiplier,\n  accessibilityHint,\n  reduceMotion = false,\n  ref,\n  ...viewProps\n}: SwitchProps) {\n  const isControlled = isOnProp !== undefined;\n  const [internalIsOn, setInternalIsOn] = useState(defaultIsOn);\n  const [prefersReducedMotion, setPrefersReducedMotion] = useState(false);\n  const isOn = isControlled ? isOnProp : internalIsOn;\n  const activeVariant = isOn ? 'on' : 'off';\n  const { theme } = useUnistyles();\n\n  // One capped factor governs track, handle, travel, and label.\n  const resolvedMaxFontSizeMultiplier =\n    useMaxFontSizeMultiplier('control', maxFontSizeMultiplier) ?? 0;\n  const fontScaleFactor = useFontScale(resolvedMaxFontSizeMultiplier);\n  // Size the handle glyph from the same factor as the handle it sits in, rather\n  // than letting native font scaling size it on a separate path.\n  const scaledHandleIconSize = Math.round(ICON_SIZE_MAP.sm * fontScaleFactor);\n\n  // Check system reduced motion preference\n  useEffect(() => {\n    const checkReducedMotion = async () => {\n      const isReduceMotionEnabled = await AccessibilityInfo.isReduceMotionEnabled();\n      setPrefersReducedMotion(isReduceMotionEnabled);\n    };\n    checkReducedMotion();\n\n    const subscription = AccessibilityInfo.addEventListener(\n      'reduceMotionChanged',\n      setPrefersReducedMotion,\n    );\n    return () => subscription.remove();\n  }, []);\n\n  const shouldReduceMotion = reduceMotion || prefersReducedMotion;\n  const animationDuration = shouldReduceMotion ? 0 : ANIMATION_DURATION;\n\n  const progress = useDerivedValue(\n    () => withTiming(isOn ? 1 : 0, { duration: animationDuration }),\n    [isOn, animationDuration],\n  );\n\n  const handlePress = useCallback(() => {\n    if (disabled) {\n      return;\n    }\n\n    const newValue = !isOn;\n\n    if (!isControlled) {\n      setInternalIsOn(newValue);\n    }\n\n    onChange?.(newValue);\n  }, [disabled, isOn, isControlled, onChange]);\n\n  // On web, useVariants returns the resolved style object instead of mutating\n  // switchStyles in place.\n  const variantSwitchStyles = switchStyles.useVariants({\n    size,\n    variant: activeVariant,\n  }) as unknown as typeof switchStyles | undefined;\n  const resolvedSwitchStyles = variantSwitchStyles ?? switchStyles;\n\n  // Derive travel from the same rounded metrics used to render the control.\n  // Scaling the token travel independently can differ by a pixel at fractional\n  // font scales, leaving unequal insets at opposite ends of the track.\n  const scaledTrackWidth = Math.round(resolvedSwitchStyles.switch.width * fontScaleFactor);\n  const scaledTrackPadding = Math.round(resolvedSwitchStyles.switch.padding * fontScaleFactor);\n  const scaledHandleWidth = Math.round(resolvedSwitchStyles.handle.width * fontScaleFactor);\n  const scaledHandleTravel = Math.max(\n    0,\n    scaledTrackWidth - scaledHandleWidth - scaledTrackPadding * 2,\n  );\n  // RTL mirrors the track layout but not transforms, so travel flips sign.\n  const travelDistance = scaledHandleTravel * (I18nManager.isRTL ? -1 : 1);\n\n  const variantLayerStyles = useMemo(() => {\n    const components = theme.components as unknown as Record<string, Record<string, unknown>>;\n    const getLayerStyle = <TStyle,>(layer: string) =>\n      components[`switch/variant/default/active/${activeVariant}/${layer}/rest`] as\n        TStyle | undefined;\n\n    return {\n      handle: getLayerStyle<ViewStyle>('handle'),\n      handleIcon: getLayerStyle<TextStyle>('handleIcon'),\n      switch: getLayerStyle<ViewStyle>('switch'),\n      text: getLayerStyle<TextStyle>('rootText'),\n    };\n  }, [activeVariant, theme]);\n\n  // Get animated track color from design tokens (changes when variant changes)\n  const trackBackgroundColor = useAnimatedVariantColor(\n    resolvedSwitchStyles.switch,\n    'backgroundColor',\n  );\n\n  const animatedTrackStyle = useAnimatedStyle(() => {\n    'worklet';\n    return {\n      backgroundColor: withTiming(trackBackgroundColor.value, { duration: animationDuration }),\n    };\n  });\n\n  const animatedHandleStyle = useAnimatedStyle(() => {\n    'worklet';\n    return {\n      transform: [{ translateX: progress.value * travelDistance }],\n    };\n  });\n\n  const rootStyle: StyleProp<ViewStyle> = useMemo(\n    () => [resolvedSwitchStyles.root, switchStaticStyles.root({ disabled })],\n    [resolvedSwitchStyles.root, disabled],\n  );\n\n  // Track and handle grow by the capped factor so the handle (and its icon)\n  // stays contained. Scale the track's inset too so the derived travel lands\n  // the handle at the same distance from either end.\n  const scaleDimensions = useCallback(\n    (style: ViewStyle | undefined): ViewStyle | undefined => {\n      if (!style || fontScaleFactor === 1) {\n        return undefined;\n      }\n      const { width, height, padding } = style;\n      return typeof width === 'number' && typeof height === 'number'\n        ? {\n            width: Math.round(width * fontScaleFactor),\n            height: Math.round(height * fontScaleFactor),\n            ...(typeof padding === 'number' && {\n              padding: Math.round(padding * fontScaleFactor),\n            }),\n          }\n        : undefined;\n    },\n    [fontScaleFactor],\n  );\n\n  const trackStyle: StyleProp<ViewStyle> = useMemo(\n    () => [\n      resolvedSwitchStyles.switch,\n      switchStaticStyles.track,\n      variantLayerStyles.switch,\n      scaleDimensions(resolvedSwitchStyles.switch as ViewStyle),\n      // On web, the animated variant color hook currently resolves to Unistyles'\n      // black fallback, so the concrete variant layer provides the track color.\n      Platform.OS !== 'web' && animatedTrackStyle,\n    ],\n    [resolvedSwitchStyles.switch, variantLayerStyles.switch, scaleDimensions, animatedTrackStyle],\n  );\n\n  const handleStyle: StyleProp<ViewStyle> = useMemo(\n    () => [\n      resolvedSwitchStyles.handle,\n      switchStaticStyles.handle,\n      variantLayerStyles.handle,\n      scaleDimensions(resolvedSwitchStyles.handle as ViewStyle),\n      animatedHandleStyle,\n    ],\n    [resolvedSwitchStyles.handle, variantLayerStyles.handle, scaleDimensions, animatedHandleStyle],\n  );\n\n  const accessibilityLabel = typeof label === 'string' ? label : undefined;\n  const resolvedAccessibilityHint = accessibilityHint ?? 'Double tap to toggle';\n\n  const labelContent = label && (\n    <FormLabel\n      color=\"inherit\"\n      variant=\"inherit\"\n      label={label}\n      required={required}\n      showRequiredAsterisk={required}\n      maxFontSizeMultiplier={resolvedMaxFontSizeMultiplier}\n      style={[resolvedSwitchStyles.text, variantLayerStyles.text]}\n    />\n  );\n\n  const a11yValue = useMemo(() => ({ text: isOn ? 'On' : 'Off' }), [isOn]);\n\n  return (\n    <Pressable\n      ref={ref}\n      onPress={handlePress}\n      disabled={disabled}\n      accessible\n      accessibilityRole=\"switch\"\n      accessibilityState={{ checked: isOn, disabled }}\n      accessibilityLabel={accessibilityLabel}\n      accessibilityHint={resolvedAccessibilityHint}\n      accessibilityValue={a11yValue}\n      {...viewProps}\n      style={rootStyle}\n    >\n      {labelPosition === 'start' && labelContent}\n\n      <Animated.View style={trackStyle} importantForAccessibility=\"no-hide-descendants\">\n        <Animated.View style={handleStyle}>\n          {onIcon && isOn && (\n            <Animated.View style={switchStaticStyles.iconContainer}>\n              <IconSlot\n                icon={onIcon}\n                variant=\"fill\"\n                dangerouslySetSize={scaledHandleIconSize}\n                allowFontScaling={false}\n                style={[resolvedSwitchStyles.handleIcon, variantLayerStyles.handleIcon]}\n              />\n            </Animated.View>\n          )}\n          {offIcon && !isOn && (\n            <Animated.View style={switchStaticStyles.iconContainer}>\n              <IconSlot\n                icon={offIcon}\n                variant=\"fill\"\n                dangerouslySetSize={scaledHandleIconSize}\n                allowFontScaling={false}\n                style={[resolvedSwitchStyles.handleIcon, variantLayerStyles.handleIcon]}\n              />\n            </Animated.View>\n          )}\n        </Animated.View>\n      </Animated.View>\n\n      {labelPosition === 'end' && labelContent}\n    </Pressable>\n  );\n});\n\nSwitch.displayName = 'Switch';\n\nconst switchStaticStyles = StyleSheet.create((theme) => ({\n  handle: {\n    borderRadius: theme.borderRadius.full,\n    alignItems: 'center',\n    justifyContent: 'center',\n  },\n  iconContainer: {\n    position: 'absolute',\n    alignItems: 'center',\n    justifyContent: 'center',\n  },\n  track: {\n    justifyContent: 'center',\n    borderRadius: theme.borderRadius.full,\n  },\n  root: ({ disabled }: { disabled: boolean }) => ({\n    flexDirection: 'row',\n    alignItems: 'center',\n    alignSelf: 'flex-start',\n    opacity: disabled ? 0.5 : 1,\n  }),\n}));\n\nexport { Switch, type SwitchProps };\n"],"mappings":"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"}
+{"version":3,"file":"Switch.js","names":["StyleSheet"],"sources":["../../src/components/Switch.tsx"],"sourcesContent":["import type { UniversalSwitchProps } from '@yahoo/uds-types';\nimport type { Ref } from 'react';\nimport { memo, useCallback, useEffect, useMemo, useState } from 'react';\nimport type {\n  AccessibilityProps,\n  StyleProp,\n  TextStyle,\n  View,\n  ViewProps,\n  ViewStyle,\n} from 'react-native';\nimport { AccessibilityInfo, I18nManager, Platform, Pressable } from 'react-native';\nimport Animated, { useAnimatedStyle, useDerivedValue, withTiming } from 'react-native-reanimated';\n// eslint-disable-next-line uds/no-use-unistyles -- switch variant layers need concrete web styles\nimport { StyleSheet, useUnistyles } from 'react-native-unistyles';\nimport { useAnimatedVariantColor } from 'react-native-unistyles/reanimated';\n\nimport { switchStyles } from '../../generated/styles';\nimport { useFontScale } from '../fontScaling/useFontScale';\nimport { useMaxFontSizeMultiplier } from '../fontScaling/useMaxFontSizeMultiplier';\nimport { FormLabel } from './FormLabel';\nimport type { IconSlotType } from './IconSlot';\nimport { IconSlot } from './IconSlot';\n\ninterface SwitchProps extends Omit<ViewProps, 'style'>, UniversalSwitchProps<IconSlotType> {\n  /** Ref to the underlying View */\n  ref?: Ref<View>;\n  /** Callback when the switch value changes */\n  onChange?: (value: boolean) => void;\n  /** Whether the switch is disabled */\n  disabled?: boolean;\n  /** Whether the switch is required (shows asterisk with label) */\n  required?: boolean;\n  /**\n   * Caps how far the track, handle, and label grow with the OS text-size\n   * setting; all scale by the same factor. Set null to remove the cap;\n   * override app-wide via UDSFontScalingProvider.\n   * @default 2\n   */\n  maxFontSizeMultiplier?: number | null;\n  /** Accessibility hint describing what happens when activated */\n  accessibilityHint?: AccessibilityProps['accessibilityHint'];\n}\n\nconst ANIMATION_DURATION = 120;\n\n/**\n * **Switch component for toggling options**\n *\n * @description\n * A switch (also called a toggle) is a binary on/off input control.\n * It allows users to pick between two clearly opposite choices.\n *\n * @category Form\n * @platform mobile\n *\n * @example\n * ```tsx\n * import { Switch } from '@yahoo/uds-mobile/Switch';\n *\n * <Switch label=\"Notifications\" />\n * <Switch isOn={enabled} onChange={setEnabled} label=\"Dark mode\" />\n * <Switch onIcon=\"Check\" offIcon=\"Cross\" label=\"Sync\" />\n * ```\n *\n * @usage\n * - Settings: For toggling preferences on/off\n * - Feature flags: For enabling/disabling features\n * - Immediate effect toggles (no submit button needed)\n *\n * @accessibility\n * - Sets `accessibilityRole=\"switch\"` automatically\n * - Announces on/off state to screen readers\n * - Respects system reduce motion preference\n * - Supports `reduceMotion` prop to disable animations\n *\n * @see {@link Checkbox} for forms with submit actions\n * @see {@link Radio} for single-select options\n */\nconst Switch = memo(function Switch({\n  isOn: isOnProp,\n  defaultIsOn = false,\n  onChange,\n  label,\n  labelPosition = 'start',\n  size = 'md',\n  onIcon,\n  offIcon,\n  disabled = false,\n  required,\n  maxFontSizeMultiplier,\n  accessibilityHint,\n  reduceMotion = false,\n  ref,\n  ...viewProps\n}: SwitchProps) {\n  const isControlled = isOnProp !== undefined;\n  const [internalIsOn, setInternalIsOn] = useState(defaultIsOn);\n  const [prefersReducedMotion, setPrefersReducedMotion] = useState(false);\n  const isOn = isControlled ? isOnProp : internalIsOn;\n  const activeVariant = isOn ? 'on' : 'off';\n  const { theme } = useUnistyles();\n\n  // One resolved cap governs track, handle, travel, and label. Android may\n  // resolve different nonlinear factors for the label and handle glyph.\n  const resolvedMaxFontSizeMultiplier =\n    useMaxFontSizeMultiplier('control', maxFontSizeMultiplier) ?? 0;\n  // Check system reduced motion preference\n  useEffect(() => {\n    const checkReducedMotion = async () => {\n      const isReduceMotionEnabled = await AccessibilityInfo.isReduceMotionEnabled();\n      setPrefersReducedMotion(isReduceMotionEnabled);\n    };\n    checkReducedMotion();\n\n    const subscription = AccessibilityInfo.addEventListener(\n      'reduceMotionChanged',\n      setPrefersReducedMotion,\n    );\n    return () => subscription.remove();\n  }, []);\n\n  const shouldReduceMotion = reduceMotion || prefersReducedMotion;\n  const animationDuration = shouldReduceMotion ? 0 : ANIMATION_DURATION;\n\n  const progress = useDerivedValue(\n    () => withTiming(isOn ? 1 : 0, { duration: animationDuration }),\n    [isOn, animationDuration],\n  );\n\n  const handlePress = useCallback(() => {\n    if (disabled) {\n      return;\n    }\n\n    const newValue = !isOn;\n\n    if (!isControlled) {\n      setInternalIsOn(newValue);\n    }\n\n    onChange?.(newValue);\n  }, [disabled, isOn, isControlled, onChange]);\n\n  // On web, useVariants returns the resolved style object instead of mutating\n  // switchStyles in place.\n  const variantSwitchStyles = switchStyles.useVariants({\n    size,\n    variant: activeVariant,\n  }) as unknown as typeof switchStyles | undefined;\n  const resolvedSwitchStyles = variantSwitchStyles ?? switchStyles;\n  const labelBaseSize = resolvedSwitchStyles.text.lineHeight ?? resolvedSwitchStyles.text.fontSize;\n  const fontScaleFactor = useFontScale(\n    resolvedMaxFontSizeMultiplier,\n    typeof labelBaseSize === 'number' ? labelBaseSize : undefined,\n  );\n  // Size the handle glyph from the configured size layer and the same factor\n  // Android would apply to a native glyph of this size.\n  const handleIconSize = resolvedSwitchStyles.handleIcon.fontSize;\n  const handleIconScaleFactor = useFontScale(\n    resolvedMaxFontSizeMultiplier,\n    typeof handleIconSize === 'number' ? handleIconSize : undefined,\n  );\n  const scaledHandleIconSize =\n    typeof handleIconSize === 'number'\n      ? Math.round(handleIconSize * handleIconScaleFactor)\n      : undefined;\n\n  // Derive travel from the same rounded metrics used to render the control.\n  // Scaling the token travel independently can differ by a pixel at fractional\n  // font scales, leaving unequal insets at opposite ends of the track.\n  const scaledTrackWidth = Math.round(resolvedSwitchStyles.switch.width * fontScaleFactor);\n  const scaledTrackPadding = Math.round(resolvedSwitchStyles.switch.padding * fontScaleFactor);\n  const scaledHandleWidth = Math.round(resolvedSwitchStyles.handle.width * fontScaleFactor);\n  const scaledHandleTravel = Math.max(\n    0,\n    scaledTrackWidth - scaledHandleWidth - scaledTrackPadding * 2,\n  );\n  // RTL mirrors the track layout but not transforms, so travel flips sign.\n  const travelDistance = scaledHandleTravel * (I18nManager.isRTL ? -1 : 1);\n\n  const variantLayerStyles = useMemo(() => {\n    const components = theme.components as unknown as Record<string, Record<string, unknown>>;\n    const getLayerStyle = <TStyle,>(layer: string) =>\n      components[`switch/variant/default/active/${activeVariant}/${layer}/rest`] as\n        TStyle | undefined;\n\n    return {\n      handle: getLayerStyle<ViewStyle>('handle'),\n      handleIcon: getLayerStyle<TextStyle>('handleIcon'),\n      switch: getLayerStyle<ViewStyle>('switch'),\n      text: getLayerStyle<TextStyle>('rootText'),\n    };\n  }, [activeVariant, theme]);\n\n  // Get animated track color from design tokens (changes when variant changes)\n  const trackBackgroundColor = useAnimatedVariantColor(\n    resolvedSwitchStyles.switch,\n    'backgroundColor',\n  );\n\n  const animatedTrackStyle = useAnimatedStyle(() => {\n    'worklet';\n    return {\n      backgroundColor: withTiming(trackBackgroundColor.value, { duration: animationDuration }),\n    };\n  });\n\n  const animatedHandleStyle = useAnimatedStyle(() => {\n    'worklet';\n    return {\n      transform: [{ translateX: progress.value * travelDistance }],\n    };\n  });\n\n  const rootStyle: StyleProp<ViewStyle> = useMemo(\n    () => [resolvedSwitchStyles.root, switchStaticStyles.root({ disabled })],\n    [resolvedSwitchStyles.root, disabled],\n  );\n\n  // Track and handle grow by the capped factor so the handle (and its icon)\n  // stays contained. Scale the track's inset too so the derived travel lands\n  // the handle at the same distance from either end.\n  const scaleDimensions = useCallback(\n    (style: ViewStyle | undefined): ViewStyle | undefined => {\n      if (!style || fontScaleFactor === 1) {\n        return undefined;\n      }\n      const { width, height, padding } = style;\n      return typeof width === 'number' && typeof height === 'number'\n        ? {\n            width: Math.round(width * fontScaleFactor),\n            height: Math.round(height * fontScaleFactor),\n            ...(typeof padding === 'number' && {\n              padding: Math.round(padding * fontScaleFactor),\n            }),\n          }\n        : undefined;\n    },\n    [fontScaleFactor],\n  );\n\n  const trackStyle: StyleProp<ViewStyle> = useMemo(\n    () => [\n      resolvedSwitchStyles.switch,\n      switchStaticStyles.track,\n      variantLayerStyles.switch,\n      scaleDimensions(resolvedSwitchStyles.switch as ViewStyle),\n      // On web, the animated variant color hook currently resolves to Unistyles'\n      // black fallback, so the concrete variant layer provides the track color.\n      Platform.OS !== 'web' && animatedTrackStyle,\n    ],\n    [resolvedSwitchStyles.switch, variantLayerStyles.switch, scaleDimensions, animatedTrackStyle],\n  );\n\n  const handleStyle: StyleProp<ViewStyle> = useMemo(\n    () => [\n      resolvedSwitchStyles.handle,\n      switchStaticStyles.handle,\n      variantLayerStyles.handle,\n      scaleDimensions(resolvedSwitchStyles.handle as ViewStyle),\n      animatedHandleStyle,\n    ],\n    [resolvedSwitchStyles.handle, variantLayerStyles.handle, scaleDimensions, animatedHandleStyle],\n  );\n\n  const accessibilityLabel = typeof label === 'string' ? label : undefined;\n  const resolvedAccessibilityHint = accessibilityHint ?? 'Double tap to toggle';\n\n  const labelContent = label && (\n    <FormLabel\n      color=\"inherit\"\n      variant=\"inherit\"\n      label={label}\n      required={required}\n      showRequiredAsterisk={required}\n      maxFontSizeMultiplier={resolvedMaxFontSizeMultiplier}\n      style={[resolvedSwitchStyles.text, variantLayerStyles.text]}\n    />\n  );\n\n  const a11yValue = useMemo(() => ({ text: isOn ? 'On' : 'Off' }), [isOn]);\n\n  return (\n    <Pressable\n      ref={ref}\n      onPress={handlePress}\n      disabled={disabled}\n      accessible\n      accessibilityRole=\"switch\"\n      accessibilityState={{ checked: isOn, disabled }}\n      accessibilityLabel={accessibilityLabel}\n      accessibilityHint={resolvedAccessibilityHint}\n      accessibilityValue={a11yValue}\n      {...viewProps}\n      style={rootStyle}\n    >\n      {labelPosition === 'start' && labelContent}\n\n      <Animated.View style={trackStyle} importantForAccessibility=\"no-hide-descendants\">\n        <Animated.View style={handleStyle}>\n          {onIcon && isOn && (\n            <Animated.View style={switchStaticStyles.iconContainer}>\n              <IconSlot\n                icon={onIcon}\n                variant=\"fill\"\n                dangerouslySetSize={scaledHandleIconSize}\n                allowFontScaling={false}\n                style={[resolvedSwitchStyles.handleIcon, variantLayerStyles.handleIcon]}\n              />\n            </Animated.View>\n          )}\n          {offIcon && !isOn && (\n            <Animated.View style={switchStaticStyles.iconContainer}>\n              <IconSlot\n                icon={offIcon}\n                variant=\"fill\"\n                dangerouslySetSize={scaledHandleIconSize}\n                allowFontScaling={false}\n                style={[resolvedSwitchStyles.handleIcon, variantLayerStyles.handleIcon]}\n              />\n            </Animated.View>\n          )}\n        </Animated.View>\n      </Animated.View>\n\n      {labelPosition === 'end' && labelContent}\n    </Pressable>\n  );\n});\n\nSwitch.displayName = 'Switch';\n\nconst switchStaticStyles = StyleSheet.create((theme) => ({\n  handle: {\n    borderRadius: theme.borderRadius.full,\n    alignItems: 'center',\n    justifyContent: 'center',\n  },\n  iconContainer: {\n    position: 'absolute',\n    alignItems: 'center',\n    justifyContent: 'center',\n  },\n  track: {\n    justifyContent: 'center',\n    borderRadius: theme.borderRadius.full,\n  },\n  root: ({ disabled }: { disabled: boolean }) => ({\n    flexDirection: 'row',\n    alignItems: 'center',\n    alignSelf: 'flex-start',\n    opacity: disabled ? 0.5 : 1,\n  }),\n}));\n\nexport { Switch, type SwitchProps };\n"],"mappings":"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"}

package/dist/components/Tabs/Tab.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_FontScalingContext = require("../../fontScaling/FontScalingContext.cjs");
 const require_fontScaling_useFontScale = require("../../fontScaling/useFontScale.cjs");
 const require_fontScaling_useMaxFontSizeMultiplier = require("../../fontScaling/useMaxFontSizeMultiplier.cjs");
 const require_components_IconSlot = require("../IconSlot.cjs");
@@ -27,7 +28,10 @@ function TabLabel({ style, maxFontSizeMultiplier, children }) {
 		maxFontSizeMultiplier,
 		children
 	});
-	return children;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_fontScaling_FontScalingContext.ResolvedControlFontScalingProvider, {
+		maxFontSizeMultiplier,
+		children
+	});
 }
 /**
 * **⚙️ Tab**
@@ -46,7 +50,6 @@ const Tab = (0, react.memo)(function Tab({ value, children, startIcon, endIcon,
 	const { theme } = (0, react_native_unistyles.useUnistyles)();
 	const [pressed, setPressed] = (0, react.useState)(false);
 	const resolvedMaxFontSizeMultiplier = require_fontScaling_useMaxFontSizeMultiplier.useMaxFontSizeMultiplier("control", maxFontSizeMultiplier) ?? 0;
-	const fontScaleFactor = require_fontScaling_useFontScale.useFontScale(resolvedMaxFontSizeMultiplier);
 	const selected = !disabled && selectedId === uid;
 	const active = selected ? "on" : "off";
 	const interaction = pressed ? "pressed" : "rest";
@@ -72,6 +75,7 @@ const Tab = (0, react.memo)(function Tab({ value, children, startIcon, endIcon,
 		active,
 		interaction
 	]);
+	const fontScaleFactor = require_fontScaling_useFontScale.useFontScale(resolvedMaxFontSizeMultiplier, (typeof textStyle.lineHeight === "number" ? textStyle.lineHeight : void 0) ?? (typeof textStyle.fontSize === "number" ? textStyle.fontSize : void 0));
 	const iconStyle = (0, react.useMemo)(() => require_components_Tabs_tabTheme.getMergedTabLayerStyle(theme, visualVariant, active, "icon", interaction), [
 		theme,
 		visualVariant,

package/dist/components/Tabs/Tab.d.cts.map

@@ -1 +1 @@
-{"version":3,"file":"Tab.d.cts","names":[],"sources":["../../../src/components/Tabs/Tab.tsx"],"mappings":";;;;;;;UAmBU,QAAA,SAEN,IAAA,CAAK,cAAA,kDACL,IAAA,CAAK,iBAAA;EACP,QAAA,EAAU,iBAAA;EACV,SAAA,GAAY,YAAA;EACZ,OAAA,GAAU,YAAA;EACV,KAAA,GAAQ,SAAA;AAAA;;;;;;;;;;cAwCJ,GAAA,EAAG,OAAA,CAAA,oBAAA,CAAA,QAAA"}
+{"version":3,"file":"Tab.d.cts","names":[],"sources":["../../../src/components/Tabs/Tab.tsx"],"mappings":";;;;;;;UAoBU,QAAA,SAEN,IAAA,CAAK,cAAA,kDACL,IAAA,CAAK,iBAAA;EACP,QAAA,EAAU,iBAAA;EACV,SAAA,GAAY,YAAA;EACZ,OAAA,GAAU,YAAA;EACV,KAAA,GAAQ,SAAA;AAAA;;;;;;;;;;cA4CJ,GAAA,EAAG,OAAA,CAAA,oBAAA,CAAA,QAAA"}

package/dist/components/Tabs/Tab.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Tab.d.ts","names":[],"sources":["../../../src/components/Tabs/Tab.tsx"],"mappings":";;;;;;;UAmBU,QAAA,SAEN,IAAA,CAAK,cAAA,kDACL,IAAA,CAAK,iBAAA;EACP,QAAA,EAAU,iBAAA;EACV,SAAA,GAAY,YAAA;EACZ,OAAA,GAAU,YAAA;EACV,KAAA,GAAQ,SAAA;AAAA;;;;;;;;;;cAwCJ,GAAA,EAAG,OAAA,CAAA,oBAAA,CAAA,QAAA"}
+{"version":3,"file":"Tab.d.ts","names":[],"sources":["../../../src/components/Tabs/Tab.tsx"],"mappings":";;;;;;;UAoBU,QAAA,SAEN,IAAA,CAAK,cAAA,kDACL,IAAA,CAAK,iBAAA;EACP,QAAA,EAAU,iBAAA;EACV,SAAA,GAAY,YAAA;EACZ,OAAA,GAAU,YAAA;EACV,KAAA,GAAQ,SAAA;AAAA;;;;;;;;;;cA4CJ,GAAA,EAAG,OAAA,CAAA,oBAAA,CAAA,QAAA"}

package/dist/components/Tabs/Tab.js

@@ -1,4 +1,5 @@
 /*! © 2026 Yahoo, Inc. UDS Mobile v0.0.0-development */
+import { ResolvedControlFontScalingProvider } from "../../fontScaling/FontScalingContext.js";
 import { useFontScale } from "../../fontScaling/useFontScale.js";
 import { useMaxFontSizeMultiplier } from "../../fontScaling/useMaxFontSizeMultiplier.js";
 import { IconSlot } from "../IconSlot.js";
@@ -25,7 +26,10 @@ function TabLabel({ style, maxFontSizeMultiplier, children }) {
 		maxFontSizeMultiplier,
 		children
 	});
-	return children;
+	return /* @__PURE__ */ jsx(ResolvedControlFontScalingProvider, {
+		maxFontSizeMultiplier,
+		children
+	});
 }
 /**
 * **⚙️ Tab**
@@ -44,7 +48,6 @@ const Tab = memo(function Tab({ value, children, startIcon, endIcon, disabled, s
 	const { theme } = useUnistyles();
 	const [pressed, setPressed] = useState(false);
 	const resolvedMaxFontSizeMultiplier = useMaxFontSizeMultiplier("control", maxFontSizeMultiplier) ?? 0;
-	const fontScaleFactor = useFontScale(resolvedMaxFontSizeMultiplier);
 	const selected = !disabled && selectedId === uid;
 	const active = selected ? "on" : "off";
 	const interaction = pressed ? "pressed" : "rest";
@@ -70,6 +73,7 @@ const Tab = memo(function Tab({ value, children, startIcon, endIcon, disabled, s
 		active,
 		interaction
 	]);
+	const fontScaleFactor = useFontScale(resolvedMaxFontSizeMultiplier, (typeof textStyle.lineHeight === "number" ? textStyle.lineHeight : void 0) ?? (typeof textStyle.fontSize === "number" ? textStyle.fontSize : void 0));
 	const iconStyle = useMemo(() => getMergedTabLayerStyle(theme, visualVariant, active, "icon", interaction), [
 		theme,
 		visualVariant,

package/dist/components/Tabs/Tab.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tab.js","names":["RNText","Pressable"],"sources":["../../../src/components/Tabs/Tab.tsx"],"sourcesContent":["import type { UniversalTabProps } from '@yahoo/uds-types';\nimport type { ReactElement, ReactNode } from 'react';\nimport { memo, useCallback, useEffect, useId, useMemo, useState } from 'react';\nimport type { LayoutChangeEvent, PressableProps, TextStyle, ViewStyle } from 'react-native';\nimport { Text as RNText, View } from 'react-native';\n// eslint-disable-next-line uds/no-use-unistyles -- theme.components path lookups for tab layers\nimport { useUnistyles } from 'react-native-unistyles';\n\nimport type { StyleProps } from '../../../generated/styles';\nimport { useFontScale } from '../../fontScaling/useFontScale';\nimport { useMaxFontSizeMultiplier } from '../../fontScaling/useMaxFontSizeMultiplier';\nimport type { IconSlotType } from '../IconSlot';\nimport { IconSlot } from '../IconSlot';\nimport { Pressable } from '../Pressable';\nimport { useTabSelectionContext, useTabsVisualContext } from './tabsContexts';\nimport { getMergedTabLayerStyle, getTabLayerStyle } from './tabTheme';\n\nconst PRIMARY_TAB_UNDERLINE_HEIGHT = 2;\n\ninterface TabProps\n  extends\n    Omit<PressableProps, 'children' | 'style' | 'disabled' | 'onPress'>,\n    Omit<UniversalTabProps, 'asChild' | 'className' | 'startIcon' | 'endIcon'> {\n  children: UniversalTabProps['children'];\n  startIcon?: IconSlotType;\n  endIcon?: IconSlotType;\n  style?: ViewStyle;\n}\n\nconst CLEAR_SELECTION_CHROME: ViewStyle = {\n  backgroundColor: 'transparent',\n  borderWidth: 0,\n  borderColor: 'transparent',\n  shadowOpacity: 0,\n  elevation: 0,\n  boxShadow: [],\n};\n\nfunction TabLabel({\n  style,\n  maxFontSizeMultiplier,\n  children,\n}: {\n  style: TextStyle;\n  maxFontSizeMultiplier: number;\n  children: ReactNode;\n}) {\n  if (typeof children === 'string' || typeof children === 'number') {\n    return (\n      <RNText style={style} maxFontSizeMultiplier={maxFontSizeMultiplier}>\n        {children}\n      </RNText>\n    );\n  }\n  return children as ReactElement;\n}\n\n/**\n * **⚙️ Tab**\n *\n * @description\n * A single selectable tab. Must be used inside {@link TabList} within {@link Tabs}.\n *\n * @category Navigation\n * @platform mobile\n */\nconst Tab = memo(function Tab({\n  value,\n  children,\n  startIcon,\n  endIcon,\n  disabled,\n  style,\n  ...pressableRest\n}: TabProps) {\n  const generatedId = useId();\n  const uid = value ?? `uds-tab-${generatedId}`;\n  const { variant: visualVariant, reduceMotion, maxFontSizeMultiplier } = useTabsVisualContext();\n  const { selectedId, setSelectedId, registerTab, unregisterTab, setTabLayout } =\n    useTabSelectionContext();\n  const { theme } = useUnistyles();\n  const [pressed, setPressed] = useState(false);\n\n  // One capped factor governs the label, icons, and the tab's fixed height.\n  const resolvedMaxFontSizeMultiplier =\n    useMaxFontSizeMultiplier('control', maxFontSizeMultiplier) ?? 0;\n  const fontScaleFactor = useFontScale(resolvedMaxFontSizeMultiplier);\n\n  const selected = !disabled && selectedId === uid;\n  const active: 'on' | 'off' = selected ? 'on' : 'off';\n  const interaction: 'rest' | 'pressed' = pressed ? 'pressed' : 'rest';\n\n  useEffect(() => {\n    registerTab(uid);\n    return () => {\n      unregisterTab(uid);\n    };\n  }, [uid, registerTab, unregisterTab]);\n\n  const rootBase = useMemo(\n    () => getMergedTabLayerStyle(theme, visualVariant, active, 'root', interaction) as ViewStyle,\n    [theme, visualVariant, active, interaction],\n  );\n  const textStyle = useMemo(\n    () =>\n      getMergedTabLayerStyle(theme, visualVariant, active, 'rootText', interaction) as TextStyle,\n    [theme, visualVariant, active, interaction],\n  );\n  const iconStyle = useMemo(\n    () => getMergedTabLayerStyle(theme, visualVariant, active, 'icon', interaction) as TextStyle,\n    [theme, visualVariant, active, interaction],\n  );\n\n  const iconColor = ((): StyleProps['color'] | undefined => {\n    const c = iconStyle?.color;\n    if (c === undefined || c === null) {\n      return undefined;\n    }\n    return c as StyleProps['color'];\n  })();\n\n  /** Inactive primary tabs use transparent underline tokens on web; RN has no CSS vars for that layer. */\n  const showPrimaryPerTabUnderline = visualVariant === 'primary' && !(selected && !reduceMotion);\n\n  const primaryUnderlineColor = useMemo(() => {\n    if (visualVariant !== 'primary') {\n      return undefined;\n    }\n    if (selected && reduceMotion) {\n      const onText = getTabLayerStyle(theme, 'primary', 'on', 'rootText', 'rest') as TextStyle;\n      const c = onText.color;\n      if (typeof c === 'string') {\n        return c;\n      }\n    }\n    return 'transparent';\n  }, [visualVariant, selected, reduceMotion, theme]);\n\n  const rootStyle = useMemo((): ViewStyle => {\n    const base: ViewStyle = {\n      ...rootBase,\n      flexDirection: 'row',\n      alignItems: 'center',\n      flexShrink: 0,\n      zIndex: 1,\n      position: 'relative',\n    };\n    // A fixed token height grows with the capped label so text never clips.\n    if (fontScaleFactor !== 1 && typeof base.height === 'number') {\n      base.height = Math.round(base.height * fontScaleFactor);\n    }\n    if (selected && !reduceMotion) {\n      return { ...base, ...CLEAR_SELECTION_CHROME };\n    }\n    return base;\n  }, [rootBase, fontScaleFactor, selected, reduceMotion]);\n\n  const onLayout = useCallback(\n    (e: LayoutChangeEvent) => {\n      setTabLayout(uid, e.nativeEvent.layout);\n    },\n    [uid, setTabLayout],\n  );\n\n  const onPress = useCallback(() => {\n    if (disabled) {\n      return;\n    }\n    setSelectedId(uid);\n  }, [disabled, setSelectedId, uid]);\n\n  return (\n    <Pressable\n      accessibilityRole=\"tab\"\n      accessibilityState={{ selected, disabled: !!disabled }}\n      disabled={disabled}\n      onPress={onPress}\n      onPressIn={() => setPressed(true)}\n      onPressOut={() => setPressed(false)}\n      onLayout={onLayout}\n      style={[rootStyle, style]}\n      {...pressableRest}\n    >\n      {startIcon ? (\n        <IconSlot\n          icon={startIcon}\n          size=\"sm\"\n          maxFontSizeMultiplier={resolvedMaxFontSizeMultiplier}\n          style={iconStyle}\n          {...(iconColor !== undefined ? { color: iconColor } : {})}\n        />\n      ) : null}\n      <TabLabel style={textStyle} maxFontSizeMultiplier={resolvedMaxFontSizeMultiplier}>\n        {children}\n      </TabLabel>\n      {endIcon ? (\n        <IconSlot\n          icon={endIcon}\n          size=\"sm\"\n          maxFontSizeMultiplier={resolvedMaxFontSizeMultiplier}\n          style={iconStyle}\n          {...(iconColor !== undefined ? { color: iconColor } : {})}\n        />\n      ) : null}\n      {showPrimaryPerTabUnderline &&\n      primaryUnderlineColor &&\n      primaryUnderlineColor !== 'transparent' ? (\n        <View\n          accessibilityElementsHidden\n          importantForAccessibility=\"no-hide-descendants\"\n          pointerEvents=\"none\"\n          style={{\n            position: 'absolute',\n            left: 0,\n            right: 0,\n            bottom: 0,\n            height: PRIMARY_TAB_UNDERLINE_HEIGHT,\n            backgroundColor: primaryUnderlineColor,\n          }}\n        />\n      ) : null}\n    </Pressable>\n  );\n});\n\nTab.displayName = 'Tab';\n\nexport { Tab };\nexport type { TabProps };\n"],"mappings":"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"}
+{"version":3,"file":"Tab.js","names":["RNText","Pressable"],"sources":["../../../src/components/Tabs/Tab.tsx"],"sourcesContent":["import type { UniversalTabProps } from '@yahoo/uds-types';\nimport type { ReactElement, ReactNode } from 'react';\nimport { memo, useCallback, useEffect, useId, useMemo, useState } from 'react';\nimport type { LayoutChangeEvent, PressableProps, TextStyle, ViewStyle } from 'react-native';\nimport { Text as RNText, View } from 'react-native';\n// eslint-disable-next-line uds/no-use-unistyles -- theme.components path lookups for tab layers\nimport { useUnistyles } from 'react-native-unistyles';\n\nimport type { StyleProps } from '../../../generated/styles';\nimport { ResolvedControlFontScalingProvider } from '../../fontScaling/FontScalingContext';\nimport { useFontScale } from '../../fontScaling/useFontScale';\nimport { useMaxFontSizeMultiplier } from '../../fontScaling/useMaxFontSizeMultiplier';\nimport type { IconSlotType } from '../IconSlot';\nimport { IconSlot } from '../IconSlot';\nimport { Pressable } from '../Pressable';\nimport { useTabSelectionContext, useTabsVisualContext } from './tabsContexts';\nimport { getMergedTabLayerStyle, getTabLayerStyle } from './tabTheme';\n\nconst PRIMARY_TAB_UNDERLINE_HEIGHT = 2;\n\ninterface TabProps\n  extends\n    Omit<PressableProps, 'children' | 'style' | 'disabled' | 'onPress'>,\n    Omit<UniversalTabProps, 'asChild' | 'className' | 'startIcon' | 'endIcon'> {\n  children: UniversalTabProps['children'];\n  startIcon?: IconSlotType;\n  endIcon?: IconSlotType;\n  style?: ViewStyle;\n}\n\nconst CLEAR_SELECTION_CHROME: ViewStyle = {\n  backgroundColor: 'transparent',\n  borderWidth: 0,\n  borderColor: 'transparent',\n  shadowOpacity: 0,\n  elevation: 0,\n  boxShadow: [],\n};\n\nfunction TabLabel({\n  style,\n  maxFontSizeMultiplier,\n  children,\n}: {\n  style: TextStyle;\n  maxFontSizeMultiplier: number;\n  children: ReactNode;\n}) {\n  if (typeof children === 'string' || typeof children === 'number') {\n    return (\n      <RNText style={style} maxFontSizeMultiplier={maxFontSizeMultiplier}>\n        {children}\n      </RNText>\n    );\n  }\n  return (\n    <ResolvedControlFontScalingProvider maxFontSizeMultiplier={maxFontSizeMultiplier}>\n      {children as ReactElement}\n    </ResolvedControlFontScalingProvider>\n  );\n}\n\n/**\n * **⚙️ Tab**\n *\n * @description\n * A single selectable tab. Must be used inside {@link TabList} within {@link Tabs}.\n *\n * @category Navigation\n * @platform mobile\n */\nconst Tab = memo(function Tab({\n  value,\n  children,\n  startIcon,\n  endIcon,\n  disabled,\n  style,\n  ...pressableRest\n}: TabProps) {\n  const generatedId = useId();\n  const uid = value ?? `uds-tab-${generatedId}`;\n  const { variant: visualVariant, reduceMotion, maxFontSizeMultiplier } = useTabsVisualContext();\n  const { selectedId, setSelectedId, registerTab, unregisterTab, setTabLayout } =\n    useTabSelectionContext();\n  const { theme } = useUnistyles();\n  const [pressed, setPressed] = useState(false);\n\n  // One capped factor governs the label, icons, and the tab's fixed height.\n  const resolvedMaxFontSizeMultiplier =\n    useMaxFontSizeMultiplier('control', maxFontSizeMultiplier) ?? 0;\n\n  const selected = !disabled && selectedId === uid;\n  const active: 'on' | 'off' = selected ? 'on' : 'off';\n  const interaction: 'rest' | 'pressed' = pressed ? 'pressed' : 'rest';\n\n  useEffect(() => {\n    registerTab(uid);\n    return () => {\n      unregisterTab(uid);\n    };\n  }, [uid, registerTab, unregisterTab]);\n\n  const rootBase = useMemo(\n    () => getMergedTabLayerStyle(theme, visualVariant, active, 'root', interaction) as ViewStyle,\n    [theme, visualVariant, active, interaction],\n  );\n  const textStyle = useMemo(\n    () =>\n      getMergedTabLayerStyle(theme, visualVariant, active, 'rootText', interaction) as TextStyle,\n    [theme, visualVariant, active, interaction],\n  );\n  const fontScaleFactor = useFontScale(\n    resolvedMaxFontSizeMultiplier,\n    (typeof textStyle.lineHeight === 'number' ? textStyle.lineHeight : undefined) ??\n      (typeof textStyle.fontSize === 'number' ? textStyle.fontSize : undefined),\n  );\n  const iconStyle = useMemo(\n    () => getMergedTabLayerStyle(theme, visualVariant, active, 'icon', interaction) as TextStyle,\n    [theme, visualVariant, active, interaction],\n  );\n\n  const iconColor = ((): StyleProps['color'] | undefined => {\n    const c = iconStyle?.color;\n    if (c === undefined || c === null) {\n      return undefined;\n    }\n    return c as StyleProps['color'];\n  })();\n\n  /** Inactive primary tabs use transparent underline tokens on web; RN has no CSS vars for that layer. */\n  const showPrimaryPerTabUnderline = visualVariant === 'primary' && !(selected && !reduceMotion);\n\n  const primaryUnderlineColor = useMemo(() => {\n    if (visualVariant !== 'primary') {\n      return undefined;\n    }\n    if (selected && reduceMotion) {\n      const onText = getTabLayerStyle(theme, 'primary', 'on', 'rootText', 'rest') as TextStyle;\n      const c = onText.color;\n      if (typeof c === 'string') {\n        return c;\n      }\n    }\n    return 'transparent';\n  }, [visualVariant, selected, reduceMotion, theme]);\n\n  const rootStyle = useMemo((): ViewStyle => {\n    const base: ViewStyle = {\n      ...rootBase,\n      flexDirection: 'row',\n      alignItems: 'center',\n      flexShrink: 0,\n      zIndex: 1,\n      position: 'relative',\n    };\n    // A fixed token height grows with the capped label so text never clips.\n    if (fontScaleFactor !== 1 && typeof base.height === 'number') {\n      base.height = Math.round(base.height * fontScaleFactor);\n    }\n    if (selected && !reduceMotion) {\n      return { ...base, ...CLEAR_SELECTION_CHROME };\n    }\n    return base;\n  }, [rootBase, fontScaleFactor, selected, reduceMotion]);\n\n  const onLayout = useCallback(\n    (e: LayoutChangeEvent) => {\n      setTabLayout(uid, e.nativeEvent.layout);\n    },\n    [uid, setTabLayout],\n  );\n\n  const onPress = useCallback(() => {\n    if (disabled) {\n      return;\n    }\n    setSelectedId(uid);\n  }, [disabled, setSelectedId, uid]);\n\n  return (\n    <Pressable\n      accessibilityRole=\"tab\"\n      accessibilityState={{ selected, disabled: !!disabled }}\n      disabled={disabled}\n      onPress={onPress}\n      onPressIn={() => setPressed(true)}\n      onPressOut={() => setPressed(false)}\n      onLayout={onLayout}\n      style={[rootStyle, style]}\n      {...pressableRest}\n    >\n      {startIcon ? (\n        <IconSlot\n          icon={startIcon}\n          size=\"sm\"\n          maxFontSizeMultiplier={resolvedMaxFontSizeMultiplier}\n          style={iconStyle}\n          {...(iconColor !== undefined ? { color: iconColor } : {})}\n        />\n      ) : null}\n      <TabLabel style={textStyle} maxFontSizeMultiplier={resolvedMaxFontSizeMultiplier}>\n        {children}\n      </TabLabel>\n      {endIcon ? (\n        <IconSlot\n          icon={endIcon}\n          size=\"sm\"\n          maxFontSizeMultiplier={resolvedMaxFontSizeMultiplier}\n          style={iconStyle}\n          {...(iconColor !== undefined ? { color: iconColor } : {})}\n        />\n      ) : null}\n      {showPrimaryPerTabUnderline &&\n      primaryUnderlineColor &&\n      primaryUnderlineColor !== 'transparent' ? (\n        <View\n          accessibilityElementsHidden\n          importantForAccessibility=\"no-hide-descendants\"\n          pointerEvents=\"none\"\n          style={{\n            position: 'absolute',\n            left: 0,\n            right: 0,\n            bottom: 0,\n            height: PRIMARY_TAB_UNDERLINE_HEIGHT,\n            backgroundColor: primaryUnderlineColor,\n          }}\n        />\n      ) : null}\n    </Pressable>\n  );\n});\n\nTab.displayName = 'Tab';\n\nexport { Tab };\nexport type { TabProps };\n"],"mappings":"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"}

package/dist/components/Text.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_constants = require("../fontScaling/constants.cjs");
 const require_fontScaling_useMaxFontSizeMultiplier = require("../fontScaling/useMaxFontSizeMultiplier.cjs");
 let react = require("react");
 let react_native = require("react-native");
@@ -55,6 +56,8 @@ const Text = (0, react.memo)(function Text({ color = "primary", variant = "body1
 	const resolvedFontSize = fontSize ?? resolvedVariant;
 	const resolvedLineHeight = lineHeight === "none" ? void 0 : lineHeight ?? (hasCJKContent(children) ? void 0 : resolvedVariant);
 	const resolvedLetterSpacing = letterSpacing ?? resolvedVariant;
+	const baseVariant = resolvedVariant?.split("/")[0];
+	const defaultDynamicTypeRamp = baseVariant ? require_fontScaling_constants.DEFAULT_DYNAMIC_TYPE_RAMPS[baseVariant] : void 0;
 	const resolvedMaxFontSizeMultiplier = require_fontScaling_useMaxFontSizeMultiplier.useMaxFontSizeMultiplier(resolvedVariant, maxFontSizeMultiplier);
 	generated_styles.styles.useVariants({
 		color: resolvedColor,
@@ -127,6 +130,7 @@ const Text = (0, react.memo)(function Text({ color = "primary", variant = "body1
 			generated_styles.styles.foundation
 		]),
 		maxFontSizeMultiplier: resolvedMaxFontSizeMultiplier,
+		dynamicTypeRamp: defaultDynamicTypeRamp,
 		...props,
 		children
 	});

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

@@ -1 +1 @@
-{"version":3,"file":"Text.d.cts","names":[],"sources":["../../src/components/Text.tsx"],"mappings":";;;;;;;KAUK,WAAA,GAAc,OAAA,CACjB,WAAA,CAAY,UAAA;AAAA,KAGT,eAAA,GAAkB,WAAA;AAAA,KAIlB,kBAAA;AAAA,UAuBK,SAAA,SAAkB,WAAA;;EAE1B,GAAA,GAAM,GAAA,CAAI,MAAA;EAhCV;EAkCA,KAAA,GAAQ,UAAA;EAnCgB;EAqCxB,OAAA,GAAU,eAAA;EArCO;;;;;AACK;;;EA6CtB,qBAAA;EA1CgC;EA4ChC,UAAA,GAAa,UAAA;EAxCQ;EA0CrB,QAAA,GAAW,UAAA;EA1CU;EA4CrB,UAAA,GAAa,UAAA;EArBL;EAuBR,UAAA,GAAa,UAAA;;EAEb,aAAA,GAAgB,UAAA;EAvBV;EAyBN,SAAA,GAAY,UAAA;EArBF;EAuBV,aAAA,GAAgB,UAAA;EAVL;EAYX,kBAAA,GAAqB,kBAAA;EAErB,eAAA,GAAkB,UAAA;EAElB,YAAA,GAAe,UAAA;EACf,oBAAA,GAAuB,UAAA;EACvB,kBAAA,GAAqB,UAAA;EACrB,uBAAA,GAA0B,UAAA;EAC1B,qBAAA,GAAwB,UAAA;EACxB,WAAA,GAAc,UAAA;EACd,gBAAA,GAAmB,UAAA;EACnB,cAAA,GAAiB,UAAA;EACjB,cAAA,GAAiB,UAAA;EACjB,iBAAA,GAAoB,UAAA;EACpB,WAAA,GAAc,UAAA;EACd,mBAAA,GAAsB,UAAA;EACtB,qBAAA,GAAwB,UAAA;EACxB,gBAAA,GAAmB,UAAA;EACnB,cAAA,GAAiB,UAAA;EACjB,cAAA,GAAiB,UAAA;EACjB,iBAAA,GAAoB,UAAA;EAEpB,OAAA,GAAU,UAAA;EACV,iBAAA,GAAoB,UAAA;EACpB,eAAA,GAAkB,UAAA;EAClB,aAAA,GAAgB,UAAA;EAChB,UAAA,GAAa,UAAA;EACb,YAAA,GAAe,UAAA;EACf,UAAA,GAAa,UAAA;EAEb,MAAA,GAAS,UAAA;EACT,cAAA,GAAiB,UAAA;EACjB,gBAAA,GAAmB,UAAA;EACnB,YAAA,GAAe,UAAA;EACf,SAAA,GAAY,UAAA;EACZ,WAAA,GAAc,UAAA;EACd,SAAA,GAAY,UAAA;EAEZ,UAAA,GAAa,UAAA;EAEb,aAAA,GAAgB,SAAA;EAEhB,MAAA;EACA,KAAA;EACA,SAAA;EACA,SAAA;EACA,QAAA;EACA,QAAA;EAEA,mBAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;cAiCI,IAAA,EAAI,OAAA,CAAA,oBAAA,CAAA,SAAA"}
+{"version":3,"file":"Text.d.cts","names":[],"sources":["../../src/components/Text.tsx"],"mappings":";;;;;;;KAWK,WAAA,GAAc,OAAA,CACjB,WAAA,CAAY,UAAA;AAAA,KAGT,eAAA,GAAkB,WAAA;AAAA,KAIlB,kBAAA;AAAA,UAuBK,SAAA,SAAkB,WAAA;;EAE1B,GAAA,GAAM,GAAA,CAAI,MAAA;EAhCV;EAkCA,KAAA,GAAQ,UAAA;EAnCgB;EAqCxB,OAAA,GAAU,eAAA;EArCO;;;;;AACK;;;EA6CtB,qBAAA;EA1CgC;EA4ChC,UAAA,GAAa,UAAA;EAxCQ;EA0CrB,QAAA,GAAW,UAAA;EA1CU;EA4CrB,UAAA,GAAa,UAAA;EArBL;EAuBR,UAAA,GAAa,UAAA;;EAEb,aAAA,GAAgB,UAAA;EAvBV;EAyBN,SAAA,GAAY,UAAA;EArBF;EAuBV,aAAA,GAAgB,UAAA;EAVL;EAYX,kBAAA,GAAqB,kBAAA;EAErB,eAAA,GAAkB,UAAA;EAElB,YAAA,GAAe,UAAA;EACf,oBAAA,GAAuB,UAAA;EACvB,kBAAA,GAAqB,UAAA;EACrB,uBAAA,GAA0B,UAAA;EAC1B,qBAAA,GAAwB,UAAA;EACxB,WAAA,GAAc,UAAA;EACd,gBAAA,GAAmB,UAAA;EACnB,cAAA,GAAiB,UAAA;EACjB,cAAA,GAAiB,UAAA;EACjB,iBAAA,GAAoB,UAAA;EACpB,WAAA,GAAc,UAAA;EACd,mBAAA,GAAsB,UAAA;EACtB,qBAAA,GAAwB,UAAA;EACxB,gBAAA,GAAmB,UAAA;EACnB,cAAA,GAAiB,UAAA;EACjB,cAAA,GAAiB,UAAA;EACjB,iBAAA,GAAoB,UAAA;EAEpB,OAAA,GAAU,UAAA;EACV,iBAAA,GAAoB,UAAA;EACpB,eAAA,GAAkB,UAAA;EAClB,aAAA,GAAgB,UAAA;EAChB,UAAA,GAAa,UAAA;EACb,YAAA,GAAe,UAAA;EACf,UAAA,GAAa,UAAA;EAEb,MAAA,GAAS,UAAA;EACT,cAAA,GAAiB,UAAA;EACjB,gBAAA,GAAmB,UAAA;EACnB,YAAA,GAAe,UAAA;EACf,SAAA,GAAY,UAAA;EACZ,WAAA,GAAc,UAAA;EACd,SAAA,GAAY,UAAA;EAEZ,UAAA,GAAa,UAAA;EAEb,aAAA,GAAgB,SAAA;EAEhB,MAAA;EACA,KAAA;EACA,SAAA;EACA,SAAA;EACA,QAAA;EACA,QAAA;EAEA,mBAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;cAiCI,IAAA,EAAI,OAAA,CAAA,oBAAA,CAAA,SAAA"}

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

@@ -1 +1 @@
-{"version":3,"file":"Text.d.ts","names":[],"sources":["../../src/components/Text.tsx"],"mappings":";;;;;;;KAUK,WAAA,GAAc,OAAA,CACjB,WAAA,CAAY,UAAA;AAAA,KAGT,eAAA,GAAkB,WAAA;AAAA,KAIlB,kBAAA;AAAA,UAuBK,SAAA,SAAkB,WAAA;;EAE1B,GAAA,GAAM,GAAA,CAAI,MAAA;EAhCV;EAkCA,KAAA,GAAQ,UAAA;EAnCgB;EAqCxB,OAAA,GAAU,eAAA;EArCO;;;;;AACK;;;EA6CtB,qBAAA;EA1CgC;EA4ChC,UAAA,GAAa,UAAA;EAxCQ;EA0CrB,QAAA,GAAW,UAAA;EA1CU;EA4CrB,UAAA,GAAa,UAAA;EArBL;EAuBR,UAAA,GAAa,UAAA;;EAEb,aAAA,GAAgB,UAAA;EAvBV;EAyBN,SAAA,GAAY,UAAA;EArBF;EAuBV,aAAA,GAAgB,UAAA;EAVL;EAYX,kBAAA,GAAqB,kBAAA;EAErB,eAAA,GAAkB,UAAA;EAElB,YAAA,GAAe,UAAA;EACf,oBAAA,GAAuB,UAAA;EACvB,kBAAA,GAAqB,UAAA;EACrB,uBAAA,GAA0B,UAAA;EAC1B,qBAAA,GAAwB,UAAA;EACxB,WAAA,GAAc,UAAA;EACd,gBAAA,GAAmB,UAAA;EACnB,cAAA,GAAiB,UAAA;EACjB,cAAA,GAAiB,UAAA;EACjB,iBAAA,GAAoB,UAAA;EACpB,WAAA,GAAc,UAAA;EACd,mBAAA,GAAsB,UAAA;EACtB,qBAAA,GAAwB,UAAA;EACxB,gBAAA,GAAmB,UAAA;EACnB,cAAA,GAAiB,UAAA;EACjB,cAAA,GAAiB,UAAA;EACjB,iBAAA,GAAoB,UAAA;EAEpB,OAAA,GAAU,UAAA;EACV,iBAAA,GAAoB,UAAA;EACpB,eAAA,GAAkB,UAAA;EAClB,aAAA,GAAgB,UAAA;EAChB,UAAA,GAAa,UAAA;EACb,YAAA,GAAe,UAAA;EACf,UAAA,GAAa,UAAA;EAEb,MAAA,GAAS,UAAA;EACT,cAAA,GAAiB,UAAA;EACjB,gBAAA,GAAmB,UAAA;EACnB,YAAA,GAAe,UAAA;EACf,SAAA,GAAY,UAAA;EACZ,WAAA,GAAc,UAAA;EACd,SAAA,GAAY,UAAA;EAEZ,UAAA,GAAa,UAAA;EAEb,aAAA,GAAgB,SAAA;EAEhB,MAAA;EACA,KAAA;EACA,SAAA;EACA,SAAA;EACA,QAAA;EACA,QAAA;EAEA,mBAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;cAiCI,IAAA,EAAI,OAAA,CAAA,oBAAA,CAAA,SAAA"}
+{"version":3,"file":"Text.d.ts","names":[],"sources":["../../src/components/Text.tsx"],"mappings":";;;;;;;KAWK,WAAA,GAAc,OAAA,CACjB,WAAA,CAAY,UAAA;AAAA,KAGT,eAAA,GAAkB,WAAA;AAAA,KAIlB,kBAAA;AAAA,UAuBK,SAAA,SAAkB,WAAA;;EAE1B,GAAA,GAAM,GAAA,CAAI,MAAA;EAhCV;EAkCA,KAAA,GAAQ,UAAA;EAnCgB;EAqCxB,OAAA,GAAU,eAAA;EArCO;;;;;AACK;;;EA6CtB,qBAAA;EA1CgC;EA4ChC,UAAA,GAAa,UAAA;EAxCQ;EA0CrB,QAAA,GAAW,UAAA;EA1CU;EA4CrB,UAAA,GAAa,UAAA;EArBL;EAuBR,UAAA,GAAa,UAAA;;EAEb,aAAA,GAAgB,UAAA;EAvBV;EAyBN,SAAA,GAAY,UAAA;EArBF;EAuBV,aAAA,GAAgB,UAAA;EAVL;EAYX,kBAAA,GAAqB,kBAAA;EAErB,eAAA,GAAkB,UAAA;EAElB,YAAA,GAAe,UAAA;EACf,oBAAA,GAAuB,UAAA;EACvB,kBAAA,GAAqB,UAAA;EACrB,uBAAA,GAA0B,UAAA;EAC1B,qBAAA,GAAwB,UAAA;EACxB,WAAA,GAAc,UAAA;EACd,gBAAA,GAAmB,UAAA;EACnB,cAAA,GAAiB,UAAA;EACjB,cAAA,GAAiB,UAAA;EACjB,iBAAA,GAAoB,UAAA;EACpB,WAAA,GAAc,UAAA;EACd,mBAAA,GAAsB,UAAA;EACtB,qBAAA,GAAwB,UAAA;EACxB,gBAAA,GAAmB,UAAA;EACnB,cAAA,GAAiB,UAAA;EACjB,cAAA,GAAiB,UAAA;EACjB,iBAAA,GAAoB,UAAA;EAEpB,OAAA,GAAU,UAAA;EACV,iBAAA,GAAoB,UAAA;EACpB,eAAA,GAAkB,UAAA;EAClB,aAAA,GAAgB,UAAA;EAChB,UAAA,GAAa,UAAA;EACb,YAAA,GAAe,UAAA;EACf,UAAA,GAAa,UAAA;EAEb,MAAA,GAAS,UAAA;EACT,cAAA,GAAiB,UAAA;EACjB,gBAAA,GAAmB,UAAA;EACnB,YAAA,GAAe,UAAA;EACf,SAAA,GAAY,UAAA;EACZ,WAAA,GAAc,UAAA;EACd,SAAA,GAAY,UAAA;EAEZ,UAAA,GAAa,UAAA;EAEb,aAAA,GAAgB,SAAA;EAEhB,MAAA;EACA,KAAA;EACA,SAAA;EACA,SAAA;EACA,QAAA;EACA,QAAA;EAEA,mBAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;cAiCI,IAAA,EAAI,OAAA,CAAA,oBAAA,CAAA,SAAA"}