@habit.analytics/habit-smartlink-reactcomponent/README.md

A React component for Habit SmartLink integration.

# Habit Smartlink React Component

A react component for integrating Habit Smartlink into your application

## Table of Contents

[Instalation](#instalation)
[Usage](#usage)
[Props](#props)

## Instalation

You can install the package via npm or yarn:

### Example

```bash
yarn add habit-smartlink-reactcomponent
```

## Usage

You can use the `SmartlinkComponent` in your React application:

### Example

```JS
import { SmartlinkComponent } from 'habit-smartlink-reactcomponent';

const prePaymentMethod = async (quoteId) => {
  // Your application should have a logic to deal with quoteId and get payment data
  return { success: true, payment_id: '12345' };
};
const onPaymentSuccess = (successPaymentData) => {
  // Maybe your aplication has some logic to display data,
  // or some redirection after payment is completed...
  // This function is optional
}

const App = () => (
  <div>
    <h1>Test SmartLink Component</h1>
    <SmartLinkComponent
      hash="sampleHash"
      pin="samplePin"
      prePaymentMethod={prePaymentMethod}
      onPaymentSuccess={onPaymentSuccess}
    />
  </div>
);

export default App;

```

## Props

The SmartLinkComponent accepts the following props:

- hash (string): The hash value required for the SmartLink to recognize what payment will be handled;
- pin (string, optional): Optional PIN value, in case this payment is PIN protected;
- prePaymentMethod (function): The function to handle pre-payment method logic.
  It receives quoteId as a parameter and should return an object with success and payment_id.
- onPaymentSuccess (function): The function triggered on payment success

## Issues

If you find an issue or Bug or have any doubts, please report to the person at habit that is already contacting you.