@ory/elements-react 0.0.0-pr.f1d09ee2 → 0.0.0-pr.fd92d9ce

package/dist/index.mjs

@@ -1,5 +1,5 @@
-import { UiNodeGroupEnum, isUiNodeInputAttributes, isUiNodeAnchorAttributes, isUiNodeImageAttributes, isUiNodeScriptAttributes, FlowType, getNodeId, isUiNodeTextAttributes, UiNodeInputAttributesTypeEnum, handleContinueWith, handleFlowError, settingsUrl, isResponseError, loginUrl, recoveryUrl, verificationUrl, registrationUrl, Configuration, FrontendApi, instanceOfContinueWithRecoveryUi } from '@ory/client-fetch';
-import { createContext, useContext, useState, useMemo, useReducer, useRef, useEffect } from 'react';
+import { UiNodeGroupEnum, isUiNodeInputAttributes, isUiNodeAnchorAttributes, isUiNodeImageAttributes, isUiNodeScriptAttributes, FlowType, getNodeId, Configuration, FrontendApi, isUiNodeTextAttributes, UiNodeInputAttributesTypeEnum, handleContinueWith, isResponseError as isResponseError$1, loginUrl, settingsUrl, registrationUrl, FetchError, ResponseError, recoveryUrl, instanceOfContinueWithRecoveryUi, verificationUrl as verificationUrl$1 } from '@ory/client-fetch';
+import { createContext, useContext, useRef, useState, useMemo, useReducer, useEffect } from 'react';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { useIntl, IntlProvider as IntlProvider$1 } from 'react-intl';
 import { useFormContext, useForm, FormProvider } from 'react-hook-form';
@@ -48,13 +48,18 @@ var defaultNodeOrder = [
 ];
 function defaultNodeSorter(a, b) {
   var _a, _b;
+  const aIsCaptcha = a.group === "captcha";
+  const bIsCaptcha = b.group === "captcha";
+  const aIsSubmit = isUiNodeInputAttributes(a.attributes) && a.attributes.type === "submit";
+  const bIsSubmit = isUiNodeInputAttributes(b.attributes) && b.attributes.type === "submit";
+  if (aIsCaptcha && bIsSubmit) {
+    return -1;
+  }
+  if (bIsCaptcha && aIsSubmit) {
+    return 1;
+  }
   const aGroupWeight = (_a = defaultNodeOrder.indexOf(a.group)) != null ? _a : 999;
   const bGroupWeight = (_b = defaultNodeOrder.indexOf(b.group)) != null ? _b : 999;
-  if (b.group === "captcha" && isUiNodeInputAttributes(a.attributes) && a.attributes.type === "submit") {
-    return aGroupWeight - (bGroupWeight - 2);
-  } else if (a.group === "captcha" && isUiNodeInputAttributes(b.attributes) && b.attributes.type === "submit") {
-    return aGroupWeight - 2 - bGroupWeight;
-  }
   return aGroupWeight - bGroupWeight;
 }
 var defaultGroupOrder = [
@@ -315,9 +320,9 @@ function parseStateFromFlow(flow) {
         return { current: "method_active", method: "code" };
       } else if (methodWithMessage) {
         return { current: "method_active", method: methodWithMessage.group };
-      } else if (flow.flow.active && !["default", "identifier_first", "oidc", "saml"].includes(
-        flow.flow.active
-      )) {
+      } else if ((_a = flow.flow.ui.messages) == null ? void 0 : _a.some((m) => m.id === 1010016)) {
+        return { current: "select_method" };
+      } else if (flow.flow.active && !["default", "identifier_first"].includes(flow.flow.active)) {
         return { current: "method_active", method: flow.flow.active };
       } else if (isChoosingMethod(flow)) {
         const authMethods = nodesToAuthMethodGroups(flow.flow.ui.nodes);
@@ -325,8 +330,6 @@ function parseStateFromFlow(flow) {
           return { current: "method_active", method: authMethods[0] };
         }
         return { current: "select_method" };
-      } else if ((_a = flow.flow.ui.messages) == null ? void 0 : _a.some((m) => m.id === 1010016)) {
-        return { current: "select_method" };
       }
       return { current: "provide_identifier" };
     }
@@ -355,14 +358,20 @@ function useFormStateReducer(flow) {
   const formStateReducer = (state, action2) => {
     switch (action2.type) {
       case "action_flow_update": {
-        if (selectedMethod)
+        if (selectedMethod) {
           return { current: "method_active", method: selectedMethod };
+        }
         return parseStateFromFlow(action2.flow);
       }
       case "action_select_method": {
         setSelectedMethod(action2.method);
         return { current: "method_active", method: action2.method };
       }
+      case "action_clear_active_method": {
+        return {
+          current: "select_method"
+        };
+      }
     }
     return state;
   };
@@ -401,6 +410,110 @@ function OryFlowProvider({
     }
   );
 }
