Ts Payment

Bootstraped payment portal for RazorPay and Paypal

Installation

Ts Payment

Ts Payment is available as an npm package.

npm:

npm install ts-payment

yarn:

yarn add ts-payment

Getting started with Ts Payment

Examples

RazorPay :

import * as React from "react";
import PaymentApp from "ts-payment";

const configuration = {
  RPKeyId: "razor_pay_key_id",
  paymentMethod: "RazorPay", // RazorPay or PayPal
  country: "IN", // Counntry Code
  currency: "USD", // Currency Code
  paymentInfo: {
    title: "Welcome to Techsophy Payment",
    // Title to be displayed in payment detail model container
    description: "Bootstraped payment portal for RazorPay and Paypal",
    // Description to be displayed in payment detail model container
    payerName: "John Doe", // Payer Name
    payerMobile: "9999999999", // Payer Mobile Number
    payerEmail: "[e-mail]", // Payer Email address
    payerCity: "testCity", // City
    amount: "1", // transaction amount
  },
  RPPaymentValidator: function (event) {},
  // Your code to handle the event from RazorPay
};

function App() {
  return <PaymentApp configuration={configuration} />;
}

Click this link to know how to create RazorPay KeyId.

PayPal :

import * as React from "react";
import PaymentApp from "ts-payment";

const configuration = {
  PPkey: "Paypal_pay_key_id",
  paymentMethod: "PayPal", // RazorPay or PayPal
  country: "IN", // Counntry Code
  currency: "USD", // Currency Code
  paymentInfo: {
    title: "Welcome to Techsophy Payment",
    // Title to be displayed in payment detail model container
    description: "Bootstraped payment portal for RazorPay and Paypal",
    // Description to be displayed in payment detail model container
    payerName: "John Doe", // Payer Name
    payerMobile: "9999999999", // Payer Mobile Number
    payerEmail: "[e-mail]", // Payer Email address
    payerCity: "testCity", // City
    amount: "1", // transaction amount
  },
  PPApprove: function (event) {},
  PPCancel: function (event) {},
  PPClick: function ({ data, actions }) {},
  PPError: function (event) {},
  // Your code to handle various event from Paypal
};

function App() {
  return <PaymentApp configuration={configuration} />;
}

Click this link to sign in or sign up the Paypal account.

You can quickly set up your PayPal Key by login to your PayPal account or on to the PayPal app & look for the PayPal key option.

• Visit the set-up link.

• Click Let's go.

• Choose the payment method you want to use with'ur PayPal Key.

• Click Agree & Get Your Key.

Once you complete the set-up process, you'll be able to view your PayPal Key virtual card number, expiration date & security code. You'll also be able to save the PayPal Key to your browser.

If you are looking to use this package in react typescript template please use "noImplicitAny": false, in your tsconfig.json file to avoid type issues.

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.