react-square-web-payments-sdk
v3.2.1
Published
`react-square-web-payments-sdk` lets you easily create PCI-compliant inputs to accept payments online with the Square Payments API. It supports the following payment methods: credit and debit cards, ACH bank transfers, Apple Pay, Google Pay, and Gift Card
Downloads
25,539
Readme
react-square-web-payments-sdk
react-square-web-payments-sdk
lets you easily create PCI-compliant inputs to accept payments online with the Square Payments API. It supports the following payment methods: credit and debit cards, ACH bank transfers, Apple Pay, Google Pay, and Gift Cards.
A react wrapper for Square's Web Payments SDK
Install
This one is pretty simple, everyone knows what to do:
NPM
npm install react-square-web-payments-sdk
Yarn
yarn add react-square-web-payments-sdk
Usage
// Dependencies
import * as React from 'react';
import { CreditCard, PaymentsForm } from 'react-square-web-payments-sdk';
const MyPaymentForm = () => (
<PaymentsForm
/**
* Identifies the calling form with a verified application ID generated from
* the Square Application Dashboard.
*/
applicationId="sq0idp-Y0QZQ-Xx-Xx-Xx-Xx"
/**
* Invoked when payment form receives the result of a tokenize generation
* request. The result will be a valid credit card or wallet token, or an error.
*/
cardTokenizeResponseReceived={(token, buyer) => {
console.info({ token, buyer });
}}
/**
* This function enable the Strong Customer Authentication (SCA) flow
*
* We strongly recommend use this function to verify the buyer and reduce
* the chance of fraudulent transactions.
*/
createVerificationDetails={() => ({
amount: '1.00',
/* collected from the buyer */
billingContact: {
addressLines: ['123 Main Street', 'Apartment 1'],
familyName: 'Doe',
givenName: 'John',
countryCode: 'GB',
city: 'London',
},
currencyCode: 'GBP',
intent: 'CHARGE',
})}
/**
* Identifies the location of the merchant that is taking the payment.
* Obtained from the Square Application Dashboard - Locations tab.
*/
locationId="LID"
>
<CreditCard />
</PaymentsForm>
);
export default MyPaymentForm;
Contributing
Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.
Please make sure to update tests as appropriate.
Contributors ✨
Contributions, issues and feature requests are welcome!Feel free to check issues page. You can also take a look at the contributing guide.
Thanks goes to these wonderful people (emoji key):
This project follows the all-contributors specification. Contributions of any kind welcome!