React-Native-Dialog

React native dialog library to show dialog boxes

How to thank me ?

Just click on ⭐️ button 😘

Installation:

npm install --save @irfanwani/react-native-dialog
OR
yarn add @irfanwani/react-native-dialog

Basic Usage

import { useState } from "react";
import {
  StyleSheet,
  Text,
  Button,
  View,
  GestureResponderEvent,
} from "react-native";

import Dialog from "@irfanwani/react-native-dialog";

export default () => {
  const [visible, setvisible] = useState(false);

  const showModal: (event: GestureResponderEvent) => void = () => {
    setvisible(true);
  };
  return (
    <View style={styles.container}>
      <Button title="show modal" onPress={showModal} />
      <Dialog
        title="Dialog Title"
        cancelText="Cancel"
        subtitle="Dialog subtitle which is shown under the title"
        confirmText="Confirm"
        visible={visible}
        closeDialog={() => {
          setvisible(false);
        }}
        confirm={() => {
          console.log("confirmed");
        }}
      />
    </View>
  );
};

Props

| Prop | Type | Required | Note | | ------------------- | ---------------------------------------- | --------------------------------- | ---------------------------------------------- | | visible | boolean | True | Determines whether the dialog is shown or not | | title | string | True | Title for the dialog | | subtitle | string | True | Extra description about the alert | | closeDialog | (event: GestureResponderEvent) => void | True | Callback for the close button | | confirm | (event: GestureResponderEvent) => void | True | Callback for the confirm button | | confirmText | string | True | text to be shown on the confirm button | | cancelText | string | True | text to be shown on the cancel button | | titleStyle? | Object | False | Styles object for the title | | cancelStyle? | Object | False | Styles object for the cancel button container | | confirmStyle? | Object | False | Styles object for the confirm button container | | subtitleStyle? | Object | False | Styles object for the subtitle button | | cancelTextStyle? | Object | False | Styles object for the cancel button text | | confirmTextStyle? | Object | False | Styles object for the confirm button text |