@fluixi/oauth2 1.0.0-alpha.1 → 1.0.0-alpha.100

package/dist/service-client.cjs

@@ -1,4 +1,4 @@
-/*! @fluixi/oauth2 v1.0.0-alpha.1 | (c) 2026 Ibrahima Touré and Fluixi contributors | MIT */
+/*! @fluixi/oauth2 v1.0.0-alpha.100 | (c) 2026 Ibrahima Touré and Fluixi contributors | MIT */
 "use strict";
 var __create = Object.create;
 var __defProp = Object.defineProperty;
@@ -126,8 +126,12 @@ async function discover(issuer, fetcher = fetch) {
     try {
       response = await fetcher(documentUrl(issuer));
     } catch (cause) {
+      const why = cause instanceof Error ? cause.message : String(cause);
       throw new OAuthError(
-        `Could not read the discovery document at ${documentUrl(issuer)}. In a browser this is usually the provider refusing a cross-origin read: give \`endpoints\` directly, or resolve them on a server. (${cause instanceof Error ? cause.message : String(cause)})`,
+        typeof window === "undefined" ? (
+          // On a server nothing blocks the read: the provider is down, or the address is wrong.
+          `Could not reach the provider at ${documentUrl(issuer)}: is it running, and is the issuer right? (${why})`
+        ) : `Could not read the discovery document at ${documentUrl(issuer)}. In a browser this is usually the provider refusing a cross-origin read: give \`endpoints\` directly, or resolve them on a server. (${why})`,
         "discovery_unreachable"
       );
     }
@@ -152,6 +156,7 @@ async function discover(issuer, fetcher = fetch) {
       jwks: doc.jwks_uri,
       introspection: doc.introspection_endpoint,
       revocation: doc.revocation_endpoint,
+      checkSession: doc.check_session_iframe,
       issuer: doc.issuer ?? issuer
     };
   })();

package/dist/service-client.mjs

