@b3dotfun/sdk 0.0.34-alpha.1 → 0.0.34-alpha.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (33) hide show
  1. package/dist/cjs/global-account/react/components/B3DynamicModal.js +1 -1
  2. package/dist/cjs/global-account/react/components/SignInWithB3/SignInWithB3.js +3 -3
  3. package/dist/cjs/global-account/react/components/SignInWithB3/SignInWithB3Flow.js +13 -1
  4. package/dist/cjs/global-account/react/components/SignInWithB3/SignInWithB3Privy.js +3 -1
  5. package/dist/cjs/global-account/react/components/SignInWithB3/steps/LoginStep.js +4 -1
  6. package/dist/cjs/global-account/react/components/SignInWithB3/steps/LoginStepCustom.js +3 -0
  7. package/dist/cjs/global-account/react/hooks/useAuthentication.d.ts +1 -0
  8. package/dist/cjs/global-account/react/hooks/useAuthentication.js +20 -0
  9. package/dist/cjs/global-account/react/stores/useAuthStore.d.ts +4 -0
  10. package/dist/cjs/global-account/react/stores/useAuthStore.js +4 -0
  11. package/dist/esm/global-account/react/components/B3DynamicModal.js +1 -1
  12. package/dist/esm/global-account/react/components/SignInWithB3/SignInWithB3.js +3 -3
  13. package/dist/esm/global-account/react/components/SignInWithB3/SignInWithB3Flow.js +13 -1
  14. package/dist/esm/global-account/react/components/SignInWithB3/SignInWithB3Privy.js +3 -1
  15. package/dist/esm/global-account/react/components/SignInWithB3/steps/LoginStep.js +4 -1
  16. package/dist/esm/global-account/react/components/SignInWithB3/steps/LoginStepCustom.js +3 -0
  17. package/dist/esm/global-account/react/hooks/useAuthentication.d.ts +1 -0
  18. package/dist/esm/global-account/react/hooks/useAuthentication.js +21 -1
  19. package/dist/esm/global-account/react/stores/useAuthStore.d.ts +4 -0
  20. package/dist/esm/global-account/react/stores/useAuthStore.js +4 -0
  21. package/dist/styles/index.css +1 -1
  22. package/dist/types/global-account/react/hooks/useAuthentication.d.ts +1 -0
  23. package/dist/types/global-account/react/stores/useAuthStore.d.ts +4 -0
  24. package/package.json +1 -1
  25. package/src/global-account/react/components/B3DynamicModal.tsx +1 -6
  26. package/src/global-account/react/components/SignInWithB3/SignInWithB3.tsx +3 -3
  27. package/src/global-account/react/components/SignInWithB3/SignInWithB3Flow.tsx +13 -1
  28. package/src/global-account/react/components/SignInWithB3/SignInWithB3Privy.tsx +3 -1
  29. package/src/global-account/react/components/SignInWithB3/steps/LoginStep.tsx +5 -2
  30. package/src/global-account/react/components/SignInWithB3/steps/LoginStepCustom.tsx +3 -0
  31. package/src/global-account/react/hooks/useAuthentication.ts +24 -1
  32. package/src/global-account/react/stores/useAuthStore.ts +8 -0
  33. package/src/styles/index.css +5 -2
package/dist/cjs/global-account/react/components/B3DynamicModal.js CHANGED
@@ -92,5 +92,5 @@ function B3DynamicModal() {
92
92
  const ModalContent = isMobile ? drawer_1.DrawerContent : dialog_1.DialogContent;
93
93
  const ModalTitle = isMobile ? drawer_1.DrawerTitle : dialog_1.DialogTitle;
94
94
  const ModalDescription = isMobile ? drawer_1.DrawerDescription : dialog_1.DialogDescription;
95
- return ((0, jsx_runtime_1.jsx)(ModalComponent, { open: isOpen, onOpenChange: setB3ModalOpen, children: (0, jsx_runtime_1.jsxs)(ModalContent, { className: (0, cn_1.cn)(contentClass, "rounded-2xl bg-white shadow-xl dark:bg-gray-900", "border border-gray-200 dark:border-gray-800", "mx-auto w-full max-w-md", "sm:max-w-lg sm:rounded-b-none"), hideCloseButton: hideCloseButton, children: [(0, jsx_runtime_1.jsx)(ModalTitle, { className: "sr-only hidden", children: contentType?.type || "Modal" }), (0, jsx_runtime_1.jsx)(ModalDescription, { className: "sr-only hidden", children: contentType?.type || "Modal Body" }), (0, jsx_runtime_1.jsxs)("div", { className: (0, cn_1.cn)("no-scrollbar max-h-[90dvh] overflow-auto sm:max-h-[80dvh]", contentType?.type === "manageAccount" && "h-[90dvh]"), children: [history.length > 0 && contentType?.showBackButton && ((0, jsx_runtime_1.jsxs)("button", { onClick: navigateBack, className: "flex items-center gap-2 px-6 py-4 text-gray-600 transition-colors hover:text-gray-900 dark:text-gray-400 dark:hover:text-white", children: [(0, jsx_runtime_1.jsxs)("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [(0, jsx_runtime_1.jsx)("path", { d: "M15.8337 10H4.16699", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }), (0, jsx_runtime_1.jsx)("path", { d: "M10.0003 15.8334L4.16699 10L10.0003 4.16669", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" })] }), (0, jsx_runtime_1.jsx)("span", { className: "text-sm font-medium", children: "Back" })] })), renderContent()] })] }) }));
95
+ return ((0, jsx_runtime_1.jsx)(ModalComponent, { open: isOpen, onOpenChange: setB3ModalOpen, children: (0, jsx_runtime_1.jsxs)(ModalContent, { className: (0, cn_1.cn)(contentClass, "rounded-2xl bg-white shadow-xl dark:bg-gray-900", "border border-gray-200 dark:border-gray-800", "mx-auto w-full max-w-md", "sm:max-w-lg sm:rounded-b-none"), hideCloseButton: hideCloseButton, children: [(0, jsx_runtime_1.jsx)(ModalTitle, { className: "sr-only hidden", children: contentType?.type || "Modal" }), (0, jsx_runtime_1.jsx)(ModalDescription, { className: "sr-only hidden", children: contentType?.type || "Modal Body" }), (0, jsx_runtime_1.jsxs)("div", { className: (0, cn_1.cn)("no-scrollbar max-h-[90dvh] overflow-auto sm:max-h-[80dvh]"), children: [history.length > 0 && contentType?.showBackButton && ((0, jsx_runtime_1.jsxs)("button", { onClick: navigateBack, className: "flex items-center gap-2 px-6 py-4 text-gray-600 transition-colors hover:text-gray-900 dark:text-gray-400 dark:hover:text-white", children: [(0, jsx_runtime_1.jsxs)("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [(0, jsx_runtime_1.jsx)("path", { d: "M15.8337 10H4.16699", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }), (0, jsx_runtime_1.jsx)("path", { d: "M10.0003 15.8334L4.16699 10L10.0003 4.16669", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" })] }), (0, jsx_runtime_1.jsx)("span", { className: "text-sm font-medium", children: "Back" })] })), renderContent()] })] }) }));
96
96
  }
package/dist/cjs/global-account/react/components/SignInWithB3/SignInWithB3.js CHANGED
@@ -9,7 +9,7 @@ const Loading_1 = require("../ui/Loading");
9
9
  function SignInWithB3(props) {
10
10
  const { setB3ModalOpen, setB3ModalContentType, setEcoSystemAccountAddress } = (0, react_1.useModalStore)();
11
11
  const { account } = (0, react_1.useB3)();
12
- const { isAuthenticating, isConnected } = (0, react_1.useAuthentication)(props.partnerId, props.loginWithSiwe);
12
+ const { isAuthenticatingV2, isAuthenticated } = (0, react_1.useAuthentication)(props.partnerId, props.loginWithSiwe);
13
13
  const isMobile = (0, react_1.useIsMobile)();
14
14
  (0, react_2.useEffect)(() => {
15
15
  if (account) {
@@ -24,10 +24,10 @@ function SignInWithB3(props) {
24
24
  });
25
25
  setB3ModalOpen(true);
26
26
  };
27
- if (isConnected) {
27
+ if (isAuthenticated) {
28
28
  return (0, jsx_runtime_1.jsx)(ManageAccountButton_1.ManageAccountButton, { ...props });
29
29
  }
30
- if (isAuthenticating) {
30
+ if (isAuthenticatingV2) {
31
31
  return ((0, jsx_runtime_1.jsx)(react_1.StyleRoot, { children: (0, jsx_runtime_1.jsxs)(react_1.Button, { disabled: true, style: { backgroundColor: "#3368ef" }, className: "flex items-center gap-2 text-white", children: [props.withLogo !== false && ((0, jsx_runtime_1.jsx)("img", { src: "https://cdn.b3.fun/b3_logo_white.svg", alt: "B3 Logo", className: "h-5 w-5" })), props.loadingButtonText || (isMobile ? (0, jsx_runtime_1.jsx)(Loading_1.Loading, { size: "sm" }) : "Signing in…")] }) }));
32
32
  }
33
33
  return ((0, jsx_runtime_1.jsx)(react_1.StyleRoot, { children: (0, jsx_runtime_1.jsx)(react_1.Button, { onClick: handleClick, style: { backgroundColor: "#3368ef" }, className: "b3-sign-in-button flex items-center gap-2 font-medium text-white", children: props.buttonText ? (props.buttonText) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("span", { children: "Sign in with" }), props.withLogo !== false && ((0, jsx_runtime_1.jsx)("img", { src: "https://cdn.b3.fun/b3_logo_white.svg", alt: "B3 Logo", className: "h-5 w-6" }))] })) }) }));
