@civic/auth 0.9.1-beta.1 → 0.9.1-beta.2

package/dist/react-router-7/routeHandler.js

@@ -0,0 +1,397 @@
+import { redirect } from "react-router";
+import { CivicAuth } from "@civic/auth/server";
+import { ReactRouterCookieStorage } from "./cookies.js";
+import { resolveAuthConfig } from "./config.js";
+import { getProtocolFromRequest } from "../shared/lib/util.js";
+/**
+ * Fields that are safe to expose to the frontend
+ */
+const WHITELISTED_FRONTEND_FIELDS = [
+    "clientId",
+    "oauthServer",
+    "callbackUrl",
+    "logoutCallbackUrl",
+    "loginUrl",
+    "baseUrl",
+    "logoutUrl",
+];
+/**
+ * Create auth route handlers for React Router - backend endpoints compatible with VanillaJS frontend integration
+ * These routes work similar to the Express example, using server-side CivicAuth SDK
+ */
+export function createRouteHandlers(configOverrides = {}) {
+    const config = resolveAuthConfig(configOverrides);
+    /**
+     * Gets a default base URL when no baseUrl is configured
+     * Uses request headers to determine protocol when possible
+     */
+    const getDefaultBaseUrl = (request) => {
+        const protocol = getProtocolFromRequest(request);
+        const host = request ? new URL(request.url).host : "localhost:5191";
+        return `${protocol}//${host}`;
+    };
+    /**
+     * Resolves configuration with proper fallbacks based on request context
+     * @param request - The request object to extract host for fallbacks
+     * @returns Resolved configuration with all fallbacks applied
+     */
+    const resolveConfigWithFallbacks = (request) => {
+        const host = request
+            ? `${getProtocolFromRequest(request)}//${new URL(request.url).host}`
+            : (config.baseUrl ?? getDefaultBaseUrl(request));
+        return {
+            clientId: config.clientId,
+            oauthServer: config.oauthServer,
+            callbackUrl: config.callbackUrl ?? `${host}/auth/callback`,
+            logoutCallbackUrl: config.logoutCallbackUrl ?? `${host}`,
+            loginUrl: config.loginUrl ?? `${host}/auth/login`,
+            baseUrl: config.baseUrl ?? host,
+            loginSuccessUrl: config.loginSuccessUrl ?? `${host}`,
+            logoutUrl: config.logoutUrl ?? `${host}`,
+        };
+    };
+    /**
+     * Gets the whitelisted frontend configuration with proper fallbacks
+     * Only exposes fields that are safe for frontend consumption
+     * @param request - The request object to extract host for fallbacks
+     * @returns The whitelisted configuration object with fallbacks applied
+     */
+    const getWhitelistedFrontEndConfig = (request) => {
+        const resolved = resolveConfigWithFallbacks(request);
+        // Filter resolved config to only include whitelisted fields
+        return WHITELISTED_FRONTEND_FIELDS.reduce((acc, key) => {
+            acc[key] = resolved[key];
+            return acc;
+        }, {});
+    };
+    /**
+     * Helper to create CivicAuth instance for a request
+     */
+    const createCivicAuth = (request) => {
+        const cookieStorage = new ReactRouterCookieStorage(request);
+        const resolvedConfig = resolveConfigWithFallbacks(request);
+        const civicAuth = new CivicAuth(cookieStorage, {
+            clientId: resolvedConfig.clientId,
+            redirectUrl: resolvedConfig.callbackUrl,
+            oauthServer: resolvedConfig.oauthServer,
+            postLogoutRedirectUrl: resolvedConfig.logoutCallbackUrl,
+            loginSuccessUrl: resolvedConfig.loginSuccessUrl,
+            loginUrl: resolvedConfig.loginUrl,
+        });
+        return {
+            civicAuth,
+            // Use the original cookieStorage instance that we properly configured with setRequest()
+            cookieStorage,
+        };
+    };
+    /**
+     * Helper to create response with cookie headers
+     * Following React Router pattern: add serialized cookies as "Set-Cookie" headers
+     */
+    const createResponseWithCookies = (body, init, cookieStorage) => {
+        const headers = new Headers(init.headers);
+        // Add cookie headers from storage - each one is a complete "Set-Cookie" header from cookie.serialize()
+        const cookieHeaders = cookieStorage.getCookieHeaders();
+        cookieHeaders.forEach((cookieHeader) => {
+            headers.append("Set-Cookie", cookieHeader);
+        });
+        return new Response(body, {
+            ...init,
+            headers,
+        });
+    };
+    /**
+     * Helper to create redirect with cookie headers
+     * Following React Router pattern: add serialized cookies as "Set-Cookie" headers
+     */
+    const redirectWithCookies = (url, cookieStorage, init) => {
+        const headers = new Headers(init?.headers);
+        // Add cookie headers from storage - each one is a complete "Set-Cookie" header from cookie.serialize()
+        const cookieHeaders = cookieStorage.getCookieHeaders();
+        cookieHeaders.forEach((cookieHeader) => {
+            headers.append("Set-Cookie", cookieHeader);
+        });
+        // Set Location header for proper redirect
+        headers.set("Location", url);
+        return new Response(null, {
+            ...init,
+            status: 302,
+            headers,
+        });
+    };
+    const handlers = {
+        /**
+         * Login loader - backend OAuth login initiation endpoint
+         * Uses CivicAuth.buildLoginUrl() like Express example
+         */
+        loginLoader: async ({ request }) => {
+            const incomingUrl = new URL(request.url);
+            const frontendState = incomingUrl.searchParams.get("state");
+            // const returnTo = incomingUrl.searchParams.get("returnTo") || "/";
+            try {
+                const { civicAuth, cookieStorage } = createCivicAuth(request);
+                const url = await civicAuth.buildLoginUrl({
+                    state: frontendState || undefined,
+                });
+                const response = redirectWithCookies(url.toString(), cookieStorage);
+                return response;
+            }
+            catch (error) {
+                console.error("[LOGIN_HANDLER] Backend login error:", error);
+                return redirect("/?error=login_failed");
+            }
+        },
+        /**
+         * Callback loader - backend OAuth callback endpoint
+         * Uses CivicAuth.handleCallback() like Express example
+         */
+        callbackLoader: async ({ request }) => {
+            try {
+                const url = new URL(request.url);
+                const code = url.searchParams.get("code");
+                const state = url.searchParams.get("state");
+                const error = url.searchParams.get("error");
+                if (error) {
+                    console.error("OAuth error in callback:", error);
+                    return redirect("/?error=oauth_error");
+                }
+                if (!code || !state) {
+                    throw new Error("Missing code or state parameter");
+                }
+                const { civicAuth, cookieStorage } = createCivicAuth(request);
+                // Convert React Router request to the format expected by handleCallback
+                const handleCallbackRequest = {
+                    headers: Object.fromEntries(request.headers.entries()),
+                };
+                // For non-iframe requests, use the original handleCallback logic
+                const result = await civicAuth.handleCallback({
+                    code,
+                    state,
+                    req: handleCallbackRequest,
+                });
+                if (result.redirectTo) {
+                    return redirectWithCookies(result.redirectTo, cookieStorage);
+                }
+                if (result.content) {
+                    // Handle both string content and object content
+                    if (typeof result.content === "string") {
+                        return createResponseWithCookies(result.content, {
+                            status: 200,
+                            headers: {
+                                "Content-Type": "text/html",
+                            },
+                        }, cookieStorage);
+                    }
+                    else {
+                        // Object content (JSON response)
+                        return createResponseWithCookies(JSON.stringify(result.content), {
+                            status: 200,
+                            headers: {
+                                "Content-Type": "application/json",
+                            },
+                        }, cookieStorage);
+                    }
+                }
+                // Fallback redirect
+                return redirectWithCookies("/", cookieStorage);
+            }
+            catch (error) {
+                console.error("[CALLBACK_HANDLER] OAuth callback error:", error);
+                return redirect("/?error=callback_failed");
+            }
+        },
+        /**
+         * Logout loader - backend logout endpoint
+         * Uses CivicAuth.buildLogoutRedirectUrl() and clearTokens() like Express example
+         */
+        logoutLoader: async ({ request }) => {
+            try {
+                const { civicAuth, cookieStorage } = createCivicAuth(request);
+                const frontendState = new URL(request.url).searchParams.get("state");
+                const logoutUrl = await civicAuth.buildLogoutRedirectUrl({
+                    state: frontendState || undefined,
+                });
+                await civicAuth.clearTokens();
+                const url = new URL(logoutUrl.toString());
+                // Remove the state parameter to avoid it showing up in the frontend URL
+                url.searchParams.delete("state");
+                return redirectWithCookies(url.toString(), cookieStorage);
+            }
+            catch (error) {
+                console.error("[LOGOUT_HANDLER] Logout error:", error);
+                // If logout URL generation fails, clear tokens and redirect to home (Express pattern)
+                try {
+                    const { civicAuth, cookieStorage } = createCivicAuth(request);
+                    await civicAuth.clearTokens();
+                    return redirectWithCookies("/", cookieStorage);
+                }
+                catch (clearError) {
+                    console.error("[LOGOUT_HANDLER] Failed to clear tokens:", clearError);
+                    return redirect("/");
+                }
+            }
+        },
+        /**
+         * User endpoint - returns current user data as JSON
+         * Uses CivicAuth.isLoggedIn() and getUser() like Express example
+         */
+        userLoader: async ({ request }) => {
+            try {
+                const { civicAuth, cookieStorage } = createCivicAuth(request);
+                const isLoggedIn = await civicAuth.isLoggedIn();
+                if (!isLoggedIn) {
+                    return createResponseWithCookies(JSON.stringify({ error: "Not authenticated" }), {
+                        status: 401,
+                        headers: { "Content-Type": "application/json" },
+                    }, cookieStorage);
+                }
+                const user = await civicAuth.getUser();
+                return createResponseWithCookies(JSON.stringify({ user }), {
+                    status: 200,
+                    headers: { "Content-Type": "application/json" },
+                }, cookieStorage);
+            }
+            catch (error) {
+                console.error("[USER_HANDLER] User endpoint error:", error);
+                return new Response(JSON.stringify({ error: "Internal server error" }), {
+                    status: 500,
+                    headers: { "Content-Type": "application/json" },
+                });
+            }
+        },
+        /**
+         * Refresh endpoint - refreshes access tokens
+         * Uses CivicAuth.refreshTokens() like Express example
+         */
+        refreshLoader: async ({ request }) => {
+            try {
+                const { civicAuth, cookieStorage } = createCivicAuth(request);
+                const isLoggedIn = await civicAuth.isLoggedIn();
+                if (!isLoggedIn) {
+                    return createResponseWithCookies(JSON.stringify({ error: "Not authenticated" }), {
+                        status: 401,
+                        headers: { "Content-Type": "application/json" },
+                    }, cookieStorage);
+                }
+                await civicAuth.refreshTokens();
+                return createResponseWithCookies(JSON.stringify({ success: true, message: "Tokens refreshed" }), {
+                    status: 200,
+                    headers: { "Content-Type": "application/json" },
+                }, cookieStorage);
+            }
+            catch (error) {
+                console.error("[REFRESH_HANDLER] Token refresh error:", error);
+                return new Response(JSON.stringify({ error: "Token refresh failed" }), {
+                    status: 500,
+                    headers: { "Content-Type": "application/json" },
+                });
+            }
+        },
+        /**
+         * Get user data from session (for SSR)
+         * Uses CivicAuth.isLoggedIn() and getUser() like Express example
+         */
+        getUser: async (request) => {
+            try {
+                const { civicAuth } = createCivicAuth(request);
+                const isLoggedIn = await civicAuth.isLoggedIn();
+                if (!isLoggedIn) {
+                    return null;
+                }
+                return await civicAuth.getUser();
+            }
+            catch (error) {
+                console.error("[GETUSER_HANDLER] getUser error:", error);
+                return null;
+            }
+        },
+        /**
+         * Get auth data including user and config (for SSR)
+         * Returns user data, config, and other auth-related data needed by the app under a civic key
+         */
+        getAuthData: async (request) => {
+            try {
+                const { civicAuth } = createCivicAuth(request);
+                const isLoggedIn = await civicAuth.isLoggedIn();
+                const user = isLoggedIn ? await civicAuth.getUser() : null;
+                // Get the whitelisted config with proper fallbacks using the request
+                const configWithFallbacks = getWhitelistedFrontEndConfig(request);
+                return {
+                    civic: {
+                        user,
+                        config: configWithFallbacks,
+                        isLoggedIn,
+                    },
+                };
+            }
+            catch (error) {
+                console.error("[GETAUTHDATA_HANDLER] getAuthData error:", error);
+                // Even in error cases, provide config with fallbacks
+                const configWithFallbacks = getWhitelistedFrontEndConfig(request);
+                return {
+                    civic: {
+                        user: null,
+                        config: configWithFallbacks,
+                        isLoggedIn: false,
+                    },
+                };
+            }
+        },
+    };
+    /**
+     * Creates a loader function that handles all auth routes
+     * @example
+     * // In your auth.$.tsx route file:
+     * export const loader = createAuthLoader();
+     */
+    const createAuthLoader = () => {
+        return async (args) => {
+            // Get the auth path from the URL
+            const authPath = args.params["*"];
+            // Route to the appropriate handler
+            switch (authPath) {
+                case "login":
+                    return handlers.loginLoader(args);
+                case "callback":
+                    return handlers.callbackLoader(args);
+                case "refresh":
+                    return handlers.refreshLoader(args);
+                case "logout":
+                    return handlers.logoutLoader(args);
+                case "user":
+                    return handlers.userLoader(args);
+                default:
+                    // Return 404 for unknown auth paths
+                    return new Response("Not Found", { status: 404 });
+            }
+        };
+    };
+    /**
+     * Creates an action function that handles POST requests to auth routes
+     * @example
+     * // In your auth.$.tsx route file:
+     * export const action = createAuthAction();
+     */
+    const createAuthAction = () => {
+        return async (args) => {
+            // Get the auth path from the URL
+            const authPath = args.params["*"];
+            // Route to the appropriate handler for POST requests
+            switch (authPath) {
+                case "refresh":
+                    return handlers.refreshLoader(args); // Same logic for refresh regardless of GET/POST
+                default:
+                    // Return 405 Method Not Allowed for unsupported POST paths
+                    return new Response("Method Not Allowed", { status: 405 });
+            }
+        };
+    };
+    return {
+        ...handlers,
+        createAuthLoader,
+        createAuthAction,
+        resolveConfigWithFallbacks,
+        getWhitelistedFrontEndConfig,
+    };
+}
+//# sourceMappingURL=routeHandler.js.map

