@zerohash-sdk/csp-fiat-withdrawals-js 0.1.0 → 0.1.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +130 -3
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -1,7 +1,134 @@
|
|
|
1
1
|
# @zerohash-sdk/csp-fiat-withdrawals-js
|
|
2
2
|
|
|
3
|
-
|
|
3
|
+
A framework-agnostic JavaScript SDK for embedding the Zerohash CSP Fiat Withdrawals flow into web applications. Lets users withdraw fiat (USD) from their account to a linked bank account via ACH.
|
|
4
4
|
|
|
5
|
-
##
|
|
5
|
+
## Installation
|
|
6
6
|
|
|
7
|
-
|
|
7
|
+
### Via NPM (recommended)
|
|
8
|
+
|
|
9
|
+
```bash
|
|
10
|
+
npm install @zerohash-sdk/csp-fiat-withdrawals-js
|
|
11
|
+
```
|
|
12
|
+
|
|
13
|
+
```javascript
|
|
14
|
+
import { CspFiatWithdrawals } from '@zerohash-sdk/csp-fiat-withdrawals-js';
|
|
15
|
+
```
|
|
16
|
+
|
|
17
|
+
### Via CDN
|
|
18
|
+
|
|
19
|
+
```html
|
|
20
|
+
<script
|
|
21
|
+
type="module"
|
|
22
|
+
src="https://sdk.connect.xyz/csp-fiat-withdrawals-web/index.js"
|
|
23
|
+
></script>
|
|
24
|
+
```
|
|
25
|
+
|
|
26
|
+
Or import directly:
|
|
27
|
+
|
|
28
|
+
```javascript
|
|
29
|
+
import { CspFiatWithdrawals } from 'https://sdk.connect.xyz/csp-fiat-withdrawals-web/index.js';
|
|
30
|
+
```
|
|
31
|
+
|
|
32
|
+
## Getting Started
|
|
33
|
+
|
|
34
|
+
### 1. Import
|
|
35
|
+
|
|
36
|
+
```javascript
|
|
37
|
+
import { CspFiatWithdrawals } from '@zerohash-sdk/csp-fiat-withdrawals-js';
|
|
38
|
+
```
|
|
39
|
+
|
|
40
|
+
### 2. Initialize and render
|
|
41
|
+
|
|
42
|
+
```javascript
|
|
43
|
+
const cspFiatWithdrawals = new CspFiatWithdrawals({
|
|
44
|
+
jwt: 'your-jwt-token',
|
|
45
|
+
env: 'prod',
|
|
46
|
+
theme: 'auto',
|
|
47
|
+
onCompleted: ({ amountWithdrawn, assetSymbol }) => {
|
|
48
|
+
console.log(`Withdrew ${amountWithdrawn} ${assetSymbol}`);
|
|
49
|
+
},
|
|
50
|
+
onError: ({ errorCode, reason }) => {
|
|
51
|
+
console.error(errorCode, reason);
|
|
52
|
+
},
|
|
53
|
+
onClose: () => console.log('Closed'),
|
|
54
|
+
onEvent: (event) => console.log('Event:', event),
|
|
55
|
+
onLoaded: () => console.log('Ready'),
|
|
56
|
+
});
|
|
57
|
+
|
|
58
|
+
const container = document.getElementById('csp-fiat-withdrawals-container');
|
|
59
|
+
await cspFiatWithdrawals.render(container);
|
|
60
|
+
|
|
61
|
+
// Update configuration dynamically
|
|
62
|
+
cspFiatWithdrawals.updateConfig({ jwt: 'new-jwt-token', theme: 'dark' });
|
|
63
|
+
|
|
64
|
+
// Clean up when done
|
|
65
|
+
cspFiatWithdrawals.destroy();
|
|
66
|
+
```
|
|
67
|
+
|
|
68
|
+
### TypeScript
|
|
69
|
+
|
|
70
|
+
```typescript
|
|
71
|
+
import { CspFiatWithdrawals, CspFiatWithdrawalsConfig } from '@zerohash-sdk/csp-fiat-withdrawals-js';
|
|
72
|
+
|
|
73
|
+
const config: CspFiatWithdrawalsConfig = {
|
|
74
|
+
jwt: 'your-jwt-token',
|
|
75
|
+
env: 'cert',
|
|
76
|
+
theme: 'dark',
|
|
77
|
+
onCompleted: ({ amountWithdrawn, assetSymbol }) => {
|
|
78
|
+
console.log(`Withdrew ${amountWithdrawn} ${assetSymbol}`);
|
|
79
|
+
},
|
|
80
|
+
};
|
|
81
|
+
|
|
82
|
+
const csp = new CspFiatWithdrawals(config);
|
|
83
|
+
await csp.render(document.getElementById('csp-fiat-withdrawals-container')!);
|
|
84
|
+
```
|
|
85
|
+
|
|
86
|
+
## API Reference
|
|
87
|
+
|
|
88
|
+
### Configuration
|
|
89
|
+
|
|
90
|
+
| Prop | Type | Required | Default | Description |
|
|
91
|
+
| ------------- | -------------------------------------------- | -------- | -------- | -------------------------------------------- |
|
|
92
|
+
| `jwt` | `string` | Yes | - | JWT token for authentication with Connect |
|
|
93
|
+
| `env` | `"prod" \| "cert" \| "dev" \| "local"` | No | `"prod"` | Target environment |
|
|
94
|
+
| `theme` | `"auto" \| "light" \| "dark"` | No | `"auto"` | Theme mode for the interface |
|
|
95
|
+
| `onCompleted` | `({ amountWithdrawn, assetSymbol }) => void` | No | - | Callback when the withdrawal flow completes |
|
|
96
|
+
| `onError` | `({ errorCode, reason }) => void` | No | - | Callback for error events |
|
|
97
|
+
| `onClose` | `() => void` | No | - | Callback when the widget is closed |
|
|
98
|
+
| `onEvent` | `(event) => void` | No | - | Callback for general events |
|
|
99
|
+
| `onLoaded` | `() => void` | No | - | Callback when the widget is loaded and ready |
|
|
100
|
+
|
|
101
|
+
`onCompleted` payload shape: `{ amountWithdrawn: string; assetSymbol: string }` (asset is always `'USD'`).
|
|
102
|
+
|
|
103
|
+
### Methods
|
|
104
|
+
|
|
105
|
+
#### `render(container: HTMLElement): Promise<void>`
|
|
106
|
+
|
|
107
|
+
Renders the widget into the given container.
|
|
108
|
+
|
|
109
|
+
#### `updateConfig(config: Partial<CspFiatWithdrawalsConfig>): void`
|
|
110
|
+
|
|
111
|
+
Updates the configuration of an already rendered widget.
|
|
112
|
+
|
|
113
|
+
#### `destroy(): void`
|
|
114
|
+
|
|
115
|
+
Removes the widget from the DOM and cleans up resources.
|
|
116
|
+
|
|
117
|
+
#### `isRendered(): boolean`
|
|
118
|
+
|
|
119
|
+
Returns whether the widget is currently rendered.
|
|
120
|
+
|
|
121
|
+
#### `getConfig(): CspFiatWithdrawalsConfig`
|
|
122
|
+
|
|
123
|
+
Returns a copy of the current configuration.
|
|
124
|
+
|
|
125
|
+
## Browser Support
|
|
126
|
+
|
|
127
|
+
- Chrome / Edge 90+
|
|
128
|
+
- Firefox 88+
|
|
129
|
+
- Safari 14+
|
|
130
|
+
- All modern browsers with Web Components support
|
|
131
|
+
|
|
132
|
+
## More Information & Support
|
|
133
|
+
|
|
134
|
+
For comprehensive documentation, visit the [Zerohash Documentation Page](https://docs.zerohash.com/).
|