meld-checkout Node.js Library

meld-checkout is a lightweight Node.js library designed to provide a checkout feature.

Installation

Install the package with:

npm install meld-checkout

Usage

Here's how you can use meld-checkout in your Node.js project:

import UserInformation from '@melduniversal/meld-checkout'

Example

Here's a simple example demonstrating the usage of meld-checkout:

import UserInformation from '@melduniversal/meld-checkout'

const formStyle = {
  containerStyle: {
    'padding': '10px',
  }
}

const props = {
  panField: {
    name: 'PAN',
    order: 1, // in which position you want to place particular field
    disable: false,
    hidden: false,
    value: "",
    rules: {
      required: true, // if required then pas value as true, if not then false
      isNumber: false,
      errorEmptyMsg: "Please enter PAN",
      errorNumberMsg: "Please enter only numbers"
    },
    placeholder: "",
    textFieldSectionStyle: {},
    labelSectionStyle: {},
    labelStyle: {},
    inputStyle: {},
  },
  expiryField: {
    name: 'Expiry',
    order: 2,
    disable: false,
    hidden: false,
    value: "",
    rules: {
      required: true,
      errorEmptyMsg: "Please enter expiry"
    },
    placeholder: "",
    textFieldSectionStyle: {},
    labelSectionStyle: {},
    labelStyle: {},
    inputStyle: {},
  },
  cvvField: {
    name: 'CVV',
    order: 3,
    disable: false,
    hidden: false,
    value: "",
    rules: {
      required: true,
      isNumber: false,
      errorEmptyMsg: "Please enter PAN",
      errorNumberMsg: "Please enter only numbers"
    },
    placeholder: "",
    textFieldSectionStyle: {},
    labelSectionStyle: {},
    labelStyle: {},
    inputStyle: {},
  },
  nameField: {
    name: 'Name',
    order: 4,
    disable: false,
    hidden: false,
    value: "",
    rules: {
      required: true,
      isString: false,
      minLength: 0, // if you will pass 0 then min length check will get skipped
      maxLength: 10, // if you will pass 0 then max length check will get skipped
      errorEmptyMsg: "Please enter Name",
      errorStringMsg: "Please enter only characters",
      errorMinLengthMsg: "Please enter min 10",
      errorMaxLengthMsg: "Please enter max 20"
    },
    placeholder: "",
    textFieldSectionStyle: {},
    labelSectionStyle: {},
    labelStyle: {},
    inputStyle: {},
  },
  addressField: {
    name: 'Address',
    order: 5,
    disable: false,
    hidden: false,
    value: "",
    rules: {
      required: true,
      isString: false,
      errorEmptyMsg: "Please enter address",
      errorStringMsg: "Please enter only characters",
    },
    placeholder: "",
    textFieldSectionStyle: {},
    labelSectionStyle: {},
    labelStyle: {},
    inputStyle: {},
  },
  memberAmountField: {
    name: 'Member Amount',
    order: 6,
    disable: false,
    hidden: false,
    value: "",
    rules: {
      required: true,
      isNumber: false,
      errorEmptyMsg: "Please enter member amount",
      errorNumberMsg: "Please enter only numbers",
    },
    placeholder: "",
    textFieldSectionStyle: {},
    labelSectionStyle: {},
    labelStyle: {},
    inputStyle: {},
  },
  protectAmountField: {
    name: 'Protect Amount',
    order: 7,
    disable: false,
    hidden: false,
    value: "",
    rules: {
      required: false,
      isNumber: false,
      errorEmptyMsg: "Please enter protect amount",
      errorNumberMsg: "Please enter only numbers",
    },
    placeholder: "",
    textFieldSectionStyle: {},
    labelSectionStyle: {},
    labelStyle: {},
    inputStyle: {},
  },
  button: {
    name: 'Submit',
    buttonSectionStyle: {},
    buttonStyle: {}
  }
  showSuccessMsg: true, // display success message in sdk
  showFailureMsg: true  // display failure message in sdk
}

<UserInformation
    token={token || memberToken}
    formStyle={formStyle}
    step={step} // contain number ex: 1,2
    {...props}
    environment="qa" // qa, sb or prod
/>

Note Once you received meld_transaction_one_complete event, update the token and step props to trigger second transaction automatically without clicking on button

Events

SDK will emit event on success / failure of transaction:

Events List

| Event Name | Description | |----------------------------------|-----------------------------------------------------------| | meld_transaction_one_complete | This event indicate that first transaction is completed | | meld_transaction_two_complete | This event indicate that second transaction is completed | | meld_transaction_one_failed | This event indicate that first transaction is failed | | meld_transaction_two_failed | This event indicate that second transaction is failed |

Note Each success and failure event will contain response.

window.addEventListener("message", (event) => {
      if(event?.data?.eventName === "") {
      }
}, false); 
window.onmessage = (event) => {};

API response

Success response data object

{
  "transaction": {
    "id": "WXESaD6RtxwoC3azdKyGBc",
    "parentPaymentTransactionId": null,
    "accountId": "",
    "isPassthrough": false,
    "passthroughReference": null,
    "isImported": false,
    "customer": null,
    "transactionType": "",
    "status": "",
    "sourceAmount": 50.00,
    "sourceCurrencyCode": "USD",
    "destinationAmount": null,
    "destinationCurrencyCode": null,
    "paymentMethodType": "",
    "serviceProvider": "",
    "serviceTransactionId": "",
    "description": null,
    "externalReferenceId": null,
    "serviceProviderDetails": {
        "input": null,
        "internal": null,
        "response": null
    },
    "multiFactorAuthorizationStatus": null,
    "createdAt": "2024-05-16T16:07:51.479411Z",
    "updatedAt": "2024-05-16T16:07:52.307258Z",
    "countryCode": null,
    "sessionId": null,
    "externalSessionId": null,
    "paymentDetails": {
        "authAmount": null,
        "captureAmount": null
    },
    "cryptoDetails": null,
    "externalCustomerId": null,
    "fiatAmountInUsd": null,
    "sessionClientTags": null,
    "serviceProviderTransactionUrl": null
  }
}

Failure response data object

{
  "code": "",
  "message": "",
  "requestId": "",
  "timestamp": ""
}

Failure error code(s) BAD_REQUEST, TRANSACTION_REQUEST_VALIDATION_ERROR, TRANSACTION_REQUEST_CREATION_ERROR, SERVICE_PROVIDER_ERROR