feat(ios): support condensed system font on fabric (#52259)

Summary:
This PR adds support for using the condensed system font on iOS when passing "SystemCondensed" as fontFamily. This behavior existed in the old architecture but was never ported to the new one, see [RCTFont.mm](https://github.com/facebook/react-native/blob/main/packages/react-native/React/Views/RCTFont.mm#L434) as reference. Fixes #52258.

## Changelog:

[IOS] [ADDED] - Add support for condensed system font when using the new react native architecture.

Pull Request resolved: #52259

Test Plan:
Before:
<img width="275" src="https://github.com/user-attachments/assets/8744a5ae-252c-46db-b5f9-b803f3e1c671" />

After:
<img width="275" src="https://github.com/user-attachments/assets/69ec27a3-5c9a-46e3-a80a-0e02b76d8813" />

Reviewed By: cortinico

Differential Revision: D82208140

Pulled By: javache

fbshipit-source-id: b23a97c94bf45144c3f0860c30e35cae88c7dc2f

Author: ismarbesic

packages/react-native/ReactCommon/react/renderer/textlayoutmanager/platform/ios/react/renderer/textlayoutmanager/RCTFontUtils.mm

@@ -252,8 +252,11 @@ static RCTFontStyle RCTGetFontStyle(UIFont *font)
   static std::mutex fontCacheMutex;
 
   CGFloat effectiveFontSize = fontProperties.sizeMultiplier * fontProperties.size;
-  NSString *cacheKey = [NSString
-      stringWithFormat:@"%.1f/%.2f/%ld", effectiveFontSize, fontProperties.weight, (long)fontProperties.style];
+  NSString *cacheKey = [NSString stringWithFormat:@"%@/%.1f/%.2f/%ld",
+                                                  fontProperties.family,
+                                                  effectiveFontSize,
+                                                  fontProperties.weight,
+                                                  (long)fontProperties.style];
   UIFont *font;
 
   {
@@ -267,11 +270,20 @@ static RCTFontStyle RCTGetFontStyle(UIFont *font)
   if (font == nullptr) {
     font = [UIFont systemFontOfSize:effectiveFontSize weight:fontProperties.weight];
 
-    if (fontProperties.style == RCTFontStyleItalic) {
+    BOOL isItalicFont = fontProperties.style == RCTFontStyleItalic;
+    BOOL isCondensedFont = [fontProperties.family isEqualToString:@"SystemCondensed"];
+
+    if (isItalicFont || isCondensedFont) {
       UIFontDescriptor *fontDescriptor = [font fontDescriptor];
       UIFontDescriptorSymbolicTraits symbolicTraits = fontDescriptor.symbolicTraits;
 
-      symbolicTraits |= UIFontDescriptorTraitItalic;
+      if (isItalicFont) {
+        symbolicTraits |= UIFontDescriptorTraitItalic;
+      }
+
+      if (isCondensedFont) {
+        symbolicTraits |= UIFontDescriptorTraitCondensed;
+      }
 
       fontDescriptor = [fontDescriptor fontDescriptorWithSymbolicTraits:symbolicTraits];
       font = [UIFont fontWithDescriptor:fontDescriptor size:effectiveFontSize];
@@ -333,7 +345,7 @@ static UIFontDescriptorSystemDesign RCTGetFontDescriptorSystemDesign(NSString *f
         fontWeight = (fontWeight != 0.0) ?: RCTGetFontWeight(font);
       } else {
         // Failback to system font.
-        font = [UIFont systemFontOfSize:effectiveFontSize weight:fontProperties.weight];
+        font = RCTDefaultFontWithFontProperties(fontProperties);
       }
     }
 

packages/rn-tester/js/examples/Text/TextExample.ios.js

@@ -577,42 +577,23 @@ const examples = [
     description:
       ('Shows system font families including system-ui/ui-sans-serif, ui-serif, ui-monospace, and ui-rounded': string),
     render: function (): React.Node {
+      const baseTextStyle = {fontSize: 20};
       return (
-        <View testID={'ios-font-families'}>
-          <Text
-            style={{
-              fontFamily: 'system-ui',
-              fontSize: 32,
-              marginBottom: 20,
-            }}>
-            `fontFamily: system-ui` (same as `ui-sans-serif`)
+        <View testID={'ios-font-families'} style={{gap: 10}}>
+          <Text style={{...baseTextStyle, fontFamily: 'system-ui'}}>
+            system-ui (same as ui-sans-serif)
           </Text>
-          <Text
-            style={{
-              fontFamily: 'ui-sans-serif',
-              fontSize: 32,
-              marginBottom: 20,
-            }}>
-            `fontFamily: ui-sans-serif` (same as `system-ui`)
+          <Text style={{...baseTextStyle, fontFamily: 'ui-sans-serif'}}>
+            ui-sans-serif (same as system-ui)
           </Text>
-          <Text
-            style={{fontFamily: 'ui-serif', fontSize: 32, marginBottom: 20}}>
-            `fontFamily: ui-serif`
+          <Text style={{...baseTextStyle, fontFamily: 'ui-serif'}}>
+            ui-serif
           </Text>
-          <Text
-            style={{
-              fontFamily: 'ui-monospace',
-              fontSize: 32,
-              marginBottom: 20,
-            }}>
-            `fontFamily: ui-monospace`
+          <Text style={{...baseTextStyle, fontFamily: 'ui-monospace'}}>
+            ui-monospace
           </Text>
-          <Text
-            style={{
-              fontFamily: 'ui-rounded',
-              fontSize: 32,
-            }}>
-            `fontFamily: ui-rounded`
+          <Text style={{...baseTextStyle, fontFamily: 'ui-rounded'}}>
+            ui-rounded
           </Text>
         </View>
       );
@@ -767,6 +748,7 @@ const examples = [
             }}>
             Verdana bold
           </Text>
+          <Text style={{fontFamily: 'SystemCondensed'}}>SystemCondensed</Text>
           <Text style={{fontFamily: 'Unknown Font Family'}}>
             Unknown Font Family
           </Text>