@connect-xyz/withdraw-js

A JavaScript SDK that enables frontend applications to seamlessly integrate with the Connect Withdraw product.

Connect Withdraw provides a secure way for end users to withdraw their funds. Learn more in the Connect Withdraw documentation.

Installation

Via NPM (recommended)

npm install @connect-xyz/withdraw-js

import { Withdraw } from '@connect-xyz/withdraw-js';

Via CDN

You can import the script in your index file and use the Withdraw class provided by it.

<script
  type="module"
  src="https://sdk.connect.xyz/withdraw-js/index.js"
></script>

Or you can directly import in your javascript code.

import { Withdraw } from 'https://sdk.connect.xyz/withdraw-js/index.js';

Getting Started

Follow these simple steps to integrate Connect Withdraw into your frontend application:

1. Import the Withdraw module

import { Withdraw } from '@connect-xyz/withdraw-js';

1.1 Or import via CDN

import { Withdraw } from 'https://sdk.connect.xyz/withdraw-js/index.js';

2. Initialize the Withdraw module into Your App

// Create a Withdraw instance with configuration
const withdraw = new Withdraw({
  jwt: 'your-jwt-token',
  env: 'production', // or 'sandbox'
  onError: ({ error, reason }) => {
    console.error('Withdraw error:', error, 'Reason:', reason);
  },
  onClose: () => {
    console.log('Withdraw widget closed');
  },
  onWithdrawal: ({ data }) => {
    console.log('Withdrawal completed:', data);
  },
  onEvent: ({ type, data }) => {
    console.log('Event received:', type, data);
  },
});

// Render the widget to a container element
const container = document.getElementById('withdraw-container');
await withdraw.render(container);

// Update configuration dynamically
withdraw.updateConfig({
  jwt: 'new-jwt-token',
  onError: newErrorHandler,
});

// Check if rendered
if (withdraw.isRendered()) {
  console.log('Widget is active');
}

// Clean up when done
withdraw.destroy();

API Reference

Withdraw widget Props

| Prop | Type | Required | Default | Description | | -------------- | --------------------------------- | -------- | -------------- | -------------------------------------------------- | | jwt | string | Yes | - | JWT token for authentication with Connect Withdraw | | env | "production" \| "sandbox" | No | "production" | Target environment | | onError | ({ errorCode, reason }) => void | No | - | Callback for error events | | onClose | () => void | No | - | Callback when the widget is closed | | onWithdrawal | ({ data }) => void | No | - | Callback for withdrawal completed | | onEvent | ({ type, data }) => void | No | - | Callback for general events |

Constructor

new Withdraw(config: WithdrawConfig)

Creates a new Withdraw instance with the provided configuration.

Parameters

• config (WithdrawConfig): Configuration object
  • jwt (string, required): JWT token for authentication
  • env (string, optional): Environment - 'production' (default) or 'sandbox'
  • onError (function, optional): Error callback
  • onClose (function, optional): Close callback
  • onWithdrawal (function, optional): Withdrawal callback
  • onEvent (function, optional): General event callback

Methods

render(container: HTMLElement): Promise<void>

Renders the Withdraw widget to the specified container element.

await withdraw.render(document.getElementById('withdraw-container'));

updateConfig(config: Partial<WithdrawConfig>): void

Updates the configuration of an already rendered widget.

withdraw.updateConfig({
  jwt: 'new-token',
  onError: newErrorHandler,
});

destroy(): void

Removes the widget from the DOM and cleans up resources.

withdraw.destroy();

isRendered(): boolean

Returns whether the widget is currently rendered.

if (withdraw.isRendered()) {
  // Widget is active
}

getConfig(): WithdrawConfig

Returns a copy of the current configuration.

const config = withdraw.getConfig();
console.log('Current JWT:', config.jwt);

Callback Functions

For detailed information about callback events and their payloads, see the Withdraw SDK Callbacks documentation.

onError

Called when an error occurs in the Withdraw widget.

onError: ({ errorCode, reason }) => {
  // errorCode: Error code
  // reason: Human-readable error description
};

onClose

Called when the Withdraw widget is closed by the user.

onClose: () => {
  // Handle close event
};

onWithdrawal

Called when a withdrawal is completed.

onWithdrawal: ({ data }) => {
  // data: Object containing withdrawal details
};

onEvent

Called for general events from the Withdraw widget.

onEvent: ({ type, data }) => {
  // type: Event type string
  // data: Event-specific data object
};

Browser Support

• Chrome/Edge 90+
• Firefox 88+
• Safari 14+
• All modern browsers with Web Components support

More Information & Support

For comprehensive documentation or support about Connect Withdraw, visit our Documentation Page.