@vela-ventures/aosync-sdk-react 1.0.0 → 1.0.1

package/README.md

@@ -0,0 +1,100 @@
+# Wallet SDK for Arweave
+
+A lightweight React hook and context provider for integrating the Beacon Wallet into your React applications.
+
+## Features
+
+- Easily manage wallet connections.
+- Send AR transactions.
+- Sign messages and transactions.
+- Retrieve wallet addresses.
+
+## Installation
+
+Install the package via npm:
+
+```bash
+npm install @vela-ventures/ao-sync-sdk
+```
+
+## Usage
+
+### 1: Wrap Your App with WalletProvider
+To enable wallet functionality across your app, wrap your application with the WalletProvider:
+```javascript
+import React from "react";
+import { WalletProvider } from "@vela-ventures/ao-sync-sdk";
+
+const App = () => {
+  return (
+    <WalletProvider>
+      <YourApp />
+    </WalletProvider>
+  );
+};
+```
+### 2. Use the useWallet Hook
+Access wallet functionality in any component with the useWallet hook:
+```javascript
+import React from "react";
+import { useWallet } from "@vela-ventures/ao-sync-sdk";
+
+const WalletComponent = () => {
+  const {
+    isConnected,
+    connect,
+    disconnect,
+    getAddress,
+    sendAR,
+  } = useWallet();
+
+  const handleConnect = async () => {
+    await connect();
+    const address = await getAddress();
+    console.log("Connected wallet address:", address);
+  };
+
+  const handleSendAR = async () => {
+    try {
+      await sendAR("recipient-address", "1000000"); // 1 AR (in winstons)
+      console.log("AR sent successfully!");
+    } catch (error) {
+      console.error("Error sending AR:", error);
+    }
+  };
+
+  return (
+    <div>
+      <h1>Wallet Status: {isConnected ? "Connected" : "Disconnected"}</h1>
+      {!isConnected ? (
+        <button onClick={handleConnect}>Connect Wallet</button>
+      ) : (
+        <button onClick={disconnect}>Disconnect Wallet</button>
+      )}
+      {isConnected && <button onClick={handleSendAR}>Send AR</button>}
+    </div>
+  );
+};
+
+export default WalletComponent;
+```
+## API
+
+### `useWallet`
+
+The `useWallet` hook provides the following methods and properties:
+
+| Method/Property          | Description                                                                 |
+|--------------------------|-----------------------------------------------------------------------------|
+| `isConnected`            | Boolean indicating if the wallet is connected.                              |
+| `connect()`              | Connects to the wallet.                                                     |
+| `disconnect()`           | Disconnects from the wallet.                                                |
+| `getAddress()`           | Returns the currently active wallet address.                                |
+| `getAllAddresses()`      | Returns all wallet addresses.                                               |
+| `sendAR(recipient, quantity)` | Sends AR to the specified address.                                     |
+| `sign(transaction)`      | Signs a transaction using the wallet.                                       |
+| `signAOMessage(target, recipient, quantity)` | Signs a custom AO message.                              |
+
+## License
+
+MIT License © 2025 Vela Ventures

package/dist/index.d.ts

@@ -1 +1 @@
-export { useWallet } from "./useWallet";
+export { WalletProvider, useWallet } from "./walletProvider";

package/dist/index.js

@@ -1 +1 @@
-export { useWallet } from "./useWallet";
+export { WalletProvider, useWallet } from "./walletProvider";

package/dist/useWallet.d.ts

@@ -1,13 +0,0 @@
-import Transaction from "arweave/web/lib/transaction";
-interface UseAOWalletReturn {
-    isConnected: boolean;
-    connect: () => Promise<void>;
-    disconnect: () => Promise<void>;
-    getAllAddresses: () => Promise<string[]>;
-    getAddress: () => Promise<string | undefined>;
-    sendAR: (recipient: string, quantity: string) => Promise<any>;
-    signAOMessage: (target: string, recipient: string, quantity: string) => Promise<any>;
-    sign: (transaction: Transaction) => Promise<Transaction>;
-}
-export declare const useWallet: () => UseAOWalletReturn;
-export {};

package/dist/useWallet.js

