@wniemiec-component-reactnative/modal

1.0.1 • Public • Published

Modal

Message box that is displayed on top of your screen.

React Native compatibility Release License


Introduction

React Native component that that is displayed on top of the screen. Modals put an overlay on the screen; therefore, they take visual precedence over all the other elements.

🖼 Gallery

image 2

image 3

image 4

How to use

  1. Install the component
$ npm install --save @wniemiec-component-reactnative/modal
  1. Import the component
import Modal from '@wniemiec-component-reactnative/modal';
  1. Use it
[...]

import React, { useState } from 'react';
import { View } from 'react-native';

[...]

const [visible, setVisible] = useState(true);

[...]

<View style={{ display: 'flex', flex: 1, justifyContent: 'center', alignItems: 'center' }}>
  <Modal visible={visible} setVisible={setVisible} title='Some title...'>
	<Text>Some text...</Text>
  </Modal>
</View>

[...]

📖 Documentation

Property Type Description Default
visible object Indicates whether the modal should be displayed -
setVisible function(void): void Function that is called when the close button is pressed indicating that the modal should no longer be visible -
style string Custom style null
title string Modal title ""

🚩 Changelog

Details about each version are documented in the releases section.

🤝 Contribute!

See the documentation on how you can contribute to the project here.

📁 Files

/

Name Type Description
docs Directory Documentation files
src Directory Source files

/@wniemiec-component-reactnative/modal/

    Package Sidebar

    Install

    npm i @wniemiec-component-reactnative/modal

    Weekly Downloads

    0

    Version

    1.0.1

    License

    MIT

    Unpacked Size

    150 kB

    Total Files

    20

    Last publish

    Collaborators

    • williamniemiec