liquid-qex-widget

Liquid QEX Plugin

API Integration

const { QexWidgetApi } = require("liquid-qex-widget");
const elem = document.getElementById("marker");
const qexPlugin = new QexWidgetApi(elem);
qexPlugin.initialize({
  public_api_key: "d70b5f46-b0f4-4f18-b68e-7f075d16b532",
  theme: "light",
});

React Integration

import { QexWidget, SETTLEMENT_METHOD, THEME } from "liquid-qex-widget";
import React from "react";
import "./App.css";

function App() {
  return (
    <div className="App">
      <QexWidget
        config={{
          public_api_key: "3ded0834-6bc5-4442-86ec-bd1fb96a075e",
          theme: THEME.LIGHT,
          user_locale: "en",
          payout_settlement: {
            method: SETTLEMENT_METHOD.BLOCKCHAIN_TRANSFER,
          },
        }}
        onSuccess={(transaction) => {
          console.log("Transaction Complete", transaction);
        }}
        onStepTransition={(stepTransition) => {
          console.log(
            `Step transition. Old Step: ${stepTransition.old_step}, New step: ${stepTransition.new_step}`,
            transaction
          );
        }}
      />
    </div>
  );
}