@ory/elements-react 1.0.0-next.14 → 1.0.0-next.16

package/dist/theme/default/index.js

@@ -36,6 +36,7 @@ __export(default_exports, {
   DefaultCardFooter: () => DefaultCardFooter,
   DefaultCardHeader: () => DefaultCardHeader,
   DefaultCardLogo: () => DefaultCardLogo,
+  DefaultCurrentIdentifierButton: () => DefaultCurrentIdentifierButton,
   DefaultFormContainer: () => DefaultFormContainer,
   DefaultMessage: () => DefaultMessage,
   DefaultMessageContainer: () => DefaultMessageContainer,
@@ -89,8 +90,9 @@ function DefaultCardContent({ children }) {
 
 // src/theme/default/components/card/footer.tsx
 var import_client_fetch = require("@ory/client-fetch");
-var import_react_intl = require("react-intl");
 var import_elements_react = require("@ory/elements-react");
+var import_react_hook_form = require("react-hook-form");
+var import_react_intl = require("react-intl");
 var import_jsx_runtime4 = require("react/jsx-runtime");
 function DefaultCardFooter() {
   const { flowType } = (0, import_elements_react.useOryFlow)();
@@ -114,9 +116,9 @@ function getReturnToQueryParam() {
   }
 }
 function LoginCardFooter() {
-  const { config } = (0, import_elements_react.useOryFlow)();
+  const { config, formState } = (0, import_elements_react.useOryFlow)();
   const intl = (0, import_react_intl.useIntl)();
-  if (!config.project.registration_enabled) {
+  if (!config.project.registration_enabled || formState.current !== "provide_identifier") {
     return null;
   }
   let registrationLink = `${config.sdk.url}/self-service/registration/browser`;
@@ -143,15 +145,42 @@ function LoginCardFooter() {
     )
   ] });
 }
+function findScreenSelectionButton(nodes) {
+  return nodes.find(
+    (node) => node.attributes.node_type === "input" && node.attributes.type === "submit" && node.attributes.name === "screen"
+  );
+}
 function RegistrationCardFooter() {
   const intl = (0, import_react_intl.useIntl)();
-  const { config } = (0, import_elements_react.useOryFlow)();
+  const { config, flow, formState } = (0, import_elements_react.useOryFlow)();
+  const { setValue } = (0, import_react_hook_form.useFormContext)();
+  if (formState.current === "select_method") {
+    return null;
+  }
+  const screenSelectionNode = findScreenSelectionButton(flow.ui.nodes);
+  function handleScreenSelection() {
+    setValue("method", "profile");
+    if (screenSelectionNode) {
+      setValue("screen", "credential-selection");
+    }
+  }
   let loginLink = `${config.sdk.url}/self-service/login/browser`;
   const returnTo = getReturnToQueryParam();
   if (returnTo) {
     loginLink += `?return_to=${returnTo}`;
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("span", { className: "text-sm font-normal antialiased leading-normal", children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "text-sm font-normal antialiased leading-normal", children: formState.current === "method_active" ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_jsx_runtime4.Fragment, { children: screenSelectionNode && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+    "button",
+    {
+      className: "font-medium text-links-link-default",
+      type: "submit",
+      onClick: handleScreenSelection,
+      children: intl.formatMessage({
+        id: "card.footer.select-another-method",
+        defaultMessage: "Select another method"
+      })
+    }
+  ) }) : /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_jsx_runtime4.Fragment, { children: [
     intl.formatMessage({
       id: "registration.login-label",
       defaultMessage: "Already have an account?"
@@ -168,7 +197,7 @@ function RegistrationCardFooter() {
         })
       }
     )
-  ] });
+  ] }) });
 }
 function RecoveryCardFooter() {
   return null;
@@ -178,7 +207,7 @@ function VerificationCardFooter() {
 }
 
 // src/theme/default/components/card/header.tsx
-var import_elements_react2 = require("@ory/elements-react");
+var import_elements_react3 = require("@ory/elements-react");
 
 // src/theme/default/utils/constructCardHeader.ts
 var import_client_fetch2 = require("@ory/client-fetch");
@@ -198,6 +227,18 @@ function useCardHeaderText(nodes, opts) {
   const intl = (0, import_react_intl2.useIntl)();
   switch (opts.flowType) {
     case import_client_fetch2.FlowType.Recovery:
+      if (nodes.find(
+        (node) => "name" in node.attributes && node.attributes.name === "code"
+      )) {
+        return {
+          title: intl.formatMessage({
+            id: "recovery.title"
+          }),
+          description: intl.formatMessage({
+            id: "identities.messages.1060003"
+          })
+        };
+      }
       return {
         title: intl.formatMessage({
           id: "recovery.title"
@@ -216,6 +257,18 @@ function useCardHeaderText(nodes, opts) {
         })
       };
     case import_client_fetch2.FlowType.Verification:
+      if (nodes.find(
+        (node) => "name" in node.attributes && node.attributes.name === "code"
+      )) {
+        return {
+          title: intl.formatMessage({
+            id: "verification.title"
+          }),
+          description: intl.formatMessage({
+            id: "identities.messages.1080003"
+          })
+        };
+      }
       return {
         title: intl.formatMessage({
           id: "verification.title"
@@ -337,44 +390,139 @@ function useCardHeaderText(nodes, opts) {
   };
 }
 
-// src/theme/default/components/card/header.tsx
+// src/theme/default/components/card/current-identifier-button.tsx
+var import_client_fetch3 = require("@ory/client-fetch");
+var import_elements_react2 = require("@ory/elements-react");
+
+// src/theme/default/assets/icons/arrow-left.svg
+var React3 = __toESM(require("react"));
 var import_jsx_runtime5 = require("react/jsx-runtime");
+var SvgArrowLeft = (props) => {
+  var _a, _b;
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("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__ */ (0, import_jsx_runtime5.jsx)("path", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", d: "M5 12.325h14m-14 0 6 6m-6-6 6-6" }) });
+};
+var arrow_left_default = SvgArrowLeft;
+
+// src/theme/default/utils/attributes.ts
+function omit(obj, keys) {
+  const ret = { ...obj };
+  for (const key of keys) {
+    delete ret[key];
+  }
+  return ret;
+}
+
+// src/theme/default/components/card/current-identifier-button.tsx
+var import_jsx_runtime6 = require("react/jsx-runtime");
+function DefaultCurrentIdentifierButton() {
+  const {
+    flow: { ui },
+    flowType,
+    config,
+    formState
+  } = (0, import_elements_react2.useOryFlow)();
+  if (formState.current === "provide_identifier") {
+    return null;
+  }
+  const nodeBackButton = getBackButtonNode(flowType, ui.nodes);
+  if ((nodeBackButton == null ? void 0 : nodeBackButton.attributes.node_type) !== "input" || !nodeBackButton.attributes.value) {
+    return null;
+  }
+  const initFlowUrl = `${config.sdk.url}/self-service/${flowType}/browser`;
+  const attributes = omit(nodeBackButton.attributes, [
+    "autocomplete",
+    "node_type"
+  ]);
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
+    "a",
+    {
+      className: "cursor-pointer py-[5px] px-3 rounded-full border border-button-identifier-border-default bg-button-identifier-bg-default hover:border-button-identifier-border-hover hover:bg-button-identifier-bg-hover transition-colors inline-flex gap-1 items-center self-start max-w-full",
+      ...attributes,
+      href: initFlowUrl,
+      title: `Adjust ${nodeBackButton == null ? void 0 : nodeBackButton.attributes.value}`,
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+          arrow_left_default,
+          {
+            size: 16,
+            className: "text-button-identifier-fg-subtle shrink-0"
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "text-sm font-medium text-button-identifier-fg-default text-ellipsis overflow-hidden text-nowrap", children: nodeBackButton == null ? void 0 : nodeBackButton.attributes.value })
+      ]
+    }
+  );
+}
+function getBackButtonNode(flowType, nodes) {
+  let nodeBackButton;
+  switch (flowType) {
+    case import_client_fetch3.FlowType.Login:
+      nodeBackButton = nodes.find(
+        (node) => "name" in node.attributes && node.attributes.name === "identifier" && ["default", "identifier_first"].includes(node.group)
+      );
+      break;
+    case import_client_fetch3.FlowType.Registration:
+      nodeBackButton = guessRegistrationBackButton(nodes);
+      break;
+    case import_client_fetch3.FlowType.Recovery:
+    case import_client_fetch3.FlowType.Verification:
+      nodeBackButton = nodes.find(
+        (n) => "name" in n.attributes && n.attributes.name === "email"
+      );
+      break;
+  }
+  return nodeBackButton;
+}
+var backButtonCandiates = [
+  "traits.email",
+  "traits.username",
+  "traits.phone_number"
+];
+function guessRegistrationBackButton(uiNodes) {
+  return uiNodes.find(
+    (node) => "name" in node.attributes && backButtonCandiates.includes(node.attributes.name) && node.group === "default"
+  );
+}
+
+// src/theme/default/components/card/header.tsx
+var import_jsx_runtime7 = require("react/jsx-runtime");
 function InnerCardHeader({ title, text }) {
-  const { Card } = (0, import_elements_react2.useComponents)();
-  return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("header", { className: "flex flex-col gap-8 antialiased", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Card.Logo, {}),
-    /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("h2", { className: "font-semibold text-lg text-dialog-fg-default leading-normal", children: title }),
-      /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("p", { className: "text-sm leading-normal text-dialog-fg-subtle", children: text })
+  const { Card } = (0, import_elements_react3.useComponents)();
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("header", { className: "flex flex-col gap-8 antialiased", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(Card.Logo, {}),
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "flex flex-col gap-2", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("h2", { className: "font-semibold text-lg text-dialog-fg-default leading-normal", children: title }),
+      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("p", { className: "text-sm leading-normal text-dialog-fg-subtle", children: text }),
+      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(DefaultCurrentIdentifierButton, {})
     ] })
   ] });
 }
 function DefaultCardHeader() {
-  const context = (0, import_elements_react2.useOryFlow)();
+  const context = (0, import_elements_react3.useOryFlow)();
   const { title, description } = useCardHeaderText(
     context.flow.ui.nodes,
     context
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(InnerCardHeader, { title, text: description });
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(InnerCardHeader, { title, text: description });
 }
 
 // src/theme/default/components/card/logo.tsx
-var import_elements_react3 = require("@ory/elements-react");
-var import_jsx_runtime6 = require("react/jsx-runtime");
+var import_elements_react4 = require("@ory/elements-react");
+var import_jsx_runtime8 = require("react/jsx-runtime");
 function DefaultCardLogo() {
-  const flow = (0, import_elements_react3.useOryFlow)();
+  const flow = (0, import_elements_react4.useOryFlow)();
   if (flow.config.logoUrl) {
-    return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("img", { src: flow.config.logoUrl, width: 100, height: 36, alt: "Logo" });
+    return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("img", { src: flow.config.logoUrl, width: 100, height: 36, alt: "Logo" });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("h1", { className: "text-xl font-semibold leading-normal text-dialog-fg-default", children: flow.config.name });
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("h1", { className: "text-xl font-semibold leading-normal text-dialog-fg-default", children: flow.config.name });
 }
 
 // src/theme/default/components/card/index.tsx
-var import_jsx_runtime7 = require("react/jsx-runtime");
+var import_jsx_runtime9 = require("react/jsx-runtime");
 function DefaultCard({ children }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "flex-1 flex-col flex justify-center items-center font-sans", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "grid grid-cols-1 max-w-sm md:max-w-[480px] md:w-[480px] gap-8 bg-dialog-bg-default px-8 md:px-12 py-12 md:py-14 relative rounded-border-radius-cards border border-dialog-border-default", children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "flex-1 flex-col flex justify-center items-center font-sans", children: /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "grid grid-cols-1 max-w-sm md:max-w-[480px] md:w-[480px] gap-8 bg-dialog-bg-default px-8 md:px-12 py-12 md:py-14 relative rounded-border-radius-cards border border-dialog-border-default", children: [
     children,
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(Badge, {})
+    /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(Badge, {})
   ] }) });
 }
 
