Socket
Socket
Sign inDemoInstall

react-native-dropdownalert

Package Overview
Dependencies
0
Maintainers
1
Versions
62
Alerts
File Explorer

Advanced tools

Install Socket

Detect and block malicious and high-risk dependencies

Install

react-native-dropdownalert

An alert to notify users about an error or something else.


Version published
Maintainers
1
Weekly downloads
7,765
decreased by-18.02%

Weekly downloads

Readme

Source

react-native-dropdownalert

Platform npm version npm version License CI

screenshot

Table of contents

An alert to notify users about an error or something else. It can be dismissed by press, cancel, automatic, pan gesture or programmatic. It can be customized and/or you can build your own alert (BYOA) - see DropdownAlertProps on what's available.

Installation

  • yarn add react-native-dropdownalert
  • npm i react-native-dropdownalert --save

Usage

import the library

import DropdownAlert, {
  DropdownAlertData,
  DropdownAlertType,
} from 'react-native-dropdownalert';

create an alert promise function variable

let alert = (_data: DropdownAlertData) => new Promise<DropdownAlertData>(res => res);

add the component as the last component in the document tree so it overlaps other UI components and set alert prop with alert function

<DropdownAlert alert={func => (alert = func)} />

invoke alert

const alertData = await alert({
  type: DropdownAlertType.Error,
  title: 'Error',
  message: 'Something went wrong.',
});

Support

react minium versionreact-native minium versionpackage versionreason
v16.8.0v0.61.0v5.0.0use react hooks
v16.0.0v0.50.0v3.2.0use SafeAreaView
v16.0.0-alpha.6v0.44.0v2.12.0use ViewPropTypes

Using children prop

Option 1 pass child component(s) like so:

<DropdownAlert>{/* insert child component(s) */}</DropdownAlert>

Option 2 pass child component(s) like so:

<DropdownAlert children={/* insert child component(s) */} />

Either way DropdownAlert will render these instead of the pre-defined child components when alert is invoked. Check out the iOS and Android notifications in example project.

Caveats

  • Modals can overlap `DropdownAlert`` if it is not inside the modal's document tree.
  • It is important you place the DropdownAlert below the StackNavigator.

Inspired by: RKDropdownAlert

Keywords

FAQs

Last updated on 08 Aug 2023

Did you know?

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc