[Bug]: Switching keyboard types triggers unwanted close

[goncalo1995]

Version

v5

Reanimated Version

v3

Gesture Handler Version

v2

Platforms

iOS

What happened?

Switching from text input to a numeric input (not the other way around) is cause the modal to close. I could not test in Android but happens in iOS.

Reproduction steps

Could not make BottomSheetModal show in expo snack, this bug happens in my development build.

How to reproduce the bug:

1. Run this in Expo or bare React Native with @gorhom/bottom-sheet v4.4.5.
2. Open the sheet, focus the text input, then switch to the numeric input.

Example modal that causes the unwanted close:
<BottomSheetModal
ref={sheetRef}
index={0}
snapPoints={snapPoints}
onDismiss={() => console.log("Sheet dismissed")}
keyboardBehavior="interactive"
keyboardBlurBehavior="restore"
enablePanDownToClose={false}
>
{/* Use BottomSheetScrollView or BottomSheetView */}
<BottomSheetScrollView contentContainerStyle={{ padding: 20 }}>
<Text style={{ marginBottom: 10 }}>Text Input:
<BottomSheetTextInput
style={{
borderWidth: 1,
borderColor: "#ccc",
padding: 10,
marginBottom: 20,
borderRadius: 5,
}}
placeholder="Text input"
value={textValue}
onChangeText={setTextValue}
/>

      <Text style={{ marginBottom: 10 }}>Numeric Input:</Text>
      <BottomSheetTextInput
        style={{
          borderWidth: 1,
          borderColor: "#ccc",
          padding: 10,
          borderRadius: 5,
        }}
        placeholder="Numeric input"
        value={numberValue}
        onChangeText={setNumberValue}
        keyboardType="numeric"
      />
    </BottomSheetScrollView>
  </BottomSheetModal>

Reproduction sample

https://snack.expo.dev/@cereja/mixed-inputs-bug-bottomsheet

Relevant log output

[devshahoriar]

2025-08-25.07-11-09.mp4

how to solve this?

[shubhams-york]

+1

[ertucaglar]

+1

I have the same issue, the keyboard closes as soon as it is opened, if dynamic size is enabled

[eetzuh]

Same issue in v5.2.3, happens on Android too

[agueraXneuf]

+1

I think that It happens when the keyboard is visible and the bottom sheet modal fulfill the screen.
I find a quick fix it by setting maxDynamicContentSize prop. The aim is to avoid the modal to cover the entire screen when the keyboard is shown.

maxDynamicContentSize={500}

I'm pretty sure that using a fixed value is the wrong way because it depends on the screen size.
Maybe this small formula can help (based on the screen dimensions I used to test - iPhone 13 mini)

const REF_SCREEN_HEIGHT = 812;
const REF_MAX_HEIGHT = 500;
const {height} = Dimensions.get("screen");
const maxDynamicContentSize = height * REF_MAX_HEIGHT / REF_SCREEN_HEIGHT;

But we still need to find a correct, clean fix !

[jsellam]

Same issue on android and 5.1.6

[motudev]

Can reproduce this, when using 5.2.3, ios and snapPoints, no keyboard type and with enableDynamicSizing={false} with a minimal example of just this, which is the default setup in https://gorhom.dev/react-native-bottom-sheet/modal/usage:

<View>
  <Button
    onPress={handlePresentModalPress}
    title="click"
  />
  <BottomSheetModalProvider>
    <BottomSheetModal
      ref={bottomSheetModalRef}
      index={1}
      snapPoints={snapPoints}
      enableDynamicSizing={false}
      onChange={handleSheetChanges}>
      <BottomSheetTextInput style={styles.input} />
      <BottomSheetView style={styles.contentContainer}>
        <Text>Awesome 🎉</Text>
      </BottomSheetView>
    </BottomSheetModal>
  </BottomSheetModalProvider>
</View>

[gorhom]

should be fixed with v5.2.4