# react-native-internet-status-dropdown

Latest version **0.1.12** (published 2022-12-16) · ISC license · 0 weekly downloads

## Install

```sh
npm install react-native-internet-status-dropdown
pnpm add react-native-internet-status-dropdown
yarn add react-native-internet-status-dropdown
bun add react-native-internet-status-dropdown
```

## 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.1.12 |
| Published | 2022-12-16 |
| First published | 2022-01-06 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | bundled |
| Module format | CommonJS |
| Dependencies | 2 |
| Unpacked size | 5.8 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 0 |
| Author | Aminos Developments |
| Maintainers | aminosdevelopments |
| Keywords | react-native, react-component, android, ios, javascript, typescript |

## Links

- npm: https://www.npmjs.com/package/react-native-internet-status-dropdown
- Repository: https://github.com/AminosRB26/react-native-internet-status-dropdown
- Homepage: https://github.com/AminosRB26/react-native-internet-status-dropdown#readme
- Issues: https://github.com/AminosRB26/react-native-internet-status-dropdown/issues
- npm.io page: https://npm.io/package/react-native-internet-status-dropdown

## Dependencies (2)

- [react-native-gesture-handler](https://npm.io/package/react-native-gesture-handler.md) ^2.1.0
- [@react-native-community/netinfo](https://npm.io/package/@react-native-community/netinfo.md) ^7.1.7

## Alternatives

- [@openai/codex-sdk](https://npm.io/package/@openai/codex-sdk.md) — 731.4K weekly downloads
- [babel-plugin-transform-react-jsx](https://npm.io/package/babel-plugin-transform-react-jsx.md) — 565.0K weekly downloads
- [babel-helper-remove-or-void](https://npm.io/package/babel-helper-remove-or-void.md) — 508.5K weekly downloads
- [@pnpm/store-controller-types](https://npm.io/package/@pnpm/store-controller-types.md) — 186.9K weekly downloads
- [react-native-signature-canvas](https://npm.io/package/react-native-signature-canvas.md) — 155.6K weekly downloads

## Recent versions

- 0.1.12 (latest) — 2022-12-16
- 0.1.11 — 2022-12-16
- 0.1.10 — 2022-12-16
- 0.1.9 — 2022-12-16
- 0.1.8 — 2022-12-15
- 0.1.7 — 2022-01-24
- 0.1.6 — 2022-01-23
- 0.1.5 — 2022-01-11
- 0.1.4 — 2022-01-10
- 0.1.3 — 2022-01-07
- 0.1.2 — 2022-01-07
- 0.1.1 — 2022-01-07
- 0.0.8 — 2022-01-07
- 0.0.7 — 2022-01-07
- 0.0.6 — 2022-01-07
- … 5 more at https://npm.io/package/react-native-internet-status-dropdown/versions

## README

<img src="https://img.shields.io/npm/dt/react-native-internet-status-dropdown?color=%23FDA361&label=downloads&style=for-the-badge"> <img src="https://img.shields.io/npm/v/react-native-internet-status-dropdown?color=%23FFADAD&label=version&style=for-the-badge"> <img src="https://img.shields.io/static/v1?label=platform&message=Android | IOS&style=for-the-badge&color=%23BDB2FF"> <img src="https://img.shields.io/static/v1?label=license&message=mit&style=for-the-badge&color=%23ABC4FF">

# Getting Started
Use `npm install react-native-internet-status-dropdown` to install the package

Use `npm install @react-native-community/netinfo` to install its dependency

# Usage
`import InternetStatusBox from 'react-native-internet-status-dropdown'`

All props for the component are optional.

Inside `App.js` or the equivalent entry file

```
<View style={{ flex: 1 }}>
    <InternetStatusBox />
    <The Rest Of Your Content Goes Here>
</View>
```

# Props
`slideDuration` controls the amount of time it takes for the dropdown to slide onto screen (In milliseconds). Default is `700`. Must be a `Number`

**Example** 

`<InternetStatusBox slideDuration={500} />`
#

`label` The label text contained in the dropdown. Default is `No Internet Connection`. Must be a `String`

**Example** 

`<InternetStatusBox label={'No Internet'} />`
#

`customLabel` custom label component which replaces the original label. Must be a `<Text>` component

**Example**

`<InternetStatusBox customLabel={<Text style={{ fontFamily: 'Poppins-Regular', fontSize: 16 }}>No Internet Connection</Text>} />`
#

`containerStyle` container style which accepts basic style object. Must be a `ViewStyle`

**Example** 

`<InternetStatusBox containerStyle={{ borderRadius: 5, paddingVertical: 4 }} />`
#

`backgroundColor` container background color. Must be a valid color string

**Example** 

`<InternetStatusBox backgroundColor={'#FDA361'} />`
#

`labelColor` label text color. Must be a valid color string

**Example** 

`<InternetStatusBox labelColor={'#000000'} />`

# Support
If you would like to support me, you could buy me a coffee https://www.buymeacoffee.com/aminosdev

---
_Source: https://npm.io/package/react-native-internet-status-dropdown · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._
