@swype-org/react-sdk 0.1.329 → 0.1.339

package/dist/index.cjs

@@ -1951,7 +1951,7 @@ function resolvePhase(state) {
   const isFundingSourceSubflow = !state.loginRequested && (currentPhase.step === "token-picker" || currentPhase.step === "one-tap-setup" || currentPhase.step === "select-source" || currentPhase.step === "confirm-sign" || currentPhase.step === "guest-token-picker" && guestTokenPickerEligible);
   const walletPickerSwitchEligible = currentPhase.step === "wallet-picker" && currentPhase.reason === "switch" && !state.creatingTransfer && !(state.mobileFlow && state.deeplinkUri);
   const missingActivePasskeyCredential = state.passkeyConfigLoaded && !state.activeCredentialId;
-  const shouldPromptPasskeyVerification = missingActivePasskeyCredential && state.knownCredentialIds.length > 0 && state.passkeyPopupNeeded;
+  const shouldPromptPasskeyVerification = missingActivePasskeyCredential && state.knownCredentialIds.length > 0;
   const guestPreauthClaimPending = state.guestPreauthAccountId != null && state.guestSessionToken != null && state.privyAuthenticated && state.activeCredentialId != null && !state.guestPreauthSetupCompletePending && !state.error;
   const branchGuestSetupComplete = state.guestPreauthSetupCompletePending && state.privyReady && state.privyAuthenticated;
   const branchKeepGuestPreauthPin = !branchGuestSetupComplete && guestPreauthPinsCurrentPhase;
@@ -3760,16 +3760,33 @@ function PasskeyScreen({
   creating,
   error,
   popupFallback = false,
-  onCreatePasskeyViaPopup
+  onCreatePasskeyViaPopup,
+  onCreateNewPasskey,
+  onCreateNewPasskeyViaPopup,
+  createNewPopupFallback,
+  creatingNewPasskey
 }) {
   const { tokens } = useBlinkConfig();
   const handleCreate = popupFallback && onCreatePasskeyViaPopup ? onCreatePasskeyViaPopup : onCreatePasskey;
   const buttonLabel = popupFallback ? "Open Passkey Window" : "Verify Passkey";
+  const showCreateNewLink = onCreateNewPasskey != null;
+  const usePopupForNew = createNewPopupFallback ?? popupFallback;
+  const handleCreateNew = usePopupForNew && onCreateNewPasskeyViaPopup ? onCreateNewPasskeyViaPopup : onCreateNewPasskey;
   return /* @__PURE__ */ jsxRuntime.jsxs(
     ScreenLayout,
     {
       footer: /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-        /* @__PURE__ */ jsxRuntime.jsx(PrimaryButton, { onClick: handleCreate, disabled: creating, loading: creating, children: buttonLabel }),
+        /* @__PURE__ */ jsxRuntime.jsx(PrimaryButton, { onClick: handleCreate, disabled: creating || creatingNewPasskey, loading: creating, children: buttonLabel }),
+        showCreateNewLink && /* @__PURE__ */ jsxRuntime.jsx(
+          "button",
+          {
+            type: "button",
+            onClick: handleCreateNew,
+            disabled: creatingNewPasskey || creating,
+            style: createNewLinkStyle(tokens.textMuted),
+            children: creatingNewPasskey ? "Creating passkey\u2026" : "Create a new passkey for this device"
+          }
+        ),
         /* @__PURE__ */ jsxRuntime.jsx(PoweredByFooter, {})
       ] }),
       children: [
@@ -3804,6 +3821,17 @@ var subtitleStyle3 = (color) => ({
   margin: "0 0 20px",
   lineHeight: 1.5
 });
+var createNewLinkStyle = (color) => ({
+  background: "none",
+  border: "none",
+  color,
+  fontSize: "0.85rem",
+  cursor: "pointer",
+  padding: "8px 16px",
+  textDecoration: "underline",
+  fontFamily: "inherit",
+  width: "100%"
+});
 var errorBannerStyle2 = (tokens) => ({
   background: tokens.errorBg,
   border: `1px solid ${tokens.error}66`,
@@ -4017,7 +4045,7 @@ function WalletPickerScreen({
             },
             loading: connecting || preparing,
             disabled: preparing,
-            children: preparing ? "Preparing..." : `Open ${selectedProvider.name} to Link`
+            children: preparing ? "Preparing..." : `Open ${selectedProvider.name} to Deposit`
           }
         ),
         /* @__PURE__ */ jsxRuntime.jsx(PoweredByFooter, {})
@@ -4891,8 +4919,7 @@ function isPreciseMoneyNonPositive(fee) {
   return Number.isFinite(n) && n <= 0;
 }
 function formatNonPositiveFeeDisplay(fee) {
-  if (fee.currency === "USD") return "Under $0.01";
-  return `Less than 0.01 ${fee.currency}`;
+  return "< $0.01";
 }
 function formatPreciseMoneyForDisplay(fee) {
   const raw = fee.value.trim();
@@ -4987,13 +5014,14 @@ function DepositScreen({
   const selectedProviderLogo = KNOWN_LOGOS[selectedProviderName.toLowerCase()];
   const totalAccountBalance = selectedAccount ? selectedAccount.wallets.reduce((sum, w) => sum + w.balance.available.amount, 0) : availableBalance;
   const isLowBalance = availableBalance < minDepositFloor;
+  const insufficientFunds = availableBalance < amount;
   const exceedsLimit = remainingLimit != null && amount > remainingLimit && !isLowBalance;
-  const canDeposit = amount >= minDepositFloor && !exceedsLimit && !isLowBalance && !processing;
+  const canDeposit = amount >= minDepositFloor && !exceedsLimit && !isLowBalance && !insufficientFunds && !processing;
   return /* @__PURE__ */ jsxRuntime.jsxs(
     ScreenLayout,
     {
       footer: /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-        !accountPickerOpen && !tokenPickerOpen && (exceedsLimit && onIncreaseLimit ? /* @__PURE__ */ jsxRuntime.jsx(PrimaryButton, { onClick: onIncreaseLimit, loading: increasingLimit, children: "Increase limit" }) : /* @__PURE__ */ jsxRuntime.jsx(PrimaryButton, { onClick: () => onDeposit(amount), disabled: !canDeposit, loading: processing, children: "Confirm" })),
+        !accountPickerOpen && !tokenPickerOpen && (exceedsLimit && onIncreaseLimit ? /* @__PURE__ */ jsxRuntime.jsx(PrimaryButton, { onClick: onIncreaseLimit, loading: increasingLimit, children: "Increase limit" }) : /* @__PURE__ */ jsxRuntime.jsx(PrimaryButton, { onClick: () => onDeposit(amount), disabled: !canDeposit, loading: processing, children: insufficientFunds ? "Insufficient Funds" : "Confirm" })),
         /* @__PURE__ */ jsxRuntime.jsx(PoweredByFooter, {})
       ] }),
       children: [
@@ -5073,7 +5101,7 @@ function DepositScreen({
                 return /* @__PURE__ */ jsxRuntime.jsx("div", { style: feeRowContainerStyle, "aria-live": "polite", children: /* @__PURE__ */ jsxRuntime.jsx("span", { style: feeRowLabelStyle(tokens.textMuted), children: "Getting fee estimate\u2026" }) });
               }
               if (quoteFee) {
-                const feeText = isPreciseMoneyNonPositive(quoteFee) ? formatNonPositiveFeeDisplay(quoteFee) : formatPreciseMoneyForDisplay(quoteFee);
+                const feeText = isPreciseMoneyNonPositive(quoteFee) ? formatNonPositiveFeeDisplay() : formatPreciseMoneyForDisplay(quoteFee);
                 return /* @__PURE__ */ jsxRuntime.jsxs("div", { style: feeRowContainerStyle, "aria-live": "polite", children: [
                   /* @__PURE__ */ jsxRuntime.jsx("span", { style: feeRowLabelStyle(tokens.textMuted), children: "Fee estimate: " }),
                   /* @__PURE__ */ jsxRuntime.jsx("span", { style: feeRowAmountStyle(tokens.textSecondary), children: feeText })
@@ -5514,6 +5542,25 @@ var feeRowAmountStyle = (color) => ({
   color,
   fontVariantNumeric: "tabular-nums"
 });
+
+// src/deviceBiometricUnlockText.ts
+var FALLBACK = "Biometric verification";
+function getDeviceBiometricUnlockText() {
+  const ua = typeof navigator !== "undefined" && typeof navigator.userAgent === "string" ? navigator.userAgent : "";
+  if (/iPhone|iPad|iPod/i.test(ua)) {
+    return "Face ID or Touch ID";
+  }
+  if (/Android/i.test(ua)) {
+    return "Fingerprint or face unlock";
+  }
+  if (/Windows NT/i.test(ua)) {
+    return "Windows Hello";
+  }
+  if (/Macintosh|Mac OS X/i.test(ua)) {
+    return "Touch ID";
+  }
+  return FALLBACK;
+}
 function SuccessScreen({
   amount,
   currency: _currency,
@@ -5535,9 +5582,9 @@ function SuccessScreen({
     {
       footer: /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
         isGuestDepositSuccess ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-          /* @__PURE__ */ jsxRuntime.jsx(PrimaryButton, { onClick: onPreauthorize, children: "Set up one tap" }),
-          /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", onClick: onDone, style: skipButtonStyle(tokens.textMuted), children: "Return to app" })
-        ] }) : /* @__PURE__ */ jsxRuntime.jsx(PrimaryButton, { onClick: onDone, children: succeeded ? "Done" : "Try again" }),
+          /* @__PURE__ */ jsxRuntime.jsx(PrimaryButton, { onClick: onPreauthorize, children: "Setup" }),
+          onDone && /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", onClick: onDone, style: skipButtonStyle(tokens.textMuted), children: "Return to app" })
+        ] }) : onDone ? /* @__PURE__ */ jsxRuntime.jsx(PrimaryButton, { onClick: onDone, children: succeeded ? "Done" : "Try again" }) : null,
         onManageAccount && /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", onClick: onManageAccount, style: manageStyle(tokens.textMuted), children: "Manage Blink account \u2192" }),
         /* @__PURE__ */ jsxRuntime.jsx(PoweredByFooter, {})
       ] }),
@@ -5545,13 +5592,17 @@ function SuccessScreen({
         /* @__PURE__ */ jsxRuntime.jsx(ScreenHeader, { onLogout }),
         /* @__PURE__ */ jsxRuntime.jsxs("div", { style: screenContentStyle, children: [
           isGuestDepositSuccess ? /* @__PURE__ */ jsxRuntime.jsxs("div", { style: contentStyleCompact, children: [
-            /* @__PURE__ */ jsxRuntime.jsxs("h2", { style: headingStyle7(tokens.text), children: [
-              "$",
-              amount.toFixed(2),
-              " deposited"
+            /* @__PURE__ */ jsxRuntime.jsx("p", { style: subtitleStyle7(tokens.text), children: "Success" }),
+            /* @__PURE__ */ jsxRuntime.jsxs("p", { style: headingStyle7(tokens.text), children: [
+              "Make next time ",
+              /* @__PURE__ */ jsxRuntime.jsx("br", {}),
+              " faster \u2014 and free"
             ] }),
-            /* @__PURE__ */ jsxRuntime.jsx("p", { style: { ...subtitleStyle7(tokens.text), fontWeight: 600, margin: "0 0 8px" }, children: "Next time, do it in one tap" }),
-            /* @__PURE__ */ jsxRuntime.jsx("p", { style: subtitleStyle7(tokens.textSecondary), children: "Set up one tap for this wallet and skip the extra steps." })
+            /* @__PURE__ */ jsxRuntime.jsxs("p", { style: subtitleStyle7(tokens.textSecondary), children: [
+              "Future deposits are just ",
+              getDeviceBiometricUnlockText(),
+              " and go."
+            ] })
           ] }) : succeeded ? /* @__PURE__ */ jsxRuntime.jsxs("div", { style: contentStyleCompact, children: [
             /* @__PURE__ */ jsxRuntime.jsxs("h2", { style: headingStyle7(tokens.text), children: [
               "$",
@@ -6711,7 +6762,7 @@ function GuestTokenPickerScreen({
       return /* @__PURE__ */ jsxRuntime.jsx("div", { style: feeRowContainerStyle2, "aria-live": "polite", children: /* @__PURE__ */ jsxRuntime.jsx("span", { style: feeRowLabelStyle2(t.textMuted), children: "Getting fee estimate\u2026" }) });
     }
     if (quoteFee) {
-      const feeText = isPreciseMoneyNonPositive(quoteFee) ? formatNonPositiveFeeDisplay(quoteFee) : formatPreciseMoneyForDisplay(quoteFee);
+      const feeText = isPreciseMoneyNonPositive(quoteFee) ? formatNonPositiveFeeDisplay() : formatPreciseMoneyForDisplay(quoteFee);
       return /* @__PURE__ */ jsxRuntime.jsxs("div", { style: feeRowContainerStyle2, "aria-live": "polite", children: [
         /* @__PURE__ */ jsxRuntime.jsx("span", { style: feeRowLabelStyle2(t.textMuted), children: "Fee estimate: " }),
         /* @__PURE__ */ jsxRuntime.jsx("span", { style: feeRowAmountStyle2(t.textSecondary), children: feeText })
@@ -7311,13 +7362,15 @@ function StepRendererContent({
       return /* @__PURE__ */ jsxRuntime.jsx(
         PasskeyScreen,
         {
-          onCreatePasskey: handlers.onRegisterPasskey,
+          onCreatePasskey: handlers.onVerifyPasskey,
           onBack: handlers.onLogout,
           onLogout: handlers.onLogout,
-          creating: state.verifyingPasskeyPopup,
+          creating: state.registeringPasskey,
           error: state.error,
-          popupFallback: true,
-          onCreatePasskeyViaPopup: handlers.onVerifyPasskeyViaPopup
+          onCreateNewPasskey: handlers.onCreateNewPasskey,
+          onCreateNewPasskeyViaPopup: handlers.onCreateNewPasskeyViaPopup,
+          createNewPopupFallback: state.passkeyPopupNeeded,
+          creatingNewPasskey: state.registeringPasskey
         }
       );
     case "wallet-picker": {
@@ -7867,6 +7920,53 @@ function usePasskeyHandlers(dispatch, apiBaseUrl, accounts, knownCredentialIds)
       dispatch({ type: "SET_REGISTERING_PASSKEY", value: false });
     }
   }, [user, knownCredentialIds, activateExistingCredential, completePasskeyRegistration, dispatch]);
+  const handleVerifyPasskey = react.useCallback(async () => {
+    dispatch({ type: "SET_REGISTERING_PASSKEY", value: true });
+    dispatch({ type: "SET_ERROR", error: null });
+    try {
+      const matched = await findDevicePasskey(knownCredentialIds);
+      if (matched) {
+        await activateExistingCredential(matched);
+      } else {
+        dispatch({
+          type: "SET_ERROR",
+          error: "No matching passkey found on this device. Please try again."
+        });
+      }
+    } catch (err) {
+      captureException(err);
+      dispatch({
+        type: "SET_ERROR",
+        error: err instanceof Error ? err.message : "Passkey verification failed."
+      });
+    } finally {
+      dispatch({ type: "SET_REGISTERING_PASSKEY", value: false });
+    }
+  }, [knownCredentialIds, activateExistingCredential, dispatch]);
+  const handleCreateNewPasskey = react.useCallback(async () => {
+    dispatch({ type: "SET_REGISTERING_PASSKEY", value: true });
+    dispatch({ type: "SET_ERROR", error: null });
+    try {
+      const passkeyDisplayName = user?.email?.address ?? user?.google?.name ?? user?.id ?? "Blink User";
+      const { credentialId, publicKey } = await createPasskeyCredential({
+        userId: user?.id ?? "unknown",
+        displayName: passkeyDisplayName
+      });
+      await completePasskeyRegistration(credentialId, publicKey);
+    } catch (err) {
+      if (err instanceof PasskeyIframeBlockedError) {
+        dispatch({ type: "SET_PASSKEY_POPUP_NEEDED", needed: true });
+      } else {
+        captureException(err);
+        dispatch({
+          type: "SET_ERROR",
+          error: err instanceof Error ? err.message : "Failed to register passkey"
+        });
+      }
+    } finally {
+      dispatch({ type: "SET_REGISTERING_PASSKEY", value: false });
+    }
+  }, [user, completePasskeyRegistration, dispatch]);
   const handleCreatePasskeyViaPopup = react.useCallback(async () => {
     dispatch({ type: "SET_REGISTERING_PASSKEY", value: true });
     dispatch({ type: "SET_ERROR", error: null });
@@ -7913,6 +8013,35 @@ function usePasskeyHandlers(dispatch, apiBaseUrl, accounts, knownCredentialIds)
       dispatch({ type: "SET_REGISTERING_PASSKEY", value: false });
     }
   }, [user, knownCredentialIds, getAccessToken, apiBaseUrl, activateExistingCredential, dispatch]);
+  const handleCreateNewPasskeyViaPopup = react.useCallback(async () => {
+    dispatch({ type: "SET_REGISTERING_PASSKEY", value: true });
+    dispatch({ type: "SET_ERROR", error: null });
+    try {
+      const token = await getAccessToken();
+      const passkeyDisplayName = user?.email?.address ?? user?.google?.name ?? user?.id ?? "Blink User";
+      const popupOptions = buildPasskeyPopupOptions({
+        userId: user?.id ?? "unknown",
+        displayName: passkeyDisplayName,
+        authToken: token ?? void 0,
+        apiBaseUrl
+      });
+      const { credentialId, publicKey } = await createPasskeyViaPopup(popupOptions);
+      dispatch({ type: "PASSKEY_ACTIVATED", credentialId, publicKey });
+      localStorage.setItem(ACTIVE_CREDENTIAL_STORAGE_KEY, credentialId);
+      if (token) {
+        reportPasskeyActivity(apiBaseUrl, token, credentialId).catch(() => {
+        });
+      }
+    } catch (err) {
+      captureException(err);
+      dispatch({
+        type: "SET_ERROR",
+        error: err instanceof Error ? err.message : "Failed to register passkey"
+      });
+    } finally {
+      dispatch({ type: "SET_REGISTERING_PASSKEY", value: false });
+    }
+  }, [user, getAccessToken, apiBaseUrl, dispatch]);
   const handleVerifyPasskeyViaPopup = react.useCallback(async () => {
     dispatch({ type: "SET_VERIFYING_PASSKEY", value: true });
     dispatch({ type: "SET_ERROR", error: null });
@@ -7955,7 +8084,10 @@ function usePasskeyHandlers(dispatch, apiBaseUrl, accounts, knownCredentialIds)
   }, [knownCredentialIds, getAccessToken, apiBaseUrl, dispatch]);
   return {
     handleRegisterPasskey,
+    handleVerifyPasskey,
+    handleCreateNewPasskey,
     handleCreatePasskeyViaPopup,
+    handleCreateNewPasskeyViaPopup,
     handleVerifyPasskeyViaPopup,
     checkingPasskeyRef
   };
@@ -9573,28 +9705,6 @@ function usePasskeyCheckEffect(deps) {
           await restoreState(activeCredentialId, token);
           return;
         }
-        if (cancelled) return;
-        const credentialIds = allPasskeys.map((p) => p.credentialId);
-        let matched = null;
-        if (isSafari() && isInCrossOriginIframe()) {
-          matched = await findDevicePasskeyViaPopup({
-            credentialIds,
-            rpId: resolvePasskeyRpId(),
-            authToken: token ?? void 0,
-            apiBaseUrl
-          });
-        } else {
-          matched = await findDevicePasskey(credentialIds);
-        }
-        if (cancelled) return;
-        if (matched) {
-          const publicKey = allPasskeys.find((p) => p.credentialId === matched)?.publicKey;
-          dispatch({ type: "PASSKEY_ACTIVATED", credentialId: matched, publicKey });
-          window.localStorage.setItem(ACTIVE_CREDENTIAL_STORAGE_KEY, matched);
-          reportPasskeyActivity(apiBaseUrl, token, matched).catch(() => {
-          });
-          await restoreState(matched, token);
-        }
       } catch (err) {
         dispatch({
           type: "PASSKEY_CONFIG_LOADED",
@@ -10657,7 +10767,7 @@ function BlinkPaymentInner({
     paymentReducer,
     {
       depositAmount,
-      passkeyPopupNeeded: isSafari() && isInCrossOriginIframe(),
+      passkeyPopupNeeded: isSafari() && isInCrossOriginIframe() && !isDesktop,
       activeCredentialId: typeof window === "undefined" ? null : window.localStorage.getItem(ACTIVE_CREDENTIAL_STORAGE_KEY)
     },
     createInitialState
@@ -11013,7 +11123,10 @@ function BlinkPaymentInner({
       dispatch({ type: "BACK_TO_LOGIN" });
     },
     onRegisterPasskey: passkey.handleRegisterPasskey,
+    onVerifyPasskey: passkey.handleVerifyPasskey,
+    onCreateNewPasskey: passkey.handleCreateNewPasskey,
     onCreatePasskeyViaPopup: passkey.handleCreatePasskeyViaPopup,
+    onCreateNewPasskeyViaPopup: passkey.handleCreateNewPasskeyViaPopup,
     onVerifyPasskeyViaPopup: passkey.handleVerifyPasskeyViaPopup,
     onPrepareProvider: provider.handlePrepareProvider,
     onSelectProvider: provider.handleSelectProvider,
@@ -11169,6 +11282,7 @@ exports.darkTheme = darkTheme;
 exports.deviceHasPasskey = deviceHasPasskey;
 exports.findDevicePasskey = findDevicePasskey;
 exports.findDevicePasskeyViaPopup = findDevicePasskeyViaPopup;
+exports.getDeviceBiometricUnlockText = getDeviceBiometricUnlockText;
 exports.getTheme = getTheme;
 exports.guestEntryMatchingRecommended = guestEntryMatchingRecommended;
 exports.isAuthorizationSessionCancelled = isAuthorizationSessionCancelled;