diff --git a/account-kit/react/src/components/auth/card/loading/otp.tsx b/account-kit/react/src/components/auth/card/loading/otp.tsx
index ce65dc8958..40f994b89e 100644
--- a/account-kit/react/src/components/auth/card/loading/otp.tsx
+++ b/account-kit/react/src/components/auth/card/loading/otp.tsx
@@ -12,7 +12,7 @@ import { AuthStepStatus, useAuthContext } from "../../context.js";
 import { useAuthenticate } from "../../../../hooks/useAuthenticate.js";
 import { useSignerStatus } from "../../../../hooks/useSignerStatus.js";
 
-const AUTH_DELAY = 3000;
+const AUTH_DELAY = 1000;
 
 export const LoadingOtp = () => {
   const { isConnected } = useSignerStatus();
@@ -20,7 +20,7 @@ export const LoadingOtp = () => {
   const [otpCode, setOtpCode] = useState<OTPCodeType>(initialOTPValue);
   const [errorText, setErrorText] = useState(authStep.error?.message || "");
   const [titleText, setTitleText] = useState(ls.loadingOtp.title);
-  // const { setAuthStep } = useAuthContext();
+
   const resetOTP = (errorText = "") => {
     setOtpCode(initialOTPValue);
     setErrorText(errorText);
diff --git a/account-kit/react/src/components/auth/context.ts b/account-kit/react/src/components/auth/context.ts
index 6c7d0fd219..12942ad768 100644
--- a/account-kit/react/src/components/auth/context.ts
+++ b/account-kit/react/src/components/auth/context.ts
@@ -56,7 +56,20 @@ export function useAuthContext<
   TType extends AuthStep["type"] | undefined = AuthStep["type"] | undefined
 >(type?: TType): AuthContextType<TType>;
 
-export function useAuthContext(
+/**
+ * A custom hook that provides the authentication context based on the specified authentication step type. It ensures that the hook is used within an `AuthModalProvider` and throws an error if the context is not available or if the current auth step type does not match the expected type.
+ *
+ * @example
+ * ```tsx twoslash
+ * import { useAuthContext } from "@account-kit/react";
+ *
+ * const { authStep } = useAuthContext();
+ * ```
+ *
+ * @param {AuthStep["type"]} [type] Optional type of authentication step to validate against the current context
+ * @returns {AuthContextType} The authentication context for the current component
+ * @throws Will throw an error if the hook is not used within an `AuthModalProvider` or if the current auth step type does not match the expected type
+ */ export function useAuthContext(
   type?: AuthStep["type"] | undefined
 ): AuthContextType {
   const context = useOptionalAuthContext();
diff --git a/account-kit/react/src/index.ts b/account-kit/react/src/index.ts
index badb898258..61a04476bf 100644
--- a/account-kit/react/src/index.ts
+++ b/account-kit/react/src/index.ts
@@ -59,3 +59,4 @@ export { Dialog } from "./components/dialog/dialog.js";
 export { AuthCard } from "./components/auth/card/index.js";
 export type * from "./components/auth/types.js";
 export { useAuthModal } from "./hooks/useAuthModal.js";
+export { useAuthContext } from "./components/auth/context.js";
diff --git a/examples/ui-demo/src/components/preview/AuthCardWrapper.tsx b/examples/ui-demo/src/components/preview/AuthCardWrapper.tsx
index 9b94e30120..bc84407c98 100644
--- a/examples/ui-demo/src/components/preview/AuthCardWrapper.tsx
+++ b/examples/ui-demo/src/components/preview/AuthCardWrapper.tsx
@@ -1,8 +1,9 @@
 "use client";
 
+import { useEffect, useState } from "react";
 import { cn } from "@/lib/utils";
 import { useTheme } from "@/state/useTheme";
-import { AuthCard, useUser } from "@account-kit/react";
+import { AuthCard, useUser, useAuthContext } from "@account-kit/react";
 import { EOAPostLogin } from "../shared/eoa-post-login/EOAPostLogin";
 import { MintCard } from "../shared/mint-card/MintCard";
 
@@ -25,10 +26,22 @@ export function AuthCardWrapper({ className }: { className?: string }) {
 }
 
 const RenderContent = () => {
+  const { authStep } = useAuthContext();
   const user = useUser();
-  const hasUser = !!user;
+  const [showAuthCard, setShowAuthCard] = useState(() => !user);
 
-  if (!hasUser) {
+  useEffect(() => {
+    // Show auth card for unauthenticated users
+    if (!user) {
+      setShowAuthCard(true);
+
+      // Get auth details for authenticated users
+    } else if (!!user && ["complete", "initial"].includes(authStep.type)) {
+      setShowAuthCard(false);
+    }
+  }, [authStep.type, user]);
+
+  if (showAuthCard) {
     return (
       <div className="flex flex-col gap-2 w-[368px]">
         <div
@@ -44,7 +57,7 @@ const RenderContent = () => {
     );
   }
 
-  const isEOAUser = user.type === "eoa";
+  const isEOAUser = user?.type === "eoa";
 
   if (isEOAUser) {
     return (
diff --git a/site/pages/reference/account-kit/react/hooks/useAuthContext.mdx b/site/pages/reference/account-kit/react/hooks/useAuthContext.mdx
new file mode 100644
index 0000000000..d684d68a16
--- /dev/null
+++ b/site/pages/reference/account-kit/react/hooks/useAuthContext.mdx
@@ -0,0 +1,35 @@
+---
+# This file is autogenerated
+title: useAuthContext
+description: Overview of the useAuthContext method
+---
+
+# useAuthContext
+
+A custom hook that provides the authentication context based on the specified authentication step type. It ensures that the hook is used within an `AuthModalProvider` and throws an error if the context is not available or if the current auth step type does not match the expected type.
+
+## Import
+
+```ts
+import { useAuthContext } from "@account-kit/react";
+```
+
+## Usage
+
+```tsx
+import { useAuthContext } from "@account-kit/react";
+
+const { authStep } = useAuthContext();
+```
+
+## Parameters
+
+### type
+
+`AuthStep["type"]`
+Optional type of authentication step to validate against the current context
+
+## Returns
+
+`AuthContextType`
+The authentication context for the current component