react-native-smooth-bottomsheet

A smooth react native bottom sheet 100% typeScript.

Table of Contents

• Installation
• Usage
• Props
• Methods

Installation

npm install react-native-smooth-bottomsheet

Usage

import BottomSheet from 'react-native-smooth-bottomsheet';

    <GestureHandlerRootView style={{flex: 1}}>
      <View>
        <BottomSheet ref={bottomRef} OnOpen={() => }>
          ..
          ..
        </BottomSheet>
      </View>
    </GestureHandlerRootView>

Props

Prop Name	Type	Default	Description
children	func or node	<View />	A component or a render function. Use toggleSlider function instead
onOpen	function	() => null	Function to execute when the panel is opened

Methods

Name	Description
scrollTo: (destination: number) => void	Function to scroll the bottom sheet make destination as argument
isActive: () => boolean	Function return true if bootom sheet is active(destination!=0) else false (destination==0)
onClose: () => void	Function to close the bottom sheet

Compatibility

• [Works with react-native-reanimated 3.0.2 ]
• Support FlatList
• Support ScrollView
• and more

Make sure to import them from react-native-gesture-handler

import {
  GestureHandlerRootView,
  ScrollView,
  FlatList,
} from 'react-native-gesture-handler';

Contributing

This library was created 100% javascript code en typescript. Feel free to contribute it.

License

MIT

Support

If you enjoyed this project — or just feeling generous, consider buying me a beer. Cheers!

Author

Made by Nejib Afdhal

---