The Livble SDK - Deprecated Versions

❗️
This Guide is Deprecated
The following guide applies to a deprecated version of the Livble SDK.
For up-to-date documentation on the latest version, click here.

What is the Livble SDK?

The Livble SDK is a JS package that will allow you to embed the Livble widget and experience as well as getting data events that will allow you to react to Livble events in a way that will enhance the user experience.

Once the SDK is initialized you will be able to show the Livble experience and widget and react to events with your own event callback.

How to install?

npm install @lvble/core@"^2.0.71"
npm install @lvble/react"^2.0.71"

How to initialize?

If you are using React we have created a LivbleProvider for you so it is easier to initialize Livble

import { LvbleWidget, LvbleProvider } from "@lvble/react";
import { Environment } from "@lvble/core";

// At the App level or in any other Level in the Component tree
<LvbleProvider environment={Environment.Sandbox} onEvent={onEvent}>
  {/* ... */}
</LvbleProvider>

//On event example
const onEvent = function(eventType: string, data: any) {
    switch (eventType) {
      case "USER_APPROVED":
        // ...
        break;
      case "SPLIT_RENT":
        // ...
        break;
      case "REPAY":
        // ...
        break;
      case "EXPERIENCE_CLOSED":
        // ...
        break;
    }
}

If you are not using React you can initialize Livble with vanilla JS code

import { Environment, Lvble } from "@lvble/core";

const lvble = Lvble({
     environment: Environment.Sandbox, onEvent: onEvent
    });

Widget/Livble SDK Parameters

Parameter	Type	What is it?	Examples
environment	Environment type (sandbox or production)	sandbox/production
onEvent	(eventType: string, data: any) => void	Callback that Lvble will invoke when events happen in Lvble's environment
Optional: modal	ModalOptions	Overriding default options for Lvble experience (height for example)	`{height: '750px'}` `{height: '85dvh'}`

Events

Event name	When you get?	Data	Comments
EXPERIENCE_OPENED	The experience opens
USER_APPROVED	The user gets approved in the underwriting phase
USER_DECLINED	The user gets declined in the underwriting phase
SPLIT_RENT	The user has split rent successfully	`{settlement_id:int, amount:int, charges_paid: string[], charges_and_amounts_paid: dict[charge_id:str, amount_in_cents: int][] }`	Use for the settlement resolution
REPAY	The user has repaid at least 1 installment successfully
EXPERIENCE_CLOSED	The experience closes
ERROR	Some error has occurred in the Lvble experience	`{code: int, msg:string}`