package/dist/cjs/global-account/react/components/SignInWithB3/SignInWithB3Flow.js CHANGED
@@ -22,6 +22,7 @@ function SignInWithB3Flow({ strategies, onLoginSuccess, onSessionKeySuccess, onE
22
22
  const { setB3ModalContentType, setB3ModalOpen, isOpen } = (0, react_1.useModalStore)();
23
23
  const account = (0, react_3.useActiveAccount)();
24
24
  const setIsAuthenticating = (0, react_1.useAuthStore)(state => state.setIsAuthenticating);
25
+ const setIsAuthenticatingV2 = (0, react_1.useAuthStore)(state => state.setIsAuthenticatingV2);
25
26
  const isAuthenticating = (0, react_1.useAuthStore)(state => state.isAuthenticating);
26
27
  const isConnected = (0, react_1.useAuthStore)(state => state.isConnected);
27
28
  const setIsConnected = (0, react_1.useAuthStore)(state => state.setIsConnected);
@@ -166,6 +167,7 @@ function SignInWithB3Flow({ strategies, onLoginSuccess, onSessionKeySuccess, onE
166
167
  if (loginWithSiwe) {
167
168
  debug("setIsAuthenticating:true:1");
168
169
  setIsAuthenticating(true);
170
+ setIsAuthenticatingV2(true);
169
171
  const userAuth = await authenticate(account, partnerId);
170
172
  setUser(userAuth.user);
171
173
  }
@@ -173,7 +175,17 @@ function SignInWithB3Flow({ strategies, onLoginSuccess, onSessionKeySuccess, onE
173
175
  onLoginSuccess?.(account);
174
176
  debug("setIsAuthenticating:false:1");
175
177
  setIsAuthenticating(false);
176
- }, [loginWithSiwe, onLoginSuccess, setIsAuthenticating, authenticate, partnerId, setUser, setIsConnected]);
178
+ setIsAuthenticatingV2(false);
179
+ }, [
180
+ loginWithSiwe,
181
+ onLoginSuccess,
182
+ setIsAuthenticating,
183
+ authenticate,
184
+ partnerId,
185
+ setUser,
186
+ setIsConnected,
187
+ setIsAuthenticatingV2,
188
+ ]);
177
189
  (0, react_2.useEffect)(() => {
178
190
  if (step === "permissions") {
179
191
  setB3ModalContentType({
package/dist/cjs/global-account/react/components/SignInWithB3/SignInWithB3Privy.js CHANGED
@@ -9,6 +9,7 @@ const debug = (0, debug_1.debugB3React)("SignInWithB3Privy");
9
9
  function SignInWithB3Privy({ onSuccess, onError, partnerId, chain }) {
10
10
  const { isLoading, connectTw, fullToken } = (0, react_1.useHandleConnectWithPrivy)(partnerId, chain, onSuccess);
11
11
  const setIsAuthenticating = (0, react_1.useAuthStore)(state => state.setIsAuthenticating);
12
+ const setIsAuthenticatingV2 = (0, react_1.useAuthStore)(state => state.setIsAuthenticatingV2);
12
13
  const setIsAuthenticated = (0, react_1.useAuthStore)(state => state.setIsAuthenticated);
13
14
  const { logout } = (0, react_1.useAuthentication)(partnerId);
14
15
  debug("@@SignInWithB3Privy", {
@@ -36,10 +37,11 @@ function SignInWithB3Privy({ onSuccess, onError, partnerId, chain }) {
36
37
  finally {
37
38
  debug("setIsAuthenticating:false:7");
38
39
  setIsAuthenticating(false);
40
+ setIsAuthenticatingV2(false);
39
41
  }
40
42
  }
41
43
  autoConnect();
42
- }, [connectTw, onSuccess, onError, setIsAuthenticating, setIsAuthenticated, logout]);
44
+ }, [connectTw, onSuccess, onError, setIsAuthenticating, setIsAuthenticated, logout, setIsAuthenticatingV2]);
43
45
  // Currently we auto login, so we can show loading immediately and the onSuccess will proceed to the next modal
44
46
  return ((0, jsx_runtime_1.jsx)("div", { className: "flex aspect-square items-center justify-center p-6", children: (0, jsx_runtime_1.jsx)(react_1.Loading, { variant: "white", size: "lg" }) }));
45
47
  }
package/dist/cjs/global-account/react/components/SignInWithB3/steps/LoginStep.js CHANGED
@@ -17,7 +17,7 @@ function LoginStepContainer({ children, partnerId }) {
17
17
  },
18
18
  }, !!partnerId);
19
19
  const partnerLogo = partner?.data?.[0]?.loginCustomization?.logoUrl;
20
- return ((0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col items-center justify-center", children: [partnerLogo && ((0, jsx_runtime_1.jsx)("img", { src: partnerLogo, alt: "Partner Logo", className: "partner-logo mb-6 mt-6 h-12 w-auto object-contain" })), children, (0, jsx_runtime_1.jsxs)("h2", { className: "mt-6 flex items-center gap-2 text-lg font-bold", children: ["Powered by", (0, jsx_runtime_1.jsx)("img", { alt: "B3 Logo", className: "h-5", src: "https://cdn.b3.fun/b3_logo.svg" }), "Connect"] })] }));
20
+ return ((0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col items-center justify-center pt-6", children: [partnerLogo && ((0, jsx_runtime_1.jsx)("img", { src: partnerLogo, alt: "Partner Logo", className: "partner-logo mb-6 h-12 w-auto object-contain" })), children, (0, jsx_runtime_1.jsxs)("h2", { className: "mt-6 flex items-center gap-2 text-lg font-bold", children: ["Powered by", (0, jsx_runtime_1.jsx)("img", { alt: "B3 Logo", className: "h-5", src: "https://cdn.b3.fun/b3_logo.svg" }), "Connect"] })] }));
21
21
  }
22
22
  function LoginStep({ onSuccess, onError, partnerId, chain }) {
23
23
  const wallet = (0, wallets_1.ecosystemWallet)(constants_1.ecosystemWalletId, {
@@ -25,6 +25,7 @@ function LoginStep({ onSuccess, onError, partnerId, chain }) {
25
25
  });
26
26
  const { theme } = (0, react_1.useB3)();
27
27
  const setIsAuthenticating = (0, react_1.useAuthStore)(state => state.setIsAuthenticating);
28
+ const setIsAuthenticatingV2 = (0, react_1.useAuthStore)(state => state.setIsAuthenticatingV2);
28
29
  const setIsAuthenticated = (0, react_1.useAuthStore)(state => state.setIsAuthenticated);
29
30
  const { logout } = (0, react_1.useAuthentication)(partnerId);
30
31
  return ((0, jsx_runtime_1.jsx)(LoginStepContainer, { partnerId: partnerId, children: (0, jsx_runtime_1.jsx)(react_2.ConnectEmbed, { showThirdwebBranding: false, client: thirdweb_1.client, chain: chain, wallets: [wallet], theme: theme === "light"
@@ -65,6 +66,7 @@ function LoginStep({ onSuccess, onError, partnerId, chain }) {
65
66
  }, className: "b3-login-step", onConnect: async (wallet) => {
66
67
  try {
67
68
  setIsAuthenticating(true);
69
+ setIsAuthenticatingV2(true);
68
70
  (0, debug_1.debug)("setIsAuthenticating:true:6");
69
71
  const account = wallet.getAccount();
70
72
  if (!account)
@@ -81,6 +83,7 @@ function LoginStep({ onSuccess, onError, partnerId, chain }) {
81
83
  finally {
82
84
  (0, debug_1.debug)("setIsAuthenticating:false:6");
83
85
  setIsAuthenticating(false);
86
+ setIsAuthenticatingV2(false);
84
87
  }
85
88
  } }) }));
86
89
  }
package/dist/cjs/global-account/react/components/SignInWithB3/steps/LoginStepCustom.js CHANGED
@@ -13,6 +13,7 @@ function LoginStepCustom({ onSuccess, onError, partnerId, chain, strategies, max
13
13
  const [showAllWallets, setShowAllWallets] = (0, react_2.useState)(false);
14
14
  const { connect } = (0, react_1.useConnect)(partnerId, chain);
15
15
  const setIsAuthenticating = (0, react_1.useAuthStore)(state => state.setIsAuthenticating);
16
+ const setIsAuthenticatingV2 = (0, react_1.useAuthStore)(state => state.setIsAuthenticatingV2);
16
17
  const setIsAuthenticated = (0, react_1.useAuthStore)(state => state.setIsAuthenticated);
17
18
  const { logout } = (0, react_1.useAuthentication)(partnerId);
18
19
  const { connect: connectTW } = (0, react_3.useConnect)();
@@ -26,6 +27,7 @@ function LoginStepCustom({ onSuccess, onError, partnerId, chain, strategies, max
26
27
  setIsLoading(true);
27
28
  (0, debug_1.debug)("setIsAuthenticating:true:3");
28
29
  setIsAuthenticating(true);
30
+ setIsAuthenticatingV2(true);
29
31
  const options = (0, react_1.getConnectOptionsFromStrategy)(strategy);
30
32
  let connectResult;
31
33
  if (automaticallySetFirstEoa) {
@@ -60,6 +62,7 @@ function LoginStepCustom({ onSuccess, onError, partnerId, chain, strategies, max
60
62
  setIsLoading(false);
61
63
  (0, debug_1.debug)("setIsAuthenticating:false:3");
62
64
  setIsAuthenticating(false);
65
+ setIsAuthenticatingV2(false);
63
66
  }
64
67
  };
65
68
  return ((0, jsx_runtime_1.jsxs)(react_1.LoginStepContainer, { partnerId: partnerId, children: [authStrategies.length > 0 && ((0, jsx_runtime_1.jsx)("div", { className: "mb-6 grid w-full grid-cols-4 gap-4", children: authStrategies.map(strategy => {
package/dist/cjs/global-account/react/hooks/useAuthentication.d.ts CHANGED
@@ -9,4 +9,5 @@ export declare function useAuthentication(partnerId: string, loginWithSiwe?: boo
9
9
  wallet: import("thirdweb/dist/types/wallets/in-app/core/wallet/types").EcosystemWallet;
10
10
  preAuthenticate: typeof preAuthenticate;
11
11
  connect: (strategyOptions?: import("thirdweb/wallets").SingleStepAuthArgsType) => Promise<import("thirdweb/wallets").Wallet | null>;
12
+ isAuthenticatingV2: boolean;
12
13
  };
package/dist/cjs/global-account/react/hooks/useAuthentication.js CHANGED
@@ -31,6 +31,11 @@ function useAuthentication(partnerId, loginWithSiwe) {
31
31
  const setIsConnected = (0, react_1.useAuthStore)(state => state.setIsConnected);
32
32
  const isConnecting = (0, react_1.useAuthStore)(state => state.isConnecting);
33
33
  const isConnected = (0, react_1.useAuthStore)(state => state.isConnected);
34
+ const useAutoConnectLoadingPrevious = (0, react_2.useRef)(false);
35
+ const setIsAuthenticatingV2 = (0, react_1.useAuthStore)(state => state.setIsAuthenticatingV2);
36
+ const isAuthenticatingV2 = (0, react_1.useAuthStore)(state => state.isAuthenticatingV2);
37
+ const hasStartedConnecting = (0, react_1.useAuthStore)(state => state.hasStartedConnecting);
38
+ const setHasStartedConnecting = (0, react_1.useAuthStore)(state => state.setHasStartedConnecting);
34
39
  const { connect } = (0, useConnect_1.useConnect)(partnerId, supported_1.b3MainnetThirdWeb);
35
40
  const wallet = (0, wallets_1.ecosystemWallet)(constants_1.ecosystemWalletId, {
36
41
  partnerId: partnerId,
@@ -39,11 +44,13 @@ function useAuthentication(partnerId, loginWithSiwe) {
39
44
  client: thirdweb_1.client,
40
45
  wallets: [wallet],
41
46
  onConnect: async (wallet) => {
47
+ setHasStartedConnecting(true);
42
48
  try {
43
49
  setIsConnected(true);
44
50
  if (!loginWithSiwe) {
45
51
  debug("Skipping SIWE login", { loginWithSiwe });
46
52
  setIsAuthenticated(true);
53
+ setIsAuthenticatingV2(false);
47
54
  return;
48
55
  }
49
56
  debug("setIsAuthenticating:true:4");
@@ -57,6 +64,7 @@ function useAuthentication(partnerId, loginWithSiwe) {
57
64
  const userAuth = await app_1.default.reAuthenticate();
58
65
  setUser(userAuth.user);
59
66
  setIsAuthenticated(true);
67
+ setIsAuthenticatingV2(false);
60
68
  debug("Re-authenticated successfully", { userAuth });
61
69
  }
62
70
  catch (error) {
@@ -65,6 +73,7 @@ function useAuthentication(partnerId, loginWithSiwe) {
65
73
  const userAuth = await authenticate(account, partnerId);
66
74
  setUser(userAuth.user);
67
75
  setIsAuthenticated(true);
76
+ setIsAuthenticatingV2(false);
68
77
  debug("Fresh authentication successful", { userAuth });
69
78
  }
70
79
  }
@@ -74,8 +83,18 @@ function useAuthentication(partnerId, loginWithSiwe) {
74
83
  debug("setIsAuthenticating:false:4");
75
84
  setUser();
76
85
  }
86
+ setIsAuthenticatingV2(false);
77
87
  },
78
88
  });
89
+ /**
90
+ * useAutoConnectLoading starts as false
91
+ */
92
+ (0, react_2.useEffect)(() => {
93
+ if (!useAutoConnectLoading && useAutoConnectLoadingPrevious.current && !hasStartedConnecting) {
94
+ setIsAuthenticatingV2(false);
95
+ }
96
+ useAutoConnectLoadingPrevious.current = useAutoConnectLoading;
97
+ }, [useAutoConnectLoading]);
79
98
  // Ensure isAuthenticating stays true until we're fully ready
80
99
  (0, react_2.useEffect)(() => {
81
100
  if (useAutoConnectLoading) {
@@ -134,5 +153,6 @@ function useAuthentication(partnerId, loginWithSiwe) {
134
153
  wallet,
135
154
  preAuthenticate: in_app_1.preAuthenticate,
136
155
  connect,
156
+ isAuthenticatingV2,
137
157
  };
138
158
  }
package/dist/cjs/global-account/react/stores/useAuthStore.d.ts CHANGED
@@ -25,6 +25,10 @@ interface AuthState {
25
25
  onError?: (error: Error) => void;
26
26
  }) => void;
27
27
  reset: () => void;
28
+ isAuthenticatingV2: boolean;
29
+ setIsAuthenticatingV2: (isAuthenticating: boolean) => void;
30
+ hasStartedConnecting: boolean;
31
+ setHasStartedConnecting: (hasStartedConnecting: boolean) => void;
28
32
  }
29
33
  export declare const useAuthStore: import("zustand").UseBoundStore<import("zustand").StoreApi<AuthState>>;
30
34
  export {};
package/dist/cjs/global-account/react/stores/useAuthStore.js CHANGED
@@ -40,4 +40,8 @@ exports.useAuthStore = (0, zustand_1.create)(set => ({
40
40
  onSuccess: undefined,
41
41
  onError: undefined,
42
42
  }),
43
+ isAuthenticatingV2: true,
44
+ setIsAuthenticatingV2: isAuthenticating => set({ isAuthenticatingV2: isAuthenticating }),
45
+ hasStartedConnecting: false,
46
+ setHasStartedConnecting: hasStartedConnecting => set({ hasStartedConnecting }),
43
47
  }));
package/dist/esm/global-account/react/components/B3DynamicModal.js CHANGED
@@ -89,5 +89,5 @@ export function B3DynamicModal() {
89
89
  const ModalContent = isMobile ? DrawerContent : DialogContent;
90
90
  const ModalTitle = isMobile ? DrawerTitle : DialogTitle;
91
91
  const ModalDescription = isMobile ? DrawerDescription : DialogDescription;
92
- return (_jsx(ModalComponent, { open: isOpen, onOpenChange: setB3ModalOpen, children: _jsxs(ModalContent, { className: cn(contentClass, "rounded-2xl bg-white shadow-xl dark:bg-gray-900", "border border-gray-200 dark:border-gray-800", "mx-auto w-full max-w-md", "sm:max-w-lg sm:rounded-b-none"), hideCloseButton: hideCloseButton, children: [_jsx(ModalTitle, { className: "sr-only hidden", children: contentType?.type || "Modal" }), _jsx(ModalDescription, { className: "sr-only hidden", children: contentType?.type || "Modal Body" }), _jsxs("div", { className: cn("no-scrollbar max-h-[90dvh] overflow-auto sm:max-h-[80dvh]", contentType?.type === "manageAccount" && "h-[90dvh]"), children: [history.length > 0 && contentType?.showBackButton && (_jsxs("button", { onClick: navigateBack, className: "flex items-center gap-2 px-6 py-4 text-gray-600 transition-colors hover:text-gray-900 dark:text-gray-400 dark:hover:text-white", children: [_jsxs("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [_jsx("path", { d: "M15.8337 10H4.16699", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }), _jsx("path", { d: "M10.0003 15.8334L4.16699 10L10.0003 4.16669", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" })] }), _jsx("span", { className: "text-sm font-medium", children: "Back" })] })), renderContent()] })] }) }));
92
+ return (_jsx(ModalComponent, { open: isOpen, onOpenChange: setB3ModalOpen, children: _jsxs(ModalContent, { className: cn(contentClass, "rounded-2xl bg-white shadow-xl dark:bg-gray-900", "border border-gray-200 dark:border-gray-800", "mx-auto w-full max-w-md", "sm:max-w-lg sm:rounded-b-none"), hideCloseButton: hideCloseButton, children: [_jsx(ModalTitle, { className: "sr-only hidden", children: contentType?.type || "Modal" }), _jsx(ModalDescription, { className: "sr-only hidden", children: contentType?.type || "Modal Body" }), _jsxs("div", { className: cn("no-scrollbar max-h-[90dvh] overflow-auto sm:max-h-[80dvh]"), children: [history.length > 0 && contentType?.showBackButton && (_jsxs("button", { onClick: navigateBack, className: "flex items-center gap-2 px-6 py-4 text-gray-600 transition-colors hover:text-gray-900 dark:text-gray-400 dark:hover:text-white", children: [_jsxs("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [_jsx("path", { d: "M15.8337 10H4.16699", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }), _jsx("path", { d: "M10.0003 15.8334L4.16699 10L10.0003 4.16669", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" })] }), _jsx("span", { className: "text-sm font-medium", children: "Back" })] })), renderContent()] })] }) }));
93
93
  }
package/dist/esm/global-account/react/components/SignInWithB3/SignInWithB3.js CHANGED
@@ -6,7 +6,7 @@ import { Loading } from "../ui/Loading.js";
6
6
  export function SignInWithB3(props) {
7
7
  const { setB3ModalOpen, setB3ModalContentType, setEcoSystemAccountAddress } = useModalStore();
8
8
  const { account } = useB3();
9
- const { isAuthenticating, isConnected } = useAuthentication(props.partnerId, props.loginWithSiwe);
9
+ const { isAuthenticatingV2, isAuthenticated } = useAuthentication(props.partnerId, props.loginWithSiwe);
10
10
  const isMobile = useIsMobile();
11
11
  useEffect(() => {
12
12
  if (account) {
@@ -21,10 +21,10 @@ export function SignInWithB3(props) {
21
21
  });
22
22
  setB3ModalOpen(true);
23
23
  };
24
- if (isConnected) {
24
+ if (isAuthenticated) {
25
25
  return _jsx(ManageAccountButton, { ...props });
26
26
  }
27
- if (isAuthenticating) {
27
+ if (isAuthenticatingV2) {
28
28
  return (_jsx(StyleRoot, { children: _jsxs(Button, { disabled: true, style: { backgroundColor: "#3368ef" }, className: "flex items-center gap-2 text-white", children: [props.withLogo !== false && (_jsx("img", { src: "https://cdn.b3.fun/b3_logo_white.svg", alt: "B3 Logo", className: "h-5 w-5" })), props.loadingButtonText || (isMobile ? _jsx(Loading, { size: "sm" }) : "Signing in…")] }) }));
29
29
  }
30
30
  return (_jsx(StyleRoot, { children: _jsx(Button, { onClick: handleClick, style: { backgroundColor: "#3368ef" }, className: "b3-sign-in-button flex items-center gap-2 font-medium text-white", children: props.buttonText ? (props.buttonText) : (_jsxs(_Fragment, { children: [_jsx("span", { children: "Sign in with" }), props.withLogo !== false && (_jsx("img", { src: "https://cdn.b3.fun/b3_logo_white.svg", alt: "B3 Logo", className: "h-5 w-6" }))] })) }) }));
package/dist/esm/global-account/react/components/SignInWithB3/SignInWithB3Flow.js CHANGED
@@ -19,6 +19,7 @@ export function SignInWithB3Flow({ strategies, onLoginSuccess, onSessionKeySucce
19
19
  const { setB3ModalContentType, setB3ModalOpen, isOpen } = useModalStore();
20
20
  const account = useActiveAccount();
21
21
  const setIsAuthenticating = useAuthStore(state => state.setIsAuthenticating);
22
+ const setIsAuthenticatingV2 = useAuthStore(state => state.setIsAuthenticatingV2);
22
23
  const isAuthenticating = useAuthStore(state => state.isAuthenticating);
23
24
  const isConnected = useAuthStore(state => state.isConnected);
24
25
  const setIsConnected = useAuthStore(state => state.setIsConnected);
@@ -163,6 +164,7 @@ export function SignInWithB3Flow({ strategies, onLoginSuccess, onSessionKeySucce
163
164
  if (loginWithSiwe) {
164
165
  debug("setIsAuthenticating:true:1");
165
166
  setIsAuthenticating(true);
167
+ setIsAuthenticatingV2(true);
166
168
  const userAuth = await authenticate(account, partnerId);
167
169
  setUser(userAuth.user);
168
170
  }
@@ -170,7 +172,17 @@ export function SignInWithB3Flow({ strategies, onLoginSuccess, onSessionKeySucce
170
172
  onLoginSuccess?.(account);
171
173
  debug("setIsAuthenticating:false:1");
172
174
  setIsAuthenticating(false);
173
- }, [loginWithSiwe, onLoginSuccess, setIsAuthenticating, authenticate, partnerId, setUser, setIsConnected]);
175
+ setIsAuthenticatingV2(false);
176
+ }, [
177
+ loginWithSiwe,
178
+ onLoginSuccess,
179
+ setIsAuthenticating,
180
+ authenticate,
181
+ partnerId,
182
+ setUser,
183
+ setIsConnected,
184
+ setIsAuthenticatingV2,
185
+ ]);
174
186
  useEffect(() => {
175
187
  if (step === "permissions") {
176
188
  setB3ModalContentType({
package/dist/esm/global-account/react/components/SignInWithB3/SignInWithB3Privy.js CHANGED
@@ -6,6 +6,7 @@ const debug = debugB3React("SignInWithB3Privy");
6
6
  export function SignInWithB3Privy({ onSuccess, onError, partnerId, chain }) {
7
7
  const { isLoading, connectTw, fullToken } = useHandleConnectWithPrivy(partnerId, chain, onSuccess);
8
8
  const setIsAuthenticating = useAuthStore(state => state.setIsAuthenticating);
9
+ const setIsAuthenticatingV2 = useAuthStore(state => state.setIsAuthenticatingV2);
9
10
  const setIsAuthenticated = useAuthStore(state => state.setIsAuthenticated);
10
11
  const { logout } = useAuthentication(partnerId);
11
12
  debug("@@SignInWithB3Privy", {
@@ -33,10 +34,11 @@ export function SignInWithB3Privy({ onSuccess, onError, partnerId, chain }) {
33
34
  finally {
34
35
  debug("setIsAuthenticating:false:7");
35
36
  setIsAuthenticating(false);
37
+ setIsAuthenticatingV2(false);
36
38
  }
37
39
  }
38
40
  autoConnect();
39
- }, [connectTw, onSuccess, onError, setIsAuthenticating, setIsAuthenticated, logout]);
41
+ }, [connectTw, onSuccess, onError, setIsAuthenticating, setIsAuthenticated, logout, setIsAuthenticatingV2]);
40
42
  // Currently we auto login, so we can show loading immediately and the onSuccess will proceed to the next modal
41
43
  return (_jsx("div", { className: "flex aspect-square items-center justify-center p-6", children: _jsx(Loading, { variant: "white", size: "lg" }) }));
42
44
  }
package/dist/esm/global-account/react/components/SignInWithB3/steps/LoginStep.js CHANGED
@@ -13,7 +13,7 @@ export function LoginStepContainer({ children, partnerId }) {
13
13
  },
14
14
  }, !!partnerId);
15
15
  const partnerLogo = partner?.data?.[0]?.loginCustomization?.logoUrl;
16
- return (_jsxs("div", { className: "flex flex-col items-center justify-center", children: [partnerLogo && (_jsx("img", { src: partnerLogo, alt: "Partner Logo", className: "partner-logo mb-6 mt-6 h-12 w-auto object-contain" })), children, _jsxs("h2", { className: "mt-6 flex items-center gap-2 text-lg font-bold", children: ["Powered by", _jsx("img", { alt: "B3 Logo", className: "h-5", src: "https://cdn.b3.fun/b3_logo.svg" }), "Connect"] })] }));
16
+ return (_jsxs("div", { className: "flex flex-col items-center justify-center pt-6", children: [partnerLogo && (_jsx("img", { src: partnerLogo, alt: "Partner Logo", className: "partner-logo mb-6 h-12 w-auto object-contain" })), children, _jsxs("h2", { className: "mt-6 flex items-center gap-2 text-lg font-bold", children: ["Powered by", _jsx("img", { alt: "B3 Logo", className: "h-5", src: "https://cdn.b3.fun/b3_logo.svg" }), "Connect"] })] }));
17
17
  }
18
18
  export function LoginStep({ onSuccess, onError, partnerId, chain }) {
19
19
  const wallet = ecosystemWallet(ecosystemWalletId, {
@@ -21,6 +21,7 @@ export function LoginStep({ onSuccess, onError, partnerId, chain }) {
21
21
  });
22
22
  const { theme } = useB3();
23
23
  const setIsAuthenticating = useAuthStore(state => state.setIsAuthenticating);
24
+ const setIsAuthenticatingV2 = useAuthStore(state => state.setIsAuthenticatingV2);
24
25
  const setIsAuthenticated = useAuthStore(state => state.setIsAuthenticated);
25
26
  const { logout } = useAuthentication(partnerId);
26
27
  return (_jsx(LoginStepContainer, { partnerId: partnerId, children: _jsx(ConnectEmbed, { showThirdwebBranding: false, client: client, chain: chain, wallets: [wallet], theme: theme === "light"
@@ -61,6 +62,7 @@ export function LoginStep({ onSuccess, onError, partnerId, chain }) {
61
62
  }, className: "b3-login-step", onConnect: async (wallet) => {
62
63
  try {
63
64
  setIsAuthenticating(true);
65
+ setIsAuthenticatingV2(true);
64
66
  debug("setIsAuthenticating:true:6");
65
67
  const account = wallet.getAccount();
66
68
  if (!account)
@@ -77,6 +79,7 @@ export function LoginStep({ onSuccess, onError, partnerId, chain }) {
77
79
  finally {
78
80
  debug("setIsAuthenticating:false:6");
79
81
  setIsAuthenticating(false);
82
+ setIsAuthenticatingV2(false);
80
83
  }
81
84
  } }) }));
82
85
  }
package/dist/esm/global-account/react/components/SignInWithB3/steps/LoginStepCustom.js CHANGED
@@ -10,6 +10,7 @@ export function LoginStepCustom({ onSuccess, onError, partnerId, chain, strategi
10
10
  const [showAllWallets, setShowAllWallets] = useState(false);
11
11
  const { connect } = useConnect(partnerId, chain);
12
12
  const setIsAuthenticating = useAuthStore(state => state.setIsAuthenticating);
13
+ const setIsAuthenticatingV2 = useAuthStore(state => state.setIsAuthenticatingV2);
13
14
  const setIsAuthenticated = useAuthStore(state => state.setIsAuthenticated);
14
15
  const { logout } = useAuthentication(partnerId);
15
16
  const { connect: connectTW } = useConnectTW();
@@ -23,6 +24,7 @@ export function LoginStepCustom({ onSuccess, onError, partnerId, chain, strategi
23
24
  setIsLoading(true);
24
25
  debug("setIsAuthenticating:true:3");
25
26
  setIsAuthenticating(true);
27
+ setIsAuthenticatingV2(true);
26
28
  const options = getConnectOptionsFromStrategy(strategy);
27
29
  let connectResult;
28
30
  if (automaticallySetFirstEoa) {
@@ -57,6 +59,7 @@ export function LoginStepCustom({ onSuccess, onError, partnerId, chain, strategi
57
59
  setIsLoading(false);
58
60
  debug("setIsAuthenticating:false:3");
59
61
  setIsAuthenticating(false);
62
+ setIsAuthenticatingV2(false);
60
63
  }
61
64
  };
62
65
  return (_jsxs(LoginStepContainer, { partnerId: partnerId, children: [authStrategies.length > 0 && (_jsx("div", { className: "mb-6 grid w-full grid-cols-4 gap-4", children: authStrategies.map(strategy => {
package/dist/esm/global-account/react/hooks/useAuthentication.d.ts CHANGED
@@ -9,4 +9,5 @@ export declare function useAuthentication(partnerId: string, loginWithSiwe?: boo
9
9
  wallet: import("thirdweb/dist/types/wallets/in-app/core/wallet/types").EcosystemWallet;
10
10
  preAuthenticate: typeof preAuthenticate;
11
11
  connect: (strategyOptions?: import("thirdweb/wallets").SingleStepAuthArgsType) => Promise<import("thirdweb/wallets").Wallet | null>;
12
+ isAuthenticatingV2: boolean;
12
13
  };
package/dist/esm/global-account/react/hooks/useAuthentication.js CHANGED
@@ -4,7 +4,7 @@ import { ecosystemWalletId } from "../../../shared/constants/index.js";
4
4
  import { b3MainnetThirdWeb } from "../../../shared/constants/chains/supported.js";
5
5
  import { debugB3React } from "../../../shared/utils/debug.js";
6
6
  import { client } from "../../../shared/utils/thirdweb.js";
7
- import { useEffect } from "react";
7
+ import { useEffect, useRef } from "react";
8
8
  import { useActiveWallet, useAutoConnect, useConnectedWallets, useDisconnect } from "thirdweb/react";
9
9
  import { ecosystemWallet } from "thirdweb/wallets";
10
10
  import { preAuthenticate } from "thirdweb/wallets/in-app";
@@ -25,6 +25,11 @@ export function useAuthentication(partnerId, loginWithSiwe) {
25
25
  const setIsConnected = useAuthStore(state => state.setIsConnected);
26
26
  const isConnecting = useAuthStore(state => state.isConnecting);
27
27
  const isConnected = useAuthStore(state => state.isConnected);
28
+ const useAutoConnectLoadingPrevious = useRef(false);
29
+ const setIsAuthenticatingV2 = useAuthStore(state => state.setIsAuthenticatingV2);
30
+ const isAuthenticatingV2 = useAuthStore(state => state.isAuthenticatingV2);
31
+ const hasStartedConnecting = useAuthStore(state => state.hasStartedConnecting);
32
+ const setHasStartedConnecting = useAuthStore(state => state.setHasStartedConnecting);
28
33
  const { connect } = useConnect(partnerId, b3MainnetThirdWeb);
29
34
  const wallet = ecosystemWallet(ecosystemWalletId, {
30
35
  partnerId: partnerId,
@@ -33,11 +38,13 @@ export function useAuthentication(partnerId, loginWithSiwe) {
33
38
  client,
34
39
  wallets: [wallet],
35
40
  onConnect: async (wallet) => {
41
+ setHasStartedConnecting(true);
36
42
  try {
37
43
  setIsConnected(true);
38
44
  if (!loginWithSiwe) {
39
45
  debug("Skipping SIWE login", { loginWithSiwe });
40
46
  setIsAuthenticated(true);
47
+ setIsAuthenticatingV2(false);
41
48
  return;
42
49
  }
43
50
  debug("setIsAuthenticating:true:4");
@@ -51,6 +58,7 @@ export function useAuthentication(partnerId, loginWithSiwe) {
51
58
  const userAuth = await app.reAuthenticate();
52
59
  setUser(userAuth.user);
53
60
  setIsAuthenticated(true);
61
+ setIsAuthenticatingV2(false);
54
62
  debug("Re-authenticated successfully", { userAuth });
55
63
  }
56
64
  catch (error) {
@@ -59,6 +67,7 @@ export function useAuthentication(partnerId, loginWithSiwe) {
59
67
  const userAuth = await authenticate(account, partnerId);
60
68
  setUser(userAuth.user);
61
69
  setIsAuthenticated(true);
70
+ setIsAuthenticatingV2(false);
62
71
  debug("Fresh authentication successful", { userAuth });
63
72
  }
64
73
  }
@@ -68,8 +77,18 @@ export function useAuthentication(partnerId, loginWithSiwe) {
68
77
  debug("setIsAuthenticating:false:4");
69
78
  setUser();
70
79
  }
80
+ setIsAuthenticatingV2(false);
71
81
  },
72
82
  });
83
+ /**
84
+ * useAutoConnectLoading starts as false
85
+ */
86
+ useEffect(() => {
87
+ if (!useAutoConnectLoading && useAutoConnectLoadingPrevious.current && !hasStartedConnecting) {
88
+ setIsAuthenticatingV2(false);
89
+ }
90
+ useAutoConnectLoadingPrevious.current = useAutoConnectLoading;
91
+ }, [useAutoConnectLoading]);
73
92
  // Ensure isAuthenticating stays true until we're fully ready
74
93
  useEffect(() => {
75
94
  if (useAutoConnectLoading) {
@@ -128,5 +147,6 @@ export function useAuthentication(partnerId, loginWithSiwe) {
128
147
  wallet,
129
148
  preAuthenticate,
130
149
  connect,
150
+ isAuthenticatingV2,
131
151
  };
132
152
  }
package/dist/esm/global-account/react/stores/useAuthStore.d.ts CHANGED
@@ -25,6 +25,10 @@ interface AuthState {
25
25
  onError?: (error: Error) => void;
26
26
  }) => void;
27
27
  reset: () => void;
28
+ isAuthenticatingV2: boolean;
29
+ setIsAuthenticatingV2: (isAuthenticating: boolean) => void;
30
+ hasStartedConnecting: boolean;
31
+ setHasStartedConnecting: (hasStartedConnecting: boolean) => void;
28
32
  }
29
33
  export declare const useAuthStore: import("zustand").UseBoundStore<import("zustand").StoreApi<AuthState>>;
30
34
  export {};
package/dist/esm/global-account/react/stores/useAuthStore.js CHANGED
@@ -37,4 +37,8 @@ export const useAuthStore = create(set => ({
37
37
  onSuccess: undefined,
38
38
  onError: undefined,
39
39
  }),
40
+ isAuthenticatingV2: true,
41
+ setIsAuthenticatingV2: isAuthenticating => set({ isAuthenticatingV2: isAuthenticating }),
42
+ hasStartedConnecting: false,
43
+ setHasStartedConnecting: hasStartedConnecting => set({ hasStartedConnecting }),
40
44
  }));