@secmia/openui-flow 4.1.0 → 4.2.0

package/dist/index.mjs

@@ -26,6 +26,8 @@ var defaultRequirements = [
   DefaultAppRequirements.EMAIL_VERIFIED,
   DefaultAppRequirements.HAS_PASSWORD,
   DefaultAppRequirements.HAS_FIRST_NAME,
+  DefaultAppRequirements.HAS_LAST_NAME,
+  DefaultAppRequirements.HAS_JOB_TITLE,
   DefaultAppRequirements.ACCEPTED_TOS
 ];
 var initialContext = {
@@ -71,20 +73,66 @@ var defaultRequirementResolvers = {
 };
 function createRequirementGraph(requirements, resolvers, options) {
   const graph = [];
+  const requirementSet = new Set(requirements);
+  const resolverBackedRequirements = new Set(
+    requirements.filter((requirement) => Boolean(resolvers[requirement]))
+  );
   for (const requirement of requirements) {
     const resolver = resolvers[requirement];
     if (!resolver) {
       continue;
     }
+    const dependsOn = options?.dependencies?.[requirement] ?? [];
+    for (const dependency of dependsOn) {
+      if (!requirementSet.has(dependency)) {
+        throw new Error(
+          `Invalid dependency "${String(dependency)}" referenced by requirement "${String(requirement)}".`
+        );
+      }
+      if (!resolverBackedRequirements.has(dependency)) {
+        throw new Error(
+          `Dependency "${String(dependency)}" referenced by requirement "${String(requirement)}" has no resolver.`
+        );
+      }
+    }
     graph.push({
       requirement,
       step: resolver.step,
       isMet: resolver.isMet,
       when: options?.conditions?.[requirement],
       priority: options?.priorities?.[requirement] ?? 0,
-      dependsOn: options?.dependencies?.[requirement] ?? []
+      dependsOn
     });
   }
+  const byRequirement = new Map(
+    graph.map((node) => [node.requirement, node])
+  );
+  const visited = /* @__PURE__ */ new Set();
+  const visiting = /* @__PURE__ */ new Set();
+  const dfs = (requirement, stack) => {
+    if (visited.has(requirement)) {
+      return;
+    }
+    if (visiting.has(requirement)) {
+      const cycleStart = stack.indexOf(requirement);
+      const cyclePath = [...stack.slice(cycleStart), requirement].map((value) => String(value)).join(" -> ");
+      throw new Error(`Circular dependency detected in requirement graph: ${cyclePath}`);
+    }
+    visiting.add(requirement);
+    const node = byRequirement.get(requirement);
+    if (node?.dependsOn?.length) {
+      for (const dep of node.dependsOn) {
+        if (byRequirement.has(dep)) {
+          dfs(dep, [...stack, requirement]);
+        }
+      }
+    }
+    visiting.delete(requirement);
+    visited.add(requirement);
+  };
+  for (const node of graph) {
+    dfs(node.requirement, []);
+  }
   return graph;
 }
 function createDefaultRequirementGraph(options) {
@@ -100,13 +148,63 @@ function createDefaultRequirementGraph(options) {
   });
 }
 function sortGraph(graph) {
-  return [...graph].sort((left, right) => {
-    const byPriority = (right.priority ?? 0) - (left.priority ?? 0);
+  const entries = graph.map((node, index) => ({ node, index }));
+  const byRequirement = new Map(entries.map((entry) => [entry.node.requirement, entry]));
+  const indegree = /* @__PURE__ */ new Map();
+  const adjacency = /* @__PURE__ */ new Map();
+  for (const entry of entries) {
+    indegree.set(entry.node.requirement, 0);
+    adjacency.set(entry.node.requirement, []);
+  }
+  for (const entry of entries) {
+    const current = entry.node.requirement;
+    for (const dependency of entry.node.dependsOn ?? []) {
+      const depEntry = byRequirement.get(dependency);
+      if (!depEntry) {
+        continue;
+      }
+      const outgoing = adjacency.get(depEntry.node.requirement);
+      if (outgoing) {
+        outgoing.push(current);
+      }
+      indegree.set(current, (indegree.get(current) ?? 0) + 1);
+    }
+  }
+  const compare = (left, right) => {
+    const byPriority = (right.node.priority ?? 0) - (left.node.priority ?? 0);
     if (byPriority !== 0) {
       return byPriority;
     }
-    return 0;
-  });
+    const byRequirementName = String(left.node.requirement).localeCompare(String(right.node.requirement));
+    if (byRequirementName !== 0) {
+      return byRequirementName;
+    }
+    return left.index - right.index;
+  };
+  const ready = entries.filter((entry) => (indegree.get(entry.node.requirement) ?? 0) === 0).sort(compare);
+  const ordered = [];
+  while (ready.length > 0) {
+    const current = ready.shift();
+    if (!current) {
+      break;
+    }
+    ordered.push(current.node);
+    for (const dependent of adjacency.get(current.node.requirement) ?? []) {
+      const next = (indegree.get(dependent) ?? 0) - 1;
+      indegree.set(dependent, next);
+      if (next === 0) {
+        const dependentEntry = byRequirement.get(dependent);
+        if (dependentEntry) {
+          ready.push(dependentEntry);
+          ready.sort(compare);
+        }
+      }
+    }
+  }
+  if (ordered.length !== graph.length) {
+    throw new Error("Unable to topologically sort requirement graph. Check for dependency cycles.");
+  }
+  return ordered;
 }
 async function evaluateNextStep(context, graph, completeStep) {
   for (const node of sortGraph(graph)) {
@@ -147,6 +245,10 @@ async function getMissingRequirements(context, graph) {
 
 // src/AdaptiveFlow.tsx
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+var defaultOAuthProviders = [
+  { id: "google", label: "Continue with Google" },
+  { id: "apple", label: "Continue with Apple" }
+];
 var defaultStepTitle = {
   COLLECT_EMAIL: "Enter your email",
   VERIFY_OTP: "Verify your email",
@@ -155,6 +257,14 @@ var defaultStepTitle = {
   COLLECT_TOS: "Accept terms",
   COMPLETE: "Done"
 };
+var builtInDefaultSteps = /* @__PURE__ */ new Set([
+  "COLLECT_EMAIL",
+  "VERIFY_OTP",
+  "COLLECT_PASSWORD",
+  "COLLECT_PROFILE",
+  "COLLECT_TOS",
+  "COMPLETE"
+]);
 var styleSlots = [
   "shell",
   "headerRow",
@@ -175,14 +285,24 @@ var styleSlots = [
   "oauthButton"
 ];
 function mergeContext(current, patch) {
-  return {
-    ...current,
-    ...patch,
-    profile: {
-      ...current.profile,
-      ...patch.profile
+  const mergeValue = (baseValue, patchValue) => {
+    if (Array.isArray(baseValue) || Array.isArray(patchValue)) {
+      return patchValue;
+    }
+    const baseIsObject = Boolean(baseValue) && typeof baseValue === "object";
+    const patchIsObject = Boolean(patchValue) && typeof patchValue === "object";
+    if (!baseIsObject || !patchIsObject) {
+      return patchValue === void 0 ? baseValue : patchValue;
+    }
+    const baseObject = baseValue;
+    const patchObject = patchValue;
+    const result = { ...baseObject };
+    for (const key of Object.keys(patchObject)) {
+      result[key] = mergeValue(baseObject[key], patchObject[key]);
     }
+    return result;
   };
+  return mergeValue(current, patch);
 }
 function withDefaults(initialValue) {
   if (!initialValue) {
@@ -194,7 +314,65 @@ function toError(error) {
   if (error instanceof Error) {
     return error;
   }
-  return new Error("Unknown error while processing adaptive flow");
+  if (typeof error === "string") {
+    return new Error(error);
+  }
+  if (error && typeof error === "object") {
+    const maybeError = error;
+    const message = typeof maybeError.message === "string" && maybeError.message.trim().length > 0 ? maybeError.message : "Unknown error while processing adaptive flow";
+    const normalized = new Error(message);
+    if (typeof maybeError.code === "string" && maybeError.code.trim().length > 0) {
+      normalized.name = maybeError.code;
+    }
+    normalized.cause = error;
+    return normalized;
+  }
+  return new Error(`Unknown error while processing adaptive flow: ${String(error)}`);
+}
+function sleep(ms) {
+  return new Promise((resolve) => {
+    setTimeout(resolve, ms);
+  });
+}
+function normalizeDelay(delay, fallback) {
+  if (typeof delay !== "number" || Number.isNaN(delay) || delay < 0) {
+    return fallback;
+  }
+  return delay;
+}
+function computeRetryDelay(policy, attempt) {
+  if (policy?.delay) {
+    return normalizeDelay(policy.delay(attempt), 0);
+  }
+  const initialDelayMs = normalizeDelay(policy?.initialDelayMs, 250);
+  const factor = typeof policy?.factor === "number" && policy.factor > 0 ? policy.factor : 2;
+  const maxDelayMs = normalizeDelay(policy?.maxDelayMs, Number.POSITIVE_INFINITY);
+  let delay = initialDelayMs * Math.pow(factor, Math.max(0, attempt - 1));
+  if (policy?.jitter) {
+    delay = delay * (0.5 + Math.random() * 0.5);
+  }
+  return Math.min(delay, maxDelayMs);
+}
+async function withRetry(operation, retryPolicy) {
+  if (!retryPolicy) {
+    return operation();
+  }
+  const maxAttempts = Math.max(1, Math.trunc(retryPolicy.maxAttempts ?? 3));
+  let lastError;
+  for (let attempt = 1; attempt <= maxAttempts; attempt += 1) {
+    try {
+      return await operation();
+    } catch (error) {
+      lastError = error;
+      const normalized = toError(error);
+      const shouldRetry = retryPolicy.shouldRetry?.(normalized, attempt) ?? attempt < maxAttempts;
+      if (!shouldRetry || attempt === maxAttempts) {
+        throw normalized;
+      }
+      await sleep(computeRetryDelay(retryPolicy, attempt));
+    }
+  }
+  throw toError(lastError);
 }
 function cx(...names) {
   const value = names.filter(Boolean).join(" ").trim();
@@ -349,7 +527,9 @@ function useAdaptiveFlow({
   onStepTransition,
   persistence,
   validators,
-  schemas
+  schemas,
+  oauthProviders,
+  retryPolicy
 }) {
   const normalizedRequirements = React.useMemo(
     () => requirements ?? defaultRequirements,
@@ -383,20 +563,68 @@ function useAdaptiveFlow({
       requirementGraphConfig?.dependencies
     ]
   );
+  const runtimeReducer = (state, action) => {
+    switch (action.type) {
+      case "evaluated":
+        return {
+          ...state,
+          step: action.step,
+          missingRequirements: action.missingRequirements,
+          transitions: [...state.transitions, action.transition].slice(-100)
+        };
+      case "set_busy":
+        return { ...state, busy: action.busy };
+      case "set_message":
+        return { ...state, message: action.message };
+      case "set_error":
+        return { ...state, errorMessage: action.errorMessage };
+      case "set_field_errors":
+        return { ...state, fieldErrors: action.fieldErrors };
+      case "start_job":
+        return { ...state, busy: true, errorMessage: null, fieldErrors: {} };
+      case "set_oauth_pending":
+        return { ...state, oauthPendingProvider: action.provider };
+      case "set_hydrated":
+        return { ...state, persistenceHydrated: action.hydrated };
+      default:
+        return state;
+    }
+  };
   const [context, setContext] = React.useState(() => withDefaults(initialValue));
-  const [step, setStep] = React.useState(normalizedCompleteStep);
-  const [missingRequirements, setMissingRequirements] = React.useState([]);
-  const [transitions, setTransitions] = React.useState([]);
-  const [busy, setBusy] = React.useState(false);
-  const [message, setMessage] = React.useState(null);
-  const [errorMessage, setErrorMessage] = React.useState(null);
-  const [fieldErrors, setFieldErrors] = React.useState({});
-  const [oauthPendingProvider, setOauthPendingProvider] = React.useState(null);
-  const [persistenceHydrated, setPersistenceHydrated] = React.useState(!persistence);
+  const [runtime, dispatch] = React.useReducer(runtimeReducer, {
+    step: normalizedCompleteStep,
+    missingRequirements: [],
+    transitions: [],
+    busy: false,
+    message: null,
+    errorMessage: null,
+    fieldErrors: {},
+    oauthPendingProvider: null,
+    persistenceHydrated: !persistence
+  });
+  const {
+    step,
+    missingRequirements,
+    transitions,
+    busy,
+    message,
+    errorMessage,
+    fieldErrors,
+    oauthPendingProvider,
+    persistenceHydrated
+  } = runtime;
   const attemptByStepRef = React.useRef({});
   const previousStepRef = React.useRef(null);
   const evaluationRef = React.useRef(0);
   const completed = React.useRef(false);
+  const reportPersistenceError = React.useCallback(
+    (error, phase) => {
+      const normalized = toError(error);
+      persistence?.onError?.(normalized, phase);
+      onError?.(normalized);
+    },
+    [onError, persistence]
+  );
   React.useEffect(() => {
     if (!persistence) {
       return;
@@ -407,26 +635,24 @@ function useAdaptiveFlow({
         setContext(mergeContext(withDefaults(initialValue), persisted.context));
       }
       if (persisted?.oauthPendingProvider) {
-        setOauthPendingProvider(persisted.oauthPendingProvider);
+        dispatch({ type: "set_oauth_pending", provider: persisted.oauthPendingProvider });
       }
-    } catch {
+    } catch (error) {
+      reportPersistenceError(error, "read");
     } finally {
-      setPersistenceHydrated(true);
+      dispatch({ type: "set_hydrated", hydrated: true });
     }
-  }, [initialValue, persistence]);
+  }, [initialValue, persistence, reportPersistenceError]);
   React.useEffect(() => {
-    let isCancelled = false;
     const currentEvaluation = ++evaluationRef.current;
     void (async () => {
       const [missing, next] = await Promise.all([
         getMissingRequirements(context, graph),
         evaluateNextStep(context, graph, normalizedCompleteStep)
       ]);
-      if (isCancelled || currentEvaluation !== evaluationRef.current) {
+      if (currentEvaluation !== evaluationRef.current) {
         return;
       }
-      setMissingRequirements(missing);
-      setStep(next);
       const from = previousStepRef.current;
       const attemptKey = String(next);
       const nextAttempt = from === next ? (attemptByStepRef.current[attemptKey] ?? 0) + 1 : 1;
@@ -437,21 +663,23 @@ function useAdaptiveFlow({
         at: Date.now(),
         attempt: nextAttempt
       };
-      setTransitions((previous) => [...previous, transition].slice(-100));
+      dispatch({
+        type: "evaluated",
+        missingRequirements: missing,
+        step: next,
+        transition
+      });
       previousStepRef.current = next;
       onStepTransition?.(transition, context);
     })().catch((error) => {
-      if (isCancelled || currentEvaluation !== evaluationRef.current) {
+      if (currentEvaluation !== evaluationRef.current) {
         return;
       }
       const normalized = toError(error);
-      setFieldErrors({});
-      setErrorMessage(normalized.message);
+      dispatch({ type: "set_field_errors", fieldErrors: {} });
+      dispatch({ type: "set_error", errorMessage: normalized.message });
       onError?.(normalized);
     });
-    return () => {
-      isCancelled = true;
-    };
   }, [context, graph, normalizedCompleteStep, onError, onStepTransition]);
   React.useEffect(() => {
     if (step === normalizedCompleteStep) {
@@ -460,43 +688,46 @@ function useAdaptiveFlow({
         onComplete?.(context);
         const shouldClearPersistence = persistence?.clearOnComplete ?? true;
         if (shouldClearPersistence) {
-          clearPersistedState(persistence);
+          try {
+            clearPersistedState(persistence);
+          } catch (error) {
+            reportPersistenceError(error, "clear");
+          }
         }
       }
     } else {
       completed.current = false;
     }
-  }, [context, normalizedCompleteStep, onComplete, persistence, step]);
+  }, [context, normalizedCompleteStep, onComplete, persistence, reportPersistenceError, step]);
   React.useEffect(() => {
     if (!persistence || !persistenceHydrated) {
       return;
     }
     try {
       writePersistedState(persistence, { context, oauthPendingProvider });
-    } catch {
+    } catch (error) {
+      reportPersistenceError(error, "write");
     }
-  }, [context, oauthPendingProvider, persistence, persistenceHydrated]);
+  }, [context, oauthPendingProvider, persistence, persistenceHydrated, reportPersistenceError]);
   const run = React.useCallback(
     async (job) => {
-      setBusy(true);
-      setErrorMessage(null);
-      setFieldErrors({});
+      dispatch({ type: "start_job" });
       try {
         await job();
       } catch (error) {
         if (error instanceof FlowValidationError) {
-          setFieldErrors(error.fieldErrors);
+          dispatch({ type: "set_field_errors", fieldErrors: error.fieldErrors });
           if (Object.keys(error.fieldErrors).length === 0) {
-            setErrorMessage(error.message);
+            dispatch({ type: "set_error", errorMessage: error.message });
             onError?.(error);
           }
         } else {
           const normalized = toError(error);
-          setErrorMessage(normalized.message);
+          dispatch({ type: "set_error", errorMessage: normalized.message });
           onError?.(normalized);
         }
       } finally {
-        setBusy(false);
+        dispatch({ type: "set_busy", busy: false });
       }
     },
     [onError]
@@ -504,26 +735,23 @@ function useAdaptiveFlow({
   const patchContext = React.useCallback((patch) => {
     setContext((prev) => mergeContext(prev, patch));
   }, []);
-  const patchBaseContext = React.useCallback(
-    (patch) => {
-      patchContext(patch);
-    },
-    [patchContext]
-  );
   React.useEffect(() => {
     const completeOAuth = adapter?.completeOAuth;
     if (!oauthPendingProvider || !completeOAuth) {
       return;
     }
     void run(async () => {
-      const patch = await completeOAuth(oauthPendingProvider, context);
+      const patch = await withRetry(
+        () => completeOAuth(oauthPendingProvider, context),
+        retryPolicy
+      );
       if (patch) {
         patchContext(patch);
       }
-      setOauthPendingProvider(null);
-      setMessage("OAuth sign-in completed.");
+      dispatch({ type: "set_oauth_pending", provider: null });
+      dispatch({ type: "set_message", message: "OAuth sign-in completed." });
     });
-  }, [adapter, context, oauthPendingProvider, patchContext, run]);
+  }, [adapter, context, oauthPendingProvider, patchContext, retryPolicy, run]);
   const handleEmail = (emailInput) => {
     const email = emailInput.trim().toLowerCase();
     if (!email) {
@@ -534,8 +762,8 @@ function useAdaptiveFlow({
       if (validators?.email) {
         await assertValid(validators.email(email, { context }), "email");
       }
-      const identity = await adapter?.lookupByEmail?.(email) ?? null;
-      patchBaseContext({
+      const identity = adapter?.lookupByEmail ? await withRetry(() => adapter.lookupByEmail(email), retryPolicy) : null;
+      patchContext({
         email,
         hasPassword: Boolean(identity?.hasPassword),
         isVerified: Boolean(identity?.isVerified),
@@ -547,15 +775,23 @@ function useAdaptiveFlow({
         }
       });
       if (identity?.accountExists && identity.hasPassword) {
-        setMessage("Welcome back. Enter your password to continue.");
+        dispatch({ type: "set_message", message: "Welcome back. Enter your password to continue." });
         return;
       }
       if (adapter?.requestOtp) {
-        await adapter.requestOtp(email);
-        setMessage("We sent a 6-digit code to your inbox.");
+        await withRetry(() => adapter.requestOtp(email), retryPolicy);
+        dispatch({ type: "set_message", message: "We sent a 6-digit code to your inbox." });
       } else {
-        patchBaseContext({ isVerified: true });
-        setMessage("No OTP adapter configured. Email verification was skipped.");
+        const env = globalThis.process?.env?.NODE_ENV;
+        const isDev = env !== "production";
+        if (!isDev) {
+          throw new Error("OTP adapter is required in production. Provide adapter.requestOtp.");
+        }
+        patchContext({ isVerified: true });
+        dispatch({
+          type: "set_message",
+          message: "No OTP adapter configured. Verification was skipped in development mode."
+        });
       }
     });
   };
@@ -569,10 +805,10 @@ function useAdaptiveFlow({
         await assertValid(validators.otp(code, { context, email: context.email }), "otp");
       }
       if (adapter?.verifyOtp) {
-        await adapter.verifyOtp(context.email, code);
+        await withRetry(() => adapter.verifyOtp(context.email, code), retryPolicy);
       }
-      patchBaseContext({ isVerified: true });
-      setMessage("Email verified.");
+      patchContext({ isVerified: true });
+      dispatch({ type: "set_message", message: "Email verified." });
     });
   };
   const handlePassword = (password) => {
@@ -589,15 +825,18 @@ function useAdaptiveFlow({
       }
       if (context.hasPassword) {
         if (adapter?.signInWithPassword) {
-          await adapter.signInWithPassword(context.email, password);
+          await withRetry(
+            () => adapter.signInWithPassword(context.email, password),
+            retryPolicy
+          );
         }
       } else {
         if (adapter?.createPassword) {
-          await adapter.createPassword(password);
+          await withRetry(() => adapter.createPassword(password), retryPolicy);
         }
-        patchBaseContext({ hasPassword: true });
+        patchContext({ hasPassword: true });
       }
-      setMessage("Password step complete.");
+      dispatch({ type: "set_message", message: "Password step complete." });
     });
   };
   const handleProfile = (profile) => {
@@ -614,10 +853,10 @@ function useAdaptiveFlow({
         }
       });
       if (adapter?.saveProfile) {
-        await adapter.saveProfile(next);
+        await withRetry(() => adapter.saveProfile(next), retryPolicy);
       }
       patchContext({ profile: next.profile });
-      setMessage("Profile saved.");
+      dispatch({ type: "set_message", message: "Profile saved." });
     });
   };
   const handleTos = () => {
@@ -628,10 +867,10 @@ function useAdaptiveFlow({
       }
       const next = mergeContext(context, { agreedToTos: true });
       if (adapter?.acceptTos) {
-        await adapter.acceptTos(next);
+        await withRetry(() => adapter.acceptTos(next), retryPolicy);
       }
-      patchBaseContext({ agreedToTos: true });
-      setMessage("Terms accepted.");
+      patchContext({ agreedToTos: true });
+      dispatch({ type: "set_message", message: "Terms accepted." });
     });
   };
   const handleOAuth = (provider) => {
@@ -640,9 +879,9 @@ function useAdaptiveFlow({
       return;
     }
     void run(async () => {
-      setOauthPendingProvider(provider);
-      setMessage(`Starting ${provider} sign-in...`);
-      await startOAuth(provider, context);
+      dispatch({ type: "set_oauth_pending", provider });
+      dispatch({ type: "set_message", message: `Starting ${provider} sign-in...` });
+      await withRetry(() => startOAuth(provider, context), retryPolicy);
     });
   };
   return {
@@ -686,7 +925,9 @@ function AdaptiveFlow({
   unstyled = false,
   persistence,
   validators,
-  schemas
+  schemas,
+  oauthProviders,
+  retryPolicy
 }) {
   const uiStyles = React.useMemo(() => resolveStyles(unstyled, styles), [unstyled, styles]);
   const {
@@ -721,8 +962,14 @@ function AdaptiveFlow({
     onStepTransition,
     persistence,
     validators,
-    schemas
+    schemas,
+    oauthProviders,
+    retryPolicy
   });
+  const normalizedOAuthProviders = React.useMemo(
+    () => oauthProviders && oauthProviders.length > 0 ? oauthProviders : defaultOAuthProviders,
+    [oauthProviders]
+  );
   const needsJobTitle = normalizedRequirements.includes("has_job_title");
   const stepLabel = stepTitles?.[step] ?? defaultStepTitle[step] ?? step;
   const defaultView = /* @__PURE__ */ jsxs(Fragment, { children: [
@@ -781,7 +1028,7 @@ function AdaptiveFlow({
       }
     ) : null,
     step === normalizedCompleteStep ? /* @__PURE__ */ jsx(CompleteBlock, { styles: uiStyles, classNames }) : null,
-    step !== "COLLECT_EMAIL" && step !== "VERIFY_OTP" && step !== "COLLECT_PASSWORD" && step !== "COLLECT_PROFILE" && step !== "COLLECT_TOS" && step !== normalizedCompleteStep ? /* @__PURE__ */ jsxs("div", { className: classNames?.info, style: uiStyles.info, children: [
+    !builtInDefaultSteps.has(String(step)) && step !== normalizedCompleteStep ? /* @__PURE__ */ jsxs("div", { className: classNames?.info, style: uiStyles.info, children: [
       'No default renderer for step "',
       step,
       '". Provide renderStep to handle custom steps.'
@@ -831,34 +1078,20 @@ function AdaptiveFlow({
     message ? /* @__PURE__ */ jsx("div", { className: classNames?.success, style: uiStyles.success, children: message }) : null,
     errorMessage ? /* @__PURE__ */ jsx("div", { className: classNames?.error, style: uiStyles.error, children: errorMessage }) : null,
     customView ?? registryView ?? defaultView,
-    /* @__PURE__ */ jsxs("div", { className: classNames?.footer, style: uiStyles.footer, children: [
-      /* @__PURE__ */ jsx(
-        "button",
-        {
-          type: "button",
-          className: classNames?.oauthButton,
-          style: uiStyles.oauthButton,
-          disabled: busy || !adapter?.startOAuth,
-          onClick: () => {
-            handleOAuth("google");
-          },
-          children: "Continue with Google"
-        }
-      ),
-      /* @__PURE__ */ jsx(
-        "button",
-        {
-          type: "button",
-          className: classNames?.oauthButton,
-          style: uiStyles.oauthButton,
-          disabled: busy || !adapter?.startOAuth,
-          onClick: () => {
-            handleOAuth("apple");
-          },
-          children: "Continue with Apple"
-        }
-      )
-    ] })
+    /* @__PURE__ */ jsx("div", { className: classNames?.footer, style: uiStyles.footer, children: normalizedOAuthProviders.map((provider) => /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        className: classNames?.oauthButton,
+        style: uiStyles.oauthButton,
+        disabled: busy || !adapter?.startOAuth,
+        onClick: () => {
+          handleOAuth(provider.id);
+        },
+        children: provider.label
+      },
+      provider.id
+    )) })
   ] });
 }
 function EmailBlock({