yarn react-native-screens 4.30.0

5 hours ago

What's changed

This release focuses on iOS 27 and iPhone Duo support in Stack v4. On iOS 26+ screens are now laid out under an opaque navigation bar and inset through the safe area instead of UIKit's extended-layout frame and useHeaderHeight reports the visible height of the bar while it is minimized. The new unstable_safeAreaEdges prop on ScreenStackItem lets a screen override the insets applied on iOS 26+, and opaque headers no longer minimize on scroll. Tabs.Host gains prominentScreenKey (iOS 27+), backed by prominentTabIdentifier, so a chosen tab stays visible when the tab bar minimizes.


iOS 26+: opaque headers in native stack (iOS)

Starting with iOS 26, Apple recommends against custom navigation bar backgrounds. Bars are transparent by default and content is meant to extend under them - see WWDC25: Build a UIKit app with the new design. Opaque headers (headerTransparent: false) aren't deprecated, but UIKit's support for them is getting worse:

  • On iOS 26, edgesForExtendedLayout (which we used to lay out the screen below an opaque header) doesn't position the screen correctly in landscape and in modals. We partially worked around this with a SafeAreaView (#3231).
  • On iPhone Duo (iOS 27) the same problem affects regular screens in portrait. The screen ended up partially under the header. Additionally, changes to internal hierarchy of the header introduced new bugs related to Pressables.
  • An opaque header's background doesn't reach the top of the screen and leaves a strip above it. When this was reported on the Apple Developer Forums, Apple didn't treat it as a bug and pointed to the guidance against custom bar backgrounds instead.

Tip

We recommend following Apple's guidance and using a transparent header on iOS 26+.

✅ Improvements

  • feat(iOS, Tabs): add prominentScreenKey so a chosen tab stays visible when the tab bar minimizes (#4724)
  • feat(iOS, Stack v4): add unstable_safeAreaEdges prop (#4872)
  • feat(iOS, Stack v4): prevent header minimization for opaque header (#4873)

🐞 Bugfixes

  • fix: fix broken types being published for tabs host and screen (#4871)
  • fix(iOS, Stack v4): use native screen origin as shadow tree offset (#4725)
  • fix(iOS, Stack v4): lay out screens under an opaque navigation bar on iOS 26+ (#4757)
  • fix(iOS, Stack v4): update header subview positions after navigation bar layout on iOS 26+ (#4758)
  • fix(iOS, Stack v4): report minimized header height on iOS 27+ via useHeaderHeight (#4734)
  • fix(iOS, Tabs): don't drop user selection of UISearchTab on mount transactions (#4862)
  • fix(iOS, Tabs): apply async-loaded icons to tabs that overflow into More on the UITab path (#4889)
  • fix(iOS, Tabs): filter UIKit's didSelectTab: for programmatic selection while More is active (#4890)
  • fix(Android): prevent legacy and tabs containers from delaying child pressed state (#4771)

Don't miss a new react-native-screens release

NewReleases is sending notifications on new releases.