decane-connect-kit 2.2.2 → 2.2.3

package/dist/index.cjs

@@ -183,6 +183,9 @@ __export(index_exports, {
   DecaneError: () => DecaneError,
   DecaneErrorCode: () => DecaneErrorCode,
   DecaneKit: () => DecaneKit,
+  DecaneLogo: () => DecaneLogo,
+  DecaneMark: () => DecaneMark,
+  DecaneWordmark: () => DecaneWordmark,
   ExportNotAuthorizedError: () => ExportNotAuthorizedError,
   InvalidApiKeyError: () => InvalidApiKeyError,
   InvalidPinError: () => InvalidPinError,
@@ -211,6 +214,7 @@ __export(index_exports, {
   useSignMessage: () => useSignMessage,
   useSignTypedData: () => useSignTypedData,
   useSocialAuth: () => useSocialAuth,
+  useSocialBalance: () => useSocialBalance,
   useSocialWallet: () => useSocialWallet,
   useWalletSelector: () => useWalletSelector,
   verifyEmailCode: () => verifyEmailCode
@@ -2735,6 +2739,13 @@ async function signEvmTransaction(tee, chain, tx, jwt) {
 async function signEvmMessage(tee, chain, message, jwt) {
   return tee.sign({ chain, kind: "message", payload: message }, jwt);
 }
+async function signEvmTypedData(tee, chain, typedData, jwt) {
+  const payload = JSON.stringify(
+    typedData,
+    (_k, v) => typeof v === "bigint" ? v.toString() : v
+  );
+  return tee.sign({ chain, kind: "typedData", payload }, jwt);
+}
 
 // src/social/signers/solana.ts
 var import_web3 = require("@solana/web3.js");
@@ -2973,10 +2984,7 @@ async function buildPortableBackup(deviceShare, recoveryShare, password, address
   };
 }
 
-// src/social/client.ts
-var DEFAULT_API_BASE = "https://backend.decane.app";
-var DEFAULT_TEE_URL = "https://4405742df08d19abc549a05ade2a7154d98bd87f-8443.dstack-pha-prod9.phala.network";
-var DEFAULT_SESSION_MINUTES = 30;
+// src/social/balance.ts
 var DEFAULT_RPCS = {
   "evm:1": "https://ethereum.publicnode.com",
   "evm:137": "https://polygon.publicnode.com",
@@ -2988,6 +2996,50 @@ var DEFAULT_RPCS = {
   "evm:84532": "https://base-sepolia.publicnode.com",
   "evm:31337": "http://localhost:8545"
 };
+var EVM_SYMBOLS = {
+  "evm:137": "MATIC",
+  "evm:56": "BNB"
+};
+function solanaEndpoint(chain, rpcUrls) {
+  if (rpcUrls?.[chain]) return rpcUrls[chain];
+  const cluster = chain.slice("solana:".length);
+  return cluster === "devnet" ? "https://api.devnet.solana.com" : "https://api.mainnet-beta.solana.com";
+}
+async function fetchBalance(opts) {
+  const { kind, address, chain, rpcUrls } = opts;
+  if (kind === "evm") {
+    const rpcUrl = rpcUrls?.[chain] ?? DEFAULT_RPCS[chain];
+    if (!rpcUrl) {
+      throw new Error(
+        `No RPC URL for ${chain}. Pass rpcUrls: { '${chain}': 'https://...' } in social config.`
+      );
+    }
+    const { JsonRpcProvider, formatEther } = await import("ethers");
+    const wei = await new JsonRpcProvider(rpcUrl).getBalance(address);
+    return { raw: wei, formatted: formatEther(wei), symbol: EVM_SYMBOLS[chain] ?? "ETH", decimals: 18 };
+  }
+  const { Connection, PublicKey, LAMPORTS_PER_SOL } = await import("@solana/web3.js");
+  const lamports = await new Connection(solanaEndpoint(chain, rpcUrls)).getBalance(
+    new PublicKey(address)
+  );
+  return {
+    raw: BigInt(lamports),
+    formatted: String(lamports / LAMPORTS_PER_SOL),
+    symbol: "SOL",
+    decimals: 9
+  };
+}
+function formatBalanceDisplay(value) {
+  if (value == null) return "\u2014";
+  const n = Number(value);
+  if (!Number.isFinite(n)) return value;
+  return n === 0 ? "0" : n < 1e-4 ? "<0.0001" : n.toFixed(4).replace(/\.?0+$/, "");
+}
+
+// src/social/client.ts
+var DEFAULT_API_BASE = "https://backend.decane.app";
+var DEFAULT_TEE_URL = "https://4405742df08d19abc549a05ade2a7154d98bd87f-8443.dstack-pha-prod9.phala.network";
+var DEFAULT_SESSION_MINUTES = 30;
 function makePersistKey(apiKey) {
   return `decane:social:${apiKey.slice(0, 20)}`;
 }
@@ -3485,6 +3537,23 @@ async function createDecaneConnect(config) {
       const txResponse = await provider.broadcastTransaction(signedTx);
       return txResponse.hash;
     },
+    async signTypedData(req) {
+      const tee = session.requireActive();
+      if (!req.chain.startsWith("evm:")) {
+        throw new CallSequenceError("signTypedData is EVM-only (EIP-712).");
+      }
+      return signEvmTypedData(
+        tee,
+        req.chain,
+        {
+          domain: req.domain,
+          types: req.types,
+          message: req.message,
+          primaryType: req.primaryType
+        },
+        auth?.jwt
+      );
+    },
     async signSolanaTransaction(serializedTx) {
       const tee = session.requireActive();
       let tx;
@@ -3510,6 +3579,42 @@ async function createDecaneConnect(config) {
     getAddresses() {
       return auth?.addresses ?? persisted?.addresses ?? null;
     },
+    // Native-token balance. Read-only public chain data, so it works whenever an
+    // address is known — including while the wallet is locked (no TEE session
+    // needed). `chain` defaults to the first configured EVM chain, else the
+    // first Solana chain.
+    async getBalance(chain) {
+      const addresses = auth?.addresses ?? persisted?.addresses;
+      if (!addresses) throw new CallSequenceError("Not connected \u2014 no wallet address known");
+      const resolvedChain = chain ?? config.chains.find((c) => c.startsWith("evm:")) ?? config.chains.find((c) => c.startsWith("solana:"));
+      if (!resolvedChain) throw new CallSequenceError("No chain configured");
+      const kind = resolvedChain.startsWith("solana:") ? "solana" : "evm";
+      const address = kind === "evm" ? addresses.evm : addresses.solana;
+      if (!address) throw new CallSequenceError(`This wallet has no ${kind} address`);
+      return fetchBalance({ kind, address, chain: resolvedChain, rpcUrls: config.rpcUrls });
+    },
+    // Balances across every configured chain the wallet has an address for.
+    // Per-chain failures resolve to null rather than rejecting the whole call,
+    // so one dead RPC doesn't blank the entire list.
+    async getBalances() {
+      const addresses = auth?.addresses ?? persisted?.addresses;
+      if (!addresses) throw new CallSequenceError("Not connected \u2014 no wallet address known");
+      const targets = config.chains.filter((c) => {
+        const kind = c.startsWith("solana:") ? "solana" : "evm";
+        return kind === "evm" ? !!addresses.evm : !!addresses.solana;
+      });
+      return Promise.all(
+        targets.map(async (chain) => {
+          const kind = chain.startsWith("solana:") ? "solana" : "evm";
+          const address = kind === "evm" ? addresses.evm : addresses.solana;
+          try {
+            return { chain, balance: await fetchBalance({ kind, address, chain, rpcUrls: config.rpcUrls }) };
+          } catch {
+            return { chain, balance: null };
+          }
+        })
+      );
+    },
     async rotateShares(opts) {
       if (!auth) throw new CallSequenceError("Not connected \u2014 call connect() first");
       const tee = session.requireActive();
@@ -3756,6 +3861,31 @@ var CSS_VARS = {
 
 // src/ui/icons.tsx
 var import_react = __toESM(require("react"), 1);
+var DECAGON_OUTER = "12,2 17.88,3.91 21.51,8.91 21.51,15.09 17.88,20.09 12,22 6.12,20.09 2.49,15.09 2.49,8.91 6.12,3.91";
+var DECAGON_INNER = "12,7.4 14.7,8.28 16.37,10.58 16.37,13.42 14.7,15.72 12,16.6 9.3,15.72 7.63,13.42 7.63,10.58 9.3,8.28";
+function DecaneMark({ size = 24, muted = false }) {
+  const color = muted ? "var(--dc-text-muted)" : "var(--dc-accent)";
+  return /* @__PURE__ */ import_react.default.createElement("svg", { width: size, height: size, viewBox: "0 0 24 24", fill: "none", "aria-hidden": true, style: { flexShrink: 0, display: "block" } }, /* @__PURE__ */ import_react.default.createElement("polygon", { points: DECAGON_OUTER, fill: color, fillOpacity: muted ? 0.08 : 0.1, stroke: color, strokeWidth: "1.4", strokeLinejoin: "round" }), /* @__PURE__ */ import_react.default.createElement("polygon", { points: DECAGON_INNER, fill: color, fillOpacity: muted ? 0.55 : 0.95 }));
+}
+function DecaneWordmark({ size = 15, muted = false }) {
+  return /* @__PURE__ */ import_react.default.createElement(
+    "span",
+    {
+      style: {
+        fontFamily: "var(--dc-font-sans, system-ui, sans-serif)",
+        fontWeight: 800,
+        fontSize: size,
+        letterSpacing: "-0.03em",
+        color: muted ? "var(--dc-text-muted)" : "var(--dc-text)",
+        lineHeight: 1
+      }
+    },
+    "decane"
+  );
+}
+function DecaneLogo({ size = 20, muted = false }) {
+  return /* @__PURE__ */ import_react.default.createElement("span", { style: { display: "inline-flex", alignItems: "center", gap: size * 0.34 } }, /* @__PURE__ */ import_react.default.createElement(DecaneMark, { size, muted }), /* @__PURE__ */ import_react.default.createElement(DecaneWordmark, { size: size * 0.78, muted }));
+}
 function WalletIcon({ src, name, size = 36 }) {
   if (src) {
     return /* @__PURE__ */ import_react.default.createElement(
@@ -4709,40 +4839,17 @@ function useBalance(kind, address, chain, rpcUrls) {
     if (!address || !chain) return;
     let cancelled = false;
     setState((s) => ({ ...s, loading: true }));
-    (async () => {
-      try {
-        if (kind === "evm") {
-          const rpcUrl = rpcUrls?.[chain] ?? DEFAULT_RPCS[chain];
-          if (!rpcUrl) {
-            if (!cancelled) setState({ loading: false, value: null, symbol: "ETH" });
-            return;
-          }
-          const { JsonRpcProvider, formatEther } = await import("ethers");
-          const wei = await new JsonRpcProvider(rpcUrl).getBalance(address);
-          if (!cancelled) setState({ loading: false, value: formatEther(wei), symbol: "ETH" });
-        } else {
-          const cluster = chain.slice("solana:".length);
-          const endpoint = rpcUrls?.[chain] ?? (cluster === "devnet" ? "https://api.devnet.solana.com" : "https://api.mainnet-beta.solana.com");
-          const { Connection, PublicKey, LAMPORTS_PER_SOL } = await import("@solana/web3.js");
-          const lamports = await new Connection(endpoint).getBalance(new PublicKey(address));
-          if (!cancelled) setState({ loading: false, value: String(lamports / LAMPORTS_PER_SOL), symbol: "SOL" });
-        }
-      } catch {
-        if (!cancelled) setState({ loading: false, value: null, symbol: kind === "evm" ? "ETH" : "SOL" });
-      }
-    })();
+    fetchBalance({ kind, address, chain, rpcUrls }).then((b) => {
+      if (!cancelled) setState({ loading: false, value: b.formatted, symbol: b.symbol });
+    }).catch(() => {
+      if (!cancelled) setState({ loading: false, value: null, symbol: kind === "evm" ? "ETH" : "SOL" });
+    });
     return () => {
       cancelled = true;
     };
   }, [kind, address, chain, rpcUrls]);
   return state;
 }
-function formatBalance(value) {
-  if (value == null) return "\u2014";
-  const n = Number(value);
-  if (!Number.isFinite(n)) return value;
-  return n === 0 ? "0" : n < 1e-4 ? "<0.0001" : n.toFixed(4).replace(/\.?0+$/, "");
-}
 function AddressRow({
   label,
   address,
@@ -4758,7 +4865,7 @@ function AddressRow({
     borderRadius: 10,
     padding: "10px 14px",
     marginBottom: 8
-  } }, /* @__PURE__ */ import_react3.default.createElement("div", { style: { display: "flex", alignItems: "center", justifyContent: "space-between", marginBottom: 5 } }, /* @__PURE__ */ import_react3.default.createElement("span", { style: { fontSize: 10, fontWeight: 700, color: "var(--dc-text-muted)", letterSpacing: "0.06em", textTransform: "uppercase" } }, label), /* @__PURE__ */ import_react3.default.createElement("span", { style: { fontSize: 11, fontFamily: "monospace", color: "var(--dc-text)" } }, balance.loading ? "\u2026" : `${formatBalance(balance.value)} ${balance.symbol}`)), /* @__PURE__ */ import_react3.default.createElement("div", { style: { display: "flex", alignItems: "center", justifyContent: "space-between", gap: 8 } }, /* @__PURE__ */ import_react3.default.createElement("span", { style: { fontSize: 13, fontFamily: "monospace", color: "var(--dc-text)", letterSpacing: "0.02em" } }, short), /* @__PURE__ */ import_react3.default.createElement(CopyButton, { value: address })));
+  } }, /* @__PURE__ */ import_react3.default.createElement("div", { style: { display: "flex", alignItems: "center", justifyContent: "space-between", marginBottom: 5 } }, /* @__PURE__ */ import_react3.default.createElement("span", { style: { fontSize: 10, fontWeight: 700, color: "var(--dc-text-muted)", letterSpacing: "0.06em", textTransform: "uppercase" } }, label), /* @__PURE__ */ import_react3.default.createElement("span", { style: { fontSize: 11, fontFamily: "monospace", color: "var(--dc-text)" } }, balance.loading ? "\u2026" : `${formatBalanceDisplay(balance.value)} ${balance.symbol}`)), /* @__PURE__ */ import_react3.default.createElement("div", { style: { display: "flex", alignItems: "center", justifyContent: "space-between", gap: 8 } }, /* @__PURE__ */ import_react3.default.createElement("span", { style: { fontSize: 13, fontFamily: "monospace", color: "var(--dc-text)", letterSpacing: "0.02em" } }, short), /* @__PURE__ */ import_react3.default.createElement(CopyButton, { value: address })));
 }
 function SignInView({
   onGoogleSignIn,
@@ -5135,34 +5242,17 @@ function SocialWalletModal({
       top: 0,
       zIndex: 1,
       background: "linear-gradient(90deg, transparent, var(--dc-accent) 30%, var(--dc-accent) 70%, transparent)"
-    } }), /* @__PURE__ */ import_react3.default.createElement("div", { style: { padding: "18px 20px 16px", display: "flex", alignItems: "center", gap: 10 } }, /* @__PURE__ */ import_react3.default.createElement("div", { style: {
-      width: 34,
-      height: 34,
-      borderRadius: 10,
+    } }), /* @__PURE__ */ import_react3.default.createElement("div", { style: { padding: "18px 20px 16px", display: "flex", alignItems: "center", gap: 11 } }, /* @__PURE__ */ import_react3.default.createElement("div", { style: {
+      width: 38,
+      height: 38,
+      borderRadius: 11,
       background: "var(--dc-surface)",
       border: "1px solid var(--dc-border)",
       display: "flex",
       alignItems: "center",
       justifyContent: "center",
       flexShrink: 0
-    } }, /* @__PURE__ */ import_react3.default.createElement("svg", { width: "16", height: "18", viewBox: "0 0 16 18", fill: "none" }, /* @__PURE__ */ import_react3.default.createElement(
-      "path",
-      {
-        d: "M8 1L1.5 3.5V8.5C1.5 12.09 4.35 15.4 8 16.5C11.65 15.4 14.5 12.09 14.5 8.5V3.5L8 1Z",
-        stroke: "var(--dc-accent)",
-        strokeWidth: "1.4",
-        strokeLinejoin: "round"
-      }
-    ), /* @__PURE__ */ import_react3.default.createElement(
-      "path",
-      {
-        d: "M5.5 9L7 10.5L10.5 7",
-        stroke: "var(--dc-accent)",
-        strokeWidth: "1.4",
-        strokeLinecap: "round",
-        strokeLinejoin: "round"
-      }
-    ))), /* @__PURE__ */ import_react3.default.createElement("div", { style: { flex: 1 } }, /* @__PURE__ */ import_react3.default.createElement("div", { style: { fontSize: 15, fontWeight: 800, color: "var(--dc-text)", letterSpacing: "-0.02em" } }, "Social Wallet"), /* @__PURE__ */ import_react3.default.createElement("div", { style: { fontSize: 11, color: "var(--dc-text-muted)", marginTop: 1 } }, "Decane non-custodial \xB7 key split three ways")), /* @__PURE__ */ import_react3.default.createElement(
+    } }, /* @__PURE__ */ import_react3.default.createElement(DecaneMark, { size: 22 })), /* @__PURE__ */ import_react3.default.createElement("div", { style: { flex: 1 } }, /* @__PURE__ */ import_react3.default.createElement("div", { style: { display: "flex", alignItems: "baseline", gap: 6 } }, /* @__PURE__ */ import_react3.default.createElement(DecaneWordmark, { size: 15 }), /* @__PURE__ */ import_react3.default.createElement("span", { style: { fontSize: 13, fontWeight: 700, color: "var(--dc-text-muted)", letterSpacing: "-0.01em" } }, "wallet")), /* @__PURE__ */ import_react3.default.createElement("div", { style: { fontSize: 11, color: "var(--dc-text-muted)", marginTop: 2 } }, "Non-custodial \xB7 key split three ways")), /* @__PURE__ */ import_react3.default.createElement(
       "button",
       {
         onClick: onClose,
@@ -5265,7 +5355,14 @@ function SocialWalletModal({
         }
       },
       disconnecting ? "Signing out\u2026" : "Sign out"
-    ))))
+    ))), /* @__PURE__ */ import_react3.default.createElement("div", { style: {
+      padding: "11px 16px",
+      borderTop: "1px solid var(--dc-border)",
+      display: "flex",
+      alignItems: "center",
+      justifyContent: "center",
+      gap: 6
+    } }, /* @__PURE__ */ import_react3.default.createElement("span", { style: { fontSize: 10.5, color: "var(--dc-text-muted)", letterSpacing: "0.02em" } }, "Secured by"), /* @__PURE__ */ import_react3.default.createElement(DecaneMark, { size: 13, muted: true }), /* @__PURE__ */ import_react3.default.createElement(DecaneWordmark, { size: 11, muted: true })))
   );
   return (0, import_react_dom2.createPortal)(modal, document.body);
 }
@@ -5451,6 +5548,21 @@ function DecaneKit({ config, children }) {
     if (!sdk) throw new Error("Social wallet not connected");
     return sdk.signSolanaTransaction(tx);
   }, []);
+  const socialSignTypedData = (0, import_react4.useCallback)(async (req) => {
+    const sdk = socialRef.current;
+    if (!sdk) throw new Error("Social wallet not connected");
+    return sdk.signTypedData({ ...req, chain: req.chain });
+  }, []);
+  const socialGetBalance = (0, import_react4.useCallback)(async (chain) => {
+    const sdk = socialRef.current;
+    if (!sdk) throw new Error("Social wallet not connected");
+    return sdk.getBalance(chain);
+  }, []);
+  const socialGetBalances = (0, import_react4.useCallback)(async () => {
+    const sdk = socialRef.current;
+    if (!sdk) throw new Error("Social wallet not connected");
+    return sdk.getBalances();
+  }, []);
   const socialRotateShares = (0, import_react4.useCallback)(async (opts) => {
     const sdk = socialRef.current;
     if (!sdk) throw new Error("Social wallet not connected");
@@ -5506,7 +5618,10 @@ function DecaneKit({ config, children }) {
         socialDisconnect,
         socialSignMessage,
         socialSendTransaction,
+        socialGetBalance,
+        socialGetBalances,
         socialSignSolanaTransaction,
+        socialSignTypedData,
         socialRotateShares,
         socialExportPortableBackup,
         socialHasRecoveryShare,
@@ -5704,6 +5819,9 @@ function useSocialWallet() {
     socialSignMessage,
     socialSendTransaction,
     socialSignSolanaTransaction,
+    socialSignTypedData,
+    socialGetBalance,
+    socialGetBalances,
     socialRotateShares,
     socialExportPortableBackup,
     socialHasRecoveryShare,
@@ -5740,6 +5858,18 @@ function useSocialWallet() {
     (tx) => run(() => socialSignSolanaTransaction(tx)),
     [socialSignSolanaTransaction]
   );
+  const signTypedData = (0, import_react5.useCallback)(
+    (req) => run(() => socialSignTypedData(req)),
+    [socialSignTypedData]
+  );
+  const getBalance = (0, import_react5.useCallback)(
+    (chain) => run(() => socialGetBalance(chain)),
+    [socialGetBalance]
+  );
+  const getBalances = (0, import_react5.useCallback)(
+    () => run(() => socialGetBalances()),
+    [socialGetBalances]
+  );
   const unlock = (0, import_react5.useCallback)(async () => {
     setError(null);
     try {
@@ -5801,6 +5931,10 @@ function useSocialWallet() {
     signMessage,
     sendTransaction,
     signSolanaTransaction: signSolanaTransaction2,
+    signTypedData,
+    // Balances (native token; read-only, works while locked)
+    getBalance,
+    getBalances,
     // Recovery (2-of-3 Shamir share set)
     rotateShares,
     exportPortableBackup,
@@ -5812,6 +5946,52 @@ function useSocialWallet() {
     clearError: () => setError(null)
   };
 }
+function useSocialBalance(chain) {
+  const { socialAuth, socialGetBalance } = useDecaneContext();
+  const [balance, setBalance] = (0, import_react5.useState)(null);
+  const [loading, setLoading] = (0, import_react5.useState)(false);
+  const [error, setError] = (0, import_react5.useState)(null);
+  const addrKey = `${socialAuth.addresses?.evm ?? ""}|${socialAuth.addresses?.solana ?? ""}`;
+  const refetch = (0, import_react5.useCallback)(async () => {
+    if (!socialAuth.addresses) {
+      setBalance(null);
+      return;
+    }
+    setLoading(true);
+    setError(null);
+    try {
+      setBalance(await socialGetBalance(chain));
+    } catch (e) {
+      setError(e.message);
+      setBalance(null);
+    } finally {
+      setLoading(false);
+    }
+  }, [socialGetBalance, chain, socialAuth.addresses]);
+  (0, import_react5.useEffect)(() => {
+    let cancelled = false;
+    if (!socialAuth.addresses) {
+      setBalance(null);
+      return;
+    }
+    setLoading(true);
+    setError(null);
+    socialGetBalance(chain).then((b) => {
+      if (!cancelled) setBalance(b);
+    }).catch((e) => {
+      if (!cancelled) {
+        setError(e.message);
+        setBalance(null);
+      }
+    }).finally(() => {
+      if (!cancelled) setLoading(false);
+    });
+    return () => {
+      cancelled = true;
+    };
+  }, [addrKey, chain]);
+  return { balance, loading, error, refetch };
+}
 function toDecaneError(err) {
   if (err instanceof DecaneError) return err;
   const msg = err instanceof Error ? err.message : err?.message != null ? String(err.message) : String(err);
@@ -6045,6 +6225,9 @@ function useSignTypedData() {
   DecaneError,
   DecaneErrorCode,
   DecaneKit,
+  DecaneLogo,
+  DecaneMark,
+  DecaneWordmark,
   ExportNotAuthorizedError,
   InvalidApiKeyError,
   InvalidPinError,
@@ -6073,6 +6256,7 @@ function useSignTypedData() {
   useSignMessage,
   useSignTypedData,
   useSocialAuth,
+  useSocialBalance,
   useSocialWallet,
   useWalletSelector,
   verifyEmailCode