central-auth-js-sdk 1.0.13 → 1.2.0

package/core/oauth-redirect.js

@@ -0,0 +1,106 @@
+/**
+ * Shared OAuth redirect handling for login and signup flows.
+ * Backend 302-redirects to redirect_uri with query params after Google/Microsoft auth.
+ */
+
+export const OAUTH_PARAM_KEYS = [
+  'success', 'provider', 'token', 'login_token', 'two_factor_required', 'fr_token',
+  'fr_token_expires_in_s', 'next_step', 'message', 'user_id', 'email', 'entity_domain', 'error',
+];
+
+export const OAUTH_PENDING_CLASS = 'central-auth-oauth-pending';
+
+/** @returns {boolean} True when the URL looks like an OAuth redirect callback */
+export function hasOAuthRedirect() {
+  if (typeof window === 'undefined' || !window.location) return false;
+  const params = new URLSearchParams(window.location.search);
+  return params.has('provider')
+    || params.has('login_token')
+    || params.has('token')
+    || params.has('success');
+}
+
+/**
+ * Parse OAuth redirect query params.
+ * @returns {Object|null} Parsed redirect payload
+ */
+export function parseOAuthRedirect() {
+  if (!hasOAuthRedirect()) return null;
+
+  const params = new URLSearchParams(window.location.search);
+  const provider = (params.get('provider') || '').toLowerCase();
+  const hasProvider = provider === 'google' || provider === 'microsoft';
+  const loginToken = params.get('login_token');
+  const token = params.get('token');
+  const successParam = params.get('success');
+  const error = params.get('error');
+  const nextStep = (params.get('next_step') || '').toUpperCase();
+
+  const shared = {
+    provider: hasProvider ? provider : 'google',
+    email: params.get('email'),
+    userId: params.get('user_id'),
+    entityDomain: params.get('entity_domain'),
+    message: params.get('message'),
+    nextStep,
+  };
+
+  if (successParam === 'false' || error) {
+    return { ...shared, kind: 'error', error: error || 'Login failed' };
+  }
+
+  const twoFactorRaw = params.get('two_factor_required');
+  const twoFactorRequired = twoFactorRaw === 'true' || twoFactorRaw === '1' || nextStep === 'FR_VERIFICATION';
+
+  if (loginToken) {
+    return {
+      ...shared,
+      kind: 'pending',
+      loginToken,
+      twoFactorRequired,
+      frToken: params.get('fr_token') || null,
+      frTokenExpiresInS: params.get('fr_token_expires_in_s') || null,
+    };
+  }
+
+  if (token) {
+    return { ...shared, kind: 'complete', token };
+  }
+
+  return null;
+}
+
+/** @param {ReturnType<parseOAuthRedirect>} redirect */
+export function getOAuthRedirectFlowType(redirect) {
+  if (!redirect) return null;
+  if (redirect.nextStep === 'FR_ENROLLMENT' || redirect.nextStep === 'MOBILE_VERIFICATION') {
+    return 'signup';
+  }
+  return 'login';
+}
+
+/** Remove OAuth params from the URL without reloading */
+export function clearOAuthRedirectParams() {
+  if (typeof window === 'undefined' || !window.history) return;
+  const params = new URLSearchParams(window.location.search);
+  OAUTH_PARAM_KEYS.forEach((key) => params.delete(key));
+  const clean = params.toString();
+  const url = window.location.pathname + (clean ? '?' + clean : '') + window.location.hash;
+  window.history.replaceState({}, '', url);
+}
+
+/**
+ * Mark the document while OAuth resume is pending (reduces parent-app flash).
+ * Parent apps can hide main UI with:
+ *   html.central-auth-oauth-pending [data-central-auth-main] { display: none !important; }
+ *   html.central-auth-oauth-pending [data-central-auth-sdk] { display: block !important; }
+ */
+export function markOAuthRedirectPending() {
+  if (!hasOAuthRedirect() || typeof document === 'undefined') return;
+  document.documentElement.classList.add(OAUTH_PENDING_CLASS);
+}
+
+export function clearOAuthRedirectPendingMark() {
+  if (typeof document === 'undefined') return;
+  document.documentElement.classList.remove(OAUTH_PENDING_CLASS);
+}

package/index.js

@@ -4,17 +4,31 @@
  * APIs wired to Central Auth (central_auth_collection.json)
  *
  * Public API for host applications:
