1.0.7 • Published 2 years ago

react-native-modal-notifier v1.0.7

Weekly downloads
-
License
MIT
Repository
github
Last release
2 years ago

React Native Modal Notifier

npm dw platforms: ios, android license MIT

react-native-modal-notifier is a third party in-app notification notifier package! It provides modal notification popup. And reachable from any screen or component after the wrap the application with container. There are more than one usage example; 1. Can be triggered by useEffect function 2. Can be triggered by user action 3. Can be triggered by api service data

Installation

yarn add react-native-modal-notifier

Or

npm install --save react-native-modal-notifier

Usage

Wrap your app with NotifierContainer

import { NotifierContainer } from 'react-native-modal-notifier';
const App = () => (
  <NotifierContainer>
    <HomeScreen />
  </NotifierContainer>
);

Then import useNotifier anywhere in your code/screen/components

import { useNotifier } from 'react-native-modal-notifier';

const HomeScreen = () => {
    const notifier = useNotifier();

    useEffect(() => {
        alert && notifier({
            title: alert.title,
            message: alert.message
        });
    }, [alert]);

    return (
    <TouchableHighlight
      onPress={() =>
        notifier({
          title: 'New Notification',
          message:
            'New Notification',
        })
      }>
      <Text>Set Notification</Text>
    </TouchableHighlight>
  );
};

Props of useNotifier

NameDescriptionTypeDefault
titleTitle of the messagestringnull
messageThe message of the contentstringnull
headerShownHeader visibility optionbooleantrue
primaryButtonTextThe text in the primary button contentstringundefined
primaryButtonActionThe primary button actionfuncundefined
primaryButtonColorThe background color of the primary buttonstring#3a86ff
primaryButtonPositionThe position of the primary button in the notifiercenter or right or leftcenter
typeThe type of modal notifierdefault or info or warning or errordefault
childComponentThe child component to be rendered within the modal componentJSX.Elementundefined
contentImageThe image uri or address to be rendered within the modalImageSourcePropTypeundefined
contentImageRadiusThe image radius controllerbooleanfalse
contentImageSizeThe size of the content imagesmall or middle or largemiddle
contentImageTypeThe image type of contentsquare or rectanglesquare
autoCloseDelayThe timer of the auto close the notifier as millisecondnumbernull