fix(iOS): fullscreenmodal color scheme adaptability

apps/test-examples/App.js

@@ -96,6 +96,7 @@ import Test1844 from './src/Test1844';
 import Test1864 from './src/Test1864';
 import Test1970 from './src/Test1970';
 import Test1981 from './src/Test1981';
+import Test2002 from './src/Test2002';
 import Test2008 from './src/Test2008';
 import Test2028 from './src/Test2028';
 import Test2048 from './src/Test2048';

apps/test-examples/src/Test2002.tsx

@@ -0,0 +1,59 @@
+import * as React from 'react';
+import { View, Button, useColorScheme, StyleSheet } from 'react-native';
+import {
+  DarkTheme,
+  DefaultTheme,
+  NavigationContainer,
+} from '@react-navigation/native';
+import { createNativeStackNavigator } from '@react-navigation/native-stack';
+
+function HomeScreen({ navigation }) {
+  return (
+    <View style={styles.container}>
+      <Button
+        onPress={() => navigation.navigate('fullScreenModal')}
+        title="Open fullScreenModal"
+      />
+      <Button
+        onPress={() => navigation.navigate('formSheet')}
+        title="Open formSheet"
+      />
+    </View>
+  );
+}
+
+function ModalScreen({ navigation }) {
+  return (
+    <View style={styles.container}>
+      <Button onPress={() => navigation.goBack()} title="Dismiss" />
+    </View>
+  );
+}
+
+const RootStack = createNativeStackNavigator();
+
+export default function App() {
+  const scheme = useColorScheme();
+
+  return (
+    <NavigationContainer theme={scheme === 'dark' ? DarkTheme : DefaultTheme}>
+      <RootStack.Navigator>
+        <RootStack.Screen name="Home" component={HomeScreen} />
+        <RootStack.Screen
+          name="formSheet"
+          component={ModalScreen}
+          options={{ presentation: 'formSheet' }}
+        />
+        <RootStack.Screen
+          name="fullScreenModal"
+          component={ModalScreen}
+          options={{ presentation: 'fullScreenModal' }}
+        />
+      </RootStack.Navigator>
+    </NavigationContainer>
+  );
+}
+
+const styles = StyleSheet.create({
+  container: { flex: 1, alignItems: 'center', justifyContent: 'center' },
+});

ios/RNSModalScreen.mm

@@ -7,6 +7,26 @@
 
 @implementation RNSModalScreen
 
+// When using UIModalPresentationStyleFullScreen the views belonging to the presenting view controller are removed,
+// Thus there is no RCTRootView mounted and no trait observer working.
+// We have to set up an extra observer and send change notifications accoridngly
+// For more information, see https://github.com/software-mansion/react-native-screens/pull/2211.
+- (void)traitCollectionDidChange:(UITraitCollection *)previousTraitCollection
+{
+  [super traitCollectionDidChange:previousTraitCollection];
+  if (RCTSharedApplication().applicationState == UIApplicationStateBackground ||
+      (self.stackPresentation != RNSScreenStackPresentationFullScreenModal)) {
+    return;
+  }
+
+  [[NSNotificationCenter defaultCenter]
+      postNotificationName:RCTUserInterfaceStyleDidChangeNotification
+                    object:self
+                  userInfo:@{
+                    RCTUserInterfaceStyleDidChangeNotificationTraitCollectionKey : self.traitCollection,
+                  }];
+}
+
 #ifdef RCT_NEW_ARCH_ENABLED
 + (react::ComponentDescriptorProvider)componentDescriptorProvider
 {