@cavos/kit 0.0.2 → 0.0.4

package/dist/react/index.mjs

@@ -1,4 +1,4 @@
-import { CavosAuth, HttpRecoveryClient, Cavos, generateRecoveryCode, CavosSolana } from '../chunk-PEUQQZB5.mjs';
+import { CavosAuth, PasskeySigner, HttpRecoveryClient, Cavos, generateRecoveryCode, CavosSolana, CavosStellar } from '../chunk-F2J25XSL.mjs';
 import { createContext, useState, useRef, useEffect, useCallback, useContext } from 'react';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 
@@ -105,6 +105,17 @@ var EmailIcon = () => /* @__PURE__ */ jsxs("svg", { width: "16", height: "16", v
   /* @__PURE__ */ jsx("rect", { x: "2", y: "4", width: "20", height: "16", rx: "2" }),
   /* @__PURE__ */ jsx("path", { d: "m22 7-8.97 5.7a1.94 1.94 0 01-2.06 0L2 7" })
 ] });
+var FingerprintIcon = ({ size = 22, color = "currentColor" }) => /* @__PURE__ */ jsxs("svg", { width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: color, strokeWidth: "1.7", strokeLinecap: "round", strokeLinejoin: "round", children: [
+  /* @__PURE__ */ jsx("path", { d: "M2 12C2 6.5 6.5 2 12 2a10 10 0 0 1 8 4" }),
+  /* @__PURE__ */ jsx("path", { d: "M5 19.5C5.5 18 6 15 6 12c0-.7.12-1.37.34-2" }),
+  /* @__PURE__ */ jsx("path", { d: "M17.29 21.02c.12-.6.43-2.3.5-3.02" }),
+  /* @__PURE__ */ jsx("path", { d: "M12 10a2 2 0 0 0-2 2c0 1.02-.1 2.51-.26 4" }),
+  /* @__PURE__ */ jsx("path", { d: "M8.65 22c.21-.66.45-1.32.57-2" }),
+  /* @__PURE__ */ jsx("path", { d: "M14 13.12c0 2.38 0 6.38-1 8.88" }),
+  /* @__PURE__ */ jsx("path", { d: "M2 16h.01" }),
+  /* @__PURE__ */ jsx("path", { d: "M21.8 16c.2-2 .131-5.354 0-6" }),
+  /* @__PURE__ */ jsx("path", { d: "M9 6.8a6 6 0 0 1 9 5.2c0 .47 0 1.17-.02 2" })
+] });
 var CavosLogo = ({ invert }) => /* @__PURE__ */ jsx("img", { src: `data:image/png;base64,${cavosLogoBase64}`, alt: "Cavos", style: { width: "auto", height: "16px", objectFit: "contain", opacity: 0.55, flexShrink: 0, filter: invert ? "invert(1)" : "none" } });
 function Spinner({ size = 16, color = "#888" }) {
   return /* @__PURE__ */ jsxs(
@@ -255,7 +266,11 @@ function CavosAuthModal({
     authError,
     clearAuthError,
     resendDeviceApproval,
-    recover
+    recover,
+    passkeySupported,
+    enrollPasskeyDefault,
+    approveDeviceWithPasskey,
+    setupRecovery
   } = useCavos();
   const isMobile = useIsMobile();
   const isLight = theme !== "dark";
@@ -283,7 +298,12 @@ function CavosAuthModal({
   const [deviceResendBusy, setDeviceResendBusy] = useState(false);
   const [recoverCode, setRecoverCode] = useState("");
   const [recoverBusy, setRecoverBusy] = useState(false);
+  const [pkBusy, setPkBusy] = useState(false);
+  const [pkError, setPkError] = useState("");
+  const [savedRecoveryCode, setSavedRecoveryCode] = useState("");
+  const [copied, setCopied] = useState(false);
   const doneHandledRef = useRef(false);
+  const secureHandledRef = useRef(false);
   const closeTimerRef = useRef(null);
   const otpBoxRefs = useRef([null, null, null, null, null, null]);
   const setOtpDigit = (i, raw) => {
@@ -344,6 +364,7 @@ function CavosAuthModal({
       setOtpCode("");
       setError("");
       doneHandledRef.current = false;
+      secureHandledRef.current = false;
     }, 1600);
   }, [onClose]);
   useEffect(() => {
@@ -354,13 +375,26 @@ function CavosAuthModal({
       doneHandledRef.current = false;
     }
     if (isAuthenticated && address && walletStatus.isReady) {
-      triggerDone(address);
+      if (walletStatus.isNewAccount && !secureHandledRef.current) {
+        if (screen !== "secure-account" && screen !== "recovery-code" && !doneHandledRef.current) {
+          setScreen("secure-account");
+        }
+      } else {
+        triggerDone(address);
+      }
     }
-    if (walletStatus.awaitingApproval && screen !== "device-approval" && screen !== "recover") {
-      setScreen("device-approval");
-      doneHandledRef.current = false;
+    if (walletStatus.needsDeviceApproval && // A deploy in progress owns the screen; never fight the deploying branch
+    // above (both flags true would oscillate deploying ↔ approval → loop).
+    !walletStatus.isDeploying && screen !== "recover" && screen !== "device-approval" && screen !== "passkey-approval") {
+      if (walletStatus.hasPasskey && passkeySupported) {
+        setScreen("passkey-approval");
+        doneHandledRef.current = false;
+      } else if (walletStatus.awaitingApproval) {
+        setScreen("device-approval");
+        doneHandledRef.current = false;
+      }
     }
-  }, [open, isAuthenticated, address, walletStatus.isReady, walletStatus.isDeploying, walletStatus.awaitingApproval, screen, triggerDone]);
+  }, [open, isAuthenticated, address, walletStatus.isReady, walletStatus.isDeploying, walletStatus.awaitingApproval, walletStatus.needsDeviceApproval, walletStatus.hasPasskey, walletStatus.isNewAccount, passkeySupported, screen, triggerDone]);
   useEffect(() => () => {
     if (closeTimerRef.current) clearTimeout(closeTimerRef.current);
   }, []);
@@ -370,9 +404,61 @@ function CavosAuthModal({
     setEmail("");
     setOtpCode("");
     setError("");
+    setPkError("");
+    setSavedRecoveryCode("");
+    setCopied(false);
     doneHandledRef.current = false;
+    secureHandledRef.current = false;
     onClose();
   };
+  const finishSecureStep = () => {
+    secureHandledRef.current = true;
+    if (address) triggerDone(address);
+  };
+  const handleSetupPasskey = async () => {
+    setPkBusy(true);
+    setPkError("");
+    try {
+      await enrollPasskeyDefault();
+      finishSecureStep();
+    } catch (e) {
+      setPkError(e instanceof Error ? e.message : "We couldn't set up your passkey. Try again.");
+    } finally {
+      setPkBusy(false);
+    }
+  };
+  const handleSaveRecovery = async () => {
+    setPkBusy(true);
+    setPkError("");
+    try {
+      const code = await setupRecovery();
+      setSavedRecoveryCode(code);
+      setScreen("recovery-code");
+    } catch (e) {
+      setPkError(e instanceof Error ? e.message : "We couldn't create your recovery phrase. Try again.");
+    } finally {
+      setPkBusy(false);
+    }
+  };
+  const handleCopyRecovery = async () => {
+    try {
+      await navigator.clipboard.writeText(savedRecoveryCode);
+      setCopied(true);
+      setTimeout(() => setCopied(false), 2e3);
+    } catch {
+    }
+  };
+  const handlePasskeyApprove = async () => {
+    setPkBusy(true);
+    setPkError("");
+    try {
+      await approveDeviceWithPasskey();
+      setPkBusy(false);
+    } catch (e) {
+      setPkError(e instanceof Error ? e.message : "We couldn't verify your passkey. Try again or use email.");
+      setPkBusy(false);
+    }
+  };
   const handleOAuth = async (provider) => {
     setError("");
     setBusy(true);
@@ -463,6 +549,85 @@ function CavosAuthModal({
       setDeviceResendBusy(false);
     }
   };
+  if (screen === "secure-account") {
+    return /* @__PURE__ */ jsx("div", { style: overlay, "data-cavos-theme": theme, role: "dialog", "aria-modal": true, children: /* @__PURE__ */ jsxs("div", { style: { ...card, position: "relative" }, children: [
+      isMobile && /* @__PURE__ */ jsx("div", { style: handle }),
+      /* @__PURE__ */ jsxs("div", { style: { padding: isMobile ? "28px 24px 28px" : "44px 24px 28px", textAlign: "center" }, children: [
+        /* @__PURE__ */ jsx("div", { style: { width: 48, height: 48, borderRadius: "50%", margin: "0 auto 16px", background: isLight ? "rgba(0,0,0,0.04)" : "rgba(255,255,255,0.06)", border: `1px solid ${isLight ? "rgba(0,0,0,0.08)" : "rgba(255,255,255,0.1)"}`, display: "flex", alignItems: "center", justifyContent: "center" }, children: /* @__PURE__ */ jsxs("svg", { width: "22", height: "22", viewBox: "0 0 24 24", fill: "none", stroke: textColor, strokeWidth: "1.7", strokeLinecap: "round", strokeLinejoin: "round", children: [
+          /* @__PURE__ */ jsx("path", { d: "M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z" }),
+          /* @__PURE__ */ jsx("path", { d: "M9 12l2 2 4-4" })
+        ] }) }),
+        /* @__PURE__ */ jsx("h2", { style: { margin: "0 0 8px", fontSize: "17px", fontWeight: 600, color: textColor, letterSpacing: "-0.02em" }, children: "Keep your account safe" }),
+        /* @__PURE__ */ jsx("p", { style: { margin: "0 0 24px", fontSize: "13px", color: subTextColor, lineHeight: 1.55 }, children: "Set up a passkey so you can sign in on a new phone or computer in one tap. It takes a few seconds." }),
+        pkError && /* @__PURE__ */ jsx("div", { style: { background: errBg, border: `1px solid ${errBorder}`, borderRadius: "10px", padding: "9px 13px", fontSize: "13px", color: errColor, marginBottom: "14px", textAlign: "left" }, children: pkError }),
+        passkeySupported ? /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsxs("button", { className: "cavos-primary-btn", style: { width: "100%", padding: "13px", borderRadius: "12px", border: "none", background: primaryColor, color: "#fff", fontSize: "14px", fontWeight: 600, cursor: pkBusy ? "default" : "pointer", fontFamily: "inherit", display: "flex", alignItems: "center", justifyContent: "center", gap: "9px", opacity: pkBusy ? 0.65 : 1, transition: "opacity 0.15s, transform 0.1s" }, onClick: handleSetupPasskey, disabled: pkBusy, children: [
+            pkBusy ? /* @__PURE__ */ jsx(Spinner, { size: 16, color: "#fff" }) : /* @__PURE__ */ jsx(FingerprintIcon, { size: 18, color: "#fff" }),
+            pkBusy ? "Setting up\u2026" : "Set up a passkey"
+          ] }),
+          /* @__PURE__ */ jsx("p", { style: { margin: "10px 0 0", fontSize: "12px", color: subTextColor, lineHeight: 1.5 }, children: "Uses Face ID, Touch ID, or your device PIN." }),
+          /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: "12px", margin: "18px 0" }, children: [
+            /* @__PURE__ */ jsx("span", { className: "cavos-divider-line", style: { background: isLight ? "rgba(0,0,0,0.08)" : "rgba(255,255,255,0.1)" } }),
+            /* @__PURE__ */ jsx("span", { style: { fontSize: "11px", color: subTextColor, textTransform: "uppercase", letterSpacing: "0.06em" }, children: "or" }),
+            /* @__PURE__ */ jsx("span", { className: "cavos-divider-line", style: { background: isLight ? "rgba(0,0,0,0.08)" : "rgba(255,255,255,0.1)" } })
+          ] }),
+          /* @__PURE__ */ jsx("button", { className: "cavos-submit-btn", style: { width: "100%", padding: "12px", borderRadius: "12px", border: inputBorder, background: "transparent", color: textColor, fontSize: "14px", fontWeight: 500, cursor: pkBusy ? "default" : "pointer", fontFamily: "inherit", transition: "background 0.15s", opacity: pkBusy ? 0.6 : 1 }, onClick: handleSaveRecovery, disabled: pkBusy, children: "Save a recovery phrase instead" })
+        ] }) : /* @__PURE__ */ jsxs("button", { className: "cavos-primary-btn", style: { width: "100%", padding: "13px", borderRadius: "12px", border: "none", background: primaryColor, color: "#fff", fontSize: "14px", fontWeight: 600, cursor: pkBusy ? "default" : "pointer", fontFamily: "inherit", display: "flex", alignItems: "center", justifyContent: "center", gap: "9px", opacity: pkBusy ? 0.65 : 1, transition: "opacity 0.15s" }, onClick: handleSaveRecovery, disabled: pkBusy, children: [
+          pkBusy && /* @__PURE__ */ jsx(Spinner, { size: 16, color: "#fff" }),
+          pkBusy ? "Setting up\u2026" : "Save a recovery phrase"
+        ] }),
+        /* @__PURE__ */ jsx("button", { className: "cavos-sub-btn", style: { background: "none", border: "none", cursor: pkBusy ? "default" : "pointer", fontSize: "13px", color: subTextColor, width: "100%", textAlign: "center", padding: "18px 0 0", fontFamily: "inherit", transition: "color 0.15s", opacity: pkBusy ? 0.6 : 1 }, onClick: finishSecureStep, disabled: pkBusy, children: "Skip for now" })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { style: footer, children: [
+        /* @__PURE__ */ jsx(CavosLogo, { invert: !isLight }),
+        /* @__PURE__ */ jsx("span", { children: "Secured by Cavos" })
+      ] })
+    ] }) });
+  }
+  if (screen === "recovery-code") {
+    return /* @__PURE__ */ jsx("div", { style: overlay, "data-cavos-theme": theme, role: "dialog", "aria-modal": true, children: /* @__PURE__ */ jsxs("div", { style: { ...card, position: "relative" }, children: [
+      isMobile && /* @__PURE__ */ jsx("div", { style: handle }),
+      /* @__PURE__ */ jsxs("div", { style: { padding: isMobile ? "28px 24px 28px" : "44px 24px 28px", textAlign: "center" }, children: [
+        /* @__PURE__ */ jsx("h2", { style: { margin: "0 0 8px", fontSize: "17px", fontWeight: 600, color: textColor, letterSpacing: "-0.02em" }, children: "Save your recovery phrase" }),
+        /* @__PURE__ */ jsx("p", { style: { margin: "0 0 18px", fontSize: "13px", color: subTextColor, lineHeight: 1.55 }, children: "Write this down and keep it somewhere safe. It's the only way to get back in if you lose your devices, and we can't recover it for you." }),
+        /* @__PURE__ */ jsx("div", { style: { background: isLight ? "rgba(0,0,0,0.03)" : "rgba(255,255,255,0.05)", border: `1px solid ${isLight ? "rgba(0,0,0,0.08)" : "rgba(255,255,255,0.1)"}`, borderRadius: "12px", padding: "16px", marginBottom: "12px", fontSize: "14px", fontWeight: 500, color: textColor, wordBreak: "break-word", lineHeight: 1.6, fontFamily: "ui-monospace, SFMono-Regular, Menlo, monospace", textAlign: "center" }, children: savedRecoveryCode }),
+        /* @__PURE__ */ jsx("button", { className: "cavos-provider", style: { ...pBtn, marginBottom: "10px" }, onClick: handleCopyRecovery, children: /* @__PURE__ */ jsx("span", { children: copied ? "Copied \u2713" : "Copy to clipboard" }) }),
+        /* @__PURE__ */ jsx("button", { className: "cavos-primary-btn", style: { width: "100%", padding: "12px", borderRadius: "12px", border: "none", background: primaryColor, color: "#fff", fontSize: "14px", fontWeight: 500, cursor: "pointer", fontFamily: "inherit", transition: "opacity 0.15s" }, onClick: finishSecureStep, children: "I've saved it" })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { style: footer, children: [
+        /* @__PURE__ */ jsx(CavosLogo, { invert: !isLight }),
+        /* @__PURE__ */ jsx("span", { children: "Secured by Cavos" })
+      ] })
+    ] }) });
+  }
+  if (screen === "passkey-approval") {
+    return /* @__PURE__ */ jsx("div", { style: overlay, "data-cavos-theme": theme, role: "dialog", "aria-modal": true, children: /* @__PURE__ */ jsxs("div", { style: { ...card, position: "relative" }, children: [
+      isMobile && /* @__PURE__ */ jsx("div", { style: handle }),
+      /* @__PURE__ */ jsx("button", { className: "cavos-close", style: close, onClick: handleClose, "aria-label": "Close", children: /* @__PURE__ */ jsx(CloseX, {}) }),
+      /* @__PURE__ */ jsxs("div", { style: { padding: isMobile ? "28px 24px 32px" : "48px 24px 32px", textAlign: "center" }, children: [
+        /* @__PURE__ */ jsx("div", { style: { width: 48, height: 48, borderRadius: "50%", margin: "0 auto 16px", background: isLight ? "rgba(0,0,0,0.04)" : "rgba(255,255,255,0.06)", border: `1px solid ${isLight ? "rgba(0,0,0,0.08)" : "rgba(255,255,255,0.1)"}`, display: "flex", alignItems: "center", justifyContent: "center" }, children: /* @__PURE__ */ jsx(FingerprintIcon, { size: 24, color: textColor }) }),
+        /* @__PURE__ */ jsx("h2", { style: { margin: "0 0 8px", fontSize: "17px", fontWeight: 600, color: textColor, letterSpacing: "-0.02em" }, children: "Verify it's you" }),
+        /* @__PURE__ */ jsx("p", { style: { margin: "0 0 20px", fontSize: "13px", color: subTextColor, lineHeight: 1.55 }, children: "Confirm with Face ID, Touch ID, or your device PIN to add this device to your account." }),
+        pkError && /* @__PURE__ */ jsx("div", { style: { background: errBg, border: `1px solid ${errBorder}`, borderRadius: "10px", padding: "9px 13px", fontSize: "13px", color: errColor, marginBottom: "14px" }, children: pkError }),
+        /* @__PURE__ */ jsxs("button", { className: "cavos-primary-btn", style: { width: "100%", padding: "12px", borderRadius: "12px", border: "none", background: primaryColor, color: "#fff", fontSize: "14px", fontWeight: 500, cursor: pkBusy ? "default" : "pointer", fontFamily: "inherit", display: "flex", alignItems: "center", justifyContent: "center", gap: "8px", opacity: pkBusy ? 0.65 : 1 }, onClick: handlePasskeyApprove, disabled: pkBusy, children: [
+          pkBusy && /* @__PURE__ */ jsx(Spinner, { size: 15, color: "#fff" }),
+          pkBusy ? "Verifying\u2026" : "Continue with passkey"
+        ] }),
+        walletStatus.awaitingApproval && /* @__PURE__ */ jsx("button", { className: "cavos-sub-btn", style: { background: "none", border: "none", cursor: "pointer", fontSize: "13px", color: subTextColor, width: "100%", textAlign: "center", padding: "16px 0 0", fontFamily: "inherit", transition: "color 0.15s" }, onClick: () => {
+          setScreen("device-approval");
+          setPkError("");
+        }, children: "Approve by email instead" }),
+        /* @__PURE__ */ jsx("button", { className: "cavos-sub-btn", style: { background: "none", border: "none", cursor: "pointer", fontSize: "13px", color: subTextColor, width: "100%", textAlign: "center", padding: `${walletStatus.awaitingApproval ? "10px" : "16px"} 0 0`, fontFamily: "inherit", transition: "color 0.15s" }, onClick: () => {
+          setScreen("recover");
+          setPkError("");
+        }, children: "Use a recovery phrase" })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { style: footer, children: [
+        /* @__PURE__ */ jsx(CavosLogo, { invert: !isLight }),
+        /* @__PURE__ */ jsx("span", { children: "Secured by Cavos" })
+      ] })
+    ] }) });
+  }
   if (screen === "device-approval") {
     const expired = walletStatus.awaitingApproval && !walletStatus.pendingRequestId;
     return /* @__PURE__ */ jsx("div", { style: overlay, "data-cavos-theme": theme, role: "dialog", "aria-modal": true, children: /* @__PURE__ */ jsxs("div", { style: { ...card, position: "relative" }, children: [
@@ -522,7 +687,7 @@ function CavosAuthModal({
     }, children: /* @__PURE__ */ jsxs("div", { style: { ...card, position: "relative" }, children: [
       isMobile && /* @__PURE__ */ jsx("div", { style: handle }),
       /* @__PURE__ */ jsx("button", { className: "cavos-close", style: { ...close, left: "16px", right: "auto" }, onClick: () => {
-        setScreen("device-approval");
+        setScreen(walletStatus.hasPasskey && passkeySupported ? "passkey-approval" : "device-approval");
         setError("");
         setRecoverCode("");
       }, "aria-label": "Back", children: /* @__PURE__ */ jsx("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsx("path", { d: "M19 12H5M12 5l-7 7 7 7" }) }) }),
@@ -761,23 +926,36 @@ var INITIAL_STATUS = {
   isReady: false,
   needsDeviceApproval: false,
   awaitingApproval: false,
-  pendingRequestId: null
+  pendingRequestId: null,
+  hasPasskey: false,
+  isNewAccount: false
 };
 function CavosProvider({ config, modal, children }) {
   const [auth] = useState(
     () => new CavosAuth({ appId: config.appId, backendUrl: config.authBackendUrl })
   );
-  const [cavos, setCavos] = useState(null);
+  const [wallet, setWallet] = useState(null);
   const [identity, setIdentity] = useState(null);
   const [walletStatus, setWalletStatus] = useState(INITIAL_STATUS);
   const [isLoading, setIsLoading] = useState(false);
   const [authError, setAuthError] = useState(null);
   const [modalOpen, setModalOpen] = useState(false);
+  const [passkeySupported, setPasskeySupported] = useState(false);
   const [branding, setBranding] = useState({});
+  useEffect(() => {
+    let cancelled = false;
+    PasskeySigner.isSupported().then((ok) => {
+      if (!cancelled) setPasskeySupported(ok);
+    }).catch(() => {
+    });
+    return () => {
+      cancelled = true;
+    };
+  }, []);
   const configRef = useRef(config);
   useEffect(() => {
     configRef.current = config;
-  }, [config]);
+  });
   useEffect(() => {
     if (!config.appId || typeof window === "undefined") return;
     const base = config.authBackendUrl ?? "https://cavos.xyz";
@@ -791,41 +969,52 @@ function CavosProvider({ config, modal, children }) {
   const closeModal = useCallback(() => setModalOpen(false), []);
   const clearAuthError = useCallback(() => setAuthError(null), []);
   const resendDeviceApproval = useCallback(async () => {
-    if (!identity || !cavos || cavos.chain !== "starknet" || !cavos.pendingRequestId) return;
-    const backendUrl = configRef.current.authBackendUrl ?? "https://cavos.xyz";
-    if (!configRef.current.appId) return;
-    const recovery = new HttpRecoveryClient({ baseUrl: backendUrl, appId: configRef.current.appId });
+    const cfg = configRef.current;
+    if (!identity || !wallet || wallet.chain !== "starknet" || !wallet.pendingRequestId) return;
+    const backendUrl = cfg.authBackendUrl ?? "https://cavos.xyz";
+    if (!cfg.appId) return;
+    const recovery = new HttpRecoveryClient({ baseUrl: backendUrl, appId: cfg.appId });
     await recovery.requestDeviceAddition({
       userId: identity.userId,
-      accountAddress: cavos.address,
-      newSigner: cavos.publicKey,
+      accountAddress: wallet.address,
+      newSigner: wallet.publicKey,
       ...identity.email ? { email: identity.email } : {}
     });
-  }, [identity, cavos]);
-  const connect = useCallback(async (id) => {
-    setWalletStatus({ ...INITIAL_STATUS, isDeploying: true });
-    const c = await Cavos.connect({
-      chain: configRef.current.chain ?? "starknet",
-      network: configRef.current.network,
+  }, [identity, wallet]);
+  const connect = useCallback(async (id, opts) => {
+    const cfg = configRef.current;
+    if (!opts?.silent) setWalletStatus({ ...INITIAL_STATUS, isDeploying: true });
+    const w = await Cavos.connect({
+      chain: cfg.chain ?? "starknet",
+      network: cfg.network,
       identity: id,
-      appSalt: configRef.current.appSalt,
-      ...configRef.current.paymasterApiKey ? { paymasterApiKey: configRef.current.paymasterApiKey } : {},
-      ...configRef.current.appId ? { appId: configRef.current.appId } : {},
-      ...configRef.current.authBackendUrl ? { backendUrl: configRef.current.authBackendUrl } : {},
-      ...configRef.current.rpcUrl ? { rpcUrl: configRef.current.rpcUrl } : {}
+      appSalt: cfg.appSalt,
+      ...cfg.paymasterApiKey ? { paymasterApiKey: cfg.paymasterApiKey } : {},
+      ...cfg.appId ? { appId: cfg.appId } : {},
+      ...cfg.authBackendUrl ? { backendUrl: cfg.authBackendUrl } : {},
+      ...cfg.rpcUrl ? { rpcUrl: cfg.rpcUrl } : {}
     });
-    setCavos(c);
+    setWallet(w);
     setIdentity(id);
-    const pendingRequestId = c.chain === "starknet" ? c.pendingRequestId : null;
+    const pendingRequestId = w.chain === "starknet" ? w.pendingRequestId : null;
+    let hasPasskey = false;
+    if (w.status === "needs-device-approval") {
+      try {
+        hasPasskey = await w.hasPasskey();
+      } catch {
+      }
+    }
     setWalletStatus({
       isDeploying: false,
-      isReady: c.status === "ready",
-      needsDeviceApproval: c.status === "needs-device-approval",
-      awaitingApproval: c.status === "needs-device-approval" && !!pendingRequestId,
-      pendingRequestId
+      isReady: w.status === "ready",
+      needsDeviceApproval: w.status === "needs-device-approval",
+      awaitingApproval: w.status === "needs-device-approval" && !!pendingRequestId,
+      pendingRequestId,
+      hasPasskey,
+      isNewAccount: w.isNewAccount
     });
-    modal?.onSuccess?.(c.address);
-    return c;
+    modal?.onSuccess?.(w.address);
+    return w;
   }, [modal]);
   useEffect(() => {
     if (typeof window === "undefined") return;
@@ -877,57 +1066,122 @@ function CavosProvider({ config, modal, children }) {
     await connect(id);
   }, [auth, connect]);
   const execute = useCallback(async (calls) => {
-    if (!cavos) throw new Error("Not logged in");
-    if (cavos.chain !== "starknet") {
+    if (!wallet) throw new Error("Not logged in");
+    if (wallet.chain !== "starknet") {
       throw new Error(
-        "kit: useCavos().execute(calls) is Starknet-only. On Solana use the `wallet` handle: wallet.execute(amount, dest)."
+        "kit: useCavos().execute(calls) is Starknet-only. On Solana/Stellar use the `wallet` handle: wallet.execute(amount, dest)."
       );
     }
-    return cavos.execute(calls);
-  }, [cavos]);
+    return wallet.execute(calls);
+  }, [wallet]);
   const addSigner = useCallback(
     async (pubkey) => {
-      if (!cavos) throw new Error("Not logged in");
-      if (cavos.chain !== "starknet") {
-        throw new Error("kit: addSigner via useCavos() is Starknet-only; use the `wallet` handle on Solana.");
+      if (!wallet) throw new Error("Not logged in");
+      if (wallet.chain !== "starknet") {
+        throw new Error("kit: addSigner via useCavos() is Starknet-only; use the `wallet` handle on other chains.");
       }
-      return cavos.addSigner(pubkey);
+      return wallet.addSigner(pubkey);
     },
-    [cavos]
+    [wallet]
   );
+  const enrollPasskey = useCallback(
+    async (passkey, params) => {
+      if (!wallet) throw new Error("Not logged in");
+      return wallet.enrollPasskey(passkey, params);
+    },
+    [wallet]
+  );
+  const rpName = branding.appName ?? modal?.appName ?? "Cavos";
+  const enrollPasskeyDefault = useCallback(async () => {
+    if (!wallet || !identity) throw new Error("Not logged in");
+    if (wallet.status !== "ready") throw new Error("kit: no ready device to enroll a passkey on");
+    const passkey = new PasskeySigner({ rpName });
+    await wallet.enrollPasskey(passkey, {
+      userId: identity.userId,
+      userName: identity.email ?? identity.userId,
+      ...identity.email ? { displayName: identity.email } : {}
+    });
+  }, [wallet, identity, rpName]);
+  const approveDeviceWithPasskey = useCallback(async () => {
+    if (!wallet || !identity) throw new Error("Not logged in");
+    if (wallet.status !== "needs-device-approval") {
+      await connect(identity);
+      return;
+    }
+    const passkey = new PasskeySigner({ rpName });
+    if (wallet.chain === "starknet") {
+      await wallet.approveThisDeviceWithPasskey({ passkey });
+    } else {
+      await wallet.approveThisDeviceWithPasskey(passkey);
+    }
+    setWalletStatus((s) => ({ ...s, isDeploying: true, needsDeviceApproval: false, awaitingApproval: false }));
+    const deadline = Date.now() + 6e4;
+    for (; ; ) {
+      let ready = false;
+      try {
+        ready = await wallet.isReady();
+      } catch {
+      }
+      if (ready) break;
+      if (Date.now() > deadline) {
+        setWalletStatus((s) => ({ ...s, isDeploying: false, needsDeviceApproval: true }));
+        throw new Error(
+          "Your device is being added, but it's taking longer than usual. Please try again in a moment."
+        );
+      }
+      await new Promise((r) => setTimeout(r, 3e3));
+    }
+    await connect(identity, { silent: true });
+  }, [wallet, identity, rpName, connect]);
   const setupRecovery = useCallback(async () => {
-    if (!cavos) throw new Error("Not logged in");
+    if (!wallet) throw new Error("Not logged in");
     const code = generateRecoveryCode();
-    await cavos.setupRecovery(code);
+    await wallet.setupRecovery(code);
     return code;
-  }, [cavos]);
+  }, [wallet]);
   const recover = useCallback(async (code) => {
     if (!identity) throw new Error("Sign in first so we know which account to recover.");
+    const cfg = configRef.current;
     setAuthError(null);
     setWalletStatus({ ...INITIAL_STATUS, isDeploying: true });
     try {
-      const chain = configRef.current.chain ?? "starknet";
-      const c = chain === "solana" ? await CavosSolana.recover({
-        code,
-        identity,
-        network: configRef.current.network === "mainnet" ? "solana-mainnet" : "solana-devnet",
-        appSalt: configRef.current.appSalt,
-        ...configRef.current.appId ? { appId: configRef.current.appId } : {},
-        ...configRef.current.authBackendUrl ? { backendUrl: configRef.current.authBackendUrl } : {},
-        ...configRef.current.rpcUrl ? { rpcUrl: configRef.current.rpcUrl } : {}
-      }) : await Cavos.recover({
-        code,
-        identity,
-        network: configRef.current.network,
-        appSalt: configRef.current.appSalt,
-        paymasterApiKey: configRef.current.paymasterApiKey ?? "",
-        ...configRef.current.appId ? { appId: configRef.current.appId } : {},
-        ...configRef.current.authBackendUrl ? { backendUrl: configRef.current.authBackendUrl } : {},
-        ...configRef.current.rpcUrl ? { rpcUrl: configRef.current.rpcUrl } : {}
-      });
-      setCavos(c);
+      const chain = cfg.chain ?? "starknet";
+      let w;
+      if (chain === "solana") {
+        w = await CavosSolana.recover({
+          code,
+          identity,
+          network: cfg.network === "mainnet" ? "solana-mainnet" : "solana-devnet",
+          appSalt: cfg.appSalt,
+          ...cfg.appId ? { appId: cfg.appId } : {},
+          ...cfg.authBackendUrl ? { backendUrl: cfg.authBackendUrl } : {},
+          ...cfg.rpcUrl ? { rpcUrl: cfg.rpcUrl } : {}
+        });
+      } else if (chain === "stellar") {
+        w = await CavosStellar.recover({
+          code,
+          identity,
+          network: cfg.network === "mainnet" ? "stellar-mainnet" : "stellar-testnet",
+          appSalt: cfg.appSalt,
+          ...cfg.appId ? { appId: cfg.appId } : {},
+          ...cfg.authBackendUrl ? { backendUrl: cfg.authBackendUrl } : {},
+          ...cfg.rpcUrl ? { rpcUrl: cfg.rpcUrl } : {}
+        });
+      } else {
+        w = await Cavos.recover({
+          code,
+          identity,
+          network: cfg.network,
+          appSalt: cfg.appSalt,
+          paymasterApiKey: cfg.paymasterApiKey ?? "",
+          ...cfg.appId ? { appId: cfg.appId } : {},
+          ...cfg.authBackendUrl ? { backendUrl: cfg.authBackendUrl } : {},
+          ...cfg.rpcUrl ? { rpcUrl: cfg.rpcUrl } : {}
+        });
+      }
+      setWallet(w);
       setWalletStatus({ ...INITIAL_STATUS, isReady: true });
-      modal?.onSuccess?.(c.address);
+      modal?.onSuccess?.(w.address);
     } catch (e) {
       const msg = e instanceof Error ? e.message : "Recovery failed. Check your code and try again.";
       setAuthError(msg);
@@ -937,9 +1191,10 @@ function CavosProvider({ config, modal, children }) {
   }, [identity, modal]);
   useEffect(() => {
     if (!walletStatus.awaitingApproval || !walletStatus.pendingRequestId || !identity) return;
-    if (!configRef.current.appId) return;
-    const backendUrl = configRef.current.authBackendUrl ?? "https://cavos.xyz";
-    const recovery = new HttpRecoveryClient({ baseUrl: backendUrl, appId: configRef.current.appId });
+    const cfg = configRef.current;
+    if (!cfg.appId) return;
+    const backendUrl = cfg.authBackendUrl ?? "https://cavos.xyz";
+    const recovery = new HttpRecoveryClient({ baseUrl: backendUrl, appId: cfg.appId });
     const requestId = walletStatus.pendingRequestId;
     let cancelled = false;
     const tick = async () => {
@@ -963,7 +1218,7 @@ function CavosProvider({ config, modal, children }) {
     };
   }, [walletStatus.awaitingApproval, walletStatus.pendingRequestId, identity, connect]);
   const logout = useCallback(() => {
-    setCavos(null);
+    setWallet(null);
     setIdentity(null);
     setWalletStatus(INITIAL_STATUS);
     setAuthError(null);
@@ -971,11 +1226,11 @@ function CavosProvider({ config, modal, children }) {
   const value = {
     openModal,
     closeModal,
-    isAuthenticated: !!cavos,
+    isAuthenticated: !!wallet,
     user: identity ? { userId: identity.userId, email: identity.email, provider: identity.provider } : null,
     chain: config.chain ?? "starknet",
-    wallet: cavos,
-    address: cavos?.address ?? null,
+    wallet,
+    address: wallet?.address ?? null,
     walletStatus,
     isLoading,
     authError,
@@ -987,6 +1242,10 @@ function CavosProvider({ config, modal, children }) {
     handleCallback,
     execute,
     addSigner,
+    enrollPasskey,
+    passkeySupported,
+    enrollPasskeyDefault,
+    approveDeviceWithPasskey,
     resendDeviceApproval,
     setupRecovery,
     recover,