astra-modal-test 1.0.11 → 1.0.12

package/README.md

@@ -1,174 +1,276 @@
-# Astra SDK
-
-Astra SDK is a powerful React library that enables seamless asset bridging between EVM-compatible blockchains and the Bitcoin Lightning Network. Built with modern web technologies, it provides developers with an easy-to-integrate solution for cross-chain liquidity and payments.
-
-### ✨ Features
-
-- **Cross-Chain Bridge**: Bridge assets between EVM chains and Lightning Network.
-- **Multi-Chain Support**: Support for Ethereum, Base, BSC, Botanix testnet, and more.
-- **Wallet Integration**: Built-in support for WalletConnect and popular Web3 wallets.
-- **TypeScript Ready**: Full TypeScript support with type definitions.
-- **Responsive Design**: Mobile-first design with responsive UI components.
-- **Real-time Updates**: Live transaction status and balance updates.
-- **Customizable Theme**: Dark theme with customizable styling.
-
-### 🔄 Workflows
-
-#### 1. Lightning to EVM (Withdraw)
-Used when a user sends BTC via Lightning to receive tokens on an EVM chain.
-
-```mermaid
-sequenceDiagram
-    participant U as User / App
-    participant S as Astra SDK
-    participant L as LSP Node
-    participant E as EVM Chain
-    
-    U->>S: astraSend(amount, assetId)
-    S->>L: Request Quote & Astra Invoice
-    L-->>S: Return LN Invoice
-    S->>U: Display Invoice to User
-    U->>L: User pays via Lightning Wallet
-    L->>E: Trigger Smart Contract Release
-    E-->>U: Mint/Transfer Tokens to User
-```
+# NodeFlow SDK
 
-#### 2. EVM to Lightning (Deposit)
-Used when a user pays with EVM tokens to receive BTC on a Lightning Invoice.
-
-```mermaid
-sequenceDiagram
-    participant U as User / App
-    participant S as Astra SDK
-    participant E as EVM Chain
-    participant L as LSP Node
-    
-    U->>S: astraReceive(invoice, assetId)
-    S-->>U: Show detailed quote
-    U->>E: Approve & Deposit Tokens
-    E-->>L: Lock assets in Contract
-    L->>U: Pay User's Lightning Invoice
-```
+NodeFlow SDK is a React library that enables seamless asset bridging between EVM chains and the Bitcoin Lightning Network.
 
-### 🚀 Quick Start
+## Features
 
-#### Installation
+- **Cross-Chain Bridge**: Bridge assets between EVM chains and Lightning Network
+- **Multi-Chain Support**: Base, BSC, and more
+- **Wallet Integration**: Built-in WalletConnect support
+- **Dynamic Configuration**: Auto-detects supported networks from API
+- **Responsive UI**: Dark theme with customizable modal
 
-Astra SDK requires several peer dependencies to be installed in your project:
+## Installation
 
 ```bash
-npm install @lnfi-network/astra-sdk wagmi viem @reown/appkit @reown/appkit-adapter-wagmi @tanstack/react-query
+yarn add @lnfi-network/nodeflow-sdk
+# or
+npm install @lnfi-network/nodeflow-sdk
 ```
 
-### 🧪 Testnet Environment Setup
+> Peer dependencies (wagmi, viem, @reown/appkit, etc.) will be installed automatically.
 
-To help you get started quickly on the **Base Regtest** testnet, use the following configuration:
+## Configuration
 
 | Item | Value | Description |
 | :--- | :--- | :--- |
