Package Exports

react-paypal-button

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (react-paypal-button) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

React-Paypal-Button

A button component to implement PayPal's Express Checkout in React

Prerequisites

To use PayPal's Express Checkout you must have a PayPal Business account set up and verified. After this is done, you'll have access to your API credentials to use with this button.

Once you have your account set up you will have 2 different sets of credentials for sandbox mode and prouduction mode. Both will have a clientID, this is what you will use for the productionID prop or the sandboxID prop.

Installation

$ npm install react-paypal-button --save

Usage

When using button in Production mode, usage will look like this...

import { PayPalButton } from 'react-paypal-button'

export default class App extends Component {
  render(){
    return (
      <PayPalButton
        env='production'
        productionID='abcdef123456'
        amount={0.01}
        currency='USD'
      />
    )
  }
}

When testing in Sandbox mode, usage will look like this...

import { PayPalButton } from 'react-paypal-button'

export default class App extends Component {
  render(){
    return (
      <PayPalButton
        env='sandbox'
        sandboxID='abcdef123456'
        amount='0.01'
        currency='USD'
      />
    )
  }
}

Options

Types

export type PayPalButtonProps = {
  env: 'sandbox' | 'production';
  sandboxID?: string;
  productionID?: string;
  amount: number;
  currency: string;
  onPaymentError?: (msg: string) => void;
  onPaymentStart?: () => void;
  onPaymentSuccess?: (response: PayPalPaymentData) => void;
}

option	type	description
`env`	string	Declares the environment. Will either be set to 'production' for live or 'sandbox' for testing.
`sandboxID`	string	This will be your clientID from your PayPal Sandbox API credentials found in your PayPal Business account info.
`productionID`	string	This will be your clientID from your PayPal Live API credentials found in your PayPal Business account info.
`amount`	integer	The amount of the transaction.
`currency`	string	The currency of the transaction. See PayPal docs for list of accepted currencies.
`onPaymentStart`	fn	a callback function that runs when the user clicks on the checkout button as the modal loads.
`onPaymentSuccess`	fn	a callback function that runs after a successful payment and includes the payment object from paypal as its argument.
`onPaymentError`	fn	a callback function that runs if the payment execution or authorization process errors out, and includes the error message as its argument

Development

Install dependencies:

$ npm install

Run the example app at http://localhost:8008:

$ npm start

Run tests and watch for code changes using jest:

$ npm test

Lint src and test files:

$ npm run lint

Generate UMD output in the lib folder (runs implicitly on npm version):

$ npm run build

License

MIT