Embed Plugins

<script src="https://api.opencard.io/plugin/tpa/js/tpa.min.js"></script>
<link rel="stylesheet" href="https://api.opencard.io/plugin/tpa/css/tpa.min.css">

new ocTPA({
  environment: 'sandbox', // or 'production'
  oAuthToken: 'Bearer ...', // scopes: public-records-read + account-payment-products-read only
  accountId: 1,
  orgNumber: '5561234567',
  country: 'SE',
  allowedPaymentProductIds: [], // optional: payment product `id`s to show (default: all enabled on the account)
  infoAndPriceMapping: { 1: 'https://your-site/pricing/product-1' }, // optional: "Info & Pricing" URL per payment product id
  onDataSend: async function(data) {
    // YOU call the APIs — plugin does not write to OpenCard:
    // 1. POST /billings (data.billing) — includes product_* flags
    // 2. POST /tpas (data.tpa)
    // 3. POST /tpas/{id}/signatories for each in data.tpa_signatories
    // Then: organization + webhook (your app), then card holders
    return true; // or error string
  }
});

{
  "billing": {
    "name_display": "...",
    "name_legal": "...",
    "organization_number": "...",
    "country": "SE",
    "address_street": "...",
    "address_city": "...",
    "address_zip": "...",
    "email_invoice": "...",
    "your_reference_invoice": "...",
    "product_transaction": true,
    "product_digital_receipt": true,
    "product_aland_index": false
  },
  "tpa": {
    "language": "sv",
    "name": "...",
    "country": "SE",
    "organization_number": "...",
    "payment_product_id": 1
  },
  "tpa_signatories": [
    { "name": "Anna", "email": "anna@acme.se" }
  ]
}

new ocPdpc({
  pdpcUrl: 'https://api.opencard.io/accounts/1/pdpcs/3/sign/token...',
  message: 'Please approve data processing for your corporate card.',
  buttonText: 'Approve now'
});