-| **Project ID** | `92461524d3cfcb3d78b38b5dbd6a6ce3` | Public demo ID (please use your own for production) |
-| **Env** | `"development"` | Switches to  Regtest / Base Sepolia |
-| **Asset ID** | `f7ac99f2c068f1157c787012f50cb043437505c309c6d8685e135cd8481b1e9d` | **USDT** (Taproot Asset) |
-| **Token Address** | `0x616F1207D8BbC71549b8AC41f4797df72EA39297` | **USDT** (Base Regtest) |
-| **Invoice Generator** | [lnexchange](https://devoflnexchange.unift.xyz/) | Generate Regtest invoices for testing |
+| **Project ID** | Get from [WalletConnect](https://cloud.walletconnect.com/) | Required for wallet connection |
+| **Dev API URL** | `<API_BASE_URL>` | Development/Testnet |
+| **Prod API URL** | *(Contact support)* | Production |
 
-#### Quick Start Example
+---
 
-Here is a copy-paste ready example for Regtest / Base Sepolia :
+## Quick Start
 
 ```jsx
-import React from 'react';
-import { AstraProvider, AstraModal, astraSend, astraReceive } from '@lnfi-network/astra-sdk';
-
-// Testnet Asset ID for USDT
-const USDT_ASSET_ID = "f7ac99f2c068f1157c787012f50cb043437505c309c6d8685e135cd8481b1e9d";
+import { 
+  NodeFlowProvider, 
+  NodeFlowModal, 
+  nodeFlowSend, 
+  nodeFlowReceive,
+  useNodeFlowPairs  // Hook to get available asset pairs
+} from '@lnfi-network/nodeflow-sdk';
 
 function App() {
   return (
-    <AstraProvider 
-      projectId="92461524d3cfcb3d78b38b5dbd6a6ce3" 
-      env="development"
+    <NodeFlowProvider 
+      projectId="your-walletconnect-project-id" 
+      apiUrl="<API_BASE_URL>"
     >
-      <AstraModal />
-      
-      {/* 1. Lightning to EVM (Withdraw USDT) */}
-      <button onClick={() => astraSend({
-        assetId: USDT_ASSET_ID,
-        amount: 10000,
-        waitConfirm: true,
-        onAstraInvoice: (invoice, tx, txUrl) => {
-          console.log("Pay this Invoice:", invoice);
-        }
+      <NodeFlowModal />
+      <MyBridgeUI />
+    </NodeFlowProvider>
+  );
+}
+
+function MyBridgeUI() {
+  // Get available trading pairs dynamically - no hardcoded asset IDs needed!
+  const { pairs, defaultAssetId, isReady } = useNodeFlowPairs();
+  
+  if (!isReady) return <div>Loading...</div>;
+
+  return (
+    <div>
+      {/* Lightning → EVM: Get tokens by paying LN invoice */}
+      <button onClick={() => nodeFlowSend({
+        assetId: defaultAssetId,  // Use dynamic asset ID
+        amount: 1000,             // Amount in sats
+        onSuccess: (result) => console.log('Success!', result)
       })}>
-        Get USDT on Base Sepolia
+        Get Tokens (Pay Lightning)
       </button>
       
-      {/* 2. EVM to Lightning (Deposit USDT) */}
-      <button onClick={() => astraReceive({
-        assetId: USDT_ASSET_ID,
-        invoice: "lnbcrt1..." // Get a test invoice from: https://devoflnexchange.unift.xyz/
+      {/* EVM → Lightning: Pay LN invoice with tokens */}
+      <button onClick={() => nodeFlowReceive({
+        assetId: defaultAssetId,
+        invoice: "lnbc...",       // Lightning invoice to pay
+        onSuccess: (result) => console.log('Paid!', result)
       })}>
-        Pay Lightning Invoice with USDT
+        Pay Invoice (Use Tokens)
       </button>
-    </AstraProvider>
+    </div>
   );
 }
 ```
 
-### 📖 API Reference
+---
+
+## How It Works
+
+### Lightning → EVM (Get Tokens)
+
+User pays a Lightning invoice to receive EVM tokens.
+
+```
+┌─────────────────────────────────────────────────────────────────────────────┐
+│                    Lightning → EVM (nodeFlowSend)                           │
+└─────────────────────────────────────────────────────────────────────────────┘
+
+    User                           SDK                           LSP Node
+      │                              │                               │
+      │  nodeFlowSend({              │                               │
+      │    assetId, amount           │                               │
+      │  })                          │                               │
+      ├─────────────────────────────►│                               │
+      │                              │                               │
+      │                              │  Request Quote & Invoice      │
+      │                              ├──────────────────────────────►│
+      │                              │  ◄── { invoice }              │
+      │                              │                               │
+      │  Show Invoice QR             │                               │
+      ◄──────────────────────────────│                               │
+      │                              │                               │
+      │  User pays via LN wallet     │                               │
+      ├──────────────────────────────┼──────────────────────────────►│
+      │                              │                               │
+      │                              │  LSP releases tokens on-chain │
+      │                              │  ◄──────────────────────────────
+      │                              │                               │
+      │  ✅ Tokens received!          │                               │
+      ◄──────────────────────────────│                               │
+```
+
+### EVM → Lightning (Pay Invoice)
+
+User pays a Lightning invoice using their EVM tokens.
+
+```
+┌─────────────────────────────────────────────────────────────────────────────┐
+│                    EVM → Lightning (nodeFlowReceive)                        │
+└─────────────────────────────────────────────────────────────────────────────┘
+
+    User                           SDK                           LSP Node
+      │                              │                               │
+      │  nodeFlowReceive({           │                               │
+      │    assetId, invoice          │                               │
+      │  })                          │                               │
+      ├─────────────────────────────►│                               │
+      │                              │                               │
+      │  Show quote & confirm        │                               │
+      ◄──────────────────────────────│                               │
+      │                              │                               │
+      │  Approve & Deposit tokens    │                               │
+      ├─────────────────────────────►│                               │
+      │                              │                               │
+      │                              │  Lock tokens in contract      │
+      │                              ├──────────────────────────────►│
+      │                              │                               │
+      │                              │  LSP pays LN invoice          │
+      │                              │  ◄──────────────────────────────
+      │                              │                               │
+      │  ✅ Invoice paid!             │                               │
+      ◄──────────────────────────────│                               │
+```
+
+---
+
+## API Reference
+
+### Components
 
-#### AstraProvider
+#### `<NodeFlowProvider>`
 
-| Prop | Type | Default | Description |
+Main provider component. Wrap your app with this.
+
+| Prop | Type | Required | Description |
 | :--- | :--- | :--- | :--- |
-| `projectId` | `string` | **Required** | WalletConnect project ID from [cloud.reown.com](https://cloud.reown.com) |
-| `env` | `'production' \| 'development'` | `'production'` | Environment mode. 'development' uses testnets (Sepolia, Base Sepolia) |
-| `metadata` | `object` | `defaultMetadata` | App metadata for WalletConnect (name, description, url, icons) |
-| `apiUrl` | `string` | See note | Backend API URL. Automatically switches based on `env` |
-| `adapter` | `WagmiAdapter` | `null` | Optional custom Wagmi adapter if you want to reuse existing configuration |
+| `projectId` | `string` | ✅ | WalletConnect Project ID |
+| `apiUrl` | `string` | ✅ | NodeFlow API URL |
+| `themeMode` | `'dark' \| 'light'` | - | Theme mode (default: `'dark'`) |
+| `customNetworks` | `Network[]` | - | Custom network configuration |
+
+#### `<NodeFlowModal>`
+
+Modal component for transaction UI. Add once inside the provider.
 
-#### astraSend
+---
+
+### Functions
+
+#### `nodeFlowSend(options)`
 
-Bridge assets from **Lightning Network to EVM** chains.
+Lightning → EVM: Get tokens by paying a Lightning invoice.
 
-| Parameter | Type | Description |
+| Option | Type | Description |
 | :--- | :--- | :--- |
-| `assetId` | `string` | The ID of the asset to bridge |
+| `assetId` | `string` | Asset ID (get from `useNodeFlowPairs`) |
 | `amount` | `number` | Amount in satoshis |
-| `waitConfirm` | `boolean` | Whether to wait for transaction confirmation (default: `true`) |
-| `onAstraInvoice` | `function` | Callback: `(invoice, tx, txUrl) => void` |
+| `onProgress` | `(step, data) => void` | Progress callback |
+| `onSuccess` | `(result) => void` | Success callback |
+| `onError` | `(error) => void` | Error callback |
+
+**Progress steps**: `'init'` → `'signature'` → `'deposit'` → `'pending'` → `'complete'`
+
+```javascript
+const result = await nodeFlowSend({
+  assetId: defaultAssetId,
+  amount: 1000,
+  onProgress: (step) => console.log('Step:', step),
+  onSuccess: (result) => console.log('Success:', result),
+});
+```
 
-#### astraReceive
+#### `nodeFlowReceive(options)`
 
-Bridge assets from **EVM chains to Lightning Network**.
+EVM → Lightning: Pay a Lightning invoice using tokens.
 
-| Parameter | Type | Description |
+| Option | Type | Description |
 | :--- | :--- | :--- |
-| `assetId` | `string` | The ID of the asset to bridge |
-| `invoice` | `string` | The Lightning Network invoice where you want to receive funds |
+| `assetId` | `string` | Asset ID (get from `useNodeFlowPairs`) |
+| `invoice` | `string` | Lightning invoice to pay |
+| `onProgress` | `(step, data) => void` | Progress callback |
+| `onSuccess` | `(result) => void` | Success callback |
+| `onError` | `(error) => void` | Error callback |
+
+**Progress steps**: `'init'` → `'approve'` → `'deposit'` → `'complete'`
+
+```javascript
+const result = await nodeFlowReceive({
+  assetId: defaultAssetId,
+  invoice: 'lnbc...',
+  onSuccess: (result) => console.log('Paid:', result),
+});
+```
 
-### 🛠️ Technical Stack
+---
 
-- **React 18** - UI library
-- **Wagmi & Viem** - Ethereum hooks & interface
-- **Reown AppKit** - Wallet connection
-- **Ant Design** - UI components (with `astra` prefix)
-- **Zustand** - State management
+### Hooks
 
-### 📄 License
+#### `useNodeFlowPairs()`
 
-MIT License - see [LICENSE](LICENSE) file for details.
+Get available trading pairs for the current chain.
+
+```javascript
+const { 
+  pairs,          // All available pairs
+  defaultAssetId, // First pair's asset ID
+  currentPair,    // Currently selected pair
+  setCurrentPair, // Set current pair
+  isReady         // Whether pairs are loaded
+} = useNodeFlowPairs();
+```
+
+#### `useNodeFlowState()`
+
+Get SDK configuration state.
+
+```javascript
+const { 
+  supportedChainIds, // Supported chain IDs from backend
+  isConfigReady,     // Config loaded
+  apiUrl,            // Current API URL
+  targetNetwork      // Current network
+} = useNodeFlowState();
+```
 
 ---
 
-### � Changelog
+## Using NodeFlowConfig (Existing Wagmi Setup)
 
-#### v1.0.1
-- Official release
-- Corrected package name to `@lnfi-network/astra-sdk`
-- Added comprehensive environment configuration support
-- Updated API callback signatures
+If you already have Wagmi configured in your app, use `NodeFlowConfig` instead:
+
+```jsx
+import { NodeFlowConfig, NodeFlowModal } from '@lnfi-network/nodeflow-sdk';
+
+// Inside your existing WagmiProvider
+<NodeFlowConfig apiUrl="<API_BASE_URL>">
+  <NodeFlowModal />
+  <YourApp />
+</NodeFlowConfig>
+```
 
 ---
 
-Built with ❤️ by the Astra Labs team
+## License
+
+MIT

package/dist/{SwapController-Ck3TYcMp.js → SwapController-mYFErPzx.js}

@@ -1,4 +1,4 @@
-import { N as l, L as G, M as O, R as f, S as g, O as E, P as S, Q as U, T as D, U as B, V as P, X as b, Y as M, Z as C, _ as z, $ as R, a0 as V, a1 as x, a2 as H, a3 as $, a4 as Q, a5 as q } from "./index-Zh6wUpmX.js";
+import { N as l, L as G, M as O, R as f, S as g, O as E, P as S, Q as U, T as D, U as B, V as P, X as b, Y as M, Z as C, _ as z, $ as R, a0 as V, a1 as x, a2 as H, a3 as $, a4 as Q, a5 as q } from "./index-LucuShOc.js";
 const I = {
   getGasPriceInEther(n, t) {
     const o = t * n;

package/dist/{add-BmBLHIEe.js → add-CXtFvysR.js}

@@ -1,4 +1,4 @@
-import { D as l } from "./index-Zh6wUpmX.js";
+import { D as l } from "./index-LucuShOc.js";
 const o = l`<svg
   width="14"
   height="14"

package/dist/{all-wallets-H2aaJ2oP.js → all-wallets-B9fFXw5x.js}

@@ -1,4 +1,4 @@
-import { D as a } from "./index-Zh6wUpmX.js";
+import { D as a } from "./index-LucuShOc.js";
 const o = a`<svg fill="none" viewBox="0 0 24 24">
   <path
     style="fill: var(--wui-color-accent-100);"

package/dist/{app-store-Bvhe1BkA.js → app-store-BXf1yvR8.js}

@@ -1,4 +1,4 @@
-import { D as a } from "./index-Zh6wUpmX.js";
+import { D as a } from "./index-LucuShOc.js";
 const e = a`
 <svg width="36" height="36">
   <path

package/dist/{apple-BCIKns5c.js → apple-DtcOcX1n.js}

@@ -1,4 +1,4 @@
-import { D as l } from "./index-Zh6wUpmX.js";
+import { D as l } from "./index-LucuShOc.js";
 const f = l`<svg fill="none" viewBox="0 0 40 40">
   <g clip-path="url(#a)">
     <g clip-path="url(#b)">

package/dist/{arrow-bottom-i1ChNkSf.js → arrow-bottom-BXeLKqSV.js}

@@ -1,4 +1,4 @@
-import { D as o } from "./index-Zh6wUpmX.js";
+import { D as o } from "./index-LucuShOc.js";
 const e = o`<svg fill="none" viewBox="0 0 14 15">
   <path
     fill="currentColor"

package/dist/{arrow-bottom-circle-Dpcn0z0p.js → arrow-bottom-circle-BVUU200N.js}

@@ -1,4 +1,4 @@
-import { D as C } from "./index-Zh6wUpmX.js";
+import { D as C } from "./index-LucuShOc.js";
 const e = C`<svg
   fill="none"
   viewBox="0 0 21 20"

package/dist/{arrow-left-Dj8tzUf6.js → arrow-left-LguJPyNR.js}

@@ -1,4 +1,4 @@
-import { D as e } from "./index-Zh6wUpmX.js";
+import { D as e } from "./index-LucuShOc.js";
 const o = e`<svg fill="none" viewBox="0 0 14 15">
   <path
     fill="currentColor"

package/dist/{arrow-right-DVd3R-0K.js → arrow-right-D9kKZzGG.js}

@@ -1,4 +1,4 @@
-import { D as l } from "./index-Zh6wUpmX.js";
+import { D as l } from "./index-LucuShOc.js";
 const e = l`<svg fill="none" viewBox="0 0 14 15">
   <path
     fill="currentColor"

package/dist/{arrow-top-DcD5wbZL.js → arrow-top-C5JcaCqz.js}

@@ -1,4 +1,4 @@
-import { D as o } from "./index-Zh6wUpmX.js";
+import { D as o } from "./index-LucuShOc.js";
 const e = o`<svg fill="none" viewBox="0 0 14 15">
   <path
     fill="currentColor"

package/dist/{bank-CToLOTy3.js → bank-DgbCzr0A.js}

@@ -1,4 +1,4 @@
-import { D as e } from "./index-Zh6wUpmX.js";
+import { D as e } from "./index-LucuShOc.js";
 const o = e`<svg
   xmlns="http://www.w3.org/2000/svg"
   width="12"

package/dist/{bin-D8m48Dk5.js → bin-ykHym2bC.js}

@@ -1,4 +1,4 @@
-import { D as C } from "./index-Zh6wUpmX.js";
+import { D as C } from "./index-LucuShOc.js";
 const o = C`<svg viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg">
 <path fill-rule="evenodd" clip-rule="evenodd" d="M3.90029 1.71429C4.09883 0.736183 4.96358 0 6.00028 0C7.03698 0 7.90173 0.736183 8.10027 1.71429H9.41533C9.42361 1.71417 9.4319 1.71417 9.44022 1.71429H10.286C10.7594 1.71429 11.1431 2.09804 11.1431 2.57143C11.1431 3.04482 10.7594 3.42857 10.286 3.42857H10.1855L9.73675 7.01877C9.6785 7.48493 9.6279 7.88983 9.55601 8.22075C9.47948 8.57304 9.36472 8.91574 9.13613 9.22925C8.91553 9.53181 8.63151 9.78254 8.30392 9.96392C7.96448 10.1519 7.61019 10.2232 7.25112 10.2555C6.91385 10.2858 6.50581 10.2857 6.03603 10.2857H5.96453C5.49475 10.2857 5.08671 10.2858 4.74944 10.2555C4.39037 10.2232 4.03608 10.1519 3.69664 9.96392C3.36905 9.78254 3.08503 9.53181 2.86442 9.22925C2.63583 8.91574 2.52108 8.57304 2.44455 8.22075C2.37266 7.88984 2.32206 7.48496 2.26382 7.0188L1.81504 3.42857H1.71456C1.24118 3.42857 0.857422 3.04482 0.857422 2.57143C0.857422 2.09804 1.24118 1.71429 1.71456 1.71429H2.56034C2.56866 1.71417 2.57695 1.71417 2.58522 1.71429H3.90029ZM3.54266 3.42857L3.96043 6.77068C4.02441 7.2825 4.06617 7.61016 4.11976 7.85681C4.17051 8.09045 4.21726 8.17492 4.2496 8.21928C4.32314 8.32013 4.41781 8.4037 4.52701 8.46416C4.57504 8.49076 4.66465 8.52666 4.90278 8.54805C5.15417 8.57063 5.48448 8.57143 6.00028 8.57143C6.51608 8.57143 6.84638 8.57063 7.09778 8.54805C7.33591 8.52666 7.42552 8.49076 7.47355 8.46416C7.58275 8.4037 7.67742 8.32013 7.75096 8.21928C7.7833 8.17491 7.83005 8.09045 7.8808 7.85681C7.93439 7.61016 7.97615 7.2825 8.04013 6.77068L8.4579 3.42857H3.54266Z" fill="currentColor"/>
 </svg>

package/dist/{bitcoin-y6S4LO0p.js → bitcoin-B8jzy_uV.js}

@@ -1,4 +1,4 @@
-import { D as L } from "./index-Zh6wUpmX.js";
+import { D as L } from "./index-LucuShOc.js";
 const i = L`
 <svg width="13" height="12" viewBox="0 0 13 12" fill="none" xmlns="http://www.w3.org/2000/svg">
 <g clip-path="url(#clip0_24458_3947)">

package/dist/{browser-DRhVaQQT.js → browser-Bk8u8PAA.js}

@@ -1,4 +1,4 @@
-import { D as l } from "./index-Zh6wUpmX.js";
+import { D as l } from "./index-LucuShOc.js";
 const a = l`<svg fill="none" viewBox="0 0 20 20">
   <path
     fill="currentColor"

package/dist/{card-BK0q3S4W.js → card-DcwQMUca.js}

@@ -1,4 +1,4 @@
-import { D as C } from "./index-Zh6wUpmX.js";
+import { D as C } from "./index-LucuShOc.js";
 const l = C`<svg
   xmlns="http://www.w3.org/2000/svg"
   width="12"