Description
When using a formSheet with sheetAllowedDetents: 'fitToContents' on iOS, setting the native header to transparent appears to leave extra unused height in the sheet.
With an opaque header, the sheet fits the header plus content. With a transparent header, the header overlays the content as expected, but the sheet still appears to reserve the native header height, leaving dead space below the content.
In the transparent example you can see space below elements which is inset + header
Native context:
Looking at the iOS implementation, fitToContents is based on the RNSScreenContentWrapper frame height, then adjusted by contentHeightErrata.
That errata is accumulated while walking parent view controllers and adds the height of visible RNSNavigationController.navigationBar instances. The check appears to account for navigationBar.isHidden, but not whether the header is transparent.
Steps to reproduce
- Clone and run the reproduction repository.
- Open the "Opaque header" sheet.
- Open the "Transparent header" sheet.
- Open the "Transparent + header padding" sheet.
- Compare the sheet content and the empty space below the last row.
Snack or a link to a repository
https://github.com/fabriziocucci/sheet-header-transparent-repro
Screens version
4.25.2
React Native version
0.86.0
Platforms
iOS
JavaScript runtime
Hermes
Workflow
Expo managed workflow
Architecture
Fabric (New Architecture)
Build type
Debug mode
Device
iOS simulator
Device model
iPhone 17 Pro Max simulator, iOS 26.2, Xcode 26.2
Acknowledgements
Yes
Description
When using a
formSheetwithsheetAllowedDetents: 'fitToContents'on iOS, setting the native header to transparent appears to leave extra unused height in the sheet.With an opaque header, the sheet fits the header plus content. With a transparent header, the header overlays the content as expected, but the sheet still appears to reserve the native header height, leaving dead space below the content.
Native context:
Looking at the iOS implementation,
fitToContentsis based on theRNSScreenContentWrapperframe height, then adjusted bycontentHeightErrata.That errata is accumulated while walking parent view controllers and adds the height of visible
RNSNavigationController.navigationBarinstances. The check appears to account fornavigationBar.isHidden, but not whether the header is transparent.Steps to reproduce
Snack or a link to a repository
https://github.com/fabriziocucci/sheet-header-transparent-repro
Screens version
4.25.2
React Native version
0.86.0
Platforms
iOS
JavaScript runtime
Hermes
Workflow
Expo managed workflow
Architecture
Fabric (New Architecture)
Build type
Debug mode
Device
iOS simulator
Device model
iPhone 17 Pro Max simulator, iOS 26.2, Xcode 26.2
Acknowledgements
Yes