@@ -1,5 +1,5 @@
-/*! @fluixi/oauth2 v1.0.0-alpha.1 | (c) 2026 Ibrahima Touré and Fluixi contributors | MIT */
-import "./chunk-25WE6UWI.mjs";
+/*! @fluixi/oauth2 v1.0.0-alpha.100 | (c) 2026 Ibrahima Touré and Fluixi contributors | MIT */
+import "./chunk-KTGVSZE6.mjs";
 
 // src/types.ts
 var OAuthError = class extends Error {
@@ -42,7 +42,7 @@ function assertUsable(auth, who) {
 }
 async function loadJose() {
   try {
-    return await import("./browser-ONMHX3Z3.mjs");
+    return await import("./browser-TV25RBLT.mjs");
   } catch {
     throw new OAuthError(
       "private_key_jwt needs `jose`. Install it: npm i jose. It is an optional peer, so a client using a secret does not carry it.",
@@ -92,8 +92,12 @@ async function discover(issuer, fetcher = fetch) {
     try {
       response = await fetcher(documentUrl(issuer));
     } catch (cause) {
+      const why = cause instanceof Error ? cause.message : String(cause);
       throw new OAuthError(
-        `Could not read the discovery document at ${documentUrl(issuer)}. In a browser this is usually the provider refusing a cross-origin read: give \`endpoints\` directly, or resolve them on a server. (${cause instanceof Error ? cause.message : String(cause)})`,
+        typeof window === "undefined" ? (
+          // On a server nothing blocks the read: the provider is down, or the address is wrong.
+          `Could not reach the provider at ${documentUrl(issuer)}: is it running, and is the issuer right? (${why})`
+        ) : `Could not read the discovery document at ${documentUrl(issuer)}. In a browser this is usually the provider refusing a cross-origin read: give \`endpoints\` directly, or resolve them on a server. (${why})`,
         "discovery_unreachable"
       );
     }
@@ -118,6 +122,7 @@ async function discover(issuer, fetcher = fetch) {
       jwks: doc.jwks_uri,
       introspection: doc.introspection_endpoint,
       revocation: doc.revocation_endpoint,
+      checkSession: doc.check_session_iframe,
       issuer: doc.issuer ?? issuer
     };
   })();

package/dist/service.cjs

@@ -34,6 +34,7 @@ __export(service_exports, {
   paramsFromUrl: () => paramsFromUrl
 });
 module.exports = __toCommonJS(service_exports);
+var import_signal = require("@fluixi/reactive/signal");
 var import_session = require("@fluixi/session");
 var import_client = require("@fluixi/auth/client");
 
@@ -191,9 +192,11 @@ async function loadJose2() {
     );
   }
 }
-async function createDpopKey(alg = "ES256") {
+async function createDpopKey(alg = "ES256", options = {}) {
   const jose = await loadJose2();
-  const { privateKey, publicKey } = await jose.generateKeyPair(alg, { extractable: false });
+  const { privateKey, publicKey } = await jose.generateKeyPair(alg, {
+    extractable: options.extractable ?? false
+  });
   const publicJwk = { ...await jose.exportJWK(publicKey) };
   return {
     privateKey,
@@ -331,8 +334,12 @@ async function discover(issuer, fetcher = fetch) {
     try {
       response = await fetcher(documentUrl(issuer));
     } catch (cause) {
+      const why = cause instanceof Error ? cause.message : String(cause);
       throw new OAuthError(
-        `Could not read the discovery document at ${documentUrl(issuer)}. In a browser this is usually the provider refusing a cross-origin read: give \`endpoints\` directly, or resolve them on a server. (${cause instanceof Error ? cause.message : String(cause)})`,
+        typeof window === "undefined" ? (
+          // On a server nothing blocks the read: the provider is down, or the address is wrong.
+          `Could not reach the provider at ${documentUrl(issuer)}: is it running, and is the issuer right? (${why})`
+        ) : `Could not read the discovery document at ${documentUrl(issuer)}. In a browser this is usually the provider refusing a cross-origin read: give \`endpoints\` directly, or resolve them on a server. (${why})`,
         "discovery_unreachable"
       );
     }
@@ -357,6 +364,7 @@ async function discover(issuer, fetcher = fetch) {
       jwks: doc.jwks_uri,
       introspection: doc.introspection_endpoint,
       revocation: doc.revocation_endpoint,
+      checkSession: doc.check_session_iframe,
       issuer: doc.issuer ?? issuer
     };
   })();
@@ -812,6 +820,81 @@ function createServerClient(config, fetcher = fetch) {
   };
 }
 
+// src/session-monitor.ts
+var SETTLE_MS = 15e3;
+var GUARD_KEY = "fx-session-check";
+function recentlyActed() {
+  try {
+    return Date.now() - Number(sessionStorage.getItem(GUARD_KEY) ?? 0) < SETTLE_MS;
+  } catch {
+    return false;
+  }
+}
+function markActed() {
+  try {
+    sessionStorage.setItem(GUARD_KEY, String(Date.now()));
+  } catch {
+  }
+}
+function watchProviderSession(options = {}) {
+  if (typeof window === "undefined" || typeof document === "undefined") return () => {
+  };
+  const base = (options.basePath ?? "/auth").replace(/\/$/, "");
+  const fetcher = options.fetcher ?? fetch;
+  const onChange = options.onChange ?? (() => {
+    const login = new URLSearchParams({ prompt: "none", returnTo: location.pathname + location.search });
+    location.assign(`${base}/login?${login}`);
+  });
+  let stopped = false;
+  const cleanups = [];
+  const stop = () => {
+    stopped = true;
+    for (const cleanup of cleanups.splice(0)) cleanup();
+  };
+  void (async () => {
+    const check = await fetcher(`${base}/session-check`, { credentials: "same-origin" }).then((response) => response.ok ? response.json() : null).catch(() => null);
+    if (stopped || !check?.frame || !check.state) return;
+    const origin = new URL(check.frame).origin;
+    const frame = document.createElement("iframe");
+    frame.src = check.frame;
+    frame.title = "session check";
+    frame.setAttribute("aria-hidden", "true");
+    frame.tabIndex = -1;
+    frame.style.cssText = "position:absolute;width:0;height:0;border:0;visibility:hidden";
+    const message = `${check.clientId} ${check.state}`;
+    const ask = () => {
+      if (!stopped && document.visibilityState === "visible") frame.contentWindow?.postMessage(message, origin);
+    };
+    let confirmed = false;
+    const answer = (event) => {
+      if (event.origin !== origin || event.source !== frame.contentWindow) return;
+      if (event.data === "unchanged") confirmed = true;
+      else if (event.data === "changed") {
+        stop();
+        if (!confirmed && recentlyActed()) return;
+        markActed();
+        onChange();
+      } else if (event.data === "error") {
+        stop();
+      }
+    };
+    window.addEventListener("message", answer);
+    frame.addEventListener("load", ask);
+    document.addEventListener("visibilitychange", ask);
+    window.addEventListener("focus", ask);
+    const timer = setInterval(ask, options.intervalMs ?? 3e3);
+    document.body.appendChild(frame);
+    cleanups.push(() => {
+      window.removeEventListener("message", answer);
+      document.removeEventListener("visibilitychange", ask);
+      window.removeEventListener("focus", ask);
+      clearInterval(timer);
+      frame.remove();
+    });
+  })();
+  return stop;
+}
+
 // src/service.ts
 function paramsFromUrl(url) {
   const href = url ?? (typeof location === "undefined" ? null : location.href);
@@ -829,18 +912,28 @@ function clientFor(options) {
   return options.config.tokens === "server" ? createServerClient(options.config) : createBrowserClient(options.config);
 }
 function createAuthService(options) {
+  const tokens = options.config.tokens;
+  const scope = (0, import_signal.openReactiveScope)({ kind: "service", name: "AuthService", ...tokens ? { detail: `tokens: ${tokens}` } : {} });
+  const service = (0, import_signal.withReactiveScope)(scope, () => buildAuthService(options));
+  (0, import_signal.markReactiveScope)(service, scope);
+  return service;
+}
+function buildAuthService(options) {
   const client = clientFor(options);
   let latest = null;
+  const fetchUserFor = async (token) => {
+    if (options.fetchUser) return options.fetchUser(token);
+    return client.fetchUser(token === COOKIE_SESSION ? void 0 : token);
+  };
+  const resumesFromCookie = options.config.tokens === "server" && typeof window !== "undefined";
+  const [ready, setReady] = (0, import_signal.createSignal)(!resumesFromCookie);
   const session = (0, import_session.createSession)({
     /** The credential is the callback, so this is the code exchange. */
     async login(params) {
       latest = await client.handleCallback(params);
       return { token: latest.accessToken, expiresAt: latest.expiresAt };
     },
-    async fetchUser(token) {
-      if (options.fetchUser) return options.fetchUser(token);
-      return client.fetchUser(token === COOKIE_SESSION ? void 0 : token);
-    },
+    fetchUser: fetchUserFor,
     async refresh() {
       latest = await client.refresh();
       return { token: latest.accessToken, expiresAt: latest.expiresAt };
@@ -863,11 +956,27 @@ function createAuthService(options) {
   });
   const hooks = (0, import_client.createAuthHooks)({
     session,
+    ready,
     navigate: options.navigate,
     loginPath: options.loginPath ?? "/login",
     homePath: options.homePath ?? "/",
     forbiddenPath: options.forbiddenPath ?? "/403"
   });
+  if (resumesFromCookie && options.config.tokens === "server" && options.config.watchSession !== false) {
+    watchProviderSession({ basePath: options.config.basePath });
+  }
+  const renderedSignedOut = hooks.store.seeded && hooks.store.value().user == null;
+  if (resumesFromCookie && renderedSignedOut) setReady(true);
+  else if (resumesFromCookie) {
+    void (async () => {
+      try {
+        await session.adopt(COOKIE_SESSION, await fetchUserFor(COOKIE_SESSION));
+      } catch {
+      } finally {
+        setReady(true);
+      }
+    })();
+  }
   return Object.assign(session, {
     client,
     protectedRoute: hooks.protectedRoute,

package/dist/service.d.ts

@@ -1,19 +1,5 @@
-/**
- * The application-facing half.
- *
- * `AuthClient` knows the protocol. This knows the application: who is signed in, whether
- * the session is still good, when to refresh, and where to send someone who is not
- * allowed in. It is built on `@fluixi/session`, which already owns that state machine,
- * rather than a second one written here.
- *
- * The mapping onto a session adapter is the part worth explaining. `createSession`'s
- * `login(creds)` means "turn these credentials into a token". In a redirect flow the
- * credential is the authorization code on the callback URL, so `login` is the code
- * exchange and the redirect itself is a separate call that never returns. Everything
- * else lines up directly: `fetchUser`, `refresh`, `logout` and `getExpiry`.
- */
 import { type AccessControl, type Session } from '@fluixi/session';
-import { createAuthHooks } from '@fluixi/auth/client';
+import { createAuthHooks, type AuthHooksOptions } from '@fluixi/auth/client';
 import type { AuthClient, AuthConfig, CallbackParams, LoginOptions } from './types.js';
 /** The credential a redirect flow produces. */
 export type AuthCredentials = CallbackParams;
@@ -55,9 +41,7 @@ export interface AuthServiceOptions<U, P = unknown, Q = (p: P) => boolean> {
      * client-side navigation; leave it out and it assigns `location`, which reloads the
      * document and discards the reactive tree.
      */
-    navigate?: {
-        handler: () => (to: string, options?: unknown) => void;
-    };
+    navigate?: AuthHooksOptions['navigate'];
     /** Where a signed-out visitor is sent. Default `/login`. */
     loginPath?: string;
     /** Where a signed-in visitor is sent from a guest-only page. Default `/`. */

package/dist/service.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"service.d.ts","sourceRoot":"","sources":["../src/service.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"service.d.ts","sourceRoot":"","sources":["../src/service.ts"],"names":[],"mappings":"AAeA,OAAO,EAAiB,KAAK,aAAa,EAAE,KAAK,OAAO,EAAE,MAAM,iBAAiB,CAAC;AAClF,OAAO,EAAE,eAAe,EAAE,KAAK,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AAO7E,OAAO,KAAK,EAAE,UAAU,EAAE,UAAU,EAAE,cAAc,EAAE,YAAY,EAAU,MAAM,YAAY,CAAC;AAE/F,+CAA+C;AAC/C,MAAM,MAAM,eAAe,GAAG,cAAc,CAAC;AAE7C,MAAM,WAAW,kBAAkB,CAAC,CAAC,EAAE,CAAC,GAAG,OAAO,EAAE,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC,KAAK,OAAO;IACvE,mDAAmD;IACnD,MAAM,EAAE,UAAU,CAAC;IACnB;;;;;OAKG;IACH,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB;;;;;OAKG;IACH,SAAS,CAAC,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,OAAO,CAAC,CAAC,CAAC,CAAC;IAChD,+FAA+F;IAC/F,MAAM,CAAC,EAAE,aAAa,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC;IAChC,qCAAqC;IACrC,WAAW,CAAC,EAAE;QAAE,KAAK,CAAC,EAAE,MAAM,CAAC;QAAC,IAAI,CAAC,EAAE,MAAM,CAAC;QAAC,MAAM,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IACjE,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,OAAO,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,IAAI,CAAC;IAC5B,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,EAAE,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAE/C;;;;;;;OAOG;IACH,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,4DAA4D;IAC5D,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,6EAA6E;IAC7E,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,4DAA4D;IAC5D,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED;;;;;GAKG;AACH,MAAM,WAAW,WAAW,CAAC,CAAC,EAAE,CAAC,GAAG,OAAO,EAAE,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC,KAAK,OAAO,CAChE,SAAQ,OAAO,CAAC,CAAC,EAAE,eAAe,EAAE,OAAO,EAAE,CAAC,EAAE,CAAC,CAAC,EAChD,IAAI,CACF,UAAU,CAAC,OAAO,eAAe,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC,EAC3C,gBAAgB,GAAG,KAAK,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,CACxE;IACH,oFAAoF;IACpF,MAAM,CAAC,OAAO,CAAC,EAAE,YAAY,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IAC9C;;;;OAIG;IACH,QAAQ,CAAC,MAAM,CAAC,EAAE,cAAc,GAAG,OAAO,CAAC,MAAM,CAAC,CAAC;IACnD,kEAAkE;IAClE,QAAQ,CAAC,MAAM,EAAE,UAAU,CAAC;CAC7B;AAED;;;;;;;GAOG;AACH,wBAAgB,aAAa,CAAC,GAAG,CAAC,EAAE,MAAM,GAAG,GAAG,GAAG,cAAc,CAWhE;AAUD,wBAAgB,iBAAiB,CAAC,CAAC,EAAE,CAAC,GAAG,OAAO,EAAE,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC,KAAK,OAAO,EACrE,OAAO,EAAE,kBAAkB,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,GACnC,WAAW,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAStB"}

package/dist/service.js

@@ -12,12 +12,14 @@
  * exchange and the redirect itself is a separate call that never returns. Everything
  * else lines up directly: `fetchUser`, `refresh`, `logout` and `getExpiry`.
  */
+import { createSignal, markReactiveScope, openReactiveScope, withReactiveScope } from '@fluixi/reactive/signal';
 import { createSession } from '@fluixi/session';
 import { createAuthHooks } from '@fluixi/auth/client';
 import { expiryFromJwt } from './pkce.js';
 import { safeReturnTo } from './return-to.js';
 import { createBrowserClient } from './browser.js';
 import { createServerClient, COOKIE_SESSION } from './server-client.js';
+import { watchProviderSession } from './session-monitor.js';
 import { OAuthError } from './types.js';
 /**
  * The parameters on the current URL, which is what a callback route has.
@@ -48,21 +50,36 @@ function clientFor(options) {
         : createBrowserClient(options.config);
 }
 export function createAuthService(options) {
+    // One group in the devtools graph for everything the service holds: the session's `user`,
+    // `token`, `status` and the rest. Marked on the instance, so `authModule(auth)` places the
+    // group under the module that provides it.
+    const tokens = options.config.tokens;
+    const scope = openReactiveScope({ kind: 'service', name: 'AuthService', ...(tokens ? { detail: `tokens: ${tokens}` } : {}) });
+    const service = withReactiveScope(scope, () => buildAuthService(options));
+    markReactiveScope(service, scope);
+    return service;
+}
+function buildAuthService(options) {
     const client = clientFor(options);
     // Held so `getExpiry` can answer for a token the session hands back, and so a
     // server-mode session has something to report when the token is a cookie.
     let latest = null;
+    const fetchUserFor = async (token) => {
+        if (options.fetchUser)
+            return options.fetchUser(token);
+        return client.fetchUser(token === COOKIE_SESSION ? undefined : token);
+    };
+    // With the tokens on the server, the browser learns it is signed in by asking. Until it
+    // has, the hooks keep the user the server rendered with rather than showing nobody.
+    const resumesFromCookie = options.config.tokens === 'server' && typeof window !== 'undefined';
+    const [ready, setReady] = createSignal(!resumesFromCookie);
     const session = createSession({
         /** The credential is the callback, so this is the code exchange. */
         async login(params) {
             latest = await client.handleCallback(params);
             return { token: latest.accessToken, expiresAt: latest.expiresAt };
         },
-        async fetchUser(token) {
-            if (options.fetchUser)
-                return options.fetchUser(token);
-            return client.fetchUser(token === COOKIE_SESSION ? undefined : token);
-        },
+        fetchUser: fetchUserFor,
         async refresh() {
             latest = await client.refresh();
             return { token: latest.accessToken, expiresAt: latest.expiresAt };
@@ -90,11 +107,37 @@ export function createAuthService(options) {
     // rather than a second file an app has to wire up and keep in step.
     const hooks = createAuthHooks({
         session: session,
+        ready,
         navigate: options.navigate,
         loginPath: options.loginPath ?? '/login',
         homePath: options.homePath ?? '/',
         forbiddenPath: options.forbiddenPath ?? '/403',
     });
+    // The page the server rendered already says whether anyone is signed in. When it said
+    // nobody, there is no session to resume: asking would only get a 401 on every anonymous
+    // page. A client-only load has no such answer and still asks.
+    // Signed in or not, a session that changes at the provider while the page is open is
+    // noticed here rather than at the next page load.
+    if (resumesFromCookie && options.config.tokens === 'server' && options.config.watchSession !== false) {
+        watchProviderSession({ basePath: options.config.basePath });
+    }
+    const renderedSignedOut = hooks.store.seeded && hooks.store.value().user == null;
+    if (resumesFromCookie && renderedSignedOut)
+        setReady(true);
+    else if (resumesFromCookie) {
+        void (async () => {
+            try {
+                // The user first: a cookie the server no longer accepts adopts nothing.
+                await session.adopt(COOKIE_SESSION, await fetchUserFor(COOKIE_SESSION));
+            }
+            catch {
+                // Signed out after all; the hooks drop the server's user once ready.
+            }
+            finally {
+                setReady(true);
+            }
+        })();
+    }
     return Object.assign(session, {
         client,
         protectedRoute: hooks.protectedRoute,

package/dist/service.mjs

@@ -1,6 +1,7 @@
 import "./chunk-7P6ASYW6.mjs";
 
 // src/service.ts
+import { createSignal, markReactiveScope, openReactiveScope, withReactiveScope } from "@fluixi/reactive/signal";
 import { createSession } from "@fluixi/session";
 import { createAuthHooks } from "@fluixi/auth/client";
 
@@ -158,9 +159,11 @@ async function loadJose2() {
     );
   }
 }
-async function createDpopKey(alg = "ES256") {
+async function createDpopKey(alg = "ES256", options = {}) {
   const jose = await loadJose2();
-  const { privateKey, publicKey } = await jose.generateKeyPair(alg, { extractable: false });
+  const { privateKey, publicKey } = await jose.generateKeyPair(alg, {
+    extractable: options.extractable ?? false
+  });
   const publicJwk = { ...await jose.exportJWK(publicKey) };
   return {
     privateKey,
@@ -298,8 +301,12 @@ async function discover(issuer, fetcher = fetch) {
     try {
       response = await fetcher(documentUrl(issuer));
     } catch (cause) {
+      const why = cause instanceof Error ? cause.message : String(cause);
       throw new OAuthError(
-        `Could not read the discovery document at ${documentUrl(issuer)}. In a browser this is usually the provider refusing a cross-origin read: give \`endpoints\` directly, or resolve them on a server. (${cause instanceof Error ? cause.message : String(cause)})`,
+        typeof window === "undefined" ? (
+          // On a server nothing blocks the read: the provider is down, or the address is wrong.
+          `Could not reach the provider at ${documentUrl(issuer)}: is it running, and is the issuer right? (${why})`
+        ) : `Could not read the discovery document at ${documentUrl(issuer)}. In a browser this is usually the provider refusing a cross-origin read: give \`endpoints\` directly, or resolve them on a server. (${why})`,
         "discovery_unreachable"
       );
     }
@@ -324,6 +331,7 @@ async function discover(issuer, fetcher = fetch) {
       jwks: doc.jwks_uri,
       introspection: doc.introspection_endpoint,
       revocation: doc.revocation_endpoint,
+      checkSession: doc.check_session_iframe,
       issuer: doc.issuer ?? issuer
     };
   })();
@@ -779,6 +787,81 @@ function createServerClient(config, fetcher = fetch) {
   };
 }
 
+// src/session-monitor.ts
+var SETTLE_MS = 15e3;
+var GUARD_KEY = "fx-session-check";
+function recentlyActed() {
+  try {
+    return Date.now() - Number(sessionStorage.getItem(GUARD_KEY) ?? 0) < SETTLE_MS;
+  } catch {
+    return false;
+  }
+}
+function markActed() {
+  try {
+    sessionStorage.setItem(GUARD_KEY, String(Date.now()));
+  } catch {
+  }
+}
+function watchProviderSession(options = {}) {
+  if (typeof window === "undefined" || typeof document === "undefined") return () => {
+  };
+  const base = (options.basePath ?? "/auth").replace(/\/$/, "");
+  const fetcher = options.fetcher ?? fetch;
+  const onChange = options.onChange ?? (() => {
+    const login = new URLSearchParams({ prompt: "none", returnTo: location.pathname + location.search });
+    location.assign(`${base}/login?${login}`);
+  });
+  let stopped = false;
+  const cleanups = [];
+  const stop = () => {
+    stopped = true;
+    for (const cleanup of cleanups.splice(0)) cleanup();
+  };
+  void (async () => {
+    const check = await fetcher(`${base}/session-check`, { credentials: "same-origin" }).then((response) => response.ok ? response.json() : null).catch(() => null);
+    if (stopped || !check?.frame || !check.state) return;
+    const origin = new URL(check.frame).origin;
+    const frame = document.createElement("iframe");
+    frame.src = check.frame;
+    frame.title = "session check";
+    frame.setAttribute("aria-hidden", "true");
+    frame.tabIndex = -1;
+    frame.style.cssText = "position:absolute;width:0;height:0;border:0;visibility:hidden";
+    const message = `${check.clientId} ${check.state}`;
+    const ask = () => {
+      if (!stopped && document.visibilityState === "visible") frame.contentWindow?.postMessage(message, origin);
+    };
+    let confirmed = false;
+    const answer = (event) => {
+      if (event.origin !== origin || event.source !== frame.contentWindow) return;
+      if (event.data === "unchanged") confirmed = true;
+      else if (event.data === "changed") {
+        stop();
+        if (!confirmed && recentlyActed()) return;
+        markActed();
+        onChange();
+      } else if (event.data === "error") {
+        stop();
+      }
+    };
+    window.addEventListener("message", answer);
+    frame.addEventListener("load", ask);
+    document.addEventListener("visibilitychange", ask);
+    window.addEventListener("focus", ask);
+    const timer = setInterval(ask, options.intervalMs ?? 3e3);
+    document.body.appendChild(frame);
+    cleanups.push(() => {
+      window.removeEventListener("message", answer);
+      document.removeEventListener("visibilitychange", ask);
+      window.removeEventListener("focus", ask);
+      clearInterval(timer);
+      frame.remove();
+    });
+  })();
+  return stop;
+}
+
 // src/service.ts
 function paramsFromUrl(url) {
   const href = url ?? (typeof location === "undefined" ? null : location.href);
@@ -796,18 +879,28 @@ function clientFor(options) {
   return options.config.tokens === "server" ? createServerClient(options.config) : createBrowserClient(options.config);
 }
 function createAuthService(options) {
+  const tokens = options.config.tokens;
+  const scope = openReactiveScope({ kind: "service", name: "AuthService", ...tokens ? { detail: `tokens: ${tokens}` } : {} });
+  const service = withReactiveScope(scope, () => buildAuthService(options));
+  markReactiveScope(service, scope);
+  return service;
+}
+function buildAuthService(options) {
   const client = clientFor(options);
   let latest = null;
+  const fetchUserFor = async (token) => {
+    if (options.fetchUser) return options.fetchUser(token);
+    return client.fetchUser(token === COOKIE_SESSION ? void 0 : token);
+  };
+  const resumesFromCookie = options.config.tokens === "server" && typeof window !== "undefined";
+  const [ready, setReady] = createSignal(!resumesFromCookie);
   const session = createSession({
     /** The credential is the callback, so this is the code exchange. */
     async login(params) {
       latest = await client.handleCallback(params);
       return { token: latest.accessToken, expiresAt: latest.expiresAt };
     },
-    async fetchUser(token) {
-      if (options.fetchUser) return options.fetchUser(token);
-      return client.fetchUser(token === COOKIE_SESSION ? void 0 : token);
-    },
+    fetchUser: fetchUserFor,
     async refresh() {
       latest = await client.refresh();
       return { token: latest.accessToken, expiresAt: latest.expiresAt };
@@ -830,11 +923,27 @@ function createAuthService(options) {
   });
   const hooks = createAuthHooks({
     session,
+    ready,
     navigate: options.navigate,
     loginPath: options.loginPath ?? "/login",
     homePath: options.homePath ?? "/",
     forbiddenPath: options.forbiddenPath ?? "/403"
   });
+  if (resumesFromCookie && options.config.tokens === "server" && options.config.watchSession !== false) {
+    watchProviderSession({ basePath: options.config.basePath });
+  }
+  const renderedSignedOut = hooks.store.seeded && hooks.store.value().user == null;
+  if (resumesFromCookie && renderedSignedOut) setReady(true);
+  else if (resumesFromCookie) {
+    void (async () => {
+      try {
+        await session.adopt(COOKIE_SESSION, await fetchUserFor(COOKIE_SESSION));
+      } catch {
+      } finally {
+        setReady(true);
+      }
+    })();
+  }
   return Object.assign(session, {
     client,
     protectedRoute: hooks.protectedRoute,

package/dist/session-monitor.cjs

@@ -0,0 +1,98 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/session-monitor.ts
+var session_monitor_exports = {};
+__export(session_monitor_exports, {
+  watchProviderSession: () => watchProviderSession
+});
+module.exports = __toCommonJS(session_monitor_exports);
+var SETTLE_MS = 15e3;
+var GUARD_KEY = "fx-session-check";
+function recentlyActed() {
+  try {
+    return Date.now() - Number(sessionStorage.getItem(GUARD_KEY) ?? 0) < SETTLE_MS;
+  } catch {
+    return false;
+  }
+}
+function markActed() {
+  try {
+    sessionStorage.setItem(GUARD_KEY, String(Date.now()));
+  } catch {
+  }
+}
+function watchProviderSession(options = {}) {
+  if (typeof window === "undefined" || typeof document === "undefined") return () => {
+  };
+  const base = (options.basePath ?? "/auth").replace(/\/$/, "");
+  const fetcher = options.fetcher ?? fetch;
+  const onChange = options.onChange ?? (() => {
+    const login = new URLSearchParams({ prompt: "none", returnTo: location.pathname + location.search });
+    location.assign(`${base}/login?${login}`);
+  });
+  let stopped = false;
+  const cleanups = [];
+  const stop = () => {
+    stopped = true;
+    for (const cleanup of cleanups.splice(0)) cleanup();
+  };
+  void (async () => {
+    const check = await fetcher(`${base}/session-check`, { credentials: "same-origin" }).then((response) => response.ok ? response.json() : null).catch(() => null);
+    if (stopped || !check?.frame || !check.state) return;
+    const origin = new URL(check.frame).origin;
+    const frame = document.createElement("iframe");
+    frame.src = check.frame;
+    frame.title = "session check";
+    frame.setAttribute("aria-hidden", "true");
+    frame.tabIndex = -1;
+    frame.style.cssText = "position:absolute;width:0;height:0;border:0;visibility:hidden";
+    const message = `${check.clientId} ${check.state}`;
+    const ask = () => {
+      if (!stopped && document.visibilityState === "visible") frame.contentWindow?.postMessage(message, origin);
+    };
+    let confirmed = false;
+    const answer = (event) => {
+      if (event.origin !== origin || event.source !== frame.contentWindow) return;
+      if (event.data === "unchanged") confirmed = true;
+      else if (event.data === "changed") {
+        stop();
+        if (!confirmed && recentlyActed()) return;
+        markActed();
+        onChange();
+      } else if (event.data === "error") {
+        stop();
+      }
+    };
+    window.addEventListener("message", answer);
+    frame.addEventListener("load", ask);
+    document.addEventListener("visibilitychange", ask);
+    window.addEventListener("focus", ask);
+    const timer = setInterval(ask, options.intervalMs ?? 3e3);
+    document.body.appendChild(frame);
+    cleanups.push(() => {
+      window.removeEventListener("message", answer);
+      document.removeEventListener("visibilitychange", ask);
+      window.removeEventListener("focus", ask);
+      clearInterval(timer);
+      frame.remove();
+    });
+  })();
+  return stop;
+}