Introduction

import { CheckoutForm } from "@spot-flow/checkout-inline-js";

const checkout = new CheckoutForm({});
checkout.setup({
  email: "temi@mailinator.com",
  encryptionKey: "gF1SPEMA3ido2Dg4ByXxxxxxxxxxxxxxxxxx", // The encryption key for the merchant
  merchantKey: "pk_test_8a586f9801254xxxxxxxxxxxx", // Your Merchant Public Key generated on Spotflow
  currency: "NGN", //can be in USD or in the local currency of your collection region e.g NGN, GHS
  localCurrency: "NGN", //optional and only needed if currency is in USD
  amount: 500
});

  const checkout = new CheckoutForm({});
  checkout.setup({
    email: "temi@mailinator.com",
    encryptionKey: "gF1SPEMA3ido2Dg4ByXxxxxxxxxxxxxxxxxx", // The encryption key for the merchant
    merchantKey: "pk_test_8a586f9801254xxxxxxxxxxxx", // Your Merchant Public Key generated on Spotflow
    planId: "7447a235-9f53-4d44-xxxxxxxxxxxxxx", // Replace with your plan ID
    currency: "NGN", //can be in USD or in the local currency of your collection region e.g NGN, GHS
    localCurrency: "NGN", //optional and only needed if currency is in USD
  });

 <button onclick="openCheckout()">
  Make Payment
</button>

 <script>
      const openCheckout = () => {
        const { CheckoutForm } = SpotflowCheckout
      const checkout = new CheckoutForm({});
      checkout.setup({
          email: "temi@mailinator.com",
         encryptionKey: "gF1SPEMA3xxxxxxxxxxxxx", // The encryption key for the merchant
         merchantKey: "pk_test_8a586f9801254xxxxxxxxxxxx", // Your Merchant Public Key generated on Spotflow
         currency: "NGN",
         localCurrency: "NGN", //optional and only needed if currency is in USD
         amount: 500
          }
        });
      };
    </script>