@zerohash-sdk/csp-fiat-withdrawals-react 0.1.0 → 0.1.2

package/README.md

@@ -1,7 +1,78 @@
 # @zerohash-sdk/csp-fiat-withdrawals-react
 
-This library was generated with [Nx](https://nx.dev).
+A React 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.
 
-## Running unit tests
+## Requirements
 
-Run `nx test @zerohash-sdk/csp-fiat-withdrawals-react` to execute the unit tests via [Vitest](https://vitest.dev/).
+- React 18.0.0 or higher
+- React DOM 18.0.0 or higher
+
+## Installation
+
+```bash
+npm install @zerohash-sdk/csp-fiat-withdrawals-react
+```
+
+## Getting Started
+
+### 1. Import the CspFiatWithdrawals component
+
+```tsx
+import { CspFiatWithdrawals } from '@zerohash-sdk/csp-fiat-withdrawals-react';
+```
+
+### 2. Add it to your app
+
+```tsx
+function App() {
+  const jwt = 'your-jwt-token'; // Obtain this from your backend
+
+  return (
+    <CspFiatWithdrawals
+      jwt={jwt}
+      env="prod" // or "cert" for testing
+      theme="auto"
+    />
+  );
+}
+```
+
+### 3. Configure event callbacks (optional)
+
+```tsx
+<CspFiatWithdrawals
+  jwt={jwt}
+  env="prod"
+  theme="auto"
+  onCompleted={({ amountWithdrawn, assetSymbol }) => {
+    console.log(`Withdrew ${amountWithdrawn} ${assetSymbol}`);
+  }}
+  onError={({ errorCode, reason }) => {
+    console.error(errorCode, reason);
+  }}
+  onClose={() => console.log('Widget closed')}
+  onEvent={(event) => console.log('Event:', event)}
+  onLoaded={() => console.log('Widget ready')}
+/>
+```
+
+## API Reference
+
+### CspFiatWithdrawals Component Props
+
+| Prop          | Type                                         | Required | Default  | Description                                  |
+| ------------- | -------------------------------------------- | -------- | -------- | -------------------------------------------- |
+| `jwt`         | `string`                                     | Yes      | -        | JWT token for authentication with Connect    |
+| `env`         | `"prod" \| "cert" \| "dev" \| "local"`       | No       | `"prod"` | Target environment                           |
+| `theme`       | `"auto" \| "light" \| "dark"`                | No       | `"auto"` | Theme mode for the interface                 |
+| `onCompleted` | `({ amountWithdrawn, assetSymbol }) => void` | No       | -        | Callback when the withdrawal flow completes  |
+| `onError`     | `({ errorCode, reason }) => void`            | No       | -        | Callback for error events                    |
+| `onClose`     | `() => void`                                 | No       | -        | Callback when the widget is closed           |
+| `onEvent`     | `(event) => void`                            | No       | -        | Callback for general events                  |
+| `onLoaded`    | `() => void`                                 | No       | -        | Callback when the widget is loaded and ready |
+
+`onCompleted` payload shape: `{ amountWithdrawn: string; assetSymbol: string }` (asset is always `'USD'`).
+
+## More Information & Support
+
+For comprehensive documentation, visit the [Zerohash Documentation Page](https://docs.zerohash.com/).

package/dist/index.js

@@ -1,37 +1,37 @@
-import u, { useRef as m, useEffect as l } from "react";
+import u, { useRef as m, useEffect as f } from "react";
 const x = {
   local: "http://localhost:5173/csp-fiat-withdrawals-web/index.js",
   dev: "https://connect-sdk.dev.0hash.com/csp-fiat-withdrawals-web/index.js",
   cert: "https://sdk.sandbox.connect.xyz/csp-fiat-withdrawals-web/index.js",
   prod: "https://sdk.connect.xyz/csp-fiat-withdrawals-web/index.js"
-}, b = "zerohash-csp-fiat-withdrawals-script", h = "zerohash-csp-fiat-withdrawals", y = (r = "prod") => x[r], R = ({
-  jwt: r,
-  env: s = "prod",
-  theme: f,
-  onCompleted: c,
-  onError: i,
-  onClose: a,
+}, b = "zerohash-csp-fiat-withdrawals-script", h = "zerohash-csp-fiat-withdrawals", y = (c = "prod") => x[c], R = ({
+  jwt: c,
+  env: r = "prod",
+  theme: e,
+  onCompleted: i,
+  onError: a,
+  onClose: o,
   onLoaded: n,
-  onEvent: o,
+  onEvent: d,
   ...w
 }) => {
-  const d = m(null);
-  return l(() => {
-    const t = d.current;
-    t && (c && (t.onCompleted = c), i && (t.onError = i), a && (t.onClose = a), n && (t.onLoaded = n), o && (t.onEvent = o));
-  }, [c, i, a, n, o]), l(() => {
-    const t = y(s), p = `${b}-${s}`;
-    if (document.getElementById(p))
+  const p = m(null);
+  return f(() => {
+    const t = p.current;
+    t && (e !== void 0 && (t.theme = e), i && (t.onCompleted = i), a && (t.onError = a), o && (t.onClose = o), n && (t.onLoaded = n), d && (t.onEvent = d));
+  }, [e, i, a, o, n, d]), f(() => {
+    const t = y(r), l = `${b}-${r}`;
+    if (document.getElementById(l))
       return;
-    const e = document.createElement("script");
-    e.id = p, e.src = t, e.type = "module", e.async = !0, e.onerror = () => {
-      console.error(`Failed to load the script for ${h} from ${s} environment.`);
-    }, document.head.appendChild(e);
-  }, [s]), u.createElement(h, {
-    ref: d,
-    jwt: r,
-    env: s,
-    theme: f,
+    const s = document.createElement("script");
+    s.id = l, s.src = t, s.type = "module", s.async = !0, s.onerror = () => {
+      console.error(`Failed to load the script for ${h} from ${r} environment.`);
+    }, document.head.appendChild(s);
+  }, [r]), u.createElement(h, {
+    ref: p,
+    jwt: c,
+    env: r,
+    theme: e,
     ...w
   });
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zerohash-sdk/csp-fiat-withdrawals-react",
-  "version": "0.1.0",
+  "version": "0.1.2",
   "private": false,
   "type": "module",
   "main": "./dist/index.js",