@swype-org/react-sdk 0.1.115 → 0.1.121

package/dist/index.cjs

@@ -1908,7 +1908,10 @@ function buildSelectSourceChoices(options) {
       chainChoice.tokens.push({ tokenSymbol, balance });
     }
   }
-  return chainChoices;
+  return chainChoices.map((chain) => ({
+    ...chain,
+    tokens: chain.tokens.filter((t) => t.balance > 0)
+  })).filter((chain) => chain.tokens.length > 0);
 }
 
 // src/paymentReducer.ts
@@ -2169,7 +2172,7 @@ function paymentReducer(state, action) {
       };
     // ── Navigation & error ───────────────────────────────────────
     case "NAVIGATE":
-      return { ...state, step: action.step };
+      return { ...state, step: action.step, error: null };
     case "SET_ERROR":
       return { ...state, error: action.error };
     // ── Lifecycle ────────────────────────────────────────────────
@@ -2248,7 +2251,7 @@ var spinnerStyle = {
 };
 var FOOTER_CSS = `
 .swype-screen-footer {
-  padding-bottom: max(24px, env(safe-area-inset-bottom, 24px));
+  padding-bottom: max(32px, env(safe-area-inset-bottom, 32px));
 }`;
 function ScreenLayout({ children, footer }) {
   const { tokens } = useSwypeConfig();
@@ -2271,12 +2274,16 @@ var containerStyle2 = (bg) => ({
 });
 var bodyStyle = {
   flex: 1,
+  minHeight: 0,
   padding: "0 24px",
   display: "flex",
-  flexDirection: "column"
+  flexDirection: "column",
+  overflowY: "auto"
 };
 var footerStyle = {
-  padding: "16px 24px 0",
+  paddingTop: 16,
+  paddingLeft: 24,
+  paddingRight: 24,
   marginTop: "auto"
 };
 function ScreenHeader({ title, right, onBack, badge }) {
@@ -3153,7 +3160,7 @@ function LoginScreen({
         ] }),
         /* @__PURE__ */ jsxRuntime.jsxs("div", { style: walletSectionStyle, children: [
           /* @__PURE__ */ jsxRuntime.jsx("span", { style: walletLabelStyle(tokens.textMuted), children: "Works with" }),
-          /* @__PURE__ */ jsxRuntime.jsx("div", { style: walletLogosStyle, children: walletIcons.map(({ key, emoji, logo }) => logo ? /* @__PURE__ */ jsxRuntime.jsx("img", { src: logo, alt: key, style: walletLogoImgStyle }, key) : /* @__PURE__ */ jsxRuntime.jsx("span", { style: walletEmojiStyle, children: emoji }, key)) })
+          /* @__PURE__ */ jsxRuntime.jsx("div", { style: walletLogosStyle, children: walletIcons.map(({ key, logo }) => /* @__PURE__ */ jsxRuntime.jsx("img", { src: logo, alt: key, style: walletLogoImgStyle }, key)) })
         ] }),
         /* @__PURE__ */ jsxRuntime.jsx(PoweredByFooter, {})
       ] }),
@@ -3192,11 +3199,9 @@ function LoginScreen({
   );
 }
 var walletIcons = [
-  { key: "metamask", emoji: "\u{1F98A}", logo: KNOWN_LOGOS["metamask"] },
-  { key: "rabby", emoji: "\u{1F430}" },
-  { key: "phantom", emoji: "\u25C6" },
-  { key: "rainbow", emoji: "\u{1F439}" },
-  { key: "coinbase", emoji: "\u{1F535}", logo: KNOWN_LOGOS["base"] }
+  { key: "metamask", logo: KNOWN_LOGOS["metamask"] },
+  { key: "base", logo: KNOWN_LOGOS["base"] },
+  { key: "trust wallet", logo: KNOWN_LOGOS["trust wallet"] }
 ];
 function socialLabel(provider) {
   switch (provider) {
@@ -3316,10 +3321,6 @@ var walletLogosStyle = {
   justifyContent: "center",
   gap: 16
 };
-var walletEmojiStyle = {
-  fontSize: "1.4rem",
-  lineHeight: 1
-};
 var walletLogoImgStyle = {
   width: 24,
   height: 24,
@@ -3481,7 +3482,7 @@ function CreatePasskeyScreen({
 }) {
   const { tokens } = useSwypeConfig();
   const handleCreate = popupFallback && onCreatePasskeyViaPopup ? onCreatePasskeyViaPopup : onCreatePasskey;
-  const buttonLabel = popupFallback ? "Open passkey setup" : "Create passkey";
+  const buttonLabel = popupFallback ? "Open passkey setup" : "Set up passkey";
   return /* @__PURE__ */ jsxRuntime.jsxs(
     ScreenLayout,
     {
@@ -3498,7 +3499,7 @@ function CreatePasskeyScreen({
             /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "15", cy: "10", r: "1", fill: tokens.accent }),
             /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M9 14c0 1.5 1.34 2.5 3 2.5s3-1 3-2.5", stroke: tokens.accent, strokeWidth: "1.2", strokeLinecap: "round" })
           ] }) }),
-          /* @__PURE__ */ jsxRuntime.jsx("h2", { style: headingStyle3(tokens.text), children: "Create your passkey" }),
+          /* @__PURE__ */ jsxRuntime.jsx("h2", { style: headingStyle3(tokens.text), children: "Set up your passkey" }),
           /* @__PURE__ */ jsxRuntime.jsx("p", { style: subtitleStyle3(tokens.textSecondary), children: popupFallback ? "Your browser requires a separate window for passkey setup. Tap the button below to continue." : "Use Face ID to sign in instantly \u2014 no passwords, no codes." }),
           error && /* @__PURE__ */ jsxRuntime.jsx("div", { style: errorBannerStyle2(tokens), children: error }),
           /* @__PURE__ */ jsxRuntime.jsx(InfoBanner, { children: "Your passkey is stored securely on your device. Swype never sees your biometric data." })
@@ -3842,16 +3843,16 @@ function SetupScreen({
   error
 }) {
   const { tokens } = useSwypeConfig();
-  const effectiveMax = DEFAULT_MAX;
+  const effectiveMax = Math.min(DEFAULT_MAX, availableBalance);
   const effectiveMin = Math.min(ABSOLUTE_MIN, effectiveMax);
-  const [limit, setLimit] = react.useState(() => effectiveMax);
+  const [limit, setLimit] = react.useState(() => Math.min(availableBalance, effectiveMax));
   const [editing, setEditing] = react.useState(false);
   const [inputValue, setInputValue] = react.useState("");
   const inputRef = react.useRef(null);
   const startEditing = react.useCallback(() => {
     setInputValue(limit.toFixed(2));
     setEditing(true);
-    requestAnimationFrame(() => inputRef.current?.select());
+    requestAnimationFrame(() => inputRef.current?.focus());
   }, [limit]);
   const commitEdit = react.useCallback(() => {
     const parsed = parseFloat(inputValue);
@@ -5141,6 +5142,7 @@ function OpenWalletScreen({
   loading,
   error,
   onRetryStatus,
+  onBack,
   onLogout
 }) {
   const { tokens } = useSwypeConfig();
@@ -5171,7 +5173,7 @@ function OpenWalletScreen({
         /* @__PURE__ */ jsxRuntime.jsx("p", { style: hintStyle3(tokens.textMuted), children: loading ? "Preparing authorization..." : error ? "Retry the status check after returning to the browser, or reopen your wallet if needed." : "If your wallet didn't open automatically, tap the button above" })
       ] }),
       children: [
-        /* @__PURE__ */ jsxRuntime.jsx(ScreenHeader, { right: /* @__PURE__ */ jsxRuntime.jsx(SettingsMenu, { onLogout }) }),
+        /* @__PURE__ */ jsxRuntime.jsx(ScreenHeader, { onBack, right: /* @__PURE__ */ jsxRuntime.jsx(SettingsMenu, { onLogout }) }),
         /* @__PURE__ */ jsxRuntime.jsxs("div", { style: contentStyle8, children: [
           logoSrc ? /* @__PURE__ */ jsxRuntime.jsx("img", { src: logoSrc, alt: displayName, style: logoStyle }) : /* @__PURE__ */ jsxRuntime.jsx(Spinner, { size: 48 }),
           /* @__PURE__ */ jsxRuntime.jsx("h2", { style: headingStyle10(tokens.text), children: loading ? "Connecting..." : `Open ${displayName}` }),
@@ -5641,6 +5643,19 @@ function StepRenderer({
       }
     );
   }
+  if (step === "verify-passkey") {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      CreatePasskeyScreen,
+      {
+        onCreatePasskey: handlers.onRegisterPasskey,
+        onBack: handlers.onLogout,
+        creating: state.verifyingPasskeyPopup,
+        error: state.error,
+        popupFallback: true,
+        onCreatePasskeyViaPopup: handlers.onVerifyPasskeyViaPopup
+      }
+    );
+  }
   if (step === "wallet-picker") {
     return /* @__PURE__ */ jsxRuntime.jsx(
       WalletPickerScreen,
@@ -5664,6 +5679,7 @@ function StepRenderer({
         loading: state.creatingTransfer || !state.deeplinkUri,
         error: state.error || pollingError,
         onRetryStatus: handlers.onRetryMobileStatus,
+        onBack: () => handlers.onNavigate("wallet-picker"),
         onLogout: handlers.onLogout
       }
     );
@@ -6247,7 +6263,7 @@ function SwypePaymentInner({
       return;
     }
     if (!state.activeCredentialId) {
-      dispatch({ type: "SET_ERROR", error: "Create a passkey on this device before continuing." });
+      dispatch({ type: "SET_ERROR", error: "Set up a passkey on this device before continuing." });
       dispatch({ type: "NAVIGATE", step: "create-passkey" });
       return;
     }
@@ -6328,7 +6344,7 @@ function SwypePaymentInner({
       return;
     }
     if (!state.activeCredentialId) {
-      dispatch({ type: "SET_ERROR", error: "Create a passkey on this device before continuing." });
+      dispatch({ type: "SET_ERROR", error: "Set up a passkey on this device before continuing." });
       dispatch({ type: "NAVIGATE", step: "create-passkey" });
       return;
     }
@@ -6402,7 +6418,7 @@ function SwypePaymentInner({
       return;
     }
     if (!state.activeCredentialId) {
-      dispatch({ type: "SET_ERROR", error: "Create a passkey on this device before continuing." });
+      dispatch({ type: "SET_ERROR", error: "Set up a passkey on this device before continuing." });
       dispatch({ type: "NAVIGATE", step: "create-passkey" });
       return;
     }
@@ -6499,7 +6515,7 @@ function SwypePaymentInner({
   const handleSelectProvider = react.useCallback(async (providerId) => {
     dispatch({ type: "SELECT_PROVIDER", providerId });
     if (!state.activeCredentialId) {
-      dispatch({ type: "SET_ERROR", error: "Create a passkey on this device before continuing." });
+      dispatch({ type: "SET_ERROR", error: "Set up a passkey on this device before continuing." });
       dispatch({ type: "NAVIGATE", step: "create-passkey" });
       return;
     }
@@ -6663,11 +6679,11 @@ function SwypePaymentInner({
     }
   }, [depositAmount]);
   react.useEffect(() => {
-    if (authenticated) return;
+    if (authenticated || state.step !== "otp-verify") return;
     if (activeOtpErrorMessage) dispatch({ type: "SET_ERROR", error: activeOtpErrorMessage });
-  }, [activeOtpErrorMessage, authenticated]);
+  }, [activeOtpErrorMessage, authenticated, state.step]);
   react.useEffect(() => {
-    if (state.step === "otp-verify" && /^\d{6}$/.test(otpCode.trim()) && activeOtpStatus !== "submitting-code") {
+    if (state.step === "otp-verify" && /^\d{6}$/.test(otpCode.trim()) && activeOtpStatus === "awaiting-code-input") {
       handleVerifyLoginCode();
     }
   }, [otpCode, state.step, activeOtpStatus, handleVerifyLoginCode]);
@@ -6763,6 +6779,7 @@ function SwypePaymentInner({
           });
           pollingTransferIdRef.current = persisted.transferId ?? null;
           mobileSetupFlowRef.current = persisted.isSetup;
+          setupAccountIdRef.current = persisted.accountId ?? null;
           if (persisted.transferId) pollingRef.current.startPolling(persisted.transferId);
           return;
         }
@@ -6773,6 +6790,7 @@ function SwypePaymentInner({
         });
         pollingTransferIdRef.current = persisted.transferId ?? null;
         mobileSetupFlowRef.current = persisted.isSetup;
+        setupAccountIdRef.current = persisted.accountId ?? null;
         if (persisted.transferId) pollingRef.current.startPolling(persisted.transferId);
         return;
       }
@@ -6991,7 +7009,10 @@ function SwypePaymentInner({
           mobileSetupFlowRef.current = false;
           setupAccountIdRef.current = null;
           clearMobileFlowState();
-          await reloadAccounts();
+          try {
+            await reloadAccounts();
+          } catch {
+          }
           dispatch({ type: "MOBILE_SETUP_COMPLETE" });
         }
       } catch {