⚛️ React Environment Properties

⚙️ Properties

Property	Required	Description
`wallet`	✅ Yes	Solana wallet adapter.
`blockchain`	✅ Yes	Blockchain used for purchase — must be `"solana"`.
`merchantId`	✅ Yes	Merchant ID (contact Approvely support to obtain).
`connection`	✅ Yes	Solana connection object.
`env`	❌ No	Environment (`prod` by default; use `staging` or `sandbox` for testing).
`onSuccess`	❌ No	Callback function triggered upon successful checkout.
`transaction`	❌ No	Solana transaction object for redeeming credits. Create as you would for a normal user with USDC.
`partialSigners`	❌ No	Array of `Keypair` objects used for signing (e.g., for initializing new accounts).
`debugTx`	❌ No	Set to `true` to skip preflight checks for debugging.
`token`	❌ No	Token used for purchase (defaults to USDC; only Solana supported).
`planCode`	❌ No	Plan code for subscriptions.
`settlementType`	❌ No	Settlement method (`Credits`, `USDC`, or `Bank`).
`amount`	❌ No	Fixed purchase amount.
`webhookInfo`	❌ No	Object containing transaction/product info to include in webhook payloads.
`email`	❌ No	Default email for pre-filling user email field.
`chargebackProtectionData`	❌ No	Product metadata for chargeback protection logic.
`disableApplePay`	❌ No	Disable Apple Pay.
`disableGooglePay`	❌ No	Disable Google Pay.
`customerInfo`	❌ No	Additional customer metadata.
`supportsVersionedTransactions`	❌ No	Enable support for Solana versioned transactions.
`rent`	❌ No	Rent object specifying blockchain rent in lamports.
`origins`	❌ No	Comma-separated list of ancestor iframes when nested in multiple layers.

🚀 Usage

🧱 Base Example

import { useWallet } from '@solana/wallet-adapter-react';
import { useConnection } from '@solana/wallet-adapter-react';

const wallet = useWallet();
const { connection } = useConnection();

<CoinflowPurchase 
  wallet={wallet}
  merchantId='<YOUR MERCHANT ID>'
  blockchain="solana"
  env='prod' // or 'staging' or 'sandbox'
  connection={connection}
/>;

📡 Webhook Info

Example:

const webhookInfo = {
  productId: 'N421',
  code: 'PX8242342',
};

🔐 Chargeback Protection

const chargebackProtection = [
  {
    productName: 'Widget',
    productType: 'computingContract',
    quantity: 1,
    rawProductData: {
      description: 'Market best widgets',
    },
  },
];

SupportedproductType values:

inGameProduct, gameOfSkill, dataStorage, computingResources, sportsTicket,
eSportsTicket, musicTicket, conferenceTicket, virtualSportsTicket,
virtualESportsTicket, virtualMusicTicket, virtualConferenceTicket,
alcohol, DLC, subscription, fundACause, realEstate, computingContract,
digitalArt, topUp

rawProductData is optional but helps improve chargeback protection logic.

👤 Customer Info

const customerInfo = {
  name: 'Suzy Customer',
  verificationId: '123',
  displayName: 'Suzy',
  address: '123 Main St',
  city: 'Somewhereville',
  state: 'AK',
  zip: '99546',
  country: 'US',
  ip: '172.10.0.1',
  lat: '58.2005N',
  lng: '152.2100W',
};

All fields are optional.

🧾 Rent Example

const rent = {
  lamports: 100000,
};