@powerdesigninc/react-native-prompt

0.1.2 • Public • Published

React Native Prompt

npm version

This package helps you to use Prompt Dialog cross platform iOS(Alert.prompt) and Android(Dialog).

Use the same way as AlertIOS.prompt, simply just change Alert.prompt to prompt.

Screenshots

Android Default Buttons
Android Secure Text
Android Three Buttons on Tablet

Installation

# with npm
npm install @powerdesigninc/react-native-prompt
# with yarn
yarn add @powerdesigninc/react-native-prompt

React Native >= v0.60

you don't need to link anything.

React Native < v0.60, Manual linking

react-native link @powerdesigninc/react-native-prompt

Example

import prompt from "@powerdesigninc/react-native-prompt";

const App = () => {
  return (
    <View>
      <TouchableOpacity
        onPress={() => {
          prompt('Title', null, (input)=>{console.log(input)}));
        }}>
        <Text>Show Prompt 1</Text>
      </TouchableOpacity>
      <TouchableOpacity
        onPress={() => {
          prompt(
            'Title',
            'Message',
            setInput,
            'secure-text',
            'default value',
            'numeric',
          );
        }}>
        <Text>Show Prompt 2</Text>
      </TouchableOpacity>
    </View>
  );
};

Options

Name Required Description
title yes The title of the prompt dialog
message no The message of the prompt dialog
callbackOrButtons no If value is function, then it show two buttons and bind the OK button with the function.

If value is array, then render the buttons with the value, the button options has three properties { text: string, style: string, onPress: Function }
type no One of "default", "plain-text","secure-text", "login-password".

NOTE: Android doesn't support login-password yet.
defaultValue no The default value of the prompt dialog
keyboardType no One of "default", "email-address", "numeric", "phone-pad", "ascii-capable", "numbers-and-punctuation", "url", "number-pad", "name-phone-pad", "decimal-pad", "twitter", "web-search"

NOTE: Android only supports "default", "numeric", "phone-pad", number-pad" for now.

Run Example Project

cd example
yarn install

yarn ios
yarn android

License

This project is licensed under the MIT License - see the LICENSE.md file for details

Readme

Keywords

Package Sidebar

Install

npm i @powerdesigninc/react-native-prompt

Weekly Downloads

104

Version

0.1.2

License

MIT

Unpacked Size

21.1 kB

Total Files

17

Last publish

Collaborators

  • wadehuang36