0.0.1-rc.2 • Published 5 years ago
react-native-custom-modal-alert v0.0.1-rc.2
This library is still in the state of developing and testing. Use at your own risk!
React Native Custom Modal Alert
A customizable pop-up alert using react-native-modal to display and react-native-vector-icons for buttons
Installation
Install it with
npm i react-native-custom-modal-alertOR
yarn add react-native-custom-modal-alertUsage
- Import react-native-custom-modal-alert
import useCustomAlert from 'react-native-custom-modal-alert';- Create
useCustomAlertobject
const { showCustomAlert, renderCustomAlert } = useCustomAlert();- Nest
renderCustomAlertcomponent into the page's element
return (
<>
{ renderCustomAlert() }
<SafeAreaView>
...
</SafeAreaView>
</>
);- Show alert by calling
bashowCustomAlertAPI
renderInstructions = () =>{
return(
<View style={{width:'90%', alignSelf: 'center'}}>
<Text style={{margin: 10}}>{"Body goes here"}</Text>
</View>
);
}
showCustomAlert({
title:"Title goes here",
body:renderInstructions(),
hasCancelButton:true,
borderColor: 'black'
})Props
| Name | Type | Default | Description |
|---|---|---|---|
| title | string | undefined | Title for the alert |
| body | element | undefined | Body component for the alert |
| hasCancelButton | boolean | false | Controls the visibility of the cancel button |
| borderColor | string | undefined | Border color for the alert |
Contributing
Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.
Please make sure to update tests as appropriate.