@@ -1,136 +1 @@
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
-import { useEffect, useRef, useState } from "react";
-import WalletClient from "@vela-ventures/ao-sync-sdk";
-import Arweave from "arweave";
-export const useWallet = () => {
-    const [isConnected, setIsConnected] = useState(false);
-    const walletRef = useRef(new WalletClient());
-    useEffect(() => {
-        const wallet = walletRef.current;
-        wallet.reconnect();
-        const handleDisconnect = () => setIsConnected(false);
-        const handleConnect = () => setIsConnected(true);
-        wallet.on("disconnected", handleDisconnect);
-        wallet.on("connected", handleConnect);
-        return () => {
-            wallet.off("disconnected", handleDisconnect);
-            wallet.off("connected", handleConnect);
-        };
-    }, []);
-    const connect = () => __awaiter(void 0, void 0, void 0, function* () {
-        try {
-            yield walletRef.current.connect({});
-        }
-        catch (error) {
-            console.error("Error connecting wallet:", error);
-            throw error;
-        }
-    });
-    const disconnect = () => __awaiter(void 0, void 0, void 0, function* () {
-        try {
-            yield walletRef.current.disconnect();
-            setIsConnected(false);
-        }
-        catch (error) {
-            console.error("Error disconnecting wallet:", error);
-            throw error;
-        }
-    });
-    const getAddress = () => __awaiter(void 0, void 0, void 0, function* () {
-        try {
-            return yield walletRef.current.getActiveAddress();
-        }
-        catch (error) {
-            console.error("Error getting address:", error);
-            throw error;
-        }
-    });
-    const getAllAddresses = () => __awaiter(void 0, void 0, void 0, function* () {
-        try {
-            return yield walletRef.current.getAllAddresses();
-        }
-        catch (error) {
-            console.error("Error getting address:", error);
-            throw error;
-        }
-    });
-    const sendAR = (recipient, quantity) => __awaiter(void 0, void 0, void 0, function* () {
-        try {
-            const arweave = Arweave.init({
-                host: "arweave.net",
-                port: 443,
-                protocol: "https",
-            });
-            const tx = yield arweave.createTransaction({
-                target: recipient,
-                quantity: quantity,
-            });
-            const signedTx = yield walletRef.current.sign(tx);
-            return yield arweave.transactions.post(signedTx);
-        }
-        catch (error) {
-            console.error("Error sending AR:", error);
-            throw error;
-        }
-    });
-    const signAOMessage = (target, recipient, quantity) => __awaiter(void 0, void 0, void 0, function* () {
-        try {
-            const dataItem = {
-                data: "",
-                target,
-                tags: [
-                    { name: "Action", value: "Transfer" },
-                    { name: "Recipient", value: recipient },
-                    { name: "Quantity", value: quantity },
-                    { name: "SDK", value: "Beacon Wallet" },
-                    { name: "Data-Protocol", value: "ao" },
-                    { name: "Variant", value: "ao.TN.1" },
-                    { name: "Type", value: "Message" },
-                ],
-            };
-            const signedDataItem = yield walletRef.current.signDataItem(dataItem);
-            const response = yield fetch("https://mu.ao-testnet.xyz", {
-                method: "POST",
-                headers: {
-                    "Content-Type": "application/octet-stream",
-                },
-                body: signedDataItem,
-            });
-            if (!response.ok) {
-                throw new Error("Network response was not ok");
-            }
-            return signedDataItem;
-        }
-        catch (error) {
-            console.error("Error signing AO message:", error);
-            throw error;
-        }
-    });
-    const sign = (transaction) => __awaiter(void 0, void 0, void 0, function* () {
-        try {
-            return yield walletRef.current.sign(transaction);
-        }
-        catch (error) {
-            console.error("Error signing wallet:", error);
-            throw error;
-        }
-    });
-    return {
-        isConnected,
-        connect,
-        disconnect,
-        getAddress,
-        getAllAddresses,
-        sendAR,
-        signAOMessage,
-        sign,
-    };
-};
+"use strict";

package/dist/walletProvider.d.ts

@@ -0,0 +1,17 @@
+import React from "react";
+import Transaction from "arweave/web/lib/transaction";
+interface WalletContextValue {
+    isConnected: boolean;
+    connect: () => Promise<void>;
+    disconnect: () => Promise<void>;
+    getAllAddresses: () => Promise<string[]>;
+    getAddress: () => Promise<string | undefined>;
+    sendAR: (recipient: string, quantity: string) => Promise<any>;
+    signAOMessage: (target: string, recipient: string, quantity: string) => Promise<any>;
+    sign: (transaction: Transaction) => Promise<Transaction>;
+}
+export declare const WalletProvider: ({ children, }: {
+    children: any;
+}) => React.JSX.Element;
+export declare const useWallet: () => WalletContextValue;
+export {};

package/dist/walletProvider.js