package/dist/react-router-7/routeHandler.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"routeHandler.js","sourceRoot":"","sources":["../../src/react-router-7/routeHandler.ts"],"names":[],"mappings":"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","sourcesContent":["import { redirect, type LoaderFunctionArgs } from \"react-router\";\nimport { CivicAuth } from \"@civic/auth/server\";\nimport { ReactRouterCookieStorage } from \"./cookies.js\";\nimport { resolveAuthConfig } from \"./config.js\";\nimport type {\n  AuthConfig,\n  ResolvedAuthConfig,\n  WhitelistedFrontEndConfig,\n} from \"./config.js\";\nimport { getProtocolFromRequest } from \"@/shared/lib/util.js\";\n\n/**\n * Fields that are safe to expose to the frontend\n */\nconst WHITELISTED_FRONTEND_FIELDS = [\n  \"clientId\",\n  \"oauthServer\",\n  \"callbackUrl\",\n  \"logoutCallbackUrl\",\n  \"loginUrl\",\n  \"baseUrl\",\n  \"logoutUrl\",\n] as const;\n\n/**\n * Create auth route handlers for React Router - backend endpoints compatible with VanillaJS frontend integration\n * These routes work similar to the Express example, using server-side CivicAuth SDK\n */\nexport function createRouteHandlers(configOverrides: Partial<AuthConfig> = {}) {\n  const config = resolveAuthConfig(configOverrides);\n\n  /**\n   * Gets a default base URL when no baseUrl is configured\n   * Uses request headers to determine protocol when possible\n   */\n  const getDefaultBaseUrl = (request?: Request): string => {\n    const protocol = getProtocolFromRequest(request);\n    const host = request ? new URL(request.url).host : \"localhost:5191\";\n\n    return `${protocol}//${host}`;\n  };\n\n  /**\n   * Resolves configuration with proper fallbacks based on request context\n   * @param request - The request object to extract host for fallbacks\n   * @returns Resolved configuration with all fallbacks applied\n   */\n  const resolveConfigWithFallbacks = (\n    request?: Request,\n  ): ResolvedAuthConfig => {\n    const host = request\n      ? `${getProtocolFromRequest(request)}//${new URL(request.url).host}`\n      : (config.baseUrl ?? getDefaultBaseUrl(request));\n\n    return {\n      clientId: config.clientId,\n      oauthServer: config.oauthServer,\n      callbackUrl: config.callbackUrl ?? `${host}/auth/callback`,\n      logoutCallbackUrl: config.logoutCallbackUrl ?? `${host}`,\n      loginUrl: config.loginUrl ?? `${host}/auth/login`,\n      baseUrl: config.baseUrl ?? host,\n      loginSuccessUrl: config.loginSuccessUrl ?? `${host}`,\n      logoutUrl: config.logoutUrl ?? `${host}`,\n    };\n  };\n\n  /**\n   * Gets the whitelisted frontend configuration with proper fallbacks\n   * Only exposes fields that are safe for frontend consumption\n   * @param request - The request object to extract host for fallbacks\n   * @returns The whitelisted configuration object with fallbacks applied\n   */\n  const getWhitelistedFrontEndConfig = (\n    request?: Request,\n  ): WhitelistedFrontEndConfig => {\n    const resolved = resolveConfigWithFallbacks(request);\n\n    // Filter resolved config to only include whitelisted fields\n    return WHITELISTED_FRONTEND_FIELDS.reduce((acc, key) => {\n      acc[key] = resolved[key];\n      return acc;\n    }, {} as WhitelistedFrontEndConfig);\n  };\n\n  /**\n   * Helper to create CivicAuth instance for a request\n   */\n  const createCivicAuth = (request: Request) => {\n    const cookieStorage = new ReactRouterCookieStorage(request);\n\n    const resolvedConfig = resolveConfigWithFallbacks(request);\n\n    const civicAuth = new CivicAuth(cookieStorage, {\n      clientId: resolvedConfig.clientId,\n      redirectUrl: resolvedConfig.callbackUrl,\n      oauthServer: resolvedConfig.oauthServer,\n      postLogoutRedirectUrl: resolvedConfig.logoutCallbackUrl,\n      loginSuccessUrl: resolvedConfig.loginSuccessUrl,\n      loginUrl: resolvedConfig.loginUrl,\n    });\n\n    return {\n      civicAuth,\n      // Use the original cookieStorage instance that we properly configured with setRequest()\n      cookieStorage,\n    };\n  };\n\n  /**\n   * Helper to create response with cookie headers\n   * Following React Router pattern: add serialized cookies as \"Set-Cookie\" headers\n   */\n  const createResponseWithCookies = (\n    body: string,\n    init: ResponseInit,\n    cookieStorage: ReactRouterCookieStorage,\n  ): Response => {\n    const headers = new Headers(init.headers);\n\n    // Add cookie headers from storage - each one is a complete \"Set-Cookie\" header from cookie.serialize()\n    const cookieHeaders = cookieStorage.getCookieHeaders();\n\n    cookieHeaders.forEach((cookieHeader) => {\n      headers.append(\"Set-Cookie\", cookieHeader);\n    });\n\n    return new Response(body, {\n      ...init,\n      headers,\n    });\n  };\n\n  /**\n   * Helper to create redirect with cookie headers\n   * Following React Router pattern: add serialized cookies as \"Set-Cookie\" headers\n   */\n  const redirectWithCookies = (\n    url: string,\n    cookieStorage: ReactRouterCookieStorage,\n    init?: ResponseInit,\n  ): Response => {\n    const headers = new Headers(init?.headers);\n\n    // Add cookie headers from storage - each one is a complete \"Set-Cookie\" header from cookie.serialize()\n    const cookieHeaders = cookieStorage.getCookieHeaders();\n\n    cookieHeaders.forEach((cookieHeader) => {\n      headers.append(\"Set-Cookie\", cookieHeader);\n    });\n\n    // Set Location header for proper redirect\n    headers.set(\"Location\", url);\n\n    return new Response(null, {\n      ...init,\n      status: 302,\n      headers,\n    });\n  };\n\n  const handlers = {\n    /**\n     * Login loader - backend OAuth login initiation endpoint\n     * Uses CivicAuth.buildLoginUrl() like Express example\n     */\n    loginLoader: async ({ request }: LoaderFunctionArgs) => {\n      const incomingUrl = new URL(request.url);\n      const frontendState = incomingUrl.searchParams.get(\"state\");\n      // const returnTo = incomingUrl.searchParams.get(\"returnTo\") || \"/\";\n\n      try {\n        const { civicAuth, cookieStorage } = createCivicAuth(request);\n\n        const url = await civicAuth.buildLoginUrl({\n          state: frontendState || undefined,\n        });\n\n        const response = redirectWithCookies(url.toString(), cookieStorage);\n\n        return response;\n      } catch (error) {\n        console.error(\"[LOGIN_HANDLER] Backend login error:\", error);\n        return redirect(\"/?error=login_failed\");\n      }\n    },\n\n    /**\n     * Callback loader - backend OAuth callback endpoint\n     * Uses CivicAuth.handleCallback() like Express example\n     */\n    callbackLoader: async ({ request }: LoaderFunctionArgs) => {\n      try {\n        const url = new URL(request.url);\n        const code = url.searchParams.get(\"code\");\n        const state = url.searchParams.get(\"state\");\n        const error = url.searchParams.get(\"error\");\n\n        if (error) {\n          console.error(\"OAuth error in callback:\", error);\n          return redirect(\"/?error=oauth_error\");\n        }\n\n        if (!code || !state) {\n          throw new Error(\"Missing code or state parameter\");\n        }\n\n        const { civicAuth, cookieStorage } = createCivicAuth(request);\n\n        // Convert React Router request to the format expected by handleCallback\n        const handleCallbackRequest = {\n          headers: Object.fromEntries(request.headers.entries()),\n        };\n\n        // For non-iframe requests, use the original handleCallback logic\n        const result = await civicAuth.handleCallback({\n          code,\n          state,\n          req: handleCallbackRequest,\n        });\n\n        if (result.redirectTo) {\n          return redirectWithCookies(result.redirectTo, cookieStorage);\n        }\n\n        if (result.content) {\n          // Handle both string content and object content\n          if (typeof result.content === \"string\") {\n            return createResponseWithCookies(\n              result.content,\n              {\n                status: 200,\n                headers: {\n                  \"Content-Type\": \"text/html\",\n                },\n              },\n              cookieStorage,\n            );\n          } else {\n            // Object content (JSON response)\n            return createResponseWithCookies(\n              JSON.stringify(result.content),\n              {\n                status: 200,\n                headers: {\n                  \"Content-Type\": \"application/json\",\n                },\n              },\n              cookieStorage,\n            );\n          }\n        }\n\n        // Fallback redirect\n        return redirectWithCookies(\"/\", cookieStorage);\n      } catch (error) {\n        console.error(\"[CALLBACK_HANDLER] OAuth callback error:\", error);\n        return redirect(\"/?error=callback_failed\");\n      }\n    },\n\n    /**\n     * Logout loader - backend logout endpoint\n     * Uses CivicAuth.buildLogoutRedirectUrl() and clearTokens() like Express example\n     */\n    logoutLoader: async ({ request }: LoaderFunctionArgs) => {\n      try {\n        const { civicAuth, cookieStorage } = createCivicAuth(request);\n        const frontendState = new URL(request.url).searchParams.get(\"state\");\n\n        const logoutUrl = await civicAuth.buildLogoutRedirectUrl({\n          state: frontendState || undefined,\n        });\n\n        await civicAuth.clearTokens();\n\n        const url = new URL(logoutUrl.toString());\n        // Remove the state parameter to avoid it showing up in the frontend URL\n        url.searchParams.delete(\"state\");\n\n        return redirectWithCookies(url.toString(), cookieStorage);\n      } catch (error) {\n        console.error(\"[LOGOUT_HANDLER] Logout error:\", error);\n        // If logout URL generation fails, clear tokens and redirect to home (Express pattern)\n        try {\n          const { civicAuth, cookieStorage } = createCivicAuth(request);\n          await civicAuth.clearTokens();\n          return redirectWithCookies(\"/\", cookieStorage);\n        } catch (clearError) {\n          console.error(\"[LOGOUT_HANDLER] Failed to clear tokens:\", clearError);\n          return redirect(\"/\");\n        }\n      }\n    },\n\n    /**\n     * User endpoint - returns current user data as JSON\n     * Uses CivicAuth.isLoggedIn() and getUser() like Express example\n     */\n    userLoader: async ({ request }: LoaderFunctionArgs) => {\n      try {\n        const { civicAuth, cookieStorage } = createCivicAuth(request);\n\n        const isLoggedIn = await civicAuth.isLoggedIn();\n\n        if (!isLoggedIn) {\n          return createResponseWithCookies(\n            JSON.stringify({ error: \"Not authenticated\" }),\n            {\n              status: 401,\n              headers: { \"Content-Type\": \"application/json\" },\n            },\n            cookieStorage,\n          );\n        }\n\n        const user = await civicAuth.getUser();\n\n        return createResponseWithCookies(\n          JSON.stringify({ user }),\n          {\n            status: 200,\n            headers: { \"Content-Type\": \"application/json\" },\n          },\n          cookieStorage,\n        );\n      } catch (error) {\n        console.error(\"[USER_HANDLER] User endpoint error:\", error);\n        return new Response(\n          JSON.stringify({ error: \"Internal server error\" }),\n          {\n            status: 500,\n            headers: { \"Content-Type\": \"application/json\" },\n          },\n        );\n      }\n    },\n\n    /**\n     * Refresh endpoint - refreshes access tokens\n     * Uses CivicAuth.refreshTokens() like Express example\n     */\n    refreshLoader: async ({ request }: LoaderFunctionArgs) => {\n      try {\n        const { civicAuth, cookieStorage } = createCivicAuth(request);\n\n        const isLoggedIn = await civicAuth.isLoggedIn();\n        if (!isLoggedIn) {\n          return createResponseWithCookies(\n            JSON.stringify({ error: \"Not authenticated\" }),\n            {\n              status: 401,\n              headers: { \"Content-Type\": \"application/json\" },\n            },\n            cookieStorage,\n          );\n        }\n\n        await civicAuth.refreshTokens();\n\n        return createResponseWithCookies(\n          JSON.stringify({ success: true, message: \"Tokens refreshed\" }),\n          {\n            status: 200,\n            headers: { \"Content-Type\": \"application/json\" },\n          },\n          cookieStorage,\n        );\n      } catch (error) {\n        console.error(\"[REFRESH_HANDLER] Token refresh error:\", error);\n        return new Response(JSON.stringify({ error: \"Token refresh failed\" }), {\n          status: 500,\n          headers: { \"Content-Type\": \"application/json\" },\n        });\n      }\n    },\n\n    /**\n     * Get user data from session (for SSR)\n     * Uses CivicAuth.isLoggedIn() and getUser() like Express example\n     */\n    getUser: async (request: Request) => {\n      try {\n        const { civicAuth } = createCivicAuth(request);\n\n        const isLoggedIn = await civicAuth.isLoggedIn();\n        if (!isLoggedIn) {\n          return null;\n        }\n\n        return await civicAuth.getUser();\n      } catch (error) {\n        console.error(\"[GETUSER_HANDLER] getUser error:\", error);\n        return null;\n      }\n    },\n\n    /**\n     * Get auth data including user and config (for SSR)\n     * Returns user data, config, and other auth-related data needed by the app under a civic key\n     */\n    getAuthData: async (request: Request) => {\n      try {\n        const { civicAuth } = createCivicAuth(request);\n\n        const isLoggedIn = await civicAuth.isLoggedIn();\n        const user = isLoggedIn ? await civicAuth.getUser() : null;\n\n        // Get the whitelisted config with proper fallbacks using the request\n        const configWithFallbacks = getWhitelistedFrontEndConfig(request);\n\n        return {\n          civic: {\n            user,\n            config: configWithFallbacks,\n            isLoggedIn,\n          },\n        };\n      } catch (error) {\n        console.error(\"[GETAUTHDATA_HANDLER] getAuthData error:\", error);\n        // Even in error cases, provide config with fallbacks\n        const configWithFallbacks = getWhitelistedFrontEndConfig(request);\n        return {\n          civic: {\n            user: null,\n            config: configWithFallbacks,\n            isLoggedIn: false,\n          },\n        };\n      }\n    },\n  };\n\n  /**\n   * Creates a loader function that handles all auth routes\n   * @example\n   * // In your auth.$.tsx route file:\n   * export const loader = createAuthLoader();\n   */\n  const createAuthLoader = () => {\n    return async (args: LoaderFunctionArgs) => {\n      // Get the auth path from the URL\n      const authPath = args.params[\"*\"];\n\n      // Route to the appropriate handler\n      switch (authPath) {\n        case \"login\":\n          return handlers.loginLoader(args);\n\n        case \"callback\":\n          return handlers.callbackLoader(args);\n\n        case \"refresh\":\n          return handlers.refreshLoader(args);\n\n        case \"logout\":\n          return handlers.logoutLoader(args);\n\n        case \"user\":\n          return handlers.userLoader(args);\n\n        default:\n          // Return 404 for unknown auth paths\n          return new Response(\"Not Found\", { status: 404 });\n      }\n    };\n  };\n\n  /**\n   * Creates an action function that handles POST requests to auth routes\n   * @example\n   * // In your auth.$.tsx route file:\n   * export const action = createAuthAction();\n   */\n  const createAuthAction = () => {\n    return async (args: LoaderFunctionArgs) => {\n      // Get the auth path from the URL\n      const authPath = args.params[\"*\"];\n\n      // Route to the appropriate handler for POST requests\n      switch (authPath) {\n        case \"refresh\":\n          return handlers.refreshLoader(args); // Same logic for refresh regardless of GET/POST\n\n        default:\n          // Return 405 Method Not Allowed for unsupported POST paths\n          return new Response(\"Method Not Allowed\", { status: 405 });\n      }\n    };\n  };\n\n  return {\n    ...handlers,\n    createAuthLoader,\n    createAuthAction,\n    resolveConfigWithFallbacks,\n    getWhitelistedFrontEndConfig,\n  };\n}\n"]}

package/dist/react-router-7/useUser.d.ts

@@ -0,0 +1,40 @@
+import { type AuthResult, type CivicAuthClientConfig, type User } from "@civic/auth/vanillajs";
+import type { AuthConfig } from "./config.js";
+export type SignInConfig = Pick<CivicAuthClientConfig, "displayMode" | "clientId" | "redirectUrl" | "logoutRedirectUrl" | "targetContainerElement">;
+export interface CivicAuthData {
+    user: User | null;
+    isLoggedIn: boolean;
+    config: AuthConfig;
+}
+export interface RootLoaderData {
+    civic: CivicAuthData;
+}
+export interface AuthData {
+    isLoggedIn: boolean;
+    user: User | null;
+    loginUrl: string;
+    logoutUrl: string;
+    isAuthenticating: boolean;
+    signIn: (config?: SignInConfig) => Promise<AuthResult>;
+    signOut: (baseUrl?: string) => Promise<void>;
+}
+/**
+ * Hook to access auth data from the root loader
+ * @returns CivicAuthData - The civic auth data from the root loader
+ */
+export declare function useAuthData(): CivicAuthData | undefined;
+/**
+ * Hook to access authentication state and user information (SSR pattern)
+ * This is the primary hook for React Router 7 applications using server-side rendering
+ * Enhanced with GlobalAuthManager for better state management
+ * @returns Authentication state and user information from server-side rendering
+ */
+export declare function useUser(): {
+    user: import("../types.js").BaseUser | null;
+    isLoggedIn: boolean;
+    isAuthenticating: boolean;
+    signIn: (config?: SignInConfig) => Promise<AuthResult>;
+    signOut: () => Promise<void>;
+    config: AuthConfig;
+};
+//# sourceMappingURL=useUser.d.ts.map