@@ -387,16 +535,16 @@ function cn(...inputs) {
 
 // src/theme/default/components/form/index.tsx
 var import_react_intl3 = require("react-intl");
-var import_elements_react4 = require("@ory/elements-react");
-var import_client_fetch3 = require("@ory/client-fetch");
-var import_jsx_runtime8 = require("react/jsx-runtime");
+var import_elements_react5 = require("@ory/elements-react");
+var import_client_fetch4 = require("@ory/client-fetch");
+var import_jsx_runtime10 = require("react/jsx-runtime");
 function DefaultFormContainer({
   children,
   onSubmit,
   action,
   method
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
     "form",
     {
       onSubmit,
@@ -409,15 +557,15 @@ function DefaultFormContainer({
   );
 }
 function DefaultMessageContainer({ children }) {
-  const { flowType } = (0, import_elements_react4.useOryFlow)();
+  const { flowType } = (0, import_elements_react5.useOryFlow)();
   if (!children || Array.isArray(children) && children.length === 0) {
     return null;
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
     "section",
     {
       className: cn(
-        flowType === import_client_fetch3.FlowType.Settings ? "text-center" : "text-left"
+        flowType === import_client_fetch4.FlowType.Settings ? "text-center" : "text-left"
       ),
       children
     }
@@ -425,15 +573,16 @@ function DefaultMessageContainer({ children }) {
 }
 function DefaultMessage({ message }) {
   const intl = (0, import_react_intl3.useIntl)();
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
     "span",
     {
-      className: cn("text-sm mt-1 leading-normal", {
+      className: cn("text-sm leading-normal", {
         "text-forms-fg-error": message.type === "error",
         "text-forms-fg-default": message.type === "info",
         "text-forms-fg-success": message.type === "success"
       }),
-      children: (0, import_elements_react4.uiTextToFormattedMessage)(message, intl)
+      ...(0, import_elements_react5.messageTestId)(message),
+      children: (0, import_elements_react5.uiTextToFormattedMessage)(message, intl)
     }
   );
 }
@@ -442,38 +591,38 @@ function DefaultMessage({ message }) {
 var import_react_intl4 = require("react-intl");
 
 // src/theme/default/assets/icons/code.svg
-var React3 = __toESM(require("react"));
-var import_jsx_runtime9 = require("react/jsx-runtime");
+var React4 = __toESM(require("react"));
+var import_jsx_runtime11 = require("react/jsx-runtime");
 var SvgCode = (props) => {
   var _a, _b;
-  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("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__ */ (0, import_jsx_runtime9.jsx)("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__ */ (0, import_jsx_runtime11.jsx)("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__ */ (0, import_jsx_runtime11.jsx)("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 code_default = SvgCode;
 
 // src/theme/default/assets/icons/passkey.svg
-var React4 = __toESM(require("react"));
-var import_jsx_runtime10 = require("react/jsx-runtime");
+var React5 = __toESM(require("react"));
+var import_jsx_runtime12 = require("react/jsx-runtime");
 var SvgPasskey = (props) => {
   var _a, _b;
-  return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("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__ */ (0, import_jsx_runtime10.jsx)("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__ */ (0, import_jsx_runtime12.jsx)("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__ */ (0, import_jsx_runtime12.jsx)("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 passkey_default = SvgPasskey;
 
 // src/theme/default/assets/icons/password.svg
-var React5 = __toESM(require("react"));
-var import_jsx_runtime11 = require("react/jsx-runtime");
+var React6 = __toESM(require("react"));
+var import_jsx_runtime13 = require("react/jsx-runtime");
 var SvgPassword = (props) => {
   var _a, _b;
-  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("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__ */ (0, import_jsx_runtime11.jsx)("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__ */ (0, import_jsx_runtime13.jsx)("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__ */ (0, import_jsx_runtime13.jsx)("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 password_default = SvgPassword;
 
 // src/theme/default/assets/icons/webauthn.svg
-var React6 = __toESM(require("react"));
-var import_jsx_runtime12 = require("react/jsx-runtime");
+var React7 = __toESM(require("react"));
+var import_jsx_runtime14 = require("react/jsx-runtime");
 var SvgWebauthn = (props) => {
   var _a, _b;
-  return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("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__ */ (0, import_jsx_runtime12.jsx)("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__ */ (0, import_jsx_runtime14.jsx)("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__ */ (0, import_jsx_runtime14.jsx)("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;
 
@@ -483,7 +632,7 @@ function isGroupImmediateSubmit(group) {
 }
 
 // src/theme/default/components/card/auth-methods.tsx
-var import_jsx_runtime13 = require("react/jsx-runtime");
+var import_jsx_runtime15 = require("react/jsx-runtime");
 var iconsMap = {
   code: code_default,
   passkey: passkey_default,
@@ -496,17 +645,20 @@ function DefaultAuthMethodListItem({
 }) {
   const intl = (0, import_react_intl4.useIntl)();
   const Icon = iconsMap[group] || null;
-  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: "w-full hover:bg-forms-bg-hover px-2 py-1 rounded", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "w-full hover:bg-forms-bg-hover px-2 py-1 rounded", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
     "button",
     {
       className: "flex text-left py-2 gap-3 cursor-pointer",
       onClick,
       type: isGroupImmediateSubmit(group) ? "submit" : "button",
+      id: `auth-method-list-item-${group}`,
+      "data-testid": "auth-method-list-item",
+      "aria-label": `Authenticate with ${group}`,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: "flex-none w-4 h-4 mt-[2px]", children: Icon && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(Icon, { size: 20, className: "text-forms-fg-default" }) }),
-        /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "flex-1 text-sm leading-normal", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: "text-forms-fg-default text-sm", children: intl.formatMessage({ id: `two-step.${group}.title` }) }),
-          /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: "text-forms-fg-mute text-sm", children: intl.formatMessage({ id: `two-step.${group}.description` }) })
+        /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "flex-none w-4 h-4 mt-[2px]", children: Icon && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Icon, { size: 20, className: "text-forms-fg-default" }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: "flex-1 text-sm leading-normal", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "text-forms-fg-default text-sm", children: intl.formatMessage({ id: `two-step.${group}.title` }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "text-forms-fg-mute text-sm", children: intl.formatMessage({ id: `two-step.${group}.description` }) })
         ] })
       ]
     }
@@ -514,15 +666,15 @@ function DefaultAuthMethodListItem({
 }
 
 // src/theme/default/components/form/button.tsx
-var import_client_fetch4 = require("@ory/client-fetch");
-var import_elements_react5 = require("@ory/elements-react");
-var import_react_hook_form = require("react-hook-form");
+var import_client_fetch5 = require("@ory/client-fetch");
+var import_elements_react6 = require("@ory/elements-react");
+var import_react_hook_form2 = require("react-hook-form");
 var import_react_intl5 = require("react-intl");
 
 // src/theme/default/components/form/spinner.tsx
-var import_jsx_runtime14 = require("react/jsx-runtime");
+var import_jsx_runtime16 = require("react/jsx-runtime");
 function Spinner({ className }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
     "svg",
     {
       "aria-hidden": "true",
@@ -535,7 +687,7 @@ function Spinner({ className }) {
       fill: "none",
       xmlns: "http://www.w3.org/2000/svg",
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("g", { clipPath: "url(#clip0_2572_1748)", children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("g", { clipPath: "url(#clip0_2572_1748)", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
           "path",
           {
             d: "M23.364 10.6362C22.1053 9.37751 20.5016 8.52034 18.7558 8.17307C17.01 7.82581 15.2004 8.00404 13.5559 8.68523C11.9113 9.36641 10.5057 10.52 9.51678 12C8.52784 13.4801 8 15.2201 8 17.0001C8 18.7802 8.52784 20.5202 9.51678 22.0003C10.5057 23.4803 11.9113 24.6339 13.5559 25.3151C15.2004 25.9962 17.01 26.1745 18.7558 25.8272C20.5016 25.4799 22.1053 24.6228 23.364 23.3641",
@@ -544,7 +696,7 @@ function Spinner({ className }) {
             strokeLinejoin: "round"
           }
         ) }),
-        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("defs", { children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("clipPath", { id: "clip0_2572_1748", children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("defs", { children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("clipPath", { id: "clip0_2572_1748", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
           "rect",
           {
             width: "24",
@@ -559,9 +711,9 @@ function Spinner({ className }) {
 }
 
 // src/theme/default/components/form/button.tsx
-var import_elements_react6 = require("@ory/elements-react");
+var import_elements_react7 = require("@ory/elements-react");
 var import_class_variance_authority = require("class-variance-authority");
-var import_jsx_runtime15 = require("react/jsx-runtime");
+var import_jsx_runtime17 = require("react/jsx-runtime");
 var buttonStyles = (0, import_class_variance_authority.cva)(
   [
     "ring-1 relative overflow-hidden ring-inset rounded text-sm leading-none flex gap-3 justify-center",
@@ -615,15 +767,15 @@ var DefaultButton = ({
     ...rest
   } = attributes;
   const intl = (0, import_react_intl5.useIntl)();
-  const label = (0, import_client_fetch4.getNodeLabel)(node);
-  const { flowType } = (0, import_elements_react6.useOryFlow)();
+  const label = (0, import_client_fetch5.getNodeLabel)(node);
+  const { flowType } = (0, import_elements_react7.useOryFlow)();
   const {
     formState: { isSubmitting },
     setValue
-  } = (0, import_react_hook_form.useFormContext)();
+  } = (0, import_react_hook_form2.useFormContext)();
   const isPrimary = attributes.name === "method" || attributes.name.includes("passkey") || attributes.name.includes("webauthn") || attributes.name.includes("lookup_secret");
-  const isSmall = flowType === import_client_fetch4.FlowType.Settings && attributes.name !== "webauthn_register_trigger";
-  return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
+  const isSmall = flowType === import_client_fetch5.FlowType.Settings && attributes.name !== "webauthn_register_trigger";
+  return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
     "button",
     {
       ...rest,
@@ -646,8 +798,8 @@ var DefaultButton = ({
       disabled: (_a = rest.disabled) != null ? _a : true,
       "data-loading": isSubmitting,
       children: [
-        isSubmitting ? /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Spinner, {}) : null,
-        label ? (0, import_elements_react5.uiTextToFormattedMessage)(label, intl) : ""
+        isSubmitting ? /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(Spinner, {}) : null,
+        label ? (0, import_elements_react6.uiTextToFormattedMessage)(label, intl) : ""
       ]
     }
   );
@@ -655,10 +807,10 @@ var DefaultButton = ({
 DefaultButton.displayName = "DefaultButton";
 
 // src/theme/default/components/form/checkbox.tsx
-var import_client_fetch5 = require("@ory/client-fetch");
-var import_elements_react7 = require("@ory/elements-react");
+var import_client_fetch6 = require("@ory/client-fetch");
+var import_elements_react8 = require("@ory/elements-react");
 var import_react = require("react");
-var import_react_hook_form2 = require("react-hook-form");
+var import_react_hook_form3 = require("react-hook-form");
 var import_react_intl7 = require("react-intl");
 
 // src/theme/default/components/ui/checkbox-label.tsx
@@ -713,7 +865,7 @@ var uiTextToFormattedMessage3 = ({ id, context = {}, text }, intl) => {
 };
 
 // src/theme/default/components/ui/checkbox-label.tsx
-var import_jsx_runtime16 = require("react/jsx-runtime");
+var import_jsx_runtime18 = require("react/jsx-runtime");
 var linkRegex = /\[([^\]]+)\]\(([^)]+)\)/g;
 function computeLabelElements(labelText) {
   const elements = [];
@@ -729,7 +881,7 @@ function computeLabelElements(labelText) {
       elements.push(labelText.slice(lastIndex, matchStart));
     }
     elements.push(
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
         "a",
         {
           href: url,
@@ -754,13 +906,13 @@ function CheckboxLabel({ label }) {
     return null;
   }
   const labelText = uiTextToFormattedMessage3(label, intl);
-  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_jsx_runtime16.Fragment, { children: computeLabelElements(labelText) });
+  return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_jsx_runtime18.Fragment, { children: computeLabelElements(labelText) });
 }
 
 // src/theme/default/components/form/checkbox.tsx
-var import_jsx_runtime17 = require("react/jsx-runtime");
+var import_jsx_runtime19 = require("react/jsx-runtime");
 function CheckboxSVG() {
-  return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
     "svg",
     {
       className: "absolute w-4 h-4 hidden peer-checked:block",
@@ -770,14 +922,14 @@ function CheckboxSVG() {
       viewBox: "0 0 16 16",
       fill: "none",
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
           "path",
           {
             d: "M0 4C0 1.79086 1.79086 0 4 0H12C14.2091 0 16 1.79086 16 4V12C16 14.2091 14.2091 16 12 16H4C1.79086 16 0 14.2091 0 12V4Z",
             fill: "#0F172A"
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
           "path",
           {
             fillRule: "evenodd",
@@ -805,10 +957,10 @@ var DefaultCheckbox = ({
     ...attributes
   } = initialAttributes;
   const intl = (0, import_react_intl7.useIntl)();
-  const label = (0, import_client_fetch5.getNodeLabel)(node);
+  const label = (0, import_client_fetch6.getNodeLabel)(node);
   const [checked, setChecked] = (0, import_react.useState)(Boolean(value));
-  const { register } = (0, import_react_hook_form2.useForm)();
-  return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
+  const { register } = (0, import_react_hook_form3.useForm)();
+  return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
     "div",
     {
       className: "flex antialiased gap-3 self-stretch item-start",
@@ -816,8 +968,8 @@ var DefaultCheckbox = ({
         setChecked(!checked);
       },
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "flex h-5 items-center", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "flex h-5 items-center", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
             "input",
             {
               ...attributes,
@@ -832,16 +984,16 @@ var DefaultCheckbox = ({
               ...register(name, { value })
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(CheckboxSVG, {})
+          /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(CheckboxSVG, {})
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "text-sm items-center", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("label", { className: "text-sm font-normal leading-normal text-forms-fg-default", children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(CheckboxLabel, { label }) }),
-          node.messages.map((message) => /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "text-sm items-center", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("label", { className: "text-sm font-normal leading-normal text-forms-fg-default", children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(CheckboxLabel, { label }) }),
+          node.messages.map((message) => /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
             "span",
             {
               className: "text-sm text-red-900 mt-1",
-              ...(0, import_elements_react7.messageTestId)(message),
-              children: (0, import_elements_react7.uiTextToFormattedMessage)(message, intl)
+              ...(0, import_elements_react8.messageTestId)(message),
+              children: (0, import_elements_react8.uiTextToFormattedMessage)(message, intl)
             },
             message.id
           ))
@@ -852,49 +1004,56 @@ var DefaultCheckbox = ({
 };
 
 // src/theme/default/components/form/group-container.tsx
-var import_jsx_runtime18 = require("react/jsx-runtime");
+var import_jsx_runtime20 = require("react/jsx-runtime");
 function DefaultGroupContainer({ children }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "grid grid-cols-1 gap-6", children });
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "grid grid-cols-1 gap-6", children });
 }
 
 // src/theme/default/components/form/horizontal-divider.tsx
-var import_jsx_runtime19 = require("react/jsx-runtime");
+var import_jsx_runtime21 = require("react/jsx-runtime");
 function DefaultHorizontalDivider() {
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("hr", { className: "border-dialog-border-default" });
+  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("hr", { className: "border-dialog-border-default" });
 }
 
 // src/theme/default/components/form/image.tsx
-var import_jsx_runtime20 = require("react/jsx-runtime");
+var import_jsx_runtime22 = require("react/jsx-runtime");
 function DefaultImage({ attributes }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("figure", { children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("img", { ...attributes }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("figure", { children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("img", { ...attributes }) });
 }
 
 // src/theme/default/components/form/input.tsx
-var import_client_fetch6 = require("@ory/client-fetch");
-var import_elements_react8 = require("@ory/elements-react");
-var import_react_hook_form3 = require("react-hook-form");
+var import_client_fetch7 = require("@ory/client-fetch");
+var import_elements_react9 = require("@ory/elements-react");
+var import_react_hook_form4 = require("react-hook-form");
 var import_react_intl8 = require("react-intl");
-var import_jsx_runtime21 = require("react/jsx-runtime");
+var import_jsx_runtime23 = require("react/jsx-runtime");
 var DefaultInput = ({
   node,
   attributes,
   onClick
 }) => {
-  const label = (0, import_client_fetch6.getNodeLabel)(node);
-  const { register } = (0, import_react_hook_form3.useFormContext)();
-  const { value, autocomplete, name, maxlength, ...rest } = attributes;
+  const label = (0, import_client_fetch7.getNodeLabel)(node);
+  const { register } = (0, import_react_hook_form4.useFormContext)();
+  const {
+    value,
+    autocomplete,
+    name,
+    maxlength,
+    node_type: _,
+    ...rest
+  } = attributes;
   const intl = (0, import_react_intl8.useIntl)();
-  const { flowType } = (0, import_elements_react8.useOryFlow)();
+  const { flowType } = (0, import_elements_react9.useOryFlow)();
   const formattedLabel = label ? intl.formatMessage(
     {
       id: "input.placeholder",
       defaultMessage: "Enter your {placeholder}"
     },
     {
-      placeholder: (0, import_elements_react8.uiTextToFormattedMessage)(label, intl)
+      placeholder: (0, import_elements_react9.uiTextToFormattedMessage)(label, intl)
     }
   ) : "";
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
     "input",
     {
       ...rest,
@@ -906,7 +1065,7 @@ var DefaultInput = ({
         "antialiased disabled:text-forms-fg-disabled disabled:bg-forms-bg-disabled bg-forms-bg-default rounded-border-radius-forms border border-forms-border-default leading-tight hover:border-forms-border-hover transition-colors text-sm",
         "px-3 py-2.5",
         // 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 === import_client_fetch6.FlowType.Settings ? "max-w-[488px]" : "md:px-4 md:py-4"
+        flowType === import_client_fetch7.FlowType.Settings ? "max-w-[488px]" : "md:px-4 md:py-4"
       ),
       ...register(name, { value })
     }
@@ -914,10 +1073,16 @@ var DefaultInput = ({
 };
 
 // src/theme/default/components/form/label.tsx
-var import_client_fetch7 = require("@ory/client-fetch");
-var import_elements_react9 = require("@ory/elements-react");
+var import_client_fetch8 = require("@ory/client-fetch");
+var import_elements_react10 = require("@ory/elements-react");
+var import_react_hook_form5 = require("react-hook-form");
 var import_react_intl9 = require("react-intl");
-var import_jsx_runtime22 = require("react/jsx-runtime");
+var import_jsx_runtime24 = require("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")
+  );
+}
 function DefaultLabel({
   node,
   children,
@@ -925,24 +1090,31 @@ function DefaultLabel({
   ...rest
 }) {
   const intl = (0, import_react_intl9.useIntl)();
-  const label = (0, import_client_fetch7.getNodeLabel)(node);
-  const { config, flowType } = (0, import_elements_react9.useOryFlow)();
+  const label = (0, import_client_fetch8.getNodeLabel)(node);
+  const { Message } = (0, import_elements_react10.useComponents)();
+  const { config, flowType, flow } = (0, import_elements_react10.useOryFlow)();
+  const { setValue } = (0, import_react_hook_form5.useFormContext)();
   const isPassword = attributes.type === "password";
-  const isCode = attributes.name === "code";
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("span", { className: "flex flex-col antialiased gap-1", children: [
-    label && /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("span", { className: "inline-flex justify-between", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+  const resendNode = findResendNode(flow.ui.nodes);
+  const handleResend = () => {
+    if ((resendNode == null ? void 0 : resendNode.attributes) && "name" in resendNode.attributes) {
+      setValue(resendNode.attributes.name, resendNode.attributes.value);
+    }
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "flex flex-col antialiased gap-1", children: [
+    label && /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("span", { className: "inline-flex justify-between", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
         "label",
         {
-          ...(0, import_elements_react9.messageTestId)(label),
+          ...(0, import_elements_react10.messageTestId)(label),
           className: "text-sm font-medium leading-normal",
           htmlFor: attributes.name,
           ...rest,
-          children: (0, import_elements_react9.uiTextToFormattedMessage)(label, intl)
+          children: (0, import_elements_react10.uiTextToFormattedMessage)(label, intl)
         }
       ),
-      isPassword && config.project.recovery_enabled && flowType === import_client_fetch7.FlowType.Login && // TODO: make it possible to override with a custom component
-      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+      isPassword && config.project.recovery_enabled && flowType === import_client_fetch8.FlowType.Login && // TODO: make it possible to override with a custom component
+      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
         "a",
         {
           href: config.project.recovery_ui_url,
@@ -953,66 +1125,55 @@ function DefaultLabel({
           })
         }
       ),
-      isCode && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+      (resendNode == null ? void 0 : resendNode.attributes.node_type) === "input" && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
         "button",
         {
           type: "submit",
-          name: "method",
-          value: "code",
+          name: resendNode.attributes.name,
+          value: resendNode.attributes.value,
+          onClick: handleResend,
           className: "text-links-link-default hover:underline hover:text-link-hover transition-colors text-sm font-medium cursor-pointer",
           children: intl.formatMessage({ id: "identities.messages.1070008" })
         }
       )
     ] }),
     children,
-    node.messages.map((message) => /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
-      "span",
-      {
-        className: cn("text-sm leading-normal", {
-          "text-forms-fg-error": message.type === "error",
-          "text-forms-fg-default": message.type === "info",
-          "text-forms-fg-success": message.type === "success"
-        }),
-        ...(0, import_elements_react9.messageTestId)(message),
-        children: (0, import_elements_react9.uiTextToFormattedMessage)(message, intl)
-      },
-      message.id
-    ))
+    node.messages.map((message) => /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Message.Content, { message }, message.id))
   ] });
 }
 
 // src/theme/default/components/form/link-button.tsx
-var import_client_fetch8 = require("@ory/client-fetch");
-var import_elements_react10 = require("@ory/elements-react");
+var import_client_fetch9 = require("@ory/client-fetch");
+var import_elements_react11 = require("@ory/elements-react");
 var import_react2 = require("react");
 var import_react_intl10 = require("react-intl");
-var import_jsx_runtime23 = require("react/jsx-runtime");
+var import_jsx_runtime25 = require("react/jsx-runtime");
 var DefaultLinkButton = (0, import_react2.forwardRef)(({ attributes, node }, ref) => {
   const intl = (0, import_react_intl10.useIntl)();
-  const label = (0, import_client_fetch8.getNodeLabel)(node);
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+  const label = (0, import_client_fetch9.getNodeLabel)(node);
+  return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
     "a",
     {
       ...attributes,
       ref,
-      title: label ? (0, import_elements_react10.uiTextToFormattedMessage)(label, intl) : "",
+      title: label ? (0, import_elements_react11.uiTextToFormattedMessage)(label, intl) : "",
       className: cn(
         "antialiased rounded cursor-pointer text-center border border-transparent gap-3 leading-none bg-button-primary-bg-default hover:bg-button-primary-bg-hover transition-colors text-button-primary-fg-default hover:text-button-primary-fg-hover px-4 py-4.5 text-sm font-medium"
       ),
-      children: label ? (0, import_elements_react10.uiTextToFormattedMessage)(label, intl) : ""
+      children: label ? (0, import_elements_react11.uiTextToFormattedMessage)(label, intl) : ""
     }
   );
 });
 DefaultLinkButton.displayName = "DefaultLinkButton";
 
 // src/theme/default/components/form/pin-code-input.tsx
-var import_react_hook_form4 = require("react-hook-form");
+var import_react_hook_form6 = require("react-hook-form");
 
 // src/theme/default/components/form/shadcn/otp-input.tsx
 var import_input_otp = require("input-otp");
-var React7 = __toESM(require("react"));
-var import_jsx_runtime24 = require("react/jsx-runtime");
-var InputOTP = React7.forwardRef(({ className, containerClassName, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+var React8 = __toESM(require("react"));
+var import_jsx_runtime26 = require("react/jsx-runtime");
+var InputOTP = React8.forwardRef(({ className, containerClassName, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
   import_input_otp.OTPInput,
   {
     ref,
@@ -1025,12 +1186,12 @@ var InputOTP = React7.forwardRef(({ className, containerClassName, ...props }, r
   }
 ));
 InputOTP.displayName = "InputOTP";
-var InputOTPGroup = React7.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { ref, className: cn("flex items-center", className), ...props }));
+var InputOTPGroup = React8.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { ref, className: cn("flex items-center", className), ...props }));
 InputOTPGroup.displayName = "InputOTPGroup";
-var InputOTPSlot = React7.forwardRef(({ index, className, ...props }, ref) => {
-  const inputOTPContext = React7.useContext(import_input_otp.OTPInputContext);
+var InputOTPSlot = React8.forwardRef(({ index, className, ...props }, ref) => {
+  const inputOTPContext = React8.useContext(import_input_otp.OTPInputContext);
   const { char, hasFakeCaret, isActive } = inputOTPContext.slots[index];
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
     "div",
     {
       ref,
@@ -1042,7 +1203,7 @@ var InputOTPSlot = React7.forwardRef(({ index, className, ...props }, ref) => {
       ...props,
       children: [
         char,
-        hasFakeCaret && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "pointer-events-none absolute inset-0 flex items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "h-4 w-px animate-caret-blink bg-branding-bg-default duration-750" }) })
+        hasFakeCaret && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { className: "pointer-events-none absolute inset-0 flex items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { className: "h-4 w-px animate-caret-blink bg-branding-bg-default duration-750" }) })
       ]
     }
   );
@@ -1050,23 +1211,23 @@ var InputOTPSlot = React7.forwardRef(({ index, className, ...props }, ref) => {
 InputOTPSlot.displayName = "InputOTPSlot";
 
 // src/theme/default/components/form/pin-code-input.tsx
-var import_jsx_runtime25 = require("react/jsx-runtime");
+var import_jsx_runtime27 = require("react/jsx-runtime");
 var DefaultPinCodeInput = ({ attributes }) => {
-  const { setValue, watch } = (0, import_react_hook_form4.useFormContext)();
+  const { setValue, watch } = (0, import_react_hook_form6.useFormContext)();
   const { maxlength, name } = attributes;
   const elements = maxlength != null ? maxlength : 6;
   const handleInputChange = (v) => {
     setValue(name, v);
   };
   const value = watch(name);
-  return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
     InputOTP,
     {
       maxLength: maxlength != null ? maxlength : 6,
       onChange: handleInputChange,
       name,
       value,
-      children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(InputOTPGroup, { className: "w-full space-x-2 justify-between", children: [...Array(elements)].map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(InputOTPGroup, { className: "w-full space-x-2 justify-between", children: [...Array(elements)].map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
         InputOTPSlot,
         {
           index,
@@ -1078,167 +1239,189 @@ var DefaultPinCodeInput = ({ attributes }) => {
   );
 };
 
+// src/theme/default/components/form/section.tsx
+var import_jsx_runtime28 = require("react/jsx-runtime");
+var DefaultFormSection = ({ children }) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "flex flex-col w-80 md:w-[712px] lg:w-[802px] xl:w-[896px]", children });
+};
+var DefaultFormSectionContent = ({
+  title,
+  description,
+  children
+}) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "border rounded-t-xl border-b-0 border-dialog-border-default bg-forms-bg-default px-6 py-8 flex flex-col gap-8", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "flex flex-col gap-2", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("h3", { className: "font-medium text-dialog-fg-default", children: title }),
+      /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "text-sm text-dialog-fg-subtle", children: description })
+    ] }),
+    children
+  ] });
+};
+var DefaultFormSectionFooter = ({ children }) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "rounded-b-xl gap-2 flex justify-end px-6 py-4 bg-dialog-bg-subtle border border-dialog-border-default text-sm text-dialog-fg-mute items-center [&>span]:mr-auto min-h-[72px]", children });
+};
+
 // src/theme/default/components/form/social.tsx
-var import_elements_react11 = require("@ory/elements-react");
+var import_elements_react12 = require("@ory/elements-react");
 
 // src/theme/default/provider-logos/apple.svg
-var React8 = __toESM(require("react"));
-var import_jsx_runtime26 = require("react/jsx-runtime");
+var React9 = __toESM(require("react"));
+var import_jsx_runtime29 = require("react/jsx-runtime");
 var SvgApple = (props) => {
   var _a, _b;
-  return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("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__ */ (0, import_jsx_runtime26.jsx)("path", { fill: "#283544", d: "M30 16c0 7.728-6.265 14-14 14S2 23.728 2 16C2 8.265 8.265 2 16 2s14 6.265 14 14" }),
-    /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("path", { fill: "#fff", d: "M22.562 12.457c-.076.045-1.895.986-1.895 3.07.086 2.38 2.295 3.213 2.333 3.213-.038.045-.334 1.136-1.21 2.28-.694.986-1.466 1.98-2.637 1.98-1.114 0-1.514-.657-2.8-.657-1.381 0-1.772.657-2.829.657-1.171 0-2-1.047-2.733-2.023-.952-1.278-1.761-3.284-1.79-5.21-.02-1.02.19-2.023.724-2.875.752-1.19 2.095-1.997 3.561-2.023 1.124-.036 2.124.719 2.81.719.657 0 1.885-.72 3.275-.72.6.001 2.2.17 3.191 1.59m-6.561-1.792c-.2-.932.352-1.864.866-2.458.657-.72 1.695-1.207 2.59-1.207a3.33 3.33 0 0 1-.952 2.511c-.58.72-1.58 1.26-2.504 1.154" })
+  return /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("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__ */ (0, import_jsx_runtime29.jsx)("path", { fill: "#283544", d: "M30 16c0 7.728-6.265 14-14 14S2 23.728 2 16C2 8.265 8.265 2 16 2s14 6.265 14 14" }),
+    /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("path", { fill: "#fff", d: "M22.562 12.457c-.076.045-1.895.986-1.895 3.07.086 2.38 2.295 3.213 2.333 3.213-.038.045-.334 1.136-1.21 2.28-.694.986-1.466 1.98-2.637 1.98-1.114 0-1.514-.657-2.8-.657-1.381 0-1.772.657-2.829.657-1.171 0-2-1.047-2.733-2.023-.952-1.278-1.761-3.284-1.79-5.21-.02-1.02.19-2.023.724-2.875.752-1.19 2.095-1.997 3.561-2.023 1.124-.036 2.124.719 2.81.719.657 0 1.885-.72 3.275-.72.6.001 2.2.17 3.191 1.59m-6.561-1.792c-.2-.932.352-1.864.866-2.458.657-.72 1.695-1.207 2.59-1.207a3.33 3.33 0 0 1-.952 2.511c-.58.72-1.58 1.26-2.504 1.154" })
   ] });
 };
 var apple_default = SvgApple;
 
 // src/theme/default/provider-logos/auth0.svg
-var React9 = __toESM(require("react"));
-var import_jsx_runtime27 = require("react/jsx-runtime");
+var React10 = __toESM(require("react"));
+var import_jsx_runtime30 = require("react/jsx-runtime");
 var SvgAuth0 = (props) => {
   var _a, _b;
-  return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 64 64", 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__ */ (0, import_jsx_runtime27.jsx)("path", { fill: "#eb5424", d: "M49.012 51.774 42.514 32l17.008-12.22h-21.02L32.005 0h21.032l6.506 19.78c3.767 11.468-.118 24.52-10.53 31.993zm-34.023 0L31.998 64l17.015-12.226-17.008-12.22zm-10.516-32c-3.976 12.1.64 24.917 10.5 32.007v-.007L21.482 32 4.474 19.774l21.025.007L31.998 0H10.972z" }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 64 64", 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__ */ (0, import_jsx_runtime30.jsx)("path", { fill: "#eb5424", d: "M49.012 51.774 42.514 32l17.008-12.22h-21.02L32.005 0h21.032l6.506 19.78c3.767 11.468-.118 24.52-10.53 31.993zm-34.023 0L31.998 64l17.015-12.226-17.008-12.22zm-10.516-32c-3.976 12.1.64 24.917 10.5 32.007v-.007L21.482 32 4.474 19.774l21.025.007L31.998 0H10.972z" }) });
 };
 var auth0_default = SvgAuth0;
 
 // src/theme/default/provider-logos/discord.svg
-var React10 = __toESM(require("react"));
-var import_jsx_runtime28 = require("react/jsx-runtime");
+var React11 = __toESM(require("react"));
+var import_jsx_runtime31 = require("react/jsx-runtime");
 var SvgDiscord = (props) => {
   var _a, _b;
-  return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("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__ */ (0, import_jsx_runtime28.jsx)("path", { d: "M2 11.6c0-3.36 0-5.04.654-6.324a6 6 0 0 1 2.622-2.622C6.56 2 8.24 2 11.6 2h8.8c3.36 0 5.04 0 6.324.654a6 6 0 0 1 2.622 2.622C30 6.56 30 8.24 30 11.6v8.8c0 3.36 0 5.04-.654 6.324a6 6 0 0 1-2.622 2.622C25.44 30 23.76 30 20.4 30h-8.8c-3.36 0-5.04 0-6.324-.654a6 6 0 0 1-2.622-2.622C2 25.44 2 23.76 2 20.4z" }),
-    /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("path", { fill: "#5865F2", d: "M23.636 9.34A18.8 18.8 0 0 0 19.097 8c-.195.332-.424.779-.581 1.134a17.7 17.7 0 0 0-5.03 0A12 12 0 0 0 12.897 8a18.7 18.7 0 0 0-4.542 1.343c-2.872 4.078-3.65 8.055-3.262 11.975a18.6 18.6 0 0 0 5.567 2.68c.448-.58.848-1.195 1.192-1.844a12 12 0 0 1-1.877-.859 9 9 0 0 0 .46-.342c3.62 1.59 7.553 1.59 11.13 0q.225.178.46.342c-.595.337-1.225.626-1.88.86q.516.974 1.191 1.845a18.6 18.6 0 0 0 5.57-2.682c.457-4.544-.78-8.484-3.27-11.978m-11.29 9.567c-1.087 0-1.978-.953-1.978-2.113s.872-2.116 1.977-2.116c1.106 0 1.997.953 1.978 2.116.002 1.16-.872 2.113-1.978 2.113m7.308 0c-1.086 0-1.977-.953-1.977-2.113s.872-2.116 1.977-2.116c1.106 0 1.997.953 1.978 2.116 0 1.16-.872 2.113-1.978 2.113" })
+  return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)("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__ */ (0, import_jsx_runtime31.jsx)("path", { d: "M2 11.6c0-3.36 0-5.04.654-6.324a6 6 0 0 1 2.622-2.622C6.56 2 8.24 2 11.6 2h8.8c3.36 0 5.04 0 6.324.654a6 6 0 0 1 2.622 2.622C30 6.56 30 8.24 30 11.6v8.8c0 3.36 0 5.04-.654 6.324a6 6 0 0 1-2.622 2.622C25.44 30 23.76 30 20.4 30h-8.8c-3.36 0-5.04 0-6.324-.654a6 6 0 0 1-2.622-2.622C2 25.44 2 23.76 2 20.4z" }),
+    /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("path", { fill: "#5865F2", d: "M23.636 9.34A18.8 18.8 0 0 0 19.097 8c-.195.332-.424.779-.581 1.134a17.7 17.7 0 0 0-5.03 0A12 12 0 0 0 12.897 8a18.7 18.7 0 0 0-4.542 1.343c-2.872 4.078-3.65 8.055-3.262 11.975a18.6 18.6 0 0 0 5.567 2.68c.448-.58.848-1.195 1.192-1.844a12 12 0 0 1-1.877-.859 9 9 0 0 0 .46-.342c3.62 1.59 7.553 1.59 11.13 0q.225.178.46.342c-.595.337-1.225.626-1.88.86q.516.974 1.191 1.845a18.6 18.6 0 0 0 5.57-2.682c.457-4.544-.78-8.484-3.27-11.978m-11.29 9.567c-1.087 0-1.978-.953-1.978-2.113s.872-2.116 1.977-2.116c1.106 0 1.997.953 1.978 2.116.002 1.16-.872 2.113-1.978 2.113m7.308 0c-1.086 0-1.977-.953-1.977-2.113s.872-2.116 1.977-2.116c1.106 0 1.997.953 1.978 2.116 0 1.16-.872 2.113-1.978 2.113" })
   ] });
 };
 var discord_default = SvgDiscord;
 
 // src/theme/default/provider-logos/facebook.svg
-var React11 = __toESM(require("react"));
-var import_jsx_runtime29 = require("react/jsx-runtime");
+var React12 = __toESM(require("react"));
+var import_jsx_runtime32 = require("react/jsx-runtime");
 var SvgFacebook = (props) => {
   var _a, _b;
-  return /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("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__ */ (0, import_jsx_runtime29.jsxs)("g", { clipPath: "url(#facebook_svg__a)", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("path", { fill: "#1877F2", d: "M24 12c0-6.627-5.373-12-12-12C5.372 0 0 5.374 0 12c0 5.99 4.388 10.954 10.125 11.854V15.47H7.078V12h3.047V9.357c0-3.008 1.791-4.669 4.532-4.669 1.313 0 2.686.234 2.686.234v2.953H15.83c-1.49 0-1.955.925-1.955 1.874V12h3.328l-.532 3.469h-2.796v8.385c5.736-.9 10.124-5.864 10.124-11.854" }),
-      /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("path", { fill: "#fff", d: "M16.67 15.469 17.204 12h-3.328V9.75c0-.95.465-1.875 1.955-1.875h1.513V4.922s-1.373-.234-2.686-.234c-2.74 0-4.532 1.661-4.532 4.669V12H7.078v3.469h3.047v8.385a12.1 12.1 0 0 0 3.75 0V15.47z" })
+  return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("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__ */ (0, import_jsx_runtime32.jsxs)("g", { clipPath: "url(#facebook_svg__a)", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("path", { fill: "#1877F2", d: "M24 12c0-6.627-5.373-12-12-12C5.372 0 0 5.374 0 12c0 5.99 4.388 10.954 10.125 11.854V15.47H7.078V12h3.047V9.357c0-3.008 1.791-4.669 4.532-4.669 1.313 0 2.686.234 2.686.234v2.953H15.83c-1.49 0-1.955.925-1.955 1.874V12h3.328l-.532 3.469h-2.796v8.385c5.736-.9 10.124-5.864 10.124-11.854" }),
+      /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("path", { fill: "#fff", d: "M16.67 15.469 17.204 12h-3.328V9.75c0-.95.465-1.875 1.955-1.875h1.513V4.922s-1.373-.234-2.686-.234c-2.74 0-4.532 1.661-4.532 4.669V12H7.078v3.469h3.047v8.385a12.1 12.1 0 0 0 3.75 0V15.47z" })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("defs", { children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("clipPath", { id: "facebook_svg__a", children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("rect", { fill: "#fff" }) }) })
+    /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("defs", { children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("clipPath", { id: "facebook_svg__a", children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("rect", { fill: "#fff" }) }) })
   ] });
 };
 var facebook_default = SvgFacebook;
 
 // src/theme/default/provider-logos/generic.svg
-var React12 = __toESM(require("react"));
-var import_jsx_runtime30 = require("react/jsx-runtime");
+var React13 = __toESM(require("react"));
+var import_jsx_runtime33 = require("react/jsx-runtime");
 var SvgGeneric = (props) => {
   var _a, _b;
-  return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, className: "generic_svg__icon generic_svg__icon-tabler generic_svg__icon-tabler-brand-oauth", 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__ */ (0, import_jsx_runtime30.jsx)("path", { stroke: "none", d: "M0 0h24v24H0z" }),
-    /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("path", { d: "M2 12a10 10 0 1 0 20 0 10 10 0 1 0-20 0" }),
-    /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("path", { d: "M12.556 6c.65 0 1.235.373 1.508.947l2.839 7.848a1.646 1.646 0 0 1-1.01 2.108 1.673 1.673 0 0 1-2.068-.851L13.365 15h-2.73l-.398.905A1.67 1.67 0 0 1 8.26 16.95l-.153-.047a1.647 1.647 0 0 1-1.056-1.956l2.824-7.852a1.66 1.66 0 0 1 1.409-1.087z" })
+  return /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, className: "generic_svg__icon generic_svg__icon-tabler generic_svg__icon-tabler-brand-oauth", 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__ */ (0, import_jsx_runtime33.jsx)("path", { stroke: "none", d: "M0 0h24v24H0z" }),
+    /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("path", { d: "M2 12a10 10 0 1 0 20 0 10 10 0 1 0-20 0" }),
+    /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("path", { d: "M12.556 6c.65 0 1.235.373 1.508.947l2.839 7.848a1.646 1.646 0 0 1-1.01 2.108 1.673 1.673 0 0 1-2.068-.851L13.365 15h-2.73l-.398.905A1.67 1.67 0 0 1 8.26 16.95l-.153-.047a1.647 1.647 0 0 1-1.056-1.956l2.824-7.852a1.66 1.66 0 0 1 1.409-1.087z" })
   ] });
 };
 var generic_default = SvgGeneric;
 
 // src/theme/default/provider-logos/github.svg
-var React13 = __toESM(require("react"));
-var import_jsx_runtime31 = require("react/jsx-runtime");
+var React14 = __toESM(require("react"));
+var import_jsx_runtime34 = require("react/jsx-runtime");
 var SvgGithub = (props) => {
   var _a, _b;
-  return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", 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__ */ (0, import_jsx_runtime31.jsx)("path", { d: "M12 0C5.374 0 0 5.373 0 12c0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23A11.5 11.5 0 0 1 12 5.803c1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576C20.566 21.797 24 17.3 24 12c0-6.627-5.373-12-12-12" }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", 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__ */ (0, import_jsx_runtime34.jsx)("path", { d: "M12 0C5.374 0 0 5.373 0 12c0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23A11.5 11.5 0 0 1 12 5.803c1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576C20.566 21.797 24 17.3 24 12c0-6.627-5.373-12-12-12" }) });
 };
 var github_default = SvgGithub;
 
 // src/theme/default/provider-logos/gitlab.svg
-var React14 = __toESM(require("react"));
-var import_jsx_runtime32 = require("react/jsx-runtime");
+var React15 = __toESM(require("react"));
+var import_jsx_runtime35 = require("react/jsx-runtime");
 var SvgGitlab = (props) => {
   var _a, _b;
-  return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("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__ */ (0, import_jsx_runtime32.jsx)("path", { fill: "#E24329", d: "m22.708 10.691-.031-.072-3.015-7.167a.74.74 0 0 0-.31-.34.87.87 0 0 0-.923.045.73.73 0 0 0-.268.37L16.125 9.2H7.881L5.845 3.527a.72.72 0 0 0-.268-.371.87.87 0 0 0-.923-.045.74.74 0 0 0-.31.34l-3.021 7.164-.03.072a4.67 4.67 0 0 0-.153 3.23c.335 1.063 1.04 1.998 2.01 2.664l.01.007.028.018 4.594 3.132 2.272 1.567 1.384.952c.162.112.36.172.563.172s.401-.06.563-.172l1.384-.952 2.273-1.567 4.62-3.151.012-.009c.968-.666 1.671-1.6 2.006-2.661a4.67 4.67 0 0 0-.15-3.226" }),
-    /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("path", { fill: "#FC6D26", d: "m22.708 10.691-.031-.072a10.7 10.7 0 0 0-4.055 1.66L12 16.839l4.218 2.904 4.621-3.152.012-.008c.969-.666 1.674-1.601 2.008-2.664a4.67 4.67 0 0 0-.15-3.228" }),
-    /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("path", { fill: "#FCA326", d: "m7.781 19.743 2.273 1.566 1.384.952c.162.112.36.172.563.172s.401-.06.563-.172l1.384-.952 2.273-1.566S14.255 18.389 12 16.839c-2.255 1.55-4.219 2.904-4.219 2.904" }),
-    /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("path", { fill: "#FC6D26", d: "M5.376 12.279a10.7 10.7 0 0 0-4.053-1.664l-.03.072a4.67 4.67 0 0 0-.153 3.23c.335 1.063 1.04 1.998 2.01 2.664l.01.007.028.018 4.594 3.132L12 16.836z" })
+  return /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("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__ */ (0, import_jsx_runtime35.jsx)("path", { fill: "#E24329", d: "m22.708 10.691-.031-.072-3.015-7.167a.74.74 0 0 0-.31-.34.87.87 0 0 0-.923.045.73.73 0 0 0-.268.37L16.125 9.2H7.881L5.845 3.527a.72.72 0 0 0-.268-.371.87.87 0 0 0-.923-.045.74.74 0 0 0-.31.34l-3.021 7.164-.03.072a4.67 4.67 0 0 0-.153 3.23c.335 1.063 1.04 1.998 2.01 2.664l.01.007.028.018 4.594 3.132 2.272 1.567 1.384.952c.162.112.36.172.563.172s.401-.06.563-.172l1.384-.952 2.273-1.567 4.62-3.151.012-.009c.968-.666 1.671-1.6 2.006-2.661a4.67 4.67 0 0 0-.15-3.226" }),
+    /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("path", { fill: "#FC6D26", d: "m22.708 10.691-.031-.072a10.7 10.7 0 0 0-4.055 1.66L12 16.839l4.218 2.904 4.621-3.152.012-.008c.969-.666 1.674-1.601 2.008-2.664a4.67 4.67 0 0 0-.15-3.228" }),
+    /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("path", { fill: "#FCA326", d: "m7.781 19.743 2.273 1.566 1.384.952c.162.112.36.172.563.172s.401-.06.563-.172l1.384-.952 2.273-1.566S14.255 18.389 12 16.839c-2.255 1.55-4.219 2.904-4.219 2.904" }),
+    /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("path", { fill: "#FC6D26", d: "M5.376 12.279a10.7 10.7 0 0 0-4.053-1.664l-.03.072a4.67 4.67 0 0 0-.153 3.23c.335 1.063 1.04 1.998 2.01 2.664l.01.007.028.018 4.594 3.132L12 16.836z" })
   ] });
 };
 var gitlab_default = SvgGitlab;
 
 // src/theme/default/provider-logos/google.svg
-var React15 = __toESM(require("react"));
-var import_jsx_runtime33 = require("react/jsx-runtime");
+var React16 = __toESM(require("react"));
+var import_jsx_runtime36 = require("react/jsx-runtime");
 var SvgGoogle = (props) => {
   var _a, _b;
-  return /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)("svg", { xmlns: "http://www.w3.org/2000/svg", 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__ */ (0, import_jsx_runtime33.jsx)("path", { fill: "#4285F4", d: "M23.745 12.27c0-.79-.07-1.54-.19-2.27h-11.3v4.51h6.47c-.29 1.48-1.14 2.73-2.4 3.58v3h3.86c2.26-2.09 3.56-5.17 3.56-8.82" }),
-    /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("path", { fill: "#34A853", d: "M12.255 24c3.24 0 5.95-1.08 7.93-2.91l-3.86-3c-1.08.72-2.45 1.16-4.07 1.16-3.13 0-5.78-2.11-6.73-4.96h-3.98v3.09C3.515 21.3 7.565 24 12.255 24" }),
-    /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("path", { fill: "#FBBC05", d: "M5.525 14.29c-.25-.72-.38-1.49-.38-2.29s.14-1.57.38-2.29V6.62h-3.98a11.86 11.86 0 0 0 0 10.76z" }),
-    /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("path", { fill: "#EA4335", d: "M12.255 4.75c1.77 0 3.35.61 4.6 1.8l3.42-3.42C18.205 1.19 15.495 0 12.255 0c-4.69 0-8.74 2.7-10.71 6.62l3.98 3.09c.95-2.85 3.6-4.96 6.73-4.96" })
+  return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("svg", { xmlns: "http://www.w3.org/2000/svg", 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__ */ (0, import_jsx_runtime36.jsx)("path", { fill: "#4285F4", d: "M23.745 12.27c0-.79-.07-1.54-.19-2.27h-11.3v4.51h6.47c-.29 1.48-1.14 2.73-2.4 3.58v3h3.86c2.26-2.09 3.56-5.17 3.56-8.82" }),
+    /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("path", { fill: "#34A853", d: "M12.255 24c3.24 0 5.95-1.08 7.93-2.91l-3.86-3c-1.08.72-2.45 1.16-4.07 1.16-3.13 0-5.78-2.11-6.73-4.96h-3.98v3.09C3.515 21.3 7.565 24 12.255 24" }),
+    /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("path", { fill: "#FBBC05", d: "M5.525 14.29c-.25-.72-.38-1.49-.38-2.29s.14-1.57.38-2.29V6.62h-3.98a11.86 11.86 0 0 0 0 10.76z" }),
+    /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("path", { fill: "#EA4335", d: "M12.255 4.75c1.77 0 3.35.61 4.6 1.8l3.42-3.42C18.205 1.19 15.495 0 12.255 0c-4.69 0-8.74 2.7-10.71 6.62l3.98 3.09c.95-2.85 3.6-4.96 6.73-4.96" })
   ] });
 };
 var google_default = SvgGoogle;
 
 // src/theme/default/provider-logos/linkedin.svg
-var React16 = __toESM(require("react"));
-var import_jsx_runtime34 = require("react/jsx-runtime");
+var React17 = __toESM(require("react"));
+var import_jsx_runtime37 = require("react/jsx-runtime");
 var SvgLinkedin = (props) => {
   var _a, _b;
-  return /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("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__ */ (0, import_jsx_runtime34.jsx)("rect", { x: 2, y: 2, fill: "#1275B1", rx: 14 }),
-    /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("path", { fill: "#fff", d: "M12.619 9.692c0 .935-.81 1.692-1.81 1.692C9.81 11.384 9 10.627 9 9.692S9.81 8 10.81 8c.999 0 1.809.758 1.809 1.692M9.247 12.628h3.093V22H9.247zM17.32 12.628h-3.093V22h3.093v-4.795c0-1.107.378-2.22 1.886-2.22 1.705 0 1.695 1.45 1.687 2.572-.01 1.467.014 2.965.014 4.443H24v-4.946c-.026-3.159-.85-4.614-3.557-4.614-1.608 0-2.604.73-3.123 1.39z" })
+  return /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("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__ */ (0, import_jsx_runtime37.jsx)("rect", { x: 2, y: 2, fill: "#1275B1", rx: 14 }),
+    /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("path", { fill: "#fff", d: "M12.619 9.692c0 .935-.81 1.692-1.81 1.692C9.81 11.384 9 10.627 9 9.692S9.81 8 10.81 8c.999 0 1.809.758 1.809 1.692M9.247 12.628h3.093V22H9.247zM17.32 12.628h-3.093V22h3.093v-4.795c0-1.107.378-2.22 1.886-2.22 1.705 0 1.695 1.45 1.687 2.572-.01 1.467.014 2.965.014 4.443H24v-4.946c-.026-3.159-.85-4.614-3.557-4.614-1.608 0-2.604.73-3.123 1.39z" })
   ] });
 };
 var linkedin_default = SvgLinkedin;
 
 // src/theme/default/provider-logos/microsoft.svg
-var React17 = __toESM(require("react"));
-var import_jsx_runtime35 = require("react/jsx-runtime");
+var React18 = __toESM(require("react"));
+var import_jsx_runtime38 = require("react/jsx-runtime");
 var SvgMicrosoft = (props) => {
   var _a, _b;
-  return /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 23 23", 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__ */ (0, import_jsx_runtime35.jsx)("path", { fill: "#F35325", d: "M1 1h10v10H1z" }),
-    /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("path", { fill: "#81BC06", d: "M12 1h10v10H12z" }),
-    /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("path", { fill: "#05A6F0", d: "M1 12h10v10H1z" }),
-    /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("path", { fill: "#FFBA08", d: "M12 12h10v10H12z" })
+  return /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 23 23", 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__ */ (0, import_jsx_runtime38.jsx)("path", { fill: "#F35325", d: "M1 1h10v10H1z" }),
+    /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("path", { fill: "#81BC06", d: "M12 1h10v10H12z" }),
+    /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("path", { fill: "#05A6F0", d: "M1 12h10v10H1z" }),
+    /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("path", { fill: "#FFBA08", d: "M12 12h10v10H12z" })
   ] });
 };
 var microsoft_default = SvgMicrosoft;
 
 // src/theme/default/provider-logos/slack.svg
-var React18 = __toESM(require("react"));
-var import_jsx_runtime36 = require("react/jsx-runtime");
+var React19 = __toESM(require("react"));
+var import_jsx_runtime39 = require("react/jsx-runtime");
 var SvgSlack = (props) => {
   var _a, _b;
-  return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("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__ */ (0, import_jsx_runtime36.jsx)("path", { fill: "#2EB67D", d: "M26.5 15a2.5 2.5 0 1 0-2.5-2.5V15zm-7 0a2.5 2.5 0 0 0 2.5-2.5v-7a2.5 2.5 0 0 0-5 0v7a2.5 2.5 0 0 0 2.5 2.5" }),
-    /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("path", { fill: "#E01E5A", d: "M5.5 17A2.5 2.5 0 1 0 8 19.5V17zm7 0a2.5 2.5 0 0 0-2.5 2.5v7a2.5 2.5 0 0 0 5 0v-7a2.5 2.5 0 0 0-2.5-2.5" }),
-    /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("path", { fill: "#ECB22E", d: "M17 26.5a2.5 2.5 0 1 0 2.5-2.5H17zm0-7a2.5 2.5 0 0 0 2.5 2.5h7a2.5 2.5 0 0 0 0-5h-7a2.5 2.5 0 0 0-2.5 2.5" }),
-    /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("path", { fill: "#36C5F0", d: "M15 5.5A2.5 2.5 0 1 0 12.5 8H15zm0 7a2.5 2.5 0 0 0-2.5-2.5h-7a2.5 2.5 0 0 0 0 5h7a2.5 2.5 0 0 0 2.5-2.5" })
+  return /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("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__ */ (0, import_jsx_runtime39.jsx)("path", { fill: "#2EB67D", d: "M26.5 15a2.5 2.5 0 1 0-2.5-2.5V15zm-7 0a2.5 2.5 0 0 0 2.5-2.5v-7a2.5 2.5 0 0 0-5 0v7a2.5 2.5 0 0 0 2.5 2.5" }),
+    /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("path", { fill: "#E01E5A", d: "M5.5 17A2.5 2.5 0 1 0 8 19.5V17zm7 0a2.5 2.5 0 0 0-2.5 2.5v7a2.5 2.5 0 0 0 5 0v-7a2.5 2.5 0 0 0-2.5-2.5" }),
+    /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("path", { fill: "#ECB22E", d: "M17 26.5a2.5 2.5 0 1 0 2.5-2.5H17zm0-7a2.5 2.5 0 0 0 2.5 2.5h7a2.5 2.5 0 0 0 0-5h-7a2.5 2.5 0 0 0-2.5 2.5" }),
+    /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("path", { fill: "#36C5F0", d: "M15 5.5A2.5 2.5 0 1 0 12.5 8H15zm0 7a2.5 2.5 0 0 0-2.5-2.5h-7a2.5 2.5 0 0 0 0 5h7a2.5 2.5 0 0 0 2.5-2.5" })
   ] });
 };
 var slack_default = SvgSlack;
 
 // src/theme/default/provider-logos/spotify.svg
-var React19 = __toESM(require("react"));
-var import_jsx_runtime37 = require("react/jsx-runtime");
-var SvgSpotify = (props) => {
+var React20 = __toESM(require("react"));
+var import_jsx_runtime40 = require("react/jsx-runtime");
+var SvgSpotify = (props) => {
   var _a, _b;
-  return /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("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__ */ (0, import_jsx_runtime37.jsx)("circle", { cx: 16, cy: 16, r: 14, fill: "#1ED760" }),
-    /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("path", { fill: "#fff", d: "M22.364 21.623c-.239.38-.75.486-1.148.258-3.141-1.822-7.08-2.232-11.736-1.23-.446.091-.893-.167-.988-.592a.786.786 0 0 1 .621-.94c5.087-1.11 9.456-.639 12.964 1.41a.77.77 0 0 1 .287 1.094m1.627-3.461c-.303.47-.941.607-1.435.334-3.588-2.11-9.058-2.718-13.299-1.488-.558.152-1.132-.137-1.292-.653-.16-.531.144-1.078.702-1.23 4.848-1.396 10.875-.728 15.005 1.686.462.273.622.88.319 1.35m.143-3.613c-4.305-2.43-11.4-2.657-15.515-1.473-.654.197-1.355-.152-1.563-.79-.207-.622.176-1.29.83-1.487 4.72-1.366 12.565-1.093 17.508 1.7.59.334.781 1.063.43 1.625-.334.576-1.1.774-1.69.425" })
+  return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("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__ */ (0, import_jsx_runtime40.jsx)("circle", { cx: 16, cy: 16, r: 14, fill: "#1ED760" }),
+    /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("path", { fill: "#fff", d: "M22.364 21.623c-.239.38-.75.486-1.148.258-3.141-1.822-7.08-2.232-11.736-1.23-.446.091-.893-.167-.988-.592a.786.786 0 0 1 .621-.94c5.087-1.11 9.456-.639 12.964 1.41a.77.77 0 0 1 .287 1.094m1.627-3.461c-.303.47-.941.607-1.435.334-3.588-2.11-9.058-2.718-13.299-1.488-.558.152-1.132-.137-1.292-.653-.16-.531.144-1.078.702-1.23 4.848-1.396 10.875-.728 15.005 1.686.462.273.622.88.319 1.35m.143-3.613c-4.305-2.43-11.4-2.657-15.515-1.473-.654.197-1.355-.152-1.563-.79-.207-.622.176-1.29.83-1.487 4.72-1.366 12.565-1.093 17.508 1.7.59.334.781 1.063.43 1.625-.334.576-1.1.774-1.69.425" })
   ] });
 };
 var spotify_default = SvgSpotify;
 
 // src/theme/default/provider-logos/yandex.svg
-var React20 = __toESM(require("react"));
-var import_jsx_runtime38 = require("react/jsx-runtime");
+var React21 = __toESM(require("react"));
+var import_jsx_runtime41 = require("react/jsx-runtime");
 var SvgYandex = (props) => {
   var _a, _b;
-  return /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("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__ */ (0, import_jsx_runtime38.jsx)("circle", { cx: 16, cy: 16, r: 14, fill: "#fff" }),
-    /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("path", { fill: "#FC3F1D", d: "M21 25h-3.143V9.435h-1.402c-2.572 0-3.922 1.294-3.922 3.211 0 2.175.935 3.185 2.857 4.48l1.584 1.063L12.403 25H9l4.104-6.086c-2.363-1.684-3.688-3.316-3.688-6.087C9.416 9.357 11.83 7 16.429 7H21z" })
+  return /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("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__ */ (0, import_jsx_runtime41.jsx)("circle", { cx: 16, cy: 16, r: 14, fill: "#fff" }),
+    /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("path", { fill: "#FC3F1D", d: "M21 25h-3.143V9.435h-1.402c-2.572 0-3.922 1.294-3.922 3.211 0 2.175.935 3.185 2.857 4.48l1.584 1.063L12.403 25H9l4.104-6.086c-2.363-1.684-3.688-3.316-3.688-6.087C9.416 9.357 11.83 7 16.429 7H21z" })
   ] });
 };
 var yandex_default = SvgYandex;
@@ -1263,7 +1446,7 @@ var provider_logos_default = logos;
 
 // src/theme/default/components/form/social.tsx
 var import_react_intl11 = require("react-intl");
-var import_jsx_runtime39 = require("react/jsx-runtime");
+var import_jsx_runtime42 = require("react/jsx-runtime");
 function extractProvider(context) {
   if (context && typeof context === "object" && "provider" in context && typeof context.provider === "string") {
     return context.provider;
@@ -1285,13 +1468,13 @@ function DefaultButtonSocial({
   } = attributes;
   const {
     flow: { ui }
-  } = (0, import_elements_react11.useOryFlow)();
+  } = (0, import_elements_react12.useOryFlow)();
   const intl = (0, import_react_intl11.useIntl)();
   const oidcNodeCount = (_a = ui.nodes.filter((node2) => node2.group === "oidc").length) != null ? _a : 0;
   const Logo = provider_logos_default[attributes.value];
   const showLabel = _showLabel != null ? _showLabel : oidcNodeCount % 3 !== 0 && oidcNodeCount % 4 !== 0;
   const provider = (_c = extractProvider((_b = node.meta.label) == null ? void 0 : _b.context)) != null ? _c : "";
-  return /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(
     "button",
     {
       className: cn(
@@ -1304,14 +1487,14 @@ function DefaultButtonSocial({
       ...props,
       onClick,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("span", { className: "w-5 h-5", children: Logo ? /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("span", { className: "w-5 h-5", children: Logo ? /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
           Logo,
           {
             size: 20,
             className: "object-fill w-full h-full"
           }
-        ) : /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("span", { className: "rounded-full aspect-square border flex items-center justify-center text-xs", children: provider.slice(0, 2) }) }),
-        showLabel && node.meta.label ? /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("span", { className: "text-sm text-left leading-none font-medium text-forms-fg-default flex-grow", children: (0, import_elements_react11.uiTextToFormattedMessage)(node.meta.label, intl) }) : null
+        ) : /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("span", { className: "rounded-full aspect-square border flex items-center justify-center text-xs", children: provider.slice(0, 2) }) }),
+        showLabel && node.meta.label ? /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("span", { className: "text-sm text-left leading-none font-medium text-forms-fg-default flex-grow", children: (0, import_elements_react12.uiTextToFormattedMessage)(node.meta.label, intl) }) : null
       ]
     }
   );
@@ -1320,7 +1503,7 @@ function DefaultSocialButtonContainer({
   children,
   nodes
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
     "div",
     {
       className: cn("grid gap-3", {
@@ -1335,106 +1518,382 @@ function DefaultSocialButtonContainer({
 }
 
 // src/theme/default/components/form/text.tsx
-var import_elements_react12 = require("@ory/elements-react");
+var import_elements_react13 = require("@ory/elements-react");
 var import_react_intl12 = require("react-intl");
-var import_jsx_runtime40 = require("react/jsx-runtime");
+var import_jsx_runtime43 = require("react/jsx-runtime");
 function DefaultText({ node, attributes }) {
   var _a;
   const intl = (0, import_react_intl12.useIntl)();
-  return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(import_jsx_runtime40.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("p", { "data-testid": `node/text/${attributes.id}/label`, children: node.meta.label ? (0, import_elements_react12.uiTextToFormattedMessage)(node.meta.label, intl) : "" }),
-    (_a = attributes.text.context.secrets) == null ? void 0 : _a.map((text, index) => /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("pre", { "data-testid": `node/text/lookup_secret_codes/text`, children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("code", { children: text ? (0, import_elements_react12.uiTextToFormattedMessage)(text, intl) : "" }) }, index))
+  return /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(import_jsx_runtime43.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("p", { "data-testid": `node/text/${attributes.id}/label`, children: node.meta.label ? (0, import_elements_react13.uiTextToFormattedMessage)(node.meta.label, intl) : "" }),
+    (_a = attributes.text.context.secrets) == null ? void 0 : _a.map((text, index) => /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("pre", { "data-testid": `node/text/lookup_secret_codes/text`, children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("code", { children: text ? (0, import_elements_react13.uiTextToFormattedMessage)(text, intl) : "" }) }, index))
   ] });
 }
 
-// src/theme/default/assets/icons/arrow-left.svg
-var React21 = __toESM(require("react"));
-var import_jsx_runtime41 = require("react/jsx-runtime");
-var SvgArrowLeft = (props) => {
+// src/theme/default/components/generic/page-header.tsx
+var import_elements_react15 = require("@ory/elements-react");
+
+// src/theme/default/components/ui/user-menu.tsx
+var import_react_dropdown_menu = require("@radix-ui/react-dropdown-menu");
+var import_react5 = require("react");
+var import_elements_react14 = require("@ory/elements-react");
+
+// src/util/client.ts
+var import_client_fetch10 = require("@ory/client-fetch");
+function frontendClient(sdkUrl, opts = {}) {
+  const config = new import_client_fetch10.Configuration({
+    ...opts,
+    basePath: sdkUrl,
+    headers: {
+      Accept: "application/json",
+      ...opts.headers
+    }
+  });
+  return new import_client_fetch10.FrontendApi(config);
+}
+
+// src/theme/default/assets/icons/logout.svg
+var React22 = __toESM(require("react"));
+var import_jsx_runtime44 = require("react/jsx-runtime");
+var SvgLogout = (props) => {
   var _a, _b;
-  return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("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__ */ (0, import_jsx_runtime41.jsx)("path", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", d: "M5 12.325h14m-14 0 6 6m-6-6 6-6" }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("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__ */ (0, import_jsx_runtime44.jsx)("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 arrow_left_default = SvgArrowLeft;
+var logout_default = SvgLogout;
 
-// src/theme/default/components/card/current-identifier-button.tsx
-var import_jsx_runtime42 = require("react/jsx-runtime");
-function DefaultCurrentIdentifierButton({
-  attributes,
-  onClick,
-  type,
-  href
-}) {
-  const Element = onClick ? "button" : "a";
-  return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(
-    Element,
-    {
-      className: "cursor-pointer py-1.5 px-3 rounded-full border border-button-identifier-border-default bg-button-identifier-bg-default hover:border-button-identifier-border-hover hover:bg-button-identifier-bg-hover transition-colors inline-flex gap-1 items-center",
-      onClick,
-      ...attributes,
-      href,
-      type,
-      children: [
-        /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(arrow_left_default, { size: 16, className: "text-button-identifier-fg-subtle" }),
-        /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("span", { className: "text-sm font-medium leading-none  text-button-identifier-fg-default", children: attributes.value })
-      ]
+// src/theme/default/assets/icons/settings.svg
+var React23 = __toESM(require("react"));
+var import_jsx_runtime45 = require("react/jsx-runtime");
+var SvgSettings = (props) => {
+  var _a, _b;
+  return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("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__ */ (0, import_jsx_runtime45.jsxs)("g", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("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__ */ (0, import_jsx_runtime45.jsx)("path", { d: "M6 8a2 2 0 1 0 4 0 2 2 0 0 0-4 0" })
+  ] }) });
+};
+var settings_default = SvgSettings;
+
+// src/theme/default/utils/user.ts
+var getUserInitials = (session) => {
+  var _a, _b;
+  const avatar = "";
+  let primary = "";
+  let secondary = "";
+  if (!((_a = session == null ? void 0 : session.identity) == null ? void 0 : _a.traits)) {
+    return {
+      primary,
+      secondary,
+      avatar
+    };
+  }
+  const traits = (_b = session.identity) == null ? void 0 : _b.traits;
+  if (traits.email) {
+    secondary = traits.email;
+  }
+  if (traits.name) {
+    if (typeof traits.name === "string") {
+      primary = traits.name;
     }
-  ) });
-}
+    if (traits.name.first && traits.name.last) {
+      primary = traits.name.first + " " + traits.name.last;
+    }
+  }
+  if (primary === "") {
+    primary = secondary;
+    secondary = "";
+  }
+  return {
+    primary,
+    secondary,
+    avatar
+  };
+};
 
-// src/theme/default/components/form/section.tsx
-var import_jsx_runtime43 = require("react/jsx-runtime");
-var DefaultFormSection = ({ children }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { className: "flex flex-col w-80 md:w-[712px] lg:w-[802px] xl:w-[896px]", children });
+// src/theme/default/components/ui/dropdown-menu.tsx
+var import_react3 = require("react");
+var DropdownMenuPrimitive = __toESM(require("@radix-ui/react-dropdown-menu"));
+var import_jsx_runtime46 = require("react/jsx-runtime");
+var DropdownMenu = DropdownMenuPrimitive.Root;
+var DropdownMenuTrigger = DropdownMenuPrimitive.Trigger;
+var DropdownMenuContent = (0, import_react3.forwardRef)(({ className, sideOffset = 16, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(DropdownMenuPrimitive.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
+  DropdownMenuPrimitive.Content,
+  {
+    ref,
+    sideOffset,
+    align: "end",
+    className: cn(
+      "z-50 min-w-[19rem] overflow-hidden data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
+      "border border-dialog-border-default bg-dialog-bg-default rounded-border-radius-cards",
+      className
+    ),
+    ...props
+  }
+) }));
+DropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName;
+var DropdownMenuItem = (0, import_react3.forwardRef)(({ className, inset, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
+  DropdownMenuPrimitive.Item,
+  {
+    ref,
+    className: cn(
+      "relative flex cursor-pointer select-none items-center outline-none transition-colors data-[disabled]:pointer-events-none",
+      "px-8 py-3 lg:py-4.5 text-sm gap-6",
+      "first:border-0 border-t border-button-secondary-border-default hover:border-button-social-border-hover data-[disabled]:border-button-secondary-border-disabled",
+      "text-button-secondary-fg-default bg-button-secondary-bg-default",
+      "hover:text-button-secondary-fg-hover hover:bg-button-secondary-bg-hover",
+      "data-[disabled]:text-button-secondary-fg-disabled data-[disabled]:bg-button-secondary-bg-disabled",
+      inset && "pl-8",
+      className
+    ),
+    ...props
+  }
+));
+DropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName;
+var DropdownMenuLabel = (0, import_react3.forwardRef)(({ className, inset, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
+  DropdownMenuPrimitive.Label,
+  {
+    ref,
+    className: cn(
+      "px-2 py-1.5 text-sm font-semibold",
+      inset && "pl-8",
+      className
+    ),
+    ...props
+  }
+));
+DropdownMenuLabel.displayName = DropdownMenuPrimitive.Label.displayName;
+
+// src/theme/default/components/ui/user-avater.tsx
+var import_react4 = require("react");
+
+// src/theme/default/assets/icons/user.svg
+var React24 = __toESM(require("react"));
+var import_jsx_runtime47 = require("react/jsx-runtime");
+var SvgUser = (props) => {
+  var _a, _b;
+  return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("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__ */ (0, import_jsx_runtime47.jsx)("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 DefaultFormSectionContent = ({
-  title,
-  description,
-  children
-}) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("div", { className: "border rounded-t-xl border-b-0 border-dialog-border-default bg-forms-bg-default px-6 py-8 flex flex-col gap-8", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("div", { className: "flex flex-col gap-2", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("h3", { className: "font-medium text-dialog-fg-default", children: title }),
-      /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("span", { className: "text-sm text-dialog-fg-subtle", children: description })
-    ] }),
-    children
+var user_default = SvgUser;
+
+// src/theme/default/components/ui/user-avater.tsx
+var import_jsx_runtime48 = require("react/jsx-runtime");
+var UserAvatar = (0, import_react4.forwardRef)(
+  ({ initials, ...rest }, ref) => {
+    return /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
+      "button",
+      {
+        ref,
+        className: "size-10 relative flex overflow-hidden items-center justify-center rounded-full bg-button-primary-bg-default disabled:hover:bg-button-primary-bg-default hover:bg-button-primary-bg-hover",
+        ...rest,
+        children: /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("div", { className: "relative size-full flex items-center justify-center", children: initials.avatar ? /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
+          "img",
+          {
+            src: initials.avatar,
+            alt: initials.primary,
+            className: "w-full object-contain"
+          }
+        ) : /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(user_default, { size: 24, className: "text-button-primary-fg-default" }) })
+      }
+    );
+  }
+);
+UserAvatar.displayName = "UserAvatar";
+
+// src/theme/default/components/ui/user-menu.tsx
+var import_jsx_runtime49 = require("react/jsx-runtime");
+var UserMenu = ({ session }) => {
+  const { config } = (0, import_elements_react14.useOryFlow)();
+  const initials = getUserInitials(session);
+  const [logoutFlow, setLogoutFlow] = (0, import_react5.useState)();
+  const fetchLogoutFlow = (0, import_react5.useCallback)(async () => {
+    const flow = await frontendClient(config.sdk.url).createBrowserLogoutFlow();
+    setLogoutFlow(flow);
+  }, [config.sdk.url]);
+  (0, import_react5.useEffect)(() => {
+    void fetchLogoutFlow();
+  }, [fetchLogoutFlow]);
+  return /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(DropdownMenu, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(UserAvatar, { initials }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(DropdownMenuContent, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(import_react_dropdown_menu.DropdownMenuLabel, { className: "px-5 py-4.5 flex gap-3", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(UserAvatar, { disabled: true, initials }),
+        /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)("div", { className: "flex flex-col text-sm leading-tight justify-center", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("div", { className: "text-dialog-fg-default", children: initials.primary }),
+          initials.secondary && /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("div", { className: "text-dialog-fg-mute", children: initials.secondary })
+        ] })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(DropdownMenuItem, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)("a", { href: "/settings", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(settings_default, { size: 16 }),
+        " User settings"
+      ] }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(DropdownMenuItem, { asChild: true, disabled: !(logoutFlow == null ? void 0 : logoutFlow.logout_url), children: /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)("a", { href: logoutFlow == null ? void 0 : logoutFlow.logout_url, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(logout_default, { size: 16 }),
+        " Logout"
+      ] }) })
+    ] })
   ] });
 };
-var DefaultFormSectionFooter = ({ children }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { className: "rounded-b-xl gap-2 flex justify-end px-6 py-4 bg-dialog-bg-subtle border border-dialog-border-default text-sm text-dialog-fg-mute items-center [&>span]:mr-auto min-h-[72px]", children });
+
+// src/theme/default/components/generic/page-header.tsx
+var import_client2 = require("@ory/elements-react/client");
+var import_jsx_runtime50 = require("react/jsx-runtime");
+var DefaultPageHeader = (_props) => {
+  const { Card } = (0, import_elements_react15.useComponents)();
+  const { session } = (0, import_client2.useSession)();
+  return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { className: "flex max-w-[896px] flex-col w-full gap-3 mt-16", children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { className: "flex flex-col gap-12", children: /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "flex gap-2 max-h-10 justify-between flex-1", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { className: "h-10 flex-1 relative", children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(Card.Logo, {}) }),
+    /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(UserMenu, { session })
+  ] }) }) });
 };
 
+// src/theme/default/assets/icons/trash.svg
+var React25 = __toESM(require("react"));
+var import_jsx_runtime51 = require("react/jsx-runtime");
+var SvgTrash = (props) => {
+  var _a, _b;
+  return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("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__ */ (0, import_jsx_runtime51.jsx)("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
+var import_react_hook_form7 = require("react-hook-form");
+var import_jsx_runtime52 = require("react/jsx-runtime");
+function DefaultSettingsOidc({
+  linkButtons,
+  unlinkButtons
+}) {
+  const hasLinkButtons = linkButtons.length > 0;
+  const hasUnlinkButtons = unlinkButtons.length > 0;
+  const { setValue } = (0, import_react_hook_form7.useFormContext)();
+  return /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("div", { className: "flex flex-col gap-8", children: [
+    hasLinkButtons && /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("div", { className: "flex gap-3 items-start [&>button]:w-[79px]", children: linkButtons.map((button) => {
+      const attrs = button.attributes;
+      return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
+        DefaultButtonSocial,
+        {
+          showLabel: false,
+          node: button,
+          attributes: attrs,
+          onClick: () => {
+            setValue("link", attrs.value);
+            setValue("method", "oidc");
+          }
+        },
+        attrs.value
+      );
+    }) }),
+    hasUnlinkButtons && hasLinkButtons ? /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(DefaultHorizontalDivider, {}) : null,
+    unlinkButtons.map((button) => {
+      var _a, _b;
+      const attrs = button.attributes;
+      const provider = (_b = extractProvider((_a = button.meta.label) == null ? void 0 : _a.context)) != null ? _b : "";
+      const Logo = attrs.value in provider_logos_default ? provider_logos_default[attrs.value] : provider_logos_default.generic;
+      return /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("div", { className: "flex justify-between", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("div", { className: "flex gap-6 items-center", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(Logo, { size: 32 }),
+          /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("p", { className: "text-dialog-fg-subtle text-sm font-medium", children: provider })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
+          "button",
+          {
+            ...attrs,
+            type: "submit",
+            onClick: () => {
+              setValue("unlink", attrs.value);
+              setValue("method", "oidc");
+            },
+            children: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(trash_default, { className: "cursor-pointer text-links-link-mute-default hover:text-links-link-mute-hover" })
+          }
+        )
+      ] }, attrs.value);
+    })
+  ] });
+}
+
+// src/theme/default/components/settings/settings-passkey.tsx
+var import_jsx_runtime53 = require("react/jsx-runtime");
+function DefaultSettingsPasskey({
+  triggerButton,
+  removeButtons
+}) {
+  const hasRemoveButtons = removeButtons.length > 0;
+  return /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { className: "flex flex-col gap-8", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("div", { className: "flex gap-3 items-end max-w-[60%]", children: triggerButton ? /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
+      DefaultButton,
+      {
+        node: triggerButton,
+        attributes: triggerButton.attributes,
+        onClick: triggerButton.onClick
+      }
+    ) : null }),
+    hasRemoveButtons ? /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { className: "flex flex-col gap-8", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(DefaultHorizontalDivider, {}),
+      /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("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;
+        const diaplyName = "display_name" in context ? context.display_name : null;
+        const keyId = "value" in node.attributes ? node.attributes.value : null;
+        return /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(
+          "div",
+          {
+            className: "flex justify-between gap-6",
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(passkey_default, { size: 32, className: "text-dialog-fg-default" }),
+              /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { className: "flex-1 flex-col", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("p", { className: "text-sm font-medium text-dialog-fg-subtle", children: diaplyName }),
+                /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("span", { className: "text-sm text-dialog-fg-mute", children: keyId })
+              ] }),
+              addedAt && /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("p", { className: "text-sm self-center text-dialog-fg-mute", children: new Date(addedAt).toLocaleDateString() }),
+              /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
+                "button",
+                {
+                  ...node.attributes,
+                  type: "submit",
+                  className: "cursor-pointer text-links-link-mute-default hover:text-links-link-mute-hover",
+                  children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(trash_default, { size: 20 })
+                }
+              )
+            ]
+          },
+          `webauthn-remove-button-${i}`
+        );
+      }) })
+    ] }) : null
+  ] });
+}
+
 // src/theme/default/assets/icons/download.svg
-var React22 = __toESM(require("react"));
-var import_jsx_runtime44 = require("react/jsx-runtime");
+var React26 = __toESM(require("react"));
+var import_jsx_runtime54 = require("react/jsx-runtime");
 var SvgDownload = (props) => {
   var _a, _b;
-  return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("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__ */ (0, import_jsx_runtime44.jsx)("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__ */ (0, import_jsx_runtime54.jsx)("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__ */ (0, import_jsx_runtime54.jsx)("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/eye.svg
-var React23 = __toESM(require("react"));
-var import_jsx_runtime45 = require("react/jsx-runtime");
+var React27 = __toESM(require("react"));
+var import_jsx_runtime55 = require("react/jsx-runtime");
 var SvgEye = (props) => {
   var _a, _b;
-  return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("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__ */ (0, import_jsx_runtime45.jsxs)("g", { strokeLinecap: "round", strokeLinejoin: "round", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("path", { stroke: "currentColor", d: "M10 12a2 2 0 1 0 4 0 2 2 0 0 0-4 0" }),
-    /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("path", { stroke: "#64748B", d: "M21 12q-3.6 6-9 6t-9-6q3.6-6 9-6t9 6" })
+  return /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("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__ */ (0, import_jsx_runtime55.jsxs)("g", { strokeLinecap: "round", strokeLinejoin: "round", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("path", { stroke: "currentColor", d: "M10 12a2 2 0 1 0 4 0 2 2 0 0 0-4 0" }),
+    /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("path", { stroke: "#64748B", d: "M21 12q-3.6 6-9 6t-9-6q3.6-6 9-6t9 6" })
   ] }) });
 };
 var eye_default = SvgEye;
 
 // src/theme/default/assets/icons/refresh.svg
-var React24 = __toESM(require("react"));
-var import_jsx_runtime46 = require("react/jsx-runtime");
+var React28 = __toESM(require("react"));
+var import_jsx_runtime56 = require("react/jsx-runtime");
 var SvgRefresh = (props) => {
   var _a, _b;
-  return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("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__ */ (0, import_jsx_runtime46.jsx)("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__ */ (0, import_jsx_runtime56.jsx)("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__ */ (0, import_jsx_runtime56.jsx)("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
-var import_jsx_runtime47 = require("react/jsx-runtime");
+var import_jsx_runtime57 = require("react/jsx-runtime");
 function DefaultSettingsRecoveryCodes({
   codes,
   regnerateButton,
@@ -1451,15 +1910,15 @@ function DefaultSettingsRecoveryCodes({
     element.click();
   };
   const hasCodes = codes.length >= 1;
-  return /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("div", { className: "flex flex-col gap-8", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(DefaultHorizontalDivider, {}),
-    /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("div", { className: "flex justify-end gap-4", children: [
-      regnerateButton && /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { className: "flex flex-col gap-8", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(DefaultHorizontalDivider, {}),
+    /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { className: "flex justify-end gap-4", children: [
+      regnerateButton && /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
         "button",
         {
           ...regnerateButton.attributes,
           type: "submit",
-          children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
+          children: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
             refresh_default,
             {
               size: 24,
@@ -1468,12 +1927,12 @@ function DefaultSettingsRecoveryCodes({
           )
         }
       ),
-      revealButton && /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
+      revealButton && /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
         "button",
         {
           ...revealButton.attributes,
           type: "submit",
-          children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
+          children: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
             eye_default,
             {
               size: 24,
@@ -1482,7 +1941,7 @@ function DefaultSettingsRecoveryCodes({
           )
         }
       ),
-      hasCodes ? /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
+      hasCodes ? /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
         download_default,
         {
           size: 24,
@@ -1491,30 +1950,21 @@ function DefaultSettingsRecoveryCodes({
         }
       ) : null
     ] }),
-    hasCodes ? /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("div", { className: "rounded-border-radius-cards bg-bg-default ring-1 ring-dialog-border-default p-6", children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("div", { className: "grid grid-cols-6 gap-4 flex-wrap text-dialog-fg-default text-sm", children: codes.map((code) => /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("p", { children: code }, code)) }) }) : null
+    hasCodes ? /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: "rounded-border-radius-cards bg-bg-default ring-1 ring-dialog-border-default p-6", children: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: "grid grid-cols-6 gap-4 flex-wrap text-dialog-fg-default text-sm", children: codes.map((code) => /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("p", { children: code }, code)) }) }) : null
   ] });
 }
 
 // src/theme/default/assets/icons/qrcode.svg
-var React25 = __toESM(require("react"));
-var import_jsx_runtime48 = require("react/jsx-runtime");
+var React29 = __toESM(require("react"));
+var import_jsx_runtime58 = require("react/jsx-runtime");
 var SvgQrcode = (props) => {
   var _a, _b;
-  return /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("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__ */ (0, import_jsx_runtime48.jsx)("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__ */ (0, import_jsx_runtime58.jsx)("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__ */ (0, import_jsx_runtime58.jsx)("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/assets/icons/trash.svg
-var React26 = __toESM(require("react"));
-var import_jsx_runtime49 = require("react/jsx-runtime");
-var SvgTrash = (props) => {
-  var _a, _b;
-  return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("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__ */ (0, import_jsx_runtime49.jsx)("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-top.tsx
-var import_jsx_runtime50 = require("react/jsx-runtime");
+var import_jsx_runtime59 = require("react/jsx-runtime");
 function DefaultSettingsTotp(props) {
   var _a;
   if ("totpUnlink" in props && props.totpUnlink) {
@@ -1525,17 +1975,17 @@ function DefaultSettingsTotp(props) {
       node_type: _ignoredNodeType,
       ...buttonAttrs
     } = (_a = props.totpUnlink) == null ? void 0 : _a.attributes;
-    return /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-8", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { className: "col-span-full", children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(DefaultHorizontalDivider, {}) }),
-      /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "flex gap-6 items-center col-span-full", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { className: "size-8 aspect-square ", children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(qrcode_default, { size: 32 }) }),
-        /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { className: "flex flex-col mr-auto", children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("p", { className: "text-dialog-fg-subtle text-sm font-medium", children: "Authenticator app" }) }),
-        /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-8", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("div", { className: "col-span-full", children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(DefaultHorizontalDivider, {}) }),
+      /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)("div", { className: "flex gap-6 items-center col-span-full", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("div", { className: "size-8 aspect-square ", children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(qrcode_default, { size: 32 }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("div", { className: "flex flex-col mr-auto", children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("p", { className: "text-dialog-fg-subtle text-sm font-medium", children: "Authenticator app" }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
           "button",
           {
             type: type === "button" ? "button" : "submit",
             ...buttonAttrs,
-            children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
+            children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
               trash_default,
               {
                 size: 24,
@@ -1548,9 +1998,9 @@ function DefaultSettingsTotp(props) {
     ] });
   }
   if ("totpSecret" in props) {
-    return /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-8", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { className: "col-span-full", children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(DefaultHorizontalDivider, {}) }),
-      /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { className: "bg-dialog-bg-subtle p-8 rounded-xl flex justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { className: "h-44 aspect-square bg-[white] rounded", children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { className: "mix-blend-multiply -m-3 antialiased", children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-8", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("div", { className: "col-span-full", children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(DefaultHorizontalDivider, {}) }),
+      /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("div", { className: "bg-dialog-bg-subtle p-8 rounded-xl flex justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("div", { className: "h-44 aspect-square bg-[white] rounded", children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("div", { className: "mix-blend-multiply -m-3 antialiased", children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
         DefaultImage,
         {
           node: props.totpImage,
@@ -1559,13 +2009,13 @@ function DefaultSettingsTotp(props) {
           }
         }
       ) }) }) }),
-      /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "flex flex-col gap-6", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)("div", { className: "flex flex-col gap-6", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
           DefaultLabel,
           {
             node: props.totpSecret,
             attributes: props.totpSecret.attributes,
-            children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
+            children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
               DefaultInput,
               {
                 node: props.totpSecret,
@@ -1580,12 +2030,12 @@ function DefaultSettingsTotp(props) {
             )
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
           DefaultLabel,
           {
             attributes: props.totpInput.attributes,
             node: props.totpInput,
-            children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
+            children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
               DefaultInput,
               {
                 node: props.totpInput,
@@ -1594,187 +2044,79 @@ function DefaultSettingsTotp(props) {
             )
           }
         )
-      ] })
-    ] });
-  }
-}
-
-// src/theme/default/components/settings/settings-oidc.tsx
-var import_react_hook_form5 = require("react-hook-form");
-var import_jsx_runtime51 = require("react/jsx-runtime");
-function DefaultSettingsOidc({
-  linkButtons,
-  unlinkButtons
-}) {
-  const hasLinkButtons = linkButtons.length > 0;
-  const hasUnlinkButtons = unlinkButtons.length > 0;
-  const { setValue } = (0, import_react_hook_form5.useFormContext)();
-  return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("div", { className: "flex flex-col gap-8", children: [
-    hasLinkButtons && /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("div", { className: "flex gap-3 items-start [&>button]:w-[79px]", children: linkButtons.map((button) => {
-      const attrs = button.attributes;
-      return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
-        DefaultButtonSocial,
-        {
-          showLabel: false,
-          node: button,
-          attributes: attrs,
-          onClick: () => {
-            setValue("link", attrs.value);
-            setValue("method", "oidc");
-          }
-        },
-        attrs.value
-      );
-    }) }),
-    hasUnlinkButtons && hasLinkButtons ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(DefaultHorizontalDivider, {}) : null,
-    unlinkButtons.map((button) => {
-      var _a, _b;
-      const attrs = button.attributes;
-      const provider = (_b = extractProvider((_a = button.meta.label) == null ? void 0 : _a.context)) != null ? _b : "";
-      const Logo = attrs.value in provider_logos_default ? provider_logos_default[attrs.value] : provider_logos_default.generic;
-      return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("div", { className: "flex justify-between", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("div", { className: "flex gap-6 items-center", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(Logo, { size: 32 }),
-          /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("p", { className: "text-dialog-fg-subtle text-sm font-medium", children: provider })
-        ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
-          "button",
-          {
-            ...attrs,
-            type: "submit",
-            onClick: () => {
-              setValue("unlink", attrs.value);
-              setValue("method", "oidc");
-            },
-            children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(trash_default, { className: "cursor-pointer text-links-link-mute-default hover:text-links-link-mute-hover" })
-          }
-        )
-      ] }, attrs.value);
-    })
-  ] });
-}
-
-// src/theme/default/assets/icons/key.svg
-var React27 = __toESM(require("react"));
-var import_jsx_runtime52 = require("react/jsx-runtime");
-var SvgKey = (props) => {
-  var _a, _b;
-  return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("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__ */ (0, import_jsx_runtime52.jsx)("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
-var import_jsx_runtime53 = require("react/jsx-runtime");
-function DefaultSettingsWebauthn({
-  nameInput,
-  triggerButton,
-  removeButtons
-}) {
-  const hasRemoveButtons = removeButtons.length > 0;
-  return /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { className: "flex flex-col gap-8", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { className: "flex gap-3 items-end max-w-[60%]", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("div", { className: "flex-1", children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
-        DefaultLabel,
-        {
-          node: nameInput,
-          attributes: nameInput.attributes,
-          children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
-            DefaultInput,
-            {
-              node: nameInput,
-              attributes: nameInput.attributes
-            }
-          )
-        }
-      ) }),
-      triggerButton ? /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
-        DefaultButton,
-        {
-          node: triggerButton,
-          attributes: triggerButton.attributes,
-          onClick: triggerButton.onClick
-        }
-      ) : null
-    ] }),
-    hasRemoveButtons ? /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { className: "flex flex-col gap-8", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(DefaultHorizontalDivider, {}),
-      /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("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;
-        const diaplyName = "display_name" in context ? context.display_name : null;
-        const keyId = "value" in node.attributes ? node.attributes.value : null;
-        return /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(
-          "div",
-          {
-            className: "flex justify-between gap-6",
-            children: [
-              /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(key_default, { size: 32, className: "text-dialog-fg-default" }),
-              /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { className: "flex-1 flex-col", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("p", { className: "text-sm font-medium text-dialog-fg-subtle", children: diaplyName }),
-                /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("span", { className: "text-sm text-dialog-fg-mute", children: keyId })
-              ] }),
-              addedAt && /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("p", { className: "text-sm self-center text-dialog-fg-mute", children: new Date(addedAt).toLocaleDateString() }),
-              /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
-                "button",
-                {
-                  ...node.attributes,
-                  type: "submit",
-                  className: "cursor-pointer text-links-link-mute-default hover:text-links-link-mute-hover",
-                  children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(trash_default, { size: 20 })
-                }
-              )
-            ]
-          },
-          `webauthn-remove-button-${i}`
-        );
-      }) })
-    ] }) : null
-  ] });
+      ] })
+    ] });
+  }
 }
 