- *   initializeAuth(config) — set default configuration
+ *   initializeAuth(config) — set default configuration (+ auto-resume OAuth when configured)
  *   startSignup(config)    — run sign-up flow in a container
- *   startLogin(config)    — run login flow in a container
+ *   startLogin(config)       — run login flow in a container
+ *   autoResumeOAuthFlow(config) — mount login/signup after OAuth redirect (no-op otherwise)
  *
  * Lower-level: mount (signup), mountLogin (login)
  */
 
+import { markOAuthRedirectPending } from './core/oauth-redirect.js';
+
+markOAuthRedirectPending();
+
 export { mount } from './signup.js';
 export { FlowController, STEPS } from './core/flow.js';
 export { StateManager } from './core/state.js';
 export { createApi, dataUrlToFile, base64ToFile } from './core/api.js';
 export { mountLogin } from './login.js';
-export { initializeAuth, startSignup, startLogin } from './auth.js';
+export { initializeAuth, startSignup, startLogin, autoResumeOAuthFlow } from './auth.js';
 export { applyTheme, THEME_PRESETS } from './theme.js';
+export {
+  hasOAuthRedirect,
+  hasOAuthRedirect as hasPendingOAuthRedirect,
+  parseOAuthRedirect,
+  getOAuthRedirectFlowType,
+  markOAuthRedirectPending,
+  clearOAuthRedirectPendingMark,
+  OAUTH_PENDING_CLASS,
+} from './core/oauth-redirect.js';

package/login.js

@@ -8,29 +8,24 @@ import { resolveApiBaseUrl } from './core/env-config.js';
 import { normalizeLoginConfig, getEnabledLoginMethods, LOGIN_METHODS } from './core/login-config.js';
 import { LoginFlowController, LOGIN_STEPS } from './core/login-flow.js';
 import { LoginStateManager } from './core/login-state.js';
+import { parseOAuthRedirect, clearOAuthRedirectParams, clearOAuthRedirectPendingMark } from './core/oauth-redirect.js';
 import { createLayout } from './ui/layout.js';
 import { createLoginScreen } from './ui/screens/login/index.js';
 import { applyTheme } from './theme.js';
 