package/dist/react-router-7/useUser.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useUser.d.ts","sourceRoot":"","sources":["../../src/react-router-7/useUser.ts"],"names":[],"mappings":"AACA,OAAO,EACL,KAAK,UAAU,EACf,KAAK,qBAAqB,EAC1B,KAAK,IAAI,EACV,MAAM,uBAAuB,CAAC;AAM/B,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAG9C,MAAM,MAAM,YAAY,GAAG,IAAI,CAC7B,qBAAqB,EACnB,aAAa,GACb,UAAU,GACV,aAAa,GACb,mBAAmB,GACnB,wBAAwB,CAC3B,CAAC;AAGF,MAAM,WAAW,aAAa;IAC5B,IAAI,EAAE,IAAI,GAAG,IAAI,CAAC;IAClB,UAAU,EAAE,OAAO,CAAC;IACpB,MAAM,EAAE,UAAU,CAAC;CACpB;AAGD,MAAM,WAAW,cAAc;IAC7B,KAAK,EAAE,aAAa,CAAC;CACtB;AAGD,MAAM,WAAW,QAAQ;IACvB,UAAU,EAAE,OAAO,CAAC;IACpB,IAAI,EAAE,IAAI,GAAG,IAAI,CAAC;IAClB,QAAQ,EAAE,MAAM,CAAC;IACjB,SAAS,EAAE,MAAM,CAAC;IAClB,gBAAgB,EAAE,OAAO,CAAC;IAC1B,MAAM,EAAE,CAAC,MAAM,CAAC,EAAE,YAAY,KAAK,OAAO,CAAC,UAAU,CAAC,CAAC;IACvD,OAAO,EAAE,CAAC,OAAO,CAAC,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;CAC9C;AAED;;;GAGG;AACH,wBAAgB,WAAW,IAAI,aAAa,GAAG,SAAS,CAKvD;AAED;;;;;GAKG;AACH,wBAAgB,OAAO;;;;sBA4CU,YAAY;;YAhFnC,UAAU;EA2HnB"}

package/dist/react-router-7/useUser.js

@@ -0,0 +1,102 @@
+import { useMatches, useRevalidator } from "react-router";
+import {} from "@civic/auth/vanillajs";
+import { GlobalAuthManager, } from "../reactjs/core/GlobalAuthManager.js";
+import { useEffect, useMemo, useState } from "react";
+/**
+ * Hook to access auth data from the root loader
+ * @returns CivicAuthData - The civic auth data from the root loader
+ */
+export function useAuthData() {
+    const matches = useMatches();
+    const rootMatch = matches.find((match) => match.id === "root");
+    const data = rootMatch?.data;
+    return data?.civic;
+}
+/**
+ * Hook to access authentication state and user information (SSR pattern)
+ * This is the primary hook for React Router 7 applications using server-side rendering
+ * Enhanced with GlobalAuthManager for better state management
+ * @returns Authentication state and user information from server-side rendering
+ */
+export function useUser() {
+    const authData = useAuthData();
+    const revalidator = useRevalidator();
+    const [authManager] = useState(() => GlobalAuthManager.getInstance());
+    const [isAuthenticating, setIsAuthenticating] = useState(false);
+    if (!authData) {
+        throw new Error(`Auth data not found. Make sure to use createRootAuthLoader in your root route.
+
+You might be seeing this error if:
+- Your root loader is failing
+- There's another part failing to return the civic data`);
+    }
+    const initialConfig = useMemo(() => {
+        return {
+            clientId: authData.config.clientId,
+            loginUrl: authData.config.loginUrl,
+            displayMode: "iframe",
+            framework: "react-router",
+            config: {
+                oauthServer: authData.config.oauthServer,
+            },
+            onSignIn: (error) => {
+                if (!error) {
+                    revalidator.revalidate();
+                }
+            },
+            onSignOut: () => {
+                revalidator.revalidate();
+            },
+        };
+    }, [revalidator, authData]);
+    useEffect(() => {
+        const initialize = async () => {
+            await authManager.initialize(initialConfig);
+        };
+        initialize();
+    }, [authManager, initialConfig]);
+    // Create signIn function that leverages GlobalAuthManager
+    const signIn = async (config) => {
+        setIsAuthenticating(true);
+        try {
+            if (config) {
+                await authManager.initialize({
+                    ...initialConfig,
+                    ...config,
+                });
+            }
+            const result = await authManager.signIn();
+            // Return in AuthResult format for compatibility
+            return result;
+        }
+        catch (error) {
+            console.error("Sign-in failed:", error);
+            throw error;
+        }
+        finally {
+            setIsAuthenticating(false);
+        }
+    };
+    // Create signOut function that leverages GlobalAuthManager
+    const signOut = async () => {
+        try {
+            await authManager.signOut();
+            // The onSignOut callback will handle revalidation
+        }
+        catch (error) {
+            console.error("Sign-out failed:", error);
+            // Still try redirecting to logout URL as fallback
+            window.location.href = "/auth/logout";
+        }
+    };
+    // Ensure we have a valid user object or null
+    return {
+        ...authData,
+        user: authData.user || null,
+        isLoggedIn: !!authData.user,
+        isAuthenticating,
+        signIn,
+        signOut,
+    };
+}
+//# sourceMappingURL=useUser.js.map

package/dist/react-router-7/useUser.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useUser.js","sourceRoot":"","sources":["../../src/react-router-7/useUser.ts"],"names":[],"mappings":"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","sourcesContent":["import { useMatches, useRevalidator } from \"react-router\";\nimport {\n  type AuthResult,\n  type CivicAuthClientConfig,\n  type User,\n} from \"@civic/auth/vanillajs\";\nimport {\n  GlobalAuthManager,\n  type GlobalAuthConfig,\n} from \"../reactjs/core/GlobalAuthManager.js\";\nimport { useEffect, useMemo, useState } from \"react\";\nimport type { AuthConfig } from \"./config.js\";\n\n// Configuration type for signIn function\nexport type SignInConfig = Pick<\n  CivicAuthClientConfig,\n  | \"displayMode\"\n  | \"clientId\"\n  | \"redirectUrl\"\n  | \"logoutRedirectUrl\"\n  | \"targetContainerElement\"\n>;\n\n// Type for the civic auth data structure from the root loader\nexport interface CivicAuthData {\n  user: User | null;\n  isLoggedIn: boolean;\n  config: AuthConfig;\n}\n\n// Type for the complete root loader data structure\nexport interface RootLoaderData {\n  civic: CivicAuthData;\n}\n\n// Type for the auth data that will be available in the root loader (SSR pattern)\nexport interface AuthData {\n  isLoggedIn: boolean;\n  user: User | null;\n  loginUrl: string;\n  logoutUrl: string;\n  isAuthenticating: boolean;\n  signIn: (config?: SignInConfig) => Promise<AuthResult>;\n  signOut: (baseUrl?: string) => Promise<void>;\n}\n\n/**\n * Hook to access auth data from the root loader\n * @returns CivicAuthData - The civic auth data from the root loader\n */\nexport function useAuthData(): CivicAuthData | undefined {\n  const matches = useMatches();\n  const rootMatch = matches.find((match) => match.id === \"root\");\n  const data = rootMatch?.data as RootLoaderData | undefined;\n  return data?.civic;\n}\n\n/**\n * Hook to access authentication state and user information (SSR pattern)\n * This is the primary hook for React Router 7 applications using server-side rendering\n * Enhanced with GlobalAuthManager for better state management\n * @returns Authentication state and user information from server-side rendering\n */\nexport function useUser() {\n  const authData = useAuthData();\n  const revalidator = useRevalidator();\n  const [authManager] = useState(() => GlobalAuthManager.getInstance());\n  const [isAuthenticating, setIsAuthenticating] = useState(false);\n\n  if (!authData) {\n    throw new Error(\n      `Auth data not found. Make sure to use createRootAuthLoader in your root route.\n\nYou might be seeing this error if:\n- Your root loader is failing\n- There's another part failing to return the civic data`,\n    );\n  }\n\n  const initialConfig: GlobalAuthConfig = useMemo(() => {\n    return {\n      clientId: authData.config.clientId,\n      loginUrl: authData.config.loginUrl,\n      displayMode: \"iframe\",\n      framework: \"react-router\",\n      config: {\n        oauthServer: authData.config.oauthServer,\n      },\n      onSignIn: (error) => {\n        if (!error) {\n          revalidator.revalidate();\n        }\n      },\n      onSignOut: () => {\n        revalidator.revalidate();\n      },\n    };\n  }, [revalidator, authData]);\n\n  useEffect(() => {\n    const initialize = async () => {\n      await authManager.initialize(initialConfig);\n    };\n    initialize();\n  }, [authManager, initialConfig]);\n\n  // Create signIn function that leverages GlobalAuthManager\n  const signIn = async (config?: SignInConfig) => {\n    setIsAuthenticating(true);\n    try {\n      if (config) {\n        await authManager.initialize({\n          ...initialConfig,\n          ...config,\n        });\n      }\n\n      const result = await authManager.signIn();\n\n      // Return in AuthResult format for compatibility\n      return result as AuthResult;\n    } catch (error) {\n      console.error(\"Sign-in failed:\", error);\n      throw error;\n    } finally {\n      setIsAuthenticating(false);\n    }\n  };\n\n  // Create signOut function that leverages GlobalAuthManager\n  const signOut = async () => {\n    try {\n      await authManager.signOut();\n      // The onSignOut callback will handle revalidation\n    } catch (error) {\n      console.error(\"Sign-out failed:\", error);\n      // Still try redirecting to logout URL as fallback\n      window.location.href = \"/auth/logout\";\n    }\n  };\n\n  // Ensure we have a valid user object or null\n  return {\n    ...authData,\n    user: authData.user || null,\n    isLoggedIn: !!authData.user,\n    isAuthenticating,\n    signIn,\n    signOut,\n  };\n}\n"]}

