⚠️ NPM Versioning Notice

> For all Aeropay integrations, please use the 1.1.0 Version of our web npm package.
> Any versions 2.0 and later are still in beta and may be unstable. Version 2.0 and above are intended for Aerosync-only integrations. (not using Aeropay to process payments)

Aerosync Web SDK

This Web SDK provides an interface to load Aerosync-UI in Javascript/typescript application. Securely link your bank account through your bank’s website. Log in with a fast, secure, and tokenized connection. Your information is never shared or sold.

Installation

``sh npm i aerosync-web-sdk`

`Usage`

##### 1. Create the necessary HTML elements to trigger and host the AeroSync widget.

##

`html id="openBank" class="button" role="button" @click="openAerosyncWidget()" > Connect Bank


##### 2. Import and Configure the AeroSync Widget
##

`typescript /** * Step-by-step integration of AeroSync AddBank widget */ import type { AerosyncWidget, WidgetEventSuccessType, WidgetEventType, } from "aerosync-web-sdk"; import { initAeroSyncWidget } from "aerosync-web-sdk";

function openAerosyncWidget() { // Initialize the widget with configuration options let widgetControls = initAeroSyncWidget({ elementId: "widget", // ID of the target div in your HTML iframeTitle: "Connect", // Used for accessibility environment: "production", // Set to 'sandbox' for testing, 'production' for live token: "xxxx", // Your secure AeroSync token aeroPassUserUuid: "xxxx", // Your AeroPass User UUID theme: "light", // Choose between 'light' or 'dark' theme

// Event listener for all widget events onEvent(event: WidgetEventType) { console.log("event", event); },

// Fires when the widget is fully loaded onLoad() { console.log("onload"); },

// Called after the user successfully connects a bank and closes the widget onSuccess(event: WidgetEventSuccessType) { console.log("onSuccess", event); // ... // Handle success (e.g., update UI, send data to backend, etc.) },

// Fires when the widget is closed manually by the user onClose() { console.log("widget closed"); },

// Catch and handle widget errors onError(event: string) { console.log("onError", event); }, });

// 🧭 Launch the widget widgetControls.launch(); }``

Readme.io document

For more information check the complete guide here: https://api-aerosync.readme.io/docs/web-npm-sdk

Contributing

See the contributing guide to learn how to contribute to the repository and the development workflow.

License

MIT

---

This project is licensed under the MIT License.

Usage

##### 1. Create the necessary HTML elements to trigger and host the AeroSync widget.

##

html



  id="openBank"
  class="button"
  role="button"
  @click="openAerosyncWidget()"
>
  Connect Bank

##### 2. Import and Configure the AeroSync Widget

typescript
/**
 * Step-by-step integration of AeroSync AddBank widget
 */
import type {
  AerosyncWidget,
  WidgetEventSuccessType,
  WidgetEventType,
} from "aerosync-web-sdk";
import { initAeroSyncWidget } from "aerosync-web-sdk";

function openAerosyncWidget() {
  // Initialize the widget with configuration options
  let widgetControls = initAeroSyncWidget({
    elementId: "widget", //  ID of the target div in your HTML
    iframeTitle: "Connect", //  Used for accessibility
    environment: "production", //  Set to 'sandbox' for testing, 'production' for live
    token: "xxxx", //  Your secure AeroSync token
    aeroPassUserUuid: "xxxx", //  Your AeroPass User UUID
    theme: "light", //  Choose between 'light' or 'dark' theme

    // Event listener for all widget events
    onEvent(event: WidgetEventType) {
      console.log("event", event);
    },

    // Fires when the widget is fully loaded
    onLoad() {
      console.log("onload");
    },

    // Called after the user successfully connects a bank and closes the widget
    onSuccess(event: WidgetEventSuccessType) {
      console.log("onSuccess", event);
      // ...
      // Handle success (e.g., update UI, send data to backend, etc.)
    },

    // Fires when the widget is closed manually by the user
    onClose() {
      console.log("widget closed");
    },

    // Catch and handle widget errors
    onError(event: string) {
      console.log("onError", event);
    },
  });

  // 🧭 Launch the widget
  widgetControls.launch();
}