1.0.1 • Published 5 years ago

react-native-alert-utils v1.0.1

Weekly downloads
1
License
MIT
Repository
github
Last release
5 years ago

react-native-alert-utils

This lib provide some basic types of alert on your app.

Usage

import AlertProvider from 'react-native-alert-utils';

<Providers>
    <NavigationProvider>
        <Router />
------> <AlertProvider />
    </NavigationProvider>
</Providers>

After set provider on your root app, you can use methods to show modal inside your screens, by default, you can all customize your modal, defining the component will'be show, but, if you like a fast usage, we provide a basic layout of modal.

Showing modal

import { setModal } from 'react-native-alert-utils';
import { SimpleLayout } from 'react-native-alert-utils/Layout';

const Screen = () => {

  const SimpleModal = () =>
    <SimpleLayout>
      <Text>Modal test</Text>
    </SimpleLayout>

  return (
    <View>
      <Button onPress={() => setModal(<SimpleModal />)} />
    </View>
  )
}

Methods

NameParamsDescription
pushModalComponent[]Push list of components to screen
popModalPop first modal of screen, if exists
setModalComponent, Options?Set modal on screen, you can add some options using a object
hideModalHide modal from screen
showModalShow modal on screen if have some

Layouts

You can get layouts from:

import { ... } from 'react-native-alert-utils/Layout'
NamePropsDescription
SimpleLayoutContainerSimple layout used on example

Types

Options

NameTypeRequiredDefaultDescription
fixedbooleanNofalseIf true, the modal cannot be hide on click outside, then you need to provide way to hide.

Container

NameTypeRequiredDefault
backgroundColorstringfalse#FFF
heightnumber | %false50%
widthnumber | %false90%
paddingnumberfalse20