# @transak/transak-sdk

> Transak SDK that allows you to easily integrate fiat on/off ramp

Latest version **4.0.2** (published 2025-11-13) · ISC license · 0 weekly downloads

> **Deprecated.** This package is deprecated.

## Install

```sh
npm install @transak/transak-sdk
pnpm add @transak/transak-sdk
yarn add @transak/transak-sdk
bun add @transak/transak-sdk
```

## Health

**Score 10/100 (F)** — status: deprecated.

Negative: deprecated.

## Facts

| | |
|---|---|
| Version | 4.0.2 |
| Published | 2025-11-13 |
| First published | 2020-02-17 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Node | >=20.0.0 |
| Dependencies | 2 |
| Unpacked size | 59.3 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | Transak |
| Maintainers | sshandilya, kutsav, aditya1910, transakgs, devops-transak |
| Keywords | crypto, cryptocurrency, fiat, on, off, ramp, sdk, ts, js |

## Links

- npm: https://www.npmjs.com/package/@transak/transak-sdk
- Homepage: https://docs.transak.com/docs/web-integration#transak-sdk-reactvueangularts
- npm.io page: https://npm.io/package/@transak/transak-sdk

## Dependencies (2)

- [events](https://npm.io/package/events.md) ^3.3.0
- [query-string](https://npm.io/package/query-string.md) ^9.3.0

## Alternatives

- [@mapbox/jsonlint-lines-primitives](https://npm.io/package/@mapbox/jsonlint-lines-primitives.md) — 5.3M weekly downloads
- [reftools](https://npm.io/package/reftools.md) — 3.5M weekly downloads
- [@hey-api/openapi-ts](https://npm.io/package/@hey-api/openapi-ts.md) — 3.5M weekly downloads
- [@mapbox/geojson-rewind](https://npm.io/package/@mapbox/geojson-rewind.md) — 2.4M weekly downloads
- [turbo-stream](https://npm.io/package/turbo-stream.md) — 1.7M weekly downloads

## Recent versions

- 4.0.2 (latest) — 2025-11-13
- 2.0.0-rc.0 (rc) — 2023-10-06
- 4.0.1 — 2025-11-12
- 4.0.0 — 2025-09-17
- 3.2.2 — 2025-08-20
- 3.2.1 — 2025-08-06
- 3.2.0 — 2025-01-22
- 3.1.4 — 2024-12-18
- 3.1.3 — 2024-09-23
- 3.1.2 — 2024-07-23
- 3.1.1 — 2024-04-16
- 3.1.0 — 2024-04-05
- 3.0.1 — 2024-02-22
- 3.0.0 — 2024-02-20
- 2.1.3 — 2024-01-30
- … 46 more at https://npm.io/package/@transak/transak-sdk/versions

## README

# Transak SDK

A JavaScript SDK for decentralized applications to onboard their global user base with fiat currency.

> [!WARNING]
> **This package is no longer actively maintained.**
>
> While it will continue to work as expected, it will not receive further updates or new features.
>
> For the latest improvements and ongoing support, please use [@transak/ui-js-sdk](https://www.npmjs.com/package/@transak/ui-js-sdk) instead.

## Migrating from v3.x

- 🔗 **Widget URL Mandatory**: This SDK now only supports API-based Transak Widget URL. Please refer the detailed migration guide [here](https://docs.transak.com/docs/migration-to-api-based-transak-widget-url).

## Installation

```sh
npm i @transak/transak-sdk
```

## Example usage

```html
<div id="transakMount"></div>
```

```ts
import { TransakConfig, Transak } from '@transak/transak-sdk';

// Complete example with session URL
const initializeTransak = async () => {
  const transakConfig: TransakConfig = {
    widgetUrl: 'api-generated-widgetUrl', // Required
    referrer: 'https://your-app.com', // Required - Must be a valid URL
    containerId: 'transakMount', // Id of the element where you want to initialize the iframe
    widgetWidth: '100%', // Optional widget dimensions
    widgetHeight: '600px',
  };

  let transak = new Transak(transakConfig);
  transak.init();

  return transak;
};

// Initialize the widget
const transak = await initializeTransak();

// This will trigger when the user closed the widget
Transak.on(Transak.EVENTS.TRANSAK_WIDGET_CLOSE, () => {
  console.log('Transak SDK closed!');
});

/*
 * This will trigger when the user has confirmed the order
 * This doesn't guarantee that payment has completed in all scenarios
 * If you want to close/navigate away, use the TRANSAK_ORDER_SUCCESSFUL event
 */
Transak.on(Transak.EVENTS.TRANSAK_ORDER_CREATED, (orderData) => {
  console.log(orderData);
});

/*
 * This will trigger when the user marks payment is made
 * You can close/navigate away at this event
 */
Transak.on(Transak.EVENTS.TRANSAK_ORDER_SUCCESSFUL, (orderData) => {
  console.log(orderData);
  transak.cleanup();
});
```

## TransakConfig

| Property       | Type   | Required | Description                                                                                                              |
|:---------------|:-------|:---------|:-------------------------------------------------------------------------------------------------------------------------|
| widgetUrl      | string | Yes      | [API generated widgetUrl](https://docs.transak.com/docs/migration-to-api-based-transak-widget-url#widget-url-generation) |
| referrer       | string | Yes      | Valid URL of your app/website (e.g., https://your-app.com)                                                               |
| `containerId`  | string | No       | HTML element ID to mount the widget (omit for modal)                                                                     |
| `widgetWidth`  | string | No       | Widget width (e.g., '100%', '400px')                                                                                     |
| `widgetHeight` | string | No       | Widget height (e.g., '600px', '100vh')                                                                                   |

### Using Modal UI

If you want to use our modal UI, do not pass the `containerId` and use `transak.close()` instead of `transak.cleanup()`

### React Gotchas

Remember to clean up by using the `transak.cleanup()` or `transak.close()`

```ts
useEffect(() => {
  return () => {
    transak.cleanup();
  };
}, []);
```

## License

ISC Licensed. Copyright (c) Transak Inc.

---
_Source: https://npm.io/package/@transak/transak-sdk · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._
