🚀 Big News: Socket Acquires Coana to Bring Reachability Analysis to Every Appsec Team.Learn more
Socket
Book a DemoInstallSign in
Socket

react-native-option-menu

Package Overview
Dependencies
Maintainers
1
Versions
5
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

react-native-option-menu

A native looking options dialog for Ios and Android

1.1.3
latest
Source
npm
Version published
Weekly downloads
3.9K
-35.39%
Maintainers
1
Weekly downloads
 
Created
Source

react-native-option-menu

A native looking options dialog for IOS, and Android and Web. ( Functional Component)

To Download, run: npm i react-native-option-menu.

Visit : https://www.npmjs.com/package/react-native-option-menu

Usage example:

import OptionsMenu from "react-native-option-menu";
const MoreIcon = require("../../assets/more/more.png");

<OptionsMenu
  button={MoreIcon}
  buttonStyle={{ width: 32, height: 8, margin: 7.5, resizeMode: "contain" }}
  destructiveIndex={1}
  options={["Edit", "Delete", "Cancel"]}
  actions={[editPost, deletePost]}/>
                       
                       

Note that button is a required prop (pass in a png of the desired button).

As an alternative to the button and style props, you can just pass in a full custom component:

const myIcon = (<Icon name="rocket" size={30} color="#900" />)
<OptionsMenu
  customButton={myIcon}
  destructiveIndex={1}
  options={["Edit", "Delete", "Cancel"]}
  actions={[editPost,deletePost]}/>

Destructive index in an iOS only prop. It will appear as a red index.

Options: an array of strings that will be displayed in the menu.

Actions: an array of functions to be executed for every menu item. Note that the orders of options an actions have to match.

iOS Screenshot:

Screenshot

Android Screenshot:

Screenshot

Keywords

react-native

FAQs

Package last updated on 29 Jul 2020

Did you know?

Socket

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