@ory/elements-react 1.0.0-next.40 → 1.0.0-next.43

package/dist/theme/default/index.mjs

@@ -41,7 +41,6 @@ function DefaultCardContent({ children }) {
 // src/theme/default/components/card/footer.tsx
 import { FlowType } from "@ory/client-fetch";
 import { useComponents, useOryFlow } from "@ory/elements-react";
-import { useFormContext } from "react-hook-form";
 import { useIntl } from "react-intl";
 
 // src/theme/default/utils/url.ts
@@ -89,6 +88,10 @@ function appendRefresh(url, refresh) {
 }
 
 // src/util/ui/index.ts
+import {
+  isUiNodeInputAttributes as isUiNodeInputAttributes2,
+  isUiNodeScriptAttributes
+} from "@ory/client-fetch";
 import { UiNodeGroupEnum as UiNodeGroupEnum2 } from "@ory/client-fetch";
 import { useMemo } from "react";
 
@@ -146,6 +149,13 @@ var findNode = (nodes, opt) => nodes.find((n) => {
   return n.attributes.node_type === opt.node_type && (opt.group instanceof RegExp ? n.group.match(opt.group) : n.group === opt.group) && (opt.name && n.attributes.node_type === "input" ? opt.name instanceof RegExp ? n.attributes.name.match(opt.name) : n.attributes.name === opt.name : !opt.name);
 });
 
+// src/util/nodes.ts
+function findScreenSelectionButton(nodes) {
+  return nodes.find(
+    (node) => node.attributes.node_type === "input" && node.attributes.type === "submit" && node.attributes.name === "screen"
+  );
+}
+
 // src/theme/default/components/card/footer.tsx
 import { Fragment, jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
 function DefaultCardFooter() {
@@ -239,60 +249,45 @@ 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 = useIntl();
   const { config, flow, formState } = useOryFlow();
-  const { setValue } = useFormContext();
-  if (formState.current === "select_method") {
-    return null;
-  }
   const screenSelectionNode = findScreenSelectionButton(flow.ui.nodes);
-  function handleScreenSelection() {
-    setValue("method", "profile");
-    if (screenSelectionNode) {
-      setValue(
-        screenSelectionNode.attributes.name,
-        screenSelectionNode.attributes.value
-      );
-    }
+  switch (formState.current) {
+    case "method_active":
+      return /* @__PURE__ */ jsx5("span", { className: "font-normal leading-normal antialiased", children: screenSelectionNode && /* @__PURE__ */ jsx5(
+        "a",
+        {
+          className: "font-medium text-button-link-brand-brand hover:text-button-link-brand-brand-hover",
+          href: "",
+          children: intl.formatMessage({
+            id: "card.footer.select-another-method",
+            defaultMessage: "Select another method"
+          })
+        }
+      ) });
+    case "select_method":
+    default:
+      return /* @__PURE__ */ jsxs4("span", { className: "font-normal leading-normal antialiased", children: [
+        intl.formatMessage({
+          id: "registration.login-label",
+          defaultMessage: "Already have an account?"
+        }),
+        " ",
+        /* @__PURE__ */ jsx5(
+          "a",
+          {
+            className: "text-button-link-brand-brand transition-colors hover:text-button-link-brand-brand-hover underline",
+            href: initFlowUrl(config.sdk.url, "login", flow),
+            "data-testid": "ory/screen/registration/action/login",
+            children: intl.formatMessage({
+              id: "registration.login-button",
+              defaultMessage: "Sign in"
+            })
+          }
+        )
+      ] });
   }
-  return /* @__PURE__ */ jsx5("span", { className: "font-normal leading-normal antialiased", children: formState.current === "method_active" ? /* @__PURE__ */ jsx5(Fragment, { children: screenSelectionNode && /* @__PURE__ */ jsx5(
-    "button",
-    {
-      className: "font-medium text-button-link-brand-brand hover:text-button-link-brand-brand-hover",
-      type: "submit",
-      name: screenSelectionNode.attributes.name,
-      value: screenSelectionNode.attributes.value,
-      onClick: handleScreenSelection,
-      children: intl.formatMessage({
-        id: "card.footer.select-another-method",
-        defaultMessage: "Select another method"
-      })
-    }
-  ) }) : /* @__PURE__ */ jsxs4(Fragment, { children: [
-    intl.formatMessage({
-      id: "registration.login-label",
-      defaultMessage: "Already have an account?"
-    }),
-    " ",
-    /* @__PURE__ */ jsx5(
-      "a",
-      {
-        className: "text-button-link-brand-brand transition-colors hover:text-button-link-brand-brand-hover underline",
-        href: initFlowUrl(config.sdk.url, "login", flow),
-        "data-testid": "ory/screen/registration/action/login",
-        children: intl.formatMessage({
-          id: "registration.login-button",
-          defaultMessage: "Sign in"
-        })
-      }
-    )
-  ] }) });
 }
 function RecoveryCardFooter() {
   return null;
@@ -352,7 +347,7 @@ import { useComponents as useComponents2, useOryFlow as useOryFlow3 } from "@ory
 // src/theme/default/utils/constructCardHeader.ts
 import {
   FlowType as FlowType2,
-  isUiNodeInputAttributes as isUiNodeInputAttributes2
+  isUiNodeInputAttributes as isUiNodeInputAttributes3
 } from "@ory/client-fetch";
 import { useIntl as useIntl2 } from "react-intl";
 function joinWithCommaOr(list, orText = "or") {
@@ -480,7 +475,7 @@ function useCardHeaderText(container, opts) {
   }
   if (nodes.find((node) => node.group === "identifier_first")) {
     const identifier = nodes.find(
-      (node) => isUiNodeInputAttributes2(node.attributes) && node.attributes.name.startsWith("identifier") && node.attributes.type !== "hidden"
+      (node) => isUiNodeInputAttributes3(node.attributes) && node.attributes.name.startsWith("identifier") && node.attributes.type !== "hidden"
     );
     if (identifier) {
       parts.push(
@@ -581,7 +576,10 @@ function useCardHeaderText(container, opts) {
 }
 
 // src/theme/default/components/card/current-identifier-button.tsx
-import { FlowType as FlowType3 } from "@ory/client-fetch";
+import {
+  FlowType as FlowType3,
+  isUiNodeInputAttributes as isUiNodeInputAttributes4
+} from "@ory/client-fetch";
 import { useOryFlow as useOryFlow2 } from "@ory/elements-react";
 
 // src/theme/default/assets/icons/arrow-left.svg
@@ -603,9 +601,11 @@ function omit(obj, keys) {
 }
 
 // src/theme/default/components/card/current-identifier-button.tsx
+import { useFormContext } from "react-hook-form";
 import { jsx as jsx7, jsxs as jsxs5 } from "react/jsx-runtime";
 function DefaultCurrentIdentifierButton() {
   const { flow, flowType, config, formState } = useOryFlow2();
+  const { setValue } = useFormContext();
   const ui = flow.ui;
   if (formState.current === "provide_identifier") {
     return null;
@@ -613,26 +613,78 @@ function DefaultCurrentIdentifierButton() {
   if (flowType === FlowType3.Login && flow.requested_aal === "aal2") {
     return null;
   }
-  const nodeBackButton = getBackButtonNode(flowType, ui.nodes);
-  if ((nodeBackButton == null ? void 0 : nodeBackButton.attributes.node_type) !== "input" || !nodeBackButton.attributes.value) {
+  const nodeBackButton = getBackButtonNodeAttributes(flowType, ui.nodes);
+  if (!nodeBackButton) {
     return null;
   }
   const initFlowUrl2 = restartFlowUrl(
     flow,
     `${config.sdk.url}/self-service/${flowType}/browser`
   );
-  const attributes = omit(nodeBackButton.attributes, [
+  const attributes = omit(nodeBackButton, [
     "autocomplete",
     "node_type",
     "maxlength"
   ]);
+  const screenSelectionNode = findScreenSelectionButton(flow.ui.nodes);
+  if (screenSelectionNode) {
+    return /* @__PURE__ */ jsxs5("form", { action: flow.ui.action, method: flow.ui.method, children: [
+      flow.ui.nodes.filter((n) => {
+        if (isUiNodeInputAttributes4(n.attributes)) {
+          return n.attributes.type === "hidden";
+        }
+        return false;
+      }).map((n) => {
+        const attrs = n.attributes;
+        return /* @__PURE__ */ jsx7(
+          "input",
+          {
+            type: "hidden",
+            name: attrs.name,
+            value: attrs.value
+          },
+          attrs.name
+        );
+      }),
+      /* @__PURE__ */ jsx7(
+        "button",
+        {
+          className: "group inline-flex max-w-full cursor-pointer items-center gap-1 self-start rounded-identifier border px-[11px] py-[5px] transition-colors border-button-identifier-border-border-default bg-button-identifier-background-default hover:border-button-identifier-border-border-hover hover:bg-button-identifier-background-hover",
+          ...attributes,
+          type: "submit",
+          onClick: () => {
+            setValue(
+              screenSelectionNode.attributes.name,
+              screenSelectionNode.attributes.value
+            );
+            setValue("method", "profile");
+          },
+          name: screenSelectionNode.attributes.name,
+          value: screenSelectionNode.attributes.value,
+          title: `Adjust ${nodeBackButton == null ? void 0 : nodeBackButton.value}`,
+          "data-testid": "ory/screen/login/action/restart",
+          children: /* @__PURE__ */ jsxs5("span", { className: "inline-flex min-h-5 items-center gap-2 overflow-hidden text-ellipsis", children: [
+            /* @__PURE__ */ jsx7(
+              arrow_left_default,
+              {
+                size: 16,
+                stroke: "1",
+                className: "shrink-0 text-button-identifier-foreground-default group-hover:text-button-identifier-foreground-hover"
+              }
+            ),
+            /* @__PURE__ */ jsx7("span", { className: "overflow-hidden text-ellipsis text-nowrap text-sm font-medium text-button-identifier-foreground-default group-hover:text-button-identifier-foreground-hover", children: nodeBackButton == null ? void 0 : nodeBackButton.value })
+          ] })
+        }
+      )
+    ] });
+  }
   return /* @__PURE__ */ jsx7(
     "a",
     {
       className: "group inline-flex max-w-full cursor-pointer items-center gap-1 self-start rounded-identifier border px-[11px] py-[5px] transition-colors border-button-identifier-border-border-default bg-button-identifier-background-default hover:border-button-identifier-border-border-hover hover:bg-button-identifier-background-hover",
       ...attributes,
       href: initFlowUrl2,
-      title: `Adjust ${nodeBackButton == null ? void 0 : nodeBackButton.attributes.value}`,
+      title: `Adjust ${nodeBackButton == null ? void 0 : nodeBackButton.value}`,
       "data-testid": "ory/screen/login/action/restart",
       children: /* @__PURE__ */ jsxs5("span", { className: "inline-flex min-h-5 items-center gap-2 overflow-hidden text-ellipsis", children: [
         /* @__PURE__ */ jsx7(
@@ -643,30 +695,34 @@ function DefaultCurrentIdentifierButton() {
             className: "shrink-0 text-button-identifier-foreground-default group-hover:text-button-identifier-foreground-hover"
           }
         ),
-        /* @__PURE__ */ jsx7("span", { className: "overflow-hidden text-ellipsis text-nowrap text-sm font-medium text-button-identifier-foreground-default group-hover:text-button-identifier-foreground-hover", children: nodeBackButton == null ? void 0 : nodeBackButton.attributes.value })
+        /* @__PURE__ */ jsx7("span", { className: "overflow-hidden text-ellipsis text-nowrap text-sm font-medium text-button-identifier-foreground-default group-hover:text-button-identifier-foreground-hover", children: nodeBackButton == null ? void 0 : nodeBackButton.value })
       ] })
     }
   );
 }
-function getBackButtonNode(flowType, nodes) {
-  let nodeBackButton;
+function getBackButtonNodeAttributes(flowType, nodes) {
+  var _a, _b;
+  let nodeBackButtonAttributes;
   switch (flowType) {
     case FlowType3.Login:
-      nodeBackButton = nodes.find(
-        (node) => "name" in node.attributes && node.attributes.name === "identifier" && ["default", "identifier_first"].includes(node.group)
-      );
+      nodeBackButtonAttributes = (_a = nodes.find(
+        (node) => isUiNodeInputAttributes4(node.attributes) && node.attributes.name === "identifier" && ["default", "identifier_first"].includes(node.group)
+      )) == null ? void 0 : _a.attributes;
       break;
     case FlowType3.Registration:
-      nodeBackButton = guessRegistrationBackButton(nodes);
+      nodeBackButtonAttributes = guessRegistrationBackButton(nodes);
       break;
     case FlowType3.Recovery:
     case FlowType3.Verification:
-      nodeBackButton = nodes.find(
-        (n) => "name" in n.attributes && n.attributes.name === "email"
-      );
+      nodeBackButtonAttributes = (_b = nodes.find(
+        (n) => isUiNodeInputAttributes4(n.attributes) && n.attributes.name === "email"
+      )) == null ? void 0 : _b.attributes;
       break;
   }
-  return nodeBackButton;
+  if ((nodeBackButtonAttributes == null ? void 0 : nodeBackButtonAttributes.node_type) !== "input" || !(nodeBackButtonAttributes == null ? void 0 : nodeBackButtonAttributes.value)) {
+    return void 0;
+  }
+  return nodeBackButtonAttributes;
 }
 var backButtonCandiates = [
   "traits.email",
@@ -674,9 +730,10 @@ var backButtonCandiates = [
   "traits.phone_number"
 ];
 function guessRegistrationBackButton(uiNodes) {
-  return uiNodes.find(
-    (node) => "name" in node.attributes && backButtonCandiates.includes(node.attributes.name) && node.group === "default"
-  );
+  var _a;
+  return (_a = uiNodes.find(
+    (node) => isUiNodeInputAttributes4(node.attributes) && backButtonCandiates.includes(node.attributes.name) && node.group === "default"
+  )) == null ? void 0 : _a.attributes;
 }
 
 // src/theme/default/components/card/header.tsx
@@ -1024,6 +1081,7 @@ function DefaultButtonSocial({
       setClicked(false);
     }
   }, [isSubmitting, setClicked]);
+  const label = node.meta.label ? uiTextToFormattedMessage(node.meta.label, intl) : "";
   return /* @__PURE__ */ jsxs19(
     "button",
     {
@@ -1036,10 +1094,11 @@ function DefaultButtonSocial({
       onClick: localOnClick,
       "data-loading": clicked,
       disabled: isSubmitting,
+      "aria-label": label,
       children: [
         /* @__PURE__ */ jsx27("span", { className: "size-5 relative", children: !clicked ? Logo ? /* @__PURE__ */ jsx27(Logo, { size: 20 }) : /* @__PURE__ */ jsx27("span", { className: "flex aspect-square items-center justify-center rounded-[999px] border text-xs", children: provider.slice(0, 2) }) : /* @__PURE__ */ jsx27(Spinner, { className: "size-5" }) }),
         showLabel && node.meta.label ? /* @__PURE__ */ jsxs19(Fragment2, { children: [
-          /* @__PURE__ */ jsx27("span", { className: "grow text-center font-medium leading-none text-button-social-foreground-default", children: uiTextToFormattedMessage(node.meta.label, intl) }),
+          /* @__PURE__ */ jsx27("span", { className: "grow text-center font-medium leading-none text-button-social-foreground-default", children: label }),
           /* @__PURE__ */ jsx27("span", { className: "size-5 block" })
         ] }) : null
       ]
@@ -1543,9 +1602,26 @@ var DefaultCheckbox = ({
 // src/theme/default/components/form/group-container.tsx
 import { useOryFlow as useOryFlow7 } from "@ory/elements-react";
 import { FlowType as FlowType5 } from "@ory/client-fetch";
+
+// src/util/childCounter.ts
+import { Children, isValidElement } from "react";
+function countRenderableChildren(children) {
+  return Children.toArray(children).filter((c) => {
+    if (isValidElement(c)) {
+      return true;
+    }
+    return false;
+  }).length;
+}
+
+// src/theme/default/components/form/group-container.tsx
 import { jsx as jsx40 } from "react/jsx-runtime";
 function DefaultGroupContainer({ children }) {
   const { flowType } = useOryFlow7();
+  const count = countRenderableChildren(children);
+  if (count === 0) {
+    return null;
+  }
   return /* @__PURE__ */ jsx40(
     "div",
     {
@@ -1566,8 +1642,9 @@ function DefaultHorizontalDivider() {
 
 // src/theme/default/components/form/image.tsx
 import { jsx as jsx42 } from "react/jsx-runtime";
-function DefaultImage({ attributes }) {
-  return /* @__PURE__ */ jsx42("figure", { children: /* @__PURE__ */ jsx42("img", { ...attributes }) });
+function DefaultImage({ attributes, node }) {
+  var _a;
+  return /* @__PURE__ */ jsx42("figure", { children: /* @__PURE__ */ jsx42("img", { ...attributes, alt: ((_a = node.meta.label) == null ? void 0 : _a.text) || "" }) });
 }
 
 // src/theme/default/components/form/input.tsx
@@ -1699,6 +1776,7 @@ function PasswordToggle({
       onClick: handleClick,
       className: "absolute right-0 h-full w-12 flex items-center justify-center",
       type: "button",
+      "aria-label": "Toggle password visibility",
       children: shown ? /* @__PURE__ */ jsx45(eye_off_default, {}) : /* @__PURE__ */ jsx45(eye_default, {})
     }
   );
@@ -2176,7 +2254,7 @@ var UserMenu = ({ session }) => {
   const initials = getUserInitials(session);
   const logoutFlow = useClientLogout(config);
   return /* @__PURE__ */ jsxs30(DropdownMenu, { children: [
-    /* @__PURE__ */ jsx57(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsx57(UserAvatar, { initials }) }),
+    /* @__PURE__ */ jsx57(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsx57(UserAvatar, { initials, title: "User Menu" }) }),
     /* @__PURE__ */ jsxs30(DropdownMenuContent, { children: [
       /* @__PURE__ */ jsxs30(DropdownMenuLabel2, { className: "flex gap-3 px-5 py-4.5", children: [
         /* @__PURE__ */ jsx57(UserAvatar, { disabled: true, initials }),
@@ -2715,7 +2793,7 @@ function DefaultAuthMethodListContainer({
 }
 
 // src/theme/default/components/form/captcha.tsx
-import { isUiNodeInputAttributes as isUiNodeInputAttributes3 } from "@ory/client-fetch";
+import { isUiNodeInputAttributes as isUiNodeInputAttributes5 } from "@ory/client-fetch";
 import { Turnstile } from "@marsidev/react-turnstile";
 import { useRef as useRef2 } from "react";
 import { useFormContext as useFormContext13 } from "react-hook-form";
@@ -2724,14 +2802,14 @@ var DefaultCaptcha = ({ node }) => {
   const { setValue } = useFormContext13();
   const ref = useRef2();
   const nodes = [];
-  if (isUiNodeInputAttributes3(node.attributes)) {
+  if (isUiNodeInputAttributes5(node.attributes)) {
     if (node.attributes.name === "transient_payload.captcha_turnstile_response") {
       nodes.push(
         /* @__PURE__ */ jsx70(DefaultInput, { node, attributes: node.attributes }, 1)
       );
     }
   }
-  if (isUiNodeInputAttributes3(node.attributes) && node.attributes.name === "captcha_turnstile_options") {
+  if (isUiNodeInputAttributes5(node.attributes) && node.attributes.name === "captcha_turnstile_options") {
     const options = JSON.parse(node.attributes.value);
     nodes.push(
       /* @__PURE__ */ jsx70(
@@ -2924,10 +3002,10 @@ import { UiNodeGroupEnum as UiNodeGroupEnum6 } from "@ory/client-fetch";
 import { FormProvider, useForm } from "react-hook-form";
 
 // src/components/form/form-helpers.ts
-import { isUiNodeInputAttributes as isUiNodeInputAttributes4 } from "@ory/client-fetch";
+import { isUiNodeInputAttributes as isUiNodeInputAttributes6 } from "@ory/client-fetch";
 
 // src/components/form/form-resolver.ts
-import { isUiNodeInputAttributes as isUiNodeInputAttributes5 } from "@ory/client-fetch";
+import { isUiNodeInputAttributes as isUiNodeInputAttributes7 } from "@ory/client-fetch";
 
 // src/components/form/form-provider.tsx
 import { jsx as jsx78 } from "react/jsx-runtime";
@@ -2943,8 +3021,8 @@ import { jsx as jsx81 } from "react/jsx-runtime";
 
 // src/components/card/card-two-step.tsx
 import {
-  isUiNodeInputAttributes as isUiNodeInputAttributes8,
-  isUiNodeScriptAttributes as isUiNodeScriptAttributes3,
+  isUiNodeInputAttributes as isUiNodeInputAttributes10,
+  isUiNodeScriptAttributes as isUiNodeScriptAttributes4,
   UiNodeGroupEnum as UiNodeGroupEnum11,
   UiNodeInputAttributesTypeEnum as UiNodeInputAttributesTypeEnum2
 } from "@ory/client-fetch";
@@ -2955,8 +3033,8 @@ import {
   FlowType as FlowType17,
   isUiNodeAnchorAttributes,
   isUiNodeImageAttributes,
-  isUiNodeInputAttributes as isUiNodeInputAttributes6,
-  isUiNodeScriptAttributes
+  isUiNodeInputAttributes as isUiNodeInputAttributes8,
+  isUiNodeScriptAttributes as isUiNodeScriptAttributes2
 } from "@ory/client-fetch";
 import { useFormContext as useFormContext15 } from "react-hook-form";
 import { useIntl as useIntl14 } from "react-intl";
@@ -3028,8 +3106,8 @@ import { jsx as jsx84 } from "react/jsx-runtime";
 import {
   isUiNodeAnchorAttributes as isUiNodeAnchorAttributes2,
   isUiNodeImageAttributes as isUiNodeImageAttributes2,
-  isUiNodeInputAttributes as isUiNodeInputAttributes7,
-  isUiNodeScriptAttributes as isUiNodeScriptAttributes2,
+  isUiNodeInputAttributes as isUiNodeInputAttributes9,
+  isUiNodeScriptAttributes as isUiNodeScriptAttributes3,
   isUiNodeTextAttributes,
   UiNodeGroupEnum as UiNodeGroupEnum9
 } from "@ory/client-fetch";
@@ -3043,7 +3121,7 @@ import { useFormContext as useFormContext17 } from "react-hook-form";
 import { jsx as jsx86 } from "react/jsx-runtime";
 
 // src/components/card/card-two-step.tsx
-import { Fragment as Fragment7, jsx as jsx87, jsxs as jsxs38 } from "react/jsx-runtime";
+import { jsx as jsx87, jsxs as jsxs38 } from "react/jsx-runtime";
 
 // src/components/form/groups.tsx
 import { jsx as jsx88 } from "react/jsx-runtime";
@@ -3063,36 +3141,39 @@ import { jsx as jsx91 } from "react/jsx-runtime";
 import { jsx as jsx92 } from "react/jsx-runtime";
 
 // src/components/settings/settings-card.tsx
-import { UiNodeGroupEnum as UiNodeGroupEnum13 } from "@ory/client-fetch";
+import {
+  isUiNodeScriptAttributes as isUiNodeScriptAttributes5,
+  UiNodeGroupEnum as UiNodeGroupEnum13
+} from "@ory/client-fetch";
 import { useIntl as useIntl20 } from "react-intl";
 
 // src/components/settings/oidc-settings.tsx
 import { useIntl as useIntl15 } from "react-intl";
 import { useFormContext as useFormContext20 } from "react-hook-form";
-import { Fragment as Fragment8, jsx as jsx93, jsxs as jsxs40 } from "react/jsx-runtime";
+import { Fragment as Fragment7, jsx as jsx93, jsxs as jsxs40 } from "react/jsx-runtime";
 
 // src/components/settings/passkey-settings.tsx
 import { useFormContext as useFormContext21 } from "react-hook-form";
 import { useIntl as useIntl16 } from "react-intl";
-import { Fragment as Fragment9, jsx as jsx94, jsxs as jsxs41 } from "react/jsx-runtime";
+import { Fragment as Fragment8, jsx as jsx94, jsxs as jsxs41 } from "react/jsx-runtime";
 
 // src/components/settings/recovery-codes-settings.tsx
 import { useIntl as useIntl17 } from "react-intl";
 import { useFormContext as useFormContext22 } from "react-hook-form";
-import { Fragment as Fragment10, jsx as jsx95, jsxs as jsxs42 } from "react/jsx-runtime";
+import { Fragment as Fragment9, jsx as jsx95, jsxs as jsxs42 } from "react/jsx-runtime";
 
 // src/components/settings/totp-settings.tsx
 import { useFormContext as useFormContext23 } from "react-hook-form";
 import { useIntl as useIntl18 } from "react-intl";
-import { Fragment as Fragment11, jsx as jsx96, jsxs as jsxs43 } from "react/jsx-runtime";
+import { Fragment as Fragment10, jsx as jsx96, jsxs as jsxs43 } from "react/jsx-runtime";
 
 // src/components/settings/webauthn-settings.tsx
 import { useFormContext as useFormContext24 } from "react-hook-form";
 import { useIntl as useIntl19 } from "react-intl";
-import { Fragment as Fragment12, jsx as jsx97, jsxs as jsxs44 } from "react/jsx-runtime";
+import { Fragment as Fragment11, jsx as jsx97, jsxs as jsxs44 } from "react/jsx-runtime";
 
 // src/components/settings/settings-card.tsx
-import { Fragment as Fragment13, jsx as jsx98, jsxs as jsxs45 } from "react/jsx-runtime";
+import { Fragment as Fragment12, jsx as jsx98, jsxs as jsxs45 } from "react/jsx-runtime";
 
 // src/locales/en.json
 var en_default = {
@@ -3547,7 +3628,7 @@ var de_default = {
   "two-step.code.description": "Ein Best\xE4tigungscode wird an Ihre E-Mail gesendet.",
   "two-step.code.title": "E-Mail-Code",
   "two-step.passkey.description": "Verwenden Sie die Fingerabdruck- oder Gesichtserkennung Ihres Ger\xE4ts",
-  "two-step.passkey.title": "Passwort (empfohlen)",
+  "two-step.passkey.title": "Passkey (empfohlen)",
   "two-step.password.description": "Geben Sie Ihr Passwort ein, das mit Ihrem Konto verkn\xFCpft ist",
   "two-step.password.title": "Passwort",
   "two-step.webauthn.title": "Sicherheitsschl\xFCssel",
@@ -5648,7 +5729,7 @@ import {
   OryProvider as OryProvider4,
   OrySettingsCard
 } from "@ory/elements-react";
-import { Fragment as Fragment14, jsx as jsx104, jsxs as jsxs47 } from "react/jsx-runtime";
+import { Fragment as Fragment13, jsx as jsx104, jsxs as jsxs47 } from "react/jsx-runtime";
 function Settings({
   flow,
   config,
@@ -5663,7 +5744,7 @@ function Settings({
       flow,
       flowType: FlowType21.Settings,
       components,
-      children: children != null ? children : /* @__PURE__ */ jsxs47(Fragment14, { children: [
+      children: children != null ? children : /* @__PURE__ */ jsxs47(Fragment13, { children: [
         /* @__PURE__ */ jsx104(HeadlessPageHeader, {}),
         /* @__PURE__ */ jsx104(OrySettingsCard, {})
       ] })