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

# Initialize the Benji Connect SDK

> Importing and initializing the Benji Connect SDK to start connecting your users to their loyalty platforms.

## Installing the Benji Connect SDK

The **Benji Connect SDK** can be added to your application by including the SDK script in your HTML head.

```html theme={null}
<script src="https://d1ochlq3jv1msw.cloudfront.net/connect/sdk/connect-sdk.js"></script>
```

or by installing the package via npm

```bash theme={null}
npm install @benji-money/connect-sdk
```

or by installing the package via yarn

```bash theme={null}
yarn add @benji-money/connect-sdk
```

or by installing the package via pnpm

```bash theme={null}
pnpm add @benji-money/connect-sdk
```

<Warning>
  Note that you will be able to access the above packages/scripts once
  authorized to use the Benji SDKs. Contact your account manager for additional
  info.
</Warning>

## How the Benji Connect SDK loads Connect

When you call **`open()`**, the **Benji Connect SDK** creates a modal overlay and loads the Connect experience inside it.

## Initializing the Benji Connect SDK

The **Benji Connect SDK** is initialized with the following parameters:

<ParamField body="environment" type="string" required>
  Environment for the Connect flow: `development` | `sandbox` | `production`.
</ParamField>

<ParamField body="token" type="string" required>
  Connect token from the [Create Token](/connect/create_token) API.
</ParamField>

<ParamField body="onSuccess" type="callback function">
  Called when the flow completes successfully (`FLOW_SUCCESS`). Receives the
  exchange token and [metadata](/connect/methods#onsuccess).
</ParamField>

<ParamField body="onExit" type="callback function">
  Called when the user leaves the Connect UI (`FLOW_EXIT`), whether or not
  `onSuccess` ran.
</ParamField>

<ParamField body="onError" type="callback function">
  Called when an error is reported from the Connect flow (`ERROR`).
</ParamField>

<ParamField body="onEvent" type="callback function">
  Called for mid-flow and auxiliary events (e.g. `AUTH_SUCCESS`). See [Methods &
  Events](/connect/methods#onevent).
</ParamField>

Types are **optional**. The same runtime behavior applies to JavaScript and TypeScript; TypeScript users can import types from `@benji-money/connect-sdk` for autocomplete.

<CodeGroup>
  ```javascript JavaScript theme={null}
  import { ConnectSDK } from "@benji-money/connect-sdk";

  let sdk = null;

  function initializeSDK(token) {
    sdk = new ConnectSDK({
      environment: "sandbox",
      token: token,

      onSuccess: (token, metadata) => {
        console.log("Benji Connect successful");
        // Exchange `token` via Exchange Token API; use metadata for UI
      },

      onError: (error, errorId, metadata) => {
        console.log("Benji Connect onError", error, errorId);
      },

      onExit: (metadata) => {
        console.log("Benji Connect onExit", metadata.trigger);
      },

      onEvent: (type, metadata) => {
        console.log("Benji Connect onEvent", type);
      },
    });
  }
  ```

  ```typescript TypeScript theme={null}
  import {
    ConnectSDK,
    type BenjiConnectOnSuccessMetadata,
    type BenjiConnectMetadata,
    type BenjiConnectOnExitMetadata,
    type BenjiConnectEventType,
  } from "@benji-money/connect-sdk";

  let sdk: ConnectSDK | null = null;

  function initializeSDK(token: string): void {
    sdk = new ConnectSDK({
      environment: "sandbox",
      token,

      onSuccess: (token: string, metadata: BenjiConnectOnSuccessMetadata) => {
        console.log("Benji Connect successful", token, metadata.action);
      },

      onError: (
        error: Error,
        errorId: string,
        metadata: BenjiConnectMetadata,
      ) => {
        console.log("Benji Connect onError", error, errorId);
      },

      onExit: (metadata: BenjiConnectOnExitMetadata) => {
        console.log("Benji Connect onExit", metadata.trigger);
      },

      onEvent: (type: BenjiConnectEventType, metadata: BenjiConnectMetadata) => {
        console.log("Benji Connect onEvent", type);
      },
    });
  }
  ```
</CodeGroup>

To open the UI after initialization, call **`await sdk.open()`** (see [Methods & Events](/connect/methods#open)).