React Native Stripe Payment and React Native Web Stripe Payment

The library allows you to use Stripe Payment with react-native without ejecting support both react-native and react-native-web.

Description

The library allows you to use Stripe.js Checkout with react-native without ejecting. You can use it with both server-side implementations and client-side implementations. Simply ensure you follow the url structure guidelines below.

Prequisites

• This library relies on React Native Webview. Please follow this guide to install in your project first.

Installation

• Ensure you've completed the setps in prequisites.

• Install package via npm or yarn:

npm install --save react-native-stripe-payment-webview OR yarn add react-native-stripe-payment-webview

• If your project use react-native-web to build website:

npm install --save @chainplatform/react-native-web-webview OR yarn add @chainplatform/react-native-web-webview

Then setup by guide at: https://github.com/ChainPlatform/react-native-web-webview#readme

Usage

• Import in your project

import StripePayment from 'react-native-stripe-payment-webview';

    <StripePayment
        theme={"light"}
        style={"stripe"}
        return_url={"https://google.com"}
        public_key={datas.payment_infos.datas.publishable_key}
        client_secret={datas.payment_infos.datas.client_secret}
        paymentIntent={(datas) => {
            console.log("paymentIntent ", datas);
        }}
    />

Component props

• theme (String) - theme dark or light
• style (String) - Stripe layout theme
• return_url (String) - optional.
• publishable_key (String) - Stripe public key of your project.
• client_secret (String) - String to be passed to Stripe's paymentIntent function. Docs.
• paymentIntent (?Function) - Called upon calback of the checkout session
• Support full Webview props

Contributing

Pull requests are highly appreciated! For major changes, please open an issue first to discuss what you would like to change.

Related Projects

• Other packages for react native and react native web: ChainPlatform