Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/instea/react-native-popup-menu
Popup menu component for React Native
https://github.com/instea/react-native-popup-menu
android animation ios popup-menu react-native
Last synced: 6 days ago
JSON representation
Popup menu component for React Native
- Host: GitHub
- URL: https://github.com/instea/react-native-popup-menu
- Owner: instea
- License: isc
- Created: 2016-05-16T14:16:31.000Z (over 8 years ago)
- Default Branch: master
- Last Pushed: 2023-10-18T12:25:28.000Z (about 1 year ago)
- Last Synced: 2024-12-03T15:47:46.368Z (10 days ago)
- Topics: android, animation, ios, popup-menu, react-native
- Language: JavaScript
- Size: 3.56 MB
- Stars: 1,481
- Watchers: 17
- Forks: 248
- Open Issues: 44
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
- awesome-react-native - react-native-popup-menu ★653 - Extensible popup menu component for React Native. (Components / UI)
- awesome-reactnative-ui - react-native-popup-menu - native-popup-menu/master/./android.demo.gif)| (Others)
- awesome-react-native - react-native-popup-menu ★653 - Extensible popup menu component for React Native. (Components / UI)
- awesome-reactnative-ui - react-native-popup-menu - native-popup-menu/master/./android.demo.gif)| (Others)
- awesome-react-native - react-native-popup-menu ★653 - Extensible popup menu component for React Native. (Components / UI)
- awesome-react-native-ui - react-native-popup-menu ★116 - Extensible popup menu component for React Native. (Components / UI)
- awesome-react-native - react-native-popup-menu ★653 - Extensible popup menu component for React Native. (Components / UI)
README
# react-native-popup-menu
[](https://www.npmjs.com/package/react-native-popup-menu)
Extensible popup menu component for React Native for Android, iOS and (unofficially) UWP and react-native-web.
Features:
* Simple to use popup/context menu
* Multiple modes: animated, not animated, slide in from bottom or popover
* By default opening and closing animations
* Optional back button handling
* Easy styling
* Customizable on various levels - menu options, positioning, animations
* Can work as controlled as well as uncontrolled component
* Different lifecycle hooks
* RTL layout support
Community driven features:
* Support for UWP, react-native-web and react-native-desktop
* Typescript definitions
We thank our community for maintaining features that goes over our scope.
| Context Menu, Slide-in Menu | Popover |
|---|---|
|||
## Installation
```
npm install react-native-popup-menu --save
```
If you are using **older RN versions** check our compatibility table.
## Basic Usage
Wrap your application inside `MenuProvider` and then simply use `Menu` component where you need it. Below you can find a simple example.
For more detailed documentation check [API](./doc/api.md).
```js
// your entry point
import { MenuProvider } from 'react-native-popup-menu';
export const App = () => (
);
// somewhere in your app
import {
Menu,
MenuOptions,
MenuOption,
MenuTrigger,
} from 'react-native-popup-menu';
export const YourComponent = () => (
Hello world!
alert(`Save`)} text='Save' />
alert(`Delete`)} >
Delete
alert(`Not called`)} disabled={true} text='Disabled' />
);
```
## Documentation
- [Examples](doc/examples.md)
- [API](doc/api.md)
- [Extension points](doc/extensions.md)
## Contributing
Contributions are welcome! Just open an issues with any idea or pull-request if it is no-brainer. Make sure all tests and linting rules pass.
## React Native Compatibility
We keep compatibility on best effort basis.
| popup-menu version | min RN (React) version |
| ------------------ | -------------- |
| 0.13 | 0.55 (16.3.1) |
| 0.9 | 0.40 |
| 0.8 | 0.38 |
| 0.7 | 0.18 |