Security News
tea.xyz Spam Plagues npm and RubyGems Package Registries
Tea.xyz, a crypto project aimed at rewarding open source contributions, is once again facing backlash due to an influx of spam packages flooding public package registries.
@google-pay/button-react
Advanced tools
Readme
This is the React component for the Google Pay button.
npm install @google-pay/button-react
<GooglePayButton
environment="TEST"
paymentRequest={{
apiVersion: 2,
apiVersionMinor: 0,
allowedPaymentMethods: [
{
type: 'CARD',
parameters: {
allowedAuthMethods: ['PAN_ONLY', 'CRYPTOGRAM_3DS'],
allowedCardNetworks: ['MASTERCARD', 'VISA'],
},
tokenizationSpecification: {
type: 'PAYMENT_GATEWAY',
parameters: {
gateway: 'example',
gatewayMerchantId: 'exampleGatewayMerchantId',
},
},
},
],
merchantInfo: {
merchantId: '12345678901234567890',
merchantName: 'Demo Merchant',
},
transactionInfo: {
totalPriceStatus: 'FINAL',
totalPriceLabel: 'Total',
totalPrice: '100.00',
currencyCode: 'USD',
countryCode: 'US',
},
}}
onLoadPaymentData={paymentRequest => {
console.log('load payment data', paymentRequest);
}}
/>
More React examples can be found in the examples folder of this repository.
Try it out on StackBlitz, or see it in action with a React sample store (source code).
Visit the Google Pay developer site for more information about integrating Google Pay into your website.
Property | Type | Remarks |
---|---|---|
buttonColor |
|
Optional.
Default value |
buttonLocale |
|
Optional. This ISO 639-1 code represents the desired button language. Supported locales include Default value is determined by the browser/operating system locale. |
buttonSizeMode |
|
Optional.
Default value |
buttonType |
|
Optional. Displays their respective prompts (localized based on the user's browser settings) with the Google Pay logo. The
Default value |
buttonRadius |
|
Optional. Specifies the button corner radius in pixels. The minimum is 0 and the maximum depends on the height of the button. If the height is 40px (default height) then the maximum value for the |
className |
|
Optional. The CSS class name to apply to the element. |
environment |
|
Required. The Google Pay environment to target. Note: in the |
existingPaymentMethodRequired |
|
Optional. When set to Default value |
paymentRequest |
Required. Request parameters that define the type of payment information requested from Google Pay. See | |
style |
|
Optional. The CSS style attributes to apply to the element. |
Callback | Arguments | Remarks |
---|---|---|
onCancel | reason |
Invoked when a user cancels or closes the Google Pay payment sheet. |
onClick | event |
Invoked when the Google Pay button is clicked, before the payment sheet is displayed. Display of the payment sheet can be prevented by calling |
onError | reason |
Invoked when an error is encountered in the process of presenting and collecting payment options from the Google Pay payment sheet. |
onLoadPaymentData | paymentData |
Invoked when a user has successfully nominated payment details. This callback receives the |
onPaymentAuthorized | paymentData |
Invoked when a user chooses a payment method. This callback should be used to validate whether or not the payment method can be used to complete a payment. This would be typically used to perform pre-authorization to ensure that the card is valid and has sufficient funds. Note that in order to use this callback See payment authorization reference for more information. |
onPaymentDataChanged | intermediatePaymentData |
Invoked when payment the user changes payment data options including payment method, shipping details, and contact details. This callback can be used to dynamically update Note that in order to use this callback See payment data changed reference for more information. |
onReadyToPayChange | result |
Invoked when the user's Note that when
|
Note that this folder does not contain a package.json
file. The package.json
file is generated during the build
process using the package-template.json
where the version number is read from the package.json
file defined in the root of this repository.
FAQs
React component for Google Pay button
The npm package @google-pay/button-react receives a total of 25,131 weekly downloads. As such, @google-pay/button-react popularity was classified as popular.
We found that @google-pay/button-react demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Tea.xyz, a crypto project aimed at rewarding open source contributions, is once again facing backlash due to an influx of spam packages flooding public package registries.
Security News
As cyber threats become more autonomous, AI-powered defenses are crucial for businesses to stay ahead of attackers who can exploit software vulnerabilities at scale.
Security News
UnitedHealth Group disclosed that the ransomware attack on Change Healthcare compromised protected health information for millions in the U.S., with estimated costs to the company expected to reach $1 billion.