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

package/README.md

@@ -0,0 +1,37 @@
+# aosync-react-sdk
+
+A simple react implementation of the ao-sync protocol.
+
+## Usage
+
+```js
+import { AOSyncProvider, useWallet } from "@vela-ventures/aosync-react-sdk";
+
+function WalletView() {
+  const wallet = useWallet();
+  const [address, setAddress] = useAddress<string>()
+
+  useEffect(() => {
+    setAddress(wallet.getAddress())
+  }, [wallet.isConnected])
+
+  if (wallet.isConnected) {
+    return(
+      <>
+       <h1>Connected to: {address}</h1>
+       <Button onClick={wallet.disconnect}>Disconnect Wallet</Button>
+      </>
+    )
+  }
+
+  return <Button onClick={wallet.connect}>Connect Wallet</Button>
+}
+
+function App() {
+  return (
+    <AOSyncProvider arweaveHost='arweave.net' muUrl='https://mu.ao-testnet.xyz'>
+      <WalletView />
+    </AOSyncProvider>
+  );
+}
+```

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.3",
   "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"
   }
 }