Skip to content

feat(iOS): implement unstable_sheetFooter for formSheet#4253

Open
birkir wants to merge 1 commit into
software-mansion:mainfrom
birkir:feat/ios-fit-to-contents-footer
Open

feat(iOS): implement unstable_sheetFooter for formSheet#4253
birkir wants to merge 1 commit into
software-mansion:mainfrom
birkir:feat/ios-fit-to-contents-footer

Conversation

@birkir

@birkir birkir commented Jul 2, 2026

Copy link
Copy Markdown

Description

unstable_sheetFooter is currently Android-only — RNSScreenFooter.mm ships as a stub with the positioning logic commented out. This PR implements the iOS side, mirroring the contract of Android's ScreenFooter: the footer overlays the sheet content, pinned to the bottom edge of the sheet, and lifts above the keyboard when one appears. Consumers reserve space for it (when desired) by padding their scroll content; since it overlays, it can also serve as a surface for blur / scroll-edge effects layered over the content.

The abandoned constraint-based approach (the commented-out code) was replaced with frame pinning: Fabric assigns frames directly and fights Auto Layout, so the footer instead accepts Yoga's size and re-pins origin.y after every layout pass, from both directions:

  • updateLayoutMetrics: — React-driven writes (footer content resize, state updates), and
  • the parent RNSScreenView's layoutSubviews — UIKit-driven writes, which makes the footer track interactive detent drags natively since UISheetPresentationController resizes the presented view continuously during the gesture.

Keyboard handling is the counterpart of Android's WindowInsetsAnimationCompat callback: the footer computes the keyboard's overlap with the sheet (converted through the window, so floating / centered iPad sheets get correct geometry) and animates with the keyboard's own duration and curve.

Changes

  • ios/RNSScreenFooter.mm — implemented pinning, keyboard tracking, prepareForRecycle cleanup (replaces the stub).
  • ios/RNSScreenFooter.h — exposed updateFooterPosition.
  • ios/RNSScreen.h / ios/RNSScreen.mm — added findSheetFooter (analogous to findHeaderConfig) and a layoutSubviews override on RNSScreenView that re-pins the footer during UIKit-driven resizes.
  • src/types.tsx@platform android@platform android, ios on unstable_sheetFooter.
  • guides/GUIDE_FOR_LIBRARY_AUTHORS.md — removed the Android-only note, documented the overlay contract.

No new props, no codegen changes — the existing Fabric component registration is reused.

Test plan

  • Existing apps/src/tests/issue-tests/TestScreenFooterKeyboardInsets.tsx — now exercisable on iOS.
  • Existing apps/src/tests/issue-tests/TestFormSheet.tsx — the commented-out unstable_sheetFooter options can be enabled on iOS.
  • Field-tested in a production app (patched into 4.25.2) on iPhone 17 Pro and iPad Pro 11" (iOS 26): formSheet with fitToContents and detent arrays, footer pinned correctly at rest, during interactive detent drags, during sheet resize when footer content height changes, and above the keyboard; buttons at the sheet bottom remain tappable (frame-based pinning keeps UIKit hit-testing correct).

Checklist

  • Included code example that can be used to test this change.
  • For visual changes, included screenshots / GIFs / recordings documenting the change.
  • For API changes, updated relevant public types.
  • Ensured that CI passes

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant