@getpara/react-sdk 2.0.0-alpha.13 → 2.0.0-alpha.15

package/dist/modal/components/BiometricCreationStep/BiometricCreationStep.js

@@ -16,7 +16,6 @@ const BiometricCreationStep = () => {
   const { presentSignupUi } = useAuthActions();
   const signupState = useModalStore((state) => state.getSignupState());
   const authStepRoute = useModalStore((state) => state.authStepRoute);
-  const isPasskeySupported = useModalStore((state) => state.isPasskeySupported);
   const [isCopied, copy] = useCopyToClipboard();
   const handleCopy = () => {
     if (signupState == null ? void 0 : signupState.passkeyUrl) {
@@ -37,7 +36,7 @@ const BiometricCreationStep = () => {
       /* @__PURE__ */ jsx(CpslText, { variant: "bodyS", color: "secondary", weight: "medium", children: isBoth ? "Choose a password or set up a passkey" : "Your Passkey keeps your account safe." })
     ] }),
     /* @__PURE__ */ jsxs(InnerStepContainer, { children: [
-      isPasskeySupported ? /* @__PURE__ */ jsxs(CpslButton, { fullWidth: true, onClick: onClick(AuthMethod.PASSKEY), children: [
+      (signupState == null ? void 0 : signupState.isPasskeySupported) ? /* @__PURE__ */ jsxs(CpslButton, { fullWidth: true, onClick: onClick(AuthMethod.PASSKEY), children: [
         /* @__PURE__ */ jsx(CpslIcon, { slot: "start", icon: "key" }),
         isBoth ? "Create Passkey" : "Create"
       ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [

package/dist/modal/components/BiometricLoginStep/BiometricLoginStep.js

@@ -14,19 +14,12 @@ const BiometricLoginStep = () => {
   const loginState = useModalStore((state) => state.getLoginState());
   const para = useInternalClient();
   const { biometricHints, presentLoginUi } = useAuthActions();
-  const isPasskeySupported = useModalStore((state) => state.isPasskeySupported);
-  const [isPasskey, isPassword, hasHints, isPasskeyOnKnownDevice] = [
-    !!(loginState == null ? void 0 : loginState.passkeyUrl),
-    !!(loginState == null ? void 0 : loginState.passwordUrl),
-    (_a = loginState == null ? void 0 : loginState.biometricHints) == null ? void 0 : _a.length,
-    isPasskeySupported && !!(biometricHints == null ? void 0 : biometricHints.isOnKnownDevice)
-  ];
-  const knownDeviceLink = loginState == null ? void 0 : loginState.passkeyKnownDeviceUrl;
-  const isPasskeyUnavailable = hasHints && !(biometricHints == null ? void 0 : biometricHints.isOnKnownDevice) || !isPasskeySupported;
-  const displayWelcomeBack = hasHints || isPasskeyOnKnownDevice || isPassword;
   if (!loginState) {
     return null;
   }
+  const { passkeyUrl, passkeyKnownDeviceUrl, passwordUrl, isPasskeySupported } = loginState;
+  const { isOnKnownDevice = false, formattedHints } = biometricHints || {};
+  const isPasskey = !!passkeyUrl, isPassword = !!passwordUrl, isNeither = !isPasskey && !isPassword, hasHints = (_a = formattedHints == null ? void 0 : formattedHints.length) != null ? _a : 0 > 0, isPasskeyOnKnownDevice = isPasskeySupported && isOnKnownDevice, isPasskeyUnavailable = hasHints && !isOnKnownDevice || !isPasskeySupported || isNeither, displayKnownDevices = isPasskeyUnavailable && !!biometricHints && (hasHints || !!passkeyKnownDeviceUrl), displayWelcomeBack = isPasskeyOnKnownDevice || isPassword;
   return /* @__PURE__ */ jsxs(StepContainer, { $wide: true, children: [
     /* @__PURE__ */ jsxs(InnerStepContainer, { children: [
       displayWelcomeBack && /* @__PURE__ */ jsx(Heading, { variant: "headingS", weight: "bold", children: "Welcome back," }),
@@ -34,15 +27,15 @@ const BiometricLoginStep = () => {
     ] }),
     /* @__PURE__ */ jsxs(MainContainer, { children: [
       isPassword && /* @__PURE__ */ jsx(CpslButton, { fullWidth: true, onClick: () => presentLoginUi(AuthMethod.PASSWORD, loginState), children: "Login" }),
-      isPasskey && !!knownDeviceLink && /* @__PURE__ */ jsxs(Fragment, { children: [
-        isPasskeyUnavailable && !!biometricHints && /* @__PURE__ */ jsx(KnownDevices, { hints: biometricHints, link: knownDeviceLink }),
-        isPasskeySupported && /* @__PURE__ */ jsxs(Fragment, { children: [
-          isPasskeyUnavailable && /* @__PURE__ */ jsx(CpslDivider, { children: "or" }),
-          /* @__PURE__ */ jsx(CpslButton, { fullWidth: true, onClick: () => presentLoginUi(AuthMethod.PASSKEY, loginState), children: isPasskeyUnavailable ? "Continue anyway" : /* @__PURE__ */ jsxs(Fragment, { children: [
-            /* @__PURE__ */ jsx(CpslIcon, { slot: "start", icon: "key" }),
-            "Login with passkey"
-          ] }) })
-        ] })
+      isPasskey && /* @__PURE__ */ jsxs(Fragment, { children: [
+        displayKnownDevices && /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(KnownDevices, { hints: biometricHints, link: passkeyKnownDeviceUrl }),
+          /* @__PURE__ */ jsx(CpslDivider, { children: "or" })
+        ] }),
+        /* @__PURE__ */ jsx(CpslButton, { fullWidth: true, onClick: () => presentLoginUi(AuthMethod.PASSKEY, loginState), children: isPasskeyUnavailable ? "Continue anyway" : /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(CpslIcon, { slot: "start", icon: "key" }),
+          "Login with passkey"
+        ] }) })
       ] })
     ] })
   ] });

package/dist/modal/stores/modal/actions.js

@@ -32,9 +32,6 @@ const getActions = (set, get) => ({
       set({ onRampStep: onRampStep - 1 });
       return;
     }
-    if (!flow) {
-      return;
-    }
     const onModalStepChange = get().onModalStepChange;
     const signupState = get().getSignupState();
     const iFrameUrl = get().iFrameUrl;

package/dist/provider/actions/index.d.ts

@@ -25,3 +25,4 @@ export declare const createGuestWallets: import("./utils.js").CoreAction<"create
 export declare const signMessage: import("./utils.js").CoreAction<"signMessage">;
 export declare const signTransaction: import("./utils.js").CoreAction<"signTransaction">;
 export declare const getWalletBalance: import("./utils.js").CoreAction<"getWalletBalance">;
+export declare const issueJwt: import("./utils.js").CoreAction<"issueJwt">;

package/dist/provider/actions/index.js

@@ -28,6 +28,7 @@ const createGuestWallets = generateAction("createGuestWallets");
 const signMessage = generateAction("signMessage");
 const signTransaction = generateAction("signTransaction");
 const getWalletBalance = generateAction("getWalletBalance");
+const issueJwt = generateAction("issueJwt");
 export {
   claimPregenWallets,
   createGuestWallets,
@@ -38,6 +39,7 @@ export {
   enable2fa,
   getWalletBalance,
   hasPregenWallet,
+  issueJwt,
   keepSessionAlive,
   loginExternalWallet,
   logout,

package/dist/provider/hooks/mutations/index.d.ts

@@ -24,4 +24,5 @@ export declare const useUpdatePregenWalletIdentifier: () => import("../../types/
 export declare const useCreateGuestWallets: () => import("../../types/utils.js").CoreMethodHook<"createGuestWallets">;
 export declare const useSignMessage: () => import("../../types/utils.js").CoreMethodHook<"signMessage">;
 export declare const useSignTransaction: () => import("../../types/utils.js").CoreMethodHook<"signTransaction">;
+export declare const useIssueJwt: () => import("../../types/utils.js").CoreMethodHook<"issueJwt">;
 export declare const useCreateGuestWalletsState: import("../../types/utils.js").CoreMethodStateHook<"createGuestWallets">;

package/dist/provider/hooks/mutations/index.js

@@ -31,6 +31,7 @@ const useUpdatePregenWalletIdentifier = generateHook(
 const useCreateGuestWallets = generateHook("createGuestWallets", actions.createGuestWallets);
 const useSignMessage = generateHook("signMessage", actions.signMessage);
 const useSignTransaction = generateHook("signTransaction", actions.signTransaction);
+const useIssueJwt = generateHook("issueJwt", actions.issueJwt);
 const useCreateGuestWalletsState = generateStateHook("createGuestWallets");
 export {
   useClaimPregenWallets,
@@ -42,6 +43,7 @@ export {
   useCreateWalletPerType,
   useEnable2fa,
   useHasPregenWallet,
+  useIssueJwt,
   useKeepSessionAlive,
   useLoginExternalWallet,
   useLogout,

package/dist/provider/hooks/utils/useClient.d.ts

@@ -2,4 +2,4 @@ import ParaWeb from '@getpara/web-sdk';
 /**
  * Hook for retrieving the Para client
  */
-export declare const useClient: () => ParaWeb | undefined;
+export declare const useClient: <Para extends ParaWeb = ParaWeb>() => Para | undefined;

package/dist/provider/hooks/utils/useFormattedBiometricHints.d.ts

@@ -0,0 +1,4 @@
+/**
+ * Hook for getting formatted biometric hints
+ */
+export declare const useFormattedBiometricHints: () => import("@tanstack/react-query").UseQueryResult<import("@getpara/react-common").BiometricHints | null, Error>;

package/dist/provider/hooks/utils/useFormattedBiometricHints.js

@@ -0,0 +1,27 @@
+"use client";
+import {
+  __async
+} from "../../../chunk-MMUBH76A.js";
+import { useQuery } from "@tanstack/react-query";
+import { useModalStore } from "../../../modal/stores/index.js";
+import { formatBiometricHints } from "@getpara/react-common";
+import { useClient } from "./useClient.js";
+const queryKey = ["FORMATTED_BIOMETRIC_HINTS"];
+const useFormattedBiometricHints = () => {
+  var _a;
+  const client = useClient();
+  const loginState = useModalStore((state) => state.getLoginState());
+  return useQuery({
+    queryKey: [...queryKey, (_a = loginState == null ? void 0 : loginState.biometricHints) != null ? _a : "undefined"],
+    queryFn: () => __async(void 0, null, function* () {
+      if (!client || !(loginState == null ? void 0 : loginState.biometricHints)) {
+        return null;
+      }
+      const isPasskeySupported = yield client.isPasskeySupported();
+      return formatBiometricHints(loginState.biometricHints, isPasskeySupported);
+    })
+  });
+};
+export {
+  useFormattedBiometricHints
+};

package/dist/provider/hooks/utils/useInternalClient.js

@@ -1,8 +1,8 @@
 "use client";
 import "../../../chunk-MMUBH76A.js";
-import { useStore } from "../../stores/useStore.js";
+import { useClient } from "./useClient.js";
 const useInternalClient = () => {
-  const client = useStore((state) => state.client);
+  const client = useClient();
   return client;
 };
 export {

package/dist/provider/providers/AuthProvider.js

@@ -5,7 +5,7 @@ import {
   __spreadValues
 } from "../../chunk-MMUBH76A.js";
 import { jsx } from "react/jsx-runtime";
-import { formatBiometricHints } from "@getpara/react-common";
+import { useUserAgent } from "@getpara/react-common";
 import { createContext, useCallback, useContext, useEffect, useMemo } from "react";
 import { useModalStore } from "../../modal/stores/index.js";
 import { ModalStep } from "../../modal/utils/steps.js";
@@ -33,6 +33,7 @@ import { useGoBack } from "../../modal/hooks/useGoBack.js";
 import { isExternalWallet } from "@getpara/user-management-client";
 import { routeMobileExternalWallet } from "../../modal/utils/routeMobileExternalWallet.js";
 import { useStore } from "../stores/useStore.js";
+import { useFormattedBiometricHints } from "../hooks/utils/useFormattedBiometricHints.js";
 const AuthContext = createContext({
   signUpOrLogIn: () => {
   },
@@ -67,6 +68,7 @@ function AuthProvider({
   overrides = {}
 }) {
   const para = useInternalClient();
+  const userAgent = useUserAgent();
   const onLoginRef = useStore((state) => state.onLoginRef);
   const setIsOpen = useStore((state) => state.setIsOpen);
   const bareModal = useStore((state) => {
@@ -89,10 +91,6 @@ function AuthProvider({
   const authStepRoute = useModalStore((state) => state.authStepRoute);
   const isIFrameReady = useModalStore((state) => state.isIFrameReady);
   const goBack = useGoBack();
-  const biometricHints = useMemo(() => {
-    var _a;
-    return formatBiometricHints((_a = loginState == null ? void 0 : loginState.biometricHints) != null ? _a : []);
-  }, [loginState == null ? void 0 : loginState.biometricHints]);
   const { mutate: mutateSignUpOrLogIn, isPending: isSignUpOrLogInPending } = useSignUpOrLogIn();
   const {
     mutate: mutateVerifyNewAccount,
@@ -108,6 +106,7 @@ function AuthProvider({
   const { mutate: mutateSetup2fa, isPending: isSetup2faPending } = useSetup2fa();
   const { mutate: mutateCreateGuestWallets, isPending: isCreateGuestWalletsPending } = useCreateGuestWallets();
   const { mutate: mutateLogout } = useLogout();
+  const { data: biometricHints } = useFormattedBiometricHints();
   const goBackIfPopupClosedOnSteps = (steps) => {
     var _a;
     if (((_a = refs.popupWindow.current) == null ? void 0 : _a.closed) && (!refs.currentStep.current || steps.includes(refs.currentStep.current))) {
@@ -267,7 +266,7 @@ function AuthProvider({
         break;
       case "signup":
         {
-          const isPassword = !!authState.passwordUrl, isPasswordOnly = isPassword && !authState.passkeyUrl;
+          const isPassword = !!authState.passwordUrl, isPasswordOnly = isPassword && (!authState.passkeyUrl || (userAgent == null ? void 0 : userAgent.device.type) === "mobile" && !authState.isPasskeySupported);
           if (isPassword) {
             setIFrameUrl(authState.passwordUrl);
           }
@@ -291,7 +290,7 @@ function AuthProvider({
   });
   const verifyNewAccount = (verificationCode) => __async(this, null, function* () {
     mutateVerifyNewAccount(
-      { verificationCode },
+      { verificationCode, useShortUrls: true },
       {
         onSuccess: onNewAuthState
       }
@@ -455,7 +454,7 @@ function AuthProvider({
       createGuestWallets,
       isCreateGuestWalletsPending,
       logout,
-      biometricHints
+      biometricHints: biometricHints || void 0
     }),
     [
       presentSignupUi,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@getpara/react-sdk",
-  "version": "2.0.0-alpha.13",
+  "version": "2.0.0-alpha.15",
   "type": "module",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -15,9 +15,9 @@
     "*.css"
   ],
   "dependencies": {
-    "@getpara/react-common": "2.0.0-alpha.13",
-    "@getpara/react-components": "2.0.0-alpha.13",
-    "@getpara/web-sdk": "2.0.0-alpha.13",
+    "@getpara/react-common": "2.0.0-alpha.15",
+    "@getpara/react-components": "2.0.0-alpha.15",
+    "@getpara/web-sdk": "2.0.0-alpha.15",
     "date-fns": "^3.6.0",
     "framer-motion": "11.3.28",
     "libphonenumber-js": "^1.11.1",
@@ -33,9 +33,9 @@
     "cli": "node ./dist/cli/cli.mjs"
   },
   "devDependencies": {
-    "@getpara/cosmos-wallet-connectors": "2.0.0-alpha.13",
-    "@getpara/evm-wallet-connectors": "2.0.0-alpha.13",
-    "@getpara/solana-wallet-connectors": "2.0.0-alpha.13",
+    "@getpara/cosmos-wallet-connectors": "2.0.0-alpha.15",
+    "@getpara/evm-wallet-connectors": "2.0.0-alpha.15",
+    "@getpara/solana-wallet-connectors": "2.0.0-alpha.15",
     "@testing-library/dom": "^10.4.0",
     "@testing-library/react": "^16.3.0",
     "@testing-library/react-hooks": "^8.0.1",
@@ -63,5 +63,5 @@
   "resolutions": {
     "styled-components": "^6"
   },
-  "gitHead": "fbd9384b1b3fb8577f9d6c323d4e41d0de1ac83b"
+  "gitHead": "f837a1584f2a0b5d61c9b7a91cd74a68c01d5161"
 }