@ory/elements-react 1.0.0-pr.5494d7c2 → 1.0.0-pr.6c5e72b6

package/dist/theme/default/index.mjs

@@ -48,7 +48,10 @@ import {
 import { useIntl as useIntl9 } from "react-intl";
 
 // src/components/card/two-step/state-select-method.tsx
-import { UiNodeGroupEnum as UiNodeGroupEnum15 } from "@ory/client-fetch";
+import {
+  isUiNodeScriptAttributes as isUiNodeScriptAttributes6,
+  UiNodeGroupEnum as UiNodeGroupEnum15
+} from "@ory/client-fetch";
 
 // src/context/component.tsx
 import {
@@ -101,6 +104,27 @@ import {
 } from "@ory/client-fetch";
 import { UiNodeGroupEnum as UiNodeGroupEnum2 } from "@ory/client-fetch";
 import { useMemo } from "react";
+function triggerToFunction(trigger) {
+  if (typeof window === "undefined") {
+    console.debug(
+      "The Ory SDK is missing a required function: window is undefined."
+    );
+    return void 0;
+  }
+  const typedWindow = window;
+  if (!(trigger in typedWindow) || !typedWindow[trigger]) {
+    console.debug(`The Ory SDK is missing a required function: ${trigger}.`);
+    return void 0;
+  }
+  const triggerFn = typedWindow[trigger];
+  if (typeof triggerFn !== "function") {
+    console.debug(
+      `The Ory SDK is missing a required function: ${trigger}. It is not a function.`
+    );
+    return void 0;
+  }
+  return triggerFn;
+}
 function nodesToAuthMethodGroups(nodes, excludeAuthMethods = []) {
   var _a;
   const groups = {};
@@ -281,15 +305,22 @@ import { useFormContext } from "react-hook-form";
 // src/util/onSubmitLogin.ts
 import {
   FlowType as FlowType3,
-  handleFlowError,
   loginUrl
 } from "@ory/client-fetch";
 
+// src/util/sdk-helpers/error.ts
+import {
+  ResponseError,
+  FetchError
+} from "@ory/client-fetch";
+
+// src/util/sdk-helpers/utils.ts
+import { FetchError as FetchError2, ResponseError as ResponseError2 } from "@ory/client-fetch";
+
 // src/util/onSubmitRecovery.ts
 import {
   FlowType as FlowType4,
   handleContinueWith,
-  handleFlowError as handleFlowError2,
   instanceOfContinueWithRecoveryUi,
   recoveryUrl
 } from "@ory/client-fetch";
@@ -298,7 +329,6 @@ import {
 import {
   FlowType as FlowType5,
   handleContinueWith as handleContinueWith2,
-  handleFlowError as handleFlowError3,
   registrationUrl
 } from "@ory/client-fetch";
 
@@ -306,8 +336,7 @@ import {
 import {
   FlowType as FlowType6,
   handleContinueWith as handleContinueWith3,
-  handleFlowError as handleFlowError4,
-  isResponseError,
+  isResponseError as isResponseError2,
   loginUrl as loginUrl2,
   settingsUrl
 } from "@ory/client-fetch";
@@ -315,8 +344,7 @@ import {
 // src/util/onSubmitVerification.ts
 import {
   FlowType as FlowType7,
-  handleFlowError as handleFlowError5,
-  verificationUrl
+  verificationUrl as verificationUrl2
 } from "@ory/client-fetch";
 
 // src/components/form/form-helpers.ts
@@ -702,6 +730,7 @@ var en_default = {
   "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",
+  "two-step.passkey.description.error": "Could not load the necessary libraries to use your Passkey. Please try again later.",
   "two-step.totp.title": "Use your Authenticator App (TOTP)",
   "two-step.totp.description": "Use a 6-digit one-time code from your authenticator app",
   "two-step.lookup_secret.title": "Backup recovery code",
@@ -927,12 +956,13 @@ var de_default = {
   "registration.title": "Konto registrieren",
   "verification.registration-button": "Registrieren",
   "verification.registration-label": "Sie haben noch kein Konto?",
-  "verification.title": "Verifizieren Sie ihr Konto",
+  "verification.title": "Verifizieren Sie Ihr Konto",
   "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": "Passkey (empfohlen)",
+  "two-step.passkey.description": "Verwenden Sie die Fingerabdruck- oder Gesichtserkennung Ihres Ger\xE4ts",
+  "two-step.passkey.description.error": "Konnte die erforderlichen Bibliotheken f\xFCr Passkeys nicht laden. Bitte versuchen Sie es sp\xE4ter erneut.",
   "two-step.password.description": "Geben Sie Ihr Passwort ein, das mit Ihrem Konto verkn\xFCpft ist",
   "two-step.password.title": "Passwort",
   "two-step.webauthn.title": "Sicherheitsschl\xFCssel",
@@ -970,14 +1000,14 @@ var de_default = {
   "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.totp": "Ihre 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",
   "card.header.description.registration": "Registrieren Sie sich mit {identifierLabel}",
   "login.subtitle": "Melden Sie sich mit {parts} an",
-  "login.subtitle-refresh": "Best\xE4tigen Sie ihre Identit\xE4t mit {parts}",
+  "login.subtitle-refresh": "Best\xE4tigen Sie Ihre Identit\xE4t mit {parts}",
   "misc.or": "oder",
   "registration.subtitle": "Registrieren Sie sich mit {parts}",
   "forms.label.forgot-password": "Passwort vergessen?",
@@ -1230,6 +1260,7 @@ var es_default = {
   "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.passkey.description.error": "No se pudieron cargar las bibliotecas necesarias para usar su Passkey. Por favor, int\xE9ntelo de nuevo m\xE1s tarde",
   "two-step.password.description": "Ingrese la contrase\xF1a asociada con su cuenta",
   "two-step.password.title": "Contrase\xF1a",
   "two-step.webauthn.title": "Clave de Seguridad",
@@ -1518,6 +1549,7 @@ var fr_default = {
   "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.passkey.description.error": "Impossible de charger les biblioth\xE8ques n\xE9cessaires pour utiliser votre Passkey. Veuillez r\xE9essayer plus tard.",
   "two-step.password.description": "Entrez votre mot de passe associ\xE9 \xE0 votre compte",
   "two-step.password.title": "Mot de passe",
   "two-step.webauthn.title": "Cl\xE9 de S\xE9curit\xE9",
@@ -1804,6 +1836,7 @@ var nl_default = {
   "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.description.error": "De benodigde bibliotheken om uw Passkey te gebruiken konden niet worden geladen. Probeer het later opnieuw.",
   "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",
@@ -2091,6 +2124,7 @@ var pl_default = {
   "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.description.error": "Nie uda\u0142o si\u0119 za\u0142adowa\u0107 niezb\u0119dnych bibliotek do u\u017Cycia Passkey. Spr\xF3buj ponownie p\xF3\u017Aniej.",
   "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",
@@ -2378,6 +2412,7 @@ var pt_default = {
   "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.description.error": "N\xE3o foi poss\xEDvel carregar as bibliotecas necess\xE1rias para usar o seu Passkey. Por favor, tente novamente mais tarde.",
   "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",
@@ -2684,6 +2719,7 @@ var sv_default = {
   "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.passkey.description.error": "Det gick inte att ladda de n\xF6dv\xE4ndiga biblioteken f\xF6r att anv\xE4nda din Passkey. F\xF6rs\xF6k igen senare.",
   "two-step.password.description": "Ange ditt l\xF6senord kopplat till ditt konto",
   "two-step.password.title": "L\xF6senord",
   "two-step.webauthn.title": "S\xE4kerhetsnyckel",
@@ -4047,64 +4083,76 @@ function DefaultMessage({ message }) {
 }
 
 // src/theme/default/components/card/auth-method-list-item.tsx
+import { useOryFlow as useOryFlow8 } from "@ory/elements-react";
+import { useEffect as useEffect5, useState as useState5 } from "react";
 import { useIntl as useIntl13 } from "react-intl";
+import { useEventListener, useTimeout } from "usehooks-ts";
 
-// src/theme/default/assets/icons/code.svg
+// src/theme/default/assets/icons/alert-triangle.svg
 import * as React17 from "react";
 import { jsx as jsx58 } from "react/jsx-runtime";
-var SvgCode = (props) => {
+var SvgAlertTriangle = (props) => {
   var _a, _b;
-  return /* @__PURE__ */ jsx58("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 15 13", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, ...props, children: /* @__PURE__ */ jsx58("path", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", d: "M6.333 10.666h-4A1.333 1.333 0 0 1 1 9.333V2.666m0 0a1.333 1.333 0 0 1 1.333-1.333h9.334A1.333 1.333 0 0 1 13 2.666m-12 0 6 4 6-4m0 0v4M12.333 12l1.334-1.334-1.334-1.333m-2 0L9 10.666 10.333 12" }) });
+  return /* @__PURE__ */ jsx58("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, ...props, children: /* @__PURE__ */ jsx58("path", { stroke: "#000", strokeLinecap: "round", strokeLinejoin: "round", d: "M12 9v4m0 4h.01M10.24 3.957l-8.422 14.06A1.99 1.99 0 0 0 3.518 21h16.845a1.99 1.99 0 0 0 1.7-2.983L13.64 3.957a1.988 1.988 0 0 0-3.4 0" }) });
 };
-var code_default = SvgCode;
+var alert_triangle_default = SvgAlertTriangle;
 
-// src/theme/default/assets/icons/passkey.svg
+// src/theme/default/assets/icons/code-asterix.svg
 import * as React18 from "react";
 import { jsx as jsx59 } from "react/jsx-runtime";
-var SvgPasskey = (props) => {
+var SvgCodeAsterix = (props) => {
   var _a, _b;
-  return /* @__PURE__ */ jsx59("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 13 14", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, ...props, children: /* @__PURE__ */ jsx59("path", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", d: "M10.602 3.667c.603 1 .86 2.171.733 3.333v.667a4 4 0 0 0 .533 2M3.335 6.333a2.667 2.667 0 0 1 5.333 0V7c0 1.442.468 2.846 1.334 4m-4-4.667v1.334A9.33 9.33 0 0 0 7.668 13M3.335 9a12 12 0 0 0 1.2 4m-3.267-1.333A14.7 14.7 0 0 1 .668 7v-.667a5.333 5.333 0 0 1 8-4.633" }) });
+  return /* @__PURE__ */ jsx59("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 25", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, ...props, children: /* @__PURE__ */ jsx59("path", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 19.325a2 2 0 0 1-2-2v-4l-1-1 1-1v-4a2 2 0 0 1 2-2m6 6.875 3-1.687M12 12.2v3.375m0-3.375-3-1.687m3 1.687 3 1.688M12 12.2V8.825m0 3.375-3 1.688m9 5.437a2 2 0 0 0 2-2v-4l1-1-1-1v-4a2 2 0 0 0-2-2" }) });
 };
-var passkey_default = SvgPasskey;
+var code_asterix_default = SvgCodeAsterix;
 
-// src/theme/default/assets/icons/password.svg
+// src/theme/default/assets/icons/code.svg
 import * as React19 from "react";
 import { jsx as jsx60 } from "react/jsx-runtime";
-var SvgPassword = (props) => {
+var SvgCode = (props) => {
   var _a, _b;
-  return /* @__PURE__ */ jsx60("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 14 4", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, ...props, children: /* @__PURE__ */ jsx60("path", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", d: "M7 .667v2.667m-1.333-.667 2.666-1.333m-2.666 0 2.666 1.333m-6-2v2.667M1 2.667l2.667-1.333M1 1.334l2.667 1.333m8-2v2.667m-1.334-.667L13 1.334m-2.667 0L13 2.667" }) });
+  return /* @__PURE__ */ jsx60("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 15 13", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, ...props, children: /* @__PURE__ */ jsx60("path", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", d: "M6.333 10.666h-4A1.333 1.333 0 0 1 1 9.333V2.666m0 0a1.333 1.333 0 0 1 1.333-1.333h9.334A1.333 1.333 0 0 1 13 2.666m-12 0 6 4 6-4m0 0v4M12.333 12l1.334-1.334-1.334-1.333m-2 0L9 10.666 10.333 12" }) });
 };
-var password_default = SvgPassword;
+var code_default = SvgCode;
 
-// src/theme/default/assets/icons/webauthn.svg
+// src/theme/default/assets/icons/passkey.svg
 import * as React20 from "react";
 import { jsx as jsx61 } from "react/jsx-runtime";
-var SvgWebauthn = (props) => {
+var SvgPasskey = (props) => {
   var _a, _b;
-  return /* @__PURE__ */ jsx61("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 14 14", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, ...props, children: /* @__PURE__ */ jsx61("path", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", d: "M9 5h.007m1.03-3.438 2.401 2.401a1.92 1.92 0 0 1 0 2.713l-1.762 1.762a1.92 1.92 0 0 1-2.713 0l-.2-.2-4.372 4.371a1.33 1.33 0 0 1-.826.386L2.448 13h-.781a.667.667 0 0 1-.662-.589L1 12.333v-.781c0-.313.11-.616.311-.856l.08-.087.276-.276H3V9h1.333V7.667l1.43-1.43-.201-.2a1.92 1.92 0 0 1 0-2.713l1.762-1.762a1.92 1.92 0 0 1 2.713 0" }) });
+  return /* @__PURE__ */ jsx61("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 13 14", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, ...props, children: /* @__PURE__ */ jsx61("path", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", d: "M10.602 3.667c.603 1 .86 2.171.733 3.333v.667a4 4 0 0 0 .533 2M3.335 6.333a2.667 2.667 0 0 1 5.333 0V7c0 1.442.468 2.846 1.334 4m-4-4.667v1.334A9.33 9.33 0 0 0 7.668 13M3.335 9a12 12 0 0 0 1.2 4m-3.267-1.333A14.7 14.7 0 0 1 .668 7v-.667a5.333 5.333 0 0 1 8-4.633" }) });
 };
-var webauthn_default = SvgWebauthn;
+var passkey_default = SvgPasskey;
 
-// src/theme/default/assets/icons/totp.svg
+// src/theme/default/assets/icons/password.svg
 import * as React21 from "react";
 import { jsx as jsx62 } from "react/jsx-runtime";
-var SvgTotp = (props) => {
+var SvgPassword = (props) => {
   var _a, _b;
-  return /* @__PURE__ */ jsx62("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 32 32", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, ...props, children: /* @__PURE__ */ jsx62("path", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9.333 22.667v.013m0-13.346v.013m13.333-.013v.013m0 9.32h-4v4m8-4v.013m-8 7.987h4m0-4h4v4m-21.333-20a1.333 1.333 0 0 1 1.333-1.333H12a1.333 1.333 0 0 1 1.333 1.333V12A1.334 1.334 0 0 1 12 13.334H6.666A1.334 1.334 0 0 1 5.333 12zm13.333 0A1.333 1.333 0 0 1 20 5.334h5.333a1.333 1.333 0 0 1 1.333 1.333V12a1.333 1.333 0 0 1-1.333 1.334H20A1.333 1.333 0 0 1 18.666 12zM5.333 20a1.333 1.333 0 0 1 1.333-1.333H12A1.333 1.333 0 0 1 13.333 20v5.334A1.333 1.333 0 0 1 12 26.667H6.666a1.333 1.333 0 0 1-1.333-1.334z" }) });
+  return /* @__PURE__ */ jsx62("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 14 4", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, ...props, children: /* @__PURE__ */ jsx62("path", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", d: "M7 .667v2.667m-1.333-.667 2.666-1.333m-2.666 0 2.666 1.333m-6-2v2.667M1 2.667l2.667-1.333M1 1.334l2.667 1.333m8-2v2.667m-1.334-.667L13 1.334m-2.667 0L13 2.667" }) });
 };
-var totp_default = SvgTotp;
+var password_default = SvgPassword;
 
-// src/theme/default/assets/icons/code-asterix.svg
+// src/theme/default/assets/icons/totp.svg
 import * as React22 from "react";
 import { jsx as jsx63 } from "react/jsx-runtime";
-var SvgCodeAsterix = (props) => {
+var SvgTotp = (props) => {
   var _a, _b;
-  return /* @__PURE__ */ jsx63("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 25", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, ...props, children: /* @__PURE__ */ jsx63("path", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 19.325a2 2 0 0 1-2-2v-4l-1-1 1-1v-4a2 2 0 0 1 2-2m6 6.875 3-1.687M12 12.2v3.375m0-3.375-3-1.687m3 1.687 3 1.688M12 12.2V8.825m0 3.375-3 1.688m9 5.437a2 2 0 0 0 2-2v-4l1-1-1-1v-4a2 2 0 0 0-2-2" }) });
+  return /* @__PURE__ */ jsx63("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 32 32", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, ...props, children: /* @__PURE__ */ jsx63("path", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9.333 22.667v.013m0-13.346v.013m13.333-.013v.013m0 9.32h-4v4m8-4v.013m-8 7.987h4m0-4h4v4m-21.333-20a1.333 1.333 0 0 1 1.333-1.333H12a1.333 1.333 0 0 1 1.333 1.333V12A1.334 1.334 0 0 1 12 13.334H6.666A1.334 1.334 0 0 1 5.333 12zm13.333 0A1.333 1.333 0 0 1 20 5.334h5.333a1.333 1.333 0 0 1 1.333 1.333V12a1.333 1.333 0 0 1-1.333 1.334H20A1.333 1.333 0 0 1 18.666 12zM5.333 20a1.333 1.333 0 0 1 1.333-1.333H12A1.333 1.333 0 0 1 13.333 20v5.334A1.333 1.333 0 0 1 12 26.667H6.666a1.333 1.333 0 0 1-1.333-1.334z" }) });
 };
-var code_asterix_default = SvgCodeAsterix;
+var totp_default = SvgTotp;
+
+// src/theme/default/assets/icons/webauthn.svg
+import * as React23 from "react";
+import { jsx as jsx64 } from "react/jsx-runtime";
+var SvgWebauthn = (props) => {
+  var _a, _b;
+  return /* @__PURE__ */ jsx64("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 14 14", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, ...props, children: /* @__PURE__ */ jsx64("path", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", d: "M9 5h.007m1.03-3.438 2.401 2.401a1.92 1.92 0 0 1 0 2.713l-1.762 1.762a1.92 1.92 0 0 1-2.713 0l-.2-.2-4.372 4.371a1.33 1.33 0 0 1-.826.386L2.448 13h-.781a.667.667 0 0 1-.662-.589L1 12.333v-.781c0-.313.11-.616.311-.856l.08-.087.276-.276H3V9h1.333V7.667l1.43-1.43-.201-.2a1.92 1.92 0 0 1 0-2.713l1.762-1.762a1.92 1.92 0 0 1 2.713 0" }) });
+};
+var webauthn_default = SvgWebauthn;
 
 // src/theme/default/components/card/list-item.tsx
-import { jsx as jsx64, jsxs as jsxs30 } from "react/jsx-runtime";
+import { jsx as jsx65, jsxs as jsxs30 } from "react/jsx-runtime";
 function ListItem({
   icon: Icon,
   as,
@@ -4121,13 +4169,14 @@ function ListItem({
       ...props,
       className: cn(
         "flex cursor-pointer gap-3 text-left items-start w-full rounded-buttons p-2 hover:bg-interface-background-default-primary-hover",
+        "disabled:hover:bg-ui-transparent disabled:cursor-default disabled:opacity-50",
         className
       ),
       children: [
-        /* @__PURE__ */ jsx64("span", { className: "mt-1", children: Icon && /* @__PURE__ */ jsx64(Icon, { size: 16, className: "text-interface-foreground-brand-primary" }) }),
+        /* @__PURE__ */ jsx65("span", { className: "mt-1", children: Icon && /* @__PURE__ */ jsx65(Icon, { size: 16, className: "text-interface-foreground-brand-primary" }) }),
         /* @__PURE__ */ jsxs30("span", { className: "flex-1 leading-normal inline-flex flex-col max-w-full min-w-1", children: [
-          /* @__PURE__ */ jsx64("span", { className: "text-interface-foreground-default-primary break-words", children: title }),
-          /* @__PURE__ */ jsx64("span", { className: "text-interface-foreground-default-secondary", children: description })
+          /* @__PURE__ */ jsx65("span", { className: "text-interface-foreground-default-primary break-words", children: title }),
+          /* @__PURE__ */ jsx65("span", { className: "text-interface-foreground-default-secondary", children: description })
         ] }),
         children
       ]
@@ -4136,7 +4185,7 @@ function ListItem({
 }
 
 // src/theme/default/components/card/auth-method-list-item.tsx
-import { jsx as jsx65 } from "react/jsx-runtime";
+import { jsx as jsx66 } from "react/jsx-runtime";
 var iconsMap = {
   code: code_default,
   passkey: passkey_default,
@@ -4155,7 +4204,16 @@ function DefaultAuthMethodListItem({
   var _a;
   const intl = useIntl13();
   const Icon = iconsMap[group] || null;
-  return /* @__PURE__ */ jsx65(
+  const { flow } = useOryFlow8();
+  if (group === "passkey") {
+    const passkeyNode = findPasskeyNode(flow);
+    if (!passkeyNode) {
+      console.error("Passkey node not found");
+      return null;
+    }
+    return /* @__PURE__ */ jsx66(PasskeyListItem, { passkeyNode, group, title });
+  }
+  return /* @__PURE__ */ jsx66(
     ListItem,
     {
       as: "button",
@@ -4173,6 +4231,91 @@ function DefaultAuthMethodListItem({
     }
   );
 }
+function findPasskeyNode(flow) {
+  const passkeyTriggerNode = flow.ui.nodes.find(
+    (node) => node.attributes.node_type === "input" && ["passkey_login_trigger", "passkey_register_trigger"].includes(
+      node.attributes.name
+    )
+  );
+  if (!passkeyTriggerNode) {
+    return void 0;
+  }
+  return passkeyTriggerNode;
+}
+function PasskeyListItem({ group, title, passkeyNode }) {
+  var _a, _b;
+  const intl = useIntl13();
+  const Icon = iconsMap[group] || null;
+  const [init, setInit] = useState5(false);
+  const [failedToLoad, setFailedToLoad] = useState5(false);
+  const clickHandler = () => {
+    if (!passkeyNode.attributes.onclickTrigger) {
+      console.error("Passkey node not found");
+      return;
+    }
+    const fn = triggerToFunction(passkeyNode.attributes.onclickTrigger);
+    if (fn) {
+      fn();
+    } else {
+      console.error("Passkey node trigger function not found");
+    }
+  };
+  useEffect5(() => {
+    if (!passkeyNode.attributes.onclickTrigger) {
+      console.error("Passkey node not found");
+      return;
+    }
+    const fn = triggerToFunction(passkeyNode.attributes.onclickTrigger);
+    setInit(typeof fn === "function");
+  }, [passkeyNode]);
+  useEventListener("oryWebAuthnInitialized", () => {
+    setInit(true);
+  });
+  useTimeout(() => {
+    if (!init) {
+      setFailedToLoad(true);
+    }
+  }, 5e3);
+  if (failedToLoad) {
+    return /* @__PURE__ */ jsx66(
+      ListItem,
+      {
+        as: "button",
+        icon: Icon,
+        disabled: true,
+        title: intl.formatMessage(
+          { id: (_a = title == null ? void 0 : title.id) != null ? _a : `two-step.${group}.title` },
+          title == null ? void 0 : title.values
+        ),
+        description: intl.formatMessage({
+          id: "two-step.passkey.description.error"
+        }),
+        type: "button",
+        "data-testid": `ory/form/auth-picker/${group}`,
+        children: /* @__PURE__ */ jsx66(alert_triangle_default, {})
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx66(
+    ListItem,
+    {
+      as: "button",
+      icon: Icon,
+      disabled: !init,
+      name: passkeyNode.attributes.name,
+      title: intl.formatMessage(
+        { id: (_b = title == null ? void 0 : title.id) != null ? _b : `two-step.${group}.title` },
+        title == null ? void 0 : title.values
+      ),
+      description: intl.formatMessage({
+        id: `two-step.${group}.description`
+      }),
+      onClick: clickHandler,
+      type: "button",
+      "data-testid": `ory/form/auth-picker/${group}`
+    }
+  );
+}
 
 // src/theme/default/components/form/button.tsx
 import { getNodeLabel } from "@ory/client-fetch";
@@ -4182,8 +4325,8 @@ import {
 import { cva } from "class-variance-authority";
 import { useFormContext as useFormContext14 } from "react-hook-form";
 import { useIntl as useIntl14 } from "react-intl";
-import { useEffect as useEffect5, useState as useState5 } from "react";
-import { jsx as jsx66, jsxs as jsxs31 } from "react/jsx-runtime";
+import { useEffect as useEffect6, useState as useState6 } from "react";
+import { jsx as jsx67, jsxs as jsxs31 } from "react/jsx-runtime";
 var buttonStyles = cva(
   [
     "relative flex justify-center gap-3 overflow-hidden rounded-buttons leading-none ring-1 ring-inset font-medium",
@@ -4223,14 +4366,14 @@ var DefaultButton = ({
 }) => {
   var _a;
   const { type, name, value, ...rest } = attributes;
-  const [clicked, setClicked] = useState5(false);
+  const [clicked, setClicked] = useState6(false);
   const intl = useIntl14();
   const label = getNodeLabel(node);
   const {
     formState: { isSubmitting },
     setValue
   } = useFormContext14();
-  useEffect5(() => {
+  useEffect6(() => {
     if (!isSubmitting) {
       setClicked(false);
     }
@@ -4256,8 +4399,8 @@ var DefaultButton = ({
       disabled: (_a = rest.disabled) != null ? _a : isSubmitting,
       "data-loading": clicked,
       children: [
-        clicked ? /* @__PURE__ */ jsx66(Spinner, {}) : null,
-        label ? /* @__PURE__ */ jsx66("span", { children: uiTextToFormattedMessage4(label, intl) }) : ""
+        clicked ? /* @__PURE__ */ jsx67(Spinner, {}) : null,
+        label ? /* @__PURE__ */ jsx67("span", { children: uiTextToFormattedMessage4(label, intl) }) : ""
       ]
     }
   );
@@ -4275,7 +4418,7 @@ import { useIntl as useIntl16 } from "react-intl";
 
 // src/theme/default/components/ui/checkbox-label.tsx
 import { useIntl as useIntl15 } from "react-intl";
-import { Fragment as Fragment10, jsx as jsx67 } from "react/jsx-runtime";
+import { Fragment as Fragment10, jsx as jsx68 } from "react/jsx-runtime";
 var linkRegex = /\[([^\]]+)\]\(([^)]+)\)/g;
 function computeLabelElements(labelText) {
   const elements = [];
@@ -4291,7 +4434,7 @@ function computeLabelElements(labelText) {
       elements.push(labelText.slice(lastIndex, matchStart));
     }
     elements.push(
-      /* @__PURE__ */ jsx67(
+      /* @__PURE__ */ jsx68(
         "a",
         {
           href: url,
@@ -4316,13 +4459,13 @@ function CheckboxLabel({ label }) {
     return null;
   }
   const labelText = uiTextToFormattedMessage(label, intl);
-  return /* @__PURE__ */ jsx67(Fragment10, { children: computeLabelElements(labelText) });
+  return /* @__PURE__ */ jsx68(Fragment10, { children: computeLabelElements(labelText) });
 }
 
 // src/theme/default/components/form/checkbox.tsx
-import { jsx as jsx68, jsxs as jsxs32 } from "react/jsx-runtime";
+import { jsx as jsx69, jsxs as jsxs32 } from "react/jsx-runtime";
 function CheckboxSVG() {
-  return /* @__PURE__ */ jsx68(
+  return /* @__PURE__ */ jsx69(
     "svg",
     {
       className: "absolute hidden size-4 peer-checked:block fill-checkbox-foreground-checked",
@@ -4331,7 +4474,7 @@ function CheckboxSVG() {
       height: "16",
       viewBox: "0 0 16 16",
       fill: "none",
-      children: /* @__PURE__ */ jsx68(
+      children: /* @__PURE__ */ jsx69(
         "path",
         {
           fillRule: "evenodd",
@@ -4353,7 +4496,7 @@ var DefaultCheckbox = ({
   const hasError = node.messages.some((m) => m.type === "error");
   return /* @__PURE__ */ jsxs32("label", { className: "flex items-start gap-3 self-stretch antialiased", children: [
     /* @__PURE__ */ jsxs32("span", { className: "flex h-5 items-center", children: [
-      /* @__PURE__ */ jsx68(
+      /* @__PURE__ */ jsx69(
         "input",
         {
           ...omitInputAttributes(attributes),
@@ -4367,11 +4510,11 @@ var DefaultCheckbox = ({
           ...register(name)
         }
       ),
-      /* @__PURE__ */ jsx68(CheckboxSVG, {})
+      /* @__PURE__ */ jsx69(CheckboxSVG, {})
     ] }),
     /* @__PURE__ */ jsxs32("span", { className: "flex flex-col", children: [
-      /* @__PURE__ */ jsx68("span", { className: "font-normal leading-tight text-interface-foreground-default-primary", children: /* @__PURE__ */ jsx68(CheckboxLabel, { label }) }),
-      node.messages.map((message) => /* @__PURE__ */ jsx68(
+      /* @__PURE__ */ jsx69("span", { className: "font-normal leading-tight text-interface-foreground-default-primary", children: /* @__PURE__ */ jsx69(CheckboxLabel, { label }) }),
+      node.messages.map((message) => /* @__PURE__ */ jsx69(
         "span",
         {
           className: cn(
@@ -4388,7 +4531,7 @@ var DefaultCheckbox = ({
 };
 
 // src/theme/default/components/form/group-container.tsx
-import { useOryFlow as useOryFlow8 } from "@ory/elements-react";
+import { useOryFlow as useOryFlow9 } from "@ory/elements-react";
 import { FlowType as FlowType14 } from "@ory/client-fetch";
 
 // src/util/childCounter.ts
@@ -4403,14 +4546,14 @@ function countRenderableChildren(children) {
 }
 
 // src/theme/default/components/form/group-container.tsx
-import { jsx as jsx69 } from "react/jsx-runtime";
+import { jsx as jsx70 } from "react/jsx-runtime";
 function DefaultGroupContainer({ children }) {
-  const { flowType } = useOryFlow8();
+  const { flowType } = useOryFlow9();
   const count = countRenderableChildren(children);
   if (count === 0) {
     return null;
   }
-  return /* @__PURE__ */ jsx69(
+  return /* @__PURE__ */ jsx70(
     "div",
     {
       className: cn(
@@ -4423,16 +4566,16 @@ function DefaultGroupContainer({ children }) {
 }
 
 // src/theme/default/components/form/horizontal-divider.tsx
-import { jsx as jsx70 } from "react/jsx-runtime";
+import { jsx as jsx71 } from "react/jsx-runtime";
 function DefaultHorizontalDivider() {
-  return /* @__PURE__ */ jsx70("hr", { className: "border-interface-border-default-primary" });
+  return /* @__PURE__ */ jsx71("hr", { className: "border-interface-border-default-primary" });
 }
 
 // src/theme/default/components/form/image.tsx
-import { jsx as jsx71 } from "react/jsx-runtime";
+import { jsx as jsx72 } from "react/jsx-runtime";
 function DefaultImage({ attributes, node }) {
   var _a;
-  return /* @__PURE__ */ jsx71("figure", { children: /* @__PURE__ */ jsx71(
+  return /* @__PURE__ */ jsx72("figure", { children: /* @__PURE__ */ jsx72(
     "img",
     {
       ...omitInputAttributes(attributes),
@@ -4445,35 +4588,35 @@ function DefaultImage({ attributes, node }) {
 import { FlowType as FlowType15, getNodeLabel as getNodeLabel3 } from "@ory/client-fetch";
 import {
   uiTextToFormattedMessage as uiTextToFormattedMessage6,
-  useOryFlow as useOryFlow9
+  useOryFlow as useOryFlow10
 } from "@ory/elements-react";
-import { useRef as useRef3, useState as useState6 } from "react";
+import { useRef as useRef3, useState as useState7 } from "react";
 import { useFormContext as useFormContext16 } from "react-hook-form";
 import { useIntl as useIntl17 } from "react-intl";
 
 // src/theme/default/assets/icons/eye-off.svg
-import * as React23 from "react";
-import { jsx as jsx72 } from "react/jsx-runtime";
+import * as React24 from "react";
+import { jsx as jsx73 } from "react/jsx-runtime";
 var SvgEyeOff = (props) => {
   var _a, _b;
-  return /* @__PURE__ */ jsx72("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, ...props, children: /* @__PURE__ */ jsx72("path", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", d: "M10.585 10.587a2 2 0 0 0 2.829 2.828m3.267 3.258A8.7 8.7 0 0 1 12 18q-5.4 0-9-6 1.908-3.18 4.32-4.674m2.86-1.146A9 9 0 0 1 12 6q5.4 0 9 6-1 1.665-2.138 2.87M3 3l18 18" }) });
+  return /* @__PURE__ */ jsx73("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, ...props, children: /* @__PURE__ */ jsx73("path", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", d: "M10.585 10.587a2 2 0 0 0 2.829 2.828m3.267 3.258A8.7 8.7 0 0 1 12 18q-5.4 0-9-6 1.908-3.18 4.32-4.674m2.86-1.146A9 9 0 0 1 12 6q5.4 0 9 6-1 1.665-2.138 2.87M3 3l18 18" }) });
 };
 var eye_off_default = SvgEyeOff;
 
 // src/theme/default/assets/icons/eye.svg
-import * as React24 from "react";
-import { jsx as jsx73, jsxs as jsxs33 } from "react/jsx-runtime";
+import * as React25 from "react";
+import { jsx as jsx74, jsxs as jsxs33 } from "react/jsx-runtime";
 var SvgEye = (props) => {
   var _a, _b;
-  return /* @__PURE__ */ jsx73("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, ...props, children: /* @__PURE__ */ jsxs33("g", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", children: [
-    /* @__PURE__ */ jsx73("path", { d: "M10 12a2 2 0 1 0 4 0 2 2 0 0 0-4 0" }),
-    /* @__PURE__ */ jsx73("path", { d: "M21 12q-3.6 6-9 6t-9-6q3.6-6 9-6t9 6" })
+  return /* @__PURE__ */ jsx74("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, ...props, children: /* @__PURE__ */ jsxs33("g", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", children: [
+    /* @__PURE__ */ jsx74("path", { d: "M10 12a2 2 0 1 0 4 0 2 2 0 0 0-4 0" }),
+    /* @__PURE__ */ jsx74("path", { d: "M21 12q-3.6 6-9 6t-9-6q3.6-6 9-6t9 6" })
   ] }) });
 };
 var eye_default = SvgEye;
 
 // src/theme/default/components/form/input.tsx
-import { jsx as jsx74, jsxs as jsxs34 } from "react/jsx-runtime";
+import { jsx as jsx75, jsxs as jsxs34 } from "react/jsx-runtime";
 var defaultInputClassName = cn(
   "antialiased rounded-forms border leading-tight transition-colors placeholder:h-[20px] placeholder:text-input-foreground-tertiary focus-visible:outline-none focus:ring-0 w-full",
   "bg-input-background-default border-input-border-default text-input-foreground-primary",
@@ -4491,7 +4634,7 @@ var DefaultInput = ({
   const { register } = useFormContext16();
   const { value, autocomplete, name, maxlength, ...rest } = attributes;
   const intl = useIntl17();
-  const { flowType } = useOryFlow9();
+  const { flowType } = useOryFlow10();
   const inputRef = useRef3(null);
   const formattedLabel = label ? intl.formatMessage(
     {
@@ -4503,7 +4646,7 @@ var DefaultInput = ({
     }
   ) : "";
   if (rest.type === "hidden") {
-    return /* @__PURE__ */ jsx74(
+    return /* @__PURE__ */ jsx75(
       "input",
       {
         ...omitInputAttributes(rest),
@@ -4526,7 +4669,7 @@ var DefaultInput = ({
         flowType === FlowType15.Settings && "max-w-[488px]"
       ),
       children: [
-        /* @__PURE__ */ jsx74(
+        /* @__PURE__ */ jsx75(
           "input",
           {
             ...omitInputAttributes(rest),
@@ -4543,7 +4686,7 @@ var DefaultInput = ({
             ...restRegister
           }
         ),
-        rest.type === "password" && /* @__PURE__ */ jsx74(PasswordToggle, { inputRef })
+        rest.type === "password" && /* @__PURE__ */ jsx75(PasswordToggle, { inputRef })
       ]
     }
   );
@@ -4551,21 +4694,21 @@ var DefaultInput = ({
 function PasswordToggle({
   inputRef
 }) {
-  const [shown, setShown] = useState6(false);
+  const [shown, setShown] = useState7(false);
   const handleClick = () => {
     setShown(!shown);
     if (inputRef.current) {
       inputRef.current.type = shown ? "password" : "text";
     }
   };
-  return /* @__PURE__ */ jsx74(
+  return /* @__PURE__ */ jsx75(
     "button",
     {
       onClick: handleClick,
       className: "absolute right-0 h-full w-12 flex items-center justify-center",
       type: "button",
       "aria-label": "Toggle password visibility",
-      children: shown ? /* @__PURE__ */ jsx74(eye_off_default, {}) : /* @__PURE__ */ jsx74(eye_default, {})
+      children: shown ? /* @__PURE__ */ jsx75(eye_off_default, {}) : /* @__PURE__ */ jsx75(eye_default, {})
     }
   );
 }
@@ -4581,11 +4724,11 @@ import {
   uiTextToFormattedMessage as uiTextToFormattedMessage7,
   useComponents as useComponents5,
   useOryConfiguration as useOryConfiguration5,
-  useOryFlow as useOryFlow10
+  useOryFlow as useOryFlow11
 } from "@ory/elements-react";
 import { useFormContext as useFormContext17 } from "react-hook-form";
 import { useIntl as useIntl18 } from "react-intl";
-import { jsx as jsx75, jsxs as jsxs35 } from "react/jsx-runtime";
+import { jsx as jsx76, jsxs as jsxs35 } from "react/jsx-runtime";
 function findResendNode(nodes) {
   return nodes.find(
     (n) => "name" in n.attributes && (n.attributes.name === "email" && n.attributes.type === "submit" || n.attributes.name === "resend")
@@ -4600,7 +4743,7 @@ function DefaultLabel({
   const intl = useIntl18();
   const label = getNodeLabel4(node);
   const { Message } = useComponents5();
-  const { flowType, flow } = useOryFlow10();
+  const { flowType, flow } = useOryFlow11();
   const config = useOryConfiguration5();
   const { setValue, formState } = useFormContext17();
   const isPassword = attributes.type === "password";
@@ -4613,7 +4756,7 @@ function DefaultLabel({
   const fieldError = formState.errors[attributes.name];
   return /* @__PURE__ */ jsxs35("div", { className: "flex flex-col gap-1 antialiased", children: [
     label && /* @__PURE__ */ jsxs35("span", { className: "inline-flex justify-between", children: [
-      /* @__PURE__ */ jsx75(
+      /* @__PURE__ */ jsx76(
         "label",
         {
           ...messageTestId4(label),
@@ -4625,7 +4768,7 @@ function DefaultLabel({
         }
       ),
       isPassword && config.project.recovery_enabled && flowType === FlowType16.Login && // TODO: make it possible to override with a custom component
-      /* @__PURE__ */ jsx75(
+      /* @__PURE__ */ jsx76(
         "a",
         {
           href: initFlowUrl(config.sdk.url, "recovery", flow),
@@ -4636,7 +4779,7 @@ function DefaultLabel({
           })
         }
       ),
-      (resendNode == null ? void 0 : resendNode.attributes.node_type) === "input" && /* @__PURE__ */ jsx75(
+      (resendNode == null ? void 0 : resendNode.attributes.node_type) === "input" && /* @__PURE__ */ jsx76(
         "button",
         {
           type: "submit",
@@ -4649,8 +4792,8 @@ function DefaultLabel({
       )
     ] }),
     children,
-    node.messages.map((message) => /* @__PURE__ */ jsx75(Message.Content, { message }, message.id)),
-    fieldError && instanceOfUiText(fieldError) && /* @__PURE__ */ jsx75(Message.Content, { message: fieldError })
+    node.messages.map((message) => /* @__PURE__ */ jsx76(Message.Content, { message }, message.id)),
+    fieldError && instanceOfUiText(fieldError) && /* @__PURE__ */ jsx76(Message.Content, { message: fieldError })
   ] });
 }
 
@@ -4661,11 +4804,11 @@ import {
 } from "@ory/elements-react";
 import { forwardRef } from "react";
 import { useIntl as useIntl19 } from "react-intl";
-import { jsx as jsx76 } from "react/jsx-runtime";
+import { jsx as jsx77 } from "react/jsx-runtime";
 var DefaultLinkButton = forwardRef(({ attributes, node }, ref) => {
   const intl = useIntl19();
   const label = getNodeLabel5(node);
-  return /* @__PURE__ */ jsx76(
+  return /* @__PURE__ */ jsx77(
     "a",
     {
       ...omitInputAttributes(attributes),
@@ -4686,9 +4829,9 @@ import { useFormContext as useFormContext18 } from "react-hook-form";
 
 // src/theme/default/components/form/shadcn/otp-input.tsx
 import { OTPInput, OTPInputContext } from "input-otp";
-import * as React25 from "react";
-import { jsx as jsx77, jsxs as jsxs36 } from "react/jsx-runtime";
-var InputOTP = React25.forwardRef(({ className, containerClassName, ...props }, ref) => /* @__PURE__ */ jsx77(
+import * as React26 from "react";
+import { jsx as jsx78, jsxs as jsxs36 } from "react/jsx-runtime";
+var InputOTP = React26.forwardRef(({ className, containerClassName, ...props }, ref) => /* @__PURE__ */ jsx78(
   OTPInput,
   {
     ref,
@@ -4701,10 +4844,10 @@ var InputOTP = React25.forwardRef(({ className, containerClassName, ...props },
   }
 ));
 InputOTP.displayName = "InputOTP";
-var InputOTPGroup = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx77("div", { ref, className: cn("flex items-center", className), ...props }));
+var InputOTPGroup = React26.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx78("div", { ref, className: cn("flex items-center", className), ...props }));
 InputOTPGroup.displayName = "InputOTPGroup";
-var InputOTPSlot = React25.forwardRef(({ index, className, ...props }, ref) => {
-  const inputOTPContext = React25.useContext(OTPInputContext);
+var InputOTPSlot = React26.forwardRef(({ index, className, ...props }, ref) => {
+  const inputOTPContext = React26.useContext(OTPInputContext);
   const { char, hasFakeCaret, isActive } = inputOTPContext.slots[index];
   return /* @__PURE__ */ jsxs36(
     "div",
@@ -4718,8 +4861,8 @@ var InputOTPSlot = React25.forwardRef(({ index, className, ...props }, ref) => {
       ),
       ...props,
       children: [
-        /* @__PURE__ */ jsx77("span", { className: "inline-block size-4", children: char }),
-        hasFakeCaret && /* @__PURE__ */ jsx77("div", { className: "pointer-events-none absolute inset-0 flex items-center justify-center", children: /* @__PURE__ */ jsx77("div", { className: "h-4 w-px animate-caret-blink bg-interface-background-brand-primary duration-700" }) })
+        /* @__PURE__ */ jsx78("span", { className: "inline-block size-4", children: char }),
+        hasFakeCaret && /* @__PURE__ */ jsx78("div", { className: "pointer-events-none absolute inset-0 flex items-center justify-center", children: /* @__PURE__ */ jsx78("div", { className: "h-4 w-px animate-caret-blink bg-interface-background-brand-primary duration-700" }) })
       ]
     }
   );
@@ -4727,26 +4870,26 @@ var InputOTPSlot = React25.forwardRef(({ index, className, ...props }, ref) => {
 InputOTPSlot.displayName = "InputOTPSlot";
 
 // src/theme/default/components/form/pin-code-input.tsx
-import { useOryFlow as useOryFlow11 } from "@ory/elements-react";
+import { useOryFlow as useOryFlow12 } from "@ory/elements-react";
 import { FlowType as FlowType17 } from "@ory/client-fetch";
-import { jsx as jsx78 } from "react/jsx-runtime";
+import { jsx as jsx79 } from "react/jsx-runtime";
 var DefaultPinCodeInput = ({ attributes }) => {
   const { setValue, watch } = useFormContext18();
   const { maxlength, name } = attributes;
   const elements = maxlength != null ? maxlength : 6;
-  const { flowType } = useOryFlow11();
+  const { flowType } = useOryFlow12();
   const handleInputChange = (v) => {
     setValue(name, v);
   };
   const value = watch(name);
-  return /* @__PURE__ */ jsx78(
+  return /* @__PURE__ */ jsx79(
     InputOTP,
     {
       maxLength: maxlength != null ? maxlength : 6,
       onChange: handleInputChange,
       name,
       value,
-      children: /* @__PURE__ */ jsx78(
+      children: /* @__PURE__ */ jsx79(
         InputOTPGroup,
         {
           className: cn(
@@ -4754,7 +4897,7 @@ var DefaultPinCodeInput = ({ attributes }) => {
             // The settings flow input fields are supposed to be dense, so we don't need the extra padding we want on the user flows.
             flowType === FlowType17.Settings && "max-w-[488px]"
           ),
-          children: [...Array(elements)].map((_, index) => /* @__PURE__ */ jsx78(InputOTPSlot, { index }, index))
+          children: [...Array(elements)].map((_, index) => /* @__PURE__ */ jsx79(InputOTPSlot, { index }, index))
         }
       )
     }
@@ -4762,13 +4905,13 @@ var DefaultPinCodeInput = ({ attributes }) => {
 };
 
 // src/theme/default/components/form/section.tsx
-import { jsx as jsx79, jsxs as jsxs37 } from "react/jsx-runtime";
+import { jsx as jsx80, jsxs as jsxs37 } from "react/jsx-runtime";
 var DefaultFormSection = ({
   children,
   nodes: _nodes,
   ...rest
 }) => {
-  return /* @__PURE__ */ jsx79(
+  return /* @__PURE__ */ jsx80(
     "form",
     {
       className: "flex w-full max-w-screen-sm flex-col md:max-w-[712px] lg:max-w-[802px] xl:max-w-[896px] px-4",
@@ -4784,8 +4927,8 @@ var DefaultFormSectionContent = ({
 }) => {
   return /* @__PURE__ */ jsxs37("div", { className: "flex flex-col gap-8 rounded-t-cards border border-b-0 border-interface-border-default-primary bg-interface-background-default-primary px-6 py-8", children: [
     /* @__PURE__ */ jsxs37("div", { className: "flex flex-col gap-2", children: [
-      /* @__PURE__ */ jsx79("h3", { className: "font-medium text-interface-foreground-default-primary", children: title }),
-      /* @__PURE__ */ jsx79("span", { className: "text-interface-foreground-default-secondary", children: description })
+      /* @__PURE__ */ jsx80("h3", { className: "font-medium text-interface-foreground-default-primary", children: title }),
+      /* @__PURE__ */ jsx80("span", { className: "text-interface-foreground-default-secondary", children: description })
     ] }),
     children
   ] });
@@ -4801,7 +4944,7 @@ var DefaultFormSectionFooter = ({
         "flex min-h-[72px] items-center justify-between gap-2 rounded-b-cards border border-interface-border-default-primary bg-interface-background-default-secondary px-6 py-4 text-interface-foreground-default-tertiary"
       ),
       children: [
-        /* @__PURE__ */ jsx79("span", { children: text }),
+        /* @__PURE__ */ jsx80("span", { children: text }),
         children
       ]
     }
@@ -4811,31 +4954,31 @@ var DefaultFormSectionFooter = ({
 // src/theme/default/components/form/text.tsx
 import { uiTextToFormattedMessage as uiTextToFormattedMessage9 } from "@ory/elements-react";
 import { useIntl as useIntl20 } from "react-intl";
-import { Fragment as Fragment11, jsx as jsx80, jsxs as jsxs38 } from "react/jsx-runtime";
+import { Fragment as Fragment11, jsx as jsx81, jsxs as jsxs38 } from "react/jsx-runtime";
 function DefaultText({ node, attributes }) {
   var _a;
   const intl = useIntl20();
   const lookup = (_a = attributes.text.context) == null ? void 0 : _a.secrets;
   if (lookup) {
     return /* @__PURE__ */ jsxs38(Fragment11, { children: [
-      /* @__PURE__ */ jsx80("p", { "data-testid": `ory/form/node/text/${attributes.id}/label`, children: node.meta.label ? uiTextToFormattedMessage9(node.meta.label, intl) : "" }),
-      lookup.map((text, index) => /* @__PURE__ */ jsx80(
+      /* @__PURE__ */ jsx81("p", { "data-testid": `ory/form/node/text/${attributes.id}/label`, children: node.meta.label ? uiTextToFormattedMessage9(node.meta.label, intl) : "" }),
+      lookup.map((text, index) => /* @__PURE__ */ jsx81(
         "pre",
         {
           "data-testid": `ory/form/node/text/lookup_secret_codes/text`,
-          children: /* @__PURE__ */ jsx80("code", { children: text ? uiTextToFormattedMessage9(text, intl) : "" })
+          children: /* @__PURE__ */ jsx81("code", { children: text ? uiTextToFormattedMessage9(text, intl) : "" })
         },
         index
       ))
     ] });
   }
-  return /* @__PURE__ */ jsx80(Fragment11, { children: /* @__PURE__ */ jsxs38(
+  return /* @__PURE__ */ jsx81(Fragment11, { children: /* @__PURE__ */ jsxs38(
     "p",
     {
       "data-testid": `ory/form/node/text/${attributes.id}/label`,
       id: attributes.id,
       children: [
-        node.meta.label ? /* @__PURE__ */ jsx80("label", { children: uiTextToFormattedMessage9(node.meta.label, intl) }) : null,
+        node.meta.label ? /* @__PURE__ */ jsx81("label", { children: uiTextToFormattedMessage9(node.meta.label, intl) }) : null,
         attributes.text ? uiTextToFormattedMessage9(attributes.text, intl) : ""
       ]
     }
@@ -4846,7 +4989,7 @@ function DefaultText({ node, attributes }) {
 import {
   useComponents as useComponents6,
   useOryConfiguration as useOryConfiguration7,
-  useOryFlow as useOryFlow12
+  useOryFlow as useOryFlow13
 } from "@ory/elements-react";
 
 // src/theme/default/components/ui/user-menu.tsx
@@ -4854,22 +4997,22 @@ import { useOryConfiguration as useOryConfiguration6 } from "@ory/elements-react
 import { DropdownMenuLabel as DropdownMenuLabel2 } from "@radix-ui/react-dropdown-menu";
 
 // src/theme/default/assets/icons/logout.svg
-import * as React26 from "react";
-import { jsx as jsx81 } from "react/jsx-runtime";
+import * as React27 from "react";
+import { jsx as jsx82 } from "react/jsx-runtime";
 var SvgLogout = (props) => {
   var _a, _b;
-  return /* @__PURE__ */ jsx81("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 16 16", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, ...props, children: /* @__PURE__ */ jsx81("path", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", d: "M9.333 5.334V4A1.333 1.333 0 0 0 8 2.667H3.333A1.333 1.333 0 0 0 2 4v8a1.333 1.333 0 0 0 1.333 1.334H8A1.333 1.333 0 0 0 9.333 12v-1.333M4.667 8H14m0 0-2-2m2 2-2 2" }) });
+  return /* @__PURE__ */ jsx82("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 16 16", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, ...props, children: /* @__PURE__ */ jsx82("path", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", d: "M9.333 5.334V4A1.333 1.333 0 0 0 8 2.667H3.333A1.333 1.333 0 0 0 2 4v8a1.333 1.333 0 0 0 1.333 1.334H8A1.333 1.333 0 0 0 9.333 12v-1.333M4.667 8H14m0 0-2-2m2 2-2 2" }) });
 };
 var logout_default = SvgLogout;
 
 // src/theme/default/assets/icons/settings.svg
-import * as React27 from "react";
-import { jsx as jsx82, jsxs as jsxs39 } from "react/jsx-runtime";
+import * as React28 from "react";
+import { jsx as jsx83, jsxs as jsxs39 } from "react/jsx-runtime";
 var SvgSettings = (props) => {
   var _a, _b;
-  return /* @__PURE__ */ jsx82("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 16 16", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, ...props, children: /* @__PURE__ */ jsxs39("g", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", children: [
-    /* @__PURE__ */ jsx82("path", { d: "M6.883 2.878c.284-1.17 1.95-1.17 2.234 0a1.15 1.15 0 0 0 1.715.71c1.029-.626 2.207.551 1.58 1.58a1.148 1.148 0 0 0 .71 1.715c1.17.284 1.17 1.95 0 2.234a1.15 1.15 0 0 0-.71 1.715c.626 1.029-.551 2.207-1.58 1.58a1.148 1.148 0 0 0-1.715.71c-.284 1.17-1.95 1.17-2.234 0a1.15 1.15 0 0 0-1.715-.71c-1.029.626-2.207-.551-1.58-1.58a1.15 1.15 0 0 0-.71-1.715c-1.17-.284-1.17-1.95 0-2.234a1.15 1.15 0 0 0 .71-1.715c-.626-1.029.551-2.207 1.58-1.58.667.405 1.531.047 1.715-.71" }),
-    /* @__PURE__ */ jsx82("path", { d: "M6 8a2 2 0 1 0 4 0 2 2 0 0 0-4 0" })
+  return /* @__PURE__ */ jsx83("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 16 16", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, ...props, children: /* @__PURE__ */ jsxs39("g", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", children: [
+    /* @__PURE__ */ jsx83("path", { d: "M6.883 2.878c.284-1.17 1.95-1.17 2.234 0a1.15 1.15 0 0 0 1.715.71c1.029-.626 2.207.551 1.58 1.58a1.148 1.148 0 0 0 .71 1.715c1.17.284 1.17 1.95 0 2.234a1.15 1.15 0 0 0-.71 1.715c.626 1.029-.551 2.207-1.58 1.58a1.148 1.148 0 0 0-1.715.71c-.284 1.17-1.95 1.17-2.234 0a1.15 1.15 0 0 0-1.715-.71c-1.029.626-2.207-.551-1.58-1.58a1.15 1.15 0 0 0-.71-1.715c-1.17-.284-1.17-1.95 0-2.234a1.15 1.15 0 0 0 .71-1.715c-.626-1.029.551-2.207 1.58-1.58.667.405 1.531.047 1.715-.71" }),
+    /* @__PURE__ */ jsx83("path", { d: "M6 8a2 2 0 1 0 4 0 2 2 0 0 0-4 0" })
   ] }) });
 };
 var settings_default = SvgSettings;
@@ -4916,10 +5059,10 @@ var getUserInitials = (session) => {
 // src/theme/default/components/ui/dropdown-menu.tsx
 import { forwardRef as forwardRef3 } from "react";
 import * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu";
-import { jsx as jsx83 } from "react/jsx-runtime";
+import { jsx as jsx84 } from "react/jsx-runtime";
 var DropdownMenu = DropdownMenuPrimitive.Root;
 var DropdownMenuTrigger = DropdownMenuPrimitive.Trigger;
-var DropdownMenuContent = forwardRef3(({ className, sideOffset = 16, ...props }, ref) => /* @__PURE__ */ jsx83(DropdownMenuPrimitive.Portal, { children: /* @__PURE__ */ jsx83(
+var DropdownMenuContent = forwardRef3(({ className, sideOffset = 16, ...props }, ref) => /* @__PURE__ */ jsx84(DropdownMenuPrimitive.Portal, { children: /* @__PURE__ */ jsx84(
   DropdownMenuPrimitive.Content,
   {
     ref,
@@ -4934,7 +5077,7 @@ var DropdownMenuContent = forwardRef3(({ className, sideOffset = 16, ...props },
   }
 ) }));
 DropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName;
-var DropdownMenuItem = forwardRef3(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx83(
+var DropdownMenuItem = forwardRef3(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx84(
   DropdownMenuPrimitive.Item,
   {
     ref,
@@ -4952,7 +5095,7 @@ var DropdownMenuItem = forwardRef3(({ className, inset, ...props }, ref) => /* @
   }
 ));
 DropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName;
-var DropdownMenuLabel = forwardRef3(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx83(
+var DropdownMenuLabel = forwardRef3(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx84(
   DropdownMenuPrimitive.Label,
   {
     ref,
@@ -4970,32 +5113,32 @@ DropdownMenuLabel.displayName = DropdownMenuPrimitive.Label.displayName;
 import { forwardRef as forwardRef4 } from "react";
 
 // src/theme/default/assets/icons/user.svg
-import * as React28 from "react";
-import { jsx as jsx84 } from "react/jsx-runtime";
+import * as React29 from "react";
+import { jsx as jsx85 } from "react/jsx-runtime";
 var SvgUser = (props) => {
   var _a, _b;
-  return /* @__PURE__ */ jsx84("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, ...props, children: /* @__PURE__ */ jsx84("path", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", d: "M6 21v-2a4 4 0 0 1 4-4h4a4 4 0 0 1 4 4v2M8 7a4 4 0 1 0 8 0 4 4 0 0 0-8 0" }) });
+  return /* @__PURE__ */ jsx85("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, ...props, children: /* @__PURE__ */ jsx85("path", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", d: "M6 21v-2a4 4 0 0 1 4-4h4a4 4 0 0 1 4 4v2M8 7a4 4 0 1 0 8 0 4 4 0 0 0-8 0" }) });
 };
 var user_default = SvgUser;
 
 // src/theme/default/components/ui/user-avater.tsx
-import { jsx as jsx85 } from "react/jsx-runtime";
+import { jsx as jsx86 } from "react/jsx-runtime";
 var UserAvatar = forwardRef4(
   ({ initials, ...rest }, ref) => {
-    return /* @__PURE__ */ jsx85(
+    return /* @__PURE__ */ jsx86(
       "button",
       {
         ref,
         className: "relative flex size-10 items-center justify-center overflow-hidden rounded-[999px] bg-button-primary-background-default hover:bg-button-primary-background-hover",
         ...rest,
-        children: /* @__PURE__ */ jsx85("div", { className: "relative flex size-full items-center justify-center", children: initials.avatar ? /* @__PURE__ */ jsx85(
+        children: /* @__PURE__ */ jsx86("div", { className: "relative flex size-full items-center justify-center", children: initials.avatar ? /* @__PURE__ */ jsx86(
           "img",
           {
             src: initials.avatar,
             alt: initials.primary,
             className: "w-full object-contain"
           }
-        ) : /* @__PURE__ */ jsx85(
+        ) : /* @__PURE__ */ jsx86(
           user_default,
           {
             size: 24,
@@ -5009,27 +5152,27 @@ var UserAvatar = forwardRef4(
 UserAvatar.displayName = "UserAvatar";
 
 // src/theme/default/components/ui/user-menu.tsx
-import { jsx as jsx86, jsxs as jsxs40 } from "react/jsx-runtime";
+import { jsx as jsx87, jsxs as jsxs40 } from "react/jsx-runtime";
 var UserMenu = ({ session }) => {
   const config = useOryConfiguration6();
   const initials = getUserInitials(session);
   const { logoutFlow } = useClientLogout(config);
   return /* @__PURE__ */ jsxs40(DropdownMenu, { children: [
-    /* @__PURE__ */ jsx86(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsx86(UserAvatar, { initials, title: "User Menu" }) }),
+    /* @__PURE__ */ jsx87(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsx87(UserAvatar, { initials, title: "User Menu" }) }),
     /* @__PURE__ */ jsxs40(DropdownMenuContent, { children: [
       /* @__PURE__ */ jsxs40(DropdownMenuLabel2, { className: "flex gap-3 px-5 py-4.5", children: [
-        /* @__PURE__ */ jsx86(UserAvatar, { disabled: true, initials }),
+        /* @__PURE__ */ jsx87(UserAvatar, { disabled: true, initials }),
         /* @__PURE__ */ jsxs40("div", { className: "flex flex-col justify-center text-sm leading-tight", children: [
-          /* @__PURE__ */ jsx86("div", { className: "text-interface-foreground-default-primary leading-tight font-medium", children: initials.primary }),
-          initials.secondary && /* @__PURE__ */ jsx86("div", { className: "text-interface-foreground-default-tertiary leading-tight", children: initials.secondary })
+          /* @__PURE__ */ jsx87("div", { className: "text-interface-foreground-default-primary leading-tight font-medium", children: initials.primary }),
+          initials.secondary && /* @__PURE__ */ jsx87("div", { className: "text-interface-foreground-default-tertiary leading-tight", children: initials.secondary })
         ] })
       ] }),
-      /* @__PURE__ */ jsx86(DropdownMenuItem, { asChild: true, children: /* @__PURE__ */ jsxs40("a", { href: "/settings", children: [
-        /* @__PURE__ */ jsx86(settings_default, { size: 16 }),
+      /* @__PURE__ */ jsx87(DropdownMenuItem, { asChild: true, children: /* @__PURE__ */ jsxs40("a", { href: "/settings", children: [
+        /* @__PURE__ */ jsx87(settings_default, { size: 16 }),
         " User settings"
       ] }) }),
-      /* @__PURE__ */ jsx86(DropdownMenuItem, { asChild: true, disabled: !(logoutFlow == null ? void 0 : logoutFlow.logout_url), children: /* @__PURE__ */ jsxs40("a", { href: logoutFlow == null ? void 0 : logoutFlow.logout_url, children: [
-        /* @__PURE__ */ jsx86(logout_default, { size: 16 }),
+      /* @__PURE__ */ jsx87(DropdownMenuItem, { asChild: true, disabled: !(logoutFlow == null ? void 0 : logoutFlow.logout_url), children: /* @__PURE__ */ jsxs40("a", { href: logoutFlow == null ? void 0 : logoutFlow.logout_url, children: [
+        /* @__PURE__ */ jsx87(logout_default, { size: 16 }),
         " Logout"
       ] }) })
     ] })
@@ -5039,28 +5182,28 @@ var UserMenu = ({ session }) => {
 // src/theme/default/components/generic/page-header.tsx
 import { useSession } from "@ory/elements-react/client";
 import { useIntl as useIntl21 } from "react-intl";
-import { jsx as jsx87, jsxs as jsxs41 } from "react/jsx-runtime";
+import { jsx as jsx88, jsxs as jsxs41 } from "react/jsx-runtime";
 var DefaultPageHeader = (_props) => {
   var _a;
   const { Card } = useComponents6();
   const { session } = useSession();
   const intl = useIntl21();
-  const { flow } = useOryFlow12();
+  const { flow } = useOryFlow13();
   const config = useOryConfiguration7();
   const returnUrl = (_a = flow.return_to) != null ? _a : config.project.default_redirect_url;
-  return /* @__PURE__ */ jsx87("div", { className: "mt-16 flex max-w-screen-sm w-full md:max-w-[712px] lg:max-w-[802px] xl:max-w-[896px] flex-col gap-3 px-4", children: /* @__PURE__ */ jsxs41("div", { className: "flex flex-col gap-12", children: [
+  return /* @__PURE__ */ jsx88("div", { className: "mt-16 flex max-w-screen-sm w-full md:max-w-[712px] lg:max-w-[802px] xl:max-w-[896px] flex-col gap-3 px-4", children: /* @__PURE__ */ jsxs41("div", { className: "flex flex-col gap-12", children: [
     /* @__PURE__ */ jsxs41("div", { className: "flex max-h-10 flex-1 justify-between gap-2 items-center", children: [
-      /* @__PURE__ */ jsx87(Card.Logo, {}),
-      /* @__PURE__ */ jsx87(UserMenu, { session })
+      /* @__PURE__ */ jsx88(Card.Logo, {}),
+      /* @__PURE__ */ jsx88(UserMenu, { session })
     ] }),
-    returnUrl && /* @__PURE__ */ jsx87("div", { children: /* @__PURE__ */ jsxs41(
+    returnUrl && /* @__PURE__ */ jsx88("div", { children: /* @__PURE__ */ jsxs41(
       "a",
       {
         "data-testid": "ory/screen/settings/back-button",
         href: returnUrl,
         className: "inline-flex gap-2 items-center",
         children: [
-          /* @__PURE__ */ jsx87(arrow_left_default, {}),
+          /* @__PURE__ */ jsx88(arrow_left_default, {}),
           " ",
           intl.formatMessage({
             id: "settings.navigation-back-button",
@@ -5073,21 +5216,21 @@ var DefaultPageHeader = (_props) => {
 };
 
 // src/theme/default/components/settings/settings-oidc.tsx
-import { useEffect as useEffect6 } from "react";
+import { useEffect as useEffect7 } from "react";
 import { useFormContext as useFormContext19 } from "react-hook-form";
 import { useDebounceValue as useDebounceValue2 } from "usehooks-ts";
 
 // src/theme/default/assets/icons/trash.svg
-import * as React29 from "react";
-import { jsx as jsx88 } from "react/jsx-runtime";
+import * as React30 from "react";
+import { jsx as jsx89 } from "react/jsx-runtime";
 var SvgTrash = (props) => {
   var _a, _b;
-  return /* @__PURE__ */ jsx88("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, ...props, children: /* @__PURE__ */ jsx88("path", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", d: "M4 7h16m-10 4v6m4-6v6M5 7l1 12a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2l1-12M9 7V4a1 1 0 0 1 1-1h4a1 1 0 0 1 1 1v3" }) });
+  return /* @__PURE__ */ jsx89("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, ...props, children: /* @__PURE__ */ jsx89("path", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", d: "M4 7h16m-10 4v6m4-6v6M5 7l1 12a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2l1-12M9 7V4a1 1 0 0 1 1-1h4a1 1 0 0 1 1 1v3" }) });
 };
 var trash_default = SvgTrash;
 
 // src/theme/default/components/settings/settings-oidc.tsx
-import { jsx as jsx89, jsxs as jsxs42 } from "react/jsx-runtime";
+import { jsx as jsx90, jsxs as jsxs42 } from "react/jsx-runtime";
 function DefaultSettingsOidc({
   linkButtons,
   unlinkButtons
@@ -5095,9 +5238,9 @@ function DefaultSettingsOidc({
   const hasLinkButtons = linkButtons.length > 0;
   const hasUnlinkButtons = unlinkButtons.length > 0;
   return /* @__PURE__ */ jsxs42("div", { className: "flex flex-col gap-8", children: [
-    hasLinkButtons && /* @__PURE__ */ jsx89("div", { className: "grid items-start gap-3 grid-cols-1 sm:grid-cols-2 md:grid-cols-3", children: linkButtons.map((button) => {
+    hasLinkButtons && /* @__PURE__ */ jsx90("div", { className: "grid items-start gap-3 grid-cols-1 sm:grid-cols-2 md:grid-cols-3", children: linkButtons.map((button) => {
       const attrs = button.attributes;
-      return /* @__PURE__ */ jsx89(
+      return /* @__PURE__ */ jsx90(
         DefaultButtonSocial,
         {
           showLabel: true,
@@ -5108,12 +5251,12 @@ function DefaultSettingsOidc({
         attrs.value
       );
     }) }),
-    hasUnlinkButtons && hasLinkButtons ? /* @__PURE__ */ jsx89(DefaultHorizontalDivider, {}) : null,
+    hasUnlinkButtons && hasLinkButtons ? /* @__PURE__ */ jsx90(DefaultHorizontalDivider, {}) : null,
     unlinkButtons.map((button) => {
       if (button.attributes.node_type !== "input") {
         return null;
       }
-      return /* @__PURE__ */ jsx89(UnlinkRow, { button }, button.attributes.value);
+      return /* @__PURE__ */ jsx90(UnlinkRow, { button }, button.attributes.value);
     })
   ] });
 }
@@ -5130,7 +5273,7 @@ function UnlinkRow({ button }) {
     button.onClick();
     setClicked(true);
   };
-  useEffect6(() => {
+  useEffect7(() => {
     if (!isSubmitting) {
       setClicked(false);
     }
@@ -5138,10 +5281,10 @@ function UnlinkRow({ button }) {
   console.log((_c = button.meta.label) == null ? void 0 : _c.context);
   return /* @__PURE__ */ jsxs42("div", { className: "flex justify-between", children: [
     /* @__PURE__ */ jsxs42("div", { className: "flex items-center gap-6", children: [
-      Logo ? /* @__PURE__ */ jsx89(Logo, { size: 32 }) : /* @__PURE__ */ jsx89(GenericLogo, { label: provider.slice(0, 1) }),
-      /* @__PURE__ */ jsx89("p", { className: "text-sm font-medium text-interface-foreground-default-secondary", children: provider })
+      Logo ? /* @__PURE__ */ jsx90(Logo, { size: 32 }) : /* @__PURE__ */ jsx90(GenericLogo, { label: provider.slice(0, 1) }),
+      /* @__PURE__ */ jsx90("p", { className: "text-sm font-medium text-interface-foreground-default-secondary", children: provider })
     ] }),
-    /* @__PURE__ */ jsx89(
+    /* @__PURE__ */ jsx90(
       "button",
       {
         ...omitInputAttributes(attrs),
@@ -5150,7 +5293,7 @@ function UnlinkRow({ button }) {
         disabled: isSubmitting,
         className: "relative",
         title: `Unlink ${provider}`,
-        children: clicked ? /* @__PURE__ */ jsx89(Spinner, { className: "relative" }) : /* @__PURE__ */ jsx89(
+        children: clicked ? /* @__PURE__ */ jsx90(Spinner, { className: "relative" }) : /* @__PURE__ */ jsx90(
           trash_default,
           {
             className: "text-button-link-default-secondary hover:text-button-link-default-secondary-hover",
@@ -5165,7 +5308,7 @@ function UnlinkRow({ button }) {
 // src/theme/default/components/settings/settings-passkey.tsx
 import { useComponents as useComponents7 } from "@ory/elements-react";
 import { useFormContext as useFormContext20 } from "react-hook-form";
-import { jsx as jsx90, jsxs as jsxs43 } from "react/jsx-runtime";
+import { jsx as jsx91, jsxs as jsxs43 } from "react/jsx-runtime";
 function DefaultSettingsPasskey({
   triggerButton,
   removeButtons
@@ -5176,7 +5319,7 @@ function DefaultSettingsPasskey({
   const { Node: Node2 } = useComponents7();
   const hasRemoveButtons = removeButtons.length > 0;
   return /* @__PURE__ */ jsxs43("div", { className: "flex flex-col gap-8", children: [
-    /* @__PURE__ */ jsx90("div", { className: "flex max-w-[60%] items-end gap-3", children: triggerButton && /* @__PURE__ */ jsx90(
+    /* @__PURE__ */ jsx91("div", { className: "flex max-w-[60%] items-end gap-3", children: triggerButton && /* @__PURE__ */ jsx91(
       Node2.Button,
       {
         node: triggerButton,
@@ -5185,8 +5328,8 @@ function DefaultSettingsPasskey({
       }
     ) }),
     hasRemoveButtons ? /* @__PURE__ */ jsxs43("div", { className: "flex flex-col gap-8", children: [
-      /* @__PURE__ */ jsx90(DefaultHorizontalDivider, {}),
-      /* @__PURE__ */ jsx90("div", { className: "flex flex-col gap-2", children: removeButtons.map((node, i) => {
+      /* @__PURE__ */ jsx91(DefaultHorizontalDivider, {}),
+      /* @__PURE__ */ jsx91("div", { className: "flex flex-col gap-2", children: removeButtons.map((node, i) => {
         var _a, _b;
         const context = (_b = (_a = node.meta.label) == null ? void 0 : _a.context) != null ? _b : {};
         const addedAt = "added_at" in context ? context.added_at : null;
@@ -5198,7 +5341,7 @@ function DefaultSettingsPasskey({
             className: "flex justify-between gap-6 md:items-center",
             children: [
               /* @__PURE__ */ jsxs43("div", { className: "flex gap-2 items-center flex-1 truncate", children: [
-                /* @__PURE__ */ jsx90(
+                /* @__PURE__ */ jsx91(
                   passkey_default,
                   {
                     size: 32,
@@ -5207,15 +5350,15 @@ function DefaultSettingsPasskey({
                 ),
                 /* @__PURE__ */ jsxs43("div", { className: "flex-1 flex-col md:flex-row md:items-center flex md:justify-between gap-4 truncate", children: [
                   /* @__PURE__ */ jsxs43("div", { className: "flex-1 flex-col truncate", children: [
-                    /* @__PURE__ */ jsx90("p", { className: "text-sm font-medium text-interface-foreground-default-secondary truncate", children: displayName }),
-                    /* @__PURE__ */ jsx90("span", { className: "text-sm text-interface-foreground-default-tertiary hidden sm:block truncate", children: keyId })
+                    /* @__PURE__ */ jsx91("p", { className: "text-sm font-medium text-interface-foreground-default-secondary truncate", children: displayName }),
+                    /* @__PURE__ */ jsx91("span", { className: "text-sm text-interface-foreground-default-tertiary hidden sm:block truncate", children: keyId })
                   ] }),
-                  addedAt && /* @__PURE__ */ jsx90("p", { className: "text-sm text-interface-foreground-default-tertiary", children: new Intl.DateTimeFormat(void 0, {
+                  addedAt && /* @__PURE__ */ jsx91("p", { className: "text-sm text-interface-foreground-default-tertiary", children: new Intl.DateTimeFormat(void 0, {
                     dateStyle: "long"
                   }).format(new Date(addedAt)) })
                 ] })
               ] }),
-              /* @__PURE__ */ jsx90(
+              /* @__PURE__ */ jsx91(
                 "button",
                 {
                   ...node.attributes,
@@ -5223,7 +5366,7 @@ function DefaultSettingsPasskey({
                   onClick: node.onClick,
                   disabled: isSubmitting,
                   className: "relative",
-                  children: isSubmitting ? /* @__PURE__ */ jsx90(Spinner, { className: "relative" }) : /* @__PURE__ */ jsx90(
+                  children: isSubmitting ? /* @__PURE__ */ jsx91(Spinner, { className: "relative" }) : /* @__PURE__ */ jsx91(
                     trash_default,
                     {
                       className: "text-button-link-default-secondary hover:text-button-link-default-secondary-hover",
@@ -5242,26 +5385,26 @@ function DefaultSettingsPasskey({
 }
 
 // src/theme/default/assets/icons/download.svg
-import * as React30 from "react";
-import { jsx as jsx91 } from "react/jsx-runtime";
+import * as React31 from "react";
+import { jsx as jsx92 } from "react/jsx-runtime";
 var SvgDownload = (props) => {
   var _a, _b;
-  return /* @__PURE__ */ jsx91("svg", { xmlns: "http://www.w3.org/2000/svg", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, fill: "none", ...props, children: /* @__PURE__ */ jsx91("path", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", d: "M4 17v2a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-2M7 11l5 5m0 0 5-5m-5 5V4" }) });
+  return /* @__PURE__ */ jsx92("svg", { xmlns: "http://www.w3.org/2000/svg", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, fill: "none", ...props, children: /* @__PURE__ */ jsx92("path", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", d: "M4 17v2a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-2M7 11l5 5m0 0 5-5m-5 5V4" }) });
 };
 var download_default = SvgDownload;
 
 // src/theme/default/assets/icons/refresh.svg
-import * as React31 from "react";
-import { jsx as jsx92 } from "react/jsx-runtime";
+import * as React32 from "react";
+import { jsx as jsx93 } from "react/jsx-runtime";
 var SvgRefresh = (props) => {
   var _a, _b;
-  return /* @__PURE__ */ jsx92("svg", { xmlns: "http://www.w3.org/2000/svg", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, fill: "none", ...props, children: /* @__PURE__ */ jsx92("path", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", d: "M20 11A8.1 8.1 0 0 0 4.5 9M4 5v4h4m-4 4a8.1 8.1 0 0 0 15.5 2m.5 4v-4h-4" }) });
+  return /* @__PURE__ */ jsx93("svg", { xmlns: "http://www.w3.org/2000/svg", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, fill: "none", ...props, children: /* @__PURE__ */ jsx93("path", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", d: "M20 11A8.1 8.1 0 0 0 4.5 9M4 5v4h4m-4 4a8.1 8.1 0 0 0 15.5 2m.5 4v-4h-4" }) });
 };
 var refresh_default = SvgRefresh;
 
 // src/theme/default/components/settings/settings-recovery-codes.tsx
 import { useFormContext as useFormContext21 } from "react-hook-form";
-import { Fragment as Fragment12, jsx as jsx93, jsxs as jsxs44 } from "react/jsx-runtime";
+import { Fragment as Fragment12, jsx as jsx94, jsxs as jsxs44 } from "react/jsx-runtime";
 function DefaultSettingsRecoveryCodes({
   codes,
   regnerateButton,
@@ -5284,11 +5427,11 @@ function DefaultSettingsRecoveryCodes({
   };
   const hasCodes = codes.length >= 1;
   return /* @__PURE__ */ jsxs44("div", { className: "flex flex-col gap-8", children: [
-    codes.length > 0 && /* @__PURE__ */ jsx93(DefaultHorizontalDivider, {}),
+    codes.length > 0 && /* @__PURE__ */ jsx94(DefaultHorizontalDivider, {}),
     /* @__PURE__ */ jsxs44("div", { className: "flex gap-4 justify-between", children: [
-      /* @__PURE__ */ jsx93("span", { className: "text-interface-foreground-default-tertiary", children: revealButton && "Reveal recovery codes" }),
+      /* @__PURE__ */ jsx94("span", { className: "text-interface-foreground-default-tertiary", children: revealButton && "Reveal recovery codes" }),
       /* @__PURE__ */ jsxs44("div", { className: "flex gap-2", children: [
-        regnerateButton && codes.length > 0 && /* @__PURE__ */ jsx93(
+        regnerateButton && codes.length > 0 && /* @__PURE__ */ jsx94(
           "button",
           {
             ...regnerateButton.attributes,
@@ -5297,7 +5440,7 @@ function DefaultSettingsRecoveryCodes({
             onClick: onRegenerate,
             disabled: isSubmitting,
             "data-loading": isSubmitting,
-            children: /* @__PURE__ */ jsx93(
+            children: /* @__PURE__ */ jsx94(
               refresh_default,
               {
                 size: 24,
@@ -5306,7 +5449,7 @@ function DefaultSettingsRecoveryCodes({
             )
           }
         ),
-        revealButton && /* @__PURE__ */ jsx93(Fragment12, { children: /* @__PURE__ */ jsx93(
+        revealButton && /* @__PURE__ */ jsx94(Fragment12, { children: /* @__PURE__ */ jsx94(
           "button",
           {
             ...revealButton.attributes,
@@ -5314,7 +5457,7 @@ function DefaultSettingsRecoveryCodes({
             className: "ml-auto",
             onClick: onReveal,
             title: "Reveal recovery codes",
-            children: /* @__PURE__ */ jsx93(
+            children: /* @__PURE__ */ jsx94(
               eye_default,
               {
                 size: 24,
@@ -5323,7 +5466,7 @@ function DefaultSettingsRecoveryCodes({
             )
           }
         ) }),
-        hasCodes && /* @__PURE__ */ jsx93(
+        hasCodes && /* @__PURE__ */ jsx94(
           "button",
           {
             onClick: onDownload,
@@ -5331,7 +5474,7 @@ function DefaultSettingsRecoveryCodes({
             className: "ml-auto",
             "data-testid": "ory/screen/settings/group/recovery_code/download",
             title: "Download recovery codes",
-            children: /* @__PURE__ */ jsx93(
+            children: /* @__PURE__ */ jsx94(
               download_default,
               {
                 size: 24,
@@ -5342,12 +5485,12 @@ function DefaultSettingsRecoveryCodes({
         )
       ] })
     ] }),
-    hasCodes ? /* @__PURE__ */ jsx93("div", { className: "rounded-general p-6 bg-interface-background-default-secondary border-interface-border-default-primary", children: /* @__PURE__ */ jsx93(
+    hasCodes ? /* @__PURE__ */ jsx94("div", { className: "rounded-general p-6 bg-interface-background-default-secondary border-interface-border-default-primary", children: /* @__PURE__ */ jsx94(
       "div",
       {
         className: "grid grid-cols-2 sm:grid-cols-3 md:grid-cols-5 flex-wrap gap-4 text-sm text-interface-foreground-default-primary",
         "data-testid": "ory/screen/settings/group/recovery_code/codes",
-        children: codes.map((code) => /* @__PURE__ */ jsx93("p", { children: code }, code))
+        children: codes.map((code) => /* @__PURE__ */ jsx94("p", { children: code }, code))
       }
     ) }) : null
   ] });
@@ -5357,17 +5500,17 @@ function DefaultSettingsRecoveryCodes({
 import { useComponents as useComponents8 } from "@ory/elements-react";
 
 // src/theme/default/assets/icons/qrcode.svg
-import * as React32 from "react";
-import { jsx as jsx94 } from "react/jsx-runtime";
+import * as React33 from "react";
+import { jsx as jsx95 } from "react/jsx-runtime";
 var SvgQrcode = (props) => {
   var _a, _b;
-  return /* @__PURE__ */ jsx94("svg", { xmlns: "http://www.w3.org/2000/svg", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, fill: "none", ...props, children: /* @__PURE__ */ jsx94("path", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", d: "M9.333 22.667v.013m0-13.346v.013m13.333-.013v.013m0 9.32h-4v4m8-4v.013m-8 7.987h4m0-4h4v4m-21.333-20a1.333 1.333 0 0 1 1.333-1.333H12a1.333 1.333 0 0 1 1.333 1.333V12A1.334 1.334 0 0 1 12 13.334H6.666A1.334 1.334 0 0 1 5.333 12zm13.333 0A1.333 1.333 0 0 1 20 5.334h5.333a1.333 1.333 0 0 1 1.333 1.333V12a1.333 1.333 0 0 1-1.333 1.334H20A1.333 1.333 0 0 1 18.666 12zM5.333 20a1.333 1.333 0 0 1 1.333-1.333H12A1.333 1.333 0 0 1 13.333 20v5.334A1.333 1.333 0 0 1 12 26.667H6.666a1.333 1.333 0 0 1-1.333-1.334z" }) });
+  return /* @__PURE__ */ jsx95("svg", { xmlns: "http://www.w3.org/2000/svg", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, fill: "none", ...props, children: /* @__PURE__ */ jsx95("path", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", d: "M9.333 22.667v.013m0-13.346v.013m13.333-.013v.013m0 9.32h-4v4m8-4v.013m-8 7.987h4m0-4h4v4m-21.333-20a1.333 1.333 0 0 1 1.333-1.333H12a1.333 1.333 0 0 1 1.333 1.333V12A1.334 1.334 0 0 1 12 13.334H6.666A1.334 1.334 0 0 1 5.333 12zm13.333 0A1.333 1.333 0 0 1 20 5.334h5.333a1.333 1.333 0 0 1 1.333 1.333V12a1.333 1.333 0 0 1-1.333 1.334H20A1.333 1.333 0 0 1 18.666 12zM5.333 20a1.333 1.333 0 0 1 1.333-1.333H12A1.333 1.333 0 0 1 13.333 20v5.334A1.333 1.333 0 0 1 12 26.667H6.666a1.333 1.333 0 0 1-1.333-1.334z" }) });
 };
 var qrcode_default = SvgQrcode;
 
 // src/theme/default/components/settings/settings-totp.tsx
 import { useFormContext as useFormContext22 } from "react-hook-form";
-import { jsx as jsx95, jsxs as jsxs45 } from "react/jsx-runtime";
+import { jsx as jsx96, jsxs as jsxs45 } from "react/jsx-runtime";
 function DefaultSettingsTotp({
   totpImage,
   totpInput,
@@ -5388,18 +5531,18 @@ function DefaultSettingsTotp({
       ...buttonAttrs
     } = totpUnlink.attributes;
     return /* @__PURE__ */ jsxs45("div", { className: "grid grid-cols-1 gap-8 md:grid-cols-2", children: [
-      /* @__PURE__ */ jsx95("div", { className: "col-span-full", children: /* @__PURE__ */ jsx95(Card.Divider, {}) }),
+      /* @__PURE__ */ jsx96("div", { className: "col-span-full", children: /* @__PURE__ */ jsx96(Card.Divider, {}) }),
       /* @__PURE__ */ jsxs45("div", { className: "col-span-full flex items-center gap-6", children: [
-        /* @__PURE__ */ jsx95("div", { className: "aspect-square size-8 ", children: /* @__PURE__ */ jsx95(qrcode_default, { size: 32 }) }),
-        /* @__PURE__ */ jsx95("div", { className: "mr-auto flex flex-col", children: /* @__PURE__ */ jsx95("p", { className: "text-sm font-medium text-interface-foreground-default-primary", children: "Authenticator app" }) }),
-        /* @__PURE__ */ jsx95(
+        /* @__PURE__ */ jsx96("div", { className: "aspect-square size-8 ", children: /* @__PURE__ */ jsx96(qrcode_default, { size: 32 }) }),
+        /* @__PURE__ */ jsx96("div", { className: "mr-auto flex flex-col", children: /* @__PURE__ */ jsx96("p", { className: "text-sm font-medium text-interface-foreground-default-primary", children: "Authenticator app" }) }),
+        /* @__PURE__ */ jsx96(
           "button",
           {
             type: type === "button" ? "button" : "submit",
             ...buttonAttrs,
             onClick: onUnlink,
             disabled: isSubmitting,
-            children: isSubmitting ? /* @__PURE__ */ jsx95(Spinner, { className: "relative" }) : /* @__PURE__ */ jsx95(
+            children: isSubmitting ? /* @__PURE__ */ jsx96(Spinner, { className: "relative" }) : /* @__PURE__ */ jsx96(
               trash_default,
               {
                 className: "text-button-link-default-secondary hover:text-button-link-default-secondary-hover",
@@ -5413,8 +5556,8 @@ function DefaultSettingsTotp({
   }
   if (totpImage && totpSecret && totpInput) {
     return /* @__PURE__ */ jsxs45("div", { className: "grid grid-cols-1 gap-8 md:grid-cols-2", children: [
-      /* @__PURE__ */ jsx95("div", { className: "col-span-full", children: /* @__PURE__ */ jsx95(DefaultHorizontalDivider, {}) }),
-      /* @__PURE__ */ jsx95("div", { className: "flex justify-center rounded-cards bg-interface-background-default-secondary p-8", children: /* @__PURE__ */ jsx95("div", { className: "aspect-square h-44 rounded bg-[white]", children: /* @__PURE__ */ jsx95("div", { className: "-m-3 antialiased mix-blend-multiply", children: /* @__PURE__ */ jsx95(
+      /* @__PURE__ */ jsx96("div", { className: "col-span-full", children: /* @__PURE__ */ jsx96(DefaultHorizontalDivider, {}) }),
+      /* @__PURE__ */ jsx96("div", { className: "flex justify-center rounded-cards bg-interface-background-default-secondary p-8", children: /* @__PURE__ */ jsx96("div", { className: "aspect-square h-44 rounded bg-[white]", children: /* @__PURE__ */ jsx96("div", { className: "-m-3 antialiased mix-blend-multiply", children: /* @__PURE__ */ jsx96(
         Node2.Image,
         {
           node: totpImage,
@@ -5424,12 +5567,12 @@ function DefaultSettingsTotp({
         }
       ) }) }) }),
       /* @__PURE__ */ jsxs45("div", { className: "flex flex-col gap-6", children: [
-        /* @__PURE__ */ jsx95(
+        /* @__PURE__ */ jsx96(
           Node2.Label,
           {
             node: totpSecret,
             attributes: totpSecret.attributes,
-            children: /* @__PURE__ */ jsx95("div", { className: "relative flex justify-stretch max-w-[488px]", children: /* @__PURE__ */ jsx95(
+            children: /* @__PURE__ */ jsx96("div", { className: "relative flex justify-stretch max-w-[488px]", children: /* @__PURE__ */ jsx96(
               "input",
               {
                 disabled: true,
@@ -5442,12 +5585,12 @@ function DefaultSettingsTotp({
             ) })
           }
         ),
-        /* @__PURE__ */ jsx95(
+        /* @__PURE__ */ jsx96(
           Node2.Label,
           {
             attributes: totpInput.attributes,
             node: totpInput,
-            children: /* @__PURE__ */ jsx95(
+            children: /* @__PURE__ */ jsx96(
               Node2.CodeInput,
               {
                 node: totpInput,
@@ -5465,17 +5608,17 @@ function DefaultSettingsTotp({
 import { useComponents as useComponents9 } from "@ory/elements-react";
 
 // src/theme/default/assets/icons/key.svg
-import * as React33 from "react";
-import { jsx as jsx96 } from "react/jsx-runtime";
+import * as React34 from "react";
+import { jsx as jsx97 } from "react/jsx-runtime";
 var SvgKey = (props) => {
   var _a, _b;
-  return /* @__PURE__ */ jsx96("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 32 32", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, ...props, children: /* @__PURE__ */ jsx96("path", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", d: "M20 12h.013m2.06-6.876 4.803 4.803a3.836 3.836 0 0 1 0 5.425l-3.524 3.524a3.835 3.835 0 0 1-5.425 0l-.402-.401-8.744 8.744a2.67 2.67 0 0 1-1.652.77L6.896 28H5.333a1.334 1.334 0 0 1-1.324-1.177L4 26.667v-1.563c0-.626.22-1.232.623-1.712l.158-.173.552-.552H8V20h2.667v-2.667l2.858-2.858-.401-.402a3.835 3.835 0 0 1 0-5.425l3.524-3.524a3.835 3.835 0 0 1 5.425 0" }) });
+  return /* @__PURE__ */ jsx97("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 32 32", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, ...props, children: /* @__PURE__ */ jsx97("path", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", d: "M20 12h.013m2.06-6.876 4.803 4.803a3.836 3.836 0 0 1 0 5.425l-3.524 3.524a3.835 3.835 0 0 1-5.425 0l-.402-.401-8.744 8.744a2.67 2.67 0 0 1-1.652.77L6.896 28H5.333a1.334 1.334 0 0 1-1.324-1.177L4 26.667v-1.563c0-.626.22-1.232.623-1.712l.158-.173.552-.552H8V20h2.667v-2.667l2.858-2.858-.401-.402a3.835 3.835 0 0 1 0-5.425l3.524-3.524a3.835 3.835 0 0 1 5.425 0" }) });
 };
 var key_default = SvgKey;
 
 // src/theme/default/components/settings/settings-webauthn.tsx
 import { useFormContext as useFormContext23 } from "react-hook-form";
-import { jsx as jsx97, jsxs as jsxs46 } from "react/jsx-runtime";
+import { jsx as jsx98, jsxs as jsxs46 } from "react/jsx-runtime";
 function DefaultSettingsWebauthn({
   nameInput,
   triggerButton,
@@ -5488,12 +5631,12 @@ function DefaultSettingsWebauthn({
   const hasRemoveButtons = removeButtons.length > 0;
   return /* @__PURE__ */ jsxs46("div", { className: "flex flex-col gap-8", children: [
     /* @__PURE__ */ jsxs46("div", { className: "flex md:max-w-96 sm:items-end gap-3 flex-col sm:flex-row", children: [
-      /* @__PURE__ */ jsx97("div", { className: "flex-1", children: /* @__PURE__ */ jsx97(
+      /* @__PURE__ */ jsx98("div", { className: "flex-1", children: /* @__PURE__ */ jsx98(
         Node2.Label,
         {
           node: nameInput,
           attributes: nameInput.attributes,
-          children: /* @__PURE__ */ jsx97(
+          children: /* @__PURE__ */ jsx98(
             Node2.Input,
             {
               node: nameInput,
@@ -5502,7 +5645,7 @@ function DefaultSettingsWebauthn({
           )
         }
       ) }),
-      triggerButton ? /* @__PURE__ */ jsx97(
+      triggerButton ? /* @__PURE__ */ jsx98(
         Node2.Button,
         {
           node: triggerButton,
@@ -5512,8 +5655,8 @@ function DefaultSettingsWebauthn({
       ) : null
     ] }),
     hasRemoveButtons ? /* @__PURE__ */ jsxs46("div", { className: "flex flex-col gap-8", children: [
-      /* @__PURE__ */ jsx97(Card.Divider, {}),
-      /* @__PURE__ */ jsx97("div", { className: "flex flex-col gap-4", children: removeButtons.map((node, i) => {
+      /* @__PURE__ */ jsx98(Card.Divider, {}),
+      /* @__PURE__ */ jsx98("div", { className: "flex flex-col gap-4", children: removeButtons.map((node, i) => {
         var _a, _b;
         const context = (_b = (_a = node.meta.label) == null ? void 0 : _a.context) != null ? _b : {};
         const addedAt = "added_at" in context ? context.added_at : null;
@@ -5525,7 +5668,7 @@ function DefaultSettingsWebauthn({
             className: "flex justify-between gap-6 md:items-center",
             children: [
               /* @__PURE__ */ jsxs46("div", { className: "flex gap-2 items-center flex-1 truncate", children: [
-                /* @__PURE__ */ jsx97(
+                /* @__PURE__ */ jsx98(
                   key_default,
                   {
                     size: 32,
@@ -5534,15 +5677,15 @@ function DefaultSettingsWebauthn({
                 ),
                 /* @__PURE__ */ jsxs46("div", { className: "flex-1 flex-col md:flex-row md:items-center flex md:justify-between gap-4 truncate", children: [
                   /* @__PURE__ */ jsxs46("div", { className: "flex-1 flex-col truncate", children: [
-                    /* @__PURE__ */ jsx97("p", { className: "text-sm font-medium text-interface-foreground-default-secondary truncate", children: displayName }),
-                    /* @__PURE__ */ jsx97("span", { className: "text-sm text-interface-foreground-default-tertiary hidden sm:block truncate", children: keyId })
+                    /* @__PURE__ */ jsx98("p", { className: "text-sm font-medium text-interface-foreground-default-secondary truncate", children: displayName }),
+                    /* @__PURE__ */ jsx98("span", { className: "text-sm text-interface-foreground-default-tertiary hidden sm:block truncate", children: keyId })
                   ] }),
-                  addedAt && /* @__PURE__ */ jsx97("p", { className: "text-sm text-interface-foreground-default-tertiary", children: new Intl.DateTimeFormat(void 0, {
+                  addedAt && /* @__PURE__ */ jsx98("p", { className: "text-sm text-interface-foreground-default-tertiary", children: new Intl.DateTimeFormat(void 0, {
                     dateStyle: "long"
                   }).format(new Date(addedAt)) })
                 ] })
               ] }),
-              /* @__PURE__ */ jsx97(
+              /* @__PURE__ */ jsx98(
                 "button",
                 {
                   ...node.attributes,
@@ -5550,7 +5693,7 @@ function DefaultSettingsWebauthn({
                   onClick: node.onClick,
                   disabled: isSubmitting,
                   className: "relative",
-                  children: isSubmitting ? /* @__PURE__ */ jsx97(Spinner, { className: "relative" }) : /* @__PURE__ */ jsx97(
+                  children: isSubmitting ? /* @__PURE__ */ jsx98(Spinner, { className: "relative" }) : /* @__PURE__ */ jsx98(
                     trash_default,
                     {
                       className: "text-button-link-default-secondary hover:text-button-link-default-secondary-hover",
@@ -5569,24 +5712,24 @@ function DefaultSettingsWebauthn({
 }
 
 // src/theme/default/components/card/auth-method-list-container.tsx
-import { jsx as jsx98 } from "react/jsx-runtime";
+import { jsx as jsx99 } from "react/jsx-runtime";
 function DefaultAuthMethodListContainer({
   children
 }) {
-  return /* @__PURE__ */ jsx98("div", { className: "grid grid-cols-1 gap-2", children });
+  return /* @__PURE__ */ jsx99("div", { className: "grid grid-cols-1 gap-2", children });
 }
 
 // src/theme/default/components/form/captcha.tsx
 import { isUiNodeInputAttributes as isUiNodeInputAttributes9 } from "@ory/client-fetch";
 import { Turnstile } from "@marsidev/react-turnstile";
-import { useEffect as useEffect7, useRef as useRef4 } from "react";
+import { useEffect as useEffect8, useRef as useRef4 } from "react";
 import { useFormContext as useFormContext24 } from "react-hook-form";
-import { jsx as jsx99 } from "react/jsx-runtime";
+import { jsx as jsx100 } from "react/jsx-runtime";
 var DefaultCaptcha = ({ node }) => {
   const { setValue, formState } = useFormContext24();
   const ref = useRef4();
   const prevSubmitCount = useRef4(formState.submitCount);
-  useEffect7(() => {
+  useEffect8(() => {
     if (formState.submitCount > prevSubmitCount.current && formState.isSubmitSuccessful) {
       prevSubmitCount.current = formState.submitCount;
       setTimeout(() => {
@@ -5600,10 +5743,10 @@ var DefaultCaptcha = ({ node }) => {
     return null;
   }
   if (node.attributes.name === "transient_payload.captcha_turnstile_response") {
-    return /* @__PURE__ */ jsx99(DefaultInput, { node, attributes: node.attributes }, 1);
+    return /* @__PURE__ */ jsx100(DefaultInput, { node, attributes: node.attributes }, 1);
   } else if (node.attributes.name === "captcha_turnstile_options") {
     const options = JSON.parse(node.attributes.value);
-    return /* @__PURE__ */ jsx99(
+    return /* @__PURE__ */ jsx100(
       Turnstile,
       {
         ref,
@@ -5629,36 +5772,36 @@ var DefaultCaptcha = ({ node }) => {
 };
 
 // src/theme/default/assets/icons/personal.svg
-import * as React34 from "react";
-import { jsx as jsx100 } from "react/jsx-runtime";
+import * as React35 from "react";
+import { jsx as jsx101 } from "react/jsx-runtime";
 var SvgPersonal = (props) => {
   var _a, _b;
-  return /* @__PURE__ */ jsx100("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 16 16", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, ...props, children: /* @__PURE__ */ jsx100("path", { stroke: "#0F172A", strokeLinecap: "round", strokeLinejoin: "round", d: "M4 14v-1.333A2.667 2.667 0 0 1 6.667 10h1m5.8 3.467 1.2 1.2m-9.334-10a2.667 2.667 0 1 0 5.334 0 2.667 2.667 0 0 0-5.334 0M10 12a2 2 0 1 0 4 0 2 2 0 0 0-4 0" }) });
+  return /* @__PURE__ */ jsx101("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 16 16", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, ...props, children: /* @__PURE__ */ jsx101("path", { stroke: "#0F172A", strokeLinecap: "round", strokeLinejoin: "round", d: "M4 14v-1.333A2.667 2.667 0 0 1 6.667 10h1m5.8 3.467 1.2 1.2m-9.334-10a2.667 2.667 0 1 0 5.334 0 2.667 2.667 0 0 0-5.334 0M10 12a2 2 0 1 0 4 0 2 2 0 0 0-4 0" }) });
 };
 var personal_default = SvgPersonal;
 
 // src/theme/default/assets/icons/message.svg
-import * as React35 from "react";
-import { jsx as jsx101 } from "react/jsx-runtime";
+import * as React36 from "react";
+import { jsx as jsx102 } from "react/jsx-runtime";
 var SvgMessage = (props) => {
   var _a, _b;
-  return /* @__PURE__ */ jsx101("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 25", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, ...props, children: /* @__PURE__ */ jsx101("path", { stroke: "#000", strokeLinecap: "round", strokeLinejoin: "round", d: "M3 7.325a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2m-18 0v10a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-10m-18 0 9 6 9-6" }) });
+  return /* @__PURE__ */ jsx102("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 25", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, ...props, children: /* @__PURE__ */ jsx102("path", { stroke: "#000", strokeLinecap: "round", strokeLinejoin: "round", d: "M3 7.325a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2m-18 0v10a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-10m-18 0 9 6 9-6" }) });
 };
 var message_default = SvgMessage;
 
 // src/theme/default/assets/icons/phone.svg
-import * as React36 from "react";
-import { jsx as jsx102 } from "react/jsx-runtime";
+import * as React37 from "react";
+import { jsx as jsx103 } from "react/jsx-runtime";
 var SvgPhone = (props) => {
   var _a, _b;
-  return /* @__PURE__ */ jsx102("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 25", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, ...props, children: /* @__PURE__ */ jsx102("path", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", d: "M5 4.325h4l2 5-2.5 1.5a11 11 0 0 0 5 5l1.5-2.5 5 2v4a2 2 0 0 1-2 2 16 16 0 0 1-15-15 2 2 0 0 1 2-2" }) });
+  return /* @__PURE__ */ jsx103("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 25", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, ...props, children: /* @__PURE__ */ jsx103("path", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", d: "M5 4.325h4l2 5-2.5 1.5a11 11 0 0 0 5 5l1.5-2.5 5 2v4a2 2 0 0 1-2 2 16 16 0 0 1-15-15 2 2 0 0 1 2-2" }) });
 };
 var phone_default = SvgPhone;
 
 // src/theme/default/components/form/consent-scope-checkbox.tsx
 import { useIntl as useIntl22 } from "react-intl";
 import * as Switch from "@radix-ui/react-switch";
-import { jsx as jsx103 } from "react/jsx-runtime";
+import { jsx as jsx104 } from "react/jsx-runtime";
 var ScopeIcons = {
   openid: personal_default,
   offline_access: personal_default,
@@ -5673,7 +5816,7 @@ function DefaultConsentScopeCheckbox({
   var _a;
   const intl = useIntl22();
   const Icon = (_a = ScopeIcons[attributes.value]) != null ? _a : personal_default;
-  return /* @__PURE__ */ jsx103(
+  return /* @__PURE__ */ jsx104(
     ListItem,
     {
       as: "label",
@@ -5688,7 +5831,7 @@ function DefaultConsentScopeCheckbox({
       }),
       className: "col-span-2",
       "data-testid": "ory/screen/consent/scope-checkbox-label",
-      children: /* @__PURE__ */ jsx103(
+      children: /* @__PURE__ */ jsx104(
         Switch.Root,
         {
           className: "relative w-7 h-4 bg-toggle-background-default rounded-identifier border-toggle-border-default border p-[3px] data-[state=checked]:bg-toggle-background-checked transition-all data-[state=checked]:border-toggle-border-checked",
@@ -5696,7 +5839,7 @@ function DefaultConsentScopeCheckbox({
           value: attributes.value,
           onCheckedChange,
           defaultChecked: true,
-          children: /* @__PURE__ */ jsx103(Switch.Thumb, { className: "size-2 block bg-toggle-foreground-default rounded-identifier data-[state=checked]:bg-toggle-foreground-checked transition-all data-[state=checked]:translate-x-3" })
+          children: /* @__PURE__ */ jsx104(Switch.Thumb, { className: "size-2 block bg-toggle-foreground-default rounded-identifier data-[state=checked]:bg-toggle-foreground-checked transition-all data-[state=checked]:translate-x-3" })
         }
       )
     }
@@ -5764,7 +5907,7 @@ import {
 } from "@ory/elements-react";
 import { useMemo as useMemo2 } from "react";
 import { FormattedMessage } from "react-intl";
-import { jsx as jsx104, jsxs as jsxs47 } from "react/jsx-runtime";
+import { jsx as jsx105, jsxs as jsxs47 } from "react/jsx-runtime";
 function isOAuth2Error(error) {
   return !!error && typeof error === "object" && "error" in error && "error_description" in error;
 }
@@ -5817,47 +5960,47 @@ function Error2({
   const Divider = (_d = (_c = Components == null ? void 0 : Components.Card) == null ? void 0 : _c.Divider) != null ? _d : DefaultHorizontalDivider;
   const parsed = useStandardize(error);
   const description = errorDescriptions[Math.floor(parsed.code / 100)];
-  return /* @__PURE__ */ jsx104(OryConfigurationProvider2, { sdk: config.sdk, project: config.project, children: /* @__PURE__ */ jsx104(
+  return /* @__PURE__ */ jsx105(OryConfigurationProvider2, { sdk: config.sdk, project: config.project, children: /* @__PURE__ */ jsx105(
     IntlProvider,
     {
       locale: (_f = (_e = config.intl) == null ? void 0 : _e.locale) != null ? _f : "en",
       customTranslations: (_g = config.intl) == null ? void 0 : _g.customTranslations,
-      children: /* @__PURE__ */ jsx104(Card, { children: /* @__PURE__ */ jsxs47(
+      children: /* @__PURE__ */ jsx105(Card, { children: /* @__PURE__ */ jsxs47(
         "div",
         {
           className: "flex flex-col gap-6 antialiased",
           "data-testid": "ory/screen/error",
           children: [
             /* @__PURE__ */ jsxs47("header", { className: "flex flex-col gap-8 antialiased", children: [
-              /* @__PURE__ */ jsx104(ErrorLogo, {}),
+              /* @__PURE__ */ jsx105(ErrorLogo, {}),
               /* @__PURE__ */ jsxs47("div", { className: "flex flex-col gap-2", children: [
-                /* @__PURE__ */ jsx104("h2", { className: "text-lg font-semibold leading-normal text-interface-foreground-default-primary", children: /* @__PURE__ */ jsx104(FormattedMessage, { id: "error.title.what-happened" }) }),
-                /* @__PURE__ */ jsx104("p", { className: "leading-normal text-interface-foreground-default-secondary", children: (_h = parsed.message) != null ? _h : description }),
-                parsed.reason && /* @__PURE__ */ jsx104("p", { className: "leading-normal text-interface-foreground-default-secondary", children: parsed.reason })
+                /* @__PURE__ */ jsx105("h2", { className: "text-lg font-semibold leading-normal text-interface-foreground-default-primary", children: /* @__PURE__ */ jsx105(FormattedMessage, { id: "error.title.what-happened" }) }),
+                /* @__PURE__ */ jsx105("p", { className: "leading-normal text-interface-foreground-default-secondary", children: (_h = parsed.message) != null ? _h : description }),
+                parsed.reason && /* @__PURE__ */ jsx105("p", { className: "leading-normal text-interface-foreground-default-secondary", children: parsed.reason })
               ] })
             ] }),
-            /* @__PURE__ */ jsx104(Divider, {}),
+            /* @__PURE__ */ jsx105(Divider, {}),
             /* @__PURE__ */ jsxs47("div", { className: "flex flex-col gap-2", children: [
-              /* @__PURE__ */ jsx104("h2", { className: "text-lg font-semibold leading-normal text-interface-foreground-default-primary", children: /* @__PURE__ */ jsx104(FormattedMessage, { id: "error.title.what-can-i-do" }) }),
-              /* @__PURE__ */ jsx104("p", { className: "leading-normal text-interface-foreground-default-secondary", children: /* @__PURE__ */ jsx104(FormattedMessage, { id: "error.instructions" }) }),
-              /* @__PURE__ */ jsx104("div", { children: session ? /* @__PURE__ */ jsx104(LoggedInActions, {}) : /* @__PURE__ */ jsx104(GoBackButton, {}) })
+              /* @__PURE__ */ jsx105("h2", { className: "text-lg font-semibold leading-normal text-interface-foreground-default-primary", children: /* @__PURE__ */ jsx105(FormattedMessage, { id: "error.title.what-can-i-do" }) }),
+              /* @__PURE__ */ jsx105("p", { className: "leading-normal text-interface-foreground-default-secondary", children: /* @__PURE__ */ jsx105(FormattedMessage, { id: "error.instructions" }) }),
+              /* @__PURE__ */ jsx105("div", { children: session ? /* @__PURE__ */ jsx105(LoggedInActions, {}) : /* @__PURE__ */ jsx105(GoBackButton, {}) })
             ] }),
-            /* @__PURE__ */ jsx104(Divider, {}),
+            /* @__PURE__ */ jsx105(Divider, {}),
             /* @__PURE__ */ jsxs47("div", { className: "font-normal leading-normal antialiased gap-2 flex flex-col", children: [
-              /* @__PURE__ */ jsx104("span", { className: "text-interface-foreground-default-primary text-sm", children: /* @__PURE__ */ jsx104(FormattedMessage, { id: "error.footer.text" }) }),
+              /* @__PURE__ */ jsx105("span", { className: "text-interface-foreground-default-primary text-sm", children: /* @__PURE__ */ jsx105(FormattedMessage, { id: "error.footer.text" }) }),
               parsed.id && /* @__PURE__ */ jsxs47("p", { className: "text-interface-foreground-default-secondary text-sm", children: [
                 "ID: ",
-                /* @__PURE__ */ jsx104("code", { children: parsed.id })
+                /* @__PURE__ */ jsx105("code", { children: parsed.id })
               ] }),
               /* @__PURE__ */ jsxs47("p", { className: "text-interface-foreground-default-secondary text-sm", children: [
                 "Time: ",
-                /* @__PURE__ */ jsx104("code", { children: (_i = parsed.timestamp) == null ? void 0 : _i.toUTCString() })
+                /* @__PURE__ */ jsx105("code", { children: (_i = parsed.timestamp) == null ? void 0 : _i.toUTCString() })
               ] }),
               /* @__PURE__ */ jsxs47("p", { className: "text-interface-foreground-default-secondary text-sm", children: [
                 "Message: ",
-                /* @__PURE__ */ jsx104("code", { children: parsed.reason })
+                /* @__PURE__ */ jsx105("code", { children: parsed.reason })
               ] }),
-              /* @__PURE__ */ jsx104("div", { children: /* @__PURE__ */ jsx104(
+              /* @__PURE__ */ jsx105("div", { children: /* @__PURE__ */ jsx105(
                 "button",
                 {
                   className: "text-interface-foreground-default-primary underline",
@@ -5869,7 +6012,7 @@ ${parsed.reason ? `Message: ${parsed.reason}` : ""}
 `;
                     void navigator.clipboard.writeText(text);
                   },
-                  children: /* @__PURE__ */ jsx104(FormattedMessage, { id: "error.footer.copy" })
+                  children: /* @__PURE__ */ jsx105(FormattedMessage, { id: "error.footer.copy" })
                 }
               ) })
             ] })
@@ -5882,24 +6025,24 @@ ${parsed.reason ? `Message: ${parsed.reason}` : ""}
 function LoggedInActions() {
   const config = useOryConfiguration8();
   const { logoutFlow } = useClientLogout(config);
-  return /* @__PURE__ */ jsx104(
+  return /* @__PURE__ */ jsx105(
     "a",
     {
       href: logoutFlow == null ? void 0 : logoutFlow.logout_url,
       className: "text-interface-foreground-default-primary underline",
-      children: /* @__PURE__ */ jsx104(FormattedMessage, { id: "login.logout-button" })
+      children: /* @__PURE__ */ jsx105(FormattedMessage, { id: "login.logout-button" })
     }
   );
 }
 function GoBackButton() {
   const config = useOryConfiguration8();
   if ("default_redirect_url" in config.project) {
-    return /* @__PURE__ */ jsx104(
+    return /* @__PURE__ */ jsx105(
       "a",
       {
         className: "text-interface-foreground-default-primary underline",
         href: config.project.default_redirect_url,
-        children: /* @__PURE__ */ jsx104(FormattedMessage, { id: "error.action.go-back" })
+        children: /* @__PURE__ */ jsx105(FormattedMessage, { id: "error.action.go-back" })
       }
     );
   }
@@ -5908,9 +6051,9 @@ function GoBackButton() {
 function ErrorLogo() {
   const { project } = useOryConfiguration8();
   if (project.logo_light_url) {
-    return /* @__PURE__ */ jsx104("img", { src: project.logo_light_url, width: 100, height: 36, alt: "Logo" });
+    return /* @__PURE__ */ jsx105("img", { src: project.logo_light_url, width: 100, height: 36, alt: "Logo" });
   }
-  return /* @__PURE__ */ jsx104("h1", { className: "text-xl font-semibold leading-normal text-interface-foreground-default-primary", children: project.name });
+  return /* @__PURE__ */ jsx105("h1", { className: "text-xl font-semibold leading-normal text-interface-foreground-default-primary", children: project.name });
 }
 
 // src/theme/default/flows/login.tsx
@@ -5919,7 +6062,7 @@ import {
   OryProvider,
   OryTwoStepCard as OryTwoStepCard2
 } from "@ory/elements-react";
-import { jsx as jsx105 } from "react/jsx-runtime";
+import { jsx as jsx106 } from "react/jsx-runtime";
 function Login({
   flow,
   config,
@@ -5927,14 +6070,14 @@ function Login({
   components: flowOverrideComponents
 }) {
   const components = getOryComponents(flowOverrideComponents);
-  return /* @__PURE__ */ jsx105(
+  return /* @__PURE__ */ jsx106(
     OryProvider,
     {
       config,
       flow,
       flowType: FlowType18.Login,
       components,
-      children: children != null ? children : /* @__PURE__ */ jsx105(OryTwoStepCard2, {})
+      children: children != null ? children : /* @__PURE__ */ jsx106(OryTwoStepCard2, {})
     }
   );
 }
@@ -5945,7 +6088,7 @@ import {
   OryProvider as OryProvider2,
   OryTwoStepCard as OryTwoStepCard3
 } from "@ory/elements-react";
-import { jsx as jsx106 } from "react/jsx-runtime";
+import { jsx as jsx107 } from "react/jsx-runtime";
 function Recovery({
   flow,
   config,
@@ -5953,14 +6096,14 @@ function Recovery({
   components: flowOverrideComponents
 }) {
   const components = getOryComponents(flowOverrideComponents);
-  return /* @__PURE__ */ jsx106(
+  return /* @__PURE__ */ jsx107(
     OryProvider2,
     {
       config,
       flow,
       flowType: FlowType19.Recovery,
       components,
-      children: children != null ? children : /* @__PURE__ */ jsx106(OryTwoStepCard3, {})
+      children: children != null ? children : /* @__PURE__ */ jsx107(OryTwoStepCard3, {})
     }
   );
 }
@@ -5971,7 +6114,7 @@ import {
   OryProvider as OryProvider3,
   OryTwoStepCard as OryTwoStepCard4
 } from "@ory/elements-react";
-import { jsx as jsx107 } from "react/jsx-runtime";
+import { jsx as jsx108 } from "react/jsx-runtime";
 function Registration({
   flow,
   children,
@@ -5979,14 +6122,14 @@ function Registration({
   config
 }) {
   const components = getOryComponents(flowOverrideComponents);
-  return /* @__PURE__ */ jsx107(
+  return /* @__PURE__ */ jsx108(
     OryProvider3,
     {
       config,
       flow,
       flowType: FlowType20.Registration,
       components,
-      children: children != null ? children : /* @__PURE__ */ jsx107(OryTwoStepCard4, {})
+      children: children != null ? children : /* @__PURE__ */ jsx108(OryTwoStepCard4, {})
     }
   );
 }
@@ -5998,7 +6141,7 @@ import {
   OryProvider as OryProvider4,
   OrySettingsCard
 } from "@ory/elements-react";
-import { Fragment as Fragment13, jsx as jsx108, jsxs as jsxs48 } from "react/jsx-runtime";
+import { Fragment as Fragment13, jsx as jsx109, jsxs as jsxs48 } from "react/jsx-runtime";
 function Settings({
   flow,
   config,
@@ -6006,7 +6149,7 @@ function Settings({
   components: flowOverrideComponents
 }) {
   const components = getOryComponents(flowOverrideComponents);
-  return /* @__PURE__ */ jsx108(
+  return /* @__PURE__ */ jsx109(
     OryProvider4,
     {
       config,
@@ -6014,8 +6157,8 @@ function Settings({
       flowType: FlowType21.Settings,
       components,
       children: children != null ? children : /* @__PURE__ */ jsxs48(Fragment13, { children: [
-        /* @__PURE__ */ jsx108(HeadlessPageHeader, {}),
-        /* @__PURE__ */ jsx108(OrySettingsCard, {})
+        /* @__PURE__ */ jsx109(HeadlessPageHeader, {}),
+        /* @__PURE__ */ jsx109(OrySettingsCard, {})
       ] })
     }
   );
@@ -6027,7 +6170,7 @@ import {
   OryProvider as OryProvider5,
   OryTwoStepCard as OryTwoStepCard5
 } from "@ory/elements-react";
-import { jsx as jsx109 } from "react/jsx-runtime";
+import { jsx as jsx110 } from "react/jsx-runtime";
 function Verification({
   flow,
   config,
@@ -6035,14 +6178,14 @@ function Verification({
   components: flowOverrideComponents
 }) {
   const components = getOryComponents(flowOverrideComponents);
-  return /* @__PURE__ */ jsx109(
+  return /* @__PURE__ */ jsx110(
     OryProvider5,
     {
       config,
       flow,
       flowType: FlowType22.Verification,
       components,
-      children: children != null ? children : /* @__PURE__ */ jsx109(OryTwoStepCard5, {})
+      children: children != null ? children : /* @__PURE__ */ jsx110(OryTwoStepCard5, {})
     }
   );
 }
@@ -6195,7 +6338,7 @@ function challengeNode(challenge) {
 }
 
 // src/theme/default/flows/consent.tsx
-import { jsx as jsx110 } from "react/jsx-runtime";
+import { jsx as jsx111 } from "react/jsx-runtime";
 function Consent({
   consentChallenge,
   session,
@@ -6212,14 +6355,14 @@ function Consent({
     formActionUrl,
     session
   );
-  return /* @__PURE__ */ jsx110(
+  return /* @__PURE__ */ jsx111(
     OryProvider6,
     {
       config,
       flow,
       flowType: FlowType23.OAuth2Consent,
       components,
-      children: children != null ? children : /* @__PURE__ */ jsx110(OryConsentCard2, {})
+      children: children != null ? children : /* @__PURE__ */ jsx111(OryConsentCard2, {})
     }
   );
 }