@b3dotfun/sdk 0.1.69-alpha.17 → 0.1.69-alpha.18

package/dist/esm/global-account/react/components/SignInWithB3/steps/LoginStepBetterAuth.js

@@ -0,0 +1,120 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { Button, Input, LoginStepContainer, useB3Config } from "../../../../../global-account/react/index.js";
+import { debugB3React } from "../../../../../shared/utils/debug.js";
+import { useState } from "react";
+import { useBetterAuth } from "../../../hooks/useBetterAuth.js";
+import { AuthButton } from "../components/AuthButton.js";
+const debug = debugB3React("LoginStepBetterAuth");
+const EMAIL_REGEX = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
+const SOCIAL_PROVIDERS = [
+    { id: "google", label: "Google" },
+    { id: "github", label: "GitHub" },
+    { id: "discord", label: "Discord" },
+    { id: "microsoft", label: "Microsoft" },
+    { id: "slack", label: "Slack" },
+];
+export function LoginStepBetterAuth({ onSuccess, onError }) {
+    const { partnerId } = useB3Config();
+    const { signInWithEmail, signUpWithEmail, signInWithSocial, requestPasswordReset } = useBetterAuth();
+    const [mode, setMode] = useState("sign-in");
+    const [showEmailForm, setShowEmailForm] = useState(false);
+    const [email, setEmail] = useState("");
+    const [password, setPassword] = useState("");
+    const [name, setName] = useState("");
+    const [isLoading, setIsLoading] = useState(false);
+    const [error, setError] = useState(null);
+    const [resetEmailSent, setResetEmailSent] = useState(false);
+    const handleEmailSubmit = async () => {
+        const normalizedEmail = email.trim().toLowerCase();
+        if (!EMAIL_REGEX.test(normalizedEmail)) {
+            setError("Please enter a valid email address");
+            return;
+        }
+        if (!password) {
+            setError("Please enter a password");
+            return;
+        }
+        if (mode === "sign-up" && !name.trim()) {
+            setError("Please enter your name");
+            return;
+        }
+        try {
+            setIsLoading(true);
+            setError(null);
+            if (mode === "sign-up") {
+                debug("Signing up", { email: normalizedEmail, name: name.trim() });
+                await signUpWithEmail(normalizedEmail, password, name.trim());
+            }
+            else {
+                debug("Signing in", { email: normalizedEmail });
+                await signInWithEmail(normalizedEmail, password);
+            }
+            debug("Auth successful");
+            onSuccess?.();
+        }
+        catch (err) {
+            const message = err instanceof Error ? err.message : "Authentication failed";
+            setError(message);
+            debug("Auth failed", err);
+            await onError?.(err);
+        }
+        finally {
+            setPassword("");
+            setIsLoading(false);
+        }
+    };
+    const handleForgotPassword = async () => {
+        const normalizedEmail = email.trim().toLowerCase();
+        if (!EMAIL_REGEX.test(normalizedEmail)) {
+            setError("Please enter a valid email address");
+            return;
+        }
+        try {
+            setIsLoading(true);
+            setError(null);
+            await requestPasswordReset(normalizedEmail);
+            setResetEmailSent(true);
+        }
+        catch (err) {
+            const message = err instanceof Error ? err.message : "Failed to send reset email";
+            setError(message);
+        }
+        finally {
+            setIsLoading(false);
+        }
+    };
+    const handleSocialSignIn = async (provider) => {
+        try {
+            setIsLoading(true);
+            setError(null);
+            await signInWithSocial(provider);
+        }
+        catch (err) {
+            const message = err instanceof Error ? err.message : `${provider} sign in failed`;
+            setError(message);
+            await onError?.(err);
+            setIsLoading(false);
+        }
+    };
+    return (_jsx(LoginStepContainer, { partnerId: partnerId, children: mode === "forgot-password" ? (_jsxs("div", { className: "mb-6 w-full space-y-3 px-3", children: [_jsx("p", { className: "text-center text-sm font-medium text-gray-900 dark:text-gray-100", children: "Reset password" }), _jsx("p", { className: "text-center text-xs text-gray-500", children: "Enter your email and we'll send you a reset link" }), resetEmailSent ? (_jsx("div", { className: "space-y-3 py-4 text-center", children: _jsx("p", { className: "text-sm text-green-600", children: "Check your email for a reset link." }) })) : (_jsxs(_Fragment, { children: [_jsx(Input, { type: "email", placeholder: "you@example.com", value: email, onChange: event => setEmail(event.target.value), disabled: isLoading, onKeyDown: event => {
+                                if (event.key === "Enter")
+                                    handleForgotPassword();
+                            } }), error && _jsx("p", { className: "text-sm text-red-500", children: error }), _jsx(Button, { onClick: handleForgotPassword, disabled: isLoading, className: "w-full", children: isLoading ? "Sending..." : "Send reset link" })] })), _jsx("button", { onClick: () => {
+                        setMode("sign-in");
+                        setShowEmailForm(true);
+                        setError(null);
+                        setResetEmailSent(false);
+                    }, className: "w-full text-center text-sm text-gray-500 hover:text-gray-700", children: "Back to sign in" })] })) : showEmailForm ? (_jsxs("div", { className: "mb-6 w-full space-y-3 px-3", children: [_jsx("p", { className: "text-center text-sm font-medium text-gray-900 dark:text-gray-100", children: mode === "sign-in" ? "Sign in with email" : "Create an account" }), mode === "sign-up" && (_jsx(Input, { type: "text", placeholder: "Your name", value: name, onChange: event => setName(event.target.value), disabled: isLoading })), _jsx(Input, { type: "email", placeholder: "you@example.com", value: email, onChange: event => setEmail(event.target.value), disabled: isLoading }), _jsx(Input, { type: "password", placeholder: "Password", value: password, onChange: event => setPassword(event.target.value), disabled: isLoading, onKeyDown: event => {
+                        if (event.key === "Enter")
+                            handleEmailSubmit();
+                    } }), error && _jsx("p", { className: "text-sm text-red-500", children: error }), _jsx(Button, { onClick: handleEmailSubmit, disabled: isLoading, className: "w-full", children: isLoading ? "Loading..." : mode === "sign-in" ? "Sign in" : "Sign up" }), mode === "sign-in" && (_jsx("button", { onClick: () => {
+                        setMode("forgot-password");
+                        setError(null);
+                    }, disabled: isLoading, className: "w-full text-center text-xs text-gray-500 hover:text-gray-700", children: "Forgot password?" })), _jsx("button", { onClick: () => {
+                        setMode(mode === "sign-in" ? "sign-up" : "sign-in");
+                        setError(null);
+                    }, disabled: isLoading, className: "w-full text-center text-sm text-gray-500 hover:text-gray-700", children: mode === "sign-in" ? "Don't have an account? Sign up" : "Already have an account? Sign in" }), _jsx(Button, { variant: "outline", onClick: () => {
+                        setShowEmailForm(false);
+                        setError(null);
+                    }, disabled: isLoading, className: "w-full", children: "Back" })] })) : (_jsxs("div", { className: "mb-6 w-full space-y-4 px-3", children: [_jsx("div", { className: "grid w-full grid-cols-3 gap-4", children: SOCIAL_PROVIDERS.map(provider => (_jsx(AuthButton, { strategy: provider.id, onClick: () => handleSocialSignIn(provider.id), isLoading: isLoading }, provider.id))) }), _jsxs("div", { className: "flex items-center gap-3", children: [_jsx("div", { className: "h-px flex-1 bg-gray-200" }), _jsx("span", { className: "text-xs text-gray-400", children: "or" }), _jsx("div", { className: "h-px flex-1 bg-gray-200" })] }), _jsx(AuthButton, { strategy: "email", onClick: () => setShowEmailForm(true), isLoading: isLoading }), error && _jsx("p", { className: "text-center text-sm text-red-500", children: error })] })) }));
+}

