# react-native-raw-bottom-sheet ## Hooray! The new version 3 has been released. Please pay close attention if you are upgrading the RBSheet from version 2 to version 3. - Functional Components: Starting from v3.0.0, RBSheet has been completely rewritten using Functional Components. This improves performance and aligns with modern React practices. - Prop Removal & Renaming: Several props have been removed and renamed for improved clarity and maintainability. Please refer to the updated documentation for a complete list of available props and their intended behavior.

[![npm version](https://badge.fury.io/js/react-native-raw-bottom-sheet.svg)](//npmjs.com/package/react-native-raw-bottom-sheet) [![npm downloads](https://img.shields.io/npm/dm/react-native-raw-bottom-sheet.svg) ](//npmjs.com/package/react-native-raw-bottom-sheet) [![GitHub Actions](https://github.com/nysamnang/react-native-raw-bottom-sheet/actions/workflows/ci.yml/badge.svg)](https://github.com/nysamnang/react-native-raw-bottom-sheet/actions/workflows/ci.yml) [![codecov](https://codecov.io/gh/nysamnang/react-native-raw-bottom-sheet/graph/badge.svg?token=tJuJsd1V8e)](https://codecov.io/gh/nysamnang/react-native-raw-bottom-sheet) - Super Lightweight Component - Add Your Own Component To Bottom Sheet - Customize Whatever You Like - Support Drag Down Gesture - Support All Orientations - Support Both Android And iOS - Smooth Animation - Zero Configuration - Zero dependency - Millions of Downloads | Showcase iOS | Showcase Android | | :--------------------------------------------------------------------------------------------------------------------: | :--------------------------------------------------------------------------------------------------------------------: | | ![](https://raw.githubusercontent.com/nysamnang/stock-images/master/react-native-raw-bottom-sheet/RNRBS-IOS-2.0.3.gif) | ![](https://raw.githubusercontent.com/nysamnang/stock-images/master/react-native-raw-bottom-sheet/RNRBS-AOS-2.0.3.gif) | ## Installation ``` npm i react-native-raw-bottom-sheet --save ``` ### or ``` yarn add react-native-raw-bottom-sheet ``` ## Example Please check the [example](https://github.com/nysamnang/react-native-raw-bottom-sheet/tree/master/example) folder to explore more example codes. #### Single Bottom Sheet ```jsx import React, {useRef} from 'react'; import {View, Button} from 'react-native'; import RBSheet from 'react-native-raw-bottom-sheet'; export default function Example() { const refRBSheet = useRef(); return (

	Stars	Issues	Version	Updated	Created
react-bottom-sheet			1.1.1	7 years ago	7 years ago
react-native-raw-bottom-sheet	1,044	7	3.0.0	2 months ago	5 years ago
react-native-simple-modal	183	10	9.0.1	6 years ago	8 years ago

react-bottom-sheet vs react-native-raw-bottom-sheet vs react-native-simple-modal

Downloads in past1 Month3 Months6 Months1 Year2 Years5 YearsAll time

Stats

Popular Searches

Sick of boring JavaScript newsletters?

Downloads in past