The true native bottom sheet experience for your React Native Apps. π©
- β‘ Powered by Fabric - Built on React Native's new architecture for maximum performance
- π Native - Implemented in the native realm
- π― Type-safe - Full TypeScript support with Codegen-generated native interfaces
- βΏ Accessible - Native accessibility and screen reader support out of the box
- π Imperative API - Asynchronus
refMethods - πͺ Liquid Glass - iOS 26+ Liquid Glass support out of the box. Featured in Expo Blog
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.
- React Native >= 0.81
- New Architecture enabled (
RCT_NEW_ARCH_ENABLED=1for iOS,newArchEnabled=truefor Android)
yarn add @lodev09/react-native-true-sheetimport { 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>
)
}TrueSheet includes built-in Jest mocks for easy testing. Simply mock the package in your tests:
jest.mock('@lodev09/react-native-true-sheet');All methods (present, dismiss, resize) are mocked as Jest functions, allowing you to test your components without native dependencies.
See the contributing guide to learn how to contribute to the repository and the development workflow.
Made with β€οΈ by @lodev09

