Skip to content

Commit 884f89d

Browse files
committedNov 29, 2022
fix: Fix bottomSheet height if the content is pretty small
If the innerContent is smaller than the mediumHeight, we don't want the BottomSheet to take all the available space. We want to take only the needed place.
1 parent e8b3091 commit 884f89d

File tree

2 files changed

+12
-2
lines changed

2 files changed

+12
-2
lines changed
 

‎react/BottomSheet/helpers.js

+1-2
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,6 @@ export const computeMediumHeight = ({
2626
}) => {
2727
const mediumHeightOrWithRatio =
2828
mediumHeight || Math.round(maxHeight * mediumHeightRatio)
29-
3029
if (backdrop) {
3130
if (mediumHeightOrWithRatio < innerContentHeight) {
3231
return mediumHeightOrWithRatio < maxHeight
@@ -35,7 +34,7 @@ export const computeMediumHeight = ({
3534
}
3635
return innerContentHeight > maxHeight ? maxHeight : innerContentHeight
3736
}
38-
37+
if (innerContentHeight < mediumHeightOrWithRatio) return innerContentHeight
3938
return mediumHeightOrWithRatio > maxHeight
4039
? maxHeight
4140
: mediumHeightOrWithRatio

‎react/BottomSheet/helpers.spec.js

+11
Original file line numberDiff line numberDiff line change
@@ -57,6 +57,17 @@ describe('computeMediumHeight', () => {
5757

5858
expect(res).toBe(800)
5959
})
60+
61+
it('should return the innerContentHeight if innerContentHeight < mediumHeight', () => {
62+
const res = computeMediumHeight({
63+
backdrop: false,
64+
maxHeight: 800,
65+
mediumHeight: 400,
66+
innerContentHeight: 200
67+
})
68+
69+
expect(res).toBe(200)
70+
})
6071
})
6172

6273
describe('with backdrop', () => {

0 commit comments

Comments
 (0)
Please sign in to comment.