> ## Documentation Index
> Fetch the complete documentation index at: https://developers.ingopayments.com/llms.txt
> Use this file to discover all available pages before exploring further.

# SDK Reference

> Methods and constants for the Ingo Instant Payments iFrame SDK.

The Ingo Instant Payments SDK is a JavaScript library that mounts the iFrame inside your web application. Include it via a `<script>` tag and use the three methods below to initialize, mount, and respond to the hosted account capture flow.

```html theme={null}
<script type="text/javascript"
  src="/path/to/ingo.instantpayments.clientsdk_v2.0.js">
</script>
```

***

## Methods

### `IngoInstantPayments.create(domElement, options?)`

Creates an instance of the SDK and attaches it to a DOM element in your page. Returns a `webPlugin` object that exposes the `mount` and `addEventListener` methods.

**Arguments**

| Argument     | Required | Type              | Description                                                                                                                        |
| ------------ | -------- | ----------------- | ---------------------------------------------------------------------------------------------------------------------------------- |
| `domElement` | Yes      | Element or string | The DOM element or CSS selector where the iFrame will be injected (e.g. `document.getElementById("container")` or `"#container"`). |
| `options`    | No       | Object            | Initialization options (see below).                                                                                                |

**Options**

| Option       | Type    | Default | Description                                                                                           |
| ------------ | ------- | ------- | ----------------------------------------------------------------------------------------------------- |
| `cssName`    | string  | —       | A CSS class name to add to the iFrame element.                                                        |
| `autoHeight` | boolean | `false` | When `true`, the iFrame height adjusts automatically as its content changes or the window is resized. |
| `scrolling`  | boolean | `false` | Enables or disables the iFrame's default scroll bars.                                                 |

```js theme={null}
var webPlugin = IngoInstantPayments.create(
  document.getElementById("container"),
  {
    cssName: "web-plugin",
    autoHeight: true,
    scrolling: false
  }
);
```

***

### `webPlugin.mount(authorizedUrl, fundingDestination)`

Mounts the iFrame and launches the account capture flow for the specified funding destination. Must be called after `create()`.

**Arguments**

| Argument             | Required | Type     | Description                                                                                     |
| -------------------- | -------- | -------- | ----------------------------------------------------------------------------------------------- |
| `authorizedUrl`      | Yes      | string   | The `authorized_url` returned from the Session Create API. Valid for 30 seconds after creation. |
| `fundingDestination` | Yes      | Constant | The account type to tokenize. Must be a valid `IngoInstantPayments.FUNDING_DESTINATIONS` value. |

**`FUNDING_DESTINATIONS` constants**

| Constant                                           | Payment Type       |
| -------------------------------------------------- | ------------------ |
| `IngoInstantPayments.FUNDING_DESTINATIONS.DEBIT`   | Debit card         |
| `IngoInstantPayments.FUNDING_DESTINATIONS.CREDIT`  | Credit card        |
| `IngoInstantPayments.FUNDING_DESTINATIONS.ACH`     | Bank account (ACH) |
| `IngoInstantPayments.FUNDING_DESTINATIONS.BILLPAY` | BillPay            |
| `IngoInstantPayments.FUNDING_DESTINATIONS.PAYPAL`  | PayPal             |

```js theme={null}
webPlugin.mount(
  authorized_url,
  IngoInstantPayments.FUNDING_DESTINATIONS.DEBIT
);
```

***

### `webPlugin.addEventListener(event, handler)`

Registers a callback function for a specific SDK event. This is the only way to receive data from the iFrame. Register listeners before or immediately after calling `mount()`.

**Arguments**

| Argument  | Required | Type     | Description                                                                  |
| --------- | -------- | -------- | ---------------------------------------------------------------------------- |
| `event`   | Yes      | Constant | The event to listen for. Must be a valid `IngoInstantPayments.EVENTS` value. |
| `handler` | Yes      | function | Callback invoked when the event fires. Receives an event data object.        |

**Common event payload fields**

Every event payload includes at minimum:

| Field                | Description                                                   |
| -------------------- | ------------------------------------------------------------- |
| `session_identifier` | Unique identifier for the current session.                    |
| `tracer_token`       | Token used for debugging across systems.                      |
| `event_name`         | Name of the event fired (e.g. `iip.webplugin.token_success`). |

Additional fields are event-specific. See [SDK Events](/docs/iframe/session/events) for the full payload reference per event.

```js theme={null}
webPlugin.addEventListener(
  IngoInstantPayments.EVENTS.TOKEN_SUCCESS,
  function(data) {
    var token = data.customer_account_token;
    // use token with IngoPay process API
  }
);

webPlugin.addEventListener(
  IngoInstantPayments.EVENTS.PAGE_LOAD,
  function(data) {
    console.log(data.content.page); // e.g. "DebitFunding"
  }
);
```
