Respect theme enforceNavigationBarContrast attribute

[zoontek]

Summary:

This PR adds respect of the theme's enforceNavigationBarContrast attribute in WindowUtil enableEdgeToEdge (this will allow us to delete our EdgeToEdgePackage.kt file, and prevent a glitch where the navigation bar is semi-opaque for a short instant when user explicitly set android:enforceNavigationBarContrast to false).

Changelog:

[ANDROID] [CHANGED] - Respect theme enforceNavigationBarContrast attribute

Test Plan:

• Verified edge-to-edge rendering on API 30+ (transparent status/navigation bars, correct display cutout behavior).
• Verified navigation bar contrast enforcement respects the theme attribute on API 29+ (with android:enforceNavigationBarContrast to true (default) and false).
• Verified fallback navigation bar colors on API 26-28 (light/dark scrim) and API < 26 (dark scrim).

[rachel11026725]

Please fix

[meta-codesync]

@alanleedev has imported this pull request. If you are a Meta employee, you can view this in D100384656.

[alanleedev]

With the new if conditional apps with android:enforceNavigationBarContrast="false" in a light theme will now get light icons on a light background (invisible). It was unconditionally set previously.

It wasn't clear if this was tested; enforceNavigationBarContrast="false" + light theme → nav button icons are still dark/visible

[zoontek]

@alanleedev That's the expected behavior. When android:enforceNavigationBarContrast is set to false, React Native should not update the navigation bar theme and should instead stick to the default (light, similar to the status bar). If we update the default based on the device theme when the user explicitly requests control over the navigation bar button color, it would no longer match the current StatusBar behavior (or the default value in its props stack - which is light in StatusBarModule).

The goal is to rely on external libraries to change the navigation bar theme (such as expo-navigation-bar), since a NavigationBar component is unlikely to ever land in React Native core:

export const App = () => (
  <>
    <StatusBar style="auto" />
    <NavigationBar style="auto" />
  </>
);

[zoontek]

It wasn't clear if this was tested; enforceNavigationBarContrast="false" + light theme → nav button icons are still dark/visible

Don't forget to set enforceNavigationBarContrast in both packages/rn-tester/android/app/src/main/res/values/styles.xml and packages/rn-tester/android/app/src/main/res/values-night/styles.xml to test in both light and dark mode, as those 2 files exist - even if values-night/styles.xml could be deleted, as it has the same content.

[alanleedev]

would be great if there are some screenshots

[zoontek]

@alanleedev Here is some screenshots, all of them has been made with the StatusBar component commented to preserve the default behavior:

return (
  <RNTesterThemeContext.Provider value={theme}>
    {/* {Platform.OS === 'android' ? (
      <StatusBar
        barStyle="dark-content"
        backgroundColor={theme.GroupedBackgroundColor}
      />
    ) : null} */}
    {/* … */}

Android 7 (DarkNavigationBarColor)

Android 9 (LightNavigationBarColor)

Android 14 - light mode

Android 14 - dark mode

Android 14 - light mode, android:enforceNavigationBarContrast set to false

Android 14 - dark mode, android:enforceNavigationBarContrast set to false