-/** Parse OAuth callback (login_token, provider) from URL */
-function parseOAuthCallback() {
-  if (typeof window === 'undefined' || !window.location) return null;
-  const params = new URLSearchParams(window.location.search);
-  const loginToken = params.get('login_token');
-  const provider = (params.get('provider') || '').toLowerCase();
-  if (!loginToken) return null;
-  if (provider !== 'google' && provider !== 'microsoft') return { loginToken, provider: 'google' };
-  return { loginToken, provider };
+function isTwoFactorRequired(res) {
+  if (!res || typeof res !== 'object') return false;
+  if (res.two_factor_required === true) return true;
+  const step = String(res.next_step || '').toUpperCase();
+  return step === 'FR_VERIFICATION';
 }
 
-function clearOAuthParams() {
-  if (typeof window === 'undefined' || !window.history) return;
-  const params = new URLSearchParams(window.location.search);
-  params.delete('login_token');
-  params.delete('provider');
-  const clean = params.toString();
-  const url = window.location.pathname + (clean ? '?' + clean : '') + window.location.hash;
-  window.history.replaceState({}, '', url);
+function applyTwoFactorFromResponse(res, state) {
+  if (res.login_token) state.set('loginToken', res.login_token);
+  if (res.fr_token) state.set('frToken', res.fr_token);
+  if (res.fr_token_expires_in_s != null) state.set('frTokenExpiresInS', res.fr_token_expires_in_s);
+  if (res.provider) state.set('socialProvider', String(res.provider).toLowerCase());
+  if (res.message) state.set('twoFactorMessage', res.message);
 }
 
 /**
@@ -65,12 +60,36 @@ export function mountLogin(container, options = {}) {
   const cleanupTheme = applyTheme(layout.root, theme);
   const showError = (msg) => layout.showError(msg);
 
-  const oauth = parseOAuthCallback();
+  const oauth = parseOAuthRedirect();
   if (oauth) {
-    state.set('loginToken', oauth.loginToken);
-    state.set('socialProvider', oauth.provider);
-    clearOAuthParams();
-    flow.setSocialCallback(oauth.provider);
+    clearOAuthRedirectParams();
+    if (oauth.kind === 'error') {
+      state.set('error', oauth.error);
+    } else if (oauth.kind === 'complete') {
+      if (oauth.email) state.set('identifier', oauth.email);
+      const result = {
+        token: oauth.token,
+        user_id: oauth.userId,
+        email: oauth.email,
+        entity_domain: oauth.entityDomain,
+        message: oauth.message,
+        provider: oauth.provider,
+      };
+      state.set('loginResult', result);
+      flow.setSocialCallback(oauth.provider, { twoFactorRequired: false });
+      flow.setStep(LOGIN_STEPS.SUCCESS);
+      if (typeof onLoginComplete === 'function') {
+        onLoginComplete(buildLoginCompletePayload(result));
+      }
+    } else if (oauth.kind === 'pending') {
+      state.set('loginToken', oauth.loginToken);
+      state.set('socialProvider', oauth.provider);
+      if (oauth.email) state.set('identifier', oauth.email);
+      if (oauth.frToken) state.set('frToken', oauth.frToken);
+      if (oauth.frTokenExpiresInS) state.set('frTokenExpiresInS', oauth.frTokenExpiresInS);
+      if (oauth.message) state.set('twoFactorMessage', oauth.message);
+      flow.setSocialCallback(oauth.provider, { twoFactorRequired: oauth.twoFactorRequired });
+    }
   }
 
   const enabled = getEnabledLoginMethods(config);
@@ -104,6 +123,19 @@ export function mountLogin(container, options = {}) {
     return payload;
   }
 
+  function completeLogin(apiResult) {
+    state.set('loginResult', apiResult);
+    flow.goNext();
+    if (typeof onLoginComplete === 'function') {
+      onLoginComplete(buildLoginCompletePayload(apiResult));
+    }
+  }
+
+  function requireFaceVerification(res) {
+    applyTwoFactorFromResponse(res, state);
+    flow.injectFrsStep();
+  }
+
   async function handleIdentifierEmail(email) {
     state.clearError();
     state.set('identifier', email);
@@ -153,11 +185,11 @@ export function mountLogin(container, options = {}) {
     }
     try {
       const res = await api.loginCustom(identifier, password, config.appIdentifier, null);
-      state.set('loginResult', res);
-      flow.goNext();
-      if (typeof onLoginComplete === 'function') {
-        onLoginComplete(buildLoginCompletePayload(res));
+      if (isTwoFactorRequired(res)) {
+        requireFaceVerification(res);
+        return;
       }
+      completeLogin(res);
     } catch (err) {
       if (isFrRequiredError(err)) {
         flow.injectFrsStep();
@@ -180,6 +212,10 @@ export function mountLogin(container, options = {}) {
     }
     try {
       const res = await api.otpVerify(identifier, '', channel, otp);
+      if (isTwoFactorRequired(res)) {
+        requireFaceVerification(res);
+        return;
+      }
       state.set('loginResult', res);
       flow.setStep(LOGIN_STEPS.SUCCESS);
       if (typeof onLoginComplete === 'function') {
@@ -206,6 +242,7 @@ export function mountLogin(container, options = {}) {
     }
     const method = flow.currentMethod;
     const identifier = state.get('identifier');
+    const frToken = state.get('frToken');
     let apiResult = null;
 
     layout.setLoading(true, 'Verifying your face…');
@@ -213,20 +250,16 @@ export function mountLogin(container, options = {}) {
       if (method === LOGIN_METHODS.EMAIL_FRS) {
         apiResult = await api.loginEmailFr(identifier, file, null, config.appIdentifier);
       } else if (method === LOGIN_METHODS.EMAIL_PASSWORD || method === LOGIN_METHODS.MOBILE_PASSWORD) {
-        apiResult = await api.loginCustom(identifier, state.get('password'), config.appIdentifier, [file, file]);
+        apiResult = await api.loginCustom(identifier, state.get('password'), config.appIdentifier, [file, file], frToken);
       } else if (method === LOGIN_METHODS.SOCIAL_GOOGLE) {
-        apiResult = await api.googleFrEnroll(state.get('loginToken'), file, null, config.appIdentifier);
+        apiResult = await api.googleFrEnroll(state.get('loginToken'), file, null, config.appIdentifier, frToken);
       } else if (method === LOGIN_METHODS.SOCIAL_MICROSOFT) {
-        apiResult = await api.microsoftFrEnroll(state.get('loginToken'), file, null, config.appIdentifier);
+        apiResult = await api.microsoftFrEnroll(state.get('loginToken'), file, null, config.appIdentifier, frToken);
       } else if (method === LOGIN_METHODS.EMAIL_OTP || method === LOGIN_METHODS.MOBILE_OTP) {
         const channel = identifier.includes('@') ? 'email' : 'sms';
-        apiResult = await api.otpVerify(identifier, '', channel, state.get('otp'), [file, file]);
-      }
-      state.set('loginResult', apiResult);
-      flow.goNext();
-      if (typeof onLoginComplete === 'function') {
-        onLoginComplete(buildLoginCompletePayload(apiResult));
+        apiResult = await api.otpVerify(identifier, '', channel, state.get('otp'), [file, file], frToken);
       }
+      completeLogin(apiResult);
     } catch (err) {
       const msg = err?.data?.error || err?.message || 'Verification failed';
       state.set('error', msg);
@@ -312,6 +345,12 @@ export function mountLogin(container, options = {}) {
 
   flow.subscribe(render);
   render();
+  if (oauth?.kind === 'error') {
+    showError(oauth.error);
+  }
+  if (oauth) {
+    clearOAuthRedirectPendingMark();
+  }
 
   return {
     unmount() { cleanupTheme(); layout.root.remove(); },

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "central-auth-js-sdk",
-  "version": "1.0.13",
+  "version": "1.2.0",
   "description": "Vanilla JS sign-up and login flow SDK — embeddable auth UI with configurable methods",
   "type": "module",
   "main": "index.js",

package/signup.js

@@ -7,30 +7,21 @@ import { FlowController, STEPS } from './core/flow.js';
 import { StateManager } from './core/state.js';
 import { createApi, dataUrlToFile } from './core/api.js';
 import { resolveApiBaseUrl } from './core/env-config.js';
+import { parseOAuthRedirect, clearOAuthRedirectParams } from './core/oauth-redirect.js';
 import { createLayout } from './ui/layout.js';
 import { createScreen } from './ui/screens/index.js';
 import { applyTheme } from './theme.js';
 
 /** Parse URL query for OAuth callback params (login_token, provider) */
-function parseOAuthCallback() {
-  if (typeof window === 'undefined' || !window.location) return null;
-  const params = new URLSearchParams(window.location.search);
-  const loginToken = params.get('login_token');
-  const provider = (params.get('provider') || '').toLowerCase();
-  if (!loginToken) return null;
-  if (provider !== 'google' && provider !== 'microsoft') return { loginToken, provider: 'google' };
-  return { loginToken, provider };
+function parseSignupOAuthCallback() {
+  const redirect = parseOAuthRedirect();
+  if (!redirect || !redirect.loginToken) return null;
+  return redirect;
 }
 
 /** Remove OAuth params from URL without reload */
 function clearOAuthParams() {
-  if (typeof window === 'undefined' || !window.history) return;
-  const params = new URLSearchParams(window.location.search);
-  params.delete('login_token');
-  params.delete('provider');
-  const clean = params.toString();
-  const url = window.location.pathname + (clean ? '?' + clean : '') + window.location.hash;
-  window.history.replaceState({}, '', url);
+  clearOAuthRedirectParams();
 }
 
 /** Map API next_step from POST /signup/start to our flow step */
@@ -90,12 +81,18 @@ export function mount(container, options = {}) {
   const showError = (msg) => layout.showError(msg);
 
   // SDK handles OAuth callback: if URL has login_token, resume social flow
-  const oauth = parseOAuthCallback();
+  const oauth = parseSignupOAuthCallback();
   if (oauth) {
     state.set('loginToken', oauth.loginToken);
     state.set('socialProvider', oauth.provider);
+    if (oauth.email) state.set('email', oauth.email);
     clearOAuthParams();
     flow.setSocialFlow();
+    if (oauth.nextStep === 'FR_ENROLLMENT') {
+      flow.setStep(STEPS.FACE);
+    } else if (oauth.nextStep === 'MOBILE_VERIFICATION') {
+      flow.setStep(STEPS.MOBILE);
+    }
   }
 
   const isSocial = () => !!state.get('loginToken');