​
Parameters

KeyTypeRequiredDescription
offeringIdstringYesID of the offering created in the Business Portal
purchaseMetadataobjectNoKey-value pairs of custom information associated with the purchase.

​
Returns

A promise that resolves to the function to start the purchase and a destroy method to control the purchase widget programmatically. Type of the response is CreatePurchaseResult.
FieldTypeDescription
startPurchase() => Promise<PurchaseStateSummary>The startPurchase function to start the purchase flow.
destroy() => voidClean up and remove all Supertab elements from the DOM.

​
Example

const supertabClient = new Supertab({ clientId: "client.your_client" });

const { startPurchase, destroy } = await supertabClient.createPurchase({
  offeringId: "offering.your-offering-id",
});

const result = await startPurchase();

// Then you can handle the result
if (result.purchase?.status === "completed") {
  console.log("Purchase completed successfully:", result.purchase);
} else if (result.purchase?.status === "abandoned") {
  console.log("Purchase cancelled:", result.purchase);
} else if (result.priorEntitlement) {
  console.log("User already has entitlement:", result.priorEntitlement);
}

​
Types

​
PurchaseStateSummary

PurchaseStateSummary type definition
interface PurchaseStateSummary {
    priorEntitlement: EntitlementStatus[] | null;
    authStatus: AuthStatus;
    purchase: Purchase | null;
    purchasedOffering: Offering | null;
    tab: Tab | null;
    paymentResult: boolean;
}

type EntitlementStatus = {
    contentKey: string;
    hasEntitlement: boolean;
    expires: string;
    recursAt: Date | null;
}

enum AuthStatus {
    MISSING = "missing",
    EXPIRED = "expired",
    VALID = "valid"
}

type Purchase = {
    id: string;
    offeringId?: string | null;
    purchasedAt: string | null;
    completedAt: string | null;
    description: string;
    price: Price;
    status: PurchaseStatus;
    metadata: Metadata;
    entitlementStatus: EntitlementStatus | null;
}

type Metadata = Record<string, string | number | boolean | null>;

enum PurchaseStatus {
    PENDING = "pending",
    COMPLETED = "completed",
    ABANDONED = "abandoned"
}

type Price = {
    amount: number;
    currency: Currency;
}

type Currency = {
    code: string;
    symbol: string;
    name: string;
    baseUnit: number;
}

type Offering = {
    id: string;
    description: string;
    entitlementDetails: EntitlementDetails;
    price: Price;
    isPayNow: boolean;
}

type EntitlementDetails = {
    contentKey: string;
    duration: string;
    isRecurring: boolean;
}

type Tab = {
    testMode: boolean;
    currency: Currency;
    total: Price;
    limit: Price;
    purchases: Purchase[];
}

​
CreatePurchaseResult

CreatePurchaseResult type definition
interface CreatePurchaseResult {
  startPurchase: () => Promise<PurchaseStateSummary>;
  destroy: () => void;
}