package/dist/reactjs/core/GlobalAuthManager.d.ts

@@ -27,15 +27,17 @@
  * - Server-side rendering scenarios where providers might be problematic
  */
 import type { User, Session } from "../../vanillajs/index.js";
-import type { DisplayMode, FrameworkType } from "../../types.js";
+import type { FrameworkType } from "../../types.js";
+import type { VanillaJSDisplayMode } from "../../vanillajs/auth/types/AuthTypes.js";
 import type { LoggingConfig } from "../../vanillajs/auth/types/AuthTypes.js";
 export interface GlobalAuthConfig {
-    clientId: string;
+    clientId?: string;
     redirectUrl?: string;
+    loginUrl?: string;
     config?: {
         oauthServer?: string;
     };
-    displayMode?: DisplayMode;
+    displayMode?: VanillaJSDisplayMode;
     iframeMode?: "modal" | "embedded";
     nonce?: string;
     logoutRedirectUrl?: string;
@@ -56,7 +58,7 @@ export interface GlobalAuthState {
     isLoading: boolean;
     authStatus: AuthStatus;
     error: Error | null;
-    displayMode?: DisplayMode;
+    displayMode?: VanillaJSDisplayMode;
     isPreloaded?: boolean;
 }
 type StateListener = (state: GlobalAuthState) => void;