react-native-bottom-sheet

React Native Bottom Sheet is a UI component library for building bottom sheets in React Native apps. A bottom sheet is the panel that slides up from the bottom of the screen, commonly used for menus, filters, detail views, or any content that overlays the main screen without fully replacing it. This library provides a version that responds smoothly to gestures, snaps to predefined positions, and handles edge cases that are easy to get wrong when building this kind of component from scratch.

The library supports several common content types inside the sheet: scrollable lists including FlatList, SectionList, and ScrollView, as well as plain views. It handles keyboard appearance on both iOS and Android without requiring extra configuration, so text inputs inside the sheet work correctly when the keyboard appears. A modal variant is included for cases where the bottom sheet should dim the background and block interaction with the rest of the screen. Dynamic sizing lets the sheet grow or shrink based on its content, and pull-to-refresh is supported for scrollable lists inside the sheet.

The library runs on React Native Web in addition to iOS and Android, and is compatible with Expo. It integrates with the React Navigation library used in many React Native projects. The current version (v5) is built on the Reanimated v3 and Gesture Handler v2 animation libraries, which handle the performance-sensitive parts of the animations. Older branches supporting earlier versions of those libraries exist but are no longer maintained. The project is written in TypeScript and released under the MIT license.