@yahoo/uds-mobile 2.24.0-beta.4 → 2.24.0-beta.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/Avatar/AvatarIcon.cjs +8 -2
- package/dist/components/Avatar/AvatarIcon.d.cts.map +1 -1
- package/dist/components/Avatar/AvatarIcon.d.ts.map +1 -1
- package/dist/components/Avatar/AvatarIcon.js +9 -3
- package/dist/components/Avatar/AvatarIcon.js.map +1 -1
- package/dist/components/Avatar/AvatarImage.cjs +9 -2
- package/dist/components/Avatar/AvatarImage.d.cts.map +1 -1
- package/dist/components/Avatar/AvatarImage.d.ts.map +1 -1
- package/dist/components/Avatar/AvatarImage.js +10 -3
- package/dist/components/Avatar/AvatarImage.js.map +1 -1
- package/dist/components/Avatar/AvatarText.cjs +8 -2
- package/dist/components/Avatar/AvatarText.d.cts.map +1 -1
- package/dist/components/Avatar/AvatarText.d.ts.map +1 -1
- package/dist/components/Avatar/AvatarText.js +9 -3
- package/dist/components/Avatar/AvatarText.js.map +1 -1
- package/dist/components/Avatar/types.d.cts +7 -3
- package/dist/components/Avatar/types.d.cts.map +1 -1
- package/dist/components/Avatar/types.d.ts +7 -3
- package/dist/components/Avatar/types.d.ts.map +1 -1
- package/dist/components/Avatar/utils.cjs +9 -6
- package/dist/components/Avatar/utils.d.cts +2 -2
- package/dist/components/Avatar/utils.d.cts.map +1 -1
- package/dist/components/Avatar/utils.d.ts +2 -2
- package/dist/components/Avatar/utils.d.ts.map +1 -1
- package/dist/components/Avatar/utils.js +9 -6
- package/dist/components/Avatar/utils.js.map +1 -1
- package/dist/components/Button.cjs +5 -1
- package/dist/components/Button.d.cts.map +1 -1
- package/dist/components/Button.d.ts.map +1 -1
- package/dist/components/Button.js +5 -1
- package/dist/components/Button.js.map +1 -1
- package/dist/components/Checkbox.cjs +3 -1
- package/dist/components/Checkbox.js +3 -1
- package/dist/components/Checkbox.js.map +1 -1
- package/dist/components/Icon.cjs +2 -2
- package/dist/components/Icon.js +2 -2
- package/dist/components/Icon.js.map +1 -1
- package/dist/components/Input.cjs +54 -18
- package/dist/components/Input.d.cts +5 -0
- package/dist/components/Input.d.cts.map +1 -1
- package/dist/components/Input.d.ts +5 -0
- package/dist/components/Input.d.ts.map +1 -1
- package/dist/components/Input.js +54 -18
- package/dist/components/Input.js.map +1 -1
- package/dist/components/InputHelpText.cjs +6 -1
- package/dist/components/InputHelpText.d.cts +2 -0
- package/dist/components/InputHelpText.d.cts.map +1 -1
- package/dist/components/InputHelpText.d.ts +2 -0
- package/dist/components/InputHelpText.d.ts.map +1 -1
- package/dist/components/InputHelpText.js +6 -1
- package/dist/components/InputHelpText.js.map +1 -1
- package/dist/components/Select/Select.cjs +11 -2
- package/dist/components/Select/Select.d.cts +2 -0
- package/dist/components/Select/Select.d.cts.map +1 -1
- package/dist/components/Select/Select.d.ts +2 -0
- package/dist/components/Select/Select.d.ts.map +1 -1
- package/dist/components/Select/Select.js +11 -2
- package/dist/components/Select/Select.js.map +1 -1
- package/dist/components/Select/SelectItem.cjs +23 -12
- package/dist/components/Select/SelectItem.d.cts.map +1 -1
- package/dist/components/Select/SelectItem.d.ts.map +1 -1
- package/dist/components/Select/SelectItem.js +23 -12
- package/dist/components/Select/SelectItem.js.map +1 -1
- package/dist/components/Select/SelectTrigger.cjs +28 -13
- package/dist/components/Select/SelectTrigger.d.cts.map +1 -1
- package/dist/components/Select/SelectTrigger.d.ts.map +1 -1
- package/dist/components/Select/SelectTrigger.js +28 -13
- package/dist/components/Select/SelectTrigger.js.map +1 -1
- package/dist/components/Select/types.d.cts +2 -0
- package/dist/components/Select/types.d.cts.map +1 -1
- package/dist/components/Select/types.d.ts +2 -0
- package/dist/components/Select/types.d.ts.map +1 -1
- package/dist/components/Switch.cjs +2 -2
- package/dist/components/Switch.d.cts.map +1 -1
- package/dist/components/Switch.d.ts.map +1 -1
- package/dist/components/Switch.js +2 -2
- package/dist/components/Switch.js.map +1 -1
- package/dist/components/Tabs/Tab.cjs +5 -1
- package/dist/components/Tabs/Tab.d.cts.map +1 -1
- package/dist/components/Tabs/Tab.d.ts.map +1 -1
- package/dist/components/Tabs/Tab.js +5 -1
- package/dist/components/Tabs/Tab.js.map +1 -1
- package/dist/components/Text.cjs +4 -0
- package/dist/components/Text.d.cts.map +1 -1
- package/dist/components/Text.d.ts.map +1 -1
- package/dist/components/Text.js +4 -0
- package/dist/components/Text.js.map +1 -1
- package/dist/components/UDSProvider.cjs +1 -1
- package/dist/components/UDSProvider.js +1 -1
- package/dist/fontScaling/FontScalingContext.cjs +14 -0
- package/dist/fontScaling/FontScalingContext.d.cts +7 -1
- package/dist/fontScaling/FontScalingContext.d.cts.map +1 -1
- package/dist/fontScaling/FontScalingContext.d.ts +7 -1
- package/dist/fontScaling/FontScalingContext.d.ts.map +1 -1
- package/dist/fontScaling/FontScalingContext.js +15 -2
- package/dist/fontScaling/FontScalingContext.js.map +1 -1
- package/dist/fontScaling/constants.cjs +33 -0
- package/dist/fontScaling/constants.d.cts +11 -1
- package/dist/fontScaling/constants.d.cts.map +1 -1
- package/dist/fontScaling/constants.d.ts +11 -1
- package/dist/fontScaling/constants.d.ts.map +1 -1
- package/dist/fontScaling/constants.js +33 -1
- package/dist/fontScaling/constants.js.map +1 -1
- package/dist/fontScaling/index.cjs +2 -1
- package/dist/fontScaling/index.d.cts +2 -2
- package/dist/fontScaling/index.d.ts +2 -2
- package/dist/fontScaling/index.js +3 -3
- package/dist/jest/mocks/styles.cjs +13 -1
- package/dist/jest/mocks/styles.d.cts.map +1 -1
- package/dist/jest/mocks/styles.d.ts.map +1 -1
- package/dist/jest/mocks/styles.js +13 -1
- package/dist/jest/mocks/styles.js.map +1 -1
- package/dist/portal.cjs +8 -2
- package/dist/portal.d.cts.map +1 -1
- package/dist/portal.d.ts.map +1 -1
- package/dist/portal.js +8 -2
- package/dist/portal.js.map +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Tab.d.cts","names":[],"sources":["../../../src/components/Tabs/Tab.tsx"],"mappings":";;;;;;;
|
|
1
|
+
{"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Tab.d.ts","names":[],"sources":["../../../src/components/Tabs/Tab.tsx"],"mappings":";;;;;;;
|
|
1
|
+
{"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"}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
/*! © 2026 Yahoo, Inc. UDS Mobile v0.0.0-development */
|
|
2
|
+
import { ResolvedControlFontScalingProvider } from "../../fontScaling/FontScalingContext.js";
|
|
2
3
|
import { useFontScale } from "../../fontScaling/useFontScale.js";
|
|
3
4
|
import { useMaxFontSizeMultiplier } from "../../fontScaling/useMaxFontSizeMultiplier.js";
|
|
4
5
|
import { IconSlot } from "../IconSlot.js";
|
|
@@ -25,7 +26,10 @@ function TabLabel({ style, maxFontSizeMultiplier, children }) {
|
|
|
25
26
|
maxFontSizeMultiplier,
|
|
26
27
|
children
|
|
27
28
|
});
|
|
28
|
-
return
|
|
29
|
+
return /* @__PURE__ */ jsx(ResolvedControlFontScalingProvider, {
|
|
30
|
+
maxFontSizeMultiplier,
|
|
31
|
+
children
|
|
32
|
+
});
|
|
29
33
|
}
|
|
30
34
|
/**
|
|
31
35
|
* **⚙️ Tab**
|
|
@@ -1 +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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"}
|
|
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 { 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 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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"}
|
package/dist/components/Text.cjs
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
/*! © 2026 Yahoo, Inc. UDS Mobile v0.0.0-development */
|
|
2
2
|
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
3
|
require("../_virtual/_rolldown/runtime.cjs");
|
|
4
|
+
const require_fontScaling_constants = require("../fontScaling/constants.cjs");
|
|
4
5
|
const require_fontScaling_useMaxFontSizeMultiplier = require("../fontScaling/useMaxFontSizeMultiplier.cjs");
|
|
5
6
|
let react = require("react");
|
|
6
7
|
let react_native = require("react-native");
|
|
@@ -55,6 +56,8 @@ const Text = (0, react.memo)(function Text({ color = "primary", variant = "body1
|
|
|
55
56
|
const resolvedFontSize = fontSize ?? resolvedVariant;
|
|
56
57
|
const resolvedLineHeight = lineHeight === "none" ? void 0 : lineHeight ?? (hasCJKContent(children) ? void 0 : resolvedVariant);
|
|
57
58
|
const resolvedLetterSpacing = letterSpacing ?? resolvedVariant;
|
|
59
|
+
const baseVariant = resolvedVariant?.split("/")[0];
|
|
60
|
+
const defaultDynamicTypeRamp = baseVariant ? require_fontScaling_constants.DEFAULT_DYNAMIC_TYPE_RAMPS[baseVariant] : void 0;
|
|
58
61
|
const resolvedMaxFontSizeMultiplier = require_fontScaling_useMaxFontSizeMultiplier.useMaxFontSizeMultiplier(resolvedVariant, maxFontSizeMultiplier);
|
|
59
62
|
generated_styles.styles.useVariants({
|
|
60
63
|
color: resolvedColor,
|
|
@@ -127,6 +130,7 @@ const Text = (0, react.memo)(function Text({ color = "primary", variant = "body1
|
|
|
127
130
|
generated_styles.styles.foundation
|
|
128
131
|
]),
|
|
129
132
|
maxFontSizeMultiplier: resolvedMaxFontSizeMultiplier,
|
|
133
|
+
dynamicTypeRamp: defaultDynamicTypeRamp,
|
|
130
134
|
...props,
|
|
131
135
|
children
|
|
132
136
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Text.d.cts","names":[],"sources":["../../src/components/Text.tsx"],"mappings":";;;;;;;
|
|
1
|
+
{"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Text.d.ts","names":[],"sources":["../../src/components/Text.tsx"],"mappings":";;;;;;;
|
|
1
|
+
{"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"}
|
package/dist/components/Text.js
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
/*! © 2026 Yahoo, Inc. UDS Mobile v0.0.0-development */
|
|
2
|
+
import { DEFAULT_DYNAMIC_TYPE_RAMPS } from "../fontScaling/constants.js";
|
|
2
3
|
import { useMaxFontSizeMultiplier } from "../fontScaling/useMaxFontSizeMultiplier.js";
|
|
3
4
|
import { memo, useMemo } from "react";
|
|
4
5
|
import { Text as Text$1 } from "react-native";
|
|
@@ -53,6 +54,8 @@ const Text = memo(function Text({ color = "primary", variant = "body1", fontFami
|
|
|
53
54
|
const resolvedFontSize = fontSize ?? resolvedVariant;
|
|
54
55
|
const resolvedLineHeight = lineHeight === "none" ? void 0 : lineHeight ?? (hasCJKContent(children) ? void 0 : resolvedVariant);
|
|
55
56
|
const resolvedLetterSpacing = letterSpacing ?? resolvedVariant;
|
|
57
|
+
const baseVariant = resolvedVariant?.split("/")[0];
|
|
58
|
+
const defaultDynamicTypeRamp = baseVariant ? DEFAULT_DYNAMIC_TYPE_RAMPS[baseVariant] : void 0;
|
|
56
59
|
const resolvedMaxFontSizeMultiplier = useMaxFontSizeMultiplier(resolvedVariant, maxFontSizeMultiplier);
|
|
57
60
|
styles.useVariants({
|
|
58
61
|
color: resolvedColor,
|
|
@@ -125,6 +128,7 @@ const Text = memo(function Text({ color = "primary", variant = "body1", fontFami
|
|
|
125
128
|
styles.foundation
|
|
126
129
|
]),
|
|
127
130
|
maxFontSizeMultiplier: resolvedMaxFontSizeMultiplier,
|
|
131
|
+
dynamicTypeRamp: defaultDynamicTypeRamp,
|
|
128
132
|
...props,
|
|
129
133
|
children
|
|
130
134
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Text.js","names":["RNText"],"sources":["../../src/components/Text.tsx"],"sourcesContent":["import type { ReactNode, Ref } from 'react';\nimport { memo, useMemo } from 'react';\nimport type { StyleProp, TextProps as RNTextProps, TextStyle } from 'react-native';\nimport { Text as RNText } from 'react-native';\n\nimport type { StyleProps } from '../../generated/styles';\nimport { styles } from '../../generated/styles';\nimport { useMaxFontSizeMultiplier } from '../fontScaling/useMaxFontSizeMultiplier';\n\n// TextVariant is a subset of fontFamily that represents typography variants\ntype TextVariant = Exclude<\n NonNullable<StyleProps['fontFamily']>,\n 'sans' | 'sans-alt' | 'serif' | 'serif-alt' | 'mono' | 'icons'\n>;\ntype TextVariantProp = TextVariant | 'inherit';\n\n// React Native text decoration line values\n// See: https://reactnative.dev/docs/text-style-props#textdecorationline\ntype TextDecorationLine = 'none' | 'underline' | 'line-through' | 'underline line-through';\n\n// Chinese/Japanese/Korean scripts: Hangul Jamo, CJK radicals + punctuation,\n// Kana, Han ideographs, Hangul syllables, compatibility ideographs, and\n// full/half-width forms.\nconst CJK_RE =\n /[\\u1100-\\u11FF\\u2E80-\\u303F\\u3040-\\u30FF\\u31C0-\\u9FFF\\uAC00-\\uD7AF\\uF900-\\uFAFF\\uFF00-\\uFFEF]/;\n\n/**\n * Detects CJK characters in string children (including strings inside a\n * children array, e.g. from `{city}` interpolation). Nested elements are not\n * inspected - a nested <Text> runs its own detection.\n */\nfunction hasCJKContent(children: ReactNode): boolean {\n if (typeof children === 'string') {\n return CJK_RE.test(children);\n }\n if (Array.isArray(children)) {\n return children.some((child) => typeof child === 'string' && CJK_RE.test(child));\n }\n return false;\n}\n\ninterface TextProps extends RNTextProps {\n /** Ref to the underlying Text element */\n ref?: Ref<RNText>;\n /** Text color from the theme palette */\n color?: StyleProps['color'] | 'inherit';\n /** Typography variant - sets fontSize, lineHeight, letterSpacing, and fontFamily together */\n variant?: TextVariantProp;\n /**\n * Caps how far this text grows with the OS text-size setting. Every text\n * variant is capped at 2x or below by default, with the largest display and\n * title variants tapering further (see DEFAULT_MAX_FONT_SIZE_MULTIPLIERS).\n * Set null to remove the cap (maps to React Native's 0, which also overrides\n * an inherited cap); inherit-variant text inherits its parent's cap.\n * Override app-wide via UDSFontScalingProvider.\n */\n maxFontSizeMultiplier?: number | null;\n /** Override the fontFamily independently */\n fontFamily?: StyleProps['fontFamily'];\n /** Override the fontSize independently */\n fontSize?: StyleProps['fontSize'];\n /** Set font weight (not derived from variant) */\n fontWeight?: StyleProps['fontWeight'];\n /** Override the lineHeight independently. Use 'none' to remove the variant lineHeight and let the font's natural line height apply */\n lineHeight?: StyleProps['lineHeight'] | 'none';\n /** Override the letterSpacing independently */\n letterSpacing?: StyleProps['letterSpacing'];\n /** Text alignment (left, center, right) */\n textAlign?: StyleProps['textAlign'];\n /** Set text transform (not derived from variant) */\n textTransform?: StyleProps['textTransform'];\n /** Text decoration (underline, line-through, etc.) */\n textDecorationLine?: TextDecorationLine;\n // Background\n backgroundColor?: StyleProps['backgroundColor'];\n // Border\n borderRadius?: StyleProps['borderRadius'];\n borderTopStartRadius?: StyleProps['borderTopStartRadius'];\n borderTopEndRadius?: StyleProps['borderTopEndRadius'];\n borderBottomStartRadius?: StyleProps['borderBottomStartRadius'];\n borderBottomEndRadius?: StyleProps['borderBottomEndRadius'];\n borderColor?: StyleProps['borderColor'];\n borderStartColor?: StyleProps['borderStartColor'];\n borderEndColor?: StyleProps['borderEndColor'];\n borderTopColor?: StyleProps['borderTopColor'];\n borderBottomColor?: StyleProps['borderBottomColor'];\n borderWidth?: StyleProps['borderWidth'];\n borderVerticalWidth?: StyleProps['borderVerticalWidth'];\n borderHorizontalWidth?: StyleProps['borderHorizontalWidth'];\n borderStartWidth?: StyleProps['borderStartWidth'];\n borderEndWidth?: StyleProps['borderEndWidth'];\n borderTopWidth?: StyleProps['borderTopWidth'];\n borderBottomWidth?: StyleProps['borderBottomWidth'];\n // Spacing\n spacing?: StyleProps['spacing'];\n spacingHorizontal?: StyleProps['spacingHorizontal'];\n spacingVertical?: StyleProps['spacingVertical'];\n spacingBottom?: StyleProps['spacingBottom'];\n spacingEnd?: StyleProps['spacingEnd'];\n spacingStart?: StyleProps['spacingStart'];\n spacingTop?: StyleProps['spacingTop'];\n // Offset\n offset?: StyleProps['offset'];\n offsetVertical?: StyleProps['offsetVertical'];\n offsetHorizontal?: StyleProps['offsetHorizontal'];\n offsetBottom?: StyleProps['offsetBottom'];\n offsetEnd?: StyleProps['offsetEnd'];\n offsetStart?: StyleProps['offsetStart'];\n offsetTop?: StyleProps['offsetTop'];\n // Flex\n flexShrink?: StyleProps['flexShrink'];\n // Vertical Alignment\n verticalAlign?: TextStyle['textAlignVertical'];\n // Size\n height?: number | `${number}%`;\n width?: number | `${number}%`;\n minHeight?: number | `${number}%`;\n maxHeight?: number | `${number}%`;\n minWidth?: number | `${number}%`;\n maxWidth?: number | `${number}%`;\n // Dangerously set props\n dangerouslySetColor?: string;\n}\n\n/**\n * **📝 A text component with UDS styling**\n *\n * @description\n * A styled text component that supports UDS typography variants and colors.\n *\n * @category Display\n * @platform mobile\n *\n * @example\n * ```tsx\n * import { Text } from '@yahoo/uds-mobile/Text';\n *\n * <Text variant=\"body1\" color=\"primary\">Hello, World!</Text>\n * <Text variant=\"display1\" fontWeight=\"bold\">Heading</Text>\n * <Text variant=\"label1\" color=\"secondary\">Caption text</Text>\n * ```\n *\n * @usage\n * - Use variant prop to set typography (display1, body1, label1, etc.)\n * - Use color prop to set text color from the palette\n * - Use fontWeight to override the variant's default weight\n *\n * @accessibility\n * - Text is readable by screen readers by default\n * - Use appropriate variant sizes for readability\n * - Ensure sufficient color contrast with background\n *\n * @see {@link Link} for interactive text links\n */\nconst Text = memo(function Text({\n // Text-specific\n color = 'primary',\n variant = 'body1',\n fontFamily,\n fontSize,\n fontWeight,\n lineHeight,\n letterSpacing,\n maxFontSizeMultiplier,\n textAlign,\n textTransform,\n textDecorationLine,\n style,\n // Background\n backgroundColor,\n // Border\n borderRadius,\n borderTopStartRadius,\n borderTopEndRadius,\n borderBottomStartRadius,\n borderBottomEndRadius,\n borderColor,\n borderStartColor,\n borderEndColor,\n borderTopColor,\n borderBottomColor,\n borderWidth,\n borderVerticalWidth,\n borderHorizontalWidth,\n borderStartWidth,\n borderEndWidth,\n borderTopWidth,\n borderBottomWidth,\n // Spacing\n spacing,\n spacingHorizontal,\n spacingVertical,\n spacingBottom,\n spacingEnd,\n spacingStart,\n spacingTop,\n // Offset\n offset,\n offsetVertical,\n offsetHorizontal,\n offsetBottom,\n offsetEnd,\n offsetStart,\n offsetTop,\n // Flex\n flexShrink,\n // Vertical Alignment\n verticalAlign,\n // Size\n height,\n minHeight,\n maxHeight,\n width,\n minWidth,\n maxWidth,\n // Dangerously set props\n dangerouslySetColor,\n ref,\n children,\n // Rest\n ...props\n}: TextProps) {\n const resolvedColor = color === 'inherit' ? undefined : color;\n const resolvedVariant = variant === 'inherit' ? undefined : variant;\n const resolvedFontFamily = fontFamily ?? resolvedVariant;\n const resolvedFontSize = fontSize ?? resolvedVariant;\n // React Native clips glyphs when lineHeight is smaller than the font's\n // natural line box. CJK fallback fonts are ~1.4x taller than Latin ones, so\n // Latin-tuned variant lineHeights clip CJK text - drop the variant lineHeight\n // for CJK content so the line grows to fit.\n const resolvedLineHeight =\n lineHeight === 'none'\n ? undefined\n : (lineHeight ?? (hasCJKContent(children) ? undefined : resolvedVariant));\n const resolvedLetterSpacing = letterSpacing ?? resolvedVariant;\n // Explicit prop wins, including explicit null (?? would swallow it).\n const resolvedMaxFontSizeMultiplier = useMaxFontSizeMultiplier(\n resolvedVariant,\n maxFontSizeMultiplier,\n );\n\n styles.useVariants({\n // Text styles\n color: resolvedColor,\n fontFamily: resolvedFontFamily,\n fontSize: resolvedFontSize,\n fontWeight,\n lineHeight: resolvedLineHeight,\n letterSpacing: resolvedLetterSpacing,\n textAlign,\n textTransform,\n // Background\n backgroundColor,\n // Border\n borderRadius,\n borderTopStartRadius,\n borderTopEndRadius,\n borderBottomStartRadius,\n borderBottomEndRadius,\n borderColor,\n borderStartColor,\n borderEndColor,\n borderTopColor,\n borderBottomColor,\n borderWidth,\n borderVerticalWidth,\n borderHorizontalWidth,\n borderStartWidth,\n borderEndWidth,\n borderTopWidth,\n borderBottomWidth,\n // Spacing\n spacing,\n spacingHorizontal,\n spacingVertical,\n spacingBottom,\n spacingEnd,\n spacingStart,\n spacingTop,\n // Offset\n offset,\n offsetVertical,\n offsetHorizontal,\n offsetBottom,\n offsetEnd,\n offsetStart,\n offsetTop,\n // Flex\n flexShrink,\n });\n\n // styles.foundation must be in deps - it returns a new reference when variants change.\n const computedStyle: StyleProp<TextStyle> = useMemo(\n () => [\n textDecorationLine ? { textDecorationLine } : undefined,\n dangerouslySetColor ? { color: dangerouslySetColor } : undefined,\n verticalAlign ? { textAlignVertical: verticalAlign } : undefined,\n height ? { height } : undefined,\n minHeight ? { minHeight } : undefined,\n maxHeight ? { maxHeight } : undefined,\n width ? { width } : undefined,\n minWidth ? { minWidth } : undefined,\n maxWidth ? { maxWidth } : undefined,\n styles.foundation,\n style,\n ],\n [\n textDecorationLine,\n dangerouslySetColor,\n verticalAlign,\n height,\n minHeight,\n maxHeight,\n width,\n minWidth,\n maxWidth,\n style,\n styles.foundation,\n ],\n );\n\n return (\n <RNText\n ref={ref}\n style={computedStyle}\n maxFontSizeMultiplier={resolvedMaxFontSizeMultiplier}\n {...props}\n >\n {children}\n </RNText>\n );\n});\n\nText.displayName = 'Text';\n\nexport { Text, type TextProps, type TextVariant };\n"],"mappings":";;;;;;;AAuBA,MAAM,SACJ;;;;;;AAOF,SAAS,cAAc,UAA8B;CACnD,IAAI,OAAO,aAAa,UACtB,OAAO,OAAO,KAAK,SAAS;CAE9B,IAAI,MAAM,QAAQ,SAAS,EACzB,OAAO,SAAS,MAAM,UAAU,OAAO,UAAU,YAAY,OAAO,KAAK,MAAM,CAAC;CAElF,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoHT,MAAM,OAAO,KAAK,SAAS,KAAK,EAE9B,QAAQ,WACR,UAAU,SACV,YACA,UACA,YACA,YACA,eACA,uBACA,WACA,eACA,oBACA,OAEA,iBAEA,cACA,sBACA,oBACA,yBACA,uBACA,aACA,kBACA,gBACA,gBACA,mBACA,aACA,qBACA,uBACA,kBACA,gBACA,gBACA,mBAEA,SACA,mBACA,iBACA,eACA,YACA,cACA,YAEA,QACA,gBACA,kBACA,cACA,WACA,aACA,WAEA,YAEA,eAEA,QACA,WACA,WACA,OACA,UACA,UAEA,qBACA,KACA,UAEA,GAAG,SACS;CACZ,MAAM,gBAAgB,UAAU,YAAY,KAAA,IAAY;CACxD,MAAM,kBAAkB,YAAY,YAAY,KAAA,IAAY;CAC5D,MAAM,qBAAqB,cAAc;CACzC,MAAM,mBAAmB,YAAY;CAKrC,MAAM,qBACJ,eAAe,SACX,KAAA,IACC,eAAe,cAAc,SAAS,GAAG,KAAA,IAAY;CAC5D,MAAM,wBAAwB,iBAAiB;CAE/C,MAAM,gCAAgC,yBACpC,iBACA,sBACD;CAED,OAAO,YAAY;EAEjB,OAAO;EACP,YAAY;EACZ,UAAU;EACV;EACA,YAAY;EACZ,eAAe;EACf;EACA;EAEA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACD,CAAC;CAgCF,OACE,oBAACA,QAAD;EACO;EACL,OAhCwC,cACpC;GACJ,qBAAqB,EAAE,oBAAoB,GAAG,KAAA;GAC9C,sBAAsB,EAAE,OAAO,qBAAqB,GAAG,KAAA;GACvD,gBAAgB,EAAE,mBAAmB,eAAe,GAAG,KAAA;GACvD,SAAS,EAAE,QAAQ,GAAG,KAAA;GACtB,YAAY,EAAE,WAAW,GAAG,KAAA;GAC5B,YAAY,EAAE,WAAW,GAAG,KAAA;GAC5B,QAAQ,EAAE,OAAO,GAAG,KAAA;GACpB,WAAW,EAAE,UAAU,GAAG,KAAA;GAC1B,WAAW,EAAE,UAAU,GAAG,KAAA;GAC1B,OAAO;GACP;GACD,EACD;GACE;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA,OAAO;GACR,CAMqB;EACpB,uBAAuB;EACvB,GAAI;EAEH;EACM,CAAA;EAEX;AAEF,KAAK,cAAc"}
|
|
1
|
+
{"version":3,"file":"Text.js","names":["RNText"],"sources":["../../src/components/Text.tsx"],"sourcesContent":["import type { ReactNode, Ref } from 'react';\nimport { memo, useMemo } from 'react';\nimport type { StyleProp, TextProps as RNTextProps, TextStyle } from 'react-native';\nimport { Text as RNText } from 'react-native';\n\nimport type { StyleProps } from '../../generated/styles';\nimport { styles } from '../../generated/styles';\nimport { DEFAULT_DYNAMIC_TYPE_RAMPS } from '../fontScaling/constants';\nimport { useMaxFontSizeMultiplier } from '../fontScaling/useMaxFontSizeMultiplier';\n\n// TextVariant is a subset of fontFamily that represents typography variants\ntype TextVariant = Exclude<\n NonNullable<StyleProps['fontFamily']>,\n 'sans' | 'sans-alt' | 'serif' | 'serif-alt' | 'mono' | 'icons'\n>;\ntype TextVariantProp = TextVariant | 'inherit';\n\n// React Native text decoration line values\n// See: https://reactnative.dev/docs/text-style-props#textdecorationline\ntype TextDecorationLine = 'none' | 'underline' | 'line-through' | 'underline line-through';\n\n// Chinese/Japanese/Korean scripts: Hangul Jamo, CJK radicals + punctuation,\n// Kana, Han ideographs, Hangul syllables, compatibility ideographs, and\n// full/half-width forms.\nconst CJK_RE =\n /[\\u1100-\\u11FF\\u2E80-\\u303F\\u3040-\\u30FF\\u31C0-\\u9FFF\\uAC00-\\uD7AF\\uF900-\\uFAFF\\uFF00-\\uFFEF]/;\n\n/**\n * Detects CJK characters in string children (including strings inside a\n * children array, e.g. from `{city}` interpolation). Nested elements are not\n * inspected - a nested <Text> runs its own detection.\n */\nfunction hasCJKContent(children: ReactNode): boolean {\n if (typeof children === 'string') {\n return CJK_RE.test(children);\n }\n if (Array.isArray(children)) {\n return children.some((child) => typeof child === 'string' && CJK_RE.test(child));\n }\n return false;\n}\n\ninterface TextProps extends RNTextProps {\n /** Ref to the underlying Text element */\n ref?: Ref<RNText>;\n /** Text color from the theme palette */\n color?: StyleProps['color'] | 'inherit';\n /** Typography variant - sets fontSize, lineHeight, letterSpacing, and fontFamily together */\n variant?: TextVariantProp;\n /**\n * Caps how far this text grows with the OS text-size setting. Every text\n * variant is capped at 2x or below by default, with the largest display and\n * title variants tapering further (see DEFAULT_MAX_FONT_SIZE_MULTIPLIERS).\n * Set null to remove the cap (maps to React Native's 0, which also overrides\n * an inherited cap); inherit-variant text inherits its parent's cap.\n * Override app-wide via UDSFontScalingProvider.\n */\n maxFontSizeMultiplier?: number | null;\n /** Override the fontFamily independently */\n fontFamily?: StyleProps['fontFamily'];\n /** Override the fontSize independently */\n fontSize?: StyleProps['fontSize'];\n /** Set font weight (not derived from variant) */\n fontWeight?: StyleProps['fontWeight'];\n /** Override the lineHeight independently. Use 'none' to remove the variant lineHeight and let the font's natural line height apply */\n lineHeight?: StyleProps['lineHeight'] | 'none';\n /** Override the letterSpacing independently */\n letterSpacing?: StyleProps['letterSpacing'];\n /** Text alignment (left, center, right) */\n textAlign?: StyleProps['textAlign'];\n /** Set text transform (not derived from variant) */\n textTransform?: StyleProps['textTransform'];\n /** Text decoration (underline, line-through, etc.) */\n textDecorationLine?: TextDecorationLine;\n // Background\n backgroundColor?: StyleProps['backgroundColor'];\n // Border\n borderRadius?: StyleProps['borderRadius'];\n borderTopStartRadius?: StyleProps['borderTopStartRadius'];\n borderTopEndRadius?: StyleProps['borderTopEndRadius'];\n borderBottomStartRadius?: StyleProps['borderBottomStartRadius'];\n borderBottomEndRadius?: StyleProps['borderBottomEndRadius'];\n borderColor?: StyleProps['borderColor'];\n borderStartColor?: StyleProps['borderStartColor'];\n borderEndColor?: StyleProps['borderEndColor'];\n borderTopColor?: StyleProps['borderTopColor'];\n borderBottomColor?: StyleProps['borderBottomColor'];\n borderWidth?: StyleProps['borderWidth'];\n borderVerticalWidth?: StyleProps['borderVerticalWidth'];\n borderHorizontalWidth?: StyleProps['borderHorizontalWidth'];\n borderStartWidth?: StyleProps['borderStartWidth'];\n borderEndWidth?: StyleProps['borderEndWidth'];\n borderTopWidth?: StyleProps['borderTopWidth'];\n borderBottomWidth?: StyleProps['borderBottomWidth'];\n // Spacing\n spacing?: StyleProps['spacing'];\n spacingHorizontal?: StyleProps['spacingHorizontal'];\n spacingVertical?: StyleProps['spacingVertical'];\n spacingBottom?: StyleProps['spacingBottom'];\n spacingEnd?: StyleProps['spacingEnd'];\n spacingStart?: StyleProps['spacingStart'];\n spacingTop?: StyleProps['spacingTop'];\n // Offset\n offset?: StyleProps['offset'];\n offsetVertical?: StyleProps['offsetVertical'];\n offsetHorizontal?: StyleProps['offsetHorizontal'];\n offsetBottom?: StyleProps['offsetBottom'];\n offsetEnd?: StyleProps['offsetEnd'];\n offsetStart?: StyleProps['offsetStart'];\n offsetTop?: StyleProps['offsetTop'];\n // Flex\n flexShrink?: StyleProps['flexShrink'];\n // Vertical Alignment\n verticalAlign?: TextStyle['textAlignVertical'];\n // Size\n height?: number | `${number}%`;\n width?: number | `${number}%`;\n minHeight?: number | `${number}%`;\n maxHeight?: number | `${number}%`;\n minWidth?: number | `${number}%`;\n maxWidth?: number | `${number}%`;\n // Dangerously set props\n dangerouslySetColor?: string;\n}\n\n/**\n * **📝 A text component with UDS styling**\n *\n * @description\n * A styled text component that supports UDS typography variants and colors.\n *\n * @category Display\n * @platform mobile\n *\n * @example\n * ```tsx\n * import { Text } from '@yahoo/uds-mobile/Text';\n *\n * <Text variant=\"body1\" color=\"primary\">Hello, World!</Text>\n * <Text variant=\"display1\" fontWeight=\"bold\">Heading</Text>\n * <Text variant=\"label1\" color=\"secondary\">Caption text</Text>\n * ```\n *\n * @usage\n * - Use variant prop to set typography (display1, body1, label1, etc.)\n * - Use color prop to set text color from the palette\n * - Use fontWeight to override the variant's default weight\n *\n * @accessibility\n * - Text is readable by screen readers by default\n * - Use appropriate variant sizes for readability\n * - Ensure sufficient color contrast with background\n *\n * @see {@link Link} for interactive text links\n */\nconst Text = memo(function Text({\n // Text-specific\n color = 'primary',\n variant = 'body1',\n fontFamily,\n fontSize,\n fontWeight,\n lineHeight,\n letterSpacing,\n maxFontSizeMultiplier,\n textAlign,\n textTransform,\n textDecorationLine,\n style,\n // Background\n backgroundColor,\n // Border\n borderRadius,\n borderTopStartRadius,\n borderTopEndRadius,\n borderBottomStartRadius,\n borderBottomEndRadius,\n borderColor,\n borderStartColor,\n borderEndColor,\n borderTopColor,\n borderBottomColor,\n borderWidth,\n borderVerticalWidth,\n borderHorizontalWidth,\n borderStartWidth,\n borderEndWidth,\n borderTopWidth,\n borderBottomWidth,\n // Spacing\n spacing,\n spacingHorizontal,\n spacingVertical,\n spacingBottom,\n spacingEnd,\n spacingStart,\n spacingTop,\n // Offset\n offset,\n offsetVertical,\n offsetHorizontal,\n offsetBottom,\n offsetEnd,\n offsetStart,\n offsetTop,\n // Flex\n flexShrink,\n // Vertical Alignment\n verticalAlign,\n // Size\n height,\n minHeight,\n maxHeight,\n width,\n minWidth,\n maxWidth,\n // Dangerously set props\n dangerouslySetColor,\n ref,\n children,\n // Rest\n ...props\n}: TextProps) {\n const resolvedColor = color === 'inherit' ? undefined : color;\n const resolvedVariant = variant === 'inherit' ? undefined : variant;\n const resolvedFontFamily = fontFamily ?? resolvedVariant;\n const resolvedFontSize = fontSize ?? resolvedVariant;\n // React Native clips glyphs when lineHeight is smaller than the font's\n // natural line box. CJK fallback fonts are ~1.4x taller than Latin ones, so\n // Latin-tuned variant lineHeights clip CJK text - drop the variant lineHeight\n // for CJK content so the line grows to fit.\n const resolvedLineHeight =\n lineHeight === 'none'\n ? undefined\n : (lineHeight ?? (hasCJKContent(children) ? undefined : resolvedVariant));\n const resolvedLetterSpacing = letterSpacing ?? resolvedVariant;\n const baseVariant = resolvedVariant?.split('/')[0] as TextVariant | undefined;\n const defaultDynamicTypeRamp = baseVariant ? DEFAULT_DYNAMIC_TYPE_RAMPS[baseVariant] : undefined;\n // Explicit prop wins, including explicit null (?? would swallow it).\n const resolvedMaxFontSizeMultiplier = useMaxFontSizeMultiplier(\n resolvedVariant,\n maxFontSizeMultiplier,\n );\n\n styles.useVariants({\n // Text styles\n color: resolvedColor,\n fontFamily: resolvedFontFamily,\n fontSize: resolvedFontSize,\n fontWeight,\n lineHeight: resolvedLineHeight,\n letterSpacing: resolvedLetterSpacing,\n textAlign,\n textTransform,\n // Background\n backgroundColor,\n // Border\n borderRadius,\n borderTopStartRadius,\n borderTopEndRadius,\n borderBottomStartRadius,\n borderBottomEndRadius,\n borderColor,\n borderStartColor,\n borderEndColor,\n borderTopColor,\n borderBottomColor,\n borderWidth,\n borderVerticalWidth,\n borderHorizontalWidth,\n borderStartWidth,\n borderEndWidth,\n borderTopWidth,\n borderBottomWidth,\n // Spacing\n spacing,\n spacingHorizontal,\n spacingVertical,\n spacingBottom,\n spacingEnd,\n spacingStart,\n spacingTop,\n // Offset\n offset,\n offsetVertical,\n offsetHorizontal,\n offsetBottom,\n offsetEnd,\n offsetStart,\n offsetTop,\n // Flex\n flexShrink,\n });\n\n // styles.foundation must be in deps - it returns a new reference when variants change.\n const computedStyle: StyleProp<TextStyle> = useMemo(\n () => [\n textDecorationLine ? { textDecorationLine } : undefined,\n dangerouslySetColor ? { color: dangerouslySetColor } : undefined,\n verticalAlign ? { textAlignVertical: verticalAlign } : undefined,\n height ? { height } : undefined,\n minHeight ? { minHeight } : undefined,\n maxHeight ? { maxHeight } : undefined,\n width ? { width } : undefined,\n minWidth ? { minWidth } : undefined,\n maxWidth ? { maxWidth } : undefined,\n styles.foundation,\n style,\n ],\n [\n textDecorationLine,\n dangerouslySetColor,\n verticalAlign,\n height,\n minHeight,\n maxHeight,\n width,\n minWidth,\n maxWidth,\n style,\n styles.foundation,\n ],\n );\n\n return (\n <RNText\n ref={ref}\n style={computedStyle}\n maxFontSizeMultiplier={resolvedMaxFontSizeMultiplier}\n dynamicTypeRamp={defaultDynamicTypeRamp}\n {...props}\n >\n {children}\n </RNText>\n );\n});\n\nText.displayName = 'Text';\n\nexport { Text, type TextProps, type TextVariant };\n"],"mappings":";;;;;;;;AAwBA,MAAM,SACJ;;;;;;AAOF,SAAS,cAAc,UAA8B;CACnD,IAAI,OAAO,aAAa,UACtB,OAAO,OAAO,KAAK,SAAS;CAE9B,IAAI,MAAM,QAAQ,SAAS,EACzB,OAAO,SAAS,MAAM,UAAU,OAAO,UAAU,YAAY,OAAO,KAAK,MAAM,CAAC;CAElF,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoHT,MAAM,OAAO,KAAK,SAAS,KAAK,EAE9B,QAAQ,WACR,UAAU,SACV,YACA,UACA,YACA,YACA,eACA,uBACA,WACA,eACA,oBACA,OAEA,iBAEA,cACA,sBACA,oBACA,yBACA,uBACA,aACA,kBACA,gBACA,gBACA,mBACA,aACA,qBACA,uBACA,kBACA,gBACA,gBACA,mBAEA,SACA,mBACA,iBACA,eACA,YACA,cACA,YAEA,QACA,gBACA,kBACA,cACA,WACA,aACA,WAEA,YAEA,eAEA,QACA,WACA,WACA,OACA,UACA,UAEA,qBACA,KACA,UAEA,GAAG,SACS;CACZ,MAAM,gBAAgB,UAAU,YAAY,KAAA,IAAY;CACxD,MAAM,kBAAkB,YAAY,YAAY,KAAA,IAAY;CAC5D,MAAM,qBAAqB,cAAc;CACzC,MAAM,mBAAmB,YAAY;CAKrC,MAAM,qBACJ,eAAe,SACX,KAAA,IACC,eAAe,cAAc,SAAS,GAAG,KAAA,IAAY;CAC5D,MAAM,wBAAwB,iBAAiB;CAC/C,MAAM,cAAc,iBAAiB,MAAM,IAAI,CAAC;CAChD,MAAM,yBAAyB,cAAc,2BAA2B,eAAe,KAAA;CAEvF,MAAM,gCAAgC,yBACpC,iBACA,sBACD;CAED,OAAO,YAAY;EAEjB,OAAO;EACP,YAAY;EACZ,UAAU;EACV;EACA,YAAY;EACZ,eAAe;EACf;EACA;EAEA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACD,CAAC;CAgCF,OACE,oBAACA,QAAD;EACO;EACL,OAhCwC,cACpC;GACJ,qBAAqB,EAAE,oBAAoB,GAAG,KAAA;GAC9C,sBAAsB,EAAE,OAAO,qBAAqB,GAAG,KAAA;GACvD,gBAAgB,EAAE,mBAAmB,eAAe,GAAG,KAAA;GACvD,SAAS,EAAE,QAAQ,GAAG,KAAA;GACtB,YAAY,EAAE,WAAW,GAAG,KAAA;GAC5B,YAAY,EAAE,WAAW,GAAG,KAAA;GAC5B,QAAQ,EAAE,OAAO,GAAG,KAAA;GACpB,WAAW,EAAE,UAAU,GAAG,KAAA;GAC1B,WAAW,EAAE,UAAU,GAAG,KAAA;GAC1B,OAAO;GACP;GACD,EACD;GACE;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA,OAAO;GACR,CAMqB;EACpB,uBAAuB;EACvB,iBAAiB;EACjB,GAAI;EAEH;EACM,CAAA;EAEX;AAEF,KAAK,cAAc"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
/*! © 2026 Yahoo, Inc. UDS Mobile v0.0.0-development */
|
|
2
2
|
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
3
|
require("../_virtual/_rolldown/runtime.cjs");
|
|
4
|
-
const require_portal = require("../portal.cjs");
|
|
5
4
|
const require_fontScaling_FontScalingContext = require("../fontScaling/FontScalingContext.cjs");
|
|
5
|
+
const require_portal = require("../portal.cjs");
|
|
6
6
|
let react = require("react");
|
|
7
7
|
let react_native = require("react-native");
|
|
8
8
|
let react_jsx_runtime = require("react/jsx-runtime");
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/*! © 2026 Yahoo, Inc. UDS Mobile v0.0.0-development */
|
|
2
|
-
import { PortalProvider } from "../portal.js";
|
|
3
2
|
import { UDSFontScalingProvider } from "../fontScaling/FontScalingContext.js";
|
|
3
|
+
import { PortalProvider } from "../portal.js";
|
|
4
4
|
import { memo } from "react";
|
|
5
5
|
import { StyleSheet } from "react-native";
|
|
6
6
|
import { jsx } from "react/jsx-runtime";
|
|
@@ -31,6 +31,20 @@ const UDSFontScalingProvider = (0, react.memo)(function UDSFontScalingProvider({
|
|
|
31
31
|
});
|
|
32
32
|
});
|
|
33
33
|
UDSFontScalingProvider.displayName = "UDSFontScalingProvider";
|
|
34
|
+
/** Keeps custom UDS content inside a control on the control's resolved cap. */
|
|
35
|
+
const ResolvedControlFontScalingProvider = (0, react.memo)(function ResolvedControlFontScalingProvider({ maxFontSizeMultiplier, children }) {
|
|
36
|
+
const cap = maxFontSizeMultiplier === 0 ? null : maxFontSizeMultiplier;
|
|
37
|
+
const config = (0, react.useMemo)(() => ({
|
|
38
|
+
default: cap,
|
|
39
|
+
control: cap
|
|
40
|
+
}), [cap]);
|
|
41
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(FontScalingContext.Provider, {
|
|
42
|
+
value: config,
|
|
43
|
+
children
|
|
44
|
+
});
|
|
45
|
+
});
|
|
46
|
+
ResolvedControlFontScalingProvider.displayName = "ResolvedControlFontScalingProvider";
|
|
34
47
|
//#endregion
|
|
35
48
|
exports.FontScalingContext = FontScalingContext;
|
|
49
|
+
exports.ResolvedControlFontScalingProvider = ResolvedControlFontScalingProvider;
|
|
36
50
|
exports.UDSFontScalingProvider = UDSFontScalingProvider;
|
|
@@ -34,6 +34,12 @@ interface UDSFontScalingProviderProps {
|
|
|
34
34
|
* ```
|
|
35
35
|
*/
|
|
36
36
|
declare const UDSFontScalingProvider: _$react.NamedExoticComponent<UDSFontScalingProviderProps>;
|
|
37
|
+
interface ResolvedControlFontScalingProviderProps {
|
|
38
|
+
maxFontSizeMultiplier: number;
|
|
39
|
+
children: ReactNode;
|
|
40
|
+
}
|
|
41
|
+
/** Keeps custom UDS content inside a control on the control's resolved cap. */
|
|
42
|
+
declare const ResolvedControlFontScalingProvider: _$react.NamedExoticComponent<ResolvedControlFontScalingProviderProps>;
|
|
37
43
|
//#endregion
|
|
38
|
-
export { FontScalingContext, UDSFontScalingProvider, type UDSFontScalingProviderProps };
|
|
44
|
+
export { FontScalingContext, ResolvedControlFontScalingProvider, UDSFontScalingProvider, type UDSFontScalingProviderProps };
|
|
39
45
|
//# sourceMappingURL=FontScalingContext.d.cts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FontScalingContext.d.cts","names":[],"sources":["../../src/fontScaling/FontScalingContext.tsx"],"mappings":";;;;;;cAMM,kBAAA,EAAkB,OAAA,CAAA,OAAA,CAAA,iBAAA;AAAA,UAEd,2BAAA;;AALuC;;;;EAW/C,MAAA,EAAQ,iBAAA;EACR,QAAA,EAAU,SAAA;AAAA;;;;;;;;;AAAS
|
|
1
|
+
{"version":3,"file":"FontScalingContext.d.cts","names":[],"sources":["../../src/fontScaling/FontScalingContext.tsx"],"mappings":";;;;;;cAMM,kBAAA,EAAkB,OAAA,CAAA,OAAA,CAAA,iBAAA;AAAA,UAEd,2BAAA;;AALuC;;;;EAW/C,MAAA,EAAQ,iBAAA;EACR,QAAA,EAAU,SAAA;AAAA;;;;;;;;;AAAS;;;;;AAsBO;;;;;;cAAtB,sBAAA,EAAsB,OAAA,CAAA,oBAAA,CAAA,2BAAA;AAAA,UASlB,uCAAA;EACR,qBAAA;EACA,QAAA,EAAU,SAAA;AAAA;;cAIN,kCAAA,EAAkC,OAAA,CAAA,oBAAA,CAAA,uCAAA"}
|
|
@@ -34,6 +34,12 @@ interface UDSFontScalingProviderProps {
|
|
|
34
34
|
* ```
|
|
35
35
|
*/
|
|
36
36
|
declare const UDSFontScalingProvider: _$react.NamedExoticComponent<UDSFontScalingProviderProps>;
|
|
37
|
+
interface ResolvedControlFontScalingProviderProps {
|
|
38
|
+
maxFontSizeMultiplier: number;
|
|
39
|
+
children: ReactNode;
|
|
40
|
+
}
|
|
41
|
+
/** Keeps custom UDS content inside a control on the control's resolved cap. */
|
|
42
|
+
declare const ResolvedControlFontScalingProvider: _$react.NamedExoticComponent<ResolvedControlFontScalingProviderProps>;
|
|
37
43
|
//#endregion
|
|
38
|
-
export { FontScalingContext, UDSFontScalingProvider, type UDSFontScalingProviderProps };
|
|
44
|
+
export { FontScalingContext, ResolvedControlFontScalingProvider, UDSFontScalingProvider, type UDSFontScalingProviderProps };
|
|
39
45
|
//# sourceMappingURL=FontScalingContext.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FontScalingContext.d.ts","names":[],"sources":["../../src/fontScaling/FontScalingContext.tsx"],"mappings":";;;;;;cAMM,kBAAA,EAAkB,OAAA,CAAA,OAAA,CAAA,iBAAA;AAAA,UAEd,2BAAA;;AALuC;;;;EAW/C,MAAA,EAAQ,iBAAA;EACR,QAAA,EAAU,SAAA;AAAA;;;;;;;;;AAAS
|
|
1
|
+
{"version":3,"file":"FontScalingContext.d.ts","names":[],"sources":["../../src/fontScaling/FontScalingContext.tsx"],"mappings":";;;;;;cAMM,kBAAA,EAAkB,OAAA,CAAA,OAAA,CAAA,iBAAA;AAAA,UAEd,2BAAA;;AALuC;;;;EAW/C,MAAA,EAAQ,iBAAA;EACR,QAAA,EAAU,SAAA;AAAA;;;;;;;;;AAAS;;;;;AAsBO;;;;;;cAAtB,sBAAA,EAAsB,OAAA,CAAA,oBAAA,CAAA,2BAAA;AAAA,UASlB,uCAAA;EACR,qBAAA;EACA,QAAA,EAAU,SAAA;AAAA;;cAIN,kCAAA,EAAkC,OAAA,CAAA,oBAAA,CAAA,uCAAA"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/*! © 2026 Yahoo, Inc. UDS Mobile v0.0.0-development */
|
|
2
|
-
import { createContext, memo } from "react";
|
|
2
|
+
import { createContext, memo, useMemo } from "react";
|
|
3
3
|
import { jsx } from "react/jsx-runtime";
|
|
4
4
|
//#region src/fontScaling/FontScalingContext.tsx
|
|
5
5
|
const FontScalingContext = createContext(void 0);
|
|
@@ -29,7 +29,20 @@ const UDSFontScalingProvider = memo(function UDSFontScalingProvider({ config, ch
|
|
|
29
29
|
});
|
|
30
30
|
});
|
|
31
31
|
UDSFontScalingProvider.displayName = "UDSFontScalingProvider";
|
|
32
|
+
/** Keeps custom UDS content inside a control on the control's resolved cap. */
|
|
33
|
+
const ResolvedControlFontScalingProvider = memo(function ResolvedControlFontScalingProvider({ maxFontSizeMultiplier, children }) {
|
|
34
|
+
const cap = maxFontSizeMultiplier === 0 ? null : maxFontSizeMultiplier;
|
|
35
|
+
const config = useMemo(() => ({
|
|
36
|
+
default: cap,
|
|
37
|
+
control: cap
|
|
38
|
+
}), [cap]);
|
|
39
|
+
return /* @__PURE__ */ jsx(FontScalingContext.Provider, {
|
|
40
|
+
value: config,
|
|
41
|
+
children
|
|
42
|
+
});
|
|
43
|
+
});
|
|
44
|
+
ResolvedControlFontScalingProvider.displayName = "ResolvedControlFontScalingProvider";
|
|
32
45
|
//#endregion
|
|
33
|
-
export { FontScalingContext, UDSFontScalingProvider };
|
|
46
|
+
export { FontScalingContext, ResolvedControlFontScalingProvider, UDSFontScalingProvider };
|
|
34
47
|
|
|
35
48
|
//# sourceMappingURL=FontScalingContext.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FontScalingContext.js","names":[],"sources":["../../src/fontScaling/FontScalingContext.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport { createContext, memo } from 'react';\n\nimport type { FontScalingConfig } from './types';\n\n// undefined = no provider mounted; built-in defaults apply.\nconst FontScalingContext = createContext<FontScalingConfig | undefined>(undefined);\n\ninterface UDSFontScalingProviderProps {\n /**\n * Font-scaling caps for the subtree. Should be identity-stable (a module\n * constant or memoized) — every UDS text element reads it from context.\n * The nearest provider wins wholesale; configs are not merged.\n */\n config: FontScalingConfig;\n children: ReactNode;\n}\n\n/**\n * **🔠 Overrides UDS font-scaling caps for a subtree**\n *\n * @description\n * Configures how UDS text and controls respond to the OS text-size setting.\n * Without a provider, built-in defaults apply (every text style is capped at\n * 2x or below, with the largest display/title tiers tapered further, and\n * control internals capped at 2x). Most apps set this once at the root via the\n * `fontScaling` prop on `UDSGestureProvider`.\n *\n * @example\n * ```tsx\n * const FONT_SCALING = { default: 2, variants: { display1: 1.75 } };\n *\n * <UDSFontScalingProvider config={FONT_SCALING}>\n * <App />\n * </UDSFontScalingProvider>\n * ```\n */\nconst UDSFontScalingProvider = memo(function UDSFontScalingProvider({\n config,\n children,\n}: UDSFontScalingProviderProps) {\n return <FontScalingContext.Provider value={config}>{children}</FontScalingContext.Provider>;\n});\n\nUDSFontScalingProvider.displayName = 'UDSFontScalingProvider';\n\
|
|
1
|
+
{"version":3,"file":"FontScalingContext.js","names":[],"sources":["../../src/fontScaling/FontScalingContext.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport { createContext, memo, useMemo } from 'react';\n\nimport type { FontScalingConfig } from './types';\n\n// undefined = no provider mounted; built-in defaults apply.\nconst FontScalingContext = createContext<FontScalingConfig | undefined>(undefined);\n\ninterface UDSFontScalingProviderProps {\n /**\n * Font-scaling caps for the subtree. Should be identity-stable (a module\n * constant or memoized) — every UDS text element reads it from context.\n * The nearest provider wins wholesale; configs are not merged.\n */\n config: FontScalingConfig;\n children: ReactNode;\n}\n\n/**\n * **🔠 Overrides UDS font-scaling caps for a subtree**\n *\n * @description\n * Configures how UDS text and controls respond to the OS text-size setting.\n * Without a provider, built-in defaults apply (every text style is capped at\n * 2x or below, with the largest display/title tiers tapered further, and\n * control internals capped at 2x). Most apps set this once at the root via the\n * `fontScaling` prop on `UDSGestureProvider`.\n *\n * @example\n * ```tsx\n * const FONT_SCALING = { default: 2, variants: { display1: 1.75 } };\n *\n * <UDSFontScalingProvider config={FONT_SCALING}>\n * <App />\n * </UDSFontScalingProvider>\n * ```\n */\nconst UDSFontScalingProvider = memo(function UDSFontScalingProvider({\n config,\n children,\n}: UDSFontScalingProviderProps) {\n return <FontScalingContext.Provider value={config}>{children}</FontScalingContext.Provider>;\n});\n\nUDSFontScalingProvider.displayName = 'UDSFontScalingProvider';\n\ninterface ResolvedControlFontScalingProviderProps {\n maxFontSizeMultiplier: number;\n children: ReactNode;\n}\n\n/** Keeps custom UDS content inside a control on the control's resolved cap. */\nconst ResolvedControlFontScalingProvider = memo(function ResolvedControlFontScalingProvider({\n maxFontSizeMultiplier,\n children,\n}: ResolvedControlFontScalingProviderProps) {\n const cap = maxFontSizeMultiplier === 0 ? null : maxFontSizeMultiplier;\n const config = useMemo<FontScalingConfig>(() => ({ default: cap, control: cap }), [cap]);\n\n return <FontScalingContext.Provider value={config}>{children}</FontScalingContext.Provider>;\n});\n\nResolvedControlFontScalingProvider.displayName = 'ResolvedControlFontScalingProvider';\n\nexport {\n FontScalingContext,\n ResolvedControlFontScalingProvider,\n UDSFontScalingProvider,\n type UDSFontScalingProviderProps,\n};\n"],"mappings":";;;;AAMA,MAAM,qBAAqB,cAA6C,KAAA,EAAU;;;;;;;;;;;;;;;;;;;;AA+BlF,MAAM,yBAAyB,KAAK,SAAS,uBAAuB,EAClE,QACA,YAC8B;CAC9B,OAAO,oBAAC,mBAAmB,UAApB;EAA6B,OAAO;EAAS;EAAuC,CAAA;EAC3F;AAEF,uBAAuB,cAAc;;AAQrC,MAAM,qCAAqC,KAAK,SAAS,mCAAmC,EAC1F,uBACA,YAC0C;CAC1C,MAAM,MAAM,0BAA0B,IAAI,OAAO;CACjD,MAAM,SAAS,eAAkC;EAAE,SAAS;EAAK,SAAS;EAAK,GAAG,CAAC,IAAI,CAAC;CAExF,OAAO,oBAAC,mBAAmB,UAApB;EAA6B,OAAO;EAAS;EAAuC,CAAA;EAC3F;AAEF,mCAAmC,cAAc"}
|
|
@@ -65,8 +65,41 @@ const DEFAULT_MAX_FONT_SIZE_MULTIPLIERS = Object.freeze(Object.fromEntries(Objec
|
|
|
65
65
|
* supported ceiling rather than a looser per-variant cap.
|
|
66
66
|
*/
|
|
67
67
|
const DEFAULT_CONTROL_MAX_FONT_SIZE_MULTIPLIER = 2;
|
|
68
|
+
/**
|
|
69
|
+
* iOS Dynamic Type curve used by each UDS typography tier. React Native uses
|
|
70
|
+
* the selected system text style's curve while preserving the configured UDS
|
|
71
|
+
* font size. Android ignores `dynamicTypeRamp` and continues to use its native
|
|
72
|
+
* nonlinear font scaling.
|
|
73
|
+
*
|
|
74
|
+
* Keys are base variants; `/emphasized` twins resolve to their base.
|
|
75
|
+
*/
|
|
76
|
+
const DEFAULT_DYNAMIC_TYPE_RAMPS = {
|
|
77
|
+
display1: "largeTitle",
|
|
78
|
+
display2: "largeTitle",
|
|
79
|
+
display3: "largeTitle",
|
|
80
|
+
title1: "title1",
|
|
81
|
+
title2: "title2",
|
|
82
|
+
title3: "title3",
|
|
83
|
+
title4: "title3",
|
|
84
|
+
headline1: "headline",
|
|
85
|
+
body1: "body",
|
|
86
|
+
label1: "callout",
|
|
87
|
+
label2: "subheadline",
|
|
88
|
+
label3: "footnote",
|
|
89
|
+
label4: "caption1",
|
|
90
|
+
caption1: "caption1",
|
|
91
|
+
caption2: "caption2",
|
|
92
|
+
legal1: "caption2",
|
|
93
|
+
ui1: "title3",
|
|
94
|
+
ui2: "title3",
|
|
95
|
+
ui3: "callout",
|
|
96
|
+
ui4: "subheadline",
|
|
97
|
+
ui5: "footnote",
|
|
98
|
+
ui6: "caption2"
|
|
99
|
+
};
|
|
68
100
|
//#endregion
|
|
69
101
|
exports.DEFAULT_CONTROL_MAX_FONT_SIZE_MULTIPLIER = DEFAULT_CONTROL_MAX_FONT_SIZE_MULTIPLIER;
|
|
102
|
+
exports.DEFAULT_DYNAMIC_TYPE_RAMPS = DEFAULT_DYNAMIC_TYPE_RAMPS;
|
|
70
103
|
exports.DEFAULT_MAX_FONT_SIZE_MULTIPLIERS = DEFAULT_MAX_FONT_SIZE_MULTIPLIERS;
|
|
71
104
|
exports.MAX_SUPPORTED_FONT_SCALE = MAX_SUPPORTED_FONT_SCALE;
|
|
72
105
|
exports.TYPE_SCALE_CURVE = TYPE_SCALE_CURVE;
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
|
|
2
2
|
import { TextVariant } from "../components/Text.cjs";
|
|
3
3
|
import { FontScalingCapValue } from "./types.cjs";
|
|
4
|
+
import { TextProps } from "react-native";
|
|
4
5
|
|
|
5
6
|
//#region src/fontScaling/constants.d.ts
|
|
6
7
|
/**
|
|
@@ -44,6 +45,15 @@ declare const DEFAULT_MAX_FONT_SIZE_MULTIPLIERS: Readonly<Partial<Record<TextVar
|
|
|
44
45
|
* supported ceiling rather than a looser per-variant cap.
|
|
45
46
|
*/
|
|
46
47
|
declare const DEFAULT_CONTROL_MAX_FONT_SIZE_MULTIPLIER = 2;
|
|
48
|
+
/**
|
|
49
|
+
* iOS Dynamic Type curve used by each UDS typography tier. React Native uses
|
|
50
|
+
* the selected system text style's curve while preserving the configured UDS
|
|
51
|
+
* font size. Android ignores `dynamicTypeRamp` and continues to use its native
|
|
52
|
+
* nonlinear font scaling.
|
|
53
|
+
*
|
|
54
|
+
* Keys are base variants; `/emphasized` twins resolve to their base.
|
|
55
|
+
*/
|
|
56
|
+
declare const DEFAULT_DYNAMIC_TYPE_RAMPS: Readonly<Partial<Record<TextVariant, NonNullable<TextProps['dynamicTypeRamp']>>>>;
|
|
47
57
|
//#endregion
|
|
48
|
-
export { DEFAULT_CONTROL_MAX_FONT_SIZE_MULTIPLIER, DEFAULT_MAX_FONT_SIZE_MULTIPLIERS, MAX_SUPPORTED_FONT_SCALE, TYPE_SCALE_CURVE };
|
|
58
|
+
export { DEFAULT_CONTROL_MAX_FONT_SIZE_MULTIPLIER, DEFAULT_DYNAMIC_TYPE_RAMPS, DEFAULT_MAX_FONT_SIZE_MULTIPLIERS, MAX_SUPPORTED_FONT_SCALE, TYPE_SCALE_CURVE };
|
|
49
59
|
//# sourceMappingURL=constants.d.cts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"constants.d.cts","names":[],"sources":["../../src/fontScaling/constants.ts"],"mappings":"
|
|
1
|
+
{"version":3,"file":"constants.d.cts","names":[],"sources":["../../src/fontScaling/constants.ts"],"mappings":";;;;;;;;AAGmD;;;;;AAarB;;;;cAAxB,wBAAA;;;;;;;;;;;;;AAgB0E;;cAA1E,gBAAA,EAAkB,QAAA,CAAS,OAAA,CAAQ,MAAA,CAAO,WAAA,EAAa,mBAAA;;;;;;;;cAgCvD,iCAAA,EAAmC,QAAA,CACvC,OAAA,CAAQ,MAAA,CAAO,WAAA,EAAa,mBAAA;;;;;;cAexB,wCAAA;AAf2C;;;;;AAeH;;;AAfG,cAyB3C,0BAAA,EAA4B,QAAA,CAChC,OAAA,CAAQ,MAAA,CAAO,WAAA,EAAa,WAAA,CAAY,SAAA"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
|
|
2
2
|
import { TextVariant } from "../components/Text.js";
|
|
3
3
|
import { FontScalingCapValue } from "./types.js";
|
|
4
|
+
import { TextProps } from "react-native";
|
|
4
5
|
|
|
5
6
|
//#region src/fontScaling/constants.d.ts
|
|
6
7
|
/**
|
|
@@ -44,6 +45,15 @@ declare const DEFAULT_MAX_FONT_SIZE_MULTIPLIERS: Readonly<Partial<Record<TextVar
|
|
|
44
45
|
* supported ceiling rather than a looser per-variant cap.
|
|
45
46
|
*/
|
|
46
47
|
declare const DEFAULT_CONTROL_MAX_FONT_SIZE_MULTIPLIER = 2;
|
|
48
|
+
/**
|
|
49
|
+
* iOS Dynamic Type curve used by each UDS typography tier. React Native uses
|
|
50
|
+
* the selected system text style's curve while preserving the configured UDS
|
|
51
|
+
* font size. Android ignores `dynamicTypeRamp` and continues to use its native
|
|
52
|
+
* nonlinear font scaling.
|
|
53
|
+
*
|
|
54
|
+
* Keys are base variants; `/emphasized` twins resolve to their base.
|
|
55
|
+
*/
|
|
56
|
+
declare const DEFAULT_DYNAMIC_TYPE_RAMPS: Readonly<Partial<Record<TextVariant, NonNullable<TextProps['dynamicTypeRamp']>>>>;
|
|
47
57
|
//#endregion
|
|
48
|
-
export { DEFAULT_CONTROL_MAX_FONT_SIZE_MULTIPLIER, DEFAULT_MAX_FONT_SIZE_MULTIPLIERS, MAX_SUPPORTED_FONT_SCALE, TYPE_SCALE_CURVE };
|
|
58
|
+
export { DEFAULT_CONTROL_MAX_FONT_SIZE_MULTIPLIER, DEFAULT_DYNAMIC_TYPE_RAMPS, DEFAULT_MAX_FONT_SIZE_MULTIPLIERS, MAX_SUPPORTED_FONT_SCALE, TYPE_SCALE_CURVE };
|
|
49
59
|
//# sourceMappingURL=constants.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"constants.d.ts","names":[],"sources":["../../src/fontScaling/constants.ts"],"mappings":"
|
|
1
|
+
{"version":3,"file":"constants.d.ts","names":[],"sources":["../../src/fontScaling/constants.ts"],"mappings":";;;;;;;;AAGmD;;;;;AAarB;;;;cAAxB,wBAAA;;;;;;;;;;;;;AAgB0E;;cAA1E,gBAAA,EAAkB,QAAA,CAAS,OAAA,CAAQ,MAAA,CAAO,WAAA,EAAa,mBAAA;;;;;;;;cAgCvD,iCAAA,EAAmC,QAAA,CACvC,OAAA,CAAQ,MAAA,CAAO,WAAA,EAAa,mBAAA;;;;;;cAexB,wCAAA;AAf2C;;;;;AAeH;;;AAfG,cAyB3C,0BAAA,EAA4B,QAAA,CAChC,OAAA,CAAQ,MAAA,CAAO,WAAA,EAAa,WAAA,CAAY,SAAA"}
|
|
@@ -64,7 +64,39 @@ const DEFAULT_MAX_FONT_SIZE_MULTIPLIERS = Object.freeze(Object.fromEntries(Objec
|
|
|
64
64
|
* supported ceiling rather than a looser per-variant cap.
|
|
65
65
|
*/
|
|
66
66
|
const DEFAULT_CONTROL_MAX_FONT_SIZE_MULTIPLIER = 2;
|
|
67
|
+
/**
|
|
68
|
+
* iOS Dynamic Type curve used by each UDS typography tier. React Native uses
|
|
69
|
+
* the selected system text style's curve while preserving the configured UDS
|
|
70
|
+
* font size. Android ignores `dynamicTypeRamp` and continues to use its native
|
|
71
|
+
* nonlinear font scaling.
|
|
72
|
+
*
|
|
73
|
+
* Keys are base variants; `/emphasized` twins resolve to their base.
|
|
74
|
+
*/
|
|
75
|
+
const DEFAULT_DYNAMIC_TYPE_RAMPS = {
|
|
76
|
+
display1: "largeTitle",
|
|
77
|
+
display2: "largeTitle",
|
|
78
|
+
display3: "largeTitle",
|
|
79
|
+
title1: "title1",
|
|
80
|
+
title2: "title2",
|
|
81
|
+
title3: "title3",
|
|
82
|
+
title4: "title3",
|
|
83
|
+
headline1: "headline",
|
|
84
|
+
body1: "body",
|
|
85
|
+
label1: "callout",
|
|
86
|
+
label2: "subheadline",
|
|
87
|
+
label3: "footnote",
|
|
88
|
+
label4: "caption1",
|
|
89
|
+
caption1: "caption1",
|
|
90
|
+
caption2: "caption2",
|
|
91
|
+
legal1: "caption2",
|
|
92
|
+
ui1: "title3",
|
|
93
|
+
ui2: "title3",
|
|
94
|
+
ui3: "callout",
|
|
95
|
+
ui4: "subheadline",
|
|
96
|
+
ui5: "footnote",
|
|
97
|
+
ui6: "caption2"
|
|
98
|
+
};
|
|
67
99
|
//#endregion
|
|
68
|
-
export { DEFAULT_CONTROL_MAX_FONT_SIZE_MULTIPLIER, DEFAULT_MAX_FONT_SIZE_MULTIPLIERS, MAX_SUPPORTED_FONT_SCALE, TYPE_SCALE_CURVE };
|
|
100
|
+
export { DEFAULT_CONTROL_MAX_FONT_SIZE_MULTIPLIER, DEFAULT_DYNAMIC_TYPE_RAMPS, DEFAULT_MAX_FONT_SIZE_MULTIPLIERS, MAX_SUPPORTED_FONT_SCALE, TYPE_SCALE_CURVE };
|
|
69
101
|
|
|
70
102
|
//# sourceMappingURL=constants.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"constants.js","names":[],"sources":["../../src/fontScaling/constants.ts"],"sourcesContent":["import type { TextVariant } from '../components/Text';\nimport type { FontScalingCapValue } from './types';\n\n/**\n * The largest OS font scale UDS components are designed to support.\n *\n * Yahoo's inclusive-design guidance is to solve for text scaling up to 2x, so\n * no default cap exceeds it. Apple's Accessibility Nutrition Label for Larger\n * Text is claimable at \"at least 200% or the maximum font size for the\n * system\", so a 2x ceiling still qualifies. Note that iOS offers scales beyond\n * this (up to 3.571x): with this ceiling in place the top accessibility sizes\n * render alike, and an app that wants to follow the OS further can raise or\n * remove the caps via `UDSFontScalingProvider`.\n */\nconst MAX_SUPPORTED_FONT_SCALE = 2;\n\n/**\n * How far each text style would grow if only legibility mattered, following\n * the shape of Apple's Dynamic Type ramps: the larger a style starts, the less\n * it multiplies. At iOS's largest accessibility size the system grows body\n * (17pt) by 3.12x but largeTitle (34pt) by only ~1.71x, and UDS display tiers\n * are larger than largeTitle, so they taper hardest.\n *\n * Caps are chosen by the size a style starts at rather than by which family it\n * belongs to, which is why `ui1` (24pt) matches `title3` (24pt) and `ui2`\n * (20pt) matches `title4` (20pt). `null` means \"no cap from the curve\" — those\n * are reading sizes, where legibility argues for following the OS.\n *\n * The exported defaults are this curve clamped to {@link MAX_SUPPORTED_FONT_SCALE}.\n */\nconst TYPE_SCALE_CURVE: Readonly<Partial<Record<TextVariant, FontScalingCapValue>>> = {\n display1: 1.5,\n display2: 1.6,\n display3: 1.75,\n title1: 1.8,\n title2: 2,\n title3: 2.2,\n title4: 2.4,\n headline1: 2.5,\n ui1: 2.2,\n ui2: 2.4,\n body1: null,\n label1: null,\n label2: null,\n label3: null,\n label4: null,\n caption1: null,\n caption2: null,\n legal1: null,\n ui3: null,\n ui4: null,\n ui5: null,\n ui6: null,\n};\n\n/**\n * Default per-variant caps on OS font scaling, applied by `Text` when no\n * explicit prop or provider config overrides them: the legibility curve in\n * {@link TYPE_SCALE_CURVE}, clamped to the 2x we support.\n *\n * Keys are base variants; `/emphasized` twins resolve to their base.\n */\nconst DEFAULT_MAX_FONT_SIZE_MULTIPLIERS: Readonly<\n Partial<Record<TextVariant, FontScalingCapValue>>\n> = Object.freeze(\n Object.fromEntries(\n Object.entries(TYPE_SCALE_CURVE).map(([variant, cap]) => [\n variant,\n cap === null ? MAX_SUPPORTED_FONT_SCALE : Math.min(cap, MAX_SUPPORTED_FONT_SCALE),\n ]),\n ) as Partial<Record<TextVariant, FontScalingCapValue>>,\n);\n\n/**\n * Default cap for control-internal text and icons (Button, Checkbox, Radio,\n * Switch, Chip, Tabs, Icon). Controls have bounded layouts, so they get the\n * supported ceiling rather than a looser per-variant cap.\n */\nconst DEFAULT_CONTROL_MAX_FONT_SIZE_MULTIPLIER = MAX_SUPPORTED_FONT_SCALE;\n\nexport {\n DEFAULT_CONTROL_MAX_FONT_SIZE_MULTIPLIER,\n DEFAULT_MAX_FONT_SIZE_MULTIPLIERS,\n MAX_SUPPORTED_FONT_SCALE,\n TYPE_SCALE_CURVE,\n};\n"],"mappings":";;;;;;;;;;;;;
|
|
1
|
+
{"version":3,"file":"constants.js","names":[],"sources":["../../src/fontScaling/constants.ts"],"sourcesContent":["import type { TextProps as RNTextProps } from 'react-native';\n\nimport type { TextVariant } from '../components/Text';\nimport type { FontScalingCapValue } from './types';\n\n/**\n * The largest OS font scale UDS components are designed to support.\n *\n * Yahoo's inclusive-design guidance is to solve for text scaling up to 2x, so\n * no default cap exceeds it. Apple's Accessibility Nutrition Label for Larger\n * Text is claimable at \"at least 200% or the maximum font size for the\n * system\", so a 2x ceiling still qualifies. Note that iOS offers scales beyond\n * this (up to 3.571x): with this ceiling in place the top accessibility sizes\n * render alike, and an app that wants to follow the OS further can raise or\n * remove the caps via `UDSFontScalingProvider`.\n */\nconst MAX_SUPPORTED_FONT_SCALE = 2;\n\n/**\n * How far each text style would grow if only legibility mattered, following\n * the shape of Apple's Dynamic Type ramps: the larger a style starts, the less\n * it multiplies. At iOS's largest accessibility size the system grows body\n * (17pt) by 3.12x but largeTitle (34pt) by only ~1.71x, and UDS display tiers\n * are larger than largeTitle, so they taper hardest.\n *\n * Caps are chosen by the size a style starts at rather than by which family it\n * belongs to, which is why `ui1` (24pt) matches `title3` (24pt) and `ui2`\n * (20pt) matches `title4` (20pt). `null` means \"no cap from the curve\" — those\n * are reading sizes, where legibility argues for following the OS.\n *\n * The exported defaults are this curve clamped to {@link MAX_SUPPORTED_FONT_SCALE}.\n */\nconst TYPE_SCALE_CURVE: Readonly<Partial<Record<TextVariant, FontScalingCapValue>>> = {\n display1: 1.5,\n display2: 1.6,\n display3: 1.75,\n title1: 1.8,\n title2: 2,\n title3: 2.2,\n title4: 2.4,\n headline1: 2.5,\n ui1: 2.2,\n ui2: 2.4,\n body1: null,\n label1: null,\n label2: null,\n label3: null,\n label4: null,\n caption1: null,\n caption2: null,\n legal1: null,\n ui3: null,\n ui4: null,\n ui5: null,\n ui6: null,\n};\n\n/**\n * Default per-variant caps on OS font scaling, applied by `Text` when no\n * explicit prop or provider config overrides them: the legibility curve in\n * {@link TYPE_SCALE_CURVE}, clamped to the 2x we support.\n *\n * Keys are base variants; `/emphasized` twins resolve to their base.\n */\nconst DEFAULT_MAX_FONT_SIZE_MULTIPLIERS: Readonly<\n Partial<Record<TextVariant, FontScalingCapValue>>\n> = Object.freeze(\n Object.fromEntries(\n Object.entries(TYPE_SCALE_CURVE).map(([variant, cap]) => [\n variant,\n cap === null ? MAX_SUPPORTED_FONT_SCALE : Math.min(cap, MAX_SUPPORTED_FONT_SCALE),\n ]),\n ) as Partial<Record<TextVariant, FontScalingCapValue>>,\n);\n\n/**\n * Default cap for control-internal text and icons (Button, Checkbox, Radio,\n * Switch, Chip, Tabs, Icon). Controls have bounded layouts, so they get the\n * supported ceiling rather than a looser per-variant cap.\n */\nconst DEFAULT_CONTROL_MAX_FONT_SIZE_MULTIPLIER = MAX_SUPPORTED_FONT_SCALE;\n\n/**\n * iOS Dynamic Type curve used by each UDS typography tier. React Native uses\n * the selected system text style's curve while preserving the configured UDS\n * font size. Android ignores `dynamicTypeRamp` and continues to use its native\n * nonlinear font scaling.\n *\n * Keys are base variants; `/emphasized` twins resolve to their base.\n */\nconst DEFAULT_DYNAMIC_TYPE_RAMPS: Readonly<\n Partial<Record<TextVariant, NonNullable<RNTextProps['dynamicTypeRamp']>>>\n> = {\n display1: 'largeTitle',\n display2: 'largeTitle',\n display3: 'largeTitle',\n title1: 'title1',\n title2: 'title2',\n title3: 'title3',\n title4: 'title3',\n headline1: 'headline',\n body1: 'body',\n label1: 'callout',\n label2: 'subheadline',\n label3: 'footnote',\n label4: 'caption1',\n caption1: 'caption1',\n caption2: 'caption2',\n legal1: 'caption2',\n ui1: 'title3',\n ui2: 'title3',\n ui3: 'callout',\n ui4: 'subheadline',\n ui5: 'footnote',\n ui6: 'caption2',\n};\n\nexport {\n DEFAULT_CONTROL_MAX_FONT_SIZE_MULTIPLIER,\n DEFAULT_DYNAMIC_TYPE_RAMPS,\n DEFAULT_MAX_FONT_SIZE_MULTIPLIERS,\n MAX_SUPPORTED_FONT_SCALE,\n TYPE_SCALE_CURVE,\n};\n"],"mappings":";;;;;;;;;;;;;AAgBA,MAAM,2BAA2B;;;;;;;;;;;;;;;AAgBjC,MAAM,mBAAgF;CACpF,UAAU;CACV,UAAU;CACV,UAAU;CACV,QAAQ;CACR,QAAQ;CACR,QAAQ;CACR,QAAQ;CACR,WAAW;CACX,KAAK;CACL,KAAK;CACL,OAAO;CACP,QAAQ;CACR,QAAQ;CACR,QAAQ;CACR,QAAQ;CACR,UAAU;CACV,UAAU;CACV,QAAQ;CACR,KAAK;CACL,KAAK;CACL,KAAK;CACL,KAAK;CACN;;;;;;;;AASD,MAAM,oCAEF,OAAO,OACT,OAAO,YACL,OAAO,QAAQ,iBAAiB,CAAC,KAAK,CAAC,SAAS,SAAS,CACvD,SACA,QAAQ,OAAA,IAAkC,KAAK,IAAI,KAAA,EAA8B,CAClF,CAAC,CACH,CACF;;;;;;AAOD,MAAM,2CAAA;;;;;;;;;AAUN,MAAM,6BAEF;CACF,UAAU;CACV,UAAU;CACV,UAAU;CACV,QAAQ;CACR,QAAQ;CACR,QAAQ;CACR,QAAQ;CACR,WAAW;CACX,OAAO;CACP,QAAQ;CACR,QAAQ;CACR,QAAQ;CACR,QAAQ;CACR,UAAU;CACV,UAAU;CACV,QAAQ;CACR,KAAK;CACL,KAAK;CACL,KAAK;CACL,KAAK;CACL,KAAK;CACL,KAAK;CACN"}
|
|
@@ -1,10 +1,11 @@
|
|
|
1
1
|
/*! © 2026 Yahoo, Inc. UDS Mobile v0.0.0-development */
|
|
2
2
|
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
-
const require_fontScaling_useFontScale = require("./useFontScale.cjs");
|
|
4
3
|
const require_fontScaling_FontScalingContext = require("./FontScalingContext.cjs");
|
|
4
|
+
const require_fontScaling_useFontScale = require("./useFontScale.cjs");
|
|
5
5
|
const require_fontScaling_constants = require("./constants.cjs");
|
|
6
6
|
const require_fontScaling_useMaxFontSizeMultiplier = require("./useMaxFontSizeMultiplier.cjs");
|
|
7
7
|
exports.DEFAULT_CONTROL_MAX_FONT_SIZE_MULTIPLIER = require_fontScaling_constants.DEFAULT_CONTROL_MAX_FONT_SIZE_MULTIPLIER;
|
|
8
|
+
exports.DEFAULT_DYNAMIC_TYPE_RAMPS = require_fontScaling_constants.DEFAULT_DYNAMIC_TYPE_RAMPS;
|
|
8
9
|
exports.DEFAULT_MAX_FONT_SIZE_MULTIPLIERS = require_fontScaling_constants.DEFAULT_MAX_FONT_SIZE_MULTIPLIERS;
|
|
9
10
|
exports.MAX_SUPPORTED_FONT_SCALE = require_fontScaling_constants.MAX_SUPPORTED_FONT_SCALE;
|
|
10
11
|
exports.TYPE_SCALE_CURVE = require_fontScaling_constants.TYPE_SCALE_CURVE;
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
import { TextVariant } from "../components/Text.cjs";
|
|
3
3
|
import { FontScalingCapValue, FontScalingConfig } from "./types.cjs";
|
|
4
4
|
import { UDSFontScalingProvider, UDSFontScalingProviderProps } from "./FontScalingContext.cjs";
|
|
5
|
-
import { DEFAULT_CONTROL_MAX_FONT_SIZE_MULTIPLIER, DEFAULT_MAX_FONT_SIZE_MULTIPLIERS, MAX_SUPPORTED_FONT_SCALE, TYPE_SCALE_CURVE } from "./constants.cjs";
|
|
5
|
+
import { DEFAULT_CONTROL_MAX_FONT_SIZE_MULTIPLIER, DEFAULT_DYNAMIC_TYPE_RAMPS, DEFAULT_MAX_FONT_SIZE_MULTIPLIERS, MAX_SUPPORTED_FONT_SCALE, TYPE_SCALE_CURVE } from "./constants.cjs";
|
|
6
6
|
import { useFontScale } from "./useFontScale.cjs";
|
|
7
7
|
import { useMaxFontSizeMultiplier } from "./useMaxFontSizeMultiplier.cjs";
|
|
8
|
-
export { DEFAULT_CONTROL_MAX_FONT_SIZE_MULTIPLIER, DEFAULT_MAX_FONT_SIZE_MULTIPLIERS, type FontScalingCapValue, type FontScalingConfig, MAX_SUPPORTED_FONT_SCALE, TYPE_SCALE_CURVE, type TextVariant, UDSFontScalingProvider, type UDSFontScalingProviderProps, useFontScale, useMaxFontSizeMultiplier };
|
|
8
|
+
export { DEFAULT_CONTROL_MAX_FONT_SIZE_MULTIPLIER, DEFAULT_DYNAMIC_TYPE_RAMPS, DEFAULT_MAX_FONT_SIZE_MULTIPLIERS, type FontScalingCapValue, type FontScalingConfig, MAX_SUPPORTED_FONT_SCALE, TYPE_SCALE_CURVE, type TextVariant, UDSFontScalingProvider, type UDSFontScalingProviderProps, useFontScale, useMaxFontSizeMultiplier };
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
import { TextVariant } from "../components/Text.js";
|
|
3
3
|
import { FontScalingCapValue, FontScalingConfig } from "./types.js";
|
|
4
4
|
import { UDSFontScalingProvider, UDSFontScalingProviderProps } from "./FontScalingContext.js";
|
|
5
|
-
import { DEFAULT_CONTROL_MAX_FONT_SIZE_MULTIPLIER, DEFAULT_MAX_FONT_SIZE_MULTIPLIERS, MAX_SUPPORTED_FONT_SCALE, TYPE_SCALE_CURVE } from "./constants.js";
|
|
5
|
+
import { DEFAULT_CONTROL_MAX_FONT_SIZE_MULTIPLIER, DEFAULT_DYNAMIC_TYPE_RAMPS, DEFAULT_MAX_FONT_SIZE_MULTIPLIERS, MAX_SUPPORTED_FONT_SCALE, TYPE_SCALE_CURVE } from "./constants.js";
|
|
6
6
|
import { useFontScale } from "./useFontScale.js";
|
|
7
7
|
import { useMaxFontSizeMultiplier } from "./useMaxFontSizeMultiplier.js";
|
|
8
|
-
export { DEFAULT_CONTROL_MAX_FONT_SIZE_MULTIPLIER, DEFAULT_MAX_FONT_SIZE_MULTIPLIERS, type FontScalingCapValue, type FontScalingConfig, MAX_SUPPORTED_FONT_SCALE, TYPE_SCALE_CURVE, type TextVariant, UDSFontScalingProvider, type UDSFontScalingProviderProps, useFontScale, useMaxFontSizeMultiplier };
|
|
8
|
+
export { DEFAULT_CONTROL_MAX_FONT_SIZE_MULTIPLIER, DEFAULT_DYNAMIC_TYPE_RAMPS, DEFAULT_MAX_FONT_SIZE_MULTIPLIERS, type FontScalingCapValue, type FontScalingConfig, MAX_SUPPORTED_FONT_SCALE, TYPE_SCALE_CURVE, type TextVariant, UDSFontScalingProvider, type UDSFontScalingProviderProps, useFontScale, useMaxFontSizeMultiplier };
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/*! © 2026 Yahoo, Inc. UDS Mobile v0.0.0-development */
|
|
2
|
-
import { useFontScale } from "./useFontScale.js";
|
|
3
2
|
import { UDSFontScalingProvider } from "./FontScalingContext.js";
|
|
4
|
-
import {
|
|
3
|
+
import { useFontScale } from "./useFontScale.js";
|
|
4
|
+
import { DEFAULT_CONTROL_MAX_FONT_SIZE_MULTIPLIER, DEFAULT_DYNAMIC_TYPE_RAMPS, DEFAULT_MAX_FONT_SIZE_MULTIPLIERS, MAX_SUPPORTED_FONT_SCALE, TYPE_SCALE_CURVE } from "./constants.js";
|
|
5
5
|
import { useMaxFontSizeMultiplier } from "./useMaxFontSizeMultiplier.js";
|
|
6
|
-
export { DEFAULT_CONTROL_MAX_FONT_SIZE_MULTIPLIER, DEFAULT_MAX_FONT_SIZE_MULTIPLIERS, MAX_SUPPORTED_FONT_SCALE, TYPE_SCALE_CURVE, UDSFontScalingProvider, useFontScale, useMaxFontSizeMultiplier };
|
|
6
|
+
export { DEFAULT_CONTROL_MAX_FONT_SIZE_MULTIPLIER, DEFAULT_DYNAMIC_TYPE_RAMPS, DEFAULT_MAX_FONT_SIZE_MULTIPLIERS, MAX_SUPPORTED_FONT_SCALE, TYPE_SCALE_CURVE, UDSFontScalingProvider, useFontScale, useMaxFontSizeMultiplier };
|
|
@@ -149,6 +149,7 @@ const inputStyles = createComponentStyles({
|
|
|
149
149
|
},
|
|
150
150
|
input: {
|
|
151
151
|
flex: 1,
|
|
152
|
+
height: 24,
|
|
152
153
|
fontFamily: "YahooProductSans-Regular",
|
|
153
154
|
fontSize: 16,
|
|
154
155
|
lineHeight: 24,
|
|
@@ -241,7 +242,9 @@ const avatarStyles = createComponentStyles({
|
|
|
241
242
|
justifyContent: "center",
|
|
242
243
|
borderRadius: 9999,
|
|
243
244
|
backgroundColor: "#E0E0E0",
|
|
244
|
-
overflow: "hidden"
|
|
245
|
+
overflow: "hidden",
|
|
246
|
+
width: 40,
|
|
247
|
+
height: 40
|
|
245
248
|
},
|
|
246
249
|
image: {
|
|
247
250
|
width: "100%",
|
|
@@ -251,6 +254,15 @@ const avatarStyles = createComponentStyles({
|
|
|
251
254
|
fontFamily: "YahooProductSans-Medium",
|
|
252
255
|
fontSize: 14,
|
|
253
256
|
color: "#000000"
|
|
257
|
+
},
|
|
258
|
+
text: {
|
|
259
|
+
fontFamily: "YahooProductSans-Medium",
|
|
260
|
+
fontSize: 16,
|
|
261
|
+
lineHeight: 20
|
|
262
|
+
},
|
|
263
|
+
icon: {
|
|
264
|
+
fontSize: 24,
|
|
265
|
+
lineHeight: 24
|
|
254
266
|
}
|
|
255
267
|
});
|
|
256
268
|
const badgeStyles = createComponentStyles({
|