react-liqpay
React component for LiqPay payment system
Install
yarn add react-liqpay
or
npm install --save react-liqpay
Usage
import React Component from "react"; import LiqPayPay LiqPaySubscribe from "react-liqpay"; const payInfo = amount: 999 currency: 'USD' title: 'PAY' const ButtonComponent = <button => ` ` </button> { return <div => <LiqPayPay = = ="3" ="Payment for product" ="UAH" = _url="http://domain.com/user/account" _url="http://server.domain.com/liqpay" _description="Online courses" = = /> <LiqPaySubscribe = = ="3" ="month" ="Payment for subscription" ="USD" = _url="http://domain.com/user/account" _url="http://server.domain.com/liqpay" _description="Online courses" = = /> <LiqPayPay = = ="Payment for product" = _url="http://domain.com/user/account" _url="http://server.domain.com/liqpay" _description="Online courses" = = /> </div> ; }
common props
publicKey
- String Public key - the store identifier. You can get the key in the store settingsprivateKey
- 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 morestyle
- 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