-// src/theme/default/components/settings/settings-passkey.tsx
-var import_jsx_runtime54 = require("react/jsx-runtime");
-function DefaultSettingsPasskey({
+// src/theme/default/assets/icons/key.svg
+var React30 = __toESM(require("react"));
+var import_jsx_runtime60 = require("react/jsx-runtime");
+var SvgKey = (props) => {
+  var _a, _b;
+  return /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("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__ */ (0, import_jsx_runtime60.jsx)("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
+var import_jsx_runtime61 = require("react/jsx-runtime");
+function DefaultSettingsWebauthn({
+  nameInput,
   triggerButton,
   removeButtons
 }) {
   const hasRemoveButtons = removeButtons.length > 0;
-  return /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { className: "flex flex-col gap-8", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("div", { className: "flex gap-3 items-end max-w-[60%]", children: triggerButton ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
-      DefaultButton,
-      {
-        node: triggerButton,
-        attributes: triggerButton.attributes,
-        onClick: triggerButton.onClick
-      }
-    ) : null }),
-    hasRemoveButtons ? /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { className: "flex flex-col gap-8", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(DefaultHorizontalDivider, {}),
-      /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("div", { className: "flex flex-col gap-2", children: removeButtons.map((node, i) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)("div", { className: "flex flex-col gap-8", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)("div", { className: "flex gap-3 items-end max-w-[60%]", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("div", { className: "flex-1", children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
+        DefaultLabel,
+        {
+          node: nameInput,
+          attributes: nameInput.attributes,
+          children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
+            DefaultInput,
+            {
+              node: nameInput,
+              attributes: nameInput.attributes
+            }
+          )
+        }
+      ) }),
+      triggerButton ? /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
+        DefaultButton,
+        {
+          node: triggerButton,
+          attributes: triggerButton.attributes,
+          onClick: triggerButton.onClick
+        }
+      ) : null
+    ] }),
+    hasRemoveButtons ? /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)("div", { className: "flex flex-col gap-8", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(DefaultHorizontalDivider, {}),
+      /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("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;
         const diaplyName = "display_name" in context ? context.display_name : null;
         const keyId = "value" in node.attributes ? node.attributes.value : null;
-        return /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(
+        return /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)(
           "div",
           {
             className: "flex justify-between gap-6",
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(passkey_default, { size: 32, className: "text-dialog-fg-default" }),
-              /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { className: "flex-1 flex-col", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("p", { className: "text-sm font-medium text-dialog-fg-subtle", children: diaplyName }),
-                /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("span", { className: "text-sm text-dialog-fg-mute", children: keyId })
+              /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(key_default, { size: 32, className: "text-dialog-fg-default" }),
+              /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)("div", { className: "flex-1 flex-col", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("p", { className: "text-sm font-medium text-dialog-fg-subtle", children: diaplyName }),
+                /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("span", { className: "text-sm text-dialog-fg-mute", children: keyId })
               ] }),
-              addedAt && /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("p", { className: "text-sm self-center text-dialog-fg-mute", children: new Date(addedAt).toLocaleDateString() }),
-              /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
+              addedAt && /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("p", { className: "text-sm self-center text-dialog-fg-mute", children: new Date(addedAt).toLocaleDateString() }),
+              /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
                 "button",
                 {
                   ...node.attributes,
                   type: "submit",
                   className: "cursor-pointer text-links-link-mute-default hover:text-links-link-mute-hover",
-                  children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(trash_default, { size: 20 })
+                  children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(trash_default, { size: 20 })
                 }
               )
             ]
@@ -1786,224 +2128,9 @@ function DefaultSettingsPasskey({
   ] });
 }
 
-// src/theme/default/components/generic/page-header.tsx
-var import_elements_react14 = require("@ory/elements-react");
-
-// src/theme/default/components/ui/user-menu.tsx
-var import_react_dropdown_menu = require("@radix-ui/react-dropdown-menu");
-var import_react5 = require("react");
-var import_elements_react13 = require("@ory/elements-react");
-
-// src/util/client.ts
-var import_client_fetch9 = require("@ory/client-fetch");
-function frontendClient(sdkUrl, opts = {}) {
-  const config = new import_client_fetch9.Configuration({
-    ...opts,
-    basePath: sdkUrl,
-    headers: {
-      Accept: "application/json",
-      ...opts.headers
-    }
-  });
-  return new import_client_fetch9.FrontendApi(config);
-}
-
-// src/theme/default/assets/icons/logout.svg
-var React28 = __toESM(require("react"));
-var import_jsx_runtime55 = require("react/jsx-runtime");
-var SvgLogout = (props) => {
-  var _a, _b;
-  return /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("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__ */ (0, import_jsx_runtime55.jsx)("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
-var React29 = __toESM(require("react"));
-var import_jsx_runtime56 = require("react/jsx-runtime");
-var SvgSettings = (props) => {
-  var _a, _b;
-  return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("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__ */ (0, import_jsx_runtime56.jsxs)("g", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("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__ */ (0, import_jsx_runtime56.jsx)("path", { d: "M6 8a2 2 0 1 0 4 0 2 2 0 0 0-4 0" })
-  ] }) });
-};
-var settings_default = SvgSettings;
-
-// src/theme/default/utils/user.ts
-var getUserInitials = (session) => {
-  var _a, _b;
-  const avatar = "";
-  let primary = "";
-  let secondary = "";
-  if (!((_a = session == null ? void 0 : session.identity) == null ? void 0 : _a.traits)) {
-    return {
-      primary,
-      secondary,
-      avatar
-    };
-  }
-  const traits = (_b = session.identity) == null ? void 0 : _b.traits;
-  if (traits.email) {
-    secondary = traits.email;
-  }
-  if (traits.name) {
-    if (typeof traits.name === "string") {
-      primary = traits.name;
-    }
-    if (traits.name.first && traits.name.last) {
-      primary = traits.name.first + " " + traits.name.last;
-    }
-  }
-  if (primary === "") {
-    primary = secondary;
-    secondary = "";
-  }
-  return {
-    primary,
-    secondary,
-    avatar
-  };
-};
-
-// src/theme/default/components/ui/dropdown-menu.tsx
-var import_react3 = require("react");
-var DropdownMenuPrimitive = __toESM(require("@radix-ui/react-dropdown-menu"));
-var import_jsx_runtime57 = require("react/jsx-runtime");
-var DropdownMenu = DropdownMenuPrimitive.Root;
-var DropdownMenuTrigger = DropdownMenuPrimitive.Trigger;
-var DropdownMenuContent = (0, import_react3.forwardRef)(({ className, sideOffset = 16, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(DropdownMenuPrimitive.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
-  DropdownMenuPrimitive.Content,
-  {
-    ref,
-    sideOffset,
-    align: "end",
-    className: cn(
-      "z-50 min-w-[19rem] overflow-hidden data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
-      "border border-dialog-border-default bg-dialog-bg-default rounded-border-radius-cards",
-      className
-    ),
-    ...props
-  }
-) }));
-DropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName;
-var DropdownMenuItem = (0, import_react3.forwardRef)(({ className, inset, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
-  DropdownMenuPrimitive.Item,
-  {
-    ref,
-    className: cn(
-      "relative flex cursor-pointer select-none items-center outline-none transition-colors data-[disabled]:pointer-events-none",
-      "px-8 py-3 lg:py-4.5 text-sm gap-6",
-      "first:border-0 border-t border-button-secondary-border-default hover:border-button-social-border-hover data-[disabled]:border-button-secondary-border-disabled",
-      "text-button-secondary-fg-default bg-button-secondary-bg-default",
-      "hover:text-button-secondary-fg-hover hover:bg-button-secondary-bg-hover",
-      "data-[disabled]:text-button-secondary-fg-disabled data-[disabled]:bg-button-secondary-bg-disabled",
-      inset && "pl-8",
-      className
-    ),
-    ...props
-  }
-));
-DropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName;
-var DropdownMenuLabel = (0, import_react3.forwardRef)(({ className, inset, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
-  DropdownMenuPrimitive.Label,
-  {
-    ref,
-    className: cn(
-      "px-2 py-1.5 text-sm font-semibold",
-      inset && "pl-8",
-      className
-    ),
-    ...props
-  }
-));
-DropdownMenuLabel.displayName = DropdownMenuPrimitive.Label.displayName;
-
-// src/theme/default/components/ui/user-avater.tsx
-var import_react4 = require("react");
-
-// src/theme/default/assets/icons/user.svg
-var React30 = __toESM(require("react"));
-var import_jsx_runtime58 = require("react/jsx-runtime");
-var SvgUser = (props) => {
-  var _a, _b;
-  return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)("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__ */ (0, import_jsx_runtime58.jsx)("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
-var import_jsx_runtime59 = require("react/jsx-runtime");
-var UserAvatar = (0, import_react4.forwardRef)(
-  ({ initials, ...rest }, ref) => {
-    return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
-      "button",
-      {
-        ref,
-        className: "size-10 relative flex overflow-hidden items-center justify-center rounded-full bg-button-primary-bg-default disabled:hover:bg-button-primary-bg-default hover:bg-button-primary-bg-hover",
-        ...rest,
-        children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("div", { className: "relative size-full flex items-center justify-center", children: initials.avatar ? /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
-          "img",
-          {
-            src: initials.avatar,
-            alt: initials.primary,
-            className: "w-full object-contain"
-          }
-        ) : /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(user_default, { size: 24, className: "text-button-primary-fg-default" }) })
-      }
-    );
-  }
-);
-UserAvatar.displayName = "UserAvatar";
-
-// src/theme/default/components/ui/user-menu.tsx
-var import_jsx_runtime60 = require("react/jsx-runtime");
-var UserMenu = ({ session }) => {
-  const { config } = (0, import_elements_react13.useOryFlow)();
-  const initials = getUserInitials(session);
-  const [logoutFlow, setLogoutFlow] = (0, import_react5.useState)();
-  const fetchLogoutFlow = (0, import_react5.useCallback)(async () => {
-    const flow = await frontendClient(config.sdk.url).createBrowserLogoutFlow();
-    setLogoutFlow(flow);
-  }, [config.sdk.url]);
-  (0, import_react5.useEffect)(() => {
-    void fetchLogoutFlow();
-  }, [fetchLogoutFlow]);
-  return /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(DropdownMenu, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(UserAvatar, { initials }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(DropdownMenuContent, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(import_react_dropdown_menu.DropdownMenuLabel, { className: "px-5 py-4.5 flex gap-3", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(UserAvatar, { disabled: true, initials }),
-        /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("div", { className: "flex flex-col text-sm leading-tight justify-center", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("div", { className: "text-dialog-fg-default", children: initials.primary }),
-          initials.secondary && /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("div", { className: "text-dialog-fg-mute", children: initials.secondary })
-        ] })
-      ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(DropdownMenuItem, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("a", { href: "/settings", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(settings_default, { size: 16 }),
-        " User settings"
-      ] }) }),
-      /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(DropdownMenuItem, { asChild: true, disabled: !(logoutFlow == null ? void 0 : logoutFlow.logout_url), children: /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("a", { href: logoutFlow == null ? void 0 : logoutFlow.logout_url, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(logout_default, { size: 16 }),
-        " Logout"
-      ] }) })
-    ] })
-  ] });
-};
-
-// src/theme/default/components/generic/page-header.tsx
-var import_client2 = require("@ory/elements-react/client");
-var import_jsx_runtime61 = require("react/jsx-runtime");
-var DefaultPageHeader = (_props) => {
-  const { Card } = (0, import_elements_react14.useComponents)();
-  const { session } = (0, import_client2.useSession)();
-  return /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("div", { className: "flex max-w-[896px] flex-col w-full gap-3 mt-16", children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("div", { className: "flex flex-col gap-12", children: /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)("div", { className: "flex gap-2 max-h-10 justify-between flex-1", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("div", { className: "h-10 flex-1 relative", children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(Card.Logo, {}) }),
-    /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(UserMenu, { session })
-  ] }) }) });
-};
-
 // src/theme/default/components/default-components.tsx
 function getOryComponents(overrides) {
-  var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _A, _B, _C, _D, _E, _F, _G, _H, _I, _J, _K, _L, _M, _N, _O, _P, _Q, _R, _S, _T, _U, _V, _W, _X, _Y, _Z, __, _$, _aa, _ba, _ca, _da, _ea, _fa, _ga, _ha;
+  var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _A, _B, _C, _D, _E, _F, _G, _H, _I, _J, _K, _L, _M, _N, _O, _P, _Q, _R, _S, _T, _U, _V, _W, _X, _Y, _Z, __, _$, _aa, _ba, _ca, _da, _ea, _fa;
   return {
     Card: {
       Root: (_b = (_a = overrides == null ? void 0 : overrides.Card) == null ? void 0 : _a.Root) != null ? _b : DefaultCard,
@@ -2020,31 +2147,30 @@ function getOryComponents(overrides) {
     Node: {
       Button: (_v = (_u = overrides == null ? void 0 : overrides.Node) == null ? void 0 : _u.Button) != null ? _v : DefaultButton,
       OidcButton: (_x = (_w = overrides == null ? void 0 : overrides.Node) == null ? void 0 : _w.OidcButton) != null ? _x : DefaultButtonSocial,
-      CurrentIdentifierButton: (_z = (_y = overrides == null ? void 0 : overrides.Node) == null ? void 0 : _y.CurrentIdentifierButton) != null ? _z : DefaultCurrentIdentifierButton,
-      Input: (_B = (_A = overrides == null ? void 0 : overrides.Node) == null ? void 0 : _A.Input) != null ? _B : DefaultInput,
-      CodeInput: (_D = (_C = overrides == null ? void 0 : overrides.Node) == null ? void 0 : _C.CodeInput) != null ? _D : DefaultPinCodeInput,
-      Image: (_F = (_E = overrides == null ? void 0 : overrides.Node) == null ? void 0 : _E.Image) != null ? _F : DefaultImage,
-      Label: (_H = (_G = overrides == null ? void 0 : overrides.Node) == null ? void 0 : _G.Label) != null ? _H : DefaultLabel,
-      Checkbox: (_J = (_I = overrides == null ? void 0 : overrides.Node) == null ? void 0 : _I.Checkbox) != null ? _J : DefaultCheckbox,
-      Text: (_L = (_K = overrides == null ? void 0 : overrides.Node) == null ? void 0 : _K.Text) != null ? _L : DefaultText,
-      Anchor: (_N = (_M = overrides == null ? void 0 : overrides.Node) == null ? void 0 : _M.Anchor) != null ? _N : DefaultLinkButton
+      Input: (_z = (_y = overrides == null ? void 0 : overrides.Node) == null ? void 0 : _y.Input) != null ? _z : DefaultInput,
+      CodeInput: (_B = (_A = overrides == null ? void 0 : overrides.Node) == null ? void 0 : _A.CodeInput) != null ? _B : DefaultPinCodeInput,
+      Image: (_D = (_C = overrides == null ? void 0 : overrides.Node) == null ? void 0 : _C.Image) != null ? _D : DefaultImage,
+      Label: (_F = (_E = overrides == null ? void 0 : overrides.Node) == null ? void 0 : _E.Label) != null ? _F : DefaultLabel,
+      Checkbox: (_H = (_G = overrides == null ? void 0 : overrides.Node) == null ? void 0 : _G.Checkbox) != null ? _H : DefaultCheckbox,
+      Text: (_J = (_I = overrides == null ? void 0 : overrides.Node) == null ? void 0 : _I.Text) != null ? _J : DefaultText,
+      Anchor: (_L = (_K = overrides == null ? void 0 : overrides.Node) == null ? void 0 : _K.Anchor) != null ? _L : DefaultLinkButton
     },
     Form: {
-      Root: (_P = (_O = overrides == null ? void 0 : overrides.Form) == null ? void 0 : _O.Root) != null ? _P : DefaultFormContainer,
-      Group: (_R = (_Q = overrides == null ? void 0 : overrides.Form) == null ? void 0 : _Q.Group) != null ? _R : DefaultGroupContainer,
-      OidcRoot: (_T = (_S = overrides == null ? void 0 : overrides.Form) == null ? void 0 : _S.OidcRoot) != null ? _T : DefaultSocialButtonContainer,
-      RecoveryCodesSettings: (_V = (_U = overrides == null ? void 0 : overrides.Form) == null ? void 0 : _U.RecoveryCodesSettings) != null ? _V : DefaultSettingsRecoveryCodes,
-      TotpSettings: (_X = (_W = overrides == null ? void 0 : overrides.Form) == null ? void 0 : _W.TotpSettings) != null ? _X : DefaultSettingsTotp,
-      OidcSettings: (_Z = (_Y = overrides == null ? void 0 : overrides.Form) == null ? void 0 : _Y.OidcSettings) != null ? _Z : DefaultSettingsOidc,
-      WebauthnSettings: (_$ = (__ = overrides == null ? void 0 : overrides.Form) == null ? void 0 : __.WebauthnSettings) != null ? _$ : DefaultSettingsWebauthn,
-      PasskeySettings: (_ba = (_aa = overrides == null ? void 0 : overrides.Form) == null ? void 0 : _aa.PasskeySettings) != null ? _ba : DefaultSettingsPasskey
+      Root: (_N = (_M = overrides == null ? void 0 : overrides.Form) == null ? void 0 : _M.Root) != null ? _N : DefaultFormContainer,
+      Group: (_P = (_O = overrides == null ? void 0 : overrides.Form) == null ? void 0 : _O.Group) != null ? _P : DefaultGroupContainer,
+      OidcRoot: (_R = (_Q = overrides == null ? void 0 : overrides.Form) == null ? void 0 : _Q.OidcRoot) != null ? _R : DefaultSocialButtonContainer,
+      RecoveryCodesSettings: (_T = (_S = overrides == null ? void 0 : overrides.Form) == null ? void 0 : _S.RecoveryCodesSettings) != null ? _T : DefaultSettingsRecoveryCodes,
+      TotpSettings: (_V = (_U = overrides == null ? void 0 : overrides.Form) == null ? void 0 : _U.TotpSettings) != null ? _V : DefaultSettingsTotp,
+      OidcSettings: (_X = (_W = overrides == null ? void 0 : overrides.Form) == null ? void 0 : _W.OidcSettings) != null ? _X : DefaultSettingsOidc,
+      WebauthnSettings: (_Z = (_Y = overrides == null ? void 0 : overrides.Form) == null ? void 0 : _Y.WebauthnSettings) != null ? _Z : DefaultSettingsWebauthn,
+      PasskeySettings: (_$ = (__ = overrides == null ? void 0 : overrides.Form) == null ? void 0 : __.PasskeySettings) != null ? _$ : DefaultSettingsPasskey
     },
     Message: {
-      Root: (_da = (_ca = overrides == null ? void 0 : overrides.Message) == null ? void 0 : _ca.Root) != null ? _da : DefaultMessageContainer,
-      Content: (_fa = (_ea = overrides == null ? void 0 : overrides.Message) == null ? void 0 : _ea.Content) != null ? _fa : DefaultMessage
+      Root: (_ba = (_aa = overrides == null ? void 0 : overrides.Message) == null ? void 0 : _aa.Root) != null ? _ba : DefaultMessageContainer,
+      Content: (_da = (_ca = overrides == null ? void 0 : overrides.Message) == null ? void 0 : _ca.Content) != null ? _da : DefaultMessage
     },
     Page: {
-      Header: (_ha = (_ga = overrides == null ? void 0 : overrides.Page) == null ? void 0 : _ga.Header) != null ? _ha : DefaultPageHeader
+      Header: (_fa = (_ea = overrides == null ? void 0 : overrides.Page) == null ? void 0 : _ea.Header) != null ? _fa : DefaultPageHeader
     }
   };
 }
@@ -2059,8 +2185,8 @@ function Error2({
 }
 
 // src/theme/default/flows/login.tsx
-var import_client_fetch10 = require("@ory/client-fetch");
-var import_elements_react15 = require("@ory/elements-react");
+var import_client_fetch11 = require("@ory/client-fetch");
+var import_elements_react16 = require("@ory/elements-react");
 var import_jsx_runtime63 = require("react/jsx-runtime");
 function Login({
   flow,
@@ -2070,20 +2196,20 @@ function Login({
 }) {
   const components = getOryComponents(flowOverrideComponents);
   return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
-    import_elements_react15.OryProvider,
+    import_elements_react16.OryProvider,
     {
       config,
       flow,
-      flowType: import_client_fetch10.FlowType.Login,
+      flowType: import_client_fetch11.FlowType.Login,
       components,
-      children: children != null ? children : /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_elements_react15.OryTwoStepCard, {})
+      children: children != null ? children : /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_elements_react16.OryTwoStepCard, {})
     }
   );
 }
 
 // src/theme/default/flows/recovery.tsx
-var import_client_fetch11 = require("@ory/client-fetch");
-var import_elements_react16 = require("@ory/elements-react");
+var import_client_fetch12 = require("@ory/client-fetch");
+var import_elements_react17 = require("@ory/elements-react");
 var import_jsx_runtime64 = require("react/jsx-runtime");
 function Recovery({
   flow,
@@ -2093,20 +2219,20 @@ function Recovery({
 }) {
   const components = getOryComponents(flowOverrideComponents);
   return /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
-    import_elements_react16.OryProvider,
+    import_elements_react17.OryProvider,
     {
       config,
       flow,
-      flowType: import_client_fetch11.FlowType.Recovery,
+      flowType: import_client_fetch12.FlowType.Recovery,
       components,
-      children: children != null ? children : /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(import_elements_react16.OryTwoStepCard, {})
+      children: children != null ? children : /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(import_elements_react17.OryTwoStepCard, {})
     }
   );
 }
 
 // src/theme/default/flows/registration.tsx
-var import_client_fetch12 = require("@ory/client-fetch");
-var import_elements_react17 = require("@ory/elements-react");
+var import_client_fetch13 = require("@ory/client-fetch");
+var import_elements_react18 = require("@ory/elements-react");
 var import_jsx_runtime65 = require("react/jsx-runtime");
 function Registration({
   flow,
@@ -2116,20 +2242,20 @@ function Registration({
 }) {
   const components = getOryComponents(flowOverrideComponents);
   return /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
-    import_elements_react17.OryProvider,
+    import_elements_react18.OryProvider,
     {
       config,
       flow,
-      flowType: import_client_fetch12.FlowType.Registration,
+      flowType: import_client_fetch13.FlowType.Registration,
       components,
-      children: children != null ? children : /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(import_elements_react17.OryTwoStepCard, {})
+      children: children != null ? children : /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(import_elements_react18.OryTwoStepCard, {})
     }
   );
 }
 
 // src/theme/default/flows/settings.tsx
-var import_client_fetch13 = require("@ory/client-fetch");
-var import_elements_react18 = require("@ory/elements-react");
+var import_client_fetch14 = require("@ory/client-fetch");
+var import_elements_react19 = require("@ory/elements-react");
 var import_jsx_runtime66 = require("react/jsx-runtime");
 function Settings({
   flow,
@@ -2139,23 +2265,23 @@ function Settings({
 }) {
   const components = getOryComponents(flowOverrideComponents);
   return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
-    import_elements_react18.OryProvider,
+    import_elements_react19.OryProvider,
     {
       config,
       flow,
-      flowType: import_client_fetch13.FlowType.Settings,
+      flowType: import_client_fetch14.FlowType.Settings,
       components,
       children: children != null ? children : /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(import_jsx_runtime66.Fragment, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(import_elements_react18.HeadlessPageHeader, {}),
-        /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(import_elements_react18.OrySettingsCard, {})
+        /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(import_elements_react19.HeadlessPageHeader, {}),
+        /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(import_elements_react19.OrySettingsCard, {})
       ] })
     }
   );
 }
 
 // src/theme/default/flows/verification.tsx
-var import_client_fetch14 = require("@ory/client-fetch");
-var import_elements_react19 = require("@ory/elements-react");
+var import_client_fetch15 = require("@ory/client-fetch");
+var import_elements_react20 = require("@ory/elements-react");
 var import_jsx_runtime67 = require("react/jsx-runtime");
 function Verification({
   flow,
@@ -2165,13 +2291,13 @@ function Verification({
 }) {
   const components = getOryComponents(flowOverrideComponents);
   return /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
-    import_elements_react19.OryProvider,
+    import_elements_react20.OryProvider,
     {
       config,
       flow,
-      flowType: import_client_fetch14.FlowType.Verification,
+      flowType: import_client_fetch15.FlowType.Verification,
       components,
-      children: children != null ? children : /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(import_elements_react19.OryTwoStepCard, {})
+      children: children != null ? children : /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(import_elements_react20.OryTwoStepCard, {})
     }
   );
 }
@@ -2182,6 +2308,7 @@ function Verification({
   DefaultCardFooter,
   DefaultCardHeader,
   DefaultCardLogo,
+  DefaultCurrentIdentifierButton,
   DefaultFormContainer,
   DefaultMessage,
   DefaultMessageContainer,