# @anvilapp/react-native-bottom-sheet

> react native bottom sheet

Latest version **0.2.1** (published 2020-05-27) · MIT license · 0 weekly downloads

## Install

```sh
npm install @anvilapp/react-native-bottom-sheet
pnpm add @anvilapp/react-native-bottom-sheet
yarn add @anvilapp/react-native-bottom-sheet
bun add @anvilapp/react-native-bottom-sheet
```

## Health

**Score 25/100 (F)** — status: abandoned.

Positive: has types; no vulnerabilities; high quality score.

Warnings: low downloads; no esm support; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.2.1 |
| Published | 2020-05-27 |
| First published | 2020-05-21 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 24.6 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 2 |
| Author | yura.pustylnikov@gmail.com |
| Maintainers | anvilapp |

## Links

- npm: https://www.npmjs.com/package/@anvilapp/react-native-bottom-sheet
- Repository: https://github.com/pustylnikov/react-native-bottom-sheet
- Issues: https://github.com/pustylnikov/react-native-bottom-sheet/issues
- npm.io page: https://npm.io/package/@anvilapp/react-native-bottom-sheet

## Recent versions

- 0.2.1 (latest) — 2020-05-27
- 0.2.0 — 2020-05-24
- 0.1.0 — 2020-05-21

## README

### Install
using npm
```text
npm install @anvilapp/react-native-bottom-sheet --save
```
or using yarn
```text
yarn add @anvilapp/react-native-bottom-sheet
```

### Usage example
```jsx
import BottomSheet, {ComposingTypes, PositionTypes} from '@anvilapp/react-native-bottom-sheet';

const bottomSheetRef = React.createRef();

<BottomSheet
    ref={bottomSheetRef}
    showComposingType={ComposingTypes.PARALLEL}
    hideComposingType={ComposingTypes.PARALLEL}
    position={PositionTypes.BOTTOM}
    showOverlayDuration={150}
    hideOverlayDuration={150}
    showContentDuration={150}
    hideContentDuration={150}
    dragTopOnly={true}
    visibleDragIcon={true}
    draggable
    onBackButtonPress={() => console.log('onBackButtonPress')}
    onOverlayPress={() => console.log('onOverlayPress')}
    onDragDown={() => console.log('onDragDown')}
/>

bottomSheetRef.current.open({
    render: () => {
        // Use any of your components
        return <BottomSheetContent/>;
    }
    // extra options
});
```

---
_Source: https://npm.io/package/@anvilapp/react-native-bottom-sheet · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._