@vue-solana/vue 0.4.2 → 0.6.0

package/README.md

@@ -154,6 +154,8 @@ const { publicKey, connected, connecting, connect, disconnect } = useWallet();
 
 Browser extension wallets are discovered through the Solana Wallet Standard. Android Mobile Wallet Adapter wallets are registered through `@solana-mobile/wallet-standard-mobile` and exposed through the same `useWallets()` list on supported Android Chrome clients. iOS Phantom, Solflare, and Backpack entries are exposed through wallet-specific universal links on iOS browsers. `connect()` works after selecting a discovered wallet or configuring a custom `SolanaWallet`.
 
+Selected discovered wallets are persisted under `localStorage["vue-solana:selected-wallet"]` as non-sensitive identity metadata: `name`, and `platform`/`source` when available. On reload, Vue Solana restores the selected wallet if the same wallet is discovered again. Pass `autoConnect: true` to opt into calling `connect()` for that restored wallet; arbitrary installed wallets are never auto-connected. Calling `selectWallet(null)` or `setWallet(customWallet)` clears the stored selection.
+
 Desktop native app wallet adapters are planned but not implemented yet.
 
 Composables return inert SSR-safe state when no plugin context is available. Real RPC and wallet operations still require the plugin-provided client context.
@@ -163,14 +165,30 @@ Composables return inert SSR-safe state when no plugin context is available. Rea
 ```ts
 import { useSignAndSendTransaction } from "@vue-solana/vue/useSignAndSendTransaction";
 
-const { signature, loading, error, execute } = useSignAndSendTransaction();
+const { signature, confirmation, status, loading, error, execute } = useSignAndSendTransaction();
 
 await execute(transaction, {
+  confirm: true,
+  confirmation: { commitment: "confirmed" },
   skipPreflight: false,
 });
 ```
 
-The current wallet must be connected and support either `signAndSendTransaction` or `signTransaction`. Android Mobile Wallet Adapter wallets prefer `signTransaction` plus app-side RPC submission when available. `loading` is also cleared if a wallet adapter never returns a result; in that stale case, check the wallet or an explorer before retrying because chain status may be unknown.
+The current wallet must be connected and support either `signAndSendTransaction` or `signTransaction`. Android Mobile Wallet Adapter wallets prefer `signTransaction` plus app-side RPC submission when available. This avoids a mobile handoff edge case where the wallet sends successfully but the browser page does not receive the wallet adapter's returned signature.
+
+Without `confirm: true`, `execute()` returns after submission and sets `status` to `sent`. With confirmation enabled, status moves through `sending`, `confirming`, and then `processed`, `confirmed`, or `finalized` to match the requested commitment. If confirmation times out or fails, the submitted `signature` remains available so the app can link to an explorer.
+
+Use `useTransactionConfirmation()` when you already have a submitted signature and want to wait for confirmation separately:
+
+```ts
+import { useTransactionConfirmation } from "@vue-solana/vue/useTransactionConfirmation";
+
+const confirmation = useTransactionConfirmation({ commitment: "finalized" });
+
+await confirmation.confirm(signature);
+```
+
+`useSignAndSendTransaction()` also clears `loading` if a wallet adapter never returns a result. In that stale case, `error` is set and the chain status may be unknown, so check the connected wallet or an explorer before retrying.
 
 ## Example App
 
