Skip to main content

Troubleshooting

Blank Screen When Dismissing React Native Modal on iOS​

When presenting a TrueSheet on top of a React Native <Modal> and then dismissing the Modal (by setting visible={false}), the screen may go blank. This is a bug in React Native where dismissing a Modal that has another view controller presented on top of it only dismisses the topmost view controller, leaving the Modal in an inconsistent state.

Workaround:

Dismiss the sheet first before hiding the Modal:

const sheet = useRef<TrueSheet>(null)
const [modalVisible, setModalVisible] = useState(false)

const closeModal = async () => {
  await sheet.current?.dismiss()
  setModalVisible(false)
}
info

A fix has been submitted to React Native. See PR #55005.

Weird layout render​

The sheet does not have control over how React Native renders components and may lead to rendering issues. To resolve this, try to minimize the use of flex=1 in your content styles. Instead, use fixed height or employ flexGrow, flexBasis, etc., to manage your layout requirements.

Build Failures with Xcode or EAS​

If you encounter build failures when building your iOS app, it may be due to an incorrect Xcode version or EAS build configuration.

Xcode Version​

The package works better with Xcode 26.2. If you're building locally, check your Xcode version:

xcodebuild -version

If you're experiencing issues, we recommend updating to Xcode 26.2.

EAS Build Configuration​

When using EAS Build, you must configure your eas.json to use a build image that includes Xcode 26.2 to build your app. Use "image": "latest" or choose from the available build images:

{
  "build": {
    "production": {
      "ios": {
        "image": "latest"
      }
    },
    "development": {
      "ios": {
        "image": "latest"
      }
    }
  }
}

Without this configuration, EAS may use an older build image that doesn't include Xcode 26.2, causing build failures.