+
+// src/client/config.ts
+function isProduction() {
+  var _a, _b;
+  return ["production", "prod"].indexOf(
+    (_b = (_a = process.env.VERCEL_ENV) != null ? _a : process.env.NODE_ENV) != null ? _b : ""
+  ) > -1;
+}
+function frontendClient(sdkUrl, opts = {}) {
+  const config = new Configuration({
+    ...opts,
+    basePath: sdkUrl,
+    credentials: "include",
+    headers: {
+      Accept: "application/json",
+      ...opts.headers
+    }
+  });
+  return new FrontendApi(config);
+}
+var defaultProject = {
+  name: "Ory",
+  registration_enabled: true,
+  verification_enabled: true,
+  recovery_enabled: true,
+  recovery_ui_url: "/ui/recovery",
+  registration_ui_url: "/ui/registration",
+  verification_ui_url: "/ui/verification",
+  login_ui_url: "/ui/login",
+  settings_ui_url: "/ui/settings",
+  default_redirect_url: "/ui/welcome",
+  error_ui_url: "/ui/error",
+  default_locale: "en",
+  locale_behavior: "force_default"
+};
+function useOryConfiguration() {
+  const configCtx = useContext(OryConfigurationContext);
+  return {
+    sdk: {
+      ...configCtx.sdk,
+      frontend: frontendClient(configCtx.sdk.url, configCtx.sdk.options)
+    },
+    project: {
+      ...configCtx.project
+    }
+  };
+}
+var OryConfigurationContext = createContext({
+  sdk: computeSdkConfig({}),
+  project: defaultProject
+});
+function OryConfigurationProvider({
+  children,
+  sdk: initialConfig,
+  project
+}) {
+  const configRef = useRef({
+    sdk: computeSdkConfig(initialConfig),
+    project: {
+      ...defaultProject,
+      ...project
+    }
+  });
+  return /* @__PURE__ */ jsx(OryConfigurationContext.Provider, { value: configRef.current, children });
+}
+function computeSdkConfig(config) {
+  if ((config == null ? void 0 : config.url) && typeof config.url === "string") {
+    console.debug("Using sdk url from config");
+    return {
+      url: config.url.replace(/\/$/, ""),
+      options: config.options || {}
+    };
+  }
+  return {
+    url: getSDKUrl(),
+    options: (config == null ? void 0 : config.options) || {}
+  };
+}
+function getSDKUrl() {
+  var _a;
+  if (typeof process !== "undefined" && process.versions && process.versions.node) {
+    if (isProduction()) {
+      const sdkUrl = (_a = process.env["NEXT_PUBLIC_ORY_SDK_URL"]) != null ? _a : process.env["ORY_SDK_URL"];
+      if (!sdkUrl) {
+        throw new Error(
+          "Unable to determine SDK URL. Please set NEXT_PUBLIC_ORY_SDK_URL and/or ORY_SDK_URL in production environments."
+        );
+      }
+      return sdkUrl.replace(/\/$/, "");
+    } else {
+      if (process.env["__NEXT_PRIVATE_ORIGIN"]) {
+        return process.env["__NEXT_PRIVATE_ORIGIN"].replace(/\/$/, "");
+      } else if (process.env["VERCEL_URL"]) {
+        return `https://${process.env["VERCEL_URL"]}`.replace(/\/$/, "");
+      }
+    }
+  }
+  if (typeof window !== "undefined") {
+    return window.location.origin;
+  }
+  throw new Error(
+    "Unable to determine SDK URL. Please set NEXT_PUBLIC_ORY_SDK_URL and/or ORY_SDK_URL or supply the sdk.url parameter in the Ory configuration."
+  );
+}
 function mergeTranslations(customTranslations) {
   return Object.keys(customTranslations).reduce((acc, key) => {
     acc[key] = { ...OryLocales[key], ...customTranslations[key] };
@@ -430,17 +543,18 @@ var IntlProvider = ({
 function OryProvider({
   children,
   components: Components,
+  config,
   ...oryFlowProps
 }) {
   var _a, _b, _c;
-  return /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsx(OryConfigurationProvider, { sdk: config.sdk, project: config.project, children: /* @__PURE__ */ jsx(
     IntlProvider,
     {
-      locale: (_b = (_a = oryFlowProps.config.intl) == null ? void 0 : _a.locale) != null ? _b : "en",
-      customTranslations: (_c = oryFlowProps.config.intl) == null ? void 0 : _c.customTranslations,
+      locale: (_b = (_a = config.intl) == null ? void 0 : _a.locale) != null ? _b : "en",
+      customTranslations: (_c = config.intl) == null ? void 0 : _c.customTranslations,
       children: /* @__PURE__ */ jsx(OryFlowProvider, { ...oryFlowProps, children: /* @__PURE__ */ jsx(OryComponentProvider, { components: Components, children }) })
     }
-  );
+  ) });
 }
 function OryCardHeader() {
   const { Card } = useComponents();
@@ -559,17 +673,6 @@ function OryCardContent({ children }) {
   const { Card } = useComponents();
   return /* @__PURE__ */ jsx(Card.Content, { children });
 }
-function frontendClient(sdkUrl, opts = {}) {
-  const config = new Configuration({
-    ...opts,
-    basePath: sdkUrl,
-    headers: {
-      Accept: "application/json",
-      ...opts.headers
-    }
-  });
-  return new FrontendApi(config);
-}
 
 // src/util/internal.ts
 function replaceWindowFlowId(flow) {
@@ -577,9 +680,137 @@ function replaceWindowFlowId(flow) {
   url.searchParams.set("flow", flow);
   window.location.href = url.toString();
 }
+function isGenericErrorResponse(response) {
+  return typeof response === "object" && !!response && "error" in response && typeof response.error === "object" && !!response.error && "id" in response.error;
+}
+function isNeedsPrivilegedSessionError(response) {
+  return isGenericErrorResponse(response) && response.error.id === "session_refresh_required";
+}
+function isSelfServiceFlowExpiredError(response) {
+  return isGenericErrorResponse(response) && response.error.id === "self_service_flow_expired";
+}
+function isBrowserLocationChangeRequired(response) {
+  return isGenericErrorResponse(response) && isGenericErrorResponse(response) && response.error.id === "browser_location_change_required";
+}
+function isAddressNotVerified(response) {
+  return isGenericErrorResponse(response) && response.error.id === "session_verified_address_required";
+}
+function isCsrfError(response) {
+  return isGenericErrorResponse(response) && response.error.id === "security_csrf_violation";
+}
+var isResponseError = (err) => {
+  if (err instanceof ResponseError) {
+    return true;
+  }
+  return typeof err === "object" && !!err && "name" in err && err.name === "ResponseError";
+};
+var isFetchError = (err) => {
+  return err instanceof FetchError;
+};
+
+// src/util/sdk-helpers/urlHelpers.ts
+var verificationUrl = (config) => config.sdk.url + "/self-service/verification/browser";
+var handleFlowError = (opts) => async (err) => {
+  var _a;
+  if (!isResponseError(err)) {
+    if (isFetchError(err)) {
+      throw new FetchError(
+        err,
+        "Unable to call the API endpoint. Ensure that CORS is set up correctly and that you have provided a valid SDK URL to Ory Elements."
+      );
+    }
+    throw err;
+  }
+  const contentType = err.response.headers.get("content-type") || "";
+  if (contentType.includes("application/json")) {
+    const body = await toBody(err.response);
+    if (isSelfServiceFlowExpiredError(body)) {
+      opts.onRestartFlow(body.use_flow_id);
+      return;
+    } else if (isAddressNotVerified(body)) {
+      for (const continueWith of ((_a = body.error.details) == null ? void 0 : _a.continue_with) || []) {
+        if (continueWith.action === "show_verification_ui" && continueWith.flow.url) {
+          opts.onRedirect(continueWith.flow.url, true);
+          return;
+        }
+      }
+      opts.onRedirect(verificationUrl(opts.config), true);
+      return;
+    } else if (isBrowserLocationChangeRequired(body) && body.redirect_browser_to) {
+      opts.onRedirect(body.redirect_browser_to, true);
+      return;
+    } else if (isNeedsPrivilegedSessionError(body) && body.redirect_browser_to) {
+      opts.onRedirect(body.redirect_browser_to, true);
+      return;
+    } else if (isCsrfError(body)) {
+      opts.onRestartFlow();
+      return;
+    }
+    switch (err.response.status) {
+      case 404:
+        opts.onRestartFlow();
+        return;
+      case 410:
+        opts.onRestartFlow();
+        return;
+      case 400:
+        return opts.onValidationError(
+          await err.response.json()
+        );
+      case 403:
+        opts.onRestartFlow();
+        return;
+      case 422: {
+        throw new ResponseError(
+          err.response,
+          "The API returned an error code indicating a required redirect, but the SDK is outdated and does not know how to handle the action. Received response: " + await err.response.json()
+        );
+      }
+    }
+    throw new ResponseError(
+      err.response,
+      "The Ory API endpoint returned a response code the SDK does not know how to handle. Please check the network tab for more information. Received response: " + await err.response.json()
+    );
+  } else if (
+    // Not a JSON response? If it's a text response we will return an error informing the user that the response is not JSON.
+    contentType.includes("text/") || contentType.includes("html") || contentType.includes("xml")
+  ) {
+    await logResponseError(err.response, true);
+    throw new ResponseError(
+      err.response,
+      `The Ory API endpoint returned an unexpected HTML or text response. Check your console output for details.`
+    );
+  }
+  await logResponseError(err.response, false);
+  throw new ResponseError(
+    err.response,
+    "The Ory API endpoint returned unexpected content type `" + contentType + "`.  Check your console output for details."
+  );
+};
+async function toBody(response) {
+  try {
+    return await response.clone().json();
+  } catch (e) {
+    await logResponseError(response, true, [e]);
+    throw new ResponseError(
+      response,
+      "Unable to decode API response using JSON."
+    );
+  }
+}
+async function logResponseError(response, printBody, wrap) {
+  console.error("Unable to decode API response", {
+    response: {
+      status: response.status,
+      headers: Object.fromEntries(response.headers.entries()),
+      body: printBody ? await response.clone().text() : void 0
+    },
+    errors: wrap
+  });
+}
 
 // src/util/onSubmitLogin.ts
-async function onSubmitLogin({ config, flow }, {
+async function onSubmitLogin({ flow }, config, {
   setFlowContainer,
   body,
   onRedirect
@@ -608,27 +839,21 @@ async function onSubmitLogin({ config, flow }, {
       },
       onValidationError: (body2) => {
         setFlowContainer({
-          config,
           flow: body2,
           flowType: FlowType.Login
         });
       },
-      onRedirect
+      onRedirect,
+      config
     })
   );
 }
-async function onSubmitRecovery({ config, flow }, {
+async function onSubmitRecovery({ flow }, config, {
   setFlowContainer,
   body,
   onRedirect
 }) {
-  var _a;
-  if (!config.sdk.url) {
-    throw new Error(
-      `Please supply your Ory Network SDK url to the Ory Elements configuration.`
-    );
-  }
-  await frontendClient(config.sdk.url, (_a = config.sdk.options) != null ? _a : {}).updateRecoveryFlowRaw({
+  await config.sdk.frontend.updateRecoveryFlowRaw({
     flow: flow.id,
     updateRecoveryFlowBody: body
   }).then(async (res) => {
@@ -641,8 +866,7 @@ async function onSubmitRecovery({ config, flow }, {
     }
     setFlowContainer({
       flow: flow2,
-      flowType: FlowType.Recovery,
-      config
+      flowType: FlowType.Recovery
     });
   }).catch(
     handleFlowError({
@@ -660,12 +884,12 @@ async function onSubmitRecovery({ config, flow }, {
         } else {
           setFlowContainer({
             flow: body2,
-            flowType: FlowType.Recovery,
-            config
+            flowType: FlowType.Recovery
           });
         }
       },
-      onRedirect
+      onRedirect,
+      config
     })
   );
 }
@@ -682,19 +906,12 @@ function handleContinueWithRecoveryUIError(error, config, onRedirect) {
   }
   onRedirect(recoveryUrl(config), true);
 }
-async function onSubmitRegistration({ config, flow }, {
+async function onSubmitRegistration({ flow }, config, {
   setFlowContainer,
   body,
   onRedirect
 }) {
-  var _a;
-  if (!config.sdk.url) {
-    throw new Error(
-      `Please supply your Ory Network SDK url to the Ory Elements configuration.`
-    );
-  }
-  const client = frontendClient(config.sdk.url, (_a = config.sdk.options) != null ? _a : {});
-  await client.updateRegistrationFlowRaw({
+  await config.sdk.frontend.updateRegistrationFlowRaw({
     flow: flow.id,
     updateRegistrationFlowBody: body
   }).then(async (res) => {
@@ -718,27 +935,20 @@ async function onSubmitRegistration({ config, flow }, {
       onValidationError: (body2) => {
         setFlowContainer({
           flow: body2,
-          flowType: FlowType.Registration,
-          config
+          flowType: FlowType.Registration
         });
       },
-      onRedirect
+      onRedirect,
+      config
     })
   );
 }
-async function onSubmitSettings({ config, flow }, {
+async function onSubmitSettings({ flow }, config, {
   setFlowContainer,
   body,
   onRedirect
 }) {
-  var _a;
-  if (!config.sdk.url) {
-    throw new Error(
-      `Please supply your Ory Network SDK url to the Ory Elements configuration.`
-    );
-  }
-  const client = frontendClient(config.sdk.url, (_a = config.sdk.options) != null ? _a : {});
-  await client.updateSettingsFlowRaw({
+  await config.sdk.frontend.updateSettingsFlowRaw({
     flow: flow.id,
     updateSettingsFlowBody: body
   }).then(async (res) => {
@@ -751,8 +961,7 @@ async function onSubmitSettings({ config, flow }, {
     }
     setFlowContainer({
       flow: body2,
-      flowType: FlowType.Settings,
-      config
+      flowType: FlowType.Settings
     });
   }).catch(
     handleFlowError({
@@ -766,14 +975,14 @@ async function onSubmitSettings({ config, flow }, {
       onValidationError: (body2) => {
         setFlowContainer({
           flow: body2,
-          flowType: FlowType.Settings,
-          config
+          flowType: FlowType.Settings
         });
       },
-      onRedirect
+      onRedirect,
+      config
     })
   ).catch((err) => {
-    if (isResponseError(err)) {
+    if (isResponseError$1(err)) {
       if (err.response.status === 401) {
         return onRedirect(
           loginUrl(config) + "?return_to=" + settingsUrl(config),
@@ -784,25 +993,18 @@ async function onSubmitSettings({ config, flow }, {
     }
   });
 }
-async function onSubmitVerification({ config, flow }, {
+async function onSubmitVerification({ flow }, config, {
   setFlowContainer,
   body,
   onRedirect
 }) {
-  var _a;
-  if (!config.sdk.url) {
-    throw new Error(
-      `Please supply your Ory Network SDK URL to the Ory Elements configuration.`
-    );
-  }
-  await frontendClient(config.sdk.url, (_a = config.sdk.options) != null ? _a : {}).updateVerificationFlowRaw({
+  await config.sdk.frontend.updateVerificationFlowRaw({
     flow: flow.id,
     updateVerificationFlowBody: body
   }).then(
     async (res) => setFlowContainer({
       flow: await res.value(),
-      flowType: FlowType.Verification,
-      config
+      flowType: FlowType.Verification
     })
   ).catch(
     handleFlowError({
@@ -810,17 +1012,17 @@ async function onSubmitVerification({ config, flow }, {
         if (useFlowId) {
           replaceWindowFlowId(useFlowId);
         } else {
-          onRedirect(verificationUrl(config), true);
+          onRedirect(verificationUrl$1(config), true);
         }
       },
       onValidationError: (body2) => {
         setFlowContainer({
           flow: body2,
-          flowType: FlowType.Verification,
-          config
+          flowType: FlowType.Verification
         });
       },
-      onRedirect
+      onRedirect,
+      config
     })
   );
 }
@@ -830,6 +1032,7 @@ var supportsSelectAccountPrompt = ["google", "github"];
 function useOryFormSubmit(onAfterSubmit) {
   const flowContainer = useOryFlow();
   const methods = useFormContext();
+  const config = useOryConfiguration();
   const handleSuccess = (flow) => {
     flowContainer.setFlowContainer(flow);
     methods.reset(computeDefaultValues(flow.flow.ui.nodes));
@@ -846,7 +1049,7 @@ function useOryFormSubmit(onAfterSubmit) {
         if (submitData.method === "code" && data.code) {
           submitData.resend = "";
         }
-        await onSubmitLogin(flowContainer, {
+        await onSubmitLogin(flowContainer, config, {
           onRedirect,
           setFlowContainer: handleSuccess,
           body: submitData
@@ -860,7 +1063,7 @@ function useOryFormSubmit(onAfterSubmit) {
         if (submitData.method === "code" && submitData.code) {
           submitData.resend = "";
         }
-        await onSubmitRegistration(flowContainer, {
+        await onSubmitRegistration(flowContainer, config, {
           onRedirect,
           setFlowContainer: handleSuccess,
           body: submitData
@@ -868,7 +1071,7 @@ function useOryFormSubmit(onAfterSubmit) {
         break;
       }
       case FlowType.Verification:
-        await onSubmitVerification(flowContainer, {
+        await onSubmitVerification(flowContainer, config, {
           onRedirect,
           setFlowContainer: handleSuccess,
           body: data
@@ -881,7 +1084,7 @@ function useOryFormSubmit(onAfterSubmit) {
         if (data.code) {
           submitData.email = "";
         }
-        await onSubmitRecovery(flowContainer, {
+        await onSubmitRecovery(flowContainer, config, {
           onRedirect,
           setFlowContainer: handleSuccess,
           body: submitData
@@ -909,7 +1112,7 @@ function useOryFormSubmit(onAfterSubmit) {
         if ("passkey_remove" in submitData) {
           submitData.method = "passkey";
         }
-        await onSubmitSettings(flowContainer, {
+        await onSubmitSettings(flowContainer, config, {
           onRedirect,
           setFlowContainer: handleSuccess,
           body: submitData
@@ -1076,7 +1279,20 @@ var NodeInput = ({
     case UiNodeInputAttributesTypeEnum.Submit:
     case UiNodeInputAttributesTypeEnum.Button:
       if (isSocial) {
-        return null;
+        return /* @__PURE__ */ jsx(
+          Node2.OidcButton,
+          {
+            node,
+            attributes: attrs,
+            onClick: () => {
+              setValue(
+                "provider",
+                node.attributes.value
+              );
+              setValue("method", node.group);
+            }
+          }
+        );
       }
       if (isResendNode || isScreenSelectionNode) {
         return null;
@@ -1166,6 +1382,37 @@ var Node = ({ node, onClick }) => {
   }
   return null;
 };
+function OryTwoStepCardStateMethodActive({
+  formState
+}) {
+  const { Form } = useComponents();
+  const { flow, flowType, dispatchFormState } = useOryFlow();
+  const { ui } = flow;
+  const nodeSorter = useNodeSorter();
+  const sortNodes = (a, b) => nodeSorter(a, b, { flowType });
+  const groupsToShow = useNodeGroupsWithVisibleNodes(ui.nodes);
+  const finalNodes = getFinalNodes(groupsToShow, formState.method);
+  return /* @__PURE__ */ jsxs(OryCard, { children: [
+    /* @__PURE__ */ jsx(OryCardHeader, {}),
+    /* @__PURE__ */ jsxs(OryCardContent, { children: [
+      /* @__PURE__ */ jsx(OryCardValidationMessages, {}),
+      /* @__PURE__ */ jsx(
+        OryForm,
+        {
+          "data-testid": `ory/form/methods/local`,
+          onAfterSubmit: handleAfterFormSubmit(dispatchFormState),
+          children: /* @__PURE__ */ jsxs(Form.Group, { children: [
+            ui.nodes.filter(
+              (n) => isUiNodeScriptAttributes(n.attributes) || n.group === UiNodeGroupEnum.Default || n.group === UiNodeGroupEnum.Profile
+            ).map((node, k) => /* @__PURE__ */ jsx(Node, { node }, k)),
+            finalNodes.sort(sortNodes).map((node, k) => /* @__PURE__ */ jsx(Node, { node }, k))
+          ] })
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx(OryCardFooter, {})
+  ] });
+}
 function OryFormOidcButtons() {
   const {
     flow: { ui }
@@ -1196,8 +1443,10 @@ function OryFormOidcButtons() {
 }
 function OryFormSocialButtonsForm() {
   const {
-    flow: { ui }
+    flow: { ui },
+    formState
   } = useOryFlow();
+  console.log(formState);
   const filteredNodes = ui.nodes.filter(
     (node) => node.group === UiNodeGroupEnum.Saml || node.group === UiNodeGroupEnum.Oidc
   );
@@ -1206,39 +1455,6 @@ function OryFormSocialButtonsForm() {
   }
   return /* @__PURE__ */ jsx(OryFormProvider, { children: /* @__PURE__ */ jsx(OryForm, { "data-testid": `ory/form/methods/oidc-saml`, children: /* @__PURE__ */ jsx(OryFormOidcButtons, {}) }) });
 }
-function OryTwoStepCardStateMethodActive({
-  formState
-}) {
-  const { Form } = useComponents();
-  const { flow, flowType, dispatchFormState } = useOryFlow();
-  const { ui } = flow;
-  const nodeSorter = useNodeSorter();
-  const sortNodes = (a, b) => nodeSorter(a, b, { flowType });
-  const groupsToShow = useNodeGroupsWithVisibleNodes(ui.nodes);
-  const finalNodes = getFinalNodes(groupsToShow, formState.method);
-  const selectedMethodIsSocial = formState.method === UiNodeGroupEnum.Oidc || formState.method === UiNodeGroupEnum.Saml;
-  return /* @__PURE__ */ jsxs(OryCard, { children: [
-    /* @__PURE__ */ jsx(OryCardHeader, {}),
-    /* @__PURE__ */ jsxs(OryCardContent, { children: [
-      /* @__PURE__ */ jsx(OryCardValidationMessages, {}),
-      selectedMethodIsSocial && /* @__PURE__ */ jsx(OryFormSocialButtonsForm, {}),
-      /* @__PURE__ */ jsx(
-        OryForm,
-        {
-          "data-testid": `ory/form/methods/local`,
-          onAfterSubmit: handleAfterFormSubmit(dispatchFormState),
-          children: /* @__PURE__ */ jsxs(Form.Group, { children: [
-            ui.nodes.filter(
-              (n) => isUiNodeScriptAttributes(n.attributes) || n.group === UiNodeGroupEnum.Captcha || n.group === UiNodeGroupEnum.Default || n.group === UiNodeGroupEnum.Profile
-            ).map((node, k) => /* @__PURE__ */ jsx(Node, { node }, k)),
-            finalNodes.sort(sortNodes).map((node, k) => /* @__PURE__ */ jsx(Node, { node }, k))
-          ] })
-        }
-      )
-    ] }),
-    /* @__PURE__ */ jsx(OryCardFooter, {})
-  ] });
-}
 function OryTwoStepCardStateProvideIdentifier() {
   const { Form, Card } = useComponents();
   const { flowType, flow, dispatchFormState } = useOryFlow();
@@ -2224,9 +2440,11 @@ var en_default = {
   "card.header.parts.oidc": "a social provider",
   "card.header.parts.password.registration": "your {identifierLabel} and a password",
   "card.header.parts.password.login": "your {identifierLabel} and password",
-  "card.header.parts.code": "a code sent to your email",
+  "card.header.parts.code": "a code sent to you",
   "card.header.parts.passkey": "a Passkey",
   "card.header.parts.webauthn": "a security key",
+  "card.header.parts.totp": "your authenticator app",
+  "card.header.parts.lookup_secret": "a backup recovery code",
   "card.header.parts.identifier-first": "your {identifierLabel}",
   "card.header.description.login": "Sign in with {identifierLabel}",
   "card.header.description.registration": "Sign up with {identifierLabel}",
@@ -2474,13 +2692,15 @@ var de_default = {
   "identities.messages.4010009": "Die Authentifizierungsmethode stimmt nicht mit der vorherigen Authentifizierungsmethode \xFCberein. Bitte versuchen Sie es erneut.",
   "identities.messages.4010010": "Die eingegebene Adresse stimmt nicht mit der Adresse \xFCberein, die Sie bei der Registrierung angegeben haben. Bitte versuchen Sie es erneut.",
   "input.placeholder": "{placeholder} eingeben",
-  "card.header.parts.code": "einem Code per E-Mail",
+  "card.header.parts.code": "ein an Sie gesendeter Code",
   "card.header.parts.identifier-first": "Ihr {identifierLabel}",
   "card.header.parts.oidc": "ein sozialer Anbieter",
   "card.header.parts.passkey": "ein Passkey",
   "card.header.parts.password.login": "Ihrer {identifierLabel} und Ihrem Passwort",
   "card.header.parts.password.registration": "Ihrer {identifierLabel} und einem Passwort",
   "card.header.parts.webauthn": "ein Sicherheitsschl\xFCssel",
+  "card.header.parts.totp": "deine Authentifikator-App",
+  "card.header.parts.lookup_secret": "ein Backup-Wiederherstellungscode",
   "recovery.subtitle": "Geben Sie die mit Ihrem Konto verkn\xFCpfte E-Mail-Adresse ein, um einen einmaligen Zugangscode zu erhalten",
   "verification.subtitle": "Geben Sie die mit Ihrem Konto verkn\xFCpfte E-Mail-Adresse ein, um es zu best\xE4tigen",
   "card.header.description.login": "Melden Sie sich mit {identifierLabel} an",
@@ -2819,6 +3039,8 @@ var es_default = {
   "card.header.parts.code": "un c\xF3digo enviado a tu correo electr\xF3nico",
   "card.header.parts.passkey": "una clave de acceso",
   "card.header.parts.webauthn": "una clave de seguridad",
+  "card.header.parts.totp": "su aplicaci\xF3n de autenticaci\xF3n",
+  "card.header.parts.lookup_secret": "un c\xF3digo de recuperaci\xF3n de copia de seguridad",
   "card.header.parts.identifier-first": "tu {identifierLabel}",
   "card.header.description.login": "Iniciar sesi\xF3n con {identifierLabel}",
   "card.header.description.registration": "Registrarse con {identifierLabel}",
@@ -3096,10 +3318,12 @@ var fr_default = {
   "card.header.parts.oidc": "un fournisseur de r\xE9seaux sociaux",
   "card.header.parts.password.registration": "votre {identifierLabel} et un mot de passe",
   "card.header.parts.password.login": "votre {identifierLabel} et votre mot de passe",
-  "card.header.parts.code": "un code envoy\xE9 \xE0 votre adresse e-mail",
   "card.header.parts.passkey": "une cl\xE9 d'acc\xE8s",
   "card.header.parts.webauthn": "une cl\xE9 de s\xE9curit\xE9",
   "card.header.parts.identifier-first": "votre {identifierLabel}",
+  "card.header.parts.code": "un code qui vous a \xE9t\xE9 envoy\xE9",
+  "card.header.parts.totp": "votre application d'authentification",
+  "card.header.parts.lookup_secret": "un code de r\xE9cup\xE9ration de secours",
   "card.header.description.login": "Se connecter avec {identifierLabel}",
   "card.header.description.registration": "S'inscrire avec {identifierLabel}",
   "misc.or": "ou",
@@ -3342,7 +3566,9 @@ var nl_default = {
   "input.placeholder": "",
   "card.header.description.login": "",
   "card.header.description.registration": "",
-  "card.header.parts.code": "",
+  "card.header.parts.code": "een code die naar je is verzonden",
+  "card.header.parts.totp": "je authenticator-app",
+  "card.header.parts.lookup_secret": "een backup herstelcode",
   "card.header.parts.identifier-first": "",
   "card.header.parts.oidc": "",
   "card.header.parts.passkey": "",
@@ -3627,13 +3853,15 @@ var pl_default = {
   "input.placeholder": "",
   "card.header.description.login": "",
   "card.header.description.registration": "",
-  "card.header.parts.code": "",
   "card.header.parts.identifier-first": "",
   "card.header.parts.oidc": "",
   "card.header.parts.passkey": "",
   "card.header.parts.password.login": "",
   "card.header.parts.password.registration": "",
   "card.header.parts.webauthn": "",
+  "card.header.parts.code": "kod wys\u0142any do Ciebie",
+  "card.header.parts.totp": "Twoja aplikacja uwierzytelniaj\u0105ca",
+  "card.header.parts.lookup_secret": "kod odzyskiwania kopii zapasowej",
   "forms.label.forgot-password": "",
   "login.subtitle": "",
   "login.subtitle-refresh": "",
@@ -3912,7 +4140,9 @@ var pt_default = {
   "input.placeholder": "",
   "card.header.description.login": "",
   "card.header.description.registration": "",
-  "card.header.parts.code": "",
+  "card.header.parts.code": "um c\xF3digo enviado para voc\xEA",
+  "card.header.parts.totp": "seu aplicativo autenticador",
+  "card.header.parts.lookup_secret": "um c\xF3digo de recupera\xE7\xE3o de backup",
   "card.header.parts.identifier-first": "",
   "card.header.parts.oidc": "",
   "card.header.parts.passkey": "",
@@ -4197,7 +4427,9 @@ var sv_default = {
   "input.placeholder": "Ange din {placeholder}",
   "card.header.description.login": "Logga in med {identifierLabel}",
   "card.header.description.registration": "Registrera dig med {identifierLabel}",
-  "card.header.parts.code": "en kod skickad till din e-post",
+  "card.header.parts.code": "en kod skickad till dig",
+  "card.header.parts.totp": "din autentiseringsapp",
+  "card.header.parts.lookup_secret": "en s\xE4kerhetskopieringskod",
   "card.header.parts.identifier-first": "din {identifierLabel}",
   "card.header.parts.oidc": "en social leverant\xF6r",
   "card.header.parts.passkey": "en Passkey",
@@ -4282,6 +4514,6 @@ var OryLocales = {
   sv: sv_default
 };
 
-export { HeadlessPageHeader, OryCard, OryCardContent, OryCardFooter, OryCardHeader, OryCardValidationMessages, OryConsentCard, OryForm, OryFormGroupDivider, OryFormGroups, OryFormOidcButtons, OryFormSection, OryFormSocialButtonsForm, OryLocales, OryProvider, OrySettingsCard, OryTwoStepCard, messageTestId, uiTextToFormattedMessage, useComponents, useNodeSorter, useOryFlow };
+export { HeadlessPageHeader, OryCard, OryCardContent, OryCardFooter, OryCardHeader, OryCardValidationMessages, OryConfigurationProvider, OryConsentCard, OryForm, OryFormGroupDivider, OryFormGroups, OryFormOidcButtons, OryFormSection, OryFormSocialButtonsForm, OryLocales, OryProvider, OrySettingsCard, OryTwoStepCard, messageTestId, uiTextToFormattedMessage, useComponents, useNodeSorter, useOryConfiguration, useOryFlow };
 //# sourceMappingURL=index.mjs.map
 //# sourceMappingURL=index.mjs.map