@ory/elements-react 1.0.0-next.6 → 1.0.0-next.8

package/dist/index.js

@@ -1,9 +1,9 @@
 'use strict';
 
-var reactHookForm = require('react-hook-form');
-var reactIntl = require('react-intl');
 var react = require('react');
 var jsxRuntime = require('react/jsx-runtime');
+var reactIntl = require('react-intl');
+var reactHookForm = require('react-hook-form');
 var clientFetch = require('@ory/client-fetch');
 
 var __defProp = Object.defineProperty;
@@ -32,8 +32,8 @@ function useNodeSorter() {
 }
 var defaultGroupOrder = [
   "oidc",
-  "default",
   "identifier_first",
+  "default",
   "profile",
   "password",
   "passkey",
@@ -282,7 +282,15 @@ var de_default = {
   "verification.registration-button": "Registrieren",
   "verification.registration-label": "Sie haben noch kein Konto?",
   "verification.title": "Verifizieren Sie ihr Konto",
-  "verification.back-button": "Zur\xFCck"
+  "verification.back-button": "Zur\xFCck",
+  "two-step.code.description": "Ein Best\xE4tigungscode wird an Ihre E-Mail gesendet.",
+  "two-step.code.title": "E-Mail-Code",
+  "two-step.passkey.description": "Verwenden Sie die Fingerabdruck- oder Gesichtserkennung Ihres Ger\xE4ts",
+  "two-step.passkey.title": "Passwort (empfohlen)",
+  "two-step.password.description": "Geben Sie Ihr Passwort ein, das mit Ihrem Konto verkn\xFCpft ist",
+  "two-step.password.title": "Passwort",
+  "two-step.webauthn.description": "Verwenden Sie Ihren Sicherheitsschl\xFCssel zur Authentifizierung",
+  "two-step.webauthn.title": "Sicherheitsschl\xFCssel"
 };
 
 // src/locales/en.json
@@ -460,7 +468,15 @@ var en_default = {
   "verification.registration-button": "Sign up",
   "verification.registration-label": "Don't have an account?",
   "verification.title": "Verify your account",
-  "verification.back-button": "Back"
+  "verification.back-button": "Back",
+  "two-step.password.title": "Password",
+  "two-step.password.description": "Enter your password associated with your account",
+  "two-step.code.title": "Email code",
+  "two-step.code.description": "A verification code will be sent to your email",
+  "two-step.webauthn.title": "Security Key",
+  "two-step.webauthn.description": "Use your security key to authenticate",
+  "two-step.passkey.title": "Passkey (recommended)",
+  "two-step.passkey.description": "Use your device's for fingerprint or face recognition"
 };
 
 // src/locales/es.json
@@ -638,7 +654,15 @@ var es_default = {
   "verification.registration-button": "Registrarse",
   "verification.registration-label": "\xBFNo tiene una cuenta?",
   "verification.title": "Verificar su cuenta",
-  "verification.back-button": "Regresar"
+  "verification.back-button": "Regresar",
+  "two-step.code.description": "Se enviar\xE1 un c\xF3digo de verificaci\xF3n a tu correo electr\xF3nico.",
+  "two-step.code.title": "C\xF3digo de correo electr\xF3nico",
+  "two-step.passkey.description": "Utiliza el reconocimiento de huellas dactilares o facial de tu dispositivo.",
+  "two-step.passkey.title": "Clave de acceso (recomendada)",
+  "two-step.password.description": "Ingrese la contrase\xF1a asociada con su cuenta",
+  "two-step.password.title": "Contrase\xF1a",
+  "two-step.webauthn.description": "Utiliza tu llave de seguridad para autenticarte",
+  "two-step.webauthn.title": "Clave de Seguridad"
 };
 
 // src/locales/fr.json
@@ -816,7 +840,15 @@ var fr_default = {
   "verification.registration-button": "S'inscrire",
   "verification.registration-label": "Vous n'avez pas de compte ?",
   "verification.title": "V\xE9rifiez votre compte",
-  "verification.back-button": "Revenir en arri\xE8re"
+  "verification.back-button": "Revenir en arri\xE8re",
+  "two-step.code.description": "Un code de v\xE9rification sera envoy\xE9 \xE0 votre email",
+  "two-step.code.title": "Code de courrier \xE9lectronique",
+  "two-step.passkey.description": "Utilisez l'appareil pour la reconnaissance d'empreintes digitales ou de visage",
+  "two-step.passkey.title": "Cl\xE9 de passe (recommand\xE9e)",
+  "two-step.password.description": "Entrez votre mot de passe associ\xE9 \xE0 votre compte",
+  "two-step.password.title": "Mot de passe",
+  "two-step.webauthn.description": "Utilisez votre cl\xE9 de s\xE9curit\xE9 pour vous authentifier",
+  "two-step.webauthn.title": "Cl\xE9 de S\xE9curit\xE9"
 };
 
 // src/locales/nl.json
@@ -994,7 +1026,15 @@ var nl_default = {
   "verification.registration-button": "Registreren",
   "verification.registration-label": "Heb je nog geen account?",
   "verification.title": "Verifieer je account",
-  "verification.back-button": "Ga terug"
+  "verification.back-button": "Ga terug",
+  "two-step.code.description": "Een verificatiecode wordt naar uw e-mail gestuurd",
+  "two-step.code.title": "E-mailcode",
+  "two-step.passkey.description": "Gebruik de vingerafdruk- of gezichtsherkenning van uw apparaat",
+  "two-step.passkey.title": "Toegangscode (aanbevolen)",
+  "two-step.password.description": "Voer uw wachtwoord in dat is gekoppeld aan uw account",
+  "two-step.password.title": "Wachtwoord",
+  "two-step.webauthn.description": "Gebruik uw beveiligingssleutel om te verifi\xEBren",
+  "two-step.webauthn.title": "Beveiligingssleutel"
 };
 
 // src/locales/pl.json
@@ -1172,7 +1212,15 @@ var pl_default = {
   "verification.registration-button": "Zarejestruj si\u0119",
   "verification.registration-label": "Nie posiadasz konta?",
   "verification.title": "Zweryfikuj konto",
-  "verification.back-button": "Cofnij"
+  "verification.back-button": "Cofnij",
+  "two-step.code.description": "Kod weryfikacyjny zostanie wys\u0142any na Tw\xF3j adres email.",
+  "two-step.code.title": "Kod email",
+  "two-step.passkey.description": "U\u017Cyj swojego urz\u0105dzenia lub funkcji rozpoznawania twarzy na swoim urz\u0105dzeniu.",
+  "two-step.passkey.title": "Klucz dost\u0119pu (zalecany)",
+  "two-step.password.description": "Wprowad\u017A has\u0142o powi\u0105zane z twoim kontem",
+  "two-step.password.title": "Has\u0142o",
+  "two-step.webauthn.description": "U\u017Cyj swojego klucza bezpiecze\u0144stwa do uwierzytelnienia",
+  "two-step.webauthn.title": "Klucz bezpiecze\u0144stwa"
 };
 
 // src/locales/pt.json
@@ -1350,7 +1398,15 @@ var pt_default = {
   "verification.registration-button": "Registar",
   "verification.registration-label": "N\xE3o tem uma conta?",
   "verification.title": "Verifique a sua conta",
-  "verification.back-button": "Voltar"
+  "verification.back-button": "Voltar",
+  "two-step.code.description": "Um c\xF3digo de verifica\xE7\xE3o ser\xE1 enviado para o seu email",
+  "two-step.code.title": "C\xF3digo de email",
+  "two-step.passkey.description": "Use o seu dispositivo para reconhecimento de impress\xE3o digital ou facial.",
+  "two-step.passkey.title": "Chave de acesso (recomendado)",
+  "two-step.password.description": "Insira a sua senha associada \xE0 sua conta",
+  "two-step.password.title": "Senha",
+  "two-step.webauthn.description": "Use sua chave de seguran\xE7a para autenticar",
+  "two-step.webauthn.title": "Chave de Seguran\xE7a"
 };
 
 // src/locales/sv.json
@@ -1384,8 +1440,8 @@ var sv_default = {
   "identities.messages.1010013": "Forts\xE4tt",
   "identities.messages.1010014": "Ett e-postmeddelande som inneh\xE5ller en kod har skickats till den e-postadress du angett. Om du inte har f\xE5tt ett mejl, kontrollera stavningen av adressen och f\xF6rs\xF6k logga in igen.",
   "identities.messages.1010015": "Logga in med kod",
-  "identities.messages.1040001": "Logga in",
-  "identities.messages.1040002": "Logga in med {provider}",
+  "identities.messages.1040001": "Skapa konto",
+  "identities.messages.1040002": "Registrera dig med {provider}",
   "identities.messages.1040003": "Forts\xE4tt",
   "identities.messages.1040004": "Registrera med s\xE4kerhetsnyckel",
   "identities.messages.1040005": "Ett e-postmeddelande som inneh\xE5ller en kod har skickats till den e-postadress du angett. Om du inte har f\xE5tt ett e-postmeddelande, kontrollera stavningen av adressen och f\xF6rs\xF6k igen med registreringen.",
@@ -1528,7 +1584,15 @@ var sv_default = {
   "verification.registration-button": "Skapa konto",
   "verification.registration-label": "Har du inget konto?",
   "verification.title": "Verifiera ditt konto",
-  "verification.back-button": "Tillbaka"
+  "verification.back-button": "Tillbaka",
+  "two-step.code.description": "En verifieringskod kommer att skickas till din e-post",
+  "two-step.code.title": "E-postkod",
+  "two-step.passkey.description": "Anv\xE4nd din enhets fingeravtryck eller ansiktsigenk\xE4nning",
+  "two-step.passkey.title": "Passerkod (rekommenderad)",
+  "two-step.password.description": "Ange ditt l\xF6senord kopplat till ditt konto",
+  "two-step.password.title": "L\xF6senord",
+  "two-step.webauthn.description": "Anv\xE4nd din s\xE4kerhetsnyckel f\xF6r att autentisera",
+  "two-step.webauthn.title": "S\xE4kerhetsnyckel"
 };
 var LanguageCodes = [
   "ab",
@@ -1713,8 +1777,6 @@ function OryProvider({
   const { locale, defaultLocale, ...oryFlowProps } = props;
   return /* @__PURE__ */ jsxRuntime.jsx(IntlProvider, { locale: locale != null ? locale : "en", defaultLocale: defaultLocale != null ? defaultLocale : "en", children: /* @__PURE__ */ jsxRuntime.jsx(OryFlowProvider, { ...oryFlowProps, children: /* @__PURE__ */ jsxRuntime.jsx(OryComponentProvider, { components: Components, children }) }) });
 }
-
-// src/util/ui/index.ts
 function triggerToWindowCall(trigger) {
   if (!trigger) {
     return;
@@ -1763,6 +1825,19 @@ function triggerToFunction(trigger) {
   }
   return triggerFn;
 }
+function useNodesGroups(nodes) {
+  const groups = react.useMemo(() => {
+    var _a;
+    const groups2 = {};
+    for (const node of nodes) {
+      const groupNodes = (_a = groups2[node.group]) != null ? _a : [];
+      groupNodes.push(node);
+      groups2[node.group] = groupNodes;
+    }
+    return groups2;
+  }, [nodes]);
+  return groups;
+}
 var NodeInput = ({
   node,
   attributes
@@ -1797,7 +1872,6 @@ var NodeInput = ({
   };
   const isSocial = (attrs.name === "provider" || attrs.name === "link") && node.group === "oidc";
   const isPinCodeInput = attrs.name === "code" && node.group === "code" || attrs.name === "totp_code" && node.group === "totp";
-  const isCurrentIdentifier = attrs.name == "identifier" && node.group === "identifier_first" && attrs.type === "hidden";
   const isResend = attrs.name === "resend" && node.group === "code";
   switch (nodeType) {
     case clientFetch.UiNodeInputAttributesTypeEnum.Submit:
@@ -1828,23 +1902,14 @@ var NodeInput = ({
         }
       );
     case clientFetch.UiNodeInputAttributesTypeEnum.Hidden:
-      return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-        isCurrentIdentifier && /* @__PURE__ */ jsxRuntime.jsx(
-          Components.CurrentIdentifierButton,
-          {
-            attributes: attrs,
-            node
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          Components.Input,
-          {
-            attributes: attrs,
-            node,
-            onClick: handleClick
-          }
-        )
-      ] });
+      return /* @__PURE__ */ jsxRuntime.jsx(
+        Components.Input,
+        {
+          attributes: attrs,
+          node,
+          onClick: handleClick
+        }
+      );
     default:
       if (isPinCodeInput) {
         return /* @__PURE__ */ jsxRuntime.jsx(Components.Label, { attributes: attrs, node, children: /* @__PURE__ */ jsxRuntime.jsx(
@@ -1914,8 +1979,9 @@ function OryFormSocialButtons({
   const {
     flow: { ui }
   } = useOryFlow();
+  const { setValue } = reactHookForm.useFormContext();
   const filteredNodes = ui.nodes.filter((node) => node.group === "oidc");
-  const { SocialButtonContainer, HorizontalDivider } = useComponents();
+  const { SocialButtonContainer, HorizontalDivider, SocialButton } = useComponents();
   if (filteredNodes.length === 0) {
     return null;
   }
@@ -1924,11 +1990,35 @@ function OryFormSocialButtons({
   );
   return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
     /* @__PURE__ */ jsxRuntime.jsx(SocialButtonContainer, { nodes: filteredNodes, children: children != null ? children : filteredNodes.map((node, k) => {
-      return /* @__PURE__ */ jsxRuntime.jsx(Node, { node }, k);
+      return /* @__PURE__ */ jsxRuntime.jsx(
+        SocialButton,
+        {
+          node,
+          attributes: node.attributes,
+          onClick: () => {
+            setValue(
+              "provider",
+              node.attributes.value
+            );
+            setValue("method", "oidc");
+          }
+        },
+        k
+      );
     }) }),
     !hideDivider && filteredNodes.length > 0 && otherNodes.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(HorizontalDivider, {})
   ] });
 }
+function OryFormSocialButtonsForm() {
+  const {
+    flow: { ui }
+  } = useOryFlow();
+  const filteredNodes = ui.nodes.filter((node) => node.group === "oidc");
+  if (filteredNodes.length === 0) {
+    return null;
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(OryForm, { children: /* @__PURE__ */ jsxRuntime.jsx(OryFormSocialButtons, {}) });
+}
 
 // src/util/test-id.ts
 function messageTestId(message) {
@@ -2000,6 +2090,19 @@ var uiTextToFormattedMessage = ({ id, context = {}, text }, intl) => {
     contextInjectedMessage
   );
 };
+function frontendClient(sdkUrl, opts = {}) {
+  const config = new clientFetch.Configuration({
+    ...opts,
+    basePath: sdkUrl,
+    headers: {
+      Accept: "application/json",
+      ...opts.headers
+    }
+  });
+  return new clientFetch.FrontendApi(config);
+}
+
+// src/util/onSubmitLogin.ts
 async function onSubmitLogin({ config, flow }, {
   setFlowContainer,
   body,
@@ -2011,7 +2114,7 @@ async function onSubmitLogin({ config, flow }, {
       `Please supply your Ory Network SDK url to the Ory Elements configuration.`
     );
   }
-  await clientFetch.frontendClient(config.sdk.url, (_a = config.sdk.options) != null ? _a : {}).updateLoginFlowRaw({
+  await frontendClient(config.sdk.url, (_a = config.sdk.options) != null ? _a : {}).updateLoginFlowRaw({
     flow: flow.id,
     updateLoginFlowBody: body
   }).then(() => {
@@ -2044,7 +2147,7 @@ async function onSubmitSettings({ config, flow }, {
       `Please supply your Ory Network SDK url to the Ory Elements configuration.`
     );
   }
-  const client = clientFetch.frontendClient(config.sdk.url, (_a = config.sdk.options) != null ? _a : {});
+  const client = frontendClient(config.sdk.url, (_a = config.sdk.options) != null ? _a : {});
   await client.updateSettingsFlowRaw({
     flow: flow.id,
     updateSettingsFlowBody: body
@@ -2084,7 +2187,7 @@ async function onSubmitRecovery({ config, flow }, {
       `Please supply your Ory Network SDK url to the Ory Elements configuration.`
     );
   }
-  await clientFetch.frontendClient(config.sdk.url, (_a = config.sdk.options) != null ? _a : {}).updateRecoveryFlowRaw({
+  await frontendClient(config.sdk.url, (_a = config.sdk.options) != null ? _a : {}).updateRecoveryFlowRaw({
     flow: flow.id,
     updateRecoveryFlowBody: body
   }).then(async (res) => {
@@ -2127,7 +2230,7 @@ async function onSubmitVerification({ config, flow }, {
       `Please supply your Ory Network SDK URL to the Ory Elements configuration.`
     );
   }
-  await clientFetch.frontendClient(config.sdk.url, (_a = config.sdk.options) != null ? _a : {}).updateVerificationFlowRaw({
+  await frontendClient(config.sdk.url, (_a = config.sdk.options) != null ? _a : {}).updateVerificationFlowRaw({
     flow: flow.id,
     updateVerificationFlowBody: body
   }).then(
@@ -2163,7 +2266,7 @@ async function onSubmitRegistration({ config, flow }, {
       `Please supply your Ory Network SDK url to the Ory Elements configuration.`
     );
   }
-  const client = clientFetch.frontendClient(config.sdk.url, (_a = config.sdk.options) != null ? _a : {});
+  const client = frontendClient(config.sdk.url, (_a = config.sdk.options) != null ? _a : {});
   await client.updateRegistrationFlowRaw({
     flow: flow.id,
     updateRegistrationFlowBody: body
@@ -2233,6 +2336,7 @@ function OryForm({ children }) {
         if (submitData.method === "code" && data.code) {
           submitData.resend = "";
         }
+        console.log(submitData);
         await onSubmitLogin(flowContainer, {
           onRedirect,
           setFlowContainer: handleSuccess,
@@ -2344,6 +2448,108 @@ function OryCardHeader() {
   const { CardHeader } = useComponents();
   return /* @__PURE__ */ jsxRuntime.jsx(CardHeader, {});
 }
+function isChoosingMethod(uiNodes) {
+  return uiNodes.some(
+    (node) => "value" in node.attributes && node.attributes.value === "profile:back"
+  ) || uiNodes.some(
+    (node) => node.group === clientFetch.UiNodeGroupEnum.IdentifierFirst && "name" in node.attributes && node.attributes.name === "identifier" && node.attributes.type === "hidden"
+  );
+}
+function filterZeroStepGroups(nodes) {
+  return nodes.filter((node) => node.group !== clientFetch.UiNodeGroupEnum.Oidc);
+}
+function getFinalNodes(uniqueGroups, selectedGroup) {
+  var _a, _b, _c;
+  const selectedNodes = selectedGroup ? (_a = uniqueGroups[selectedGroup]) != null ? _a : [] : [];
+  return [
+    ...(_b = uniqueGroups == null ? void 0 : uniqueGroups.identifier_first) != null ? _b : [],
+    ...(_c = uniqueGroups == null ? void 0 : uniqueGroups.default) != null ? _c : []
+  ].flat().filter(
+    (node) => "type" in node.attributes && node.attributes.type === "hidden"
+  ).concat(selectedNodes);
+}
+function OryTwoStepCard() {
+  var _a;
+  const {
+    flow: { ui },
+    config
+  } = useOryFlow();
+  const choosingMethod = isChoosingMethod(ui.nodes);
+  const [selectedGroup, setSelectedGroup] = react.useState();
+  const Components = useComponents();
+  const { FormGroup } = useComponents();
+  const { flowType } = useOryFlow();
+  const nodeSorter = useNodeSorter();
+  const sortNodes = (a, b) => nodeSorter(a, b, { flowType });
+  const uniqueGroups = useNodesGroups(ui.nodes);
+  const options = Object.values(clientFetch.UiNodeGroupEnum).filter((group) => {
+    var _a2;
+    return (_a2 = uniqueGroups[group]) == null ? void 0 : _a2.length;
+  }).filter(
+    (group) => ![
+      clientFetch.UiNodeGroupEnum.Oidc,
+      clientFetch.UiNodeGroupEnum.Default,
+      clientFetch.UiNodeGroupEnum.IdentifierFirst,
+      clientFetch.UiNodeGroupEnum.Profile
+    ].includes(group)
+  );
+  const hasOIDC = Boolean((_a = uniqueGroups.oidc) == null ? void 0 : _a.length);
+  const zeroStepGroups = filterZeroStepGroups(ui.nodes);
+  const finalNodes = getFinalNodes(uniqueGroups, selectedGroup);
+  const step = selectedGroup ? 2 /* ExecuteAuthMethod */ : choosingMethod ? 1 /* ChooseAuthMethod */ : 0 /* ProvideIdentifier */;
+  return /* @__PURE__ */ jsxRuntime.jsxs(OryCard, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(OryCardHeader, {}),
+    /* @__PURE__ */ jsxRuntime.jsxs(OryCardContent, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx(OryCardValidationMessages, {}),
+      step === 0 /* ProvideIdentifier */ && hasOIDC && /* @__PURE__ */ jsxRuntime.jsx(OryFormSocialButtonsForm, {}),
+      /* @__PURE__ */ jsxRuntime.jsx(OryForm, { children: /* @__PURE__ */ jsxRuntime.jsxs(FormGroup, { children: [
+        step === 0 /* ProvideIdentifier */ && zeroStepGroups.sort(sortNodes).map((node, k) => /* @__PURE__ */ jsxRuntime.jsx(Node, { node }, k)),
+        step === 1 /* ChooseAuthMethod */ && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+          flowType === clientFetch.FlowType.Login && /* @__PURE__ */ jsxRuntime.jsx(BackButton, { href: config.project.login_ui_url }),
+          options.map((option) => /* @__PURE__ */ jsxRuntime.jsx(
+            Components.AuthMethodListItem,
+            {
+              group: option,
+              onClick: () => setSelectedGroup(option)
+            },
+            option
+          ))
+        ] }),
+        step === 2 /* ExecuteAuthMethod */ && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(BackButton, { onClick: () => setSelectedGroup(void 0) }),
+          finalNodes.sort(sortNodes).map((node, k) => /* @__PURE__ */ jsxRuntime.jsx(Node, { node }, k))
+        ] })
+      ] }) })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx(OryCardFooter, {})
+  ] });
+}
+var BackButton = ({ onClick, href }) => {
+  const {
+    flow: { ui }
+  } = useOryFlow();
+  const Components = useComponents();
+  const nodeBackButton = ui.nodes.find(
+    (node) => (
+      // ("value" in node.attributes &&
+      //   node.attributes.value === "profile:back") ||
+      "name" in node.attributes && node.attributes.name === "identifier" && node.group === "identifier_first"
+    )
+  );
+  if (!nodeBackButton) {
+    return null;
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    Components.CurrentIdentifierButton,
+    {
+      node: nodeBackButton,
+      attributes: nodeBackButton.attributes,
+      onClick,
+      type: onClick ? "button" : void 0,
+      href
+    }
+  );
+};
 function OryCardContent({ children }) {
   const { CardContent } = useComponents();
   if (children) {
@@ -2351,24 +2557,21 @@ function OryCardContent({ children }) {
   }
   return /* @__PURE__ */ jsxRuntime.jsxs(CardContent, { children: [
     /* @__PURE__ */ jsxRuntime.jsx(OryCardValidationMessages, {}),
-    /* @__PURE__ */ jsxRuntime.jsxs(OryForm, { children: [
-      /* @__PURE__ */ jsxRuntime.jsx(OryFormSocialButtons, {}),
-      /* @__PURE__ */ jsxRuntime.jsx(
-        OryFormGroups,
-        {
-          groups: [
-            "default",
-            "password",
-            "passkey",
-            "code",
-            "webauthn",
-            "profile",
-            "totp",
-            "identifier_first"
-          ]
-        }
-      )
-    ] })
+    /* @__PURE__ */ jsxRuntime.jsx(OryForm, { children: /* @__PURE__ */ jsxRuntime.jsx(
+      OryFormGroups,
+      {
+        groups: [
+          "default",
+          "password",
+          "passkey",
+          "code",
+          "webauthn",
+          "profile",
+          "totp",
+          "identifier_first"
+        ]
+      }
+    ) })
   ] });
 }
 function OryCardFooter() {
@@ -2415,8 +2618,10 @@ exports.OryForm = OryForm;
 exports.OryFormGroupDivider = OryFormGroupDivider;
 exports.OryFormGroups = OryFormGroups;
 exports.OryFormSocialButtons = OryFormSocialButtons;
+exports.OryFormSocialButtonsForm = OryFormSocialButtonsForm;
 exports.OryLocales = locales_exports;
 exports.OryProvider = OryProvider;
+exports.OryTwoStepCard = OryTwoStepCard;
 exports.formElementId = formElementId;
 exports.formLabelId = formLabelId;
 exports.formatMessage = formatMessage;