@spidy092/auth-client 3.0.9 → 3.1.0

package/dist/react/PreferencesProvider.cjs

@@ -0,0 +1,621 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+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 __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// react/PreferencesProvider.jsx
+var PreferencesProvider_exports = {};
+__export(PreferencesProvider_exports, {
+  PreferencesProvider: () => PreferencesProvider,
+  usePreferences: () => usePreferences
+});
+module.exports = __toCommonJS(PreferencesProvider_exports);
+var import_react = __toESM(require("react"), 1);
+
+// api.js
+var import_axios = __toESM(require("axios"), 1);
+
+// token.js
+var import_jwt_decode = require("jwt-decode");
+var accessToken = null;
+var listeners = /* @__PURE__ */ new Set();
+var REFRESH_COOKIE = "account_refresh_token";
+var COOKIE_MAX_AGE = 7 * 24 * 60 * 60;
+function secureAttribute() {
+  var _a;
+  try {
+    return typeof window !== "undefined" && ((_a = window.location) == null ? void 0 : _a.protocol) === "https:" ? "; Secure" : "";
+  } catch (err) {
+    return "";
+  }
+}
+function writeAccessToken(token) {
+  if (!token) {
+    try {
+      localStorage.removeItem("authToken");
+    } catch (err) {
+      console.warn("Could not clear token from localStorage:", err);
+    }
+    return;
+  }
+  try {
+    localStorage.setItem("authToken", token);
+  } catch (err) {
+    console.warn("Could not persist token to localStorage:", err);
+  }
+}
+function readAccessToken() {
+  try {
+    return localStorage.getItem("authToken");
+  } catch (err) {
+    console.warn("Could not read token from localStorage:", err);
+    return null;
+  }
+}
+function setToken(token) {
+  const previousToken = accessToken;
+  accessToken = token || null;
+  writeAccessToken(accessToken);
+  if (previousToken !== accessToken) {
+    listeners.forEach((listener) => {
+      try {
+        listener(accessToken, previousToken);
+      } catch (err) {
+        console.warn("Token listener error:", err);
+      }
+    });
+  }
+}
+function getToken() {
+  if (accessToken) return accessToken;
+  accessToken = readAccessToken();
+  return accessToken;
+}
+function clearToken() {
+  if (!accessToken) {
+    writeAccessToken(null);
+    clearRefreshToken();
+    return;
+  }
+  const previousToken = accessToken;
+  accessToken = null;
+  writeAccessToken(null);
+  clearRefreshToken();
+  listeners.forEach((listener) => {
+    try {
+      listener(null, previousToken);
+    } catch (err) {
+      console.warn("Token listener error:", err);
+    }
+  });
+}
+var REFRESH_TOKEN_KEY = "auth_refresh_token";
+var _persistRefreshToken = false;
+function shouldUseLocalStorage() {
+  var _a;
+  if (_persistRefreshToken) return true;
+  try {
+    return typeof window !== "undefined" && ((_a = window.location) == null ? void 0 : _a.protocol) === "http:";
+  } catch (err) {
+    return false;
+  }
+}
+function setRefreshToken(token) {
+  if (!token) {
+    clearRefreshToken();
+    return;
+  }
+  if (shouldUseLocalStorage()) {
+    try {
+      localStorage.setItem(REFRESH_TOKEN_KEY, token);
+      console.log(`\u{1F4E6} Refresh token stored in localStorage (${_persistRefreshToken ? "persistence enabled" : "HTTP dev mode"})`);
+    } catch (err) {
+      console.warn("Could not store refresh token:", err);
+    }
+  } else {
+    console.log("\u{1F512} Refresh token managed by server httpOnly cookie (production mode)");
+  }
+}
+function getRefreshToken() {
+  if (shouldUseLocalStorage()) {
+    try {
+      const token = localStorage.getItem(REFRESH_TOKEN_KEY);
+      return token;
+    } catch (err) {
+      console.warn("Could not read refresh token:", err);
+      return null;
+    }
+  }
+  return null;
+}
+function clearRefreshToken() {
+  try {
+    localStorage.removeItem(REFRESH_TOKEN_KEY);
+  } catch (err) {
+  }
+  try {
+    document.cookie = `${REFRESH_COOKIE}=; Path=/; SameSite=Strict${secureAttribute()}; Expires=Thu, 01 Jan 1970 00:00:00 GMT`;
+  } catch (err) {
+    console.warn("Could not clear refresh token cookie:", err);
+  }
+  try {
+    sessionStorage.removeItem(REFRESH_COOKIE);
+  } catch (err) {
+  }
+}
+if (typeof window !== "undefined" && window.addEventListener) {
+  window.addEventListener("storage", (event) => {
+    if (event.key !== "authToken") return;
+    const previousToken = accessToken;
+    accessToken = event.newValue || null;
+    if (previousToken === accessToken) return;
+    listeners.forEach((listener) => {
+      try {
+        listener(accessToken, previousToken);
+      } catch (err) {
+        console.warn("Token listener error:", err);
+      }
+    });
+  });
+}
+
+// config.js
+var config = {
+  clientKey: null,
+  authBaseUrl: null,
+  redirectUri: null,
+  accountUiUrl: null,
+  isRouter: false,
+  // ✅ Add router flag
+  // ========== SESSION SECURITY SETTINGS ==========
+  // Buffer time (in seconds) before token expiry to trigger proactive refresh
+  // With 5-minute access tokens, refreshing 60s before expiry ensures seamless UX
+  tokenRefreshBuffer: 60,
+  // Interval (in milliseconds) for periodic session validation
+  // Validates that the session still exists in Keycloak (not deleted by admin)
+  // Default: 15 minutes (900000ms) - Increased from 2m to avoid frequent checks
+  sessionValidationInterval: 15 * 60 * 1e3,
+  // Enable/disable periodic session validation
+  // When enabled, the client will ping the server to verify session is still active
+  enableSessionValidation: true,
+  // Enable/disable proactive token refresh
+  // When enabled, tokens are refreshed before they expire (using tokenRefreshBuffer)
+  enableProactiveRefresh: true,
+  // Validate session when browser tab becomes visible again
+  // Catches session deletions that happened while the tab was inactive
+  validateOnVisibility: true,
+  // ========== REFRESH TOKEN PERSISTENCE ==========
+  // When true, stores refresh token in localStorage even on HTTPS
+  // Required for local dev with mkcert/self-signed certs where httpOnly cookies
+  // may not work reliably across origins
+  // ⚠️ In true production, set to false and rely on httpOnly cookies
+  persistRefreshToken: false
+};
+function getConfig() {
+  return { ...config };
+}
+function isRouterMode() {
+  return config.isRouter;
+}
+
+// diagnostics.js
+var STORAGE_KEY = "auth_diagnostic_context";
+var randomId = () => {
+  var _a;
+  if ((_a = globalThis.crypto) == null ? void 0 : _a.randomUUID) return globalThis.crypto.randomUUID();
+  return `auth-${Date.now()}-${Math.random().toString(36).slice(2)}`;
+};
+var fingerprint = async (value) => {
+  var _a;
+  if (!value || !((_a = globalThis.crypto) == null ? void 0 : _a.subtle)) return null;
+  const bytes = new TextEncoder().encode(String(value));
+  const digest = await globalThis.crypto.subtle.digest("SHA-256", bytes);
+  return [...new Uint8Array(digest)].slice(0, 6).map((byte) => byte.toString(16).padStart(2, "0")).join("");
+};
+function getDiagnosticContext() {
+  try {
+    const existing = JSON.parse(sessionStorage.getItem(STORAGE_KEY) || "null");
+    if (existing == null ? void 0 : existing.correlationId) return existing;
+  } catch {
+  }
+  const context = { correlationId: randomId(), startedAt: Date.now() };
+  try {
+    sessionStorage.setItem(STORAGE_KEY, JSON.stringify(context));
+  } catch {
+  }
+  return context;
+}
+function diagnosticHeaders() {
+  const { correlationId } = getDiagnosticContext();
+  return { "X-Correlation-ID": correlationId, "X-Request-ID": correlationId };
+}
+async function emitAuthDiagnostic(event, outcome, reasonCode, details = {}) {
+  const context = getDiagnosticContext();
+  const safe = {
+    eventType: "auth_client_diagnostic",
+    event,
+    outcome,
+    reasonCode,
+    correlationId: context.correlationId,
+    elapsedMs: Date.now() - context.startedAt,
+    clientKey: details.clientKey || null,
+    status: details.status || null,
+    stateFingerprint: await fingerprint(details.state),
+    online: typeof navigator === "undefined" ? null : navigator.onLine
+  };
+  const method = outcome === "FAILURE" ? "error" : outcome === "WARNING" ? "warn" : "info";
+  console[method]("[auth-client]", safe);
+  return safe;
+}
+
+// core.js
+var refreshInProgress = false;
+var refreshPromise = null;
+async function refreshToken() {
+  const { clientKey, authBaseUrl } = getConfig();
+  if (refreshInProgress && refreshPromise) {
+    console.log("\u{1F504} Token refresh already in progress, waiting...");
+    return refreshPromise;
+  }
+  refreshInProgress = true;
+  refreshPromise = (async () => {
+    var _a, _b, _c, _d, _e, _f;
+    try {
+      const storedRefreshToken = getRefreshToken();
+      console.log("\u{1F504} Refreshing token:", {
+        clientKey,
+        mode: isRouterMode() ? "ROUTER" : "CLIENT",
+        hasStoredRefreshToken: !!storedRefreshToken
+      });
+      const requestOptions = {
+        method: "POST",
+        credentials: "include",
+        // ✅ Include httpOnly cookies (for HTTPS)
+        headers: {
+          ...diagnosticHeaders(),
+          "Content-Type": "application/json"
+        }
+      };
+      if (storedRefreshToken) {
+        requestOptions.body = JSON.stringify({ refreshToken: storedRefreshToken });
+        console.log("\u{1F4E6} Sending refresh token in body only (Header skipped) v3.0.2");
+      }
+      const response = await fetch(`${authBaseUrl}/refresh/${clientKey}`, requestOptions);
+      if (!response.ok) {
+        const errorText = await response.text();
+        let serverCode = null;
+        try {
+          serverCode = ((_a = JSON.parse(errorText)) == null ? void 0 : _a.error) || ((_b = JSON.parse(errorText)) == null ? void 0 : _b.code);
+        } catch {
+        }
+        emitAuthDiagnostic("TOKEN_REFRESH_REJECTED", "FAILURE", serverCode || `HTTP_${response.status}`, {
+          clientKey,
+          status: response.status
+        });
+        const refreshError = new Error(`Refresh failed: ${response.status}`);
+        refreshError.code = serverCode || `HTTP_${response.status}`;
+        refreshError.status = response.status;
+        throw refreshError;
+      }
+      const data = await response.json();
+      const { access_token, refresh_token: new_refresh_token } = data;
+      if (!access_token) {
+        throw new Error("No access token in refresh response");
+      }
+      setToken(access_token);
+      if (new_refresh_token) {
+        setRefreshToken(new_refresh_token);
+        console.log("\u{1F504} New refresh token stored from rotation");
+      }
+      console.log("\u2705 Token refresh successful, listeners notified");
+      emitAuthDiagnostic("TOKEN_REFRESH_COMPLETED", "SUCCESS", "NONE", { clientKey });
+      return access_token;
+    } catch (err) {
+      console.error("\u274C Token refresh error:", err);
+      const isAuthRejection = ((_c = err.message) == null ? void 0 : _c.includes("401")) || ((_d = err.message) == null ? void 0 : _d.includes("403")) || ((_e = err.message) == null ? void 0 : _e.includes("invalid_grant")) || ((_f = err.message) == null ? void 0 : _f.includes("Refresh failed: 4"));
+      if (isAuthRejection) {
+        clearToken();
+        clearRefreshToken();
+      }
+      throw err;
+    } finally {
+      refreshInProgress = false;
+      refreshPromise = null;
+    }
+  })();
+  return refreshPromise;
+}
+
+// api.js
+var api = import_axios.default.create({
+  withCredentials: true
+});
+api.interceptors.request.use((config2) => {
+  const runtimeConfig = getConfig();
+  if (!config2.baseURL) {
+    config2.baseURL = (runtimeConfig == null ? void 0 : runtimeConfig.authBaseUrl) || "http://auth.local.test:4000/auth";
+  }
+  if (!config2.headers) {
+    config2.headers = {};
+  }
+  if ((runtimeConfig == null ? void 0 : runtimeConfig.clientKey) && !config2.headers["X-Client-Key"]) {
+    config2.headers["X-Client-Key"] = runtimeConfig.clientKey;
+  }
+  Object.assign(config2.headers, diagnosticHeaders());
+  const token = getToken();
+  if (token) {
+    config2.headers.Authorization = `Bearer ${token}`;
+  }
+  return config2;
+});
+var refreshPromise2 = null;
+api.interceptors.response.use(
+  (response) => response,
+  async (error) => {
+    const { response, config: config2 } = error || {};
+    if (!response || !config2) {
+      return Promise.reject(error);
+    }
+    if (response.status !== 401 || config2._retry) {
+      return Promise.reject(error);
+    }
+    config2._retry = true;
+    emitAuthDiagnostic("API_401_REFRESH_STARTED", "PENDING", "HTTP_401", {
+      clientKey: getConfig().clientKey,
+      status: 401
+    });
+    if (!refreshPromise2) {
+      refreshPromise2 = refreshToken().then((newToken) => {
+        refreshPromise2 = null;
+        if (newToken) {
+          setToken(newToken);
+        }
+        return newToken;
+      }).catch((refreshError) => {
+        refreshPromise2 = null;
+        throw refreshError;
+      });
+    }
+    try {
+      const refreshedToken = await refreshPromise2;
+      if (refreshedToken) {
+        config2.headers.Authorization = `Bearer ${refreshedToken}`;
+        return api(config2);
+      }
+    } catch (refreshErr) {
+      return Promise.reject(error);
+    }
+    return Promise.reject(error);
+  }
+);
+api.validateSession = async () => {
+  var _a;
+  try {
+    const response = await api.get("/account/validate-session");
+    return response.data.valid;
+  } catch (err) {
+    if (((_a = err.response) == null ? void 0 : _a.status) === 401) {
+      return false;
+    }
+    throw err;
+  }
+};
+var api_default = api;
+
+// preferences.js
+var PREFERENCE_DEFAULTS = Object.freeze({
+  theme: "system",
+  colorScheme: "blue",
+  density: "comfortable",
+  reducedMotion: false,
+  language: "en",
+  timezone: "Etc/UTC",
+  dateFormat: "MM/DD/YYYY",
+  timeFormat: "12h",
+  highContrast: false,
+  largeText: false
+});
+var ALLOWED = {
+  theme: /* @__PURE__ */ new Set(["light", "dark", "system"]),
+  density: /* @__PURE__ */ new Set(["compact", "comfortable", "spacious"]),
+  timeFormat: /* @__PURE__ */ new Set(["12h", "24h"])
+};
+var listeners2 = /* @__PURE__ */ new Set();
+var cachedPreferences = null;
+var pendingRequest = null;
+var syncCleanup = null;
+function extractResponseData(response) {
+  var _a;
+  return ((_a = response == null ? void 0 : response.data) == null ? void 0 : _a.data) ?? (response == null ? void 0 : response.data) ?? response ?? {};
+}
+function normalizePreferences(value = {}) {
+  const next = { ...PREFERENCE_DEFAULTS };
+  for (const key of Object.keys(PREFERENCE_DEFAULTS)) {
+    if (!Object.hasOwn(value, key)) continue;
+    const candidate = value[key];
+    if (ALLOWED[key] && !ALLOWED[key].has(candidate)) continue;
+    if (typeof PREFERENCE_DEFAULTS[key] !== typeof candidate) continue;
+    next[key] = candidate;
+  }
+  return next;
+}
+function resolveTheme(theme, matchMedia2 = globalThis.matchMedia) {
+  if (theme === "dark" || theme === "light") return theme;
+  return typeof matchMedia2 === "function" && matchMedia2("(prefers-color-scheme: dark)").matches ? "dark" : "light";
+}
+function announce(preferences) {
+  cachedPreferences = normalizePreferences(preferences);
+  listeners2.forEach((listener) => listener(cachedPreferences));
+  return cachedPreferences;
+}
+async function getPreferences({ force = false } = {}) {
+  if (cachedPreferences && !force) return cachedPreferences;
+  if (pendingRequest) return pendingRequest;
+  pendingRequest = api_default.get("/account/preferences").then((response) => announce(extractResponseData(response))).finally(() => {
+    pendingRequest = null;
+  });
+  return pendingRequest;
+}
+async function updatePreferences(patch) {
+  const allowedPatch = {};
+  for (const key of Object.keys(PREFERENCE_DEFAULTS)) {
+    if (Object.hasOwn(patch, key)) allowedPatch[key] = patch[key];
+  }
+  const candidate = normalizePreferences({ ...cachedPreferences || PREFERENCE_DEFAULTS, ...allowedPatch });
+  const response = await api_default.put("/account/preferences", allowedPatch);
+  const saved = extractResponseData(response);
+  return announce(Object.keys(saved).length ? saved : candidate);
+}
+function subscribePreferences(listener) {
+  listeners2.add(listener);
+  if (cachedPreferences) listener(cachedPreferences);
+  return () => listeners2.delete(listener);
+}
+function applyPreferences(preferences, documentRef = globalThis.document) {
+  var _a, _b, _c;
+  if (!(documentRef == null ? void 0 : documentRef.documentElement)) return;
+  const value = normalizePreferences(preferences);
+  const root = documentRef.documentElement;
+  const resolvedTheme = resolveTheme(value.theme, (_b = (_a = documentRef.defaultView) == null ? void 0 : _a.matchMedia) == null ? void 0 : _b.bind(documentRef.defaultView));
+  root.dataset.theme = resolvedTheme;
+  root.dataset.themePreference = value.theme;
+  root.dataset.colorScheme = value.colorScheme;
+  root.dataset.density = value.density;
+  root.lang = value.language;
+  root.style.colorScheme = resolvedTheme;
+  root.style.setProperty("--user-accent-color", {
+    blue: "#1976d2",
+    green: "#2e7d32",
+    purple: "#7b1fa2",
+    orange: "#c65d00",
+    red: "#c62828"
+  }[value.colorScheme] || "#1976d2");
+  root.classList.toggle("user-reduced-motion", value.reducedMotion);
+  root.classList.toggle("user-high-contrast", value.highContrast);
+  root.classList.toggle("user-large-text", value.largeText);
+  const styleId = "sso-user-preference-styles";
+  if (!documentRef.getElementById(styleId)) {
+    const style = documentRef.createElement("style");
+    style.id = styleId;
+    style.textContent = `
+      html.user-large-text { font-size: 112.5%; }
+      html.user-high-contrast { filter: contrast(1.15); }
+      html[data-density="compact"] { --user-density-padding: 6px; }
+      html[data-density="comfortable"] { --user-density-padding: 10px; }
+      html[data-density="spacious"] { --user-density-padding: 14px; }
+      html[data-density] .MuiListItem-root { padding-top: var(--user-density-padding); padding-bottom: var(--user-density-padding); }
+      html.user-reduced-motion *, html.user-reduced-motion *::before, html.user-reduced-motion *::after {
+        animation-duration: 0.01ms !important;
+        animation-iteration-count: 1 !important;
+        scroll-behavior: auto !important;
+        transition-duration: 0.01ms !important;
+      }
+    `;
+    (_c = documentRef.head) == null ? void 0 : _c.appendChild(style);
+  }
+}
+function startPreferenceSync({ refreshOnFocus = true } = {}) {
+  var _a, _b;
+  if (syncCleanup || typeof globalThis.addEventListener !== "function") return syncCleanup || (() => {
+  });
+  const refresh = () => {
+    if (!globalThis.document || globalThis.document.visibilityState === "visible") {
+      getPreferences({ force: true }).catch(() => {
+      });
+    }
+  };
+  const onVisibility = () => refresh();
+  (_b = (_a = globalThis.document) == null ? void 0 : _a.addEventListener) == null ? void 0 : _b.call(_a, "visibilitychange", onVisibility);
+  if (refreshOnFocus) globalThis.addEventListener("focus", refresh);
+  syncCleanup = () => {
+    var _a2, _b2;
+    (_b2 = (_a2 = globalThis.document) == null ? void 0 : _a2.removeEventListener) == null ? void 0 : _b2.call(_a2, "visibilitychange", onVisibility);
+    if (refreshOnFocus) globalThis.removeEventListener("focus", refresh);
+    syncCleanup = null;
+  };
+  return syncCleanup;
+}
+
+// react/PreferencesProvider.jsx
+var PreferencesContext = (0, import_react.createContext)(null);
+function PreferencesProvider({ children, initialPreferences, applyToDocument = true }) {
+  const [preferences, setPreferences] = (0, import_react.useState)(() => ({
+    ...PREFERENCE_DEFAULTS,
+    ...initialPreferences
+  }));
+  const [loading, setLoading] = (0, import_react.useState)(true);
+  const [error, setError] = (0, import_react.useState)(null);
+  (0, import_react.useEffect)(() => {
+    const unsubscribe = subscribePreferences((next) => {
+      setPreferences(next);
+      setLoading(false);
+      setError(null);
+    });
+    const stopSync = startPreferenceSync();
+    getPreferences().catch((nextError) => {
+      setError(nextError);
+      setLoading(false);
+    });
+    return () => {
+      unsubscribe();
+      stopSync();
+    };
+  }, []);
+  (0, import_react.useEffect)(() => {
+    if (applyToDocument) applyPreferences(preferences);
+  }, [applyToDocument, preferences]);
+  (0, import_react.useEffect)(() => {
+    var _a;
+    if (preferences.theme !== "system" || typeof matchMedia !== "function") return void 0;
+    const media = matchMedia("(prefers-color-scheme: dark)");
+    const applySystemTheme = () => applyPreferences(preferences);
+    (_a = media.addEventListener) == null ? void 0 : _a.call(media, "change", applySystemTheme);
+    return () => {
+      var _a2;
+      return (_a2 = media.removeEventListener) == null ? void 0 : _a2.call(media, "change", applySystemTheme);
+    };
+  }, [preferences]);
+  const value = (0, import_react.useMemo)(() => ({
+    preferences,
+    resolvedTheme: resolveTheme(preferences.theme),
+    loading,
+    error,
+    refresh: () => getPreferences({ force: true }),
+    update: updatePreferences
+  }), [error, loading, preferences]);
+  return /* @__PURE__ */ import_react.default.createElement(PreferencesContext.Provider, { value }, children);
+}
+function usePreferences() {
+  const context = (0, import_react.useContext)(PreferencesContext);
+  if (!context) throw new Error("usePreferences must be used within a PreferencesProvider");
+  return context;
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  PreferencesProvider,
+  usePreferences
+});
+//# sourceMappingURL=PreferencesProvider.cjs.map