Open elliotcourant opened 1 year ago
Latest commit: 1b3571be6574a54b5a2899d5a9aa0fc2f0deae86
The changes in this PR will be included in the next version bump.
Not sure what this means? Click here to learn what changesets are.
Click here if you're a maintainer who wants to add another changeset to this PR
This pull request is automatically built and testable in CodeSandbox.
To see build info of the built libraries, click here or the icon next to each commit SHA.
Latest deployment of this branch, based on commit 1b3571be6574a54b5a2899d5a9aa0fc2f0deae86:
Sandbox | Source |
---|---|
react-codesandboxer-example | Configuration |
Each hover causes a re-render, causing the height to be recalculated.
https://github.com/JedWatson/react-select/assets/37967690/0ba12791-e393-4473-9f32-b53834172e9a
The menu will not be larger than the space available.
https://github.com/JedWatson/react-select/assets/37967690/86c1a732-769e-4605-8ced-cbc7cae9a158
If the viewSpaceBelow is less than 300px (default max height):
The first time the menu renders, the viewSpaceBelow will probably not be greater than the menuHeight. So it will take path 2. or 3. for bottom/auto. If the viewable area is greater than the minimum height then it will take path 3. On the next render, the menuHeight is now less than viewSpaceBelow because it was constrained by the third path. So the first path is taken, but preferredMaxHeight will be greater than viewSpaceBelow because path 3 was taken on the previous render. The menu renders but overflows outside the view. On the following render, path 1 is not taken because the height is greater than the viewSpaceBelow again (because its overflowing). So path 3 is taken again.
This resolves the potential for flickering by making sure that the size that would be rendered will actually fit. But comparing the
viewSpaceBelow
andscrollSpaceBelow
to themaxHeight
that would actually be returned, not to the height of the menu currently.TLDR; When the space the menu would be rendered in is less than the maxHeight, but greater than the minHeight; the menu will flicker because it alternates the maxHeight value because of how it checks space available. This changes it so that the check is against what the new height would be, instead of against what it is now.
If needed I can provide a video of the behavior; its absolutely possible I'm doing something wrong here. But the fact that
menuHeight
could be less thanpreferredMaxHeight
seems like this is still a bug.