React Native True Sheet

Note

🎉 Version 3.0 is here! Completely rebuilt for Fabric with new features like automatic ScrollView detection, native headers/footers, sheet stacking, and more. Read the announcement

Features

Installation

Important

Version 3.0+ requires React Native's New Architecture (Fabric) For the old architecture, use version 2.x. See the Migration Guide for upgrading.

Prerequisites

Compatibility

Expo

npx expo install @lodev09/react-native-true-sheet

Bare React Native

yarn add @lodev09/react-native-true-sheet
cd ios && pod install

Documentation

Usage

import { TrueSheet } from "@lodev09/react-native-true-sheet"
export const App = () => {
 const sheet = useRef<TrueSheet>(null)
 // Present the sheet ✅
 const present = async () => {
 await sheet.current?.present()
 console.log('horray! sheet has been presented 💩')
 }
 // Dismiss the sheet ✅
 const dismiss = async () => {
 await sheet.current?.dismiss()
 console.log('Bye bye 👋')
 }
 return (
 <View>
 <Button onPress={present} title="Present" />
 <TrueSheet
 ref={sheet}
 detents={['auto', 1]}
 >
 <Button onPress={dismiss} title="Dismiss" />
 </TrueSheet>
 </View>
 )
}

Contributing

License