Skip to content

Conversation

@t0maboro
Copy link
Contributor

@t0maboro t0maboro commented Oct 27, 2025

Description

When using 3 detents, the size of the formSheet is calculated based on the screen size and does not respect the detents. In this PR, I add a maxHeight to SheetBehavior when using 3 detents, ensuring the sheet respects the detent configuration. I also did a minor refactor of this variable for consistency.

Note:
In the example, I'm adding more TCs for better regression testing, but only 3 detents were broken

Note:
With this PR i noticed that the formsheet doesn't respect system bars, I started working on that issue separately: #3336

Fixes https://github.com/software-mansion/react-native-screens-labs/issues/458

Changes

  • Added maxHeight for sheetBehavior with 3 detents

Screenshots / GIFs

Here you can add screenshots / GIFs documenting your change.

You can add before / after section if you're changing some behavior.

Before

before.mov

After

after.mov

Test code and steps to reproduce

Added a new example for regression testing - with more examples than just the failing one, just in case.

Checklist

  • Included code example that can be used to test this change
  • Ensured that CI passes

Copy link
Contributor

@kligarski kligarski left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks good.

@t0maboro t0maboro force-pushed the @t0maboro/form-sheet-3-detents-flex-end branch from 2ec13af to 1b0b681 Compare November 7, 2025 14:35
Copy link
Member

@kkafar kkafar left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't have any functional remarks. Good job on that front. But some stylistic nitpicks here 👇🏻 When we get this cleaned up, we can proceed.

Will be nitpicking here hard, but I see some code refactored & inconsistencies introduced.

Btw. if we have a small data structure for the detents we could solve this cleaner.

@t0maboro
Copy link
Contributor Author

t0maboro commented Nov 7, 2025

Btw. if we have a small data structure for the detents we could solve this cleaner.

I remember about that, but unfortunately I haven't a capacity to focus on it yet https://github.com/software-mansion/react-native-screens-labs/issues/536

@t0maboro t0maboro requested a review from kkafar November 7, 2025 15:02
Copy link
Member

@kkafar kkafar left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks good now. Great job. Thanks! ✅

@t0maboro t0maboro merged commit f246b6a into main Nov 7, 2025
5 checks passed
@t0maboro t0maboro deleted the @t0maboro/form-sheet-3-detents-flex-end branch November 7, 2025 16:40
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.

4 participants