@yahoo/uds-mobile 2.21.0 → 2.21.2

package/dist/components/IconButton.js

@@ -2,11 +2,13 @@
 import { SCALE_EFFECTS } from "../motion-tokens/dist/index.js";
 import { BUTTON_SPRING_CONFIG } from "../motion.js";
 import { Icon } from "./Icon.js";
+import { getIconButtonControlMetrics } from "./Button/buttonTheme.js";
 import { AnimatedPressable } from "./Pressable.js";
 import { memo, useCallback, useMemo, useState } from "react";
 import { ActivityIndicator } from "react-native";
 import { jsx } from "react/jsx-runtime";
 import { buttonStyles, iconButtonStyles, styles } from "../../generated/styles";
+import { useUnistyles } from "react-native-unistyles";
 import { Easing, useAnimatedStyle, useDerivedValue, useSharedValue, withSpring, withTiming } from "react-native-reanimated";
 import { useAnimatedTheme, useAnimatedVariantColor } from "react-native-unistyles/reanimated";
 //#region src/components/IconButton.tsx
@@ -55,6 +57,12 @@ function interpolateShadowAlpha(shadow, alpha) {
 const IconButton = memo(function IconButton({ name, variant = "primary", size = "md", iconVariant = "outline", iconColor, loading, disabled, style, accessibilityLabel, accessibilityHint, disableEffects = false, onPressIn, onPressOut, ref, ...props }) {
 	const isDisabled = disabled || loading;
 	const shouldAnimate = !disableEffects && !isDisabled;
+	const { theme } = useUnistyles();
+	const { controlHeight } = useMemo(() => getIconButtonControlMetrics(theme, size), [theme, size]);
+	const matchedControlDimensions = controlHeight > 0 ? {
+		height: controlHeight,
+		width: controlHeight
+	} : void 0;
 	const [pressed, setPressed] = useState(false);
 	iconButtonStyles.useVariants({ size });
 	buttonStyles.useVariants({
@@ -125,6 +133,7 @@ const IconButton = memo(function IconButton({ name, variant = "primary", size =
 		style: [
 			iconButtonStyles.root,
 			buttonStyles.root,
+			matchedControlDimensions,
 			styles.foundation,
 			animatedRootStyle,
 			typeof style === "function" ? style({ pressed }) : style

package/dist/components/IconButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"IconButton.js","names":["foundationStyles"],"sources":["../../src/components/IconButton.tsx"],"sourcesContent":["import type { ButtonVariantFlat, IconButtonSize, IconVariant } from '@yahoo/uds-types';\nimport type { Ref } from 'react';\nimport { memo, useCallback, useMemo, useState } from 'react';\nimport type { View } from 'react-native';\nimport { ActivityIndicator } from 'react-native';\nimport {\n  Easing,\n  useAnimatedStyle,\n  useDerivedValue,\n  useSharedValue,\n  withSpring,\n  withTiming,\n} from 'react-native-reanimated';\nimport { useAnimatedTheme, useAnimatedVariantColor } from 'react-native-unistyles/reanimated';\n\nimport type { StyleProps } from '../../generated/styles';\nimport { buttonStyles, iconButtonStyles, styles as foundationStyles } from '../../generated/styles';\nimport { BUTTON_SPRING_CONFIG, SCALE_EFFECTS } from '../motion';\nimport type { IconName } from './Icon';\nimport { Icon } from './Icon';\nimport type { PressableProps } from './Pressable';\nimport { AnimatedPressable } from './Pressable';\n\n/* -------------------------------------------------------------------------- */\n/*                              Animation Helpers                              */\n/* -------------------------------------------------------------------------- */\n\nfunction interpolateShadowAlpha(shadow: string | undefined, alpha: number): string {\n  'worklet';\n  if (!shadow) {\n    return '';\n  }\n  if (alpha >= 1) {\n    return shadow;\n  }\n  if (alpha <= 0) {\n    return '';\n  }\n\n  return shadow.replace(/rgba\\(([^,]+),\\s*([^,]+),\\s*([^,]+),\\s*([^)]+)\\)/g, (_, r, g, b, a) => {\n    const newAlpha = parseFloat(a) * alpha;\n    return `rgba(${r}, ${g}, ${b}, ${newAlpha.toFixed(3)})`;\n  });\n}\n\n/* -------------------------------------------------------------------------- */\n/*                            IconButton Props                                 */\n/* -------------------------------------------------------------------------- */\n\ninterface IconButtonProps extends Omit<PressableProps, 'children'> {\n  /** Icon to render from the icons package */\n  name: IconName;\n  /** The visual style variant @default 'primary' */\n  variant?: ButtonVariantFlat;\n  /** The size of the button @default 'md' */\n  size?: IconButtonSize;\n  /** The icon style variant @default 'outline' */\n  iconVariant?: IconVariant;\n  /** Override the icon color token without changing the button variant tokens */\n  iconColor?: StyleProps['color'];\n  /** Shows a loading spinner and disables the button */\n  loading?: boolean;\n  /**\n   * Disable motion effects (scale on press, icon animations)\n   * @default false\n   */\n  disableEffects?: boolean;\n  /** Ref to the underlying View */\n  ref?: Ref<View>;\n}\n\n/* -------------------------------------------------------------------------- */\n/*                            IconButton Component                             */\n/* -------------------------------------------------------------------------- */\n\n/**\n * **An icon button element that can be used to trigger an action**\n *\n * @description\n * An icon-only button for actions where space is limited. Features animated\n * scale effect on press and smooth color transitions matching the web UDS\n * IconButton behavior.\n *\n * @category Interactive\n * @platform mobile\n *\n * @example\n * ```tsx\n * import { IconButton } from '@yahoo/uds-mobile/IconButton';\n *\n * <IconButton name=\"Add\" onPress={() => console.log('pressed')} />\n * <IconButton name=\"Close\" variant=\"secondary\" size=\"sm\" />\n * <IconButton name=\"Settings\" loading />\n * ```\n *\n * @usage\n * - Use for toolbar actions\n * - Use for closing modals/dialogs\n * - Always provide accessibilityLabel for screen readers\n *\n * @accessibility\n * - Sets `accessibilityRole=\"button\"` automatically\n * - Announces loading state to screen readers\n * - **Always** provide `accessibilityLabel` since there's no visible text\n *\n * @see {@link Button} for buttons with text labels\n * @see {@link Icon} for non-interactive icons\n */\nconst IconButton = memo(function IconButton({\n  name,\n  variant = 'primary',\n  size = 'md',\n  iconVariant = 'outline',\n  iconColor,\n  loading,\n  disabled,\n  style,\n  accessibilityLabel,\n  accessibilityHint,\n  disableEffects = false,\n  onPressIn,\n  onPressOut,\n  ref,\n  ...props\n}: IconButtonProps) {\n  const isDisabled = disabled || loading;\n  const shouldAnimate = !disableEffects && !isDisabled;\n\n  /* --------------------------------- State ---------------------------------- */\n  const [pressed, setPressed] = useState(false);\n\n  // Apply layer-based styles with compound variant support\n  iconButtonStyles.useVariants({ size });\n  buttonStyles.useVariants({ variant, disabled: isDisabled, pressed });\n  foundationStyles.useVariants({ color: iconColor });\n\n  const resolvedIconColor = iconColor\n    ? (foundationStyles.foundation.color as string | undefined)\n    : undefined;\n\n  // Animate colors using Unistyles' useAnimatedVariantColor\n  const backgroundColor = useAnimatedVariantColor(buttonStyles.root, 'backgroundColor');\n  const borderColor = useAnimatedVariantColor(buttonStyles.root, 'borderColor');\n\n  // Get animated theme for boxShadow\n  const animatedTheme = useAnimatedTheme();\n\n  /* ------------------------------- Animation -------------------------------- */\n  const scale = useSharedValue<number>(SCALE_EFFECTS.none);\n\n  const handlePressIn = useCallback<NonNullable<PressableProps['onPressIn']>>(\n    (event) => {\n      setPressed(true);\n      if (shouldAnimate) {\n        scale.value = withSpring(SCALE_EFFECTS.down, BUTTON_SPRING_CONFIG);\n      }\n      onPressIn?.(event);\n    },\n    [shouldAnimate, scale, onPressIn],\n  );\n\n  const handlePressOut = useCallback<NonNullable<PressableProps['onPressOut']>>(\n    (event) => {\n      setPressed(false);\n      if (shouldAnimate) {\n        scale.value = withSpring(SCALE_EFFECTS.none, BUTTON_SPRING_CONFIG);\n      }\n      onPressOut?.(event);\n    },\n    [shouldAnimate, scale, onPressOut],\n  );\n\n  const a11yState = useMemo(() => ({ disabled: isDisabled, busy: loading }), [isDisabled, loading]);\n\n  /* --------------------------------- Styles --------------------------------- */\n  // Animate pressed state for shadow\n  const pressProgress = useDerivedValue(\n    () => withTiming(pressed ? 1 : 0, { duration: 220, easing: Easing.bezier(0, 0, 0.2, 1) }),\n    [pressed],\n  );\n\n  // Animate using Unistyles' variant color system + boxShadow from theme\n  const animatedRootStyle = useAnimatedStyle(() => {\n    // Get boxShadow from theme using flattened path (no camelCase conversion needed!)\n    const components = animatedTheme.value.components as unknown as Record<\n      string,\n      Record<string, unknown>\n    >;\n    const shadowPressed = components[`button/variant/${variant}/root/pressed`]?.boxShadow as\n      | string\n      | undefined;\n\n    return {\n      transform: [{ scale: scale.value }],\n      backgroundColor: withTiming(backgroundColor.value, {\n        duration: 220,\n        easing: Easing.bezier(0, 0, 0.2, 1),\n      }),\n      borderColor: withTiming(borderColor.value, {\n        duration: 220,\n        easing: Easing.bezier(0, 0, 0.2, 1),\n      }),\n      // Only animate shadow if the theme defines one for this variant\n      ...(shadowPressed && {\n        boxShadow: interpolateShadowAlpha(shadowPressed, pressProgress.value),\n      }),\n    };\n  });\n\n  /* --------------------------------- Render --------------------------------- */\n  return (\n    <AnimatedPressable\n      ref={ref}\n      disabled={isDisabled}\n      onPressIn={handlePressIn}\n      onPressOut={handlePressOut}\n      flexDirection=\"row\"\n      alignItems=\"center\"\n      justifyContent=\"center\"\n      overflow=\"hidden\"\n      accessibilityLabel={loading ? `${accessibilityLabel ?? ''}, loading` : accessibilityLabel}\n      accessibilityHint={accessibilityHint}\n      accessibilityRole=\"button\"\n      accessibilityState={a11yState}\n      style={[\n        iconButtonStyles.root,\n        buttonStyles.root,\n        foundationStyles.foundation,\n        animatedRootStyle,\n        typeof style === 'function' ? style({ pressed }) : style,\n      ]}\n      {...props}\n    >\n      {loading ? (\n        <ActivityIndicator\n          size={iconButtonStyles.icon.fontSize}\n          color={resolvedIconColor ?? buttonStyles.icon.color}\n        />\n      ) : (\n        <Icon\n          name={name}\n          variant={iconVariant}\n          style={[iconButtonStyles.icon, buttonStyles.icon]}\n          dangerouslySetColor={resolvedIconColor}\n        />\n      )}\n    </AnimatedPressable>\n  );\n});\n\nIconButton.displayName = 'IconButton';\n\nexport { IconButton, type IconButtonProps };\n"],"mappings":"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"}
+{"version":3,"file":"IconButton.js","names":["foundationStyles"],"sources":["../../src/components/IconButton.tsx"],"sourcesContent":["import type { ButtonVariantFlat, IconButtonSize, IconVariant } from '@yahoo/uds-types';\nimport type { Ref } from 'react';\nimport { memo, useCallback, useMemo, useState } from 'react';\nimport type { View } from 'react-native';\nimport { ActivityIndicator } from 'react-native';\nimport {\n  Easing,\n  useAnimatedStyle,\n  useDerivedValue,\n  useSharedValue,\n  withSpring,\n  withTiming,\n} from 'react-native-reanimated';\n// eslint-disable-next-line uds/no-use-unistyles -- iconbutton control height from theme size layers\nimport { useUnistyles } from 'react-native-unistyles';\nimport { useAnimatedTheme, useAnimatedVariantColor } from 'react-native-unistyles/reanimated';\n\nimport type { StyleProps } from '../../generated/styles';\nimport { buttonStyles, iconButtonStyles, styles as foundationStyles } from '../../generated/styles';\nimport { BUTTON_SPRING_CONFIG, SCALE_EFFECTS } from '../motion';\nimport { getIconButtonControlMetrics } from './Button/buttonTheme';\nimport type { IconName } from './Icon';\nimport { Icon } from './Icon';\nimport type { PressableProps } from './Pressable';\nimport { AnimatedPressable } from './Pressable';\n\n/* -------------------------------------------------------------------------- */\n/*                              Animation Helpers                              */\n/* -------------------------------------------------------------------------- */\n\nfunction interpolateShadowAlpha(shadow: string | undefined, alpha: number): string {\n  'worklet';\n  if (!shadow) {\n    return '';\n  }\n  if (alpha >= 1) {\n    return shadow;\n  }\n  if (alpha <= 0) {\n    return '';\n  }\n\n  return shadow.replace(/rgba\\(([^,]+),\\s*([^,]+),\\s*([^,]+),\\s*([^)]+)\\)/g, (_, r, g, b, a) => {\n    const newAlpha = parseFloat(a) * alpha;\n    return `rgba(${r}, ${g}, ${b}, ${newAlpha.toFixed(3)})`;\n  });\n}\n\n/* -------------------------------------------------------------------------- */\n/*                            IconButton Props                                 */\n/* -------------------------------------------------------------------------- */\n\ninterface IconButtonProps extends Omit<PressableProps, 'children'> {\n  /** Icon to render from the icons package */\n  name: IconName;\n  /** The visual style variant @default 'primary' */\n  variant?: ButtonVariantFlat;\n  /** The size of the button @default 'md' */\n  size?: IconButtonSize;\n  /** The icon style variant @default 'outline' */\n  iconVariant?: IconVariant;\n  /** Override the icon color token without changing the button variant tokens */\n  iconColor?: StyleProps['color'];\n  /** Shows a loading spinner and disables the button */\n  loading?: boolean;\n  /**\n   * Disable motion effects (scale on press, icon animations)\n   * @default false\n   */\n  disableEffects?: boolean;\n  /** Ref to the underlying View */\n  ref?: Ref<View>;\n}\n\n/* -------------------------------------------------------------------------- */\n/*                            IconButton Component                             */\n/* -------------------------------------------------------------------------- */\n\n/**\n * **An icon button element that can be used to trigger an action**\n *\n * @description\n * An icon-only button for actions where space is limited. Features animated\n * scale effect on press and smooth color transitions matching the web UDS\n * IconButton behavior.\n *\n * @category Interactive\n * @platform mobile\n *\n * @example\n * ```tsx\n * import { IconButton } from '@yahoo/uds-mobile/IconButton';\n *\n * <IconButton name=\"Add\" onPress={() => console.log('pressed')} />\n * <IconButton name=\"Close\" variant=\"secondary\" size=\"sm\" />\n * <IconButton name=\"Settings\" loading />\n * ```\n *\n * @usage\n * - Use for toolbar actions\n * - Use for closing modals/dialogs\n * - Always provide accessibilityLabel for screen readers\n *\n * @accessibility\n * - Sets `accessibilityRole=\"button\"` automatically\n * - Announces loading state to screen readers\n * - **Always** provide `accessibilityLabel` since there's no visible text\n *\n * @see {@link Button} for buttons with text labels\n * @see {@link Icon} for non-interactive icons\n */\nconst IconButton = memo(function IconButton({\n  name,\n  variant = 'primary',\n  size = 'md',\n  iconVariant = 'outline',\n  iconColor,\n  loading,\n  disabled,\n  style,\n  accessibilityLabel,\n  accessibilityHint,\n  disableEffects = false,\n  onPressIn,\n  onPressOut,\n  ref,\n  ...props\n}: IconButtonProps) {\n  const isDisabled = disabled || loading;\n  const shouldAnimate = !disableEffects && !isDisabled;\n\n  const { theme } = useUnistyles();\n  const { controlHeight } = useMemo(() => getIconButtonControlMetrics(theme, size), [theme, size]);\n  const matchedControlDimensions =\n    controlHeight > 0 ? ({ height: controlHeight, width: controlHeight } as const) : undefined;\n\n  /* --------------------------------- State ---------------------------------- */\n  const [pressed, setPressed] = useState(false);\n\n  // Apply layer-based styles with compound variant support\n  iconButtonStyles.useVariants({ size });\n  buttonStyles.useVariants({ variant, disabled: isDisabled, pressed });\n  foundationStyles.useVariants({ color: iconColor });\n\n  const resolvedIconColor = iconColor\n    ? (foundationStyles.foundation.color as string | undefined)\n    : undefined;\n\n  // Animate colors using Unistyles' useAnimatedVariantColor\n  const backgroundColor = useAnimatedVariantColor(buttonStyles.root, 'backgroundColor');\n  const borderColor = useAnimatedVariantColor(buttonStyles.root, 'borderColor');\n\n  // Get animated theme for boxShadow\n  const animatedTheme = useAnimatedTheme();\n\n  /* ------------------------------- Animation -------------------------------- */\n  const scale = useSharedValue<number>(SCALE_EFFECTS.none);\n\n  const handlePressIn = useCallback<NonNullable<PressableProps['onPressIn']>>(\n    (event) => {\n      setPressed(true);\n      if (shouldAnimate) {\n        scale.value = withSpring(SCALE_EFFECTS.down, BUTTON_SPRING_CONFIG);\n      }\n      onPressIn?.(event);\n    },\n    [shouldAnimate, scale, onPressIn],\n  );\n\n  const handlePressOut = useCallback<NonNullable<PressableProps['onPressOut']>>(\n    (event) => {\n      setPressed(false);\n      if (shouldAnimate) {\n        scale.value = withSpring(SCALE_EFFECTS.none, BUTTON_SPRING_CONFIG);\n      }\n      onPressOut?.(event);\n    },\n    [shouldAnimate, scale, onPressOut],\n  );\n\n  const a11yState = useMemo(() => ({ disabled: isDisabled, busy: loading }), [isDisabled, loading]);\n\n  /* --------------------------------- Styles --------------------------------- */\n  // Animate pressed state for shadow\n  const pressProgress = useDerivedValue(\n    () => withTiming(pressed ? 1 : 0, { duration: 220, easing: Easing.bezier(0, 0, 0.2, 1) }),\n    [pressed],\n  );\n\n  // Animate using Unistyles' variant color system + boxShadow from theme\n  const animatedRootStyle = useAnimatedStyle(() => {\n    // Get boxShadow from theme using flattened path (no camelCase conversion needed!)\n    const components = animatedTheme.value.components as unknown as Record<\n      string,\n      Record<string, unknown>\n    >;\n    const shadowPressed = components[`button/variant/${variant}/root/pressed`]?.boxShadow as\n      | string\n      | undefined;\n\n    return {\n      transform: [{ scale: scale.value }],\n      backgroundColor: withTiming(backgroundColor.value, {\n        duration: 220,\n        easing: Easing.bezier(0, 0, 0.2, 1),\n      }),\n      borderColor: withTiming(borderColor.value, {\n        duration: 220,\n        easing: Easing.bezier(0, 0, 0.2, 1),\n      }),\n      // Only animate shadow if the theme defines one for this variant\n      ...(shadowPressed && {\n        boxShadow: interpolateShadowAlpha(shadowPressed, pressProgress.value),\n      }),\n    };\n  });\n\n  /* --------------------------------- Render --------------------------------- */\n  return (\n    <AnimatedPressable\n      ref={ref}\n      disabled={isDisabled}\n      onPressIn={handlePressIn}\n      onPressOut={handlePressOut}\n      flexDirection=\"row\"\n      alignItems=\"center\"\n      justifyContent=\"center\"\n      overflow=\"hidden\"\n      accessibilityLabel={loading ? `${accessibilityLabel ?? ''}, loading` : accessibilityLabel}\n      accessibilityHint={accessibilityHint}\n      accessibilityRole=\"button\"\n      accessibilityState={a11yState}\n      style={[\n        iconButtonStyles.root,\n        buttonStyles.root,\n        matchedControlDimensions,\n        foundationStyles.foundation,\n        animatedRootStyle,\n        typeof style === 'function' ? style({ pressed }) : style,\n      ]}\n      {...props}\n    >\n      {loading ? (\n        <ActivityIndicator\n          size={iconButtonStyles.icon.fontSize}\n          color={resolvedIconColor ?? buttonStyles.icon.color}\n        />\n      ) : (\n        <Icon\n          name={name}\n          variant={iconVariant}\n          style={[iconButtonStyles.icon, buttonStyles.icon]}\n          dangerouslySetColor={resolvedIconColor}\n        />\n      )}\n    </AnimatedPressable>\n  );\n});\n\nIconButton.displayName = 'IconButton';\n\nexport { IconButton, type IconButtonProps };\n"],"mappings":"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"}

package/fonts/index.cjs

@@ -1,270 +1,279 @@
 
-module.exports.fonts = [
-  require.resolve('@yahoo/uds-mobile/fonts/yas-regular-italic.otf'),
+const fonts = [];
+
+try {
+  fonts.push(require.resolve('@yahoo/uds-icons/generated/font/uds-icons.ttf'));
+} catch {
+  // @yahoo/uds-icons is optional unless icon components are used.
+}
+
+fonts.push(
   require.resolve('@yahoo/uds-mobile/fonts/centra-no2-black-italic.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yas-condensed-medium-italic.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yahoo-sans-light.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yas-light-italic.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yas-condensed-bold-italic.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yas-extended-semibold-italic.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yahoo-serif-display-light.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/gelica-bold.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/gelica-light-italic.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/gelica-bold-italic.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/gelica-medium-italic.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yahoo-sans-condensed-regular.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yas-medium.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yahoo-serif-display-extrabold.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yahoo-sans-regular-italic.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/centra-no2-black.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/centra-no2-bold-italic.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/centra-no2-bold.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/centra-no2-book-italic.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/centra-no2-book.otf'),
   require.resolve('@yahoo/uds-mobile/fonts/centra-no2-extrabold-italic.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yahoo-sans-extrabold.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yahoo-serif-display-regular.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yas-condensed-light.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yas-light.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yas-condensed-black.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/gelica-light.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yahoo-product-sans-medium.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yas-condensed-semibold.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yas-condensed-semibold-italic.otf'),
   require.resolve('@yahoo/uds-mobile/fonts/centra-no2-extrabold.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yahoo-sans-regular.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/centra-no2-hairline-italic.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/centra-no2-hairline.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/centra-no2-light-italic.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/centra-no2-light.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/centra-no2-medium-italic.otf'),
   require.resolve('@yahoo/uds-mobile/fonts/centra-no2-medium.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yahoo-sans-semibold.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yas-extended-regular-italic.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/centra-no2-thin-italic.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/centra-no2-thin.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/gelica-black-italic.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/gelica-black.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/gelica-bold-italic.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/gelica-bold.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/gelica-extra-light-italic.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/gelica-extra-light.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/gelica-light-italic.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/gelica-light.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/gelica-medium-italic.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/gelica-medium.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/gelica-regular-italic.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/gelica-regular.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/gelica-semi-bold-italic.otf'),
   require.resolve('@yahoo/uds-mobile/fonts/gelica-semi-bold.otf'),
   require.resolve('@yahoo/uds-mobile/fonts/yahoo-product-sans-bold.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yas-condensed-black-italic.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yas-extended-bold-italic.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yahoo-product-sans-medium.otf'),
   require.resolve('@yahoo/uds-mobile/fonts/yahoo-product-sans-regular.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yahoo-sans-black.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yas-extended-light-italic.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yas-extended-black.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yahoo-sans-beta-bold.otf'),
   require.resolve('@yahoo/uds-mobile/fonts/yahoo-sans-beta-medium.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/gelica-extra-light-italic.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yas-extended-bold.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yahoo-sans-condensed-light.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yas-medium-italic.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yas-black.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yas-extended-regular.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/gelica-black.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yahoo-sans-beta-regular.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yahoo-sans-black.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yahoo-sans-bold.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yahoo-sans-condensed-black.otf'),
   require.resolve('@yahoo/uds-mobile/fonts/yahoo-sans-condensed-bold.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yahoo-sans-condensed-light.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yahoo-sans-condensed-medium.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yahoo-sans-condensed-regular.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yahoo-sans-extrabold.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yahoo-sans-extralight.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yahoo-sans-italic.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yahoo-sans-light.otf'),
   require.resolve('@yahoo/uds-mobile/fonts/yahoo-sans-medium.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yahoo-sans-beta-bold.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yas-extended-medium.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yas-extended-light.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/centra-no2-light.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/centra-no2-light-italic.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yahoo-serif-text-bold.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yas-semibold.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/centra-no2-hairline-italic.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/centra-no2-book-italic.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/centra-no2-thin.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yahoo-sans-regular-italic.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yahoo-sans-regular.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yahoo-sans-semibold.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yahoo-serif-display-black.otf'),
   require.resolve('@yahoo/uds-mobile/fonts/yahoo-serif-display-bold.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/gelica-medium.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yas-regular.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/gelica-black-italic.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/centra-no2-black.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/centra-no2-medium-italic.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yahoo-sans-bold.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yahoo-serif-display-extrabold.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yahoo-serif-display-light.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yahoo-serif-display-regular.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yahoo-serif-text-bold.otf'),
   require.resolve('@yahoo/uds-mobile/fonts/yahoo-serif-text-italic.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yas-condensed-regular-italic.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yas-semibold-italic.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yas-condensed-medium.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yahoo-sans-condensed-black.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/centra-no2-bold.otf'),
   require.resolve('@yahoo/uds-mobile/fonts/yahoo-serif-text-regular.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yas-extended-medium-italic.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yahoo-serif-display-black.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yahoo-sans-extralight.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yas-extended-black-italic.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/gelica-regular.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yas-extended-semibold.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yas-condensed-regular.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/centra-no2-bold-italic.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yas-bold-italic.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yahoo-sans-italic.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yahoo-sans-beta-regular.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/gelica-semi-bold-italic.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/gelica-extra-light.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yas-condensed-light-italic.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yahoo-sans-condensed-medium.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yas-condensed-bold.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/centra-no2-book.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/centra-no2-thin-italic.otf'),
   require.resolve('@yahoo/uds-mobile/fonts/yas-black-italic.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yas-black.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yas-bold-italic.otf'),
   require.resolve('@yahoo/uds-mobile/fonts/yas-bold.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/centra-no2-hairline.otf'),
-  require.resolve('@yahoo/uds-mobile/fonts/gelica-regular-italic.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yas-condensed-black-italic.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yas-condensed-black.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yas-condensed-bold-italic.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yas-condensed-bold.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yas-condensed-light-italic.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yas-condensed-light.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yas-condensed-medium-italic.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yas-condensed-medium.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yas-condensed-regular-italic.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yas-condensed-regular.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yas-condensed-semibold-italic.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yas-condensed-semibold.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yas-extended-black-italic.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yas-extended-black.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yas-extended-bold-italic.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yas-extended-bold.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yas-extended-light-italic.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yas-extended-light.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yas-extended-medium-italic.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yas-extended-medium.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yas-extended-regular-italic.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yas-extended-regular.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yas-extended-semibold-italic.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yas-extended-semibold.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yas-light-italic.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yas-light.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yas-medium-italic.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yas-medium.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yas-regular-italic.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yas-regular.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yas-semibold-italic.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yas-semibold.otf'),
+  require.resolve('@yahoo/uds-mobile/fonts/inter-black.ttf'),
+  require.resolve('@yahoo/uds-mobile/fonts/inter-bold.ttf'),
+  require.resolve('@yahoo/uds-mobile/fonts/inter-extra-bold.ttf'),
+  require.resolve('@yahoo/uds-mobile/fonts/inter-extra-light.ttf'),
   require.resolve('@yahoo/uds-mobile/fonts/inter-light.ttf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yahoo-product-sans-extended-bold.ttf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yahoo-serif-text-bold-italic.ttf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yahoo-sans-cr4-medium.ttf'),
-  require.resolve('@yahoo/uds-mobile/fonts/roboto-mono-bold-italic.ttf'),
   require.resolve('@yahoo/uds-mobile/fonts/inter-medium.ttf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yahoo-product-sans-extended-bold-italic.ttf'),
-  require.resolve('@yahoo/uds-mobile/fonts/inter-extra-light.ttf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yahoo-product-sans-extended-black-italic.ttf'),
-  require.resolve('@yahoo/uds-mobile/fonts/inter-bold.ttf'),
-  require.resolve('@yahoo/uds-mobile/fonts/roboto-mono-thin-italic.ttf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yahoo-product-sans-extended-medium.ttf'),
-  require.resolve('@yahoo/uds-mobile/fonts/inter-thin.ttf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yahoo-sans-cr4-regular.ttf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yahoo-sans-cr4-bold.ttf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yahoo-product-sans-extended-semibold-italic.ttf'),
-  require.resolve('@yahoo/uds-mobile/fonts/roboto-mono-regular.ttf'),
   require.resolve('@yahoo/uds-mobile/fonts/inter-regular.ttf'),
-  require.resolve('@yahoo/uds-mobile/fonts/uds-icons.ttf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yahoo-product-sans-extended-semibold.ttf'),
-  require.resolve('@yahoo/uds-mobile/fonts/roboto-mono-regular-italic.ttf'),
+  require.resolve('@yahoo/uds-mobile/fonts/inter-semi-bold.ttf'),
+  require.resolve('@yahoo/uds-mobile/fonts/inter-thin.ttf'),
+  require.resolve('@yahoo/uds-mobile/fonts/roboto-mono-bold-italic.ttf'),
+  require.resolve('@yahoo/uds-mobile/fonts/roboto-mono-bold.ttf'),
   require.resolve('@yahoo/uds-mobile/fonts/roboto-mono-light-italic.ttf'),
+  require.resolve('@yahoo/uds-mobile/fonts/roboto-mono-light.ttf'),
+  require.resolve('@yahoo/uds-mobile/fonts/roboto-mono-medium-italic.ttf'),
+  require.resolve('@yahoo/uds-mobile/fonts/roboto-mono-medium.ttf'),
+  require.resolve('@yahoo/uds-mobile/fonts/roboto-mono-regular-italic.ttf'),
+  require.resolve('@yahoo/uds-mobile/fonts/roboto-mono-regular.ttf'),
+  require.resolve('@yahoo/uds-mobile/fonts/roboto-mono-thin-italic.ttf'),
   require.resolve('@yahoo/uds-mobile/fonts/roboto-mono-thin.ttf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yahoo-product-sans-extended-black-italic.ttf'),
   require.resolve('@yahoo/uds-mobile/fonts/yahoo-product-sans-extended-black.ttf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yahoo-product-sans-extended-regular.ttf'),
-  require.resolve('@yahoo/uds-mobile/fonts/roboto-mono-medium.ttf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yahoo-sans-condensed-xbold.ttf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yahoo-product-sans-extended-bold-italic.ttf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yahoo-product-sans-extended-bold.ttf'),
   require.resolve('@yahoo/uds-mobile/fonts/yahoo-product-sans-extended-light-italic.ttf'),
-  require.resolve('@yahoo/uds-mobile/fonts/roboto-mono-bold.ttf'),
-  require.resolve('@yahoo/uds-mobile/fonts/inter-semi-bold.ttf'),
-  require.resolve('@yahoo/uds-mobile/fonts/roboto-mono-light.ttf'),
-  require.resolve('@yahoo/uds-mobile/fonts/inter-black.ttf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yahoo-product-sans-extended-medium-italic.ttf'),
   require.resolve('@yahoo/uds-mobile/fonts/yahoo-product-sans-extended-light.ttf'),
-  require.resolve('@yahoo/uds-mobile/fonts/inter-extra-bold.ttf'),
-  require.resolve('@yahoo/uds-mobile/fonts/roboto-mono-medium-italic.ttf'),
-  require.resolve('@yahoo/uds-mobile/fonts/yahoo-product-sans-extended-regular-italic.ttf')
-];
+  require.resolve('@yahoo/uds-mobile/fonts/yahoo-product-sans-extended-medium-italic.ttf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yahoo-product-sans-extended-medium.ttf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yahoo-product-sans-extended-regular-italic.ttf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yahoo-product-sans-extended-regular.ttf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yahoo-product-sans-extended-semibold-italic.ttf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yahoo-product-sans-extended-semibold.ttf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yahoo-sans-condensed-xbold.ttf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yahoo-sans-cr4-bold.ttf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yahoo-sans-cr4-medium.ttf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yahoo-sans-cr4-regular.ttf'),
+  require.resolve('@yahoo/uds-mobile/fonts/yahoo-serif-text-bold-italic.ttf')
+);
+
+module.exports.fonts = fonts;
 
 module.exports.fontAliasToPostscript = {
   "uds-icons": "uds-icons",
-  "yas-regular-italic": "YASans-Italic",
   "centra-no2-black-italic": "CentraNo2-BlackItalic",
-  "yas-condensed-medium-italic": "YASansCn-MediumItalic",
-  "yahoo-sans-light": "YahooSans-Light",
-  "yas-light-italic": "YASans-LightItalic",
-  "yas-condensed-bold-italic": "YASansCn-BoldItalic",
-  "yas-extended-semibold-italic": "YASansExt-SmBdItalic",
-  "yahoo-serif-display-light": "YahooSerifDisplay-Light",
-  "gelica-bold": "Gelica-Bold",
-  "gelica-light-italic": "Gelica-LightItalic",
-  "gelica-bold-italic": "Gelica-BoldItalic",
-  "gelica-medium-italic": "Gelica-MediumItalic",
-  "yahoo-sans-condensed-regular": "YahooSansCond-Regular",
-  "yas-medium": "YASans-Medium",
-  "yahoo-serif-display-extrabold": "YahooSerifDisplay-Extrabold",
-  "yahoo-sans-regular-italic": "YahooSans-Italic",
+  "centra-no2-black": "CentraNo2-Black",
+  "centra-no2-bold-italic": "CentraNo2-BoldItalic",
+  "centra-no2-bold": "CentraNo2-Bold",
+  "centra-no2-book-italic": "CentraNo2-BookItalic",
+  "centra-no2-book": "CentraNo2-Book",
   "centra-no2-extrabold-italic": "CentraNo2-ExtraBoldItalic",
-  "yahoo-sans-extrabold": "YahooSans-ExtraBold",
-  "yahoo-serif-display-regular": "YahooSerifDisplay-Regular",
-  "yas-condensed-light": "YASansCn-Light",
-  "yas-light": "YASans-Light",
-  "yas-condensed-black": "YASansCn-Black",
-  "gelica-light": "Gelica-Light",
-  "yahoo-product-sans-medium": "YahooProductSans-Medium",
-  "yas-condensed-semibold": "YASansCn-SmBd",
-  "yas-condensed-semibold-italic": "YASansCn-SmBdItalic",
   "centra-no2-extrabold": "CentraNo2-ExtraBold",
-  "yahoo-sans-regular": "YahooSans-Regular",
+  "centra-no2-hairline-italic": "CentraNo2-HairlineItalic",
+  "centra-no2-hairline": "CentraNo2-Hairline",
+  "centra-no2-light-italic": "CentraNo2-LightItalic",
+  "centra-no2-light": "CentraNo2-Light",
+  "centra-no2-medium-italic": "CentraNo2-MediumItalic",
   "centra-no2-medium": "CentraNo2-Medium",
-  "yahoo-sans-semibold": "YahooSans-Semibold",
-  "yas-extended-regular-italic": "YASansExt-Italic",
+  "centra-no2-thin-italic": "CentraNo2-ThinItalic",
+  "centra-no2-thin": "CentraNo2-Thin",
+  "gelica-black-italic": "Gelica-BlackItalic",
+  "gelica-black": "Gelica-Black",
+  "gelica-bold-italic": "Gelica-BoldItalic",
+  "gelica-bold": "Gelica-Bold",
+  "gelica-extra-light-italic": "Gelica-ExtraLightItalic",
+  "gelica-extra-light": "Gelica-ExtraLight",
+  "gelica-light-italic": "Gelica-LightItalic",
+  "gelica-light": "Gelica-Light",
+  "gelica-medium-italic": "Gelica-MediumItalic",
+  "gelica-medium": "Gelica-Medium",
+  "gelica-regular-italic": "Gelica-Italic",
+  "gelica-regular": "Gelica-Regular",
+  "gelica-semi-bold-italic": "Gelica-SemiBoldItalic",
   "gelica-semi-bold": "Gelica-SemiBold",
   "yahoo-product-sans-bold": "YahooProductSans-Bold",
-  "yas-condensed-black-italic": "YASansCn-BlackItalic",
-  "yas-extended-bold-italic": "YASansExt-BoldItalic",
+  "yahoo-product-sans-medium": "YahooProductSans-Medium",
   "yahoo-product-sans-regular": "YahooProductSans",
-  "yahoo-sans-black": "YahooSans-Black",
-  "yas-extended-light-italic": "YASansExt-LightItalic",
-  "yas-extended-black": "YASansExt-Black",
+  "yahoo-sans-beta-bold": "YahooCR2BETA-Bold",
   "yahoo-sans-beta-medium": "YahooCR2BETA-Medium",
-  "gelica-extra-light-italic": "Gelica-ExtraLightItalic",
-  "yas-extended-bold": "YASansExt-Bold",
-  "yahoo-sans-condensed-light": "YahooSansCond-Light",
-  "yas-medium-italic": "YASans-MediumItalic",
-  "yas-black": "YASans-Black",
-  "yas-extended-regular": "YASansExt",
-  "gelica-black": "Gelica-Black",
+  "yahoo-sans-beta-regular": "YahooCR2BETA-Regular",
+  "yahoo-sans-black": "YahooSans-Black",
+  "yahoo-sans-bold": "YahooSans-Bold",
+  "yahoo-sans-condensed-black": "YahooSansCond-Black",
   "yahoo-sans-condensed-bold": "YahooSansCond-Bold",
+  "yahoo-sans-condensed-light": "YahooSansCond-Light",
+  "yahoo-sans-condensed-medium": "YahooSansCond-Medium",
+  "yahoo-sans-condensed-regular": "YahooSansCond-Regular",
+  "yahoo-sans-extrabold": "YahooSans-ExtraBold",
+  "yahoo-sans-extralight": "YahooSans-ExtraLight",
+  "yahoo-sans-italic": "YahooSans-Italic",
+  "yahoo-sans-light": "YahooSans-Light",
   "yahoo-sans-medium": "YahooSans-Medium",
-  "yahoo-sans-beta-bold": "YahooCR2BETA-Bold",
-  "yas-extended-medium": "YASansExt-Medium",
-  "yas-extended-light": "YASansExt-Light",
-  "centra-no2-light": "CentraNo2-Light",
-  "centra-no2-light-italic": "CentraNo2-LightItalic",
-  "yahoo-serif-text-bold": "YahooSerifText-Bold",
-  "yas-semibold": "YASans-SmBd",
-  "centra-no2-hairline-italic": "CentraNo2-HairlineItalic",
-  "centra-no2-book-italic": "CentraNo2-BookItalic",
-  "centra-no2-thin": "CentraNo2-Thin",
+  "yahoo-sans-regular-italic": "YahooSans-Italic",
+  "yahoo-sans-regular": "YahooSans-Regular",
+  "yahoo-sans-semibold": "YahooSans-Semibold",
+  "yahoo-serif-display-black": "YahooSerifDisplay-Black",
   "yahoo-serif-display-bold": "YahooSerifDisplay-Bold",
-  "gelica-medium": "Gelica-Medium",
-  "yas-regular": "YASans",
-  "gelica-black-italic": "Gelica-BlackItalic",
-  "centra-no2-black": "CentraNo2-Black",
-  "centra-no2-medium-italic": "CentraNo2-MediumItalic",
-  "yahoo-sans-bold": "YahooSans-Bold",
+  "yahoo-serif-display-extrabold": "YahooSerifDisplay-Extrabold",
+  "yahoo-serif-display-light": "YahooSerifDisplay-Light",
+  "yahoo-serif-display-regular": "YahooSerifDisplay-Regular",
+  "yahoo-serif-text-bold": "YahooSerifText-Bold",
   "yahoo-serif-text-italic": "YahooSerifText-Italic",
-  "yas-condensed-regular-italic": "YASansCn-Italic",
-  "yas-semibold-italic": "YASans-SmBdItalic",
-  "yas-condensed-medium": "YASansCn-Medium",
-  "yahoo-sans-condensed-black": "YahooSansCond-Black",
-  "centra-no2-bold": "CentraNo2-Bold",
   "yahoo-serif-text-regular": "YahooSerifText-Regular",
-  "yas-extended-medium-italic": "YASansExt-MediumItalic",
-  "yahoo-serif-display-black": "YahooSerifDisplay-Black",
-  "yahoo-sans-extralight": "YahooSans-ExtraLight",
-  "yas-extended-black-italic": "YASansExt-BlackItalic",
-  "gelica-regular": "Gelica-Regular",
-  "yas-extended-semibold": "YASansExt-SmBd",
-  "yas-condensed-regular": "YASansCn",
-  "centra-no2-bold-italic": "CentraNo2-BoldItalic",
-  "yas-bold-italic": "YASans-BoldItalic",
-  "yahoo-sans-italic": "YahooSans-Italic",
-  "yahoo-sans-beta-regular": "YahooCR2BETA-Regular",
-  "gelica-semi-bold-italic": "Gelica-SemiBoldItalic",
-  "gelica-extra-light": "Gelica-ExtraLight",
-  "yas-condensed-light-italic": "YASansCn-LightItalic",
-  "yahoo-sans-condensed-medium": "YahooSansCond-Medium",
-  "yas-condensed-bold": "YASansCn-Bold",
-  "centra-no2-book": "CentraNo2-Book",
-  "centra-no2-thin-italic": "CentraNo2-ThinItalic",
   "yas-black-italic": "YASans-BlackItalic",
+  "yas-black": "YASans-Black",
+  "yas-bold-italic": "YASans-BoldItalic",
   "yas-bold": "YASans-Bold",
-  "centra-no2-hairline": "CentraNo2-Hairline",
-  "gelica-regular-italic": "Gelica-Italic",
+  "yas-condensed-black-italic": "YASansCn-BlackItalic",
+  "yas-condensed-black": "YASansCn-Black",
+  "yas-condensed-bold-italic": "YASansCn-BoldItalic",
+  "yas-condensed-bold": "YASansCn-Bold",
+  "yas-condensed-light-italic": "YASansCn-LightItalic",
+  "yas-condensed-light": "YASansCn-Light",
+  "yas-condensed-medium-italic": "YASansCn-MediumItalic",
+  "yas-condensed-medium": "YASansCn-Medium",
+  "yas-condensed-regular-italic": "YASansCn-Italic",
+  "yas-condensed-regular": "YASansCn",
+  "yas-condensed-semibold-italic": "YASansCn-SmBdItalic",
+  "yas-condensed-semibold": "YASansCn-SmBd",
+  "yas-extended-black-italic": "YASansExt-BlackItalic",
+  "yas-extended-black": "YASansExt-Black",
+  "yas-extended-bold-italic": "YASansExt-BoldItalic",
+  "yas-extended-bold": "YASansExt-Bold",
+  "yas-extended-light-italic": "YASansExt-LightItalic",
+  "yas-extended-light": "YASansExt-Light",
+  "yas-extended-medium-italic": "YASansExt-MediumItalic",
+  "yas-extended-medium": "YASansExt-Medium",
+  "yas-extended-regular-italic": "YASansExt-Italic",
+  "yas-extended-regular": "YASansExt",
+  "yas-extended-semibold-italic": "YASansExt-SmBdItalic",
+  "yas-extended-semibold": "YASansExt-SmBd",
+  "yas-light-italic": "YASans-LightItalic",
+  "yas-light": "YASans-Light",
+  "yas-medium-italic": "YASans-MediumItalic",
+  "yas-medium": "YASans-Medium",
+  "yas-regular-italic": "YASans-Italic",
+  "yas-regular": "YASans",
+  "yas-semibold-italic": "YASans-SmBdItalic",
+  "yas-semibold": "YASans-SmBd",
+  "inter-black": "InterVariable-TextBlack",
+  "inter-bold": "InterVariable-TextBold",
+  "inter-extra-bold": "InterVariable-TextExtraBold",
+  "inter-extra-light": "InterVariable-TextExtraLight",
   "inter-light": "InterVariable-TextLight",
-  "yahoo-product-sans-extended-bold": "YahooSans-Regular",
-  "yahoo-serif-text-bold-italic": "YahooSerifText-BoldItalic",
-  "yahoo-sans-cr4-medium": "YahooCR4BETA-VF",
-  "roboto-mono-bold-italic": "RobotoMono-BoldItalic",
   "inter-medium": "InterVariable-TextMedium",
-  "yahoo-product-sans-extended-bold-italic": "YahooSans-Regular",
-  "inter-extra-light": "InterVariable-TextExtraLight",
-  "yahoo-product-sans-extended-black-italic": "YahooSans-Regular",
-  "inter-bold": "InterVariable-TextBold",
-  "roboto-mono-thin-italic": "RobotoMono-ThinItalic",
-  "yahoo-product-sans-extended-medium": "YahooSans-Regular",
-  "inter-thin": "InterVariable-TextThin",
-  "yahoo-sans-cr4-regular": "YahooCR4BETA-VF",
-  "yahoo-sans-cr4-bold": "YahooCR4BETA-VF",
-  "yahoo-product-sans-extended-semibold-italic": "YahooSans-Regular",
-  "roboto-mono-regular": "RobotoMono-Regular",
   "inter-regular": "InterVariable-Text",
-  "yahoo-product-sans-extended-semibold": "YahooSans-Regular",
-  "roboto-mono-regular-italic": "RobotoMono-Italic",
+  "inter-semi-bold": "InterVariable-TextSemiBold",
+  "inter-thin": "InterVariable-TextThin",
+  "roboto-mono-bold-italic": "RobotoMono-BoldItalic",
+  "roboto-mono-bold": "RobotoMono-Bold",
   "roboto-mono-light-italic": "RobotoMono-LightItalic",
+  "roboto-mono-light": "RobotoMono-Light",
+  "roboto-mono-medium-italic": "RobotoMono-MediumItalic",
+  "roboto-mono-medium": "RobotoMono-Medium",
+  "roboto-mono-regular-italic": "RobotoMono-Italic",
+  "roboto-mono-regular": "RobotoMono-Regular",
+  "roboto-mono-thin-italic": "RobotoMono-ThinItalic",
   "roboto-mono-thin": "RobotoMono-Thin",
+  "yahoo-product-sans-extended-black-italic": "YahooSans-Regular",
   "yahoo-product-sans-extended-black": "YahooSans-Regular",
-  "yahoo-product-sans-extended-regular": "YahooSans-Regular",
-  "roboto-mono-medium": "RobotoMono-Medium",
-  "yahoo-sans-condensed-xbold": "YahooSansCond-Bold",
+  "yahoo-product-sans-extended-bold-italic": "YahooSans-Regular",
+  "yahoo-product-sans-extended-bold": "YahooSans-Regular",
   "yahoo-product-sans-extended-light-italic": "YahooSans-Regular",
-  "roboto-mono-bold": "RobotoMono-Bold",
-  "inter-semi-bold": "InterVariable-TextSemiBold",
-  "roboto-mono-light": "RobotoMono-Light",
-  "inter-black": "InterVariable-TextBlack",
-  "yahoo-product-sans-extended-medium-italic": "YahooSans-Regular",
   "yahoo-product-sans-extended-light": "YahooSans-Regular",
-  "inter-extra-bold": "InterVariable-TextExtraBold",
-  "roboto-mono-medium-italic": "RobotoMono-MediumItalic",
-  "yahoo-product-sans-extended-regular-italic": "YahooSans-Regular"
+  "yahoo-product-sans-extended-medium-italic": "YahooSans-Regular",
+  "yahoo-product-sans-extended-medium": "YahooSans-Regular",
+  "yahoo-product-sans-extended-regular-italic": "YahooSans-Regular",
+  "yahoo-product-sans-extended-regular": "YahooSans-Regular",
+  "yahoo-product-sans-extended-semibold-italic": "YahooSans-Regular",
+  "yahoo-product-sans-extended-semibold": "YahooSans-Regular",
+  "yahoo-sans-condensed-xbold": "YahooSansCond-Bold",
+  "yahoo-sans-cr4-bold": "YahooCR4BETA-VF",
+  "yahoo-sans-cr4-medium": "YahooCR4BETA-VF",
+  "yahoo-sans-cr4-regular": "YahooCR4BETA-VF",
+  "yahoo-serif-text-bold-italic": "YahooSerifText-BoldItalic"
 };