@@ -202,10 +220,11 @@ Docs: [Vue Solana Agent Skill](https://vue-solana-docs.vercel.app/agent-skill)
 - `useRpc()`: returns cluster, endpoint, connection status, latest blockhash, and `checkConnection()`.
 - `useConnection()`: returns the Solana `Connection`.
 - `useWallet()`: returns wallet refs, computed connection state, and wallet actions.
-- `useWallets()`: returns discovered browser extension wallets, Android Mobile Wallet Adapter wallets, and wallet selection actions.
+- `useWallets()`: returns discovered browser extension wallets, Android Mobile Wallet Adapter wallets, iOS browser wallet links, and wallet selection actions.
 - `useBalance(address, commitment?)`: loads lamport balance for a `PublicKey` or address string.
-- `useTransaction(handler)`: generic async transaction state helper.
-- `useSignAndSendTransaction()`: signs and sends a transaction through the configured wallet.
+- `useTransaction(handler, options?)`: generic async transaction state helper with optional timeout settings.
+- `useTransactionConfirmation(options?)`: confirms a submitted signature with reactive status and timeout/error state.
+- `useSignAndSendTransaction()`: signs and sends a transaction through the configured wallet, with optional confirmation waiting.
 
 Direct composable subpaths:
 
@@ -216,6 +235,7 @@ Direct composable subpaths:
 - `@vue-solana/vue/useWallet`
 - `@vue-solana/vue/useWallets`
 - `@vue-solana/vue/useTransaction`
+- `@vue-solana/vue/useTransactionConfirmation`
 - `@vue-solana/vue/useSignAndSendTransaction`
 
 ## Known TypeScript Issue
@@ -226,7 +246,13 @@ If TypeScript cannot resolve `@solana/web3-compat`, add `types/web3-compat.d.ts`
 
 ```ts
 declare module "@solana/web3-compat" {
-  export type { Commitment, SendOptions, TransactionSignature } from "@solana/web3.js";
+  export type {
+    Commitment,
+    RpcResponseAndContext,
+    SendOptions,
+    SignatureResult,
+    TransactionSignature,
+  } from "@solana/web3.js";
   export {
     Connection,
     Keypair,

package/dist/index.cjs

@@ -3,18 +3,168 @@
 const useBalance = require('./shared/vue.D_AM1Nl8.cjs');
 const useConnection = require('./shared/vue.CwhEmATP.cjs');
 const useRpc = require('./shared/vue.COyyrsQU.cjs');
-const useSignAndSendTransaction = require('./shared/vue.BwrQMPty.cjs');
+const useSignAndSendTransaction = require('./shared/vue.DEQJ23UM.cjs');
 const useSolana = require('./shared/vue.C4tLiG3R.cjs');
-const useTransaction = require('./shared/vue.CNhelr8H.cjs');
+const useTransaction = require('./shared/vue.DQi38JeF.cjs');
+const useTransactionConfirmation = require('./shared/vue.DHVYJk8P.cjs');
 const useWallet = require('./shared/vue.CwPjPFN6.cjs');
 const useWallets = require('./shared/vue.P9tgeC5S.cjs');
-const iosWallet = require('@vue-solana/core/ios-wallet');
-const walletStandard = require('@vue-solana/core/wallet-standard');
 const rpc = require('@vue-solana/core/rpc');
+const walletStandard = require('@vue-solana/core/wallet-standard');
 const vue = require('vue');
+const iosWallet = require('@vue-solana/core/ios-wallet');
 require('@solana/web3-compat');
 require('@vue-solana/core/transaction');
 
+const SELECTED_WALLET_STORAGE_KEY = "vue-solana:selected-wallet";
+function readSelectedWallet() {
+  const storage = getLocalStorage();
+  if (!storage) {
+    return null;
+  }
+  try {
+    const value = storage.getItem(SELECTED_WALLET_STORAGE_KEY);
+    if (!value) {
+      return null;
+    }
+    const wallet = JSON.parse(value);
+    return typeof wallet.name === "string" ? {
+      name: wallet.name,
+      platform: wallet.platform,
+      source: wallet.source
+    } : null;
+  } catch {
+    return null;
+  }
+}
+function writeSelectedWallet(wallet) {
+  const storage = getLocalStorage();
+  if (!storage) {
+    return;
+  }
+  try {
+    if (wallet) {
+      storage.setItem(SELECTED_WALLET_STORAGE_KEY, stringifySelectedWallet(wallet));
+    } else {
+      storage.removeItem(SELECTED_WALLET_STORAGE_KEY);
+    }
+  } catch {
+  }
+}
+function stringifySelectedWallet(wallet) {
+  const value = { name: wallet.name };
+  if (wallet.platform) {
+    value.platform = wallet.platform;
+  }
+  if (wallet.source) {
+    value.source = wallet.source;
+  }
+  return JSON.stringify(value);
+}
+function getLocalStorage() {
+  if (typeof window === "undefined") {
+    return null;
+  }
+  try {
+    return window.localStorage;
+  } catch {
+    return null;
+  }
+}
+
+function createSolanaWalletRegistry(options) {
+  const adaptedWallets = /* @__PURE__ */ new WeakMap();
+  function getAdaptedWallet(walletInfo) {
+    if (iosWallet.isSolanaIosWalletInfo(walletInfo)) {
+      return iosWallet.adaptSolanaIosWallet(walletInfo, {
+        chain: walletStandard.getSolanaChain(options.cluster),
+        cluster: options.cluster,
+        onChange: options.onWalletChange,
+        ...options.iosWallet || {}
+      });
+    }
+    if (!isObject(walletInfo.wallet)) {
+      return walletStandard.adaptSolanaStandardWallet(walletInfo, {
+        chain: walletStandard.getSolanaChain(options.cluster),
+        onChange: options.onWalletChange
+      });
+    }
+    const cachedWallet = adaptedWallets.get(walletInfo.wallet);
+    if (cachedWallet) {
+      return cachedWallet;
+    }
+    const adaptedWallet = walletStandard.adaptSolanaStandardWallet(walletInfo, {
+      chain: walletStandard.getSolanaChain(options.cluster),
+      onChange: options.onWalletChange
+    });
+    const cachedAdapter = {
+      platform: walletInfo.platform,
+      source: walletInfo.source,
+      get publicKey() {
+        return adaptedWallet.publicKey;
+      },
+      get connected() {
+        return adaptedWallet.connected;
+      },
+      get connecting() {
+        return adaptedWallet.connecting;
+      },
+      get disconnecting() {
+        return adaptedWallet.disconnecting;
+      },
+      async connect() {
+        await adaptedWallet.connect();
+        await Promise.all(
+          Array.from(getCachedWallets()).map(
+            (otherWallet) => otherWallet !== cachedAdapter && otherWallet.connected ? otherWallet.disconnect() : void 0
+          )
+        );
+      },
+      disconnect: () => adaptedWallet.disconnect(),
+      signTransaction: adaptedWallet.signTransaction?.bind(adaptedWallet),
+      signAllTransactions: adaptedWallet.signAllTransactions?.bind(adaptedWallet),
+      signAndSendTransaction: adaptedWallet.signAndSendTransaction?.bind(adaptedWallet)
+    };
+    adaptedWallets.set(walletInfo.wallet, cachedAdapter);
+    return cachedAdapter;
+  }
+  function getDiscoveredWallets() {
+    return [
+      ...walletStandard.getRegisteredSolanaWallets(),
+      ...options.iosWallet === false ? [] : iosWallet.getSolanaIosWallets({
+        chains: [walletStandard.getSolanaChain(options.cluster)],
+        cluster: options.cluster,
+        ...options.iosWallet || {}
+      })
+    ];
+  }
+  function handleIosWalletCallback() {
+    try {
+      iosWallet.handleSolanaIosWalletCallback({ clearUrl: true });
+    } catch (cause) {
+      console.error("[Vue Solana] iOS wallet callback failed", cause);
+    }
+  }
+  function* getCachedWallets() {
+    for (const walletInfo of options.getWalletInfos()) {
+      if (isObject(walletInfo.wallet)) {
+        const cachedWallet = adaptedWallets.get(walletInfo.wallet);
+        if (cachedWallet) {
+          yield cachedWallet;
+        }
+      }
+    }
+  }
+  return {
+    getAdaptedWallet,
+    getDiscoveredWallets,
+    handleIosWalletCallback
+  };
+}
+function isObject(value) {
+  return typeof value === "object" && value !== null || typeof value === "function";
+}
+
 const RPC_CHECK_TIMEOUT_MS = 1e4;
 function createSolanaPlugin(options = {}) {
   return {
@@ -26,9 +176,15 @@ function createSolanaPlugin(options = {}) {
       const status = vue.ref("idle");
       const error = vue.ref(null);
       const latestBlockhash = vue.ref(null);
-      const adaptedWallets = /* @__PURE__ */ new WeakMap();
+      const walletRegistry = createSolanaWalletRegistry({
+        cluster: context.cluster,
+        iosWallet: options.iosWallet,
+        getWalletInfos: () => wallets.value,
+        onWalletChange: () => vue.triggerRef(wallet)
+      });
       let unsubscribeWallets = null;
       let mobileWalletRegistrationPromise = null;
+      let attemptedAutoConnectWallet = null;
       let rpcCheckId = 0;
       async function checkConnection() {
         const checkId = ++rpcCheckId;
@@ -40,7 +196,7 @@ function createSolanaPlugin(options = {}) {
           wsEndpoint: context.wsEndpoint
         });
         try {
-          const blockhash = await withTimeout(
+          const blockhash = await useTransaction.withTimeout(
             context.connection.getLatestBlockhash(),
             RPC_CHECK_TIMEOUT_MS,
             `RPC connection check timed out after ${RPC_CHECK_TIMEOUT_MS / 1e3} seconds.`
@@ -67,17 +223,28 @@ function createSolanaPlugin(options = {}) {
       }
       function refreshWallets() {
         unsubscribeWallets ??= walletStandard.subscribeSolanaWallets(refreshWallets);
-        handleIosWalletCallback();
-        wallets.value = getDiscoveredWallets();
+        walletRegistry.handleIosWalletCallback();
+        wallets.value = walletRegistry.getDiscoveredWallets();
+        let restoredWallet = null;
         if (selectedWallet.value) {
           selectedWallet.value = wallets.value.find((nextWallet) => isSameWallet(nextWallet, selectedWallet.value)) ?? null;
           if (!selectedWallet.value) {
             wallet.value = options.wallet ?? null;
           }
+        } else if (!options.wallet) {
+          const persistedWallet = readSelectedWallet();
+          restoredWallet = persistedWallet ? wallets.value.find((nextWallet) => isSameWallet(nextWallet, persistedWallet)) ?? null : null;
+          if (restoredWallet) {
+            selectedWallet.value = restoredWallet;
+            wallet.value = walletRegistry.getAdaptedWallet(restoredWallet);
+          }
         }
         if (options.mobileWallet !== false) {
           registerMobileWallets();
         }
+        if (restoredWallet) {
+          autoConnectWallet(restoredWallet);
+        }
       }
       function registerMobileWallets() {
         mobileWalletRegistrationPromise ??= import('@vue-solana/core/mobile-wallet').then(({ registerSolanaMobileWallet }) => {
@@ -85,7 +252,7 @@ function createSolanaPlugin(options = {}) {
             chains: [walletStandard.getSolanaChain(context.cluster)],
             ...options.mobileWallet || {}
           });
-          wallets.value = getDiscoveredWallets();
+          refreshWallets();
         }).catch((cause) => {
           console.error("[Vue Solana] Mobile wallet registration failed", cause);
         }).finally(() => {
@@ -94,88 +261,24 @@ function createSolanaPlugin(options = {}) {
       }
       function selectWallet(nextWallet) {
         selectedWallet.value = nextWallet;
-        wallet.value = nextWallet ? getAdaptedWallet(nextWallet) : options.wallet ?? null;
+        wallet.value = nextWallet ? walletRegistry.getAdaptedWallet(nextWallet) : options.wallet ?? null;
+        writeSelectedWallet(nextWallet);
       }
-      function getAdaptedWallet(walletInfo) {
-        if (iosWallet.isSolanaIosWalletInfo(walletInfo)) {
-          return iosWallet.adaptSolanaIosWallet(walletInfo, {
-            chain: walletStandard.getSolanaChain(context.cluster),
-            cluster: context.cluster,
-            onChange: () => vue.triggerRef(wallet),
-            ...options.iosWallet || {}
-          });
+      function autoConnectWallet(walletInfo) {
+        if (!options.autoConnect) {
+          return;
         }
-        if (!isObject(walletInfo.wallet)) {
-          return walletStandard.adaptSolanaStandardWallet(walletInfo, {
-            chain: walletStandard.getSolanaChain(context.cluster),
-            onChange: () => vue.triggerRef(wallet)
-          });
+        const activeWallet = wallet.value;
+        const storageValue = stringifySelectedWallet(walletInfo);
+        if (!activeWallet || activeWallet.connected || activeWallet.connecting || attemptedAutoConnectWallet === storageValue) {
+          return;
         }
-        const cachedWallet = adaptedWallets.get(walletInfo.wallet);
-        if (cachedWallet) {
-          return cachedWallet;
-        }
-        const adaptedWallet = walletStandard.adaptSolanaStandardWallet(walletInfo, {
-          chain: walletStandard.getSolanaChain(context.cluster),
-          onChange: () => vue.triggerRef(wallet)
+        attemptedAutoConnectWallet = storageValue;
+        void activeWallet.connect().catch((cause) => {
+          console.error("[Vue Solana] Wallet auto-connect failed", cause);
+        }).finally(() => {
+          vue.triggerRef(wallet);
         });
-        const cachedAdapter = {
-          platform: walletInfo.platform,
-          source: walletInfo.source,
-          get publicKey() {
-            return adaptedWallet.publicKey;
-          },
-          get connected() {
-            return adaptedWallet.connected;
-          },
-          get connecting() {
-            return adaptedWallet.connecting;
-          },
-          get disconnecting() {
-            return adaptedWallet.disconnecting;
-          },
-          async connect() {
-            await adaptedWallet.connect();
-            await Promise.all(
-              Array.from(getCachedWallets()).map(
-                (otherWallet) => otherWallet !== cachedAdapter && otherWallet.connected ? otherWallet.disconnect() : void 0
-              )
-            );
-          },
-          disconnect: () => adaptedWallet.disconnect(),
-          signTransaction: adaptedWallet.signTransaction?.bind(adaptedWallet),
-          signAllTransactions: adaptedWallet.signAllTransactions?.bind(adaptedWallet),
-          signAndSendTransaction: adaptedWallet.signAndSendTransaction?.bind(adaptedWallet)
-        };
-        adaptedWallets.set(walletInfo.wallet, cachedAdapter);
-        return cachedAdapter;
-      }
-      function getDiscoveredWallets() {
-        return [
-          ...walletStandard.getRegisteredSolanaWallets(),
-          ...options.iosWallet === false ? [] : iosWallet.getSolanaIosWallets({
-            chains: [walletStandard.getSolanaChain(context.cluster)],
-            cluster: context.cluster,
-            ...options.iosWallet || {}
-          })
-        ];
-      }
-      function handleIosWalletCallback() {
-        try {
-          iosWallet.handleSolanaIosWalletCallback({ clearUrl: true });
-        } catch (cause) {
-          console.error("[Vue Solana] iOS wallet callback failed", cause);
-        }
-      }
-      function* getCachedWallets() {
-        for (const walletInfo of wallets.value) {
-          if (isObject(walletInfo.wallet)) {
-            const cachedWallet = adaptedWallets.get(walletInfo.wallet);
-            if (cachedWallet) {
-              yield cachedWallet;
-            }
-          }
-        }
       }
       const vueContext = {
         ...context,
@@ -191,37 +294,27 @@ function createSolanaPlugin(options = {}) {
         setWallet(nextWallet) {
           selectedWallet.value = null;
           wallet.value = nextWallet;
+          writeSelectedWallet(null);
         }
       };
       app.provide(useSolana.solanaInjectionKey, vueContext);
       if (typeof window !== "undefined") {
         window.setTimeout(() => {
+          try {
+            refreshWallets();
+          } catch (cause) {
+            console.error("[Vue Solana] Wallet refresh failed", cause);
+          }
           void checkConnection();
         }, 0);
       }
     }
   };
 }
-function isObject(value) {
-  return typeof value === "object" && value !== null || typeof value === "function";
-}
 function isSameWallet(wallet, selectedWallet) {
   return wallet.name === selectedWallet?.name && wallet.source === selectedWallet.source && wallet.platform === selectedWallet.platform;
 }
 const VueSolana = createSolanaPlugin;
-function withTimeout(promise, timeoutMs, message) {
-  let timeoutId;
-  const timeout = new Promise((_, reject) => {
-    timeoutId = setTimeout(() => {
-      reject(new Error(message));
-    }, timeoutMs);
-  });
-  return Promise.race([promise, timeout]).finally(() => {
-    if (timeoutId) {
-      clearTimeout(timeoutId);
-    }
-  });
-}
 
 exports.useBalance = useBalance.useBalance;
 exports.useConnection = useConnection.useConnection;
@@ -231,6 +324,8 @@ exports.solanaInjectionKey = useSolana.solanaInjectionKey;
 exports.tryUseSolana = useSolana.tryUseSolana;
 exports.useSolana = useSolana.useSolana;
 exports.useTransaction = useTransaction.useTransaction;
+exports.getConfirmedTransactionStatus = useTransactionConfirmation.getConfirmedTransactionStatus;
+exports.useTransactionConfirmation = useTransactionConfirmation.useTransactionConfirmation;
 exports.useWallet = useWallet.useWallet;
 exports.useWallets = useWallets.useWallets;
 exports.VueSolana = VueSolana;

package/dist/index.d.cts

@@ -1,9 +1,10 @@
 export { useBalance } from './useBalance.cjs';
 export { useConnection } from './useConnection.cjs';
 export { useRpc } from './useRpc.cjs';
-export { useSignAndSendTransaction } from './useSignAndSendTransaction.cjs';
+export { SignAndSendTransactionOptions, SignAndSendTransactionStatus, useSignAndSendTransaction } from './useSignAndSendTransaction.cjs';
 export { tryUseSolana, useSolana } from './useSolana.cjs';
 export { UseTransactionOptions, useTransaction } from './useTransaction.cjs';
+export { TransactionConfirmationStatus, getConfirmedTransactionStatus, useTransactionConfirmation } from './useTransactionConfirmation.cjs';
 export { useWallet } from './useWallet.cjs';
 export { useWallets } from './useWallets.cjs';
 export { S as SolanaConnectionStatus, V as VueSolanaContext, s as solanaInjectionKey } from './shared/vue.DGhodYJh.cjs';

package/dist/index.d.mts

@@ -1,9 +1,10 @@
 export { useBalance } from './useBalance.mjs';
 export { useConnection } from './useConnection.mjs';
 export { useRpc } from './useRpc.mjs';
-export { useSignAndSendTransaction } from './useSignAndSendTransaction.mjs';
+export { SignAndSendTransactionOptions, SignAndSendTransactionStatus, useSignAndSendTransaction } from './useSignAndSendTransaction.mjs';
 export { tryUseSolana, useSolana } from './useSolana.mjs';
 export { UseTransactionOptions, useTransaction } from './useTransaction.mjs';
+export { TransactionConfirmationStatus, getConfirmedTransactionStatus, useTransactionConfirmation } from './useTransactionConfirmation.mjs';
 export { useWallet } from './useWallet.mjs';
 export { useWallets } from './useWallets.mjs';
 export { S as SolanaConnectionStatus, V as VueSolanaContext, s as solanaInjectionKey } from './shared/vue.DGhodYJh.mjs';

package/dist/index.d.ts

@@ -1,9 +1,10 @@
 export { useBalance } from './useBalance.js';
 export { useConnection } from './useConnection.js';
 export { useRpc } from './useRpc.js';
-export { useSignAndSendTransaction } from './useSignAndSendTransaction.js';
+export { SignAndSendTransactionOptions, SignAndSendTransactionStatus, useSignAndSendTransaction } from './useSignAndSendTransaction.js';
 export { tryUseSolana, useSolana } from './useSolana.js';
 export { UseTransactionOptions, useTransaction } from './useTransaction.js';
+export { TransactionConfirmationStatus, getConfirmedTransactionStatus, useTransactionConfirmation } from './useTransactionConfirmation.js';
 export { useWallet } from './useWallet.js';
 export { useWallets } from './useWallets.js';
 export { S as SolanaConnectionStatus, V as VueSolanaContext, s as solanaInjectionKey } from './shared/vue.DGhodYJh.js';