Klasha-pay NPM

react-klasha

This is a react library for implementing klasha payment gateway

Demo

Get Started

This React library provides a wrapper to add Klasha Payments to your React application

Install

npm install klasha-pay --save

Usage

import React from 'react';
import { useKlashaPayment } from 'klasha-pay';

const App = () => {

  const { payWithKlasha, loading, error, paymentData } = useKlashaPayment({
    merchantKey: 'your-merchant-key',
    businessId: 133,
    amount: 1000,
    description: 'Product Purchase',
    currency: 'NGN',
    destinationCurrency: 'USD',
    transactionRef: 'unique-transaction-ref-12345',
    customer: {
      fullname: 'John Doe',
      firstName: 'John',
      lastName: 'Doe',
      email: 'john.doe@example.com',
      phoneNumber: '1234567890',
    },
    /*enviroment: true would call Klasha dev while enviroment: false will call production */
    environment: true,
    onSuccess: (data) => console.log('Payment successful!', data),
    onError: (err) => console.error('Payment failed', err),
  });


  return (<div>
      <button onClick={payWithKlasha} disabled={loading}>
        {loading ? 'Processing...' : 'Pay with Klasha'}
      </button>
      {error && <p style={{ color: 'red' }}>{error}</p>}
      {paymentData && <p>Payment successful: {JSON.stringify(paymentData)}</p>}
    </div>);
};

export default App;
;