Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/alexneo2003/react-liqpay
React component for LiqPay payment system
https://github.com/alexneo2003/react-liqpay
liqpay liqpay-api payments react reactjs
Last synced: 3 months ago
JSON representation
React component for LiqPay payment system
- Host: GitHub
- URL: https://github.com/alexneo2003/react-liqpay
- Owner: alexneo2003
- Created: 2019-11-19T13:47:04.000Z (about 5 years ago)
- Default Branch: master
- Last Pushed: 2023-10-09T21:40:05.000Z (over 1 year ago)
- Last Synced: 2024-10-07T09:16:04.937Z (4 months ago)
- Topics: liqpay, liqpay-api, payments, react, reactjs
- Language: JavaScript
- Homepage:
- Size: 1.32 MB
- Stars: 4
- Watchers: 1
- Forks: 4
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# react-liqpay
> React component for LiqPay payment system
[](https://www.npmjs.com/package/react-liqpay) [](https://standardjs.com)
## Install
```bash
yarn add react-liqpay
```
or
```bash
npm install --save react-liqpay
```
## Usage
```jsx
import React, { Component } from "react";
import { LiqPayPay, LiqPaySubscribe } from "react-liqpay";
class Example extends Component {
const payInfo = {
amount: 999,
currency: 'USD',
title: 'PAY'
}
const ButtonComponent = () => (
{`${payInfo.title} ${payInfo.amount} ${payInfo.currency}`}
)
render() {
return (
]}
/>
);
}
}
```
### common props
- `publicKey` - **String** Public key - the store identifier. You can get the key in the [store settings](https://www.liqpay.ua/en/adminbusiness)
- `privateKey`- **String** Private key of the created company (not available to anyone except your developer)
- `amount` - **String** Payment amount. For example: `5`, `7.34`
- `description` - **String** Payment description. _(default "test")_
- `currency` - **String** Payment currency. Possible values: `USD`, `EUR`, `RUB`, `UAH`, `BYN`, `KZT`. Additional currencies can be added by company's request.
- `orderId` - **String** Unique purchase ID in your shop. Maximum length is 255 symbols.
- `result_url` - **String** URL of your shop where the buyer would be redirected after completion of the purchase. Maximum length 510 symbols.
- `server_url` - **String** URL API in your store for notifications of payment status change (`server->server`). Maximum length is 510 symbols. [Learn more](https://www.liqpay.ua/documentation/en/api/callback)
- `style` - **Object** Styles for component, like '`margin`'
- `disabled` - **Boolean** Props for disabling component. _(default "false")_
- `extra` - **Object** Extra component for rendering as main component _(default "null")_
### LiqPayPay props
- `title` - **String** Text showing as main text inside button. _(default "Payment")_
### LiqPaySubscribe props
- `title` - **String** Text showing as main text inside button. _(default "Subscribe")_
- `subscribePeriodicity` - **String** Period of payments.
Possible values: `month` - once in a month, `year` - once in a year _(default "month")_
## CHANGELOG
- v1.0.0
- initial commit
- functional buttons with two payment actions:
- 'pay'
- 'subscribe'
- example
- v1.1.0
- example to readme
- component picture
- additional props in component - can pass 'style', 'result_url', 'server_url', 'product_description' etc...
- change base64 function - support cyrillic characters
- costume title for button
- v1.2.0
- packages upgrade
- v1.2.1
- typos correction
- v1.3.0
- custom component - you can pass your own component as 'extra' props
- refactoring
- fixing PropTypes
- 'disabled' props for components buttons
- props descriptions
- update component picture
- updated example
## License
MIT © [alexneo2003](https://github.com/alexneo2003)