@@ -0,0 +1,144 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import React, { createContext, useContext, useEffect, useRef, useState } from "react";
+import WalletClient from "@vela-ventures/ao-sync-sdk";
+import Arweave from "arweave";
+const WalletContext = createContext(null);
+export const WalletProvider = ({ children, }) => {
+    const [isConnected, setIsConnected] = useState(false);
+    const walletRef = useRef(new WalletClient());
+    useEffect(() => {
+        const wallet = walletRef.current;
+        wallet.reconnect();
+        const handleDisconnect = () => setIsConnected(false);
+        const handleConnect = () => setIsConnected(true);
+        wallet.on("disconnected", handleDisconnect);
+        wallet.on("connected", handleConnect);
+        return () => {
+            wallet.off("disconnected", handleDisconnect);
+            wallet.off("connected", handleConnect);
+        };
+    }, []);
+    const connect = () => __awaiter(void 0, void 0, void 0, function* () {
+        try {
+            yield walletRef.current.connect({});
+        }
+        catch (error) {
+            console.error("Error connecting wallet:", error);
+            throw error;
+        }
+    });
+    const disconnect = () => __awaiter(void 0, void 0, void 0, function* () {
+        try {
+            yield walletRef.current.disconnect();
+            setIsConnected(false);
+        }
+        catch (error) {
+            console.error("Error disconnecting wallet:", error);
+            throw error;
+        }
+    });
+    const getAddress = () => __awaiter(void 0, void 0, void 0, function* () {
+        try {
+            return yield walletRef.current.getActiveAddress();
+        }
+        catch (error) {
+            console.error("Error getting address:", error);
+            throw error;
+        }
+    });
+    const getAllAddresses = () => __awaiter(void 0, void 0, void 0, function* () {
+        try {
+            return yield walletRef.current.getAllAddresses();
+        }
+        catch (error) {
+            console.error("Error getting addresses:", error);
+            throw error;
+        }
+    });
+    const sendAR = (recipient, quantity) => __awaiter(void 0, void 0, void 0, function* () {
+        try {
+            const arweave = Arweave.init({
+                host: "arweave.net",
+                port: 443,
+                protocol: "https",
+            });
+            const tx = yield arweave.createTransaction({
+                target: recipient,
+                quantity: quantity,
+            });
+            const signedTx = yield walletRef.current.sign(tx);
+            return yield arweave.transactions.post(signedTx);
+        }
+        catch (error) {
+            console.error("Error sending AR:", error);
+            throw error;
+        }
+    });
+    const signAOMessage = (target, recipient, quantity) => __awaiter(void 0, void 0, void 0, function* () {
+        try {
+            const dataItem = {
+                data: "",
+                target,
+                tags: [
+                    { name: "Action", value: "Transfer" },
+                    { name: "Recipient", value: recipient },
+                    { name: "Quantity", value: quantity },
+                    { name: "SDK", value: "Beacon Wallet" },
+                    { name: "Data-Protocol", value: "ao" },
+                    { name: "Variant", value: "ao.TN.1" },
+                    { name: "Type", value: "Message" },
+                ],
+            };
+            const signedDataItem = yield walletRef.current.signDataItem(dataItem);
+            const response = yield fetch("https://mu.ao-testnet.xyz", {
+                method: "POST",
+                headers: {
+                    "Content-Type": "application/octet-stream",
+                },
+                body: signedDataItem,
+            });
+            if (!response.ok) {
+                throw new Error("Network response was not ok");
+            }
+            return signedDataItem;
+        }
+        catch (error) {
+            console.error("Error signing AO message:", error);
+            throw error;
+        }
+    });
+    const sign = (transaction) => __awaiter(void 0, void 0, void 0, function* () {
+        try {
+            return yield walletRef.current.sign(transaction);
+        }
+        catch (error) {
+            console.error("Error signing wallet:", error);
+            throw error;
+        }
+    });
+    return (React.createElement(WalletContext.Provider, { value: {
+            isConnected,
+            connect,
+            disconnect,
+            getAllAddresses,
+            getAddress,
+            sendAR,
+            signAOMessage,
+            sign,
+        } }, children));
+};
+export const useWallet = () => {
+    const context = useContext(WalletContext);
+    if (!context) {
+        throw new Error("useWallet must be used within a WalletProvider");
+    }
+    return context;
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vela-ventures/aosync-sdk-react",
-  "version": "1.0.0",
+  "version": "1.0.1",
   "main": "dist/index.js",
   "files": [
     "dist"
@@ -27,7 +27,6 @@
     "@babel/preset-react": "^7.26.3",
     "@types/react": "^19.0.7",
     "@types/react-dom": "^19.0.3",
-    "@vela-ventures/ao-sync-sdk": "^1.1.9",
     "arconnect": "^1.0.4",
     "arweave": "^1.15.5",
     "react": "^19.0.0",
@@ -40,5 +39,8 @@
   ],
   "peerDependencies": {
     "react": "^18.2.0"
+  },
+  "dependencies": {
+    "@vela-ventures/ao-sync-sdk": "^1.1.9"
   }
 }