package/dist/esm/global-account/react/components/SignInWithB3/utils/signInUtils.js

@@ -43,11 +43,13 @@ export function getConnectOptionsFromStrategy(strategy) {
 }
 export const strategyIcons = {
     google: "https://cdn.b3.fun/google.svg",
+    github: "https://cdn.jsdelivr.net/gh/devicons/devicon/icons/github/github-original.svg",
     x: "https://cdn.b3.fun/x.svg?1",
     discord: "https://cdn.b3.fun/discord.svg",
     apple: "https://cdn.b3.fun/apple.svg",
     guest: "https://cdn.b3.fun/incognito.svg",
-    // Add more strategies as needed
+    microsoft: "https://upload.wikimedia.org/wikipedia/commons/4/44/Microsoft_logo.svg",
+    slack: "https://upload.wikimedia.org/wikipedia/commons/d/d5/Slack_icon_2019.svg",
 };
 export const strategyLabels = {
     google: "Google",
@@ -57,6 +59,8 @@ export const strategyLabels = {
     guest: "Guest",
     github: "GitHub",
     email: "Email",
+    microsoft: "Microsoft",
+    slack: "Slack",
 };
 // Test it
 // console.log(getConnectOptionsFromStrategy("io.metamask"));

package/dist/esm/global-account/react/components/index.d.ts

@@ -1,10 +1,13 @@
 export { B3DynamicModal } from "./B3DynamicModal";
 export { B3Provider } from "./B3Provider/B3Provider";
+export type { AuthStrategy } from "./B3Provider/B3ConfigProvider";
 export { RelayKitProviderWrapper } from "./B3Provider/RelayKitProviderWrapper";
 export { useB3 } from "./B3Provider/useB3";
 export { useB3Account } from "./B3Provider/useB3Account";
 export { useB3Config } from "./B3Provider/useB3Config";
 export { StyleRoot } from "./StyleRoot";
+export { BetterAuthResetPassword, type BetterAuthResetPasswordProps } from "./SignInWithB3/BetterAuthResetPassword";
+export { BetterAuthSignIn, type BetterAuthSignInProps } from "./SignInWithB3/BetterAuthSignIn";
 export { AuthButton } from "./SignInWithB3/components/AuthButton";
 export { PermissionItem } from "./SignInWithB3/components/PermissionItem";
 export { WalletRow } from "./SignInWithB3/components/WalletRow";

package/dist/esm/global-account/react/components/index.js

@@ -8,6 +8,8 @@ export { useB3Account } from "./B3Provider/useB3Account.js";
 export { useB3Config } from "./B3Provider/useB3Config.js";
 export { StyleRoot } from "./StyleRoot.js";
 // SignInWithB3 Components
+export { BetterAuthResetPassword } from "./SignInWithB3/BetterAuthResetPassword.js";
+export { BetterAuthSignIn } from "./SignInWithB3/BetterAuthSignIn.js";
 export { AuthButton } from "./SignInWithB3/components/AuthButton.js";
 export { PermissionItem } from "./SignInWithB3/components/PermissionItem.js";
 export { WalletRow } from "./SignInWithB3/components/WalletRow.js";

package/dist/esm/global-account/react/hooks/index.d.ts

@@ -5,6 +5,7 @@ export { useAddTWSessionKey } from "./useAddTWSessionKey";
 export { useAnalytics } from "./useAnalytics";
 export { useAuth } from "./useAuth";
 export { useAuthentication } from "./useAuthentication";
+export { useBetterAuth } from "./useBetterAuth";
 export { useB3BalanceFromAddresses } from "./useB3BalanceFromAddresses";
 export { useB3EnsName } from "./useB3EnsName";
 export { useChainSwitchWithAction } from "./useChainSwitchWithAction";

package/dist/esm/global-account/react/hooks/index.js

@@ -5,6 +5,7 @@ export { useAddTWSessionKey } from "./useAddTWSessionKey.js";
 export { useAnalytics } from "./useAnalytics.js";
 export { useAuth } from "./useAuth.js";
 export { useAuthentication } from "./useAuthentication.js";
+export { useBetterAuth } from "./useBetterAuth.js";
 export { useB3BalanceFromAddresses } from "./useB3BalanceFromAddresses.js";
 export { useB3EnsName } from "./useB3EnsName.js";
 export { useChainSwitchWithAction } from "./useChainSwitchWithAction.js";